Difference between revisions of "Team:Lethbridge"

 
(396 intermediate revisions by 5 users not shown)
Line 1: Line 1:
 
{{Team:Lethbridge/assets/reset.css}}
 
{{Team:Lethbridge/assets/reset.css}}
 +
{{Team:Lethbridge/assets/sidemenuremove.css}}
 
{{Team:Lethbridge/navbar}}
 
{{Team:Lethbridge/navbar}}
 +
{{Team:Lethbridge/assets/allpages.css}}
 +
{{Team:Lethbridge/top}}
 
<html>
 
<html>
 
<style>
 
<style>
−
/*SideMenu for iGEM Stuff*/
+
/*RESET AND REMOVAL CSS IS PART OF RESET AND SIDEMENUREMOVE TEMPLATE*/
−
      #sideMenu{width: 200px;position: absolute;top: 20px;left: 1020px;z-index: 10;padding-top: 0px;padding-bottom: 15px;padding-left: 15px;padding-right: 15px;background-color: white;text-align: left;display: none;z-index: 9996;}
+
/* RULES FOR ALL PAGES ARE PART OF THE ALLPAGES.CSS TEMPLATE*/
−
      #content{width: 100%;padding: 0px;margin-left: 0px;}
+
/* RULES FOR THIS PAGE ONLY */
−
      #top_title{overflow: hidden;display: none;}
+
−
      #top_menu_14{height: 20px;}
+
−
      #top_menu_under{height: 0px;}
+
−
    /*#globalWrapper{padding-bottom: 200px;}*/
+
−
     
+
−
/* Visible Content Styling Begins Here */
+
  
−
body {
+
p {text-align: center !important;}
−
        padding-top: 3.9em;
+
−
    }
+
  
−
.centerBanner {
+
/* FOR INLINE-BLOCK PURPOSES */
−
        display: block;
+
.contentDiv {display: inline-block;}
−
        margin: auto;
+
#text60 {width: 60%; vertical-align:middle;}
−
     }
+
#text50 {width: 50%; vertical-align:middle;}
 +
#text40 {width: 40%; vertical-align:middle;}
 +
#text30 {width: 30%; vertical-align:middle;}
 +
#text25 {width: 25%; vertical-align:middle;}
 +
 
 +
/* not for all pages, since all pages do not use inline-block */
 +
@media only screen and (max-width: 500px) {
 +
     #allContent img {width: 95%; height: 95%;}}
 +
 
 +
</style>
 +
<body>
 +
<br>
 +
<img src="https://static.igem.org/mediawiki/2017/5/56/Banner_nextvivo.png" class="bannerImg">
 +
<div id="allContent"><!--div to set margin for all content but header and footer image -->
 +
<!--<div class="circleTop" style="margin-left:90%"><a href="#top">top</a></div>-->
 +
 
 +
<p id="slogan">Cell-free Synthetic Biology<br> for the Masses</p><br>
 +
 
 +
<!-- anchor buttons -->
 +
<br>
 +
<center>
 +
<form>
 +
    <input class="tealButton" type="button" value="Why Cell-free?" onclick="window.location.href='#anchor1'" />
 +
</form>
 
      
 
      
−
.fitBanner {
+
<form>
−
        max-height: 100%;
+
     <input class="tealButton" type="button" value="Motivation" onclick="window.location.href='#anchor2'" />
−
        max-width: 100%;
+
</form>
−
     }
+
−
+
−
.centerContainer {
+
−
        margin-left: 5%;
+
−
        margin-right: 5%;
+
−
        text-align: center;
+
−
        font-family: "Arial";
+
−
        font-size: 125%;
+
−
    }
+
 
      
 
      
−
.textTitle {
+
<form>
−
        font-size: 200%;
+
    <input class="tealButton" type="button" value="Design" onclick="window.location.href='#anchor3'" />
−
        font-style: oblique;
+
</form>
−
        text-align: center;
+
−
    }
+
 
      
 
      
−
p {text-align: left !important; z-index=1;}
+
<form>
 +
    <input class="tealButton" type="button" value="Our System" onclick="window.location.href='#anchor4'" />
 +
</form>
 +
<div style="clear:both" id="anchor1"></div>
 +
</center>
  
−
#introBlurb {
+
<br><br><br><br>
−
    text-align: left;
+
<h2 class="segmentHeader">Why Cell-free?</h2>
−
    }
