/*-----------------------------
		GENERAL
-----------------------------*/

:root {
	--fontSize: 16px;
	--wrapper: 1300px;
	--gutter: 46px;
	--textColor: #000000;
	--blue: #189aae;
	--yellow: #fee042;
	--orange: #f35b54;
	--orange2: #f79702;
	--mauve: #bb67a3;
	--purple: #8f4584;
	--pink: #e6047b;
	--green: #188e8d;
	--trueBlack: #000000;
	--lightGrey: #f6f6f7;
	--noShadow: 0px 0px 50px 5px rgba(0,0,0,0);
	--boxShadow: 0px 0px 50px 5px rgba(0,0,0,0.15);
	--boxShadowHover: 0px 0px 10px 1px rgba(0,0,0,0.05);
	--btnBoxShadow: 0px 10px 20px 4px rgba(0,0,0,0.15);
	--btnBoxShadowHover: 0px 1px 5px 1px rgba(0,0,0,0.05);
	--lightBoxShadow: 0px 0px 3px 1px rgba(0,0,0,0.15);
	--lightBoxShadowHover: 0px 0px 3px 1px rgba(0,0,0,0.05);
	--mediumBoxShadow: 0px 0px 15px 5px rgba(0,0,0,0.1);
	--mediumBoxShadowHover: 0px 0px 6px 2px rgba(0,0,0,0.075);
	--serif: 'DM Serif Display', serif;
}
	@media screen and (max-width: 1000px) {
		:root {
			--fontSize: 14px;
			--gutter: 38px;
		}
	}
	@media screen and (max-width: 450px) {
		:root {
			--fontSize: 12px;
			--gutter: 30px;
		}
	}


html {
	max-width: 100vw;
	overflow-x: hidden;
}

body {
	color: var(--textColor);
	font-family: 'Poppins', sans-serif;
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	font-smoothing: antialiased;
	font-weight: 400;
	font-size: var(--fontSize);
	background-color: #fff;
}

	@media screen and (max-width: 600px) {
		body { overflow-x: hidden; position: relative; }
	}

strong {
	font-weight: 600;
}

.f-line {
	-webkit-text-fill-color: transparent;
	-webkit-text-stroke-width: 2px;
	-webkit-text-stroke-color: currentColor;
	opacity: 0.7;
}
	@media screen and (max-width: 600px) {
		.f-line { -webkit-text-stroke-width: 1px; }
	}
.serif {
	font-family: var(--serif);
}

.page-color {
	color: var(--pink);
}


/*******************
 wrappers
*******************/
.wrapper {
width:100%;
max-width: calc(var(--wrapper) + (2 * (var(--gutter))));
padding:0 var(--gutter);
margin:auto;
position:relative;
}
.wrapper-wide {
max-width: calc(100% - (2 * (var(--gutter))));
}
.wrapper.no-padding { padding: 0; }
.wrapper-full { max-width:100%; }
.wrapper-2500 { max-width:2500px; }
.wrapper-2000 { max-width:2000px; }
.wrapper-1800 { max-width:1800px; }
.wrapper-1600 { max-width:1600px; }
.wrapper-1500 { max-width:1500px; }
.wrapper-1400 { max-width:1400px; }
.wrapper-1300 { max-width:1300px; }
.wrapper-1200 { max-width:1200px; }
.wrapper-1100 { max-width:1100px; }
.wrapper-1000 { max-width:1000px; }
.wrapper-900 { max-width:900px; }
.wrapper-850 { max-width:850px; }
.wrapper-800 { max-width:800px; }
.wrapper-700 { max-width:700px; }
.wrapper-600 { max-width:600px; }
.wrapper-500 { max-width:500px; }
.wrapper-450 { max-width:450px; }
.wrapper-400 { max-width:400px; }
.wrapper-300 { max-width:300px; }
.wrapper-200 { max-width:200px; }

/*******************
	helpers
*******************/


.white { color: #fff; }
.blue { color: var(--blue); }
.orange { color: var(--orange); }
.purple { color: var(--purple); }
.mauve { color: var(--mauve); }
.green { color: var(--green); }
.bg-lightGrey {
	background-color: var(--lightGrey);
}
.bg-white {
	background-color: #ffffff;
	color: var(--black);
}
.bg-blue {
	background-color: var(--blue);
	color: #fff;
}
.bg-yellow {
	background-color: var(--yellow);
}
.bg-orange {
	background-color: var(--orange);
	color: #fff;
}
.bg-orange2 {
	background-color: var(--orange2);
	color: #fff;
}
.bg-mauve {
	background-color: var(--mauve);
	color: #fff;
}
.bg-purple {
	background-color: var(--purple);
	color: #fff;
}
.bg-green {
	background-color: var(--green);
	color: #fff;
}

.btn { padding: 0.65em 2.25em; border-radius: 2em;  }

.btn-big { font-weight: 700; font-size: 2.5em; }
.btn-wide { padding: 0.33em 2.66em; }

@media screen and (max-width: 800px) {
	main > .spacer.big,
	main > section > .spacer.big { height: 2em; }
}

sub {
	position: relative;
	top: 0.5em;
	vertical-align: bottom;
	font-size: 0.66em;
}

.back-to-top {
	z-index: 888;
	position: fixed;
	bottom: -10em;
	right: var(--gutter);
	width: 2.5em;
	height: 2.5em;
	background-color: transparent;
	background-image: url(../../img/icon-arrow-btn.svg);
	background-repeat: no-repeat;
	background-position: center;
	background-size: auto 100%;
	border-radius: 50%;
/*	box-shadow: var(--lightBoxShadow);
*/	transition: 0.6s;
}
.back-to-top:hover {
	transform: rotate(-45deg);
}
body.scrolled .back-to-top {
	bottom: 3em;
}


.text strong { color: var(--brown); }


.slick-dots {
	list-style-type: none;
	text-align: center;
}
.slick-dots li,
.slick-dots li button {
	display: inline-block;
	font-size: 0;
	width: 13px;
	height: 13px;
	background: rgba(38,70,124,0);
	border: rgba(38,70,124,1) 1px solid;
	border-radius: 50%;
	margin-right: 10px;
	padding: 0;
	line-height: 0;
	cursor: pointer;
	transition: 0.3s;
}
.slick-dots li:hover {
	background: rgba(38,70,124,0.5);
}
.slick-dots li.slick-active {
	background: rgba(38,70,124,1);
}
.slick-dots li button { opacity: 0; }

.slick-slider > button {
	background-color: #fff;
	color: var(--blue);
}
.slick-slider > button:hover {
	background-color: var(--blue);
	color: #fff;
}



.video-bg {
	z-index: 1;
	overflow: hidden;
	position: absolute;
	transition: 0.3s;
}
.video-bg > video {
	position: absolute;
	width: 100%;
	min-height: 100%;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	object-position: center;
	object-fit: cover;
}