/* Superfish reloaded
================================================
This is the default stylesheet for the store related elements. */


/*+clearfix {*/ 
ul.sf-menu:after { content:"."; display:block; height:0; clear:both; visibility:hidden; font-size:0; }
ul.sf-menu { display: table; width:100%; }
ul.sf-menu {
/*\*/
	
/**/
	-height: 1px;
}
/*+}*/


/*reset the menu*/
ul.sf-menu, ul.sf-menu * { margin: 0; padding: 0; list-style: none; }

/*[clearfix]*/
ul.sf-menu {
	/*+placement:margin-auto 0px 0px;*/
	margin-left: auto;
	margin-right: auto;
	left: 0px;
	top: 0px;
}

ul.sf-menu { line-height: 1; font-size:1em;}
ul.sf-menu ul {font-size:1em;}
ul.sf-menu li { display:block; float:left; position:relative; }

/*set submenu li widths*/
ul.sf-menu ul li { width: 100%; }

/* ## first level ## */
ul.sf-menu a { 
	display: block;
	position: relative;
	padding: 10px 5px;
	text-decoration: none;
	color: #000;
	border: 1px solid #888888;
	background:#ccc;
	font-size:.9em;
}
ul.sf-menu ul li a { margin-right: 0; line-height:1em; }

/* ## 2nd level ## */
ul.sf-menu li ul {
	position: absolute;
	top: 0;
	display: none;
	padding:3px;
	visibility: hidden;
	top: 2.3em; /*top = top nav bar height*/
	width: 10em;
	left: 0;
	background:#fff;
	border:1px solid #ccc;
}
/*shows 2nd level / dropdown*/
ul.sf-menu li:hover ul,
ul.sf-menu li.sfHover ul {
	visibility: visible;
	display: inline-block;
	z-index: 99;
}

