Team:Toronto/Team

From 2012.igem.org

(Difference between revisions)
(Prototype team page)
Line 1: Line 1:
-
!-- *** What falls between these lines is the Alert Box!  You can remove it from your pages once you have read and understood the alert *** -->
 
-
 
<html>
<html>
-
<div id="box" style="width: 700px; margin-left: 137px; padding: 5px; border: 3px solid #000; background-color: #fe2b33;">
+
<body>
-
<div id="template" style="text-align: center; font-weight: bold; font-size: large; color: #f6f6f6; padding: 5px;">
+
 
-
This is a template page. READ THESE INSTRUCTIONS.
+
<!-- =============================================================
 +
 
 +
The following was written by Moustafa Abdalla for iGEM UToronto.
 +
 
 +
 
 +
Permission is granted, free of charge, to any person reading the code,
 +
to use, copy, modify, merge, publish, distribute, sublicense, and/or
 +
sell copies of the code, subject ONLY to the following condition:
 +
 
 +
******* This permission notice shall be included in all copies or
 +
substantial portions of the code. *********
 +
 
 +
Please enjoy :) .
 +
===================================================================-->
 +
 
 +
 
 +
 
 +
<!--==========================General Document Styling
 +
And CSS for Contact Buttons================-->
 +
<style>
 +
#contentSub, #search-controls, .firstHeading, #footer-box, #catlinks, #p-logo {
 +
    display:none;}
 +
#top-section {
 +
    background-color:#ccff99; /*#ccff99*/
 +
background-repeat: no-repeat;
 +
    background-position: center top;
 +
height:1200px ! important;
 +
}
 +
body {
 +
    background: white url('http://igemtoronto.files.wordpress.com/2012/07/white-writing-29491444-516-350.jpg') no-repeat center top;
 +
    background-attachment: fixed;
 +
    height:0px;
 +
}
 +
#content{height:0px}
 +
#fisheye_menu {
 +
 
 +
list-style: none;
 +
padding: 0;
 +
margin: 10px;
 +
height: 81px;
 +
}
 +
#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;a
 +
}
 +
#fisheye_menu img {
 +
border: 0;
 +
vertical-align: top;
 +
}
 +
</style>
 +
 
 +
 
 +
<!--==========================Javascript for Top Menu================-->
 +
 +
<script type="text/javascript">
 +
var fisheyemenu = {
 +
startSize : 55,
 +
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>
 +
 
 +
 
 +
 
 +
 
 +
 
 +
<!--==========================Actual Wiki Stuff================-->
 +
 
 +
 
 +
<div align=left style="margin-top:-1175px; margin-left:-5px">
 +
<img src="http://igemtoronto.files.wordpress.com/2012/08/team_banner.jpg" alt="Banner" width="977" height="205.3"/>
</div>
</div>
-
<div id="instructions" style="text-align: center; font-weight: normal; font-size: small; color: #f6f6f6; padding: 5px;">
+
 
-
You are provided with this team page template with which to start the iGEM season. You may choose to personalize it to fit your team but keep the same "look." Or you may choose to take your team wiki to a different level and design your own wiki. You can find some examples <a href="https://2008.igem.org/Help:Template/Examples">HERE</a>.
+
 
 +
 +
<!--==========================Menu================-->
 +
 
 +
<div class="container" style=" background: #147025; margin-top:-190px;">
 +
<ul id="fisheye_menu">
 +
<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 id="warning" style="text-align: center; font-weight: bold; font-size: small; color: #f6f6f6; padding: 5px;">
 
-
You <strong>MUST</strong> have all of the pages listed in the menu below with the names specified.  PLEASE keep all of your pages within your teams namespace. 
 
-
</div>
 
-
</div>
 
-
</html>
 
-
<!-- *** End of the alert box *** -->
 
-
{|align="justify"
 
-
|You can write a background of your team here.  Give us a background of your team, the members, etc.  Or tell us more about something of your choosing.
 
-
|[[Image:Toronto_logo.png|200px|right|frame]]
 
-
|-
 
-
|
 
-
|[[Image:Toronto_team.png|right|frame|Your team picture]]
 
-
|-
 
-
|
 
-
|align="center"|[[Team:Toronto | Team Toronto]]
 
-
|}
 
 +
<!--==========================Styling Sheet for Pictures and Biographies================-->
-
<!--- The Mission, Experiments --->
+
<style rel='stylesheet' >
 +
#apple {
 +
    width: 331px;
 +
    margin: 0 auto;
 +
}
-
{| style="color:#1b2c8a;background-color:#0c6;" cellpadding="3" cellspacing="1" border="1" bordercolor="#fff" width="62%" align="center"
+
#banana {
-
!align="center"|[[Team:Toronto|Home]]
+
    position: relative;
-
!align="center"|[[Team:Toronto/Team|Team]]
+
    overflow: hidden;
-
!align="center"|[https://igem.org/Team.cgi?year=2012&team_name=Toronto Official Team Profile]
+
    height: 500px;
-
!align="center"|[[Team:Toronto/Project|Project]]
+
    border-radius: 6px;
-
!align="center"|[[Team:Toronto/Parts|Parts Submitted to the Registry]]
+
    background: #215E21;
-
!align="center"|[[Team:Toronto/Modeling|Modeling]]
+
    box-shadow: inset 0 0 5px #215E21;
-
!align="center"|[[Team:Toronto/Notebook|Notebook]]
+
}
-
!align="center"|[[Team:Toronto/Safety|Safety]]
+
-
!align="center"|[[Team:Toronto/Attributions|Attributions]]
+
-
|}
+
 +
