Team:Calgary/Sandbox3

From 2011.igem.org

(Difference between revisions)
Line 1: Line 1:
-
{{Team:Calgary/Main_Header|home}}
 
-
 
<html>
<html>
-
 
+
<!--SLIDESHOW FEATURE FOR THIS HEADER REQUIRED-->
<head>
<head>
 +
<!--jQuery and jQuery-UI additions-->
 +
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.15/jquery-ui.js"></script>
 +
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
 +
 +
<!--JQuery Cycle Plugin-->
 +
<script type="text/javascript" src="http://cloud.github.com/downloads/malsup/cycle/jquery.cycle.all.latest.js"></script>
 +
 +
<!--JQuery Easing Plugin-->
 +
<script type="text/javascript">
 +
/*
 +
* jQuery Easing v1.3 - http://gsgd.co.uk/sandbox/jquery/easing/
 +
*
 +
* Uses the built in easing capabilities added In jQuery 1.1
 +
* to offer multiple easing options
 +
*
 +
* TERMS OF USE - jQuery Easing
 +
*
 +
* Open source under the BSD License.
 +
*
 +
* Copyright © 2008 George McGinley Smith
 +
* All rights reserved.
 +
*
 +
* Redistribution and use in source and binary forms, with or without modification,
 +
* are permitted provided that the following conditions are met:
 +
*
 +
* Redistributions of source code must retain the above copyright notice, this list of
 +
* conditions and the following disclaimer.
 +
* Redistributions in binary form must reproduce the above copyright notice, this list
 +
* of conditions and the following disclaimer in the documentation and/or other materials
 +
* provided with the distribution.
 +
*
 +
* Neither the name of the author nor the names of contributors may be used to endorse
 +
* or promote products derived from this software without specific prior written permission.
 +
*
 +
* THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY
 +
* EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF
 +
* MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE
 +
*  COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,
 +
*  EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE
 +
*  GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED
 +
* AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
 +
*  NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED
 +
* OF THE POSSIBILITY OF SUCH DAMAGE.
 +
*
 +
*/
 +
 +
// t: current time, b: begInnIng value, c: change In value, d: duration
 +
jQuery.easing['jswing'] = jQuery.easing['swing'];
 +
 +
