/* ==========================================================================
   Erick van Egeraat template
   A one to one rebuild of the original WordPress theme. Every value below was
   measured on the live site (computed styles at 375, 1024, 1280 and 1612 px).
   Breakpoints follow the original: phone < 768, tablet 768 to 989,
   desktop 990 to 1279, wide >= 1280.
   ========================================================================== */

/* Fonts. The original declares three separate families, each at weight 400,
   instead of one family with three weights. Kept that way so nothing is ever
   synthesised. Proxima Nova is a commercial font: licence to be confirmed. */
@font-face {
	font-family: "Proxima Regular";
	src: url(../fonts/proximanova-regular.woff2) format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Proxima Semibold";
	src: url(../fonts/proximanova-semibold.woff2) format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Proxima Bold";
	src: url(../fonts/proximanova-bold.woff2) format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

/* The search icon: one glyph (U+E003) cut out of Glyphicons Halflings,
   so the magnifier is pixel for pixel the original. */
@font-face {
	font-family: "Eve Glyph";
	src: url(../fonts/glyph-search.woff2) format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: block;
}

:root {
	--eve-font: "Proxima Regular", sans-serif;
	--eve-font-semibold: "Proxima Semibold", sans-serif;
	--eve-font-bold: "Proxima Bold", sans-serif;
	--eve-letter-spacing: 0.26px;

	--eve-bg: #161a1d;
	--eve-bg-footer: #13171a;
	--eve-bg-band: #111416;
	--eve-text: #fff;
	--eve-menu: #8e9091;
	--eve-menu-sub-mobile: #8b8d8e;
	--eve-menu-active-mobile: #2e3134;
	--eve-toggle-line: #2f3235;
	--eve-footer-text: #89959f;
	--eve-icon: #919ea8;
	--eve-muted: #888a8b;
	--eve-placeholder: #2e3134;

	--eve-ease: 0.5s ease;
	--eve-header-h: 90px;
}

/* --------------------------------------------------------------------------
   Base
   -------------------------------------------------------------------------- */

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: 100%;
	-webkit-tap-highlight-color: transparent;
}

body {
	margin: 0;
	padding-top: 163px;
	font-family: var(--eve-font);
	font-size: 13px;
	line-height: 1.7;
	/* A fixed length on purpose: the original sets .02em on a 13px body,
	   which every element then inherits as 0.26px whatever its own size. */
	letter-spacing: var(--eve-letter-spacing);
	color: var(--eve-text);
	background-color: var(--eve-bg);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	transition: padding-top var(--eve-ease);
}

a {
	color: var(--eve-text);
	text-decoration: none;
}

p {
	margin: 0 0 10px;
}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--eve-font-semibold);
	font-weight: 400;
	line-height: 1.1;
	letter-spacing: 0.02em;
	color: inherit;
}

h1, h2, h3 { margin: 20px 0 10px; }
h4, h5, h6 { margin: 10px 0; }
h1 { font-size: 38px; }
h2 { font-size: 36px; }
h3 { font-size: 28px; }
h4 { font-size: 24px; }
h5 { font-size: 22px; }
h6 { font-size: 18px; }

button,
input {
	margin: 0;
	font: inherit;
	letter-spacing: inherit;
	color: inherit;
}

/* As on the original, form fields do not take the body letter spacing */
input {
	letter-spacing: normal;
}

button {
	cursor: pointer;
}

.visually-hidden {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	border: 0;
	white-space: nowrap;
}

.eve-container {
	margin-right: auto;
	margin-left: auto;
	padding-right: 20px;
	padding-left: 20px;
}

@media (min-width: 768px) {
	body { padding-top: 90px; }
	.eve-container { width: 760px; }
}

@media (min-width: 990px) {
	.eve-container { width: 980px; }
}

@media (min-width: 1280px) {
	body { padding-top: 91px; }
	.eve-container { width: 1260px; }
}

/* --------------------------------------------------------------------------
   Header
   -------------------------------------------------------------------------- */

.eve-header {
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	z-index: 9999;
	background-color: var(--eve-bg);
}

.eve-brand {
	display: block;
}

.eve-brand img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
}

