#end_top,
#end_bottom,
#end_left,
#end_right,
#left_top,
#right_top,
#left_bottom,
#right_bottom,
#left_right,
#right_right,
#left_left,
#right_left,
#oben_top,
#oben_bottom,
#oben_right,
#oben_left,
#end_top_mobil,
#end_bottom_mobil,
#end_left_mobil,
#end_right_mobil,
#left_top_mobil,
#right_top_mobil,
#left_bottom_mobil,
#right_bottom_mobil,
#left_right_mobil,
#right_right_mobil,
#left_left_mobil,
#right_left_mobil,
#oben_top_mobil,
#oben_bottom_mobil,
#oben_left_mobil,
#oben_right_mobil,
#start_top_mobil,
#start_bottom_mobil,
#start_left_mobil,
#start_right_mobil,
#mini_right_mobil,
#mini_left_mobil
{
  display:none;
}

body:not(.goingtoanimate):not(.contentActive):not(.left):not(.right):not(.top):not(.bottom) #logo{
	transition:none !important;
}

#debug{background:#fff;color:#f00 !important;position:fixed;width:auto;max-width:100vw;top:50px;left:50px;z-index:99999999999999}
html,body{width:100vw;}
.mobil-main-cat{display:none;}
#top {
	position: absolute;
	width:100%;height:100%;
	transition:top .5s, bottom .5s, left .5s , right .5s;
	min-width: 1920px;
	min-height: 1080px;
	top:-680px;
	left:0px;
	/*cursor: pointer;*/
	overflow: hidden !important;
}
#bottom {
	position: absolute;
	width:100%;height:100%;
	transition:top .5s, bottom .5s, left .5s , right .5s;
	min-width: 1920px;
	min-height: 1080px;
	bottom:-620px;
	left:0px;
	/*cursor: pointer;*/
	overflow: hidden !important;
}
#left {
	position: absolute;
	width:100%;height:100%;
	transition:top .5s, bottom .5s, left .5s , right .5s;
	min-width: 1920px;
	min-height: 1080px;
	left: -1170px;
	top: -30px;/*top:calc(var(--YSCALE) * -45px);*/
	/*cursor: pointer;*/
	overflow: hidden !important;
}
#right {
	position: absolute;
	width:100%;height:100%;
	transition:top .5s, bottom .5s, left .5s , right .5s;
	min-width: 1920px;
	min-height: 1080px;
	left: 1170px;
	top: -30px;/*top:calc(var(--YSCALE) * -45px);*/
	/*cursor: pointer;*/
	overflow: hidden !important;
}
#cornertrigger > div {
	cursor: pointer;
	border-radius:3rem;
}
.contentActive #cornertrigger > div {
	transform-origin: center;
	transform: rotate(45deg) ;
}
body:not(.contentActive) .startcontainer::before {
	position: absolute;
	content: '';
	width: 100%;
	height: 100%;
	background: linear-gradient(37deg, rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0) 40%);
	/*background:#f00;*/
	z-index: 10;
	display: block;
	opacity:0;
	transition:opacity 0s;
}
body:not(.contentActive) #top.startcontainer::before {
	background: linear-gradient(37deg, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 20%);
}
body:not(.contentActive) #left.startcontainer::before {
	background: linear-gradient(37deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 50%);
}
body:not(.contentActive) #right.startcontainer::before {
	background: linear-gradient(37deg, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 30%);
}
body:not(.contentActive) #bottom.startcontainer::before {
	background: linear-gradient(37deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 50%);
}

body:not(.contentActive) #left:before{
	/*bottom: 35vh;
	left: 35vw;*/
}
body:not(.contentActive) #right:before{
	/*bottom: 35vh;
	left: 35vw;*/
}
body:not(.contentActive) #top:before{
	/*bottom: 35vh;
	left: 35vw;*/
}
body:not(.contentActive) #bottom:before{
	/*bottom: 35vh;
	left: 35vw;*/
}
body.left:not(.contentActive) #left:before{
	opacity:1;
	transition:opacity 1s;
	/*bottom: 0vh;
	left: 45vw;*/
}
body.right:not(.contentActive) #right:before{
	opacity:1;
	transition:opacity 1s;
	/*bottom: 0vh;
	left: 0vw;*/
}
body.top:not(.contentActive) #top:before{
	opacity:1;
	transition:opacity 1s;
	/*bottom: 0vh;
	left: 5vw;*/
}
body.bottom:not(.contentActive) #bottom:before{
	opacity:1;
	transition:opacity 1s;
	/*bottom: 50vh;
	left: 5vw;*/
}



body.hoverleft #left::before,
body.hoverright #right::before,
body.hoverbottom #botoom::before,
body.hovertop #top::before {
	/*position: absolute;
	content: '';
	width: 100%;
	height: 100%;
	background: linear-gradient(37deg, rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0) 50%);
	z-index: 10;
	display: block;*/
}
.startcontainer {
  min-height: 100vh;z-index:10000;
}
#top{
	/*background:var(--schwarz);*/
	-webkit-clip-path: url(#maskRectTop);
	clip-path: url(#maskRectTop);
	transform-origin: left center;
}
#bottom{
	/*background:var(--schwarz);*/
	-webkit-clip-path: url(#maskRectBottom);
	clip-path: url(#maskRectBottom);
	transform-origin: left center;
}
#left{
	/*background:var(--schwarz);*/
	-webkit-clip-path: url(#maskRectLeft);
	clip-path: url(#maskRectLeft);
	transform-origin: left center;
}
#right{
	/*background:var(--schwarz);*/
	-webkit-clip-path: url(#maskRectRight) ;
	clip-path: url(#maskRectRight) ;
}


#top img {
  width: 100vw;
}
#bottom img {
  width: 100vw;
}
#left img {
  width: 100vw;
}
#right img {
  width: 100vw;
}


/* Arrow block Position */
#BottomMask clipPath path{transform-origin: top center;transition:transform .5s;}
#TopMask clipPath path{transform-origin: bottom center;transition:transform .5s;}
#LeftMask clipPath path{transform-origin: top left;transition:transform .5s;}
#RightMask clipPath path{transform-origin: top left;transition:transform .5s;}

body.top #top{
	top: -480px;transition:top .5s, bottom .5s, left .5s , right .5s;
}
body.top #left{
	top:140px;transition:top .5s, bottom .5s, left .5s , right .5s;
}
body.top #right{
	top:140px;transition:top .5s, bottom .5s, left .5s , right .5s;
}
body.top #bottom{
	bottom:-810px;transition:top .5s, bottom .5s, left .5s , right .5s;
}
body.top #logo{
	margin-top:22vh;transition:all .5s;
}



body.bottom #top{
	top: -850px;transition:top .5s, bottom .5s, left .5s , right .5s;
}
body.bottom #left{
	top:-190px;transition:top .5s, bottom .5s, left .5s , right .5s;
}
body.bottom #right{
	top:-190px;transition:top .5s, bottom .5s, left .5s , right .5s;
}
body.bottom #bottom{
	bottom:-420px;transition:top .5s, bottom .5s, left .5s , right .5s;
}
body.bottom #logo{
	margin-top:-21vh;transition:all .5s;
}
#logo{
	cursor:pointer;
}


body.headerhover.bottom #logo{
	margin-top:-26vh;transition:all .5s;
}

body.headerhover.top #logo{
	margin-top:18vh;transition:all .5s;
}

/* werte als variablen und dann per media setzen */

body.left #top{
	left: 440px;transition:top .5s, bottom .5s, left .5s , right .5s;
}
body.left #left{
	left: -600px;transition:top .5s, bottom .5s, left .5s , right .5s;
}

body.left #right{
	left:1600px;transition:top .5s, bottom .5s, left .5s , right .5s;
}
body.left #bottom{
	left: 440px;transition:top .5s, bottom .5s, left .5s , right .5s;
}
body.left #logo{
	margin-left:31vw;transition:all .5s;
}




body.right #top{
	left: -440px;transition:top .5s, bottom .5s, left .5s , right .5s;
}
body.right #left{
	left:-1600px;transition:top .5s, bottom .5s, left .5s , right .5s;
}
body.right #right{
	left: 600px;transition:top .5s, bottom .5s, left .5s , right .5s;z-index: 999999999999999999;
}
body.right #bottom{
	left: -440px;transition:top .5s, bottom .5s, left .5s , right .5s;
}
body.right #logo{
	margin-left:-31vw;transition:all .5s;
}











/* Arrow block Content Container */

.startcontainer h1{color:var(--gelb);font-size: 68px;line-height: 100%;letter-spacing:-1px;max-width: 480px;font-family:FuturaBoldCondensedOblique;}
.videooverlay_mobil_bottom,
.videooverlay_mobil_top,
.videooverlay_mobil_right,
.videooverlay_mobil_left,
.startcontainer .videooverlay{color:var(--weiss);position:fixed;opacity:0;transition:opacity 1s;}
.startcontainer .videooverlay.show{opacity:1;transition:opacity 1s;}
.startcontainer video{width:100%;object-fit:cover;height:100%;background-size:cover;position:absolute;z-index:-1}

.videooverlay_mobil_bottom h1 br,
.videooverlay_mobil_top h1 br,
.videooverlay_mobil_right h1 br,
.videooverlay_mobil_left h1 br,
.startcontainer h1 br {
	height: 0px;
	line-height: 0px;
}
@media (min-width: 1px) {
	.videooverlay_mobil_bottom h1,
	.videooverlay_mobil_top h1,
	.videooverlay_mobil_right h1,
	.videooverlay_mobil_left h1 {
		color: var(--gelb);
		font-size: 68px;
		line-height: 100%;
		letter-spacing: -1px;
		max-width: 480px;
		font-family: FuturaBoldCondensedOblique;
	}
}

body{
	transition:background 1s;
}

/* CSS STEP 3 Open Content */
body.contentActive{
	background:var(--schwarz);pointer-events:none;
}
body.contentActive .startcontainer{
	
}
body.contentActive .content_container {
	pointer-events:all !important;
	z-index: 9999;
}
body.contentActive #header {
	pointer-events:all !important;
}
#cornertrigger{pointer-events:none;}
#top_trigger{background:var(--debug);pointer-events:all !important;position:fixed;top:0;left:20vw;width:60vw;height:35vh;z-index:9999;min-height:var(--header_height);}
#bottom_trigger{background:var(--debug);pointer-events:all !important;position:fixed;bottom: var(--header_height);left:20vw;width:60vw;height:35vh;z-index:9999;min-height:var(--header_height);}
#left_trigger{background:var(--debug);pointer-events:all !important;position:fixed;top:0vh;left:0;width:35vw;height:calc(100vh - var(--header_height));z-index:9999;min-width:var(--header_height);}
#right_trigger{background:var(--debug);pointer-events:all !important;position:fixed;top:0vh;right:0;width:35vw;height:calc(100vh - var(--header_height));z-index:9999;min-width:var(--header_height);}
/*
body:not(.left):not(.right):not(.top):not(.bottom):not(.contentActive) #top_trigger .triggeringleft {
	position: absolute;
	left: 0px;
	width: 50%;
	height: 50vh;
	background: var(--debug);
	transform: rotate(25deg);
	transform-origin: 166% -25% 0px;
}
body:not(.left):not(.right):not(.top):not(.bottom):not(.contentActive) #top_trigger .triggeringright {
	position: absolute;
	right: 0px;
	width: 50%;
	height: 50vh;
	background: var(--debug);
	transform: rotate(-25deg);
	transform-origin: -75% -75% 0px;
}

body:not(.left):not(.right):not(.top):not(.bottom):not(.contentActive) #bottom_trigger .triggeringleft {
	position: absolute;
	left: 0;
	width: 50%;
	height: 50vh;
	background: var(--debug);
	transform: rotate(65deg);
	transform-origin: 0% 40%;
}
body:not(.left):not(.right):not(.top):not(.bottom):not(.contentActive) #bottom_trigger .triggeringright {
	position: absolute;
	right: 0;
	width: 50%;
	height: 50vh;
	background: var(--debug);
	transform: rotate(25deg);
	transform-origin: 0% 180%;
}
body:not(.left):not(.right):not(.top):not(.bottom):not(.contentActive)  #right_trigger .triggeringleft {
	position: absolute;
	left: -10%;
	width: 25%;
	height: 25%;
	background: var(--debug);
	transform: rotate(45deg);
	transform-origin: 65% 50%;
	top: -10%;
	border-radius: 100%;
}
body:not(.left):not(.right):not(.top):not(.bottom):not(.contentActive) #left_trigger .triggeringright {
	position: absolute;
	right: -10%;
	width: 25%;
	height: 25%;
	background: var(--debug);
	transform: rotate(135deg);
	transform-origin: 50% 45% 0px;
	top: -10%;
	border-radius: 100%;
}*/
@media (min-width: 1px) {
	body:not(.left):not(.right):not(.top):not(.bottom):not(.contentActive) #cornertrigger {
		display: none;
	}

	body:not(.contentActive) .startcontainer {
		cursor: pointer;
	}
}
.contentActive #right_trigger {
	pointer-events: all !important;
	position: fixed;
	top: 45%;
	transform: translateY(-60%) rotate(45deg) !important;
	right: -7vw;
	width: 12vw;
	height: 13vw;
	z-index: 99999;
	min-width: var(--header_height);
}
.contentActive #top_trigger {
	pointer-events: all !important;
	position: fixed;
	top: -10vh;
	left: 45vw;
	width: 10vw;
	height: 10vw;
	z-index: 99999;
	min-height: var(--header_height);
}
.contentActive #left_trigger {
	pointer-events: all !important;
	position: fixed;
	top: 45%;
	transform: translateY(-60%) rotate(45deg) !important;
	left: -8vw;
	width: 12vw;
	height: 13vw;
	z-index: 99999;
	min-width: var(--header_height);
}
.contentActive #bottom_trigger {
	pointer-events: all !important;
	position: fixed;
	bottom: 0;
	left: 45vw;
	width: 10vw;
	height: 10vw;
	z-index: 99999;
	min-height: var(--header_height);
}
.contentActive.hoverbottom #bottom_trigger {
	width: 50vw;
	height: 50vw;
	left: 25vw;
	bottom: -25vh;

	width: 25vw;
	height: 15vw;
	left: 35vw;
	bottom: 15vh;
	transform: none;
}
.contentActive.hovertop #top_trigger {
	width: 50vw;
	height: 50vw;
	left: 25vw;
	top: -45vh;

	width: 30vw;
	height: 20vw;
	left: 35vw;
	top: 5vh;
	transform: none;
}
.contentActive.hoverright #right_trigger {
	width: 40vw;
	height: 40vw;
	top: 50%;
	transform: translateY(-60%) rotate(45deg) !important;
	right: -8vw;

	width: 25vw;
	height: 15vw;
	top: 50%;
	transform: translateY(-60%) rotate(0deg) !important;
	right: 5vw;
}
.contentActive.hoverleft #left_trigger {
	width: 40vw;
	height: 40vw;
	top: 50%;
	transform: translateY(-60%) rotate(45deg) !important;
	left: -8vw;

	width: 25vw;
	height: 15vw;
	top: 50%;
	transform: translateY(-60%) rotate(0deg) !important;
	left: 5vw;
}
.contentActive.hoverleft::after,
.contentActive.hoverright::after,
.contentActive.hovertop::after,
.contentActive.hoverbottom::after {
	content: '';
	width: 1000vw;
	height: 1000vh;
	background: var(--transparentoverlay);
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	z-index:9999;
	transition:all .5s;
}

