@charset "utf-8";
/* MAIN STYLE DEFINITIONS FOR ANSIRH WEB SITE 
Note that color-specific definitions are contained in section-specific files and called dynamically.

TEXT COLORS:
	#666: grey -- main text 
	#989149: olive green -- header	
	#003366 - dark blue: primary links in content section
	#666666 - grey: visited links in content section
	#990000 - red: hover links in content section

BACKGROUND COLORS:
	#666: grey -- top nav bar
	#999933: olive green -- middle breadcrumb bar, about	
	#e4e4de: light grey: top nav section dividers
	
SECTION COLOR SCHEMES:
	About: 
		#999933:olive green -- middle breadcrumb bar, about
		#989149: darker olive green - text
		#f2f2d9: light bar across hover	
	Research:
		#cc6600: orange
		#fff2d9: light bar across hover	
	Training:
		#7799bb: blue
		#e6f2f2: light bar across hover	
	Library:  
		#990000: red
		#ffeddb: light bar across hover	
	News:
		#666699: light periwinkle
		#e5e5f2: light bar across hover	
*/
body { /* background images are defined in section-specific css */
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size: 67.5%;
	color: #666;
	margin: 0;
}
/**********PRIMARY TAGS ************/
/* logo is the title in graphics - surround by h1 so search engines will pick up alt tag */
h1 {  /* main titles for content section. see section-specific css files for colors */
	font-size: 1.45em;
	font-weight:normal;
	margin-bottom:20px;
	margin-top:13px;
}
/* br* - added line-height spec */
h2 {  
	font-size: 1.1em;
	font-weight:bold;
	line-height: 1.5em;
	margin-top:30px;
	margin-bottom:0px;
}
h3 { 
	font-size: 1.05em;
	font-weight:bold;
	margin-top:20px;
	margin-bottom:0px;
}
h4, #disclaimer h2 { 
	font-size: 1.1em;
	font-weight:normal;
	line-height: 1.5em;
	margin-top:20px;
	margin-bottom:0px;
}
/***** PAGE DIVIDERS ************/
#totalContainer { /* sets basic width and centers primary container */
	width: 800px;
	background-color:#FFFFFF;
	margin: 0 auto;
}
#topNav { /* top grey bar */
	height: 27px;
	background-color:#666;
	width: 100%;
	background-position: 36px 4px;
	background-image:url(/_images/logos/ucsf.gif);
	background-repeat:no-repeat;
	padding-bottom: 4px;
	margin: 0 auto;
}
#logo {
	padding: 20px 0 0 0;
	float:left;
}
#mainNav { /* right aligned primary navigation items - all other definitions contained in /p7tbm */
	height:84px;
	padding: 0 0 41px 30px;
	margin:0;
}
#breadcrumbNav { /* color bar that runs between main nav and primary content areas.  see specific section css files for colors  */
	padding: 7px 26px 7px 30px;
	_padding: 7px 26px 6px 30px;	 /* reduce size for IE */
	height:9px;
	color: #FFFFFF;
	font-size: .91em;
	font-family:Arial, Helvetica, sans-serif;	
}
#breadcrumbNav #left { 
	float:left;
	width:500px;
}
#breadcrumbNav #right  {
	color: #fff;
	float:right;
	width: 200px;
	text-align:right;
}
#mainContent { /* covers the entire main content area: sub sections defined below */
	padding: 10px 26px 8px 30px;
	width:744px;
}
#mainContent #leftNav { /* left navigation area of main content.  Dynamically controlled by php file */
	width: 123px;
	margin: 6px 30px 0 0; /* Controls spacing at top of left hand column */
	_margin: 8px 30px 0 0;	 /* IE */
	padding-bottom: 30px;
	float:left;
}
#mainContent #middle { /* primary content area */
	width: 412px;
	float:left;	
	font-size: 1.03em;
	padding-bottom: 20px;
	_margin-top:14px;/* IE */
	background-color: #FFFFFF;
}
#mainContent #middle #photoArea {
	float:right;
	margin:1.7em 0 1em 2em;
	_margin: 1.7em 0 1em 1em;
}
#mainContent #middle #photoArea p {
	color: #cc6600;
}	
	
