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

(Blanked the page)
Line 1: Line 1:
−
{{NAIT_Edmonton/CSS2}}
 
  
−
<html>
 
−
 
−
<head>
 
−
 
−
 
−
<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro' rel='stylesheet' type='text/css'>
 
−
 
−
<script type="text/javascript" src="https://2015.igem.org/Team:NAIT_Edmonton/Modernizer.js?action=raw&amp;ctype=text/javascript"></script>
 
−
 
−
</head>
 
−
 
−
<body>
 
−
 
−
<style type="text/css">
 
−
 
−
.header_mobile {
 
−
    display:none;
 
−
    position: absolute;
 
−
    background-color:transparent;
 
−
    width:65px;
 
−
    top: 90px;
 
−
    left:50px;
 
−
    height:65px;
 
−
    z-index:999;
 
−
    position:fixed;}
 
−
 
−
.header_mobile ul {list-style:none; position:absolute;float:right;margin:0;padding-right:125px}
 
−
.header_mobile ul * {margin:0; padding:0;}
 
−
.header_mobile a {display:block;color:#159CD8;text-decoration:none;padding:15px 50px}
 
−
.header_mobile li {position:relative;float:left; padding:5px 5px 5px 5px}
 
−
.header_mobile li a {font-family:'Source Sans Pro', sans-serif;color:#ffffff;font-size:20px;}
 
−
.header_mobile li.current-menu-item {background:#5AB3E3}
 
−
.header_mobile ul ul{display:none; position:absolute; top:77%; left:30%; background:#0D4D8C; padding:0 0px 0 0}
 
−
.header_mobile ul ul li:hover{background:#159CD8}
 
−
.header_mobile ul ul li{float:none; width:120px}
 
−
.header_mobile ul ul a {line-height:100%; padding:0 20px 0 0; font-size:15px }
 
−
.header_mobile ul ul ul {top:0; left:200%}
 
−
.header_mobile ul li.selected a{color:#8BC5EB}
 
−
.header_mobile ul li:hover > ul{display:block;}
 
−
 
−
 
−
@media screen and (max-width:1000px){
 
−
 
−
.header_left{display:none;}
 
−
.header_right{display:none;}
 
−
.header_mobile{display:block;}
 
−
 
−
}
 
−
 
−
</style>
 
−
 
−
<style type="text/css">
 
−
.footer{position:absolute;bottom:0px;}
 
−
</style>
 
−
 
−
 
−
<div id="header">
 
−
<div class="header">
 
−
 
−
    <div class="logo"><a href="https://2015.igem.org/Team:NAIT_Edmonton">
 
−
              <img style="padding-left:6px" src="https://static.igem.org/mediawiki/2015/c/c7/NAIT_IGEM_Separated.png" height="185px"></a>
 
−
    </div>
 
−
    <div class="header_left">
 
−
        <ul>
 
−
               
 
−
                <li><a href="https://2015.igem.org/Team:NAIT_Edmonton/Team">team</a>
 
−
                    <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/Attributions">attributions</a></li>
 
−
                      <li><a href="https://igem.org/Team.cgi">official team profile</a>
 
−
                    </ul>
 
−
                </li>
 
−
                <li><a href="https://2015.igem.org/Team:NAIT_Edmonton/Project">project</a>
 
−
                    <ul>
 
−
                    <li><a href="https://2015.igem.org/Team:NAIT_Edmonton/Desc">description</a></li>
 
−
                      <li><a href="https://2015.igem.org/Team:NAIT_Edmonton/Protocols">experiment and protocols</a></li>
 
−
                      <li><a href="https://2015.igem.org/Team:NAIT_Edmonton/Results">parts and results</a></li>
 
−
                      <li><a href="https://2015.igem.org/Team:NAIT_Edmonton/Modeling">modeling</a></li>
 
−
                    </ul>
 
−
                </li>
 
−
            </ul>
 
−
    </div>
 
−
    <div class="header_right">
 
−
        <ul>
 
−
                <li><a href="https://2015.igem.org/Team:NAIT_Edmonton/Human">human practices</a>
 
−
                <ul>
 
−
                    <li><a href="https://2015.igem.org/Team:NAIT_Edmonton/Outreach">community outreach</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/Entrepreneurship">entrepreneurship</a></li>
 
−
                    </ul>
 
−
                </li>
 
−
                <li><a href="https://2015.igem.org/Team:NAIT_Edmonton/Notebook">notebook</a>
 
−
                <ul>
 
−
                    <li><a href="https://2015.igem.org/Team:NAIT_Edmonton/Safety">lab safety</a></li>
 
−
                      <li><a href="https://2015.igem.org/Team:NAIT_Edmonton/Achievements">achievements</a></li>
 
−
                      <li><a href="https://2015.igem.org/Team:NAIT_Edmonton/Logbook">log book</a></li>
 
−
                </ul>
 
−
                </li>
 
−
        </ul>
 
−
</div>
 
−
</div>
 
−
 
−
 
−
<style type="text/css">
 
−
 
−
.top_slogan {text-align:center; font-family: 'Source Sans Pro', sans-serif; color:#0D4D8C; font-size:30px; padding: 40px 0px 40px 0px; font-style:strong; line-height:40px;}
 
−
 
−
</style>
 
−
 
−
 
−
 
−
<div id="wrap">
 
−
 
−
<div class="top_slogan">Contact Us!</div>
 
−
 
−
<div class="main_content">
 
−
 
−
 
−
 
−
<div class="ia-container">
 
−
 
−
<figure>
 
−
<img src="https://static.igem.org/mediawiki/2015/6/6f/NAIT_CU_01.jpg" alt="image01" />
 
−
<input type="radio" name="radio-set" checked="checked"/>
 
−
 
−
<figure>
 
−
<img src="https://static.igem.org/mediawiki/2015/4/47/NAIT_CU_02.jpg" alt="image02" />
 
−
<input type="radio" name="radio-set" />
 
−
<figcaption><span>Dedication</span></figcaption>
 
−
 
−
<figure>
 
−
<img src="https://static.igem.org/mediawiki/2015/8/8f/NAIT_CU_03.jpg" alt="image03" />
 
−
<input type="radio" name="radio-set" />
 
−
<figcaption><span>Teamwork</span></figcaption>
 
−
 
−
<figure>
 
−
<img src="https://static.igem.org/mediawiki/2015/f/fc/NAIT_CU_04.jpg" alt="image04" />
 
−
<input type="radio" name="radio-set" />
 
−
<figcaption><span>Experience</span></figcaption>
 
−
 
−
<figure>
 
−
<img src="https://static.igem.org/mediawiki/2015/3/3e/NAIT_CU_05.jpg" alt="image05" />
 
−
<input type="radio" name="radio-set" />
 
−
<figcaption><span>Fun</span></figcaption>
 
−
 
−
<figure>
 
−
<img src="https://static.igem.org/mediawiki/2015/3/3c/NAIT_CU_06.jpg" alt="image06" />
 
−
<input type="radio" name="radio-set" />
 
−
<figcaption><span>Reliability</span></figcaption>
 
−
 
−
<figure>
 
−
<img src="https://static.igem.org/mediawiki/2015/9/9e/NAIT_CU_08.jpg" alt="image07" />
 
−
<input type="radio" name="radio-set" />
 
−
<figcaption><span>Excellence</span></figcaption>
 
−
 
−
<figure>
 
−
<img src="https://static.igem.org/mediawiki/2015/3/32/NAIT_CU_07.jpg" alt="image08" />
 
−
<input id="ia-selector-last" type="radio" name="radio-set" />
 
−
<figcaption><span>Team NAIT 2015</span></figcaption>
 
−
</figure>
 
−
 
−
</figure>
 
−
 
−
</figure>
 
−
 
−
</figure>
 
−
 
−
</figure>
 
−
 
−
</figure>
 
−
 
−
</figure>
 
−
 
−
</figure>
 
−
</div><!-- ia-container -->
 
−
 
−
  <center>
 
−
 
−
<br><br>
 
−
<h1>Team NAIT 2015</h1>
 
−
<h2>Email:<a href="mailto:johannes.coomansingh@gmail.com?subject=iGEM Questions/Comments">
 
−
Click Here</a> </h2>
 
−
<h3>Northern Alberta Institute of Technology</h3>
 
−
<h3>11762 106 St NW, Edmonton, AB T5G 3H6</h3>
 
−
<h3>Room G205</h3>
 
−
     
 
−
 
−
 
−
<style type="text/css">
 
−
 
−
.ia-container {
 
−
width: 100%;
 
−
margin: 20px auto;
 
−
overflow: hidden;
 
−
        margin-left:auto;
 
−
        margin-right:auto;
 
−
}
 
−
 
−
.ia-container figure {
 
−
    position: absolute;
 
−
top: 0;
 
−
left: 50px; /* width of visible piece */
 
−
width: 335px;
 
−
    box-shadow: 0 0 0 1px rgba(255,255,255,0.6);
 
−
-webkit-transition: all 0.3s ease-in-out;
 
−
    -moz-transition: all 0.3s ease-in-out;
 
−
    -o-transition: all 0.3s ease-in-out;
 
−
    -ms-transition: all 0.3s ease-in-out;
 
−
    transition: all 0.3s ease-in-out;
 
−
}
 
−
 
−
.ia-container > figure {
 
−
    position: relative;
 
−
left: 0 !important;
 
−
}
 
−
 
−
.ia-container img {
 
−
display: block;
 
−
width: 100%;
 
−
}
 
−
 
−
.ia-container input {
 
−
position: absolute;
 
−
top: 0;
 
−
left: 0;
 
−
width: 50px; /* just cover visible part */
 
−
height: 100%;
 
−
cursor: pointer;
 
−
border: 0;
 
−
padding: 0;
 
−
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
 
−
    filter: alpha(opacity=0);
 
−
    opacity: 0;
 
−
z-index: 100;
 
−
-webkit-appearance: none;
 
−
-moz-appearance: none;
 
−
appearance: none;
 
−
}
 
−
.ia-container input:checked{
 
−
width: 5px;
 
−
left: auto;
 
−
right: 0px;
 
−
}
 
−
.ia-container input:checked ~ figure {
 
−
-webkit-transition: all 0.7s ease-in-out;
 
−
    -moz-transition: all 0.7s ease-in-out;
 
−
    -o-transition: all 0.7s ease-in-out;
 
−
    -ms-transition: all 0.7s ease-in-out;
 
−
    transition: all 0.7s ease-in-out;
 
−
left: 335px;
 
−
}
 
−
 
−
.ia-container figcaption {
 
−
width: 100%;
 
−
height: 100%;
 
−
background: rgba(87, 73, 81, 0.1);
 
−
position: absolute;
 
−
top: 0px;
 
−
-webkit-transition: all 0.2s linear;
 
−
    -moz-transition: all 0.2s linear;
 
−
    -o-transition: all 0.2s linear;
 
−
    -ms-transition: all 0.2s linear;
 
−
    transition: all 0.2s linear;
 
−
}
 
−
 
−
.ia-container figcaption span {
 
−
position: absolute;
 
−
top: 40%;
 
−
margin-top: -30px;
 
−
right: 20px;
 
−
left: 20px;
 
−
overflow: hidden;
 
−
text-align: center;
 
−
background: rgba(87, 73, 81, 0.3);
 
−
line-height: 20px;
 
−
font-size: 18px;
 
−
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
 
−
    filter: alpha(opacity=0);
 
−
    opacity: 0;
 
−
text-transform: uppercase;
 
−
letter-spacing: 4px;
 
−
font-weight: 700;
 
−
padding: 20px;
 
−
color: #fff;
 
−
text-shadow: 1px 1px 1px rgba(0,0,0,0.1);
 
−
}
 
−
 
−
.ia-container input:checked + figcaption,
 
−
.ia-container input:checked:hover + figcaption{
 
−
background: rgba(87, 73, 81, 0);
 
−
}
 
−
 
−
.ia-container input:checked + figcaption span {
 
−
-webkit-transition: all 0.4s ease-in-out 0.5s;
 
−
    -moz-transition: all 0.4s ease-in-out 0.5s;
 
−
    -o-transition: all 0.4s ease-in-out 0.5s;
 
−
    -ms-transition: all 0.4s ease-in-out 0.5s;
 
−
    transition: all 0.4s ease-in-out 0.5s;
 
−
 
−
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=99)";
 
−
    filter: alpha(opacity=99);
 
−
opacity: 1;
 
−
 
−
top: 50%;
 
−
}
 
−
 
−
.ia-container #ia-selector-last:checked + figcaption span {
 
−
-webkit-transition-delay: 0.3s;
 
−
-moz-transition-delay: 0.3s;
 
−
-o-transition-delay: 0.3s;
 
−
-ms-transition-delay: 0.3s;
 
−
transition-delay: 0.3s;
 
−
}
 
−
 
−
.ia-container input:hover + figcaption {
 
−
background: rgba(87, 73, 81, 0.03);
 
−
}
 
−
 
−
.ia-container input:checked ~ figure input{
 
−
    z-index: 1;
 
−
}
 
−
 
−
@media screen and (max-width: 720px) {
 
−
    .ia-container {
 
−
width: 540px;
 
−
}
 
−
 
−
.ia-container figure {
 
−
left: 40px;
 
−
width: 260px;
 
−
}
 
−
 
−
.ia-container input {
 
−
width: 40px;
 
−
}
 
−
 
−
.ia-container input:checked ~ figure {
 
−
left: 260px;
 
−
}
 
−
 
−
.ia-container figcaption span {
 
−
font-size: 16px;
 
−
}
 
−
}
 
−
 
−
@media screen and (max-width: 520px) {
 
−
    .ia-container {
 
−
width: 320px;
 
−
}
 
−
 
−
.ia-container figure {
 
−
left: 20px;
 
−
width: 180px;
 
−
}
 
−
 
−
.ia-container input {
 
−
width: 20px;
 
−
}
 
−
 
−
.ia-container input:checked ~ figure {
 
−
left: 180px;
 
−
}
 
−
 
−
.ia-container figcaption span {
 
−
font-size: 12px;
 
−
letter-spacing: 2px;
 
−
padding: 10px;
 
−
margin-top: -20px;
 
−
}
 
−
 
−
}
 
−
 
−
 
−
</style>
 
−
 
 
−
 
−
</center>
 
−
  </div>
 
−
</div>
 
−
 
−
<div class="header_mobile">
 
−
  <ul>
 
−
        <li><a href="https://2015.igem.org/Team:NAIT_Edmonton/MobileMenu">menu</a>
 
−
          <ul>
 
−
              <li><a href="https://2015.igem.org/Team:NAIT_Edmonton/Team">team</a>
 
−
              <li><a href="https://2015.igem.org/Team:NAIT_Edmonton/Project">project</a>
 
−
              <li><a href="https://2015.igem.org/Team:NAIT_Edmonton/Human">human practices</a>
 
−
              <li><a href="https://2015.igem.org/Team:NAIT_Edmonton/Notebook">notebook</a>
 
−
          </ul>
 
−
        </li>   
 
−
           
 
−
  </ul>
 
−
</div>
 
−
 
−
 
−
  <div class="clear"></div>
 
−
 
−
        <div class="footer">
 
−
        <div class="footer_content">
 
−
            <div class="footer_left">
 
−
                        <ul class="footer_menu">
 
−
                    <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="footer_right">
 
−
                <ul class="social_icons">
 
−
                <li><a href="http://www.facebook.com/pages/IGEM-2015-NAIT-Edmonton/884025281659292"><img src="https://static.igem.org/mediawiki/2015/a/a3/NAIT_Icon_facebook.png" alt="" title="" /></a></li>
 
−
                <li><a href="http://www.twitter.com/TeamNAIT2015"><img src="https://static.igem.org/mediawiki/2015/6/64/NAIT_Icon_twitter.png" alt="" title="" /></a></li>
 
−
                </ul>
 
−
            </div>
 
−
          <div class="clear"></div>
 
−
          </div>
 
−
        </div>
 
−
</div>
 
−
 
−
<style type="text/css">
 
−
 
−
#footer {z-index:15;}
 
−
.footer {padding:20px 0 40px 0; margin:0px 0 0 0; clear:both; width:100%; background-color:#0D4D8C;margin-bottom:0;height:25px;}
 
−
.footer_content {margin:auto;width:100%;}
 
−
.footer_left { float:left; padding:0 0 0 10%;}
 
−
.footer_right{ float:right; padding:0 10% 0 0;}
 
−
ul.social_icons { margin:0px; padding:0px; list-style:none;}
 
−
ul.social_icons li{ float:left;}
 
−
ul.social_icons li a{width:30px;height:30px;display:block;border-radius:15px;-moz-border-radius:15px;-webkit-border-radius:15px;-khtml-border-radius:15px;float:left;margin:0px 0 0px 5px;background-color:#ADD3F0;text-align:center;}
 
−
ul.social_icons li a#top{width:30px;height:30px;display:block;border-radius:15px;-moz-border-radius:15px;-webkit-border-radius:15px;-khtml-border-radius:15px;float:left;margin:0px 0 0px 5px;background-color:#ADD3F0;text-align:center;}
 
−
ul.social_icons li a:hover{ background-color:#5AB3E3;}
 
−
ul.social_icons li a img{ width:60%; display:block; margin:5px auto;}
 
−
 
−
ul.footer_menu{ padding:10px 0 0 0; margin:0px; list-style:none;}
 
−
ul.footer_menu li{ float:left; padding:0 15px 0 0;}
 
−
ul.footer_menu li a{ background:url(https://static.igem.org/mediawiki/2015/1/17/NAIT_Bullet.png) no-repeat left; padding:0 0 0 12px;}
 
−
 
−
 
−
</style>
 
−
 
−
</body>
 
−
 
−
</body>
 
−
</html>
 

Revision as of 01:27, 31 July 2015