/* Functionality */
-
== '''Who we are''' ==
+
fieldset {
-
{|border = "0"
+
    border: 0;
-
|-
+
    position: absolute;
-
|rowspan="3"|
+
    width: 331px;
 +
    height: 100%;
 +
    left: -1000px;
 +
    -moz-transition: all 0.5s ease-out;
 +
    -webkit-transition: all 0.5s ease-out;
 +
    -o-transition: all 0.5s ease-out;
 +
    transition: all 0.5s ease-out;
 +
    vertical-align: middle;
 +
    text-align: center;
 +
    font-size: 36px;
 +
    color: #215E21;
 +
    padding: 0;
 +
    margin: 0;
 +
    box-shadow: inset 0 0 5px #215E21;
 +
    border-radius: 6px;
 +
}
 +
input {
 +
 
 +
}
 +
input[type="radio"]:checked + fieldset {
 +
    left: 0;
 +
    -moz-transition: all 0.5s ease-out;
 +
    -webkit-transition: all 0.5s ease-out;
 +
    -o-transition: all 0.5s ease-out;
 +
    transition: all 0.5s ease-out;
 +
    z-index:99;
 +
}
 +
fieldset > label:after {
 +
    content:" ⇧ Read More ... ⇧";
 +
    background: rgba(0,0,0,0.5);
 +
    display: inline-block;
 +
    height: 19px;
 +
    padding: 5px 8px;
 +
    position: absolute;
 +
    right: 100px;
 +
    top: 0;
 +
    border-radius: 4px 4px 0 0;
 +
    -moz-transition: all 0.5s ease-out;
 +
    -webkit-transition: all 0.5s ease-out;
 +
    -o-transition: all 0.5s ease-out;
 +
    transition: all 0.5s ease-out;
-
'''Advisors:'''
+
}
-
*''' Advisor 1''':    Mentor for all
+
fieldset:hover > label:after {
-
*'''Advisor 2''':     Our favorite
+
     top: -25px;
-
*'''Grad Student 1''':    Our leader 
+
    -moz-transition: all 0.3s ease-out;
 +
    -webkit-transition: all 0.3s ease-out;
 +
    -o-transition: all 0.3s ease-out;
 +
     transition: all 0.3s ease-out;
 +
}
-
'''Undergrads:'''
+
fieldset > label:hover:after {
 +
    color: #ddd;
 +
    background: rgba(0,0,0,0.6);
-
*'''Student 1''':    Sleepyhead
+
}
-
*'''Student 2''':    Math nerd
+
-
*'''Student 3''':  Michael, Is going to save the world
+
-
*'''Student 4''':    Loves iGEM
+
-
*'''Student 5''':  A normal student... or(r) am I?
+
-
*'''Student 6''':  Table football fan
+
-
*'''Student 7''':
+
 +
fieldset > input[type="checkbox"]:checked + label:after {
 +
    top: -28px;
-
|
+
}
-
<gallery>
+
-
Image:Toronto_Team_member_1.png|Team member 1
+
-
Image:Toronto_Team_member_2.png|Team member 2
+
-
Image:Toronto_Team_member_3.png|Team member 3
+
-
Image:Toronto_Team_member_4.png|Team member 4
+
-
Image:Toronto_Team_member_5.png|Team member 5
+
-
Image:Toronto_Team_member_6.png|Team member 6
+
-
Image:Toronto_Team_member_7.png|Team member 7
+
-
</gallery>
+
-
|}
+
-
== '''What we did''' ==
+
input[type="checkbox"]:checked + label {
 +
    top: 0;
 +
    -moz-transition: all 0.5s ease-out;
 +
    -webkit-transition: all 0.5s ease-out;
 +
    -o-transition: all 0.5s ease-out;
 +
    transition: all 0.5s ease-out;}
