Team:Imperial College/BioPlastic Recycling: PHB

From 2013.igem.org

(Difference between revisions)
Line 1: Line 1:
-
{{:Team:Imperial_College/Templates:header}}
+
/* PLEASE READ https://2013.igem.org/wiki/index.php?title=Team:Imperial_College/Templates:StyleGuide&action=edit  */
-
<html>
+
-
<div class="row">
+
-
<!--    Side Nav -->
+
-
    <div class="span3">
+
-
        <div id="sidenav-wrapper">
+
-
            <ul id="sidenav" class="nav nav-list" data-spy="affix">
+
-
                <li><a href="#overview">Overview</a></li>
+
-
                <li><a href="#specification">Specification</a></li>
+
-
                <li><a href="#modelling">Modelling</a></li>
+
-
                <li><a href="#implementation">Implementation</a></li>
+
-
                <li><a href="#results">Results</a></li>
+
-
                <li><a href="#protocols">Protocols</a></li>
+
-
                <li><a href="#safety">Safety</a></li>
+
-
            </ul>
+
-
        </div>
+
-
    </div>
+
-
<!-- Content -->
+
-
    <div class="span9 offset3" data-spy="scroll" data-target="#sidenav">
+
-
        <h1>Recyling Poly-3-hydroxybutyrate</h1>
+
-
        <h3 id="overview">Overview</h3>
+
-
       
+
-
        <p>Poly-3-hydroxybutyrate(P3HB) is a bioplastic, more specifically it is a polyester which is naturally produced inside bacteria such as Alcaligenes eutrophus. It is used as an energy store by these bacteria(1). It appears as globules inside the cell. PHB as a plastic has benefits over those derived from oils; it is produced from renewable resources which minimise the amount of fossil fuels required in plastic production(2,3) and can also biodegrade to non-toxic compounds which can be used as an energy source by organisms commonly found in the environment(4). Physically P3HB has properties which allow it to be used as a replacement for oil based plastics for some application e.g packaging(5) such as .</p>
+
-
        <p> We have made P3HB in E.coli and developed a system by which it can be recycled when products made from it come to the end of their life. In order to make P3HB we transferred three genes, naturally found in Ralstonia eutropha into E.coli MG1655. These encode the three enzymes necessary for P3HB production; polyhydroxyalkanoate synthase(phaC), 3-ketothiolase(phaA) and acetoacetyl coenzyme A reductase(phaB). These exist as a P3HB producing operon. We have tried to genetically maximise the production of P3HB as high yields are required for P3HB to be economically viable.</p>
+
-
        <p><small>phaC, which encodes the polyhydroxyalkanoate (PHA) synthase, phaA, which encodes a 3-ketothiolase, and phaB, which encodes an acetoacetyl coenzyme A (acetoacetyl-CoA) reductase.</small></p>
+
/* ---------------- WikiMedia Elements / Page Structure---------------- */
 +
 
 +
/* HIDE
 +
Big horrible image at top from iGem 2013
 +
Search Controls
 +
Page title */
 +
#p-logo,
 +
#search-controls,
 +
.firstHeading {
 +
    display: none;
 +
}
 +
 
 +
/* Remove default top header */
 +
#top-section {
 +
    background-color: #ffffff;
 +
    border: none;
 +
    height:20px;
 +
    margin-top: 0;
 +
    margin-bottom: 20px;
 +
}
 +
 
 +
#top-section:hover {
 +
    background: #36A9E1;
 +
}
 +
 
 +
/* Edit and user menu */
 +
#menubar {
 +
    top: 0 !important;
 +
    font-size: 0.7em;   
 +
}
 +
 
 +
#menubar li,
 +
#menubar li a:link {
 +
    text-transform: uppercase;
 +
}
 +
 
 +
/* Highlight with background colour on hover */
 +
#top-section:hover #menubar li a {
 +
    color: #FFF;
 +
}
 +
 
 +
#menubar li a:link,
 +
#menubar li a:visited {
 +
    color: #DDD;
 +
    background-color: transparent;
 +
}
 +
 
 +
#menubar li a:hover,
 +
