Difference between revisions of "Team:Ionis Paris"

 
(272 intermediate revisions by 5 users not shown)
Line 1: Line 1:
<!DOCTYPE html>
+
{{IONIS_HEADER}} 
<!--[if IE]><![endif]-->
+
<html>  
<!--[if lt IE 7 ]> <html lang="en" class="ie6">    <![endif]-->
+
    <!-- Nos feuilles de style -->
<!--[if IE 7 ]>    <html lang="en" class="ie7">    <![endif]-->
+
     <link rel="stylesheet" type="text/css" href="https://2016.igem.org/Template:IONIS_Paris-style-css-template?action=raw&ctype=text/css" />
<!--[if IE 8 ]>    <html lang="en" class="ie8">    <![endif]-->
+
    <!-- Version minifiée dans le bon ordre de toutes les feuilles de style du template -->
<!--[if IE 9 ]>    <html lang="en" class="ie9">    <![endif]-->
+
    <link rel="stylesheet" type="text/css" href="https://2016.igem.org/Template:IONIS_Paris-style-css?action=raw&ctype=text/css" />
<!--[if (gt IE 9)|!(IE)]><!--><html lang="en"><!--<![endif]-->
+
     <head>
+
        <meta charset="utf-8">
+
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
+
        <meta name="viewport" content="width=device-width, initial-scale=1">
+
        <title>Home Page 5</title>
+
       
+
        <!-- ====Google font==== -->
+
        <link href='https://fonts.googleapis.com/css?family=Merriweather:400,700,700italic,400italic,300italic,300' rel='stylesheet' type='text/css'>
+
       
+
        <!-- ====Open Sans==== -->
+
        <link href='https://fonts.googleapis.com/css?family=Open+Sans:400,600,700,600italic,400italic,700italic,300,300italic' rel='stylesheet' type='text/css'>
+
       
+
        <!-- ====Bootstrap css==== -->
+
        <link rel="stylesheet" href="css/bootstrap.min.css">
+
       
+
        <!-- ====Material==== -->
+
        <link rel="stylesheet" href="css/mdb.min.css">
+
        <link rel="stylesheet" href="css/material-design-iconic-font.min.css">
+
       
+
        <!-- ====Font awesome css==== -->
+
        <link rel="stylesheet" href="css/font-awesome.min.css">
+
       
+
        <!-- ====Animate css==== -->
+
        <link rel="stylesheet" href="css/animate.css">
+
       
+
        <!-- ====Meanmenu css==== -->
+
        <link rel="stylesheet" href="css/meanmenu.min.css">
+
       
+
        <!-- ====VenoBox css==== -->
+
        <link rel="stylesheet" href="css/venobox.css">
+
       
+
        <!-- ====Owl carousel 2 css==== -->
+
        <link rel="stylesheet" href="css/owl.carousel.css">
+
       
+
        <!-- ====Custom css==== -->
+
        <link rel="stylesheet" href="style.css">
+
       
+
        <!-- ====Favicons==== -->
+
        <link rel="apple-touch-icon-precomposed" href="img/favicon_app.png">
+
        <link rel="shortcut icon" type="image/png" href="img/favicon.png"/>
+
  
        <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
+
    <!-- ====HEADER PARALUX==== -->
        <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
+
    <section id="ancre" class="header_paralux" style="background: url('https://static.igem.org/mediawiki/2016/8/88/HOME.jpg');  background-size: cover;
        <!--[if lt IE 9]>
+
    background-repeat: no-repeat;
          <script src="js/html5shiv.min.js"></script>
+
     position: relative;
          <script src="js/respond.min.js"></script>
+
     background-attachment: fixed;">
        <![endif]-->
+
        <div class="container">
     </head>
+
            <div class="row">
      
+
                <div class="col-md-12">
    <body class="home-5 onepage" id="body">
+
                    <div class="dtable">
        <!-- ==== PRELOADER START==== -->
+
                        <div class="dcell">
        <div class="preloader-area">
+
                            <div class="page_down text-center">
            <div class="preloader">
+
                                <a href="#quantifly" class="go-down">
                <div class="loader">
+
                                    <i class="zmdi zmdi-long-arrow-down testi_prev"></i>
                    <div class="loader-inner pacman">
+
                                </a>
                        <div></div>
+
                            </div>
                        <div></div>
+
                         </div>
                        <div></div>
+
                         <div></div>
+
                        <div></div>
+
 
                     </div>
 
                     </div>
 
                 </div>
 
                 </div>
 
             </div>
 
             </div>
 
         </div>
 
         </div>
        <!-- ====PRELOADER END==== -->
+
    </section>
       
+
    <!-- ====HEADER PARALUX END==== -->
        <!-- ====HEADER START==== -->
+
 
        <header class="header_area navbar hidden-xs">
+
    <!-- ====FEATURE AERE==== -->
            <div class="container-fluid">
+
    <!--  <section class="feature_area" >
                <div class="row top_menu_area">
+
          <div class="container">
                    <div class="col-xs-12 col-sm-3">
+
              <div class="row fix_m">
                        <!-- START LOGO AREA -->
+
                  <div class="col-xs-12 col-sm-6 col-md-3 fix_p">
                        <div class="logo_area">
+
                      <div class="single_feature text-center">
                            <a href="index.html">
+
                          <i class="zmdi zmdi-devices"></i>
                                <img src="img/igem_logo.svg" alt="theme logo" class="main_logo svg">
+
                          <h4>Branding</h4>
                            </a>
+
                          <div class="single_cap">
                        </div>
+
                          <p>As a business owner or manager, the decision to opt faor offshore software can be difficult.</p>
                        <!-- END LOGO AREA -->
+
                          <a class="th_bt btn waves-effect" href="#!">Read More</a>
                    </div>
+
                          </div>
                    <div class="col-xs-12 col-sm-9">
+
                      </div>
                        <!-- START MENU AREA -->
+
                  </div>
                        <nav class="navbar-collapse collapse in">
+
                  <div class="col-xs-12 col-sm-6 col-md-3 fix_p">
                            <ul class="nav navbar-nav navbar-right menu">
+
                      <div class="single_feature text-center">
                                <li class="smoth-scroll active">
+
                          <i class="zmdi zmdi-globe-alt"></i>
                                    <a data-hover="Project" href="#body">Project</a>
+
                          <h4>Web Development</h4>
                                    <ul class="sub_menu">
+
                          <div class="single_cap">
                                        <li class="waves-effect waves">
+
                          <p>As a bu siness owner or manager, the decision to opt faor offshore software can be difficult.</p>
                                            <a href="index.html">Home Page 1</a>
+
                          <a class="th_bt btn waves-effect" href="#!">Read More</a>
                                        </li>
+
                          </div>
                                        <li class="waves-effect waves">
+
                      </div>
                                            <a href="index-2.html">Home Page 2</a>
+
                  </div>
                                        </li>
+
                  <div class="col-xs-12 col-sm-6 col-md-3 fix_p">
                                        <li class="waves-effect waves">
+
                      <div class="single_feature text-center">
                                            <a href="index-3.html">Home Page 3</a>
+
                          <i class="zmdi zmdi-apple"></i>
                                        </li>
+
                          <h4>Mobile Application</h4>
                                        <li class="waves-effect waves">
+
                          <div class="single_cap">
                                            <a href="index-4.html">Home Page 4</a>
+
                          <p>As a bu siness owner or manager, the decision to opt faor offshore software can be difficult.</p>
                                        </li>
+
                          <a class="th_bt btn waves-effect" href="#!">Read More</a>
                                        <li class="waves-effect waves">
+
                          </div>
                                            <a href="index-5.html">Home Page 5</a>
+
                      </div>
                                        </li>
+
                  </div>
                                        <li class="waves-effect waves">
+
                  <div class="col-xs-12 col-sm-6 col-md-3 fix_p">
                                            <a href="index-6.html">Home Page 6</a>
+
                      <div class="single_feature text-center">
                                        </li>
+
                          <i class="zmdi zmdi-camera"></i>
                                        <li class="waves-effect waves">
+
                          <h4>Photography</h4>
                                            <a href="index-7.html">Home Page 7</a>
+
                          <div class="single_cap">
                                        </li>
+
                          <p>As a bu siness owner or manager, the decision to opt faor offshore software can be difficult.</p>
                                        <li class="waves-effect waves">
+
                          <a class="th_bt btn waves-effect" href="#!">Read More</a>
                                            <a href="index-8.html">Home Page 8</a>
+
                          </div>
                                        </li>
+
                      </div>
                                        <li class="waves-effect waves">
+
                  </div>
                                            <a href="index-9.html">Home Page 9</a>
+
              </div>
                                        </li>
+
          </div>
                                    </ul>
+
      </section> -->
                                </li>
+
    <!-- ====FEATURE AERE END==== -->
                                <li class="smoth-scroll">
+
 
                                    <a data-hover="Services" href="#services">Services</a>
+
    <!-- ====ABOUT US==== -->
                                </li>
+
    <section id="about" class="about_area section-padding">
                                <li class="smoth-scroll">
+
        <div class="container">
                                    <a data-hover="At the lab" href="#about">At the lab</a>
+
            <div class="row">
                                </li>
+
                <div class="col-xs-12">
                                <li class="smoth-scroll">
+
                    <div class="section_title mb80">
                                    <a data-hover="Results" href="#Portfolio">Results</a>
+
                        <h5 id="qantifly" class="smallHd text-center">What is
                                    <ul class="sub_menu">
+
                        </h5>
                                        <li class="waves-effect waves">
+
                        <h2 class="secHd text-center">Quantifly ?</h2>
                                            <a href="protfolio-1.html">Protfolio 1</a>
+
                                        </li>
+
                                        <li class="waves-effect waves">
+
                                            <a href="protfolio-2.html">Protfolio 2</a>
+
                                        </li>
+
                                        <li class="waves-effect waves">
+
                                            <a href="protfolio-3.html">Protfolio 3</a>
+
                                        </li>
+
                                        <li class="waves-effect waves">
+
                                            <a href="case_study.html">Human Practise</a>
+
                                        </li>
+
                                    </ul>
+
                                </li>
+
                                <li class="smoth-scroll">
+
                                    <a data-hover="Case Studies" href="#blog">Case studies</a>
+
                                    <ul class="sub_menu">
+
                                        <li class="waves-effect waves">
+
                                            <a href="blog_grid.html">Blog Grid</a>
+
                                        </li>
+
                                        <li class="waves-effect waves">
+
                                            <a href="blog-left_sidebar.html">Blog Left Sidebar</a>
+
                                        </li>
+
                                        <li class="waves-effect waves">
+
                                            <a href="blog-right_sidebar.html">Blog Right Sidebar</a>
+
                                        </li>
+
                                        <li class="waves-effect waves">
+
                                            <a href="single_blog-full.html">Single Blog Full</a>
+
                                        </li>
+
                                        <li class="waves-effect waves">
+
                                          <a href="single_blog-left_sidebar.html">
+
                                                Single Blog Left Sidebar
+
                                            </a>
+
                                        </li>
+
                                        <li class="waves-effect waves">
+
                                            <a href="single_blog-right_sidebar.html">
+
                                                Single Blog Right Sidebar
+
                                            </a>
+
                                        </li>
+
                                    </ul>
+
                                </li>
+
                                <li class="smoth-scroll">
+
                                    <a data-hover="Team" href="#contact">Team</a>
+
                                </li>
+
                            </ul>
+
                        </nav>
+
                        <!-- END MENU AREA -->
+
                       
+
                        <!-- Mobile Menu Start -->
+
                        <nav class="mobile_menu hidden">
+
                            <ul>
+
                                <li class="smoth-scroll">
+
                                    <a href="#body">Home</a>
+
                                    <ul>
+
                                        <li>
+
                                            <a href="index.html">Home Page 1</a>
+
                                        </li>
+
                                        <li>
+
                                            <a href="index-2.html">Home Page 2</a>
+
                                        </li>
+
                                        <li>
+
                                            <a href="index-3.html">Home Page 3</a>
+
                                        </li>
+
                                        <li>
+
                                            <a href="index-4.html">Home Page 4</a>
+
                                        </li>
+
                                        <li>
+
                                            <a href="index-5.html">Home Page 5</a>