-
(Provide proper attribution for all work)
+
}
 +
input[type="checkbox"]:checked + label:after {
 +
    top:-38px;
 +
    -moz-transition: all 0.3s ease-out;
 +
    -webkit-transition: all 0.3s ease-out;
 +
    -o-transition: all 0.3s ease-out;
 +
    transition: all 0.3s ease-out;
 +
}
-
== '''Where we're from''' ==
+
nav {
 +
    margin-top: 15px;
 +
    text-align: center;
 +
    box-shadow: inset 0 0 3px rgba(0,0,0,0.2);
 +
    border-radius: 4px;
 +
    padding: 13px 12px 0;
 +
}
 +
 
 +
nav label {
 +
    display: inline-block;
 +
    border-radius: 4px;
 +
    width: 50px;
 +
    height: 75px;
 +
    margin-right: 5px;
 +
    border: 1px solid #215E21;
 +
    padding: 10px 15px;
 +
    color: #ddd;
 +
    opacity: .4;
 +
    margin-right: 13px;
 +
    margin-bottom: 13px;
 +
    -moz-transition: all 0.5s ease-out;
 +
    -webkit-transition: all 0.5s ease-out;
 +
    -o-transition: all 0.5s ease-out;
 +
    transition: all 0.5s ease-out;
 +
}
 +
 
 +
nav label:nth-child(8n) {
 +
    margin-right: 0;
 +
}
 +
 
 +
nav:hover label {
 +
    opacity: .9;
 +
    -moz-transition: all 0.5s ease-out;
 +
    -webkit-transition: all 0.5s ease-out;
 +
    -o-transition: all 0.5s ease-out;
 +
    transition: all 0.5s ease-out;
 +
   
 +
   
 +
   
 +
}
 +
 
 +
nav label:hover {
 +
    opacity: 1;
 +
    background:    -moz-linear-gradient(top, rgba(0,0,0,0), rgba(33,94,33,0.12));
 +
    box-shadow: 0 1px 3px rgba(0,0,0,0.8),
 +
                -5px -5px 5px rgba(0,0,0,0.3);
 +
               
 +
           
 +
}
 +
 
 +
fieldset > label {
 +
    background: rgba(0,0,0,0.7);
 +
    padding: 30px ;
 +
    position: absolute;
 +
    display: block;
 +
    right: 0;
 +
    top: 100%;
 +
    font-size: 13px;
 +
    line-height: 17px;
 +
    bottom:0;
 +
    color: #fff;
 +
    text-align: left;
 +
    box-shadow: inset 0 0 230px (33,94,33,0.8);
 +
    -moz-transition: all 0.5s ease-out;
 +
    -webkit-transition: all 0.5s ease-out;
 +
    -o-transition: all 0.5s ease-out;
 +
    transition: all 0.5s ease-out;
 +
   
 +
   
 +
}
 +
 
 +
 
 +
