/*BEGIN UNIVERSAL STYLES.  These styles in this section control the layout and look of the entire website. 
 These styles should NOT be modified or page layout may not work. */

	/* ENTIRE PAGE LAYOUT  - These styles control the body, default link styles and container.  */
body {
	margin-left: 0px;
	margin-top: 0px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	background-color: #FFFFFF;
	width: 100%;	
	}
	
/* Default link settings, used everywhere but topnav */
	a:link {color: #0000FF;}						
	a:visited {color: #990000;}
	a:hover {color: #FF0000;}
	a:active {color: #FF33CC;}


/* wrapper for entire page. constrains width to 780px; also has single grey line of 297 px repeated on left
 to ensure grey area on sidebar-a extends all the way from top to bottom */
		#container {
	width: 780px;
	margin: 0;
	padding: 0px;
	background-image: url(images/backgroundgrey.gif);
	background-repeat: repeat-y;
	background-position: left;
	float: left;
			}

/* BANNER AND NAV STYLES.  Controls the entire banner area including navigator and dropdown menus. */
		#banner {
			padding: 0;
			margin-bottom: 0;
			}

		#topnav {
			background-color: #000000;
			width: 780px;
			height: 20px;
			margin: 0px;
			padding: 0px;
			border-top: 2px solid #FFFFFF;
			border-bottom: 2px solid #FFFFFF;
		}
		
		/*  the Tan Box Hack to fix borders for ie 5.x */
		* html div#topnav {
		height: 22px;
		he\ight: 20px;		
		}

			/* 	topnav menu buttons absolutely positioned layers */
			#trigger1, #trigger2, #trigger3, #trigger4, #trigger5, #trigger6, #trigger7 {
				position: absolute;
				top: 61px;
				background-color: #000000;
				border: none;
			}


				/* 	left positioning and width of individual buttons */
				#trigger1 {left: 1px; width: 82px;}
				#trigger2 {left: 84px; width: 160px;}
				#trigger3 {left: 245px; width: 92px;}
				#trigger4 {left: 338px; width: 161px;}
				#trigger5 {left: 500px; width: 128px;}
				#trigger6 {left: 629px; width: 134px;}
				

				
			/* make sure all default p padding set to 0 */
					.trigger p {
						margin: 0px;
						padding: 0px;				
					}


					/*  text styling of links in topnav, with right border dividers */ 
					.trigger a, .trigger a:visited {
						font-size: 10px;
						color: #CCCCCC;
						text-align: center;
						height: 16px;
						display: block;
						background-color: #000000;
						padding-top: 2px;
						border-right-width: 1px;
						border-right-style: solid;
						border-right-color: #FFFFFF;
						text-decoration: none;	
					}
					

					/* 	buttons change color when moused over */
					.trigger a:hover  {
						background-color: #FFFF99;
						color: #000000;
					}

						/* 	buttons change color when clicked or tabbed thru */	
					.trigger a:active, .trigger a:focus {
						background-color: #CC9900;
						color: #000000;
					}	
					
					/* rightmost button should have no right border */
					
					.trigger a.lastlink, .trigger a.lastlink:visited {
						border: none;
					}	
							
					/* 	The Submenu dropdown Layers invisible until topnav moused over, width set to 200 */
						#sub1, #sub2, #sub3, #sub4, #sub5, #sub6, #sub7 {
							position: absolute;
							width: 200px;
							top: 83px;
							font-size: 10px;
							visibility: hidden;
							background-color: #FFFFFF;
						}
						
						
					/*  the Tan Box Hack to fix sub menu vertical position for ie 5.x */
						* html #sub1, #sub2, #sub3, #sub4, #sub5, #sub6, #sub7 {
							top: 81px;
							to\p: 83px;		
						}
						
						
						
							/* 	absolutely positioned to line up with topnav buttons, same values as triggers above */
							#sub1 {left: 1px;}
							#sub2 {left: 84px;}
							#sub3 {left: 245px;}
							#sub4 {left: 338px;}
							#sub5 {left: 500px;}
							#sub6 {left: 629px;}
							

							/* 	The submenu links are in paragraphs, so set the margin to zero
								so no gap between links */
							.submenus p {
								margin: 0;
								padding: 0;
							}


					/* 	Submenu Link Styles
					
						Set display to block so entire link box, including padding is clickable.
						Set border to 1px solid and no underlining.
						
						Set border colors in shorthand to Light Gray on top and left,  and
						Charcoal Gray on right and bottom. This combination of colors creates
						a raised button-type effect. */
						
					.submenus a, .submenus a:visited {
						display: block;
						padding: 1px 1px 1px 1px;
						border: 1px solid;
						border-color: #999 #333 #333 #999;
						background-color: #FFFF99;
						color: #333333;
						text-decoration: none;
}

						/* 	change color when moused over */
						.submenus a:hover {
							background-color: #333333;
							color: #ccc;
						}

						/* 	change color when click on or tabbed thru */
						.submenus a:active, .submenus a:focus {
							background-color: #CC9900;
							color: #000000;
						}
		
		
		/* 	area below topnav - background set to match up with grey left column */
		#subbanner {
	padding: 0;
	background-image: url(images/backgroundgrey.gif);
	background-repeat: repeat-y;
	background-position: left top;
	margin: 0;
		}
		
		
					
				/* controls right side page indicator image, e.g. about us */
					/* controls right side page indicator image, e.g. about us */
					#indicator {
						background-color: #FFFF00;
						padding: 0;
						margin: 0;
						display: inline;
						float: right;
						width: 483px;
						height: 57px;						
					}
		
					/* controls left side of subbanner, puts background image below three photos */
					#leftphotos {
						padding: 0px 0px 0px 1px;
						background-image: url(images/home_leftcol_tvlines.gif);
						background-repeat: no-repeat;
						background-position: left top;
					}
					
					/* controls position and padding of three photos */
					#leftphotos img {
						margin-left: 4px;
						border: 2px solid #000000;
						margin-top: 5px;
					}
		
		
				/* searchbar floats inside subbanner to right */
				#searchbar {
					color: #FFFFFF;
					margin: 0px;
					padding: 0px;
					float: right;
					clear: both;
					width: 180px;
				}
		
				/* actual form */
					#searchform {
						font-family: Verdana, Arial, Helvetica, sans-serif;
						font-size: 10px;
						color: #FFFFFF;
						text-align: right;
						background-color: #000000;
						margin: 0px;
						padding: 3px;
					}
					
						/* button styling */
						#searchform .button{
							width: 30px;
							background-color: #FFFF99;
							font-family: Verdana, Arial, Helvetica, sans-serif;
							font-size: 10px;
							color: #000000;
							font-weight: bold;
							text-align: center;
							border: 1px solid #CCCCCC outset;
							vertical-align: middle;
							margin-bottom: 3px;
							margin-top: 0px;
							margin-right: 0px;
							margin-left: 0px;
							}
	

											
						/* styling of input field */
						#searchform .inputfield{
							color: #000000;
							width: 80px;
							padding: 0px;
							font-family: Verdana, Arial, Helvetica, sans-serif;
							font-size: 10px;
							margin-right: 2px;
							margin-left: 4px;
						}
		
