/* CSS Document */
/* ----	GENERAL ---*/
body {
	font-family: "Trebuchet MS", Arial, Helvetica, "Lucida Grande", sans-serif ;
	font-size: small;
	font-weight: normal;
	line-height: 130%;
	background-color: black;
}

* html body {
	font-size: x-small; /* for IE5/Win */
	font-size: small; /* for other IE versions */
}
body.white	{ /* ----	for pop up pages ---*/
	background-color: white;
}
/* ----	WRAPPER ( class contains background image. 00 is default)
#wrapper {
	background-repeat: repeat;
	position: absolute;
	background-position: left top;
} ---*/
.bkgnd_nounit	{	background-image: url(/courses/envsci/images/bkgnd_00.jpg);	}
.bkgnd_unit1	{	background-image: url(/courses/envsci/images/bkgnd_01.jpg);	}
.bkgnd_unit2	{	background-image: url(/courses/envsci/images/bkgnd_02.jpg);	}
.bkgnd_unit3	{	background-image: url(/courses/envsci/images/bkgnd_03.jpg);	}
.bkgnd_unit4	{	background-image: url(/courses/envsci/images/bkgnd_04.jpg);	}
.bkgnd_unit5	{	background-image: url(/courses/envsci/images/bkgnd_05.jpg);	}
.bkgnd_unit6	{	background-image: url(/courses/envsci/images/bkgnd_06.jpg);	}
.bkgnd_unit7	{	background-image: url(/courses/envsci/images/bkgnd_07.jpg);	}
.bkgnd_unit8	{	background-image: url(/courses/envsci/images/bkgnd_08.jpg);	}
.bkgnd_unit9	{	background-image: url(/courses/envsci/images/bkgnd_09.jpg);	}
.bkgnd_unit10	{	background-image: url(/courses/envsci/images/bkgnd_10.jpg);	}
.bkgnd_unit11	{	background-image: url(/courses/envsci/images/bkgnd_11.jpg);	}
.bkgnd_unit12	{	background-image: url(/courses/envsci/images/bkgnd_12.jpg);	}
.bkgnd_unit13	{	background-image: url(/courses/envsci/images/bkgnd_13.jpg);	}

#header	{
	width: 100%;
	background-color: #3D5E8B;
}

/* ----	LEFT NAV STYLES ---*/
#leftnav {
	font-family: "Trebuchet MS", Arial, Helvetica, "Lucida Grande", sans-serif;
	font-size: 90%;
	font-weight: normal;
	float:left;
	background-image: url(/courses/envsci/images/bkgnd_leftnav.png);
	width: 20%;
	padding: 5px 5px 50px 5px;
	color: #999900;
	letter-spacing: .025em;
}
/* for the swapstyle collapsible left menu */

/* Turns off Margin, Padding, and Bullets for the 1st level menu (Content by..) */
#leftnav ul { margin: 0px; padding: 0px; font-size: 110%; 	/*font-weight: bold;*/ }
#leftnav ul li { margin: 0px; padding: 0px;  }

/* Size and style for 2nd level menu: unit list-ol */
#leftnav ul>ol { margin: 0px; padding: 0px; font-size: 90%; }
#leftnav ul>ol li { margin: 0px; padding: 0px; font-size: 90%; list-style-type: decimal; }

/* Size and style for 2nd level menu: icon list-ul */
#leftnav ul ul {margin: 0px; padding: 0px; font-size: 90%;  }
#leftnav ul ul li {margin: 0px; padding: 0px; list-style-type: none;  }

/* Size and style for 3rd level menu: unit submenu */
#leftnav ul ol ul	{ margin-left: 1em; font-size: 90%;	}

#leftnav li a.selected	{ color: #FFFFFF;	}
#leftnav .selected	{ color: #FFFFFF;	}

/* Link Styles for the Menu */
.closed a, .open a {
	color: #999900;
	display: block;
	padding: 0px 0px 0px 16px;
	text-decoration: none;
	line-height: 160%;
}

/* Hover and Active styles for the menu */
.closed a:hover, .open a:hover, .closed a:active, .open a:active {
	color: #FFFFFF;
}

/* remove OpenArrow (side pointing) for Trigger Links in Closed State in submenus */
.closed ul li a { background-image: none; }
.closed ol li a { background-image: none; }

/* remove CloseArrow (down pointing) for Trigger Links in Open State in submenus */
.open ul li a { background-image: none; }
.open ol li a { background-image: none; }

