/* HOME – HEADER */
.ken {width: 93%; left: 3.5%; margin-right: auto;  height: 625px; overflow: hidden; position: fixed; background-color: #FFF; border-radius: 55px; z-index: -5000; top: 100px; border: 0px solid red; display: grid;}
.ken.scrolled {opacity: 0;}
.ken .image {grid-row: 1; grid-column: 1; background-size: 120% auto; opacity: 0; background-repeat: no-repeat;}
.ken .text {grid-row: 1; grid-column: 1; z-index: 50; font-family: "Medium"; font-size: 56px; line-height: 130%; color: #FFF; opacity: 0; text-shadow: 0px 0px 10px rgba(0,0,0,1); align-self: end; margin-bottom: 50px; margin-left: 50px; max-width: 60%;}
.ken .image.count-0 {background-position: right center; animation: kenBGfadeOut22 15s; display: none; }
.ken .image.count-1 {background-position: right center; z-index: 10; animation: kenBG 15s infinite;  }
.ken .image.count-2 {background-position: left center; z-index: 7; animation: kenBG 15s infinite; animation-delay: 5s;}
.ken .image.count-3 {background-position: right top; z-index: 5; animation: kenBG 15s infinite; animation-delay: 10s;}
.ken .text.count-1 {animation: fadeText 15s infinite;}
.ken .text.count-2 {animation: fadeText 15s infinite; animation-delay: 5s; }
.ken .text.count-3 {animation: fadeText 15s infinite; animation-delay: 10s; }
.ken .messe {position: absolute; background-size: contain; background-repeat: no-repeat; background-position: center center; width: 300px; height: 300px; bottom: 125px; left: 100vw; z-index: 15; transition: left 1s; border-radius: 10px; filter: drop-shadow(0px 3px 3px rgba(0, 0, 0, 0.4));}
.ken .messe.slidein {left: calc(96.5vw - 450px);}

@keyframes kenBG {
	0% { background-size: 120% auto; opacity: 0; }
	25% { opacity: 1; }
	50% {background-size: 100% auto; opacity: 0;}
	100% {background-size: 100% auto; opacity: 0;}
}

@keyframes kenBGfadeOut {
	0% { background-size: 120% auto; opacity: 1; }
	25% { opacity: 1; }
	50% {background-size: 100% auto; opacity: 0;}
	100% {background-size: 100% auto; opacity: 0;}
}

@keyframes fadeText {
	0% { opacity: 0; }
	10% { opacity: 1;}
	25% { opacity: 1;}
	50% { opacity: 0; }
	100% {opacity: 0;}
}

@media only screen and (min-width: 1024px) and (max-width: 1400px) {
	.ken { height: 500px; }
	.ken .text {font-size: 50px; line-height: 130%; margin-bottom: 30px; }
	.ken .messe {width: 220px; height: 220px; bottom: 50px; }
	.ken .messe.slidein {left: calc(96.5vw - 300px);}
}

@media only screen and (min-width: 768px) and (max-width: 1023px) {
	.ken {height: 350px; border-radius: 30px; }
	.ken .text {font-size: 32px; margin-bottom: 30px; margin-left: 30px;}
	.ken .messe { width: 200px; height: 150px; }
	.ken .messe.slidein {left: calc(96.5vw - 250px);}
}

@media only screen and (max-width: 767px) {
	.ken .text {font-size: calc(100vw / 768 * 40); margin-bottom: 10px; margin-left: 15px; max-width: 80vw; text-shadow: 0px 0px 5px rgba(0,0,0,1);}
	.ken {border-radius: 10px;}
	.ken {height: 45vw; }
	.ken .messe { width: 25vw; height: 25vw; bottom: unset; top: 10px; }
	.ken .messe.slidein { left: calc(96.5vw - 10vw - 25vw);}
}