.contentActive::after{
	content: '';
	width: 1000vw;
	height: 1000vh;
	background: transparent;
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	z-index:9999;
	transition:all .5s;
}

.left #top_trigger { left: 75vw; }
.left #bottom_trigger { left: 75vw; }
.left #left_trigger {
	width: 25vw;
	height: 35vh;
	bottom: var(--header_height);
	top: auto;
	left: 2vw;
}
.left #right_trigger {

	top: 60%;
	transform: translateY(-60%) rotate(45deg) !important;
	right: -45vh;
	width: 35vw;
	height: calc(40vh - var(--header_height));
}
.right #top_trigger{
	top: 0;
	left: 0vw;
	width: 30vw;
	height: 30vh;
}
.right #bottom_trigger{
	left: 0vw;
	width: 30vw;
	height: 30vh;
}
.right #left_trigger{
	top: 50%;
	transform: translateY(-60%) rotate(45deg) !important;
	left: -5vw;
	width: 15vw;
	height: calc(40vh - var(--header_height));
}
.right #right_trigger{
	width: 30vw;
	height: 35vh;
	bottom: var(--header_height);
	top: auto;
	right: 40vw;
}
.top #bottom_trigger{
	left: 35vw;
	width: 30vw;
	height: 15vh;
}
.top #left_trigger{
	top: 60vh;
	left: 0;
	width: 35vw;
	height: calc(40vh - var(--header_height));
}
.top #right_trigger{
	top: 60vh;
	right: 0;
	width: 35vw;
	height: calc(40vh - var(--header_height));
}
.top #top_trigger {
	width: 25vw;
	height: 35vh;
	top: 15vh;
	left: 2vw;
}
.bottom #bottom_trigger{
	width: 30vw;
	height: 35vh;
	bottom: var(--header_height);
	left: 2vw;
}
.bottom #top_trigger{
	height: 10vh;
	left: 35vw;
	width: 30vw;
}
.bottom #left_trigger{
	width: 35vw;
	height: calc(40vh - var(--header_height));
}
.bottom #right_trigger{
	height: calc(40vh - var(--header_height));
}

body.contentActive #logo{
	opacity:0;pointer-events:none;transition:opacity 1s;
}
.contentActive #top,
.contentActive #bottom,
.contentActive #left,
.contentActive #right{
	pointer-events:all;
}
.contentActive.buttonshow #top  {
  background:var(--gelb);
}
.contentActive.topactive #top  {
	background:var(--hellgrau);
}

.contentActive.buttonshow #bottom  {
  background:var(--gelb);
}
.contentActive.bottomactive #bottom {
	background:var(--hellgrau);
}

.contentActive.buttonshow #left {
  background:var(--gelb);
}
.contentActive.leftactive #left  {
	background:var(--hellgrau);
}
.contentActive.buttonshow #right{
  background:var(--gelb);
}
.contentActive.rightactive #right {
	background:var(--hellgrau);
}
.contentActive #right video ,
.contentActive.rightactive #right video {
	width: 250% !important;
	height: 250% !important;
}
.left #right video{
	width: 250% !important;
	height: 250% !important;
}
.contentActive.buttonshow #left video,
.contentActive.buttonshow #right video,
.contentActive.buttonshow #top video,
.contentActive.buttonshow #bottom video{
	/*display:none;*/opacity: 0;
	transition:opacity .5s;
}
.videooverlay button {
	white-space: nowrap !important;
}
.videooverlay button .ctapfeil{
	margin-left:.35rem;
}

.contentActive #left{
	left:-1800px;
}
.contentActive #right{
	left:1800px;
}
.contentActive #top{
	top:-1080px;
}
.contentActive #bottom {
	bottom: calc(-1020px + ((1080px - 100vh) * var(--YSCALE)) - var(--header_height));
	bottom: -960px;
}
.contentActive.hoverleftstate1 #left {
	/*left: -1650px;*/
}
.contentActive.hoverrightstate1 #right {
	/*left: 1650px;*/
}
.contentActive.hoverbottomstate1 #bottom {
	/*bottom: calc(-970px + ((1080px - 100vh) * var(--YSCALE)) - var(--header_height));
	bottom: -830px;*/
}
.contentActive.hovertopstate1 #top {
	/*top:-850px;*/
}

@media (min-height: 1080px){
	.contentActive #bottom {
		/*bottom: calc(-780px + ((1080px - 100vh) * var(--YSCALE)) - var(--header_height));
		bottom: -82%;*/
	}

	.contentActive.hoverbottomstate1 #bottom {
		/*bottom: calc(-720px + ((1080px - 100vh) * var(--YSCALE)) - var(--header_height));
		bottom: -76%;*/
	}
}

#holder {
	position: absolute;

	left: 0;
	width: 1920px;
	height: 1080px;
	max-width: 1920px;
	max-height: 1080px;

	left: calc((100vw - 1920px) / 2 );

	transform-origin: center;
	top: calc((100vh - 1130px) / 2);
	transition:margin-top .5s;
	overflow:hidden !important;
}
.videooverlay_mobil_bottom button, .videooverlay_mobil_top button, .videooverlay_mobil_right button, .videooverlay_mobil_left button,
.videooverlay button {
	padding-top: 0.5rem;
	padding-bottom: 0.5rem;
}
/* Video Content Overlay Block */
.start_play_button {
  height: 40px;
  position: fixed;
  max-width: 40px;
  z-index: 9999999999999999999;
  opacity:0;
  transition:opacity .5s;
  cursor:pointer;
	pointer-events:all !important;
}
.start_play_button img{
  height: 40px;
  max-width: 40px;
}
.sound-aus{display:none;}
.sound-an{display:block;}

.unmuted .sound-aus{display:none;}
.unmuted  .sound-an{display:block;}
.muted .sound-aus{display:block;}
.muted  .sound-an{display:none;}

.start_play_button.show {
  opacity:1;
  transition:opacity 2s;
}
.start_play_button.show:hover {
  opacity:1;
  transition:opacity 1s;
}
.bottom .start_play_button.show {
	top: 36vh;
}
.left .start_play_button.show {
	left: 69vw;
}

.inner_start_play_button {
	height: 20px;
	position: absolute;
	max-width: 20px;
	z-index: 9999999999999999999;
	opacity:1;
	transition:opacity 2s;
	cursor:pointer;
	top:.6rem;
	right:.6rem;
	top: calc(-30px + 0.6rem);
	right: calc(-10px + 0.6rem);
	border: 30px solid transparent;
}
.inner_start_play_button img{
	height: 20px;
	max-width: 20px;
}

#top .videooverlay {
  color: #fff;
  margin-left: 0;
  margin-top: 0rem;
  z-index: 9999;
	left: calc((10%) / var(--XSCALE) + 1.25rem);
	bottom: calc(10% / var(--YSCALE) + 33% + 3.5rem);
}
#bottom .videooverlay {
  color: #fff;
  margin-left: 0rem;
  margin-top: 0rem;
  z-index: 9999;
	left: calc((10%) / var(--XSCALE) + 1rem);
	bottom: calc((10%) / var(--YSCALE) + var(--header_height) - 0.5rem);
}
#left .videooverlay {
	color: #fff;
	margin-left: 0;
	margin-top: 0rem;
	z-index: 9999;
	left: calc((10%) / var(--XSCALE) + 1rem);
	bottom: calc((10%) / var(--YSCALE) + var(--header_height) - 0.5rem);
}
#right .videooverlay {
	color: #fff;
	margin-left: 0rem;
	margin-top: 0rem;
	z-index: 9999;
	left: calc((10%) / var(--XSCALE) - 1.5rem + 25%);
	bottom: calc((10%) / var(--YSCALE) + var(--header_height) - 0.5rem);
}

.start_play_button {
	left: calc(100vw - 3rem);
	top: 1rem;
	z-index:9999999;
}



/* hover */
body.contentActive.hoverright #right {
	left: 1080px;
}
body.contentActive.hoverright #right .videooverlay{
	opacity:1;right:15%;bottom:44%;left:auto;
}
body.contentActive.hoverright #right video {
	opacity: 1 !important;
	width: 100% !important;
	height: 100% !important;
}
body.contentActive.hoverleft #left {
	left: -1080px;
}
body.contentActive.hoverleft #left .videooverlay{
	opacity:1;left:10%;bottom:44%;
}
body.contentActive.hoverleft #left video {
	opacity: 1 !important;
}
body.contentActive.hovertop #top {
	top: -580px;
}
body.contentActive.hovertop #top .videooverlay{
	opacity:1;left:44%;
}
body.contentActive.hovertop #top video {
	opacity: 1 !important;
}
body.contentActive.hoverbottom #bottom {
	bottom:-520px;
}
body.contentActive.hoverbottom #bottom .videooverlay{
	opacity:1;left:40%;top:60%;width:25%;
}
body.contentActive.hovertop #top .videooverlay{
	top:20%;
}
body.contentActive.hoverbottom #bottom video {
	opacity: 1 !important;
}

@media (max-width:1280px){
	body.contentActive.hoverbottom #bottom .videooverlay{
		left: 45%;
	}
}

@media (min-width: 1px) and (max-width: 1380px){
	.startcontainer h1{font-size:48px;}
	body.contentActive.hovertop #top .videooverlay {
		top: 20%;
	}
	body.contentActive.hoverleft #left .videooverlay {
		opacity: 1;
		left: 15%;
		bottom: 40%;
		width: 18%;
	}
	body.contentActive.hoverright #right .videooverlay {
		opacity: 1;
		right: 10%;
		bottom: 45%;
		left: auto;
		width: 18%;
	}
}