+
  
 +
<center>
 +
    <div class="segmentContainer">
 +
        <div class="contentDiv" id="text50"><p class="text18"><br><a href="https://2017.igem.org/Team:Lethbridge/Description" id="pageLink">Cell-free systems</a> include all the necessary biomachinery to produce proteins outside of a living cell<br><br>Due to their inherent safety and simplicity, cell-free systems provide a powerful tool to synthetic biologists for engineering novel systems without the constraints of cellular life</p>
 +
        </div>
 +
        <div class="contentDiv"><img src="https://static.igem.org/mediawiki/2017/b/b4/Celltocellfree.png" width=384px; height=500px; padding:10px; />
 +
        </div>
 +
    </div>
 +
</center>
  
−
/*footer CSS rules*/
+
<div style="clear: both" id="anchor2"></div>
−
.footerMenu {
+
−
  z-index: 9999;
+
−
  -webkit-filter: url("#goo");
+
−
          filter: url("#goo");
+
−
}
+
  
−
.footerMenu-item, .footerMenu-open-button {
+
<br><br><br><br>
−
  background: #377b7e;
+
<h2 class="segmentHeader">Motivation</h2>
−
  border-radius: 100%;
+
−
  width: 65px;
+
−
  height: 65px;
+
−
  margin-left: -40px;
+
−
  position: absolute;
+
−
  top: 20px;
+
−
  color: white;
+
−
  text-align: center;
+
−
  line-height: 80px;
+
−
  -webkit-transform: translate3d(0, 0, 0);
+
−
          transform: translate3d(0, 0, 0);
+
−
  -webkit-transition: -webkit-transform ease-out 200ms;
+
−
  transition: -webkit-transform ease-out 200ms;
+
−
  transition: transform ease-out 200ms;
+
−
  transition: transform ease-out 200ms, -webkit-transform ease-out 200ms;
+
−
}
+
  
−
.footerMenu-open {
+
<center>
−
  z-index: 9999;
+
    <div class="segmentContainer"><p class="text18">A lack of standardization, simplification and flexibility has limited the application of cell-free systems, including its use within the <a href="https://2017.igem.org/Team:Lethbridge/HP/Silver" id="pageLink">education system and Do-It-Yourself (DIY) community</a></p>
−
  display: none;
+
    </div>
−
}
+
</center>
  
−
.dots {
+
<center>
−
  width: 5px;
+
    <img src="https://static.igem.org/mediawiki/2017/4/40/Userswithtext.png" width=704px; height=250px; padding: 30px class="bannerImg" />
−
  height: 5px;
+
</center>
−
  border-radius: 50%;
+
−
  background: white;
+
−
  display: block;
+
−
  position: absolute;
+
−
  top: 50%;
+
−
  left: 50%;
+
−
  margin-left: -2px;
+
−
  margin-top: -2px;
+
−
  -webkit-transition: -webkit-transform 200ms;
+
−
  transition: -webkit-transform 200ms;
+
−
  transition: transform 200ms;
+
−
  transition: transform 200ms, -webkit-transform 200ms;
+
−
}
+
  
−
.dots-1 {-webkit-transform: translate3d(0, -8px, 0); transform: translate3d(0, -8px, 0);}
+
<div style="clear: both" id="anchor3"></div>
−
.dots-2 {-webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0);}
+
−
.dots-3 {-webkit-transform: translate3d(0, 8px, 0); transform: translate3d(0, 8px, 0);}
+
  
