html
{
 height: 100%;
 margin-bottom:10px;
 margin-top:0px;
} 

body
{
 margin-top: 50px;
 margin-right: 0px;
 margin-bottom: 0px;
 margin-left: 0px;
 background-repeat: no-repeat;
 background-size: 100%;
 background-position: 90% top;
 background-color: #000000;
 height: 100vh;
}
 
.block
{
 text-align: left;
 margin: 0 auto;
 height: auto;
 padding: 0px;
 width: auto;
 min-width: 320px;
 max-width: 650px;
 text-align: center;
 border-style: solid;
 border-width: 0px;
 border-color: #ffffff;
}

.container
{
 display: flex;
 justify-content: center;
}

a.links:link
{
 font-family: Arial Black;
 font-size: 24px;
 @media screen and (min-width: 480px)
 {
  font-size: calc(24px + (18 - 24) * ((100vw - 480px) / (1600 - 480)));
 }
 @media screen and (min-width: 1600px)
 {
  font-size: 18px;
 }
 color: #aa1100;
 text-decoration: none;
}
 
a.links:hover
{
 font-family: Arial Black;
 font-size: 24px;
 @media screen and (min-width: 480px)
 {
  font-size: calc(24px + (18 - 24) * ((100vw - 480px) / (1600 - 480)));
 }
 @media screen and (min-width: 1600px)
 {
  font-size: 18px;
 }
 color: #ff1100;
 text-decoration: underline;
}

a.links:focus
{
 font-family: Arial Black;
 font-size: 24px;
 @media screen and (min-width: 480px)
 {
  font-size: calc(24px + (18 - 24) * ((100vw - 480px) / (1600 - 480)));
 }
 @media screen and (min-width: 1600px)
 {
  font-size: 18px;
 }
 color: #ff1100;
 text-decoration: none;
}
 
a.links:active
{
 font-family: Arial Black;
 font-size: 24px;
 @media screen and (min-width: 480px)
 {
  font-size: calc(24px + (18 - 24) * ((100vw - 480px) / (1600 - 480)));
 }
 @media screen and (min-width: 1600px)
 {
  font-size: 18px;
 }
 color: #ff1100;
 text-decoration: none;
}

a.foot:link
{
 font-family: Arial;
 font-size: 24px;
 @media screen and (min-width: 480px)
 {
  font-size: calc(24px + (18 - 24) * ((100vw - 480px) / (1600 - 480)));
 }
 @media screen and (min-width: 1600px)
 {
  font-size: 18px;
 }
 color: #000000;
 text-decoration: none;
}
 
a.foot:hover
{
 font-family: Arial;
 font-size: 24px;
 @media screen and (min-width: 480px)
 {
  font-size: calc(24px + (18 - 24) * ((100vw - 480px) / (1600 - 480)));
 }
 @media screen and (min-width: 1600px)
 {
  font-size: 18px;
 }
 color: #ff1100;
 text-decoration: underline;
}

a.foot:focus
{
 font-family: Arial;
 font-size: 24px;
 @media screen and (min-width: 480px)
 {
  font-size: calc(24px + (18 - 24) * ((100vw - 480px) / (1600 - 480)));
 }
 @media screen and (min-width: 1600px)
 {
  font-size: 18px;
 }
 color: #ff1100;
 text-decoration: none;
}
 
a.foot:active
{
 font-family: Arial;
 font-size: 24px;
 @media screen and (min-width: 480px)
 {
  font-size: calc(24px + (18 - 24) * ((100vw - 480px) / (1600 - 480)));
 }
 @media screen and (min-width: 1600px)
 {
  font-size: 18px;
 }
 color: #ff1100;
 text-decoration: none;
}

a.extern:link
{
 font-family: Arial;
 font-weight: normal;
 font-size: 40px;
 @media screen and (min-width: 480px)
 {
  font-size: calc(40px + (28 - 40) * ((100vw - 480px) / (1600 - 480)));
 }
 @media screen and (min-width: 1600px)
 {
  font-size: 28px;
 }
 color: #aa1100;
 text-decoration: none;
}
 
