Difference between revisions of "Team:Lethbridge"

 
(513 intermediate revisions by 7 users not shown)
Line 1: Line 1:
−
{{Team:Lethbridge/assets/fonts.css}}
+
{{Team:Lethbridge/assets/reset.css}}
 +
{{Team:Lethbridge/assets/sidemenuremove.css}}
 +
{{Team:Lethbridge/navbar}}
 +
{{Team:Lethbridge/assets/allpages.css}}
 +
{{Team:Lethbridge/top}}
 
<html>
 
<html>
−
<head>
+
<style>
−
    <style type="text/css">
+
/*RESET AND REMOVAL CSS IS PART OF RESET AND SIDEMENUREMOVE TEMPLATE*/
−
/*Wiki Style Reset (From U of C).
+
/* RULES FOR ALL PAGES ARE PART OF THE ALLPAGES.CSS TEMPLATE*/
−
    Resets the wiki style by overriding with a reset stylesheet. The relevant wiki css rules are reset by using rules with higher priority.  (Written by Florian Albrecht).  Shoutout to the 2016 U of C wiki */
+
/* RULES FOR THIS PAGE ONLY */
−
    /* Start general reset ================================================== */
+
−
    /* changed background-color and color */
+
−
        html body {font-size: inherit;font-family: inherit;background-color: #FFFFFF;color: #01259B;padding: 0;}
+
−
        div#globalWrapper {font-size: inherit;margin: 0;padding: 0;position: static;width: auto;}
+
−
    /* Start top-section reset ============================================== */
+
−
        div#top-section {border: 0;height: auto;margin: 0;position: static;width: auto;}
+
−
        div#p-logo {height: auto;position: static;width: auto;z-index: auto;}
+
−
        div#p-logo a, div#p-logo a:hover {text-decoration: none; font-family: 'Roboto', sans-serif;}
+
−
        div#menubar {font-family: inherit;font-size: inherit;line-height: inherit;position: static;top: 0px;white-space: normal;width: auto;z-index: auto;}
+
−
        div.left-menu, div.left-menu a {color: inherit;left: 0;text-align: left;text-transform: none;font-family: 'Roboto', sans-serif;}
+
−
        div#menubar ul {color: inherit;list-style: disc outside none;margin: 0;padding: 0; font-family: 'Roboto', sans-serif;}
+
−
        div#menubar li {cursor: auto;display: list-item;padding: 0;margin: 0;position: static; font-family: 'Roboto', sans-serif;}
+
−
        div.left-menu li a {padding: 0; font-family: 'Roboto', sans-serif;}
+
−
        div.left-menu:hover {color: inherit;background-color: transparent;}
+
−
        div.left-menu:hover a {color: inherit;font-family: 'Roboto', sans-serif;}
+
−
        div.right-menu, div.right-menu a {color: inherit;right: 0;text-align: left;font-family: 'Roboto', sans-serif;}
+
−
        div.right-menu li a {background-color: transparent;color: inherit;padding: 0;font-family: 'Roboto', sans-serif;}
+
−
        div.right-menu li a:hover {color: inherit;text-decoration: none;font-family: 'Roboto', sans-serif;}
+
−
        div#search-controls {background-color: transparent;height: auto;position: static;right: 0;text-align: left;top: 0;width: auto;z-index: auto;}
+
−
    /* Start content reset ================================================== */
+
−
        div#content {background: transparent;border: 0;color: inherit;line-height: inherit;margin: 0;padding: 0;position: static;width: auto;z-index: auto;}
+
−
        a:link, a:hover, a:active, a:visited{color: white; text-decoration: none;font-family: 'Roboto', sans-serif;}
+
−
        body li {margin: 0; font-family: 'Roboto', sans-serif;}
+
−
        body h1, body h2, body h3, body h4, body h5, body h6 {background: transparent;border: 0;color: inherit;padding: 0; font-family: 'Roboto', sans-serif;}
+
−
        body .firstHeading {margin: 0;}
+
−
        div#contentSub {color: inherit;font-size: inherit;line-height: inherit;margin: 0;width: auto;}
+
−
        div#catlinks {background-color: transparent;border: 0;clear: both;margin: 0;padding: 0;}
+
−
    /* Start footer reset =================================================== */
+
−
        div#footer-box {background-color: transparent;border: 0;margin: 0;padding: 0;width: auto;}
+
−
        div#footer {color: inherit;font-size: inherit;text-align: left;}
+
−
        div#f-poweredbyico, div#f-copyrightico {float: none;}
+
−
        div#footer li {margin: 0;display: list-item; font-family: 'Roboto', sans-serif;}
+
  
−
/*SideMenu for iGEM Stuff*/
+
p {text-align: center !important;}
−
      #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;}
+
−
      #content{width: 100%;padding: 0px;margin-left: 0px;}
+
−
      #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 */
+
  
−
        .projectDesc {
+
/* FOR INLINE-BLOCK PURPOSES */
−
            width: 50%;
+
.contentDiv {display: inline-block;}
−
            margin: 0 auto;
+
#text60 {width: 60%; vertical-align:middle;}
−
            text-align:center;
+
#text50 {width: 50%; vertical-align:middle;}
−
        }
+
#text40 {width: 40%; vertical-align:middle;}
−
       
+
#text30 {width: 30%; vertical-align:middle;}
−
        div.partsComp {
+
#text25 {width: 25%; vertical-align:middle;}
−
            padding: 10px;
+
−
            width: 50%;
+
−
            margin: 0 auto;
+
−
            color: #000000;
+
−
        }
+
−
       
+
−
        .partsCompNumber {
+
−
            animation: blinker 1s infinite alternate;
+
−
        }
+
−
   
+
−
        @keyframes blinker {
+
−
            50% {text-shadow: 0 0 10px #FF0000;}
+
−
        }
+
−
    </style>
+
−
</head>
+
  
 +
/* 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>
 
<body>
−
    <div class="projectDesc">
+
<br>
−
        <br><br>
+
<img src="https://static.igem.org/mediawiki/2017/5/56/Banner_nextvivo.png" class="bannerImg">
−
        <img src="https://static.igem.org/mediawiki/2017/9/9f/Uleth_igem_400.png" />
+
<div id="allContent"><!--div to set margin for all content but header and footer image -->
−
        <h2 style="color:black;">Project Description:</h2>
+
<!--<div class="circleTop" style="margin-left:90%"><a href="#top">top</a></div>-->
−
        <p style="color:black;">Our goal this season is to create modular, easily attainable, and cost-effective cell-free transcription and translation systems to make synthetic biology accessible to not only scientists and other iGEM teams, but also to the masses including educators. Ex vivo systems are ideal for a variety of applications for they are easily contained, non-proliferating, non-toxic, and allow for the precise control of molecular interactions. Such systems can be lyophilized for use in paper-based applications or encapsulated in lipid vesicles (liposomes), providing advantages over bulk solution by minimizing issues with diffusion. With increased modularity,  predictability and freedom of design, these modular cell-free expression units have been explored for use in bioremediation, prototyping, directed evolution of proteins, design of a synthetic minimal cell, and biosensor development. These studies have shown great potential in cell-free expression systems but continued advancements and innovations are required for the widespread use of these devices. The creation of this system can be tailored to specific reactions by removal of unnecessary components depending on the designed construct.</p>
+
 
 +
<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>
 +
   
 +
<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>
 +
 
 +
<br><br><br><br>
 +
<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>
 
     </div>
 +
</center>
 +
 +
<div style="clear: both" id="anchor2"></div>
 +
 +
<br><br><br><br>
 +
<h2 class="segmentHeader">Motivation</h2>
 +
 +
<center>
 +
    <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>
 +
    </div>
 +
</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>
 +
 +
<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>
 +
 +
<center>
 +
    <img src="https://static.igem.org/mediawiki/2017/1/16/Designwithwords.png" width=712px; height=200px; padding: 30px; class="bannerImg" />
 +
</center>
 +
 +
<div style="clear: both" id="anchor4"></div>
 +
 +
<br><br><br><br>
 +
<h2 class="segmentHeader">Our System</h2>
 +
 +
<center>
 +
    <div class="segmentContainer">
 +
        <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>
 +
        </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>
 +
 +
<hr class="dividerLine">
 
      
 
      
−
     <div class="partsComp">
+
<center>
−
         <p style="font-family:Orbitron; font-size: 200%; text-align: center;">Parts Completed: <br><span class="partsCompNumber">3</span></p>
+
     <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>
 
     </div>
 +
</center>
 +
 +
<div style="clear: both"></div><br>
 +
 +
<hr class="dividerLine">
 +
 +
<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>
 +
 +
</div>
 +
<br><br>
 +
<img src="https://static.igem.org/mediawiki/2017/6/63/Banner_footer.png" alt="footer with sponsors" class="bannerImg">
 
</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