jQuery.extend( jQuery.easing,
 +
{
 +
def: 'easeOutQuad',
 +
swing: function (x, t, b, c, d) {
 +
//alert(jQuery.easing.default);
 +
return jQuery.easing[jQuery.easing.def](x, t, b, c, d);
 +
},
 +
easeInQuad: function (x, t, b, c, d) {
 +
return c*(t/=d)*t + b;
 +
},
 +
easeOutQuad: function (x, t, b, c, d) {
 +
return -c *(t/=d)*(t-2) + b;
 +
},
 +
easeInOutQuad: function (x, t, b, c, d) {
 +
if ((t/=d/2) < 1) return c/2*t*t + b;
 +
return -c/2 * ((--t)*(t-2) - 1) + b;
 +
},
 +
easeInCubic: function (x, t, b, c, d) {
 +
return c*(t/=d)*t*t + b;
 +
},
 +
easeOutCubic: function (x, t, b, c, d) {
 +
return c*((t=t/d-1)*t*t + 1) + b;
 +
},
 +
easeInOutCubic: function (x, t, b, c, d) {
 +
if ((t/=d/2) < 1) return c/2*t*t*t + b;
 +
return c/2*((t-=2)*t*t + 2) + b;
 +
},
 +
easeInQuart: function (x, t, b, c, d) {
 +
return c*(t/=d)*t*t*t + b;
 +
},
 +
easeOutQuart: function (x, t, b, c, d) {
 +
return -c * ((t=t/d-1)*t*t*t - 1) + b;
 +
},
 +
easeInOutQuart: function (x, t, b, c, d) {
 +
if ((t/=d/2) < 1) return c/2*t*t*t*t + b;
 +
return -c/2 * ((t-=2)*t*t*t - 2) + b;
 +
},
 +
easeInQuint: function (x, t, b, c, d) {
 +
return c*(t/=d)*t*t*t*t + b;
 +
},
 +
easeOutQuint: function (x, t, b, c, d) {
 +
return c*((t=t/d-1)*t*t*t*t + 1) + b;
 +
},
 +
easeInOutQuint: function (x, t, b, c, d) {
 +
if ((t/=d/2) < 1) return c/2*t*t*t*t*t + b;
 +
return c/2*((t-=2)*t*t*t*t + 2) + b;
 +
},
 +
easeInSine: function (x, t, b, c, d) {
 +
return -c * Math.cos(t/d * (Math.PI/2)) + c + b;
 +
},
 +
easeOutSine: function (x, t, b, c, d) {
 +
return c * Math.sin(t/d * (Math.PI/2)) + b;
 +
},
 +
easeInOutSine: function (x, t, b, c, d) {
 +
return -c/2 * (Math.cos(Math.PI*t/d) - 1) + b;
 +
},
 +
easeInExpo: function (x, t, b, c, d) {
 +
return (t==0) ? b : c * Math.pow(2, 10 * (t/d - 1)) + b;
 +
},
 +
easeOutExpo: function (x, t, b, c, d) {
 +
return (t==d) ? b+c : c * (-Math.pow(2, -10 * t/d) + 1) + b;
 +
},
 +
easeInOutExpo: function (x, t, b, c, d) {
 +
if (t==0) return b;
 +
if (t==d) return b+c;
 +
if ((t/=d/2) < 1) return c/2 * Math.pow(2, 10 * (t - 1)) + b;
 +
return c/2 * (-Math.pow(2, -10 * --t) + 2) + b;
 +
},
 +
easeInCirc: function (x, t, b, c, d) {
 +
return -c * (Math.sqrt(1 - (t/=d)*t) - 1) + b;
 +
},
 +
easeOutCirc: function (x, t, b, c, d) {
 +
return c * Math.sqrt(1 - (t=t/d-1)*t) + b;
 +
},
 +
easeInOutCirc: function (x, t, b, c, d) {
 +
if ((t/=d/2) < 1) return -c/2 * (Math.sqrt(1 - t*t) - 1) + b;
 +
return c/2 * (Math.sqrt(1 - (t-=2)*t) + 1) + b;
 +
},
 +
easeInElastic: function (x, t, b, c, d) {
 +
var s=1.70158;var p=0;var a=c;
 +
if (t==0) return b;  if ((t/=d)==1) return b+c;  if (!p) p=d*.3;
 +
if (a < Math.abs(c)) { a=c; var s=p/4; }
 +
else var s = p/(2*Math.PI) * Math.asin (c/a);
 +
return -(a*Math.pow(2,10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )) + b;
 +
},
 +
easeOutElastic: function (x, t, b, c, d) {
 +
var s=1.70158;var p=0;var a=c;
 +
if (t==0) return b;  if ((t/=d)==1) return b+c;  if (!p) p=d*.3;
 +
if (a < Math.abs(c)) { a=c; var s=p/4; }
 +
else var s = p/(2*Math.PI) * Math.asin (c/a);
 +
return a*Math.pow(2,-10*t) * Math.sin( (t*d-s)*(2*Math.PI)/p ) + c + b;
 +
},
 +
easeInOutElastic: function (x, t, b, c, d) {
 +
var s=1.70158;var p=0;var a=c;
 +
if (t==0) return b;  if ((t/=d/2)==2) return b+c;  if (!p) p=d*(.3*1.5);
 +
if (a < Math.abs(c)) { a=c; var s=p/4; }
 +
else var s = p/(2*Math.PI) * Math.asin (c/a);
 +
if (t < 1) return -.5*(a*Math.pow(2,10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )) + b;
 +
return a*Math.pow(2,-10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )*.5 + c + b;
 +
},
 +
easeInBack: function (x, t, b, c, d, s) {
 +
if (s == undefined) s = 1.70158;
 +
return c*(t/=d)*t*((s+1)*t - s) + b;
 +
},
 +
easeOutBack: function (x, t, b, c, d, s) {
 +
if (s == undefined) s = 1.70158;
 +
return c*((t=t/d-1)*t*((s+1)*t + s) + 1) + b;
 +
},
 +
easeInOutBack: function (x, t, b, c, d, s) {
 +
if (s == undefined) s = 1.70158;
 +
if ((t/=d/2) < 1) return c/2*(t*t*(((s*=(1.525))+1)*t - s)) + b;
 +
return c/2*((t-=2)*t*(((s*=(1.525))+1)*t + s) + 2) + b;
 +
},
 +
easeInBounce: function (x, t, b, c, d) {
 +
return c - jQuery.easing.easeOutBounce (x, d-t, 0, c, d) + b;
 +
},
 +
easeOutBounce: function (x, t, b, c, d) {
 +
if ((t/=d) < (1/2.75)) {
 +
return c*(7.5625*t*t) + b;
 +
} else if (t < (2/2.75)) {
 +
return c*(7.5625*(t-=(1.5/2.75))*t + .75) + b;
 +
} else if (t < (2.5/2.75)) {
 +
return c*(7.5625*(t-=(2.25/2.75))*t + .9375) + b;
 +
} else {
 +
return c*(7.5625*(t-=(2.625/2.75))*t + .984375) + b;
 +
}
 +
},
 +
easeInOutBounce: function (x, t, b, c, d) {
 +
if (t < d/2) return jQuery.easing.easeInBounce (x, t*2, 0, c, d) * .5 + b;
 +
return jQuery.easing.easeOutBounce (x, t*2-d, 0, c, d) * .5 + c*.5 + b;
 +
}
 +
});
 +
 +
