/*------------------------------------------------------------------------------------------------------*/
/*   Framework stylesheet                                                                               */
/*   Last update: February 2008                                                                        */
/*------------------------------------------------------------------------------------------------------*/
/*   Main body styles                                                                                   */
/*   The content pane has an ID of mainbody                                                             */
/*------------------------------------------------------------------------------------------------------*/


#mainbody {
	padding-left: 20px;
	vertical-align: top;
}

#mainbody p {
	margin-bottom: 10px;
}	

/*----  List styles for #mainbody  ----*/
#mainbody ul {
	margin-top: 10px;
}

#mainbody ul, #mainbody ul li, #mainbody ol, #mainbody ol li {
	padding-left: 0px;
	margin-bottom: 0px;
	margin-left: 12px;
}

#mainbody ul ul, #mainbody ul ul li, #mainbody ol ol, #mainbody ol ol li {
	padding-left: 0px;
	margin-bottom: 0px;
	margin-top: 0px;
	margin-left: 12px;
}

#mainbody p + ul, p + ol  {
	margin-top: -8px;
}

/*----  General hyperlink styles ----*/
a:link {
	color: #004499;
	text-decoration: none;
}
	/*--------Old link color was #1144ff--------*/		
a:visited {
	color: #722072;
	text-decoration: none;
}
	/*--------Old visited color was "purple"--------*/	
a:hover, a:active {
	text-decoration: underline;
}


/*----  ID, settings  for the main page table  ----*/
#contenttable {
	width: 100%;
	clear: both;
}

/*----  Styles to set up a left and right content area (about 1/2 the width of the #mainbody content area). Using tables is an alternative to this. Needed to add clear:both to the leftside style as without a clear then when a window is expanded wide enough, the right side would appear below the left side.   ----*/
.leftside {
	float: left;
	width: 48%;
	clear: none;
}

.rightside {
	float: right;
	width: 48%;
	clear: none;
}
.fullwindow {
	float:left;
	width:100%;
	clear: both;
}

/* --- Put a dark  line at the bottom of an object, usually a header -----*/
.bottomborder {border-bottom-color: #333333;  border-bottom-style: solid; border-bottom-width: 1px;}

.bottomborder2 {border-bottom-color: #333333;  border-bottom-style: solid; border-bottom-width: 2px;}

.underlinewrap { margin-bottom: -5px; border-left: 1px solid #999999; border-bottom: 1px solid #999999; padding: 3px;  margin-top: 25px;
}


/* ---- Place a line above, below, or both, mainly for a text paragraph    ------ */
.lineabovebelow {
	border-top-width: 1px; 
	border-bottom-width: 1px; 
	border-bottom-style: solid; 
	border-top-style: solid; 
	padding-top: 2px; 
	padding-bottom: 2px; 
	border-color: #aaaaaa;
}

.lineabove {
	border-top-width: 1px; 
	border-top-style: solid; 
	padding-top: 4px; 
	padding-bottom: 4px; 
	border-color: #aaaaaa;
}

.linebelow {
	border-bottom-width: 1px; 
	border-bottom-style: solid; 
	padding-top: 2px; 
	padding-bottom: 2px; 
	border-color: #aaaaaa;
}

/*----  Add a faint border around any element  ----*/
.addborders {
    border-top: 1px solid #d9e0e6;
	border-right: 1px solid #c8cdd2;
	border-bottom: 1px solid #c8cdd2;
	border-left: 1px solid #d9e0e6;
   	padding: 4px; 
}


/*----   Vertically top-align contents in a table cell    ----*/

td {
	vertical-align: top;
}
/*----   For times when you don't want to just top-align    ----*/
.tblvalignmid td {
	vertical-align: middle;
}
.tblvalignbot td {
	vertical-align: bottom;
}
.tblvaligntop td {
	vertical-align: top;
}
.tblvalignmid tr {
	vertical-align: middle;
}
.tblvalignbot tr {
	vertical-align: bottom;
}
.tblvaligntop tr {
	vertical-align: top;
}


/*----  Formatting styles ----*/

.clear {clear: both;}

.forwebmaster {
	color: green;
	font-size: .9em;
}

.highlightpub { padding: 4px;  background-color: #efeff5; }

/* ----- Format for the tables in the Publications pages -----*/
#tablepubs table {
	width: 97%; 
	margin-bottom: 10px; 
	margin-top: 25px; 
	border-collapse: collapse; 
	clear: both;
}
	
#tablepubs table tr {border-bottom: thin #888888 solid;}

.marginbottom10 {margin-bottom:10px;}


/*------------------------------------------------------------------------------------------------------*/
/*   Boxheading styles                                                                                  */
/*------------------------------------------------------------------------------------------------------*/

.boxheading {
	border-bottom: 1px solid #999999;
	margin: 0px;
	padding: 2px;
	font-size: 100%;
	padding-left: 10px;
	padding-top: 3px;
	padding-bottom: 3px;
	margin-bottom: 8px;
}

.boxsection {
	width: 98%;
	border: 1px solid #cccccc;
	padding-bottom: 10px;
	margin-bottom: 20px;
	margin-top: 30px;
}

.boxsection p {
	padding-left: 10px;
	padding-right: 10px;
	margin-bottom: -8px;
	margin-top: 8px;
}
.boxsection ul li {
	padding-bottom: 3px;
	padding-right: 10px;
}

.boxsection ul li ul li{
	margin-left: -15px;
}

.boxsection ul li ul li ul li{
	margin-left: -15px;
}


/*------------------------------------------------------------------------------------------------------*/
/*   Infobox styles - control popup information boxes                                                   */
/*    Styles introduced in new USGS Home Page, Dec 2007                                                 */
/*------------------------------------------------------------------------------------------------------*/

a.infobox {
        position:relative; /*this is the key*/ 
        z-index:24; 
        color:#000; 
        text-decoration:none; 
}

a.infobox:hover {
	z-index:25;
	 background-color:#fff; 
     text-decoration:underline; 
}

a.infobox span {
	display: none;
	font-size: x-small;
	text-decoration: none;
	font-weight: normal;
	visibility: hidden;
}

a.infobox:hover span { /*the span will display just on :hover state*/
	display:block;
	position:absolute;
	top:15px;
	border:1px solid #000;
	background-color: #F1DDFF;
	color: #000;
	padding: 3px;
	width: 250px;
	visibility: visible;
}

.popuptext  {
	border-bottom: dashed; 
	border-bottom-width: 1px;
	cursor: help;
}

/*------------------------------------------------------------------------------------------------------*/
/*   Top navigation bar style                                                                           */
/*   default lightblue diamond layout                                                                      */
/*------------------------------------------------------------------------------------------------------*/

#topnav {
	background-color: #222222;
	width: 100%;
	padding-top: 0px;
	padding-bottom: 5px;
	margin-bottom: 25px;
	font-weight: bold;
	font-size: .9em;
	clear: both;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
}

#topnav_blue {
	background-color: #88BBCC;
	width: 100%;
	padding-top: 0px;
	padding-bottom: 5px;
	margin-bottom: 25px;
	font-weight: bold;
	font-size: .9em;
	clear: both;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
}
	