−
.footerMenu-open:checked + .footerMenu-open-button .dots-1 {
+
<br><br><br><br>
−
  z-index: 9999;
+
<h2 class="segmentHeader">Design</h2>
−
  -webkit-transform: translate3d(0, 0, 0) rotate(45deg);
+
−
          transform: translate3d(0, 0, 0) rotate(45deg);
+
−
}
+
−
.footerMenu-open:checked + .footerMenu-open-button .dots-2 {
+
−
  z-index: 9999;
+
−
  -webkit-transform: translate3d(0, 0, 0) scale(0.1, 1);
+
−
          transform: translate3d(0, 0, 0) scale(0.1, 1);
+
−
}
+
−
.footerMenu-open:checked + .footerMenu-open-button .dots-3 {
+
−
  z-index: 9999;
+
−
  -webkit-transform: translate3d(0, 0, 0) rotate(-45deg);
+
−
          transform: translate3d(0, 0, 0) rotate(-45deg);
+
−
}
+
  
−
.footerMenu {
+
<center>
−
  position: absolute;
+
    <div class="segmentContainer"><p class="text18">Lowering the barrier to synthetic biology, our project aims to create a <a href="https://2017.igem.org/Team:Lethbridge/Design" id="pageLink"><b>STANDARD, SAFE, MODULAR</b>, and <b>USER-FRIENDLY</b></a> cell-free system</p>
−
  left: 50%;
+
    </div>
−
  margin-left: -190px;
+
</center>
−
  padding-top: 20px;
+
−
  padding-left: 190px;
+
−
  width: 380px;
+
−
  height: 250px;
+
−
  box-sizing: border-box;
+
−
  font-size: 20px;
+
−
  text-align: left;
+
−
  z-index: 9999;
+
−
}
+
  
−
.footerMenu-item:hover {
+
<center>
−
  background: #f5af3e;
+
    <img src="https://static.igem.org/mediawiki/2017/1/16/Designwithwords.png" width=712px; height=200px; padding: 30px; class="bannerImg" />
−
  color: #e91e63;
+
</center>
−
  z-index: 9999;
+
−
}
+
−
.footerMenu-item:nth-child(3)
+
−
  z-index: 9999;
+
−
  -webkit-transition-duration: 180ms;
+
−
          transition-duration: 180ms;
+
−
}
+
−
.footerMenu-item:nth-child(4) {
+
−
  z-index: 9999;
+
−
  -webkit-transition-duration: 180ms;
+
−
          transition-duration: 180ms;
+
−
}
+
−
.footerMenu-item:nth-child(5) {
+
−
  z-index: 9999;
+
−
  -webkit-transition-duration: 180ms;
+
−
          transition-duration: 180ms;
+
−
}
+
−
.footerMenu-item:nth-child(6) {
+
−
  z-index: 9999;
+
−
  -webkit-transition-duration: 180ms;
+
−
          transition-duration: 180ms;
+
−
}
+
−
.footerMenu-item:nth-child(7) {
+
−
  z-index: 9999;
+
−
  -webkit-transition-duration: 180ms;
+
−
          transition-duration: 180ms;
+
−
}
+
−
.footerMenu-item:nth-child(8) {
+
−
  z-index: 9999;
+
−
  -webkit-transition-duration: 180ms;
+
−
          transition-duration: 180ms;
+
−
}
+
−
.footerMenu-item:nth-child(9) {
+
−
  z-index: 9999;
+
−
  -webkit-transition-duration: 180ms;
+
−
          transition-duration: 180ms;
+
−
}
+
  
−
.footerMenu-open-button {
+
<div style="clear: both" id="anchor4"></div>
−
  z-index: 2;
+
−
  -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
+
−
          transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
+
−
  -webkit-transition-duration: 400ms;
+
−
          transition-duration: 400ms;
+
−
  -webkit-transform: scale(1.1, 1.1) translate3d(0, 0, 0);
+
−
          transform: scale(1.1, 1.1) translate3d(0, 0, 0);
+
−
  cursor: pointer;
+
−
}
+
  
−
.footerMenu-open-button:hover {
+
<br><br><br><br>
−
  z-index: 9999;
+
<h2 class="segmentHeader">Our System</h2>
−
  -webkit-transform: scale(1.2, 1.2) translate3d(0, 0, 0);
+
−
          transform: scale(1.2, 1.2) translate3d(0, 0, 0);
+
−
}
+
  