/*
 +
*
 +
* TERMS OF USE - EASING EQUATIONS
 +
*
 +
* Open source under the BSD License.
 +
*
 +
* Copyright © 2001 Robert Penner
 +
* All rights reserved.
 +
*
 +
* Redistribution and use in source and binary forms, with or without modification,
 +
* are permitted provided that the following conditions are met:
 +
*
 +
* Redistributions of source code must retain the above copyright notice, this list of
 +
* conditions and the following disclaimer.
 +
* Redistributions in binary form must reproduce the above copyright notice, this list
 +
* of conditions and the following disclaimer in the documentation and/or other materials
 +
* provided with the distribution.
 +
*
 +
* Neither the name of the author nor the names of contributors may be used to endorse
 +
* or promote products derived from this software without specific prior written permission.
 +
*
 +
* THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY
 +
* EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF
 +
* MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE
 +
*  COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,
 +
*  EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE
 +
*  GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED
 +
* AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
 +
*  NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED
 +
* OF THE POSSIBILITY OF SUCH DAMAGE.
 +
*
 +
*/
 +
</script>
 +
<!--Script to activate dropdown menu function. Uses jQuery syntax.-->
 +
<script type="text/javascript">
 +
$(document).ready(function () {
 +
$(‘.dropdown’).each(function () {
 +
$(this).parent().eq(0).hover(function () {
 +
$(‘.dropdown:eq(0)’, this).show();
 +
}, function () {
 +
$(‘.dropdown:eq(0)’, this).hide();
 +
});
 +
});
 +
});
 +
 +
</script>
 +
<!--Circle effects. jQuery custom functions make all of us happy. ^_^ -->
 +
<script type="text/javascript">
 +
$(document).ready(function(){
 +
 +
jQuery.fn.setcircle = function(){
 +
this.css({
 +
"display":"block",
 +
"position":"absolute",
 +
"margin-left":790,
 +
"margin-top":-250,
 +
});
 +
}
 +
 +
jQuery.fn.resetcircle = function(){
 +
this.hide();
 +
$('#home #circle0').show();
 +
$('#team #circle1').show();
 +
$('#project #circle2').show();
 +
$('#parts #circle3').show();
 +
$('#notebook #circle4').show();
 +
$('#outreach #circle5').show();
 +
$('#sponsors #circle6').show();
 +
}
 +
//homebutton set
 +
$('#homebutton').mouseover(function(){
 +
$('.headercircle').hide();
 +
$('#circle0').show();
 +
$('#circle0').setcircle();
 +
});
 +
$('#homebutton').mouseout(function(){
 +
$('#circle0').resetcircle();
 +
});
 +
 +
//teambutton set
 +
$('#teambutton').mouseover(function(){
 +
$('.headercircle').hide();
 +
$('#circle1').show();
 +
$('#circle1').setcircle();
 +
});
 +
$('#teambutton').mouseout(function(){
 +
$('#circle1').resetcircle();
 +
});
 +
 +
//projectbutton set
 +
$('#projectbutton').mouseover(function(){
 +
$('.headercircle').hide();
 +
$('#circle2').show();
 +
$('#circle2').setcircle();
 +
});
 +
$('#projectbutton').mouseout(function(){
 +
$('#circle2').resetcircle();
 +
});
 +
 +
//partsbutton set
 +
$('#partsbutton').mouseover(function(){
 +
$('.headercircle').hide();
 +
$('#circle3').show();
 +
$('#circle3').setcircle();
 +
});
 +
$('#partsbutton').mouseout(function(){
 +
$('#circle3').resetcircle();
 +
});
 +
 +
//notebookbutton set
 +
$('#notebookbutton').mouseover(function(){
 +
$('.headercircle').hide();
 +
$('#circle4').show();
 +
$('#circle4').setcircle();
 +
});
 +
$('#notebookbutton').mouseout(function(){
 +
$('#circle4').resetcircle();
 +
});
 +
 +
//outreachbutton set
 +
$('#outreachbutton').mouseover(function(){
 +
$('.headercircle').hide();
 +
$('#circle5').show();
 +
$('#circle5').setcircle();
 +
});
 +
$('#outreachbutton').mouseout(function(){
 +
$('#circle5').resetcircle();
 +
});
 +
 +
//sponsorsbutton set
 +
$('#sponsorsbutton').mouseover(function(){
 +
$('.headercircle').hide();
 +
$('#circle6').show();
 +
$('#circle6').setcircle();
 +
});
 +
$('#sponsorsbutton').mouseout(function(){
 +
$('#circle6').resetcircle();
 +
});
 +
 +
//igembutton set
 +
$('#igembutton').mouseover(function(){
 +
$('.headercircle').hide();
 +
$('#circle7').show();
 +
$('#circle7').setcircle();
 +
});
 +
$('#igembutton').mouseout(function(){
 +
$('#circle7').resetcircle();
 +
});
 +
});
 +
</script>
 +
 +
 +
<style>
<style>
 +
/***Master styling of text components, because we like consistency***/
-
h1, h2, h3, h4, h5{
+
h1, h2, h3, h4, h5, p, a{
text-decoration: none;
text-decoration: none;
border: 0;
border: 0;
 +
font-family: Arial;
}
}
-
#titlebar{
+
a{
-
position: relative;
+
color: #0063bd;
-
margin-top: 0px;
+
-
margin-left: 30px;
+
-
z-index: 1;
+
}
}
-
#pagetitle{
+
#sidetext a, #sidetext p, #sidetext li a{
-
position: absolute;
+
color: white;
-
color: white;
+
font-family: Arial;
-
margin-left: 50px;
+
}
-
margin-top: -45px;
+
-
z-index: 1;
+
-
}
+
-
#box1{
+
a, a:visited{
-
margin-top: 24px;
+
color: #0063bd;
}
}
-
+
 
