Difference between revisions of "Team:Dalhousie"

Line 1: Line 1:
 
<html>
 
<html>
 
<head>
 
<head>
 +
<style>
 +
#bg-video {
 +
        position: fixed;
 +
        top: 0;
 +
        right: 0;
 +
        bottom: 0px;
 +
        left: 0;
 +
        overflow: hidden;
 +
        z-index: -100;
 +
        width:100%;
 +
        height:100%;
 +
 +
}
 +
 +
 +
</style>
 +
 
<!--glyphicons-->
 
<!--glyphicons-->
 
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
 
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
Line 6: Line 23:
 
   <link rel="stylesheet" href="https://2017.igem.org/Team:Dalhousie/libraries/css/fonts?action=raw&ctype=text/css" />
 
   <link rel="stylesheet" href="https://2017.igem.org/Team:Dalhousie/libraries/css/fonts?action=raw&ctype=text/css" />
 
<link rel="stylesheet" href="https://2017.igem.org/Team:Dalhousie/css3?action=raw&ctype=text/css" />
 
<link rel="stylesheet" href="https://2017.igem.org/Team:Dalhousie/css3?action=raw&ctype=text/css" />
 +
 +
<!--------------------oldnavbar--------------->
 +
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
 +
  
 
<!-------------------------------------need this--------------------------->
 
<!-------------------------------------need this--------------------------->
Line 11: Line 32:
 
#home_logo, #sideMenu { display:none; }
 
#home_logo, #sideMenu { display:none; }
 
#sideMenu, #top_title, .patrollink  {display:none;}
 
#sideMenu, #top_title, .patrollink  {display:none;}
−
#content { width:100%; padding:0px;  margin-top:-20px; margin-left:0px; background-color: #0A0606;}
+
#content { width:100%; padding:0px;  margin-top:-20px; margin-left:0px; background-color: black;}
−
body {background-color:black; }
+
body {background-color:white; height:100%; }
−
#bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px;  background-color: transparent;}
+
#bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px;  background-color: transparent; z-index:100;}
 
         .jumbotron {
 
         .jumbotron {
−
             height: 720px;
+
             height: 850px;
 
             position: relative;
 
             position: relative;
−
            z-index:-101;
+
         
 
             }
 
             }
−
#bg-video {
+
.navbar-default .navbar-nav>.active>a, .nav > li > a:hover, .nav > li > a:focus {
−
        position: fixed;
+
  background-color: #C1D35D;
−
        top: 0;
+
  text-decoration: none;
−
        right: 0;
+
−
        bottom: 0;
+
−
        left: 0;
+
−
        overflow: hidden;
+
−
        z-index: -100;
+
−
        width:100%;
+
 
}
 
}
−
  </style>
+
</style>
−
 
+
−
<!----------------------------------------------navbarshit---------------------------------------------->
+
−
 
+
  
−
  <meta charset="utf-8">
 
−
  <meta name="viewport" content="width=device-width, initial-scale=1">
 
−
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
 
−
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
 
−
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
 
 
</head>
 
</head>
  
−
 
 
<body>
 
<body>
  
  
−
<!--------------------------------------------------------------video------------------------------------------------------------------------------>
+
<!-------------------navbar---------------------->
−
 
+
<div id="nav" class="noBackground" style="width:100%; z-index:100;" >
−
<div class="jumbotron text-center " style= "background-color: transparent;">
+
            <div class="inner" >
−
   
+
<div id="navWrap">
−
<video class="bg-video" style="top:0px;left:0px;position:absolute;width:100%;z-index:-1;" autoplay="true" loop="loop" preload="metadata" muted="muted">
+
    <nav >
−
        <source src="https://static.igem.org/mediawiki/2017/7/7b/Dalhousie_background.mp4" type="video/mp4" />
+
  <div class="container-fluid">
−
    </video>
+
    <ul class="nav navbar-nav navbar-center">
−
 
+
−
 
+
−
 
+
−
 
