@charset "UTF-8";
/* CSS Document */



/* HERO */
.hero {
	width:100%;
	padding-top:0;
	margin-top:0;
	height:100%;
	position:absolute;
	 left:0;
    top:0;
	-webkit-font-smoothing: antialiased;
    transform: translate(0);
	z-index:1;
}
@media (max-width: 767px) {
.hero {
	margin-bottom: env(safe-area-inset-bottom);	
}
}


/*  HERO SLIDER */

.hero-cycle, .hero-cycle .slide {
	width:100%!important;
	height:100%!important;
	position:absolute;
	overflow:hidden;
}
.hero-cycle {
	width:100%!important;
	margin:0;
	right:0;
	top:0;
	position:relative;
	opacity:1;
	z-index:1;
}
.cycle-counter {
	position:absolute;
	bottom:5.7%;
	left:8%;
	z-index:10;
	text-align: right;
	color:#fff;
	opacity:1;
	transition:opacity 0.5s 1s;
	mix-blend-mode: exclusion;
}
.cycle-counter.hidden {
	opacity:0;
	transition:opacity 0s 0s;
}
.cycle-counter span {
	display:inline-block;
	text-align: center;
	min-width:40px;
}
@media (max-width: 1023px) {
.cycle-counter {
	bottom:3.6%;
	left:14%;
}
}
@media (max-width:767px) {
.cycle-counter {
	bottom:4.1%;
	left:13%;
}	
}
@media (max-height:812px) {
.cycle-counter {
	bottom:4.5%;
	left:13%;
}	
}
.wipe-1, .wipe-2 {
	width:100%;
	height:100%;
	background:#fff;
	transform:translateY(-110%);
	transition:transform 0.5s ease-out 0s;
	z-index:50;
	top:0;
	position: absolute;
}
.wipe-1 {
	transform:translateY(-110%);	
}
.wipe-2 {
	transform:translateY(110%);	
}
.wipe-1.active, .wipe-2.active {
	transform:translateY(0);
	transition:transform 0.5s ease-out;	
}
.hero-cycle .slide {
	background-color:#fff!important;
}


/*  SLIDER BACKGROUND WIPE */

@keyframes slide-background-right {
    0% {
        transform:scaleX(0);
		transform-origin:right;
    }	
	5% {
        transform:scaleX(1);
		transform-origin:right;
    }
	95% {
        transform:scaleX(1);
		transform-origin:left;		
    }
	100% {
        transform:scaleX(0);
		transform-origin:left;	
    }
}
.slide-background {
	width:102%;
	height:102%;
	position:absolute;
	background-color:#fff;
	top:-1%;
	left:-1%;
	right:-1%;
	bottom:-1%;
	transform:scaleX(0);
	will-change: transform;
}
#s2.active .slide-background,
#s4.active .slide-background,
#s6.active .slide-background {
	animation-timing-function: ease-in-out;
	animation:slide-background-right;
	animation-duration: 8s;
}