/* Type */
 +
 
 +
h1 {
 +
    text-shadow: 1px 1px 1px rgba(0,0,0,0.15);
 +
    color: yellow;
 +
    text-align: center;
 +
    margin-bottom: 20px;
 +
}
 +
 
 +
fieldset > label > em {
 +
    display: block;
 +
    font-size: 14px;
 +
    font-weight: bold;
 +
    text-transform: uppercase;
 +
    font-style: normal;
 +
    margin-bottom: 7px;
 +
}
 +
 
 +
fieldset > label > .source {
 +
    display: block;
 +
    margin: 5px 0;
 +
}
 +
 
 +
.source > a {
 +
    text-decoration: none;
 +
    color: black;
 +
}
 +
 
 +
.source > a:hover {
 +
    text-decoration: underline;
 +
}
 +
 
 +
 
 +
/* Content */
 +
 
 +
#label-01 { background: url(http://igemtoronto.files.wordpress.com/2012/08/101thumb2.jpg) no-repeat, #fff; background-size:75px 112.5px}
 +
#label-02 { background: url(http://igemtoronto.files.wordpress.com/2012/08/102thumb2.jpg) no-repeat, #fff; background-size:75px 112.5px}
 +
#label-03 { background: url(http://igemtoronto.files.wordpress.com/2012/08/103thumb2.jpg) no-repeat, #fff; background-size:75px 112.5px}
 +
#label-04 { background: url(http://igemtoronto.files.wordpress.com/2012/08/104thumb2.jpg) no-repeat, #fff;background-size:75px 112.5px }
 +
#label-05 { background: url(http://igemtoronto.files.wordpress.com/2012/08/105thumb2.jpg) no-repeat, #fff; background-size:75px 112.5px}
 +
#label-06 { background: url(http://igemtoronto.files.wordpress.com/2012/08/106thumb2.jpg) no-repeat, #fff; background-size:75px 112.5px}
 +
#label-07 { background: url(http://igemtoronto.files.wordpress.com/2012/08/107thumb2.jpg) no-repeat, #fff;background-size:75px 112.5px }
 +
#label-08 { background: url(http://igemtoronto.files.wordpress.com/2012/08/108thumb2.jpg) no-repeat, #fff;background-size:75px 112.5px}
 +
 
 +
 
 +
#slide-content-01 { background: url(http://igemtoronto.files.wordpress.com/2012/08/1012.jpg) no-repeat; background-size:331px 500px; z-index:99 }
 +
#slide-content-02 { background: url(http://igemtoronto.files.wordpress.com/2012/08/1022.jpg) no-repeat;background-size:331px 500px; z-index:99  }
 +
#slide-content-03 { background: url(http://igemtoronto.files.wordpress.com/2012/08/1032.jpg) no-repeat; background-size:331px 500px; z-index:99  }
 +
#slide-content-04 { background: url(http://igemtoronto.files.wordpress.com/2012/08/1042.jpg) no-repeat; background-size:331px 500px; z-index:99  }
 +
#slide-content-05 { background: url(http://igemtoronto.files.wordpress.com/2012/08/1052.jpg) no-repeat; background-size:331px 500px; z-index:99  }
 +
#slide-content-06 { background: url(http://igemtoronto.files.wordpress.com/2012/08/1062.jpg) no-repeat; background-size:331px 500px; z-index:99  }
 +
#slide-content-07 { background: url(http://igemtoronto.files.wordpress.com/2012/08/1072.jpg) no-repeat; background-size:331px 500px; z-index:99  }
 +
#slide-content-08 { background: url(http://igemtoronto.files.wordpress.com/2012/08/1082.jpg) no-repeat; background-size:331px 500px; z-index:99  }
 +