+
                                        </li>
+
                                        <li>
+
                                            <a href="index-6.html">Home Page 6</a>
+
                                        </li>
+
                                        <li>
+
                                            <a href="index-7.html">Home Page 7</a>
+
                                        </li>
+
                                        <li>
+
                                            <a href="index-8.html">Home Page 8</a>
+
                                        </li>
+
                                        <li>
+
                                            <a href="index-9.html">Home Page 9</a>
+
                                        </li>
+
                                    </ul>
+
                                </li>
+
                                <li class="smoth-scroll">
+
                                    <a href="#services">Services</a>
+
                                </li>
+
                                <li class="smoth-scroll">
+
                                    <a href="#about">About</a>
+
                                </li>
+
                                <li class="smoth-scroll">
+
                                    <a href="#Portfolio">Portfolio</a>
+
                                    <ul>
+
                                        <li>
+
                                            <a href="protfolio-1.html">Protfolio 1</a>
+
                                        </li>
+
                                        <li>
+
                                            <a href="protfolio-2.html">Protfolio 2</a>
+
                                        </li>
+
                                        <li>
+
                                            <a href="protfolio-3.html">Protfolio 3</a>
+
                                        </li>
+
                                        <li>
+
                                            <a href="case_study.html">Case Study</a>
+
                                        </li>
+
                                    </ul>
+
                                </li>
+
                                <li class="smoth-scroll">
+
                                    <a href="#blog">Blog</a>
+
                                    <ul>
+
                                        <li>
+
                                            <a href="blog_grid.html">Blog Grid</a>
+
                                        </li>
+
                                        <li>
+
                                            <a href="blog-left_sidebar.html">Blog Left Sidebar</a>
+
                                        </li>
+
                                        <li>
+
                                            <a href="blog-right_sidebar.html">Blog Right Sidebar</a>
+
                                        </li>
+
                                        <li>
+
                                            <a href="single_blog-full.html">Single Blog Full</a>
+
                                        </li>
+
                                        <li>
+
                                          <a href="single_blog-left_sidebar.html">
+
                                                Single Blog Left Sidebar
+
                                            </a>
+
                                        </li>
+
                                        <li>
+
                                            <a href="single_blog-right_sidebar.html">
+
                                                Single Blog Right Sidebar
+
                                            </a>
+
                                        </li>
+
                                    </ul>
+
                                </li>
+
                                <li class="smoth-scroll">
+
                                    <a href="#contact">Contact US</a>
+
                                </li>
+
                            </ul>
+
                        </nav>
+
                        <!-- Mobile Menu End -->
+
 
                     </div>
 
                     </div>
 
                 </div>
 
                 </div>
 
             </div>
 
             </div>
        </header>                       
+
 
        <!-- ====HEADER END==== -->
+
            <div class="col-xs-12 col-sm-6">
       
+
                <div class="about_left">
        <!-- ====HEADER PARALUX==== -->  
+
                    <img src="https://static.igem.org/mediawiki/2016/2/23/Ville.png" alt="" />
        <section class="header_paralux">
+
                 </div>
            <div class="container">
+
            </div>
                 <div class="row">
+
            <div class="col-xs-12 col-sm-6">
                    <div class="col-md-12">
+
                <div class="section_title">
                        <div class="dtable">  
+
                    <h5 class="smallHd">(VOC)</h5>
                            <div class="dcell">  
+
                    <h2 class="secHd">VOLATILE ORGANIC COMPOUNDS</h2>
                                <div class="paralux_content">
+
                </div>
                                    <div class="paralux_text text-center">
+
                <div class="about_text">
                                        <h1> <span></span> </h1>
+
                    <p>Nowadays, Volatile Organic Compounds (VOCs) are commonly found pollutants that have been proven
                                        <p class="colorWh"></p>
+
                        present in a wide variety of everyday life situations. Though they are dangerous and present
                                    </div>
+
                        almost everywhere, VOCs are not efficiently detected. Usual detection devices are very unprecise
                                    <a class="th_bt btn waves-effect waves-light" href="#!">
+
                        or require a very long exposure time.</p>
                                        Learn More<i class="zmdi zmdi-long-arrow-right"></i>
+
 
                                    </a>
+
                </div>
                                </div>
+
            </div>
                                <div class="page_down text-center">
+
        </div>
                                    <a href="#services" class="go-down">
+
        </div>
                                        <i class="zmdi zmdi-long-arrow-down testi_prev"></i>
+
    </section>
                                    </a>
+
    <!-- ====ABOUT US==== -->
                                </div>
+
    <!-- ====ABOUT US==== -->
                            </div>
+
    <section id="about" class="about_area section-padding">
                        </div>  
+
        <div class="container">
 +
            <div class="row">
 +
                <div class="col-xs-12 col-sm-6">
 +
                    <div class="section_title">
 +
                        <h5 class="smallHd">Bacteria</h5>
 +
                        <h2 class="secHd">Biosensor</h2>
 
                     </div>
 
                     </div>
 +
                    <div class="about_text">
 +
                        <p>This is why we developed the Quantifly project : a combination of a bacterial biosensor,
 +
                            perfectly adapted to on-field measurements, and an innovative drone that will allow us to
 +
                            easily and rapidly quantify the amount of VOCs in the air. The biosensor relies on
 +
                            bioluminescence, a biochemical phenomenon that is commonly used in cell imaging. We are
 +
                            trying to develop a new application for bioluminescence that should allow us to create a
 +
                            biosensor of a new kind, entirely different from the existing devices.</p>
 +
                     
 +
                    </div>
 +
                </div>
 +
                <div class="col-xs-12 col-sm-6">
 +
 +
    <div class="about_left">
 +
                    <img src="https://static.igem.org/mediawiki/2016/7/75/T--IONIS_Paris--Biosensor.png" alt="" />
 
                 </div>
 
                 </div>
 +
                </div>
 +
         
 +
 +
 
             </div>
 
             </div>
         </section>
+
         </div>
        <!-- ====HEADER PARALUX END==== -->
+
    </section>
       
+
    <!-- ====ABOUT US==== -->
        <!-- ====FEATURE AERE==== -->  
+
    <!-- ====ABOUT US==== -->
        <section class="feature_area" id="services">
+
    <section id="about" class="about_area section-padding">
            <div class="container">
+
        <div class="container">
                <div class="row fix_m">
+
            <div class="row">
                    <div class="col-xs-12 col-sm-6 col-md-3 fix_p">
+
                <div class="col-xs-12 col-sm-6">
                        <div class="single_feature text-center">
+
                    <div class="about_left">
                            <i class="zmdi zmdi-devices"></i>
+
                        <img src="https://static.igem.org/mediawiki/2016/f/f5/Drone_1.png" alt="drone" />
                            <h4>Branding</h4>
+
                            <div class="single_cap">
+
                            <p>As a bu siness owner or manager, the decision to opt faor offshore software can be difficult.</p>
+
                            <a class="th_bt btn waves-effect" href="#!">Read More</a>
+
                            </div>
+
                        </div>  
+
 
                     </div>
 
                     </div>
                    <div class="col-xs-12 col-sm-6 col-md-3 fix_p">
+
                </div>
                        <div class="single_feature text-center">
+
                <div class="col-xs-12 col-sm-5">
                            <i class="zmdi zmdi-globe-alt"></i>
+
                    <div class="section_title">
                            <h4>Web Development</h4>
+
                        <h5 class="smallHd">Bacteria</h5>
                            <div class="single_cap">
+
                        <h2 class="secHd">Drone</h2>
                            <p>As a bu siness owner or manager, the decision to opt faor offshore software can be difficult.</p>
+
                            <a class="th_bt btn waves-effect" href="#!">Read More</a>
+
                            </div>
+
                        </div>  
+
 
                     </div>
 
                     </div>
                     <div class="col-xs-12 col-sm-6 col-md-3 fix_p">
+
                     <div class="about_text">
                         <div class="single_feature text-center">
+
                         <p>Concerning the drone, it is designed to safely contain our organisms and carry them on the
                            <i class="zmdi zmdi-apple"></i>
+
                             field, thus acting as a mobile detection platform.
                            <h4>Mobile Application</h4>
+
                        </p>
                            <div class="single_cap">
+
 
                            <p>As a bu siness owner or manager, the decision to opt faor offshore software can be difficult.</p>
+
                             <a class="th_bt btn waves-effect" href="#!">Read More</a>
+
                            </div>
+
                        </div> 
+
 
                     </div>
 
                     </div>
                    <div class="col-xs-12 col-sm-6 col-md-3 fix_p">
+
                </div>
                        <div class="single_feature text-center">
+
            </div>
                            <i class="zmdi zmdi-camera"></i>
+
        </div>
                            <h4>Photography</h4>
+
    </section>
                            <div class="single_cap">
+
    <!-- ====ABOUT US==== -->
                            <p>As a bu siness owner or manager, the decision to opt faor offshore software can be difficult.</p>
+
    <!-- ====START SKILL AND VEDIO TABLE==== -->
                            <a class="th_bt btn waves-effect" href="#!">Read More</a>
+
    <section class="skill_and_video">
                            </div>
+
        <div class="video_area">
                         </div>  
+
            <div class="video_control">
 +
                <div class="dtable">
 +
                    <div class="dcell">
 +
                        <a href="https://www.youtube.com/watch?v=G0SF4aWuL4E" data-type="YouTube" id="control"
 +
                          class="btn waves-effect waves-light veno">
 +
                            <i class="zmdi zmdi-play"></i>
 +
                        </a>
 +
                         <h4>Check out the Video</h4>
 
                     </div>
 
                     </div>
 
                 </div>
 
                 </div>
 
             </div>
 
             </div>
         </section>
+
         </div>
         <!-- ====FEATURE AERE END==== -->
+
 
       
+
         <div class="row">
        <!-- ====ABOUT US==== -->
+
        <div class="col-sm-12">
 +
<center><video width="760" height="415"  poster="https://static.igem.org/mediawiki/2015/8/83/Logo_IONIS.png" controls><source src="https://static.igem.org/mediawiki/2016/0/0e/T--Ionis_Paris--QuantiflyProjectVideo.mp4" type='video/mp4'/><a href="https://www.youtube.com/watch?v=G0SF4aWuL4E"><img border="0" src="https://static.igem.org/mediawiki/2015/8/83/Logo_IONIS.png" alt="Click to view on Youtube" width="760" height="415"></a>
 +
<p><font color ="DeepPink">Your browser either does not support HTML5 or cannot handle MediaWiki open video formats. Please consider upgrading your browser, installing the appropriate plugin or switching to a Firefox or Chrome install.</font></p></video></center>
 +
 
 +
            </div>
 +
        </div>
 +
 
 +
 
 +
        </div>
 +
        </div>
 +
        </div>
 +
        </div>
 +
    </section>
 +
    <!-- ====END SKILL AND VEDIO TABLE==== -->
 +
<!-- ====ABOUT US==== -->
 
         <section id="about" class="about_area section-padding">
 
         <section id="about" class="about_area section-padding">
 
             <div class="container">
 
             <div class="container">
Line 359: Line 207:
 
                     <div class="col-xs-12 col-sm-6">
 
                     <div class="col-xs-12 col-sm-6">
 
                         <div class="about_left">
 
                         <div class="about_left">
                             <img src="img/about_left.png" alt=""/>
+
                             <img src="https://static.igem.org/mediawiki/2016/b/ba/Ionis_page_gold_medal.jpg" alt=""/>
 
                         </div>
 
                         </div>
 
                     </div>
 
                     </div>
 
                     <div class="col-xs-12 col-sm-6">
 
                     <div class="col-xs-12 col-sm-6">
 
                         <div class="section_title">
 
                         <div class="section_title">
                             <h5 class="smallHd">Know something</h5>
+
                             <h5 class="smallHd">What we achieved</h5>
                             <h2 class="secHd">About materialAB</h2>
+
                             <h2 class="secHd">About our Successes</h2>
 
                         </div>
 
                         </div>
 
                         <div class="about_text">
 
                         <div class="about_text">
                            <p>RSS, (Really Simple Syndication) has become so popular today and is being referred to by internet users as Pull Technology rather Technology.