-
#box1 img.boxtop1{
+
table tr{
-
position: relative;
+
margin-top: 5px;
 +
margin-bottom: 5px;
 +
}
 +
 
 +
table td{
 +
margin-left: 5px;
 +
margin-right: 5px;
 +
}
 +
 
 +
#sponsors table tr td img{
 +
width: 200px;
 +
padding-right: 30px;
 +
padding-left: 10px;
 +
}
 +
 
 +
/***End master styling***/
 +
 
 +
 
 +
/***
 +
Minimal header: removes the search bar and header image and readjusts font colours in the menus.
 +
 
 +
Thanks a lot to the 2011 Brown-Stanford iGEM team for snippets of their code!
 +
Check out their wiki at https://2011.igem.org/Team:Brown-Stanford
 +
***/
 +
 
 +
div#top-section{ /*the div containing the entire top bar*/
 +
height: 20px;
 +
margin-left: auto;
 +
margin-right: auto;
 +
margin-bottom: 0px !important;
 +
margin-top: -14px;
 +
padding:0px 0px 0px 0px;;
 +
border: none;
 +
width: 100%;
 +
background: none;
 +
color: black;
 +
position:absolute;
 +
}
 +
 
 +
#p-logo { /*the header image*/
 +
height:0px;
 +
overflow:hidden;
 +
border:none;
 +
}
 +
 
 +
#content{
 +
margin-top: 14px;
 +
}
 +
 
 +
#search-controls {
 +
overflow:hidden;
 +
display:none;
 +
background: none;
 +
position: absolute;
 +
top: 170px;
 +
right: 40px;
 +
}
 +
 
 +
 
 +
div#header {
 +
width: 975px;
 +
text-align: left;
 +
margin-left: auto;
 +
margin-right: auto;
 +
margin-bottom: 0px !important;
 +
} 
 +
 
 +
#menubar {
 +
position: absolute;
 +
background: none;
 +
color: black;
 +
}
 +
 
 +
.left-menu, .right-menu{
 +
position: absolute;
 +
background: none;
 +
color: white;
 +
}
 +
 
 +
.left-menu li, .right-menu li a {
 +
color: transparent !important;
 +
}
 +
 
 +
 
 +
.left-menu ul li, .right-menu ul li a{
 +
background: none;
 +
color: white;
 +
}
 +
 
 +
.right-menu li a:hover, .right-menu li a:visited, .right-menu li a:active {
 +
    color: white !important;
 +
}
 +
 
 +
/***End minimal header***/
 +
 
 +
 
 +
/***Now for our own stuff: personalized header images and navbar***/
 +
 
 +
#headercontainer{
margin-left: 30px;
margin-left: 30px;
 +
}
 +
 +
#headerbar{
 +
width: 842px;
 +
height: 48px;
 +
background-image: url(https://static.igem.org/mediawiki/2011/e/ef/UCalgary_HeaderBarNew.png);
 +
position: absolute;
margin-top: -25px;
margin-top: -25px;
}
}
-
#box1 img.boxbottom1{
+
/*div containing menu bar*/
 +
ul#topnav{
 +
display: table;
 +
margin: 0;
 +
padding: 0;
 +
left: 15px;
 +
top: 15px;
 +
list-style: none;
position: relative;
position: relative;
-
margin-left: 30px;
+
 
-
margin-top: -6px;
+
}
}
-
#box1 p{
+
ul#topnav a.navtext{
-
background-image: url(https://static.igem.org/mediawiki/2011/5/5c/UCalgary_MainPageBox1Repeater.png);
+
position: relative;
-
background-repeat: repeat-y;
+
display: block;
-
padding-left: 20px;
+
background-position: left top;
-
padding-top: 15px;
+
margin-right: 12px;
-
padding-bottom: 2px;
+
margin-left: 12px;
-
padding-right: 90px; /**Adjustment linked to width**/
+
}
-
float: left;
+
-
margin-left: 30px;
+
-
margin-top: -4px;
+
-
z-index: 0;
+
-
width: 625px;
+
-
color: black;
+
-
}
+
-
#likebutton{
+
ul#topnav li{
-
float: right;
+
margin: 0;
-
margin-right: 25px;
+
padding: 0;
-
margin-top: -250px;
+
list-style: none;
 +
display: table-cell;
 +
float: left;
 +
position: relative;
}
}
-
+
 
