Team:Wisconsin-Madison

From 2012.igem.org

(Difference between revisions)
Line 22: Line 22:
     <link rel="stylesheet" href="css/ie8.css" type="text/css" media="screen" />
     <link rel="stylesheet" href="css/ie8.css" type="text/css" media="screen" />
   <![endif]-->
   <![endif]-->
 +
 
 +
<style type="text/css">
 +
/*EM 'reset baseline' style rules*/
 +
html, body, div, span,
 +
applet, object, iframe,
 +
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
 +
a, abbr, acronym, address, big, cite, code,
 +
del, dfn, em, font, img, ins, kbd, q, s, samp,
 +
small, strike, strong, sub, sup, tt, var,
 +
dd, dl, dt, li, ol, ul,
 +
fieldset, form, label, legend,
 +
table, caption, tbody, tfoot, thead, tr, th, td {
 +
margin: 0;
 +
padding: 0;
 +
border: 0;
 +
font-weight: inherit;
 +
font-style: inherit;
 +
font-size: 100%;
 +
font-family: inherit;
 +
text-align: left;
 +
vertical-align: baseline;
 +
background: transparent;
 +
}
 +
 +
/*tables still need 'cellspacing="0"' in the markup*/
 +
table {
 +
border-collapse: collapse;
 +
border-spacing: 0;
 +
}
 +
 +
caption, th, td {
 +
text-align: left;
 +
font-weight: normal;
 +
}
 +
 +
q:before, q:after,
 +
blockquote:before, blockquote:after { content: ""; }
 +
blockquote, q { quotes: "" ""; }
 +
img { border: none; }
 +
 +
a {
 +
color: #B70101;
 +
text-decoration: none;
 +
}
 +
 +
a:hover { text-decoration: underline; }
 +
q:before, q:after,
 +
blockquote:before, blockquote:after { content: ""; }
 +
blockquote, q { quotes: "" ""; }
 +
img { border: none; }
 +
acronym, abbr.initialism, dfn { cursor: help; }
 +
abbr { speak: spell-out; }
 +
acronym, abbr.truncation, dfn { speak: normal; }
 +
cite { font-style: italic; }
 +
strong { font-weight: bold; }
 +
em { font-style: italic; }
 +
li > h3, li > p, li > a { font-size: 1em; }
 +
ol li {list-style: decimal;}
 +
ul li {list-style: disc;}
 +
.no_bullet {list-style: none;}
 +
 +
html {
 +
color: #000;
 +
background-color: #fff;
 +
background-image: url(../images/window-bg.jpg);
 +
background-repeat: repeat-x;
 +
}
 +
 +
body {
 +
margin: 40px auto 0;
 +
width: 960px;
 +
color: #333;
 +
background-color: transparent;
 +
font: normal 100%/1.5 "Lucida Grande", Verdana, sans-serif;
 +
}
 +
 +
#header {
 +
position: relative;
 +
width: 100%;
 +
height: 90px;
 +
color: #fff;
 +
background-color: #B70101;
 +
}
 +
 +
#uwhome {
 +
position: absolute;
 +
top: -26px;
 +
left: 75px;
 +
}
 +
 +
#crest {
 +
width: 70px;
 +
height: 104px;
 +
position: absolute;
 +
top: -22px;
 +
left: 5px;
 +
z-index: 100;
 +
}
 +
 +
 +
/* global nav menu*/
 +
#globalnav {
 +
position: absolute;
 +
top: -21px;
 +
right: 7px;
 +
font-size: 0.6875em;
 +
}
 +
 +
#globalnav li {
 +
display: inline-block;
 +
padding: 0px 10px 0 10px;
 +
border-left: 1px solid #c9ab80;
 +
line-height: 1;
 +
}
 +
 +
#globalnav #uwsearch {
 +
padding-left: 0;
 +
border-left: 0;
 +
}
 +
 +
#globalnav #last_tool { padding-right: 0; }
 +
 +
#globalnav a {
 +
color: #efe8d8;
 +
line-height: 1;
 +
margin: 0;
 +
padding: 0 0 1px 0;
 +
display: block;
 +
}
 +
 +
#siteTitle {
 +
position: absolute;
 +
top: 20px; /*CUSTOMIZATION: If not using a tagline; change top: to 26px; */
 +
left: 80px;
 +
width: 600px;
 +
}
 +
 +