+
                        <p class="ab_text">This year, we won a Gold Medal for our Quantifly project and were nominated for the following prizes : «<a href = "https://2016.igem.org/Team:Ionis_Paris/Description"><font color = DeepPink>Best Environmental Project</font></a>» , «<a href = "https://2016.igem.org/Team:Ionis_Paris/Design"><font color = DeepPink>Best Applied Design</font></a>» and «<a href = "https://2016.igem.org/Files/presentation/Ionis_Paris.pdf"><font color = DeepPink>Best Presentation</font></a>».</p>
Utilizing RSS “Pull” technology has become a popular.</p>
+
                             <a class="th_bt btn waves-effect waves-light" href="https://2016.igem.org/Team:Ionis_Paris/Prices">Read More</a>
                          <p class="ab_text">If you’ve followed along and done the steps above, you’ve created a good starting place. You’re going to need to make sure your pages are optimized properly.</p>
+
                             <a class="th_bt btn waves-effect waves-light" href="#!">Read More</a>
+
 
                         </div>
 
                         </div>
 
                     </div>
 
                     </div>
Line 378: Line 224:
 
         </section>
 
         </section>
 
         <!-- ====ABOUT US==== -->
 
         <!-- ====ABOUT US==== -->
       
+
 
        <!-- ====START PROJECT AREA==== -->
+
 
        <section class="project_area section-padding">
+
    <!-- ====START OUR TEAM AREA==== -->
            <div class="container">
+
    <section class="our_team">
                <div class="row">
+
        <div class="container">
                    <div class="col-xs-12 col-sm-6 col-md-3">
+
            <div class="row">
                        <div class="single_fact text-center">
+
                <div class="col-xs-12">
                            <div class="fact_icon">
+
                    <div class="section_title mb80">
                                <div class="RXcircleEffect"></div>
+
                        <h5 class="smallHd text-center">OUR BEST INTER-TEAM
                                <i class="zmdi zmdi-case-check"></i>
+
                        </h5>
                            </div>
+
                        <h2 class="secHd text-center">COLLABORATION</h2>
                            <h2><span class="counter">900</span>+</h2>
+
                            <p>total projects</p>
+
                        </div>
+
 
                     </div>
 
                     </div>
                    <div class="col-xs-12 col-sm-6 col-md-3">
+
                </div>
                         <div class="single_fact text-center">
+
            </div>
                             <div class="fact_icon">
+
            <div class="row team_details_area">
                                 <div class="RXcircleEffect"></div>
+
                <div class="col-xs-12 col-sm-6 fix_p">
                                 <i class="zmdi zmdi-code-smartphone"></i>
+
                    <div class="team_content">
 +
                         <div class="team_cotent_slid">
 +
 
 +
                             <div class="item">
 +
                                 <h1>The European <br>Experience </h1>
 +
                                <h6>In Paris 2/07/2016</h6>
 +
                                <p>The iGEM IONIS team and the iGEM Evry team worked together to accomplish a great gathering of the European teams: an European Jamboree! We organized over a week-end a symposium with more than 150 people that could assist to conferences and expose their projects, and create great network through the iGEM competition. We also wanted to give all European teams the opportunity to live an incredible week-end, by coming to Paris and being able to live the “science dream” in the city of light!
 +
                                </p>
 +
                                <ul class="team_social">
 +
                                    <li>
 +
                                        <a href="https://www.facebook.com/The.European.Experience.2016/?fref=ts">
 +
                                            <i class="zmdi zmdi-facebook btn waves-effect"></i>
 +
                                        </a>
 +
                                    </li>
 +
                                    <li>
 +
                                        <a href="https://twitter.com/igem_ionis">
 +
                                            <i class="zmdi zmdi-twitter btn waves-effect"></i>
 +
                                        </a>
 +
                                    </li>
 +
                                 
 +
                                 </ul>
 +
                                <a class="th_bt btn waves-effect waves-light" href="https://2016.igem.org/Team:Ionis_Paris/Events">Learn More
 +
                                    <i class="zmdi zmdi-long-arrow-right"></i>
 +
                                </a>
 
                             </div>
 
                             </div>
                             <h2><span class="counter">300</span>+</h2>
+
                             <div class="item">
                            <p> Development </p>
+
                                <h1>A professional...</h1>
                        </div>
+
                                <h6>V.I.Ps welcome</h6>
                    </div>
+
                                <p>We organized some conferences, followed by a cocktail on Paris' rooftops! We even had the luck to count Mr. RETTBERG among our guests.</p>
                    <div class="col-xs-12 col-sm-6 col-md-3">
+
                                <ul class="team_social">
                        <div class="single_fact text-center">
+
                                    <li>
                            <div class="fact_icon">
+
                                        <a href="https://www.facebook.com/The.European.Experience.2016/?fref=ts">
                                 <div class="RXcircleEffect"></div>
+
                                            <i class="zmdi zmdi-facebook btn waves-effect"></i>
                                <i class="zmdi zmdi-palette"></i>
+
                                        </a>
 +
                                    </li>
 +
                                    <li>
 +
                                        <a href="https://twitter.com/igem_ionis">
 +
                                            <i class="zmdi zmdi-twitter btn waves-effect"></i>
 +
                                        </a>
 +
                                    </li>
 +
             
 +
                                 </ul>
 +
                                <a class="th_bt btn waves-effect waves-light" href="https://2016.igem.org/Team:Ionis_Paris/Events">Learn More
 +
                                    <i class="zmdi zmdi-long-arrow-right"></i>
 +
                                </a>
 
                             </div>
 
                             </div>
                             <h2><span class="counter">400</span>+</h2>
+
                             <div class="item">
                            <p> Graphic Design </p>
+
                                <h1>...and international event</h1>
                        </div>
+
                                <h6>organized by iGEM IONIS and iGEM Evry</h6>
                    </div>
+
                                <p>Our event gathered 170 iGEMers, from 35 idifferent teams scattered in 11 countries! We had tons of fun with everyone and discovered amazing projects.</p>
                    <div class="col-xs-12 col-sm-6 col-md-3">
+
                                <ul class="team_social">
                        <div class="single_fact text-center">
+
                                    <li>
                            <div class="fact_icon">
+
                                        <a href="https://www.facebook.com/The.European.Experience.2016/?fref=ts">
                                 <div class="RXcircleEffect"></div>
+
                                            <i class="zmdi zmdi-facebook btn waves-effect"></i>
                                <i class="zmdi zmdi-accounts"></i>
+
                                        </a>
 +
                                    </li>
 +
                                    <li>
 +
                                        <a href="https://twitter.com/igem_ionis">
 +
                                            <i class="zmdi zmdi-twitter btn waves-effect"></i>
 +
                                        </a>
 +
                                    </li>
 +
 
 +
                                 </ul>
 +
                                <a class="th_bt btn waves-effect waves-light" href="https://2016.igem.org/Team:Ionis_Paris/Events">Learn More
 +
                                    <i class="zmdi zmdi-long-arrow-right"></i>
 +
                                </a>
 
                             </div>
 
                             </div>
                            <h2><span class="counter">895</span></h2>
 
                            <p>Happy clients</p>
 
 
                         </div>
 
                         </div>
 
                     </div>
 
                     </div>
 
                 </div>
 
                 </div>
            </div>
+
                 <div class="col-xs-12 col-sm-6 fix_p_r">
        </section>
+
                    <div class="team_member_photo">
        <!-- ====END START PROJECT AREA==== -->
+
                         <div class="team_slid">
       
+
                             <div class="item waves-effect">
        <!-- ====PROTFOLIO AREA==== -->
+
                                 <img src="https://static.igem.org/mediawiki/2016/6/63/European_experience.jpg" alt="">
        <section id="Portfolio" class="protfolio_area section-padding">
+
                                 <div class=""></div>
            <div class="container">
+
                                 <div class="memberPhoto_border bg2"></div>
                 <div class="row">
+
                                 <div class="memberPhoto_border bg3"></div>
                    <div class="col-xs-12">
+
                                 <div class="memberPhoto_border bg4"></div>
                        <div class="section_title mb80">
+
                            <h5 class="smallHd text-center">Here are some of</h5>
+
                            <h2 class="secHd text-center">our awesome works</h2>
+
                        </div>
+
                    </div>                                               
+
                </div>
+
                <div class="row">
+
                    <div class="col-xs-12">
+
                        <div class="work_trigge">
+
                            <ul class="trigger mb80 text-center">
+
                                <li class="filter active" data-filter="">ALL</li>
+
                                <li class="filter" data-filter=".html">HTML</li>
+
                                <li class="filter" data-filter=".wordpress">Wordpress</li>
+
                                <li class="filter" data-filter=".ui_ux">UI/UX</li>
+
                                <li class="filter" data-filter=".print">PRINT</li>
+
                            </ul>
+
                        </div>
+
                    </div>
+
                </div>
+
                <div class="row">
+
                    <div class="all_work_item">
+
                        <div class="col-xs-12 col-sm-6 col-md-4 mix all ui_ux">
+
                            <figure>
+
                                <div class="RXcircleEffect"></div>
+
                                <img src="img/mixtup1.jpg" alt="" />
+
                                <figcaption>
+
                                    <div class="capCont">
+
                                        <ul class="iconlink">
+
                                            <li>
+
                                                <a data-gall="group_1" class="veno vbox-item" href="img/mixtup1.jpg">
+
                                                    <i class="zmdi zmdi-zoom-in btn waves-effect waves-dark"></i>
+
                                                </a>
+
                                            </li>
+
                                            <li>
+
                                                <a href="case_study.html">
+
                                                    <i class="zmdi zmdi-link btn waves-effect waves-dark"></i>
+
                                                </a>
+
                                            </li>
+
                                        </ul>
+
                                        <h4>Banner Design</h4>
+
                                        <p>Print/ Design</p>
+
                                    </div>
+
                                </figcaption>
+
                            </figure>
+
                        </div>
+
                         <div class="col-xs-12 col-sm-6 col-md-4 mix all wordpress print">
+
                             <figure>
+
                                <div class="RXcircleEffect"></div>
+
                                <img src="img/mixtup3.jpg" alt="" />
+
                                <figcaption>
+
                                    <div class="capCont">
+
                                        <ul class="iconlink">
+
                                            <li>
+
                                                <a data-gall="group_1" class="veno vbox-item" href="img/mixtup3.jpg">
+
                                                    <i class="zmdi zmdi-zoom-in btn waves-effect waves-dark"></i>
+
                                                </a>
+
                                            </li>
+
                                            <li>
+
                                                <a href="case_study.html">
+
                                                    <i class="zmdi zmdi-link btn waves-effect waves-dark"></i>
+
                                                </a>
+
                                            </li>
+
                                        </ul>
+
                                        <h4>Website</h4>
+
                                        <p>Web Design / Development</p>
+
                                    </div>
+
                                </figcaption>
+
                            </figure>
+
                        </div>
+
                        <div class="col-xs-12 col-sm-6 col-md-4 mix all wordpress html">
+
                            <figure>
+
                                <div class="RXcircleEffect"></div>
+
                                 <img src="img/mixtup6.jpg" alt="" />
+
                                <figcaption>
+
                                    <div class="capCont">
+
                                        <ul class="iconlink">
+
                                            <li>
+
                                                <a data-gall="group_1" class="veno vbox-item" href="img/mixtup6.jpg">
+
                                                    <i class="zmdi zmdi-zoom-in btn waves-effect waves-dark"></i>
+
                                                </a>
+
                                            </li>
+
                                            <li>
+
                                                <a href="case_study.html">
+
                                                    <i class="zmdi zmdi-link btn waves-effect waves-dark"></i>
+
                                                </a>
+
                                            </li>
+
                                        </ul>
+
                                        <h4>WordPress</h4>
+
                                        <p>Development</p>
+
                                    </div>
+
                                </figcaption>
+
                            </figure>
+
                        </div>
+
                        <div class="col-xs-12 col-sm-6 col-md-4 mix print">
+
                            <figure>
+
                                <div class="RXcircleEffect"></div>
+
                                <img src="img/mixtup4.jpg" alt="" />
+
                                 <figcaption>
+
                                    <div class="capCont">
+
                                        <ul class="iconlink">
+
                                            <li>
