/*overrides for styles.css or superfish.css for wrapper pages
the !important styles will get displayed in all browsers except IE6*/
.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:10em; /* left offset of submenus need to match (see below) */}

.sf-menu ul li li{padding:0px;}

.sf-menu li:hover {visibility:inherit; z-index:100;}
.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;  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:10em; 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:10em;	top:0;}

/*** DEMO SKIN ***/

.sf-menu {float:left; width:auto;}

.sf-menu a { text-decoration:none; padding:9px 0px; background: url(../images/genres.gif) top left no-repeat; cursor:pointer;}

.sf-menu a  { /* visited pseudo selector so IE6 applies text colour*/
	color:#1798c1; font-family:Arial,Helvetica,Verdana,sans-serif;	font-size:1px; width:74px; }

.sf-menu li a:hover {color:#FFFFFF;	font-family:Arial,Helvetica,Verdana,sans-serif;	font-size:1px;  background: url(../images/genres-a.gif) top left no-repeat;}

.sf-menu ul {width: 210px !important;}

.sf-menu li {background: none; margin-right:0px; z-index:99;}

.sf-menu li ul {margin-top:4px;}

.sf-menu li.primaryli { width:74px; margin-right:2px;}

li.primaryli a.active{
	color:#000000 !important;
	font-weight:bold !important;
	background:url(../images/genres-ho.gif) top left no-repeat;
	}

/*.sf-menu li.primaryli .lt-crnr {float:left;	width:8px; background:none; outline:0;}

.sf-menu li.primaryli .rt-crnr {float:left;	width:8px; background:none;	outline:0;}*/

.sf-menu li.primaryli .lt-crnr-on {
	background:	transparent url(images/nav/nav_crnr_lt.gif) no-repeat 0px 0px; 
	}

.sf-menu li.primaryli .rt-crnr-on {
	background:	transparent url(images/nav/nav_crnr_rt.gif) no-repeat 0px 0px;
	}

.sf-menu li.primaryli a.primary {float:left;}

.sf-menu li li { padding:0px;}

.sf-menu li li a {padding-top:5px;	padding-left:18px;	color:#333333;	font-size:12px; background:none;}

#menu_alternate li li a {font-weight: bold;	font-size:12px; font-family:Arial, Helvetica, sans-serif;}

/*.sf-menu li li .big-div-col a {border-right:solid 1px #cccccc;}*/

.sf-menu li li .big-div-col a.first {padding:5px;}

.sf-menu li li .big-div-col.right a {border-right:none;}

.sf-menu li li a:hover {padding-top:5px; font-weight:bold; color:#ff9900; font-size:12px; background:none;}

#top_nav{*margin-left:180px;}	

.sf-menu li.primaryli{background-color:auto;}

.sf-menu ul {border:solid 1px #4dabd1;}		

.sf-menu li:hover li, .sf-menu ul li {background-color:#FFFFFF;	height:23px; }
 
.sf-menu a:hover {color:#ffffff;} 

 ul.sf-menu ul li.first{padding-top:5px;}
 
 ul.sf-menu ul li.last{padding-bottom:10px;}		

.sf-menu li li:hover, .sf-menu li li.sfHover{
	background:	#ffffff url(images/nav/nav-a-bg.gif) no-repeat 10px 0px; outline:0;
	}		

.sf-menu li li.first:hover, .sf-menu li li.first.sfHover{
	background:	#ffffff url(images/nav/nav-a-bg.gif) no-repeat 10px 5px; outline:0;
	}

.sf-menu ul.big-div li:hover, .sf-menu ul.big-div li.sfHover{background:#FFFFFF; outline:0;}

.sf-menu ul.big-div li {background-color:#FFFFFF; height:auto;}		 

.sf-menu ul.big-div li a:hover{
	background:	transparent url(images/nav/nav-a-bg.gif) no-repeat 10px 0px; outline:0;
}		

.sf-menu ul.big-div li a.first:hover{
	background:	transparent url(images/nav/nav-a-bg.gif) no-repeat 10px 5px; outline:0;
}

ul.sf-menu ul.big-div {border:solid 1px #4dabd1;}

ul.sf-menu ul.big-div.one-col {min-width:212px !important;}		

ul.sf-menu ul.big-div.two-col {min-width:550px !important;}

ul.sf-menu ul.big-div.three-col {min-width:550px !important;}

.big-div a {background-color:#FFFFFF; text-align:left; font-size:12px; color:#333333;}

/*.big-div h3 {font-weight:bold;	font-size:14px;	margin:5px 8px 5px 10px; color:#333333;}*/

ul.sf-menu .big-div-col .catheader{color:#333333; font-size:14px; font-weight:bold; padding:8px 8px 5px 10px;}
ul.sf-menu li li .big-div-col a.catheader {border-right:none;}

.sf-menu ul.big-div li a.catheader:hover{
	font-size:14px;	font-weight:bold; padding:8px 8px 5px 17px; outline:0;
	color:#6699CC;	background:	transparent url(images/nav/nav-a-bg.gif) no-repeat 10px 4px;	
	}		

.link-content { width:550px; background:#FFFFFF;}

.link-content a {padding: 0 0 5px 5px;	width:160px;}		

.big-div-col {float: left;	width:160px; margin-bottom:3px;}

/*** arrows **/
.sf-menu a.sf-with-ul {min-width:1px; /* trigger IE7 hasLayout so spans position accurately */}
.sf-sub-indicator {display:none; background:none;}

a > .sf-sub-indicator {  /* give all except IE6 the correct values */
	top:.8em;	background-position: 0 -100px; /* use translucent arrow for modern browsers*/
}