h1 span {
 +
position: absolute;
 +
top: 0;
 +
left: 0;
 +
z-index: 5000;
 +
width: 336px; /*CUSTOMIZIZATION: Set width of your site-title.png image*/
 +
height: 36px;
 +
margin-top: 0px;
 +
text-indent: -999em;
 +
background-image: url(../images/site-title.png);
 +
/*NOTE: E-mail web@uc.wisc.edu to request the main site-title.png graphic for your department*/
 +
background-repeat: no-repeat;
 +
}
 +
 +
h1 a {
 +
display: block;
 +
width: 100%;
 +
height: 100%;
 +
margin-top: 0px;
 +
text-indent: -999em;
 +
}
 +
 +
#tagline {
 +
color:#F7F5E8;
 +
font-size:0.775em;
 +
font-weight:bold;
 +
padding-top: 30px;
 +
margin: 4px 0 0 2px;;
 +
}
 +
 +
#search {
 +
position: absolute;
 +
top: 14px;
 +
right: 5px;
 +
font-size: 0.6875em;
 +
color: #eee7d6;
 +
}
 +
 +
#search > div {
 +
display: inline;
 +
 +
}
 +
 +
#search > label {
 +
margin-right: 3px;
 +
}
 +
 +
#search > input {
 +
margin-right: 2px;
 +
}
 +
 +
 +
/*** navigation menus ***/
 +
.main-menu  {
 +
width: 100%;
 +
background: transparent url(../images/nav_bg.jpg) repeat-x;
 +
color: #333;
 +
position: relative;
 +
z-index: 50000;
 +
box-shadow: 0 3px 4px rgba(60, 60, 60, 0.3);
 +
-moz-box-shadow: 0 3px 4px rgba(60, 60, 60, 0.3);
 +
-webkit-box-shadow: 0 3px 4px rgba(60, 60, 60, 0.3);
 +
}
 +
 +
.main-menu > li {
 +
display: inline-block;
 +
vertical-align: top;
 +
font-size: 0.8125em;
 +
line-height: 25px;
 +
background: transparent url(../images/nav_button_border.gif) no-repeat right;
 +
height: 25px;
 +
/*min-width: 120px;*/
 +
position: relative;
 +
}
 +
 +
.main-menu > li a {padding-left: 0;}
 +
 +
.main-menu h2 {
 +
height: 100%;
 +
  width: 100%;
 +
}
 +
 +
.main-menu h2 > a {
 +
display: block;
 +
height: 100%;
 +
padding: 0 15px;
 +
text-align: center;
 +
color: #b70101;
 +
background-color: transparent;
 +
position: relative;
 +
line-height: 24px;
 +
text-transform: uppercase;
 +
}
 +
.main-menu .current h2 > a {color: #333;}
 +
 +
.main-menu h2 > a:hover {
 +
text-decoration: none;
 +
}
 +
 +
.main-menu > li:hover, .main-menu > a:focus, .main-menu > a:hover, .main-menu > a:active, .main-menu .current {
 +
background-color: #e7d9c1;
 +
text-decoration: none;
 +
}
 +
 +
.main-menu > #n_search:hover {
 +
background-color: transparent;
 +
}
 +
 +