#menubar li a:focus {
 +
    color: #A3C4E9;
 +
    text-decoration: none;
 +
}
 +
 
 +
/* Edit */
 +
#menubar.left-menu{
      
      
-
        <h2 id="specification">Specification</h2>
+
}
-
       
+
-
        <p> </p>
+
-
       
+
-
        <h2 id="modelling">Modelling</h2>
+
-
       
+
-
        <h3>Introduction to building a deterministic model</h3>
+
-
       
+
-
        <p>In engineering, when one wants to make a product to solve a particular problem it is common to adopt a strategic cycle to assist in the realisation of such product.  The stages involved in the cycle are: (i) User-requirements/specifications, (ii) Design (of modules), (iii) Modelling, (iv) Implementation (wet lab), (v) Testing and verification and (vi) End-product. </p>
+
-
        <p>A major aspect of how engineering is involved in synthetic biology is modelling.  It plays an important role in the verification of modules designed to ensure that they are built correctly and meet the specification.  Modelling also adds in the predictability throughout the design process by means of simulations with software.  With the ability to predict, complexity of molecular biology can be masked and the pathways in a cell can be considered as systems or subsystems.</p>
+
-
        <p>The fact that the modelling is program-based particularly suits the open-source theme as the codes can be shared on the wiki such that synthetic biologists working in the relevant areas can download them as templates for their models.
+
-
        </p>
+
-
        <h2 id="implementation">Implementation</h2>
+
#menubar.left-menu:hover {
-
       
+
    background-color: transparent;
-
        <p></p>
+
}
-
       
+
 
-
        <h2 id="results">Results</h2>
+
 
-
       
+
/* User */
-
        <p></p>
+
#menubar.right-menu {
-
       
+
-
        <h2 id="protocols">Protocols</h2>
+
-
       
+
-
        <p></p>
+
-
       
+
-
        <h2 id="safety">Safety</h2>
+
-
       
+
-
       
+
      
      
-
    </div>
+
}
-
</div>
+
-
<script>
 
-
$( document ).ready(function() {
+
 
-
/*     $('#sidenav').affix({ */
+
/* ? */
-
/*        offset: { top: $('#sidenav').offset().top } */
+
#catlinks {
-
/*    }); */
+
    border:none;
 +
    background: #ffffff;
 +
}
 +
 
 +
/* Wikimedia related links at base of page */
 +
 
 +
 
 +
#footer-box {
 +
     border:none;
 +
    margin: 30px auto;
 +
    width: 100%;
 +
    background-color: #aeaeae;
 +
    padding: 3em 0 5em 0;
 +
 
 +
}
 +
 
 +
#footer {
 +
    text-align: center;
 +
}
 +
 
 +
#footer-box #f-poweredbyico,
 +
#footer-box #f-copyrightico {
 +
    float: none;
 +
    display: inline-block;
 +
    vertical-align: middle;
 +
    margin-bottom: 10px;
 +
}
 +
 
 +
#footer-box #f-copyrightico {
      
      
-
/*    $('#sidenav-wrapper').height($("#sidenav").height()); */
+
}
-
});
+
 +
#footer-box #f-list {
 +
    float: none;
 +
    display: block;
 +
    width: 100%;
 +
    margin: 0;
 +
    padding: 0;
 +
}
-
</script>
 
-
</html>
+
#footer-box #f-list li {
-
{{:Team:Imperial_College/Templates:footer}}
+
    text-transform: uppercase;
 +
    padding: 0 .75em;
 +
    margin: 0;
 +
}
 +
 
 +
#footer-box #f-list li a:link,
 +
#footer-box #f-list li a:visited {
 +
    color: #CCC;
 +
    font-size: 0.7em;
 +
}
 +
 
 +
#footer-box #f-list li a:hover,
 +
#footer-box #f-list li a:focus {
 +
    color: #36A9E1;
 +
    text-decoration: none;
 +
}
 +
 
 +
/* ---------------- Header ---------------- */
 +
 
 +