/* RIGHT COLUMN AREA. actual CONTENT in its own div */
		#rightcolumn {
	padding: 40px 0 0;
	float: left;
	width: 483px;
	clear: none;
		}
		
		/* right column area CONTENT.  */
		#content {
	float: left;
	width: 478px;
	margin: 0px;
	padding: 0px;
	clear: none;
		}
		
		/* this link absolutely positioned to appear top left of content area next to search bar */
				#homelink {
					position: absolute;
					left: 315px;
					top: 145px;
				}
		
					#homelink p {
						margin: 0px;
						padding: 0px;
						font-size: 12px;
					}
		
		
		/* HORIZONTAL MENU LIST at bottom of content area */
				
				#rightcolumnmenu {
	padding: 0px;
	width: 770px;
	margin: 0px;
	float: right;
	clear: none;

				}
				
				/* This menu is actually an inline, unordered list */
				#rightcolumnmenu ul {
	width: 483px;
	margin: 0px 0px 7px;
	padding: 30px 0px 0px;
	text-align: right;
	float: right;

						}
				
				
						/* makes list display horizontally */
						#rightcolumnmenu ul li{
	display: inline;
	white-space: nowrap;
	margin: 0px;
	padding-right: 0px;
	list-style-type: none;
	padding-left: 10px;
						}
				
							/* sets padding between links */
							#rightcolumnmenu ul li a{
	font-size: 12px;
	margin: 0px;
							}
				
	
						