</style>
 +
 
 +
 
 +
 
 +
 
 +
<body>
 +
 
 +
 +
<!--==========================Team Pictures and Biographies================-->
 +
``<div style="margin-top:50px;margin-left:275px;">
 +
        <font face="helevtica neue" color="#215E21" size="5" > ☆ To view official profile, <i> <a href="https://igem.org/Team.cgi?year=2012"> click here</a>. </i> ☆  </font>
 +
</div>
 +
 
 +
 
 +
<form id="apple" style="margin-left:200px;margin-top:50px">
 +
 +
 +
        <h1> <font face="cooper std" color="#215E21"> Meet the team </font> </h1>
 +
        <div id="banana">
 +
            <input id="slide-01" type="radio" name="nav" style="display:none;" checked>
 +
            <fieldset id="slide-content-01">
 +
                <input id="legend-01" type="checkbox" style="display:none;" />
 +
                <label for="legend-01">
 +
                    <em>Secret Files</em>
 +
Living a double life did not always come so naturally to our Inter-departmental Man of Mystery. As he reclined in his swivel chair and gazed wistfully at the dancing flame of the Bunsen burner, he thought back to his early days in Minsk. "Damn it, Romanova," he mulled, "the E1B-19kD virus was my masterwork!"
 +
                </label>
 +
            </fieldset>
 +
 
 +
            <input id="slide-02" type="radio" name="nav" style="display:none;">
 +
            <fieldset id="slide-content-02">
 +
                <input id="legend-02" type="checkbox"  style="display:none;" />
 +
                <label for="legend-02">
 +
                    <em>Secret Files</em>
 +
                    Adam Komorowski's research interests include type V antifreeze proteins, killer T cells, adenocarcinomas, and whether martinis really taste better if shaken. He is the President and CEO of a large multinational real estate holdings company, and a well-known philanthropist. He divides his time between Toronto, Rome, and agarose gels.
 +
                </label>
 +
            </fieldset>
 +
 
 +
            <input id="slide-03" type="radio" name="nav" style="display:none;">
 +
            <fieldset id="slide-content-03">
 +
                <input id="legend-03" type="checkbox" style="display:none;"/>
 +
                <label for="legend-03">
 +
                    <em>Secret Files</em>
 +
                    Eric Cao enjoys experimenting and secretly (not any more) wants to play around with the laboratory reagents when no one is looking. He loves hanging around with friends and listening to a variety of underground music. In the future, he hopes to go into research concerning disease cure and prevention. 
 +
 
 +
                </label>
 +
            </fieldset>
 +
 
 +
            <input id="slide-04" type="radio" name="nav" style="display:none;">
 +
            <fieldset id="slide-content-04">
 +
                <input id="legend-04" type="checkbox" style="display:none;" />
 +
                <label for="legend-04">
 +
                    <em>Secret Files</em>
 +
When Nicole Cyhelka is not unzipping genes with helicase, applying gibberelin to stimulate stem elongation, and studying the insertion of alpha helices in beta barrels, this chemical engineer turned synthetic biologist (read: 'mad scientist') slips into an evening gown and jets off to Monte Carlo to try her hand at a high stakes game of baccarat. They say diamonds are forever, but who ever said it was easy to get a sponsorship?
 +
                </label>
 +
            </fieldset>
 +
 
 +
            <input id="slide-05" type="radio" name="nav" style="display:none;">
 +
            <fieldset id="slide-content-05">
 +
                <input id="legend-05" type="checkbox" style="display:none;" />
 +
                <label for="legend-05">
 +
                    <em>Secret Files</em>
 +
Moustafa Abdalla is an avid gardner; primarly cultivating hyacinth, various Arabidopsis species, and his ego.
 +
He is a prominent banker for SMERSH, and conducts regular business in Germany under the name "Herr Ziffer";
 +
he is fluent in English, French, German, Italian, and Arabic.
 +
When not entertaining CIA agents in his compound in Munich, he performs northern blots in his spare time.
 +