/* Start Center Logo*/
#logo {
	position: fixed;
	left: calc(50vw - ( var(--logo_w) / 2 ) );
	top: calc(50vh - ( var(--logo_h) / 2 ) -  ( var(--header_height) / 2 ) );
	transition:all .5s;
	width:var(--logo_w);
	height:var(--logo_h);
}
.ipad #logo {
	position: fixed;
	left: calc(50vw - ( var(--logo_w) / 2 ) );
	top: calc(50vh - ( var(--logo_h) / 2 ) -  ( var(--header_height) * 1.5 / 2 ) );
	transition:all .5s;
	width:var(--logo_w);
	height:var(--logo_h);
}
#logo img{width:100%;}



.contentActive.bottomactive #bottom button ,
.contentActive.topactive #top button ,
.contentActive.leftactive #left button ,
.contentActive.rightactive #right button {
	visibility: hidden;
	opacity: 0;
	height: 1rem;
	padding: 0;
	margin: 0;
	overflow: hidden;
	position: relative;
	float: left;
}


.contentActive.bottomactive .videooverlay_mobil_bottom button ,
.contentActive.topactive .videooverlay_mobil_top button ,
.contentActive.leftactive .videooverlay_mobil_left button ,
.contentActive.rightactive .videooverlay_mobil_right button {
	visibility: hidden;
	opacity: 0;
}



html body.hoverright.contentActive.buttonshow #right{
	background:var(--schwarz);
}
html body.hoverleft.contentActive.buttonshow #left{
	background:var(--schwarz);
}
html body.hovertop.contentActive.buttonshow #top{
	background:var(--schwarz);
}
html body.hoverbottom.contentActive.buttonshow #bottom{
	background:var(--schwarz);
}


html body.hoverright .ebene1,
html body.hoverleft  .ebene1,
html body.hovertop  .ebene1,
html body.hoverbottom .ebene1 {
	pointer-events:none;
}



/* nur wenn relevant
.left #bottom video {
	width: 35vw;
	height: auto;
	position: absolute;
	left: 50%;
}

.left #top video {
	width: 35vw;
	height: auto;
	position: absolute;
	left: 50%;
	top: 75%;
}
.left #right video {
	width: 35vw !important;
	height: auto !important;
	position: absolute;
	left: 0%;
	top: 35%;
}
*/





@media (min-height:900px) and (max-width:1366px){
	/*#logo {
	  position: fixed;
	  left: calc(50vw - ( var(--logo_w) / 2 ) );
	  top: calc(50vh - ( var(--logo_h) / 2 ) -  ( var(--header_height) / 1 ) );
	  transition:all .5s;
	  width:var(--logo_w);
	  height:var(--logo_h);
	}*/
}

@media (min-height:900px) and (min-width:1367px){
	#logo {
	  position: fixed;
	  left: calc(50vw - ( var(--logo_w) / 2 ) );
	  top: calc(50vh - ( var(--logo_h) / 2 ) -  ( var(--header_height) / 1.5 ) );
	  transition:all .5s;
	  width:var(--logo_w);
	  height:var(--logo_h);
	}
}





/*
@media (max-height:980px) {
	.contentActive #bottom {
		bottom: -840px;
	}
	.contentActive.hoverbottomstate1 #bottom {
		bottom:-750px;
	}
}

@media (max-height:680px) {
	.contentActive #bottom {
		bottom: -740px;
	}
	.contentActive.hoverbottomstate1 #bottom {
		bottom:-690px;
	}
}*/



/*
@media (max-width:768px) and (max-height:980px) {
	.contentActive #bottom {
		bottom: -820px;
	}
	.contentActive #top {
		top: -860px;
	}

	.contentActive.hoverbottomstate1 #bottom {
		bottom:-670px;
	}
	.contentActive.hovertopstate1 #top {
		top:-810px;
	}
}*/
/*
@media (max-width:768px) and (max-height:680px) {
	.contentActive #bottom {
		bottom: -720px;
	}
	.contentActive #top {
		top: -840px;
	}
}*/

html body.contentActive.hoverright .content_container ,
html body.contentActive.hoverleft .content_container ,
html body.contentActive.hovertop .content_container ,
html body.contentActive.hoverbottom .content_container {
	pointer-events: none !important;
}
html body:not(.contentActive) #idle{display:none;}
@media (min-width: 1px){
	html body:not(.contentActive) #idle{
		display:block;
		position:fixed;
		top:0px;
		left:0px;
		background:transparent;
		width:100%;
		height:100%;
	}

	body:not(.contentActive):not(.top):not(.bottom) #top_trigger {
		height: 30vh;
		border-radius: 0rem 0rem 30rem 30rem !important;
	}
	body:not(.contentActive):not(.bottom):not(.top) #bottom_trigger {
		height: 30vh;
		border-radius: 30rem 30rem 0rem 0rem !important;
	}
	body:not(.contentActive):not(.left):not(.right):not(.top):not(.bottom) #left_trigger {
		width: 50vw;
		transform: rotate(45deg) scaleX(1);
		transform-origin: 30% -25%;
	}
	body:not(.contentActive):not(.left):not(.right):not(.top):not(.bottom)  #right_trigger {
		width: 50vw;
		transform: rotate(-45deg) scaleX(1);
		transform-origin: 70% -25%;
	}
	.videooverlay_mobil_top, .videooverlay_mobil_left, .videooverlay_mobil_right, .videooverlay_mobil_bottom {
		/*display: block;*/
	}
	.startcontainer .videooverlay{
		/*display:none;*/
	}
	body:not(.contentActive) .videooverlay_mobil_right ,
	body:not(.contentActive) .videooverlay_mobil_left ,
	body:not(.contentActive) .videooverlay_mobil_top ,
	body:not(.contentActive) .videooverlay_mobil_bottom {
		display:block;pointer-events:none;
		opacitiy:0;
		transition:opacity 0s;
		transition-delay:0s;
	}
	body:not(.contentActive).right .videooverlay_mobil_right ,
	body:not(.contentActive).left .videooverlay_mobil_left ,
	body:not(.contentActive).top .videooverlay_mobil_top ,
	body:not(.contentActive).bottom .videooverlay_mobil_bottom {

		transition:opacity .75s;
		transition-delay:.25s;
	}
	/* Home fix */
	body:not(.contentActive).left .videooverlay_mobil_left {
		display: block;
		opacity: 1;
		inset: inherit !important;
		z-index: 9999;
		bottom:calc(var(--header_height) + 3rem) !important;
		left:3rem !important;
	}
	body:not(.contentActive).left #left .videooverlay {
		visibility:hidden !important;
	}



	body:not(.contentActive).right .videooverlay_mobil_right {
		display: block;
		opacity: 1;
		inset: inherit !important;
		z-index: 9999;
		bottom:calc(var(--header_height) + 3rem) !important;
		left:calc(28vw + 2.8rem)!important;
		max-width:480px;
	}
	body:not(.contentActive).right #right .videooverlay {
		visibility:hidden !important;
	}



	body:not(.contentActive).top .videooverlay_mobil_top {
		display: block;
		opacity: 1;
		inset: inherit !important;
		z-index: 9999;
		bottom:calc((44vh) + 4rem) !important;
		left:3rem !important;
	}
	body:not(.contentActive).top #top .videooverlay {
		visibility:hidden !important;
	}



	body:not(.contentActive).bottom .videooverlay_mobil_bottom {
		display: block;
		opacity: 1;
		inset: inherit !important;
		z-index: 9999;
		bottom:calc(var(--header_height) + 3rem) !important;
		left:3rem !important;
	}
	body:not(.contentActive).bottom #bottom .videooverlay {
		visibility:hidden !important;
	}


}



@media (max-width:1480px) and (min-width: 1px){
	body:not(.contentActive):not(.top):not(.bottom) #top_trigger {
		height: 30vh;
		border-radius: 0rem 0rem 30rem 30rem !important;
	}
	body:not(.contentActive):not(.bottom):not(.top) #bottom_trigger {
		height: 30vh;
		border-radius: 30rem 30rem 0rem 0rem !important;
	}
	body:not(.contentActive):not(.left):not(.right):not(.top):not(.bottom) #left_trigger {
		width: 50vw;
		transform: rotate(45deg) scaleX(1);
		transform-origin: 0% -0%;
	}
	body:not(.contentActive):not(.left):not(.right):not(.top):not(.bottom)  #right_trigger {
		width: 50vw;
		transform: rotate(-45deg) scaleX(1);
		transform-origin: 100% -0%;
	}
	.left #top_trigger { left: 75vw; }
	.left #bottom_trigger { left: 75vw; }
	.left #left_trigger {
		width: 35vw;
		height: 55vh;
		bottom: calc(5vh + var(--header_height));
		top: auto;
		left: 2vw;
	}
	.left #right_trigger {
		top: 53%;
		transform: translateY(-60%) rotate(45deg) !important;
		right: -35vh;
		width: 35vw;
		height: calc(40vh - var(--header_height));
	}
	.right #top_trigger{
		top: 0;
		left: 0vw;
		width: 30vw;
		height: 30vh;
	}
	.right #bottom_trigger{
		left: 0vw;
		width: 30vw;
		height: 30vh;
	}
	.right #left_trigger{
		top: 50%;
		transform: translateY(-60%) rotate(45deg) !important;
		left: -5vw;
		width: 15vw;
		height: calc(40vh - var(--header_height));
	}
	.right #right_trigger{
		width: 55vw;
		height: 55vh;
		bottom: calc(5vh + var(--header_height));
		top: auto;
		right: 25vw;
	}
	.top #bottom_trigger{
		left: 35vw;
		width: 30vw;
		height: 15vh;
	}
	.top #left_trigger{
		top: 60vh;
		left: 0;
		width: 35vw;
		height: calc(40vh - var(--header_height));
	}
	.top #right_trigger{
		top: 60vh;
		right: 0;
		width: 35vw;
		height: calc(40vh - var(--header_height));
	}
	.top #top_trigger {
		width: 45vw;
		height: 50vh;
		top: 0vh;
		left: 3vw;
	}
	.bottom #bottom_trigger{
		width: 40vw;
		height: 45vh;
		bottom: var(--header_height);
		left: 2vw;
	}
	.bottom #top_trigger{
		height: 10vh;
		left: 35vw;
		width: 30vw;
	}
	.bottom #left_trigger{
		width: 35vw;
		height: calc(40vh - var(--header_height));
	}
	.bottom #right_trigger{
		height: calc(40vh - var(--header_height));
	}

}

.contentActive.activeMobileMenu #left {
	top: calc((-100vh + (100vh - var(--header_height))) / 2) !important;
}
.contentActive.activeMobileMenu #right {
	top: calc((-100vh + (100vh - var(--header_height))) / 2) !important;
}
@media (max-width: 1px) and (max-height:1080px) {
	body:not(.activeMobileMenu) #holder {
		top: calc(-1 * ((1080px - 100vh) / 2) );
	}
	body.nondesktop:not(.activeMobileMenu) #holder {
		top: calc(-1 * ((1080px - 100vh) / 2) - var(--header_height) / 2 );
	}
	body.nondesktop.activeMobileMenu #holder {
		top: calc(-1 * ((1080px - 100vh) / 2) - var(--header_height-base) / 2  );
	}
}

@media (max-width:1280px) {
	.contentActive #top_trigger {
		top: -9vh;
	}
	.contentActive #bottom_trigger {
		bottom: 5rem;
	}
	.contentActive.hovertop #top_trigger {
		top: 0vh;
	}
	.contentActive.hoverbottom #bottom_trigger {
		width: 50vw;
		height: 50vw;
		left: 25vw;
		bottom: 0;
	}
	.contentActive.hoverright #right_trigger {
		top: 50%;
		transform: translateY(-60%) rotate(0deg) !important;
	}
	.contentActive.hoverleft #left_trigger {
		top: 50%;
		transform: translateY(-60%) rotate(0deg) !important;
	}
	.contentActive.hoverbottom #bottom_trigger {
		bottom: -25%;
	}
}
@media (max-width:1180px) {
	.contentActive #top_trigger {
		top: -4vh;
	}

	.contentActive #bottom_trigger {
		bottom: 4rem;
	}
}
@media (max-width:1080px) {
	.contentActive #top_trigger {
		top: 0vh;
	}

	.contentActive #bottom_trigger {
		bottom: 3rem;
	}
}
@media (max-width:3px) {
	#logo {
		position: fixed;
		left: calc(50vw - (var(--logo_w) * 1));
		top: calc(50vh - (var(--logo_h) * 1) - var(--header_height) / 4); /* /3 */
		transition: all .5s;
		width: calc(var(--logo_w) * 2);
		height: calc(var(--logo_h) * 2);
	}
}



.videooverlay_mobil_top,
.videooverlay_mobil_left,
.videooverlay_mobil_right,
.videooverlay_mobil_bottom{
	display: none;
}
#left video {
	transform-origin: right;
}
#right video {
	transform-origin: left;
}
#top video {
	transform-origin: bottom;
}
#bottom video {
	transform-origin: top;
}


