@charset "utf-8";
* {/* it's good practice to zero global margin and padding values to account for differing browser defaults */
	padding: 0; 
	margin: 0;
}
body {
	font: 62.5% Helvetica, Arial, sans-serif;/*62.5% - sets browser default to 10px*/
	word-spacing: 0px;
	letter-spacing: 0px;
	background: #FFFFFF url(Imgs/Menu_BG.gif) repeat-y;
	
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	color: #000000;
}
h1, h2, h3, h4, h5, h6{
	font-weight: bold;
	font-size: 1.2em;
	margin: 0.6em 0 0.6em 0;
}
h1{
	font-size:1.6em;
	margin-top: 0.8em;
	color: #00642E;
}
h2{
	font-size:1.4em;
	margin-top: 0.7em;
	color: #00642E;
}
h3{
	font-size: 1.2em;
	margin-top: 0.6em;
	color: #00642E;
}
p{
	font-size: 1.2em;
	line-height:1.4em;
	margin:0 0 0.6em 0;
	padding: 0;
}
img{ /*(max image width in mainContent = ?px)*/
	margin: 0;
	padding: 0;
}
a {
	/*font-weight: bold;*/
	color: #00642E;
}
a:hover{
	color: #D96C00;
}
a img{
	border: none;
}
ul{
	list-style-type: disc;
	margin: 0;
	padding: 0;
	font-size: 1.2em;
}
li{
	margin: 0 0 0.5em 0;
}
input, textarea{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	/*background-color:#aec;
	border: 1px solid #000;*/
	padding: 0 0.2em;
}
input[type=image]{
/* attribute selectors don't work on older browsers so also need to override style on per input image basis (when a border is unacceptable, e.g. #search_butt) */
	border: none;
	padding: 0;
}
/* ---------- header boxes ---------- */
#skipNav{
/*places skip nav link off screen*/	
	position:absolute;
	top:-30px;
}
#container {
	width: 100%;  /* this will create a container 100% of the browser width */
	min-width: 770px; /* this prevents the rightBar from 'wrapping' at small window widths. Doesn't work with IE6 or less, hence the javascript file which replicates this behaviour. */
	max-width: 1296px;
	margin: 0 auto 0 0; /* the auto margins (in conjunction with a width) center the page */
	border: none;
	text-align: left; /* this overrides the text-align: center on the body element. */
}
#header {
	/* this div contains only the header logo*/ 
	background: #FFF url(Imgs/AccessBanner_BG.jpg) no-repeat 272px 0px;
	text-align: left;
	height: 98px;
	padding: 0px;
	border-bottom:1px solid #00642E;
}
#subHeader {
	/* this div contains only the site location form*/ 
	background: #FDC944 url(Imgs/LocationBar_BG.gif) repeat-x left bottom;
	padding: 0px;
}
.subHeaderLeft, .subHeaderRight{
	background-color: transparent;
	background-repeat: no-repeat;
	background:url(Imgs/LocationBar_left.gif) no-repeat left bottom;
}
.subHeaderRight{
	background:url(Imgs/LocationBar_right.gif) no-repeat right bottom;
}
.subHeaderMain{
	min-height: 15px;
	margin: 0 30px;
	padding: 5px 0 5px 0;
	text-align:right;
	font-size: 1.1em;
	line-height:1.1em;
}


/* ---------- search form styles  ---------- */
#searchTitle{
	/* this div contains only the search header title image*/ 
	position: absolute;
	z-index: 100;
	height: 20px;
	margin: 0px;
	/*positioning top right with a fixed width behaves erratically in some browsers, hence the following*/
	width: 100%;
	min-width: 770px;
	left: 0px;
	top: 84px;
	text-align: right;
}
#ee_search{
	margin: 0px;
	padding: 0px;
}
#ee_search_butt{
	float: right;
	margin: 0px;
	/*next 2 lines required because IE6 doesn't recognise input[type=image]*/
	border: none;
	padding: 0;
}
#ee_search_txt{
	float: right;
	margin: 8px 6px;
	height: 17px;
	width: 140px;
}


/* Tips for sidebars:
1. Since we are working in percentages, it's best not to use side padding on the sidebars. It will be added to the width for standards compliant browsers creating an unknown actual width. 
2. Space between the side of the div and the elements within it can be created by placing content inside another <div>: .navContentBox for #navBar, .contentBox for #mainContent and .rightContentBox for #rightBar.
*/

