Template:Team:Washington/Templates/Top

From 2012.igem.org

(Difference between revisions)
(Created page with "<html> <style type="text/css"> .firstHeading { - Gets rid of the default iGEM picture: height:2px; visibility:hidden...")
 
(105 intermediate revisions not shown)
Line 5: Line 5:
     height:2px;
     height:2px;
     visibility:hidden;
     visibility:hidden;
-
}            
+
}
 +
#catlinks {
 +
    display: none;
 +
}
#content {
#content {
     border-left-width:0px;
     border-left-width:0px;
Line 42: Line 45:
/*Now to set heading and body fonts*/
/*Now to set heading and body fonts*/
-
body {
+
body {  
-
    background: #545353;                       /* Background (on side color)*/
+
background:#000000;
 +
background-image: url("http://2012.igem.org/wiki/images/1/1b/Gradientback.jpg");
 +
background-position: center;
 +
background-repeat: repeat-y;
}                 
}                 
h1
h1
Line 81: Line 87:
{
{
color:#262626;
color:#262626;
-
text-align:left;
+
text-align: justify;
font-family:"Arial";
font-family:"Arial";
font-size:14px;
font-size:14px;
Line 94: Line 100:
line-height: 1;
line-height: 1;
font-family:"Arial";
font-family:"Arial";
-
font-size:11px;
+
font-size:11px;
}
}
Line 118: Line 124:
position:relative;
position:relative;
}
}
-
</style>
 
 +
#igemuwmenu, #igemuwmenu ul {
 +
margin: 0;
 +
padding: 0;
 +
list-style: none;
 +
}
 +
 +
#igemuwmenu {
 +
width: 820px;
 +
margin: 10px auto;
 +
border: 1px solid #222;
 +
background-color: #111;
 +
background-image: -moz-linear-gradient(#444, #111);
 +
background-image: -webkit-gradient(linear, left top, left bottom, from(#444), to(#111));
 +
background-image: -webkit-linear-gradient(#444, #111);
 +
background-image: -o-linear-gradient(#444, #111);
 +
background-image: -ms-linear-gradient(#444, #111);
 +
background-image: linear-gradient(#444, #111);
 +
-moz-border-radius: 6px;
 +
-webkit-border-radius: 6px;
 +
border-radius: 6px;
 +
-moz-box-shadow: 0 1px 1px #777, 0 1px 0 #666 inset;
 +
-webkit-box-shadow: 0 1px 1px #777, 0 1px 0 #666 inset;
 +
box-shadow: 0 1px 1px #777, 0 1px 0 #666 inset;
 +
                display: inline-block;
 +
                white-space: nowrap;
 +
}
 +
 +
#igemuwmenu:before,
 +
#igemuwmenu:after {
 +
content: "";
 +
display: table;
 +
}
 +
 +
#igemuwmenu:after {
 +
clear: both;
 +
}
 +
 +
#igemuwmenu {
 +
zoom:1;
 +
}
 +
 +
#igemuwmenu li {
 +
border-right: 1px solid #222;
 +
-moz-box-shadow: 1px 0 0 #444;
 +
-webkit-box-shadow: 1px 0 0 #444;
 +
box-shadow: 1px 0 0 #444;
 +
position: relative;
 +
                display: inline-block;
 +
                white-space: nowrap;
 +
}
 +
 +
#igemuwmenu a {
 +
padding: 12px 20px;
 +
color: #999;
 +
text-transform: uppercase;
 +
font: bold 11.4px Arial, Helvetica;
 +
text-decoration: none;
 +
text-shadow: 0 1px 0 #000;
 +
                display: inline-block;
 +
                white-block: nowrap;
 +
}
 +
       
 +
    #igemuwmenu li:hover > a {
 +
color: #fafafa;
 +
}
 +
 +
*html #igemuwmenu li a:hover { /* IE6 only */
 +
color: #fafafa;
 +
}
 +
 +
#igemuwmenu ul {
 +
margin: 20px 0 0 0;
 +
_margin: 0; /*IE6 only*/
 +
opacity: 0;
 +
visibility: hidden;
 +
position: absolute;
 +
top: 38px;
 +
left: 0;
 +
z-index: 1;   
 +
background: #444;
 +
