/* ============================================================
   Header & Navigation
   Topbar, multi-level drop-down menu, mega-dropdown, search
   ============================================================ */


/* ============================================================
   BASE HEADER
   ============================================================ */

#header{
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 100;
	width: auto;
	height: var(--header-height);
	margin: 0;
	background: var(--palette-white);
	border-bottom: solid 1px var(--palette-darkblue);
	overflow: hidden;
	scrollbar-width: none;
	transition: top .4s ease;
}
#header .container{
	width: 100%;
	height: 100%;
	padding: 10px 0;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	align-items: center;
}
.scrolling #header{
	top: -44px;
}
.nav-expanded #header,
.scrolling.nav-expanded #header{
	height: 100vh;
	overflow-y: auto;
}
.nav-expanded #header{
	background: var(--palette-white);
}
.global-nav-expanded #header{
	overflow: visible;
}


/* ============================================================
   TOPBAR (Global navigation)
   ============================================================ */

#header .topbar{
	position: relative;
	z-index: 200;
	background: var(--palette-darkblue);
	color: var(--palette-white);
}
#header .topbar .container{
	padding-top: 2px;
	padding-bottom: 0;
	display: flex;
	flex-flow: row nowrap;
	justify-content: flex-end;
}
#header .topbar ul{
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-flow: row nowrap;
	justify-content: flex-end;
}
#header .topbar li{
	position: relative;
	margin: 0;
	padding: 0;
}
#header .topbar a{
	display: inline-flex;
	flex-flow: row nowrap;
	align-items: flex-start;
	margin: 0;
	padding: 8px 8px 8px 12px;
	font-size: 12px;
	font-weight: 400;
	cursor: pointer;
	text-decoration: none;
}

/* --- Topbar dropdowns --- */

#header .topbar ul ul{
	position: absolute;
	top: calc(100% + 10px);
	right: 0;
	z-index: 200;
	display: none;
	display: block;
	width: auto;
	height: auto;
	margin: 0;
	padding: 12px;
	background: var(--palette-darkblue);
	border-radius: var(--border-radius);
	opacity: 0;
	pointer-events: none;
	transition: all .2s ease;
}
#header .topbar ul ul::before{
	position: relative;
	top: -24px;
	display: block;
	width: 100%;
	height: 12px;
	background: no-repeat center top transparent;
	/* small triangle at top of box */
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cpath d='M4.874,4.874l16.233-5.2-5.2,16.233-16.233,5.2Z' transform='translate(15.152 0.455) rotate(45)' fill='%230b3b5b'/%3E%3C/svg%3E");
	content: "";
}
.global-nav-expanded #header .topbar ul ul{
	display: block;
	opacity: 1;
	pointer-events: initial;
}

#header .topbar li.menu-item-has-children a::after{
	content: "";
	display: inline-block;
	width: 24px;
	height: 24px;
	margin-left: 4px;
	background: no-repeat right center transparent;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: %23ffffff; %7D %3C/style%3E%3C/defs%3E%3Cpolygon class='cls-1' points='8.4 6.92 13.48 12 8.4 17.08 9.81 18.49 16.31 12 9.81 5.51 8.4 6.92'/%3E%3C/svg%3E");
	background-size: 24px 24px;
	transform: rotate(90deg);
	transition: transform .2s ease;
}
#header .topbar li.is-active a::after{
	transform: rotate(270deg);
}
#header .topbar ul ul a::after{
	display: none;
}
#header .topbar li.active a{
	opacity: .5;
}
#header .topbar li.menu-item-has-children li a::after{
	display: none;
}


/* ============================================================
   LOGO
   ============================================================ */

#logo{
	width: 140px;
	flex-shrink: 0;
}
#logo img, #logo svg{
	max-width: 100px;
}


/* ============================================================
   TOGGLE NAV BUTTON
   ============================================================ */

.toggle-nav{
	position: relative;
	right: -6px;
}


/* ============================================================
   NAVIGATION — MOBILE (default)
   ============================================================ */

