@charset "utf-8";

.claim-container {
	display: block;
	width: 94%;
	position: absolute;
	right: 0px;
	bottom: 2%;
	margin-left: 6%;
}

.text-a, .text-b, .text-c {
	text-align: left;
	position: relative;
	display: block;
	left: 0%;
	overflow: hidden;
	opacity: 1;
	width: 16%;
	float: left;
	margin-right: 2%;
}


.text-a {
	animation-name: text-reinA; /* Name der Animation: freiwählbar */
	animation-duration: 12s; /* 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: 12s; /* 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: 12s; /* 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% {left: 10000px; 	opacity: 0; transform: scale(90);}
	10% {left: 10000px; opacity: 0; transform: scale(90);}
	20% {left: 0px; opacity: 1; transform: scale(1);}
	95% {left: 0px; opacity: 1;}
	100% {left: 0px; opacity: 0;}
}

@keyframes text-reinB {
	0% {left: 10000px; opacity: 0; transform: scale(90);}
	35% {left: 10000px; opacity: 0; transform: scale(90);}
	45% {left: 0px; opacity: 1; transform: scale(1);}
	95% {left: 0px; opacity: 1;}
	100% {left: 0px; opacity: 0;}
}

@keyframes text-reinC {
	0% {left: 10000px; opacity: 0; transform: scale(90);}
	55% {left: 10000px; opacity: 0; transform: scale(90);}
	65% {left: 0px; opacity: 1; transform: scale(1);}
	95% {left: 0px; opacity: 1;}
	100% {left: 0px; 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: 12s;
	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;}
}