.current a { color: #333; }
 +
 +
 +
/*** submenus ***/
 +
 +
.main-menu > li:hover > ul,
 +
.main-menu > .sfHover > ul {
 +
position: absolute;
 +
left: -1px;
 +
top: 25px; /* match top ul list item height */
 +
z-index: 99;
 +
}
 +
 +
.submenu {
 +
padding: 10px 0;
 +
background-color: #e7d9c1;
 +
opacity: .95;
 +
border-color: #AB907D;
 +
border-width: 1px;
 +
border-style: none none solid solid;
 +
box-shadow: 3px 3px 4px rgba(60, 60, 60, 0.4);
 +
-moz-box-shadow: 3px 3px 4px rgba(60, 60, 60, 0.4);
 +
-webkit-box-shadow: 3px 3px 4px rgba(60, 60, 60, 0.4);
 +
width: 200px;
 +
}
 +
 +
.submenu > li {
 +
margin-left: 7px;
 +
margin-right: 4px;
 +
margin-bottom: .75em;
 +
display: block;
 +
line-height: 1.2;
 +
background-color: transparent;
 +
}
 +
 +
.submenu > li > a:link {
 +
margin-left: 7px;
 +
margin-right: 4px;
 +
text-align: left;
 +
font-size: 1em;
 +
text-transform: none;
 +
}
 +
 +
.submenu > li > a:hover, .submenu > li > a:focus {
 +
color: #b70101;
 +
background-color: #d0bd9a;
 +
text-decoration: none;
 +
}
 +
 +
/*** additional superfish rules (adapted from superfish.css) ***/
 +
.main-menu, .main-menu * {
 +
margin: 0;
 +
padding: 0;
 +
list-style: none;
 +
}
 +
.main-menu {
 +
line-height: 1.0;
 +
}
 +
.main-menu .submenu {
 +
position: absolute;
 +
top: -999em;
 +
width: 20em; /* left offset of submenus need to match (see below) */
 +
}
 +
.main-menu .submenu li {
 +
max-width: 90%;
 +
}
 +
.main-menu li:hover {
 +
visibility: inherit; /* fixes IE7 'sticky bug' */
 +
}
 +
.main-menu li {
 +
position: relative;
 +
}
 +
.main-menu a {
 +
display: block;
 +
position: relative;
 +
}
 +
.main-menu li:hover .submenu,
 +
.main-menu li.sfHover .submenu {
 +
left: 0;
 +
top: 25px; /* match top ul list item height */
 +
padding-top: 10px;
 +
z-index: 99;
 +
}
 +
ul.main-menu li:hover li .submenu,
 +
ul.main-menu li.sfHover li .submenu {
 +
top: -999em;
 +
}
 +
ul.main-menu li li:hover .submenu,
 +
ul.main-menu li li.sfHover .submenu {
 +
left: 20em; /* match ul width */
 +
top: 0;
 +
}
 +
ul.main-menu li li:hover li .submenu,
 +
ul.main-menu li li.sfHover li .submenu {
 +
top: -999em;
 +
}
 +
ul.sf-menu li li li:hover ul,
 +
ul.sf-menu li li li.sfHover ul {
 +
left: 10em; /* match ul width */
 +
top: 0;
 +
}
 +
 +
 +
/*left sidebar menu*/
 +
 +
#secondary-nav {
 +
width: 100%;
 +
margin: 40px 0 50px 0;
 +
font-size: 0.875em;
 +
}
 +
 +
#secondary-nav li {
 +
margin-left: 0px;
 +
margin-right: 0px;
 +
list-style: none;
 +
margin-bottom: 15px;
 +
line-height: 1.2;
 +
text-transform: uppercase;
 +
}
 +
 +
#sidebar h2 {
 +
margin: 1em 0 .5em 0px;
 +
text-transform: uppercase;
 +
font-size: 0.8125em;
 +
color: #666;
 +
}
 +
 +
#quicklinks li {
 +
margin-left: 0px;
 +
margin-right: 0px;
 +
list-style: none;
 +
margin-bottom: 15px;
 +
line-height: 1.2;
 +
}
 +
 +
#quicklinks a {
 +
font-size: 0.875em;
 +
}
 +
 +
#sidebar .highlight {margin: 50px 0;}
 +
 +
#sidebar .highlight img {
 +
border:2px solid #FFFFFF;
 +
box-shadow:3px 3px 4px rgba(60, 60, 60, 0.4);
 +
-moz-box-shadow:3px 3px 4px rgba(60, 60, 60, 0.4);
 +
-webkit-box-shadow:3px 3px 4px rgba(60, 60, 60, 0.4);
 +
}
 +
 +
 +
/*
 +
******************************
 +
layout
 +
******************************
 +
*/
 +
 +
#shell {
 +
position: relative;
 +
width: 958px;
 +
border-width: 1px 1px 2px;
 +
border-color: #c3bca1 #c3bca1 #b70101;
 +
border-style: none solid solid;
 +
padding-bottom: 30px;
 +
}
 +
 +
.col {
 +
display: inline-block;
 +
vertical-align: top;
 +
}
 +
 +
#sidebar {
 +
width: 180px;
 +
background-color: #F7F5E8;
 +
padding: 0 15px 0 30px;
 +
}
 +
 +
#content {
 +
width: 673px;
 +
padding: 20px 30px 0 30px;
 +
  background-color: #fff;
 +
}
 +
 +
#sidebar:after {
 +
content: '';
 +
position: absolute;
 +
left: 733px;
 +
bottom: 0;
 +
height: 100%;
 +
width: 225px;
 +
background-color: #F7F5E8;
 +
z-index: -2;
 +
}
 +
 +
#content:after {
 +
content: '';
 +
position: absolute;
 +
left: 0;
 +
bottom: 0;
 +
height: 100%;
 +