@keyframes slide-wipe-1 {
    0% {
		transform-origin:right;
        transform:scaleX(1);
    }	
	10% {
		transform-origin:right;
        transform:scaleX(0);
    }
	80% {
		transform-origin:left;
        transform:scaleX(0);
    }
	90% {
		transform-origin:left;
        transform:scaleX(1);
    }
}
@keyframes slide-wipe-2 {
    10% {
		transform-origin:right;
        transform:scaleX(1);
    }	
	20% {
		transform-origin:right;
        transform:scaleX(0);
    }
	80% {
		transform-origin:left;
        transform:scaleX(0);
    }
	90% {
		transform-origin:left;
        transform:scaleX(1);
    }
}
.slide-image::after, .video-clip::after, .row::after {
	content:"";
	position:absolute;
	height:102%;
	transform:translateX(0) scaleX(1);
	transform-origin:left;
	will-change: transform;
	top:-1%;
	left:-1%;
	width:102%;
	background-color:#fff;
	transition:0.5s;
}
.hero-cycle .slide.active .slide-image::after, .hero-cycle .slide.active .slide-image:nth-child(3)::after {
	animation: slide-wipe-1;
	animation-duration: 7s;
	animation-delay: 0.5s;	
}
.hero-cycle .slide.active .slide-image:nth-child(2)::after, 
.hero-cycle .slide.active .video-clip::after, 
.hero-cycle .slide.active .slide-image:nth-child(4)::after {
	animation: slide-wipe-2;
	animation-duration: 7s;
	animation-delay: 0.5s;
}
.slide-image {
	width:auto;
	height:auto;
	overflow:hidden;
	position:absolute;
	margin:0;
	z-index:5;
	opacity:0;
}
@keyframes slide-image {
    5% {
        opacity:0;
    }	
	6% {
        opacity:1;
    }
	95% {
        opacity:1;
    }
	96% {
        opacity:0;
    }
}
.slide.active .slide-image {
	animation:slide-image;
	animation-duration: 7.9s;
}
.hero-cycle .slide img {
	display:block;
	width:98%;
	margin:1%;
	height:auto;
	position:relative;
}
@keyframes slider-type-wipe {
    0% {
        transform:scaleX(1);
    }	
	15% {
        transform:scaleX(0);
    }
	75% {
        transform:scaleX(0);
    }
	100% {
        transform:scaleX(1);
    }
}
.hero-cycle .slide.active .row::after {
	top:0;
	left:auto;
	right:0;
	transform-origin:right;
	animation: slider-type-wipe;
	animation-delay: 0.7s;
	animation-duration: 6s;
}
.hero-cycle .slide.active .row:nth-child(3)::after {
	top:0;
	left:auto;
	right:0;
	transform-origin:right;
	animation: slider-type-wipe;
	animation-delay: 0.9s;
	animation-duration: 6s;
}
.hero-cycle .slide.active .row:nth-child(5)::after {
	top:0;
	left:auto;
	right:0;
	transform-origin:right;
	animation: slider-type-wipe;
	animation-delay:1.4s;
	animation-duration: 6s;
}
.hero-cycle .slide.active .row:nth-child(4)::after {
	top:0;
	left:0;
	transform-origin:left;	
	animation: slider-type-wipe;
	animation-delay: 1s;
	animation-duration: 6s;
}
.hero-cycle .slide.active .row:nth-child(2)::after {
	top:0;
	left:0;
	transform-origin:left;	
	animation: slider-type-wipe;
	animation-delay: 1.2s;
	animation-duration: 6s;
}
.hero-cycle .slide.active .row:nth-child(6)::after {
	top:0;
	left:0;
	transform-origin:left;	
	animation: slider-type-wipe;
	animation-delay: 1.6s;
	animation-duration: 6s;
}



/* SLIDE ONE */

.hero-cycle .slide#s1 .headline {
	left:8%;
}

.hero-cycle .slide#s1 .slide-image:nth-child(1)  {
	width:32%;
	right:2%;
	top:50%;
	transform:translateY(-50%);
}
.hero-cycle .slide#s1 .slide-image:nth-child(2) {
	width:24%;
	left:0;
	top:auto;
	bottom:10%;
	height:auto;
}
@media (max-width: 1023px) {
.hero-cycle .slide#s1 .slide-image:nth-child(1)  {
	width:46%;
	right:-4%;
	top:-1%;
	transform:none;
}
.hero-cycle .slide#s1 .slide-image:nth-child(2) {
	width:34%;
	left:0;
	top:auto;
	bottom:10%;
	height:auto;
}	
}
@media (max-width: 767px) {
.hero-cycle .slide#s1 .headline {
	left:4%;
}
.hero-cycle .slide#s1 .slide-image:nth-child(1)  {
	width:46%;
	right:-4%;
	top:-1%;
	transform:none;
}
.hero-cycle .slide#s1 .slide-image:nth-child(2) {
	width:40%;
	left:0;
	top:auto;
	bottom:9.3%;
	height:auto;
}	
}

/* SLIDE TWO */

.hero-cycle .slide#s2 .slide-background {
	background-color:#000;
}
.hero-cycle .slide#s2  .slide-image::after, .hero-cycle .slide#s2 .row::after {
	background-color:#000;
}
.hero-cycle .slide#s2 .headline {
	color:#fff;
	mix-blend-mode:screen;
}
.hero-cycle .slide#s2 .slide-image {
	width:22%;
	top:auto;
	left:7%;
	bottom:11%;
}
.hero-cycle .slide#s2 .slide-image:nth-child(2) {
	width:22%;
	left:auto;
	right:10%;
	bottom:auto;
	top:18%;
}
@media (max-width: 1023px) {
.hero-cycle .slide#s2 .slide-image {
	width:40%;
	top:auto;
	left:4%;
	bottom:14%;
}
.hero-cycle .slide#s2 .slide-image:nth-child(2) {
	width:32%;
	left:auto;
	right:1.5%;
	bottom:auto;
	top:9.5%;
}	
}
@media (max-width: 767px) {
.hero-cycle .slide#s2 .headline {
	top:60%;
}	
.hero-cycle .slide#s2 .slide-image {
	width:40%;
	top:auto;
	left:4%;
	bottom:10%;
}
.hero-cycle .slide#s2 .slide-image:nth-child(2) {
	width:44%;
	right:3.5%;
	bottom:auto;
	top:9.5%;
}	
}
/* SLIDE THREE */

