Difference between revisions of "Team:NAIT Edmonton/Trial6"

 
(47 intermediate revisions by 2 users not shown)
Line 1: Line 1:
{{NAIT_Edmonton/CSS5}}
+
{{NAIT_Edmonton/CSS7}}
 
<html>
 
<html>
  
 
<head>
 
<head>
 
  
 
<title>Team NAIT 2015</title>
 
<title>Team NAIT 2015</title>
  
    <style type="text/css">
 
      #map {
 
  border-radius: 50%;
 
        width: 400px;
 
        height: 400px;
 
        padding: 0px 0px 15px 0px;
 
        display:inline;
 
        float:left;
 
      }
 
    </style>
 
 
 
    <!---<script src="https://maps.googleapis.com/maps/api/js"></script>
 
  
    <script type="text/javascript">
 
      function initialize() {
 
        var mapCanvas = document.getElementById('map');
 
        var mapOptions = {
 
          center: new google.maps.LatLng(53.5682218,-113.5023604),
 
          zoom: 8,
 
          mapTypeId: google.maps.MapTypeId.ROADMAP
 
        }
 
        var map = new google.maps.Map(mapCanvas, mapOptions)
 
      }
 
      google.maps.event.addDomListener(window, 'load', initialize);
 
    </script>--->
 
  
 
<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro' rel='stylesheet' type='text/css'>
 
<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro' rel='stylesheet' type='text/css'>
Line 41: Line 15:
 
<!-----------https://static.igem.org/mediawiki/2015/d/d8/El_Capitan_.ttf------------------->
 
<!-----------https://static.igem.org/mediawiki/2015/d/d8/El_Capitan_.ttf------------------->
  
 
<script type="text/javascript">
 
$(document).ready(function() {
 
// grab the initial top offset of the navigation
 
  var stickyNavTop = $('.nav').offset().top;
 
 
 
  // our function that decides weather the navigation bar should have "fixed" css position or not.
 
  var stickyNav = function(){
 
    var scrollTop = $(window).scrollTop(); // our current vertical position from the top
 
       
 
    // if we've scrolled more than the navigation, change its position to fixed to stick to top,
 
    // otherwise change it back to relative
 
    if (scrollTop > stickyNavTop) {
 
        $('.nav').addClass('sticky');
 
    } else {
 
        $('.nav').removeClass('sticky');
 
    }
 
};
 
 
stickyNav();
 
// and run it again every time you scroll
 
$(window).scroll(function() {
 
stickyNav();
 
});
 
});
 
</script>
 
 
<script type="text/javascript" src="https://2015.igem.org/Team:NAIT_Edmonton/StickyMenu?action=raw&amp;ctype=text/javascript"></script>
 
  
 
<script type="text/javascript" charset="utf-8">
 
<script type="text/javascript" charset="utf-8">
Line 75: Line 21:
 
   $(window).load(function() {
 
   $(window).load(function() {
 
     $('.flexslider').flexslider({
 
     $('.flexslider').flexslider({
           animation: "slide"
+
           animation: "fade"
 
     });
 
     });
 
   });
 
   });
Line 84: Line 30:
 
<body>
 
<body>
  
<div class="header">
+
<div class="header">
<center><a href="https://2015.igem.org/Team:NAIT_Edmonton"><img style="margin-top:15px;" src="https://static.igem.org/mediawiki/2015/5/5d/NAIT_Argentum2.png" height="65px"></a></center>  
+
<div class="header_c">
 +
<a href="https://2015.igem.org/Team:NAIT_Edmonton"><img style="margin-top:15px; z-index:60" src="https://static.igem.org/mediawiki/2015/2/2f/NAIT_Imagine.png" height="95px"></a>  
 +
</div>
 
</div>
 
</div>
 +
 +
  
  
 
<div class="nav">
 
<div class="nav">
 +
 +
 +
<div tabindex="0" class="onclick-menu">
 +
    <ul class="onclick-menu-content" style="list-style:none;">
 +
        <li><a href="https://2015.igem.org/Team:NAIT_Edmonton">home</a></li>
 +
        <li><a href="https://2015.igem.org/Team:NAIT_Edmonton/Team">team</a></li>
 +
        <li><a href="https://2015.igem.org/Team:NAIT_Edmonton/Project">project</a></li>
 +
        <li><a href="https://2015.igem.org/Team:NAIT_Edmonton/Human">human practices</a></li>
 +
        <li><a href="https://2015.igem.org/Team:NAIT_Edmonton/Notebook">notebook</a></li>
 +
    </ul>
 +