-
#twitterwidget{
+
ul#topnav li a{
-
float: right;
+
padding: 0;
-
margin-top: -180px;
+
display: block;
-
margin-right: 25px;
+
color: #f0f0f0;
-
padding-left: 20px;
+
text-decoration: none;
}
}
-
#box2{
+
ul#topnav li:hover, ul#topnav a:hover{
-
background-image: url(https://static.igem.org/mediawiki/2011/0/09/UCalgary_MainPageBox2Repeater.png);
+
background-position: left bottom;
-
background-repeat: repeat-y;
+
-
margin-left: 80px;
+
-
padding-bottom: 80px;
+
}
}
-
#box2 h2{
+
/*Subnavigation*/
-
margin-top: -20px;
+
ul.dropdown{
-
padding-top: 40px;
+
margin: 0;
-
padding-left: 34px;
+
padding: 0;
-
}
+
padding-bottom: 10px;
 +
padding-top: 7px;
 +
display: block;
 +
position: absolute;
 +
z-index: 999;
 +
width: 200px;
 +
display: none;
 +
left: 0;
 +
/*Background of subnav*/
 +
background-color: #00365E;
 +
opacity: 0.77;
 +
}
-
#box2 p{
+
ul.dropdown li{
-
width: 750px;
+
margin: 0;
-
padding-left: 20px;
+
padding: 0;
-
color: black;
+
width: 150px;
-
}
+
float: none;
-
 
+
-
#box3{
+
position: relative;
position: relative;
-
margin-left: 210px;
+
list-style: none;
-
margin-top: -20px;
+
display: block;
}
}
-
#box3 p, table{
+
ul.dropdown li a{
-
background-image: url(https://static.igem.org/mediawiki/2011/2/29/UCalgary_MainPageBox3Repeater.png);
+
display: block;
-
background-repeat: repeat-y;
+
}
-
width: 673px;
+
-
padding-left: 125px;
+
-
padding-right: 20px;
+
-
}
+
-
+
-
+
-
+
-
#box3 table tr td{
+
-
padding-left: 10px;
+
-
padding-right: 10px;
+
-
padding-top: 10px;
+
-
padding-bottom: 10px;
+
-
margin: 0;
+
-
}
+
-
+
-
#box3 table tr td img{
+
-
width: 240px;
+
-
}
+
-
+
-
#box3 h2{
+
-
background-image: url(https://static.igem.org/mediawiki/2011/2/29/UCalgary_MainPageBox3Repeater.png);
+
-
background-repeat: repeat-y;
+
-
padding-left: 145px;
+
-
padding-bottom: 20px;
+
-
margin-bottom: -5px;
+
-
}
+
-
#box4{
+
 
-
background-image:url(https://static.igem.org/mediawiki/2011/2/26/UCalgary_MainPageBox4.png);
+
/*Establish sprites for each individual button*/
-
width: 314px;
+
#homebutton a{
-
height: 264px;
+
background-image: url(https://static.igem.org/mediawiki/2011/1/1d/UCalgary_MenuHome.png);
 +
width: 51px;
 +
height: 16px;
 +
}
 +
 
 +
#teambutton a{
 +
background-image: url(https://static.igem.org/mediawiki/2011/4/4f/UCalgary_MenuTeam.png);
 +
width: 48px;
 +
height: 16px;
 +
margin-bottom: 17px;
 +
}
 +
 
 +
#projectbutton a{
 +
background-image: url(https://static.igem.org/mediawiki/2011/f/f0/UCalgary_MenuProject.png);
 +
width: 62px;
 +
height: 19px;
 +
margin-bottom: 14px;
 +
}
 +
 
 +
#partsbutton a{
 +
background-image: url(https://static.igem.org/mediawiki/2011/e/e4/UCalgary_MenuParts.png);
 +
width: 45px;
 +
height: 16px;
 +
margin-bottom: 17px;
 +
}
 +
 
 +
#notebookbutton a{
 +
background-image: url(https://static.igem.org/mediawiki/2011/8/84/UCalgary_MenuNotebook.png);
 +
width: 84px;
 +
height: 16px;
 +
margin-bottom: 17px;
 +
}
 +
 
 +
#outreachbutton a{
 +
background-image: url(https://static.igem.org/mediawiki/2011/9/96/UCalgary_MenuOutreach.png);
 +
width: 80px;
 +
height: 17px;
 +
margin-bottom: 16px;
 +
}
 +
 
 +
#sponsorsbutton a{
 +
background-image: url(https://static.igem.org/mediawiki/2011/5/51/UCalgary_MenuSponsors.png);
 +
width: 84px;
 +
height: 20px;
 +
margin-bottom: 13px;
 +
}
 +
 
 +
#igembutton a{
 +
background-image: url(https://static.igem.org/mediawiki/2011/4/49/UCalgary_MenuiGEM.png);
 +
width: 46px;
 +
height: 17px;
 +
margin-bottom: 16px;
 +
}
 +
 
 +
.navtext{
 +
text-indent: -99999px; /*Shoots all HTML text buttons off the page*/
 +
}
 +
 
 +
/*Adjusting the subnavigation menu*/
 +
ul#topnav li#teambutton ul li a,
 +
ul#topnav li#projectbutton ul li a,
 +
ul#topnav li#partsbutton ul li a,
 +
ul#topnav li#notebookbutton ul li a,
 +
ul#topnav li#outreachbutton ul li a,
 +
ul#topnav li#sponsorsbutton ul li a{
 +
height: 35px;
 +
background-image: none;
 +
font-family: Arial;
 +
font-size: 17px;
 +
font-weight: 400;
 +
}
 +
 
 +
