main        {margin-top: 0}

/*.mainImages {background-position: center center; background-repeat: no-repeat; background-size: cover }*/
.splashscreen{background: transparent; z-index: 100001;position: relative}
.in-visible {display: none;}
#intro {width: 100%;height: 100%;height: 100vh;position: relative; overflow: hidden;}
 
#intro .logo,
#intro .claim     {position: absolute; margin: 0 auto;z-index: 10; margin: 0 auto;text-align: center;width: 100%;}
#intro .logo      {top: 10%;  -webkit-animation: fadein 2s; /* Safari, Chrome and Opera > 12.1 */
	   -moz-animation: fadein 2s; /* Firefox < 16 */
		-ms-animation: fadein 2s; /* Internet Explorer */
		 -o-animation: fadein 2s; /* Opera < 12.1 */
			animation: fadein 2s;}
#intro .logo img  {width:35%; max-width: 600px }

#intro .claim     {top:30em}     
#intro .claim h1  {text-align:center; font-size: 6rem;
	font-weight: 700;
	line-height: 90%;
	padding: 0 0 0.5em 0;
	text-align: center;
	color: #fff;
	text-transform: uppercase;
	text-shadow: 2px 2px 2px rgba(0,0,0,0.8);perspective: 500px;}
	 
	 
#slider {width: 100%;height: 100%;position: relative;}

.slideshow     {margin: 0;padding: 0;list-style:none; width:100%;height:100%;top:0;right:0;bottom:0;left:0; overflow:hidden;position: absolute;}
.slideshow li  {width:100%;height:100%;position:absolute;top:0;right:0;bottom:0;left:0;color:transparent;background-size:cover;background-position:50% 50%;opacity:0;animation: slideShow 25s linear /*infinite 0s*/;}
        
.slideshow li:nth-child(1) {animation-delay: 0s;}
.slideshow li:nth-child(2) {animation-delay: 5s;}
.slideshow li:nth-child(3) {animation-delay: 10s;}
.slideshow li:nth-child(4) {animation-delay: 15s;}
/*.slideshow li:nth-child(5) {animation-delay: 20s;}*/
        
@keyframes slideShow { 
   0% {opacity: 0;transform: scale(1.1) rotate(-1.5deg);}
   2% {opacity: 1;}
   20% {opacity: 1;}
   24% {opacity: 0;transform: scale(1.3) rotate(1.5deg);}
}


/*Animation Headline*/
@keyframes pop-word  { to {transform: rotateX(0);} }
@keyframes show      { to {opacity: 1;}}
@keyframes bar-scale { to {transform: scaleY(1);}}
  
.word {
   display: block;opacity: 0;
   animation: show 0.01s forwards, pop-word 1.5s forwards;
   animation-timing-function: cubic-bezier(0.14, 1.23, 0.33, 1.16);
   animation-delay: 2s;
   transform: rotateX(120deg);
   transform-origin: 50% 100%;
 }
 .word:nth-of-type(2) {
   padding: 0 2rem;
   animation-delay: 3s;
   color: var(--HUSSgelb);
 }
 
 
/*FadIn Logo*/
@keyframes fadein 			{from { opacity: 0; }	to   { opacity: 1; }}
@-moz-keyframes fadein 		{from { opacity: 0; }	to   { opacity: 1; }}
@-webkit-keyframes fadein 	{from { opacity: 0; }	to   { opacity: 1; }}
@-ms-keyframes fadein 		{from { opacity: 0; }	 to   { opacity: 1; } }
@-o-keyframes fadein 		{from { opacity: 0; }	to   { opacity: 1; } }

@media screen and (max-height:700px ) {
   #intro .claim {top: unset;bottom: 3em;}
}
@media screen and (max-height:500px ) {
   #intro .claim h1 {font-size: 4rem;}
   #intro .logo img {max-width: 300px;}
}

@media screen and (max-width:650px ) {
   #intro .claim h1 {font-size: 4rem;}
   #intro .logo img {max-width: 300px;width: 60%}
   #intro .claim {top: 40%;}
}

@media screen and (max-width:390px ) {
   #intro .claim h1 {font-size: 3rem;}
}