|
|
Line 1: |
Line 1: |
| <html> | | <html> |
| <head> | | <head> |
− | <title>Theory by TEMPLATED</title> | + | <title>iGEM Warwick 2016 - Home</title> |
| <meta charset="utf-8" /> | | <meta charset="utf-8" /> |
| <meta name="viewport" content="width=device-width, initial-scale=1" /> | | <meta name="viewport" content="width=device-width, initial-scale=1" /> |
Line 29: |
Line 29: |
| <!-- Banner --> | | <!-- Banner --> |
| <section id="banner"> | | <section id="banner"> |
− | <h1>Our Project</h1> | + | <h1>Warwick iGEM 2016</h1> |
− | <p>From design to Product.</p> | + | <p>Application of CRISPR/Cas9 as a novel modular biosensor</p> |
| </section> | | </section> |
| | | |
− | <!-- Header --> | + | <!-- One --> |
| <section id="one" class="wrapper"> | | <section id="one" class="wrapper"> |
| <div class="inner"> | | <div class="inner"> |
Line 39: |
Line 39: |
| <article> | | <article> |
| <header> | | <header> |
− | <h3>The Brainstorm</h3> | + | <h3>CRISPR/Cas9<br /> biosensor.</h3> |
| </header> | | </header> |
− | <p>Planning our project</p> | + | <p>Using a dCas9 protein and an RNA-binding protein (RBP) fused to an effector, transcription of a fluorescent reporter gene can be regulated, with a significant colour change indicating the presence of targeted RNA.</p> |
− | <footer>
| + | |
− | <a href="#brainstorming" class="moreButton">More</a>
| + | |
− | </footer>
| + | |
− | </article>
| + | |
− | <article>
| + | |
− | <header>
| + | |
− | <h3>The Lyme's Project</h3>
| + | |
− | </header>
| + | |
− | <p>Our Lyme's Disease detector.</p>
| + | |
− | <footer>
| + | |
− | <a href="#lymes" class="moreButton">More</a>
| + | |
− | </footer>
| + | |
− | </article>
| + | |
− | <article>
| + | |
− | <header>
| + | |
− | <h3>Metal Aptamers Project</h3>
| + | |
− | </header>
| + | |
− | <p>Detecting Heavy Metals.</p>
| + | |
− | <footer>
| + | |
− | <a href="#metals" class="moreButton">More</a>
| + | |
− | </footer>
| + | |
− | </article>
| + | |
− | </div>
| + | |
− | </div>
| + | |
− | </section>
| + | |
− | | + | |
− | <!-- Plasmids -->
| + | |
− | <section id="two" class="wrapper style1 special">
| + | |
− | <div class="inner">
| + | |
− | <div class="flex flex-4">
| + | |
− | <div class="box person">
| + | |
− | <h3>Lyme's Plasmid</h3>
| + | |
− | <div class="image round">
| + | |
− | <img src="images/pic03.jpg" alt="Lyme's Plasmid" />
| + | |
− | </div>
| + | |
− | </div>
| + | |
− | <div class="box person">
| + | |
− | <h3>L.Plasmid</h3>
| + | |
− | <div class="image round">
| + | |
− | <img src="images/pic03.jpg" alt="L.Plasmid" />
| + | |
− | </div>
| + | |
− | </div>
| + | |
− | <div class="box person">
| + | |
− | <h3>L.Plasmid</h3>
| + | |
− | <div class="image round">
| + | |
− | <img src="images/pic03.jpg" alt="L.Plasmid" />
| + | |
− | </div>
| + | |
− | </div>
| + | |
− | <div class="box person">
| + | |
− | <h3>Metal Plasmid</h3>
| + | |
− | <div class="image round">
| + | |
− | <img src="images/pic03.jpg" alt="Metal Plasmid" />
| + | |
− | </div>
| + | |
− | </div>
| + | |
− | </div>
| + | |
− | </div>
| + | |
− | </section>
| + | |
− | | + | |
− | <!-- Brainstorming -->
| + | |
− | <div id="brainstorming">
| + | |
− | <section id="three" class="wrapper special">
| + | |
− | <div class="inner">
| + | |
− | <header class="align-center">
| + | |
− | <h2>Brainstorming</h2>
| + | |
− | </header>
| + | |
− | <div class="flex flex-2">
| + | |
− | <article>
| + | |
− | <header>
| + | |
− | <h3>Praesent placerat magna</h3>
| + | |
− | </header>
| + | |
− | <p>Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor lorem ipsum.</p>
| + | |
− | <footer>
| + | |
− | <a href="#" class="button special">More</a>
| + | |
− | </footer>
| + | |
− | </article>
| + | |
− | <article>
| + | |
− | <div class="image fit">
| + | |
− | <img src="images/pic02.jpg" alt="Pic 02" />
| + | |
− | </div>
| + | |
− | </article>
| + | |
− | </div>
| + | |
− | </div>
| + | |
− | </section>
| + | |
− | </div>
| + | |
− |
| + | |
− | <!-- Lyme's Project -->
| + | |
− | <div id="lymes">
| + | |
− | <section id="three" class="wrapper special">
| + | |
− | <div class="inner">
| + | |
− | <header class="align-center">
| + | |
− | <h2>The Lyme's Project</h2>
| + | |
− | <p>Aliquam erat volutpat nam dui </p>
| + | |
− | </header>
| + | |
− | <div class="flex flex-2">
| + | |
− | <article>
| + | |
− | <header>
| + | |
− | <h3>Praesent placerat magna</h3>
| + | |
− | </header>
| + | |
− | <p>Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor lorem ipsum.</p>
| + | |
− | <footer>
| + | |
− | <a href="#" class="button special">More</a>
| + | |
− | </footer>
| + | |
− | </article>
| + | |
− | <article>
| + | |
− | <div class="image fit">
| + | |
− | <img src="images/pic02.jpg" alt="Pic 02" />
| + | |
− | </div>
| + | |
− | </article>
| + | |
− | <article>
| + | |
− | <header>
| + | |
− | <h3>Praesent placerat magna</h3>
| + | |
− | </header>
| + | |
− | <p>Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor lorem ipsum.</p>
| + | |
− | <footer>
| + | |
− | <a href="#" class="button special">More</a>
| + | |
− | </footer>
| + | |
− | </article>
| + | |
− | <article>
| + | |
− | <div class="image fit">
| + | |
− | <img src="images/pic02.jpg" alt="Pic 02" />
| + | |
− | </div>
| + | |
− | </article>
| + | |
− | <article>
| + | |
− | <header>
| + | |
− | <h3>Praesent placerat magna</h3>
| + | |
− | </header>
| + | |
− | <p>Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor lorem ipsum.</p>
| + | |
− | <footer>
| + | |
− | <a href="#" class="button special">More</a>
| + | |
− | </footer>
| + | |
− | </article>
| + | |
− | <article>
| + | |
− | <div class="image fit">
| + | |
− | <img src="images/pic02.jpg" alt="Pic 02" />
| + | |
− | </div>
| + | |
− | </article>
| + | |
− | <article>
| + | |
− | <header>
| + | |
− | <h3>Praesent placerat magna</h3>
| + | |
− | </header>
| + | |
− | <p>Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor lorem ipsum.</p>
| + | |
− | <footer>
| + | |
− | <a href="#" class="button special">More</a>
| + | |
− | </footer>
| + | |
− | </article>
| + | |
− | <article>
| + | |
− | <div class="image fit">
| + | |
− | <img src="images/pic02.jpg" alt="Pic 02" />
| + | |
− | </div>
| + | |
− | </article>
| + | |
− | <article>
| + | |
− | <header>
| + | |
− | <h3>Praesent placerat magna</h3>
| + | |
− | </header>
| + | |
− | <p>Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor lorem ipsum.</p>
| + | |
− | <footer>
| + | |
− | <a href="#" class="button special">More</a>
| + | |
− | </footer>
| + | |
− | </article>
| + | |
− | <article>
| + | |
− | <div class="image fit">
| + | |
− | <img src="images/pic02.jpg" alt="Pic 02" />
| + | |
− | </div>
| + | |
− | </article>
| + | |
− | <article>
| + | |
− | <header>
| + | |
− | <h3>Praesent placerat magna</h3>
| + | |
− | </header>
| + | |
− | <p>Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor lorem ipsum.</p>
| + | |
− | <footer>
| + | |
− | <a href="#" class="button special">More</a>
| + | |
− | </footer>
| + | |
− | </article>
| + | |
− | <article>
| + | |
− | <div class="image fit">
| + | |
− | <img src="images/pic02.jpg" alt="Pic 02" />
| + | |
− | </div>
| + | |
− | </article>
| + | |
− | </div>
| + | |
− | </div>
| + | |
− | </section>
| + | |
− | </div>
| + | |
− |
| + | |
− |
| + | |
− | <!-- metals -->
| + | |
− | <div id="metals">
| + | |
− | <section id="three" class="wrapper special">
| + | |
− | <div class="inner">
| + | |
− | <header class="align-center">
| + | |
− | <h2>The Metal Aptamer Project</h2>
| + | |
− | <p>Aliquam erat volutpat nam dui </p>
| + | |
− | </header>
| + | |
− | <div class="flex flex-2">
| + | |
− | <article>
| + | |
− | <header>
| + | |
− | <h3>Praesent placerat magna</h3>
| + | |
− | </header>
| + | |
− | <p>Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor lorem ipsum.</p>
| + | |
− | <footer>
| + | |
− | <a href="#" class="button special">More</a>
| + | |
− | </footer>
| + | |
− | </article>
| + | |
− | <article>
| + | |
− | <div class="image fit">
| + | |
− | <img src="images/pic02.jpg" alt="Pic 02" />
| + | |
− | </div>
| + | |
− | </article>
| + | |
− | <article>
| + | |
− | <header>
| + | |
− | <h3>Praesent placerat magna</h3>
| + | |
− | </header>
| + | |
− | <p>Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor lorem ipsum.</p>
| + | |
− | <footer>
| + | |
− | <a href="#" class="button special">More</a>
| + | |
− | </footer>
| + | |
− | </article>
| + | |
− | <article>
| + | |
− | <div class="image fit">
| + | |
− | <img src="images/pic02.jpg" alt="Pic 02" />
| + | |
− | </div>
| + | |
− | </article>
| + | |
− | <article>
| + | |
− | <header>
| + | |
− | <h3>Praesent placerat magna</h3>
| + | |
− | </header>
| + | |
− | <p>Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor lorem ipsum.</p>
| + | |
| <footer> | | <footer> |
| <a href="#" class="mButt">More</a> | | <a href="#" class="mButt">More</a> |
| </footer> | | </footer> |
− | </article>
| |
− | <article>
| |
− | <div class="image fit">
| |
− | <img src="images/pic02.jpg" alt="Pic 02" />
| |
− | </div>
| |
| </article> | | </article> |
| <article> | | <article> |
| <header> | | <header> |
− | <h3>Praesent placerat magna</h3> | + | <h3>Lyme's disease impact and diagnosis.</h3> |
| </header> | | </header> |
− | <p>Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor lorem ipsum.</p> | + | <p>Our project will enable diagnosis of the disease at an early stage, increasing the likelihood of successful treatment and reducing the risk of irreversible bodily damage.</p> |
| <footer> | | <footer> |
| <a href="#" class="mButt">More</a> | | <a href="#" class="mButt">More</a> |
| </footer> | | </footer> |
− | </article>
| |
− | <article>
| |
− | <div class="image fit">
| |
− | <img src="images/pic02.jpg" alt="Pic 02" />
| |
− | </div>
| |
| </article> | | </article> |
| <article> | | <article> |
| <header> | | <header> |
− | <h3>Praesent placerat magna</h3> | + | <h3>Pollutant Detection: Heavy Metal Ions.</h3> |
| </header> | | </header> |
− | <p>Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor lorem ipsum.</p> | + | <p>Our team has developed a system capable of detecting these ions in water sources, potentially improving the quality of human life on a global scale, in an inexpensive easily accessible manner.</p> |
| <footer> | | <footer> |
| <a href="#" class="mButt">More</a> | | <a href="#" class="mButt">More</a> |
| </footer> | | </footer> |
− | </article>
| |
− | <article>
| |
− | <div class="image fit">
| |
− | <img src="images/pic02.jpg" alt="Pic 02" />
| |
− | </div>
| |
− | </article>
| |
− | <article>
| |
− | <header>
| |
− | <h3>Praesent placerat magna</h3>
| |
− | </header>
| |
− | <p>Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor lorem ipsum.</p>
| |
− | <footer>
| |
− | <a href="#" class="button special">More</a>
| |
− | </footer>
| |
− | </article>
| |
− | <article>
| |
− | <div class="image fit">
| |
− | <img src="images/pic02.jpg" alt="Pic 02" />
| |
− | </div>
| |
| </article> | | </article> |
| </div> | | </div> |
| </div> | | </div> |
| </section> | | </section> |
− | </div>
| |
| | | |
| | | |
− | | + | |
− | <!-- Metals Project -->
| + | |
− | <div id="metals">
| + | |
− | </div>
| + | |
− | | + | |
| <!-- Footer --> | | <!-- Footer --> |
| <footer id="footer"> | | <footer id="footer"> |
Line 335: |
Line 76: |
| <div class="flex"> | | <div class="flex"> |
| <div class="copyright"> | | <div class="copyright"> |
− | © Warwick iGem 2016. Design: <a href="https://templated.co">TEMPLATED</a>. | + | © Warwick iGem 2016. |
| + | </div> |
| <ul class="icons"> | | <ul class="icons"> |
− | <li><a href="https://www.facebook.com/WarwickIGEM" class="logo" ><img src="https://dl.dropbox.com/s/4glmgypg4818k37/1473711361_Facebook_Color.png" alt="Facebook" class="logo"> | + | <li><a href="https://www.facebook.com/WarwickIGEM" class="clogo" ><img src="https://dl.dropbox.com/s/4glmgypg4818k37/1473711361_Facebook_Color.png" alt="Facebook" class="soclogo"> |
| </a></li> | | </a></li> |
− | <li><a href="https://twitter.com/warwickigem" class="logo" ><img src="https://dl.dropbox.com/s/hg113rzniw2pxdq/1473711356_Twitter_Color.png" alt="Twitter" class="logo"> | + | <li><a href="https://twitter.com/warwickigem" class="logo" ><img src="https://dl.dropbox.com/s/hg113rzniw2pxdq/1473711356_Twitter_Color.png" alt="Twitter" class="soclogo"> |
| </a></li> | | </a></li> |
| </ul> | | </ul> |
Line 352: |
Line 94: |
| <a href="https://2016.igem.org/Team:Warwick/Awards">Awards</a> | | <a href="https://2016.igem.org/Team:Warwick/Awards">Awards</a> |
| </div> | | </div> |
− | </div>
| |
| </div> | | </div> |
| </div> | | </div> |
| </footer> | | </footer> |
− |
| |
| <!-- Scripts --> | | <!-- Scripts --> |
| <script src="assets/js/jquery.min.js"></script> | | <script src="assets/js/jquery.min.js"></script> |