@media screen and
(min-width: 600px){	
	#start_picture_text{
	animation: showText 5s linear; 
	-webkit-animation: showText 5s linear;
	}

	
	#logo_start{
	position: relative;
	width: 20%;
	}

	
		#start_picture img{
		width: 100%;
		animation: hideStartPic 6s linear; 
		-webkit-animation: hideStartPic 6s linear;
		}
		#start_picture{
		animation: hideStart 6s linear; 
		-webkit-animation: hideStart 6s linear;
		}
		
	#logo_start img{
	position: relative;
	animation: showLogo 3s linear; 
	-webkit-animation: showLogo 3s linear;
	}
	
	#logo_start{
	position: relative;
	animation: hideLogo 6s linear; 
	-webkit-animation: hideLogo 6s linear;
	}
	}
	
@media screen and
(min-width: 600px){	
	#slider, #section_start, #beschriftung{
	animation: showMain 7s linear; 
	-webkit-animation: showMain 7s linear;
	}
	#section_start, #beschriftung{
	animation: showMain2 7.5s linear; 
	-webkit-animation: showMain2 7.5s linear;
	}
#menu{
	animation: showMenu 8s linear; 
	-webkit-animation: showMenu 8s linear;
	}

body{
animation: fix 9s linear; 
-webkit-animation: fix 9s linear;
}	
}
@media screen and
(max-width: 600px){	
	#slider, #section_start, #beschriftung{
	animation: showMain 0.5s linear; 
	-webkit-animation: showMain 0.5s linear;
	}
	#section_start, #beschriftung{
	animation: showMain2 1s linear; 
	-webkit-animation: showMain2 1s linear;
	}
#menu{
	animation: showMenu 1s linear; 
	-webkit-animation: showMenu 1s linear;
	}

body{
animation: fix 1s linear; 
-webkit-animation: fix 1s linear;
}	
}
@keyframes showText{
		0%{ opacity: 0.0;}
		10%{ opacity: 0.0;}
		40%{ opacity: 1.0;}
		70%{ opacity: 1.0;}
		100%{ opacity: 0.0;}
	}		
	
@keyframes showLogo{
		0%{ left: -200%;}
		70%{  left: -200%;}
		100%{  left: 0%;}
	}
@media screen and
(max-width: 800px){	
@keyframes showLogo{
		0%{ left: -200%;}
		70%{  left: -200%;}
		100%{  left: -10%;}
	}
}

@keyframes hideLogo{
		0%{ top: 40%;}
		90%{top: 40%;}
		100%{top: -10%;}
	}
@media screen and
(max-width: 800px){	
@keyframes hideLogo{
		0%{ top: 30%;}
		90%{top: 30%;}
		100%{top: -10%;}
	}
}	
	
@keyframes hideStartPic{
		0%{ margin-top: -15%;}
		90%{  margin-top: -15%;}
		100%{ margin-top: -100%;}
	}
@media screen and
(max-width: 800px){	
@keyframes hideStartPic{
		0%{ margin-top: -30%;}
		90%{  margin-top: -30%;}
		100%{ margin-top: -100%;}
	}
	}
@media screen and
(max-width: 800px)and
(orientation: portrait){	
@keyframes hideStartPic{
		0%{ margin-top: -15%;}
		90%{  margin-top: -15%;}
		100%{ margin-top: -100%;}
	}
	}	

	


@keyframes hideStart{
		0%{height: 1000px; opacity: 1.0;}
		95%{height: 1000px; opacity: 1.0;}
		100%{height: 1000px; opacity: 0.0;}
	}
	
	@keyframes showMain{
		0%{opacity: 0.0;}
		95%{opacity: 0.0;}
		100%{opacity: 1.0;}
	}
	
	@keyframes showMain2{
		0%{opacity: 0.0;}
		95%{opacity: 0.0;}
		100%{opacity: 1.0;}
	}
	
	@media screen and
(min-width: 800px){		
		@keyframes showMenu{
		0%{opacity: 0.0;}
		95%{opacity: 0.0;}
		100%{opacity: 1.0;}
	}
	}
/*Anfang Webkits*/

@-webkit-keyframes showText{
		0%{ opacity: 0.0;}
		10%{ opacity: 0.0;}
		40%{ opacity: 1.0;}
		70%{ opacity: 1.0;}
		100%{ opacity: 0.0;}
	}		
	
@-webkit-keyframes showLogo{
		0%{ left: -200%;}
		70%{  left: -200%;}
		100%{  left: 0%;}
	}

@-webkit-keyframes hideLogo{
		0%{ top: 650px;}
		90%{top: 650px;}
		100%{top: -150px;}
	}
	
@-webkit-keyframes hideStartPic{
		0%{ margin-top: -350px;}
		90%{  margin-top: -350px;}
		100%{ margin-top: -1500px;}
	}
@media screen and
(max-width: 800px){	
@-webkit-keyframes hideStartPic{
		0%{ margin-top: -20%;}
		90%{  margin-top: -20%;}
		100%{ margin-top: -100%;}
	}
	}



