/* SON OF SUCKERFISH DROP MENUS DEVELOPED BY HTML DOG */
/* http://htmldog.com/articles/suckerfish/dropdowns */ 



/* MAIN NAV MENU STYLES */
#nav {
	width:960px;
	height:61px;
	margin:0 auto 15px auto;
	background:url(../images/background_nav_wrapper.gif) repeat-x;
}

#nav ul {margin:0; padding:0; list-style:none; }
#nav li {list-style:none; float:left; padding:0;}
#nav li a {white-space: normal; padding:4px 10px 0 10px; height:49px; display:inline-block; text-align:center; background:url(../images/background_nav.gif) repeat-x; color:white; font-weight:bold; font-size:11px; text-shadow:2px 2px 2px #44050d; text-decoration:none;}
#nav li a:hover {text-decoration:none; background:url(../images/background_nav_active.gif) repeat-x; text-decoration:none;}
#nav li a.active {background:url(../images/background_nav_active.gif) repeat-x;}
/* SPECIFIC NAV ITEM DIMENSIONS */
/* total width should equal 960 - 8 borders = 952px */
/* height should equal 51px  (subtract padding) */

.nav1 {width:80px !important; border-right:1px solid white;}
.nav2 {width:80px !important; border-right:1px solid white;}
.nav3 {width:80px !important; border-right:1px solid white;}
.nav4 {width:80px !important; border-right:1px solid white;}
.nav5 {width:80px !important; border-right:1px solid white;}
.nav6 {width:95px !important; border-right:1px solid white;}
.nav7 {width:90px !important; border-right:1px solid white;}
.nav8 {width:90px !important; border-right:1px solid white;}
.nav9 {width:97px !important}


/* UNUSED CURRENTLY...
.nav9 {padding:4px 13px 0 12px !important;}

.nav10 {}
.nav12 {}
*/






/* DROP MENUS */

#nav li ul {
	position: absolute;
	left: -999em;
	height: auto;
	width:200px !important;
	font-weight: normal;
	margin: 0;
	background:#6f1f31;
	z-index:1000;
}

#nav li li {
	width:200px !important;
	margin-right:0  !important;
	max-width:none !important;
	margin:0 !important;
}


#nav li ul a {
	width:180px !important;
	text-align:left; 
	font-size:11px; 
	text-shadow:none; 
	padding:5px 10px !important;
	height:auto;
	border-bottom:1px solid #551422;
	background-color:#6f1f31 !important;
	background-image:none !important;
	border-right:none;
}
#nav li ul a:hover {
	background-color:#2d0409 !important;
}

#nav ul ul .nav1, 
#nav ul ul .nav2, 
#nav ul ul .nav3, 
#nav ul ul .nav4, 
#nav ul ul .nav5, 
#nav ul ul .nav6, 
#nav ul ul .nav7, 
#nav ul ul .nav8, 
#nav ul ul .nav9, 
#nav ul ul .nav10, 
#nav ul ul .nav11, 
#nav ul ul .nav12 
{}

#nav li ul ul {
	margin: -2.1em 0 0 200px;
}

#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul {
	left: -999em;
}

#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 {
	left: auto;
}

#nav li:hover, #nav li.sfhover {
}






/*** arrows **/
.sf-menu a.sf-with-ul {
	padding-right: 	2.25em;
	min-width:		1px; /* trigger IE7 hasLayout so spans position accurately */
	position:relative;
}
.sf-sub-indicator {
	position:		absolute;
	display:		block;
	right:			.75em;
	width:			10px;
	height:			10px;
	text-indent: 	-999em;
	overflow:		hidden;
	background:		url('../images/arrows-ffffff.png') no-repeat -10px -100px; /* 8-bit indexed alpha png. IE6 gets solid image only */
}
a > .sf-sub-indicator {  /* give all except IE6 the correct values */
	top:			.8em;
	background-position: 0 -100px; /* use translucent arrow for modern browsers*/
}
/* apply hovers to modern browsers */
a:focus > .sf-sub-indicator,
a:hover > .sf-sub-indicator,
a:active > .sf-sub-indicator,
li:hover > a > .sf-sub-indicator,
li.sfHover > a > .sf-sub-indicator {
	background-position: -10px -100px; /* arrow hovers for modern browsers*/
}

/* point right for anchors in subs */
.sf-menu ul .sf-sub-indicator { background-position:  -10px 0; }
.sf-menu ul a > .sf-sub-indicator { background-position:  0 0; }
/* apply hovers to modern browsers */
.sf-menu ul a:focus > .sf-sub-indicator,
.sf-menu ul a:hover > .sf-sub-indicator,
.sf-menu ul a:active > .sf-sub-indicator,
.sf-menu ul li:hover > a > .sf-sub-indicator,
.sf-menu ul li.sfHover > a > .sf-sub-indicator {
	background-position: -10px 0; /* arrow hovers for modern browsers*/
}

/*** shadows for all but IE6 ***/
.sf-shadow ul {
	background:	url('../images/shadow.png') no-repeat bottom right;
	padding: 0 8px 9px 0;
}
.sf-shadow ul.sf-shadow-off {
	background: transparent;
}