background: -moz-linear-gradient(#444, #111);
 +
background-image: -webkit-gradient(linear, left top, left bottom, from(#444), to(#111));
 +
background: -webkit-linear-gradient(#444, #111);   
 +
background: -o-linear-gradient(#444, #111);
 +
background: -ms-linear-gradient(#444, #111);
 +
background: linear-gradient(#444, #111);
 +
-moz-box-shadow: 0 -1px rgba(255,255,255,.3);
 +
-webkit-box-shadow: 0 -1px 0 rgba(255,255,255,.3);
 +
box-shadow: 0 -1px 0 rgba(255,255,255,.3);
 +
-moz-border-radius: 3px;
 +
-webkit-border-radius: 3px;
 +
border-radius: 3px;
 +
-webkit-transition: all .2s ease-in-out;
 +
-moz-transition: all .2s ease-in-out;
 +
-ms-transition: all .2s ease-in-out;
 +
-o-transition: all .2s ease-in-out;
 +
transition: all .2s ease-in-out; 
 +
}
 +
#igemuwmenu li:hover > ul {
 +
opacity: 1;
 +
visibility: visible;
 +
margin: 0;
 +
}
 +
 +
#igemuwmenu ul ul {
 +
top: 0;
 +
left: 150px;
 +
margin: 0 0 0 20px;
 +
_margin: 0; /*IE6 only*/
 +
-moz-box-shadow: -1px 0 0 rgba(255,255,255,.3);
 +
-webkit-box-shadow: -1px 0 0 rgba(255,255,255,.3);
 +
box-shadow: -1px 0 0 rgba(255,255,255,.3);
 +
}
 +
 +
#igemuwmenu ul li {
 +
float: none;
 +
display: block;
 +
border: 0;
 +
_line-height: 0; /*IE6 only*/
 +
-moz-box-shadow: 0 1px 0 #111, 0 2px 0 #666;
 +
-webkit-box-shadow: 0 1px 0 #111, 0 2px 0 #666;
 +
box-shadow: 0 1px 0 #111, 0 2px 0 #666;
 +
}
 +
#igemuwmenu ul li.active {
 +
float: none;
 +
display: block;
 +
border: 0;
 +
_line-height: 0; /*IE6 only*/
 +
-moz-box-shadow: 0 1px 0 #111, 0 2px 0 #666;
 +
-webkit-box-shadow: 0 1px 0 #111, 0 2px 0 #666;
 +
box-shadow: 0 1px 0 #111, 0 2px 0 #666;
 +
}
-
<A HREF="http://2011.igem.org/Team:Washington"><img class="thumbnail"  src='http://2011.igem.org/wiki/images/c/c9/UW_mamK-banner.jpg' width= "965"/></A>
+
 +
#igemuwmenu ul li:last-child { 
 +
-moz-box-shadow: none;
 +
-webkit-box-shadow: none;
 +
box-shadow: none;   
 +
}
 +
 +
#igemuwmenu ul a {   
 +
padding: 10px;
 +
width: 130px;
 +
_height: 10px; /*IE6 only*/
 +
display: block;
 +
white-space: nowrap;
 +
float: none;
 +
text-transform: none;
 +
}
 +
     
 +
        #igemuwmenu ul a.selected {   
 +
padding: 10px;
 +
width: 130px;
 +
_height: 10px; /*IE6 only*/
 +
display: block;
 +
white-space: nowrap;
 +
float: none;
 +
text-transform: none;
 +
}
 +
 +
#igemuwmenu ul a:hover {
 +
background-color: #785D84;
 +
background-image: -moz-linear-gradient(#B6A0BA,  #785D84);
 +
background-image: -webkit-gradient(linear, left top, left bottom, from(#B6A0BA), to(#785D84));
 +
background-image: -webkit-linear-gradient(#B6A0BA, #785D84);
 +
background-image: -o-linear-gradient(#B6A0BA, #785D84);
 +
background-image: -ms-linear-gradient(#B6A0BA, #785D84);
 +
background-image: linear-gradient(#B6A0BA, #785D84);
 +
}
-
<a href="http://www.washington.edu/"><img src='http://2011.igem.org/wiki/images/1/10/UW_seal_desat.png' align="left" width= "57"/></a>
+
#igemuwmenu ul li:first-child > a {
 +
-moz-border-radius: 3px 3px 0 0;
 +
-webkit-border-radius: 3px 3px 0 0;
 +
border-radius: 3px 3px 0 0;
 +
}
 +
 +
#igemuwmenu ul li:first-child > a:after {
 +
content: '';
 +
position: absolute;
 +
left: 40px;
 +
top: -6px;
 +
border-left: 6px solid transparent;
 +
border-right: 6px solid transparent;
 +
border-bottom: 6px solid #444;
 +
}
 +
 +
#igemuwmenu ul ul li:first-child a:after {
 +
left: -6px;
 +
top: 50%;
 +
margin-top: -6px;
 +
border-left: 0;
 +
border-bottom: 6px solid transparent;
 +
border-top: 6px solid transparent;
 +
border-right: 6px solid #3b3b3b;
 +
}
 +
 +
#igemuwmenu ul li:first-child a:hover:after {
 +
border-bottom-color: #B6A0BA;
 +
}
 +
 +
#igemuwmenu ul ul li:first-child a:hover:after {
 +
border-right-color: #0299d3;
 +
border-bottom-color: transparent;
 +
}
 +
 +
#igemuwmenu ul li:last-child > a {
 +
-moz-border-radius: 0 0 3px 3px;
 +
-webkit-border-radius: 0 0 3px 3px;
 +
border-radius: 0 0 3px 3px;
 +
}
 +
 +
