Team:ETH Zurich/project/overview

From 2014.igem.org

(Difference between revisions)
(Implementation in E. coli)
 
(315 intermediate revisions not shown)
Line 1: Line 1:
-
{{:Team:ETH Zurich/tpl/head}}
+
{{:Team:ETH Zurich/tpl/head|Overview of Mosai''coli''}}
-
{{:Team:ETH Zurich/tpl/head/overview}}
+
{{:Team:ETH Zurich/tpl/head/simplify}}
 +
{{:Team:ETH Zurich/tpl/head/animbuttons}}
-
<html>
+
<center>
 +
{{:Team:ETH Zurich/tpl/scrollbuttontworows|Our|Project|green}}
 +
{{:Team:ETH Zurich/tpl/scrollbuttontworows|Pattern|Emergence|blue}}
 +
{{:Team:ETH Zurich/tpl/scrollbuttontworows|Genetic|Circuits|red}}
 +
</center>
-
<h2> Summary </h2>
+
<html>
-
</html>
+
<div id="Our"  style='background-color:#FFFFFF; padding:2%;'> <article class="Our complex" style='margin-bottom:0;'> </html>  
-
{{:Team:ETH Zurich/project/overview/summary}}  
+
{{:Team:ETH Zurich/project/overview/summary}}
-
<html>
+
<html> </article> <article class="Our simple" style="display:none; margin-bottom:0;"> </html>  
 +
{{:Team:ETH Zurich/project/overview/summarysimple}}  
 +
<html> </article> </html>
 +
{{:Team:ETH Zurich/tpl/simpbutton|Our|green}}
 +
<html></div>
 +
<br/>
 +
<br/>
-
<h2> Background </h2>
+
<div id="Pattern" style='background-color:#FFFFFF; padding:2%;'> </html>
 +
{{:Team:ETH_Zurich/project/overview/grid}}
 +
<html> </div>
 +
<br/>
 +
