

/******************************************************
	FULL WIDTH MAIN NAVIGATION
******************************************************/

.mainbody > header { position:relative; z-index:1000; min-height:76px; height:auto; margin-bottom:25px;}
.mainbody > header .container,
.mainbody > header .grid_12 { position:static; }

.mainNav { position:absolute; top:100%; left:0; z-index:20; width:100%; text-align:left; }
.mainNav .menuLink { 
    display:block; 
    position:absolute; 
    top:-49px; right:18px;
    width:25px; height:25px; 
}
.mainNav .menuLink > span { display:block; }

.mainNav .menuLink:before,
.mainNav .menuLink:after,
.mainNav .menuLink > span:before { 
	content:" "; 
	position:absolute; 
	left:12%;
	width:76%; height:3px; 
	background:#0075c4;	
	-webkit-transition: all 0.3s ease-in-out;
	   -moz-transition: all 0.3s ease-in-out;
	     -o-transition: all 0.3s ease-in-out;
	        transition: all 0.3s ease-in-out;
}
.mainNav .menuLink:before { top:6px; }
.mainNav .menuLink:after { top:12px; }
.mainNav .menuLink > span:before { top:18px; }
.search_flex.mainNav .menuLink:before,
.search_flex.mainNav .menuLink:after {
    content: initial;
}
.mainNav .menuLink:hover:before, 
.mainNav .menuLink:hover:after,
.mainNav .menuLink:hover > span:before,
.mainNav .menuLink:focus:before, 
.mainNav .menuLink:focus:after,
.mainNav .menuLink:focus > span:before, 
.mainNav .menuLink.active:before,
.mainNav .menuLink.active:after,
.mainNav .menuLink.active > span:before { background:#fff; }

.mainNav .menuLink + .mainMenu:before {
	content:" ";
	position:absolute;
	right:25px; bottom:0;
	border:6px solid transparent;
	border:6px solid rgba(0,0,0,0);
	-webkit-transition: all 0.3s ease-in-out 0.3s;
	        transition: all 0.3s ease-in-out 0.3s;
}
.mainNav .menuLink.active + .mainMenu:before { 
	bottom:100%;
	border-bottom:10px solid #357AE8;
}
.search_flex .menuLink.active + .mainMenu:before {
    right: 72px;
}
.mainMenu { display:none; list-style:none; margin:0; padding:20px 10%; font-family:oswald, sans-serif;  background:#357AE8; }
.mainMenu li { border-top:1px solid #6197ed; }
.mainMenu > li:first-child { border-top:0; }
.mainMenu a { 
	display:block;	 
	padding:10px;  
	text-transform:uppercase; 
	color:#002157;
	-webkit-transition: all 0.3s ease-in-out;
	        transition: all 0.3s ease-in-out;
}
.mainMenu a:hover, .mainMenu a:focus, .mainMenu .clicked > a { color:#fff; text-decoration:none; }

.mainMenu .hasSub:before { 
	content:""; 
	display:inline-block; 
	vertical-align:middle;
	margin-right:5px;
	border:6px solid transparent;
	border:6px solid rgba(0,0,0,0);
	border-left:10px solid #fff;
	-webkit-transition: all 0.3s ease-in-out;
	        transition: all 0.3s ease-in-out;
}
.mainMenu a > span { display:inline-block; vertical-align:middle; padding-left:23px; }
.mainMenu .hasSub > span { padding-left:0; }

.mainMenu .clicked .hasSub:before {
	margin-top:5px;
	-webkit-transform:rotate(90deg);
	    -ms-transform:rotate(90deg);
	        transform:rotate(90deg);
}

.mainMenu .subMenu { display:none; border-top:1px solid #6197ed; }
.subMenu ul { margin:0 0 0 24px; padding:0; list-style:none; }
.subMenu ul li {
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
}
.subMenu .columns li { border-top:0; }

@media (min-width:768px){
	.mainNav .menuLink { top:-51px; right:160px; }
}

@media (min-width:960px){
	
	.mainNav { 
		display:inline-block; 
		position:static; 
		vertical-align:middle; 
		margin-top: 4px;
		width: auto; 
		text-align:left;
	}

	.menuLink { display:none; }
	.mainNav .menuLink + .mainMenu:before { display:none; }
	.mainMenu { display:table !important; width:auto; height:36px; background:none; }
	.mainMenu a { color:#4B4B4B; }
	.mainMenu > li { display:table-cell; vertical-align:middle; text-align:center; border:0; }	
	.mainMenu > li > a { 
		display:inline-block;
		vertical-align:middle; 
		padding:10px 5px; 
		font-family: oswald, sans-serif; font-size:.85em; line-height:1em; 
		text-transform:uppercase; 
		color:#fff; 
	}	
	.mainMenu > li > a:hover,
	.mainMenu > li > a:focus,
	.mainMenu > li.clicked > a { color:#357AE8; }

	.mainMenu .hasSub:before { display:none; }

	.mainMenu > li > a > span { display:table; }
	.mainMenu > li > a > span > span { display:table-cell; }
	.mainMenu > li > .hasSub > span:after {
		content:"\2228"; 
		display:table-cell; 
		vertical-align:bottom; 
		width:12px; height:12px; left:16px; 
		font-size:12px; 
		line-height:12px; 
		color:#fff; font-family:arial;
		-webkit-transition: all 0.3s ease-in-out;
		        transition: all 0.3s ease-in-out;
		-o-transform:scale(1.2,0.6);
		-webkit-transform:scale(1,0.5);
		-moz-transform:scale(1.2,0.6);
		transform:scale(1.2,0.6);
	}
	
	.mainMenu > li > .hasSub:hover > span:after,
	.mainMenu > li > .hasSub:focus > span:after,
	.mainMenu > .clicked > .hasSub > span:after { color:#357AE8; }

	
	.mainMenu .subMenu { position:absolute; top:100%; left:0; width:100%; background:rgba(230,230,230,.95); }
	.subMenu .row { margin:0 auto; width:768px; padding:25px 0 15px; overflow:hidden; font-size:.9em; }
	.subMenu ul { margin:0; text-align:left; }
	.subMenu ul a { padding:6px 10px; }
	.subMenu ul ul a { text-transform:none; font-family:arial, sans-serif; }
	.subMenu .columns > li { float:left; margin-bottom:10px; width:25%; padding:0 5px; display: inline-block; box-sizing: border-box; }
	.subMenu .columns > li:nth-child(4n + 1) { clear:left; }
	.subMenu .columns > li > a { color:#002157; }
	.subMenu .columns > li > a.cattegoryNoLink { cursor:default; }
	.subMenu .columns > li > a:hover, .subMenu .columns > li > a:focus { color:#357AE8; }
	.subMenu .columns > li > a.cattegoryNoLink:hover, .subMenu .columns > li > a.cattegoryNoLink:focus { color:#002157; }
	.subMenu .columns a:hover, .subMenu .columns a:focus { color:#357AE8; }
}