#imperial-banner {
 +
    position: relative; /* this is to allow positioning of elements within */
 +
    text-align: right;
 +
    height: 100px;
 +
    margin: 2em 0;
 +
    line-height: 100px;
 +
}
 +
 
 +
    #imperial-igem-banner {
 +
        position: absolute;
 +
        left: 0;
 +
        top: 0;
 +
    }
 +
 
 +
    #igem-logo,
 +
    #imperial-logo {
 +
        display: inline-block;
 +
        margin-left: 5px;
 +
    }
 +
 
 +
    #imperial-igem-banner img,
 +
    #igem-logo img {
 +
        height: 90px;
 +
    }
 +
 
 +
    #igem-logo img {
 +
        -webkit-transition: all 1s ease-in-out;
 +
        -moz-transition: all 1s ease-in-out;
 +
        -ms-transition: all 1s ease-in-out;
 +
        -o-transition: all 1s ease-in-out;
 +
        transition: all 1s ease-in-out;
 +
    }
 +
 
 +
    #igem-logo img:hover {
 +
        -webkit-transform: rotate(360deg);
 +
        -moz-transform: rotate(360deg);
 +
        -o-transform: rotate(360deg);
 +
        -ms-transform: rotate(360deg);
 +
        transform: rotate(360deg);
 +
    }
 +
 
 +
    #imperial-logo img {
 +
        height: 45px;
 +
    }
 +
 
 +
#BackToTop,
 +
#BackToTop:link,
 +
#BackToTop:visited {
 +
    position: fixed;
 +
    bottom: 5px;
 +
    right: 5px;
 +
    text-decoration: none;
 +
    color: #36a9e1;
 +
}
 +
 
 +
#BackToTop:hover {
 +
    color: #a3c4e9;
 +
}
 +
 
 +
/* ---------------- Navigation ---------------- */
 +
 
 +
/* Blue #36A9E1 */
 +
/* Yellow #F9B233 */
 +
 
 +
#navigation {
 +
    padding: 1.4em 0 0 0;
 +
}
 +
 
 +
.main,
 +
#n-third {
 +
    text-align: center;
 +
    padding: 0;
 +
    margin: 0;
 +
    clear: both;
 +
}
 +
 
 +
.main li {
 +
    display: block;
 +
    text-align: center;
 +
    float: left;
 +
    border-left: solid 2px white;
 +
}
 +
 
 +
.main li a:link,
 +
.main li a:visited {
 +
    color: #FFF;
 +
    display: block;
 +
    padding: .5em;
 +
    font-size: 0.8em;
 +
    text-transform: uppercase;
 +
    background: #F9B233; /* yellow */
 +
        text-decoration: none;
 +
}
 +
 
 +
.main li a:focus,
 +
.main li a:hover {
 +
    background-color: #36A9E1;
 +
    text-decoration: none;
 +
}
 +
 
 +
#n-first {
 +
   
 +
}
 +
 
 +
#n-first li {
 +
    width: 33%;
 +
}
 +
 
 +
#n-first li a:link {
 +
    font-size: 0.9em;
 +
}
 +
 
 +
#n-second {
 +
   
 +
}
 +
 
 +
#n-second li {
 +
    width: 24.7%;
 +
}
 +
 
 +
#n-third {
 +
    font-size: 0.7em;
 +
    text-transform: uppercase;
 +
}
 +
 
 +
#n-third li {
 +
    width: 25%;
 +
}
 +
 
 +
/* ---------------- Footer ---------------- */
 +
 
 +
#sponsor-logo{
 +
display: block;
 +
background-color: #ffffff;
 +
margin-left:auto;
 +
margin-right:auto;
 +
width:20%;
 +
margin: 15px;
 +
text-align:center
 +
}
 +
 
 +
#ourfooter{
 +
position:relative;
 +
display:block;
 +
background-color:#fff;
 +
width: 975px;
 +
float:right;
 +
border-top: 1px dotted #d9d9d9;
 +
border-bottom: 1px dotted #d9d9d9;
 +
}
 +
 
 +
 
 +
/* ---------------- Main Content ---------------- */
 +
 
 +
/* Full Page container */
 +