/* Mobile */
 +
#igemuwmenu-trigger {
 +
display: none;
 +
}
-
<a href="http://2011.igem.org/Main_Page"><img src='http://igem.org/wiki/images/c/c8/IGEM_desat.png' align="right" width= "70"/></a>
+
@media screen and (max-width: 600px) {
-
<style type="text/css">
+
/* nav-wrap */
-
#content {z-index:4;}
+
#igemuwmenu-wrap {
-
#ddwrapper * {z-index:8 !important;}
+
position: relative;
 +
}
-
div#ddwrapper {
+
#igemuwmenu-wrap * {
-
margin:0;
+
-moz-box-sizing: border-box;
-
padding:0;
+
-webkit-box-sizing: border-box;
-
height:28px;
+
box-sizing: border-box;
-
width:965px; /* change to adjust imperfections in width */
+
}
-
}
+
-
div#ddnav {
+
-
margin:0 auto; /* needed to center the dropdown */
+
-
padding:0;
+
-
top:5px;
+
-
/* width: 965px */
+
-
visibility:hidden; /* dropdown is hidden until properly initalised by javascript */
+
-
}
+
-
div#ddtoggle {
+
-
margin:0;
+
-
position:fixed;
+
-
right:2px;
+
-
top:15px;
+
-
height:10px;
+
-
width:10px;
+
-
z-index:100;
+
-
}
+
-
#ddnav ul {
+
/* menu icon */
-
display:table-row; /* works only for firefox, later adjusted by javascript for IE */
+
#igemuwmenu-trigger {
-
margin:0 auto;
+
display: block; /* show menu icon */
-
padding:0;
+
height: 40px;
-
}
+
line-height: 40px;
-
#ddnav ul li {
+
cursor: pointer;
-
display:table-cell; /* works only for firefox, later adjusted by javascript for IE */
+
padding: 0 0 0 35px;
-
list-style:none;
+
border: 1px solid #222;
-
margin:0;
+
color: #fafafa;
-
padding:0 !important;
+
font-weight: bold;
-
border-right:1px solid #FFF; /* creates illusion of spacing between tabs */
+
background-color: #111;
-
}
+
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAPCAMAAADeWG8gAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyBpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBXaW5kb3dzIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjE2QjAxNjRDOUNEOTExRTE4RTNFRkI1RDQ2MUYxOTQ3IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjE2QjAxNjREOUNEOTExRTE4RTNFRkI1RDQ2MUYxOTQ3Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MTZCMDE2NEE5Q0Q5MTFFMThFM0VGQjVENDYxRjE5NDciIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MTZCMDE2NEI5Q0Q5MTFFMThFM0VGQjVENDYxRjE5NDciLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz42AEtnAAAABlBMVEX///////9VfPVsAAAAAnRSTlP/AOW3MEoAAAAWSURBVHjaYmAgFzBiACKFho6NAAEGAD07AG1pn932AAAAAElFTkSuQmCC) no-repeat 10px center, -moz-linear-gradient(#444, #111);  
-
#ddnav ul li:last-child{border-right:none;}
+
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAPCAMAAADeWG8gAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyBpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBXaW5kb3dzIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjE2QjAxNjRDOUNEOTExRTE4RTNFRkI1RDQ2MUYxOTQ3IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjE2QjAxNjREOUNEOTExRTE4RTNFRkI1RDQ2MUYxOTQ3Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MTZCMDE2NEE5Q0Q5MTFFMThFM0VGQjVENDYxRjE5NDciIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MTZCMDE2NEI5Q0Q5MTFFMThFM0VGQjVENDYxRjE5NDciLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz42AEtnAAAABlBMVEX///////9VfPVsAAAAAnRSTlP/AOW3MEoAAAAWSURBVHjaYmAgFzBiACKFho6NAAEGAD07AG1pn932AAAAAElFTkSuQmCC) no-repeat 10px center, -webkit-linear-gradient(#444, #111);
-
#ddnav a{
+
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAPCAMAAADeWG8gAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyBpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBXaW5kb3dzIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjE2QjAxNjRDOUNEOTExRTE4RTNFRkI1RDQ2MUYxOTQ3IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjE2QjAxNjREOUNEOTExRTE4RTNFRkI1RDQ2MUYxOTQ3Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MTZCMDE2NEE5Q0Q5MTFFMThFM0VGQjVENDYxRjE5NDciIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MTZCMDE2NEI5Q0Q5MTFFMThFM0VGQjVENDYxRjE5NDciLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz42AEtnAAAABlBMVEX///////9VfPVsAAAAAnRSTlP/AOW3MEoAAAAWSURBVHjaYmAgFzBiACKFho6NAAEGAD07AG1pn932AAAAAElFTkSuQmCC) no-repeat 10px center, -o-linear-gradient(#444, #111);
-
display:block;
+
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAPCAMAAADeWG8gAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyBpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBXaW5kb3dzIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjE2QjAxNjRDOUNEOTExRTE4RTNFRkI1RDQ2MUYxOTQ3IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjE2QjAxNjREOUNEOTExRTE4RTNFRkI1RDQ2MUYxOTQ3Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MTZCMDE2NEE5Q0Q5MTFFMThFM0VGQjVENDYxRjE5NDciIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MTZCMDE2NEI5Q0Q5MTFFMThFM0VGQjVENDYxRjE5NDciLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz42AEtnAAAABlBMVEX///////9VfPVsAAAAAnRSTlP/AOW3MEoAAAAWSURBVHjaYmAgFzBiACKFho6NAAEGAD07AG1pn932AAAAAElFTkSuQmCC) no-repeat 10px center, -ms-linear-gradient(#444, #111);
-
margin:0;
+
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAPCAMAAADeWG8gAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyBpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBXaW5kb3dzIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjE2QjAxNjRDOUNEOTExRTE4RTNFRkI1RDQ2MUYxOTQ3IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjE2QjAxNjREOUNEOTExRTE4RTNFRkI1RDQ2MUYxOTQ3Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MTZCMDE2NEE5Q0Q5MTFFMThFM0VGQjVENDYxRjE5NDciIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MTZCMDE2NEI5Q0Q5MTFFMThFM0VGQjVENDYxRjE5NDciLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz42AEtnAAAABlBMVEX///////9VfPVsAAAAAnRSTlP/AOW3MEoAAAAWSURBVHjaYmAgFzBiACKFho6NAAEGAD07AG1pn932AAAAAElFTkSuQmCC) no-repeat 10px center, linear-gradient(#444, #111);
-
padding:4px 9px; /* play with dimensions for size of tabs */
+
-moz-border-radius: 6px;
-
background-color:#545353; /* background color for tabs */
+
-webkit-border-radius: 6px;
-
color:#FFF !important; /* font color for text in tabs */
+
border-radius: 6px;
-
text-align:center; /* aligning for text in tabs */
+
-moz-box-shadow: 0 1px 1px #777, 0 1px 0 #666 inset;
-
text-decoration:none !important;
+
-webkit-box-shadow: 0 1px 1px #777, 0 1px 0 #666 inset;
-
font:bold 10pt Trebuchet MS; /* font properties for text in tabs */
+
box-shadow: 0 1px 1px #777, 0 1px 0 #666 inset;
-
outline:0;
+
}
-
}
+
-
#ddnav ul li a:hover {background-color:#99CCFF;}/* background color for tabs on mouseover */
+
/* main nav */
-
#ddnav li a:active {outline:none;} /* remove standard dotted border for links when clicked (IE) */
+
#igemuwmenu {
-
#ddnav li a:focus {-moz-outline-style:none;} /* remove standard dotted border for links when clicked (FF) */
+
margin: 0; padding: 10px;
-
#ddnav div {
+
position: absolute;
-
display:none;
+
top: 40px;
-
position:absolute;
+
width: 100%;
-
width:9em;
+
z-index: 1;
-
background-color:#000; /* bug solution, do not change ! */
+
background-color: #444;
-
border:1px solid #5970B2; /* border color for dropdown menus */
+
display: none;
-
opacity:0.9; /* transparancy of the dropdown menus (FF) */
+
-moz-box-shadow: none;
-
filter:alpha(opacity=90); /* transparancy of the dropdown menus (IE) */
+
-webkit-box-shadow: none;
-
}
+
box-shadow: none;
-
#ddnav div a {
+
}
-
display:block;
+
-
padding:5px 10px; /* play with dimensions of block element in dropdown menus */
+
-
position:relative;
+
-
font:normal 8pt arial; /* font properties for text in dropdown menus */
+
-
text-align:left; /* aligning of text in dropdown menus */
+
-
cursor:pointer;
+
-
}
+
-
#ddnav div a:hover, #ddnav span a:hover {color:#000 !important;} /* text color on mouseover */
+
-
#ddnav span div {
+
-
position:relative;
+
-
border:none;
+
-
border-bottom:2px groove #5970B2; /* separator for submenus, groove does not work in FF */
+
-
opacity:1.0; /* avoid stacking transparancy for submenus (FF) */
+
-
filter:alpha(opacity=100); /* avoid stacking transparancy for submenus (IE) */
+
-
}
+
-
+
 +
