Team:Toronto/Trial

From 2012.igem.org

(Difference between revisions)
(Blanked the page)
Line 1: Line 1:
 +
<html>
 +
<body>
 +
<style> <!--interface-->
 +
#contentSub, #search-controls, .firstHeading, #footer-box, #catlinks, #p-logo{
 +
    display:none;}
 +
#top-section {
 +
background-repeat: no-repeat;
 +
        background-position: center top;
 +
height:1320px ! important;
 +
background:#215E21;
 +
}
 +
#content { background-color: #215E21 }
 +
body {
 +
    background: white url('http://igemtoronto.files.wordpress.com/2012/07/white-writing-29491444-516-350.jpg') no-repeat center top;
 +
    background-attachment: fixed;
 +
}
 +
#content{
 +
height:0px}
 +
 +
h1 a, h2 a, h3 a {
 +
text-decoration: none;
 +
font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
 +
font-size: 1.75em;
 +
line-height: 1.5em;  /* 16px/24px default */
 +
font-weight: 200;
 +
color:#fff
 +
}
 +
p {
 +
text-decoration: none;
 +
font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
 +
font-size: 1.25em;
 +
line-height: 1.5em;  /* 16px/24px default */
 +
font-weight: 150;
 +
color:#fff
 +
}
 +
 +
.slideshow {
 +
  position: relative;
 +
  min-height: 220px; /* This part sucks */
 +
  clear: both;
 +
  margin: 35px 0 25px;
 +
}
 +
 +
.slide {
 +
  float: left;
 +
}
 +
 +
.slide h3 a:hover {
 +
text-decoration: none;
 +
font-weight: bold;
 +
}
 +
.slide label {
 +
    background: #2F2F2F;
 +
    padding: 3px 7px;
 +
    border: 1px solid #215E21;
 +
    margin-right: 4px;
 +
    position: relative;
 +
    left: 1px;
 +
    top: 280px;
 +
    -webkit-transition: background-color .17s linear;
 +
      -moz-transition: background-color .17s linear;
 +
            transition: background-color .17s linear;
 +
}
 +
.slide [type=radio] {
 +
  display: none; 
 +
}
 +
.content {
 +
  position: absolute;
 +
  top: -1px;
 +
  left: -400px;
 +
  background: #215E21;
 +
  width: 500px;
 +
  padding: 20px;
 +
  border: 1px solid #215E21;
 +
  opacity: 0;
 +
  height: 100%;
 +
  -webkit-transition: all .6s linear;
 +
    -moz-transition: all .6s linear;
 +
          transition: all .6s linear;
 +
}
 +
[type=radio]:checked ~ label {
 +
  background: #215E21;
 +
  border-bottom: 1px solid #215E21;
 +
  z-index: 2;
 +
}
 +
[type=radio]:checked ~ label ~ .content {
 +
  z-index: 1;
 +
  opacity: 1;
 +
  left: 0;
 +
}​
 +
 +
 +
#fisheye_menu {
 +
list-style: none;
 +
padding: 0;
 +
margin: 10px;
 +
height: 140px;
 +
}
 +
#fisheye_menu li {
 +
position: relative;
 +
display: block;
 +
float: left;
 +
margin: 0;
 +
padding: 0;
 +
}
 +
#fisheye_menu span {
 +
position: absolute;
 +
top: 100%;
 +
left: 0;
 +
text-align: center;
 +
width: 95px;
 +
 +
padding: 1px;
 +
 +
margin: 0;
 +
border: solid 1px #bbb;
 +
color: #333;
 +
background: #eee;
 +
}
 +
#fisheye_menu a {
 +
text-decoration: none;
 +
margin: 0;
 +
padding: 0;
 +
}
 +
#fisheye_menu img {
 +
border: 0;
 +
vertical-align: top;
 +
}
 +
 +
/* http://meyerweb.com/eric/tools/css/reset/
 +
  v2.0 | 20110126
 +
  License: none (public domain)
 +
*/
 +
 +
 +
/*=================================================
 +
Main Styles
 +
==================================================*/
 +
 +
#stuff {
 +
overflow: hidden;
 +
width: 853px;
 +
height: 204px;
 +
-webkit-box-shadow: 0px 0px 50px 10px #215E21;
 +
-moz-box-shadow: 0px 0px 50px 10px #215E21;
 +
box-shadow: 0px 0px 50px 10px #215E21;
 +
}
 +
 +
#stuff-inside {
 +
width:10000px;
 +
height: 204px;
 +
}
 +
 +
