/*================================================================
                 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:33px; /* match top ul list item height */ 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:14em; /* match ul width */ 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: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 { 
	position:absolute; 
	display:block; 
	right:.75em; 
	top:.8em;
	width:10px; 
	height:10px; 
	text-indent:-999em; 
	overflow:hidden;
	background: url(/cms/images/arrows-ffffff.png) no-repeat 0px -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:fixed; 
	width: 250px; height:100%; 
	overflow-y:auto;
	font-size:.75em; 
	text-transform:uppercase; 
	background:#070707; 
	border-right:1px solid #999;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;	
}

.menuLink { float:right; display:inline-block; padding:1em 1.8em; background:#c2c2c2; text-decoration:none; }
.menuLink:before { content:"="; }
.menuLink span { display:block; overflow:hidden; font-size:0; height:0; }

.mainNav ul { margin:0; padding:0; }	

/* Main Tier */
.mainNav .sf-menu { margin:0; padding:0; list-style:none; }
.mainNav .sf-menu li { float:none; }
.mainNav .sf-menu > li .subMenu > a { display:table; width:100%; font-weight:normal; text-decoration:none; color:#fff; background:#000; }
.mainNav .sf-menu > li .subMenu > a .menuText { display:table-cell; padding:4px 10px 0; height:35px; vertical-align:middle; text-align:center;  }

.mainNav .sf-menu ul { position:static; display:none; }

.mainNav .sf-menu a {text-align:center;}

.mainNav .sf-menu > li.hover .subMenu > a,
.mainNav .sf-menu > li.clicked .subMenu > a,
.mainNav .sf-menu li .subMenu a.on,
.mainNav .sf-menu li .subMenu a:hover, 
.mainNav .sf-menu li .subMenu a:focus,
.mainNav .sf-menu li .subMenu a:active { background:#ca2222; }

.mainNav .sf-menu ul .hasSub:after,
.mainNav .sf-menu .hasSub .menuText:after { 
	content:""; 
	display:inline-block; 
	margin-left:1px; 
	width:6px; height:1em; 
	vertical-align:bottom; 
	background:url(/cms/images/global/arrow-nav@2x.png) no-repeat left 90%; 
	background-size:6px 4px; 
}
.no-backgroundsize .mainNav .sf-menu ul .hasSub:after,
.no-backgroundsize .mainNav .sf-menu .hasSub .menuText:after { background:url(/cms/images/global/arrow-nav.png) no-repeat left 90%;  }

/* Sub Tier */
.mainNav .sf-menu li .subMenu { position:relative; display:block !important; }
.mainNav .sf-menu li ul { border:1px solid #c2c2c2; min-width:100%; background-color:#888; }

.mainNav .sf-menu li li { border-top:1px solid #c2c2c2; }
.mainNav .sf-menu li li:first-child { border-top:0; }
.mainNav .sf-menu li li a { 
	height:auto; 
	padding:10px 13px; 
	text-decoration:none; 
	color:#fff;
}

.mainNav .sf-menu li li.hover > a,
.mainNav .sf-menu li li.clicked > a,
.mainNav .sf-menu li li a:hover, 
.mainNav .sf-menu li li a:focus,
.mainNav .sf-menu li li a:active { background:#ca2222; }

/* Sub Sub Tier */
.mainNav .sf-menu li li ul { border-top-width:1px; background:#333; }
.mainNav .sf-menu li li:hover > ul,
.mainNav .sf-menu li li.hover > ul { top:-1px; 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.hover > ul { left:auto; right:100%; }	

@media only screen and (max-width:59.9em){
	.mainNav {
		-webkit-box-shadow:inset -30px 0 20px -30px rgba(255,255,255,.6);
				box-shadow:inset -30px 0 20px -30px rgba(255,255,255,.6);
		-webkit-transition: opacity .4s ease-in;
		   -moz-transition: opacity .4s ease-in;
			-ms-transition: opacity .4s ease-in;
			 -o-transition: opacity .4s ease-in;
				transition: opacity .4s ease-in;
	}
	.mainNav a {		
		-webkit-box-shadow:inset -30px 0 20px -30px rgba(255,255,255,.6);
				box-shadow:inset -30px 0 20px -30px rgba(255,255,255,.6);	
	}
}
@media only screen and (min-width:60em){
	.mainNav { display:block !important; position:absolute; z-index:500; left:50%; border-right:0; margin-left:-470px; padding-top:0; width:838px; height:auto; overflow:visible; }
	.mainNav.active { display:block; }
	.mainNav:before, .mainNav:after { content: ""; display: table; }
	.mainNav:after { clear: both; }
	.mainNav { zoom: 1; }
	.mainNav .sf-menu a { position:relative; z-index:60; text-align:left; }
	.mainNav .sf-menu ul { position:absolute; z-index:50; }
	.mainNav .sf-menu { display:table; float:left; width:100%; }
	.mainNav .sf-menu > li { display:table-cell; vertical-align:middle; text-align:center; }
	
	.mainNav .sf-menu li .subMenu > ul { top:100%; }
}  

/*================================================================
                      VIDEO MENU SKIN 
================================================================*/

.videoNav { position:relative; display:inline-block; margin-left:2px; }
.lt-ie8 .videoNav { display:inline; zoom:1; }

.videoNav .sf-menu li { float:none; }
.videoNav .sf-menu a.sf-with-ul { padding-right:0; }

.videoNav .sf-menu > li  > a { padding:20px .4em; color:#fff; }

.videoNav .sf-menu li  > a .menuText { position:relative; z-index:2; }
.videoNav .sf-menu > li:hover > a,
.videoNav .sf-menu > li > a:focus,
.videoNav .sf-menu li.clicked > a { background:#ca0000; }
.videoNav .sf-menu li.clicked > a .menuText { text-shadow:2px 1px 2px transparent; }

.videoNav .sf-menu ul .hasSub:after,
.videoNav .sf-menu .hasSub .menuText:after { 
	content:""; 
	display:inline-block; 
	margin-left:1px; 
	width:6px; height:1em; 
	vertical-align:bottom; 
	background:url(/cms/images/global/arrow-nav@2x.png) no-repeat left 90%; 
	background-size:6px 4px; 
}
.no-backgroundsize .videoNav .sf-menu ul .hasSub:after,
.no-backgroundsize .videoNav .sf-menu .hasSub .menuText:after { background:url(/cms/images/global/arrow-nav.png) no-repeat left 90%;  }


.videoNav .sf-menu li:hover ul, .videoNav .sf-menu ul {
	display:none;
	top: 100%;
	border:1px solid #c2c2c2;
	min-width:100%;
	text-align:left;
	background-color:#888;
}

.videoNav .sf-menu li ul {  }

.videoNav .sf-menu li li { border-top:1px solid #c2c2c2; }
.videoNav .sf-menu li li:first-child { border-top:0; }
.videoNav .sf-menu li li a { 
	height:auto; 
	padding:10px 13px; 
	text-decoration:none; 
	color:#fff;
}

.videoNav .sf-menu li li.hover > a,
.videoNav .sf-menu li li.clicked > a,
.videoNav .sf-menu li li a:hover, 
.videoNav .sf-menu li li a:focus,
.videoNav .sf-menu li li a:active { background:#ca2222; }

/* Sub Sub Tier */
.videoNav .sf-menu li li ul { border-top-width:1px; background:#333; }
.videoNav .sf-menu li li:hover > ul,
.videoNav .sf-menu li li.hover > ul { top:-1px; left:100%; }