/* OpenArrow (side pointing) for Trigger Links in Closed State */
.closed a { background-image: url(/courses/envsci/images/arrowopen.gif); background-repeat: no-repeat; }

/* CloseArrow (down pointing) for Trigger Links in Open State */
.open a { background-image: url(/courses/envsci/images/arrowclose.gif); background-repeat: no-repeat; }

/* Link Styles for the Submenus */
.closed ul a, .open ul a, .open ul a:hover {
	border: 0;
	color: #999900;
	/*font-weight: bold;*/
	padding: 0;
	margin-left: 14px;
}
.closed ol a, .open ol a, .open ol a:hover {
	border: 0;
	color: #999900;
	/*font-weight: bold;*/
	padding: 0;
	margin-left: 0;
}

.open ol a:hover	{
	color: #FFFFFF;
}
.open ul a:hover	{
	color: #FFFFFF;
}

/* ----	CONTENT (WHITE PAGE AREA) ---*/
#content {
	background-color: white;
	color: #333333;
	width: 550px;
	padding: 1% 5% 5% 3%;
	margin-top: 20px;
	margin-left: 23%;
	margin-right: 5%;
	margin-bottom: 3%;
}

#content p {
	font-size: 90%;
	line-height: 150%;
}

#content h1, h2, h3, h4, h5 {
	font-family: "Trebuchet MS", Arial, Helvetica, "Lucida Grande" ;
	color:#999900;
}
#content h1 {	font-size: 140%; line-height: 140%;	}
#content h2 {	font-size: 120%; line-height: 130%;	}
#content h3 {	font-size: 110%; line-height: 120%;	}
#content h4 {	font-size: 100%; line-height: 120%;	font-weight: bold;}
#content h5 {	font-size: 90%; line-height: 120%; font-weight: bold; }

#content ul, ol {
	font-size: 90%;
	line-height: 150%;	
}

#content a:link {
	color: #336699;
	text-decoration: none;
}
#content a:visited {
	color: #6699CC;
	text-decoration: none;
}
#content a:hover {
	color: #999900;
	text-decoration: underline;
}
#content a:active {
	color: #CC6600;
	text-decoration: underline;
}

.leftcol	{
	width: 200px;
	float: left;
}

.rightcol	{
	margin-left: 220px;
}
/* ----	STYLES FOR MISC ITEMS IN ONLINE TEXT ---*/

/*------ sub and super figures ------- */
sub	{ font-size: 80%; line-height: 90%; letter-spacing: .025em; }
sup {	font-size: 80%;	line-height: 90%; letter-spacing: .025em; }

p.quote	{ font-size: 100%; line-height: 150%; font-style: italic; font-family:Georgia, "Times New Roman", Times, serif; }
p.quoter	{ text-align: right; }

/*------ Further Reading ------- */
ul.further {
	margin: 0;
	padding: 0;
	list-style-type: none;
	font-size: 90%;
	line-height: 150%;	
}
ul.further li	{
	margin-bottom: 1.5em;
}
/* ----	for boxed sidebars used in the online textbook  ---*/
.box	{
	background-color: #E1E1E1;
	padding: 15px;
	border: 1px solid #999999;
}
.box h4	{
	margin-top: 0;
}
.box ul li	{
	list-style-position: inside;
}

/* ----	IMAGES IN THE CONTENT AREA (WHITE PAGE AREA)  ---*/

#vis_overview {/* -- used on unit overview pages --*/
	float: left;
	padding-right: 20px;
}
#vis_overview p	{
	width: 200px;
	font-size: 75%;
}	
#content .vis_full {/* -- full-width images, no wrap --*/
	width: 370px;
	border: 1px solid #999999;
	padding: 10px;
}		
#content .vis_full p {
	font-size: 75%;
	width: 350px;
	text-align: left;
}		
#content .vis_left {/* -- used in the box-sidebars --*/
	float: left;
	padding: 0 15px 0 0;
}
#content .vis_left p {
	width: 350px;
	font-size: 75%;
}	

/* --	for tables used in the online textbook --*/
table.onlinetext	{
	font-size: 90%;
	line-height: 150%;
	border-top: 1px solid #999999;
	border-left: 1px solid #999999;
	border-collapse: collapse;
	margin-top: 15px;
	margin-bottom: 15px;
}
table.onlinetext th	{
	border-right: 1px solid #999999;
	border-bottom: 1px solid #999999;
	padding: 5px;
	background: #CCCCCC;
	text-align: left;
}
table.onlinetext td	{
	border-right: 1px solid #999999;
	border-bottom: 1px solid #999999;
	padding: 5px;
}
table.onlinetext caption	{
	font-size: 90%;
	text-align: left;
}	
	