.left #right_trigger,
.left #top_trigger,
.left #bottom_trigger{
	display: none;
}
.top #right_trigger,
.top #left_trigger,
.top #bottom_trigger{
	display: none;
}
.right #left_trigger,
.right #top_trigger,
.right #bottom_trigger{
	display: none;
}
.bottom #right_trigger,
.bottom #top_trigger,
.bottom #left_trigger{
	display: none;
}

#holder > div{
	will-change:left,right,top,bottom;
	/*transform: translateZ(0);*/
}



@media (max-width: 1px){

	.hoverleft #right_trigger,
	.hoverleft #top_trigger,
	.hoverleft #bottom_trigger{
		display: none;
	}
	.hovertop #right_trigger,
	.hovertop #left_trigger,
	.hovertop #bottom_trigger{
		display: none;
	}
	.hoverright #left_trigger,
	.hoverright #top_trigger,
	.hoverright #bottom_trigger{
		display: none;
	}
	.hoverbottom #right_trigger,
	.hoverbottom #top_trigger,
	.hoverbottom #left_trigger{
		display: none;
	}

	.left #right_trigger,
	.left #top_trigger,
	.left #bottom_trigger{
		display: block;
	}
	.top #right_trigger,
	.top #left_trigger,
	.top #bottom_trigger{
		display: block;
	}
	.right #left_trigger,
	.right #top_trigger,
	.right #bottom_trigger{
		display: block;
	}
	.bottom #right_trigger,
	.bottom #top_trigger,
	.bottom #left_trigger{
		display: block;
	}
	html body:not(.contentActive) #idle{
		display:block;
		position:fixed;
		top:0px;
		left:0px;
		background:transparent;
		width:100%;
		height:100%;
		pointer-events:all !important;
	}
	html body.hoverleft #idle,
	html body.hovertop #idle,
	html body.hoverright #idle,
	html body.hoverbottom #idle{
		display:block;
		position:fixed;
		top:0px;
		left:0px;
		background:transparent;
		width:100%;
		height:100%;
		pointer-events:all !important;
	}

	.contentActive #holder #right,
	.contentActive #holder #left,
	.contentActive #holder #top,
	.contentActive #holder #bottom{
		display:none;
	}
	.contentActive.hoverright #holder #right,
	.contentActive.hoverleft #holder #left,
	.contentActive.hovertop #holder #top,
	.contentActive.hoverbottom #holder #bottom{
		display:block;
	}
	.contentActive.hoverrightstate1 #holder #right{
		display:block;left:1200px;
	}
	.contentActive.hoverleftstate1 #holder #left{
		display:block;left:-1200px;
	}
	.contentActive.hovertopstate1 #holder #top{
		display:block;top:-1200px;
	}
	.contentActive.hoverbottomstate1 #holder #bottom{
		display:block;bottom:-1200px;
	}
	.mobil-main-cat {
		display: none;
		margin-left: -2rem;
		margin-right: -2rem;
		margin-top: -5rem;
		margin-bottom:5rem;
		min-height: calc(100vh - var(--header_height));
		position: relative;
		z-index: 9999999999999999;
		overflow:hidden;
	}
	.mobil-main-cat * {
		max-width: 100%;
	}
	.mobil-main-cat video ,
	.mobil-main-cat .video {
		object-fit: cover;
		height: 100%;
		max-width: 100000px !important;
		width: 100%;
		position: absolute;
	}
	.mobil-main-cat h1 {
		position: absolute;
		bottom: 10rem;
		text-align: center;
		width: 100%;
		z-index: 999;
	}
	body.left,
	body.right,
	body.top,
	body.bottom{
		background:var(--grau);
	}
	#top,#left,#bottom,#tight{
		position: fixed;
	}
	#holder{
		min-height: 100vh;
	}
	body:not(.contentActive) #header .headerlogo{display:none;}
	/*#logo {
		position: fixed;
		left: calc(50vw - (var(--logo_w) * 1));
		top: calc(50vh - (var(--logo_h) * 1) - var(--header_height) / 3);
		transition: all .5s;
		width: calc(var(--logo_w) * 2);
		height: calc(var(--logo_h) * 2);
		pointer-events: all;
	}*/
	.nondesktop #logo {
		 top: calc(50vh - (var(--logo_h) * 1) - var(--header_height) / 1.25);
	 }
	.videooverlay_mobil_top{
		width: 55vw;z-index: 99999999999999999;pointer-events: all;
	}
	.videooverlay_mobil_left,
	.videooverlay_mobil_right{
		width: 60vw;z-index: 99999999999999999;pointer-events: all;
	}
	.videooverlay_mobil_bottom{
		width: 65vw;z-index: 99999999999999999;pointer-events: all;
	}
	#top .videooverlay {
		left: 45%;
		top: 50%;
	}

	#bottom .videooverlay {
		left: 45%;
		bottom: 40%;
	}

	#left .videooverlay {
		bottom: 50%;
		left: 40%;
		max-width: 50vw;
	}

	#right .videooverlay {
		right: 40%;
		bottom: 50%;
		max-width: 50vw;
		left:auto;
	}

	.startcontainer h1 {
		font-size: 1.5rem;
		line-height: 1.5rem;
	}

	clipPath path,
	#holder,
	#holder .videooverlay,
	#holder video,
	#holder .start_play_button {
		will-change: transform;
	}

	#holder  ,
	#holder .videooverlay ,
	#holder video {
		transform: none !important;
	}
	#LeftMask clipPath path {
		transform-origin: right top;
	}
	body.bottom #logo {
		margin-top: -15vh;
	}
	#top {
		top: calc( (-1 * 50%) - (var(--logo_h)) - (var(--header_height) / 2) - 0px);
	}

	#bottom {
		bottom: calc( (-1 * 50%) - var(--logo_h) + var(--header_height) / 3 );
	}

	#left {
		left: -1020px;
	}

	#right {
		left: 1020px;
	}
	.nondesktop #left {
		/*top: calc((840px - 100vh) / 2 + (-1 * var(--header_height)));*/
	}

	.nondesktop #right {
		/*top: calc((840px - 100vh) / 2 + (-1 * var(--header_height)));*/
	}

	body.right #right {
		left: 840px;
		left: 300px;
	}
	body:not(.contentActive).left .bigposleft:after{
		background:var(--grau);display:none;
	}
	body:not(.contentActive).right .bigposright:after{
		background:var(--grau);display:none;
	}
	body:not(.contentActive).top .bigpostop:after{
		background:var(--grau);display:none;
	}
	body:not(.contentActive).bottom .bigposbottom:after{
		background:var(--grau);display:none;
	}
	body.right #left,
	body.right #top,
	body.right #bottom {
		display:none
	}
	.right .start_play_button.show {
		right: 5vh;
		top: 5vh;
		left: auto;
	}
	body.right #left {
		left: -1150px;
	}

	body.right #bottom {
		left: -60px;

	}

	body.right #top {
		left: -60px;

	}

	body.left #right {
		left: 1150px;
	}

	body.left #left {
		left: -840px;
		left: -300px;
	}

	body.left #right,
	body.left #top,
	body.left #bottom {
		display:none
	}
	.left .start_play_button.show {
		right: 5vh;
		top: 5vh;
		left: auto;
	}

	body.left #bottom {
		left: 60px;

	}

	body.left #top {
		left: 60px;
	}
	body.top #left {
		top: 10%;
	}
	body.top #right {
		top: 10%;
	}
	body.top #logo {
		margin-top: 25vh;
	}
	body.top #bottom {
		bottom: calc( (-1 * 75%  * var(--YSCALE)) - (var(--logo_h)) - (var(--header_height) / 2) );
	}

	body.top #top {
		top: calc( (-1 * 30%) - (var(--logo_h)) - (var(--header_height) / 2) - 50px);
		top:0;
	}

	body.top #left,
	body.top #right,
	body.top #bottom {
		display:none
	}
	.top .start_play_button.show {
		right: 5vh;
		top: 5vh;
		left: auto;
	}
	body.bottom #right {
		top: -9%;
	}

	body.bottom #left {
		top: -9%;
	}

	body.bottom #top {
		top: -70%;
	}
	body.bottom #bottom {
		bottom: calc( (-1 * 30%) - (var(--logo_h)) - (var(--header_height) / 2) );
		bottom:2rem;
	}
	body.bottom #left,
	body.bottom #right,
	body.bottom #top {
		display:none
	}
	.bottom .start_play_button.show {
		right: 5vh;
		top: 5vh;
		left: auto;
	}

	.contentActive #left {
		left: -1320px;
	}
	.contentActive #right {
		left: 1320px;
	}
	.contentActive #bottom {
		bottom: calc( (-1 * 60%) - (var(--logo_h)) - (var(--header_height) / 2)  - 10px);
	}
	.contentActive #top {
		top: calc( (-1 * 65%) - (var(--logo_h)) - (var(--header_height) / 2) - 60px);
	}
	.contentActive.hoverbottomstate1 #bottom {
		bottom: calc( (-1 * 50%) - (var(--logo_h)) - (var(--header_height) / 2)  - 10px );
	}
	.contentActive.hovertopstate1 #top {
		top: calc( (-1 * 55%) - (var(--logo_h)) - (var(--header_height) / 2) - 60px);
	}
	body.right #logo {
		margin-left: -20vw;
	}

	body.left #logo {
		margin-left: 20vw;
		transition: all .5s;
	}
	body.top #logo {
		margin-top: 20vh;
	}
	body.bottom #logo {
		margin-top: -20vh;
	}

	#start_top,
	#start_bottom,
	#start_left,
	#start_right{
		display:none
	}

	#start_top_mobil,
	#start_bottom_mobil,
	#start_left_mobil,
	#start_right_mobil{
		display:block
	}

	#top_trigger{background:var(--debug);pointer-events:all !important;position:fixed;top:0;left:30vw;width:40vw;height:25vh;z-index:999999;min-height:var(--header_height);}
	#bottom_trigger{background:var(--debug);pointer-events:all !important;position:fixed;bottom: var(--header_height);left:30vw;width:40vw;height:20vh;z-index:999999;min-height:var(--header_height);}
	#left_trigger{background:var(--debug);pointer-events:all !important;position:fixed;top:20vh;left:0;width:15vw;height:calc(60vh - var(--header_height));z-index:999999;min-width:var(--header_height);}
	#right_trigger{background:var(--debug);pointer-events:all !important;position:fixed;top:20vh;right:0;width:15vw;height:calc(60vh - var(--header_height));z-index:999999;min-width:var(--header_height);}

	.right #left_trigger{

		top: 50%;
		transform: translateY(-60%) rotate(0deg) !important;
		left: 0;
		width: 15vw;
		min-width: 15vw;
		height: calc(40vh - var(--header_height));
	}
	.left #top_trigger {
		left: 30%;
		top: -20vh;
	}
	.right  #top_trigger {
		left: 30%;
		top: -20vh;
	}
	.left #right_trigger {
		top: 30%;
		right: -20vw;
		transform: translateY(0%) rotate(0deg) !important;
	}
	.top #right_trigger {
		top: 30%;
		right: -20vw;
		transform: translateY(0%) rotate(0deg) !important;
	}
	.top #left_trigger {
		top: 30%;
		left: -20vw;
		transform: translateY(0%) rotate(0deg) !important;
	}
	.bottom #right_trigger {
		top: 30%;
		right: -20vw;
		transform: translateY(0%) rotate(0deg) !important;
	}
	.bottom #left_trigger {
		top: 30%;
		left: -20vw;
		transform: translateY(0%) rotate(0deg) !important;
	}
	.left #bottom_trigger {
		left: 30%;
		bottom: 0vh;
		z-index: 0;
	}
	.right #bottom_trigger {
		left: 30%;
		bottom: 0vh;
		z-index: 0;
	}
	.top #bottom_trigger {
		left: 30%;
		bottom: 0vh;
		z-index: 0;
	}
	.left #left_trigger { width: 100vw; }
	.right #right_trigger {
		top: auto;
		transform: translateY(0%) rotate(0deg) !important;
		right: -0vh;
		width: 100vw;
		height: calc(35vh - var(--header_height));
		bottom: calc(var(--header_height));
	}
	.top #top_trigger {
		top: auto;
		left: 0vw;
		width: 100vw;
		height: 35vh;
		height: calc(35vh - var(--header_height));
		bottom: calc(var(--header_height));
	}
	.bottom #bottom_trigger {
		height: 35vh;
		top: auto;
		width: 100vw;
	}
	.bottom #left_trigger {

	}
	.bottom #right_trigger {

		width: 35vw;
	}
	.contentActive #left_trigger {

		top: 50%;
		transform: translateY(-60%) rotate(45deg) !important;
		left: -45vw;
		width: 45vw;
		height: 45vw;
	}
	.contentActive #right_trigger {

		top: 50%;
		transform: translateY(-60%) rotate(45deg) !important;
		right: -45vw;
		width: 45vw;
		height: 45vw;
	}
	.contentActive #top_trigger {
		top: -40vh;
		left: 33vw;
		width: 35vw;
		height: 35vw;
	}
	.contentActive #bottom_trigger {
		bottom: -16vh;
		left: 33vw;
		width: 35vw;
		height: 35vw;
	}
	.hoverleftstate1 div#left_trigger {
		top: 50%;
		transform: translateY(-60%)  scale(1.5) rotate(45deg) !important;
	}
	.hoverrightstate1 div#right_trigger {
		top: 50%;
		transform: translateY(-60%) scale(1.5) rotate(45deg) !important;
	}
	.hovertopstate1 div#top_trigger {
		transform: scale(1.5) rotate(45deg) !important;
	}
	.hoverbottomstate1 div#bottom_trigger {
		transform: scale(1.5) rotate(45deg) !important;
	}
	.contentActive.hoverrightstate1 #right {
		left: 1050px;
	}
	body.contentActive.hoverright #right {
		left: 880px;
	}
	.contentActive.hoverright #right_trigger {
		width: 100vw;
		height: 50vw;
		top: 60%;
		right: 0;
		transform: translateY(0%) rotate(0deg) scale(1) !important;
	}
	.contentActive.hoverleftstate1 #left {
		left: -1050px;
	}
	body.contentActive.hoverleft #left {
		left: -880px;
	}
	.contentActive.hoverleft #left_trigger {
		width: 100vw;
		height: 50vw;
		top: 60%;
		right: 0;
		left:0;
		transform: translateY(0%) rotate(0deg) scale(1) !important;
	}
	.contentActive.hoverbottom #bottom_trigger {
		width: 100vw;
		height: 50vw;
		top: 10vh;
		bottom:auto;
		right: 0;
		left: 0;
		transform: translateY(0%) rotate(0deg) scale(1) !important;
	}
	.contentActive.hovertop #top_trigger {
		width: 100vw;
		height: 50vw;
		top: auto;
		bottom:calc(var(--header_height) + 5vh);
		right: 0;
		left: 0;
		transform: translateY(0%) rotate(0deg) scale(1) !important;
	}
	body .bigholder {
		position: absolute;
		width: 100vw;
		height: calc(100vh - var(--header_height));
		background: transparent;
		overflow:hidden;
	}
	body.nondesktop .bigholder {
		position: absolute;
		width: 100vw;
		height: calc(100vh - (var(--header_height) * 2));
		background: transparent;
		overflow:hidden;
	}
	body.android.nondesktop .bigholder {
		height: calc(100vh - (var(--header_height) * 1));
	}

	.nondesktop .videoholder:not(.novideo)::after {
		top: calc(29vh - 2.5rem - var(--header_height));
		top:calc(50% - 2.5rem);
	}
	html body .opened .ebene1:not(.open) .videoholder:not(.novideo)::after {
		top: calc(29vh - 2.5rem - var(--header_height));
		top:calc(50% - 2.5rem);
	}
	html body.nondesktop .ebene1 h2.small, body.nondesktop .ebene1.open h2.small {
		bottom: calc(0rem + var(--header_height));
		/*left: calc(50% - 3.5rem);*/
	}



	/*body.contentActive.hoverleft #left {
		background:transparent;
		-webkit-clip-path: none;
		clip-path: none;
	}*/
	body.left #holder ,
	body.contentActive.hoverleftX #holder {
		background:rgba(0,0,0,.85);
	}
	/*body.contentActive.hoverleft #left video {
		-webkit-clip-path: url(#maskRectLeft);
		clip-path: url(#maskRectLeft);
		opacity: 1 !important;
	}*/
	body.left #left .videooverlay,
	body.contentActive.hoverleft #left .videooverlay {
		opacity: 0;
		left: 45%;
		top: 60%;
	}
	body.left .videooverlay_mobil_left,
	body.contentActive.hoverleft .videooverlay_mobil_left {
		display:block;
		opacity:1;
		margin-top: -5rem;
		margin-left: 0rem;
	}




	/*body.contentActive.hoverright #right {
		background:transparent;
		-webkit-clip-path: none;
		clip-path: none;
	}*/
	body.right #holder,
	body.contentActive.hoverrightX #holder {
		background:rgba(0,0,0,.85);
	}
	/*body.contentActive.hoverright #right video {
		-webkit-clip-path: url(#maskRectRight);
		clip-path: url(#maskRectRight);
		opacity: 1 !important;width:250% !important;height:250% !important;
	}*/

	body.right #right .videooverlay,
	body.contentActive.hoverright #right .videooverlay {
		opacity: 0;
		left: 45%;
		top: 60%;
		right:auto;
	}
	body.right .videooverlay_mobil_right ,
	body.contentActive.hoverright .videooverlay_mobil_right {
		display:block;opacity:1;margin-top: -5rem;
	}


	/*body.contentActive.hovertop #top {
		background:transparent;
		-webkit-clip-path: none;
		clip-path: none;
	}*/
	body.top #holder ,
	body.contentActive.hovertopX #holder {
		background:rgba(0,0,0,.85);
	}
	/*body.contentActive.hovertop #top video {
		-webkit-clip-path: url(#maskRectTop);
		clip-path: url(#maskRectTop);
		opacity: 1 !important;
	}*/
	body.top #top .videooverlay ,
	body.contentActive.hovertop #top .videooverlay {
		opacity: 0;
		left: 45%;
		top: 30%;
	}
	body.top .videooverlay_mobil_top ,
	body.contentActive.hovertop .videooverlay_mobil_top {
		display:block;opacity:1;
	}




	/*body.contentActive.hoverbottom #bottom {
		background:transparent;
		-webkit-clip-path: none;
		clip-path: none;
	}*/
	body.bottom #holder ,
	body.contentActive.hoverbottomX #holder {
		background:rgba(0,0,0,.85);
	}
	/*body.contentActive.hoverbottom #bottom video {
		-webkit-clip-path: url(#maskRectBottom);
		clip-path: url(#maskRectBottom);
		opacity: 1 !important;
	}*/
	body.bottom #bottom .videooverlay,
	body.contentActive.hoverbottom #bottom .videooverlay {
		opacity: 0;
		left: 45%;
		bottom: 30%;
	}
	body.bottom .videooverlay_mobil_bottom,
	body.contentActive.hoverbottom .videooverlay_mobil_bottom {
		display:block;opacity:1;margin-top: -20vh;
	}
	body.contentActive.hoverbottom #bottom {
		bottom: calc( (-1 * 33%) - (var(--logo_h)) - (var(--header_height) / 2) );
	}
	body.contentActive.hovertop #top {
		top: calc( (-1 * 33%) - (var(--logo_h)) - (var(--header_height) / 2) - 50px);
	}
	#bottom .videooverlay.show {
		max-width: 50vw;
	}
	#left .videooverlay.show {
		left: 41%;
	}
	.start_play_button {
		left: 85vw;
		top: 5vh;
	}

	.contentActive.activeMobileMenu #left {
		left: -1180px;
		top: calc((1080px - (100vh - var(--header_height))) / 2 + (-1 * var(--header_height)) - 190px);
	}

	.contentActive.activeMobileMenu #right {
		left: 1180px;
		top: calc((1080px - (100vh - var(--header_height))) / 2 + (-1 * var(--header_height)) - 190px);
	}

	.nondesktop.contentActive.activeMobileMenu #right {
		top: calc((1080px - (100vh - var(--header_height))) / 2 + (-1 * var(--header_height)) - 140px);
	}
	.nondesktop.contentActive.activeMobileMenu #left {
		top: calc((1080px - (100vh - var(--header_height))) / 2 + (-1 * var(--header_height)) - 140px);
	}


	.contentActive.activeMobileMenu #bottom {
		bottom: calc(-1 * 840px + var(--header_height));/*calc(-1 * (1080px * var(--YSCALE)) + ((90vh / var(--YSCALE)) - var(--header_height)));*/
	}
	.contentActive.activeMobileMenu #top {
		top: calc(-1 * (1080px * var(--YSCALE)) + ((80vh * var(--YSCALE)) - var(--header_height)));
	}
	.videorow .inner_start_play_button {
		top: 2rem;
		right: 3rem;

	}
	.videoholder:not(.novideo)::after {
		width: 100vw;
	}
	.videoholder::before {
		max-width: 100vw !important;
	}
	body.top:not(.contentActive)  .videooverlay_mobil_top,
	.contentActive.hovertop  .videooverlay_mobil_top{
		bottom: calc(var(--header_height) + 5vh) !important;
		left: 5vh !important;
		top: auto !important;
	}
	body.bottom:not(.contentActive)  .videooverlay_mobil_bottom,
	.contentActive.hoverbottom  .videooverlay_mobil_bottom{
		bottom: calc(var(--header_height) + 5vh) !important;
		left: 5vh !important;
		top: auto !important;
	}
	body.left:not(.contentActive)  .videooverlay_mobil_left,
	.contentActive.hoverleft  .videooverlay_mobil_left{
		bottom: calc(var(--header_height) + 5vh) !important;
		left: 5vh !important;
		top: auto !important;
		margin-left: 0% !important;
		inset:none !important;
	}
	body.right:not(.contentActive)  .videooverlay_mobil_right,
	.contentActive.hoverright  .videooverlay_mobil_right{
		bottom: calc(var(--header_height) + 5vh) !important;
		left: 5vh !important;
		top: auto !important;
		width: 65vw;
		inset:none !important;
	}

	.contentActive.hovertop .videooverlay_mobil_top {
		margin-left: 15%;
	}
	html body.contentActive.contentActive.hoverleft .videooverlay_mobil_left {
		margin-left: 25%;
	}
	html body.contentActive.contentActive.hoverbottom .videooverlay_mobil_bottom {
		bottom: calc(var(--header_height) + 55vh) !important;
		left: 5vh !important;
		top: auto !important;
		margin-left: 8% !important;
	}
	html body.nondesktop.contentActive.contentActive.hoverbottom .videooverlay_mobil_bottom {
		bottom: calc(var(--header_height) + 50vh) !important;
	}
}
@media (max-width:2px){
	.contentActive #top_trigger {
		top: -25vh;
	}
	.contentActive #bottom_trigger {
		bottom: -12vh;
	}
}



