/* custom_nav_main_partial.html - global */
.navigation a {
	display: block;
	padding: 12px 16px;
	width: 100%;
	line-height: 1.2;
	color: inherit;
	text-decoration: none;
}

.navigation a:hover {
	color: #FFF;
}
.navigation a:focus {
	text-decoration: none;
	outline: 1px dashed rgba(255,255,255, 0.4);
	color: #FFF;
}

.navigation .nav-item .nav-item-control {
	display: flex;
	justify-content: flex-start;
	color: #FFF;
	transition: background-color 100ms cubic-bezier(0,0,0.3,1);
}

.navigation .nav-item .dropdown-toggle {
	margin: 0;
	padding: 0px 2px 0px 4px;
	color: inherit;
	background-color: transparent;
	transition: background-color 100ms cubic-bezier(0,0,0.3,1);
	font-size: 12px
}

.navigation .nav-item .dropdown-toggle:focus {
	outline: 1px dashed rgba(255,255,255, 0.4);
}

/* custom_nav_main_partial.html - mobile */
.navigation.mobile {

}
.navigation.mobile .nav-item .nav-item-control {
	color: #FFF;
	letter-spacing: 0.06em;
	font-family: var(--acumin-pro);
}
.navigation.mobile a {
	line-height: 1em;
}

.navigation.mobile .nav-item.level-1 > .nav-item-control {
	background-color: var(--dark-gray);
}

.navigation.mobile.primary .nav-item.level-1 > .nav-item-control {
	font-size: 20px;
	font-family: "din-condensed",sans-serif;
	text-transform: uppercase;
	letter-spacing: 0;
}

.navigation.mobile.primary .nav-item.level-1.open > .nav-item-control {
	border-bottom: 2px solid #98b2bb;
}

.navigation.mobile .nav-item > .nav-item-control > .dropdown-toggle{
	font-size: 10px;
	padding: 0 14px;
	max-height: 32px;
}

.navigation.mobile .nav-item.level-1 > .nav-item-control > .dropdown-toggle{
	font-size: 14px;
	padding: 0 14px;
}

.navigation.mobile .nav-item.level-1 > .nav-item-control > a {
	padding: 4.5px 0px 4.5px 13px;
	line-height: 0.9em;
}

.navigation.mobile .nav-item.level-1:last-child > .nav-item-control > a {
	padding-bottom: 11px;
}

/* .navigation.mobile .nav-item.level-1.open > .nav-item-control > a {
	padding-bottom: 0;
} */

/*All these specific paddings were necessary to match spacings to PSDs without loosing transparency*/
.navigation.mobile .nav-item.level-2 > .nav-item-control > a { padding: 4px 0px 4px 25px;}
.navigation.mobile .nav-item.level-2.open > .nav-item-control > a {	padding: 4px 0px 7px 25px;}

.navigation.mobile .nav-item.level-3 > .nav-item-control > a { padding: 5px 0px 4.5px 41px;}
.navigation.mobile .nav-item.level-3.open > .nav-item-control > a { padding: 1.5px 0px 6.5px 41px; }
.navigation.mobile .nav-item.level-4 > .nav-item-control > a { padding: 5px 0px 4.75px 58px;}

.navigation.mobile .nav-item.level-2:first-child:not(.open) > .nav-item-control > a,
.navigation.mobile .nav-item.level-3:first-child:not(.open) > .nav-item-control > a,
.navigation.mobile .nav-item.level-4:first-child:not(.open) > .nav-item-control > a   {
	padding-top: 7px
}

.navigation.mobile .nav-item.level-2:last-child:not(.open) > .nav-item-control > a,
.navigation.mobile .nav-item.level-3:last-child:not(.open) > .nav-item-control > a,
.navigation.mobile .nav-item.level-4:last-child:not(.open) > .nav-item-control > a { 
	padding-bottom: 10px
}

.navigation.mobile .nav-item.level-1.open + .nav-item > .nav-item-control > a { padding-top: 12px;}
/*--*/


.navigation.mobile .nav-item.open.level-2 > .nav-item-control {
	background-color: #45BCEB;
}
.navigation.mobile .nav-item.open.level-3 > .nav-item-control {
	background-color: #b24471;
}
.navigation.mobile .nav-item.level-2 > .nav-item-control {
	background-color: var(--dark-gray);
	font-size: 15px;
	letter-spacing: 0.05em;
	color: #FFF;
}

.navigation.mobile .nav-item.level-3 > .nav-item-control {
	background-color: var(--dark-gray);
}

.navigation.mobile .nav-item.level-4 > .nav-item-control {
	background-color: var(--dark-gray);
}

.navigation.mobile .nav-item .dropdown-toggle{
	font-size: 16px;
	padding: 0 4px;
}
.navigation.mobile .nav-item .dropdown-toggle:focus{
	outline: none;
}

.navigation.mobile .nav-item .dropdown-toggle .icon-toggle {
	transform-origin: center;
	transition: transform 300ms cubic-bezier(0,0,0.3,1);
}
.navigation.mobile .nav-item:not(.level-1) .dropdown-toggle .icon-toggle {
	position: relative;
	top: 1px;
}
.navigation.mobile .nav-item.open > .nav-item-control .dropdown-toggle .icon-toggle {
	transform: rotate(-180deg);
}