+
−
<div id="page-wrap"style="padding-top:10px;  ">
+
−
 
+
−
  <h1  style="color:white;"> Dalhousie iGEM </h1>
+
−
 
+
−
 
+
−
 
+
−
 
+
−
 
+
−
 
+
−
  </div>
+
−
</div>
+
−
 
+
−
                     
+
−
 
+
−
 
+
−
 
+
−
<div class="container" id="projectdescript" style="padding-bottom:50px; padding-top:50px; padding-right:0px; padding-left:0px;  background-color: transparent;">
+
−
 
+
−
 
+
  
−
             
+
      <li class="active" ><a href="https://2017.igem.org/Team:Dalhousie/test3" style=" color: white;">Home</a></li>
−
<h4 style="text-align:center; color: white;">Background</h4>
+
−
<p style="text-align:center; color: white;">
+
−
Canada’s forests represent not only an established source of economic revenue, but also a potential source for biofuel substrate. Ligno-cellulosic by-products from pulp and paper processing are removed using chemicals, heat, and water. Microbial cellulose-degrading enzymes are high-value targets for industrial applications. Focused on innovative applications of synthetic biology, the undergraduate Dalhousie iGEM team has undertaken a multi-year project to harness the degradative capacity of microorganisms to convert cellulose into ethanol for biofuel applications. Advances in DNA sequencing technology and bioinformatics have revolutionized our ability to identify useful genes in complex biological samples. We hypothesize that the porcupine microbiome, which includes microorganisms capable of digesting bark and tree resin, will be a rich source of these useful genes. If our hypothesis is correct, mining the porcupine microbiome has the advantage of finding a suite of enzymes that have evolved to work in concert to efficiently degrade cellulose. </p>
+
−
+
−
<h4 style="text-align:center; color: white;">The Project</h4>
+
−
<p style="text-align:center; color: white;">
+
−
Using a combination of metagenomic library construction and bioinformatic analysis we aim to find known cellulolytic enzymes as well as discover novel enzymes.
+
−
Screening of our metagenomic library will allow us to look for a diverse selection of enzymes, including cellulolytic and lignolytic ones by plating on cellulose-only media. The clones that grow can be sequenced for confirmation and cloned into biobricks.
+
−
Our new bioinformatic pipeline now allows us to look for conserved domains rather than known enzymes. This is extremely powerful as it may allow us to discover new enzymes that share catalytic domains with cellulases but are otherwise totally novel.
+
−
The goal of this project is to construct a bioreactor where cellulose would be the input, D-glucose the output and E.coli expressing a suite of cellulolytic enzymes would be the workhorse, converting one to the other. Future goals would be to combine this in co-culture with yeast for the last step in bio-ethanol production.</p>
+
−
</div></div>
+
  
−
 
+
<li class="dropdown" >
−
 
+
         <a class="dropdown-toggle" data-toggle="dropdown" href="#" style=" color: white;">Project
−
 
+
         </a>
−
 
+
         <ul class="dropdown-menu" style=" background-color: rgba(193,211,93,0.8);">
−
    <!------------------------------------------------------------------------------- Navbar -------------------------------------------------------------------------->
+
           <li><a href="https://2017.igem.org/Team:Dalhousie/Description" >Description</a></li>
−
<nav class="navbar navbar-inverse navbar-fixed-bottom">
+
           <li><a href="https://2017.igem.org/Team:Dalhousie/Design">Design</a></li>
−
  <div class="container-fluid">
+
<li><a href="https://2017.igem.org/Team:Dalhousie/Requirements">Requirements</a></li>
−
   
+
−
    <ul class="nav navbar-nav navbar-center">
+
−
      <li class="active"><a href="https://2017.igem.org/Team:Dalhousie/test3">Home</a></li>
+
−
     
+
−
 
+
−
<li class="dropdown">
+
−
         <a class="dropdown-toggle" data-toggle="dropdown" href="#">The Project
+
−
         <span class="caret"></span></a>
+
−
         <ul class="dropdown-menu">