@media (min-width: 2360px){
	.startcontainer video {
		transform: none !important;
	}
}
@media (max-width: 2px){
	body.android #holder #left {
		top: -30px;
	}
	body.android  #holder  #right {
		top: -30px;
	}
}
@media (max-width: 2px){
	.sidebarfilteractive #cornertrigger{display:none;}
	.left #left_trigger {
		bottom: calc(1.5 * var(--header_height));
	}
	.right #right_trigger{
		bottom: calc(1.5 * var(--header_height));
	}
	.top  #top_trigger{
		bottom: calc(1.5 * var(--header_height));
	}
	.bottom #bottom_trigger{
		bottom: calc(1.5 * var(--header_height));
	}
	body .opened .ebene1:not(.open) .videoholder:not(.novideo)::after {
		height: 5rem;
		width: 5rem;
		border-radius: 100%;
		left: calc(50vw - 2.5rem);
		top: calc(50vw - 2.5rem);
	}
	body .videorow.opened .ebene1:not(.open) h2 {
		font-size: 2rem;
		margin-top: inherit;
	}
	.inner_start_play_button img {
		height: 40px;
		max-width: 40px;
		margin-top: -20px;
	}
	#holder button.hover {
		background: var(--gelb);
	}
	.sidebarfilteractive #holder {
		display: none;
	}
	.referenz-archivfirma .firmenentry {
		margin-bottom: 1rem;
	}
	.nondesktop #sortthema,.nondesktop #sortsparte {
		margin-left: .1rem;
	}
	.archivtitel span {
		font-size: 18px;
	}
	body.bottom:not(.contentActive) #logo,
	body.top:not(.contentActive) #logo,
	body.left:not(.contentActive) #logo,
	body.right:not(.contentActive) #logo
	{
		display: none;
	}
	.contentActive #left {
		left: -1120px;
	}
	.contentActive #right {
		left: 1120px;
	}
	.contentActive #left_trigger{
		top: 45%;
		left:-36vw;
		transform: translateY(-60%) rotate(45deg) !important;
	}
	.contentActive #right_trigger{
		top: 45%;
		right:-36vw;border-radius: 3rem;
		transform: translateY(-60%) rotate(45deg) !important;
	}


	/*#bottom.startcontainer video {
		background-position: center bottom !important;
		background-size: 50% !important;
	}*/
	#bottom.startcontainer video ,
	#top.startcontainer video {
		width: 100%;
		height: 100%;
		background-size: cover;
		position: absolute;
		z-index: -1;
		object-fit: cover;
		left: auto;
		right: auto;
		transform-origin: center center !important;
	}
	#left.startcontainer video  {
		transition: all .5s !important;
		width: calc(100% );
		height: 100%;
		background-size: cover;
		position: absolute;
		background-position: center center;
		background-size: cover;/*
		background-position: right center;*/
		z-index: -1;
		object-fit: cover;
		left: auto;
		right: 0;
		transform-origin: center center !important;
	}

	.left #left.startcontainer video  {
		left: auto;
		right: auto;
		transition: all .5s !important;
		width: calc(100% );
		transform-origin: center center !important;
	}
	body.contentActive.hoverleft #left.startcontainer video  {
		width: auto !important;
		height: 100%;
		background-size: cover;
		position: absolute;
		z-index: -1;
		object-fit: cover;
		left: auto;
		right: 0;
		transform-origin: center center !important;
	}
	#right.startcontainer video {
		width: 125%;
		height: 100%;
		background-size: cover;
		background-position: center center;
		background-size: cover;
		background-position:  left center;
		position: absolute;
		z-index: -1;
		object-fit: cover;
		left: 0;
		right: auto;
		width: calc(100% );
		transition: all .5s !important;
		transform-origin: center center !important;
	}

	.right #right.startcontainer video  {
		left: auto;
		right: auto;
		transition: all .5s !important;
		width: calc(100% );
		transform-origin: center center !important;
	}
	body.contentActive.hoverright #right.startcontainer video {
		width: 100vw !important;
		height: 100%;
		background-size: cover;
		position: absolute;
		z-index: -1;
		object-fit: cover;
		right: 0;
		transform-origin: center center !important;
		translate: translateX(50%) translateY(-50%);
	}
	.top #top.startcontainer video {
		background-position: center;
	}
	.bottom #bottom.startcontainer video {
		background-position: center;
	}

	body.contentActive.hoverbottom #bottom video {
		opacity: 1 !important;
		background-position: center;
		background-size: cover;
	}
	body.contentActive.hovertop #top video {
		opacity: 1 !important;
		background-position: center;
		background-size: cover;
	}
	body.contentActive.hoverleft #left video {
		opacity: 1 !important;
		background-position: right;
		background-size: contain !important;
	}
	body.contentActive.hoverright #right video {
		opacity: 1 !important;
		background-position: left;
		background-size: contain !important;
	}





	/* burjanko test */

	#bottom.startcontainer video, #top.startcontainer video {
		height: 100vh;
		background-size: cover;
		position: absolute;
		z-index: -1;
		object-fit: cover;
		right: auto;
		transform-origin: center center 0px !important;
		width: 100vw;
		left: 50%;
		/*translate: -50% 50%;
		-webkit-translate: -50% 50%;
		-moz-translate: -50% 50%;
		-ms-translate: -50% 50%;
		-o-translate: -50% 50%;*/
		transform: translateX(-50%) translateY(50%)!important;
		-webkit-transform: translateX(-50%) translateY(50%)!important;
		-moz-transform: translateX(-50%) translateY(50%)!important;
		-ms-transform:translateX(-50%) translateY(50%)!important;
		-o-transform: translateX(-50%) translateY(50%)!important;
		background-position: center;
	}

	#bottom.startcontainer video {
		top: -75vh;width: 100vw;height: 115vh;
		transition: all 0.5s ease 0s !important;
	}
	.bottom #bottom.startcontainer video {
		top: -40vh;width: 100vw;height: 115vh;
		transition: all 0.5s ease 0s !important;
	}
	#top.startcontainer video {
		bottom: 25vh;width: 100vw;height: 115vh;
		transition: all 0.5s ease 0s !important;
	}

	.top #top.startcontainer video {
		bottom:75vh;width: 100vw;height: 115vh;
		transition: all 0.5s ease 0s !important;
	}




	#left.startcontainer video, #right.startcontainer video {
		height: 100vh;
		background-size: cover;
		position: absolute;
		z-index: -1;
		object-fit: cover;
		right: auto;
		transform-origin: center center 0px !important;
		width: 100vw;
		left: auto;
		/*translate: 50% -50%;
		-webkit-translate: 50% -50%;
		-moz-translate: 50% -50%;
		-ms-translate: 50% -50%;
		-o-translate: 50% -50%;*/
		transform:translateX(50%) translateY(-50%)!important;
		-webkit-transform: translateX(50%) translateY(-50%)!important;
		-moz-transform:translateX(50%) translateY(-50%)!important;
		-ms-transform:translateX(50%) translateY(-50%)!important;
		-o-transform: translateX(50%) translateY(-50%)!important;
		background-position: center center;
		top: 65vh;
	}

	#left.startcontainer video {
		right: 25vw;width: 110vw;height: 100vh;
		transition: all 0.5s ease 0s !important;
	}
	.left #left.startcontainer video {
		width: 110vw;
		height: 100vh;
		transition: all 0.5s ease 0s !important;
		right: calc(50% - 300px);
	}
	#right.startcontainer video {
		left: -75vw;width: 110vw;height: 110vh;
		transition: all 0.5s ease 0s !important;
	}

	.right #right.startcontainer video {
		left: calc(0% + 200px);width: 120vw;height: 110vh;
		transition: all 0.5s ease 0s !important;
	}

}