</div>
 +
  
 
<div class="navigation">
 
<div class="navigation">
 
<ul>
 
<ul>
 +
 +
                <li><a href="https://2015.igem.org/Team:NAIT_Edmonton"><img
 +
                src="https://static.igem.org/mediawiki/2015/a/a9/NAIT_home.png" width="25px"></a></li>
 +
 +
 
                 <li><a href="https://2015.igem.org/Team:NAIT_Edmonton/Team">team</a>
 
                 <li><a href="https://2015.igem.org/Team:NAIT_Edmonton/Team">team</a>
 
                     <ul>
 
                     <ul>
 
                       <li><a href="https://2015.igem.org/Team:NAIT_Edmonton/Bios">bios</a></li>
 
                       <li><a href="https://2015.igem.org/Team:NAIT_Edmonton/Bios">bios</a></li>
 
                       <li><a href="https://2015.igem.org/Team:NAIT_Edmonton/Attributions">attributions</a></li>
 
                       <li><a href="https://2015.igem.org/Team:NAIT_Edmonton/Attributions">attributions</a></li>
                       <li><a href="https://igem.org/Team.cgi">official team profile</a>
+
                       <li><a href="https://igem.org/Team.cgi?id=1787">official team profile</a>
 
                     </ul>
 
                     </ul>
 
                 </li>
 
                 </li>
Line 115: Line 82:
 
                       <li><a href="https://2015.igem.org/Team:NAIT_Edmonton/Practices">policy and practices</a></li>
 
                       <li><a href="https://2015.igem.org/Team:NAIT_Edmonton/Practices">policy and practices</a></li>
 
                       <li><a href="https://2015.igem.org/Team:NAIT_Edmonton/Collaborations">collaborations</a></li>
 
                       <li><a href="https://2015.igem.org/Team:NAIT_Edmonton/Collaborations">collaborations</a></li>
                      <li><a href="https://2015.igem.org/Team:NAIT_Edmonton/Entrepreneurship">entrepreneurship</a></li>
 
 
                     </ul>
 
                     </ul>
 
                 </li>
 
                 </li>
Line 130: Line 96:
  
 
</div>
 
</div>
 +
 +
  
 
</div>
 
</div>
Line 136: Line 104:
  
 
</style>
 
</style>
 +
 
    
 
    
 
<div id="wrap2">
 
<div id="wrap2">
Line 142: Line 111:
  
 
<style type="text/css">
 
<style type="text/css">
.slider{width:100%; height:75%; margin:0; clear:both; position:relative; top:-48px;}
+
.slider{width:100%; height:75%; margin:0; clear:both; position:relative; top:0px;}
 
.flex-container a:active,
 
.flex-container a:active,
 
.flexslider a:active {outline: none;}
 
.flexslider a:active {outline: none;}
 
.slides,
 
.slides,
 
.flex-control-nav,
 
.flex-control-nav,
.flex-direction-nav {margin: 0; padding: 0; list-style: none;}  
+
.flex-direction-nav {margin:0; padding: 0; list-style: none;}  
 
.flexslider {width: 100%; margin: 0; padding: 0 0 0 0;}
 
.flexslider {width: 100%; margin: 0; padding: 0 0 0 0;}
 
.flexslider .slides > li {display: none;}
 
.flexslider .slides > li {display: none;}
Line 181: Line 150:
 
<div class="flexslider">
 
<div class="flexslider">
 
    <ul class="slides">
 
    <ul class="slides">
    <li><a href="http://www.nait.ca"><img src="https://static.igem.org/mediawiki/2015/9/90/NAIT_Banner_Institution.jpg" alt="" title="" border="0"/></a>
+
 
            <div class="flex-caption">
+
            <li><label class="btn" for="modal-2"><img src="https://static.igem.org/mediawiki/2015/0/03/NAIT_PlayBanner.jpg" alt="" title="" border="0"/></label>
                <h2></h2>
+
 
                    <p><strong><a href=""></a></strong></p>
+
 
                </div>
