/*** ESSENTIAL STYLES ***/
.sf-menu, .sf-menu * {
	margin: 0;
	padding: 0;
	list-style: none;
}
.sf-menu { line-height: 1.0; display: table; margin: 0 auto; }

.sf-menu li ul {
	position: absolute;
	top: -999em;
	width: 196px; /* 160 left offset of submenus need to match (see below) */
	border-bottom: 8px solid #ececec;
}

.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: 31px;    /* where to start sub menu (match height of button image) */
	width: 196px;  /* how wide the sub-menus should be when javascript is disabled. don't forget left margin for level 3! */
	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: 196px; /* 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: 210px; /* match ul width */ 
	top: 0;
}

/* width of third level */
.sf-menu ul ul li:hover  ul,
.sf-menu ul ul li.sfHover ul {
		width: 210px;
}

.sf-menu li li ul a {
	border-bottom:	1px solid #ececec;
	padding: 7px 10px 7px 10px;					/* adjust arrow positioning when this is modified */
}

/*** CUSTOM SKIN ***/

.sf-menu {
	font-family: Century Gothic, Verdana, Arial, sans-serif;
	font-size: 12px;
	/*font-weight: bold;*/
	margin-bottom: 0;
}

/* top */
.sf-menu a { text-decoration: none }


/* image replace v2 */
#b1, #b2, #b3, #b4, #b5, #b6 { overflow: hidden; height: 31px; } /* set button dimensions and hide top level text if it is scaled larger than those dimensions */

/* menu button widths */
#b1 { width: 137px; }
#b2 { width: 186px; }
#b3 { width: 142px; }
#b4 { width: 173px; }
#b5 { width: 160px; }
#b6 { width: 162px; }

#b2:hover, #b3:hover, #b4:hover, #b5:hover, #b6:hover { margin-left: -1px; }

#b2:hover { width: 186px;}
#b3:hover { width: 142px;}
#b4:hover { width: 173px;}
#b5:hover { width: 160px;}
#b6:hover { width: 162px; background-color: #ececec; }

#b1 span,
#b2 span,
#b3 span,
#b4 span,
#b5 span,
#b6 span{ 
	background: transparent url(../images/rne-con.jpg) scroll no-repeat 0 0; 
	cursor: pointer; 
	display: block; /* display block actually makes it show up, position absolute makes it overlay the text */
	height: 100%; 
	left: 0; 
	position: absolute; 
	top: 0; 
	width: 100% 
} 


#b1 span { background-position: 0 0 }
#b2 span { background-position: -137px 0 }
#b3 span { background-position: -323px 0 }
#b4 span { background-position: -465px 0 }
#b5 span { background-position: -638px 0 }
#b6 span { background-position: -798px 0 }

a#b1:hover span { background-position: 0 -31px } 
a#b2:hover span { background-position: -137px -31px }
a#b3:hover span { background-position: -323px -31px }
a#b4:hover span { background-position: -465px -31px }
a#b5:hover span { background-position: -638px -31px }
a#b6:hover span { background-position: -798px -31px }


/* subs */
.sf-menu li ul a {
	border-bottom:	1px solid #ececec;
	padding: 7px 10px 7px 25px; /* 10 10 10 25 adjust arrow positioning when this is modified */
	text-align: left;
/*	background:url(../images/menu_pointer.gif) no-repeat 10px 12px;*/
}

.sf-menu li ul { border-top: 1px solid #ececec; }

.sf-menu li li li a { text-align: left; padding: 10px 10px 10px 25px;}

.sf-menu li ul a.sub { padding-left: 25px;}

/* top */
.sf-menu a, .sf-menu a:visited  { /* visited pseudo selector so IE6 applies text color */
	color: #0e76bb;
	font-size: 12px;
	text-indent: -999px;
}

/* subs */
.sf-menu li ul a, .sf-menu li ul a:visited {
	color: #0e76bb;
	font-size: 14px;
	text-decoration: none;
	text-indent: 0; /* we need to do this otherwise the value from the top level is inherited (bad) */
}

/* background color - top level */
.sf-menu li { background: #0e76bb }

/* background - second level */
.sf-menu li li { background:#ececec;
 }

/* background - third level */
.sf-menu-menu li li li { background-color: #ececec; }


/* hover stuff - top level */
.sf-menu li:hover, 
.sf-menu li.sfHover,
.sf-menu a:focus, 
.sf-menu a:hover, 
.sf-menu a:active { outline: 0; }

/* keep top button in hover state while on sub menus */
li:hover > a#b1 span, li.sfHover > a#b1 span { background-position: 0 -31px; } 
li:hover > a#b2 span, li.sfHover > a#b2 span { background-position: -137px -31px; }
li:hover > a#b3 span, li.sfHover > a#b3 span { background-position: -323px -31px; }
li:hover > a#b4 span, li.sfHover > a#b4 span { background-position: -465px -31px; }
li:hover > a#b5 span, li.sfHover > a#b5 span { background-position: -638px -31px; }	
li:hover > a#b6 span, li.sfHover > a#b6 span { background-position: -798px -31px; }

/* keep top button in hover state while on sub menus */
li:hover > a#b1, li.sfHover > a#b1 {  } 
li:hover > a#b2, li.sfHover > a#b2 { margin-left: -1px; width: 187px; }
li:hover > a#b3, li.sfHover > a#b3 { margin-left: -1px; width: 143px; }
li:hover > a#b4, li.sfHover > a#b4 { margin-left: -1px; width: 174px; }
li:hover > a#b5, li.sfHover > a#b5 { margin-left: -1px; width: 161px; }	
li:hover > a#b6, li.sfHover > a#b6 { margin-left: -1px; width: 163px; background-color: #ececec; }

/* hover for subs */
.sf-menu li ul li:hover,
.sf-menu li ul li.sfHover,
.sf-menu li ul a:focus, 
.sf-menu li ul a:hover, 
.sf-menu li ul a:active { color: #0e76bb; outline:0; background:#ffffff url(../images/menu_pointer.gif) no-repeat 10px 50%;} 

/* EOF */