#topnav img, #topnav_blue img {
		padding-left: 5px;
}
	
#topnav a:link, #topnav a:visited, #topnav_blue a:link, #topnav_blue a:visited {
		color: white;
		margin-right: 8px;
		text-decoration: none;
}
	
#topnav a:hover, #topnav a:active, #topnav_blue a:hover, #topnav_blue a:active {
		color: #9AA8B4;
		text-decoration: underline;
		margin-right: 8px;
}

/*------    Top main navigation bar styles for use when "buttons" are desired    ------------*/

#topnavbuttons {
	margin-bottom: 23px;
}

#topnavbuttons ul {
	padding-left: 0;
	margin-left: 0;
	background-color: #222;
	color: white;
	font-weight: bold;
	font-size: .9em;
	float: left;
	width: 100%;
	margin-top: -2px;
	margin-bottom: 3px;
	border-top-width: 1px;
	border-right-width: 0px;
	border-bottom-width: 1px;
	border-left-width: 0px;
	border-top-style: solid;
	border-right-style: none;
	border-bottom-style: solid;
	border-left-style: none;
	border-top-color: #fff;
	border-bottom-color: #fff;
}

#topnavbuttons ul li { 
	display: inline; 
	}

#topnavbuttons ul li a {
	padding: 0.37em .91em;
	background-color: #222;
	color: white;
	text-decoration: none;
	float: left;
	border-right: 1px solid #fff;
}

#topnavbuttons ul li a:hover {
	background-color: #049;
	color: #9AA8B4;
	text-decoration: underline;
}


/*------------------------------------------------------------------------------------------------------*/
/*   Top sub-navigation bar style                                                                       */
/*------------------------------------------------------------------------------------------------------*/

#subnav {
	background-color: #666666;
	font-weight: bold;
	font-size: 1.1em;
	width: 100%;
	padding-top: 4px;
	padding-bottom: 5px;
	text-indent: 5px;
	margin-top: -26px;
	margin-bottom: 25px;
	color: white;
}
	