@-webkit-keyframes hideStart{
		0%{height: 1000px; opacity: 1.0;}
		95%{height: 1000px; opacity: 1.0;}
		100%{height: 1000px; opacity: 0.0;}
	}
	
	@-webkit-keyframes showMain{
		0%{opacity: 0.0;}
		95%{opacity: 0.0;}
		100%{opacity: 1.0;}
	}
	
	@-webkit-keyframes showMain2{
		0%{opacity: 0.0;}
		95%{opacity: 0.0;}
		100%{opacity: 1.0;}
	}
		
@media screen and
(min-width: 600px){	
@-webkit-keyframes showMenu{
		0%{opacity: 0.0;}
		95%{opacity: 0.0;}
		100%{opacity: 1.0;}
	}
}

/*Ende webkits*/
	
	
	/*Slider-Anfang*/	
	#slide01{
	animation: slide01 12s ease infinite; 
	-webkit-animation: slide01 12s ease infinite;
	animation-delay: 8s;
	-webkit-animation-delay: 8s;
	}
	#slide02{
	animation: slide02 12s ease infinite; 
	-webkit-animation: slide02 12s ease infinite;
	animation-delay: 8s;
	-webkit-animation-delay: 8s;
	}
	#slide03{
	animation: slide03 12s ease infinite; 
	-webkit-animation: slide03 12s ease infinite;
	animation-delay: 8s;
	-webkit-animation-delay: 8s;
	}
	#counter{
	animation: count 12s linear infinite; 
	-webkit-animation: count 12s linear infinite;
	animation-delay: 8s;
	-webkit-animation-delay: 8s;
	}
	@media screen and
(min-width: 600px){	
	#text01{
	animation: text01 12s linear infinite; 
	-webkit-animation: text01 12s linear infinite;
	animation-delay: 8s;
	-webkit-animation-delay: 8s;
	}
	#text02{
	animation: text02 12s linear infinite; 
	-webkit-animation: text02 12s linear infinite;
	animation-delay: 8s;
	-webkit-animation-delay: 8s;
	}
	#text03{
	animation: text03 12s linear infinite; 
	-webkit-animation: text03 12s linear infinite;
	animation-delay: 8s;
	-webkit-animation-delay: 8s;
	}
	}
	@keyframes text01{
		0%{opacity: 1.0;}
		27%{opacity: 1.0;}
		33%{opacity: 0.0;}
		60%{opacity: 0.0;}
		66%{opacity: 0.0;}
		100%{opacity: 0.0;}
	}
	@keyframes text02{
		0%{opacity: 0.0}
		27%{opacity: 0.0;}
		33%{opacity: 1.0;}
		60%{opacity: 1.0;}
		66%{opacity: 0.0;}
		100%{opacity: 0.0;}
	}
	@keyframes text03{
		0%{opacity: 0.0;}
		27%{opacity: 0.0;}
		33%{opacity: 0.0;}
		60%{opacity: 0.0;}
		66%{opacity: 1.0;}
		100%{opacity: 1.0;}
	}
	@-webkit-keyframes text01{
		0%{opacity: 1.0;}
		27%{opacity: 1.0;}
		33%{opacity: 0.0;}
		60%{opacity: 0.0;}
		66%{opacity: 0.0;}
		100%{opacity: 0.0;}
	}
	@-webkit-keyframes text02{
		0%{opacity: 0.0}
		27%{opacity: 0.0;}
		33%{opacity: 1.0;}
		60%{opacity: 1.0;}
		66%{opacity: 0.0;}
		100%{opacity: 0.0;}
	}
	@-webkit-keyframes text03{
		0%{opacity: 0.0;}
		27%{opacity: 0.0;}
		33%{opacity: 0.0;}
		60%{opacity: 0.0;}
		66%{opacity: 1.0;}
		100%{opacity: 1.0;}
	}
	
	@keyframes count{
		0%{width: 0%}
		27%{width: 100%;}
		33%{width: 0%;}
		60%{width: 100%}
		66%{width: 0%;}
		100%{width: 100%;}
	}
	
	
	@keyframes slide01{
		0%{left: 0%}
		27%{left: 0%;}
		33%{left: -33.3%;}
		100%{left: -33.3%;}
	}
	@keyframes slide02{
		0%{left: 0%}
		27%{left: 0%;}
		33%{left: -33.3%;}
		60%{left: -33.3%;}
		66%{left: -66.6%;}
		100%{left: -66.6%;}
	}
	@keyframes slide03{
		0%{left: -33.3%}
		60%{left: -33.3%;}
		66%{left: -66.6%;}
		100%{left: -66.6%;}
	}
	
	@-webkit-keyframes count{
		0%{width: 0%}
		27%{width: 100%;}
		33%{width: 0%;}
		60%{width: 100%}
		66%{width: 0%;}
		100%{width: 100%;}
	}
	
	
	@-webkit-keyframes slide01{
		0%{left: 0%}
		27%{left: 0%;}
		33%{left: -33.3%;}
		100%{left: -33.3%;}
	}
	@-webkit-keyframes slide02{
		0%{left: 0%}
		27%{left: 0%;}
		33%{left: -33.3%;}
		60%{left: -33.3%;}
		66%{left: -66.6%;}
		100%{left: -66.6%;}
	}
	@-webkit-keyframes slide03{
		0%{left: -33.3%}
		60%{left: -33.3%;}
		66%{left: -66.6%;}
		100%{left: -66.6%;}
	}

	/*Slider-Ende*/