<br/>
-
<div class="carousel"> </html>
+
<div id="Genetic" style='background-color:#FFFFFF; padding:2%;'></html>
-
{{:Team:ETH Zurich/project/overview/background}} <html>
+
== Implementation in ''E. coli'' ==
-
<p class="read-more"><a href="#" class="button twolines">Read More</a></p>
+
<center>
-
</div>
+
Here you can see our circuit in action. More details on how it works are <html> <a class="circled scrolly" href="#implementation"> just below</a></html>. For a comprehensive inventory of all parts used, you can check our [https://2014.igem.org/Team:ETH_Zurich/data Data page].
-
 
+
<html>
-
<h2> Our Project: Mosai<em>coli</em></h2>
+
<style>
-
 
+
@media
-
<h3> Principle and goals </h3>
+
only screen and (max-width: 760px),
-
<div class="carousel"> </html>
+
(min-device-width: 768px) and (max-device-width: 1024px)  {
-
{{:Team:ETH Zurich/project/overview/goals}} <html>
+
-
<p class="read-more"><a href="#" class="button twolines">Read More</a></p>
+
-
</div>
+
-
 
+
-
<h3> Implementation in E. <em>Coli</em> </h3>
+
-
 
+
-
<div class="carousel"> </html>
+
-
{{:Team:ETH Zurich/project/overview/implementation}} <html>
+
-
<p class="read-more"><a href="#" class="button twolines">Read More</a></p>
+
-
</div>
+
-
 
+
-
<h3> Biological tools : quorum sensing and integrases </h3>
+
-
 
+
-
<div class="carousel"> </html>
+
-
{{:Team:ETH Zurich/project/overview/tools}} <html>
+
-
<p class="read-more"><a href="#" class="button twolines">Read More</a></p>
+
-
</div>
+
-
 
+
-
 
+
-
<h2> Applications and outlook </h2>
+
-
<div class="carousel"> </html>
+
/* Force table to not be like tables anymore */
-
{{:Team:ETH Zurich/project/overview/applications}} <html>
+
table, thead, tbody, th, td, tr {
-
<p class="read-more"><a href="#" class="button twolines">Read More</a></p>
+
display: block;
 +
}
 +
 +
/* Hide table headers (but not display: none;, for accessibility) */
 +
thead tr {
 +
border:none;
 +
position: absolute;
 +
top: -9999px;
 +
left: -9999px;
 +
}
 +
 +
 +
td {
 +
/* Behave  like a "row" */
 +
border: none;;
 +
position: relative;
 +
}
 +
 +
td:before {
 +
/* Now like a table header */
 +
position: absolute;
 +
/* Top/left values mimic padding */
 +
top: 6px;
 +
left: 6px;
 +
width: 45%;
 +
padding-right: 10px;
 +
white-space: nowrap;
 +
}
 +
 +
}
 +
</style>
 +
</br>
 +
</br>
 +
<table style='width:100%; z-index:1;'>
 +
<tr style='border:2px solid black;'>
 +
<td>
 +
<div id="bloc1" style='margin-left:3em;'><h3 style='font-weight:800;'> Choose the cell type and the inputs:</h3></html>
 +
<br/>
 +
{{:Team:ETH_Zurich/tpl/animbuttonblue}}
 +
{{:Team:ETH_Zurich/tpl/animbuttonred}}
 +
<br/>
 +
{{:Team:ETH Zurich/tpl/animbuttonnoneblue|<html>width='160px' height='152.78px'</html>}}
 +
{{:Team:ETH Zurich/tpl/animbuttonlasblue|<html>width='160px' height='152.78px'</html>}}
 +
<br/>
 +
{{:Team:ETH Zurich/tpl/animbuttonluxblue|<html>width='160px' height='152.78px'</html>}}
 +
{{:Team:ETH Zurich/tpl/animbuttonbothblue|<html>width='160px' height='152.78px'</html>}}
 +
{{:Team:ETH Zurich/tpl/animbuttonnonered|<html>width='160px' height='152.78px'</html>}}
 +
{{:Team:ETH Zurich/tpl/animbuttonlasred|<html>width='160px' height='152.78px'</html>}}
 +
<br/>
 +
{{:Team:ETH Zurich/tpl/animbuttonluxred|<html>width='160px' height='152.78px'</html>}}
 +
{{:Team:ETH Zurich/tpl/animbuttonbothred|<html>width='160px' height='152.78px'</html>}}
 +
</center>
 +
<br/>
 +
<html></div>
 +
</td>
 +
<td>
 +
<div id="bloc2">
 +
<h3 style='text-align:center; font-weight:800;'>See how the information is processed to get the right output : </h3>
 +
<center>
 +
<img  class='animation' id='luxred' src='https://static.igem.org/mediawiki/2014/7/73/ETH_Zurich_Animation_luxred.gif'>
 +
<img  class='animation' id='lasred' src='https://static.igem.org/mediawiki/2014/5/5e/ETH_Zurich_Animation_lasred.gif'>
 +
<img  class='animation' id='bothred' src='https://static.igem.org/mediawiki/2014/1/15/ETH_Zurich_Animation_bothred.gif'>
 +
<img  class='animation' id='nonered' src='https://static.igem.org/mediawiki/2014/b/b0/ETH_Zurich_Animation_nonered.gif'>
 +
</center>
 +
<center>
 +
<img class='animation' id='bothblue' src='https://static.igem.org/mediawiki/2014/4/4e/ETH_Zurich_Animation_bothblue.gif'>
 +
<img class='animation' id='noneblue' src='https://static.igem.org/mediawiki/2014/6/6e/ETH_Zurich_Animation_noneblue.gif'>
 +
<img class='animation' id='luxblue' src='https://static.igem.org/mediawiki/2014/c/c4/ETH_Zurich_Animation_luxblue.gif'>
 +
<img class='animation' id='lasblue' src='https://static.igem.org/mediawiki/2014/6/64/ETH_Zurich_Animation_lasblue.gif'>
 +
</center></div>
 +
</td>
 +
</tr>
 +
</table>  
</div>
</div>
-
</html>
+
<div id="implementation" style='background-color:#FFFFFF; padding:2%;  text-align:left;'>
 +
<article class="implementation simple" style="display:none; margin-bottom:0;  padding-top:0;"> </html>
 +
{{:Team:ETH Zurich/project/overview/implementationsimple}}
 +
<html> </article><article class="implementation complex" style='margin-bottom:0;  padding-top:0;'> </html>
 +
{{:Team:ETH Zurich/project/overview/implementation}}
 +
<html> </article> </html>
 +
{{:Team:ETH Zurich/tpl/simpbutton2|implementation|blue}}
 +
<html></div> </html>
{{:Team:ETH Zurich/tpl/foot}}
{{:Team:ETH Zurich/tpl/foot}}

Latest revision as of 01:33, 18 October 2014

iGEM ETH Zurich 2014