/* //////////////////////////////////////////////////////////// */
/* // Type , vars, main */
/* //////////////////////////////////////////////////////////// */
html {
	font-family : "europa", sans-serif;
	font-weight : 400;
}

html:not(.animations) {
	scroll-behavior : smooth;
}

:target:before {
	content : "";
	display : block;
}

/* Fluid font size variables, for browsers that support clamp */
@supports (font-size: clamp(1rem, 1vw, 1rem)) {
	:root {
		--step-9 : clamp(0.81rem, 0.9vw + 0.59rem, 1.38rem);
		--step-8 : clamp(0.89rem, 0.99vw + 0.65rem, 1.51rem);
		--step-7 : clamp(0.98rem, 1.09vw + 0.71rem, 1.66rem);
		--step-6 : clamp(1.08rem, 1.2vw + 0.78rem, 1.83rem);
		--step-5 : clamp(1.19rem, 1.32vw + 0.86rem, 2.01rem);
		--step-4 : clamp(1.31rem, 1.45vw + 0.95rem, 2.21rem);
		--step-3 : clamp(1.44rem, 1.59vw + 1.04rem, 2.44rem);
		--step-2 : clamp(1.58rem, 1.75vw + 1.14rem, 2.68rem);
		--step-1 : clamp(1.74rem, 1.93vw + 1.26rem, 2.95rem);
		--step-0 : clamp(1.92rem, 2.12vw + 1.39rem, 3.24rem);
	}
}

/* Fallback variables for browsers that don't support clamp */
@supports not (font-size: clamp(1rem, 1vw, 1rem)) {
	:root {
		--step-9 : 0.81rem;
		--step-8 : 0.89rem;
		--step-7 : 0.98rem;
		--step-6 : 1.08rem;
		--step-5 : 1.19rem;
		--step-4 : 1.31rem;
		--step-3 : 1.44rem;
		--step-2 : 1.58rem;
		--step-1 : 1.74rem;
		--step-0 : 1.92rem;
	}

	@media screen and (min-width : 1400px) {
		:root {
			--step-9 : 1.38rem;
			--step-8 : 1.51rem;
			--step-7 : 1.66rem;
			--step-6 : 1.83rem;
			--step-5 : 2.01rem;
			--step-4 : 2.21rem;
			--step-3 : 2.44rem;
			--step-2 : 2.68rem;
			--step-1 : 2.95rem;
			--step-0 : 3.24rem;
		}
	}
}

/*

https://www.fluid-type-scale.com/calculate?minFontSize=13&minWidth=400&minRatio=1.1&maxFontSize=22&maxWidth=1400&maxRatio=1.1&steps=9%2C8%2C7%2C6%2C5%2C4%2C3%2C2%2C1%2C0&baseStep=9&prefix=step&decimals=2&includeFallbacks=on&useRems=on&remValue=16&previewFont=Inter

*/
:root {
	--white              : #FFF;
	--black              : #000;
	--primary            : #00234F;
	--primary-lighter    : #000;
	--primary-darker     : #000;
	--secondary          : #6DCFF6;
	--secondary-lighter  : #000;
	--secondary-darker   : #000;
	--tertiary           : #000;
	--tertiary-lighter   : #000;
	--tertiary-darker    : #000;
	--preloader-bg       : #00234F;
	--preloader-circle   : rgba(255, 255, 255, 0.1);
	--form-error         : #690207;
	--input-label        : #000;
	--input-color        : #000;
	--input-placeholder  : #000;
	--input-bg           : #6DCFF6;;
	--input-borders      : #fff;
	--header-size-large  : 0px;
	--header-size-medium : 0px;
	--header-size-small  : 0px;
	--swiper-theme-color : #FFF;
	--swiper-bullet      : #FFF;
	--swiper-bullet-off  : #000;
	--swiper-bullet-on   : #FFF;
	--nav-large          : 0px;
	--nav-small          : 0px;
	--alt-font           : Times;
	--popup-bg           : #000;
	--popup-colour       : #FFF;
}

h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4,
h5, .h5,
h6, .h6 {
	font-weight : 500;
}

h1, .h1 {
	font-size     : var(--step-5);
	line-height   : var(--step-3);
	margin-bottom : 1.5rem;
	font-weight   : 700;
}

h1.bigger, .h1.bigger {
	font-size     : var(--step-1);
	line-height   : var(--step-0);
	margin-bottom : 1.5rem;
	font-weight   : 700;
}

h2, .h2 {
	font-size     : var(--step-7);
	line-height   : var(--step-6);
	margin-bottom : 1.3rem;
	font-weight   : 700;
}

h3, .h3 {
	font-size     : var(--step-6);
	line-height   : var(--step-5);
	margin-bottom : 1.1rem;
	font-weight   : 700;
}