.pag {
 +
width: 853px;
 +
height: 204px;
 +
float: left;
 +
}
 +
 +
/*================================================
 +
Styling the targets.  There are 6 nested divs -
 +
each div corresponds to a pag.  6 pags =
 +
6 divs.
 +
================================================*/
 +
#stuff-inside-1:target #stuff-inside {
 +
-webkit-transition: all 400ms ease;
 +
-moz-transition: all 400ms ease;
 +
-o-transition: all 400ms ease;
 +
transition: all 400ms ease;
 +
margin-left: 0px;
 +
}
 +
 +
#stuff-inside-2:target #stuff-inside {
 +
-webkit-transition: all 400ms ease;
 +
-moz-transition: all 400ms ease;
 +
-o-transition: all 400ms ease;
 +
transition: all 400ms ease;
 +
margin-left: -853px;
 +
}
 +
 +
#stuff-inside-3:target #stuff-inside {
 +
-webkit-transition: all 400ms ease;
 +
-moz-transition: all 400ms ease;
 +
-o-transition: all 400ms ease;
 +
transition: all 400ms ease;
 +
margin-left: -1706px;
 +
}
 +
 +
#stuff-inside-4:target #stuff-inside {
 +
-webkit-transition: all 400ms ease;
 +
-moz-transition: all 400ms ease;
 +
-o-transition: all 400ms ease;
 +
transition: all 400ms ease;
 +
margin-left: -2559px;
 +
}
 +
 +
#stuff-inside-5:target #stuff-inside {
 +
-webkit-transition: all 400ms ease;
 +
-moz-transition: all 400ms ease;
 +
-o-transition: all 400ms ease;
 +
transition: all 400ms ease;
 +
margin-left: -3412px;
 +
}
 +
 +
 +
/*=======================================
 +
Generic styling here.
 +
========================================*/
 +
 +
.pag-info {
 +
height: 40px;
 +
background-color: #215E21;
 +
opacity:0.9;
 +
position: relative;
 +
margin-top: 0px;
 +
bottom: 50px;
 +
color: #147025;
 +
padding-left: 20px;
 +
padding-top: 20px;
 +
}
 +
 +
#nav {
 +
list-style-type: none;
 +
width: 156px;
 +
height: 16px;
 +
margin: 0 auto;
 +
margin-top: 20px;
 +
padding: 0;
 +
color:#215E21;
 +
}
 +
.click {
 +
float: left;
 +
background: #74C365;
 +
width: 16px;
 +
height: 16px;
 +
-webkit-border-radius: 8px;
 +
-moz-border-radius: 8px;
 +
border-radius: 8px;
 +
margin-left: 5px;
 +
margin-right: 5px;
 +
}
 +
.click:hover {
 +
-webkit-box-shadow: inset 0px 0px 2px 2px #d4d4d4;
 +
-moz-box-shadow: inset 0px 0px 2px 2px #d4d4d4;
 +
box-shadow: inset 0px 0px 2px 2px #d4d4d4;
 +
}
 +
.click:active {
 +
-webkit-box-shadow: inset 0px 0px 2px 2px #7a7a7a;
 +
-moz-box-shadow: inset 0px 0px 2px 2px #7a7a7a;
 +
box-shadow: inset 0px 0px 2px 2px #7a7a7a;
 +
}
 +
.click a {
 +
display: block;
 +
width: 16px;
 +
height: 16px;
 +
}
 +
li {
 +
      list-style: none;
 +
    }
 +
</style>
 +
 +
 +
<script type="text/javascript">
 +
 +