.hilite	{ /* ----	for hiliting text within a table or other copy area ---*/
	color: #666600;
}	
/* ----	FOR MENU LISTS ---*/
ol.menu	{
	padding-left: 20px;
	margin-top: -10px;
}

ul.menu	{
	list-style-type: none;
	padding-left: 0;
	margin-top: -10px;
}
/* ----	FOR SITE MAP MENUS ---*/
ul.sitemap	{
	list-style-type: none;
	padding-left: 2em;
}
dl.sitemap	{
	padding: 0;
	margin: 0;
	font-size: 90%;
	line-height: 150%;	
}
dl.sitemap dt	{
	font-weight: bold;
	font-size: 110%;
	margin-top: 1em;
}
dl.sitemap dd	{
	padding-left: 2em;
	margin: 0;
}

/* ----	FOR MENUS WITH THUMBNAIL IMAGES SUCH AS VISUALS AND SCIENTISTS ---*/
dl.img_menu {
	padding: 0 0 1.5em 0;
	margin: 0;
	list-style-type: none;
	font-size: 90%;
	line-height: 150%;	
}
dl.img_menu dd.image {
	float: left;
	margin: 4px 15px 15px 0;
	padding: 0 0 1.5em 0;
}
dl.img_menu dt	{
	font-size: 120%;
	font-weight: bold;
	margin: 0;
	padding: 0;
}
dl.img_menu dd	{
	margin-left: 115px;
}

dl.glossary {
	margin: 0;
	padding: 0;
	line-height: 150%;
}
dl.glossary dt	{
	font-size: 100%;
	font-weight: bold;
	margin: .75em 0 0 0;
	padding: 0;
}
dl.glossary dd	{
	font-size: 90%;
	margin: 0;
	padding: 0;
}

/*------ STYLES FOR HOME PAGE ------- */

#content_home {
	background-color: white;
	padding: 8px 20px 30px 20px;
	color: #333333;
	font-weight: normal;
	font-size: 90%;
	line-height: 150%;
	margin: 1% 5% 5% 5%;
	max-width: 850px;
}

#content_home .leftcol	{
	width: 230px;
	float: left;
}

#content_home .rightcol	{
	margin-left: 253px;
}

ul.home {/*used for content by type list on home page */
	padding: 0;
	margin: -10px 0 0 0;
	list-style: none;
	font-weight: bold;
}
ul.home img	{
	padding-right: 5px;
	padding-bottom: 5px;
}
ol.home {/*used for unit list on home page */
	padding: 0px;
	margin: 0px;
	list-style: none;
	font-weight: bold;
}
ol.home li	{
	clear: left;
	font-size: 110%;
}
ol.home li img	{
	float: left;
	padding-right: 5px;
	margin-top: -14px;/* these margin settings are to get the icons centered vertically with the text but they don't work in IE/PC */
	margin-bottom: 18px;
}
ol.home li.top	{/* to get the top units (#1 and #8) to not bump into the subhead above them in IE/PC */
	margin-top: 14px;
}	
.science img {
	float:right;
	width:140px;
	
}
em.num	{ /* to make the  numbers float left on unit menu on home page, couldn't use span because of the css tooltips */
	float: left;
	padding-bottom: 10px;
	margin-right: 4px;
}
#content_home a:link	{
	color:#336699;
	text-decoration: none;
}
#content_home a:visited {
	color:#6699CC;
	text-decoration: none;
}
#content_home a:hover {
	color:#999900;
	text-decoration: underline;
}
#content_home a:active {
	color:#CC6600;
	text-decoration: underline;
}

/*--FOR POP UP CHILD WINDOWS ---*/
#childwindow	{
	padding: 0 2em 2em 2em;
	font-size: small;
	font-family: "Trebuchet MS", Arial, Helvetica, "Lucida Grande", sans-serif ;
	color: #333333;
}
#childwindow h1 {
	font-size: 140%;
	line-height: 140%;
	color: #999900;
}
#childwindow h2	{
	font-size: 125%;
	line-height: 125%;
	font-weight: normal;
	color: #999900; 
}		
#childwindow .smalltext	{
	font-size: 75%;
	color: #666666;
	margin-top: 0px;
}
#childwindow p	{
	font-size: 90%;
	line-height: 150%;
}
#childwindow .img_left	{
	float: left;
	margin: 0 15px 15px 0;
	border: thin solid #cccccc;
}	