/* LEFT COLUMN AREA6 */

 /*margins set with padding fix for IE*/
 
		#sidebar-a {
	width: 297px;
	\width: 297px;
	w\idth: 297px;
	margin: 0;
	padding: 0;
	background-color: #CACACA;
	clear: none;
	float: left;
		}
		
		
		
		/* sets address area in its own section with styling */
		#sidebar-a .address {
			font-size: 10px;
			text-align: center;
			color: #000099;
			font-family: Verdana, Arial, Helvetica, sans-serif;
			line-height: 130%;
			margin: 5px 0px 25px;
			padding: 0px;
		}
						
		/* FOOTER area */
	
		#footer{
	height: auto;
	background-color: #000000;
	color: #CCCCCC;
	width: 780px;
	clear: both;
	float: left;

		}
		
		
		/* text inside footer. padding set on top and bottom */
		#footer .fineprint {
	padding: 7px 5px;
		}
		
			/* text inside footer should be right aligned */
			#footer .fineprint p{
			color: #666666;
			font-size: 10px;
			text-align: right;
			line-height: 130%;
			margin: 0px;
			padding: 0px;
				}
		
		
/*END UNIVERSAL STYLES, BEGIN CONTENT STYLES.  The styles below control the look of the content or specific objects such
as tables or forms.  Most can be modified or added to without disrupting the layout of the site. 
 New styles should be added in this area. Remember though that some styles are used throughout the site
  so changes may affect many or all pages. */
					
		/* CONTENT AREA STYLES. Used on right side of webpage inside content box */
		
		
		/* main header for content box */
		#content h1 {
					font-size: 16px;
					text-align: center;
					color: #330000;
					font-family: Verdana, Arial, Helvetica, sans-serif;
					line-height: 140%;
					font-weight: bold;
				}
		
		/* subheader for content box */
		#content h2 {
			font-size: 12px;
			text-align: center;
			color: #000099;
			font-family: Verdana, Arial, Helvetica, sans-serif;
			line-height: 140%;
			font-weight: bold;
			margin-bottom: 5px;
						}
					#content h3 {
			font-size: 12px;
			text-align: left;
			color: #000099;
			font-family: Verdana, Arial, Helvetica, sans-serif;
			line-height: 140%;
			font-weight: bold;
			margin-bottom: 5px;
						}
			
			/* default p style for content box */
			#content p  {
			font-size: 12px;
			color: #333333;
			line-height: 140%;
			display: block;
			padding-left: 20px;
					}
						
				/* use to center text */
				#content p.centered  {
			text-align: center;	
					}
		
		
		/* special large reddish paragraph styling for main index page */
				#content p.bigredtype {
					font-size: 16px;
					text-align: left;
					color: #330000;
					font-family: Verdana, Arial, Helvetica, sans-serif;
					line-height: 140%;
					font-weight: bold;
				}
		
		
		/* use to style bios, as in on ABOUT section.  Set to negative indent  */
		#content p.bio  {
	font-size: 11px;
	text-indent: -10px;
			}
		
		/* set author name in bold blue */
		.author  {
	font-weight: bold;
	color: #000099;
		}
		
		/* used for citations, negative indent, smaller font */
		#content p.citation  {
	text-indent: -15px;
	font-size: 11px;
	margin-bottom: 5px;
	margin-top: 5px;
	padding-left: 30px;
	color: #000000;
				}
			
			/* used in some areas when a description follows a citation. Sets off with blockquote-type margins, text in blue */
		#content p.citationdesc  {
	font-size: 12px;
	margin: 10px 25px 25px;
	color: #003399;
			}
			
			/* used for back-to-top jump links */
			#content .top{
	font-size: 10px;
	text-align: right;
	padding: 0px;
	margin: 0px;
			}
			
			/* biotable styles used for bio page in about us */
			#content table.biotable{
	margin-bottom: 25px;
	margin-left: 3px;
			}
			
			
							#content table.biotable td{
					padding-top: 8px;
					padding-bottom: 8px;
					padding-left: 3px;
					padding-right: 3px;
					vertical-align: top;
					
							}
		
							#content table.biotable  a{
						font-size: 11px;
						text-align: left;	
						
								}
			
			#content p.study_authors  {
	text-align: left;
	font-size: 12px;
	text-indent: -15px;
	margin-right: 15px;
	margin-left: 10px;
	margin-bottom: 0px;
	margin-top: 5px;
			}
		
				
		#content p.indent  {
	text-indent: -15px;
	font-size: 12px;
	margin-bottom: 5px;
	margin-top: 5px;
	padding-left: 30px;
	color: #000000;
				}
		
		/* default settings for ordered (numbered) list in content area */
		#content ol li{
	font-size: 12px;
	line-height: 140%;
	margin-right: 15px;
	margin-left: 15px;
	margin-bottom: 5px;
	text-align: left;
	list-style-type: decimal;
	color: #333333;
	
			}
		
		/* default settings for unordered list in content area */
		#content ul li{
	font-size: 12px;
	line-height: 140%;
	margin-right: 15px;
	margin-left: 15px;
	margin-bottom: 5px;
	text-align: left;
	list-style-position: outside;
	list-style-type: disc;
	color: #333333;
	}
	/* projectslist is used for list on projects page for bulletted, bold list widely spaced vertically */
	#content ul.projectslist li{
	list-style-type: disc;
	font-weight: bold;
	margin-top: 20px;
	}
	
	
	
	/* projectssublist is used on projects page for sublist, e.g. current, completed, to display inline horizontally without bolding */
	#content ul.projectssublist li {
	list-style-type: none;
	display: inline;
	padding-top: 0px;
	padding-right: 10px;
	padding-left: 20px;
	}	
	
	#content ul.projectssublist li a{
	font-weight: normal;
	
	}	
		
		/* controls lists of weblinks, e.g. resource page, on content sections only; set to indent second line if it wraps*/
		#content ul.linklist li {
	list-style-type: none;
	text-indent: -10px;
	padding-top: 0px;
	padding-bottom: 0px;
	padding-right: 10px;
	padding-left: 0px;
		}
		
		
		/* special formatting for the sitemap list using nested ul lists for each level*/
		
		/* this defines level 1 ul of list - remember these styles are inherited by each level default unless otherwise specified*/
		ul#sitemap.linklist li {
	list-style-type: disc;
	font-weight: bold;
	margin: 0px 0px 5px;
	padding-left: 5px;
	list-style-position: outside;
		}
		
		/* pads the bottom of each nested list more than top to visually separate it*/
		ul#sitemap.linklist ul {
	padding-top: 3px;
	padding-bottom: 8px;
		}
		
		/* this defines level 2 */
		ul#sitemap.linklist ul li{
	font-weight: normal;
	list-style-type: circle;
	list-style-position: outside;
		}
		
		
