/*================================================================
                 CLICK MENU STYLES
================================================================*/

.main-nav { outline:0; position:absolute; top:100%; left:0; margin-top:-1px; width:100%; text-align:left; }
.cm-menu { background:#282c2f; }
.cm-menu, .cm-menu ul { margin:0; padding:0; list-style:none; }

.cm-menu a, .cm-menu a:visited { color:#fff; text-decoration:none; }

.toggle-menu + .cm-menu, .cm-menu ul {
    max-height:0;
    opacity:0;
    overflow:hidden;
    -webkit-transition: max-height 0.4s ease-in-out, opacity 0.4s ease-in-out;
            transition: max-height 0.4s ease-in-out, opacity 0.4s ease-in-out;
}

.cm-menu li a { display:block; padding:15px 20px; position:relative; color:#fff; outline:0; }
.cm-menu > li > a { font-size:1.25em; }

.cm-menu li { border-top:1px solid #fff; }
.cm-menu li:first-child { border-top:0; }
.cm-menu li { position:relative; }

.cm-menu .opened > a,
.cm-menu li > a:hover,
.cm-js-inFocus li > a:focus,
.cm-menu li > div > a:hover,
.cm-js-inFocus li > div > a:focus { background:#05345e; }

.cm-menu li .opened > a,
.cm-menu li li > a:hover,
.cm-js-inFocus li li > a:focus,
.cm-menu li li > div > a:hover,
.cm-js-inFocus li li > div > a:focus { background:#104271; }

.cm-js-active .cm-menu { max-height:80em; opacity:1; }
.cm-menu .opened > ul { max-height:80em; opacity:1; }

.cm-menu li li:first-child { padding-top:12px; border-top:1px solid #ccc; }
.cm-menu li li:last-child { padding-bottom:12px; }
.cm-menu li li { border:0; }
.cm-menu li li a { padding:3px 20px; font-size:.875em; }
.cm-menu li li li a { padding:3px 40px; }
.cm-menu li .opened + li { border-top:1px solid #ccc; }

.cm-menu .has-sub:after,
.cm-menu .expander-wrap .has-sub > span:after {
    content:" ";
    display:inline-block;
    position:absolute; top:50%; right:10px;
    margin:2px 0 0 5px;
    vertical-align:middle;
    border:5px solid transparent;
    /* Extra is for anti-aliasing issues in firefox and others */
    border:5px solid rgba(0,0,0,0);
    border-top-color:#fff;
    -wekbit-transition: all 0.4s ease-in-out;
            transition: all 0.4s ease-in-out;
    -webkit-transform: scale(0.98) translateY(-50%);
        -ms-transform: scale(0.98) translateY(-50%);
            transform: scale(0.98) translateY(-50%);
}

@media (min-width:1024px){
	.cm-menu > li > .has-sub:after {
		opacity:0;
	}

	.cm-menu > li > .has-sub > span {
		position:relative;
	}
	.cm-menu > li > .has-sub > span:after {
		content:"";
		display:block;
		margin: 10px 20px 0 20px;
		height:2px;
	}
	.cm-menu > li > .has-sub:hover > span:after, .cm-menu > li > .has-sub:focus > span:after, .cm-menu > li.opened > .has-sub > span:after { background:#fff; }
}

.cm-menu .opened > .has-sub:after,
.cm-menu .opened > .expander-wrap .has-sub > span:after{
    -webkit-transform: scale(0.98) translateY(-75%) rotate(-180deg);
        -ms-transform: scale(0.98) translateY(-75%) rotate(-180deg);
            transform: scale(0.98) translateY(-75%) rotate(-180deg);
}

.cm-menu > .opened > a,
.cm-menu > li > a:hover,
.cm-menu > li > a:focus,
.cm-menu > li > div > a:hover,
.cm-menu > li > div > a:focus { color: #fff; background: #393d3f; }

.cm-menu .expander-wrap .has-sub:hover > span,
.cm-menu .expander-wrap .has-sub:focus > span {     color: #fff; background: #393d3f; }

.cm-menu ul .opened > a,
.cm-menu ul a:hover, .cm-menu ul li a:focus { background:#444; }

.cm-menu ul .opened > .has-sub:after,
.cm-menu ul .opened > .expander-wrap .has-sub > span:after{
    border-top-color:#fff;
}

.cm-js-active .cm-menu { max-height:80em; opacity:1; }
.cm-menu .opened > ul { max-height:80em; opacity:1; }

/* ================= HOVER FALLBACK IF JAVASCRIPT IS DISABLED ================= */

.no-js .toggle-menu + .cm-menu { opacity:1; max-height:80em; }

.no-js .cm-menu li:hover > ul { display:block; max-height:80em; opacity:1; width:100%; }
.no-js .cm-menu ul { display:none; overflow:visible; }

/* ================= MENU OPEN FUNCTIONALITY ADDED ON SETUP ================= */

@media (min-width:1024px){
    .main-nav { position:static; margin-top:0; }
    .toggle-menu + .cm-menu { max-height:80em; opacity:1; overflow:visible; }
    .cm-menu { background:transparent; }
    .cm-menu ul { top:100%; overflow:hidden; }
    .cm-menu .opened > ul { max-height:80em; opacity:1; }

    .cm-menu .animated > ul { overflow:visible; z-index:10; }
    .cm-menu .animating > ul { z-index:-1; }
}

/*================================================================
                 CLICK MENU MENU TYPES
================================================================*/

/*  NAV BAR STYLE TYPE
    ================================================================*/

@media (min-width:1024px){
    .nav-bar li { border-top:0; }

    .nav-bar > ul { display:table; width:100%; }
    .nav-bar > ul > li { display:table-cell; vertical-align:middle; }
    .nav-bar > ul > li > a { display:table; width:100%; padding:0; background:none; }
    .nav-bar > ul > li > a > span { display:table-cell; padding:0 10px; height:110px; vertical-align:middle; text-align:center; color: #221e1f; font-size:19px; padding-bottom: 10px; }
    .nav-bar > ul > li > a.has-sub > span { padding-bottom: 0px; }

    .nav-bar > ul > li > a:hover, .nav-bar > ul > li > a:focus, .nav-bar > ul > li.opened > a { background: #393d3f; }
	.nav-bar > ul > li > a:hover > span, .nav-bar > ul > li > a:focus > span, .nav-bar > ul > li.opened > a > span { color: #fff; }
    .nav-bar > ul > li > ul { position:absolute; }

    .nav-bar .has-sub span:after { position:static; margin-top:10px; }
    .nav-bar ul ul .has-sub:after { right:5px; }

    .nav-bar ul li li { margin:5px; }
    .nav-bar ul li li li { margin-left:0; margin-right:0; }
    .nav-bar ul ul a { padding:3px 15px; background:none; }

    .nav-bar ul ul a:hover, .nav-bar ul ul a:focus,
    .nav-bar ul ul .opened > a { background:none; }

    /* ================= HOVER FALLBACK IF JAVASCRIPT IS DISABLED ================= */

    .no-js .nav-bar ul ul li:hover > a { color:#000; background:#ddd; }
}
@media (min-width:1024px) and (max-width:1200px) {
	.nav-bar > ul > li > a > span { font-size:17px; }
}

/*  MEGA MENU NAVIGATION ADJUSTMENTS
    ================================================================*/

.custom-sub {
    max-height:0; min-height:0;
    overflow:hidden;
    transform-style: preserve-3d;
    -webkit-transform: transform3d(0,0,0);
        -ms-transform: transform3d(0,0,0);
            transform: transform3d(0,0,0);
    -webkit-transition: all 0.5s ease-in-out;
            transition: all 0.5s ease-in-out;
}
[data-type="mega"] .custom-sub .row.flexing { table-layout:fixed; }
[data-type="mega"] .custom-sub ul { position:static; opacity:1; max-height:80em; overflow:hidden; }
[data-type="mega"] .custom-sub ul li { border-top:0; }

[data-type="mega"] .custom-sub li a { display:block; font-size:21px; color:#fff; }
[data-type="mega"] .custom-sub li .tier-3 a { color:#fff; }

[data-type="mega"] .custom-sub li a:hover,
.cm-js-inFocus [data-type="mega"] .custom-sub li a:focus { color:#0071ba; background:none; }

.cm-menu .opened > .custom-sub { max-height:80em; opacity:1; z-index:20; }
.cm-menu .animated > .custom-sub { overflow:visible; }
.cm-menu .animating > .custom-sub { z-index:-1; }

.cm-menu .custom-sub .has-sub:after { }

.cm-menu .custom-sub .column { position:relative; }

.nav-item .media { position:relative; overflow:hidden; max-width: 300px; }
.nav-item .media:after {
    content:" ";
    position:absolute;
    top:0; right:100%;
    width:100%; height:100%;
    background:#0071bb;
    -webkit-transition: all 0.3s ease-in-out;
            transition: all 0.3s ease-in-out;
}
.nav-item .media img { width:100%; }

.nav-item:hover .media:after, .nav-item:focus .media:after { right:0; opacity:.3; }

.nav-item .title { font-weight: bold; font-size: 33px;  margin: 0 0 20px 0; display: block; }
.nav-item .content { /* color: #333333; */ padding: 15px 0; }
.nav-item .content > strong { font-size: 14px;  letter-spacing: 0.1em; display:block; margin-bottom:5px;}
.nav-item .content p {}
.nav-item .content .more { color:#fff;}

.tier-3 {
    display:none;
    transform-style: preserve-3d;
    -webkit-transform: transform3d(0,0,0);
        -ms-transform: transform3d(0,0,0);
            transform: transform3d(0,0,0);
}
@media (max-width:1239px) {
	.custom-sub .opened .tier-3 {display:block;}
	.cm-menu .opened > .custom-sub {max-height: 300em;}
	[data-type="mega"] .custom-sub ul {max-height: 300em;}
	[data-type="mega"] .tier-3 ul{
		max-height: 300em;
		-webkit-column-count: 3;
		-webkit-column-gap: 25px;
		-moz-column-count: 3;
		-moz-column-gap: 25px;
		column-count: 3;
		column-gap: 25px;
	}
	[data-type="mega"] .tier-3 ul a {margin-bottom:0; padding-top:0; padding-bottom:0;}
	[data-type="mega"] .tier-3 ul{
		margin-bottom:10px;
		padding-bottom: 10px;
	    -webkit-column-count: 2;
		-webkit-column-gap: 10px;
		-moz-column-count: 2;
		-moz-column-gap: 10px;
		column-count: 2;
		column-gap: 10px;
	}
	.cm-menu li li li:first-child {padding-top: 0;}
	.cm-menu li li li a {padding: 3px 10px;}
}
@media (max-width:1023px) {
	[data-type="mega"] .tier-3 ul a { font-size:16px}
}

@media (max-width:479px) {
	[data-type="mega"] .tier-3 ul{
	    -webkit-column-count: 1;
		-webkit-column-gap: 10px;
		-moz-column-count: 1;
		-moz-column-gap: 10px;
		column-count: 1;
		column-gap: 10px;
	}
	.cm-menu li li li a {
		padding: 3px 20px;
	}
}

@media (max-width:45em) {
    .cm-menu .custom-sub .column { display:block; }
}

@media (min-width:1024px){
    .cm-menu [data-type="mega"] { position:static; }

    [data-type="mega"] .custom-sub {
        position:absolute;
        top:100%; left:0; right:0;
        background:#002240;
    }
    [data-type="mega"] .custom-sub .container { padding:30px 10px; }
    [data-type="mega"] .custom-sub .row.flexing { display:block; }
    [data-type="mega"] .custom-sub .row.flexing .column { width:280px;  float:left; vertical-align:top; min-height:535px; }
	[data-type="mega"] .custom-sub .row.flexing .column:first-child { width:280px; padding-right: 60px; }
	[data-type="mega"] .custom-sub .row.flexing .column:nth-child(2) { padding-left: 40px; width:320px;}

    [data-type='mega'] .custom-sub ul { overflow:visible; }
    [data-type="mega"] .custom-sub ul li { padding-top:0; position:static; }

    [data-type="mega"] .custom-sub li { margin:0; }
    [data-type="mega"] .custom-sub li a { padding:9px 20px; }

    .cm-menu .custom-sub .has-sub:after {
        display:inline-block;
        position: absolute;
        right: 0;
        top: 12px;
        -webkit-transform: scale(0.98);
            -ms-transform: scale(0.98);
                transform: scale(0.98);
    }
    .cm-menu .custom-sub .has-sub:hover:after {
        border-left-color:#fff;
    }
    .cm-menu .custom-sub .opened > .has-sub:after {
        opacity:0;
        -webkit-transform: scale(0.98);
            -ms-transform: scale(0.98);
                transform: scale(0.98);
    }
    [data-type="mega"] .custom-sub .opened > .has-sub:hover,
    .cm-js-inFocus [data-type="mega"] .custom-sub .opened > .has-sub:focus,
    [data-type="mega"] .custom-sub .opened > .has-sub { color:#fff; background:#4c4849;  }

    /* Adjustments for 3rd tier navigation layout */

    .cm-menu .custom-sub .container { overflow:hidden; min-height:535px; }
    .cm-menu .custom-sub .column:first-child {
        z-index:10;
    }
    .cm-menu .custom-sub .column + .column { z-index:1; }
    [data-type="mega"] .tier-3 {
        display:block;
        position:absolute;
        top:-30px; left:1200px;
        width:945px;
        height:595px;
        max-height:0;
        overflow:hidden;
        background:#003665;
        z-index:-1;
        -webkit-transition: left 0.5s ease-in-out;
                transition: left 0.5s ease-in-out;
    }
    /* IE11 ADJUSTEMNT */
    _:-ms-lang(x), [data-type="mega"] .tier-3 {
        opacity:0;
        -webkit-transition: opacity 0.5s ease-in-out;
                transition: opacity 0.5s ease-in-out;
    }
    /* EDGE OVERWRITE */
    @supports (-ms-accelerator:true) {
        [data-type="mega"] .tier-3 {
            opacity:1;
            -webkit-transition: left 0.5s ease-in-out, opacity 0s;
                    transition: left 0.5s ease-in-out, opacity 0s;
        }
    }
    [data-type="mega"] .tier-3 a {color:#fff;}
	[data-type="mega"] .opened > .tier-3 {
        overflow-y:auto;
        left:285px;
        opacity:1;
        max-height:595px;
		background: #4c4849;
    }
    [data-type="mega"] .tier-3 .section-link a { margin:15px 25px 0; padding:0 0 10px; border-bottom:1px solid #fff; }
    [data-type="mega"] .tier-3 .section-link + ul { padding-top:15px; }
    [data-type="mega"] .tier-3 ul {
        margin:0;
        padding: 25px 25px 15px;
        width:855px;
    }
    [data-type="mega"] .custom-sub .tier-3 li { margin:0 0 3px; }
    [data-type="mega"] .custom-sub .tier-3 li a { margin:0; padding:0; font-size:18px; font-weight:normal; }

	.cm-menu [data-type="mega"] .has-sub:after {
		content:" ";
		display:inline-block;
		position:absolute; top:50%; right:10px;
		margin:2px 0 0 5px;
		vertical-align:middle;
		border:5px solid transparent;
		/* Extra is for anti-aliasing issues in firefox and others */
		border:5px solid rgba(0,0,0,0);
		border-left-color:#fff;
		-wekbit-transition: all 0.4s ease-in-out;
				transition: all 0.4s ease-in-out;
		-webkit-transform: scale(0.98) translateY(-50%);
			-ms-transform: scale(0.98) translateY(-50%);
				transform: scale(0.98) translateY(-50%);
	}
	.cm-menu [data-type="mega"] .has-sub:hover:after { border-left-color:#0071ba; }

    /* ================= OPENED FUNCTIONALITY ADDED ON SETUP ================= */

    .cm-menu .custom-sub { opacity:0; }
    .cm-menu .opened > .custom-sub { min-height:560px; opacity:1; }

    [data-type="mega"] a + .has-sub { width:0; min-height:0; height:100%; }
    [data-type="mega"] a + .has-sub > span { min-height:0; height:100%; }

    /* ================= SEPARATE EXPANDERS OPTION IS ENABLED ================= */

    [data-type="mega"] ul a + .has-sub { display:none; }

    /* ================= HOVER FALLBACK IF JAVASCRIPT IS DISABLED ================= */

    .no-js .cm-menu [data-type="mega"] ul ul { display:block; }

    .cm-menu li .nav-item {  padding-bottom:70px; min-height:370px; }
    .nav-item .content .btn { position:absolute; left:20px; bottom:30px; }
}

@media (min-width:1240px){
	[data-type="mega"] .custom-sub .container { padding:30px 0px; }
	[data-type="mega"] .custom-sub .row.flexing .column { width:350px; }
    [data-type="mega"] .custom-sub .row.flexing .column:first-child {  width: 370px; }
    [data-type="mega"] .custom-sub .row.flexing .column:nth-child(2) {  width: 390px; }
    [data-type="mega"] .custom-sub .row.flexing .wide.column {  width: 780px !important; }

	.cm-menu [data-type="mega"] .custom-sub .row.flexing .column .nav-item { padding: 0 30px 15px 30px;}
}

/*================================================================
                 NAVIGATION TOGGLE STYLES
================================================================*/

.toggle-menu { display:block; position:relative; width:50px; height:46px; background:#333; }
.toggle-menu:before, .toggle-menu:after, .toggle-menu > span:before {
    content:" ";
    position:absolute;
    left:15%;
    border-radius:2px;
    width:70%; height:3px;
    background:#fff;
}

.toggle-menu:before { top:11px; }
.toggle-menu:after { top:21px; }
.toggle-menu > span:before { top:31px; }

.toggle-menu:hover, .toggle-menu:focus, .js-menu-active .toggle-menu { background:#111; }

@media (min-width:1024px){
    .toggle-menu { display:none; }
}

a.new-toggle {
    display: block;
    position: relative;
    width: 56px;
    height: 21px;
    padding-top: 40px;
    text-align: center;
    font-size: 13px;
    color: #000;
}
.new-toggle:before, .new-toggle:after, .new-toggle > span:before {
    content: " ";
    position: absolute;
    left: 25%;
    width: 50%;
    height: 3px;
    background: #000;
}
.new-toggle:before {
    top: 11px;
}
.new-toggle:after {
    top: 20px;
}
.new-toggle > span:before {
    top: 29px;
}
@media (min-width: 1024px) {
	a.new-toggle { display: none; }
}

/*================================================================
                 EXTRA OVERWRITE STYLES
================================================================*/

.main-nav { position:relative; z-index:1000; }
@media (min-width:1024px){
	.main-nav { position:static; }
	.cm-menu { position: static; }
}

[data-type="sliding"] .sub-menu .item-banner { width:100%; }
[data-type="sliding"] .sub-menu .item-banner a { text-align:center; background:none; }

[data-type="mega"] .custom-sub {
    max-height:0; opacity:0;
    overflow:hidden;
    -wekbit-transition: all 0.5s ease-in-out;
            transition: all 0.5s ease-in-out;
}
.cm-menu .custom-sub ul { position:static; opacity:1; max-height:80em; }
[data-type="mega"] .custom-sub p { color:#fff; margin-bottom:10px; }

[data-type="mega"] .custom-sub .banner-wrap { width:100%; }
[data-type="mega"] .custom-sub .banner-wrap a { text-align:center; background:none; }

.cm-menu .opened > .custom-sub { max-height:80em; opacity:1; padding:0px 20px; }
.cm-menu .animated > .custom-sub { overflow:visible; z-index:10; }
.cm-menu .animating > .custom-sub { z-index:-1; }

@media (min-width:1024px) {
    [data-type="mega"] .custom-sub {
        position:absolute;
        top:100%; left:0;
        width:100%;
        /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#3e3a3b+0,3e3a3b+36,312f30+36,312f30+100 */
		background: rgb(62,58,59); /* Old browsers */
		background: -moz-linear-gradient(left,  rgba(62,58,59,0.95) 0%, rgba(62,58,59,0.95) 30%, rgba(49,47,48,0.95) 30%, rgba(49,47,48,0.95) 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(left,  rgba(62,58,59,0.95) 0%,rgba(62,58,59,0.95) 30%,rgba(49,47,48,0.95) 30%,rgba(49,47,48,0.95) 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to right,  rgba(62,58,59,0.95) 0%,rgba(62,58,59,0.95) 30%,rgba(49,47,48,0.95) 30%,rgba(49,47,48,0.95) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    }
}
@media (min-width:1500px) {
    [data-type="mega"] .custom-sub {
        /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#3e3a3b+0,3e3a3b+36,312f30+36,312f30+100 */
		background: rgb(62,58,59); /* Old browsers */
		background: -moz-linear-gradient(left,  rgba(62,58,59,0.95) 0%, rgba(62,58,59,0.95) 36%, rgba(49,47,48,0.95) 36%, rgba(49,47,48,0.95) 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(left,  rgba(62,58,59,0.95) 0%,rgba(62,58,59,0.95) 36%,rgba(49,47,48,0.95) 36%,rgba(49,47,48,0.95) 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to right,  rgba(62,58,59,0.95) 0%,rgba(62,58,59,0.95) 36%,rgba(49,47,48,0.95) 36%,rgba(49,47,48,0.95) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    }
}

@media (min-width:1024px) {
    .table-row { display:table; width:100%; }
    .table-col { display:table-cell; vertical-align:top; }
}

.section-nav .opened > ul { border-bottom:1px solid #d4d4d4; max-height:80em; opacity:1; }
.section-nav .opened > a,
.section-nav .opened > .expander-wrap a { border-bottom:1px solid #aaa; color:#333; background:#d4d4d4; }
.section-nav .opened .opened > .expander-wrap > a { background:#c4c4c4; }

/* Additional changes for drawer */
body {overflow-x: hidden;}
.site-wrap {
    position:relative; z-index:2000;
    left:0;
    width:100%;
    -wekbit-transition: all 0.2s ease-in-out;
            transition: all 0.2s ease-in-out;
}
body > .main-nav {
    position:absolute; z-index:1000;
    top:0; right:100%;
    width:100%; height:100%;
    -wekbit-transition: all 0.2s ease-in-out;
            transition: all 0.2s ease-in-out;
}
body > .main-nav .toggle-menu { display:none; }
.cm-js-menu-active .main-nav { padding-left:17%; right:17%; left:auto; }
.cm-js-menu-active .site-wrap { left:83%; }

.main-header .main-nav { display:none; }

@media (min-width:1024px) {
    .new-toggle { display:none; }
    body > .main-nav { display:none; }
    .main-header .main-nav { display:block; }

    .cms-js-menu-active .site-wrap { left:0; }
}

/* SPECIAL NAVIGATION ITEM */
.nav-bar > ul > li > a.special-nav-item:hover, .nav-bar > ul > li > a.special-nav-item:focus { background:none; }
.nav-bar > ul > li > a.special-nav-item > span { color:#fff; }
.nav-bar > ul > li > a.special-nav-item:hover > span, .nav-bar > ul > li > a.special-nav-item:focus > span { opacity:0.7; }
.special-nav-item > span:before {content: "";  display: block; position: absolute;  height: 53px; width:100%; top: 23px; left:0; background: #0071bb; color:#fff; z-index:-1; }
.cm-menu > li > .has-sub.special-nav-item  > span:after  { background: #0071bb; }