/***************************** normalisation *****************************/
* { padding:0; margin:0 }

html,body {
	font-family:Verdana; font-size:62.5%; width:100%; height:100%;
	background: #ffffff; 
	text-align: center;
}

/***************************** layout *****************************/
#wrapper {
	position: relative; top: 0%;
	width: 1044px;
	margin: 0 auto;
	background: #ffffff;
}

#shadow-top{ 
	background: url("images/logos/shadow-top.png") no-repeat; height:33px; margin-top:-2px;
}

#shadow-mid{
	background:url("images/logos/shadow-mid.png") repeat-y;
	padding:0 10px; width: 1024px;
}

#shadow-bot{
	background:url("images/logos/shadow-bot.png") no-repeat;
	height:33px;
}

.block{ width:100%; float:left; clear:both;}

#header{ 
	background: url("images/logos/topbanner_nature.jpg") no-repeat; height:118px;
}

/***************************** navbar******************************/

#nav {  list-style-type:none;	
		margin-left: 0px;	
		padding:0; 
		height: 30px; 
		width:140px; }

#nav li { margin:2px; 	
		float:left; }

#nav li a { display: block;
		width: 140px;	
		padding:4px 0;	
		text-decoration:none;	
		text-align:center;	
		font-size:12px;
		font-weight:bold;	
		color:#FFFFFF;	
		background-color:#336699; }
		
#nav li a:hover, 
#nav li a.active { color:#333399;	
				background-color:#75A3D1; }


#menu { font-size: 12pt; text-align:left; margin: 10px; font-weight:bold; line-height:150% }
#menu a:hover,
#menu a.active { /*hover state CSS*/
text-decoration: none;
background-color: #E5FAFC;
}


.arrowlistmenu{
list-style-type: none;
width: 162px; /*width of accordion menu*/
}

.arrowlistmenu .menuheader{ /*CSS class for menu headers in general (expanding or not!)*/
font: bold 14px Arial;
color: #336699;
background: white url(titlebar.png) repeat-x center left;
margin-bottom: 5px; /*bottom spacing between header and rest of content*/
padding: 0px 0 0px 0px; /*header text is indented 0px*/
border-bottom: 1px solid #dadada;
cursor: pointer;
}

.arrowlistmenu .openheader{ /*CSS class to apply to expandable header when it's expanded*/
background: url(images/arrow_down.png) no-repeat center right; /*custom bullet list image*/
}

.arrowlistmenu .closeheader{ /*CSS class to apply to expandable header when it's expanded*/
background: url(images/arrow_right.gif) no-repeat center right; /*custom bullet list image*/
}

.arrowlistmenu ul{ /*CSS for UL of each sub menu*/
list-style-type: none;
margin: 0;
padding: 0;
margin-bottom: 5px; /*bottom spacing between each UL and rest of content*/
}

.arrowlistmenu ul li{
padding-bottom: 4px; /*bottom spacing between menu items*/
padding-top: 4px; /*top spacing between menu items*/
}

.arrowlistmenu ul li a{
color: #1C98B4;
display: block;
padding: 2px 0;
padding-left: 10px; /*link text is indented 10px*/
text-decoration: none;
font-weight: normal;
border-bottom: 1px solid #dadada;
font-size: 12px;
}

.arrowlistmenu ul li a:visited{
color: #1C98B4;
}

.arrowlistmenu ul li a:hover{ /*hover state CSS*/
color: #1C98B4;
background-color: #E5FAFC;
}

.arrowlistmenu a{
display: block;
}

.arrowlistmenu a:hover{ /*hover state CSS*/
text-decoration: none;
background-color: #E5FAFC;
}

/***************************** text *****************************/

.top        {  color: #ffffff; font-size:14pt; margin-left: 25px; }

.top2       {  color: #ffffff; font-size:10pt; margin-left: 10px; margin-right: 10px; font-weight: bold; }

.style1    { color: #336699; font-weight: bold; font-size: 12pt; }

.style2   { color: #000000; font-size: 10pt; }

.menu  { font-size: 12pt; text-align:left; padding-left: 15px; padding-top: 2px; margin-left: 5px; font-weight:bold; line-height:150% }

.plaintext   { color: #000000; font-size: 10pt; padding-left: 10px; padding-right: 10px }
.plaintext2   { color: #000000; font-size: 10pt; padding-left: 10px; padding-right: 10px; line-height:150% }

.smalltext   { color: #ffffff; font-size: 8pt; padding-left:5px; padding-right:5px; padding-top:5px; padding-bottom:5px; }
.smalltext2   { color: #000000; font-size: 8pt; padding-left:18px; padding-right:5px; padding-top:5px; padding-bottom:5px; }

a img
{
  border: none;
  vertical-align: middle;
  margin: 2px;
}


/**************************** pseudo classes ***********************/

a:link { 	color: #336699; font-weight:bold; text-decoration:none }

a:visited { color: #336699; font-weight:bold; text-decoration:none }

a:hover { color: #336699; font-weight:bold; text-decoration:underline }

a:active { color: #336699; font-weight:bold; text-decoration:underline }