ul#topnav li ul li a{
 +
display: inline; /*correction of previous link style*/
 +
background-image: url(https://static.igem.org/mediawiki/2011/6/69/UCalgary_SubNavRepeater.png);
 +
background-repeat: repeat-x;
 +
padding-left: 12px;
 +
padding-right: 12px;
 +
}
 +
 
 +
/*Rollover settings*/
 +
ul#topnav li:hover ul{
 +
display: block;
 +
z-index: 999;
 +
}
 +
 
 +
ul#topnav li ul li a:hover{
 +
color: #49f0ff;
 +
}
 +
 
 +
/*Active state settings*/
 +
#home li#homebutton a,
 +
#team li#teambutton a,
 +
#project li#projectbutton a,
 +
#parts li#partsbutton a,
 +
#notebook li#notebookbutton a,
 +
#outreach li#outreachbutton a,
 +
#sponsors li#sponsorsbutton a{
 +
background-position: left bottom;
 +
}
 +
 
 +
/*Hide all circles*/
 +
img.headercircle{
 +
display: none;
 +
}
 +
 
 +
/*Active circle showing*/
 +
#home #circle0,
 +
#team #circle1,
 +
#project #circle2,
 +
#parts #circle3,
 +
#notebook #circle4,
 +
#outreach #circle5,
 +
#sponsors #circle6{
 +
display: block;
position: absolute;
position: absolute;
-
margin-left: 10px;
+
margin-left: 790px;
-
margin-top: -850px;
+
margin-top: -250px;
}
}
-
#box4 h3, p{
+
/***End menu stuff. Onto the rest of the header!***/
-
color: white;
+
-
margin-left: 15px;
+
-
}
+
-
#box4 h3{
+
-
padding-top: 15px;
+
-
}
+
-
+
-
</style>
+
.firstHeading{
-
</head>
+
text-indent: -99999px;
 +
}
-
<body>
+
#headbanner, #headbanner img{
 +
width: 906px;
 +
height: 216px;
 +
}
-
<div id="box1">
+
#fb-button{
-
<img id="titlebar" src="https://static.igem.org/mediawiki/2011/4/42/UCalgary_TitleBar.png"></img>
+
position: absolute;
-
<h1 id="pagetitle">Welcome!</h1>
+
margin-left: 872px;
-
<img class="boxtop1" src="https://static.igem.org/mediawiki/2011/c/cf/UCalgary_MainPageBox1.png"></img>
+
margin-top: -170px;
-
<p>Hello! Our wiki is currently under heavy construction, so please check regularly for updates. Thank you for your patience.<br/>
+
}
-
The University of Calgary iGEM team aims to build a biosensor for naphthenic acids. Naphthenic acids are a family of organic acids that are toxic to terrestrial and aquatic wildlife, and are waste products of the bitumen extraction process. Naphthenic acids are stored in on-site settling ponds called tailing ponds; not only do they poison the environment, but they also contribute to the corrosion of refinery equipment, which directly increases maintenance and replacement costs. Currently, sophisticated and expensive procedures such as mass spectroscopy and gas chromatography are needed to identify and assess the concentration of naphthenic acids in solution. A bacterial sensor, if developed, could greatly improve the cost- and time-efficiency of naphthenic acid detection, and facilitate a workable approach for remediation.
+
-
</p>
+
-
<img class="boxbottom1" src="https://static.igem.org/mediawiki/2011/1/11/UCalgary_MainPageBox1Bottom.png"></img>
+
-
</div>
+
-
<a id="likebutton" href="http://www.facebook.com/pages/Calgary-iGEM/215971681759173">
+
#twitter-button{
-
<img src="https://static.igem.org/mediawiki/2011/5/57/UCalgary_FacebookLikeButton_Small.png"></img>
+
position: absolute;
-
</a>
+
margin-left: 898px;
 +
margin-top: -170px;
 +
}
-
<script src="http://widgets.twimg.com/j/2/widget.js"></script>
 
-
<div id="twitterwidget">
 
-
<script>
 
-
new TWTR.Widget({
 
-
  version: 2,
 
-
  type: 'profile',
 
-
  rpp: 5,
 
-
  interval: 30000,
 
-
  width: 250,
 
-
  height: 300,
 
-
  theme: {
 
-
    shell: {
 
-
      background: '#006ebd',
 
-
      color: '#ffffff'
 
-
    },
 
-
    tweets: {
 
-
      background: '#003961',
 
-
      color: '#ffffff',
 
-
      links: '#42ffd9'
 
-
    }
 
-
  },
 
-
  features: {
 
-
    scrollbar: true,
 
-
    loop: false,
 
-
    live: false,
 
-
    hashtags: true,
 
-
    timestamp: true,
 
-
    avatars: false,
 
-
    behavior: 'all'
 
-
  }
 
-
}).render().setUser('iGEMCalgary').start();
 
-
</script>
 
-
</div>
 
