@media  only screen and (orientation: portrait) {
.rotate { position:absolute	; bottom:0px !important; right:0px; width:50% !important; height: 20% !important; object-fit: fill; margin:0px; padding:0px;}

body { transform: rotate(90deg) translateY(-100%); transform-origin:top left; height: 100vw; width: 100vh; overflow-x: hidden; position: absolute; top: 0px; left: 0px; background-image: url("Gifs/Musicback2R.jpg") !important;
	background-position: 50% 50%;
  background-repeat: no-repeat;
  background-attachment: fixed;
  -webkit-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
}

@font-face { font-family: 'Single Sleeve Regular'; src: local('Single Sleeve Regular'),url(sing_14l.woff) format('woff') }
html { height: 100%; -webkit-text-size-adjust: none; }
body { font-family: 'Single Sleeve Regular', Arial, Helvetica; font-size:1.2em; letter-spacing: 2px;
	background-color:#000;
	background-image: url("Gifs/Musicback2.jpg");
	background-position: 50% 50%;
  background-repeat: no-repeat;
  background-attachment: fixed;
  -webkit-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

img {
  background-color:#000;
	border:0;
	height: 100%;
	width: 100%;
	object-fit: contain;
}

div,button,h9 { background-color: #000; border:0px; }
#box0,#boxU {
		text-align: center;
    position: fixed;
    width: 100%;
    height: 14%;
		margin: 0px;
		padding: 0px;
    z-index: 3;
}
#box0 { top: 0px; left: 0px; }
#boxU { bottom: 0px; left: 0px; display: flex; align-items: center; justify-content: center; flex-grow: 1; }

video { position: fixed; top: 48%; left: 50%; min-width: 100%; min-height: 100%; width: auto; height: 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,span {
	position: fixed;
	top:88%;
	height:11%;
  z-index: 4;
	}
#Ghost2 {
  left:3%;
	width:8%;
}
#Ghost2:hover,:active,:focus {
	top:89%;
}
#Cat2 {
	left: 12%;
	width:7%;
}
#Cat2:hover {
	top:89%;
}

#Stcb {
	left: 20%;
	width:6%;
}
#Stcb:hover {
	top:89%;
}
#Wet {
	left: 27%;
	width:8%;
}
#Wet:hover { top:89%;}
#Pfeil3 {
	left: 37%;
	width:28%;
  z-index: 4;
}
#Moon {
	left: 67%;
	width:9%;
}
#Moon:hover { top:89%; }
#Crack {
	left: 77%;
	width:9%;
}
#Crack:hover { top:89%; }
#Montego {
	left: 87%;
	width:9%;
}
#Montego:hover { top:89%; }

