@font-face { font-family: 'Single Sleeve Regular'; src: local('Single Sleeve Regular'),url(sing_14l.woff) format('woff') }
@media  only screen and (orientation: portrait) {
body { transform: rotate(90deg) translateY(-100%); transform-origin:top left; height: 100vw; width: 100vh; overflow-x: hidden; position: absolute; top: 0px; left: 0px; }
}

html { height: 100%; -webkit-text-size-adjust: none; }
body { height: 100%; top: 0px; margin: 0px; padding: 0px; border: 0px; text-align: center; display: flex; align-items: center; flex-direction: column; font-family: 'Single Sleeve Regular', Arial, Helvetica; font-size:1.8rem; letter-spacing: 2px; font-display: swap; overflow:hidden; color: #fff; background-color: #000;}
a:link { color: #fff }
a:active,a:hover,a:visited { color: #dc0032 }
video { position: fixed; top: 48%; left: 50%; min-width: 100%; min-height: 100%; width: auto; -ms-transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); -webkit-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); object-fit: cover; z-index: 0; }

#Button {
    position: fixed;
    height: 10%;
    bottom: 1%;
    left: 0px;
    width: 6%;
    z-index: 2;
}

#box0,#boxU {
  	background-color: #000;
    text-align: center;
    z-index: 2;
}


#box0 {
	text-align:center;
	margin: 0px auto;
	color: white;
  position: absolute;
  width: 100%;
  height: 11%;
  top: 0px;
  left: 0px;
  font-family: 'Single Sleeve Regular', Arial, Helvetica;
	font-size:1vw;
}

#boxU {
    position: absolute;
    width: 100%;
    height: 12%;
    bottom: 0px;
    left: 0px;
}

#autostart,#knopf-weiter { z-index: 9; margin: 0px auto; }
#autostart:checked,#autostart:target,#autostart:visited+a:visited {
    opacity: 0;
    display: none;
    visibility: hidden
}

#content,#status { display: none; visibility: hidden; }
pre { display: flex; align-items: center; text-align:center; margin:0 auto; justify-content: center; font-size:3.2vw; padding:0, auto;font-family: 'Single Sleeve Regular', Arial, Helvetica; }
#knopf-weiter > a { position:absolute; font-size: 1.4vw; top: 80%; left: 80%; padding: 20px; white-space: nowrap;}

@media only screen and (max-width: 1090px)  {
pre { font-size:2.6vw; }

}

@media only screen and (max-width: 940px)  {
video {height:78%;right:0px; top:54%;}
#knopf-weiter > a { font-size: 2vw; }
#boxU { height: 11%; }

}

@media only screen and (max-height: 400px)  {
video {height:50%;}
#knopf-weiter > a { font-size: 2.3vw; }
#boxU { height: 10%; }

}

@media only screen and (max-width: 450px)  {
video {height:40%;top:76%;right:0px;min-height:auto;}
#knopf-weiter > a { font-size: 2.2vw; }
#boxU { height: 10%; }

}