+
                                                <a data-gall="group_1" class="veno vbox-item" href="img/mixtup4.jpg">
+
                                                    <i class="zmdi zmdi-zoom-in btn waves-effect waves-dark"></i>
+
                                                </a>
+
                                            </li>
+
                                            <li>
+
                                                <a href="case_study.html">
+
                                                    <i class="zmdi zmdi-link btn waves-effect waves-dark"></i>
+
                                                </a>
+
                                            </li>
+
                                        </ul>
+
                                        <h4>Mobile Application</h4>
+
                                        <p>Design/Development</p>
+
                                    </div>
+
                                 </figcaption>
+
                            </figure>
+
                        </div>
+
                        <div class="col-xs-12 col-sm-6 col-md-4 mix all ui_ux">
+
                            <figure>
+
                                <div class="RXcircleEffect"></div>
+
                                 <img src="img/mixtup2.jpg" alt="" />
+
                                <figcaption>
+
                                    <div class="capCont">
+
                                        <ul class="iconlink">
+
                                            <li>
+
                                                <a data-gall="group_1" class="veno vbox-item" href="img/mixtup2.jpg">
+
                                                    <i class="zmdi zmdi-zoom-in btn waves-effect waves-dark"></i>
+
                                                </a>
+
                                            </li>
+
                                            <li>
+
                                                <a href="case_study.html">
+
                                                    <i class="zmdi zmdi-link btn waves-effect waves-dark"></i>
+
                                                </a>
+
                                            </li>
+
                                        </ul>
+
                                        <h4>seo</h4>
+
                                        <p>SEO/Optimization</p>
+
                                    </div>
+
                                 </figcaption>
+
                            </figure>
+
                        </div>
+
                        <div class="col-xs-12 col-sm-6 col-md-4 mix html">
+
                            <figure>
+
                                <div class="RXcircleEffect"></div>
+
                                <img src="img/mixtup7.jpg" alt="" />
+
                                <figcaption>
+
                                    <div class="capCont">
+
                                        <ul class="iconlink">
+
                                            <li>
+
                                                <a data-gall="group_1" class="veno vbox-item" href="img/mixtup7.jpg">
+
                                                    <i class="zmdi zmdi-zoom-in btn waves-effect waves-dark"></i>
+
                                                </a>
+
                                            </li>
+
                                            <li>
+
                                                <a href="case_study.html">
+
                                                    <i class="zmdi zmdi-link btn waves-effect waves-dark"></i>
+
                                                </a>
+
                                            </li>
+
                                        </ul>
+
                                        <h4>Marketing</h4>
+
                                        <p>Online Marketing</p>
+
                                    </div>
+
                                </figcaption>
+
                            </figure>
+
                        </div>
+
                        <div class="col-xs-12 col-sm-6 col-md-4 mix wordpress">
+
                            <figure>
+
                                <div class="RXcircleEffect"></div>
+
                                <img src="img/mixtup5.jpg" alt="" />
+
                                <figcaption>
+
                                    <div class="capCont">
+
                                        <ul class="iconlink">
+
                                            <li>
+
                                                <a data-gall="group_1" class="veno vbox-item" href="img/mixtup5.jpg">
+
                                                    <i class="zmdi zmdi-zoom-in btn waves-effect waves-dark"></i>
+
                                                </a>
+
                                            </li>
+
                                            <li>
+
                                                <a href="case_study.html">
+
                                                    <i class="zmdi zmdi-link btn btn-link btn waves-effect waves-dark"></i>
+
                                                </a>
+
                                            </li>
+
                                        </ul>
+
                                        <h4>Logo Design</h4>
+
                                        <p>Print/ Design</p>
+
                                    </div>
+
                                </figcaption>
+
                            </figure>
+
                        </div>
+
                    </div>                                               
+
                </div>
+
                <div class="row">
+
                    <div class="col-xs-12 trigger_bottom">
+
                        <a href="#!" class="th_bt btn waves-effect waves-light">View All
+
                            <i class="zmdi zmdi-long-arrow-right"></i>
+
                        </a>
+
                    </div>
+
                </div>
+
            </div>   
+
        </section>
+
        <!-- ====END PROTFOLIO AREA==== -->
+
       
+
        <!-- ====START WHY CHOOSE==== -->
+
        <section class="whychoose">
+
            <div class="container">
+
                <div class="row">
+
                    <div class="col-xs-12">
+
                        <div class="section_title mb80">
+
                            <h5 class="smallHd text-center">check out </h5>
+
                            <h2 class="secHd text-center">Our features</h2>
+
                        </div>
+
                    </div>                                               
+
                </div>
+
                <div class="row checkBGFull">
+
                    <div class="col-xs-12 col-sm-6 ourFeaturesContent section-padding">
+
                        <div class="single_checkCont">
+
                            <div class="checkIcon">
+
                                <i class="zmdi zmdi-star"></i>
+
 
                             </div>
 
                             </div>
                             <div class="checkText">
+
                             <div class="item waves-effect">
                                 <h4>cost effectiveness</h4>
+
                                 <img src="https://static.igem.org/mediawiki/2016/1/18/IONIS_IGEM_EE2016_cocktail.png" alt="">
                                <p>All the rumors have finally died down and many iPod does support video its fifth generation. </p>
+
                                <div class="memberPhoto_border bg1"></div>
                            </div>
+
                                <div class="memberPhoto_border bg2"></div>
                        </div>
+
                                <div class="memberPhoto_border bg3"></div>
                        <div class="single_checkCont">
+
                                 <div class="memberPhoto_border bg4"></div>
                            <div class="checkIcon">
+
                                 <i class="zmdi zmdi-lamp"></i>
+
 
                             </div>
 
                             </div>
                             <div class="checkText">
+
                             <div class="item waves-effect">
                                 <h4>unique ideas</h4>
+
                                 <img src="https://static.igem.org/mediawiki/2016/b/b0/IONIS_IGEM_EE2016_home_group.png" alt="">
                                 <p>All the rumors have finally died down and many iPod does support video its fifth generation. </p>
+
                                <div class="memberPhoto_border bg1"></div>
 +
                                 <div class="memberPhoto_border bg2"></div>
 +
                                <div class="memberPhoto_border bg3"></div>
 +
                                <div class="memberPhoto_border bg4"></div>
 
                             </div>
 
                             </div>
 
                         </div>
 
                         </div>
                         <div class="single_checkCont">
+
                         <div class="teamslide_nav">
                             <div class="checkIcon">
+
                             <i class="zmdi zmdi-long-arrow-left testi_prev"></i>
                                <i class="zmdi zmdi-alarm-check"></i>
+
                             <i class="zmdi zmdi-long-arrow-right testi_next"></i>
                             </div>
+
                            <div class="checkText">
+
                                <h4>Timely Delivery </h4>
+
                                <p>All the rumors have finally died down and many iPod does support video its fifth generation. </p> 
+
                            </div>
+
                        </div> 
+
                    </div>
+
                    <div class="checkfeature_contbg hidden-xs" style="background-image: url(img/feature_post_img_1.jpg);"></div>
+
                </div>
+
                <div class="row checkBGFull">
+
                    <div class="col-xs-12 col-sm-6 ourFeaturesContent section-padding">
+
                        <div class="single_checkCont">
+
                            <div class="checkIcon">
+
                                <i class="zmdi zmdi-account-add"></i>
+
                            </div>
+
                            <div class="checkText">
+
                                <h4>reliability</h4>
+
                                <p>All the rumors have finally died down and many iPod does support video its fifth generation. </p> 
+
                            </div>
+
 
                         </div>
 
                         </div>
                        <div class="single_checkCont">
 
                            <div class="checkIcon">
 
                                <i class="zmdi zmdi-accounts"></i>
 
                            </div>
 
                            <div class="checkText">
 
                                <h4>customer relationship</h4>
 
                                <p>All the rumors have finally died down and many iPod does support video its fifth generation. </p> 
 
                            </div>
 
                        </div>
 
                        <div class="single_checkCont">
 
                            <div class="checkIcon">
 
                                <i class="zmdi zmdi-sun"></i>
 
                            </div>
 
                            <div class="checkText">
 
                                <h4>quality assurance</h4>
 
                                <p>All the rumors have finally died down and many iPod does support video its fifth generation. </p> 
 
                            </div>
 
                        </div> 
 
 
                     </div>
 
                     </div>
                    <div class="checkfeature_contbg hidden-xs" style="background-image: url(img/feature_post_img_2.jpg);"></div>
 
 
                 </div>
 
                 </div>
 
             </div>
 
             </div>
         </section>
+
         </div>
        <!-- ====END WHY CHOOSE==== -->
+
    </section>
       
+
    <!-- ====START OUR TEAM AREA==== -->
        <!-- ====START SERVICE AREA==== -->
+
 
        <section class="service_area section-padding">
+
    <!-- ====START SERVICE AREA==== -->
            <div class="container">
+
    <section class="service_area section-padding">
                <div class="row">
+
        <div class="container">
                    <div class="col-xs-12">
+
            <div class="row">
                        <div class="section_title mb80">
+
                <div class="col-xs-12">
                            <h5 class="smallHd text-center">here are services</h5>
+
                    <div class="section_title mb80">
                            <h2 class="secHd text-center">We also offer</h2>
+
                        <h2 class="secHd text-center" style="color: #429fd7;">A multidisciplinary team</h2><br />
                        </div>
+
                         <h5 class="smallHd text-center" style="color: #429fd7;">The iGEM IONIS team is developping its
                    </div>                                               
+
                             project through different axes. We are focused on two areas : <br /><br />the development of
                </div>
+
                             our prototype and the realisation of our own european jamboree, the European Experience.
                <div class="row">
+
                         </h5>
                    <div class="col-xs-12 col-sm-6 col-md-4">
+
                        <div class="single_service text-center">
+
                            <i class="zmdi zmdi-edit"></i>
+
                            <h3>Creative Writing</h3>
+
                            <p>EPROM or Erasable Programmable Read Only Memory is rewritable memory chip that can hold its data without power. A programmed.</p>
+
                        </div>
+
                    </div>
+
                    <div class="col-xs-12 col-sm-6 col-md-4">
+
                         <div class="single_service text-center">
+
                            <i class="zmdi zmdi-print"></i>
+
                            <h3>Print Design</h3>
+
                            <p>EPROM or Erasable Programmable Read Only Memory is rewritable memory chip that can hold its data without power. A programmed.</p>
+
                        </div>
+
                    </div>
+
                    <div class="col-xs-12 col-sm-6 col-md-4">
+
                        <div class="single_service text-center">
+
                             <i class="zmdi zmdi-favorite"></i>
+
                            <h3>Social Media</h3>
+
                            <p>EPROM or Erasable Programmable Read Only Memory is rewritable memory chip that can hold its data without power. A programmed.</p>
+
                        </div>
+
                    </div>
+
                    <div class="col-xs-12 col-sm-6 col-md-4">
+
                        <div class="single_service text-center">
+
                             <i class="zmdi zmdi-tab-unselected"></i>
+
                            <h3>Pixel Perfect Web</h3>
+
                            <p>EPROM or Erasable Programmable Read Only Memory is rewritable memory chip that can hold its data without power. A programmed.</p>
+
                         </div>
+
                    </div>
+
                    <div class="col-xs-12 col-sm-6 col-md-4">
+
                        <div class="single_service text-center">
+
                            <i class="zmdi zmdi-code-setting"></i>
+
                            <h3>Front End Development</h3>
+
                            <p>EPROM or Erasable Programmable Read Only Memory is rewritable memory chip that can hold its data without power. A programmed.</p>
+
                        </div>
+
                    </div>
+
                    <div class="col-xs-12 col-sm-6 col-md-4">
+
                        <div class="single_service text-center">
+
                            <i class="zmdi zmdi-brush"></i>
+
                            <h3>Graphic Design</h3>
+
                            <p>EPROM or Erasable Programmable Read Only Memory is rewritable memory chip that can hold its data without power. A programmed.</p>
+
                        </div>  
+
 
                     </div>
 
                     </div>
 
                 </div>
 
                 </div>
 
             </div>
 
             </div>
        </section>
+
             <div class="row">
        <!-- ====END SERVICE AREA==== -->
+
                 <div class="col-xs-12 col-sm-6 col-md-4">
       