#mainContent #rightSide, #mainContent #rightSideExp { /* right hand callout */
	width:148px;
	float:left;
	margin: 0 0 0 31px;
	background-color: #FFFFFF;
}
#footer {
	text-align:left;
	padding: 0px 27px 10px;
	font-size: .8em;
	line-height: .1em;
	bottom:10px;
	color: #999;
	clear:both;
}
/*********** DEFINITION OF TAGS ************/
#mainContent #middle p, #graph_page p {
	line-height: 1.6em;
}
#mainContent #middle ol {
	padding:0;
	margin:1em;
}
#mainContent #middle ol li {
	line-height:1.5em;
	margin-left:1em;
	margin-top: 8px;
}
#mainContent #middle ol.tight li {
	margin-top: 0;
}
#mainContent #middle ul {
	margin-left: 0;
	padding-left: 0;
	padding-top: 0;
	line-height: 1.6em;
	list-style: none;
}
#mainContent #middle ul li {
	padding-left: 12px;
	margin-top: 10px;
}
#mainContent #middle ul li.tight, 
#mainContent #middle ol li.tight,
#mainContent #middle ul.tight li {
	margin-top: 0px;
}
#mainContent #middle ul li ul li {
	margin-top: 0;
	background: url(/_images/decorations/bullet_second.gif) no-repeat;
	background-position: 0 7px;
}
#mainContent #middle ul li ul.space li {
	margin-top: 10px;
	background: url(/_images/decorations/bullet_second.gif) no-repeat;
	background-position: 0 7px;
}
#mainContent #rightSide p { /* text definition for right side callout. see section-specific css for colors */
	font-size: 1.04em;
	line-height:2.7em;
	margin-top:9px; /* controls spacing above right hand callout */
}
#mainContent #rightSideExp p { 
	line-height:1.6em;
	margin-top:1.6em;
}
#mainContent #rightSide #photoArea {
	float:right;
	margin:2em 0 0 0;
	
}
#mainContent #rightSide #photoArea p {
	margin-top:0px;
}
/************* NAVIGATION **************/
/* navigation links in top grey bar  */
#topNav ul {
	font-size: 1.05em;
	color: #fff;
	padding: 8px 0 8px 86px;
	list-style-type:none;	
	margin-top:0;
	margin:0;
}
#topNav ul li {
	padding: 0 10px;
	background-image:url(/_images/decorations/dividingline.gif);
	background-repeat:no-repeat;
	background-position: right;
	display:inline;
}
#topNav ul li.last { /* no pipe on last nav item */
	padding: 0 8px;
	background-image:none;
}
#topNav li a, #breadcrumbNav a {
	color: #fff;
	text-decoration:none;
}
#mainContent #leftNav ul {
	list-style-type:none;
	margin-bottom: 0;
	margin-top:5px;
}
#mainContent #leftNav ul li {
	width: 114px;
	float:left;
	margin: 0 0 0 -40px;
	_margin: 0 0 0 -20px; /* IE */
	padding: 6px 0 6px 0;
	border-bottom: 1px dotted #bbbbaa;	
	font-family:Verdana, Arial, Helvetica, sans-serif;
}
#mainContent #leftNav ul li#sitemap {
	border:0;
	padding-bottom:30px;
	padding-top:30px;
}
#mainContent #leftNav ul li a {
	color: #666;
	text-decoration:none;
	line-height:1.4em;
}
#mainContent #leftNav ul li#sitemap a,
#mainContent #leftNav ul li#blog a {
	color: #999;
}

#mainContent #leftNav ul li#blog {
	border:0;
	font-weight: bold;
	padding-bottom:30px;
	padding-top:0;
}


#mainContent #leftNav ul li#blog a:hover {
	color: #990000;
}

#mainContent #leftNav ul li#follow {
	border:0;
	color: #999;
	line-height: 2em;
	padding-bottom:0;
	padding-top:0;
}

#mainContent #leftNav div.icons {
	clear: both;
	display: block;
	float: left;
	margin: 5px 0 0 0;
	padding: 0;
}