@media (min-width: 3px) and (max-width: 2px) and (orientation: landscape)
{
	#left.startcontainer video, #right.startcontainer video {
		transform:translateX(50%) translateY(-20%)!important;
		-webkit-transform: translateX(50%) translateY(-20%)!important;
		-moz-transform:translateX(50%) translateY(-20%)!important;
		-ms-transform:translateX(50%) translateY(-20%)!important;
		-o-transform: translateX(50%) translateY(-20%)!important;
	}

}
@media (max-width:768px){
	/*.startcontainer video{background-image:none !important;}*/
	body #right,
	body #left,
	body #top,
	body #bottom
	{
		/*transition: top .3s ease-out 0s, bottom .3s ease-out 0s, left .3s ease-out 0s, right .3s ease-out 0s !important;*/

	}
	body #right video,
	body #left video,
	body #top video,
	body #bottom video
	{
		transition: all 0s !important;

	}
}
@media (max-width: 2px) and (max-height:580px){
	#left.startcontainer video, #right.startcontainer video {
		transform:translateX(50%) translateY(-20%)!important;
		-webkit-transform: translateX(50%) translateY(-20%)!important;
		-moz-transform:translateX(50%) translateY(-20%)!important;
		-ms-transform:translateX(50%) translateY(-20%)!important;
		-o-transform: translateX(50%) translateY(-20%)!important;
	}
}
@media (max-width: 1px) and (min-width: 540px) and (min-height:680px){
	.left #left.startcontainer video  {
		left: auto;
		right: 0vw;
		transition: all .5s !important;
		width: calc(250vw );
		transform-origin: center center !important;
	}

	.right #right.startcontainer video  {
		left: 0vw;
		right: auto;
		transition: all .5s !important;
		width: calc(250vw );
		transform-origin: center center !important;
	}
}
@media (max-width: 3px) {

	.contentActive #top_trigger {
		top: -10vh;
		left: 33vw;
		width: 35vw;
		height: 35vw;
	}
	.contentActive #bottom_trigger {
		bottom: 0vh;
		left: 33vw;
		width: 35vw;
		height: 35vw;
	}
	/*.bottom .start_play_button.show {
		left: 85vw;
		top: 70vh;
	}*/
	body.top:not(.contentActive)  .videooverlay_mobil_top,
	.contentActive.hovertop  .videooverlay_mobil_top{
		bottom: calc(var(--header_height) + 7vh) !important;
		left: 5vh !important;
		top: auto !important;
	}
	body.bottom:not(.contentActive)  .videooverlay_mobil_bottom,
	.contentActive.hoverbottom  .videooverlay_mobil_bottom{
		bottom: calc(var(--header_height) + 7vh) !important;
		left: 5vh !important;
		top: auto !important;
	}
	body.left:not(.contentActive)  .videooverlay_mobil_left,
	.contentActive.hoverleft  .videooverlay_mobil_left{
		bottom: calc(var(--header_height) + 7vh) !important;
		left: 5vh !important;
		top: auto !important;
		margin-left: 0% !important;
		inset:none !important;
	}
	body.right:not(.contentActive)  .videooverlay_mobil_right,
	.contentActive.hoverright  .videooverlay_mobil_right{
		bottom: calc(var(--header_height) + 7vh) !important;
		left: 5vh !important;
		top: auto !important;
		margin-left: 0% !important;
		inset:none !important;
	}
}
@media (max-width: 1px) and (max-height:880px) {
	.contentActive #top {
		top: calc((-1 * 65%) - (var(--logo_h)) - (var(--header_height) / 2) - 10px);
	}
}
@media (max-width: 1px) and (max-height:680px) {
	.contentActive #top {
		top: calc((-1 * 65%) - (var(--logo_h)) - (var(--header_height) / 2) - -10px);
	}
	.contentActive #bottom {
		bottom: calc( (-1 * 60%) - (var(--logo_h)) - (var(--header_height) / 2) - -10px);
	}
}