.navigation.mobile .nav-item .dropdown-menu a {
	font-size: 15px;
    letter-spacing: 0.045em;
    font-weight: 500;
}

/*Mobile Secondary + Mobile Footer*/

.navigation.mobile.secondary,
.navigation.mobile.footer{
	position: relative;
	background-color: var(--dark-gray);
	padding: 8px 0px 10px;
	border-top: 2px solid #7896a1;
}

.navigation.mobile.secondary .nav-item > .nav-item-control,
.navigation.mobile.footer .nav-item > .nav-item-control {
	background-color: transparent;
}

.navigation.mobile.secondary .nav-item.level-1 > .nav-item-control > a,
.navigation.mobile.footer .nav-item.level-1 > .nav-item-control > a {
	font-size: 14px;
	text-transform: none;
	padding: 5.5px 0px 5.5px 14px;
}

.navigation.mobile.footer .nav-item.level-1 > .nav-item-control > a{
	padding: 4.5px 0px 4.5px 14px;
}

/* custom_nav_main_partial.html - desktop */
.navigation.desktop {
	position: relative;
	display: flex;
	justify-content: space-between;
}


.navigation.desktop .nav-item:not(.level-1) .nav-item-control {
	font-size: 17px;
	letter-spacing: 0.07em;
	font-weight: 500;
    letter-spacing: 0.065em;
    margin-bottom: 5px;

}
.navigation.desktop .nav-item:not(.level-1) .nav-item-control > a{
	padding: 0px 0px 3px 13px;
	line-height: 21px;
	width: auto;
    display: inline-block;
}

.navigation.desktop .nav-item.level-2.open > .nav-item-control, 
.navigation.desktop .nav-item.level-2 > .nav-item-control:hover { 
	background-color: #45BCEB;
}

.navigation.desktop .nav-item.level-3.open > .nav-item-control,
.navigation.desktop .nav-item.level-3 > .nav-item-control:hover { 
	background-color: #13a79e;
}

.navigation.desktop .nav-item.level-4.open > .nav-item-control,
.navigation.desktop .nav-item.level-4 > .nav-item-control:hover { 
	background-color: #8f3c76; 
}

.navigation.desktop .dropdown-menu {
	display: block !important;
	opacity: 0;
	pointer-events: none;
	transition: opacity ease 0.4s;
	z-index: 30;
	padding-top: 5px;
	padding-bottom: 5px;
}
.navigation.desktop .level-1.nav-item:not(:last-child){
	margin-right: calc(35px + (38.5 - 35) * ((100vw - 1025px) / (1300 - 1025)));
}

.navigation.desktop .level-1.nav-item > .nav-item-control {
	color: #fff;
	font-family: "din-condensed",sans-serif;
	text-transform: uppercase;
	font-size: calc(24px + (30 - 24) * ((100vw - 1025px) / (1300 - 1025)));
	border-bottom: 2px solid transparent;

	transition: border-color ease 0.4s;
}
.panel-header .nav-container.microsites {
	-webkit-transition: margin 400ms ease;
	-moz-transition: margin 400ms ease;
	-o-transition: margin 400ms ease;
	transition: margin 400ms ease;
}

.panel-header.sticky .nav-container.microsites {
	margin-right: 55px;
}


@media (min-width: 1300px) {
	.navigation.desktop .level-1.nav-item:not(:last-child){
		margin-right: 38.5px;
	}

	.navigation.desktop .level-1.nav-item > .nav-item-control {
		font-size: 30px;
	}
}

.navigation.desktop .level-1.nav-item > .nav-item-control > a {
	padding: 4px 0px;
    line-height: 1em;
}

.navigation.desktop .level-1.nav-item > .nav-item-control > .dropdown-toggle {
	display: none;
}

.navigation.desktop .level-1.nav-item.open > .nav-item-control {
	border-color: #FFF;
}

/* Desktop - Secondary*/
.navigation.desktop {

}

.navigation.desktop.secondary .level-1.nav-item:not(:last-child){
	margin-right: 21.5px;
}

.navigation.desktop.secondary .level-1.nav-item > .nav-item-control {
	text-transform: capitalize;
	font-size: 20px;
}
.navigation.desktop.secondary .level-1.nav-item > .nav-item-control > a {
	padding: 0 0 4px;
}

/*Footer NAV*/
.navFooter {
	list-style: none;
	display: flex;
	flex-direction: column;
	margin: 0 0 17px;
}

.navFooter li {
	margin-bottom:  	2px;
}
.navFooter a{
	font-family: var(--acumin-pro);
	text-transform: uppercase;
	font-weight: bold;
	color: #FFF;
	font-size: 16px;
	letter-spacing: 0.04em;
}

.navFooter a:hover,
.navFooter a:focus{
	color: #FFF;
}

@media (min-width: 64em) {
	.navFooter{
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: center;
		margin-bottom: 10px;
		margin-left: 6px;
	}

	.navFooter li{
		margin: 0 38px 5px 0;
	}

	.navFooter li:last-child{
		margin-right: 36px;
	}
	.navFooter a{
		font-size: 15px;
		letter-spacing: 0.04em;
	}

	.navFooter a:hover,
	.navFooter a:focus{
		color: #FFF;
	}
}