@import url("./whitespace-reset.css");

body {
	font: normal 14px Arial, Helvetica, sans-serif;
	color: #333333;
	background: #b8b090; }

a {
	color: #006699;
	text-decoration: none; }
a:hover { text-decoration: underline; }

#sitewrapper {
	width: 972px;
	margin: 0 auto; }

#header {
	position: relative;
	height: 155px;
	background: transparent url("../images/bg_header.png") 0 0 no-repeat; }
	#header h1 {
		position: absolute;
		left: 31px;
		top: 17px;
		z-index: 1; }
		#header h1 a {
			display: block;
			width: 480px;
			height: 88px;
			text-indent: -8685px;
			outline: none;
			background: transparent url("../images/logo.jpg") 0 0 no-repeat; }
	#header ul#nav {
		position: absolute;
		left: 6px;
		top: 120px;
		z-index: 2;
		width: 963px;
		padding: 2px 0;
		background: #a3b26b; }
		#header ul#nav li {
			float: left;
			height: 26px;
			margin: 0 2px 0 0;
			background: transparent url("../images/bg_nav-right.gif") 100% 0 no-repeat; }
		#header ul#nav a {
			float: left;
			padding: 0 10px;
			line-height: 26px;
			font-weight: bold;
			text-transform: uppercase;
			color: #ffffff;
			background: transparent url("../images/bg_nav-left.gif") 0 0 no-repeat; }
		#header ul#nav a:hover { color: #ffee96; }
		#header ul#nav a.active { color: #ffee96; }
		#header ul#nav li.upload-photos a {
			padding: 0 10px;
			color: #948a6f;
			background: transparent url("../images/bg_upload-photos.gif") 0 0 no-repeat;
			width: 86%;}
	#header ul#subnav {
		position: absolute;
		left: 677px;
		top: 0;
		z-index: 2;
		padding: 0 6px 0 0;
		background: transparent url("../images/bg_subnav-right.gif") 100% 0 no-repeat; }
		#header ul#subnav li {
			float: left;
			padding: 4px 4px 6px 0;
			font-size: 12px;
			font-weight: bold;
			color: #887e5f; }
		#header ul#subnav li.first {
			padding-left: 10px;
			background: transparent url("../images/bg_subnav-left.gif") 0 0 no-repeat; }
		#header ul#subnav a { color: #887e5f; }
		#header ul#subnav a:hover { color: #000000; }\
		
div#headerLogo     {display: none; height: 0; padding: 0; margin: 0; visibility: hidden;}
div#headerLogo img {display: none; height: 0; padding: 0; margin: 0; visibility: hidden;}

#content {
	clear: both;
	float: left;
	width: 960px;
	padding: 25px 6px 0 6px;
	background: transparent url("../images/bg_content-repeat.gif") 0 0 repeat-y; }
	
/* OBA: new translation link area */
#translations         {position: relative; min-width: 920px; padding: 0px; text-align: right;}
#translations p       {text-align: right; padding-right: 20px;}
#englishTranslation   {display: block;}
#spanishTranslation   {display: none;}
#englishTitle         {display: block;}
#spanishTitle         {display: none;}
#englishLeftContent   {display: block;}
#spanishLeftContent   {display: none;}
#englishTopCaption    {display: block;}
#spanishTopCaption    {display: none;}
#englishBottomCaption {display: block;}
#spanishBottomCaption {display: none;}
#englishBottomContent {display: block;}
#spanishBottomContent {display: none;}

#englishContent  {display: block;}
#spanishContent  {display: none;}
#englishMessage  {display: block;}
#spanishMessage  {display: none;}
#englishPhoto1   {display: block;}
#spanishPhoto1   {display: none;}
#englishPhoto2   {display: block;}
#spanishPhoto2   {display: none;}
#englishPhoto3   {display: block;}
#spanishPhoto3   {display: none;}
#englishPhoto4   {display: block;}
#spanishPhoto4   {display: none;}
#englishPhoto5   {display: block;}
#spanishPhoto5   {display: none;}