/* ---------- navigation bar ---------- */
#navBar {
	float: left;
	width: 200px;
	min-height:100%;
	padding: 15px 0px 20px 0px;
	background-color:#00642E;
}
#navBar ul{
		list-style-type: none;
		margin: 0;
		padding: 0;
		font-size: 1.2em;
		font-weight:bold;
}
#navBar li{
		margin: 0 0 0.5em 0;
		display: block;
}
#navBar a{
	display: block;
	height: 1%; /*this is a hack for IE 6 and below otherwise links don't act as blocks*/
	color: #fff;
	padding: 0.3em 0.8em;
	text-decoration: none;
}
#navBar a:hover{ 
	color:#000;
	background: #FFAD38 url(Imgs/MenuButt_BG.gif) repeat-x center;
}
#navBar a:active{
	color: #00642E;
	background: #FFAD38 url(Imgs/MenuButt_BG.gif) repeat-x center;
}
#navBar .currentLink a{ /*use to pick out the current page in the menu (place class on corresponding <li>)*/
	display: block;
	color: #000;
	background: #FFAD38 url(Imgs/MenuButt_BG.gif) repeat-x center;
}
#navBar .subMenu a{ /*indent Submenu links (place class on corresponding <li>)*/
	padding-left: 1.6em;
	font-weight: normal;
}
.navContentBox{ /*use as container div(s) within #navBar column - DO NOT USE TO CONTAIN MAIN NAVIGATION!*/
	padding: 0.3em 0.8em;
}
		
#mainContent{
	margin: 0 0 0 200px;
	padding: 0;	
	min-height: 400px;
	background-color:#fff;
}

* html #mainContent{
	height: 1px;/*this is a hack for IE 6 and below - 3 pixel jog*/
	margin-left: 0;/*3 pixel jog hack*/
}
* html #navBar{
	margin-right: -3px;/*3 pixel jog hack*/
}
#mainContent img{
	margin: 0.4em 0 0.3em 0;
}
.contentBox{ /*use to specify padding within #mainContent column (otherwise right column suffers float drop)*/
	padding: 10px 100px 0px 20px;
	max-width: 700px;
	min-height: 350px;
}
.contentBox ul{
	list-style-type: disc;
	margin: 0 0 0 20px;
	padding: 0;
	font-size: 1.2em;
	font-weight: normal;
}
.contentBox li{
	margin: 0 0 0.8em 0;
}
#breadCrumbs{
	margin: 0;
	padding: 5px 0px 5px 0px;
	text-transform: capitalize;
	color: #00642E;
}
#breadCrumbs ul{
		list-style-type: none;
		margin: 0px;
		padding: 0px;
		font-size: 1.1em;
		line-height: 1.6em;
}
#breadCrumbs li{
	display: inline;
	margin: 0px;
	padding: 0 0.3em 0 0;	
}
#breadCrumbs li a{
	text-decoration:none;
}
#breadCrumbs li a:hover{
	text-decoration:underline;
}

/* ---------- right side bar ---------- */
#rightBar{
	float: right; 
	width: 150px; 
	padding: 10px;
}

/*  ----------  footer styles  ----------  */
#footer{
	clear: both;
	padding: 20px 100px 0px 20px;
	max-width: 700px;
	color: #00642E;
	font-size: 1em;
	line-height: 1.6em;
	text-align:center;
}
#footer .footerBox{/*needed to give space around border*/
	border-top:1px solid #00642E;
	padding: 15px 0;
}
#footer ul{
	list-style-type: none;
	margin: 0px;
	padding: 0px;
	font-size: 1.1em;
	font-weight: bold;
	letter-spacing: 0em;
}
#footer li{
	display: inline;
	margin: 0px;
	padding: 0 0.6em;
	margin: 0;	
}
#footer a{
	text-decoration:none;
}
#footer a:hover{
	text-decoration:underline;
}

/*  ---------- Miscellaneous classes for reuse  ---------- */
.floatRight{ 
/* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
	float: right;
	margin-left: 10px;
}
.floatLeft { 
/* this class can be used to float an element left in your page. The floated element must precede the element it should be next to on the page. */
	float: left;
	margin: 0 10px 0 0;
}
img{
	margin:0;
	padding:0;
}
.centerBox{
/* this class can be used to center elements within the mainContent or navBar */
	text-align: center;
	margin: 0px;
	padding: 0px;
}
.clearFloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain its child floats */
	clear: both;
    height: 0px;
    font-size: 1px;
    line-height: 0px;
	height: 1%;
}