#nav{
	position: relative;
	z-index: 100;
	width: 100%;
	transition: height .2s ease-out;
	pointer-events: none;
}
.nav-expanded #nav{
	pointer-events: auto;
}
#nav ul{
	margin: 44px 0;
	padding: 0;
	list-style: none;
}
#nav li{
	position: relative;
	display: block;
	width: 100%;
	margin: 2px 0;
	padding: 0;
	list-style: none;
	border-bottom: solid 1px rgba(11,59,91, .15);
}
#nav a{
	position: relative;
	display: inline-block;
	width: calc( 100% - 50px );
	padding: 12px 0;
	font-size: 16px;
	color: inherit;
	font-weight: 600;
	text-decoration: none;
	transition: border .5s;
}
#nav a:hover{
	border-color: #ff8d2e;
}

/* --- Submenu toggle (mobile) --- */

#nav a.toggle-children{
	position: absolute;
	top: 14px;
	right: 8px;
	display: block;
	width: 24px;
	height: 24px;
	margin: 0;
	padding: 0;
	border: 0 !important;
	outline: none;
	background: no-repeat center center transparent;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: %230b3b5b; %7D %3C/style%3E%3C/defs%3E%3Cpolygon class='cls-1' points='8.4 6.92 13.48 12 8.4 17.08 9.81 18.49 16.31 12 9.81 5.51 8.4 6.92'/%3E%3C/svg%3E");
	background-size: 24px 24px;
	transform: rotate(90deg);
	transition: transform .25s;
}
#nav a.toggle-children.active{
	transform: rotate(270deg);
}

#nav .current-menu-item a,
#nav .current_page_item a{}

/* --- Sub-menus (mobile) --- */

#nav ul ul{
	display: none;
	margin: 0;
}
#nav li li{ max-width: 420px; border-bottom: 0; }
#nav li li:first-child{	margin-top: 0; }
#nav li li:last-child{ padding-bottom: 24px; }
#nav li li a{
	padding: 8px 0 8px 24px;
	font-size: 14px;
}
#nav .current-menu-item li a,
#nav .current_page_item li a{
	border-color: #f0f0f0;
}
#nav li .current-menu-item a{
	opacity: .5;
}
#nav .current-menu-item li a:hover,
#nav .current_page_item li a:hover{
	border-color: #ff8d2e;
}


/* ============================================================
   MEGA DROPDOWN
   ============================================================ */

#nav .mega-dropdown li{
	margin-bottom: 24px;
}
#nav .mega-dropdown li span.menu-item-title{
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
	margin-bottom: 4px;
	font-size: 18px;
	line-height: 1.15;
	font-weight: 600;
}
#nav .mega-dropdown li span.menu-item-title::before{
	width: 32px;
	height: 32px;
	margin-right: 6px;
	content: "";
	border-radius: 100px;
	background-color: transparent;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 24px 24px;
	transition: all .25s;
}
#nav .mega-dropdown li span.menu-item-description{
	display: block;
	margin-bottom: 8px;
	font-size: 14px;
	line-height: 1.37;
	font-weight: 400;
}
#nav .mega-dropdown li span.menu-item-readmore{
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
	font-weight: 600;
}
#nav .mega-dropdown li span.menu-item-readmore::after{
	width: 24px;
	height: 24px;
	margin-left: 8px;
	font-size: 14px;
	font-weight: 300;
	content: "";
	background: no-repeat center center transparent;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: %230b3b5b; %7D %3C/style%3E%3C/defs%3E%3Cpolygon class='cls-1' points='14.26 5.51 12.84 6.92 16.92 11 3.33 11 3.33 13 16.92 13 12.84 17.08 14.26 18.49 20.75 12 14.26 5.51'/%3E%3C/svg%3E");
	background-size: 24px 24px;
	transition: margin .25s;
}
#nav .mega-dropdown li a:hover span.menu-item-readmore::after{
	margin-left: 16px;
}


/* ============================================================
   FEATURED DROPDOWN
   First child: rich mega-style item. Remaining: plain links.
   Classes: dropdown-featured / dropdown-featured-2cols
   ============================================================ */

