/*================================================================
                 SUPERFISH MENU ESSENTIAL STYLES 
================================================================*/

/* Make sure to use specificity below rather than changing these 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:14em; /* left offset of submenus need to match (see below) */ }
.sf-menu ul li { width:100%; }	
.sf-menu li { float:left; position:relative; }
.sf-menu li:hover { visibility:inherit; /* fixes IE7 'sticky bug' */ }		

.sf-menu a { display:block; position:relative; }

.sf-menu li:hover ul,
.sf-menu li.sfHover ul { left:0; top:0; /* match top ul list item height */ z-index:99; }
	
.sf-menu li:hover li ul,
.sf-menu li.sfHover li ul { top:-999em; }

.sf-menu li li:hover ul,
.sf-menu li li.sfHover ul { left:14em; /* match ul width */ top:0; }

.sf-menu li li:hover li ul,
.sf-menu li li.sfHover li ul { top:-999em; }

.sf-menu li li li:hover ul,
.sf-menu li li li.sfHover ul { left:14em; /* match ul width */ top:0; }

/*** shadows for all but IE6 ***/
.sf-shadow ul { /* background:url(/cms/images/layout/menu/shadow.png) no-repeat bottom right; */ padding:0 9px 9px 0; }
.sf-shadow ul.sf-shadow-off { background: transparent; }

/*** arrows **/
.sf-menu a.sf-with-ul { padding-right:2.25em; min-width:1px; /* trigger IE7 hasLayout so spans position accurately */ }

.sf-sub-indicator { 	
	display:block; 
	position:absolute; right:.75em; top:.8em;
	width:10px; height:10px; 
	text-indent:-999em; 
	overflow:hidden;
	background:url(/cms/images/arrows-ffffff.png) no-repeat 0 -100px;
}

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; }

/* 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*/
}
	

/*================================================================
                      MAIN MENU SKIN 
================================================================*/

.mainNav { position:relative; z-index:1; top:0; margin:0; }
.mainNav ul { margin:0; padding:0; }	


/* Main Tier */
.mainNav .sf-menu li { float:none; }

.mainNav .sf-menu > li { display:block; vertical-align:middle; text-align:left; }
.mainNav .sf-menu > li .subMenu > a { 
	display:table; 
	width:100%; 
	font-size:1.5em;
	text-decoration:none;
}