+
 
             </li>
 
             </li>
             <li><a href="#DESCRIPTION"><img src="https://static.igem.org/mediawiki/2015/c/c6/NAIT_Banner_Description.jpg" alt="" title="" border="0"/></a>
+
 
 +
 
 +
             <li><a href="https://2015.igem.org/Team:NAIT_Edmonton/Desc"><img src="https://static.igem.org/mediawiki/2015/c/c6/NAIT_Banner_Description.jpg" alt="" title="" border="0"/></a>
 
             <div class="flex-caption">
 
             <div class="flex-caption">
 
                 <h2></h2>
 
                 <h2></h2>
Line 193: Line 163:
 
                 </div>
 
                 </div>
 
             </li>
 
             </li>
             <li><a href="#SURVIVAL"><img src="https://static.igem.org/mediawiki/2015/7/7e/NAIT_Banner_Survival.jpg" alt="" title="" border="0"/></a>
+
             <li><a href="https://2015.igem.org/Team:NAIT_Edmonton/Practices"><img src="https://static.igem.org/mediawiki/2015/f/fa/NAIT_Banner_Survival2.jpg" alt="" title="" border="0"/></a>
 
             <div class="flex-caption">
 
             <div class="flex-caption">
 
                 <h2></h2>
 
                 <h2></h2>
Line 204: Line 174:
 
                 <h2></h2>
 
                 <h2></h2>
 
                     <p></p>
 
                     <p></p>
 +
                </div>
 +
            </li>
 +
    <li><label class="btn" for="modal-1"><img src="https://static.igem.org/mediawiki/2015/b/b5/NAIT_BannerPedway.jpg" alt="" title="" border="0"/></a></label>
 
                 </div>
 
                 </div>
 
             </li>
 
             </li>
Line 213: Line 186:
  
  
<section id="one"> 
 
  
<div id="wrap6">
 
  
 +
<input class="modal2-state" id="modal-1" type="checkbox" />
 +
<div class="modal2">
 +
  <label class="modal2__bg" for="modal-1"></label>
 +
  <div class="modal2__inner">
  
 +
  <center><object data="http://www.youtube.com/embed/qW9Mt6jBkSI" width="1000" height="563"></object></center><br>
 +
 +
  </div>
 +
</div>
 +
 +
 +
<input class="modal2-state" id="modal-2" type="checkbox" />
 +
<div class="modal2">
 +
  <label class="modal2__bg" for="modal-2"></label>
 +
  <div class="modal2__inner">
 +
 +
  <center><object data="http://www.youtube.com/embed/K_YsuDGvXLw" width="1000" height="563"></object></center><br>
 +
 +
  </div>
 +
</div>
 +
 +
 +
 +
<div id="wrap5">
 +
 +
<br><br><br>
 
<div class="section_one_three">
 
<div class="section_one_three">
 
         <h2 class="centered_title">Completed <br> Achievements</h2>
 
         <h2 class="centered_title">Completed <br> Achievements</h2>
Line 247: Line 243:
 
</div>
 
</div>
  
</section>
 
  
<section id="two"><div id="wrap6"><div style="margin-top: -100px; padding-top: 100px;" id="DESCRIPTION"></div>
+
<div id="wrap6">
  
<div style="width:800px;background-color: rgba(255,255,255,0.5);margin:auto;padding:2em;">
+
<center>
  
<center><h1>Our Project</h1></center>
+
<h1></h1>
 +
<h1>Sponsored by:</h1>
 +
<br><br>
  
<p>Chupa chups liquorice chupa chups. Cake chocolate cake halvah bear claw cookie pudding apple pie sugar plum. Chocolate tootsie roll muffin ice cream wafer oat cake. Tootsie roll chocolate cheesecake. Caramels cake dragée biscuit dessert gummi bears cupcake. Bear claw marshmallow marshmallow. Sesame snaps gingerbread cake icing jelly-o candy marshmallow muffin. Chocolate cake candy canes gummi bears caramels cookie candy dragée. Jujubes cake powder chupa chups toffee danish. Oat cake marzipan cake lemon drops sweet roll. Fruitcake cake liquorice icing. Jelly-o cookie bonbon gummi bears chocolate cake gingerbread.</p>
+
<a href="http://www.nait.ca"><img src="https://upload.wikimedia.org/wikipedia/en/thumb/6/6d/NAIT_Logo.svg/768px-NAIT_Logo.svg.png" height="200px"></a><br><br><br><br>
  
        <a href="https://2015.igem.org/Team:NAIT_Edmonton/Desc" class="more">read more</a>