@media (max-width: 2px) and (max-height:680px){
	.activeMobileMenu #holder .videooverlay_mobil_left, .activeMobileMenu #holder .videooverlay_mobil_right, .activeMobileMenu #holder .videooverlay_mobil_bottom{
		margin-top:4rem;
	}
	.activeMobileMenu #holder .videooverlay_mobil_top{
		margin-top:2rem;
	}
	.contentActive.activeMobileMenu #left {
		left: -1160px;
		top: calc((1080px - (100vh - var(--header_height))) / 2 + (-1 * var(--header_height)) - 195px);
	}

	.contentActive.activeMobileMenu #right {
		left: 1160px;
		top: calc((1080px - (100vh - var(--header_height))) / 2 + (-1 * var(--header_height)) - 195px);
	}
	.contentActive #left {
		left: -1220px;
	}

	.contentActive #right {
		left: 1220px;
	}
	.contentActive.activeMobileMenu #bottom {
		bottom: calc(-1 * 810px + var(--header_height) - 50px);/*calc(-1 * (1080px * var(--YSCALE)) + ((145vh / var(--YSCALE)) - var(--header_height)));*/
	}
	.contentActive.activeMobileMenu #top {
		top: calc(-1 * (1080px * var(--YSCALE)) + ((70vh * var(--YSCALE)) - var(--header_height)) + 20px);
	}
	.contentActive #top {
		top: calc( (-1 * 65%) - (var(--logo_h)) - (var(--header_height) / 2) + 10px);
	}
	.contentActive #bottom {
		bottom: calc( (-1 * 60%) - (var(--logo_h)) - (var(--header_height) / 2) + 40px);
	}
}
@media (max-width: 2px) and (max-height:580px){
	.activeMobileMenu #holder .videooverlay_mobil_left, .activeMobileMenu #holder .videooverlay_mobil_right, .activeMobileMenu #holder .videooverlay_mobil_bottom{
		margin-top:8rem;
	}
	.activeMobileMenu #holder .videooverlay_mobil_top{
		margin-top:4rem;
	}

	.contentActive #left {
		left: -1160px;
	}

	.contentActive #right {
		left: 1160px;
	}
	.contentActive.activeMobileMenu #left {
		left: -1160px;
		top: calc((1080px - (100vh - var(--header_height))) / 2 + (-1 * var(--header_height)) - 245px);
	}

	.contentActive.activeMobileMenu #right {
		left: 1160px;
		top: calc((1080px - (100vh - var(--header_height))) / 2 + (-1 * var(--header_height)) - 245px);
	}
	.contentActive.activeMobileMenu #bottom {
		bottom: calc(-1 * 760px + var(--header_height) - 30px);/*calc(-1 * (1080px * var(--YSCALE)) + ((145vh / var(--YSCALE)) - var(--header_height)));*/
	}
	.contentActive.activeMobileMenu #top {
		top: calc(-1 * (1080px * var(--YSCALE)) + ((70vh * var(--YSCALE)) - var(--header_height)) + 20px);
	}
	.contentActive #top {
		top: calc( (-1 * 65%) - (var(--logo_h)) - (var(--header_height) / 2) - -40px);
	}
	.contentActive #bottom {
		bottom: calc( (-1 * 60%) - (var(--logo_h)) - (var(--header_height) / 2) - -20px);
	}
}
@media (max-width: 2px) and (min-height:681px){
	.activeMobileMenu #holder .videooverlay_mobil_left, .activeMobileMenu #holder .videooverlay_mobil_right{
		margin-top:1rem;
	}
	.activeMobileMenu #holder .videooverlay_mobil_top{
		margin-top:1rem;
	}
	.activeMobileMenu #holder .videooverlay_mobil_bottom{
		margin-top:2rem;
	}

	.contentActive #left {
		left: -1160px;
	}

	.contentActive #right {
		left: 1160px;
	}
	.contentActive.activeMobileMenu #left {
		left: -1160px;
		top: calc((1080px - (100vh - var(--header_height))) / 2 + (-1 * var(--header_height)) - 175px);
	}

	.contentActive.activeMobileMenu #right {
		left: 1160px;
		top: calc((1080px - (100vh - var(--header_height))) / 2 + (-1 * var(--header_height)) - 175px);
	}
	.contentActive.activeMobileMenu #bottom {
		bottom: calc(-1 * 860px + var(--header_height) - 80px);/*calc(-1 * (1080px * var(--YSCALE)) + ((145vh / var(--YSCALE)) - var(--header_height)));*/
	}
	.contentActive.activeMobileMenu #top {
		top: calc(-1 * (1080px * var(--YSCALE)) + ((70vh * var(--YSCALE)) - var(--header_height)) + 60px);
	}
	.contentActive #top {
		top: calc( (-1 * 65%) - (var(--logo_h)) - (var(--header_height) / 2) - 100px);
	}
	.contentActive #bottom {
		bottom: calc( (-1 * 60%) - (var(--logo_h)) - (var(--header_height) / 2) - 80px);
	}
}
@media (max-width: 2px) and (min-height:870px){
	.contentActive #left {
		left: -1240px;
	}
	.contentActive #right {
		left: 1240px;
	}
	.activeMobileMenu #holder .videooverlay_mobil_left, .activeMobileMenu #holder .videooverlay_mobil_right{
		margin-top:-5rem;
	}
	.activeMobileMenu #holder .videooverlay_mobil_top{
		margin-top:-4rem;
	}
	.activeMobileMenu #holder .videooverlay_mobil_bottom{
		margin-top:-2rem;
	}

	.contentActive #top {
		top: calc( (-1 * 65%) - (var(--logo_h)) - (var(--header_height) / 2) - 130px);
	}
	.contentActive #bottom {
		bottom: calc( (-1 * 60%) - (var(--logo_h)) - (var(--header_height) / 2) - 100px);
	}
	.contentActive.activeMobileMenu #left {
		left: -1160px;
		top: calc((1080px - (100vh - var(--header_height))) / 2 + (-1 * var(--header_height)) - 130px);
	}

	.contentActive.activeMobileMenu #right {
		left: 1160px;
		top: calc((1080px - (100vh - var(--header_height))) / 2 + (-1 * var(--header_height)) - 130px);
	}
	.contentActive.activeMobileMenu #bottom {
		bottom: calc(-1 * 960px + var(--header_height));/*calc(-1 * (1080px * var(--YSCALE)) + ((145vh / var(--YSCALE)) - var(--header_height)));*/
	}
	.contentActive.activeMobileMenu #top {
		top: calc(-1 * (1080px * var(--YSCALE)) + ((75vh * var(--YSCALE)) - var(--header_height)));
	}
}
@media (max-width: 2px) and (min-height:990px){
	.activeMobileMenu .videooverlay_mobil_left {
		left: 35% !important;
	}
	.activeMobileMenu .videooverlay_mobil_bottom {
		left: 43% !important;
	}
	.activeMobileMenu .videooverlay_mobil_top {
		left: 43% !important;
	}
	.activeMobileMenu #holder .videooverlay_mobil_left, .activeMobileMenu #holder .videooverlay_mobil_right {
		margin-top: -7rem;
	}
	.activeMobileMenu #holder .videooverlay_mobil_bottom {
		margin-top: -3rem;
	}
	.activeMobileMenu #holder .videooverlay_mobil_top {
		margin-top: -6rem;
	}
	.contentActive #left {
		left: -1260px;
	}
	.contentActive #right {
		left: 1260px;
	}
	.contentActive.activeMobileMenu #left {
		left: -1260px;
		top: calc((1080px - (100vh - var(--header_height))) / 2 + (-1 * var(--header_height)) - 50px);
	}

	.contentActive.activeMobileMenu #right {
		left: 1260px;
		top: calc((1080px - (100vh - var(--header_height))) / 2 + (-1 * var(--header_height)) - 50px);
	}
	.contentActive.activeMobileMenu #bottom {
		bottom: calc(-1 * 900px + var(--header_height));/*calc(-1 * (1080px * var(--YSCALE)) + ((145vh / var(--YSCALE)) - var(--header_height)));*/
	}
	.contentActive.activeMobileMenu #top {
		top: calc(-1 * (1080px * var(--YSCALE)) + ((70vh * var(--YSCALE)) - var(--header_height)));
	}
}

@media (max-height:480px){
	#top {
		top: calc( (-1 * 44%) - (var(--logo_h)) - (var(--header_height) / 2) - 50px);

	}

	#bottom {
		bottom: calc( (-1 * 50%) - var(--logo_h) + var(--header_height) / 99 );
	}

	#left {
		left: -1080px;
		top: calc((1140px - 100vh) / 0 + (-1 * var(--header_height)));
	}

	#right {
		left: 1080px;
		top: calc((1140px - 100vh) / 0 + (-1 * var(--header_height)));
	}
	#logo {
		position: fixed;
		left: calc(50vw - (var(--logo_w) * .5));
		top: calc(60vh - (var(--logo_h) * .5) - var(--header_height) / 1.5);
		transition: all .5s;
		width: calc(var(--logo_w) * 1);
		height: calc(var(--logo_h) * 1);
	}
	body.left #logo {
		margin-left: 15vw;
		transition: all .5s;
	}
	body.right #logo {
		margin-left: -15vw;
	}
	body.bottom #top {
		top: -60%;
	}
	body.bottom #left {
		top: 66vh;
	}
	body.bottom #right {
		 top: 66vh;
	 }
	body.bottom #logo {
		margin-top: -17vh;
	}

	body.top #bottom {
		bottom: calc( (-1 * 115% * var(--YSCALE)) - (var(--logo_h)) - (var(--header_height) / 2) );
	}
	body.top #left {
		top: 33%;
	}
	body.top #right {
		top: 33%;
	}
	body.top #top {
		top: calc( (-1 * 33%) - (var(--logo_h)) - (var(--header_height) / 2) - 50px);
	}


	.contentActive #top {
		top: calc( (-1 * 45%) - (var(--logo_h)) - (var(--header_height) / 2) - 50px);
	}
	.contentActive #bottom {
		bottom: calc( (-1 * 46%) - (var(--logo_h)) - (var(--header_height) / 2) );
	}
	.contentActive #left {
		left: -1220px;
	}
	.contentActive #right {
		left: 1220px;
	}

	.contentActive.hoverbottomstate1 #bottom {
		bottom: calc( (-1 * 45%) - (var(--logo_h)) - (var(--header_height) / 2) );
	}
	.contentActive.hoverleftstate1 #left {
		left: -1150px;
	}
	.contentActive.hoverrightstate1 #right {
		left: 1150px;
	}
	.contentActive.hovertopstate1 #top {
		top: calc( (-1 * 40%) - (var(--logo_h)) - (var(--header_height) / 2) - 50px);
	}

	.menu.mobil.active .menu_inner {
		height: calc(100vh - 80px);
	}
	.menu_inner a {
		line-height: 40px;
	}
	.menu_inner a img{
		height: 30px;
	}
}

@media (max-width: 3px){
	.contentActive #left {
		left: -1120px;
	}
	.contentActive #right {
		left: 1120px;
	}
}

@media (max-width: 3px) and (max-height:480px){
	.contentActive #left {
		left: -1110px;
		top: 0;
	}

	.contentActive #right {
		left: 1110px;
		top: 0;
	}
	.contentActive.activeMobileMenu #left {
		left: -1110px;
	}

	.contentActive.activeMobileMenu #right {
		left: 1110px;
	}
	.contentActive #top {
		top: calc( (-1 * 65%) - (var(--logo_h)) - (var(--header_height) / 2) - -80px);
	}
	.contentActive #bottom {
		bottom: calc( (-1 * 60%) - (var(--logo_h)) - (var(--header_height) / 2) - -60px);
	}
}
@media (max-width: 3px) and (max-height:680px){
	.contentActive #left {
		left: -1120px;
		/*top: 0;*/
	}
	.contentActive #right {
		left: 1120px;
		/*top: 0;*/
	}
	.contentActive.activeMobileMenu #left {
		left: -1120px;
	}

	.contentActive.activeMobileMenu #right {
		left: 1120px;
	}
	.contentActive #top {
		top: calc( (-1 * 65%) - (var(--logo_h)) - (var(--header_height) / 2) - -70px);
	}
	.contentActive #bottom {
		bottom: calc( (-1 * 60%) - (var(--logo_h)) - (var(--header_height) / 2) - -60px);
	}
	.activeMobileMenu #holder .videooverlay_mobil_left, .activeMobileMenu #holder .videooverlay_mobil_right{
		margin-top:5rem;
	}
	.activeMobileMenu #holder .videooverlay_mobil_top{
		margin-top:3rem;
	}
	.activeMobileMenu #holder .videooverlay_mobil_bottom{
		margin-top:6rem;
	}
	.nondesktop.activeMobileMenu #holder .videooverlay_mobil_left, .nondesktop.activeMobileMenu #holder .videooverlay_mobil_right{
		margin-top:2rem;
	}
	.nondesktop.activeMobileMenu #holder .videooverlay_mobil_bottom{
		margin-top:4rem;
	}
	.contentActive #top {
		top: calc( (-1 * 65%) - (var(--logo_h)) - (var(--header_height) / 2) - 30px);
	}
	.contentActive #bottom {
		bottom: calc( (-1 * 60%) - (var(--logo_h)) - (var(--header_height) / 2) - 10px);
	}

}
@media (max-width: 3px) and (min-height:681px){
	.contentActive.activeMobileMenu #left {
		left: -1120px;
	}
	.contentActive.activeMobileMenu #right {
		left: 1120px;
	}
	.contentActive #top {
		top: calc( (-1 * 65%) - (var(--logo_h)) - (var(--header_height) / 2) - 60px);
	}
	.contentActive #bottom {
		bottom: calc( (-1 * 60%) - (var(--logo_h)) - (var(--header_height) / 2) - 40px);
	}

}
@media (max-width: 3px) and (min-height:821px){
	.contentActive.activeMobileMenu #left {
		left: -1120px;
	}
	.contentActive.activeMobileMenu #right {
		left: 1120px;
	}
	.contentActive #top {
		top: calc( (-1 * 65%) - (var(--logo_h)) - (var(--header_height) / 2) - 120px);
	}
	.contentActive #bottom {
		bottom: calc( (-1 * 60%) - (var(--logo_h)) - (var(--header_height) / 2) - 100px);
	}
}

@media (max-width: 4px) and (max-height:620px){
	#top .videooverlay {
		top: 50%;
	}
}

/* iphone 13mini */
/* 375 x 629*/
@media (max-width:380px) and (min-width:370px) and (min-height:620px) and (max-height:635px){
	.nondesktop #left {
		top: calc((840px - 100vh) / 2 + (-1 * var(--header_height)) - 18px);
	}

	.nondesktop #right {
		top: calc((840px - 100vh) / 2 + (-1 * var(--header_height)) - 18px);
	}
	body.activeMobileMenu .miniholder h1 {
		font-size: 16px;
	}
}






.activeMobileMenu .start_play_button {
	display: none;
}
@media (max-width: 4px){

	body.left:not(.contentActive)  .videooverlay_mobil_left,
	.contentActive.hoverleft  .videooverlay_mobil_left{
	/*	top:60% !important;
		left: 45% !important;*/
		/*margin-left: 0% !important;
		inset:none !important;*/
	}
	body.right:not(.contentActive)  .videooverlay_mobil_right,
	.contentActive.hoverright  .videooverlay_mobil_right{
		/*top:60% !important;
		left: 45% !important;*/
		/*margin-left: 0% !important;
		inset:none !important;*/
	}
	body.bottom:not(.contentActive)  .videooverlay_mobil_bottom,
	.contentActive.hoverbottom  .videooverlay_mobil_bottom{
		/*top: 45% !important;
		inset: none !important;
		left: 45% !important;*/
	}
	body.top:not(.contentActive)  .videooverlay_mobil_top,
	.contentActive.hovertop  .videooverlay_mobil_top{
		/*top: 40% !important;
		inset: none !important;
		left: 45% !important;*/
	}
}