+
−
          <li><a href="#">Description</a></li>
+
−
           <li><a href="#">Design</a></li>
+
−
          <li><a href="#">Experiments</a></li>
+
−
          <li><a href="#">Notebook</a></li>
+
−
           <li><a href="#">Interlab</a></li>
+
−
          <li><a href="#">Contribution</a></li>
+
−
          <li><a href="#">Model</a></li>
+
−
          <li><a href="#">Results</a></li>
+
−
          <li><a href="#">Demonstrate</a></li>
+
−
        <li><a href="#">Improve</a></li>
+
−
          <li><a href="#">Attributions</a></li>
+
 
         </ul>
 
         </ul>
 
       </li>
 
       </li>
  
−
     
 
 
<li class="dropdown">
 
<li class="dropdown">
−
         <a class="dropdown-toggle" data-toggle="dropdown" href="#">Our Team
+
         <a class="dropdown-toggle" data-toggle="dropdown" href="#" style=" color: white;">Results
−
        <span class="caret"></span></a>
+
        </a>
−
         <ul class="dropdown-menu">
+
         <ul class="dropdown-menu" style=" background-color: rgba(193,211,93,0.8);">
−
           <li><a href="#">Team</a></li>
+
           <li><a href="https://2017.igem.org/Team:Dalhousie/InterLab">Interlab</a></li>
−
          <li><a href="#">Collaborations</a></li>
+
  <li><a href="https://2017.igem.org/Team:Dalhousie/Results">Results</a></li>
 
         </ul>
 
         </ul>
−
      </li>
+
</li>  
  
 +
 
 
<li class="dropdown">
 
<li class="dropdown">
−
         <a class="dropdown-toggle" data-toggle="dropdown" href="#">Parts
+
         <a class="dropdown-toggle" data-toggle="dropdown" href="#" style=" color: white;">Team
−
        <span class="caret"></span></a>
+
        </a>
−
         <ul class="dropdown-menu">
+
         <ul class="dropdown-menu" style=" background-color: rgba(193,211,93,0.8);">
−
           <li><a href="#">Parts</a></li>
+
           <li><a href="https://2017.igem.org/Team:Dalhousie/Team">Team</a></li>
−
           <li><a href="#">Basic Parts</a></li>
+
           <li><a href="https://2017.igem.org/Team:Dalhousie/Collaborations">Collaborations</a></li>
−
           <li><a href="#">Composite Parts</a></li>
+
           <li><a href="https://2017.igem.org/Team:Dalhousie/Attributions">Attributions</a></li>
−
           <li><a href="#">Part Collections</a></li>
+
           <li><a href="https://2017.igem.org/Team:Dalhousie/Sponsors">Sponsors</a></li>
 
         </ul>
 
         </ul>
−
      </li>
+
</li>
−
 
+
−
      <li><a href="#">Safety</a></li>
+
  
 
<li class="dropdown">
 
<li class="dropdown">
−
         <a class="dropdown-toggle" data-toggle="dropdown" href="#">Human Practices
+
         <a class="dropdown-toggle" data-toggle="dropdown" href="#" style=" color: white;">Human Practices
−
         <span class="caret"></span></a>
+
         </a>
−
         <ul class="dropdown-menu">
+
         <ul class="dropdown-menu" style=" background-color: rgba(193,211,93,0.8);">
−
          <li><a href="#">Silver HP</a></li>
+
        <li><a href="https://2017.igem.org/Team:Dalhousie/Human_Practices">Summary</a></li>
−
           <li><a href="#">Integrated and Gold</a></li>
+
           <li><a href="https://2017.igem.org/Team:Dalhousie/HP/Silver">Silver HP</a></li>
−
           <li><a href="#">Public Engagement</a></li>
+
           <li><a href="https://2017.igem.org/Team:Dalhousie/HP/Gold_Integrated">Integrated and Gold</a></li>
−
           <li><a href="#">Part Collections</a></li>