#childwindow a:link {
	color:#336699;
	text-decoration: none;
}
#childwindow a:visited {
	color: #6699CC;
	text-decoration: none;
}
#childwindow a:hover {
	color:#999900;
	text-decoration: underline;
}
#childwindow a:active {
	color: #CC6600;
	text-decoration: underline;
}
/* for the beyond pages */
#childwindow .beyond	{
	clear: left; margin: 0 0 20px 0;
}
#childwindow .beyondPics	{
	float: left;
	margin: 0 20px 20px 0;
	width: 250px;
}
	
/* ----	for icons in header of Content By Type pages  ---*/
.icon	{
	margin-bottom: -10px;
}

/* ----	SECTION NAVIGATION AT TOP OF CONTENT (WHITE PAGE AREA)  ---*/
#sctnav_top {
	font-family: "Trebuchet MS", Verdana, "Lucida Grande", Helvetica;
	list-style: none;
	background-color: #E1E1E1;
	padding: 0 .5em .5em .5em;
	height: 1.25em;
	margin: -10px 0 0 0;
}
#sctnav_top li	{
	float: left;
	font-size: 90%;
	color: #666666;
	background-color: #E1E1E1;
	padding: 0 .5em 0 .25em;
}
#sctnav_top a:link	{
	font-weight: bold;
	color: #3366CC;
	text-decoration: none;
	padding: 0 .5em 0 .5em;
}
#sctnav_top a:visited	{
	color: #3366CC;
	text-decoration: none;
	font-weight: bold;
	padding: 0 .5em 0 .5em;
}
#sctnav_top a:hover	{
	text-decoration: underline;
	font-weight: bold;
	background: #FFFFFF;
	padding: 0 .5em 0 .5em;
}	
#sctnav_top a.selected	{
	font-weight: bold;
	color: #3366CC;
	border: 1px solid #999999;
	padding: 0 .5em 0 .5em;
}
.jump	{
	font-weight: bold;
	margin-right: 1em;
}

/* ----	 TOOL TIPS  ---*/
a.info	{
	position: relative; /*this is the key*/
	z-index: 24;
	text-decoration: none;
}
a.info:hover	{
	z-index: 25;
}
a.info span	{
	display: none;
}
a.info:hover span	{ /*the span will display just on :hover state*/
	display: block;
	position: absolute;
	top: -1em; left: 2em; width: 12em;
	border: 1px solid #666666;
	padding: .3em 0 .3em .3em;
	background-color: #FFFFFF; 
	color: #666666;
	text-decoration: none;
	line-height: 100%;
	font-size: 90%;
}
/* ----	 TOOL TIP for habitable planet logo in leftnav to solve Safari tooltip clipping problem  ---*/
a.logotooltip	{
	position: relative; /*this is the key*/
	z-index: 24;
	text-decoration: none;
	display: inline-block;/*this fixes the Safari*/
}
a.logotooltip:hover	{
	z-index: 25;
}
a.logotooltip span	{
	display: none;
}
a.logotooltip:hover span	{ /*the span will display just on :hover state*/
	display: block;
	position: absolute;
	top: -1em; left: 2em; width: 12em;
	border: 1px solid #666666;
	padding: .3em 0 .3em .3em;
	background-color: #FFFFFF; 
	color: #666666;
	text-decoration: none;
	line-height: 100%;
	font-size: 90%;
}

/* ----	SECTION NAVIGATION AT BOTTOM OF CONTENT (WHITE PAGE AREA)  ---*/
#sctnav_btm {
	font-family: "Trebuchet MS", Verdana, "Lucida Grande", Helvetica;
	list-style: none;
	margin: 0;
	background-color:#E1E1E1;
	padding: 0 .5em .5em .5em;
	height: 1em;
}
#sctnav_btm li	{
	float: left;
	font-size: 90%;
	color: #666666;
}
#sctnav_btm a:link	{
	color:#3366CC;
	text-decoration: none;
	padding: 0 .5em 0 .5em;
}
#sctnav_btm a:visited	{
	color:#3366CC;
	text-decoration: none;
	padding: 0 .5em 0 .5em;
}
#sctnav_btm a:hover	{
	text-decoration: underline;
	padding: 0 .5em 0 .5em;
	background: #FFFFFF;
}	
#sctnav_btm a.selected	{
	font-weight: bold;
	color:#3366CC;
	padding: 0 .5em 0 .5em;
	border: 1px solid #999999;
}
/*------ sub and super figures within the bottom section nav ------- */
#sctnav_btm sub	{ font-size: 90%; line-height: 90%; letter-spacing: .025em; }
#sctnav_btm sup {	font-size: 90%;	line-height: 90%; letter-spacing: .025em; }