#homepage-content {
	float: right;
	width: 436px;
	padding: 0 50px 0 40px; }
	#homepage-content h1 {
		padding: 0 0 15px 0;
		font-size: 24px;
		font-weight: normal;
		color: #644607; }
	#homepage-content p {
		padding: 0 0 15px 0;
		line-height: 150%; }
.photo-module {
	float: left;
	position: relative;
	width: 380px;
	padding: 4px;
	margin: 0 0 20px 44px;
	border: 1px solid #b8b090;
	background: #776b52; }
	.photo-module img { display: block; }
	.photo-module p {
		position: absolute;
		left: 4px;
		bottom: 4px;
		z-index: 1;
		width: 356px;
		padding: 5px 12px;
		font-size: 16px;
		color: #ffffff;
		background: transparent url("../images/bg_caption.png") repeat; }
		
.photo-gallery {
		padding: 0 0 20px 0;
		float: left;
		width: 225px;
		margin: 0;
		border: none;
		background: transparent; }
	.photo-gallery img { 
		display: block; 
		width: 200px;
		background: #feffec xpos="200";
		border: 1px solid #43200c;
	}
	.photo-gallery p {
			position: static;
			padding: 5px 0 0 0;
			font-size: 12px;
			color: #333333;
			background: transparent; }
	.photo-gallery-title {
		margin-bottom: -5px;
		font-weight: bold;
	}
	
	#main p.photo-gallery-text {
		padding-right: 20px;
	}

.gallery {
	float: left;

}

p #data_caption {
	text-align: center;
	font-weight: bold;
}
.photo-slideshow {
	height: 250px;
}
.photo-clear {
	
}
#homepage-modules {
	clear: both;
	float: left;
	width: 880px;
	padding: 0 0 20px 42px; }
	#homepage-modules .module {
		float: left;
		width: 172px;
		height: 200px;
		margin: 0 2px; }
		#homepage-modules .module img { display: block; }

p#footer {
	clear: both;
	padding: 20px 0 15px 5px;
	font-size: 11px;
	color: #ffffff;
	background: transparent url("../images/bg_content-bottom.gif") 0 0 no-repeat; }
	p#footer a {
		color: #ffffff;
		text-decoration: underline; }
	p#footer a:hover { color: #333333; }

/* Inner pages
------------*/
#sidebar {
	float: left;
	width: 179px;
	padding: 12px 0;
	border: 1px solid #d9d0af;
	border-width: 1px 1px 1px 0;
	background: #f9ea9a; }
	#sidebar h3 {
		padding: 0 10px 5px 10px;
		font: bold 12px Verdana, Geneva, sans-serif;
		text-transform: uppercase;
		color: #43200c; }
	#sidebar ul { padding: 0 0 40px 0; }
		#sidebar ul li {
			padding: 3px 0 3px 20px;
			font-size: 12px; }
		#sidebar ul li.active { background: #ffffff url("../images/blt_leaf.gif") 0px 50% no-repeat; }
		#sidebar ul li.t1 {
			font-weight: bold; }
		#sidebar ul li.t2 {
			padding: 3px 0 3px 40px; }
		#sidebar ul li.t3 {
			padding: 3px 0 3px 60px;
			font-size: 11px; }
		#sidebar ul li.t4 {
			padding: 3px 0 3px 80px;
			font-size: 11px;}
/*-----------------------*/

#main {
	float: left;
	width: 760px;
	padding: 0 0 0 20px; }
	#main h1 {
		padding: 3px 0 10px 0;
		font-size: 24px;
		font-weight: normal;
		color: #43200c; }
	#main p {
		padding: 0 50px 15px 0;
		line-height: 150%; }
	#main p.breadcrumbs { font-size: 12px; }
		#main p.breadcrumbs a { color: #43200c; }
		#main p.breadcrumbs a.current { color: #006699; }
	#main p img {
		margin: 0 0px 0 0px ;
		padding: 0 10px 0 10px;
	}