+
           <li><a href="https://2017.igem.org/Team:Dalhousie/Engagement">Public Engagement</a></li>
 +
 
 
         </ul>
 
         </ul>
 
       </li>
 
       </li>
  
 
<li class="dropdown">
 
<li class="dropdown">
−
         <a class="dropdown-toggle" data-toggle="dropdown" href="#">Awards
+
         <a class="dropdown-toggle" data-toggle="dropdown" href="#" style=" color: white;">Lab
−
         <span class="caret"></span></a>
+
         </a>
−
        <ul class="dropdown-menu">
+
        <ul class="dropdown-menu" style=" background-color: rgba(193,211,93,0.8);">
−
          <li><a href="#">Applied Design</a></li>
+
          <li><a href="https://2017.igem.org/Team:Dalhousie/Parts">Parts</a></li>
−
           <li><a href="#">Entrepreneurship</a></li>
+
          <li><a href="https://2017.igem.org/Team:Dalhousie/Safety" >Safety</a></li>
 +
            <li><a href="https://2017.igem.org/Team:Dalhousie/Experiments">Experiments</a></li>
 +
           <li><a href="https://2017.igem.org/Team:Dalhousie/Notebook">Notebook</a></li>
 +
<li><a href="https://2017.igem.org/Team:Dalhousie/Improve">Improve</a></li>
 
         </ul>
 
         </ul>
 
       </li>
 
       </li>
 +
 +
     
 +
  
  
Line 170: Line 127:
 
<ul class="nav navbar-nav navbar-right">
 
<ul class="nav navbar-nav navbar-right">
 
     <div class="navbar-header">
 
     <div class="navbar-header">
−
       <a class="navbar-brand" >Contact us today </a>
+
       <a class="navbar-brand" style=" color: white;">Contact us today </a>
 
     </div>
 
     </div>
 
<li>
 
<li>
−
                         <a href="mailto:igemdalhousie@gmail.com" ><i class="fa fa-envelope-o fa-fw"></i> <span class="network-name"></span></a>
+
                         <a href="mailto:igemdalhousie@gmail.com" ><i class="fa fa-envelope-o fa-fw" style=" color: white;"  ></i> <span class="network-name"></span></a>
 
                     </li>
 
                     </li>
 
<li>
 
<li>
−
                         <a href="https://twitter.com/dalhousie_igem?lang=en" ><i class="fa fa-twitter fa-fw"></i> <span class="network-name"></span></a>
+
                         <a target="_blank" href="https://twitter.com/dalhousie_igem?lang=en" ><i class="fa fa-twitter fa-fw" style=" color: white;" ></i> <span class="network-name"></span></a>
 
                     </li>
 
                     </li>
 
                     <li>
 
                     <li>
−
                         <a href="https://www.facebook.com/Dalhousie.iGEM/" ><i class="fa fa-facebook fa-fw"></i> <span class="network-name"></span></a>
+
                         <a target="_blank" href="https://www.facebook.com/Dalhousie.iGEM/" ><i class="fa fa-facebook fa-fw" style=" color: white;" ></i> <span class="network-name"></span></a>
 
                     </li>
 
                     </li>
 +
 
     </ul>
 
     </ul>
 
   </div>
 
   </div>
 
</nav>
 
</nav>
 +
</div>
 +
            </div>
 +
        </div>
 +
 +
 +
 +
        <div class="panel" id="panel1" >
 +
 +
            <div class="inner" >
 +
<div class="top" ><div class="title" >Dalhousie iGEM 2017</div></div>
 +
 +
 
 +
 +
<video  id= "myVideo" class="bg-video" style="top:0px; left:0px; padding-bottom:0px; position:fixed; width:100%;z-index:-100; " autoplay="true" loop="loop" preload="metadata" muted="muted">
 +
        <source src="https://static.igem.org/mediawiki/2017/6/68/Thisfinal.mp4" type="video/mp4" />
 +
 +
 +
 +
<!--------------------------------fade title---------------------------->
 +
<style>
 +
 +