/* this defines level 3; if even deeper levels are required to be styled follow same pattern to select li inside ul inside ul etc.*/
		ul#sitemap.linklist ul ul li{
	font-weight: normal;
	list-style-type: square;
		}
		
		
		
		/* style for entries on glossary page, defining paragraph style with negative indent
		 and term class to define span markup wrapped around term */
		#content p.glossary {
	margin-left: 15px;
	text-indent: -10px;
	text-align: left;
		}
		
		
		/* used to style terms in definitions, as in on the GLOSSARY page */
		#content .term  {
	color: #0000FF;
	font-weight: bold;
		}
		
		
				
				/* contact form on CONTACT US page */
					form#contact {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #666666;
	padding: 3px;
	width: 300px;
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: 80px;
	text-align: right;

					}
					
					/*controls top area of this form */
								#contact .headerarea {
				text-align: right;
								}
								
					
					
					/*controls message area of this form */
						
					#contact .messagearea {
	text-align: right;
	padding-top: 10px;
					
					
					}
					#contact .messagearea textarea {
	width: 270px;
	height: 270px;
	margin-top: 5px;
	margin-bottom: 5px;
						}
					
						/* button styling, currently similar to other buttons used in the site*/
						#contact .button{
							background-color: #FFFF99;
							font-family: Verdana, Arial, Helvetica, sans-serif;
							font-size: 10px;
							color: #000000;
							font-weight: bold;
							text-align: center;
							border: 1px solid #CCCCCC outset;
							vertical-align: middle;
							margin-bottom: 3px;
							margin-top: 0px;
							margin-right: 0px;
							margin-left: 0px;
							}
	

											
				/* SIDEBAR-A STYLES. Used on left side of webpage. */		
				
		/* main header style for left column */
		#sidebar-a h2{
	text-align: center;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: bold;
	color: #000000;
	padding: 10px 0px 3px;
	line-height: 120%;
	margin: 0px;
		}
		
		/* small subheader style for left column */
			#sidebar-a h3{
				text-align: center;
				font-family: Verdana, Arial, Helvetica, sans-serif;
				font-size: 12px;
				font-weight: normal;
				line-height: 130%;
				color: #000000;
				margin: 0px;
				padding: 0px;
			}
			
			/* default p style for left column */
			#sidebar-a p{
	text-align: left;
	font-size: 11px;
	font-weight: normal;
	line-height: 140%;
	color: #000000;
	margin-right: 0px;
	margin-left: 0px;
	padding-right: 0px;
	
			}
			
			/* hide from IE mac \*/