#igemuwmenu:after {
 +
content: '';
 +
position: absolute;
 +
left: 25px;
 +
top: -8px;
 +
border-left: 8px solid transparent;
 +
border-right: 8px solid transparent;
 +
border-bottom: 8px solid #444;
 +
}
-
/* may want to upload the following pictures to a new location */
+
#igemuwmenu ul {
 +
position: static;
 +
visibility: visible;
 +
opacity: 1;
 +
margin: 0;
 +
background: none;
 +
-moz-box-shadow: none;
 +
-webkit-box-shadow: none;
 +
box-shadow: none;
 +
}
 +
 
 +
#igemuwmenu ul ul {
 +
margin: 0 0 0 20px !important;
 +
-moz-box-shadow: none;
 +
-webkit-box-shadow: none;
 +
box-shadow: none;
 +
}
 +
 
 +
#igemuwmenu li {
 +
position: static;
 +
display: block;
 +
float: none;
 +
border: 0;
 +
margin: 5px;
 +
-moz-box-shadow: none;
 +
-webkit-box-shadow: none;
 +
box-shadow: none;
 +
}
 +
 
 +
#igemuwmenu ul li{
 +
margin-left: 20px;
 +
-moz-box-shadow: none;
 +
-webkit-box-shadow: none;
 +