−
.footerMenu-open:checked + .footerMenu-open-button {
+
<center>
−
  z-index: 9999;
+
     <div class="segmentContainer">
−
  -webkit-transition-timing-function: linear;
+
         <div class="contentDiv" id="text40"><p class="text22">A <a href="https://2017.igem.org/Team:Lethbridge/Parts" id="pageLink">collection of standard parts</a> for essential TX-TL components<br><br>Streamline and novel purification techniques</p>
−
          transition-timing-function: linear;
+
−
  -webkit-transition-duration: 200ms;
+
−
          transition-duration: 200ms;
+
−
  -webkit-transform: scale(0.8, 0.8) translate3d(0, 0, 0);
+
−
          transform: scale(0.8, 0.8) translate3d(0, 0, 0);
+
−
}
+
−
 
+
−
.footerMenu-open:checked ~ .footerMenu-item {
+
−
  z-index: 9999;
+
−
  -webkit-transition-timing-function: cubic-bezier(0.935, 0, 0.34, 1.33);
+
−
          transition-timing-function: cubic-bezier(0.935, 0, 0.34, 1.33);
+
−
}
+
−
.footerMenu-open:checked ~ .footerMenu-item:nth-child(3) {
+
−
  z-index: 9999;
+
−
  -webkit-transition-duration: 180ms;
+
−
          transition-duration: 180ms;
+
−
  -webkit-transform: translate3d(0.08361px, -104.99997px, 0);
+
−
          transform: translate3d(0.08361px, -104.99997px, 0);
+
−
}
+
−
.footerMenu-open:checked ~ .footerMenu-item:nth-child(4) {
+
−
  z-index: 9999;
+
−
  -webkit-transition-duration: 280ms;
+
−
          transition-duration: 280ms;
+
−
  -webkit-transform: translate3d(90.9466px, -52.47586px, 0);
+
−
          transform: translate3d(90.9466px, -52.47586px, 0);
+
−
}
+
−
.footerMenu-open:checked ~ .footerMenu-item:nth-child(5) {
+
−
  z-index: 9999;
+
−
  -webkit-transition-duration: 380ms;
+
−
          transition-duration: 380ms;
+
−
  -webkit-transform: translate3d(90.9466px, 52.47586px, 0);
+
−
          transform: translate3d(90.9466px, 52.47586px, 0);
+
−
}
+
−
.footerMenu-open:checked ~ .footerMenu-item:nth-child(6) {
+
−
  z-index: 9999;
+
−
  -webkit-transition-duration: 480ms;
+
−
          transition-duration: 480ms;
+
−
  -webkit-transform: translate3d(0.08361px, 104.99997px, 0);
+
−
          transform: translate3d(0.08361px, 104.99997px, 0);
+
−
}
+
−
.footerMenu-open:checked ~ .footerMenu-item:nth-child(7) {
+
−
  z-index: 9999;
+
−
  -webkit-transition-duration: 580ms;
+
−
          transition-duration: 580ms;
+
−
  -webkit-transform: translate3d(-90.86291px, 52.62064px, 0);
+
−
          transform: translate3d(-90.86291px, 52.62064px, 0);
+
−
}
+
−
.footerMenu-open:checked ~ .footerMenu-item:nth-child(8) {
+
−
  z-index: 9999;
+
−
  -webkit-transition-duration: 680ms;
+
−
          transition-duration: 680ms;
+
−
  -webkit-transform: translate3d(-91.03006px, -52.33095px, 0);
+
−
          transform: translate3d(-91.03006px, -52.33095px, 0);
+
−
}
+
−
.footerMenu-open:checked ~ .footerMenu-item:nth-child(9) {
+
−
  z-index: 9999;
+
−
  -webkit-transition-duration: 780ms;
+
−
          transition-duration: 780ms;
+
−
  -webkit-transform: translate3d(-0.25084px, -104.9997px, 0);
+
−
          transform: translate3d(-0.25084px, -104.9997px, 0);
+
−
}
+
−
/* end of Footer CSS Rules*/
+
−
</style>
+
−
<body>
+
−
<img src="https://static.igem.org/mediawiki/2017/c/c9/Logo_banner.png" class="centerBanner fitBanner">
+
−
     <div id="mainDescription">
