/* top right bottom left */

body {
	font-family:  "Comic Sans MS", Verdana, Arial,Helvetica,sans-serif;
	color: #885200;
	background-color: #FF8;
	overflow:hidden;
	height:100%;
	border:0px none;
}


.mgPlan {font-family:  Arial,Helvetica,sans-serif;
	color: black;
	background-color: white;
	padding: 5px 5px 5px 5px;
	margin: 5px 5px 5px 5px;
}

/* within the management plan, use ">em> got a species name */
.mgPlan h6 {font-size:medium}
.mgPlan .cap {font-family:Times, serif; font-size:smaller} /* captions for diagrams */
.mgPlan em {font-family:Times, serif; font-style:italic}

/*species, which the management plan uses .em for */
.sp {font-family:Times, serif; font-style:italic}


/* what does this do? It is an IE hack*/
html {
	height:100%;
	overflow:hidden;
	border: 0px none;
}

#main {
	margin:0;
	padding: 35px 0 0 5px; /*5px only works in opera IF the margin-left below is used....else no good)*/
	overflow:auto;
	text-align:left; /*remove justify */
	height:90%;
	/*margin-left: 170px; makes it good in opera, but not netscape */
}
/*#torso
{
	margin-left: 170px;
}*/



h1, h2, h3, p {
	margin:0;
	padding:0 10px 10px 10px;
} 

h1, h2, h3, h4 { 
	color:#644;
	background: transparent;
	padding:20px 10px 10px 10px;
}



/* this is necessary as images are not necessarily cleared when a new para or heading starts */
h1, h2, h3, h4, p {
clear:both
}

ul { margin: 0 0 0 2em; } /* left margin only, for the bullets */	

.compact h1, .compact h2, .compact h3, .compact h4
{ margin: 0 0 0 0 }

body {
	margin:0;
	padding:0;
	overflow:hidden;
}

/* MY STUFF */

.intHop, .nobull 
{
 list-style-type:none;
 margin-left:15px
}
 					
.refpage 
 {font-size:smaller; }
.nowrap
{clear:both}


/* default link (mainly internal links */

/* FIX THIS TO REFLECT:  the a:hover must always follow the a:link and the a:visited

" Note that the A:hover must be placed after the A:link and A:visited rules, since otherwise the cascading rules will hide the 'color' property of the A:hover rule. Similarly, because A:active is placed after A:hover, the active color (lime) will apply when the user both activates and hovers over the A element."
*/

a {color:olive; 
	 text-decoration:none; 
	 font-family:Arial,sans-serif;}
a:hover, a:active	{ text-decoration:underline;  }			 
a:visited  { color:olive;  }		

/* special links */
a.intLink, 
a.extLink, 
a.intHop  {color:olive; 
					 text-decoration:none; 
					 font-family:Arial,sans-serif;}
					 
a.intLink:hover, 
a.extLink:hover, 
a.intHop:hover	{ text-decoration:underline;  }		
	 
a.intLink:visited,  
a.extLink:visited, 
a.intHop:visited{ color:olive;  }				  

.toTop {
  text-align:right;	
}
.toTop a {
	color:olive;
	font-size:x-small;
	font-weight:normal;
	text-decoration:none; 
}	


/* end links */

/*start text styles */
.question {
font-style:italic
}

.quote {background: #ffc;
			  font-family:Verdana, sans-serif;
				width:90%;
				border:5px outset green ;
				padding: 10px;
				margin-left: 5%;
				margin-right:5%
}
.quote cite {font-weight:normal;} 	

.preamble {font-size:smaller;
					 margin:5px; 
					 border:1px outset black ;
					} 

.rederr {Border-style:solid; 
         border-color:red  ;
			  }					
					
					
/* thumbnail with caption - all max width and auto height */
.tn_cap	 {
		width: 200px; height: auto; 
		float: left; margin-right: 10px;
		text-align: center ;
		font-family: Arial; 
		font-size:smaller;
		color: black }

/*As above but no dimensions */
.cap	 {
		float: left; margin-right: 10px;
		text-align: center ;
		font-family: Arial; 
		font-size:smaller;
		color: black }		

/************************************************/
/* combined caps and stars                      */
/* Normal images have heading-coloured border   */
/************************************************/
img {
	margin:5px 10px 5px 10px;  
	border:2px solid black;
}
/* Link images have Green border */
a img {
	margin:5px 10px 5px 10px;  
	border:2px solid green;
}
.imgX  { float: left   ;
		text-align: center ;
		font-family: Arial; 
		font-size:smaller;
	}	

.imgP a          {color:yellow; }
.imgP a:visited  {color:yellow; }	
.imgL a          {color:yellow; }
.imgL a:visited  {color:yellow; }		

/* top-right margins of sarth/sartv must match img above */
/* sarth: StarsAlignedRightTopHorizontal                */
.starTRL 
	{
	  position: absolute;
	  top:5px;                   
		right: 15px;               
		font-size: larger;
		font-weight: bold;
		text-decoration: none;
		color: yellow;
		background-color: transparent;	
		border: 5px solid green;	
		border-style:none;
	}
/* sarth: StarsAlignedRightTopVertical               */
.starTRP
	{
	  position: absolute;
	  top:5px;                  
		right: 15px;              
		font-size: larger;
		font-weight: bold;
		text-decoration: none;
		color: yellow;
		background-color: transparent;		
		border: 5px solid green;
		border-style:none;
	}
	
/* div width = image width + 2x10 margins   */
/* sarth: StarsAlignedRightTopHorizontal    */
.imgL
	{
		position: relative;
		float: left; 
		width:220px;
		margin: 0px 10px 0px 10px;
		border: 1px solid red;
		border-style:none;
		text-align: center ;
		font-family: Arial; 
		font-size:smaller;	
    background-color: silver;			
		background-color: transparent;				
	}		
