|
|
(58 intermediate revisions not shown) |
Line 1: |
Line 1: |
| {{Template:Queens_Canada/qgemheader}} | | {{Template:Queens_Canada/qgemheader}} |
- | <html>
| |
- | <head>
| |
- | <style>
| |
- |
| |
- | .tidal-wave{
| |
- | width:100%;
| |
- | text-align:center;
| |
- | float:center;
| |
- | }
| |
- | .spacer{
| |
- | opacity:0;
| |
- | height:30px;
| |
- | }
| |
- | <!------Swivel Buttons------->
| |
- | ul.project{height:auto;overflow:auto;}
| |
- |
| |
- | ul.project li{display:block;float:left;padding:20px;text-align:center;width:100%;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
| |
- |
| |
- | ul.project li a.image{border:3px solid #d8d7d7;display:block;padding:15px;-moz-border-radius:200em;-webkit-border-radius:200em;border-radius:200em;-moz-box-shadow:0 0 4px rgba(0, 0, 0, 0.8);-webkit-box-shadow:0 0 4px rgba(0, 0, 0, 0.8);box-shadow:0 0 4px rgba(0, 0, 0, 0.8);background:#e87478;background:-moz-radial-gradient(center, ellipse cover, #e87478 0%, #e1383f 100%);background:-webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, #e87478), color-stop(100%, #e1383f));background:-webkit-radial-gradient(center, ellipse cover, #e87478 0%, #e1383f 100%);background:-o-radial-gradient(center, ellipse cover, #e87478 0%, #e1383f 100%);background:-ms-radial-gradient(center, ellipse cover, #e87478 0%, #e1383f 100%);background:radial-gradient(ellipse at center, #e87478 0%, #e1383f 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#e87478', endColorstr='#e1383f', GradientType=1);}
| |
- |
| |
- | ul.project li a.image:hover img{transform:rotate(360deg) scale(0.95);-ms-transform:rotate(360deg) scale(0.95);-moz-transform:rotate(360deg) scale(0.9);-webkit-transform:rotate(360deg) scale(0.95);-o-transform:rotate(360deg) scale(0.95);}
| |
- |
| |
- | ul.project li a.image img{border:0px solid rgba(225, 225, 225, 0.9);-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;-moz-border-radius:200em;-webkit-border-radius:200em;border-radius:200em;-webkit-transition:all 1.5s ease-in-out 0s;-moz-transition:all 1.5s ease-in-out 0s;-o-transition:all 1.5s ease-in-out 0s;transition:all 1.5s ease-in-out 0s;}
| |
- |
| |
- | ul.project li p{text-align:justify;}
| |
- |
| |
- | ul.project li a{display:block;}
| |
- |
| |
- | ul.project li a:hover h3{color:#e1383f;}
| |
- | </style>
| |
- | </head>
| |
- |
| |
- | <body>
| |
- | <div class="tidal-wave">
| |
- | <h1 style="text-shadow: 2px 2px #ff6669;">Welcome to the Queen's University iGEM homepage!</h1>
| |
- | <p></p>
| |
- | <center>
| |
- | <div class="row-fluid">
| |
- | <div class="span4 offset1 text-left">
| |
- | <small>Queen's University is located in Kingston, Ontario, a small city located on the eastern side of Canada. Their igem team is composed of dedicated students who have devoted their summer to working with synthetic biology, toiling away in labs and of course, having a blast. This year our project initially began as an idea to remove foot odour. It eventually evolved to a much wider idea involving mosquitoes, malaria, and of course smelly feet! To find out more about what we've been up to, keep reading!</small>
| |
- | </div>
| |
- | <div class="span6">
| |
- | <div id="myCarousel" class="carousel">
| |
- | <!-- Carousel items -->
| |
- | <center>
| |
- | <div class="carousel-inner">
| |
- | <div class="active item"><img src="https://dl.dropboxusercontent.com/u/125588631/photo5.jpg" alt width="100%"></div>
| |
- | <div class="item"><img src="https://dl.dropboxusercontent.com/u/125588631/photo4.jpg" alt width="100%"></div>
| |
- | <div class="item"><img src="https://dl.dropboxusercontent.com/u/125588631/photo6.jpg" alt width="100%"></div>
| |
- | </div>
| |
- | </center>
| |
- | <!-- Carousel nav -->
| |
- | <a class="carousel-control left" href="#myCarousel" data-slide="prev">‹</a>
| |
- | <a class="carousel-control right" href="#myCarousel" data-slide="next">›</a>
| |
- | </div>
| |
- | </div>
| |
- | </div>
| |
- |
| |
- | </center>
| |
- | <div class="spacer">
| |
- | </div>
| |
- | <div class="row-fluid">
| |
- | <div class="span3 offset1">
| |
- | <ul class="project">
| |
- |
| |
- | <li>
| |
- | <a href="http://base.webknit.co.uk/" class="image" title="repel" target="_blank">
| |
- | <img src="https://dl.dropboxusercontent.com/u/125588631/repel.jpg" />
| |
- | </a>
| |
- | <a href="#/" title="repel" target="_blank">
| |
- | <h3>Repel.</h3>
| |
- | </a>
| |
- | <p>Description goes aqui.</p>
| |
- | </li>
| |
- | </ul>
| |
- | </div>
| |
- |
| |
- | <div class="span3">
| |
- | <ul class="project">
| |
- |
| |
- | <li>
| |
- | <a href="http://base.webknit.co.uk/" class="image" title="attract" target="_blank">
| |
- | <img src="https://dl.dropboxusercontent.com/u/125588631/attract.jpg" />
| |
- | </a>
| |
- | <a href="http://base.webknit.co.uk/" title="attract" target="_blank">
| |
- | <h3>Attract.</h3>
| |
- | </a>
| |
- | <p>Description goes aqui.</p>
| |
- | </li>
| |
- | </ul>
| |
- | </div>
| |
- |
| |
- | </div>
| |
- | <div class="span4">
| |
- | <h3>This year, we have two components to our project. The first removes foot odour and also serves as a repellent towards mosquitos. The second acts as an attractant for mosquitoes to lure them away. As a famous man once said, "The foot giveth and the foot taketh away". </h3>
| |
- | </div>
| |
- |
| |
- | </div>
| |
- |
| |
- | <script>
| |
- | $(document).ready(function(){
| |
- | $('.carousel').carousel({
| |
- | interval:2000
| |
- | });
| |
- | });
| |
- | </script>
| |
- | </body>
| |
- | </html>
| |