/* Wild Carbon created Feb 2009 */	

body {text-align: center; 
behavior: url("csshover3.htc");}


/* href links appearance and behaviour: */
a img {border: none; } 
a {text-decoration: none; } 
a.nav:link {color: white ; text-decoration: none; }
a.nav:visited {color: white ; text-decoration: none; }
a.nav:hover {color: yellow ; text-decoration: overline; }
a.nav:active {color: yellow; text-decoration: none; }
a.navhot {color: #66cc33; text-decoration: overline; }

a.dark:link {color: #626262 ; text-decoration: none; }
a.dark:visited {color: #626262 ; text-decoration: none; }
a.dark:hover {color: #A2771A ; text-decoration: underline; }
a.dark:active {color: green; text-decoration: none; }

/* note: adjust based on 45em = 900px, 1em = 20px */

#head 	{
	width: 900px ; height: 7.5em; 
	position: relative ; 
	top: 1.25em; 
	margin: 0 auto; 
	border: solid #A2771A 0.1em; 
	border-top: solid #A2771A 0.05em; 
	border-bottom: solid 0em;
	}

#scene	{
	width: 100%;
	height: 1.5em;

	}

#headbin	{width: 100%;
	position: absolute;
	left:0px;
	top:0px;
	z-index:-1;
	}

img#headbin {width: 100%;}

#logolink {
	float: left; border: solid 0px; margin-top: -100px;}

#logolink a {	
	width: 175px;
	height: 100px;
	color: #fff;
	font-size: 1px;
	line-height: 1px;
	display: block;
	text-decoration: none;
	}


#header-nav {
	clear: both;
	top: 4.25em;
	font-family: Optima, sans-serif ; 
	font-size: 95% ;
	position: relative; 
	text-align: right ;
	margin-right: 10px;
	 }

#pictop 	{ 
	max-width: 100%;
	}

#contentbin {
	width: 880px; 
	padding: 10px; 	
	position: relative;  
	top: 22px; 
	margin: 0 auto; 
	margin-bottom: 10px;	
	border: solid #D2691E 2px; 
	border-top:  solid 0em; 

		}

#contentboard {  
	margin: 0 auto; 
	border: solid 0em; 
	text-align: left ; 
	font-size: 70%;
		}

#contentboard a {text-decoration: underline;}



/* ---------MAP PAGE --------*/

#mapheader {
	width: 880px; 
	padding: 10px; 	
	position: relative;  
	margin: 0 auto; 
	margin-bottom: 0px;	
	border: solid #D2691E 2px; 
	border-top:  solid 0em; 
	border-bottom: solid 0em;
	font-size: 70%; }

#contentbin-map {
	width: 880px; 
	padding: 10px; 	
	position: relative;  
	top: 0px; 
	margin: 0 auto; 
	margin-bottom: 10px;	
	border: solid #D2691E 2px; 
	border-top:  solid 0em; 
	font-size: 70%; 
	color: #D2691E;
		}

#mapboard {  
	margin: 0 auto;
	border: solid 0px;
	background-image: url(map.jpg);
	height: 374px;
	width: 693px;
		}

#mapspots a {	
	position: absolute;
	border: solid red 1px;
	background-color: yellow;
	height: 8px;
	width: 8px;	
	text-decoration: none;	
	}


#mapspots a span {display: none; }
#mapspots a:hover span { position: relative;  right: 250px; top: -130px; text-align: left; width: 200px; display: block; z-index: 100; }

#thumbframe {padding: 3px; width: 153px; height: 160px; border: solid #53534A 1px; }

a#koala { top: 320px; left:403px;}
	
a#monarch {top: 180px; left:622px;}

a#tamarin {top: 277px; left:727px;}

a#cotton-top {top: 221px; left:673px;}

a#puma {top: 170px; left:657px;}

a#puma, a#cotton-top, a#tamarin, a#monarch, a#koala 
	{
	text-decoration: none; 
	color: black; font-size: 100%; font-weight: bold; 
	padding: 2px; 
	opacity: 0.9; filter:alpha (opacity=90);
	}

/* -------- END MAP PAGE CSS ----------- */

/* not in use? */
#floatleft {
	float: left; 
	width: 420px;  
	margin: 0 auto; margin: 0px 10px 10px 0px; 
	border: 1px solid red; }

/* for page text headers */
h1 	{
	font-weight: bold;
	font-size: 150%;
	color: #684727;
	}

#binpic-right 	{ 
	float: right;
	width: 300px; 
	top: 0px; 
	margin: 0 auto; 
	margin: 0px 10px 0px 10px;

	}

#binpic-left	{ 
	float: left;
	width: 300px; 	
	top: 0px; 
	margin: 0 auto;
	margin: 0px 10px 0px 10px;
	border: solid 0px;
	}

#picright {
	max-width: 300px;
	padding: 5px; 
	border: 1px solid #aaa;	
	}

#clearfloat {clear: both; }

#frame { padding: 5px; border: 1px solid #CCD3E8; } 

#thumbs p { color: #684727; margin-left: -25px; margin-bottom: 2px ; text-align: right; font-size: 80%;}

/* thanks to Alen Grakalic at CSS Globe for the following code: */
/* thumbnail list */

	ul#thumbs, ul#thumbs li{
		margin:0;
		padding:0;
		list-style:none;
	}
	
	ul#thumbs li{
		float:left;
		margin-right:0.25em;
		border:0.05em solid #999;	
		padding:0.1em;
	}
	ul#thumbs a{
		display:block;
		float:left;
		width:7em;
		height:7em;
		line-height:7em;
		overflow:hidden;
		position:relative;
		z-index:1;		
	}
	ul#thumbs a img{
		float:left;
		position:absolute;
		top:-1em;
		left:-2.5em;	
	}
	
	/* mouse over */
	
		ul#thumbs a:hover{
			overflow:visible;
			z-index:1000;
			border:none;		
		}
		ul#thumbs a:hover img{
			border:1px solid #999;	
			background:#fff;
			padding:0.1em;			
		}	
	
	/* // mouse over */

	/* clearing floats */
	
		ul#thumbs:after, li#thumbs:after{
			content:"."; 
			display:block; 
			height:0; 
			clear:both; 
			visibility:hidden;
			}
		ul#thumbs, li#thumbs{
			display:block;
			}
		/*  \*/
		ul#thumbs, li#thumbs{
			min-height:1%;
			}
		* html ul#thumbs, * html li#thumbs{
			height:1%;
			}	
	
	/* // clearing floats */

/* END CSS Globe code with thanks */



#bottomstrip {
	position: relative ;
	margin-left: -12px;
	margin-bottom: -10px;
	text-align: center; 
	width: 900px; min-height: 30px; 
	background-color: #D2691E; 
	border: solid #D2691E 2px; 
	border-top: solid 0em;
	border-bottom: solid 0em;
	color: white;
	font-size: 14px; font-style: italic;
	line-height: 30px;

	}

.copyright 	{
	top: 15px;
	position: relative; 
	text-align: center ;
	font-family: Optima, sans-serif ; 
	color: #D2691E ; 
	font-size: 70% ;
	 }