.mainNav .sf-menu li.sfHover .subMenu > a, .mainNav .sf-menu a.on, 
.mainNav .sf-menu a:hover,  .mainNav .sf-menu a:focus,  .mainNav .sf-menu a:active { background-color: #990000; }

/* Sub Tier */
.mainNav .sf-menu li.sfHover .subNav { 
	position:relative; top:0; 
	overflow:hidden;
	-webkit-backface-visibility:hidden;
	-webkit-box-sizing:border-box;
	   -moz-box-sizing:border-box;
	        box-sizing:border-box;
}
.mainNav .sf-menu li.sfHover .subNav ul { position:relative; }
.mainNav .sf-menu li ul { min-width:100%; }

/* Sub Sub Tier */
.js .mainNav .sf-menu li li ul { display:none; visibility:hidden; }
.mainNav .sf-menu li li:hover > ul, .mainNav .sf-menu li li.sfHover > ul { top:0; left:100%; }

/* last Nav Item Adjustments */
.mainNav .sf-menu .lastnavitemli .subMenu > ul { left:auto; right:0; }
.mainNav .sf-menu .lastnavitemli li:hover > ul,
.mainNav .sf-menu .lastnavitemli li.sfHover > ul { left:auto; right:100%; }	


/* ------- Mega Menu adjustments ----------- */

.megaMenu .sf-menu {}
.megaMenu .sf-menu li { position:static;} 
.megaMenu .sf-menu > li > a { 
	position:relative; top:1px;
	display:block;
	width:100%; height:auto;
	color:#ffffff;
	font-size: 1.125em; font-weight: 500;
	text-transform: lowercase;
	padding: 10px 30px;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
.megaMenu .sf-menu .hasSubs:after {
	content:"+";
	display:inline-block;
	position:absolute;
	top:11px; right:25px;
	font-family:"Roboto", arial, sans-serif;
	font-size: .7em;
}
.megaMenu .sf-menu .sfHover .hasSubs:after { content:"-"; margin-right:2px; margin-left:8px; }

.megaMenu .sf-menu > li.sfHover {}
.megaMenu .sf-menu > li.sfHover > a { color:#fff; }

.megaMenu .sf-menu li .subNavWrap { position:absolute; }
.megaMenu .sf-menu li .subNav { 
	position:absolute; top:-999em; left:0; 
	padding: 10px  10px 10px 20px; 
	min-width:0; width:100%; 
	text-transform:none;
	font-family: "Roboto", arial, sans-serif;
	font-size:.813em;
	font-weight:normal;
}
.no-js .megaMenu .sf-menu li:hover .subNav, 
.megaMenu .sf-menu li.sfHover .subNav { top:0; }
.megaMenu .sf-menu.animate .subNav {
	-webkit-transition:opacity .3s linear;
	   -moz-transition:opacity .3s linear;
	     -o-transition:opacity .3s linear;
	        transition:opacity .3s linear;
}

.megaMenu .sf-menu li ul ul { display:block !important; visibility:visible !important; min-width:100%; width:auto; }
.megaMenu .sf-menu li li { float:none; height:auto; border:0;}
.megaMenu .sf-menu li li a { padding:10px 4%; color:#fff; }
.megaMenu .sf-menu li li li { float:none; margin:0; width:100%; border:0; }
.megaMenu .sf-menu li li li a { border-bottom:0; }

.navBanner { display:block; padding: 10px; }
.navBanner img { max-width:100%; height:auto !important; }
.navBanner iframe { width:100% !important; height:48px !important; border:0; padding:0; overflow:hidden !important; }

/* Hide the 'ad choice' icon on ads. ugh */
#BAP-holder { display:none !important }

@media (min-width:48em) {
    .navBanner iframe {height:250px !important; }
}

@media (min-width:60em) {
	.sf-menu li:hover ul, .sf-menu li.sfHover ul { top:0; }

	.mainNav {}
	.mainNav .sf-menu { position:relative; top:auto; right:auto; display:table !important; width:100%; border-bottom:0; }
	.mainNav .sf-menu > li {
		display:table-cell;
		text-align:left;
		-webkit-transition:background .3s ease-in-out .1s;
		   -moz-transition:background .3s ease-in-out .1s;
		     -o-transition:background .3s ease-in-out .1s;
		        transition:background .3s ease-in-out .1s;
	}
	.mainNav .sf-menu > li:first-child {}
	.mainNav .sf-menu > li:nth-child(even) { background-position:0 10px, 50% 120%; }
	
	.megaMenu .sf-menu .hasSubs:after { display:none; }
	.megaMenu .sf-menu > li > a  { display:table; max-width:170px; width:100%; line-height:1; padding: 32px 8px; font-size:0.875em; text-align: center; white-space: nowrap}
	.megaMenu .sf-menu > li.sfHover { background-position:0 10px, 50% 94%; background-color:transparent; }
	.megaMenu .sf-menu > li.sfHover:nth-child(even) { background-position:0 -10px, 50% 94%; }
	.megaMenu .sf-menu > li.sfHover > a { color:#ffffff; }
	
	.megaMenu .sf-menu li .subNav { 
		border:1px solid #d6d6d6;
		padding:1% 0;
		font-size:0.875em;
		font-weight:500;
		background:#fff; 
		filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
		opacity:0;	
	}
	.megaMenu .sf-menu li.sfHover .subNav { 
		filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=97);
		opacity:0.97; 
	}	
	.no-js .mainNav .sf-menu li:hover .subNav, 
	.mainNav .sf-menu li.sfHover .subNav { 
		position:absolute; z-index:100; 
		top:90px; /* Switch when buy link added - left:-101%;; */ 
		width: 100%;
		padding:20px 30px;
		overflow:hidden;
		filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
		opacity:1;
		-webkit-box-sizing:border-box;
		   -moz-box-sizing:border-box;
		        box-sizing:border-box;
	}
	.no-js .mainNav .sf-menu li:hover .subNav,
	.mainNav .sf-menu li.sfHover .subNav { min-height:273px; }

	.megaMenu .sf-menu li ul { position:static; float:left; width:18%; min-width:18%; margin:0 1%; }
	.megaMenu .sf-menu li .subNav.twoColNav ul { width:28%; }
	.megaMenu .sf-menu li li { border-bottom:1px solid #e7e7e7; padding:0; margin:0 10px; width:auto; text-align:left; }
	.megaMenu .sf-menu li li:last-child { border-bottom: 0 none; }
	.megaMenu .sf-menu li li:hover {border-bottom:1px solid #cccccc;}
	.megaMenu .sf-menu li li a { padding:10px 4%; line-height:1.5em; color:#151515; }	
	.megaMenu .sf-menu li li a:hover {background-color: #ffffff; color: #000000;}
	
	.navBanner { display:none;  padding:10px; height:auto; overflow:hidden; }
 .opened .navBanner {display: block;}
}

@media (min-width:80em){
	.mainNav {}
}

@media (min-width:87.50em){
	.mainNav {}
	.mainNav .sf-menu > li {}
	.mainNav .sf-menu > li:nth-child(even) { background-position:0 10px, 50% 120%; }
	.megaMenu .sf-menu > li.sfHover { background-position:0 10px, 50% 100%; }
	.megaMenu .sf-menu > li.sfHover:nth-child(even) { background-position:0 10px, 50% 100%; }
	
	.megaMenu .sf-menu > li > a  { max-width:300px; text-align:center; font-size: 1em; padding: 32px 10px;}
	
	.no-js .mainNav .sf-menu li:hover .subNav,
	.mainNav .sf-menu li.sfHover .subNav { top: 80px;  left: 0;  /* Switch when buy link added - left:-60%;*/ width:160%; }
}

/*================================================================
                      VIDEO MENU SKIN 
================================================================*/

.filterBar .sf-menu li ul { border:1px solid #dfdfdf; background:#fff; }
.filterBar .sfHover ul { top:25px !important; }
.filterBar .sf-menu li ul a { padding:10px; }

