@charset "utf-8";

.claim-container {
	display: block;
	width: 70%;
	position: absolute;
	right: 5%;
	top: 2%;
}

.text-a, .text-b, .text-c {
	font-size: 400%;
	font-family: Verdana, Geneva, sans-serif;
	color: rgba(255,255,255,0.8);
	text-align: right;
	position: absolute;
	display: block;
	overflow: hidden;
	opacity: 0;
	right: 0px;
}

.text-a {
	animation-name: text-reinA; /* Name der Animation: freiwählbar */
	animation-duration: 10s; /* Pflichtangabe Dauer der Animation */
	animation-timing-function: ease; /* Standard: ease */
	animation-delay: 0s; /* Standard: 0  Zeit bis zum Start der Animation */
	animation-iteration-count: infinite; /* Anzahl der Wiederholungen infinite = unendlich*/
	animation-direction: normal; /* Standard: normal  - Animation kehrt wieder zurück: alternate*/
	animation-play-state: running; /* Standard: running - paused Animation wird angehalten */
	animation-fill-mode: forwards;
	z-index: 9001;
}

.text-b {
	animation-name: text-reinB; /* Name der Animation: freiwählbar */
	animation-duration: 10s; /* Pflichtangabe Dauer der Animation */
	animation-timing-function: ease; /* Standard: ease */
	animation-delay: 0s; /* Standard: 0  Zeit bis zum Start der Animation */
	animation-iteration-count: infinite; /* Anzahl der Wiederholungen infinite = unendlich*/
	animation-direction: normal; /* Standard: normal  - Animation kehrt wieder zurück: alternate*/
	animation-play-state: running; /* Standard: running - paused Animation wird angehalten */
	animation-fill-mode: forwards;
	z-index: 9002;
}

.text-c {
	animation-name: text-reinC; /* Name der Animation: freiwählbar */
	animation-duration: 10s; /* Pflichtangabe Dauer der Animation */
	animation-timing-function: ease-in-out; /* Standard: ease */
	animation-delay: 0s; /* Standard: 0  Zeit bis zum Start der Animation */
	animation-iteration-count: infinite; /* Anzahl der Wiederholungen infinite = unendlich*/
	animation-direction: normal; /* Standard: normal  - Animation kehrt wieder zurück: alternate*/
	animation-play-state: running; /* Standard: running - paused Animation wird angehalten */
	animation-fill-mode: forwards;
	opacity:0;
	left:0px;
	z-index: 9003;
}

@keyframes text-reinA {
	0% {top: -400px; opacity: 0;}
	10% {top: 30px; opacity: 1;}
	30% {top: 30px; opacity: 1;}
	40% {top: 300px; opacity: 0;}
	100% {top: 300px; opacity: 0;}
}

@keyframes text-reinB {
	0% {top: -400px; opacity: 0;}
	30% {top: -400px; opacity: 0;}
	40% {top: 30px; opacity: 1;}
	60% {top: 30px; opacity: 1;}
	70% {top: 300px; opacity: 0;}
	100% {top: 300px; opacity: 0;}
}

@keyframes text-reinC {
	0% {top: -400px; opacity: 0;}
	57% {top: -400px; opacity: 0;}
	67% {top: 30px; opacity: 1;}
	90% {top: 30px; opacity: 1;}
	100% {top: 300px; opacity: 0;}
}

#ein-Bild {
	margin: 0px;
	width: 100%;
	z-index: 10;
	position: absolute;
	left: 0px;
	top: 0px;
}


#stapel {
	margin: 0px;
	width: 100%;
	z-index: 10;
	position: absolute;
	left: 0px;
	top: 0px;
}

#stapel img {
	position: absolute;
	opacity: 0;
	animation-delay: 0s;
	animation-duration: 10s;
	animation-timing-function: ease-in-out;
	animation-iteration-count: infinite;
	animation-fill-mode: forwards;
	top: 0px;
	max-width: 100%;
	float: left;
}


#stapel img:nth-of-type(1) {
    animation-name: fade1;
	margin-top: 0px;
}

#stapel img:nth-of-type(2) {
	animation-name: fade2;
	margin-top: 0px;
}

#stapel img:nth-of-type(3) {
    animation-name: fade3;
	margin-top: 0px;
}



@keyframes fade1 {
    0% {opacity:1;}
	10% {opacity:1;}
    20% {opacity:1;}
	30% {opacity:1;}
    40% {opacity:0;}
	50% {opacity:0;}
    60% {opacity:0;}
	70% {opacity:0;}
    80% {opacity:0;}
	90% {opacity:0;}
   100% {opacity:1;}
}

@keyframes fade2 {
     0% {opacity:0;}
	10% {opacity:0;}
    20% {opacity:0;}
	30% {opacity:0;}
    40% {opacity:1;}
	50% {opacity:1;}
    60% {opacity:1;}
	70% {opacity:0;}
    80% {opacity:0;}
	90% {opacity:0;}
   100% {opacity:0;}
}

@keyframes fade3 {
     0% {opacity:0;}
	10% {opacity:0;}
    20% {opacity:0;}
	30% {opacity:0;}
    40% {opacity:0;}
	50% {opacity:0;}
    60% {opacity:0;}
	70% {opacity:1;}
    80% {opacity:1;}
	90% {opacity:1;}
   100% {opacity:0;}
}

@media only screen and (min-width: 769px) {
	
.text-a, .text-b, .text-c {
	font-size: 600%;
}
	
@keyframes text-reinA {
	0% {top: -400px; opacity: 0;}
	10% {top: 80px; opacity: 1;}
	30% {top: 80px; opacity: 1;}
	40% {top: 500px; opacity: 0;}
	100% {top: -400px; opacity: 0;}
}

@keyframes text-reinB {
	0% {top: -400px; opacity: 0;}
	30% {top: -400px; opacity: 0;}
	40% {top: 80px; opacity: 1;}
	60% {top: 80px; opacity: 1;}
	70% {top: 500px; opacity: 0;}
	100% {top: 500px; opacity: 0;}
}

@keyframes text-reinC {
	0% {top: -400px; opacity: 0;}
	57% {top: -400px; opacity: 0;}
	67% {top: 80px; opacity: 1;}
	90% {top: 80px; opacity: 1;}
	100% {top: 500px; opacity: 0;}
}

}