.generic p.alt-font,
h4, .h4 {
	font-size     : var(--step-8);
	line-height   : var(--step-5);
	margin-bottom : 1rem;
}

.europa-light {
	font-weight : 400;
	font-style  : normal;
}

b, strong {
	font-weight : 700;
	font-style  : normal;
}

body,
.generic,
.content p,
.generic p {
	font-size   : 15px;
	line-height : 23px;
}

/* //////////////////////////////////////////////////////////// */
/* // Header and Main Navigation */
/* //////////////////////////////////////////////////////////// */
img.for_dark {
	visibility : visible;
	opacity    : 1;
}

img.for_light {
	visibility : hidden;
	opacity    : 0;
}

body.section-1 .nav-outer {
	position   : fixed;
	top        : 100vh;
	visibility : hidden;
	opacity    : 0;
}

body:not(.section_1) .nav-outer {
	top      : 0;
	position : fixed;
	/*visibility : visible;
	opacity    : 1;*/
}

body.dark_mode .nav-outer {
	background-color : var(--primary);
}

body.dark_mode.last-section .navbar-items ul > li ul,
body.dark_mode.last-section .nav-outer {
	background-color : #000;
}

body:not(.dark_mode) .nav-outer {
	background-color : #fff;
}

body:not(.dark_mode) .navbar-items a {
	color : var(--primary);
}

body:not(.dark_mode) .navbar-items a.active,
body:not(.dark_mode) .navbar-items a:hover {
	color : var(--secondary);
}

body:not(.dark_mode) .navbar-items ul > li ul {
	background-color : #fff;
	color            : var(--primary);
}

body:not(.dark_mode) .navbar-items ul > li ul a {
	color : var(--primary);
}

body:not(.dark_mode) .navbar-items ul > li ul {
	background-color : #fff;
	color            : var(--primary);
}

body:not(.dark_mode) .burger {
	color : var(--primary);
}

body:not(.dark_mode) img.for_light {
	visibility : visible;
	opacity    : 1;
}

.nav-outer,
.nav-outer * {
	transition : all 0.25s ease-in-out;
}

/* //////////////////////////////////////////////////////////// */
/* // Content */
/* //////////////////////////////////////////////////////////// */
section:not(#intro) .scroll-down {
	position : relative;
	display  : block;
	bottom   : -20px;
}

.font-thin {
	font-weight : 100;
}

.has-dot img {
	height : 45px;
}

.page_light {
	color            : var(--primary);
	background-color : #fff;
}

.page_dark {
	color            : #fff;
	background-color : var(--primary);
}

.page_dark.bg-black {
	color            : #fff;
	background-color : #000 !important;
}

section {
	overflow : hidden;
}

/* //////////////////////////////////////////////////////////// */
/* // Footer */
/* //////////////////////////////////////////////////////////// */
/* //////////////////////////////////////////////////////////// */
/* // Buttons */
/* //////////////////////////////////////////////////////////// */
.button-submit {
	background-color : var(--primary);
	border-radius    : 100px;
	padding          : 10px 30px;
}

/* //////////////////////////////////////////////////////////// */
/* // Forms */
/* //////////////////////////////////////////////////////////// */
/*.fl-form textarea.fl-textarea,
.fl-form textarea.fl-textarea:active,
.fl-form textarea.fl-textarea:focus {
	background-color : #fff !important;
	border-radius    : 5px;
}*/
/*
.fl-form input.fl-input,
.fl-form select.fl-select,
.fl-form textarea.fl-textarea {
	font-size   : var(--step-8);
	line-height : var(--step-5);
}
*/
/* //////////////////////////////////////////////////////////// */
/* // Custom */
/* //////////////////////////////////////////////////////////// */
.footer-circle {
	bottom : 0;
	top    : 0;
	width  : 79vw;
	right  : -20vw;
	margin : 25vh auto 0 auto;
}

.fix-3 {
	height : calc(100% - 87px);
}

.intro-circle {
	transform  : scale(0);
	transition : all 1s ease-in-out;
}

.intro-circle.large {
	transform : scale(50);
}

section.grid {
	grid-template-rows : 130px 1fr;
}

.go-down img {
	width      : 60px;
	margin-top : auto;
}

.c-1 {
	grid-area : c-1;
}

.c-2 {
	grid-area : c-2;
}

.c-3 {
	grid-area : c-3;
}

.c-4 {
	grid-area : c-4;
}

.c-5 {
	grid-area : c-5;
}

.c-6 {
	grid-area : c-6;
}

.c-7 {
	grid-area : c-7;
}

.c-8 {
	grid-area : c-8;
}

.c-9 {
	grid-area : c-9;
}