box-shadow: none;
 +
}
 +
 
 +
#igemuwmenu a{
 +
display: block;
 +
float: none;
 +
padding: 0;
 +
color: #999;
 +
}
 +
 
 +
#igemuwmenu a:hover{
 +
color: #fafafa;
 +
}
 +
 
 +
#igemuwmenu ul a{
 +
padding: 0;
 +
width: auto;
 +
}
 +
 
 +
#igemuwmenu ul a:hover{
 +
background: none;
 +
}
 +
 
 +
#igemuwmenu ul li:first-child a:after,
 +
#igemuwmenu ul ul li:first-child a:after {
 +
border: 0;
 +
}
 +
 
 +
}
 +
 
 +
@media screen and (min-width: 600px) {
 +
#igemuwmenu {
 +
display: block !important;
 +
}
 +
}
 +
 
 +
/* iPad */
 +
.no-transition {
 +
-webkit-transition: none;
 +
-moz-transition: none;
 +
-ms-transition: none;
 +
-o-transition: none;
 +
transition: none;
 +
opacity: 1;
 +
visibility: visible;
 +
display: none; 
 +
}
 +
 
 +
#igemuwmenu li:hover > .no-transition {
 +
display: block;
 +
}
 +
 
 +
</style>
 +
 
 +
<a href="http://2012.igem.org/Team:Washington"><img class="thumbnail"  src='http://2012.igem.org/wiki/images/6/6a/UW_2012_LogoJPG.jpg' width= "965"/></A>
 +
 
 +
<a href="http://www.washington.edu/"><img src='http://2012.igem.org/wiki/images/2/25/UW_W-Logo_smallRGB.jpg' align="left" width= "57" style="padding-top: 12px; padding-left: 5px;"/></a>
 +
 
 +
<a href="http://2012.igem.org/Main_Page"><img src='http://igem.org/wiki/images/c/c8/IGEM_desat.png' align="right" width= "70"/></a>
 +
 
 +
<style type="text/css">
 +
#content {z-index:4;}
.expand {background: url('http://2008.igem.org/wiki/images/e/ef/Icon-expand.png') no-repeat 95% 50%;}
.expand {background: url('http://2008.igem.org/wiki/images/e/ef/Icon-expand.png') no-repeat 95% 50%;}
.collapse {background: url('http://2008.igem.org/wiki/images/c/cd/Icon-collapse.png') no-repeat 95% 50%;}
.collapse {background: url('http://2008.igem.org/wiki/images/c/cd/Icon-collapse.png') no-repeat 95% 50%;}
-
 