body {
 +
  margin: 0;
 +
  height: 10px;
 +
}
 +
 +
.top {
 +
 +
  margin-top: 350px;
 +
  position: absolute;
 +
width:65%;
 +
  left:250px;
 +
  background-color: transparent;
 +
  height: 150px;
 +
  text-align: center;
 +
  font-family: 'Trebuchet MS';
 +
  font-size: 80px;
 +
  font-weight: 400;
 +
  color: white;
 +
line-height: 60px;
 +
}
 +
 +
.title {
 +
  position: relative;
 +
  top: 10%;
 +
 +
  left: 0px;
 +
}
 +
 +
</style>
 +
 +
 +
<!---------------------------------------------------------------------------------this------------------------------------------------------------------------------------------->
 +
<script> $(window).scroll(function(){
 +
    $(".top").css("opacity", 1 - $(window).scrollTop() / 300);
 +
  });
 +
</script>
 +
 +
 +
            </div>
 +
        </div>
 +
 +
 +
 +
 +
        <div class="panel" id="panel2">
 +
<div style=" border: 1px solid #000; margin: 50px; padding: 30px; background-color: rgba(35,47,19,1);">
 +
 +
Welcome! </br>
 +
The goal of our project is to convert cellulose into glucose, which can be used for biofuel. </br>
 +
Let us show you how! </br>
 +
</div>
 +
            <div class="inner">
 +
 +
 +
  <!-- Vertical Timeline -->
 +
  <section id="conference-timeline">
 +
 
 +
    <div class="conference-center-line"></div>
 +
    <div class="conference-timeline-content">
 +
      <!-- Article -->
 +
      <div class="timeline-article">
 +
        <div class="content-left-container" >
 +
          <div class="content-left" >
 +
            <p>Softwood waste from the lumber industry contains cellulose, which can be turned into glucose and used to make biofuel.  <span class="article-number">01</span></p>
 +
          </div>
 +
       
 +
        </div>
 +
  <div class="content-right-container">
 +
         
 +
       
 +
        </div>
 +
        <div class="meta-date">
 +
          <img src= "https://static.igem.org/mediawiki/2017/a/ab/Lumber.jpg" height="50%" width="60%"style="margin-top:15px;" >
 +
        </div>
 +
      </div>
 +
      <!-- // Article -->
 +
     
 +
      <!-- Article -->
 +
      <div class="timeline-article">
 +
        <div class="content-left-container">
 +
        </div>
 +
 +
        <div class="content-right-container">
 +
          <div class="content-right">
 +
            <p>We hypothesized that the porcupine microbiome must contain an enzyme that can break down cellulose, as bark is food. <span class="article-number">02</span></p>
 +
          </div>
 +
       
 +
        </div>
 +
        <div class="meta-date" style="background-color: white;">
 +
  <img src= "https://static.igem.org/mediawiki/2017/6/67/Porcupiner.png" height="60%" width="75%"style="margin-top:15px;" >
 +
        </div>
 +
      </div>
 +
      <!-- // Article -->
 +
     
 +
 +
      <!-- Article -->
 +
      <div class="timeline-article">
 +
        <div class="content-left-container">
 +
          <div class="content-left">
 +
            <p>We mined the porcupine’s microbiome to identify the enzyme that was able to break down wood.  <span class="article-number">03</span></p>
 +
          </div>
 
      
 
      
−
             
+
        </div>
 +
        <div class="content-right-container">
 +
         
 +
 +
        </div>
 +
        <div class="meta-date">
 +
  <img src= "https://static.igem.org/mediawiki/2017/4/48/Testtubee.png" height="65%" width="70%"style="margin-top:15px;" >
 +
        </div>
 +
      </div>
 +
      <!-- // Article -->
 +