+
<a href="https://www.idtdna.com/site"><img src="https://static.igem.org/mediawiki/2012/0/0a/IDT_logo_trans.png" height="105px"></a><br>
 +
<a href="http://www.albertatechfutures.ca/academicprogramsicore/geekstarter.aspx"><img src="https://static.igem.org/mediawiki/2015/1/11/NAIT_ABInnovates_Geekstarter.png"></a>
  
 +
</center>
  
 
</div>
 
</div>
  
 +
  <div class="clear"></div>
  
  
</div></section>
 
  
  
  
  
<section id="three"><div id="wrap6"><div style="margin-top: -100px; padding-top: 100px;" id="SURVIVAL"></div>
 
  
      <div style="width:500px;display:inline;float:left;padding:2em;">
 
  
<h1>The iGEM Survival Guide</h1>
 
  
<p><b><i>The iGEM Survival Guide</i></b> is not a traditional novel. It is written by first time iGEMers for all other iGEMers. In this guidebook, our team delves into our experiences as a first time iGEM team, covering everything from surviving team conflicts to fixing incorrectly sequenced gBlocks. Hopefully, this manual will help future teams (most especially first-time teams) sail through the dark, stormy seas of synthetic biology. Not many people get to experience the authentic learning experience iGEM provides. Who better to provide advice on how to survive this massive international competition than people who have experienced it first hand? <b><i>The iGEM Survival Guide</i></b> explains how.</p>
+
<style type="text/css">
  
        <a href="https://2015.igem.org/Team:NAIT_Edmonton/Practices" class="more">read more</a>
+
/* Modal */
 +
.modal2 {opacity: 0;visibility: hidden;position: fixed;top: 0;right: 0;bottom: 0;left: 0;text-align: left;background: rgba(0,0,0, .9);transition: opacity .25s ease;z-index:999;}
 +
.modal2__bg {position: absolute;top: 0;right: 0;bottom: 0;left: 0;cursor: pointer;}
 +
.modal2-state { display: none;}
 +
.modal2-state:checked + .modal2 {opacity: 1;visibility: visible;}
 +
.modal2-state:checked + .modal2 .modal2__inner {top: 0;}
 +
.modal2__inner {transition: top .25s ease;position: absolute;top: -20%; right: 0;bottom: 0;left: 0;width: 1000px;margin: auto;overflow: hide;background:white;border-radius: 0px;padding: 0;height: 563px;}
 +
.modal2__close {position: absolute;right: 1em;top: 1em;width: 1.1em;height: 1.1em;cursor: pointer;}
 +
.modal2__close:after,
 +