a.extern:hover
{
 font-family: Arial;
 font-weight: normal;
 font-size: 40px;
 @media screen and (min-width: 480px)
 {
  font-size: calc(40px + (28 - 40) * ((100vw - 480px) / (1600 - 480)));
 }
 @media screen and (min-width: 1600px)
 {
  font-size: 28px;
 }
 color: #ff1100;
 text-decoration: underline;
}

a.extern:focus
{
 font-family: Arial;
 font-weight: normal;
 font-size: 40px;
 @media screen and (min-width: 480px)
 {
  font-size: calc(40px + (28 - 40) * ((100vw - 480px) / (1600 - 480)));
 }
 @media screen and (min-width: 1600px)
 {
  font-size: 28px;
 }
 color: #ff1100;
 text-decoration: none;
}
 
a.extern:active
{
 font-family: Arial;
 font-weight: normal;
 font-size: 40px;
 @media screen and (min-width: 480px)
 {
  font-size: calc(40px + (28 - 40) * ((100vw - 480px) / (1600 - 480)));
 }
 @media screen and (min-width: 1600px)
 {
  font-size: 28px;
 }
 color: #ff1100;
 text-decoration: none;
}

img.logo
{
 margin: auto;
 display: block;
 max-width:90%;
 height: auto;
 animation: shake 1.0s cubic-bezier(.35,.08,.15,.95) both;
 transform: translate3d(0, 0, 0);
 backface-visibility: hidden;
 perspective: 1000px;
}

@keyframes shake
{
  10%, 90% {transform: translate3d(0, -2px, 0);}
  20%, 80% {transform: translate3d(0, 4px, 0);}
  30%, 50%, 70% {transform: translate3d(0, -8px, 0);}
  40%, 60% {transform: translate3d(0, 8px, 0);}
}
 
img.zoomin
{
 margin: auto;
 display: block;
 max-width:50%;
 height: auto;
 overflow: hidden;
 border-style: outset;
 border-color: #999999;
 border-width: 10px;
}

div.zoomin img {
	width: 100%;
	height: auto;
	/* SCALE */
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	-o-transform: scale(1);
	transform: scale(1);
	/* VERZÖGERUNG */
	-webkit-transition: all 0.1s linear;
	-moz-transition: all 0.1s linear;
	-ms-transition: all 0.1s linear;
	-o-transition: all 0.1s linear;
	transition: all 0.1s linear;
}
div.zoomin img:hover {
	-webkit-transform: scale(1.4);
	-moz-transform: scale(1.4);
	-ms-transform: scale(1.4);
	-o-transform: scale(1.4);
	transform: scale(1.4);
}

img.outtake_zoomin
{
 margin: auto;
 display: block;
 max-width:50%;
 height: auto;
 overflow: hidden;
 border-style: outset;
 border-color: #999999;
 border-width: 10px;
}

div.outtake_zoomin img
{
 width: 100%;
 height: auto;
 /* SCALE */
 -webkit-transform: scale(1);
 -moz-transform: scale(1);
 -ms-transform: scale(1);
 -o-transform: scale(1);
 transform: scale(1);
 /* VERZÖGERUNG */
 -webkit-transition: all 0.1s linear;
 -moz-transition: all 0.1s linear;
 -ms-transition: all 0.1s linear;
 -o-transition: all 0.1s linear;
 transition: all 0.1s linear;
}
 
div.outtake_zoomin img:hover
{
 -webkit-transform: scale(1.7);
 -moz-transform: scale(1.7);
 -ms-transform: scale(1.7);
 -o-transform: scale(1.7);
 transform: scale(1.7);
 z-index: +1;
}
 
img.zeichenfuzzy
{
 margin: auto;
 display: block;
 width: 100%;
 height: auto;
}
 
img.titel
{
 max-width:100%;
 height: auto;
 float: right;
 clear: right;
 border-color: #111111;
 border-style: solid;
 border-top-width: 10px;
 border-right-width: 0px;
 border-bottom-width: 10px;
 border-left-width: 0px;
}

.links
{
 font-family: Arial Black;
 font-size: 24px;
 @media screen and (min-width: 480px)
 {
  font-size: calc(24px + (18 - 24) * ((100vw - 480px) / (1600 - 480)));
 }
 @media screen and (min-width: 1600px)
 {
  font-size: 18px;
 }
 color: #aa1100;
 text-decoration: none;
}