+
                    <div class="single_service text-center">
        <!-- ====START SOCIAL LINK==== -->
+
 
        <section class="social_btn">
+
                         <h3>Biotechnology</h3>
             <div class="container">
+
                        <img src="https://static.igem.org/mediawiki/2016/0/01/IONIS_IGEM_supbiotech_shcool.png" alt="" />
                 <div class="row">
+
                    <div class="col-xs-12 col-sm-8 col-md-7">
+
                         <h3>Liked Our Service  and works?</h3>
+
 
                     </div>
 
                     </div>
                    <div class="col-xs-12 col-sm-4 col-md-5">
+
                </div>
                        <a class="th_bt btn waves-effect waves-light" href="#!">Hire Us
+
                <div class="col-xs-12 col-sm-6 col-md-4">
                            <i class="zmdi zmdi-long-arrow-right"></i>
+
                    <div class="single_service text-center">
                         </a>  
+
 
 +
                        <h3>Computer Science</h3>
 +
                         <img src="https://static.igem.org/mediawiki/2016/3/30/IONIS_IGEM_epita_shcool.png" alt="" />
 +
 
 +
 
 
                     </div>
 
                     </div>
 
                 </div>
 
                 </div>
            </div>
+
                <div class="col-xs-12 col-sm-6 col-md-4">
        </section>
+
                    <div class="single_service text-center">
        <!-- ====END SOCIAL LINK==== -->
+
                        <h3>Development</h3>
       
+
                         <img src="https://static.igem.org/mediawiki/2016/0/04/IONIS_IGEM_epitech_shcool.png" alt="" />
        <!-- ====START OUR TEAM AREA==== -->
+
                     </div>
        <section class="our_team">
+
            <div class="container">
+
              <div class="row">
+
                    <div class="col-xs-12">
+
                         <div class="section_title mb80">
+
                            <h5 class="smallHd text-center">meet with the</h5>
+
                            <h2 class="secHd text-center">crazy team</h2>
+
                        </div>
+
                     </div>                                              
+
 
                 </div>
 
                 </div>
                 <div class="row team_details_area">
+
                 <div class="col-xs-12 col-sm-6 col-md-4">
                    <div class="col-xs-12 col-sm-6 fix_p">
+
                    <div class="single_service text-center">
                        <div class="team_content">
+
 
                            <div class="team_cotent_slid">
+
                         <h3>Graphic Design</h3>
                                <div class="item">
+
                         <img src="https://static.igem.org/mediawiki/2016/5/5d/IONIS_IGEM_eartsup_shcool.png" alt="" />
                                    <h1>Timothy<br>Dean</h1>
+
                                    <h6>Creative Director</h6>
+
                                    <p>If you’ve followed along and done the steps above, you’ve created  good starting place. You’re going to need to make sure your pages are optimized properly. This will ensure you get your page ranked high in the search engines.</p>
+
                                    <ul class="team_social">
+
                                        <li>
+
                                            <a href="#!">
+
                                                <i class="zmdi zmdi-facebook btn waves-effect"></i>
+
                                            </a>
+
                                        </li>
+
                                        <li>
+
                                            <a href="#!">
+
                                                <i class="zmdi zmdi-twitter btn waves-effect"></i>
+
                                            </a>
+
                                        </li>
+
                                        <li>
+
                                            <a href="#!">
+
                                                <i class="zmdi zmdi-dribbble btn waves-effect"></i>
+
                                            </a>
+
                                        </li>
+
                                        <li>
+
                                            <a href="#!">
+
                                                <i class="zmdi zmdi-behance btn waves-effect"></i>
+
                                            </a>
+
                                        </li>
+
                                        <li>
+
                                            <a href="#!">
+
                                                <i class="zmdi zmdi-pinterest btn waves-effect"></i>
+
                                            </a>
+
                                        </li>
+
                                    </ul>
+
                                    <a class="th_bt btn waves-effect waves-light" href="#!">Learn More
+
                                        <i class="zmdi zmdi-long-arrow-right"></i>
+
                                    </a>
+
                                </div>
+
                                <div class="item">
+
                                    <h1>Ralph <br>Ramirez</h1>
+
                                    <h6>Creative Director</h6>
+
                                    <p>If you’ve followed along and done the steps above, you’ve created  good starting place. You’re going to need to make sure your pages are optimized properly. This will ensure you get your page ranked high in the search engines.</p>
+
                                    <ul class="team_social">
+
                                        <li>
+
                                            <a href="#!">
+
                                                <i class="zmdi zmdi-facebook btn waves-effect"></i>
+
                                            </a>
+
                                        </li>
+
                                        <li>
+
                                            <a href="#!">
+
                                                <i class="zmdi zmdi-twitter btn waves-effect"></i>
+
                                            </a>
+
                                        </li>
+
                                        <li>
+
                                            <a href="#!">
+
                                                <i class="zmdi zmdi-dribbble btn waves-effect"></i>
+
                                            </a>
+
                                        </li>
+
                                        <li>
+
                                            <a href="#!">
+
                                                <i class="zmdi zmdi-behance btn waves-effect"></i>
+
                                            </a>
+
                                        </li>
+
                                        <li>
+
                                            <a href="#!">
+
                                                <i class="zmdi zmdi-pinterest btn waves-effect"></i>
+
                                            </a>
+
                                        </li>
+
                                    </ul>
+
                                    <a class="th_bt btn waves-effect waves-light" href="#!">Learn More
+
                                        <i class="zmdi zmdi-long-arrow-right"></i>
+
                                    </a>
+
                                </div>
+
                                <div class="item">
+
                                    <h1>Alexander<br>Harper</h1>
+
                                    <h6>Creative Director</h6>
+
                                    <p>If you’ve followed along and done the steps above, you’ve created  good starting place. You’re going to need to make sure your pages are optimized properly. This will ensure you get your page ranked high in the search engines.</p>
+
                                    <ul class="team_social">
+
                                        <li>
+
                                            <a href="#!">
+
                                                <i class="zmdi zmdi-facebook btn waves-effect"></i>
+
                                            </a>
+
                                        </li>
+
                                        <li>
+
                                            <a href="#!">
+
                                                <i class="zmdi zmdi-twitter btn waves-effect"></i>
+
                                            </a>
+
                                        </li>
+
                                        <li>
+
                                            <a href="#!">
+
                                                <i class="zmdi zmdi-dribbble btn waves-effect"></i>
+
                                            </a>
+
                                        </li>
+
                                        <li>
+
                                            <a href="#!">
+
                                                <i class="zmdi zmdi-behance btn waves-effect"></i>
+
                                            </a>
+
                                        </li>
+
                                        <li>
+
                                            <a href="#!">
+
                                                <i class="zmdi zmdi-pinterest btn waves-effect"></i>
+
                                            </a>
+
                                        </li>
+
                                    </ul>
+
                                    <a class="th_bt btn waves-effect waves-light" href="#!">Learn More
+
                                        <i class="zmdi zmdi-long-arrow-right"></i>
+
                                    </a>
+
                                </div>
+
                            </div>   
+
                         </div>
+
                    </div>
+
                    <div class="col-xs-12 col-sm-6 fix_p_r">
+
                         <div class="team_member_photo">
+
                            <div class="team_slid">
+
                                <div class="item waves-effect">
+
                                    <img src="img/team_member_1.jpg" alt="">
+
                                    <div class="memberPhoto_border bg1"></div>
+
                                    <div class="memberPhoto_border bg2"></div>
+
                                    <div class="memberPhoto_border bg3"></div>
+
                                    <div class="memberPhoto_border bg4"></div>
+
                                </div>
+
                                <div class="item waves-effect">
+
                                    <img src="img/team_member_3.jpg" alt="">
+
                                    <div class="memberPhoto_border bg1"></div>
+
                                    <div class="memberPhoto_border bg2"></div>
+
                                    <div class="memberPhoto_border bg3"></div>
+
                                    <div class="memberPhoto_border bg4"></div>
+
                                </div>
+
                                <div class="item waves-effect">
+
                                    <img src="img/team_member_2.jpg" alt="">
+
                                    <div class="memberPhoto_border bg1"></div>
+
                                    <div class="memberPhoto_border bg2"></div>
+
                                    <div class="memberPhoto_border bg3"></div>
+
                                    <div class="memberPhoto_border bg4"></div>
+
                                </div>
+
                            </div>
+
                            <div class="teamslide_nav">
+
                                <i class="zmdi zmdi-long-arrow-left testi_prev"></i>
+
                                <i class="zmdi zmdi-long-arrow-right testi_next"></i>
+
                            </div>
+
                        </div>
+
 
                     </div>
 
                     </div>
 
                 </div>
 
                 </div>
            </div>
+
                 <div class="col-xs-12 col-sm-6 col-md-4">
        </section>
+
                    <div class="single_service text-center">
        <!-- ====START OUR TEAM AREA==== -->
+
 
       
+
                         <h3>Marketing & Communication</h3>
        <!-- ====START PROCESS TABLE==== -->
+
                         <img src="https://static.igem.org/mediawiki/2016/6/69/IONIS_IGEM_ISTM_shcool.png" alt="" />
        <section class="process_area section-padding">
+
            <div class="container">
+
                 <div class="row">
+
                    <div class="col-xs-12">
+
                        <div class="section_title mb80">
+
                            <h5 class="smallHd text-center">the simple step of</h5>
+
                            <h2 class="secHd text-center">our working process</h2>
+
                         </div>
+
                    </div>                                               
+
                </div>
+
                <div class="row">
+
                    <div class="col-md-10 col-md-offset-1 text-center">
+
                         <div class="tab_trigger_img">
+
                            <img src="img/pro_bg.svg" class="waveBg svg" alt="">
+
                            <div class="tab_trigger_icon">
+
                                <div class="singleTabIcon">
+
                                    <i class="zmdi zmdi-settings" data-index="0"></i> 
+
                                </div>
+
                                <div class="singleTabIcon">
+
                                    <i class="zmdi zmdi-gesture" data-index="1"></i>
+
                                </div>
+
                                <div class="singleTabIcon">
+
                                    <i class="zmdi zmdi-desktop-mac" data-index="2"></i>
+
                                </div>
+
                                <div class="singleTabIcon">
+
                                    <i class="zmdi zmdi-rotate-cw" data-index="3"></i>
+
                                </div>
+
                                <div class="singleTabIcon">
+
                                    <i class="zmdi zmdi-thumb-up" data-index="4"></i>
+
                                </div>
+
                            </div>
+
                        </div>
+
 
                     </div>
 
                     </div>
 
                 </div>
 
                 </div>
                 <div class="row">
+
                 <div class="col-xs-12 col-sm-6 col-md-4">
                    <div class="col-sm-8 col-sm-offset-2">
+
                    <div class="single_service text-center">
                        <div class="pro_content">
+
 
                            <div class="single_pro_content">
+
                        <h3>Aeronautics</h3>
                                <fieldset>
+
                        <img src="https://static.igem.org/mediawiki/2016/a/a5/IONIS_IGEM_IPSA_shcool.png" alt="" />
                                    <legend>DEVELOPMENT</legend>
+
 
                                    <p>RSS, (Really Simple Syndication) has become so popular today and is being referred to by internet users as Pull Technology rather than “Push” Technology. Utilizing RSS “Pull” technology has become a popular source of income for webmasters that use RSS Feeds on their websites. </p>
+
                                </fieldset>
+
                            </div>
+
                            <div class="single_pro_content">
+
                                <fieldset>
+
                                    <legend>Logo Design</legend>
+
                                    <p>RSS, (Really Simple Syndication) has become so popular today and is being referred to by internet users as Pull Technology rather than “Push” Technology. Utilizing RSS “Pull” technology has become a popular source of income for webmasters that use RSS Feeds on their websites. </p>
+
                                </fieldset>
+
                            </div>
+
                            <div class="single_pro_content">
+
                                <fieldset>
+
                                    <legend>Graphic Design</legend>
+
                                    <p>RSS, (Really Simple Syndication) has become so popular today and is being referred to by internet users as Pull Technology rather than “Push” Technology. Utilizing RSS “Pull” technology has become a popular source of income for webmasters that use RSS Feeds on their websites. </p>