width: 673px;
 +
background-color: #fff;
 +
z-index: -2;
 +
}
 +
 +
 +
/*Basic content styles*/
 +
 +
#content > h1, #content > h2, #content > h3, #content > h4 {
 +
margin: 1em 0 .25em;
 +
font-weight: bold;
 +
}
 +
 +
#content > h1 {
 +
font-size: 1em;
 +
}
 +
 +
#content > h2 {
 +
font-size: 0.875em;
 +
}
 +
 +
#content > h3 {
 +
font-size: 0.8125em;
 +
}
 +
 +
#content > p {
 +
margin: 1em 0;
 +
}
 +
 +
#content > h1 + p, #content > h2 + p, #content > h3 + p, #content > .left + p, #content > .right + p {
 +
margin-top: .25em;
 +
}
 +
 +
#content > p, #content ul > li, #content ol > li {
 +
font-size: 0.85em;
 +
}
 +
 +
#content > ul {
 +
margin: 1em 0 1em 1em;
 +
}
 +
 +
#content > ol {
 +
margin: 1em 0 1em 1.5em;
 +
}
 +
#content li { margin-bottom: 1em; }
 +
 +
 +
.right {
 +
float: right;
 +
margin: .5em 0 1.5em 2.5em;
 +
}
 +
 +
.left {
 +
float: left;
 +
margin: .5em 1.5em 2.5em 0;
 +
}
 +
 +
.photo { width: 204px; }
 +
.photo > img { border: 2px solid #DDDAC7; }
 +
 +
.photo > p {
 +
font-size: 0.7125em;
 +
color: #7f7c5e;
 +
line-height: 1.3;
 +
}
 +
 +
.credit {
 +
display: block;
 +
margin-top: 0.75em;
 +
font-size: .9em;
 +
text-transform: normal;
 +
}
 +
 +
 +
/* footer */
 +
#footer {
 +
padding-bottom: 40px;
 +
width: 100%;
 +
padding-top: 10px;
 +
background-color: transparent;
 +
font-size: 0.6875em;
 +
line-height: 1;
 +
color: #666;
 +
border-top: 10px #666152 solid;
 +
}
 +
 +
#footer p {
 +
text-align: center;
 +
margin-bottom: .5em;
 +
}
 +
 +
/*
 +
***************************************************
 +
skip navigation, etc.
 +
***************************************************
 +
*/
 +
 +
/*Skip links*/
 +
.skip a, .skip a:hover, .skip a:visited {
 +
position: absolute;
 +
left: 0px;
 +
top: -1000px;
 +
width: 1px;
 +
height: 1px;
 +
overflow: hidden;
 +
color: #fff;
 +
font-size: .725em;
 +
padding: 0 5px;
 +
}
 +
 +
.skip a:active, .skip a:focus {
 +
position: absolute;
 +
top: -35px;
 +
left: 5px;
 +
width: auto;
 +
height: auto;
 +
color: #fff;
 +
/*border: 2px solid #000;*/
 +
}
 +
 +
.hide {
 +
position: absolute;
 +
top: -100em;
 +
left: -5000em;
 +
height: 0;
 +
}
 +
 +
.hide a, .hide a:hover, .hide a:visited {
 +
position: absolute;
 +
top: 0;
 +
left: -5000em;
 +
}
 +
 +
.hide a:focus {
 +
position: static;
 +
width: auto;
 +
height: auto;
 +
}
 +
 +
a:hover, a:active { outline: none; }
 +
</style>
   </head>
   </head>

Revision as of 02:45, 28 August 2012

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> Your Department Name | University of Wisconsin–Madison

Main page header

Lorem ipsum dolor sit amet!

Arcu tellus wisi lacus laoreet, placerat pede sem laoreet commodi, mauris arcu tincidunt ultricies, justo euismod lacus ipsum lacinia. Enim ac lobortis dolor, faucibus nunc arcu sagittis tincidunt, dignissimos duis odio tortor ultricies. Et aliquet justo sed porttitor, nulla volutpat dui dignissim vestibulum, enim wisi erat turpis.

Samantha Baker (left) and Jose Zepeda (center) watch scientist Lia Kent (right) working as they participate in a summer science camp hosted at the WiCell Research Institute at University Research Park. Credit: University Communications

Tempus cras praesent blandit urna, accumsan nisl parturient varius dictum, amet mauris non lorem dignissim. Urna molestie ut aenean ipsum, sodales egestas porttitor urna posuere, ut et mauris praesent adipiscing, a consequat neque imperdiet augue. Quis proin sed magna dolor, lorem nulla proin platea, tempor et turpis duis vitae. Ac quisque convallis amet sit, pede risus vulputate nam lectus.

Section header

Malesuada dictum nostra ligula, lacus eget imperdiet pede, eu eleifend tempus amet, nonummy tincidunt lacinia vitae. Harum vel vitae egestas, dictum faucibus convallis lorem, mauris at felis eget, morbi maecenas in interdum accumsan. At nec pede id, aliquet ipsum velit repudiandae.

Diam blandit dui ultrices maecenas, vel nullam amet lorem, vulputate sem sodales egestas condimentum. Etiam ipsum vel nisl, sit interdum ullamcorper nulla, praesent condimentum enim vestibulum, ligula tempus luctus mollis. Nec ut id pellentesque, netus felis diam dui lectus. Lorem leo sed suspendisse dui, sapien perspiciatis aliquam arcu at, adipiscing pede porta quam pede. Molestie imperdiet sed ut, mauris vulputate molestie mauris arcu. Turpis tincidunt purus sit, ipsum auctor orci mi mauris:

  • Lorem ipsum dolor sit amet, sagittis arcu odio dolorem, praesent magna voluptate hendrerit, ullamcorper mollis non dolor.
  • Curabitur in egestas ullamcorper dignissim, lectus arcu suspendisse diam imperdiet, porttitor lacinia blandit habitant dolor.
  • Sagittis habitasse platea elit, imperdiet cum nonummy curabitur.
  • Porta varius consectetuer pellentesque, quam etiam dui praesent.

Lorem ipsum dolor sit amet!

Arcu tellus wisi lacus laoreet, placerat pede sem laoreet commodi, mauris arcu tincidunt ultricies, justo euismod lacus ipsum lacinia. Enim ac lobortis dolor, faucibus nunc arcu sagittis tincidunt, dignissimos duis odio tortor ultricies. Et aliquet justo sed porttitor, nulla volutpat dui dignissim vestibulum, enim wisi erat turpis.

  1. Lorem ipsum dolor sit amet, sagittis arcu odio dolorem, praesent magna voluptate hendrerit, ullamcorper mollis non dolor.
  2. Curabitur in egestas ullamcorper dignissim, lectus arcu suspendisse diam imperdiet, porttitor lacinia blandit habitant dolor.
  3. Sagittis habitasse platea elit, imperdiet cum nonummy curabitur.
  4. Porta varius consectetuer pellentesque, quam etiam dui praesent.

Tempus cras praesent blandit urna, accumsan nisl parturient varius dictum, amet mauris non lorem dignissim. Urna molestie ut aenean ipsum, sodales egestas porttitor urna posuere, ut et mauris praesent adipiscing, a consequat neque imperdiet augue. Quis proin sed magna dolor, lorem nulla proin platea, tempor et turpis duis vitae. Ac quisque convallis amet sit, pede risus vulputate nam lectus.

Section header

Malesuada dictum nostra ligula, lacus eget imperdiet pede, eu eleifend tempus amet, nonummy tincidunt lacinia vitae. Harum vel vitae egestas, dictum faucibus convallis lorem, mauris at felis eget, morbi maecenas in interdum accumsan. At nec pede id, aliquet ipsum velit repudiandae.

Diam blandit dui ultrices maecenas, vel nullam amet lorem, vulputate sem sodales egestas condimentum. Etiam ipsum vel nisl, sit interdum ullamcorper nulla, praesent condimentum enim vestibulum, ligula tempus luctus mollis. Nec ut id pellentesque, netus felis diam dui lectus. Lorem leo sed suspendisse dui, sapien perspiciatis aliquam arcu at, adipiscing pede porta quam pede. Molestie imperdiet sed ut, mauris vulputate molestie mauris arcu. Turpis tincidunt purus sit, ipsum auctor orci mi mauris:

  • Lorem ipsum dolor sit amet, sagittis arcu odio dolorem, praesent magna voluptate hendrerit, ullamcorper mollis non dolor.
  • Curabitur in egestas ullamcorper dignissim, lectus arcu suspendisse diam imperdiet, porttitor lacinia blandit habitant dolor.
  • Sagittis habitasse platea elit, imperdiet cum nonummy curabitur.
  • Porta varius consectetuer pellentesque, quam etiam dui praesent.

Retrieved from "http://2012.igem.org/Team:Wisconsin-Madison"