.kids-image img {
	margin: 0 0 0 10px;
}
#main-wide {
	clear: both;
	width: 700px;
	}

.left-col,
.right-col {
	float: left;
	width: 360px;
	padding: 0 20px 0 0; }
	#main .photo-module {
		padding: 0 0 20px 0;
		margin: 0;
		border: none;
		background: transparent; }
		#main .photo-module p {
			position: static;
			padding: 5px 0 0 0;
			font-size: 12px;
			color: #333333;
			background: transparent; }

#content h2 {
	padding: 0 0 10px 0;
	font-size: 16px;
	color: #666666; }
ul.spotlights {
	clear: both;
	float: left;
	width: 100%; }
	ul.spotlights li {
		float: left;
		clear: both;
		width: 350px;
		padding: 0 0 10px 0;
		margin: 0 40px 19px 0;
		border-bottom: 1px solid #d3d3d3; }
	ul.spotlights li.wide {
		width: 700px; }
	ul.spotlights li.even {
		clear: none;
		margin-right: 0; }
	ul.spotlights li.last { border: none; }
	ul.spotlights img { float: left; }
	ul.spotlights li.wide img { padding: 0 10px 0 0 }	
	ul.spotlights .details { margin: 0 0 0 100px; }
	ul.spotlights li.wide .details { margin: 0 0 0 310px; }	
	ul.spotlights h3 { padding: 0 0 7px 0; }
	ul.spotlights p { font-size: 12px; }
	ul.spotlights p.more { padding: 0; }

/* template 3a
------------*/
#content h2.hdr_spotlight {
	clear: both;
	padding: 0 0 20px 0;
	font-size: 22px;
	font-weight: normal;
	color: #333333; }
#main h3 {
	padding: 0 0 10px 0;
	font-size: 16px; }