#mainContent #leftNav ul li ul {
	list-style-type:none;
	margin-top:5px;
}
#mainContent #leftNav ul li ul li{
	width: 103px;
	float:left;
	margin: 0 0 0 -30px;
	_margin: 0 0 0 -10px; /* IE */
	padding: 2px 0 2px 0;
	border:none;	
	font-family:Verdana, Arial, Helvetica, sans-serif;
}
#mainContent #leftNav ul li ul li a {
	color: #888;
	text-decoration:none;
	line-height:1.2em;
}
/* links main content area */
#mainContent #middle a:link, #mainContent #rightSide a:link, 
#mainContent #rightSideExp a:link {
	border-bottom: 1px dotted #003366;
	color: #003366;
	text-decoration:none;
}
#mainContent #middle a:visited, #mainContent #rightSide  a:visited,
#mainContent #rightSideExp  a:visited {
	border-bottom: 1px dotted #666;
	color: #666;
	text-decoration:none;
}
#mainContent #middle a:hover, #mainContent #rightSide  a:hover,
#mainContent #rightSideExp a:hover {
	color: #990000;
	border-bottom: 1px dotted #990000;	
}
/********* CLASSES ******************/
.clearit {
	clear:both;
}
#leftCol .copyright, #mainContent #leftNav p.copyright {
	font-size: .8em;
	bottom:10px;
	color: #999;
	line-height: 1.5em;
}
#mainContent #middle img.main { /* full width image: spacing between image and paragraph, below */
	margin-bottom:11px;
}
a.footer {
	border-bottom: 1px dotted #999;
	color: #999;
	text-decoration:none;
}
.back_to_top {
	font-size: 85%;
}
.byline {
	color: #666666;
	padding-top: 0px;
	text-align: left;
	margin-top: 5px;
	margin-bottom: 0px;
	font-family: verdana, arial, sans-serif, helvetica;
	font-size: 9px;
	font-style: normal;
	line-height: 19px;
	font-weight: bold;
	font-variant: normal;
	text-transform: uppercase;
}
.caption {
	margin-top:8px;
}
.credit {
	margin-top:8px;
	font-size: .8em;
	font-weight: normal;
	line-height: 1.5em;
	color: #999;
}
.indent {
	margin-left: 20px;
}
.editorial {
	font-weight:bold;
	color: #990000;
}
.emphasis1 {
	font-weight:bold;
}
.emphasis2 {
	font-weight:normal;
}
.emphasis3 {
	font-weight:normal;
	color: #C60;
}
.footnote_ref {
	font-style: italic;
	font-size: .8em;
	color: #cc6600;
}

.graph {
	margin-top:14px;
	color: #C60;
}
.note {
	font-weight:normal;
	font-size: 10px;
	line-height:2em;
	color: #666;
}

.note-span {
	font-weight:normal;
	font-size: 10px;
	color: #666;
}

.no_top {
	margin-top: 0;
}

.quote {
	color: #C60;
	margin-bottom:0;
	margin-top:14px;
}

.quote_byline {
	font-style:italic;
	margin-top:0;
	text-align:right;
}

#mainContent #rightSideExp ul {
	line-height: 1.6em;
	margin-left: 0px;
	padding-top: 0px;
	padding-left: 0px;
	list-style-type: none;
}
#mainContent #rightSideExp ul li {
	margin-top: 0px;
	padding-left: 12px;
}

#disclaimer p {
	font-weight:normal;
	font-size: .8em;
	line-height:2em;
	margin-top:5px;
	color: #666;
}

.plain_text {
	font-size: 1em;
	font-weight: normal;
	line-height: 1.5em;
	margin:0;
}

/*********** tables ************/

table {
	border: 1px dotted #999;
	border-collapse: collapse;
	font-size: .9em;
	line-height: 1.4em;
	margin-top: 20px;
	width: 408px;
}

td {
	border: 1px dotted #999;
	border-collapse: collapse;
	padding: 6px;
}

td.second {
	border-right: 1px dotted #fff;
}

th {
	border: 1px dotted #fff;
	color: #fff;
	font-weight: bold;
	padding: 6px;
}

table.data th {
	background-color:#cc6600;
	color: #fff;	
	font-size: 1.1em;
	font-weight: normal;
}

table.data td {
	border-right: 0;
	border-bottom: 0;
	text-align:center;
}

table.data td.left {
	color: #cc6600;	
	text-align:left;
}


/*********** site map ************/
#mainHP #columnArea1_sitemap {
	padding-left: 25px;
	padding-right: 25px;
}
#mainHP #columnArea1_sitemap ul {
	margin-left: 15px;
	padding-left: 0;
	padding-top: 0;
	line-height: 1.6em;
	list-style: none;
}
#mainHP #columnArea1_sitemap ul li {
	padding-left: 12px;
	margin-top: 0px;
	background: url(/_images/decorations/bullet_about.gif) no-repeat;
	background-position: 0 7px;
}