#sidebar-a p{padding-left: 10px;}
/* end hiding from IE5 mac */
			
			/* no bullets for list of links only on home page */
				#sidebar-a ul.linklist {
					list-style-type: none;					
					}
					
					/* links set negative indent to overcome default indent */
					#sidebar-a ul.linklist li{
					font-size: 12px;
					line-height: 130%;
					color: #0000FF;
					padding: 0px 5px 10px 0px;
					text-align: left;
					margin: 0px;
					text-indent: -20px;
					}
			
			
			
			
			/* used on how you can help info page */
			#sidebar-a p.friends{
	line-height: 140%;
	color: #333333;
	text-align: center;
	font-size: 12px;
	font-weight: bold;
				}
				
				
				/* used for links in sidebar on many ancillary pages */
				#sidebar-a p.links2{
	line-height: 140%;
	text-align: left;
	font-size: 12px;
	margin-left: 15px;
	margin-right: 15px;
	margin-top: 5px;
	margin-bottom: 7px;
				}
				
			
			
			/* form used for CTCR page for instruments */
							
					#ctcr_form {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #000000;
	text-align: right;
	margin: 0px 70px 0px 0px;
	padding: 0px;
	font-weight: bold;
					}
					
						/* button styling */
						#ctcr_form .button{
							background-color: #FFFF99;
							font-family: Verdana, Arial, Helvetica, sans-serif;
							font-size: 10px;
							color: #000000;
							font-weight: bold;
							text-align: center;
							border: 1px solid #CCCCCC outset;
							vertical-align: middle;
							margin-bottom: 3px;
							margin-top: 0px;
							margin-right: 0px;
							margin-left: 0px;
							}
	

											
						/* styling of input field */
						#ctcr_form .inputfield{
							color: #000000;
							width: 80px;
							padding: 0px;
							font-family: Verdana, Arial, Helvetica, sans-serif;
							font-size: 10px;
							margin-right: 2px;
							margin-left: 4px;
						}