@import "https://fonts.googleapis.com/css?family=Playfair+Display:700|IBM+Plex+Sans:500&display=swap";
	:root {
	--color-primary:#6B7A8F;
	--color-secondary:;
	--color-accent:#1D1F2F;
	--color-focus:#6D64F7;
	--base-duration:600ms;
	--base-ease:cubic-bezier(0.25,0.46,0.45,0.84)
}
*,*:before,*:after {
	box-sizing:border-box
}
html,body {
	height:100%
}
body {
	font-family:ibm plex sans,sans-serif;
	background-color:var(--color-secondary)
}
#app {
	align-items:center;
	display:flex;
	height:100%;
	justify-content:center;
	overflow-x:hidden;
	width:100%
}
h1,h2,h3 {
	font-family:playfair display,serif
}
.visuallyhidden {
	clip:rect(1px,1px,1px,1px);
	height:1px;
	overflow:hidden;
	position:absolute!important;
	white-space:nowrap;
	width:1px
}
.icon {
	fill:var(--color-primary);
	width:100%
}
.btn {
	background-color:var(--color-primary);
	border:none;
	border-radius:.125rem;
	color:#fff;
	cursor:pointer;
	font-family:inherit;
	font-size:inherit;
	padding:1rem 2.5rem 1.125rem
}
.btn:focus {
	outline-color:var(--color-focus);
	outline-offset:2px;
	outline-style:solid;
	outline-width:3px
}
.btn:active {
	-webkit-transform:translateY(1px);
	transform:translateY(1px)
}
.slider__controls {
	display:flex;
	justify-content:center;
	position:absolute;
	top:calc(100% + 1rem);
	width:100%
}
.slider__controls .btn {
	--size:3rem;
	align-items:center;
	background-color:transparent;
	border:3px solid transparent;
	border-radius:100%;
	display:flex;
	height:var(--size);
	padding:0;
	width:var(--size)
}
.slider__controls .btn:focus {
	border-color:var(--color-focus);
	outline:none
}
.slider__controls .btn--previous>* {
	-webkit-transform:rotate(180deg);
	transform:rotate(180deg)
}
.slider {
	--slide-size:80vmin;
	--slide-size1:50.4vmin;
	--slide-margin:1vmin;
	height:var(--slide-size);
	margin:0 auto;
	position:relative;
	width:var(--slide-size1)
}
.slider__wrapper {
	display:flex;
	margin:0 auto;
	position:absolute;
	transition:-webkit-transform var(--base-duration) cubic-bezier(.25,1,.35,1);
	transition:transform var(--base-duration) cubic-bezier(.25,1,.35,1);
	transition:transform var(--base-duration) cubic-bezier(.25,1,.35,1),-webkit-transform var(--base-duration) cubic-bezier(.25,1,.35,1)
}
.slide {
	align-items:center;
	color:#fff;
	display:flex;
	flex: 1;
	flex-direction:column;
	height: var(--slide-size);
	justify-content:center;
	margin: 0;
	opacity:.25;
	position:relative;
	text-align:center;
	transition:opacity calc(var(--base-duration)/2) var(--base-ease),-webkit-transform calc(var(--base-duration)/2) var(--base-ease);
	transition:opacity calc(var(--base-duration)/2) var(--base-ease),transform calc(var(--base-duration)/2) var(--base-ease);
	transition:opacity calc(var(--base-duration)/2) var(--base-ease),transform calc(var(--base-duration)/2) var(--base-ease),-webkit-transform calc(var(--base-duration)/2) var(--base-ease);
	width: var(--slide-size1);
	z-index:1;
	/* left: -10%; */
}
.slide--previous:hover,.slide--next:hover {
	opacity:.5
}
.slide--previous {
	cursor:w-resize
}
.slide--previous:hover {
	-webkit-transform:translateX(2%);
	transform:translateX(2%)
}
.slide--next {
	cursor:e-resize
}
.slide--next:hover {
	-webkit-transform:translateX(-2%);
	transform:translateX(-2%)
}
.slide--current {
	--x:0;
	--y:0;
	--d: 0;
	opacity:1;
	pointer-events:auto;
	-webkit-user-select:auto;
	-moz-user-select:auto;
	-ms-user-select:auto;
	user-select:auto;
}
@media(hover:hover) {
	.slide--current:hover .slide__image-wrapper {
	-webkit-transform:scale(1.025) translate(calc(var(--x)/var(--d) * 1px),calc(var(--y)/var(--d) * 1px));
	transform:scale(1.025) translate(calc(var(--x)/var(--d) * 1px),calc(var(--y)/var(--d) * 1px))
}
}.slide__image-wrapper {
	/* background-color:var(--color-accent); */
	border-radius:1%;
	height:80%;
	/* left: -46%; */
	overflow:hidden;
	position:absolute;
	top:13%;
	transition:-webkit-transform calc(var(--base-duration)/4) var(--base-ease);
	transition:transform calc(var(--base-duration)/4) var(--base-ease);
	transition:transform calc(var(--base-duration)/4) var(--base-ease),-webkit-transform calc(var(--base-duration)/4) var(--base-ease);
	width: 100%;
}
.slide__image {
	--d:20;
	height: 100%;
	left:-5%;
	-o-object-fit:cover;
	object-fit:cover;
	opacity:0;
	pointer-events:none;
	position:absolute;
	/* top:-5%; */
	transition:opacity var(--base-duration) var(--base-ease),-webkit-transform var(--base-duration) var(--base-ease);
	transition:opacity var(--base-duration) var(--base-ease),transform var(--base-duration) var(--base-ease);
	transition:opacity var(--base-duration) var(--base-ease),transform var(--base-duration) var(--base-ease),-webkit-transform var(--base-duration) var(--base-ease);
	-webkit-user-select:none;
	-moz-user-select:none;
	-ms-user-select:none;
	user-select:none;
	width: 100%;
}
@media(hover:hover) {
	.slide--current .slide__image {
	-webkit-transform:translate(calc(var(--x)/var(--d) * 1px),calc(var(--y)/var(--d) * 1px));
	transform:translate(calc(var(--x)/var(--d) * 1px),calc(var(--y)/var(--d) * 1px))
}
}.slide__headline {
	font-size:8vmin;
	font-weight:600;
	position:relative
}
.slide__content {
	--d:60;
	opacity:0;
	padding:4vmin;
	position:relative;
	transition:-webkit-transform var(--base-duration) var(--base-ease);
	transition:transform var(--base-duration) var(--base-ease);
	transition:transform var(--base-duration) var(--base-ease),-webkit-transform var(--base-duration) var(--base-ease);
	visibility:hidden;
}
.slide--current .slide__content {
	-webkit-animation:fade-in calc(var(--base-duration)/2) var(--base-ease) forwards;
	animation:fade-in calc(var(--base-duration)/2) var(--base-ease) forwards;
	visibility:visible
}
@media(hover:hover) {
	.slide--current .slide__content {
	-webkit-transform:translate(calc(var(--x)/var(--d) * -1px),calc(var(--y)/var(--d) * -1px));
	transform:translate(calc(var(--x)/var(--d) * -1px),calc(var(--y)/var(--d) * -1px));
}
}.slide__content>*+* {
	margin-top:2rem
}
@-webkit-keyframes fade-in {
	from {
	opacity:0
}
to {
	opacity:1
}
}@keyframes fade-in {
	from {
	opacity:0
}
to {
	opacity:1
}
}

