Line 1: | Line 1: | ||
− | {{Virginia/ | + | {{Virginia/body}} |
<html> | <html> | ||
− | <style | + | <head> |
+ | <style> | ||
− | /* | + | /*Title of Project*/ |
+ | .homeimagearea { | ||
+ | width:1200px; | ||
+ | text-align:center; | ||
+ | height:188px; | ||
+ | background-color:white; | ||
+ | margin: -1px auto 15px auto; | ||
+ | border-radius:5px 5px 0 0; | ||
+ | } | ||
− | + | .homeimagearea h1 { | |
− | + | font-size:110px; | |
− | + | text-align:center; | |
− | + | color:white; | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
} | } | ||
− | + | /*Box for content on page*/ | |
− | /* | + | .content1 { |
− | . | + | width:1190px; |
− | + | min-height:100px; | |
− | + | margin:-10px auto 12px auto; | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
} | } | ||
− | + | /*Divs for content blocks*/ | |
− | + | #introvideo { | |
− | + | display:inline-block; | |
− | + | background-color:#cce3ff; | |
− | + | height:368px; | |
− | + | width:590px; | |
− | + | border-radius:5px; | |
− | + | box-shadow:1px 1px 3px #80ccff; | |
− | + | ||
− | + | ||
− | + | ||
} | } | ||
− | + | /*The upper right div*/ | |
− | + | #homediv2 { | |
− | + | ||
− | + | ||
position:relative; | position:relative; | ||
+ | display:inline-block; | ||
+ | height:368px; | ||
+ | width:590px; | ||
+ | margin-left:6px; /*Automatic 4px space generated between inline-block elements*/ | ||
+ | background-image:url('https://static.igem.org/mediawiki/2016/f/fd/T--Virginia--teamphoto.jpeg'); | ||
background-repeat:no-repeat; | background-repeat:no-repeat; | ||
+ | background-size:cover; | ||
+ | border-radius:5px; | ||
+ | box-shadow:1px 1px 10px #80ccff; | ||
+ | vertical-align:top; | ||
} | } | ||
− | # | + | #stripe { |
− | + | background-color:white; | |
− | + | opacity:0.9; | |
− | + | height:100px; | |
+ | width:100%; | ||
+ | margin-top:119px; | ||
+ | text-align:center; | ||
+ | padding-top:1px; | ||
} | } | ||
− | # | + | #stripe div, #stripe2 div { |
− | margin-top: | + | margin-top:-10px; |
− | + | ||
− | + | ||
} | } | ||
− | # | + | #stripe div h1, #stripe2 div h1 { |
− | + | font-family:Lato, sans-serif; | |
− | + | font-size:80px; | |
− | + | color:#66b3ff; | |
+ | line-height:40px; | ||
} | } | ||
− | # | + | /*The bottom div*/ |
− | margin- | + | #proj { |
− | + | position:relative; | |
− | + | display:block; | |
+ | width:1190px; | ||
+ | height:187px; | ||
+ | margin-top:2px; | ||
+ | box-shadow:2px 2px 20px #80ccff; | ||
+ | border-radius:5px; | ||
+ | -webkit-backface-visibility: hidden; | ||
} | } | ||
− | + | #stripe2 { | |
position:absolute; | position:absolute; | ||
− | height: | + | width:1190px; |
− | + | height:100px; | |
− | + | text-align:center; | |
− | + | background-color:white; | |
− | + | opacity:0.9; | |
+ | top:50px; | ||
} | } | ||
− | # | + | |
− | + | /*Background images for bottom div*/ | |
+ | #back1, #back2, #back3, #back4, #back5 { | ||
+ | height:187px; | ||
+ | width:238px; | ||
+ | display:inline-block; | ||
+ | background-repeat:no-repeat; | ||
+ | background-size:cover; | ||
+ | |||
} | } | ||
− | # | + | #back1 { |
− | background-image:url( | + | background-image:url(https://static.igem.org/mediawiki/2016/e/e2/T--Virginia--labpic1.jpeg); |
+ | border-radius:5px 0 0 5px; | ||
} | } | ||
− | # | + | #back2 { |
− | background-image:url( | + | background-image:url(https://static.igem.org/mediawiki/2016/f/f7/T--Virginia--labpic2.jpeg); |
} | } | ||
− | # | + | #back3 { |
− | background-image:url( | + | background-image:url(https://static.igem.org/mediawiki/2016/b/b9/T--Virginia--labpic3.jpeg); |
} | } | ||
− | # | + | #back4 { |
− | + | background-image:url(https://static.igem.org/mediawiki/2016/8/84/T--Virginia--labpic4.jpeg); | |
} | } | ||
− | # | + | #back5 { |
− | + | background-image:url(https://static.igem.org/mediawiki/2016/1/12/T--Virginia--labpic5.jpeg); | |
+ | border-radius:0 5px 5px 0; | ||
} | } | ||
− | # | + | |
− | + | /*Fade in divs*/ | |
− | + | #homepagefadein1 { | |
+ | position:absolute; | ||
+ | width:100%; | ||
+ | bottom:0; | ||
+ | height:148px; | ||
+ | border-radius:0 0 5px 5px; | ||
+ | opacity:0; | ||
+ | transition:opacity 200ms; | ||
+ | background-color:rgba(0,0,0,0.8); | ||
} | } | ||
− | # | + | |
− | + | #fadeintext { | |
+ | margin:20px; | ||
+ | height:328px; | ||
+ | width:550px; | ||
+ | color:white; | ||
} | } | ||
− | + | ||
− | + | #homepagefadein1 a, #homepagefadein2 a { | |
− | + | color:#66b3ff; | |
− | + | font-size:17px; | |
− | + | text-decoration:none; | |
− | + | font-family:Lato, sans-serif; | |
− | + | position:absolute; | |
− | + | bottom:10px; | |
− | + | right:20px; | |
− | + | ||
− | + | ||
} | } | ||
− | + | ||
− | + | #homepagefadein1 a:hover, #homepagefadein2 a:hover { | |
− | + | text-decoration:underline; | |
− | + | ||
} | } | ||
− | + | ||
− | + | #homepagefadein2 { | |
− | + | position:absolute; | |
− | + | width:100%; | |
− | + | bottom:0; | |
− | + | height:138px; | |
+ | border-radius:0 0 5px 5px; | ||
+ | opacity:0; | ||
+ | transition:opacity 200ms; | ||
+ | background-color:rgba(0,0,0,0.8); | ||
} | } | ||
− | + | ||
− | + | #fadeintext2 { | |
− | + | margin:10px 20px 20px 20px; | |
− | + | width:1150px; | |
− | + | height:98px; | |
− | + | color:white; | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
} | } | ||
− | + | ||
− | + | #fadeintext2 h1 { | |
+ | font-size:20px; | ||
+ | color:#66b3ff; | ||
+ | font-family:Lato, sans-serif; | ||
} | } | ||
− | + | ||
− | + | </style> | |
− | + | </head> | |
− | + | <body> | |
− | + | <div class="maindiv"> | |
− | + | ||
− | + | <!-----------------------------------Space reserved for menu------------------------------------> | |
− | + | <div id="menuspace"></div> | |
+ | |||
+ | <!-----------------------------------Container div----------------------------------------------> | ||
+ | <div class="container"> | ||
+ | |||
+ | <!---------------------------Top image on page------------------------------------------> | ||
+ | <div class="homeimagearea" style="background-color:#ffa366"> | ||
+ | <h1 style="line-height:100px">LEU-LOCK</h1> | ||
+ | </div> | ||
+ | |||
+ | |||
+ | <!---------------------------Page title area--------------------------------------------> | ||
+ | <!--<div class="pagetitle"> | ||
+ | <h1 style="color:#66b3ff">Project Overview</h1> | ||
+ | </div>--> | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | <!---------------------------Main content section of page-------------------------------> | ||
+ | <div class="content1"> | ||
+ | <div id="introvideo"> | ||
+ | </div> | ||
+ | |||
+ | <div id="homediv2"> | ||
+ | <div id="stripe"> | ||
+ | <div><h1>WHO ARE WE?</h1></div> | ||
+ | </div> | ||
+ | <div id="homepagefadein1"> | ||
+ | <div id="fadeintext"> | ||
+ | <p><span class="p">We are a team of undergraduate students from the University of Virginia with a shared interest in synthetic biology. | ||
+ | We hail from five different states, and our majors include biology, biochemistry, chemical engineering, biomedical engineering, | ||
+ | neuroscience, statistics, and nanomedicine engineering.<br> | ||
+ | </span></p> | ||
+ | </div> | ||
+ | <a href="https://2016.igem.org/Team:Virginia/Team" target="_blank">More about the team →</a> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | <div id="proj"> | ||
+ | <div id="back1"></div><div id="back2"></div><div id="back3"></div><div id="back4"></div><div id="back5"></div> | ||
+ | <div id="stripe2"> | ||
+ | <div><h1>THE PROJECT</h1></div> | ||
+ | </div> | ||
+ | <div id="homepagefadein2"> | ||
+ | <div id="fadeintext2"> | ||
+ | <h1>Leu-Lock</h1> | ||
+ | <p><span class="p">We set out to design a novel biocontainment mechanism based upon the modification of the leucyl tRNA synthetase enzyme. | ||
+ | Our system causes the biocontained organism to be dependent upon a synthetic form of leucine for survival - | ||
+ | hence the title of our project. To implement the system in <i>E. coli</i>, CRISPR Cas9 was used to knockout the native | ||
+ | <i>E. coli</i> tRNA synthetase gene, and the modified synthetase gene was inserted into the bacterial cells. | ||
+ | </span></p> | ||
+ | </div> | ||
+ | <a href="https://2016.igem.org/Team:Virginia/Description">Project Overview →<a/> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | </div> | ||
+ | |||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | |||
+ | <script> | ||
+ | |||
+ | document.getElementById("homediv2").onmouseover = function() { | ||
+ | document.getElementById("homepagefadein1").style.opacity = "1"; | ||
} | } | ||
− | + | ||
− | + | document.getElementById("homediv2").onmouseout = function() { | |
+ | document.getElementById("homepagefadein1").style.opacity = "0"; | ||
} | } | ||
− | + | ||
− | + | document.getElementById("proj").onmouseover = function() { | |
− | + | document.getElementById("homepagefadein2").style.opacity = "1"; | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
} | } | ||
− | + | ||
− | + | document.getElementById("proj").onmouseout = function() { | |
− | + | document.getElementById("homepagefadein2").style.opacity = "0"; | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
} | } | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | + | ||
− | + | ||
− | + | </script> | |
− | < | + | </body> |
− | + | </html> | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + |
Revision as of 15:02, 5 August 2016
LEU-LOCK
WHO ARE WE?
We are a team of undergraduate students from the University of Virginia with a shared interest in synthetic biology.
We hail from five different states, and our majors include biology, biochemistry, chemical engineering, biomedical engineering,
neuroscience, statistics, and nanomedicine engineering.
THE PROJECT
Leu-Lock
We set out to design a novel biocontainment mechanism based upon the modification of the leucyl tRNA synthetase enzyme. Our system causes the biocontained organism to be dependent upon a synthetic form of leucine for survival - hence the title of our project. To implement the system in E. coli, CRISPR Cas9 was used to knockout the native E. coli tRNA synthetase gene, and the modified synthetase gene was inserted into the bacterial cells.