.docked {background: #99ccff url("http://2008.igem.org/wiki/images/6/62/Ddnavundock.png") no-repeat 50% 50%;}
.docked {background: #99ccff url("http://2008.igem.org/wiki/images/6/62/Ddnavundock.png") no-repeat 50% 50%;}
.undocked {background: #99ccff url("http://2008.igem.org/wiki/images/e/e4/Ddnavdock.png") no-repeat 50% 50%;}
.undocked {background: #99ccff url("http://2008.igem.org/wiki/images/e/e4/Ddnavdock.png") no-repeat 50% 50%;}
</style>
</style>
-
<!-- IMPORTANT: save following script under a personalized webspace or download the library at www.jquery.com -->
+
<nav id="igemuwmenu-wrap">  
-
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script>
+
-
<script type="text/javascript">
+
-
function ddnav() {
+
-
$('#ddnav ul li').hover(
+
-
function () {
+
-
$(this).find('div:first').css('display','block');},
+
-
function () {
+
-
$(this).find('div:first').css('display','none');}
+
-
);
+
-
}
+
-
+
-
function ddnavsub() {
+
-
$('#ddnav span > a').toggle(
+
-
function () {
+
-
$(this).removeClass("#ddnav expand").addClass("#ddnav collapse");
+
-
$(this).parent().find('div:first').slideDown('fast');
+
-
$(this).hover(
+
-
function (){$(this).css('background-color','#99AAFF');},
+
-
function (){$(this).css('background-color','#99AAFF');});},
+
-
function () {
+
-
$(this).removeClass("#ddnav collapse").addClass("#ddnav expand");
+
-
$(this).parent().find('div:first').css('display','none');
+
-
$(this).hover(
+
-
function (){$(this).css('background-color','#99CCFF');},
+
-
function (){$(this).css('background-color','#075A90');});}
+
-
).addClass("#ddnav expand");
+
-
}
+
-
+
-
/* If you wish to omit the docking feature, remove following function ddtoggle() */
+
-
function ddtoggle() {
+
-
$('#ddtoggle').toggle(
+
-
function () {
+
-
$(this).removeClass('undocked').addClass('docked');
+
-
$('#ddnav').css('position','fixed');},
+
-
function () {
+
-
$(this).removeClass('docked').addClass('undocked');
+
-
$('#ddnav').css('position','static');}
+
-
);
+
-
}
+
-
function ddalign() {
+
<ul id="igemuwmenu">
-
var _windowWidth = $(window).width();
+
-
var _leftOffset = (_windowWidth - 965)/2;
+
-
$('div#ddnav').css('left',_leftOffset);
+
<li><a href="http://2012.igem.org/Team:Washington">Home</a>
-
}
+
<ul>
-
+
<li><a href="http://2012.igem.org/Team:Washington">UW 2012</a></li>
-
function ddmsie() {
+
<li><a href="http://2011.igem.org/Team:Washington">UW 2011</a></li>
-
$('#ddnav a').hover(
+
<li><a href="http://2010.igem.org/Team:Washington">UW 2010</a></li>
-
function () {$(this).css('background-color','#99ccff');},
+
<li><a href="http://2009.igem.org/Team:Washington">UW 2009</a></li>
-
function () {$(this).css('background-color','#075a90');}
+
<li><a href="http://2008.igem.org/Team:University_of_Washington">UW 2008</a></li>
-
);
+
<li><a href="http://2012.igem.org/Main_Page">iGEM Homepage</a></li>
-
+
</ul>
-
/* toggle doesn't work yet */
+
</li>
-
$('#ddtoggle').css('display','none');
+
 
-
+
<li>
-
$('#ddnav ul').css('display','inline-block');
+
<a href="http://2012.igem.org/Team:Washington/Plastics">Plastic Degradation</a>
-
$('#ddnav ul li').css('display','inline');
+
<ul>
-
$('#ddnav ul li').css('position','relative');
+
<li><a href="http://2012.igem.org/Team:Washington/Plastics#Background">Background</a></li>
-
$('#ddnav ul li>a').css('display','inline-block');
+
<li><a href="http://2012.igem.org/Team:Washington/Plastics#App">App</a></li>
-
$('#ddnav ul li>a').css('margin-right','-4px');
+
<li><a href="http://2012.igem.org/Team:Washington/Plastics#Methods">Methods</a></li>
-
+
<li><a href="http://2012.igem.org/Team:Washington/Plastics#Results">Results Summary</a></li>
-
$('#ddnav div').css('left','0');
+
<li><a href="http://2012.igem.org/Team:Washington/Plastics#Future">Future Directions</a></li>
-
$('#ddnav div').css('top','100%');
+
<li><a href ="http://students.washington.edu/cnt/pmwiki/pmwiki.php?n=Main.HomePage">Turbidostat Wiki</a></li>
-
$('#ddnav span div').css('top','0');
+
<li><a href="http://2012.igem.org/Team:Washington/Plastics#Parts">Parts Submitted</a></li>
-
}
+
</ul>
-
+
</li>
-
function ddmozilla() {
+
 
-
ddtoggle();
+
<li>
-
$(window).bind('resize', function() {ddalign();});
+
<a href="http://2012.igem.org/Team:Washington/Flu">Flu Binders</a>
-
}
+
<ul>
 +
<li><a href="http://2012.igem.org/Team:Washington/Flu#Background">Background</a></li>
 +
<li><a href="http://2012.igem.org/Team:Washington/Flu#App">App</a></li>
 +
<li><a href="http://2012.igem.org/Team:Washington/Flu#Methods">Methods</a></li>
 +
<li><a href="http://2012.igem.org/Team:Washington/Flu#Results">Results Summary</a></li>
 +
<li><a href="http://2012.igem.org/Team:Washington/Flu#Future">Future Directions</a></li>
 +
<li><a href="http://2012.igem.org/Team:Washington/Flu#Parts">Parts Submitted</a></li>
 +
</ul>
 +
</li>
 +
 
 +
<li>
 +
<a href="http://2012.igem.org/Team:Washington/Optogenetics">Optogenetics</a>
 +
<ul>
 +
<li><a href="http://2012.igem.org/Team:Washington/Optogenetics#Background">Background</a></li>
 +
<li><a href="http://2012.igem.org/Team:Washington/Optogenetics#App">App</a></li>
 +
<li><a href="http://2012.igem.org/Team:Washington/Optogenetics#Methods">Methods</a></li>
 +
<li><a href="http://2012.igem.org/Team:Washington/Optogenetics#Results">Results Summary</a></li>
 +
<li><a href="http://2012.igem.org/Team:Washington/Optogenetics#Future">Future Directions</a></li>
 +
<li><a href="http://2012.igem.org/Team:Washington/Optogenetics#Parts">Parts Submitted</a></li>
 +
</ul>
 +
</li>
 +
 
 +
<li><a href="http://2012.igem.org/Team:Washington/Outreach">Outreach</a></li>
 +
 
 +
<li>
 +
<a href="http://2012.igem.org/Team:Washington/Protocols">Protocols</a>
 +
<ul>
 +
<li><a href="http://2012.igem.org/Team:Washington/Protocols#General_Protocols">General</a></li>
 +
<li><a href="http://2012.igem.org/Team:Washington/Protocols#Plastic_Degradation">Plastic Degradation</a></li>
 +
<li><a href="http://2012.igem.org/Team:Washington/Protocols#Flu_Binders">Flu Binders</a></li>
 +
<li><a href="http://2012.igem.org/Team:Washington/Protocols#Optogenetics">Optogenetics</a></li>
 +
</ul>
 +
</li>
 +
 
 +
<li style="border-right:0; box-shadow:0px 0 0;">
 +
<a href="http://2012.igem.org/Team:Washington/Team:Members">About</a>
 +
<ul>
 +
<li><a href="http://2012.igem.org/Team:Washington/Team:Members">The Team</a></li>
 +
<li><a href="http://2012.igem.org/Team:Washington/Safety">Safety</a></li>
 +
<li><a href="http://partsregistry.org/cgi/partsdb/pgroup.cgi?pgroup=iGEM2012&group=Washington">Parts Registry</a></li>
 +
</ul>
 +
</li>
 +
 
 +
</li>
 +
                                                                                               
 +
</ul>
 +
</nav>
 +
 
 +
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
 +
<script type="text/javascript">
 +
    $(function() {
 +
if ($.browser.msie && $.browser.version.substr(0,1)<7)
 +
{
 +
$('li').has('ul').mouseover(function(){
 +
$(this).children('ul').css('visibility','visible');
 +
}).mouseout(function(){
 +
$(this).children('ul').css('visibility','hidden');
 +
})
 +
}
-
$(function () {
+
/* Mobile */
-
ddnav();
+
$('#igemuwmenu-wrap').prepend('<div id="igemuwmenu-trigger">igemuwmenu</div>');
-
ddnavsub();
+
$("#igemuwmenu-trigger").on("click", function(){
 +
$("#menu").slideToggle();
 +
});
-
if(jQuery.browser.msie) ddmsie();
+
// iPad
-
if(jQuery.browser.mozilla) ddmozilla();
+
var isiPad = navigator.userAgent.match(/iPad/i) != null;
 +
if (isiPad) $('#igemuwmenu ul').addClass('no-transition');    
 +
    });
 +
// selection
-
$('#ddnav').css('visibility','visible');
+
</script>
-
});
+
 
 +
<script type="text/javascript">
 +
        $("#content").find("a[href='"+location.href+"']").each(function(){
 +
        $(this).find("a").addClass("selected")
 +
        })
</script>
</script>
Line 315: Line 627:
</script>
</script>
-
 
-
<!-- If you wish to omit the docking feature omit following line (div with id ddtoggle) -->
 
-
<div id="ddtoggle" class="undocked"></div>
 
-
<div id="ddwrapper">
 
-
<!-- Here the actual links are defined, simply replace with your own links in the appropriate sections -->
 
-
<div id="ddnav" align="center">
 
-
<ul>
 
-
<li>
 
-
<a href="http://2011.igem.org/Team:Washington">Home</a>
 
-
                <div>
 
-
<a href="http://2011.igem.org/Main_Page"> iGEM Homepage </a>
 
-
<a href="http://2011.igem.org/Team:Washington">UW 2011</a>
 
-
<a href="http://2010.igem.org/Team:Washington"> UW 2010 </a>
 
-
<a href="http://2009.igem.org/Team:Washington"> UW 2009 </a>
 
-
<a href="http://2008.igem.org/Team:University_of_Washington"> UW 2008 </a>
 
-
<a href="http://synbio.washington.edu/"> UW SynBio </a>
 
-
</div>
 
-
 
-
</li>
 
-
<li>
 
-
<a href="http://2011.igem.org/Team:Washington/Team/Members">About Us</a>
 
-
<div>
 
-
<a href="http://2011.igem.org/Team:Washington/Team/Members">The team</a>
 
-
<a href="http://2011.igem.org/Team:Washington/Team/Sponsors"> Sponsors </a>
 
-
<a href="http://2011.igem.org/Team:Washington/Team/Americas"> Americas Regional Jamboree </a>
 
-
</div>
 
-
</li>
 
-
<li>
 
-
<a href="http://2011.igem.org/Team:Washington/Alkanes/Background">Diesel Production</a>
 
-
<div>
 
-
<a href="http://2011.igem.org/Team:Washington/Alkanes/Background">Background</a>
 
-
<a href="http://2011.igem.org/Team:Washington/Alkanes/Methods"> Methods </a>
 
-
                        <a href="http://2011.igem.org/Team:Washington/Alkanes/Results"> Results Summary </a>
 
-
                        <a href="http://2011.igem.org/Team:Washington/Alkanes/Future"> Future Directions </a>
 
-
                        <a href="http://2011.igem.org/Team:Washington/Alkanes/Parts"> Parts Submitted </a>
 
-
</div>
 
-
</li>
 
-
        <li>
 
-
<a href="http://2011.igem.org/Team:Washington/Celiacs/Background">Gluten Destruction</a>
 
-
<div>
 
-
<a href="http://2011.igem.org/Team:Washington/Celiacs/Background">Background</a>
 
-
<a href="http://2011.igem.org/Team:Washington/Celiacs/Methods"> Methods </a>
 
-
                        <a href="http://2011.igem.org/Team:Washington/Celiacs/Results"> Results Summary</a>
 
-
                        <a href="http://2011.igem.org/Team:Washington/Celiacs/Future"> Future Directions </a>
 
-
                        <a href="http://2011.igem.org/Team:Washington/Celiacs/Parts"> Parts Submitted </a>
 
-
</div>
 
-
</li>
 
-
        <li>
 
-
<a href="http://2011.igem.org/Team:Washington/Magnetosomes/Background">iGEM Toolkits</a>
 
-
<div>
 
-
<a href="http://2011.igem.org/Team:Washington/Magnetosomes/Background"> Background </a>
 
-
                        <a href="http://2011.igem.org/Team:Washington/Magnetosomes/GibsonVectors">Gibson Assembly Toolkit </a>
 
-
<a href="http://2011.igem.org/Team:Washington/Magnetosomes/GibsonResults">Gibson Toolkit Results</a>
 
-
                        <a href="http://2011.igem.org/Team:Washington/Magnetosomes/Magnet_Toolkit">Magnetosome Toolkit</a>
 
-
                        <a href="http://2011.igem.org/Team:Washington/Magnetosomes/Magnet_Results">Magnetosome Results</a>
 
-
                        <a href="http://2011.igem.org/Team:Washington/Magnetosomes/Parts"> Parts Submitted </a>
 
-
                        <a href="http://2011.igem.org/Team:Washington/Magnetosomes/Future"> Future Directions </a>
 
-
                       
 
-
</div>
 
-
</li>
 
-
        <li>
 
-
<a href="http://2011.igem.org/Team:Washington/Parts">Data Page</a>
 
-
                <div>
 
-
<a href="http://2011.igem.org/Team:Washington/Parts">Data Page</a>
 
-
<a href="http://partsregistry.org/cgi/partsdb/pgroup.cgi?pgroup=iGEM2011&group=Washington"> Parts Registry </a>
 
-
</div>
 
-
 
-
</li>
 
-
        <li>
 
-
<a href="http://2011.igem.org/Team:Washington/Protocols">Protocols</a>
 
-
</li>
 
-
        <li>
 
-
<a href="http://2011.igem.org/Team:Washington/Outreach">Outreach</a>
 
-
                <div>
 
-
<a href="http://2011.igem.org/Team:Washington/Outreach">Local Outreach</a>
 
-
 
-
<a href="http://2011.igem.org/Team:Washington/Outreach/iGEM_Collaborations">iGEM Collaborations</a></div>
 
-
 
-
</li>
 
-
        <li>
 
-
<a href="http://2011.igem.org/Team:Washington/Safety">Safety</a>
 
-
</li>
 
-
</ul>
 
-
</div>
 
-
</div>
 
</html>
</html>

Latest revision as of 17:40, 15 November 2012