#nav .dropdown-featured li:first-child,
#nav .dropdown-featured-2cols li:first-child{
	margin-bottom: 24px;
}
#nav .dropdown-featured li:first-child span.menu-item-title,
#nav .dropdown-featured-2cols li:first-child span.menu-item-title{
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
	margin-bottom: 4px;
	font-size: 18px;
	line-height: 1.15;
	font-weight: 600;
}
#nav .dropdown-featured li:first-child span.menu-item-title::before,
#nav .dropdown-featured-2cols li:first-child span.menu-item-title::before{
	width: 32px;
	height: 32px;
	margin-right: 6px;
	content: "";
	border-radius: 100px;
	background-color: transparent;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 24px 24px;
	transition: all .25s;
}
#nav .dropdown-featured li:first-child a:hover span.menu-item-title::before,
#nav .dropdown-featured-2cols li:first-child a:hover span.menu-item-title::before{
	background-color: var(--ctx-surface);
}
#nav .dropdown-featured li:first-child span.menu-item-description,
#nav .dropdown-featured-2cols li:first-child span.menu-item-description{
	display: block;
	margin-bottom: 8px;
	font-size: 14px;
	line-height: 1.37;
	font-weight: 400;
}
#nav .dropdown-featured li:first-child span.menu-item-readmore,
#nav .dropdown-featured-2cols li:first-child span.menu-item-readmore{
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
	font-weight: 600;
}
#nav .dropdown-featured li:first-child span.menu-item-readmore::after,
#nav .dropdown-featured-2cols li:first-child span.menu-item-readmore::after{
	position: static;
	top: auto;
	display: block;
	width: 24px;
	height: 24px;
	margin-left: 8px;
	font-size: 14px;
	font-weight: 300;
	transform: none;
	content: "";
	background: no-repeat center center transparent;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: %230b3b5b; %7D %3C/style%3E%3C/defs%3E%3Cpolygon class='cls-1' points='14.26 5.51 12.84 6.92 16.92 11 3.33 11 3.33 13 16.92 13 12.84 17.08 14.26 18.49 20.75 12 14.26 5.51'/%3E%3C/svg%3E");
	background-size: 24px 24px;
	transition: margin .25s;
}
#nav .dropdown-featured li:first-child a:hover span.menu-item-readmore::after,
#nav .dropdown-featured-2cols li:first-child a:hover span.menu-item-readmore::after{
	margin-left: 16px;
}


/* ============================================================
   NAV ICON OVERRIDES
   Shared across mega-dropdown and dropdown-featured variants.
   span.menu-item-title is only injected by abrovink_prefix_nav_description
   so these broad selectors are safe. Must stay after all ::before defaults.
   Default icon (specificity 113) is set here so icon-* classes (123) beat it.
   ============================================================ */

#nav li span.menu-item-title::before{
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: %230b3b5b; %7D %3C/style%3E%3C/defs%3E%3Cpolygon class='cls-1' points='15.98 8.14 14.57 6.73 10.78 10.52 9.43 9.17 8.02 10.59 10.78 13.35 15.98 8.14'/%3E%3Cpath class='cls-1' d='M4.05,2.43v19.81l7.95-4.2,7.95,4.2V2.43H4.05ZM17.95,18.91l-5.95-3.15-5.95,3.15V4.43h11.89v14.49Z'/%3E%3C/svg%3E");
}
#nav li.icon-proposal span.menu-item-title::before{
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: %230b3b5b; %7D %3C/style%3E%3C/defs%3E%3Cpolygon class='cls-1' points='15.98 8.14 14.57 6.73 10.78 10.52 9.43 9.17 8.02 10.59 10.78 13.35 15.98 8.14'/%3E%3Cpath class='cls-1' d='M4.05,2.43v19.81l7.95-4.2,7.95,4.2V2.43H4.05ZM17.95,18.91l-5.95-3.15-5.95,3.15V4.43h11.89v14.49Z'/%3E%3C/svg%3E");
}
#nav li.icon-antiloop span.menu-item-title::before{
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: %230b3b5b; %7D %3C/style%3E%3C/defs%3E%3Cpath class='cls-1' d='M21.2,12c0,1.32-1.08,2.4-2.4,2.4s-2.4-1.08-2.4-2.4h-2c0,2.43,1.97,4.4,4.4,4.4s4.4-1.97,4.4-4.4h-2Z'/%3E%3Cpath class='cls-1' d='M7.6,12.01h2c0-2.43-1.97-4.4-4.4-4.4S.8,9.58.8,12.01h2c0-1.32,1.08-2.4,2.4-2.4s2.4,1.08,2.4,2.4Z'/%3E%3Cpath class='cls-1' d='M17.8,12h2c0-2.43-1.97-4.4-4.4-4.4s-4.4,1.97-4.4,4.4c0,1.32-1.08,2.4-2.4,2.4s-2.4-1.08-2.4-2.4h-2c0,2.43,1.97,4.4,4.4,4.4s4.4-1.97,4.4-4.4c0-1.32,1.08-2.4,2.4-2.4s2.4,1.08,2.4,2.4Z'/%3E%3C/svg%3E");
}
#nav li a:hover span.menu-item-title::before{
	background-color: var(--ctx-surface);
}