/* The search icon glyph */
.eve-glyph-search {
	position: relative;
	top: 1px;
	display: inline-block;
	font-family: "Eve Glyph";
	font-style: normal;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.eve-glyph-search::before {
	content: "\e003";
}

/* Menu, shared */
.eve-menu,
.eve-submenu {
	margin: 0;
	padding: 0;
	list-style: none;
}

.eve-menu__item {
	position: relative;
	font-size: 16px;
}

.eve-menu__link {
	position: relative;
	display: block;
	padding: 0;
	font-family: var(--eve-font-semibold);
	font-size: inherit;
	line-height: 20px;
	text-align: left;
	text-transform: uppercase;
	color: var(--eve-menu);
	background: none;
	border: 0;
	transition: color var(--eve-ease);
}

.eve-menu__link:hover {
	color: var(--eve-text);
}

.eve-submenu__link {
	display: block;
	font-family: var(--eve-font-semibold);
	text-transform: uppercase;
	color: var(--eve-menu);
	transition: color var(--eve-ease);
}

.eve-submenu__link:hover,
.eve-submenu__item.is-active > .eve-submenu__link {
	color: var(--eve-text);
}

.eve-submenu {
	display: none;
}

.eve-menu__item.is-open > .eve-submenu {
	display: block;
}

.eve-caret {
	display: none;
}

/* Desktop only parts, hidden on phones */
.eve-band,
.eve-search,
.eve-menu__item--search {
	display: none;
}

/* ---- Phone (< 768) ------------------------------------------------------- */

@media (max-width: 767px) {

	.eve-header {
		transition: transform var(--eve-ease);
	}

	.eve-header.is-menu-open {
		height: 100%;
	}

	/* flow-root: the original's overflow:auto here keeps the logo's top
	   margin inside the header instead of collapsing through it */
	.eve-header__inner {
		display: flow-root;
		margin: 10px 0;
		padding: 0;
	}

	.eve-brand {
		width: 83%;
		height: 80px;
		margin: 15px auto 34px;
	}

	.eve-header__mobile {
		padding: 0 20px 3.1px;
	}

	.eve-toggle {
		display: flex;
		letter-spacing: normal;
		align-items: flex-start;
		justify-content: space-between;
		width: 100%;
		padding: 2px 10px 3px;
		font-size: 15px;
		line-height: 1.7;
		text-transform: uppercase;
		color: var(--eve-text);
		background: transparent;
		border: 0;
		border-bottom: 1px solid var(--eve-toggle-line);
	}

	.eve-toggle[aria-expanded="true"] {
		border-bottom-color: var(--eve-text);
	}

	.eve-toggle__arrow {
		flex: none;
		width: 20px;
		height: 16px;
		margin: 4px 0 0 2px;
		background: url(../images/icon-arrowsmall.svg) 50% no-repeat;
		background-size: contain;
		transform: rotate(90deg);
		transition: all var(--eve-ease);
	}

	.eve-toggle[aria-expanded="true"] .eve-toggle__arrow {
		transform: rotate(270deg);
	}

	.eve-nav {
		display: none;
		padding: 0 20px;
		overflow-x: hidden;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
	}

	.eve-nav.is-open,
	.eve-nav.is-animating {
		display: block;
	}

	.eve-nav.is-animating {
		overflow: hidden;
		transition: height 0.35s ease;
	}

	.eve-menu {
		margin: 20px -20px;
	}

	/* Bootstrap's clearfix on the original lists: the table pseudo elements
	   keep the first and last item margins from collapsing into the list */
	.eve-menu::before,
	.eve-menu::after {
		content: "";
		display: table;
	}

	.eve-menu__item,
	.eve-submenu__item {
		margin: 1px 18px 0;
		padding: 0 12px;
		font-size: 16px;
	}

	.eve-menu__link,
	.eve-submenu__link {
		padding: 10px;
		line-height: 20px;
	}

	.eve-menu__item.has-children > .eve-menu__link {
		display: inline-block;
	}

	.eve-menu__item.is-active > .eve-menu__link,
	.eve-submenu__item.is-active > .eve-submenu__link {
		color: var(--eve-menu-active-mobile);
	}

	.eve-menu__item.is-open > .eve-menu__link {
		color: var(--eve-text);
	}

	.eve-caret {
		position: absolute;
		top: 17px;
		right: 13px;
		display: block;
		width: 0;
		height: 0;
		color: var(--eve-menu);
		border-top: 4px solid;
		border-right: 4px solid transparent;
		border-left: 4px solid transparent;
		cursor: pointer;
		transition: all var(--eve-ease);
	}

	.eve-menu__item.is-open > .eve-caret {
		color: var(--eve-text);
		transform: rotate(-180deg);
	}

	.eve-menu__item.is-open > .eve-submenu {
		margin: 12px -30px 16px;
		padding: 25px 12px;
		background-color: #000;
	}

	.eve-submenu__item {
		margin-top: 0;
	}

	.eve-submenu__link {
		color: var(--eve-menu-sub-mobile);
	}

	/* Search, phone version: a black strip inside the menu */
	.eve-menu__item--search-mobile {
		margin: 0;
		padding: 20px 30px;
		background-color: #000;
	}

	.eve-msearch {
		display: flex;
		align-items: center;
		min-height: 42px;
	}

	.eve-msearch__go {
		flex: none;
		padding: 10px;
		font-size: 16px;
		line-height: 20px;
		color: var(--eve-menu);
		background: none;
		border: 0;
	}

	.eve-msearch__input {
		width: 203px;
		max-width: calc(100% - 73px);
		margin-left: 37px;
		padding: 1px 2px;
		font-family: var(--eve-font-semibold);
		font-size: 16px;
		line-height: 20px;
		color: var(--eve-menu);
		background: none;
		border: 0;
	}

	.eve-menu__item--language {
		margin-top: 10px;
	}

	/* Locks the page behind the open menu */
	body.is-menu-locked {
		position: fixed;
		width: 100%;
	}
}

/* ---- Tablet and up (>= 768) ---------------------------------------------- */

@media (min-width: 768px) {

	.eve-header {
		height: var(--eve-header-h);
	}

	.eve-header__inner {
		position: relative;
		height: 100%;
	}

	.eve-header__mobile,
	.eve-menu__item--search-mobile {
		display: none;
	}

	.eve-brand {
		position: absolute;
		top: 0;
		right: 20px;
		width: calc((100% - 40px) * 0.19);
		height: 90px;
	}

	.eve-nav {
		display: flex;
		align-items: flex-start;
	}

	.eve-menu {
		display: flex;
	}

	.eve-menu__item {
		margin-top: 28px;
		padding: 1px 1px 20px;
		font-size: 15px;
	}

	.eve-menu__link {
		padding: 6px 15px;
	}

	/* Active item: a 1px white frame, drawn as a white block behind the link */
	.eve-menu__item.is-active::before {
		content: "";
		position: absolute;
		top: 0;
		left: 0;
		z-index: -1;
		width: 100%;
		height: 34px;
		background: var(--eve-text);
	}

	.eve-menu__item.is-active > .eve-menu__link {
		color: var(--eve-text);
		background-color: var(--eve-bg);
	}

	.eve-menu__item--search {
		display: block;
	}

	/* Dropdown: the items hang below the header, over the band */
	.eve-submenu {
		position: absolute;
		top: 42px;
		left: 0;
		z-index: -1;
		min-width: 160px;
		margin-left: 15px;
		padding: 35px 0 17px;
	}

	.eve-submenu__item {
		margin: 0;
		padding: 0;
		font-size: inherit;
	}

	.eve-submenu__link {
		padding: 0;
		line-height: 1.7;
		white-space: nowrap;
	}

	/* The band behind an open dropdown */
	.eve-band {
		position: fixed;
		top: 83px;
		left: 0;
		z-index: 999;
		display: block;
		width: 100%;
		min-height: 115px;
		margin-top: -120px;
		overflow: hidden;
		transition: all var(--eve-ease);
	}

	.eve-band.is-open {
		top: 85px;
		margin-top: 0;
		background-color: var(--eve-bg-band);
	}

	/* Search bar */
	.eve-search {
		position: fixed;
		top: 90px;
		left: 0;
		z-index: 999;
		display: block;
		width: 100%;
		height: 115px;
		margin-top: -120px;
		overflow: hidden;
		visibility: hidden;
		opacity: 0;
		background-color: var(--eve-bg-band);
		transition: all var(--eve-ease), visibility 0s 0.5s;
	}

	.eve-search.is-open {
		margin-top: 0;
		visibility: visible;
		opacity: 1;
		transition: all var(--eve-ease), visibility 0s;
	}

	.eve-search__row {
		display: flex;
		margin: 0 -20px;
	}

	.eve-search__field {
		position: relative;
		width: 75%;
		margin: 0;
		padding: 30px 50px 0 100px;
	}

	.eve-search__field input {
		width: 100%;
		padding: 1px 2px;
		font-size: 28px;
		line-height: 1.7;
		color: var(--eve-text);
		background-color: transparent;
		border: none;
	}

	.eve-search__field input:focus {
		outline: none;
	}

	.eve-search__field input::placeholder {
		color: var(--eve-placeholder);
		opacity: 1;
	}

	.eve-search__dummy {
		position: absolute;
		visibility: hidden;
		font-size: 28px;
		white-space: pre;
	}

	.eve-search__erase {
		position: absolute;
		top: 47px;
		left: 110px;
		width: 19px;
		height: 19px;
		padding: 0;
		background: url(../images/icon.close.small.png) 50% no-repeat;
		border: 0;
		opacity: 0;
		pointer-events: none;
		transition: 0.1s, 0.5s, 0.5s;
		transition-property: left, opacity, transform;
	}

	.eve-search__erase.is-visible {
		opacity: 1;
		pointer-events: auto;
	}

	.eve-search__erase:hover {
		transform: rotate(90deg);
		transition: 0.5s;
	}

	.eve-search__go {
		width: 25%;
		padding: 35px 20px 0;
		font-size: 28px;
		line-height: 0.8em;
		text-align: left;
		color: var(--eve-text);
		background: none;
		border: 0;
		align-self: flex-start;
	}

	/* The original pointed at a theme folder that no longer exists, so its
	   magnifier never loaded. The real 26px icon is shown here, with a
	   negative bottom margin so it does not make the line any taller. */
	.eve-search__go img {
		margin: -5px 0 -4px 13px;
	}

	.eve-search__enter {
		font-size: 14px;
		color: var(--eve-muted);
	}
}

/* ---- Desktop (990 to 1279) keeps the tablet values ----------------------- */

/* ---- Wide (>= 1280) ------------------------------------------------------ */

@media (min-width: 1280px) {

	.eve-brand {
		top: 9px;
		width: 19%;
		height: 81px;
	}

	.eve-menu__item {
		margin-top: 25px;
		padding-bottom: 25px;
		font-size: 16px;
	}

	.eve-submenu {
		padding-top: 40px;
	}

	.eve-band.is-open,
	.eve-search {
		top: 83px;
	}
}

/* --------------------------------------------------------------------------
   Main
   -------------------------------------------------------------------------- */

.eve-main {
	min-height: calc(100vh - 190px);
}

/* Home: the module is centred in the space between header and footer. The
   original computes the same margins in script; nothing is centred when the
   module is taller than that space. */
@media (min-width: 768px) {
	.eve-main--home {
		display: flex;
		flex-direction: column;
		justify-content: center;
	}
}

/* --------------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------------- */

.eve-footer {
	position: relative;
	z-index: 999;
	height: 100px;
	padding: 0 30px;
	overflow: hidden;
	background-color: var(--eve-bg-footer);
}

.eve-footer .eve-container {
	max-width: 100%;
}

.eve-footer__flex {
	position: relative;
	display: flex;
	align-items: center;
	height: 100px;
	margin: 0 -20px;
	padding: 0 20px;
}

.eve-footer__inner {
	flex: 1;
	text-align: center;
	color: var(--eve-footer-text);
}

.eve-footer__inner p {
	margin: 15px 0;
	font-size: 12px;
}

.eve-footer a {
	color: inherit;
}

.eve-footer__privacy {
	float: left;
}

.eve-social {
	padding-left: 0;
	list-style: none;
}

.eve-social li {
	display: inline-block;
	width: 22px;
	height: 22px;
	margin-top: 9px;
}

.eve-social li:not(:last-child) {
	margin-right: 30px;
}

.eve-social a {
	display: block;
	width: 100%;
	height: 100%;
}

.eve-social svg {
	display: block;
	width: 100%;
	height: 100%;
}

.eve-social path {
	fill: var(--eve-icon);
	transition: all var(--eve-ease);
}

.eve-social a:hover path {
	fill: var(--eve-text);
}

@media (max-width: 767px) {

	/* The original keeps the footer at 100px here and clips the social icons
	   off the bottom. Letting it grow is the one deliberate difference. */
	.eve-footer,
	.eve-footer__flex {
		height: auto;
		min-height: 100px;
	}

	.eve-footer__inner {
		line-height: 1.2;
	}

	.eve-footer__privacy {
		float: none;
	}

	.eve-social {
		margin: 0 0 10px;
	}
}

@media (min-width: 768px) {

	.eve-social {
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		height: 42px;
		margin: auto 0;
	}
}

/* --------------------------------------------------------------------------
   Rotate device notice, copied from the original media queries, including
   the 768 to 989 width band where the original shows it on any device.
   -------------------------------------------------------------------------- */

.eve-orientation {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 99999;
	display: none;
	width: 100%;
	height: 100%;
	background: var(--eve-bg) 50% no-repeat;
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait),
	(min-width: 768px) and (max-width: 989px) {
	.eve-orientation {
		display: block;
		background-image: url(../images/tablet.png);
	}
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
	.eve-orientation {
		display: none;
	}
}

@media only screen and (max-device-width: 767px) and (orientation: portrait) {
	.eve-orientation {
		display: none;
	}
}

@media only screen and (max-device-width: 767px) and (orientation: landscape) {
	.eve-orientation {
		display: block;
		background-image: url(../images/mobile.png);
	}
}