/* ----------- iPad Pro ----------- */
/* Portrait and Landscape */

@media only screen
and (min-width: 1024px)
and (max-width: 1034px)
and (max-height: 1366px)
and (-webkit-min-device-pixel-ratio: 1.5) {

	body.contentActive.hoverbottom #bottom .videooverlay {
		left: 45%;
	}
	.bigpostop{transform:none;transform-origin: top center 0px;}
	.bigposbottom{transform:none;transform-origin: bottom center 0px;}
	.bigposleft{transform:none;transform-origin: left center 0px;}
	.bigposright{transform:none;transform-origin: right center 0px;}
	/*body #top::before ,
	body #top::after {display:none !important}

	clipPath,
	clipPath path,
	#holder,
	#holder .videooverlay,
	#holder video,
	#holder .start_play_button ,
	#holder  ,
	#holder .videooverlay ,
	#holder video {
	will-change: transform;
	transform: translateZ(0) !important;
	}*/

	.sidebar *,
	.ebene1 *{
		-ms-hyphens: auto; /* ab IE10 */
		-moz-hyphens: auto; /* seit Firefox 6 */
		-webkit-hyphens: auto; /* seit Safari 5.1 (OS X), Safari 4.1 (iOS) */
		hyphens: auto;
	}
	 #right div ,
	 #top div ,
	 #left div ,
	 #bottom div {
		display:none;
	}
	.contentActive #top {
		top: -950px;
	}
	.contentActive #bottom {
		bottom: -840px;
	}
	.videooverlay_mobil_top{
		width: 50vw;z-index: 99999999999999999;pointer-events: all;
	}
	.videooverlay_mobil_left,
	.videooverlay_mobil_right,
	.videooverlay_mobil_bottom{
		width: 60vw;z-index: 99999999999999999;pointer-events: all;
	}
	body.contentActive.hoverleft .videooverlay_mobil_left {
		display:block;
		opacity:1;
		margin-top: -5rem;
		margin-left: 0rem;
	}


	body.contentActive.hoverright .videooverlay_mobil_right {
		display:block;opacity:1;margin-top: -5rem;
	}
	body.contentActive.hovertop .videooverlay_mobil_top {
		display:block;opacity:1;
	}
	body.contentActive.hoverbottom .videooverlay_mobil_bottom {
		display:block;opacity:1;margin-top: -20vh;
	}
	html body:not(.left):not(.right):not(.top):not(.bottom):not(.contentActive) .startcontainer{pointer-events:all !important;}
}

/* Portrait */
@media only screen
and (min-width: 1023px)
and (max-width: 1033px)
and (max-height: 1367px)
and (orientation: portrait) {

	html body.right:not(.contentActive) .videooverlay_mobil_right, html body.contentActive.hoverright .videooverlay_mobil_right {
		left: 37vh !important;
	}
	html body .row.inner > .col-md-6:not(.rightcontent){width:100%}
	html body .row.inner > .col-md-6.rightcontent{width:100%}
	html body .referenz-archiv_item_full .row.inner > .col-md-6:not(.rightcontent){width:100%}
	html body .referenz-archiv_item_full .row.inner > .col-md-6.rightcontent{width:100%;padding-right:0;}
	:root{
		--logo_w: 20vw;
		--logo_h: 13.54vw;
	}
	.top #top_trigger {
		width: 50vw;
	}
	.bottom #bottom_trigger{
		width: 50vw;
	}
	.right #right_trigger {
		width: 50vw;
		height: 55vh;
		bottom: var(--header_height);
		top: auto;
		right: 0vw;
	}
	html body.right:not(.contentActive) .videooverlay_mobil_right, .contentActive.hoverright .videooverlay_mobil_right {
		left: 35vh !important;
	}
	html body:not(.contentActive).bottom .videooverlay_mobil_bottom {
		bottom: calc(var(--header_height) + 10rem) !important;
		left: 8rem !important;
	}
	html body.contentActive #top_trigger {
		top: -5vh;
	}
	html body.contentActive #right_trigger {
		top: 47%;
		width: 15vw;
		height: 15vw;
	}
	html body:not(.left):not(.right):not(.top):not(.bottom):not(.contentActive) .startcontainer{pointer-events:all !important;}
	.contentActive #top {
		top: calc( (-1 * 65%) - (var(--logo_h)) - (var(--header_height) / 2) - 80px);
	}

	.contentActive #bottom {
		bottom: calc( (-1 * 60%) - (var(--logo_h)) - (var(--header_height) / 2) - 100px);
	}
	#logo {
		top: calc(50vh - (var(--logo_h) * 1) - var(--header_height) * 0);
	}
	.contentActive #left_trigger{
		top: 50%;
		transform: translateY(-60%) rotate(45deg) !important;
	}
	.contentActive #right_trigger{
		top: 50%;
		transform: translateY(-60%) rotate(45deg) !important;
	}

	.contentActive #top {
		top: -1350px;
	}

	.contentActive #bottom {
		bottom: -1320px;
	}
	body .page-link.menusuchetrigger.showmenusearch {
		width: 12rem;
	}
	html body .page-link.menusuchetrigger.showmenusearch form input {
		margin-left: 1rem;
		width: calc(70%);
		overflow: visible;
		transition: all 0.5s;
		opacity: 1;
		pointer-events: all;
	}
}

/* Landscape */
@media only screen
and (min-width: 1024px)
and (max-height: 1366px)
and (orientation: landscape)
and (-webkit-min-device-pixel-ratio: 1.5) {

}
@media only screen
and (min-width: 1354px)
and (max-width: 1368px)
and (max-height: 1024px)
and (orientation: landscape) {
	#right div ,
	#top div ,
	#left div ,
	#bottom div {
		display:none;
	}
	body.contentActive.hoverleft .videooverlay_mobil_left {
		display:block;opacity:1;
		z-index: 9999999999;
	}
	body.contentActive.hoverright .videooverlay_mobil_right {
		display:block;opacity:1;
		z-index: 9999999999;
	}
	body.contentActive.hovertop .videooverlay_mobil_top {
		display:block;opacity:1;
		z-index: 9999999999;
	}
	body.contentActive.hoverbottom .videooverlay_mobil_bottom {
		display:block;opacity:1;
		z-index: 9999999999;
	}
}



/* ----------- iPad  ----------- */
/* Portrait and Landscape */
@media only screen
and (min-width: 1024px)
and (max-width: 1034px)
and (max-height: 769px)
and (orientation: landscape)
 {

	html body.top:not(.contentActive) .videooverlay_mobil_top, html body.contentActive.hovertop .videooverlay_mobil_top {
		bottom: calc(var(--header_height) + 50vh) !important;
	}
	html body .videoholder:not(.novideo):after {
		left: calc(50% - 2.5rem);
	}
	/*body #top::before ,
	body #top::after {display:none !important}

	clipPath,
	clipPath path,
	#holder,
	#holder .videooverlay,
	#holder video,
	#holder .start_play_button ,
	#holder  ,
	#holder .videooverlay ,
	#holder video {
	will-change: transform;
	transform: translateZ(0) !important;
	}*/
	body .page-link.menusuchetrigger.showmenusearch {
		width: 12rem;
	}
	html body .page-link.menusuchetrigger.showmenusearch form input {
		margin-left: 1rem;
		width: calc(70%);
		overflow: visible;
		transition: all 0.5s;
		opacity: 1;
		pointer-events: all;
	}
	.sidebar *,
	.ebene1 *{
		-ms-hyphens: auto; /* ab IE10 */
		-moz-hyphens: auto; /* seit Firefox 6 */
		-webkit-hyphens: auto; /* seit Safari 5.1 (OS X), Safari 4.1 (iOS) */
		hyphens: auto;
	}
	#right div ,
	#top div ,
	#left div ,
	#bottom div {
		display:none;
	}
	.contentActive #top {
		top: -950px;
	}
	.contentActive #bottom {
		bottom: -950px;
	}
	.videooverlay_mobil_top{
		width: 50vw;z-index: 99999999999999999;pointer-events: all;
	}
	.videooverlay_mobil_left,
	.videooverlay_mobil_right,
	.videooverlay_mobil_bottom{
		width: 60vw;z-index: 99999999999999999;pointer-events: all;
	}
	body.contentActive.hoverleft .videooverlay_mobil_left {
		display:block;
		opacity:1;
		margin-top: -5rem;
		margin-left: 0rem;
	}
	.contentActive #top {
		top: calc( (-1 * 65%) - (var(--logo_h)) - (var(--header_height) / 2) - 280px);
	}

	.contentActive #bottom {
		bottom: calc( (-1 * 60%) - (var(--logo_h)) - (var(--header_height) / 2) - 300px);
	}

	body.contentActive.hoverright .videooverlay_mobil_right {
		display:block;opacity:1;margin-top: -5rem;
	}
	body.contentActive.hovertop .videooverlay_mobil_top {
		display:block;opacity:1;
	}
	body.contentActive.hoverbottom .videooverlay_mobil_bottom {
		display:block;opacity:1;margin-top: -20vh;
	}
	html body:not(.left):not(.right):not(.top):not(.bottom):not(.contentActive) .startcontainer{pointer-events:all !important;}
}

/* Portrait */
@media only screen
and (min-width: 767px)
and (max-width: 777px)
and (max-height: 1025px)
and (orientation: portrait) {
	html body .videoholder:not(.novideo):after {
		left: calc(50% - 2.5rem);
	}
	html body:not(.left):not(.right):not(.top):not(.bottom):not(.contentActive) .startcontainer{pointer-events:all !important;}
	.contentActive #top {
		top: calc( (-1 * 65%) - (var(--logo_h)) - (var(--header_height) / 2) - 80px);
	}

	.contentActive #bottom {
		bottom: calc( (-1 * 60%) - (var(--logo_h)) - (var(--header_height) / 2) - 100px);
	}
	html body.right:not(.contentActive) .videooverlay_mobil_right, .contentActive.hoverright .videooverlay_mobil_right {
		left: 45vh !important;
		inset: none !important;
	}
	.contentActive #left_trigger{
		top: 50%;
		transform: translateY(-60%) rotate(45deg) !important;
	}
	.contentActive #right_trigger{
		top: 50%;
		transform: translateY(-60%) rotate(45deg) !important;
	}

	.contentActive #top {
		top: -1220px;
	}
	.contentActive #right {
		left: 1660px;
	}
	.contentActive #left {
		 left: -1660px;
	 }
	.contentActive #bottom {
		bottom: -1220px;
	}
}











body:not(.contentActive):not(.right):not(.hoverright) #right .videooverlay{display:none;}
body:not(.contentActive):not(.left):not(.hoverleft) #left .videooverlay{display:none;}
body:not(.contentActive):not(.top):not(.hovertop) #top .videooverlay{display:none;}
body:not(.contentActive):not(.bottom):not(.hoverbottom) #bottom .videooverlay{display:none;}

.ipad #left video ,
.ipad #right video {
	width: auto !important;
	height:1080px !important;
}
.ipad #top video ,
.ipad #bottom video {
	width: 2420px !important;
	height:auto !important;
	margin:auto !important;
	left:auto !important;
	right:-250px !important;
}

.ipad #left,
.ipad #right,
.ipad #bottom,
.ipad #top{
	transform-origin: center;
}

body.ipad #top {overflow:hidden;}
body.ipad #top  {
	clip-path: url("#maskRectTop") !important;
	-webkit-clip-path: url("#maskRectTop") !important;
}
body.ipad #top video {
	position: absolute !important;
	bottom: 0  !important;
	top: auto !important;
	transform-origin: bottom !important;
}
body.ipad.hovertop #top * {display:none !important;}
body.ipad.hovertop #top video {display:block !important;}
.ipad.hovertop .videooverlay_mobil_top h1{
	font-size:48px;
}
.ipad.hovertop .videooverlay_mobil_top {
	display: block !important;
	opacity: 1 !important;
	z-index: 999999999999;
	width: 30vw;
}

.ipad.contentActive.topactive .videooverlay_mobil_top button {
	display: none;
}





















@media (max-width:1180px) and (min-width: 768px){

	html body.contentActive:not(.hoverleft):not(.hoverbottom):not(.hovertop):not(.hoverright) #left{
		left:-9999px;
	}
	html body.contentActive:not(.hoverleft):not(.hoverbottom):not(.hovertop):not(.hoverright) #right{
		left:9999px;
	}
	html body.contentActive:not(.hoverleft):not(.hoverbottom):not(.hovertop):not(.hoverright) #top{
		top:-9999px;
	}
	html body.contentActive:not(.hoverleft):not(.hoverbottom):not(.hovertop):not(.hoverright) #bottom{
		bottom:-9999px;
	}
}