/* ============================================================
   SEARCH
   ============================================================ */

#search{
	width: 100%;
	opacity: 0;
	pointer-events: none;
	transition: opacity .25s;
	transition-delay: 0s;
}
.nav-expanded #search{
	opacity: 1;
	pointer-events: auto;
	transition: opacity .5s;
	transition-delay: .5s;
}
#search form{
	position: relative;
	width: 100%;
}
#search form label{
	display: none;
}
#search form input[type="search"]{
	position: relative;
	width: 100%;
	max-width: unset;
	height: 32px;
	margin: 0;
	padding: 16px;
	font-size: 14px;
	line-height: 16px;
	border: solid 2px var(--palette-darkblue);
	border-radius: 50px;
	background: no-repeat var(--palette-white);
	background-position: center right 12px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: %230b3b5b; %7D %3C/style%3E%3C/defs%3E%3Cpath class='cls-1' d='M16.14,14.72c1.1-1.41,1.71-3.14,1.71-4.95,0-2.16-.84-4.19-2.37-5.71s-3.55-2.37-5.71-2.37-4.19.84-5.71,2.37c-1.53,1.52-2.37,3.55-2.37,5.71s.84,4.19,2.37,5.71c1.52,1.53,3.55,2.37,5.71,2.37,1.82,0,3.54-.6,4.95-1.71l5.68,5.68,1.41-1.41-5.68-5.68ZM5.47,14.06c-1.15-1.15-1.78-2.67-1.78-4.3s.63-3.15,1.78-4.3,2.67-1.78,4.3-1.78,3.15.63,4.3,1.78,1.78,2.67,1.78,4.3-.63,3.15-1.78,4.3-2.67,1.78-4.3,1.78-3.15-.63-4.3-1.78Z'/%3E%3C/svg%3E");
	background-size: 24px 24px;
}
#search form button[type="submit"]{
	position: absolute;
	top: 1px;
	right: 0;
	width: 44px;
	height: 32px;
	z-index: 20;
	margin: 0;
	padding: 0;
	border-radius: 0;
	border: 0;
	background: transparent;
	background: #ccc;
	display: none;
}


/* ============================================================
   #MAIN OFFSET
   ============================================================ */

#main{
	margin-top: calc( var(--header-height) - 44px );
	transition: all .4s ease;
}


/* ============================================================
   MOBILE NAV ANIMATION
   ============================================================ */