+
                                </fieldset>
+
                            </div>
+
                            <div class="single_pro_content">
+
                                <fieldset>
+
                                    <legend>WordPress</legend>
+
                                    <p>RSS, (Really Simple Syndication) has become so popular today and is being referred to by internet users as Pull Technology rather than “Push” Technology. Utilizing RSS “Pull” technology has become a popular source of income for webmasters that use RSS Feeds on their websites. </p>
+
                                </fieldset>
+
                            </div>
+
                            <div class="single_pro_content">
+
                                <fieldset>
+
                                    <legend>Banner Design</legend>
+
                                    <p>RSS, (Really Simple Syndication) has become so popular today and is being referred to by internet users as Pull Technology rather than “Push” Technology. Utilizing RSS “Pull” technology has become a popular source of income for webmasters that use RSS Feeds on their websites. </p>
+
                                </fieldset>
+
                            </div>
+
                        </div>
+
 
                     </div>
 
                     </div>
 
                 </div>
 
                 </div>
 
             </div>
 
             </div>
         </section>
+
         </div>
        <!-- ====END PROCESS TABLE==== -->
+
    </section>
       
+
    <!-- ====END SERVICE AREA==== -->
        <!-- ====START SKILL AND VEDIO TABLE==== -->
+
 
        <section class="skill_and_video">
+
 
            <div class="video_area">
+
 
                <div class="video_control">
+
 
                    <div class="dtable">
+
                        <div class="dcell">
+
    <!-- ====START PARTNER==== -->
                            <a href="https://youtu.be/ScMzIvxBSi4?rel=0&autoplay=1" data-type="youtube" id="control" class="btn waves-effect waves-light veno">
+
    <div class="partner_area">
                                <i class="zmdi zmdi-play"></i>
+
        <div class="container">
                            </a>
+
            <div class="row">
                            <h4>Check out the Video</h4>
+
                <div class="col-xs-12">
                        </div>
+
                    <div class="section_title mb80">
 +
                        <h5 class="smallHd text-center">Our</h5>
 +
                        <h2 class="secHd text-center">SPONSORS AND PARTNERS </h2>
 
                     </div>
 
                     </div>
 
                 </div>
 
                 </div>
            </div>
+
                 <div class="col-md-12">
            <div class="container fix_p">
+
                    <div class="partner_slider">
                 <div class="row">
+
                      <div class="item">
                    <div class="col-xs-12 col-sm-offset-5 col-sm-7 section-padding skillBg">
+
                            <img src="https://static.igem.org/mediawiki/2016/0/0e/IONIS_IGEM_partener_ARPF.png" alt="partner slider" />
                        <div class="row">
+
                            <div class="col-sm-12">
+
                                <div class="all_skill_item">
+
                                    <div class="single_progress">
+
                                        <h4>Web Design</h4>
+
                                        <div class="progress">
+
                                            <div class="progress-bar wow animated" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 95%;">
+
                                                <span>95%</span>
+
                                            </div>
+
                                        </div>
+
                                    </div>
+
                                    <div class="single_progress">
+
                                        <h4>PHP</h4>
+
                                        <div class="progress">
+
                                            <div class="progress-bar wow animated" role="progressbar" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100" style="width: 80%;">
+
                                                <span>80%</span>
+
                                            </div>
+
                                        </div>
+
                                    </div>
+
                                    <div class="single_progress">
+
                                        <h4>Adobe photoshop</h4>
+
                                        <div class="progress">
+
                                            <div class="progress-bar wow animated" role="progressbar" aria-valuenow="90" aria-valuemin="0" aria-valuemax="100" style="width: 90%;">
+
                                                <span>90%</span>
+
                                            </div>
+
                                        </div>
+
                                    </div>
+
                                </div>
+
                            </div>
+
 
                         </div>
 
                         </div>
                        <div class="row">
+
                      <div class="item">
                             <div class="col-md-3 col-xs-6">
+
                             <img src="https://static.igem.org/mediawiki/2016/0/08/IONIS_IGEM_partener_bouygues.png" alt="partner slider" />
                                <div class="single_skill">
+
                                    <input type="text" class="knob" value="0" data-rel="90" data-width="100" data-height="100" data-bgcolor="#4073ff" data-fgcolor="#d3dfff" data-thickness=".12" data-readonly="true" data-angleOffset="0" disabled>
+
                                    <h3>HTML5</h3>
+
                                </div>
+
                            </div>
+
                            <div class="col-md-3 col-xs-6">
+
                                <div class="single_skill">
+
                                    <input type="text" class="knob" value="0" data-rel="80" data-width="100" data-height="100" data-bgcolor="#4073ff" data-fgcolor="#d3dfff" data-thickness=".12" data-readonly="true" data-angleOffset="0" disabled>
+
                                    <h3>UI/UX</h3>
+
                                </div>
+
                            </div>
+
                            <div class="col-md-3 col-xs-6">
+
                                <div class="single_skill">
+
                                    <input type="text" class="knob" value="0" data-rel="90" data-width="100" data-height="100" data-bgcolor="#4073ff" data-fgcolor="#d3dfff" data-thickness=".12" data-readonly="true" data-angleOffset="0" disabled>
+
                                    <h3>Wordpress</h3>
+
                                </div>
+
                            </div>
+
                            <div class="col-md-3 col-xs-6">
+
                                <div class="single_skill">
+
                                    <input type="text" class="knob" value="0" data-rel="80" data-width="100" data-height="100" data-bgcolor="#4073ff" data-fgcolor="#d3dfff" data-thickness=".12" data-readonly="true" data-angleOffset="0" disabled>
+
                                    <h3>Branding</h3>
+
                                </div>
+
                            </div>
+
                         
+
                        </div> 
+
                    </div>
+
                </div>
+
            </div> 
+
        </section>
+
        <!-- ====END SKILL AND VEDIO TABLE==== -->
+
       
+
        <!-- ====START PRICING TABLE==== -->
+
        <section class="pricing_table section-padding">
+
            <div class="container">
+
                <div class="row">
+
                    <div class="col-xs-12">
+
                        <div class="section_title mb80">
+
                            <h5 class="smallHd text-center">check out our</h5>
+
                            <h2 class="secHd text-center">pricing plan</h2>
+
 
                         </div>
 
                         </div>
                    </div>                                               
+
                      <div class="item">
                </div>
+
                             <img src="https://static.igem.org/mediawiki/2016/3/36/IONIS_IGEM_partener_Bio_new_england.png" alt="partner slider" />
                <div class="row all_pricing_table">
+
                    <div class="col-xs-12 col-sm-4">
+
                        <div class="single_pricing">
+
                             <h5 class="text-center">Basic</h5>
+
                            <h1 class="text-center"><sup>$</sup>300</h1>
+
                            <hr>
+
                            <ul class="pricing_list">
+
                                <li>2 UNIQUE  CONCEPTS</li>
+
                                <li>5 REVISTIONS</li>
+
                                <li>LOGO DESIGN</li>
+
                                <li>24/7 CUSTOMER SUPPORT</li>
+
                                <li>3-5 BUSINESS DAYS</li>
+
                            </ul>
+
                            <a class="th_bt btn waves-effect" href="#!">ORDER</a>  
+
 
                         </div>
 
                         </div>
                    </div>
+
 
                    <div class="col-xs-12 col-sm-4">
+
                         <div class="single_pricing special active">
+
                         <div class="item">
                             <i class="fa fa-trophy" aria-hidden="true"></i>
+
                             <img src="https://static.igem.org/mediawiki/2016/e/eb/IONIS_IGEM_partener_qiagen.png" alt="partner slider" />
                            <h5 class="text-center">Standard</h5>
+
                            <h1 class="text-center"><sup>$</sup>399</h1>
+
                            <hr>
+
                            <ul class="pricing_list">
+
                                <li>3 UNIQUE  CONCEPTS</li>
+
                                <li>5 REVISTIONS</li>
+
                                <li>LOGO DESIGN</li>
+
                                <li>24/7 CUSTOMER SUPPORT</li>
+
                                <li>3-5 BUSINESS DAYS</li>
+
                            </ul>
+
                            <a class="th_bt btn waves-effect" href="#!">ORDER</a>  
+
 
                         </div>
 
                         </div>
                    </div>
+
                         <div class="item">
                    <div class="col-xs-12 col-sm-4">
+
                             <img src="https://static.igem.org/mediawiki/2016/7/71/IONIS_IGEM_partener_IDT.png" alt="partner slider" />
                         <div class="single_pricing">
+
                             <h5 class="text-center">Premium</h5>
+
                            <h1 class="text-center"><sup>$</sup>799</h1>
+
                            <hr>
+
                            <ul class="pricing_list">
+
                                <li>4 UNIQUE  CONCEPTS</li>
+
                                <li>5 REVISTIONS</li>
+
                                <li>LOGO DESIGN</li>
+
                                <li>24/7 CUSTOMER SUPPORT</li>
+
                                <li>3-5 BUSINESS DAYS</li>
+
                            </ul>
+
                            <a class="th_bt btn waves-effect" href="#!">ORDER</a>  
+
 
                         </div>
 
                         </div>
                    </div>
+
                         <div class="item">
                </div>
+
                             <img src="https://static.igem.org/mediawiki/2016/7/73/IONIS_IGEM_partener_INSERM.png" alt="partner slider" />
            </div>
+
        </section>
+
        <!-- ====END PRICING TABLE==== -->
+
       
+
        <!-- ====START CLIENT PART==== -->
+
        <section class="client_part">
+
            <div class="container">
+
                <div class="client_slider_area">
+
                    <div class="client-caro">
+
                         <div class="row">
+
                             <div class="col-xs-12 col-sm-3">
+
                                <div class="client_img">
+
                                    <div class="singleClientImg">
+
                                        <img src="img/client_1.jpg" alt="">
+
                                        <h6><a href="#">Karen E. Roser </a></h6>
+
                                        <p>CEO, Omuk Group </p>
+
                                    </div>
+
                                    <div class="singleClientImg">
+
                                        <img src="img/client_2.jpg" alt="">
+
                                        <h6><a href="#">Johnny Peters</a></h6>
+
                                        <p>MD, CTS Group </p>
+
                                    </div>
+
                                    <div class="singleClientImg">
+
                                        <img src="img/client_3.jpg" alt="">
+
                                        <h6><a href="#">William Morales</a></h6>
+
                                        <p>CEO, Lorem Group </p>
+
                                    </div>
+
                                </div>
+
                                <div class="clientslide_nav">
+
                                    <i class="zmdi zmdi-long-arrow-left testi_prev"></i>
+
                                    <i class="zmdi zmdi-long-arrow-right testi_next"></i>
+
                                </div>
+
                            </div>
+
                            <div class="col-xs-12 col-sm-9">
+
                                <div class="section_title">
+
                                    <h5 class="smallHd text-left">some of inspiration</h5>
+
                                    <h2 class="secHd text-left">what our clients say</h2>
+
                                </div>
+
                                <div class="clientTestiSlider">
+
                                    <div class="singleClientTesti">
+
                                        <div class="cleint-testi">
+
                                            <p>If you’ve followed along and done the steps above, you’ve created a good starting place. You’re going to need to make sure your pages are optimized properly. This will ensure you get your page ranked high in the search engines. ou’re going to need to make sure your pages are optimized properly.This will ensure high in the search properly.</p>
+
                                        </div>
+
                                    </div>
+
                                    <div class="singleClientTesti">
+
                                        <div class="cleint-testi">
+
                                            <p>If you’ve followed along and done the steps above, you’ve created a good starting place. You’re going to need to make sure your pages are optimized properly. This will ensure you get your page ranked high in the search engines. ou’re going to need to make sure your pages are optimized properly.This will ensure high in the search properly.</p>
+
                                        </div>
+
                                    </div>
+
                                    <div class="singleClientTesti">
+
                                        <div class="cleint-testi">
+
                                            <p>If you’ve followed along and done the steps above, you’ve created a good starting place. You’re going to need to make sure your pages are optimized properly. This will ensure you get your page ranked high in the search engines. ou’re going to need to make sure your pages are optimized properly.This will ensure high in the search properly.</p>
+
                                        </div>
+
                                    </div>
+
                                </div>
+
                            </div>