#content {
 +
    position: relative;
 +
    width: 960px;
 +
    margin: 0 auto;
 +
    padding:0;
 +
    background: #ffffff;
 +
    border: none;
 +
    z-index: 2;
 +
}
 +
 
 +
 
 +
#contentSub {
 +
margin: 0 0 0 0;
 +
} 
 +
 
 +
/* ---------------- Footer ---------------- */
 +
#supporters {
 +
    border-top: solid 1px #CCC;
 +
    margin-top: 2em;
 +
    padding-top: 2em;
 +
}
 +
 
 +
#supporters a {
 +
    margin-right: 2em;
 +
}
 +
/* LINKS */
 +
a:visited {
 +
    color: #F9B233;
 +
}
 +
 
 +
/* ---------------- Side Nav on content pages ---------------- */
 +
#sidenav {
 +
    position: fixed;
 +
    margin-top: 30px;
 +
    width: 170px;
 +
    border: 1px solid #E5E5E5;
 +
    padding: 0.7em;
 +
    }
 +
 
 +
#sidenav li {
 +
 
 +
}
 +
 
 +
#sidenav > li:first-child > a {
 +
 
 +
}
 +
 
 +
#sidenav > li:last-child > a {
 +
 
 +
}
 +
 
 +
#sidenav li a {
 +
    display: block;
 +
    margin: 0 0 -1px;
 +
    padding: 8px 14px;
 +
     
 +
   
 +
    font-size: 0.8em;
 +
    text-transform: uppercase;
 +
   
 +
}

Revision as of 20:48, 12 September 2013

/* PLEASE READ https://2013.igem.org/wiki/index.php?title=Team:Imperial_College/Templates:StyleGuide&action=edit */

/* ---------------- WikiMedia Elements / Page Structure---------------- */

/* HIDE Big horrible image at top from iGem 2013 Search Controls Page title */

  1. p-logo,
  2. search-controls,

.firstHeading { 

   display: none;

}

/* Remove default top header */

  1. top-section { 
   background-color: #ffffff;
   border: none;
   height:20px;
   margin-top: 0;
   margin-bottom: 20px;

}

  1. top-section:hover { 
   background: #36A9E1;

}

/* Edit and user menu */

  1. menubar { 
   top: 0 !important;
   font-size: 0.7em;

}

  1. menubar li,
  2. menubar li a:link { 
   text-transform: uppercase;

}

/* Highlight with background colour on hover */

  1. top-section:hover #menubar li a { 
   color: #FFF;

}

  1. menubar li a:link,
  2. menubar li a:visited { 
   color: #DDD;
   background-color: transparent;

}

  1. menubar li a:hover,
  2. menubar li a:focus { 
   color: #A3C4E9;
   text-decoration: none;

}

/* Edit */

  1. menubar.left-menu{

}

  1. menubar.left-menu:hover { 
   background-color: transparent;

}


/* User */

  1. menubar.right-menu {

}


/* ? */

  1. catlinks { 
   border:none;
   background: #ffffff;

}

/* Wikimedia related links at base of page */


  1. footer-box { 
   border:none;
   margin: 30px auto;
   width: 100%;
   background-color: #aeaeae;
   padding: 3em 0 5em 0;

}

  1. footer { 
   text-align: center;

}

  1. footer-box #f-poweredbyico,
  2. footer-box #f-copyrightico { 
   float: none;
   display: inline-block;
   vertical-align: middle;
   margin-bottom: 10px;

}

  1. footer-box #f-copyrightico {

}

  1. footer-box #f-list { 
   float: none;
   display: block;
   width: 100%;
   margin: 0;
   padding: 0;

}


  1. footer-box #f-list li { 
   text-transform: uppercase;
   padding: 0 .75em;
   margin: 0;

}

  1. footer-box #f-list li a:link,
  2. footer-box #f-list li a:visited { 
   color: #CCC;
   font-size: 0.7em;

}

  1. footer-box #f-list li a:hover,
  2. footer-box #f-list li a:focus { 
   color: #36A9E1;
   text-decoration: none;

}