@media (max-width: 1023px) {

	#nav li{
		opacity: 0;
	}
	.nav-expanded #nav li{
		-webkit-animation: fadeinmenu .75s 1;
				animation: fadeinmenu .75s 1;
		-webkit-animation-fill-mode: forwards;
				animation-fill-mode: forwards;
	}
	.nav-expanded #nav li:nth-child(1){-webkit-animation-delay: .20s; animation-delay: .20s;}
	.nav-expanded #nav li:nth-child(2){-webkit-animation-delay: .27s; animation-delay: .27s;}
	.nav-expanded #nav li:nth-child(3){-webkit-animation-delay: .34s; animation-delay: .34s;}
	.nav-expanded #nav li:nth-child(4){-webkit-animation-delay: .41s; animation-delay: .41s;}
	.nav-expanded #nav li:nth-child(5){-webkit-animation-delay: .48s; animation-delay: .48s;}
	.nav-expanded #nav li:nth-child(6){-webkit-animation-delay: .55s; animation-delay: .55s;}
	.nav-expanded #nav li:nth-child(7){-webkit-animation-delay: .62s; animation-delay: .62s;}
	.nav-expanded #nav li:nth-child(8){-webkit-animation-delay: .69s; animation-delay: .69s;}
	.nav-expanded #nav li:nth-child(9){-webkit-animation-delay: .76s; animation-delay: .76s;}
	.nav-expanded #nav li:nth-child(10){-webkit-animation-delay: .81s; animation-delay: .81s;}
	.nav-expanded #nav li:nth-child(11){-webkit-animation-delay: .95s; animation-delay: .95s;}

	@-webkit-keyframes fadeinmenu { from {opacity: 0; padding-left: 20px; padding-right: 0; } to {opacity: 1; padding-left: 0px; padding-right: 20px; } }
	@keyframes fadeinmenu { from {opacity: 0; padding-left: 20px; padding-right: 0; } to {opacity: 1; padding-left: 0px; padding-right: 20px; } }
	#nav li a{
		-webkit-transition: opacity .5s, margin .5s;
		-o-transition: opacity .5s, margin .5s;
		-webkit-transition: opacity .5s, margin .5s;
		transition: opacity .5s, margin .5s;
	}


	/* --- Hamburger — squeeze animation --- */

	.hamburger {
		padding: 5px;
		display: inline-block;
		cursor: pointer;
		-webkit-transition-property: opacity, -webkit-filter;
		transition-property: opacity, -webkit-filter;
		-o-transition-property: opacity, filter;
		transition-property: opacity, filter;
		transition-property: opacity, filter, -webkit-filter;
		-webkit-transition-duration: 0.15s;
			 -o-transition-duration: 0.15s;
				transition-duration: 0.15s;
		-webkit-transition-timing-function: linear;
			 -o-transition-timing-function: linear;
				transition-timing-function: linear;
		font: inherit;
		color: inherit;
		font-size: 1px;
		line-height: 1px;
		text-transform: none;
		background-color: transparent;
		border: 0;
		margin: 0;
		overflow: visible;
	}
	.hamburger:hover {
		/*opacity: 0.6; */
	}
	.hamburger.is-active:hover {
		/*opacity: 0.6; */
	}
	.hamburger:focus{
		outline: none;
	}
	.hamburger-box {
		position: relative;
		display: inline-block;
		width: 31px;
		height: 31px;
	}
	.hamburger-inner {
		display: block;
		top: 50%;
		margin-top: 0px;
	}
	.hamburger-inner,
	.hamburger-inner::before,
	.hamburger-inner::after {
		width: 19px;
		height: 2px;
		background-color: var(--palette-darkblue);
		border-radius: 0;
		position: absolute;
		-webkit-transition-property: -webkit-transform;
		transition-property: -webkit-transform;
		-o-transition-property: transform;
		transition-property: transform;
		transition-property: transform, -webkit-transform;
		-webkit-transition-duration: 0.15s;
			 -o-transition-duration: 0.15s;
				transition-duration: 0.15s;
		-webkit-transition-timing-function: ease;
			 -o-transition-timing-function: ease;
				transition-timing-function: ease;
	}
	.hamburger-inner::before, .hamburger-inner::after {
		content: "";
		display: block;
	}
	.hamburger-inner::before {
		top: -6px;
	}
	.hamburger-inner::after {
		bottom: -6px;
	}
	.hamburger--squeeze .hamburger-inner {
		-webkit-transition-duration: 0.075s;
			 -o-transition-duration: 0.075s;
				transition-duration: 0.075s;
		-webkit-transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
			 -o-transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
				transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
	}
	.hamburger--squeeze .hamburger-inner::before {
		-webkit-transition: top 0.075s 0.12s ease, opacity 0.075s ease;
		-o-transition: top 0.075s 0.12s ease, opacity 0.075s ease;
		transition: top 0.075s 0.12s ease, opacity 0.075s ease;
	}
	.hamburger--squeeze .hamburger-inner::after {
		-webkit-transition: bottom 0.075s 0.12s ease, -webkit-transform 0.075s cubic-bezier(0.55, 0.055, 0.675, 0.19);
		transition: bottom 0.075s 0.12s ease, -webkit-transform 0.075s cubic-bezier(0.55, 0.055, 0.675, 0.19);
		-o-transition: bottom 0.075s 0.12s ease, transform 0.075s cubic-bezier(0.55, 0.055, 0.675, 0.19);
		transition: bottom 0.075s 0.12s ease, transform 0.075s cubic-bezier(0.55, 0.055, 0.675, 0.19);
		transition: bottom 0.075s 0.12s ease, transform 0.075s cubic-bezier(0.55, 0.055, 0.675, 0.19), -webkit-transform 0.075s cubic-bezier(0.55, 0.055, 0.675, 0.19);
	}
	.hamburger--squeeze.is-active .hamburger-inner {
		-webkit-transform: rotate(45deg);
			-ms-transform: rotate(45deg);
				transform: rotate(45deg);
		-webkit-transition-delay: 0.12s;
			 -o-transition-delay: 0.12s;
				transition-delay: 0.12s;
		-webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
			 -o-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
				transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
	}
	.hamburger--squeeze.is-active .hamburger-inner::before {
		top: 0;
		opacity: 0;
		-webkit-transition: top 0.075s ease, opacity 0.075s 0.12s ease;
		-o-transition: top 0.075s ease, opacity 0.075s 0.12s ease;
		transition: top 0.075s ease, opacity 0.075s 0.12s ease;
	}
	.hamburger--squeeze.is-active .hamburger-inner::after {
		bottom: 0;
		-webkit-transform: rotate(-90deg);
			-ms-transform: rotate(-90deg);
				transform: rotate(-90deg);
		-webkit-transition: bottom 0.075s ease, -webkit-transform 0.075s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1);
		transition: bottom 0.075s ease, -webkit-transform 0.075s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1);
		-o-transition: bottom 0.075s ease, transform 0.075s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1);
		transition: bottom 0.075s ease, transform 0.075s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1);
		transition: bottom 0.075s ease, transform 0.075s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.075s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1);
	}

}