+
−
         <div class="centerContainer">
+
−
        <p class="textTitle" style="font-size: 150%">Description</p>
+
−
            <p style="font-size: 100%" id="introBlurb">Lorem ipsum dolor sit amet, nec nam rutrum tincidunt dolor venenatis sed, justo sit tempus vestibulum, ligula sit nibh augue. Morbi nulla, placerat turpis lectus rutrum ante a facilisi, suspendisse rhoncus integer sit quis, nam nunc velit commodo eu consequat at. Donec eget nunc orci id, pede commodo placerat. Praesent lacus, quisque metus sem. Rutrum lacus feugiat, dis dui, at malesuada leo in nisl. Ut laoreet integer nibh duis, fermentum ut ut metus id, curabitur semper amet faucibus. Non tempus odio fermentum, a vitae praesent. At at eros porta, mauris purus eget felis nullam, aliquet turpis nonummy velit justo. In dictum, venenatis iaculis, porttitor mauris nec, mauris eu aliquam amet elit, in pede vel.</p><br>
+
−
<p style="font-size: 100%" id="introBlurb">Lorem ipsum dolor sit amet, nec nam rutrum tincidunt dolor venenatis sed, justo sit tempus vestibulum, ligula sit nibh augue. Morbi nulla, placerat turpis lectus rutrum ante a facilisi, suspendisse rhoncus integer sit quis, nam nunc velit commodo eu consequat at. Donec eget nunc orci id, pede commodo placerat. Praesent lacus, quisque metus sem. Rutrum lacus feugiat, dis dui, at malesuada leo in nisl. Ut laoreet integer nibh duis, fermentum ut ut metus id, curabitur semper amet faucibus. Non tempus odio fermentum, a vitae praesent. At at eros porta, mauris purus eget felis nullam, aliquet turpis nonummy velit justo. In dictum, venenatis iaculis, porttitor mauris nec, mauris eu aliquam amet elit, in pede vel.</p>
+
−
        </div>
+
−
    </div>
+
−
<img src="https://static.igem.org/mediawiki/2017/5/58/Main_gold_banner.png" class="centerBanner fitBanner">
+
−
    <div id="mainDesign">
+
−
        <div class="centerContainer">
+
−
        <p class="textTitle" style="font-size: 150%">Design</p>
+
−
            <p style="font-size: 100%" id="introBlurb">Lorem ipsum dolor sit amet, nec nam rutrum tincidunt dolor venenatis sed, justo sit tempus vestibulum, ligula sit nibh augue. Morbi nulla, placerat turpis lectus rutrum ante a facilisi, suspendisse rhoncus integer sit quis, nam nunc velit commodo eu consequat at. Donec eget nunc orci id, pede commodo placerat. Praesent lacus, quisque metus sem. Rutrum lacus feugiat, dis dui, at malesuada leo in nisl. Ut laoreet integer nibh duis, fermentum ut ut metus id, curabitur semper amet faucibus. Non tempus odio fermentum, a vitae praesent. At at eros porta, mauris purus eget felis nullam, aliquet turpis nonummy velit justo. In dictum, venenatis iaculis, porttitor mauris nec, mauris eu aliquam amet elit, in pede vel.</p><br>