.hero-cycle .slide#s3 .slide-image {
	width:30%;
	left:35%;
	top:50%;
	transform:translateY(-50%);
}
@media (max-width: 1023px) {
.hero-cycle .slide#s3 .slide-image {
	width:44%;
	left:28%;
}	
}
@media (max-width: 767px) {
.hero-cycle .slide#s3 .slide-image {
	top:50%;
	transform:translateY(-50%);
}
}
/* SLIDE FOUR */

.hero-cycle .slide#s4 .slide-image {
	width:24%;
	height:auto;
	left:auto;
	right:12%;
	top:28%;
}
.hero-cycle .slide#s4 .slide-background {
	background-color:#000;
}
.hero-cycle .slide#s4 .slide-image::after, .hero-cycle .slide#s4 .row::after {
	background-color:#000;
}
.hero-cycle .slide#s4 .headline {
	color:#fff;
	mix-blend-mode:screen;
}

@media (max-width: 1023px) {
.hero-cycle .slide#s4 .slide-image {
	width:60%;
	height:auto;
	left:auto;
	right:12%;
	top:28%;
}	
}

/* SLIDE FIVE */

.hero-cycle .slide#s5 .slide-image {
	width:33%;
	right:-1%;
	top:17.5%;
}
.hero-cycle .slide#s5 .video-clip {
    width: 30%;
    left: 0;
    bottom: 11%;
	margin:1%;
}
@media (max-width: 1023px) {
.hero-cycle .slide#s5 .slide-image {
	width:46%;
	right:-1%;
	top:17.5%;
}
.hero-cycle .slide#s5 .video-clip {
    width: 44%;
    left: 0;
    bottom: 11%;
	margin:1%;
}	
}
@media (max-width: 767px) {
.hero-cycle .slide#s5 .slide-image {
	top:14.5%;
}	
.hero-cycle .slide#s5 .video-clip {
    width: 44%;
    left: 2.5%;
    bottom: 20%;
}	
}
/* SLIDE SIX */

.hero-cycle .slide#s6 .slide-image {
	width:16%;
	left:4%;
	top:auto;
	bottom:16.4%;
}
.hero-cycle .slide#s6 .slide-image:nth-child(2){
	width:21%;
	right:2%;
	left:auto;
	top:12.4%;
}
.hero-cycle .slide#s6 .slide-image:nth-child(3){
	width:21%;
	left:50%;
	top:2%;
	transform:translateX(-50%);
}
.hero-cycle .slide#s6 .slide-image:nth-child(4){
	width:30%;
	right:21%;
	left:auto;
	top:auto;
	bottom:2%;
}
.hero-cycle .slide#s6 .slide-background {
	background-color:#000;
}
.hero-cycle .slide#s6 .slide-image::after, .hero-cycle .slide#s6 .row::after {
	background-color:#000;
}
.hero-cycle .slide#s6 .headline {
	color:#fff;
	mix-blend-mode:screen;
}
@media (max-width: 1023px) {
.hero-cycle .slide#s6 .slide-image {
	width:16%;
	left:4%;
	top:auto;
	bottom:16.4%;
}
.hero-cycle .slide#s6 .slide-image:nth-child(2){
	width:41%;
	right:4%;
	left:auto;
	top:12.4%;
}
.hero-cycle .slide#s6 .slide-image:nth-child(3){
	width:44%;
	left:50%;
	top:2%;
	transform:translateX(-50%);
}
.hero-cycle .slide#s6 .slide-image:nth-child(4){
	width:30%;
	right:21%;
	left:auto;
	top:auto;
	bottom:2%;
}
}
@media (max-width: 767px) {
.hero-cycle .slide#s6 .slide-image {
	width:32%;
	left:4%;
	top:auto;
	bottom:10%;
}
}

@media (max-width: 767px) {
.hero-cycle img, .hero-cycle img.portrait, .hero-cycle img.landscape {
	width:100%;
	height:auto;
}
}


.hero-shape {
	width:100%;
	height:100%;
	position:absolute;
	background: url("../img/shape-5.svg") no-repeat;
	background-size:contain;
	background-position: center;
	mix-blend-mode:hard-light;
	z-index:30;
	opacity:0.3;
}