<span class="source"><a href="#" target="_blank">Test Link</a></span>
 +
            </label>
 +
            </fieldset>
 +
           
 +
            <input id="slide-06" type="radio" name="nav" style="display:none;">
 +
            <fieldset id="slide-content-06">
 +
                <input id="legend-06" type="checkbox"  style="display:none;"/>
 +
                <label for="legend-06">
 +
                    <em>Secret Files</em>
 +
                   
 +
                    <span class="source"><a href="#" target="_blank">Image Credits</a></span>
 +
            </label>
 +
            </fieldset>
 +
           
 +
            <input id="slide-07" type="radio" name="nav" style="display:none;">
 +
            <fieldset id="slide-content-07">
 +
                <input id="legend-07" type="checkbox"  style="display:none;"/>
 +
                <label for="legend-07">
 +
                    <em>Secret Files</em>
 +
More than anything, I try to emulate Becky Sharp from Vanity Fair. She was an uppity social climber with a ravenous appetite for wealthy men; I too am a mountaineer of sorts (though only of knowledge and books - a slightly more reliable means of 'getting ahead' in the world, I should think). The uppity part is entirely up to who you talk to.
 +
 
 +
            </label>
 +
            </fieldset>
 +
           
 +
            <input id="slide-08" type="radio" name="nav" style="display:none;">
 +
            <fieldset id="slide-content-08">
 +
                <input id="legend-08" type="checkbox" style="display:none;" />
 +
                <label for="legend-08">
 +
                    <em>Secret Files</em>
 +
Abby is a self-described "weekend warrior mechanical engineering student" feeling out of place in the biochemistry department and loving every second of it. Her research interests include why the centrifuge tubes are so hard to remove and if it really is possible for engineering students to live a balanced life. She currently divides her time between lab work, an engineering firm – if you knew the rest we'd have to kill you.
 +
 
 +
            </label>
 +
            </fieldset>
 +
           
 +
         
 +
        </div>
 +
 
 +
<div style="height:500px;width:250px;overflow:hidden;margin-top:-500px; margin-left:350px">
 +
<nav>
 +
            <label id="label-01" for="slide-01"></label>
 +
            <label id="label-02" for="slide-02"></label>
 +
            <label id="label-03" for="slide-03"></label>
 +
            <label id="label-05" for="slide-05"></label>
 +
            <label id="label-04" for="slide-04"></label>
 +
            <label id="label-06" for="slide-06"></label>
 +
            <label id="label-07" for="slide-07"></label>
 +
            <label id="label-08" for="slide-08"></label>
 +
        </nav>
 +
        </div>
 +
     
 +
    </form>
 +
 
 +
 
 +
<div style="margin-top:20px;margin-left:210px; z-index:98; position:absolute;">
 +
        <p style="line-height:1.5em;">
 +
        <font face="helevtica neue" color="#215E21" size="4" > <i> Not sure what to do? </i>
 +
          Click on thumbnails (on side) to view larger image. <br> </i> 
 +
          Hover over image and click " ⇧ Read More ... ⇧" to view biography. <br> </i> </font>
 +
</p>
 +
</div>
 +
 +
<!--==========================Footer================-->
 +
 
 +
<div align=left style="margin-top:90px; margin-left:380px;  position: absolute; z-index:99">
 +
<img src="https://static.igem.org/mediawiki/2012/6/6a/Utoronto.png" alt="UofT Logo" width="150" height="148"/>
 +
</div>
 +
 
 +
<div align=left style="margin-top:170px; margin-left:-6px; position:absolute; z-index:98">
 +
<img src="https://static.igem.org/mediawiki/2012/5/5d/Toronto_green.jpg" alt="Banner" width="977" height="125px"/>
 +
</div>

Revision as of 20:38, 16 August 2012

Banner
``
☆ To view official profile, click here. ☆

Meet the team

Not sure what to do? Click on thumbnails (on side) to view larger image.
Hover over image and click " ⇧ Read More ... ⇧" to view biography.

UofT Logo
Banner

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