ul.sf-menu li ul li { padding:3px 0; border-bottom:1px solid #ccc; }

/* ## 3rd level ## */

/*hide 3rd level offscreen*/ 
ul.sf-menu li:hover ul ul,
ul.sf-menu li.sfHover ul ul { top: -999em; }

ul.sf-menu li ul li ul {
	left: 10em;
	top: 0em;
	left: 10em; /*left = 1st level width*/
	top: 0;
}

/*shows 3rd level*/ 
ul.sf-menu li ul li:hover > ul, ul.sf-menu li ul li.sfHover > ul { top: 0em; }

/*4th level*/
/*last level, just style, no superfish disclosure, just copy the above recipe to add more levels!*/
ul.sf-menu li ul li ul li ul { /*hide 4th level*/ top: -999em; }
ul.sf-menu li ul li ul li ul { left: 10em; }
ul.sf-menu li ul li ul li:hover ul,
ul.sf-menu li ul li ul li.sfHover ul { /*show 4th level*/ top: 0em; }

/*hover state / xpath*/
.sf-menu li:hover,
.sf-menu li.sfHover,
.sf-menu a:focus, 
.sf-menu a:hover, 
.sf-menu a:active { outline: 0; }

/*arrows*/
.sf-menu a.sf-with-ul { padding-right: 2.25em; min-width: 1px; /*trigger ie7 haslayout so spans position accurately*/ }
.sf-sub-indicator {
	position: absolute;
	display: block;
	right: 0.25em;
	top: .95em;
	width: 5px;
	height: 3px;
	text-indent: -999em;
	overflow: hidden;
	background-position: -10px 0;
	background: url(/cms/images/layout/icon_arrow_down.png) no-repeat 0 0;
}
.sf-menu li.sfHover .sf-sub-indicator { background-position: -10px -100px; }

/*submenu arrows right*/
ul.sf-menu li.sfHover ul li .sf-sub-indicator { top:.5em; background-position: 0px 0px; }
.sf-menu li.sfHover li.sfHover .sf-sub-indicator { background-position: -10px 0px; }
.sf-menu ul .sf-sub-indicator { background-position: -10px 0; }


/* ## Main Navigation Theme ## */

	.mainNav { margin-bottom:8px; padding:0 184px 0 0; position:relative;}
	.mainNav .sf-menu a { background:none; border:0; color:#000000; font-weight:600; font-size:.95em; padding:10px 14px 11px 13px; text-align:center; width:auto !important; height:auto !important;}
	
	.mainNav .sf-menu li a:hover,
	.mainNav .sf-menu li.sfHover > a { background-color:#ed1b2e; color:#ffffff; z-index:1000;}
	.mainNav .sf-menu li a:hover .sf-sub-indicator {display:none;}
	.mainNav .sf-menu li.sfHover > a .sf-sub-indicator {bottom:-10px; left:50%; margin-left:-8px; background:url(/cms/images/layout/main_nav_indicator.png) no-repeat 0 0; width:16px; height:10px; top:auto; display:block;}

	.mainNav .menuLink { display:none; }
	
	ul.sf-menu li ul {width:200px; top:2.25em; background:#000000; border:0px; border-top:2px solid #EE1B2E; border-bottom:2px solid #EE1B2E; padding:30px 20px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
	
	ul.sf-menu li ul li {padding:0px; border:0px; display:block; width:auto; float:none;}
	ul.sf-menu li ul li ul {display:block !important; position:static; padding:0 0 8px 0; border:0px; width:auto;}
	
	ul.sf-menu li ul li ul li {margin:0 0 10px 0;}
	ul.sf-menu li ul li ul a,
	ul.sf-menu li ul li ul a:link,
	ul.sf-menu li ul li ul a:visited {padding:0 0 0 0; color:#ffffff; background:none !important; text-align:left; font-size:1em; font-family:Oswald; font-weight:400;}
	ul.sf-menu li ul li ul a.viewAll {padding:0 0 0 30px; text-decoration:underline; font-size:.85em;}
	ul.sf-menu li ul li ul a .navSwatch {float:left; border:1px solid #e3e3e3; margin:0 10px 0 2px;}
	
	ul.sf-menu li ul li ul li.bdrTop {border-top:1px dotted #454646; padding:10px 0 0 0;}
	
	.mainNav .sf-menu li li.sfHover > a {background:none; color:#ed1b2e;}
	ul.sf-menu .sfHover ul li ul a:hover {background:none; color:#ed1b2e;}
	
	.advMenu .mainNavLeft {float:left; padding:0 30px 0 0;}
	.advMenu .mainNavLeft a,
	.advMenu .mainNavLeft a:link,
	.advMenu .mainNavLeft a:visited {text-transform:uppercase; font-size:1.250em;}
	.advMenu .mainNavRight {float:right;}
	.advMenu .advMenuSection {float:left; padding:0 75px 0 0;}
	
	.advMenu .advMenuHeading {text-transform:uppercase; font-size:1.250em; color:#ffffff; margin:0 0 15px 0; font-family:Oswald; font-weight:400;}
	
	ul.sf-menu li ul li ul.brands li {margin:0 0 25px 0;}
	
	@media only screen and (min-width: 56.26em) {
		.mainNav .sf-menu {display:block !important;}
	}
	
	/* Mobile Navigation */
	@media only screen and (max-width: 56.25em) {

		.mainNav { position: static; height:auto; padding:14px 0 0 0; clear:both; margin:0 -10px 0 -10px;}

		.no-js .menuLink { display: none;}
		
		.menuLink {
			position: absolute;
			display:inline-block !important;
			top: 32px;
			right: 105px;
			z-index: 9000;
			padding: 4px 2px;
			height: 30px;
			font-size: 2em;
			color: #B86100;
			cursor:pointer;
		}

		.mainNav ul { display: none; padding:10px 22px; background:#000000; width:auto;}
		.mainNav ul ul {
			position: relative !important;
			top: auto !important;
			left: auto !important;
			width: auto !important;
			height: auto !important;
		}
		.mainNav ul li.active > ul,
		.mobile-landing .mainNav > ul,
		.no-js .mainNav > ul {display: block !important; visibility: visible !important;}

		.mainNav.active > ul { display: block}

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

		.mainNav ul.sf-menu li { display: block; float: none; margin: 0px; border-top:1px solid #333333;}
		.mainNav ul.sf-menu li:first-child {border:0px;}
		.mainNav ul.sf-menu ul li {}
		
		.mainNav .sf-menu a { display: block; color:#fff; background: #000000; font-size:.9em; text-align:left; padding:6px 0; line-height:normal;}
		.mainNav .sf-menu li.sfHover > a {padding:5px 10px;}
		.mainNav li a:hover, 
		.mainNav li a:focus {text-decoration: none; }

		ul.sf-menu li ul li ul a, ul.sf-menu li ul li ul a:link, ul.sf-menu li ul li ul a:visited {font-family:Inherit; }
		.advMenu .mainNavLeft a, .advMenu .mainNavLeft a:link, .advMenu .mainNavLeft a:visited {font-size:.9em; text-transform:none; padding:6px 10px;}
		.mainNav ul ul li a:hover,
		.mainNav ul ul li a:focus { background: #4c4d4f; }
		
		ul.sf-menu li ul {padding:10px 0 0px 0; margin-bottom:-1px;}
		
		.mainNav .advMenu {width:auto !important;}
		.advMenu .mainNavLeft {float:none; padding:0px;}
		.advMenu .mainNavRight {display:none;}
		
		.mainNav ul.sf-menu .advMenu li {margin:0;}
		
	}