/* ---------------- Header ---------------- */

  1. imperial-banner { 
   position: relative; /* this is to allow positioning of elements within */
   text-align: right;
   height: 100px;
   margin: 2em 0;
   line-height: 100px;

} 

   #imperial-igem-banner {
       position: absolute;
       left: 0;
       top: 0;
   }

   #igem-logo,
   #imperial-logo {
       display: inline-block;
       margin-left: 5px;
   }

   #imperial-igem-banner img,
   #igem-logo img {
       height: 90px;
   }

   #igem-logo img {
       -webkit-transition: all 1s ease-in-out;
       -moz-transition: all 1s ease-in-out;
       -ms-transition: all 1s ease-in-out;
       -o-transition: all 1s ease-in-out;
       transition: all 1s ease-in-out;
   }

   #igem-logo img:hover {
       -webkit-transform: rotate(360deg);
       -moz-transform: rotate(360deg);
       -o-transform: rotate(360deg);
       -ms-transform: rotate(360deg);
       transform: rotate(360deg);
   }

   #imperial-logo img {
       height: 45px;
   }
  1. BackToTop,
  2. BackToTop:link,
  3. BackToTop:visited { 
   position: fixed;
   bottom: 5px;
   right: 5px;
   text-decoration: none;
   color: #36a9e1;

}

  1. BackToTop:hover { 
   color: #a3c4e9;

}

/* ---------------- Navigation ---------------- */

/* Blue #36A9E1 */ /* Yellow #F9B233 */

  1. navigation { 
   padding: 1.4em 0 0 0;

}

.main,

  1. n-third { 
   text-align: center;
   padding: 0;
   margin: 0;
   clear: both;

}

.main li { 

   display: block;
   text-align: center;
   float: left;
   border-left: solid 2px white;

}

.main li a:link, .main li a:visited { 

   color: #FFF;
   display: block;
   padding: .5em;
   font-size: 0.8em;
   text-transform: uppercase;
   background: #F9B233; /* yellow */
       text-decoration: none;

}

.main li a:focus, .main li a:hover { 

   background-color: #36A9E1;
   text-decoration: none;

}

  1. n-first {

}

  1. n-first li { 
   width: 33%;

}

  1. n-first li a:link { 
   font-size: 0.9em;

}

  1. n-second {

}

  1. n-second li { 
   width: 24.7%;

}

  1. n-third { 
   font-size: 0.7em;
   text-transform: uppercase;

}

  1. n-third li { 
   width: 25%;

}

/* ---------------- Footer ---------------- */

  1. sponsor-logo{

display: block; background-color: #ffffff; margin-left:auto; margin-right:auto; width:20%; margin: 15px; text-align:center }

  1. ourfooter{

position:relative; display:block; background-color:#fff; width: 975px; float:right; border-top: 1px dotted #d9d9d9; border-bottom: 1px dotted #d9d9d9; }


/* ---------------- Main Content ---------------- */

/* Full Page container */

  1. content { 
   position: relative;
   width: 960px;
   margin: 0 auto;
   padding:0;
   background: #ffffff;
   border: none;
   z-index: 2;

}


  1. contentSub {

margin: 0 0 0 0; }

/* ---------------- Footer ---------------- */

  1. supporters { 
   border-top: solid 1px #CCC;
   margin-top: 2em;
   padding-top: 2em;

}

  1. supporters a { 
   margin-right: 2em;

} /* LINKS */ a:visited { 

   color: #F9B233;

}

/* ---------------- Side Nav on content pages ---------------- */

  1. sidenav { 
   position: fixed;
   margin-top: 30px;
   width: 170px;
   border: 1px solid #E5E5E5; 
   padding: 0.7em;
   }
  1. sidenav li {

}

  1. sidenav > li:first-child > a {

}

  1. sidenav > li:last-child > a {

}

  1. sidenav li a { 
   display: block;
   margin: 0 0 -1px;
   padding: 8px 14px;
      
   
   font-size: 0.8em;
   text-transform: uppercase;

}

Retrieved from "http://2013.igem.org/Team:Imperial_College/BioPlastic_Recycling:_PHB"