#subnavasparagus {
	background-color: #7D8F70;
	font-weight: bold;
	font-size: 1.1em;
	width: 100%;
	padding-top: 4px;
	padding-bottom: 5px;
	text-indent: 5px;
	margin-top: -26px;
	margin-bottom: 25px;
	color: white;
}
#subnavecru {
	background-color: #B2A670;
	font-weight: bold;
	font-size: 1.1em;
	width: 100%;
	padding-top: 4px;
	padding-bottom: 5px;
	text-indent: 5px;
	margin-top: -26px;
	margin-bottom: 25px;
	color: white;
}
#subnavgrey {
	background-color: #666666;
	font-weight: bold;
	font-size: 1.1em;
	width: 100%;
	padding-top: 4px;
	padding-bottom: 5px;
	text-indent: 5px;
	margin-top: -26px;
	margin-bottom: 25px;
	color: white;
}
#subnavltgrey {
	background-color: #A29B95;
	font-weight: bold;
	font-size: 1.1em;
	width: 100%;
	padding-top: 4px;
	padding-bottom: 5px;
	text-indent: 5px;
	margin-top: -26px;
	margin-bottom: 25px;
	color: white;
}#subnavolive {
	background-color: #8B7D3E;
	font-weight: bold;
	font-size: 1.1em;
	width: 100%;
	padding-top: 4px;
	padding-bottom: 5px;
	text-indent: 5px;
	margin-top: -26px;
	margin-bottom: 25px;
	color: white;
}
#subnavherringblue {
	background-color: #5a6b9c;
	font-weight: bold;
	font-size: 1.1em;
	width: 100%;
	padding-top: 4px;
	padding-bottom: 5px;
	text-indent: 5px;
	margin-top: -26px;
	margin-bottom: 25px;
	color: white;
}
#subnavvolcanooceanblue {
	background-color: #3c4d4f;
	font-weight: bold;
	font-size: 1.1em;
	width: 100%;
	padding-top: 4px;
	padding-bottom: 5px;
	text-indent: 5px;
	margin-top: -26px;
	margin-bottom: 25px;
	color: white;
}
#subnavlakeblue {
	background-color: #0CA0BE;
	font-weight: bold;
	font-size: 1.1em;
	width: 100%;
	padding-top: 4px;
	padding-bottom: 5px;
	text-indent: 5px;
	margin-top: -26px;
	margin-bottom: 25px;
	color: white;
}
#subnavoceanblue {
	background-color: #3D8DCC;
	font-weight: bold;
	font-size: 1.1em;
	width: 100%;
	padding-top: 4px;
	padding-bottom: 5px;
	margin-top: -26px;
	margin-bottom: 25px;
	color: white;
	text-indent: 5px;
}
#subnavblue {
	background-color: #456077;
	font-weight: bold;
	font-size: 1.1em;
	width: 100%;
	padding-top: 4px;
	padding-bottom: 5px;
	margin-top: -26px;
	margin-bottom: 25px;
	color: white;
	text-indent: 5px;
}
#subnavbabyblue {
	background-color: #7491A1;
	font-weight: bold;
	font-size: 1.1em;
	width: 100%;
	padding-top: 4px;
	padding-bottom: 5px;
	margin-top: -26px;
	margin-bottom: 25px;
	color: white;
	text-indent: 5px;
}
#subnavstreamblue {
	background-color: #5B6B6C;
	font-weight: bold;
	font-size: 1.1em;
	width: 100%;
	padding-top: 4px;
	padding-bottom: 5px;
	margin-top: -26px;
	margin-bottom: 25px;
	color: white;
	text-indent: 5px;
}
#subnavperiwinkle {
	background-color: #5D88BF;
	font-weight: bold;
	font-size: 1.1em;
	width: 100%;
	padding-top: 4px;
	padding-bottom: 5px;
	margin-top: -26px;
	margin-bottom: 25px;
	color: white;
	text-indent: 5px;
}
#subnavsteelblue {
	background-color: #366978;
	font-weight: bold;
	font-size: 1.1em;
	width: 100%;
	padding-top: 4px;
	padding-bottom: 5px;
	margin-top: -26px;
	margin-bottom: 25px;
	color: white;
	text-indent: 5px;
}
#subnavburntorange {
	background-color: #c36000;
	font-weight: bold;
	font-size: 1.1em;
	width: 100%;
	padding-top: 4px;
	padding-bottom: 5px;
	margin-top: -26px;
	margin-bottom: 25px;
	color: white;
	text-indent: 5px;
}
#subnavcaramel {
	background-color: #A3613B;
	font-weight: bold;
	font-size: 1.1em;
	width: 100%;
	padding-top: 4px;
	padding-bottom: 5px;
	margin-top: -26px;
	margin-bottom: 25px;
	color: white;
	text-indent: 5px;
}
#subnavmaroon {
	background-color: #5B2B1E;
	font-weight: bold;
	font-size: 1.1em;
	width: 100%;
	padding-top: 4px;
	padding-bottom: 5px;
	margin-top: -26px;
	margin-bottom: 25px;
	color: white;
	text-indent: 5px;
}
#subnavseaicegreen {
	background-color: #516F68;
	font-weight: bold;
	font-size: 1.1em;
	width: 100%;
	padding-top: 4px;
	padding-bottom: 5px;
	margin-top: -26px;
	margin-bottom: 25px;
	color: white;
	text-indent: 5px;
}
#subnavchumgreen {
	background-color: #747e5b;
	font-weight: bold;
	font-size: 1.1em;
	width: 100%;
	padding-top: 4px;
	padding-bottom: 5px;
	margin-top: -26px;
	margin-bottom: 25px;
	color: white;
	text-indent: 5px;
}
#subnavsage {
	background-color: #9DA878;
	font-weight: bold;
	font-size: 1.1em;
	width: 100%;
	padding-top: 4px;
	padding-bottom: 5px;
	margin-top: -26px;
	margin-bottom: 25px;
	color: #000000;
	text-indent: 5px;
}
#subnavdkteal {
	background-color: #466253;
	font-weight: bold;
	font-size: 1.1em;
	width: 100%;
	padding-top: 4px;
	padding-bottom: 5px;
	margin-top: -26px;
	margin-bottom: 25px;
	color: #FFFFFF;
	text-indent: 5px;
}
#subnavltorange {
	background-color: #EFAE5B;
	font-weight: bold;
	font-size: 1.1em;
	width: 100%;
	padding-top: 4px;
	padding-bottom: 5px;
	margin-top: -26px;
	margin-bottom: 25px;
	color: #000000;
	text-indent: 5px;
}
#subnavbladegreen {
	background-color: #9ab698;
	font-weight: bold;
	font-size: 1.1em;
	width: 100%;
	padding-top: 4px;
	padding-bottom: 5px;
	margin-top: -26px;
	margin-bottom: 25px;
	color: #000000;
	text-indent: 5px;
}
#subnavtundragreen {
	background-color: #A5A580;
	font-weight: bold;
	font-size: 1.1em;
	width: 100%;
	padding-top: 4px;
	padding-bottom: 5px;
	margin-top: -26px;
	margin-bottom: 25px;
	color: #000000;
	text-indent: 5px;
}
#subnavglacierblue {
	background-color: #CCDDEE;
	font-weight: bold;
	font-size: 1.1em;
	width: 100%;
	padding-top: 4px;
	padding-bottom: 5px;
	text-indent: 5px;
	margin-top: -26px;
	margin-bottom: 25px;
	color: white;
}