#mainHP #columnArea1_sitemap ul li ul  {
	margin-left: 5px;
}

#mainHP #columnArea1_sitemap ul li ul li {
	background: url(/_images/decorations/bullet_second.gif) no-repeat;
	background-position: 0 7px;
}
#mainHP #columnArea1_sitemap h3 {
	margin-left:15px;
	line-height:1.7em;
	color: #999933;
}

/*blog promo*/

#leftCol li a:link,
#leftCol li a:visited {
	border-bottom: 0;
	color: #CC6600;
}

div#leftCol li a:hover {
	border-bottom: 0;
	color: #990000;
}

div#blog-promo {
	background-color: #666666;   
	color: #fff;
	font-size: 12px;
	height: 23px; 
	margin: 0; 
	padding: 6px 25px 0 27px;
}

div#blog-promo2 {
	background-color: #666666;   
	color: #fff;
	font-size: 12px;
	height: 23px; 
	margin: 0; 
	padding: 6px 25px 0 27px;
}

span.promo, span.promo2 {
	float: left;
}

span.promo a, span.promo a:visited,
span.promo2 a, span.promo2 a:visited {
	border-bottom: 0; 
	color: #fff;
	font-weight: bold;
	text-decoration: none; 
}

span.promo a:hover {
	color: #f2c78a;
}

span.promo2 a:hover {
	color: #cfcfcf;
}

span.follow,
span.twitter,
span.facebook,
span.twitter2,
span.facebook2 {
	float: right;
}

span.follow p {
	display: inline;
}

#blog-promo .twitter a, #blog-promo .facebook a,
#blog-promo .twitter a img, #blog-promo .facebook a img,
#blog-promo2 .twitter2 a, #blog-promo2 .facebook2 a,
#blog-promo2 .twitter2 a img, #blog-promo2 .facebook2 a img {
	border: 0;
}

span.twitter img,
span.twitter2 img {
	border: 0;
	margin: 0;
	padding: 0;
}

span.twitter a,
span.facebook a {
	background-image: url(/_images/logos/twitter-orange.png);
	background-position: 0 0;
	background-repeat: none;
	margin: 0 0 0 4px;
	padding: 0;
	vertical-align: top;
}

span.facebook a {
	background-image: url(/_images/logos/facebook-orange.png);
	margin: -1px 0 2px 4px;
}

span.twitter a:hover {
	background-image: url(/_images/logos/twitter-orangehover.png);
}

span.facebook a:hover {
	background-image: url(/_images/logos/facebook-orangehover.png);
}

span.twitter2 a,
span.facebook2 a {
	background-image: url(/_images/logos/twitter-gray.png);
	background-position: 0 0;
	background-repeat: none;
	margin: -1px 0 2px 4px;
	padding: 0;
	vertical-align: top;
}

span.twitter2 a:hover {
	background-image: url(/_images/logos/twitter-grayhover.png);
}

span.facebook2 a {
	background-image: url(/_images/logos/facebook-gray.png);
}

span.facebook2 a:hover {
	background-image: url(/_images/logos/facebook-grayhover.png);
}

span.twitter3 a,
span.facebook3 a {
	background: url(/_images/sections/news/twitter.png);
	background-position: 0 0;
	background-repeat: no-repeat;
	margin: 0;
	padding: 4px 0;
	vertical-align: top;
}

span.twitter3 a:hover {
	background: url(/_images/sections/news/twitter-hover.png);
	background-repeat: no-repeat;
}

span.facebook3 a {
	background: url(/_images/logos/facebook.png);
	background-repeat: no-repeat;
	margin-right: 4px;
}

span.facebook3 a:hover {
	background: url(/_images/logos/facebook-hover.png);
	background-repeat: no-repeat;
}



/* blog feed */

div#blog-feed {
	margin-top: 30px;
}

div#blog-feed h3 {
	color: #cc6600; 
	margin-bottom: 5px;
	margin-top: 15px; 
	padding: 0;
}

div#blog-feed ul {
	margin:0; 
	padding: 0;
}

div#blog-feed ul li {
	background: url(/_images/decorations/bullet_research.gif) no-repeat;
	background-position: 0 7px;
	line-height: 1.6em; 
	list-style: none; 
	margin-top: 6px; 
	padding-left: 12px; 
}

div#blog-feed ul li a {
	text-decoration: none;
}

/*   Log-ins   */

#loginForm2 table, 
#loginForm2 table td {border:0;}