<!-- Article -->
 +
      <div class="timeline-article">
 +
        <div class="content-left-container">
 +
         
 +
       
 +
        </div>
 +
        <div class="content-right-container">
 +
        <div class="content-right">
 +
            <p>We created a metagenomic library of the genes able to code this enzyme as well as novel enzymes. <span class="article-number">04</span></p>
 +
          </div>
 +
       
 +
        </div>
 +
        <div class="meta-date" style="background-color: white;">
 +
    <img src= "https://static.igem.org/mediawiki/2017/e/ef/Comp.jpg" height="60%" width="70%"style="margin-top:15px;" >
 +
        </div>
 +
      </div>
 +
      <!-- // Article -->
 +
<!-- Article -->
 +
      <div class="timeline-article">
 +
        <div class="content-left-container">
 +
        <div class="content-left">
 +
            <p>We put these genes into E.coli to see if they could then digest cellulose down. <span class="article-number">05</span></p>
 +
          </div>
 +
   
 +
        </div>
 +
        <div class="content-right-container">
 +
         
 +
 +
        </div>
 +
        <div class="meta-date">
 +
    <img src= "https://static.igem.org/mediawiki/2017/8/8a/Yy.jpg" height="50%" width="60%"style="margin-top:15px;" >
 +
        </div>
 +
      </div>
 +
      <!-- // Article -->
 +
<!-- Article -->
 +
      <div class="timeline-article">
 +
        <div class="content-left-container">
 +
         
 +
       
 +
        </div>
 +
        <div class="content-right-container">
 +
        <div class="content-right">
 +
            <p>We put the E.coli into a bioreactor with cellulose to see if it gets broken down. In the future this can be combined with yeast to transform in finally into biofuel! <span class="article-number">06</span></p>
 +
          </div>
 +
       
 +
        </div>
 +
        <div class="meta-date" style="background-color: white;">
 +
        <img src= "https://static.igem.org/mediawiki/2017/a/ab/Lumber.jpg" height="50%" width="60%"style="margin-top:15px;" >
 +
        </div>
 +
      </div>
 +
      <!-- // Article -->
 +
    </div>
 +
 
 +
  </section>
 +
  <!-- // Vertical Timeline -->
 +
 
 +
  <style>
 +
body {
 +
  background: #e6e6e6;
 +
  font-family: "Roboto", sans-serif;
 +
  font-weight: 400;
 +
}
 +
 
 +
/*===== Vertical Timeline =====*/
 +
#conference-timeline {
 +
  position: relative;
 +
  max-width: 920px;
 +
  width: 100%;
 +
  margin: 0 auto;
 +
}
 +
#conference-timeline .timeline-start,
 +
#conference-timeline .timeline-end {
 +
  display: table;
 +
  font-family: "Roboto", sans-serif;
 +
  font-size: 18px;
 +
  font-weight: 900;
 +
  text-transform: uppercase;
 +
  background: rgba(35,47,19,1);
 +
  padding: 15px 23px;
 +
  color: #fff;
 +
  max-width: 5%;
 +
  width: 100%;
 +
  text-align: center;
 +
  margin: 0 auto;
 +
}
 +
#conference-timeline .conference-center-line {
 +
  position: absolute;
 +
  width: 3px;
 +
  height: 100%;
 +
  top: 0;
 +
  left: 50%;
 +
  margin-left: -2px;
 +
  background: #232F13;
 +
  z-index: -1;
 +
}
 +
#conference-timeline .conference-timeline-content {
 +
  padding-top: 67px;
 +
  padding-bottom: 67px;
 +
}
 +
.timeline-article {
 +
  width: 100%;
 +
  height: 100%;
 +
  position: relative;
 +
  overflow: hidden;
 +
  margin: 20px 0;
 +
}
 +
.timeline-article .content-left-container,
 +
.timeline-article .content-right-container {
 +
  max-width: 44%;
 +
  width: 100%;
 +
 +
}
 +
.timeline-article .timeline-author {
 +
  display: block;
 +
  font-weight: 400;
 +
  font-size: 14px;
 +
  line-height: 24px;
 +
  color: white;
 +
  text-align: right;
 +
}
 +
.timeline-article .content-left,
 +