#subnav a:link, #subnav a:visited, #subnavasparagus a:link, #subnavasparagus a:visited, #subnavecru a:link, #subnavecru a:visited, #subnavgrey a:link, #subnavgrey a:visited, #subnavltgrey a:link, #subnavltgrey a:visited, #subnavolive a:link, #subnavolive a:visited, #subnavherringblue a:link, #subnavherringblue a:visited, #subnavlakeblue a:link, #subnavlakeblue a:visited, #subnavoceanblue a:link, #subnavoceanblue a:visited, #subnavstreamblue a:link, #subnavstreamblue a:visited, #subnavblue a:link, #subnavblue a:visited, #subnavbabyblue a:link, #subnavbabyblue a:visited, #subnavperiwinkle a:link, #subnavperiwinkle a:visited, #subnavsteelblue a:link, #subnavsteelblue a:visited, #subnavburntorange a:link, #subnavburntorange a:visited, #subnavcaramel a:link, #subnavcaramel a:visited, #subnavcaramel a:visited, #subnavmaroon a:link, #subnavseaicegreen a:link, #subnavseaicegreen a:visited, #subnavsage a:link, #subnavsage a:visited, #subnavdkteal a:link, #subnavdkteal a:visited, #subnavltorange a:link, #subnavltorange a:visited, #subnavbladegreen a:link, #subnavbladegreen a:visited, #subnavtundragreen a:link, #subnavtundragreen a:visited, #subnavglacierblue a:link, #subnavglacierblue a:visited,{
	color: white;
	margin-right: 8px;
	text-decoration: none;
	margin-left: 5px;
}
	
#subnav a:hover, #subnav a:active, #subnavasparagus a:hover, #subnavasparagus a:active, #subnavecru a:hover, #subnavecru a:active, #subnavgrey a:hover, #subnavgrey a:active, #subnavltgrey a:hover, #subnavltgrey a:active, #subnavolive a:hover, #subnavolive a:active, #subnavherringblue a:hover, #subnavherringblue a:active, #subnavlakeblue a:hover, #subnavlakeblue a:active, #subnavoceanblue a:hover, #subnavoceanblue a:active, #subnavstreamblue a:hover, #subnavstreamblue a:active, #subnavblue a:hover, #subnavblue a:active, #subnavbabyblue a:hover, #subnavbabyblue a:active, #subnavperiwinkle a:hover, #subnavperiwinkle a:active, #subnavsteelblue a:hover, #subnavsteelblue a:active, #subnavburntorange a:hover, #subnavburntorange a:active, #subnavcaramel a:hover, #subnavcaramel a:active, #subnavmaroon a:hover, #subnavmaroon a:active, #subnavseaicegreen a:hover, #subnavseaicegreen a:active, #subnavsage a:hover, #subnavsage a:active, #subnavdkteal a:hover, #subnavdkteal a:active, #subnavltorange a:hover, #subnavltorange a:active {
	color: #9AA8B4;
	margin-right: 8px;
	margin-left: 5px;
	text-decoration: underline;
}

/*------------------------------------------------------------------------------------------------------*/
/*   Left sidebar style                                                                                 */
/*------------------------------------------------------------------------------------------------------*/

#leftbar a:visited  {
		text-decoration: none;
		color:#722072;
}	
	
#leftbar a:hover, #leftbar a:active, #leftbar ul li a:hover, #leftbar ul li a:active, #leftbar ul li ul li a:hover, #leftbar ul li ul li a:active {
		text-decoration: underline;
}

