/* Main menu bar*/
.sf-menu {  } 

/*** ESSENTIAL STYLES ***/
.sf-menu, .sf-menu * { margin: 0; padding: 0; list-style: none; }
.sf-menu { line-height: 1.0; }
.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: 0px; top: 40px; z-index: 99; }
.sf-menu li:hover ul.composers,.sf-menu li.sfHover ul.composers { left: 0px; width: 748px; }
.sf-menu li:hover ul.labels,.sf-menu li.sfHover ul.labels { left: -150px; width: 748px; }
.sf-menu li:hover ul.special-offers,.sf-menu li.sfHover ul.special-offers { left: 0px; width: 298px; }
.sf-menu li:hover ul.new-releases,.sf-menu li.sfHover ul.new-releases { left: 0px; width: 148px; }
.sf-menu li:hover ul.advanced-search,.sf-menu li.sfHover ul.advanced-search { left: 0px; width: 148px; }
.sf-menu li:hover ul.help,.sf-menu li.sfHover ul.help { left: 0px; width: 126px; }

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: 175px; top: 3px; }*/ /* match ul width */
/*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; /* match ul width */	top: 0; }

/*** STYLIZATION ***/
.sf-menu > li {	border-top: 1px solid #f2f2f2; border-bottom: 1px solid #f2f2f2; border-right: 1px dotted #ffffff; } 
.sf-menu > li:first-child {	border-left: 1px solid #f2f2f2;  }
.sf-menu > li.last-child { border-right: 1px solid #f2f2f2; }
.sf-menu > li > a {	font: 700 18px/40px 'PT Sans Narrow', sans-serif; color: #fff; text-transform: uppercase; width:124px; 	text-align:center; background: #666666; }
.sf-menu > li:first-child > a { width:60px; }
.sf-menu > li:first-child > a i { margin-top: 3px; color: #fff;}
.sf-menu > li.last-child > a { width:126px; }
.sf-menu > li > a:hover, .sf-menu > li.active > a, .sf-menu > li.sfHover > a { background: #F2CF0A; color: #666; }

/* drop down sub menu */
.sf-menu ul { position: absolute; top: -999em; width: 128px; padding: 0px; background: #ffffff;	border-left: 1px solid #cccccc; border-right: 1px solid #cccccc; border-bottom: 1px solid #cccccc; }
.sf-menu li li { color: #000; padding: 0px; }
.sf-menu li li a { color: #000; padding: 8px; }
.sf-menu li li a:hover, .sf-menu > li li.active a, .sf-menu > li li.sfHover > a { background: #F2CF0A; }
.sf-menu ul ul {  padding: 0; background: transparent; }
.sf-menu li li li {	margin-bottom:0px; }
.sf-menu li li li a { color: #ffffff; font-size:18px; text-shadow: none; padding-left: 20px; background: #000000 url('/images/marker1.png') no-repeat 10px 18px; }
.sf-menu  li li li > a:hover, .sf-menu > li li li.active > a, .sf-menu > li li li.sfHover > a {	background: #F2CF0A url('/images/marker1.png') no-repeat 10px 18px; }

.sf-sub-indicator { display:none; }

/* ######################################################################## */
@media only screen and (min-width: 768px) and (max-width: 959px) {
	.sf-menu > li:nth-child(4) > a,
	.sf-menu > li:nth-child(5) > a {
		width: 117px;
	}
	.sf-menu > li > a {	width:87px; }
	.sf-menu > li:first-child > a {	width:54px; }
	.sf-menu > li.last-child > a { width:100px; }
	.sf-menu li:hover ul.composers,.sf-menu li.sfHover ul.composers { left: -56px; width: 746px; }
	.sf-menu li:hover ul.labels,.sf-menu li.sfHover ul.labels { left: -174px; width: 746px; }
	.sf-menu li:hover ul.special-offers,.sf-menu li.sfHover ul.special-offers { left: 0px; width: 298px; }
	.sf-menu li:hover ul.new-releases,.sf-menu li.sfHover ul.new-releases { left: 0px; width: 148px; }
	.sf-menu li:hover ul.advanced-search,.sf-menu li.sfHover ul.advanced-search { left: 0px; width: 148px; }
	.sf-menu li:hover ul.help,.sf-menu li.sfHover ul.help { left: -20px; width: 120px; }
}

/* ######################################################################## */
@media only screen and (max-width: 767px) {
	.sf-menu{float:none;}
	.sf-menu ul,.sf-menu ul ul {min-width:100%;position: relative; left: 0 !important; top:0px !important; padding:0;background:none;}
	.sf-menu li {float:none;}
	
	.sf-menu > li > a {
		width:100%;
		background: #666666 url('/images/border_480.png') repeat-x 0 100%;
		line-height:40px;
	}
	.sf-sub-indicator {/*
		text-indent: -999em;
		width: 9px;
		height: 5px;
		display:inline-block;
		background: url('/images/sf-sub-indicator.png') no-repeat;
		position:absolute;
		left:50%;
		top:50%;
		margin-left:-5px;
		margin-top:14px;*/
	}
	.sf-menu li li .sf-sub-indicator {/*
		text-indent: -999em;
		width: 5px;
		height: 9px;
		display:inline-block;
		background: url('/images/sf-sub-indicator-2.png') no-repeat;
		position:relative;
		margin-left:5px;
		margin-top:2px;*/
	}
	.sf-menu  > li li > a > .sf-sub-indicator {/*
		left:8px;
		top:13px;*/
	}
	.sf-menu > li:first-child > a {
			width:100%;
		}
		.sf-menu > li.last-child > a {
			width:100%;
		}
		
		.sf-menu > li {
			border-top: none;
			border-bottom: none;
			/*border-left: 1px solid #f2f2f2;
			border-right: 1px solid #f2f2f2;*/
		}
		.sf-menu > li:first-child {
			border-top: 1px solid #f2f2f2;
			border-left: none; 
		}
		.sf-menu > li.last-child {
			border-bottom: 1px solid #f2f2f2;
		}
		.sf-menu ul {
			background: #ffffff;
		}
		.sf-menu  li li li a {
			padding-left:50px;
			background: #ffffff url('/images/marker1.png') no-repeat 30px 18px;
		}
		.sf-menu  li li li > a:hover, .sf-menu > li li li.active > a, .sf-menu > li li li.sfHover > a {
			background: #ffffff url('/images/marker1.png') no-repeat 30px 18px;
		}
		.sf-menu  li li a:hover, .sf-menu > li li.active a, .sf-menu > li li.sfHover > a {
			background: #ffffff url('/images/marker.png') no-repeat 22px 18px;
		}
}

/* ######################################################################## */
@media only screen and (min-width: 480px) and (max-width: 767px) {
	
}