-
<div id="box2">
+
/*...Not much, was there.*/
-
<h2>Building a Naphthenic Acid Biosensor</h2>
+
-
<p>This project is separated into four subcomponents:</p>
+
-
<p>The first is an examination of the native tailings pond genus <i>Pseudomonas</i> using ChIP-Seq, and attempting to find a naphthenic acid-sensitive promoter which can then be assembled with a reporter system.
+
-
The second component involves constructing and characterizing an electrochemical reporter system that can produce quantifiable output without the need for optical measurements. This way, even cloudy tailings pond water can yield useful results.
+
-
At the same time, we are also examining another potential chassis to detect and report naphthenic acids, in the microalgae <i>Chlamydomonas</i>.
+
-
Finally, a software tool is currently in development that we hope will be able to locate and report degrees of non-homology between two separate genomes.</p>
+
-
<p>More details on the biosafety of our project can be found on our <a href="https://2011.igem.org/Team:Calgary/Safety">safety page</a>.</p>
 
 +
</style>
 +
 +
</head>
 +
 +
<body id="</html>{{{1}}}<html>">
 +
 +
<div id="headercontainer">
 +
<div id="headerbar">
 +
<ul id="topnav">
 +
<li id="homebutton"><a class="navtext" href="https://2011.igem.org/Team:Calgary">Home</a></li>
 +
<li id="teambutton">
 +
<a class="navtext" href="https://2011.igem.org/Team:Calgary/Team">Team</a>
 +
<ul class="dropdown">
 +
<li><a href="https://2011.igem.org/Team:Calgary/Team/Biographies">Biographies</a></li>
 +
<li><a href="https://2011.igem.org/Team:Calgary/Team/Facilitators">Facilitators</a></li>
 +
<li><a href="https://2011.igem.org/Team:Calgary/Team/About_The_University">The University</a></li>
 +
<li><a href="http://ung.igem.org/Team.cgi?id=640">Official Profile</a></li>
 +
</ul>
 +
</li>
 +
<li id="projectbutton">
 +
<a class="navtext" href="https://2011.igem.org/Team:Calgary/Project">Project</a>
 +
<ul class="dropdown">
 +
<li><a href="https://2011.igem.org/Team:Calgary/Project">Overview</a></li>
 +
<li><a href="https://2011.igem.org/Team:Calgary/Project/Promoter">Promoter</a></li>
 +
<li><a href="https://2011.igem.org/Team:Calgary/Project/Reporter">Reporter</a></li>
 +
<li><a href="https://2011.igem.org/Team:Calgary/Project/Chassis">Chassis</a></li>
 +
                        <li><a href="https://2011.igem.org/Team:Calgary/Project/DataPage">Data Page</a></li>
 +
                        <li><a href="https://2011.igem.org/Team:Calgary/Project/Acomplishments">Accomplishments</a></li>
 +
<li><a href="https://2011.igem.org/Team:Calgary/Project/Future_Directions">Future Directions</a></li>
 +
<li><a href="https://2011.igem.org/Team:Calgary/Project/References">References</a></li>
 +
</ul>
 +
</li>
 +
<li id="partsbutton">
 +
<a class="navtext" href="https://2011.igem.org/Team:Calgary/Parts">Parts</a>
 +
<ul class="dropdown">
 +
<li><a href="https://2011.igem.org/Team:Calgary/Parts">Parts Submitted</a></li>
 +
<li><a href="https://2011.igem.org/Team:Calgary/Parts/Characterization">Characterization</a></li>
 +
                        <li><a href="https://2011.igem.org/Team:Calgary/Notebook/Attributions">Attributions</a></li>
 +
</ul>
 +
</li>
 +
<li id="notebookbutton">
 +
<a class="navtext" href="https://2011.igem.org/Team:Calgary/Notebook">Notebook</a>
 +
<ul class="dropdown">
 +
<li><a href="https://2011.igem.org/Team:Calgary/Notebook/Calendar">Journal</a></li>
 +
<li><a href="https://2011.igem.org/Team:Calgary/Notebook/Protocols">Protocols</a></li>
 +
<li><a href="https://2011.igem.org/Team:Calgary/Safety">Safety</a></li>
 +
</ul>
 +
</li>
 +
<li id="outreachbutton">
 +
<a class="navtext" href="https://2011.igem.org/Team:Calgary/Outreach">Outreach</a>
 +
<ul class="dropdown">
 +
<li><a href="https://2011.igem.org/Team:Calgary/Outreach/Human">Human Practices</a></li>
 +
<li><a href="https://2011.igem.org/Team:Calgary/Notebook/Conferences">Conferences</a></li>
 +
<li><a href="https://2011.igem.org/Team:Calgary/Outreach/Follow">Follow Us!</a></li>
 +
</ul>
 +
</li>
 +
<li id="sponsorsbutton">
 +
<a class="navtext" href="https://2011.igem.org/Team:Calgary/Sponsors">Sponsors</a>
 +
<ul class="dropdown">
 +
<li><a href="https://2011.igem.org/Team:Calgary/Sponsors">Sponsors</a></li>
 +