/*---------   General styles for the left side area, and for paragraphs, and for the H2 level headings    ----------*/
#leftbar {
	border-right: 1px solid gray;
	font-size: .9em;
	margin-left: 5px;	
	margin-right: 20px;
	padding-right: 15px;
	margin-bottom: 20px;
   	width: 200px;
}

#leftbar p {
	margin-top:.5em;
	margin-bottom:.5em
}

/*---------   This is the default leftbar header, which is the gradient blue, with white text. If you change to a different color text, also change the background color to match.    -------*/
#leftbar h1 {
	background-color: #8E7966;
	padding: 4px;
	color: #ffffff;
	margin-top: 12px;
	margin-bottom: 10px;
}
#leftbar h2 {
	background-color: #988377;
	font-size: 100%;
	padding: 4px;
	font-weight: bold;
	color: #ffffff;
	margin-top: 12px;
	margin-bottom: 10px;
}

/*---------   Lists in the left bar need lots of reformatting, especially horizontal and vertical spacing, and it has to extend down to 3 nested levels.   ----------*/
#leftbar ul, #leftbar ul li, #leftbar ul li ul li {
	list-style-type: none;
	color: #333333;
	padding-left: 0px;
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: 5px;
}

#leftbar ul {
	margin-bottom: 15px;
}
	
#leftbar ul li a:link {
	text-decoration: none;
}
	
#leftbar ul li ul li {
	list-style-type: disc;
	font-weight: normal;
	line-height: 1.2em;
	color: #333333;
	padding-top: 2px;
	margin-bottom: 1px;
	margin-left: 15px;		
}
	
#leftbar ul li ul li ul li {
	list-style-type: circle;
	margin-left: 10px;	
}
	
#leftbar ul li ul {
	margin-bottom: 0px;
}
	
#leftbar ul li ul li a:link, #leftbar ul li ul li  {
	text-decoration: none;
}

#leftbar li ul li {	list-style-image: url('http://alaska.usgs.gov/images/icons/blueberry_square_icon.gif'); }

/*--------For those where we are using different CSS than 'leftbar', such as Biology's 'leftbarproj'.
----------They do not have the vertical line on the right-side.  Using this gives that right, vertical line------*/
#leftbar_verticalrightline { 	border-right: 1px solid gray; }
/*------------------------Old list bullet (blue diamond)---------------------------------------------
#leftbar li ul li {	list-style-image: url('http://www.usgs.gov/frameworkfiles/images/icons/dotblue7.gif'); }
-----------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------------*/
/*   Footer style                                                                                       */
/*------------------------------------------------------------------------------------------------------*/

#linksfooterbar {
	width: 100%;
	background-color: #cccccc;
	padding-top: 2px;
	padding-bottom: 3px;
	clear: both;
	margin-bottom: 0px;
}

#linksfooterbar a:link, #linksfooterbar a:visited {
	margin-left: 4px;
	margin-right: 32px;
	color: #111111;
	text-decoration: none;
}

#linksfooterbar a:hover {
	margin-left: 4px;
	margin-right: 32px;
	color: #ffffff;
	text-decoration: underline;
}

#linksfooterbar a:active {
	margin-left: 4px;
	margin-right: 32px;
	color: #111111;
	text-decoration: none;
}


/*------------------------------------------------------------------------------------------------------*/
/*   Text styles                                                                                        */
/*------------------------------------------------------------------------------------------------------*/

.smaller  {font-size: 90%;}
.larger  {font-size: 120%;}
.bold {font-weight: bold;}
.italics {font-style: italic;}
.underline {text-decoration:underline}

.alignleft {text-align: left;}
.alignright {text-align: right;}
.center {text-align: center;}
.middle {vertical-align: middle;}
	
.indentfirstline {
	padding-left: -25px;
	text-indent: 25px;
}
.outdent {
	padding-left: 25px;
	text-indent: -25px;
}
.reference {
	  margin-left: 3em;
      text-indent: -3em;
      margin-right: 3em;
}  


/*----   TOC Indenting. Updated HAP 2/27/08. 3/08: Indents were not working if lines were in the #mainbody area of a table, had to add another set of them.  ----*/
.indent1 {margin-left: 0em;  margin-top: .1em; margin-bottom: 0em;}   
.indent2 {margin-left: 2em;  margin-top: .1em; margin-bottom: 0em;}  
.indent3 {margin-left: 4em;  margin-top: .1em; margin-bottom: 0em;}      
.indent4 {margin-left: 6em;  margin-top: .1em; margin-bottom: 0em;}  
.indent5 {margin-left: 8em;  margin-top: .1em; margin-bottom: 0em;}  
.indent6 {margin-left: 10em;  margin-top: .1em; margin-bottom: 0em;}  

#mainbody .indent1 {margin-left: 0em;  margin-top: .1em; margin-bottom: 0em;}   
#mainbody .indent2 {margin-left: 2em;  margin-top: .1em; margin-bottom: 0em;}  
#mainbody .indent3 {margin-left: 4em;  margin-top: .1em; margin-bottom: 0em;}      
#mainbody .indent4 {margin-left: 6em;  margin-top: .1em; margin-bottom: 0em;}  
#mainbody .indent5 {margin-left: 8em;  margin-top: .1em; margin-bottom: 0em;}  
#mainbody .indent6 {margin-left: 10em;  margin-top: .1em; margin-bottom: 0em;}  