+
 
                         </div>
 
                         </div>
                    </div>
+
                         <div class="item">
                </div>
+
                             <img src="https://static.igem.org/mediawiki/2016/8/81/IONIS_IGEM_partener_lapaillasse.png" alt="partner slider" />
            </div>
+
        </section>
+
        <!-- ====END CLIENT PART==== -->
+
       
+
        <!-- ====START PARTNER==== -->
+
        <div class="partner_area">
+
            <div class="container">
+
                <div class="row">
+
                    <div class="col-md-12">
+
                         <div class="partner_slider">
+
                            <div class="item">
+
                                <img src="img/partner_1.png" alt="partner slider" />
+
                             </div>
+
                            <div class="item">
+
                                <img src="img/partner_2.png" alt="partner slider" />
+
                            </div>
+
                            <div class="item">
+
                                <img src="img/partner_3.png" alt="partner slider" />
+
                            </div>
+
                            <div class="item">
+
                                <img src="img/partner_4.png" alt="partner slider" />
+
                            </div>
+
                            <div class="item">
+
                                <img src="img/partner_5.png" alt="partner slider" />
+
                            </div>
+
 
                         </div>
 
                         </div>
 +
 +
 
                     </div>
 
                     </div>
 
                 </div>
 
                 </div>
 
             </div>
 
             </div>
 
         </div>
 
         </div>
        <!-- ====END PARTNER==== -->
+
    </div>
       
+
    <!-- ====END PARTNER==== -->
        <!-- ====START BLOG TABLE==== -->
+
 
         <section id="blog" class="blog_area section-padding">
+
 
 +
    <!-- ====END BLOG TABLE==== -->
 +
 
 +
 
 +
    <!-- ====START SOCIAL Link==== -->
 +
    <div class="footer_social">
 +
         <div class="container-fluid">
 +
            <div class="row">
 +
                <ul class="ft_top clearfix">
 +
                    <li class="waves-effect waves-light">
 +
                        <a href="https://www.facebook.com/ionisigem/?fref=ts" target="_blank">
 +
                            <i class="zmdi zmdi-facebook "></i>Facebook
 +
                        </a>
 +
                    </li>
 +
                    <li class="waves-effect waves-light">
 +
                        <a href="https://twitter.com/igem_ionis" target="_blank">
 +
                            <i class="zmdi zmdi-twitter"></i>Twitter
 +
                        </a>
 +
                    </li>
 +
                    <li class="waves-effect waves-light">
 +
                        <a href="https://www.youtube.com/channel/UC0RyQsB5YpweSRBYQlAdZDA" target="_blank">
 +
                            <i class="zmdi zmdi-youtube"></i>YouTube
 +
                        </a>
 +
                    </li>
 +
                    <li class="waves-effect waves-light">
 +
                        <a href="https://www.linkedin.com/company/igem-ionis" target="_blank">
 +
                            <i class="zmdi zmdi-linkedin"></i>LinkedIn
 +
                        </a>
 +
                    </li>
 +
 
 +
                </ul>
 +
            </div>
 +
        </div>
 +
    </div>
 +
    <!-- ====END FOOTER TOP==== -->
 +
 
 +
    <!-- ====START FOOTER AREA==== -->
 +
    <footer class="footer_area">
 +
        <div class="footer_middle">
 
             <div class="container">
 
             <div class="container">
 
                 <div class="row">
 
                 <div class="row">
 
                     <div class="col-xs-12">
 
                     <div class="col-xs-12">
                         <div class="section_title mb80">
+
                         <div class="scroll_area">
                             <h5 class="smallHd text-center">latest news</h5>
+
                             <div class="sroll_top">
                            <h2 class="secHd text-center">from the blog</h2>
+
                                 <a href="#ancre"> <i class="zmdi zmdi-chevron-up btn waves-effect"> </i> </a>
                        </div>
+
                    </div>                                               
+
                </div>
+
                <div class="row">
+
                    <div class="col-md-12 fix_p_r">
+
                        <div class="blog_slid">
+
                            <div class="item">
+
                                 <a href="single_blog-full.html">
+
                                    <div class="blog_img waves-effect">
+
                                        <img src="img/blog_1.jpg" alt="">
+
                                    </div>
+
                                </a>
+
                                <div class="blog_cont">
+
                                    <ul class="blog_s">
+
                                        <li><a href="#"><i class="zmdi zmdi-account"></i>Admin</a></li>
+
                                        <li><a href="#"><i class="zmdi zmdi-calendar-alt"></i>June 18,2015</a></li>
+
                                    </ul>
+
                                    <h4>
+
                                        <a href="single_blog-full.html">What is minimal Design</a>
+
                                    </h4>
+
                                    <p>If you’ve followed along and done the steps above, you’ve created a good starting place.</p>
+
                                    <a class="th_bt btn waves-effect waves-light" href="single_blog-full.html">Full Story</a>
+
                                </div>
+
                            </div>
+
                            <div class="item">
+
                                <a href="single_blog-full.html">
+
                                    <div class="blog_img waves-effect">
+
                                        <img src="img/blog_3.jpg" alt="">
+
                                    </div>
+
                                </a>
+
                                <div class="blog_cont">
+
                                    <ul class="blog_s">
+
                                        <li><a href="#"><i class="zmdi zmdi-account"></i>Admin</a></li>
+
                                        <li><a href="#"><i class="zmdi zmdi-calendar-alt"></i>June 18,2015</a></li>
+
                                    </ul>
+
                                    <h4><a href="single_blog-full.html">What is minimal Design</a></h4>
+
                                    <p>If you’ve followed along and done the steps above, you’ve created a good starting place.</p>
+
                                    <a class="th_bt btn waves-effect waves-light" href="single_blog-full.html">Full Story</a>
+
                                </div>
+
                            </div>
+
                            <div class="item">
+
                                <a href="single_blog-full.html">
+
                                    <div class="blog_img waves-effect">
+
                                        <img src="img/blog_1.jpg" alt="">
+
                                    </div>
+
                                </a>
+
                                <div class="blog_cont">
+
                                    <ul class="blog_s">
+
                                        <li><a href="#"><i class="zmdi zmdi-account"></i>admin</a></li>
+
                                        <li><a href="#"><i class="zmdi zmdi-calendar-alt"></i>June 18,2015</a></li>
+
                                    </ul>
+
                                    <h4>
+
                                        <a href="single_blog-full.html">What is minimal Design</a>
+
                                    </h4>
+
                                    <p>If you’ve followed along and done the steps above, you’ve created a good starting place.</p>
+
                                    <a class="th_bt btn waves-effect waves-light" href="single_blog-full.html">Full Story</a>
+
                                </div>
+
 
                             </div>
 
                             </div>
 
                         </div>
 
                         </div>
 
                     </div>
 
                     </div>
 
                 </div>
 
                 </div>
            </div>
 
        </section>
 
        <!-- ====END BLOG TABLE==== -->
 
       
 
        <!-- ====START SUBSCRIBE==== -->
 
        <section class="subscribe_area section-padding">
 
            <div class="container">
 
 
                 <div class="row">
 
                 <div class="row">
                    <div class="col-xs-12">
 
                        <div class="section_title mb80">
 
                            <h5 class="smallHd text-center">SUBSCRIBE TO</h5>
 
                            <h2 class="secHd text-center">get latest news from us</h2>
 
                        </div>
 
                    </div>                                               
 
                </div>
 
                <div class="row">
 
                    <div class="col-sm-8 col-sm-offset-2">
 
                        <div class="subform">
 
                            <form action="index.html" method="get">
 
                                <div class="input-field">
 
                                    <input id="last_name" type="email" class="validate">
 
                                    <label for="last_name"><i class="zmdi zmdi-email"></i>Enter your email</label>
 
                                </div>
 
                                <button class="th_bt btn waves-effect waves-light" type="submit">
 
                                    Subscribe<i class="zmdi zmdi-cloud-done"></i>
 
                                </button>
 
                            </form>
 
                        </div>
 
                    </div>
 
                </div>
 
            </div>
 
        </section>
 
        <!-- ====END SUBSCRIBE==== -->
 
       
 
        <!-- ====START CONTACT AREA==== -->
 
        <section id="contact" class="map-area">
 
            <div class="contact_google_map">
 
                <div id="contactgoogleMap"></div>
 
            </div>
 
            <div class="contact-area">
 
                <div class="container">
 
                    <div class="contact_text col-md-6">
 
                        <div class="section_title">
 
                            <h2 class="text-left">Get in touch</h2>
 
                            <p class="colorWh">feel free to contact us with any questions</p>
 
                        </div>
 
                        <form action="mail-process.php" method="post">
 
                            <div class="row jsSubmit_button">
 
                                <div class="input-field col-md-6">
 
                                    <input id="contact_name" type="text" class="validate" name="your_name" required>
 
                                    <label for="contact_name">
 
                                        <i class="zmdi zmdi-account"></i>Your Name
 
                                        <span>*</span>
 
                                    </label>
 
                                </div>
 
                                <div class="input-field col-md-6">
 
                                    <input id="contact_email" type="email" class="validate" name="your_mail" required>
 
                                        <label for="contact_email"><i class="zmdi zmdi-email"></i>Your Email
 
                                        <span>*</span>
 
                                    </label>
 
                                </div>
 
                                <div class="input-field col-md-12">
 
                                    <textarea id="textarea1" name="your_text" class="materialize-textarea" required></textarea>
 
                                    <label for="textarea1"><i class="zmdi zmdi-border-color"></i>Your Massage
 
                                        <span>*</span>
 
                                    </label>
 
                                   
 
                                </div>
 
                                <div class="col-md-12">
 
                                    <button type="submit" class="th_bt btn waves-effect" name="submit_btn" disabled>
 
                                        send<i class="zmdi zmdi-mail-send"></i>
 
                                    </button>
 
                                </div>
 
                            </div>
 
                        </form>
 
                    </div>
 
                </div>
 
            </div>
 
        </section>
 
        <!-- ====END CONTACT==== -->
 
       
 
        <!-- ====START SOCIAL Link==== -->
 
        <div class="footer_social">
 
            <div class="container-fluid">
 
                <div class="row">
 
                    <ul class="ft_top clearfix">
 
                        <li class="waves-effect waves-light">
 
                            <a href="#" target="_blank">
 
                                <i class="zmdi zmdi-facebook "></i>Facebook
 
                            </a>
 
                        </li>
 
                        <li class="waves-effect waves-light">
 
                            <a href="#" target="_blank">
 
                                <i class="zmdi zmdi-twitter"></i>Twitter
 
                            </a>
 
                        </li>
 
                        <li class="waves-effect waves-light">
 
                            <a href="#" target="_blank">
 
                                <i class="zmdi zmdi-flickr"></i>Flickr
 
                            </a>
 
                        </li>
 
                        <li class="waves-effect waves-light">
 
                            <a href="#" target="_blank">
 
                                <i class="zmdi zmdi-linkedin"></i>LinkedIn
 
                            </a>
 
                        </li>
 
                        <li class="waves-effect waves-light">
 
                            <a href="#" target="_blank">
 
                                <i class="zmdi zmdi-dribbble"></i>Dribble
 
                            </a>
 
                        </li>
 
                        <li class="waves-effect waves-light">
 
                            <a href="#" target="_blank">
 
                                <i class="zmdi zmdi-vimeo"></i>Vimeo
 
                            </a>
 
                        </li>
 
                    </ul>
 
                </div>
 
            </div>
 
        </div>
 
        <!-- ====END FOOTER TOP==== -->
 
       
 
        <!-- ====START FOOTER AREA==== -->
 
        <footer class="footer_area">
 
            <div class="footer_middle">
 
                <div class="container">
 
                    <div class="row">
 
                        <div class="col-xs-12">
 
                            <div class="scroll_area">
 
                                <div class="sroll_top">
 
                                    <i class="zmdi zmdi-chevron-up btn waves-effect"></i>   
 
                                </div>
 
                            </div>
 
                        </div>
 
                    </div>
 
 
                     <div class="row">
 
                     <div class="row">
 
                         <div class="col-lg-5 col-md-5 col-sm-12">
 
                         <div class="col-lg-5 col-md-5 col-sm-12">
 
                             <div class="middle_content">
 
                             <div class="middle_content">
                                 <h4>More about us</h4>