<li><a href="https://2011.igem.org/Team:Calgary/Sponsors/Acknowledgements">Acknowledgements</a></li>
 +
</ul>
 +
</li>
 +
<li id="igembutton">
 +
<a class="navtext" href="https://2011.igem.org" target="_blank">iGEM</a>
 +
</li>
 +
 +
</ul>
</div>
</div>
-
<div id="box3">
+
<div id="headbanner">
-
<img class="boxtop3" src="https://static.igem.org/mediawiki/2011/2/22/UCalgary_MainPageBox3.png"></img>
+
<img src="https://static.igem.org/mediawiki/2011/1/1c/UCalgary_HeaderImage2.png"></img>
-
<h2>Our Sponsors</h2>
+
<img src="https://static.igem.org/mediawiki/2011/0/04/UCalgary2011_MainPageHeaderImage1.png"></img>
-
<table>
+
<img src="https://static.igem.org/mediawiki/2011/9/93/UCalgary2011_HeaderImage3.png"></img>
-
<tr>
+
<img src="https://static.igem.org/mediawiki/2011/d/d5/UCalgary2011_HeaderImage4.png"></img>
-
<td><img src="https://static.igem.org/mediawiki/2011/c/c1/UCalgary_UofCLogo.png"></img></td>
+
<img src="https://static.igem.org/mediawiki/2011/f/f6/UCalgary2011_HeaderImage5.png"></img>
-
<td><img src="https://static.igem.org/mediawiki/2011/3/3f/UCalgary2011_AITF_Logo_Small.png"></img></td>
+
-
</tr>
+
-
</table>
+
-
<table>
+
-
<tr>
+
-
<td><img style="width: 510px;" src="https://static.igem.org/mediawiki/2011/d/da/UCalgary2011_OSLI_Banner_Logo_Small.png"></img></td>
+
-
</tr>
+
-
</table>
+
-
<table>
+
-
<tr>
+
-
<td><img src="https://static.igem.org/mediawiki/2011/9/9a/UCalgary_OSRIN_Logo.png"></img></td>
+
-
<td><img src="https://static.igem.org/mediawiki/2011/d/d6/UCalgary_NEB_Logo.png"></img></td>
+
-
</tr>
+
-
<tr>
+
-
<td><img src="https://static.igem.org/mediawiki/2011/6/65/UCalgary_VWR_Logo.png"></img></td>
+
-
<td><img src="https://static.igem.org/mediawiki/2011/c/c7/UCalgary_BHSc_Logo.png"></img></td>
+
-
</tr>
+
-
<tr>
+
-
<td><img style="width: 220px;" src="https://static.igem.org/mediawiki/2011/a/a8/UCalgary_Nexen_Logo.png"></img></td>
+
-
<td><img src="https://static.igem.org/mediawiki/2011/e/ee/UCalgary_Sarstedt_Logo.png"></img></td>
+
-
</tr>
+
-
<tr>
+
-
<td><img src="https://static.igem.org/mediawiki/2011/8/8a/UCalgary_Sigma_Aldrich_Logo.png"></img></td>
+
-
<td><img src="https://static.igem.org/mediawiki/2011/7/78/UCalgary2011_Medicine_Hat_College_Logo.png"></img></td>
+
-
</tr>
+
-
</table>
+
-
<img class="boxbottom3" src="https://static.igem.org/mediawiki/2011/6/6c/UCalgary_MainPageBox3Bottom.png"></img>
+
</div>
</div>
-
<div id="box4">
+
<!--Header Image Shuffling-->
-
<h3>Other Things</h3>
+
<script type="text/javascript">
-
<p>Here is a placeholder spot.</p>
+
$(document).ready(function(){
 +
$('#headbanner').cycle();
 +
});
 +
</script>
 +
<!--Circles-->
 +
<img class="headercircle" id="circle0" src="https://static.igem.org/mediawiki/2011/c/c1/UCalgary_CircleHome.png"></img>
 +
<img class="headercircle" id="circle1" src="https://static.igem.org/mediawiki/2011/d/d4/UCalgary_CircleTeam.png"></img>
 +
<img class="headercircle" id="circle2" src="https://static.igem.org/mediawiki/2011/7/7d/UCalgary_CircleProject.png"></img>
 +
<img class="headercircle" id="circle3" src="https://static.igem.org/mediawiki/2011/8/8d/UCalgary_CircleParts.png"></img>
 +
<img class="headercircle" id="circle4" src="https://static.igem.org/mediawiki/2011/0/03/UCalgary_CircleNotebook.png"></img>
 +
<img class="headercircle" id="circle5" src="https://static.igem.org/mediawiki/2011/8/84/UCalgary_CircleOutreach.png"></img>
 +
<img class="headercircle" id="circle6" src="https://static.igem.org/mediawiki/2011/3/3c/UCalgary_CircleSponsors.png"></img>
 +
<img class="headercircle" id="circle7" src="https://static.igem.org/mediawiki/2011/8/85/UCalgary_CircleiGEM.png"></img>
</div>
</div>

Revision as of 01:59, 29 September 2011

Retrieved from "http://2011.igem.org/Team:Calgary/Sandbox3"