var fisheyemenu = {
 +
startSize : 65,
 +
endSize : 90,
 +
imgType : ".png",
 +
init : function () {
 +
 +
var animElements = document.getElementById("fisheye_menu").getElementsByTagName("img");
 +
var titleElements = document.getElementById("fisheye_menu").getElementsByTagName("span");
 +
for(var j=0; j<titleElements.length; j++) {
 +
titleElements[j].style.display = 'none';
 +
 +
}
 +
for(var i=0; i<animElements.length; i++) {
 +
var y = animElements[i];
 +
y.style.width = fisheyemenu.startSize+'px';
 +
y.style.height = fisheyemenu.startSize+'px';
 +
fisheyemenu.imgSmall(y);
 +
animElements[i].onmouseover = changeSize;
 +
animElements[i].onmouseout = restoreSize;
 +
}
 +
function changeSize() {
 +
fisheyemenu.imgLarge(this);
 +
var x = this.parentNode.getElementsByTagName("span");
 +
x[0].style.display = 'block';
 +
if (!this.currentWidth) this.currentWidth = fisheyemenu.startSize;
 +
fisheyemenu.resizeAnimation(this,this.currentWidth,fisheyemenu.endSize,15,10,0.333);
 +
}
 +
 +
function restoreSize() {
 +
var x = this.parentNode.getElementsByTagName("span");
 +
x[0].style.display = 'none';
 +
if (!this.currentWidth) return;
 +
fisheyemenu.resizeAnimation(this,this.currentWidth,fisheyemenu.startSize,15,10,0.5);
 +
fisheyemenu.imgSmall(this);
 +
}
 +
},
 +
resizeAnimation : function (elem,startWidth,endWidth,steps,intervals,powr) {
 +
if (elem.widthChangeMemInt) window.clearInterval(elem.widthChangeMemInt);
 +
var actStep = 0;
 +
elem.widthChangeMemInt = window.setInterval(
 +
function() {
 +
elem.currentWidth = fisheyemenu.easeInOut(startWidth,endWidth,steps,actStep,powr);
 +
elem.style.width = elem.currentWidth+"px";
 +
elem.style.height = elem.currentWidth+"px";
 +
actStep++;
 +
if (actStep > steps) window.clearInterval(elem.widthChangeMemInt);
 +
}
 +
,intervals)
 +
},
 +
easeInOut : function (minValue,maxValue,totalSteps,actualStep,powr) {
 +
//Generic Animation Step Value Generator By www.hesido.com
 +
var delta = maxValue - minValue;
 +
var stepp = minValue+(Math.pow(((1 / totalSteps)*actualStep),powr)*delta);
 +
return Math.ceil(stepp)
 +
},
 +
imgSmall : function (obj) {
 +
imgSrc = obj.getAttribute("src");
 +
var typePos = imgSrc.indexOf(fisheyemenu.imgType, 0);
 +
var imgName = imgSrc.substr(0, typePos);
 +
obj.setAttribute("src", imgName+"_small"+fisheyemenu.imgType);
 +
},
 +
imgLarge : function (obj) {
 +
imgSrc = obj.getAttribute("src");
 +
var typePos = imgSrc.indexOf("_small", 0);
 +
var imgName = imgSrc.substr(0, typePos);
 +
obj.setAttribute("src", imgName+fisheyemenu.imgType);
 +
}
 +
}
 +
 +
// Add event with wide browser support
 +
if ( typeof window.addEventListener != "undefined" )
 +
    window.addEventListener( "load", fisheyemenu.init, false );
 +
else if ( typeof window.attachEvent != "undefined" )
 +
    window.attachEvent( "onload", fisheyemenu.init );
 +
else {
 +
    if ( window.onload != null ) {
 +
        var oldOnload = window.onload;
 +
        window.onload = function ( e ) {
 +
            oldOnload( e );
 +
            fisheyemenu.init();
 +
        };
 +
    }
 +
    else
 +
        window.onload = fisheyemenu.init;
 +
}
 +
 +
</script><!--jquery-->
 +
 +
 +
 +
<body style="overflow-y:scroll;" >
 +
 +
<div class="container" style=" background: #147025; margin-top:-1340px;">
 +
<div align=left style="margin-top:0px; margin-left:0px;">
 +
<img src="https://static.igem.org/mediawiki/2012/5/5d/Toronto_green.jpg" alt="Background" width="965" height="130"/>
 +
</div>
 +
<div style="margin-top:-125px">
 +
<ul id="fisheye_menu">
 +
                <li> <font color=#147025> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;  &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;  &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;  &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;  &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;  &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;  &nbsp; &nbsp; &nbsp;  </font> </li>
 +
<li><a href="https://2012.igem.org/Team:Toronto" class="fisheye"><img src="http://igemtoronto.files.wordpress.com/2012/07/toronto_home.png" alt="" /><span> <font size=3><b>Home </span></a> </li>
 +
<li><a href="https://2012.igem.org/Team:Toronto/Contact" class="fisheye"><img src="http://igemtoronto.files.wordpress.com/2012/07/toronto_email.png" alt="" /><span>Contact</span></a></li>
 +
<li><a href="https://2012.igem.org/Team:Toronto/Team" class="fisheye"><img src="http://igemtoronto.files.wordpress.com/2012/07/toronto_teamicon.png" alt="" /><span>Team</span></a></li>
 +