.hrule {
	clear: both;
	width: 740px;
	margin: 0 0 25px 0;
	border-bottom: 1px solid #cccccc; }
	.hrule hr { display: none; }

/* Bios
-----*/
.bio-left {
	float: left;
	width: 350px;
	padding: 0 40px 20px 0; }
.bio-right {
	float: right;
	height: 280px;
	width: 350px;
	padding: 0 0 20px 0; }
	
	.bio-right a {
		font-weight: bold;
	}
	
ul.bio-pics {
	clear: both;
	float: left;
	width: 100%;
	padding: 0 0 20px 0; }
	ul.bio-pics li {
		float: left;
		padding: 0 14px 14px 0; }
	ul.bio-pics li.last { padding-right: 0; }
	ul.bio-pics img { 
		display: block; 
		border: 1px solid #43200c;
		}

/* Summary
--------*/
#main h2.hdr_summary {
	padding: 20px 0 10px 0;
	font-size: 22px;
	font-weight: normal;
	color: #333333; }
	
/* Species Summary Table page */
table.summary                  {width: 740px; margin: 0 0 30px 0; }
table.summary th               {text-align: left; }
table.summary th.specimens     {width: 110px; }
table.summary th.buttonHeader  {width: 70px; text-align: center;}
table.summary td               {padding: 3px 0px 0px 0px; background: #e0dbc2; border-bottom: 3px solid #feffec;}
table.summary td.specimens     {text-align: center; }
table.summary tfoot td         {font-weight: bold; background: #dddddd; }
table.summary td.buttonON      {text-align: center;}
table.summary td.buttonOFF     {text-align: center;}
table.summary td.buttonON img  {border: 0px; margin: 0px;}
table.summary td.buttonOFF img {border: 0px; margin: 0px; opacity:0.3; filter:alpha(opacity=30);}

table.exportFilters                  {width: 740px; margin: 4px 0 4px 0; color: #666; border: 1px solid #e0dbc2;}
table.exportFilters td               {padding: 3px 6px;}
table.exportFilters td.filterLabel   {color: #333; text-align: right; font-weight: bold; padding-right: 6px;}
table.exportFilters td.errorMessage  {color: #C00; text-align: center;}

table.exportSummary                  {width: 740px; margin: 10px 0 30px 0; color: #666; border: 1px solid #e0dbc2;}
table.exportSummary th               {text-align: center;}
table.exportSummary td               {padding: 3px 6px; border-bottom: 1px solid #e0dbc2; font-size: 8pt;}
table.exportSummary td p             {font-size: 10pt;}
table.exportSummary td.summaryTotal  {color: #666; text-align: left; border-bottom: 0px;}
table.exportSummary td.summaryButton {text-align: right;}
table.exportSummary td.exportComplete {text-align: center; color: #390; font-size: 12pt;}

/* mce editor fonts and styles */

.mce-arial-small {
	font-family: Arial;
	font-size: 14px;
}
.mce-arial-med {
	font-family: Arial;
	font-size: 18px;
}
.mce-arial-large {
	font-family: Arial;
	font-size: 22px;
}
.mce-georgia-small {
	font-family: Georgia;
	font-size: 14px;
}
.mce-georgia-med {
	font-family: Georgia;
	font-size: 18px;
}
.mce-georgia-large {
	font-family: Georgia;
	font-size: 22px;
}
.mce-comic-small {
	font-family: Comic Sans MS;
	font-size: 14px;
}
.mce-comic-med {
	font-family: Comic Sans MS;
	font-size: 18px;
}
.mce-comic-large {
	font-family: Comic Sans MS;
	font-size: 22px;
}

/* 
	items preceded with pc- are styles for pie charts.
	- garrett sullins
 */
#pc-wrapper { padding-right: 20px; }
	#pc-wrapper h2 { 
		font-size: 18px;
		color: #000000;
		font-weight: normal; }
	#pc-wrapper h3 { 
		text-decoration: underline;
		text-transform: uppercase; }
#pc-container { 
	width: 100%;
	float: left;
/*	padding: 10px 0; */
/*	background: #e0dbc2; */ }
	#pc-container img { 
		display: block;
		margin: 0 auto; }
	
#pc-button-container { 
	width: 100%;
	float: left;
	text-align: center;
	background: #d5d0b8; }
	#pc-button-container input[type="submit"] { margin: 5px 0; }
	
#pc-col-container{ 
	width: 100%;
	padding: 20px 0 0;
	clear: both; }
	#pc-col-container label { 
		width: 98%;
		float: left;
		padding: 0 2% 5px 0;
		clear: both;
		font-size: 10pt; }
	#pc-col-container input[type="checkbox"] { 
		float: left;
		margin: 0 5px 0 0; }

#pc-col-1{ 
	width: 69%;
	float: left;
	border-right: 1px solid #6f6f6f; }
#pc-col-2 { 
	width: 30%;
	float: left; }
	#pc-col-2 h2 { padding-left: 10%; }
	#pc-col-container #pc-col-2 label { 
		width: 60%;
		padding-left: 10%;
		float: left;
/*		clear: none;*/ }
	#pc-col-2 select { margin: 0 0 10px 10%; }
	
	#pc-col-container #pc-col-2 label.cropSlice {
		padding-left: 17%;
	}
#pc-col-2a { 
	width: 30%;
	float: left; }
	#pc-col-2a h2 { padding-left: 10%; }
	#pc-col-container #pc-col-2a label { 
		width: 60%;
		padding-left: 10%;
		float: left;
/*		clear: none;*/ }
	#pc-col-2a select { margin: 0 0 10px 10%; }
	
	#pc-col-container #pc-col-2a label.cropSlice {
		padding-left: 17%;
	}
	
.pc-col-1-subcol { 
	width: 33.3%;
	float: left; }
	
.clearer { clear: both; }

#pc-col-2a p.colorSwatch {
	padding: 0;
	width: 15px;
	height: 15px;
	float: right;
	background-color: #cc3300;
	cursor: crosshair;
}