+
−
<p style="font-size: 100%" id="introBlurb">Lorem ipsum dolor sit amet, nec nam rutrum tincidunt dolor venenatis sed, justo sit tempus vestibulum, ligula sit nibh augue. Morbi nulla, placerat turpis lectus rutrum ante a facilisi, suspendisse rhoncus integer sit quis, nam nunc velit commodo eu consequat at. Donec eget nunc orci id, pede commodo placerat. Praesent lacus, quisque metus sem. Rutrum lacus feugiat, dis dui, at malesuada leo in nisl. Ut laoreet integer nibh duis, fermentum ut ut metus id, curabitur semper amet faucibus. Non tempus odio fermentum, a vitae praesent. At at eros porta, mauris purus eget felis nullam, aliquet turpis nonummy velit justo. In dictum, venenatis iaculis, porttitor mauris nec, mauris eu aliquam amet elit, in pede vel.</p>
+
 
         </div>
 
         </div>
 +
        <div class="contentDiv">
 +
        <img src="https://static.igem.org/mediawiki/2017/9/98/T--Lethbridge--generaloep.png" width=371px; height=350px; padding:20px class="testImage" />
 +
        </div>
 
     </div>
 
     </div>
 +
</center>
 +
               
 +
<div style="clear: both"></div><br><br>
 +
 +
<hr class="dividerLine">
 
      
 
      
−
<img src="https://static.igem.org/mediawiki/2017/d/db/Main_navy_banner.png" class="centerBanner fitBanner">
+
<center>
−
    <div id="mainDemonstrate">
+
    <div class="segmentContainer">
−
         <div class="centerContainer">
+
        <div class="contentDiv"><a href="https://2017.igem.org/Team:Lethbridge/Software"><img src="https://static.igem.org/mediawiki/2017/8/88/T--Lethbridge--SoftwareMain.png" width=408px; height=200px; /></a>
−
         <p class="textTitle" style="font-size: 150%">Demonstrate</p>
+
         </div>
−
            <p style="font-size: 100%" id="introBlurb">Lorem ipsum dolor sit amet, nec nam rutrum tincidunt dolor venenatis sed, justo sit tempus vestibulum, ligula sit nibh augue. Morbi nulla, placerat turpis lectus rutrum ante a facilisi, suspendisse rhoncus integer sit quis, nam nunc velit commodo eu consequat at. Donec eget nunc orci id, pede commodo placerat. Praesent lacus, quisque metus sem. Rutrum lacus feugiat, dis dui, at malesuada leo in nisl. Ut laoreet integer nibh duis, fermentum ut ut metus id, curabitur semper amet faucibus. Non tempus odio fermentum, a vitae praesent. At at eros porta, mauris purus eget felis nullam, aliquet turpis nonummy velit justo. In dictum, venenatis iaculis, porttitor mauris nec, mauris eu aliquam amet elit, in pede vel.</p><br>
+
         <div class="contentDiv" id="text40"><p class="text22"><br>
−
<p style="font-size: 100%" id="introBlurb">Lorem ipsum dolor sit amet, nec nam rutrum tincidunt dolor venenatis sed, justo sit tempus vestibulum, ligula sit nibh augue. Morbi nulla, placerat turpis lectus rutrum ante a facilisi, suspendisse rhoncus integer sit quis, nam nunc velit commodo eu consequat at. Donec eget nunc orci id, pede commodo placerat. Praesent lacus, quisque metus sem. Rutrum lacus feugiat, dis dui, at malesuada leo in nisl. Ut laoreet integer nibh duis, fermentum ut ut metus id, curabitur semper amet faucibus. Non tempus odio fermentum, a vitae praesent. At at eros porta, mauris purus eget felis nullam, aliquet turpis nonummy velit justo. In dictum, venenatis iaculis, porttitor mauris nec, mauris eu aliquam amet elit, in pede vel.</p>
+
          <a href="https://2017.igem.org/Team:Lethbridge/Software" id="pageLink">Software</a> to keep synthetic biology safe</p>
 
         </div>
 
         </div>
 
     </div>
 
     </div>
 +
</center>
  
 +
<div style="clear: both"></div><br>
  
 +
<hr class="dividerLine">
  