/*----  Heading styles, generally for #mainbody  ----*/
h1 {
	color: #000000;
	font-size: 140%;
	margin-top: 0px;
}
	
h2 {
	color: #000000;
	font-size: 110%;
	margin-top: 20px;
	margin-bottom: -5px;
}
	
h3 {
	color: #000000;
	font-size: 95%;
	margin-bottom: -5px;
}
	
h4 {
	color: #000000;
	margin-bottom: -5px;
	font-size: 85%;
}
	
h5 {
	color: #000000;
	margin-bottom: -5px;
	font-size: 80%;
}
	
h6 {
	color: #000000;
	margin-bottom: -5px;
	font-size: 80%;
}

/*----  Margins, padding  ----*/
marginbottom10 {
	margin-bottom: 10px;
}

/*------------------------------------------------------------------------------------------------------*/
/*   Image styles                                                                                       */
/*------------------------------------------------------------------------------------------------------*/

img {
	border: none;
}

/*----  Center an image horizontally, on its own line  ----*/
.imgcenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

/*----  Use class=picleft/picright to float an image inside of a text paragraph (apply style to image) or DIV element (apply style to DIV).
		Use DIV if you want to include a caption with the image ----*/
.picleft  {
	float: left;
	margin-right: 12px;
}

.picright {
	float: right;
	margin-left: 12px;
}

/*----  Caption styles for text when enclosed in a picleft/picright DIV   ----*/
.picleft p, .picright p {
	font-size: 75%;
	margin-bottom: 15px;
	line-height: 1.2em;
	margin-top: 2px;
	text-align: left;
}

/*----  Get pictures/text to format consistently below H-level headings  ----*/
h2 + .picleft, h3 + .picleft, h4 + .picleft, h5 + .picleft  {
	float: left;
	margin-right: 12px;
	margin-top: 20px;
}

h2 + .picright, h3 + .picright, h4 + .picright, h5 + .picright  {
	float: right;
	margin-left: 12px;
	margin-top: 20px;
}

/*     * html is used for properties that only MSIE6 can understand.      */           
* html .picleft, * html .picright {
	margin-top: 12px;
}


/*----  Use class=picleftborder/picrightborder to frame an image and float it inside of a text paragraph.
		Only apply this style to image 
		To have a framed image inside a DIV with a caption, set the DIV class to picleft/picright and set the image class 		               to "addborder" ----*/	
.picleftborder{
	float: left;
	border-top: 1px solid #D9E0E6;
	border-right: 1px solid #C8CDD2;
	border-bottom: 1px solid #C8CDD2;
	border-left: 1px solid #D9E0E6;	
	padding: 4px;
	margin-right: 10px;
}

.picrightborder{
	float: right;
	border-top: 1px solid #D9E0E6;
	border-right: 1px solid #C8CDD2;
	border-bottom: 1px solid #C8CDD2;
	border-left: 1px solid #D9E0E6;	
	padding: 4px;
	margin-right: 10px;
}



/*------------------------------------------------------------------------------------------------------*/
/*   Color styles                                                                                       */
/*------------------------------------------------------------------------------------------------------*/