/* ============================================================
   DESKTOP NAV
   ============================================================ */

@media (min-width: 1024px) {

	#header,
	.nav-expanded #header,
	.scrolling #header,
	.scrolling.nav-expanded #header{
		width: 100%;
		height: var(--header-height);
	}
	#header:hover{
		overflow: visible;
	}
	#header .container{
		display: flex;
		flex-flow: row nowrap;
		align-items: stretch;
		padding: 0;
	}
	#logo{
		width: 120px;
		margin-right: 20px;
		align-items: stretch;
		align-content: center;
		padding-top: 2px;
	}
	.toggle-nav{
		display: none;
	}

	/* --- Horizontal nav --- */

	#nav{
		width: calc(100% - 240px);
		display: flex;
		flex-flow: row nowrap;
		justify-content: center;
		margin: 0;
		padding: 0;
		opacity: 1;
		line-height: 14px;
		overflow: visible;
		pointer-events: initial;
	}
	#nav ul{
		float: none;
		width: auto;
		margin: 0;
		display: flex;
		align-items: center;
	}
	#nav li{
		height: 70px;
		display: flex;
		align-items: flex-end;
		align-content: center;
		flex-grow: 0;
		margin: 0 1px;
		padding: 0;
		overflow: visible;
		white-space: nowrap;
		border-bottom: 0;
		opacity: 1;

	}
	#nav li a{
		width: 100%;
		margin: 0 16px;
		padding: 24px 0;
		font-size: 16px;
		line-height: 18px;
		font-weight: 600;
	}

	/* --- Hover underline --- */

	#nav li > a::after{
		position: absolute;
		bottom: 0;
		left: 0;
		right: 0;
		margin: 0 auto;
		width: 0;
		height: 3px;
		background: var(--palette-darkblue);
		content: "";
		transition: width .2s ease-out;
	}
	#nav li:hover > a::after{
		width: 100%;
	}
	#nav li a.toggle-children{
		display: none;
	}

	/* --- Current menu states --- */

	#nav li.current-menu-item > a,
	#nav li.current_page > a,
	#nav li.current_page_item > a,
	#nav li.current-menu-ancestor > a{
		text-decoration: none;
	}
	#nav li.current-menu-item  > a::after,
	#nav li.current_page > a::after,
	#nav li.current_page_item > a::after,
	#nav li.current-menu-ancestor > a::after{
		width: 100%;
		opacity: 1;
	}

	/* --- Has-children arrow indicator --- */

	#nav li.menu-item-has-children a span::after{
		position: relative;
		top: 6px;
		display: inline-block;
		width: 24px;
		height: 24px;
		margin-left: 2px;
		padding: auto;
		background: no-repeat center center transparent;
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: %230b3b5b; %7D %3C/style%3E%3C/defs%3E%3Cpolygon class='cls-1' points='8.4 6.92 13.48 12 8.4 17.08 9.81 18.49 16.31 12 9.81 5.51 8.4 6.92'/%3E%3C/svg%3E");
		background-size: 24px 24px;
		content: "";
		transform: rotate(90deg);
		transition: transform .2s;
		transition-delay: .15s;
	}
	#nav li.menu-item-has-children:hover a span::after{
		transform: rotate(270deg);
	}

	/* --- Desktop dropdowns (level 2) --- */

	#nav li ul{
		position: absolute;
		left: 0;
		top: 100%;
		display: block;
		min-width: 600px;
		margin: 0 0 0 8px;
		padding: 24px 0;
		opacity: 0;
		background: var(--palette-white);
		transition: margin .75s, opacity .25s;
		pointer-events: none;
	}
	#nav ul li:hover ul{
		opacity: 1;
		transition: margin .5s, opacity .5s;
		pointer-events: auto;
	}

	/* Dropdown white overlay */
	#nav li.menu-item-has-children ul::before{
		position: fixed;
		left: 0;
		top: var(--header-height);
		z-index: 0;
		width: 100vw;
		height: 0;
		background: rgba(255,255,255, 1);
		content: "";
		pointer-events: none;
		transition: margin .4s ease, height .25s, opacity .25s;
	}
	.scrolling nav li.menu-item-has-children ul::before{
		margin-top: -44px;
	}
	#nav li.menu-item-has-children:hover ul::before{
		height: 320px;
	}

	/* --- Dropdown items --- */

	#nav li li{
		position: relative;
		display: none;
		height: auto;
		white-space: normal;
		margin: 0;
		padding: 0;
		background-image: none;
	}
	#nav li li:first-child{}
	#nav li li:last-child{
		padding-bottom: 16px;
	}
	#nav ul li:hover ul li{
		display: block;
		float: none;
		clear: both;
	}
	#nav li li a,
	#nav li .current-menu-item > a,
	#nav li .current_page > a,
	#nav li .current_page_item > a,
	#nav li .current-menu-ancestor > a{
		display: inline-block;
		margin: 0;
		padding: 0;
		padding: 12px 8px;
	}
	#nav li li a{}
	#nav li li a::after{
		display: none;
	}

	/* Dropdown arrow (right-pointing) */
	#nav li.menu-item-has-children li a span::after{
		top: 0;
		width: 22px;
		height: 22px;
	background: no-repeat center center transparent;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: %230b3b5b; %7D %3C/style%3E%3C/defs%3E%3Cpolygon class='cls-1' points='14.26 5.51 12.84 6.92 16.92 11 3.33 11 3.33 13 16.92 13 12.84 17.08 14.26 18.49 20.75 12 14.26 5.51'/%3E%3C/svg%3E");
	background-size: 22px 22px;
		transform: rotate(0) !important;
		transition: margin-left .2s;
		transition-delay: 0;
	}
	#nav li.menu-item-has-children:hover li:hover a span::after{
		transform: rotate(0) !important;
		margin-left: 16px;
	}

	#nav li .current-menu-item,
	#nav li .current_page,
	#nav li .current_page_item,
	#nav li .current-menu-ancestor{
		border-bottom: 0;
	}
	#nav li .current-menu-item > a,
	#nav li .current_page > a,
	#nav li .current_page_item > a,
	#nav li .current-menu-ancestor > a{}

	#nav li:not(.mega-dropdown) li a span::after{
		top: 6px;
		margin-left: 8px;
	}

	/* Columned dropdown */
	#nav ul li.dropdown-2columns ul{
		column-count: 2;
		column-gap: 32px;
	}

	/* Mega dropdown (desktop) */
	#nav .mega-dropdown ul{
		min-width: 800px;
		display: flex;
		flex-flow: row wrap;
		justify-content: flex-start;
		align-items: flex-start;
	}
	#nav .mega-dropdown li{
		width: 50%;
		min-width: 260px;
		padding-right: 24px;
	}
	/* remove lots of extra arrows */
	#nav li.mega-dropdown li a :not(span.menu-item-readmore)::after{
		display: none;
	}

	/* Featured dropdown (desktop) */
	#nav .dropdown-featured ul,
	#nav .dropdown-featured-2cols ul{
		display: grid;
		gap: 0 32px;
		align-items: start;
	}
	#nav .dropdown-featured ul{
		grid-template-columns: 260px 1fr;
		min-width: 580px;
	}
	#nav .dropdown-featured-2cols ul{
		grid-template-columns: 260px 1fr 1fr;
		min-width: 820px;
	}
	#nav .dropdown-featured li:first-child,
	#nav .dropdown-featured-2cols li:first-child{
		grid-row: 1 / span 99;
		padding-right: 32px;
		border-right: 1px solid var(--color-border);
		margin-bottom: 0;
	}
	/* Remove arrows from featured item (readmore has its own) */
	#nav li.dropdown-featured li:first-child a :not(span.menu-item-readmore)::after,
	#nav li.dropdown-featured-2cols li:first-child a :not(span.menu-item-readmore)::after{
		display: none;
	}

	/* --- Search (desktop) --- */

	#search{
		width: 160px;
		margin-left: 0px;
		display: flex;
		align-items: center;
		opacity: 1;
		pointer-events: auto;
	}
	#search form{
		text-align: right;
	}
	#search form input[type="search"]{
		width: 44px;
		border: solid 1px #fff;
		transition: width .25s border .25s;
		z-index: 30;
	}
	#search form input[type="search"]:focus{
		width: 100%;
		background-position: center right 12px;
		border: solid 1px var(--palette-darkblue);
		z-index: 10;
	}

}


/* ============================================================
   WIDER DESKTOP
   ============================================================ */

@media (min-width: 1280px) {

	#nav li{
		margin: 0 12px;
	}

	#search{
		width: 220px;
	}

}







/* ============================================================
   FOOTER STYLES
   ============================================================ */

#footer{
	padding: var(--padding-content) 0;
	font-size: 14px;
	font-weight: 400;
	color: var(--palette-white);
	background-color: var(--palette-darkblue);
}
#footer .widget{
	margin: 0 0 12px 0;
}
#footer h3.widget-title{
	display: none;
}

#footer .widget:first-child{
	margin: 12px 0 32px 0;
}
#footer .widget:last-child{
	margin-top:12px;
	color: var(--palette-muted);
}

@media screen and (min-width: 768px){

	#footer .widgets{
		display: flex;
		flex-flow: row wrap;
		justify-content: space-between;
	}
	#footer .widget{
		width: 25%;
	}
	#footer .widget:first-child{}
	#footer .widget:last-child{
		width: 100%;
	}

}