<li><a href="https://2012.igem.org/Team:Toronto/Project" class="fisheye"><img src="http://igemtoronto.files.wordpress.com/2012/07/toronto_projecticon.png" alt="" /><span>Project</span></a> </li>
 +
 +
<li><a href="https://2012.igem.org/Team:Toronto/Notebook" class="fisheye"><img src="http://igemtoronto.files.wordpress.com/2012/07/toronto_notebook.png" alt="" /><span>Notebook</span></a></li>
 +
<li><a href="https://2012.igem.org/Team:Toronto/Attributions" class="fisheye"><img src="http://igemtoronto.files.wordpress.com/2012/07/toronto_history.png" alt="" /><span>Attributions </span></a></li>
 +
<li><a href="https://2012.igem.org/Team:Toronto/HumanPractice" class="fisheye"><img src="http://igemtoronto.files.wordpress.com/2012/07/toronto_outreach.png" alt="" /><span>Human Practices (Safety & Outreach)</span></a></li>
 +
<li><a href="https://2012.igem.org/Main_Page" class="fisheye"><img src="http://igemtoronto.files.wordpress.com/2012/07/toronto_igemlogo.png" alt="" /><span>iGEM 2012 Home</span></a></li>
 +
</ul> </font></b> </div>
 +
</div>
 +
 +
<div  style="margin-top:400px; margin-left:50px">
 +
<div class="slideshow" style="z-index:99; position:absolute; ">
 +
   
 +
  <div class="slide" >
 +
      <input type="radio" id="tab-1" name="tab-group-1" checked>
 +
      <label for="tab-1" style="color:#fff">Featured</label>
 +
     
 +
      <div class="content">
 +
          <h3> <a href="#" style="color:#fff">Featured Content</a> </h3>
 +
          <br>
 +
          <P> Are you a new visitor? <a href="#" style="color: #fff"> Click here to view site map. </a> </P>
 +
            <P> Please use <a href="http://www.google.com/intl/en/chrome/browser/" style="color: #fff"> Chrome </a> or <a href="http://www.mozilla.org/en-US/firefox/new/" style="color: #fff"> Firefox </a> to enjoy the full site experience.</P>
 +
      </div>
 +
 +
  </div>
 +
   
 +
  <div class="slide">
 +
      <input type="radio" id="tab-2" name="tab-group-1">
 +
      <label for="tab-2" style="color:#fff" >Project</label>
 +
     
 +
      <div class="content">
 +
          <h3> <a href="#" style="color:#fff">Project </a> </h3>
 +
          <br>
 +
          <P> This year, our design team aims to engineer a plant
 +
which will have an increased tolerance for low temperature stress,
 +
and be able to utilize accumulated forms of organic phosphorus,
 +
which otherwise would not be available to the plant.  <br> <br>
 +
<a href="#" style="color: #fff">Click here to read more. </a></P>
 +
      </div>
 +
  </div>
 +
   
 +
    <div class="slide">
 +
      <input type="radio" id="tab-3" name="tab-group-1">
 +
      <label for="tab-3" style="color:#fff">Team</label>
 +
   
 +
      <div class="content">
 +
          <h3> <a href="#" style="color:#fff"> Team </a> </h3>
 +
          <br>
 +
          <P>Since 2005, the UToronto iGEM Team
 +
has gathered members from across
 +
disciplines in order to  conceptualize, design,
 +
and build  genetic constructs that push the boundaries
 +
of synthetic biology.  <a href="#" style="color: #fff"> <br> <br> <br> Click here to meet this year's team. </a></P>
 +
      </div>
 +
  </div>
 +
   
 +
</div>
 +
</div>
 +
<div align=left style="margin-top:-430px; margin-left:0px;">
 +
<img src="https://static.igem.org/mediawiki/2012/d/d8/Toronto_homebanner.jpg" alt="Background" width="965" height="723.75"/>
 +
</div>
 +
 +
<div align=left style="margin-top:-723px;">
 +
<img src="http://igemtoronto.files.wordpress.com/2012/07/toronto_titlebanner_2.jpg" alt="Background" width="965" height="312.12"/>
 +
</div>
 +
 +
 +
<div align=left style="margin-top:409px; margin-left:0px">
 +
 +
<img src="https://static.igem.org/mediawiki/2012/5/5d/Toronto_green.jpg" alt="Banner" width="965" height="100px"/>
 +
</div>
 +
 +
 +
<div id="stuff-slider"  style="margin-top:-70px; margin-left:40px; position:absolute; z-index:99">
 +