−
<!--<img src="https://static.igem.org/mediawiki/2017/9/96/Temp_footer_banner.png" class="centerBanner fitBanner">-->
+
<center>
 +
    <div class="segmentContainer">
 +
        <div class="contentDiv" id="text40"><p class="text22">Curriculum aligned synthetic biology <a href="https://2017.igem.org/Team:Lethbridge/HP/Gold_Integrated" id="pageLink">teaching tool</a> <br><br>Simplified protocols</p>
 +
        </div>
 +
        <div class="contentDiv"><img src="https://static.igem.org/mediawiki/2017/d/df/T--Lethbridge--edkitsimple2.png" width=500px; height=421px; />
 +
        </div>
 +
    </div>
 +
</center>
  
−
 
+
     <div style="clear: both"></div>
−
 
+
<br><br><br><br><br>
−
<!--footer animation-->
+
−
<nav class="footerMenu">
+
</div>
−
  <input type="checkbox" href="#" class="footerMenu-open" name="footerMenu-open" id="footerMenu-open"/>
+
<br><br>
−
  <label class="footerMenu-open-button" for="footerMenu-open">
+
<img src="https://static.igem.org/mediawiki/2017/6/63/Banner_footer.png" alt="footer with sponsors" class="bannerImg">
−
     <span class="dots dots-1"></span>
+
−
    <span class="dots dots-2"></span>
+
−
    <span class="dots dots-3"></span>
+
−
  </label>
+
−
  <a href="#" class="footerMenu-item"> <i class="fa fa-topBrowser"></i> </a>
+
−
  <a href="#" class="footerMenu-item"> <i class="fa fa-nvhome"></i> </a>
+
−
  <!--<a href="#" class="footerMenu-item"> <i class="fa fa-heart"></i> </a>-->
+
−
  <!--<a href="#" class="footerMenu-item"> <i class="fa fa-envelope"></i> </a>-->
+
−
  <!--<a href="#" class="footerMenu-item"> <i class="fa fa-cog"></i> </a>-->
+
−
  <!--<a href="#" class="footerMenu-item"> <i class="fa fa-ellipsis-h"></i> </a>-->
+
−
</nav>
+
−
<!-- filters -->
+
−
<svg xmlns="http://www.w3.org/2000/svg" version="1.1">
+
−
    <defs>
+
−
      <filter id="shadowed-goo">
+
−
         
+
−
          <feGaussianBlur in="SourceGraphic" result="blur" stdDeviation="10" />
+
−
          <feColorMatrix in="blur" mode="matrix" values="1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 18 -7" result="goo" />
+
−
          <feGaussianBlur in="goo" stdDeviation="3" result="shadow" />
+
−
          <feColorMatrix in="shadow" mode="matrix" values="0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 1 -0.2" result="shadow" />
+
−
          <feOffset in="shadow" dx="1" dy="1" result="shadow" />
+
−
          <feBlend in2="shadow" in="goo" result="goo" />
+
−
          <feBlend in2="goo" in="SourceGraphic" result="mix" />
+
−
      </filter>
+
−
      <filter id="goo">
+
−
          <feGaussianBlur in="SourceGraphic" result="blur" stdDeviation="10" />
+
−
          <feColorMatrix in="blur" mode="matrix" values="1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 18 -7" result="goo" />
+
−
          <feBlend in2="goo" in="SourceGraphic" result="mix" />
+
−
      </filter>
+
−
    </defs>
+
−
</svg>
+
 
</body>
 
</body>
 
</html>
 
</html>

Latest revision as of 02:51, 2 November 2017

top

Cell-free Synthetic Biology
for the Masses







Why Cell-free?


Cell-free systems include all the necessary biomachinery to produce proteins outside of a living cell

Due to their inherent safety and simplicity, cell-free systems provide a powerful tool to synthetic biologists for engineering novel systems without the constraints of cellular life





Motivation

A lack of standardization, simplification and flexibility has limited the application of cell-free systems, including its use within the education system and Do-It-Yourself (DIY) community





Design

Lowering the barrier to synthetic biology, our project aims to create a STANDARD, SAFE, MODULAR, and USER-FRIENDLY cell-free system





Our System

A collection of standard parts for essential TX-TL components

Streamline and novel purification techniques




Software to keep synthetic biology safe


Curriculum aligned synthetic biology teaching tool

Simplified protocols








footer with sponsors