/* ----	BOTTOM NAVIGATION  ---*/
#btmnav	{
	background-image:url(/courses/envsci/images/bkgnd_leftnav.png);
	background-repeat: repeat;
	bottom: 0px;
	width: 100%;
	padding: 10px 10px 10px 20px;
	font-size: 90%;
	line-height: 120%;
	color: #FFFFFF;
	clear:both;
}
#btmnav ul	{
	list-style: none;
	margin: 0;
	padding-bottom: 1.2em;
	padding-top: 0px;
	padding-right: 0px;
	padding-left: 0px;
}
#btmnav li	{
	float: left;
	padding-right: 16px;
}
#btmnav p {
	margin-top:.75em;
}
#btmnav a:link	{
	color:#FFFFFF;
	text-decoration: underline;
}
#btmnav a:visited	{
	color:#CCCCCC;
	text-decoration: underline;
}
#btmnav a:hover	{
	color: #CCCC33;
}	
#btmnav a.selected	{
	font-weight: bold;
	color: #666666;
}
.h_s_logo {
	margin-left:55em;
	margin-top:-3.5em;
	padding-bottom:.5em;
}

/* ----	INTERACTIVES  ---*/

#interactive_content img{
	border: none;
}

a img {border: none; }

#interactive_banner{
	width: 570px;
	height: auto;
	position: relative;
	overflow: hidden;
	margin-top: 1em;
	
}

#leftside_banner{
	float: left;
	width: 250px;
	padding-right: 2em;
}

#leftside_banner h1{
	margin: 0;
	padding: 0;
	color:#999900;
	font-size: 140%; line-height: 140%;
}

#leftside_banner h2{
	margin: 0;
	padding: 0;
	font-weight: normal;
	color:#999900;
	font-size: 140%; line-height: 140%;
}

#rightside_banner{
	margin-left: 420px;
	padding: 0;
}

#rightside_banner img{
	margin:0;
	padding: 0;
}

#left_column{
	float: left;
	margin-top: 1em;
	width: 160px;
	font-size: 112%;
}

#interactive_nav{
	color: #336699;
	width: 170px;
	margin: 0;
	margin-left: -1.2em;
	padding: 0;
	list-style: none;
	padding-left: 1.2em;
	padding-bottom: 100em;
	margin-bottom: -100em;
}

#interactive_nav li{
	line-height: 2em;
}

#interactive_nav li.lesson{
	padding-top: 0.9em;
}

li.current{
	font-weight: bold;
	color: #999900;
}

#interactive_nav ul{
	margin: -0.5em 0em 0.5em -0.5em;
	list-style: none;
	padding-left: 1.2em;
}

#interactive_nav ul li{
	line-height: 1.3em;
}

#interactive_content{
	float: left;
	color: #333333;
	margin-top: 1em;
	margin-left: 1.3em;
	padding: 0;
	width: 383px;
	font-size: 105%;
}

#interactive_content dl{
	margin: 0;
	padding: 0;
	margin-bottom: 1em;
}

#interactive_content dd{
	padding-bottom: 0.5em;
	font-size: 90%;
}

#interactive_content dt{
	font-size: 90%;
}

#interactive_content h2{
	margin:0;
	padding: 0;
	font-weight: normal;
}

#interactive_content h3{
	margin: 0;
	padding: 0;
	font-weight: normal;
	margin-top: 1em;
}

#interactive_content ol{
	padding: 0em 2em 0em 3em;
}

#interactive_content li{
	padding-bottom: 1em;
}

.highlight{
	/*color:#999900;*/
	font-weight: bold;
	color: #CC6600;
}

.subheader{
	font-weight:bold
}

#interactive_content li.top_level{
	padding-bottom: 0em;
}

ol.short_list{
list-style-type:lower-latin;
margin-top: 0.5em;
}

ol.short_list li{
	padding-bottom: 0;
	padding-top: 0;
	line-height: 1.4em;
	font-size: 110%;
}

.page_top{
	clear: both;
}

#disease_help{
	list-style: none;
	padding:0;
	padding-left: 0.2em;
	margin: 0;
}

#disease_help li{
	line-height: 0.5em;
	
}

#disease_help li.padding{
	padding-top: 0.8em;
	
}