.white { color: #fff;}
.black { color: #000;}
.blue {	color: #0033aa;}
.greymed { color: #666666;}
.greydark { color: #414141;}
.red { color: #FF0000;}
.red2 { color: #E81818;}
.deepred { color: #D13F3F;}
.fuschia { color: #992255;}
.green { color: #229922;}
.brown { color: #7c4f3f;}
.purple { color: #722072;}
.gold { color: #797909;}
.liteburgundy { color: #8B433E; }
.dkrose { color: #B04A3E; }

/*--------------------------------------------------------------------------------------*/
/* ----- Styles to format list item bullets  --------  */
.listdotblue {
	list-style-image: url('http://www.usgs.gov/frameworkfiles/images/icons/dotblue7.gif');
}
.listdotgreen {
	list-style-image: url('http://www.usgs.gov/frameworkfiles/images/icons/dotgreen7.gif');
}
.listdotbrown {
	list-style-image: url('http://www.usgs.gov/frameworkfiles/images/icons/dotbrown7.gif');
}
.listdotcyan {
	list-style-image: url('http://www.usgs.gov/frameworkfiles/images/icons/dotcyan7.gif');
}
.listdotyellow {
	list-style-image: url('http://www.usgs.gov/frameworkfiles/images/icons/dotyellow7.gif');
}
/*----     Background colors for elements, such as for table cells. These styles are generally light in shade. These styles are not meant for heading backgrounds (those are further down).   ----*/
.backgreylight {
	background-color: #f6f6f6;}
.backgreymedium {
	background-color: #d4d4d4;}
.backgreydark {
	background-color: #777777;}
.backgreydarker {
	background-color: #4a4a4a;}
.backbrowndark {
	background-color: #a29482;}
.backbrownmedium {
	background-color: #d3c4a5;}
.backbrownlight {
	background-color: #faeac5;}
.backbluedark {
	background-color: #114499;}
.backbluemedium {
	background-color: #88aaee;}
.backbluelight {
	background-color: #bbd6fa;}
.backgreendark {
	background-color: #206528;}
.backgreenmedium {
	background-color: #82d082;}
.backgreenlight {
	background-color: #cff4d8;}
.backtealdark {
	background-color: #304c6a;}
.backtealmedium {
	background-color: #708cbf;}
.backteallight {
	background-color: #90acca;}
.backtealverylight {
	background-color: #b0ccea;}
	
/*----     Heading colors. These styles are generally meant for colorizing headings, as they add color to the heading text, background area, and add padding around the text.   ----*/
.headblue {
	background-color: #004499; padding: 4px; color: #ffffff;}
.headburgundy {
	background-color: #4c0722; padding: 4px; color: #ffffff;}
.headgreen {
	background-color: #005528; padding: 4px; color: #ffffff;}
.headlightbrown {
	background-color: #905010; padding: 4px; color: #ffffff;}
.headdarkbrown {
	background-color: #4b3520; padding: 4px; color: #ffffff;}
.headgold {
	background-color: #9f8522; padding: 4px; color: #ffffff;}
.headverylightgrey {
	background-color: #d4d4d4; padding: 4px; color: #222222;}
.headlightgrey {
	background-color: #a2a2a2; padding: 4px; color: #222222;}
.headgrey {
	background-color: #747474; padding: 4px; color: #ffffff;}
.headdarkgrey {
	background-color: #444444; padding: 4px; color: #ffffff;}
.headolive {
	background-color: #444411; padding: 4px; color: #ffffff;}
.headpurple {
	background-color: #621062; padding: 4px; color: #ffffff;}
.headtan {
	background-color: #82643c; padding: 4px; color: #ffffff;}
.headteal {
	background-color: #304c6a; padding: 4px; color: #ffffff;}
.headcornflower {
	background-color: #336B90; padding: 4px; color: #ffffff;} 
.headlitecornflower {
	background-color: #6796B5; padding: 4px; color: #ffffff;} 
.headpeach {
	background-color: #E5CDB3; padding: 4px; color: #ffffff;} 
.headtan {
	background-color: #CAA173; padding: 4px; color: #ffffff;} 
.headburntorange {
	background-color: #9E7B55; padding: 4px; color: #ffffff;} 
.headbutterscotch {
	background-color: #B07A3E; padding: 4px; color: #ffffff;} 
.headdkrose {
	background-color: #B04A3E; padding: 4px; color: #ffffff;} 
.headrose {
	background-color: #CA7C73; padding: 4px; color: #ffffff;} 
.headasparagus {
	background-color: #7D8F70; padding: 4px; color: #ffffff;} 
.headmossgreen {
	background-color: #A5B49A; padding: 4px; color: #ffffff;} 
.headblueberry {
	background-color: #6F808E; padding: 4px; color: #ffffff;} 
.headliteberry {
	background-color: #9AA8B4; padding: 4px; color: #ffffff;} 
.headgrape {
	background-color: #977778; padding: 4px; color: #ffffff;} 
.headlitegrape {
	background-color: #BA9FA0; padding: 4px; color: #ffffff;} 
.headliteburgundy {
	background-color: #8B433E; padding: 4px; color: #ffffff;} 
.headchestnut {
	background-color: #B27470; padding: 4px; color: #ffffff;}
.headferngreen {
	background-color: #33733C; padding: 4px; color: #ffffff;} 
.heademerald {
	background-color: #66A26E; padding: 4px; color: #ffffff;} 
.headmint {
	background-color: #AAD0AF; padding: 4px; color: #ffffff;} 
.headsteelblue {
	background-color: #366978; padding: 4px; color: #ffffff;} 
.headcolumbiablue {
	background-color: #6897A5; padding: 4px; color: #ffffff;} 
.headmajorelleblue {
	background-color: #334272; padding: 4px; color: #ffffff;}
.headolive {
	background-color: #8B7D3E; padding: 4px; color: #ffffff;} 
.headecru {
	background-color: #B2A670; padding: 4px; color: #ffffff;}
.headlitepurple {
	background-color: #746E8C; padding: 4px; color: #ffffff;}
.headgreenteal {
	background-color: #6F8E7E; padding: 4px; color: #ffffff;}
.headasparagus {
	background-color: #7D8F70; padding: 4px; color: #ffffff;}
.headcamo {
	background-color: #989477; padding: 4px; color: #ffffff;}
.headlilac {
	background-color: #94747F; padding: 4px; color: #ffffff;}
.headlitetaupe {
	background-color: #988377; padding: 4px; color: #ffffff;}
.headyaleblue {
	background-color: #2E6081; padding: 4px; color: #ffffff;}
.headpurpletaupe {
	background-color: #514D62; padding: 4px; color: #ffffff;}
.headfeldgrau {
	background-color: #4D6257; padding: 4px; color: #ffffff;}
.headdarkasparagus {
	background-color: #56624D; padding: 4px; color: #ffffff;}
.headdarkcamo {
	background-color: #64614C; padding: 4px; color: #ffffff;}
.headeggplant {
	background-color: #634C54; padding: 4px; color: #ffffff;}
.headmedtaupe {
	background-color: #64544C; padding: 4px; color: #ffffff;}
.headdarkblueberry {
	background-color: #5B6974; padding: 4px; color: #ffffff;}
.headltmaroon {
	background-color: #A8796C; padding: 4px; color: #ffffff;}
.headltmaroon {
	background-color: #BFCFD8; padding: 4px; color: #000000;}

	
/*----   Color slice for background to make gradient bars   ----*/
.backgradientblue {
background-image: url('http://www.usgs.gov/frameworkfiles/images/icons/backgradientblue.jpg');
background-repeat: repeat-x; padding: 4px; color: #ffffff; background-color: #18215c;
}

.backgradientburgundy {
background-image: url('http://www.usgs.gov/frameworkfiles/images/icons/backgradientburgundy.jpg');
background-repeat: repeat-x; padding: 4px; color: #ffffff; background-color: #540b28;
}

.backgradientgreen {
background-image: url('http://www.usgs.gov/frameworkfiles/images/icons/backgradientgreen.jpg');
background-repeat: repeat-x; padding: 4px; color: #ffffff; background-color: #081406;
}

.backgradientlightbrown {
background-image: url('http://www.usgs.gov/frameworkfiles/images/icons/backgradientlightbrown.jpg');
background-repeat: repeat-x; padding: 4px; color: #ffffff; background-color: #57260b;
}

.backgradientdarkbrown {
background-image: url('http://www.usgs.gov/frameworkfiles/images/icons/backgradientdarkbrown.jpg');
background-repeat: repeat-x; padding: 4px; color: #ffffff; background-color: #322715;
}

.backgradientdarkgrey {
background-image: url('http://www.usgs.gov/frameworkfiles/images/icons/backgradientdarkgrey.jpg');
background-repeat: repeat-x; padding: 4px; color: #ffffff; background-color: #262626;
}

.backgradientgold {
background-image: url('http://www.usgs.gov/frameworkfiles/images/icons/backgradientgold.jpg');
background-repeat: repeat-x; padding: 4px; color: #ffffff; background-color: #483701;
}

.backgradientlightgrey {
background-image: url('http://www.usgs.gov/frameworkfiles/images/icons/backgradientlightgrey.jpg');
background-repeat: repeat-x; padding: 4px; color: #222222; background-color: #808080;
}

.backgradientolive {
background-image: url('http://www.usgs.gov/frameworkfiles/images/icons/backgradientolive.jpg');
background-repeat: repeat-x; padding: 4px; color: #ffffff; background-color: #30300f;
}

.backgradientpurple {
background-image: url('http://www.usgs.gov/frameworkfiles/images/icons/backgradientpurple.jpg');
background-repeat: repeat-x; padding: 4px; color: #ffffff; background-color: #460046;
}

.backgradienttan {
background-image: url('http://www.usgs.gov/frameworkfiles/images/icons/backgradienttan.jpg');
background-repeat: repeat-x; padding: 4px; color: #ffffff; background-color: #573920;
}

.backgradientteal {
background-image: url('http://www.usgs.gov/frameworkfiles/images/icons/backgradientteal.jpg');
background-repeat: repeat-x; padding: 4px; color: #ffffff; background-color: #1d3551;
}
.biophotobackeco {
	padding-left: 175px;
	float: left;
	background-image: url(../images/buttons/biology/ecosystems.png);
	width: 350px;
	height: 160px;
	background-color: #FFFFFF;
	background-repeat: no-repeat;
}
.biophotobackfish {
	padding-left: 175px;
	float: left;
	background-image: url(../images/buttons/biology/fisheries.png);
	width: 350px;
	height: 160px;
	background-color: #FFFFFF;
	background-repeat: no-repeat;
}
.biophotobackmam {
	padding-left: 175px;
	float: left;
	background-image: url(../images/buttons/biology/mammals.png);
	width: 350px;
	height: 160px;
	background-color: #FFFFFF;
	background-repeat: no-repeat;
}
.biophotobackbird {
	padding-left: 175px;
	float: left;
	background-image: url(../images/buttons/biology/birds.png);
	width: 350px;
	height: 160px;
	background-color: #FFFFFF;
	background-repeat: no-repeat;
}
.biophotobacktech {
	padding-left: 175px;
	float: left;
	background-image: url(../images/buttons/biology/technical.png);
	width: 350px;
	height: 160px;
	background-color: #FFFFFF;
	background-repeat: no-repeat;
}

/*---- Headbackground is a generic builder for a header with a colored background. Use it with the color (for text) and bgxxxx colors in the lines above to create your own heading boxes ----*/
.headbackground { width: 98%;  font-size: 110%; padding-left: 5px; padding-bottom: 3px; padding-top: 3px; font-weight: bold; margin-bottom:15px;  margin-top:30px; }