.timeline-article .content-right {
 +
  position: relative;
 +
  width: auto;
 +
  border: 1px solid #000;
 +
  background-color: rgba(35,47,19,1);
 +
  box-shadow: 0 1px 3px rgba(0,0,0,0.9);
 +
  padding: 27px 25px;
 +
}
 +
.timeline-article p {
 +
  margin: 0 0 0 60px;
 +
  padding: 0;
 +
  font-weight: 400;
 +
  color: white;
 +
  font-size: 14px;
 +
  line-height: 24px;
 +
  position: relative;
 +
}
 +
.timeline-article p span.article-number {
 +
  position: absolute;
 +
  font-weight: 300;
 +
  font-size: 44px;
 +
  top: 10px;
 +
  left: -60px;
 +
  color: white;
 +
}
 +
.timeline-article .content-left-container {
 +
  float: left;
 +
}
 +
.timeline-article .content-right-container {
 +
  float: right;
 +
 
 +
}
 +
.timeline-article .content-left:before,
 +
.timeline-article .content-right:before{
 +
  position: absolute;
 +
  top: 20px;
 +
  font-size: 23px;
 +
  font-family: "FontAwesome";
 +
  color: #fff;
 +
}
 +
.timeline-article .content-left:before {
 +
  content: "\f0da";
 +
  right: -8px;
 +
}
 +
.timeline-article .content-right:before {
 +
  content: "\f0d9";
 +
  left: -8px;
 +
}
 +
 
 +
 
 +
 
 +
 
 +
 
 +
.timeline-article .meta-date {
 +
  position: absolute;
 +
  top: 10px;
 +
  left: 49%;
 +
  width: 80px;
 +
  height: 80px;
 +
  margin-left: -31px;
 +
  color: #fff;
 +
  border-radius: 100%;
 +
  background:#232F13;
 +
}
 +
.timeline-article .meta-date .date,
 +
.timeline-article .meta-date .month {
 +
  display: block;
 +
  text-align: center;
 +
  font-weight: 900;
 +
 
 +
}
 +
.timeline-article .meta-date .date {
 +
  font-size: 30px;
 +
  line-height: 40px;
 +
 
 +
}
 +
.timeline-article .meta-date .month {
 +
  font-size: 18px;
 +
  line-height: 10px;
 +
}
 +
/*===== // Vertical Timeline =====*/
 +
 
 +
/*===== Resonsive Vertical Timeline =====*/
 +
@media only screen and (max-width: 830px) {
 +
  #conference-timeline .timeline-start,
 +
  #conference-timeline .timeline-end {
 +
    margin: 0;
 +
  }
 +
  #conference-timeline .conference-center-line {
 +
    margin-left: 0;
 +
    left: 50px;
 +
  }
 +
  .timeline-article .meta-date {
 +
    margin-left: 0;
 +
    left: 20px;
 +
  }
 +
  .timeline-article .content-left-container,
 +
  .timeline-article .content-right-container {
 +
    max-width: 100%;
 +
    width: auto;
 +
    float: none;
 +
    margin-left: 110px;
 +
    min-height: 53px;
 +
  }
 +
  .timeline-article .content-left-container {
 +
    margin-bottom: 20px;
 +
  }
 +
  .timeline-article .content-left,
 +
  .timeline-article .content-right {
 +
    padding: 10px 25px;
 +
    min-height: 65px;
 +
  }
 +
  .timeline-article .content-left:before {
 +
    content: "\f0d9";
 +
    right: auto;
 +
    left: -8px;
 +
  }
 +
  .timeline-article .content-right:before {
 +
    display: none;
 +
  }
 +
}
 +
@media only screen and (max-width: 400px) {
 +
  .timeline-article p {
 +
    margin: 0;
 +
  }
 +
  .timeline-article p span.article-number {
 +
    display: none;
 +
  }
 +
 
 +
}
 +
/*===== // Resonsive Vertical Timeline =====*/
 +
</style>
 +
 
 +
            </div>
 +
        </div>
 +
 
 +
 
 +
 
 +