.grid-c {
	display               : grid;
	grid-template-columns : 50% 50px 50%;
	grid-template-rows    : 33.33% 33.33% 33.33%;
	grid-gap              : 0px;
	align-items           : start;
	grid-template-areas   :
        "c-1 c-2 c-3"
        "c-4 c-5 c-6"
        "c-7 c-8 c-6";
	margin                : 0 0 -10px 5px;
}

.grid-d {
	display               : grid;
	grid-template-columns : 1fr 1fr 1fr;
	grid-template-rows    : 25% auto 25%;
	grid-gap              : 60px;
	align-items           : start;
	grid-template-areas   :
        "c-1 c-2 c-3"
        "c-4 c-5 c-6"
        "c-7 c-8 c-9";
}

.grid-e {
	display               : grid;
	grid-template-columns : 50% 45px auto;
	grid-template-rows    : 25% auto 25%;
	grid-gap              : 0px;
	align-items           : start;
	grid-template-areas   :
        "c-1 c-2 c-3"
        "c-6 c-5 c-4"
        "c-7 c-8 c-9";
}

.swiper-slide img {
	object-position : center center;
	height          : 100%;
}

.slider_1 {
	height : 100%;
}

.greyscale {
	filter : saturate(0);
}

.round-top-left {
	-webkit-border-top-left-radius : 30px;
	-moz-border-radius-topleft     : 30px;
	border-top-left-radius         : 30px;
}

.round-top-right {
	-webkit-border-top-right-radius : 30px;
	-moz-border-radius-topright     : 30px;
	border-top-right-radius         : 30px;
}

.round-bottom-left {
	-webkit-border-bottom-left-radius : 30px;
	-moz-border-radius-bottomleft     : 30px;
	border-bottom-left-radius         : 30px;
}

.round-bottom-right {
	-webkit-border-bottom-right-radius : 30px;
	-moz-border-radius-bottomright     : 30px;
	border-bottom-right-radius         : 30px;
}

/* // ABOUT // */
body.section-2 .navbar-items ul li:nth-child(1) a {
	color : var(--secondary);
}

/* // ABOUT // */
body.section-3 .navbar-items ul li:nth-child(2) a {
	color : var(--secondary);
}

/* // TEAM // */
body.section-4 .navbar-items ul li:nth-child(3) a,
body.section-5 .navbar-items ul li:nth-child(3) a {
	color : var(--secondary);
}

/* // PROJECTS // */
body.section-6 .navbar-items ul li:nth-child(4) a,
body.section-7 .navbar-items ul li:nth-child(4) a {
	color : var(--secondary);
}

body.section-8 .navbar-items ul li:nth-child(5) a {
	color : var(--secondary);
}

.footer-text {
	font-size   : 12px;
	line-height : 1.5em;
	text-align  : center;
}

.vimeo-wrapper {
	position       : absolute;
	top            : 0;
	left           : 0;
	width          : 100%;
	height         : 100%;
	z-index        : 0;
	pointer-events : none;
	overflow       : hidden;
	opacity        : 0.5;
}

.vimeo-wrapper iframe {
	width      : 100vw;
	height     : 56.25vw;
	min-height : 100vh;
	min-width  : 177.77vh;
	position   : absolute;
	top        : 50%;
	left       : 50%;
	transform  : translate(-50%, -50%);
}

.mfp-content .generic li, .mfp-content .generic p {
	font-size   : 13px;
	line-height : 1.5em;
}

/* //////////////////////////////////////////////////////////// */
/* //////////////////////////////////////////////////////////// */
/* //////////////////////////////////////////////////////////// */
@media (min-width : 1600px) {
}

@media (min-width : 1200px) {
}

@media (max-width : 1500px) {
	.grid-e {
		grid-template-columns : 50% 45px auto;
		grid-template-rows    : 22% auto 22%;
	}
}

@media (min-width : 769px) {
	.navbar-logo {
		padding-left : 0.75rem;
	}

	.navbar-items a {
		padding : 10px 25px;
	}

	.toggle-nav {
		display : none !important;
	}

	.navbar-items ul > li {
		position : relative;
		padding  : 3px 0px;
	}

	.navbar-items ul > li ul {
		visibility       : hidden;
		position         : absolute;
		top              : 0;
		left             : -45px;
		right            : 0;
		padding          : 0px 20px;
		margin-left      : auto;
		margin-right     : auto;
		background-color : var(--primary);
		overflow         : hidden;
		width            : 210px;
		max-height       : 0;
		opacity          : 0;
		transition       : all 0.5s ease-in-out;
		text-align       : center;
	}

	.navbar-items ul > li ul > li:first-of-type a {
		padding-top : 20px;
	}

	.navbar-items ul > li ul > li:last-of-type a {
		padding-bottom : 20px;
	}

	.navbar-items ul > li:hover ul {
		visibility : visible;
		max-height : 80px;
		opacity    : 1;
	}

	.navbar-items ul > li ul li {
		display : inline-block;
	}

	.navbar-items ul > li ul li a.active,
	.navbar-items ul > li ul li:hover a {
		color : var(--secondary);
	}

	.navbar-items ul > li ul li a {
		color   : white;
		padding : 3px 0;
		display : block;
	}

	.navbar-items > ul {
		margin : -15px 0;
		height : 78px;
	}

	.navbar-items ul > li ul {
		top : 45px;
	}

	.navbar-items ul > li > a {
		/*padding : 29px 7px;*/
	}
}