@media screen and (max-width:760px){
	
	.slider {
	--slide-size:80vmin;
	--slide-size1:110vmin;
	--slide-margin:4vmin;
	height:var(--slide-size1);
	margin:0 auto;
	position:relative;
	width:var(--slide-size)
}
.slide__image-wrapper {
	background-color:var(--color-accent);
	border-radius:1%;
	height:120%;
	left:0%;
	overflow:hidden;
	position:absolute;
	top:0%;
	transition:-webkit-transform calc(var(--base-duration)/4) var(--base-ease);
	transition:transform calc(var(--base-duration)/4) var(--base-ease);
	transition:transform calc(var(--base-duration)/4) var(--base-ease),-webkit-transform calc(var(--base-duration)/4) var(--base-ease);
	width:100%
}


.slider__wrapper {
	display:flex;
	margin:0 calc(var(--slide-margin) * -1);
	position:absolute;
	transition:-webkit-transform var(--base-duration) cubic-bezier(.25,1,.35,1);
	transition:transform var(--base-duration) cubic-bezier(.25,1,.35,1);
	transition:transform var(--base-duration) cubic-bezier(.25,1,.35,1),-webkit-transform var(--base-duration) cubic-bezier(.25,1,.35,1)
}



.slide {
	align-items:center;
	color:#fff;
	display:flex;
	flex:1;
	flex-direction:column;
	height:var(--slide-size);
	justify-content:center;
	margin:0 var(--slide-margin);
	opacity:.25;
	position:relative;
	text-align:center;
	transition:opacity calc(var(--base-duration)/2) var(--base-ease),-webkit-transform calc(var(--base-duration)/2) var(--base-ease);
	transition:opacity calc(var(--base-duration)/2) var(--base-ease),transform calc(var(--base-duration)/2) var(--base-ease);
	transition:opacity calc(var(--base-duration)/2) var(--base-ease),transform calc(var(--base-duration)/2) var(--base-ease),-webkit-transform calc(var(--base-duration)/2) var(--base-ease);
	width:var(--slide-size);
	z-index:1
}
.slide--previous:hover,.slide--next:hover {
	opacity:.5
}
.slide--previous {
	cursor:w-resize
}
.slide--previous:hover {
	-webkit-transform:translateX(2%);
	transform:translateX(2%)
}
.slide--next {
	cursor:e-resize
}
.slide--next:hover {
	-webkit-transform:translateX(-2%);
	transform:translateX(-2%)
}
.slide--current {
	--x:0;
	--y:0;
	--d:50;
	opacity:1;
	pointer-events:auto;
	-webkit-user-select:auto;
	-moz-user-select:auto;
	-ms-user-select:auto;
	user-select:auto
}
@media(hover:hover) {
	.slide--current:hover .slide__image-wrapper {
	-webkit-transform:scale(1.025) translate(calc(var(--x)/var(--d) * 1px),calc(var(--y)/var(--d) * 1px));
	transform:scale(1.025) translate(calc(var(--x)/var(--d) * 1px),calc(var(--y)/var(--d) * 1px))
}
}.slide__image {
	--d:20;
	height:110%;
	left:-5%;
	-o-object-fit:cover;
	object-fit:cover;
	opacity:0;
	pointer-events:none;
	position:absolute;
	top:-5%;
	transition:opacity var(--base-duration) var(--base-ease),-webkit-transform var(--base-duration) var(--base-ease);
	transition:opacity var(--base-duration) var(--base-ease),transform var(--base-duration) var(--base-ease);
	transition:opacity var(--base-duration) var(--base-ease),transform var(--base-duration) var(--base-ease),-webkit-transform var(--base-duration) var(--base-ease);
	-webkit-user-select:none;
	-moz-user-select:none;
	-ms-user-select:none;
	user-select:none;
	width:110%
}}<!--ecms sync check [sync_thread_id="3bcee7cc5a424330844ab778a62d31c1" sync_date="2019-09-30 19:09:15" check_sum="3bcee7cc5a424330844ab778a62d31c1]-->