+
                                 <h4>iGEM IONIS</h4>
                                 <p>If you’ve followed along and done the steps above, you’ve created a good starting place. You’re going to need to make sure your pages are optimized properly. This will ensure you get your page ranked high in the search engines. ou’re going to need to make sure your pages are optimized properly.
+
                                 <p> We're a group of six different schools from the IONIS Education Group. For this
            Read More</p>
+
                                    competition we wanted to take advantage of the multiple schools and fields of activity
                              <a href="#">Read More</a>
+
                                    given by the IONIS education group to create a solid project.</p>
 +
                                <a href="https://2016.igem.org/Team:Ionis_Paris/Team">Read More</a>
 
                             </div>
 
                             </div>
 
                         </div>
 
                         </div>
 +
 
                         <div class="col-lg-3 col-lg-offset-1 col-md-4 col-sm-7">
 
                         <div class="col-lg-3 col-lg-offset-1 col-md-4 col-sm-7">
 
                             <div class="footer_Widgets">
 
                             <div class="footer_Widgets">
Line 1,473: Line 525:
 
                                     <ul>
 
                                     <ul>
 
                                         <li><i class="zmdi zmdi-pin"></i>
 
                                         <li><i class="zmdi zmdi-pin"></i>
                                             <span>Location: Lorance Road 542B,5248 MT, Wordwide Country</span>
+
                                             <span>Location: 66 Rue Guy Môquet, 94800 Villejuif, France</span>
                                        </li>
+
                                        <li><i class="zmdi zmdi-phone"></i>
+
                                            <a href="tel:123-456-7890">Phone: 123-456-7890</a>
+
 
                                         </li>
 
                                         </li>
 +
 
                                         <li><i class="zmdi zmdi-email"></i>
 
                                         <li><i class="zmdi zmdi-email"></i>
                                             <a href="mailto:contact@domain.com">email: contact@domain.com</a>
+
                                             <a href="mailto:igem.ionis@gmail.com">email: igem.ionis@gmail.com</a>
                                        </li>
+
                                        <li><i class="zmdi zmdi-globe"></i>
+
                                            <a href="#">www.domain.com</a>
+
 
                                         </li>
 
                                         </li>
 +
 
                                     </ul>
 
                                     </ul>
 
                                 </div>
 
                                 </div>
 
                             </div>
 
                             </div>
 
                         </div>
 
                         </div>
                        <div class="col-lg-3 col-md-3 col-sm-5">
+
                    <div class="col-lg-3 col-md-3 col-sm-5">
 
                             <div class="footer_Widgets">
 
                             <div class="footer_Widgets">
                                 <h4>Galleries</h4>
+
                                 <h4>Download the app</h4>
                                 <figure class="widget_gallery">
+
                                 <a href="https://itunes.apple.com/us/app/quantifly/id1166875690?ls=1&mt=8"
                                    <div class="RXcircleEffect"></div>
+
                                  target="_blank" style="target-new: tab;">
                                    <img src="img/gallery_1.jpg" alt="" />
+
                                    <figure class="widget_gallery">
                                    <figcaption>
+
                                        <div class="RXcircleEffect"></div>
                                         <a class="veno vbox-item" href="img/gallery_1.jpg" data-gall="group_4">
+
                                        <img src="https://static.igem.org/mediawiki/2016/8/8d/IONIS_IGEM_paris_logo_apple.png"
 +
                                            alt="" />
 +
                                         <figcaption>
 
                                             <i class="zmdi zmdi-link"></i>
 
                                             <i class="zmdi zmdi-link"></i>
                                         </a>
+
                                         </figcaption>
                                     </figcaption>
+
                                     </figure>
                                 </figure>
+
                                 </a>
                                 <figure class="widget_gallery">
+
                                 <a href="https://play.google.com/store/apps/details?id=fr.plnech.quantifly&hl=en"
                                    <div class="RXcircleEffect"></div>
+
                                  target="_blank" style="target-new: tab;">
                                    <img src="img/gallery_2.jpg" alt="" />
+
                                    <figure class="widget_gallery">
                                    <figcaption>
+
                                        <div class="RXcircleEffect"></div>
                                         <a class="veno vbox-item" href="img/gallery_2.jpg" data-gall="group_4">
+
                                        <img src="https://static.igem.org/mediawiki/2016/6/65/IONIS_IGEM_paris_google_play.png"
 +
                                            alt="" />
 +
                                         <figcaption>
 
                                             <i class="zmdi zmdi-link"></i>
 
                                             <i class="zmdi zmdi-link"></i>
                                         </a>
+
                                         </figcaption>
                                    </figcaption>
+
                                     </figure>
                                </figure>
+
                                 </a>
                                <figure class="widget_gallery">
+
 
                                     <div class="RXcircleEffect"></div>
+
                       
                                    <img src="img/gallery_3.jpg" alt="" />
+
                                    <figcaption>
+
                                        <a class="veno vbox-item" href="img/gallery_3.jpg" data-gall="group_4">
+
                                            <i class="zmdi zmdi-link"></i>
+
                                        </a>
+
                                    </figcaption>
+
                                </figure>
+
                                 <figure class="widget_gallery">
+
                                    <div class="RXcircleEffect"></div>
+
                                    <img src="img/gallery_4.jpg" alt="" />
+
                                    <figcaption>
+
                                        <a class="veno vbox-item" href="img/gallery_4.jpg" data-gall="group_4">
+
                                            <i class="zmdi zmdi-link"></i>
+
                                        </a>
+
                                    </figcaption>
+
                                </figure>
+
                                <figure class="widget_gallery">
+
                                    <div class="RXcircleEffect"></div>
+
                                    <img src="img/gallery_5.jpg" alt="" />
+
                                    <figcaption>
+
                                        <a class="veno vbox-item" href="img/gallery_5.jpg" data-gall="group_4">
+
                                            <i class="zmdi zmdi-link"></i>
+
                                        </a>
+
                                    </figcaption>
+
                                </figure>
+
                                <figure class="widget_gallery">
+
                                    <div class="RXcircleEffect"></div>
+
                                    <img src="img/gallery_6.jpg" alt="" />
+
                                    <figcaption>
+
                                        <a class="veno vbox-item" href="img/gallery_6.jpg" data-gall="group_4">
+
                                            <i class="zmdi zmdi-link"></i>
+
                                        </a>
+
                                    </figcaption>
+
                                </figure>
+
 
                             </div>
 
                             </div>
 
                         </div>  
 
                         </div>  
 +
 
                     </div>
 
                     </div>
 +
 
                 </div>
 
                 </div>
 
             </div>
 
             </div>
Line 1,556: Line 576:
 
                             <div class="col-md-7 fix_p_l">
 
                             <div class="col-md-7 fix_p_l">
 
                                 <nav>
 
                                 <nav>
                                     <ul class="ft_bottom">    
+
                                     <ul class="ft_bottom">
                                         <li><a href="#">Home</a></li>
+
                                         <li><a href="https://2016.igem.org/Team:Ionis_Paris">Home</a></li>
                                         <li><a href="#">Services</a></li>
+
                                         <li><a href="https://2016.igem.org/Team:Ionis_Paris/Working_at_La_Paillasse">in the Lab</a></li>
                                         <li><a href="#"> About </a></li>
+
                                         <li><a href="https://2016.igem.org/Team:Ionis_Paris/Measurement"> Side Projects</a></li>
                                         <li><a href="#">Portfolio</a></li>
+
                                         <li><a href="https://2016.igem.org/Team:Ionis_Paris/Parts">Results</a></li>
                                         <li><a href="#">Blog </a></li>
+
                                         <li><a href="https://2016.igem.org/Team:Ionis_Paris/HPintro">Human
                                         <li><a href="#">Contact US</a></li>
+
                                            Practice</a></li>
 +
                                         <li><a href="https://2016.igem.org/Team:Ionis_Paris/Team">Team</a></li>
 
                                     </ul>
 
                                     </ul>
 
                                 </nav>
 
                                 </nav>
Line 1,568: Line 589:
 
                             <div class="col-md-5 fix_p">
 
                             <div class="col-md-5 fix_p">
 
                                 <div class="ft_paragraph">
 
                                 <div class="ft_paragraph">
                                     <p>©2016 Design by <a href="https://www.behance.net/googoling">Faridul Haque</a> and Develop by <a href="http://themeebit.com">ThemeeBiT</a>.</p>  
+
                                     <p>©IONIS_IGEM_2016</a>.</p>
 
                                 </div>
 
                                 </div>
                             </div>
+
                             </div>
 
                         </div>
 
                         </div>
 
                     </div>
 
                     </div>
 
                 </div>
 
                 </div>
             </div>            
+
             </div>
        </footer>
+
    </footer>
        <!-- ====END FOOTER AREA==== -->
+
    <!-- ====END FOOTER AREA==== -->
       
+
        <!-- ====jQuery Latest version==== -->
+
        <script src="js/vendor/jquery-1.12.0.min.js"></script>
+
  
        <!-- ====Google Maps API==== -->
+
    <!-- ====Google Maps API==== -->
        <script src="https://maps.googleapis.com/maps/api/js"></script>
+
    <script src="https://maps.googleapis.com/maps/api/js"></script>
  
        <!-- ====Material==== -->
+
    <!-- Nos scripts -->
        <script src="js/mdb.min.js"></script>
+
    <script type="text/javascript" src="https://2016.igem.org/wiki/index.php?title=Template:IONIS_PARIS_JS&action=raw&ctype=text/javascript"></script>
  
        <!-- ====Bootstrap JS==== -->
 
        <script src="js/bootstrap.min.js"></script>
 
 
        <!-- ====jQuery Counterup==== -->
 
        <script src="js/waypoints.min.js"></script>
 
        <script src="js/jquery.counterup.min.js"></script>
 
       
 
        <!-- ====jQuery Meanmenu==== -->
 
        <script src="js/jquery.meanmenu.min.js"></script>
 
 
        <!-- ====jQuery easing==== -->
 
        <script src="js/jquery.easing.1.3.min.js"></script>
 
 
        <!-- ====jQuery owl carousel==== -->
 
        <script src="js/owl.carousel.min.js"></script>
 
 
        <!-- ====jQuery parallax==== -->
 
        <script src="js/jquery.parallax-1.1.3.js"></script>
 
 
        <!-- ====jQuery isotop==== -->
 
        <script src="js/isotope.pkgd.min.js"></script>
 
       
 
        <!-- ====jQuery Packery==== -->
 
        <script src="js/packery.js"></script>
 
 
        <!-- ====jQuery VenoBox==== -->
 
        <script src="js/venobox.min.js"></script>
 
 
        <!-- ====jQuery appear and knob==== -->
 
        <script src="js/jquery.knob.min.js"></script>
 
 
        <!--Opacity & Other IE fix for older browser-->
 
        <!--[if lte IE 8]>
 
            <script type="text/javascript" src="js/ie-opacity-polyfill.js"></script>
 
        <![endif]-->    
 
 
        <!-- ====jQuery main script==== -->
 
        <script src="js/main.js"></script>
 
    </body>
 
 
</html>
 
</html>
 
{{Ionis_Paris_stylecss}}
 

Latest revision as of 01:06, 2 December 2016

What is

Quantifly ?

(VOC)

VOLATILE ORGANIC COMPOUNDS

Nowadays, Volatile Organic Compounds (VOCs) are commonly found pollutants that have been proven present in a wide variety of everyday life situations. Though they are dangerous and present almost everywhere, VOCs are not efficiently detected. Usual detection devices are very unprecise or require a very long exposure time.

Bacteria

Biosensor

This is why we developed the Quantifly project : a combination of a bacterial biosensor, perfectly adapted to on-field measurements, and an innovative drone that will allow us to easily and rapidly quantify the amount of VOCs in the air. The biosensor relies on bioluminescence, a biochemical phenomenon that is commonly used in cell imaging. We are trying to develop a new application for bioluminescence that should allow us to create a biosensor of a new kind, entirely different from the existing devices.

drone
Bacteria

Drone

Concerning the drone, it is designed to safely contain our organisms and carry them on the field, thus acting as a mobile detection platform.

Check out the Video