@media (max-width : 1024px) {
	.grid-e {
		grid-template-columns : 50% 30px auto;
	}
}

@media (max-width : 768px) {
	body,
	.generic,
	.content p,
	.generic p {
		font-size   : 14px;
		line-height : 21px;
	}

	.contact-area .flex {
		padding : 0px;
	}

	.dot-fix {
		margin : -15px 0 -15px calc(100% + -18px) !important;
	}

	body section:last-of-type {
		min-height : calc(100vh + 10px) !important;
	}

	/*.c-6 img {
		position : relative !important;
	}*/
	section.grid {
		grid-template-rows : 75px 1fr 45px;
	}

	.grid-d .c-5 {
		padding : 30px 0;
	}

	.grid-c {
		display               : grid;
		grid-template-columns : 100%;
		grid-template-rows    : auto auto;
		grid-gap              : 30px;
		grid-template-areas   :
        "c-4"
        "c-6";
		margin                : 0 0 -10px 5px;
	}

	.grid-d {
		display               : grid;
		grid-template-columns : 100%;
		grid-template-rows    : auto auto;
		grid-gap              : 30px;
		grid-template-areas   :
        "c-4"
		"c-5"
		"c-6";
	}

	.grid-e {
		display               : grid;
		grid-template-columns : 100%;
		grid-template-rows    : auto auto;
		grid-gap              : 30px;
		grid-template-areas   :
        "c-6"
		"c-4";
	}

	nav {
		transition : all 1s ease-in-out;
	}

	nav * {
		transition : all 1.5s ease-in-out;
	}

	/*/////////////////*/
	.navbar-items a,
	.navbar-items .social-header,
	.navbar-items .social-header a {
		color : white;
	}

	.navbar-items ul > li {
		position : relative;
	}

	.navbar-items ul > li ul {
		/*visibility         : hidden;*/
		position   : relative;
		padding    : 0px 20px;
		/*background-color : var(--primary);*/
		color      : white;
		overflow   : hidden;
		max-height : 0;
		/*opacity          : 0;*/
		font-size  : 90%;
		/*transition         : all 2s ease;
		-moz-transition    : all 2s ease;
		-webkit-transition : all 2s ease;
		-o-transition      : all 2s ease;*/
		margin     : 0px !important;
		/*animation-delay    : 0s;
		transition-delay   : 0s;*/
	}

	.navbar-items ul > li ul > li:first-of-type a {
		padding-top : 7px;
	}

	.navbar-items ul > li ul > li:last-of-type a {
		padding-bottom : 15px;
	}

	.navbar-items ul > li.opened ul {
		/*animation-delay  : 0s;
		transition-delay : 0s;*/
		/*visibility       : visible;*/
		max-height : 250px;
	}

	.navbar-items ul > li ul li a {
		color   : white;
		opacity : 0.5;
		padding : 3px 0;
		display : block;
	}

	.navbar-items ul > li a.active,
	.navbar-items ul > li ul li a.active {
		/*color : var(--secondary-darker) !important;*/
		/*opacity : 1;*/
	}

	.navbar-items ul li a.toggle-nav {
		z-index  : 2;
		position : absolute;
		top      : -0px;
		left     : calc(50% + 41px);
		width    : 32px;
		height   : 32px;
		padding  : 7px;
	}

	.footer-circle {
		bottom    : 0;
		top       : 111vh;
		width     : 200vw;
		height    : 200vw;
		max-width : 200vw;
		right     : -50vw;
		margin    : auto;
	}
}

@media (max-width : 640px) {
	.footer-circle {
		top : 65vh;
	}

	form {
		padding-top : 100px;
	}

	body, .generic {
		font-size   : var(--step-5);
		line-height : var(--step-3);
	}
}

@media (max-width : 480px) {
	form {
		padding-bottom : 50px;
		padding-top    : 0px;
	}

	.footer-circle {
		bottom    : 0;
		top       : 73vh;
		width     : 200vw;
		height    : 200vw;
		max-width : 200vw;
		right     : -50vw;
		margin    : auto;
	}
}