Team:UCL
From 2014.igem.org
(Difference between revisions)
Lewismoffat (Talk | contribs) |
Adamdenyer (Talk | contribs) |
||
(108 intermediate revisions not shown) | |||
Line 1: | Line 1: | ||
{{:Team:UCL/Template:headerx}} | {{:Team:UCL/Template:headerx}} | ||
+ | {{:Team:UCL/Template:BioprocessStyles}} | ||
<html> | <html> | ||
Line 13: | Line 14: | ||
<![endif]--> | <![endif]--> | ||
- | + | ||
Line 23: | Line 24: | ||
</div> | </div> | ||
</header> | </header> | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
<main> | <main> | ||
<div id="slideabout" class="slide"> | <div id="slideabout" class="slide"> | ||
- | <div id="slideaboutcontent" class="slidecontent"> | + | <div id="slideaboutcontent" class="slidecontent" style="margin:3% 3% 3% 3%;"> |
- | + | ||
- | <h2> | + | <h2>OUR PROJECT</h2> |
- | + | ||
- | + | <p>We are using Synthetic Biology to beat <b>AZO DYE</b> Pollution. Azo Dyes are the most common synthetic dye and are used everywhere, from food colouring to clothes. You're probably wearing clothes dyed with Azo-Dyes! But, when they get into waste water, dumped from textile factories, they're very toxic. Our team is engineering bacteria that break down these dyes by producing a group of powerful enzymes. These bacteria make the Dye colourless and safe for the environment</p> | |
- | <p>We are using Synthetic Biology to | + | |
- | + | ||
- | + | ||
</div> | </div> | ||
</div> | </div> | ||
+ | |||
+ | <div style="position:relative"> | ||
+ | |||
+ | <div id="buttons"> | ||
+ | |||
+ | <div class="SCJBBHIGHLIGHT SCJBLACK" style="position:absolute;left:4%;top:1%;"><a href="https://2014.igem.org/Team:UCL/Project/About"><p> What we did </p></a></div> | ||
+ | |||
+ | <div class="SCJBBHIGHLIGHT SCJRED" style="position:absolute;left:10%;top:22%;"><a href="https://2014.igem.org/Team:UCL/Science"><p>We solidified the SCIENCE in the wet Lab</p></a></div> | ||
+ | <div class="SCJMMHIGHLIGHT SCJYELLOW" style="position:absolute;left:65%;top:20%;"><a href="https://2014.igem.org/Team:UCL/Science/Model"><p>We MODELLED the data to see the pathways</p></a></div> | ||
+ | <div class="SCJBBHIGHLIGHT SCJGREEN" style="position:absolute;left:25%;top:40%;"><a href="https://2014.igem.org/Team:UCL/Science/Bioprocessing""><p>We designed an entire MANUFACTURING and detoxifying facility</p></a></div> | ||
+ | <div class="SCJBBHIGHLIGHT SCJINDIGO" style="position:absolute;left:55%;top:55%;"><a href="https://2014.igem.org/Team:UCL/Project/Xenobiology"><p>We made our bacteria super safe using our XENOBIOLOGY</p></a></div> | ||
+ | <div class="SCJBBHIGHLIGHT SCJBLUE" style="position:absolute;left:5%;top:86%;"><a href="https://2014.igem.org/Team:UCL/Humans/Soci"><p>We ran an intense investigation into the SOCIOLOGICAL interactions of our team.</p></a></div> | ||
+ | <div class="SCJBBHIGHLIGHT SCJORANGE" style="position:absolute;left:65%;top:92%;"><a href="https://2014.igem.org/Team:UCL/Science/MicroF"><p>We de-mystified the magic of MICROFLUIDICS</a></p></div> | ||
+ | <div class="SCJBBHIGHLIGHT SCJVIOLET" style="position:absolute;left:10%;top:60%;"><a href="https://2014.igem.org/Team:UCL/Humans/Story"><p>We became a player in the PUBLIC AND INDUSTRY</a></p></div> | ||
+ | </div> | ||
+ | |||
+ | <div id="overviewholdero"> | ||
+ | <img src="https://static.igem.org/mediawiki/2014/6/6c/Overview_Graphic-01.png" style="width:100%;z-index:-10; position:relative;" /> | ||
+ | <!---<p style="margin-top:30px;margin-left:50%;margin-boottom:30px"><b>And much much more..........</b><br/></p>---> | ||
+ | </div> | ||
+ | |||
+ | </div> | ||
+ | |||
</main> | </main> | ||
</div> | </div> | ||
<style> | <style> | ||
- | + | ||
- | + | div.SCJBBHIGHLIGHT p { | |
- | margin: | + | color:white; |
- | + | border: solid 4px; | |
- | font-size: | + | border-radius: 10px; |
- | font- | + | display: table; |
- | color: | + | padding: 1%; |
+ | margin: 1px 1px 0px 1px; | ||
+ | box-shadow: 10px 10px 5px #888888; | ||
+ | font-size:0.8em; | ||
+ | } | ||
+ | |||
+ | div.SCJMMHIGHLIGHT p { | ||
+ | color:black; | ||
+ | border: solid 4px; | ||
+ | border-radius: 10px; | ||
+ | display: table; | ||
+ | padding: 1%; | ||
+ | margin: 1px 1px 0px 1px; | ||
+ | box-shadow: 10px 10px 5px #888888; | ||
+ | font-size:0.8em; | ||
+ | } | ||
+ | |||
+ | .SCJRED p { | ||
+ | background-color: red; | ||
+ | } | ||
+ | .SCJORANGE p { | ||
+ | background-color: orange; | ||
+ | } | ||
+ | .SCJORANGE a { | ||
+ | color: white; | ||
+ | } | ||
+ | .SCJYELLOW p { | ||
+ | color:black; | ||
+ | background-color: yellow; | ||
+ | } | ||
+ | .SCJGREEN p { | ||
+ | background-color: green; | ||
+ | } | ||
+ | .SCJBLUE p { | ||
+ | background-color: blue; | ||
+ | } | ||
+ | .SCJINDIGO p { | ||
+ | background-color: indigo; | ||
+ | color:white; | ||
+ | } | ||
+ | .SCJVIOLET p { | ||
+ | color:white !important; | ||
+ | background-color: violet; | ||
+ | } | ||
+ | .SCJVIOLET p a:visited { | ||
+ | color:white !important; | ||
+ | } | ||
+ | |||
+ | |||
+ | .SCJBLACK p { | ||
+ | margin-top:20px !important; | ||
+ | margin-left:40px !important; | ||
+ | margin-right:40px !important; | ||
+ | margin-bottom:20px !important; | ||
+ | |||
+ | font-size:2.2em !important; | ||
+ | background-color: black; | ||
+ | |||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | .slidecontent p { | ||
+ | text-align:center; | ||
+ | } | ||
+ | .buttonPrime { | ||
+ | margin:0 auto; | ||
+ | text-align:center; | ||
+ | width:65%; | ||
+ | padding:20px 0px; | ||
+ | margin-top:10px; | ||
+ | background-color:grey; | ||
+ | } | ||
+ | .buttonPrime:hover { | ||
+ | opacity:0.7; | ||
+ | } | ||
+ | .buttonKnob { | ||
+ | margin:0 auto; | ||
+ | text-align:center; | ||
+ | width:25%; | ||
+ | padding:30px 0px; | ||
+ | background-color:black; | ||
+ | color:white; | ||
+ | margin-top:50px; | ||
} | } | ||
.imageOverlayMain { | .imageOverlayMain { | ||
Line 65: | Line 156: | ||
width:100%; | width:100%; | ||
text-align:center; | text-align:center; | ||
- | |||
} | } | ||
.topCover { | .topCover { | ||
width:100%; | width:100%; | ||
height:50%; | height:50%; | ||
- | |||
} | } | ||
.bottomCover { | .bottomCover { | ||
width:100%; | width:100%; | ||
height:50%; | height:50%; | ||
- | |||
} | } | ||
#topLeft { | #topLeft { | ||
Line 81: | Line 169: | ||
width:49%; | width:49%; | ||
height:100%; | height:100%; | ||
- | |||
} | } | ||
#topLeft a:hover { | #topLeft a:hover { | ||
Line 90: | Line 177: | ||
width:49%; | width:49%; | ||
height:100%; | height:100%; | ||
- | |||
} | } | ||
#topRight a:hover { | #topRight a:hover { | ||
Line 99: | Line 185: | ||
width:49%; | width:49%; | ||
height:100%; | height:100%; | ||
- | |||
} | } | ||
#bottomLeft a:hover { | #bottomLeft a:hover { | ||
Line 108: | Line 193: | ||
width:49%; | width:49%; | ||
height:100%; | height:100%; | ||
- | |||
} | } | ||
#bottomRight a:hover { | #bottomRight a:hover { |
Latest revision as of 03:28, 18 October 2014