/*** ESSENTIAL STYLES ***/
.sf-menu, .sf-menu * {
	margin:			0;
	padding:		0;
	list-style:		none;
}
.sf-menu {
/*	line-height:	1.0; */
}
.sf-menu ul {
	position:		absolute;
	top:			-999em;
	width:			15em; /* left offset of submenus need to match (see below) */
}
.sf-menu ul li {
	width:			100%;
}
.sf-menu li:hover {
	visibility:		inherit; /* fixes IE7 'sticky bug' */
}
.sf-menu li {
	float:			left;
	position:		relative;
}
.sf-menu a {
	display:		block;
	position:		relative;
}
.sf-menu li:hover ul,
.sf-menu li.sfHover ul {
	left:			0;
	top:			2.5em; /* match top ul list item height */
	z-index:		99;
}
ul.sf-menu li:hover li ul,
ul.sf-menu li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li:hover ul,
ul.sf-menu li li.sfHover ul {
	left:			15em; /* match ul width */
	top:			0;
}
ul.sf-menu li li:hover li ul,
ul.sf-menu li li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li li:hover ul,
ul.sf-menu li li li.sfHover ul {
	left:			15em; /* match ul width */
	top:			0;
}


/*  ---- Vertival ----  */

.sf-menu {
	position: relative;
}

.sf-menu li {
	position: static;
}

/*** adding sf-vertical in addition to sf-menu creates a vertical menu ***/
.sf-vertical, .sf-vertical li {
	width:	260px;
}
/* this lacks ul at the start of the selector, so the styles from the main CSS file override it where needed */
.sf-vertical li:hover ul,
.sf-vertical li.sfHover ul {
	left:	260px; /* match ul width */
	top:	0;
}

/*** alter arrow directions ***/
.sf-vertical .sf-sub-indicator { background-position: -10px 0; } /* IE6 gets solid image only */
.sf-vertical a > .sf-sub-indicator { background-position: 0 0; } /* use translucent arrow for modern browsers*/

/* hover arrow direction for modern browsers*/
.sf-vertical a:focus > .sf-sub-indicator,
.sf-vertical a:hover > .sf-sub-indicator,
.sf-vertical a:active > .sf-sub-indicator,
.sf-vertical li:hover > a > .sf-sub-indicator,
.sf-vertical li.sfHover > a > .sf-sub-indicator {
	background-position: -10px 0; /* arrow hovers for modern browsers*/
}


#nav { padding:0 0 20px 20px; font-size:1.2em;  float: left; position: relative; margin-top: 17px;}

/************** ALL LEVELS  *************/ /* Style consistent throughout all nav levels */
#nav li { text-align:left; padding: 3px 0;  line-height: 1em;}
#nav li.over { z-index:999; }
#nav a,
#nav a:hover { text-decoration:none; color: #9F644C; line-height:1em; display: block;}
#nav span { cursor:pointer; white-space:nowrap; line-height: 1em; }
#nav li ul span {white-space:normal; }
#nav ul li.parent a { background-image:none; }
#nav ul li.parent li a { background-image:none; }

/************ 0 LEVEL  ***************/
#nav li { background: transparent url(../images/doeNat_hgr_nav_li.gif) no-repeat 0 50%; }
#nav li.active a { color:#57B513; }
#nav a { font-weight:bold; color:#9F644C; padding-left: 50px;}
#nav .sfHover a,
#nav li.over a,
#nav li.active a,
#nav a:hover { background: transparent url(../images/doeNat_hgr_nav_li_h.gif) no-repeat 0 50%; color: #57B513;}


/************ 1ST LEVEL ************/

#nav ul { padding-left: 20px;}
#nav ul li, #nav .sfHover ul a { background: transparent url(../images/doeNat_hgr_nav_li.gif) no-repeat -25px 50%; }
#nav .sfHover ul a, #nav ul li, #nav ul a, #nav li.active ul a, #nav li.over ul a  {  color:#9F644C; }
#nav ul a, #nav li.over ul a { font-weight:normal!important; padding-left: 25px; background: none; }
#nav ul a:hover, #nav ul li.active a { color:#57B513!important; background: transparent url(../images/doeNat_hgr_nav_li_h.gif) no-repeat -25px 50%;}