<FONT FACE="helvetica neue" size="3" color="#ffffff" >
 +
We would like to thank our sponsors:
 +
</font>
 +
 +
 +
<div id="stuff">
 +
<div id="stuff-inside-1">
 +
<div id="stuff-inside-2">
 +
<div id="stuff-inside-3">
 +
<div id="stuff-inside-4">
 +
<div id="stuff-inside-5">
 +
<div id="stuff-inside-6">
 +
<div id="stuff-inside">
 +
<div class="pag" id="pag1">
 +
<a href="http://www.cagef.utoronto.ca/"> <img src="https://static.igem.org/mediawiki/2012/7/78/Toronto_cagef.jpg" alt="test1" title="test1"> </a>
 +
<div class="pag-info" id="info1">
 +
<FONT FACE="cooper std" size="6" color="#ffd700" >
 +
Gold Sponsor
 +
</font>
 +
</div>
 +
</div>
 +
<div class="pag" id="pag2">
 +
<a href="http://www.neb.ca/"> <img src="https://static.igem.org/mediawiki/2012/a/aa/Toronto_newengland.jpg" alt="test2" title="test2" style="margin-left:300px"></a>
 +
<div class="pag-info" id="info2">
 +
<FONT FACE="cooper std" size="6" color="#CD7F32">
 +
Bronze Sponsor
 +
</font>
 +
</div>
 +
</div>
 +
<div class="pag" id="pag3">
 +
<a href="http://www.csb.utoronto.ca/"> <img src="https://static.igem.org/mediawiki/2012/b/b6/Toronto_csb.jpg" alt="test3" title="test3" style="margin-left:300px"></a>
 +
<div class="pag-info" id="info3">
 +
<FONT FACE="cooper std" size="6" color="#CD7F32">
 +
Bronze Sponsor
 +
</font></div>
 +
</div>
 +
<div class="pag" id="pag4">
 +
<a href="http://www.sporometrics.com/" > <img src="https://static.igem.org/mediawiki/2012/3/31/Toronto_sporometrics.jpg" alt="test4" title="test4" style="margin-left:300px"></a>
 +
<div class="pag-info" id="info4">
 +
<FONT FACE="cooper std" size="6" color="#CD7F32">
 +
Bronze Sponsor
 +
</font>
 +
</div>
 +
</div>
 +
<div class="pag" id="pag5">
 +
<a href="http://www.bio-rad.com/" ><img src="https://static.igem.org/mediawiki/2012/e/e2/Toronto_biorad.jpg" alt="test5" title="test5" style="margin-left:300px"> </a>
 +
<div class="pag-info" id="info5">
 +
<FONT FACE="cooper std" size="6" color="#CD7F32">
 +
Bronze Sponsor
 +
</font></div>
 +
</div>
 +
</div>
 +
</div>
 +
</div>
 +
</div>
 +
</div>
 +
</div>
 +
</div>
 +
</div>
 +
<ul id="nav">
 +
<li  class="click" id="click1" ><a href="#stuff-inside-1" > <FONT  color="#74C365">1 </font></a></li>
 +
<li class="click" id="click2"  ><a href="#stuff-inside-2" ><FONT  color="#74C365">1 </font></a></li>
 +
<li class="click" id="click3"  ><a href="#stuff-inside-3" ><FONT  color="#74C365">1 </font></a></li>
 +
<li class="click" id="click4"  ><a href="#stuff-inside-4" ><FONT color="#74C365">1 </font></a></li>
 +
<li class="click" id="click5" ><a href="#stuff-inside-5" ><FONT  color="#74C365">1 </font></a></li>
 +
</ul>
 +
</div>
 +
</body>
 +
</html>

Revision as of 00:26, 8 August 2012

Background

Featured Content


Are you a new visitor? Click here to view site map.

Please use Chrome or Firefox to enjoy the full site experience.

Project


This year, our design team aims to engineer a plant which will have an increased tolerance for low temperature stress, and be able to utilize accumulated forms of organic phosphorus, which otherwise would not be available to the plant.

Click here to read more.

Team


Since 2005, the UToronto iGEM Team has gathered members from across disciplines in order to conceptualize, design, and build genetic constructs that push the boundaries of synthetic biology.


Click here to meet this year's team.

Background
Background
Banner
We would like to thank our sponsors:
test1
Gold Sponsor
test2
Bronze Sponsor
test3
Bronze Sponsor
test4
Bronze Sponsor
test5
Bronze Sponsor

Retrieved from "http://2012.igem.org/Team:Toronto/Trial"