.text
{
 font-family: Arial;
 font-weight: normal;
 font-size: 40px;
 @media screen and (min-width: 480px)
 {
  font-size: calc(40px + (28 - 40) * ((100vw - 480px) / (1600 - 480)));
 }
 @media screen and (min-width: 1600px)
 {
  font-size: 28px;
 }
 /* text-transform: uppercase; */
 color: #aa1100;
 margin-bottom: 25px;
 text-align: center;
 overflow-y: scroll;
}

.text_datenschutz
{
 font-family: Arial;
 font-weight: normal;
 font-size: 22px;
 /* text-transform: uppercase; */
 color: #aa1100;
 margin-bottom: 25px;
 text-align: center;
 overflow-y: scroll;
}

.headline
{
 font-family: Arial Narrow;
 font-weight: bold;
 font-size: 60px;
 @media screen and (min-width: 480px)
 {
  font-size: calc(60px + (82 - 60) * ((100vw - 480px) / (1600 - 480)));
 }
 @media screen and (min-width: 1600px)
 {
  font-size: 82px;
 }
 text-transform: uppercase;
 color: #ffffff;
 margin-bottom: 25px;
 text-align: center;
 overflow-y: scroll;
}

.headline_datenschutz
{
 font-family: Arial Narrow;
 font-weight: bold;
 font-size: 22px;
 text-transform: uppercase;
 color: #ffffff;
 margin-bottom: 25px;
 text-align: center;
 overflow-y: scroll;
}

.hand
{
 font-family: 'BRADHITC';
 src: local('BRADHITC'), url('/fonts/BRADHITC.woff2');
 format('woff2');
 font-weight: normal;
 font-size: 40px;
 @media screen and (min-width: 480px)
 {
  font-size: calc(40px + (28 - 40) * ((100vw - 480px) / (1600 - 480)));
 }
 @media screen and (min-width: 1600px)
 {
  font-size: 28px;
 }
 color: #aa1100;
 margin-bottom: 25px;
 text-align: center;
 overflow-y: scroll;
}
 
.cube
{
 border-style: inset;
 border-color: #aa0000;
 border-width: 10px;
 background-color: #ffffff;
 padding: 20px;
 width: auto;
 min-width: 320px;
 max-width: 610px;
 text-align: center;
}

.titel
{
 font-family: Arial Narrow;
 font-weight: bold;
 font-size: 60px;
 @media screen and (min-width: 480px)
 {
  font-size: calc(60px + (82 - 60) * ((100vw - 480px) / (1600 - 480)));
 }
 @media screen and (min-width: 1600px)
 {
  font-size: 82px;
 }
 text-transform: uppercase;
 color: #ffffff;
 margin-bottom: 25px;
 text-align: center;
 overflow-y: scroll;
}

.bigtitel
{
 font-family: Arial Narrow;
 font-weight: bold;
 text-shadow: -3px 0 #aa1100, 0 3px #aa1100, 3px 0 #aa1100, 0 -3px #aa1100;
 background-color: #111111;
 font-size: 80px;
 @media screen and (min-width: 480px)
 {
  font-size: calc(80px + (102 - 80) * ((100vw - 480px) / (1600 - 480)));
 }
 @media screen and (min-width: 1600px)
 {
  font-size: 102px;
 }
 text-transform: uppercase;
 color: #ffffff;
 margin-bottom: 0px;
 text-align: center;
 overflow-y: scroll;
}
 
.trennstriche
{
 font-family: Arial Black;
 font-size: 16px;
 color: #aa1100;
}

#footer
{ 
 width:100%;
 font-family: Arial;
 font-size: 24px;
 @media screen and (min-width: 480px)
 {
  font-size: calc(24px + (18 - 24) * ((100vw - 480px) / (1600 - 480)));
 }
 @media screen and (min-width: 1600px)
 {
  font-size: 18px;
 }
 color: #000000;
 text-decoration: none;
 text-align: center;
 background-color: #ffffff;
 border-style: solid;
 border-color: #ff1100;
 border-top-width: 3px;
 border-right-width: 0px;
 border-bottom-width: 0px;
 border-left-width: 0px;
 width: 100%;
 display: block;
 padding: 10px 0px 10px 0px;
 margin: 0px;
}