<div class="container" style="height:450px; width:100%; position: relative;">
 +
 
 +
</div>
 +
 
 +
 
 +
        <div class="panel panel-red" id="panel3">
 +
           
 +
should I put something here
 +
           
 +
        </div>
 +
 
 +
 
 +
<style>
 +
html {
 +
height: 100%;
 +
min-height: 100%;
 +
}
 +
 
 +
body {
 +
height: 100%;
 +
}
 +
 
 +
.panel {
 +
width: 100%;
 +
height: 100%;
 +
background: black;
 +
color: #fff;
 +
padding-left: 5%;
 +
padding-right: 5%;
 +
text-align: center;
 +
}
 +
 
 +
 
 +
 
 +
 
 +
 
 +
.panel.panel-red {
 +
background: black;
 +
 
 +
}
 +
#nav {
 +
position: fixed;
 +
top: 0;
 +
left: 0;
 +
width: 96%;
 +
padding: 2%;
 +
z-index: 100;
 +
color: white;
 +
height: 80px;
 +
}
 +
 
 +
.noBackground {
 +
background-color: rgba(0,0,0,0);
 +
visibility: visible;
 +
width:100%;
 +
padding-right:0px;
 +
    -webkit-transition: all 1.0s ease;
 +
    -moz-transition: all 1.0s ease;
 +
    -o-transition: all 1.0s ease;
 +
    transition: all 1.0s ease;
 +
}
 +
 
 +
.blackBackground {
 +
background-color: rgba(35,47,19,0.7);
 +
visibility: visible;
 +
width:100%;
 +
 
 +
}
 +
 
 +
#nav .inner {
 +
z-index:100;
 +
padding-bottom:40px;
 +
color: red;
 +
}
 +
 
 +
#nav ul {
 +
list-style: none;
 +
margin: 0;
 +
padding: 0;
 +
}
 +
 
 +
 
 +
 
 +
#inner{
 +
z-index:101;
 +
 
 +
}
 +
 
 +
#panel1{
 +
background: transparent;
 +
height: 950px;
 +
width:100%;
 +
z-index:100;
 +
}
 +
#panel2{
 +
width:100%;
 +
height: 100%;
 +
margin-bottom:0px;
 +
background:  white;
 +
color: white;
 +
font-size: 40px;
 +
line-height: 40px;
 +
background-image: url("https://static.igem.org/mediawiki/2017/a/a5/Woodbackground.jpeg");
 +
height: 200%;
 +
}
 +
#panel3{
 +
width:100%;
 +
height: 200px;
 +
margin-bottom:-100px;
 +
background: rgba(35,47,19,0.9);
 +
}
 +
 
 +
 
 +
 
 +
 
 +
</style>
 +
<script>
 +
$( function() {
 +
//caches a jQuery object containing the header element
 +
var header = $('.noBackground');
 +
$(window).scroll(function() {
 +
var scroll = $(window).scrollTop();
 +
 
 +
if (scroll >= 100) {
 +
header.addClass('blackBackground');
 +
} else {
 +
header.removeClass('blackBackground');
 +
                     
 +
}
 +
});
 +
});
 +
</script>
  
 
</body>
 
</body>
 +
<html>

Revision as of 00:30, 27 October 2017

Dalhousie iGEM 2017
Welcome!
The goal of our project is to convert cellulose into glucose, which can be used for biofuel.
Let us show you how!

Softwood waste from the lumber industry contains cellulose, which can be turned into glucose and used to make biofuel. 01

We hypothesized that the porcupine microbiome must contain an enzyme that can break down cellulose, as bark is food. 02

We mined the porcupine’s microbiome to identify the enzyme that was able to break down wood. 03

We created a metagenomic library of the genes able to code this enzyme as well as novel enzymes. 04

We put these genes into E.coli to see if they could then digest cellulose down. 05

We put the E.coli into a bioreactor with cellulose to see if it gets broken down. In the future this can be combined with yeast to transform in finally into biofuel! 06

should I put something here