/*
* Start mainNav
* This is to do the hi-tech menu roll over, where both states are part of the same image. The over state needs to be at the bottom
*/ 

#mainNav {
	font-size:9px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	width: 100%;
	//background-image: url(/nav/nav_repx.jpg);
	//background-repeat: repeat-x;
	//background-position: top;
}


#nav, #nav ul {
	float:left !important;
	list-style-image:none;
	list-style-position:outside;
	list-style-type:none;
	margin:0;
	padding:0;
	z-index: 99999;

}
#nav li {
	float:left !important;
	margin-bottom:-1px;
	//position:relative;
	z-index: 9999;
	text-align:left;
}

#nav li ul {
	display:none;
	margin-top:0;
	align:left;
	position:absolute;
	border: none;
	width: 200px;
	z-index: 9999;
	//left: 0px;
	top: 35px;

}


#nav li ul ul {
	display:none;
	//margin-top: 34px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	z-index: 9999;

}



/* level 2 and 3 link styling  */
#nav ul li a,#nav ul li ul li a{
	color: #AEAEAE;
	padding: 3px;
	display: block; /* MUST have height, IE7 Bug */
	text-decoration: none;
	vertical-align:middle;
	border: 1px solid #333333;
	width: 180px;
	background-color: #111111;
	z-index: 9999;
	align:left;
} 

/* firt level link styling */
#nav li a {

color:#333333;
display:block;
font-weight:normal;
text-decoration:none;
}
#nav li a:hover {
color:white;
}

#nav ul li a:hover {
	background-color: #EA7724; // background mouseover colour
}

#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul {
display:none;
}
#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul {
display:block
}