Difference between revisions of "Team:Lethbridge"

 
(207 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>
/*SIDE MENU 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 {padding-top: 3.89em; font-family: Arial, sans-serif !important; background-color:#F2F2F2;}
 
.fitBanner {max-width: 100%; height:auto;}
 
.textTitle {font-size: 200%; font-style: oblique; text-align: center;}
 
 
p {text-align: center !important;}
 
p {text-align: center !important;}
h1 {font-size: 4vw; text-align: center;}
 
  
.segmentHeader {font-size: 4vw; overflow: hidden; text-align: center;}
+
/* FOR INLINE-BLOCK PURPOSES */
.segmentHeader:before, .segmentHeader:after {background-color: black; content: ""; display: inline-block; height: 3px; position: relative; vertical-align: middle; width: 50%;}
+
.contentDiv {display: inline-block;}
.segmentHeader:before {margin-left: -50%; right- 0.5 em;}
+
#text60 {width: 60%; vertical-align:middle;}
.segmentHeader:after {left: 0,5em; margin-right: -50%;}
+
#text50 {width: 50%; vertical-align:middle;}
.segmentDiv {margin-left: 5%; margin-right: 5%;}
+
#text40 {width: 40%; vertical-align:middle;}
.segmentP {font-size: 2.5vw !important;}
+
#text30 {width: 30%; vertical-align:middle;}
.segmentP2 {font-size: 2.2vw !important;}
+
#text25 {width: 25%; vertical-align:middle;}
  
.testContentDiv {display: inline-block;}
+
/* not for all pages, since all pages do not use inline-block */
.testContainer p {font-size: calc(18px + 0.5vw) !important; line-height: calc(1.1em + 0.5vw) !important;}
+
@media only screen and (max-width: 500px) {
#testText50 {width: 50%; vertical-align:middle;}
+
    #allContent img {width: 95%; height: 95%;}}
#testText25 {width: 50%; vertical-align:middle;}
+
.testContainer .testImageDiv40 {width:40; height: 100%; float: right;}
+
.testContainer .testImageDiv img {display: block; height: auto; max-width: 100%;}
+
.testContainer .testImageDiv65 {width:40; height: 100%; float: right;}
+
  
 
</style>
 
</style>
 
<body>
 
<body>
<img src="https://static.igem.org/mediawiki/2017/c/c9/Logo_banner.png" class="fitBanner">
+
<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>-->
  
<div><h1>Cell-free Synthetic Biology<br> for the Masses</h1></div><br><br>
+
<p id="slogan">Cell-free Synthetic Biology<br> for the Masses</p><br>
  
<center><div class="testContainer">
+
<!-- anchor buttons -->
    <div class="testContentDiv" id="testText50"><p>content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content</p></div>
+
<br>
    <div class="testContentDiv" id="testImageDiv40"><img src="https://static.igem.org/mediawiki/2017/6/63/Tempbiophoto.jpg" class="testImage" id="testImage" width=300 height=300 /></div>
+
<center>
</div></center>
+
<form>
 +
    <input class="tealButton" type="button" value="Why Cell-free?" onclick="window.location.href='#anchor1'" />
 +
</form>
 +
   
 +
<form>
 +
    <input class="tealButton" type="button" value="Motivation" onclick="window.location.href='#anchor2'" />
 +
</form>
 +
   
 +
<form>
 +
    <input class="tealButton" type="button" value="Design" onclick="window.location.href='#anchor3'" />
 +
</form>
 +
   
 +
<form>
 +
    <input class="tealButton" type="button" value="Our System" onclick="window.location.href='#anchor4'" />
 +
</form>
 +
<div style="clear:both" id="anchor1"></div>
 +
</center>
  
<div style="clear: both"></div>
+
<br><br><br><br>
 +
<h2 class="segmentHeader">Why Cell-free?</h2>
  
<h3 class="segmentHeader">Why Cell-free?</h3>
+
<center>
<center><div class="testContainer">
+
    <div class="segmentContainer">
<div class="testContentDiv" id="testText25"><p><br>Cell-free systems include all the necessary biomachinery for producing 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" 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 class="testContentDiv" id="testImageDiv65"><img src="https://static.igem.org/mediawiki/2017/b/b4/Celltocellfree.png" width=384px; height=500px; padding:10px; class="testImage" /></div>
+
        </div>
</div></center>
+
        <div class="contentDiv"><img src="https://static.igem.org/mediawiki/2017/b/b4/Celltocellfree.png" width=384px; height=500px; padding:10px; />
 +
        </div>
 +
    </div>
 +
</center>
  
<div style="clear: both"></div>
+
<div style="clear: both" id="anchor2"></div>
  
<h3 class="segmentHeader">Motivation</h3>
+
<br><br><br><br>
<center><div class="testContainer">
+
<h2 class="segmentHeader">Motivation</h2>
<p style="margin-left: 5%; margin-right: 5%">A lack of standardization, simplification and flexibility has limited the application of cell-free systems, including its use within the education system and DIY community</p></div></center>
+
<center><img src="https://static.igem.org/mediawiki/2017/4/40/Userswithtext.png" width=704px; height=250px; padding: 30px class="fitBanner" /></center>
+
<div style="clear: both"></div><br>
+
  
<h3 class="segmentHeader">Design</h3>
+
<center>
<center><div class="testContainer">
+
    <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>
<p style="margin-left: 5%; margin-right: 5%">To lower the barrier of synthetic biology our project aims to create a <b>STANDARD</b>, <b>SAFE</b>, <b>MODULAR</b> and <b>USER-FRIENDLY</b> cell-free system</p></div></center>
+
    </div>
<center><img src="https://static.igem.org/mediawiki/2017/1/16/Designwithwords.png" width=712px; height=200px; padding: 30px; class="fitBanner" /></center>
+
</center>
  
 +
<center>
 +
    <img src="https://static.igem.org/mediawiki/2017/4/40/Userswithtext.png" width=704px; height=250px; padding: 30px class="bannerImg" />
 +
</center>
  
 +
<div style="clear: both" id="anchor3"></div>
  
 +
<br><br><br><br>
 +
<h2 class="segmentHeader">Design</h2>
  
<hr>
+
<center>
 +
    <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>
 +
    </div>
 +
</center>
  
    <div class="segmentDiv"">
+
<center>
        <div class="centerContainer">
+
    <img src="https://static.igem.org/mediawiki/2017/1/16/Designwithwords.png" width=712px; height=200px; padding: 30px; class="bannerImg" />
        <h3 class="segmentHeader">Design</h3>
+
</center>
        <p class="segmentP">To lower the barrier of synthetic biology our project aims to create a <b>STANDARD</b>, <b>SAFE</b>, <b>MODULAR</b> and <b>USER-FRIENDLY</b> cell-free system</p>
+
</div>
+
</div>
+
  
<center><img src="https://static.igem.org/mediawiki/2017/1/16/Designwithwords.png" width=712px; height=200px; padding: 30px; class="fitBanner" /></center>
+
<div style="clear: both" id="anchor4"></div>
  
<div style="clear: both"></div><br><br>
+
<br><br><br><br>
 +
<h2 class="segmentHeader">Our System</h2>
  
     <div class="segmentDiv">
+
<center>
         <div class="centerContainer">
+
     <div class="segmentContainer">
        <h3 class="segmentHeader">Our System</h3>
+
         <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>
        <img src="https://static.igem.org/mediawiki/2017/3/3b/Generalfigure.png" style="float:right"; width=494px; height=350px; padding:30px class="widthImage" />
+
        <p class="segmentP2"><br>A collection of standard parts for essential TX-TL components<br><br><br><br><br>Streamline and novel purification techniques</p>
+
 
         </div>
 
         </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>
 +
</center>
 +
               
 
<div style="clear: both"></div><br><br>
 
<div style="clear: both"></div><br><br>
  
      <div class="segmentDiv">
+
<hr class="dividerLine">
          <img src="https://static.igem.org/mediawiki/2017/1/13/Codonswappingwithwords.png" style="float:left" width=408px; height=200px; class="leftImage" />
+
   
          <p class="segmentP2"><br><br> A tool to create an orthogonal system</p>
+
<center>
      </div>
+
    <div class="segmentContainer">
 +
        <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>
 +
        </div>
 +
        <div class="contentDiv" id="text40"><p class="text22"><br>
 +
          <a href="https://2017.igem.org/Team:Lethbridge/Software" id="pageLink">Software</a> to keep synthetic biology safe</p>
 +
        </div>
 +
    </div>
 +
</center>
  
<div style="clear: both"></div><br><br>
+
<div style="clear: both"></div><br>
  
      <div class="segmentDiv">
+
<hr class="dividerLine">
          <img src="https://static.igem.org/mediawiki/2017/1/1c/Softwarewithwords.png" style="float:left" width=408px; height=252px; class="leftImage" />
+
          <p class="segmentP2"><br><br>A tool to detect potentially harmful encrypted sequences</p>
+
      </div>
+
  
<div style="clear: both"></div><br><br>
+
<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 class="segmentDiv">
+
    <div style="clear: both"></div>
          <img src="https://static.igem.org/mediawiki/2017/3/36/Educationkit.png" style="float:right" width=542px; height=400px; class="leftImage" />
+
<br><br><br><br><br>
          <p class="segmentP2"><br><br><br>A safe synthetic biology teaching tool<br><br>Simplified protocols<br><br>Curriculum aligned lesson plans</p>
+
      </div>
+
</div>
 
+
<br><br>
<div style="clear: both"></div>
+
<img src="https://static.igem.org/mediawiki/2017/6/63/Banner_footer.png" alt="footer with sponsors" class="bannerImg">
<!--<img src="https://static.igem.org/mediawiki/2017/9/96/Temp_footer_banner.png" class="centerBanner fitBanner">-->
+
 
</body>
 
</body>
 
</html>
 
</html>

Latest revision as of 02:51, 2 November 2017


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