.modal2__close:before {content: '';position: absolute;width: 2px;height: 1.5em;background: #ccc;display: block;transform: rotate(45deg);left: 50%;margin: -3px 0 0 -1px;top: 0;}
 +
.modal2__close:hover:after,
 +
.modal2__close:hover:before {background: #aaa;}
 +
.modal2__close:before {transform: rotate(-45deg);}
  
      </div>
+
@media screen and (max-width: 750px) {
 +
 +
  .modal2__inner {width: 90%;height: 90%;box-sizing: border-box;}
 +
}
  
<div style="width:300px;display:inline;float:left;padding:2em;margin-left:50px;"><img src="http://www.howtogetbrokewiki.com/gifts/Zombie%20Survival%20Guide%20Book.jpg"></div></div></section>
 
  
 +
.btn {cursor: pointer;background: none;display: inline-block;padding: none;color:none; border-radius: none;}
 +
.btn:hover,
 +
.btn:focus {background: none;}
 +
.btn:active {background: none;}
 +
p img {max-width: 200px;height: auto;float: left;margin: 0 1em 1em 0;}
  
 
 
 
<section id="six"><div id="wrap6"><div style="margin-top: -100px; padding-top: 100px;" id="Contact"></div><div id="map"><img src="https://static.igem.org/mediawiki/2015/1/12/NAIT_map.png" style="border-radius: 50%; width: 400px; height: 400px;"></div>
 
 
<!-- www.123contactform.com script begins here -->
 
 
<div id="contactform" style="display:inline;float:left;width:358px;padding: 50px 50px 50px 50px; background-color:rgba(0,75,141,0.75);margin-left:100px;">
 
 
<script type="text/javascript">var servicedomain="www.123contactform.com"; var frmRef=''; try { frmRef=window.top.location.href; } catch(err) {}; var cfJsHost = (("https:" == document.location.protocol) ? "https://" : "http://"); document.write(unescape("%3Cscript src='" + cfJsHost + servicedomain + "/includes/easyXDM.min.js' type='text/javascript'%3E%3C/script%3E")); frmRef=encodeURIComponent(frmRef).replace('%26','[%ANDCHAR%]'); document.write(unescape("%3Cscript src='" + cfJsHost + servicedomain + "/jsform-1472712.js?ref="+frmRef+"' type='text/javascript'%3E%3C/script%3E")); </script>
 
 
<!-- www.123contactform.com script ends here -->
 
 
</div>
 
</div>
 
 
</section>
 
 
 
<section id="seven">
 
 
  <div id="wrap6">
 
 
<br><br><br>
 
 
<center><h1> Our Sponsors</h1></center>
 
 
<center><h2>With the generosity of these institutions and companies, our team was able to conduct the research for our project and attend the Giant Jamboree in Boston. Thank you so much! </h2></center>
 
 
<br>
 
<center>
 
 
<a href="http://www.nait.ca"><img src="https://upload.wikimedia.org/wikipedia/en/thumb/6/6d/NAIT_Logo.svg/768px-NAIT_Logo.svg.png" height="200px"></a><br>
 
<a href="https://www.idtdna.com/site"><img src="https://static.igem.org/mediawiki/2012/0/0a/IDT_logo_trans.png" height="105px"></a>
 
<a href="http://www.albertatechfutures.ca/academicprogramsicore/geekstarter.aspx"><img src="https://static.igem.org/mediawiki/2015/1/11/NAIT_ABInnovates_Geekstarter.png" style="display:in-line"></a>
 
 
</center>
 
 
  </div>
 
 
</section>
 
 
</div>
 
 
  <div class="clear"></div>
 
 
<style type="text/css">
 
  
 
section
 
section
Line 351: Line 319:
 
     height:550px;
 
     height:550px;
  
}
 
  
#two
 
{
 
    background: url(https://static.igem.org/mediawiki/2015/e/ee/NAIT_SS_Gel.jpg);;
 
    background-repeat: no-repeat;
 
    background-position: center center;
 
    background-attachment:fixed;
 
    background-size:100%;
 
    height:600px;
 
}
 
 
#three
 
{
 
    background-color: #FFFFFF;
 
    background-repeat: no-repeat;
 
    background-position: center center;
 
    background-attachment:fixed;
 
    height:650px;
 
}
 
 
#four
 
{
 
    background: url(http://forum.unity3d.com/attachments/screen-shot-2013-08-10-at-4-38-10-pm-jpg.63287/);
 
    background-repeat: no-repeat;
 
    background-position: center center;
 
    background-attachment:fixed;
 
    background-size: 100%;
 
    height:500px;
 
}
 
 
 
#five
 
{
 
    background-color:#FFFFFF;
 
    background-repeat: no-repeat;
 
    background-position: center center;
 
    background-attachment:fixed;
 
    height:500px;
 
}
 
 
#six
 
{
 
    background: url(https://static.igem.org/mediawiki/2015/6/6f/NAIT_CU_01.jpg);
 
    background-repeat: no-repeat;
 
    background-position: center center;
 
    background-attachment:fixed;
 
    background-size:100%;
 
    height:600px;
 
}
 
  
 
#seven
 
#seven
Line 409: Line 328:
 
     background-position: center center;
 
     background-position: center center;
 
     background-attachment:fixed;
 
     background-attachment:fixed;
 +
    width:100%;
 +
    margin-right:auto;
 +
    margin-left:auto;
 
}
 
}
  

Latest revision as of 21:46, 1 September 2015

Team NAIT 2015






Completed
Achievements

Despite the time constraints, our team met all the gold requirements for the iGEM competition.

read more


iGEM 2015

Learn about the exciting opportunities the iGEM foundation has to offer! The experience was incredible!

read more


Contact Us!

Please contact our team if you want more information about our project or have any other questions or concerns.

read more

Sponsored by: