body { 	
padding: 0;
margin: 0;
font-family: verdana, arial, helvetica, geneva, sans-serif; 
font-size: 70%;
background-color: #e9e9e9;
text-align: center;
}

h1, h2, h3, h4 {
color: #004685;
}

h1 {
font-size: 1.5em;
margin: 0;
padding: 0;
}

h2 {
font-size: 1.25em;
padding: 0;
margin: 0;
}

h2.margin {
margin-top: 20px;
}

h3 {
font-size: 1.1em;
}

h4, h5 {
font-size: 1.0em;
}


/* Use for internal a id */

#mainContent h5, #mainContent h5 a, #mainContent h5 a:hover {
color: #333
}

ul, ol, dl { /* IE7 hack - left padding */
padding-left: 16px;
margin-left: 10px;
}

li, dt, dd {
margin: 2px 0;
padding: 1px 0;
}

ul ul, ol ol, dl dl, ol ul, ul ol {
margin-top: 12px;
margin-bottom: 12px;
margin-left: 4px;
padding-left: 10px;
}


a:hover {
color: #666;
}

/* LIST ITEMS - ADDITIONAL SPACING FOR LARGE BLOCKS OF TEXT */

ol.lr li {
list-style-type: lower-roman
}

.botspace li { /*adds spacing below each list item */
margin-bottom: 12px;
}

.bold li { /* bolds list item */
font-weight: bold;
} 

.bold li span {/* removes bolding from bold list items */
font-weight: normal;
}

/* LIST ITEMS - SQUARE BULLET */

ul.square {
list-style-type: square;
}

/* MAIN STRUCTURE */

#container {
width:950px;
padding: 0;
margin: 0 auto;
border: 1px solid #369;
border-top: 10px solid #369;
background-color: #fff; 
background-image: url("../images/bkgrd.gif"); 
background-repeat: repeat-y;
text-align: left;
min-height: 570px;
}

/* LEFT PANEL - IMAGES AND SMALL BOXES */

#leftpanel {
float:left;
padding-top:5px;
width:140px;
background-color:#fff;
text-align: center; 
}

#leftpanel a img {
border: none;
margin: 0 auto;
padding: 0;
}

#leftpanel p {
text-align: center;
font-size: .85em;
margin: 0 auto;
padding: 0 7px;
}

.maillist {
margin: 10px auto;
width: 90px;
padding-bottom: 11px;
text-align: left;
}

.maillist h3 { 
background-color: #369;
color: #fff;
font-weight: bold;
padding: 4px 0 4px 5px;
margin: 0;
font-size: .9em;
}

.maillist ul {
margin: 0;
border: 1px #69c;
border-style: solid;
padding-left: 0;
background: #ecf1f6;
-moz-border-radius: 10px 5px;
border-radius: 0 0 10px 10px;
}

.maillist li {
list-style-type: none;
padding: 3px 7px 10px;
margin: 0;
}

.maillist li a { 
color: #369;
font-size: .9em;
}





/*  END LEFT PANEL */

#main {
margin:0;
margin-left: 148px; 
background-color: #fff; 
}


#googleSearch form { 
display: none;
}

/* XXXXXXXXXX MASTHEAD AND TOP NAVIGATION XXXXXXXXXX */

#masthead {
height:40px;
background: #6a91b8 url(../images/tcag_top.gif) left top no-repeat;
}

#topnav {
height:38px;
margin:0;
padding: 8px 0 8px 12px;
background: #c6d6e6;
font-size: 1em;
}

#topnav ul {
float:left;
padding: 0;
margin: 0;
list-style: none;
}

#topnav li {
display: inline; 
color: #fff;
padding: 0;
margin:0;
}

#topnav li a {
text-decoration: none;
padding: 2px 9px 2px 3px;
margin: 0 4px 0 2px;
color: #1c5185;
display: block;
}

#topnav li a:hover { 
color: #036;
color: #668fb7;
text-decoration: underline;
}

/* adds selected highlight to top navigation */

body#home a#homepage,
body#projects a#projectsupport,
body#data a#databases,
body#staff a#stafflist, 
body#facilities a#facilitieslist,
body#acknowledge a#acknowledglist,    
body#pubs a#publications, 
body#news a#newsarticles,
body#careers a#careerinfo,
body#links a#linkslist,
body#contact a#contactform {
background: #e3ecf5;
}


#news #mainContent,
#pubs #mainContent { /* removes top padding */
padding: 0 15px;
}


/* XXXXXXXXXX BODY, RIGHT NAV HOME PAGE, etc. XXXXXXXXXX */ 

#mainContent { 
/*padding: 10px 15px 25px; */
color: #333;
/*min-height: 550px;
min-height: 490px;*/
margin: 0;
padding: 10px 15px 15px;
}

#mainContent p {
margin: 10px 0;
line-height: 1.5em;
}

#mainContent a {
color: #039;
}

#mainContent a:hover {
color: #666;
}

/* XXXXXXX RIGHT BOXES LARGE FOR MAIN LANDING PAGE - NEWS, EVENTS AND ANNOUNCEMENTS XXXXXXX */

#rightpanel {
float:right;
width:380px; 
margin-left:10px;
margin-right: 0;
padding-top: 10px;
}

.rightlist, .rightbottom {
float:right;
margin: 0 0 20px 0;
padding-bottom: 11px;
width: 380px;
background: #ecf1f6 url('../images/rightlist.gif') left bottom no-repeat;
font-weight: normal;
font-size: 1em;
}

.rightlist h3 {
background-color: #369;
color: #fff;
font-size: 1.1em;
font-weight: bold;
padding: 4px 5px 5px;
margin: 0;
}

.rightlist h3 span {
float:right;
font-weight: normal;
}

#rightpanel .rightlist span a, #rightpanel .rightlist span a:visited {
color: #fff;
}

.rightlist ul, .rightbottom ul {
margin: 0;
border: 1px #369;
border-style: none solid;
padding-left: 0;
}

.rightlist li {
list-style-type: none;
padding: 9px 10px;
margin: 0;
}

.rightbottom img {
display: block;
border: 1px #369;
border-style: solid solid none;
margin: 0;
}

.rightbottom h3 {
font-size: 1.1em;
font-weight: bold;
padding: 4px 5px 5px 8px;
border: 1px #369;
border-style: none solid;
margin: 0;
}

.rightbottom li {
list-style-type: none;
padding: 5px 10px;
margin: 0;
}

/* XXXXXXXXX right boxes for news events publications - 2nd level pages only XXXXXXXXX */

#rightpanel2 {
float:right;
width:250px; 
margin-left:15px;
margin-right: 0;
/*padding-top: 10px;*/
padding-top: 5px;
}

.rightlist2 {
float:right;
margin: 0 0 20px 0;
padding-bottom: 7px;
width: 250px;
background: #ecf1f6 url('../images/rightlist2.gif') left bottom no-repeat;
font-weight: normal;
font-size: 1em;
}

.rightlist2 h3 {
background-color: #369;
color: #fff;
font-size: 1.1em;
font-weight: bold;
padding: 4px 5px 5px;
margin: 0;
}

.rightlist2 h3 span {
float:right;
font-weight: normal;
}

#rightpanel2 .rightlist2 span a, #rightpanel2 .rightlist2 span a:visited {
color: #fff;
}

.rightlist2 ul {
margin: 0;
border: 1px #369;
border-style: none solid;
padding-left: 0;
}

.rightlist2 li {
list-style-type: none;
padding: 9px 10px;
margin: 0;
}

/* RIGHT PANEL - FACILITIES LIST  */

.rightlist2 dl {
margin: 0;
border: 1px #369;
border-style: none solid;
padding: 7px 0;
}

.rightlist2 dd a {
padding: 2px 10px 3px;
margin: 0;
}

#rightpanel2 dd a:hover, #rightpanel li a:hover{
color: #069;
}

/* ADDS SELECTED HIGHLIGHT */

body.biobanking #rightpanel2 dd a.biobanking,
body.cytogenomics #rightpanel2 dd a.cytogenomics,
body.sequencing #rightpanel2 dd a.sequencing,
body.genetic #rightpanel2 dd a.genetic,
body.informatics #rightpanel2 dd a.informatics,
body.microarray #rightpanel2 dd a.microarray,
body.statistical #rightpanel2 dd a.statistical {
display: block;
background: #d9e2ec;
}

/* SHORT RIGHT PANEL ENDS HERE */


div#slides {
display: none;
}

/* FACILITIES NAV - HOME PAGE */

div#bottompanel {
width: 352px;
/*margin-bottom: 7px;*/
}

#bottompanel h3 { /* IE7 hack -  added size to h3 */
background-color: #369;
color: #fff;
font-weight: bold;
padding: 3px 0 3px 5px;
margin: 0;
}

#bottompanel ul#bottomlist {
margin: 0;
padding-left: 0px;
padding-bottom: 8px;
background: #fff url("../images/bottomlist.gif") left bottom no-repeat;
list-style-type: none;
}

#bottomlist li {
margin: 0;
padding: 0;
}

#bottomlist li a {
display: block;
list-style-type: none;
background-color: #ecf1f6;
border-width: 1px;
border-style: none solid solid;
border-color: transparent #369 #adc1d5;
font-weight: bold;
padding: 5px 10px;
text-decoration: none;
line-height: normal;
}

#bottomlist li.last a {
border-bottom: none;
}

#bottomlist li a:hover { 
color: #369;  
background-color: #fff; 
}

.logos { /* IE7 hack - margin */
height:70px;
text-align:center;
background:#fff; 
margin: 0;
border-top: 1px solid #039;
}

.logos a img {
margin: 0 5px;
border: none;
}

#footer {
padding: 5px 0 10px 5px;
font-size: 9px;
color: #666;
clear: both;
}

#footer a {	color: #666; }
#footer a:hover { color: #369; }

/* LISTS OF NEWS ITEMS AND PUBLICATIONS */

ul.items {
margin: 14px 0 0;
padding: 0;
list-style-type: none;
}

.items li {
margin-bottom: 14px;
}

/* PDF icon */

a.pdf {
background:transparent url(../images/pdf.gif) top right no-repeat;
padding-right:20px;
}

li a.pdf { /* IE7 hack for bkgr image slipping out of alignment on wrapped lines - not supported on IE7 */
line-height: 1.5em;
}

/* FOR LINKS TO EXTERNAL SITES */

li a.outside, a.outside, dl.outside dd a, dd.outside a {
background:transparent url(../images/outside.gif) center right no-repeat;
padding-right:13px;
}

/* TABLES */

table.prices {
border-spacing: 0;
border: 1px solid #69c;
margin: 7px 0;
border-collapse: collapse;
}

.prices td {
padding: 3px 7px;
border: 1px solid #369;
}

.prices th {
padding: 4px 7px;
text-align: center;
border: 1px solid #369;
/*vertical-align: bottom;*/
background: #69c;
color: #fff;
font-size: .9em;
}

.prices th.header2 {
background: #eef4fb;
color: #369;
font-size: 1em;
font-weight: normal;
}

.prices tr:hover {
background: #f7f9fb;
color: #036;
}

.prices dl {
margin: 0;
padding: 0;
}

table.simple {
border-collapse: collapse;
border: 1px #369;
border-style: solid solid none;
margin: 10px 20px 20px 0;
}

.simple th, table.simple td {
vertical-align: top;
padding: 12px 7px;
border-bottom: 1px solid #369;
}

.simple th {
text-align: left;
color: #036;
}

.simple ul {
margin: 7px 14px;
padding: 0;
}

.simple li {
margin: 0;
padding-left: 4px;
}

.borderlist {
border: 1px solid #069;
width: 50%;
margin: 10px 0;
padding: 0;
}

.borderlist dl {
margin: 0;
padding: 0;
}

.borderlist dt {
background: #69c;
color: #fff;
font-size: .9em;
font-weight: bold;
margin: 0;
padding: 5px 10px;
}

.borderlist dd, .borderlist ul  {
margin: 0;
padding: 0;
}

.borderlist li {
list-style-type: none;
margin: 0;
}

.borderlist li.header {
padding: 5px 10px;
display: block;
}

.borderlist li a {
padding: 5px 10px;
display: block;
}

.borderlist a:hover {
background: #ecf3fb;
color: #036;
}

/* UTILITY */

ul.botMargin, ol.botMargin {
margin: 0 18px;
padding: 0;
}

.botMargin li {
margin: 0;
padding:10px 0;
}

.floatright {float:right;}
.floatleft {float: left;}

.imgleft {
float: left;
margin: 7px 7px 7px 0;
}

.margin20, table.margin20 {
margin: 20px 0;
}

margin10, table.margin10 {
margin: 10px 0;}

.marginbottom20 {margin-bottom: 20px;}

.blackborder {border: 1px solid #000;}

.clearleft {clear:left}
.clearright {clear:right}
.clearboth {clear:both}

.right, td.right {
text-align: right;
}

.cent, td.cent {
text-align: center;
}

.left, td.left, th.left, table.left th {
text-align: left;
}

.top, .top td {
vertical-align: top;
}

.bottom, table.bottom, td.bottom, th.bottom, .bottom td, .bottom th {
vertical-align: bottom;
}

.sm {
font-size: 90%;
}

.red {
color: red
}

.background {
margin: 12px 10px 12px 0;
padding: 7px 12px;
background: #eee;
}



/* SPECIAL */

/* GRANTS SUPPORT page - show - hide */

.hidden { display: none;}
.unhidden { display: block;}
a.showright {float: right; margin-right: 50px;}

/* SUBNAV AT TOP FOR ARCHIVE PAGES */

div#archiveContainer {
margin: 0;
padding: 10px 0;
padding: 7px 0 9px;
border: 1px solid #b0bfce;
border-style: solid none none;
background: url('../images/topnav2.png') 0 100% repeat-x; /* image adds top padding */
}

#archiveContainer dl {
margin: 0;
padding: 0;
}

#archiveContainer dt {
display: inline;
font-weight: bold;
margin: 0 12px 0 14px;
color: #369;
}

#archiveContainer dd {
padding: 0 5px;
display: inline;
}

#archiveContainer dd a {
color: #369;
text-decoration: none;
}

#archiveContainer dd a:hover {
text-decoration: underline;
}

/* ARCHIVES - POINTER ON SELECTED */

body.archive #archiveContainer dd a#archiveyear,
body.one #archiveContainer dd a#year01,
body.two #archiveContainer dd a#year02,
body.three #archiveContainer dd a#year03,
body.four #archiveContainer dd a#year04,
body.five #archiveContainer dd a#year05,
body.six #archiveContainer dd a#year06,
body.seven #archiveContainer dd a#year07,
body.eight #archiveContainer dd a#year08,
body.nine #archiveContainer dd a#year09,
body.ten #archiveContainer dd a#year10,
body.eleven #archiveContainer dd a#year11,
body.twelve #archiveContainer dd a#year12 {
display: inline-block;
background: url('../images/year_pointer.png') 9px 20px no-repeat;
height: 29px;
}

/* SUBNAV AT TOP FOR FACILITIES PAGES - GREY BOX */

div.innernav {	
background-color: #f3f3f3;
padding:10px 0 10px 24px;
margin: 20px 275px 20px 0;
border:1px solid #ddd;
border-right:0;
border-left:0;
}

div.innernav .left {
width: 200px;
float: left;
margin-right: 20px;
}

div.innernav .right {
margin-left: 220px;
text-align: left;
}

.innernav h3 {
color: #000;
}

.innernav ol {
margin-left: 3px;
}

.innernav li {
padding:2px 1px;
margin:0;
} 

/* MAIL LIST FORM */

#formmail {
margin-top: 16px;
background: #f0f5fa;
width: 450px;
border: 2px #69c;
border-style: dotted none;
padding: 4px 14px;
}

#formmail label {
float: left;
text-align: right;
color: #369;
font-weight: bold;
width: 100px;
margin-right: 7px;
margin-top: 2px;
padding: 2px 4px 2px 2px;
background: #fff;
border: 1px solid #fff;
}

#formmail input {
margin-bottom: 7px;
margin-top: 2px;
border: none;
height: 13px;
border: 1px solid #fff;
}

#formmail input:focus {
border: 1px dotted #369;                                
}

#formmail .button {
margin-left: 112px;
margin-top: 12px;
}

#formmail .button input {
height: 24px;
width: 75px;
margin-right: 12px;
border: none;
color: #666;
font-weight: bold;
background:transparent url(../images/buttonbkgr.png) repeat-x;
}

#formmail .button input:focus, #formmail .button input:active { /* active state needed for Mac browsers */
height: 24px;
width: 75px;
margin-right: 12px;
border: none;
background:transparent url(../images/buttonbkgr-over.png) repeat-x;
}

/* CONTACT (STAFF) PAGES */

.contactBox {
width: 350px;
max-width: 350px;
padding: 5px 12px;
background: #edf4fb;
border: 1px solid #69c;
margin: 20px 10px 20px 14px;
}
.contactBox h4 { margin: 4px 0; padding: 0;}
#mainContent .contactBox p { font-size: 1em; line-height: 1.3em;}

.contactBox span {
padding-right: 16px;
} 