.imgP
	{
		position: relative;
		float: left; 
		width:170px;
		margin: 0px 10px 0px 0px;
		border: 1px solid red;
		border-style:none;
		text-align: center ;
		font-family: Arial; 
		font-size:smaller;		
	}	
/************************************************/
/* END combined caps and stars                  */
/* Normal images have heading-coloured border   */
/************************************************/


/* tn_v_c - for all horizontal images within a CONTAINER , tn_h applies to images*/
.tn_v_c img , .tn_v {
	width:150px ; height:200px;
}	
.tn_h_c img, .tn_h  {
	width:200px ; height:150px;
}	
.tn_vR_c img , .tn_vR  {
	width:150px ; height:200px; float:right ;
}	
.tn_hR_c img , .tn_hR  {
	width:200px ; height:150px; float:right ;
}		
.tn_vL_c img  , .tn_vL  {
	width:150px ; height:200px; float:left ;
}	
.tn_hL_c img  , .tn_hL  {
	width:200px ; height:150px; float:left ;
}		
		
.tn_montage_h img {		
	width:200px ; height:150px; 
	margin:0;
  border:0;
	padding:0;
	clear:both;
}		
.tn_montage_v img {		
	width:150px ; height:200px; 
	margin:0;
  border:0;
	padding:0;
	clear:both;
}		
/*----------------------*/
/*Normal images have heading-coloured border */
img {
	margin:5px 10px 0 10px;
	border:3px solid #644;
}
/* Link images have Green border */
a img {
	margin:5px 10px 0 10px;
	border:3px solid green;
}

/*.imgCentre {float:middle} */

/*----------------------*/

/*div { what is this all about?
	margin:0;
	padding:0;
}*/
/*	overflow:hidden;*/
#menu {
	margin:0;
	/*padding:10px;*/
	width:100px; /*100px;*/
	height:100%;
	background-color:#7a7;
	min-height:600px;
	float:left;
	z-index:200;
	color: #FF8;  /* the colour of the main background */
    }

#menu p,
#menu ul {
	list-style-type:none;
	font           : normal smaller Verdana,sans-serif;
	margin         : 0;
	padding        : 2px 2px;
}

#menu ul li a ,
#menu p a ,
#menu #cPage,
#menu #cAlbPage
{
  border    : 2px outset #9c9;
	width     : 90px;
	margin    : 2px 2px 3px;
	text-align: left;
	display   : block;
	padding   : 1px;
	color     : yellow;
	background-color: #03D05E;
	text-decoration : none;	
}

#menu #cPage
{
  border    : 2px outset yellow;
}


#menu li .lifeMenu #cPage 
#menu li .lifeMenu a, 
#menu li .albSpecies #cPage 
#menu li .albSpecies a,  
{
	width  : 82%;
	display: block;
	margin : 0 0 0 5px;
}



#menu p a:link,
#menu p a:visited,
#menu ul li a:link,
#menu ul li a:visited {
	color: #fff;
	background-color: #474;
	}

#menu p a:hover,
#menu p a:active,
#menu ul li a:hover,
#menu ul li a:active  {
	color:#474;
	background-color: #fff;
	font-weight:bold;
}
#menu li .grpNav 
{	
	width  : 85%;
	display: block;
	margin : 0 0 0 5px;
  border : 2px outset #9c9;
	background-color: #54A00F;
}

#menu li .grpNav a
{	
  padding : 0 0 0 0 ;
	border  : none;
	display : inline;
}

/*ensure no border on grouped life current page:*/
#menu .lifeMenu .grpNav #cPage
{
  border    : none;
	display   : inline;
	color     : yellow;
	text-decoration : none;	
	background-color: transparent;
}

#menu ul li .kingdom a:link,
#menu ul li .kingdom a:visited 
{
	color: #fff;
	background-color: #54A00F;
	}

#menu ul li .kingdom a:hover,
#menu ul li .kingdom a:active 
{
	color:#54A00F;
	background-color: #FFFEF7;
	font-weight:bold;
}

#menu ul li .albSpecies a:link,
#menu ul li .albSpecies a:visited ,
#menu ul li .albSpecies #cAlbPage
{
	border : 3px outset red;
	color  : #474;
	font-weight:bold;
	background-color: #75DD16;
	}

#menu ul li .albSpecies a:hover,
#menu ul li .albSpecies a:active 
{
	color:#474;
	background-color: #FFFEF7;
	font-weight:bold;
}
/*background-color: #C4FE3F;
/*IE Hack because using first-letter, even within a div way away from the menu, messes up the first letter */


/*
These are the colours it ought to be????
li#cPage:first-letter { color: #474; background-color:#FFFEF7; }*/ 
/* MENU DONE */

/*
#menu img {
	margin:5px 10px 0 10px;
	border:none;
}*/


/* i got no header 
#header {
	margin:0;
	padding:0 10px 0 0;
	border:0px none;
	height:10%;
	text-align:left;
	color:#666;
	z-index:-1;
}	
*/


#footer {
	margin:0;
	padding:0 10px 0 0;
	border:0px none;
	height:68px;
	text-align:left;
	color:#666;
	z-index:-1;
}	

#PrintFooter {
	display:none;
}

#WebFooter {
	text-align:left;
	font-family: Arial,sans-serif;
	color:olive;
	font-size: x-small;
	margin: 1em 0 0 0;
	padding: 0.5em 0;
	border-top: 1px solid #644;
	font-size:10pt;
	line-height:10pt;
	
}