@charset "utf-8";
/* CSS Document */

/*
<div id="ud_slider">
	<img src="#" class="slider_img klasse_1"/>
    <img src="#" class="slider_img klasse_2"/>
    <img src="#" class="slider_img klasse_3"/>
    <img src="#" class="slider_img klasse_4"/>
</div>
*/

#ud_slider { 
		width:1900px;
		height: 380px;
		margin: auto;
		padding: 0;
		overflow: hidden;
		position: relative;
}

#ud_slider2 { 
		width: 600px;
		height: 800px;
		margin: auto;
		padding: 0;
		overflow: hidden;
		position: relative;
		display: none;
}

.slider_img { position:absolute; top:0; left:0;}

.klasse_1 { animation: UD_KLASSE_1 infinite 40000ms; -moz-animation: UD_KLASSE_1 infinite 40000ms; -ms-animation: UD_KLASSE_1 infinite 40000ms; -o-animation: UD_KLASSE_1 infinite 40000ms; -webkit-animation: UD_KLASSE_1 infinite 40000ms;}
.klasse_2 { animation: UD_KLASSE_2 infinite 40000ms; -moz-animation: UD_KLASSE_2 infinite 40000ms; -ms-animation: UD_KLASSE_2 infinite 40000ms; -o-animation: UD_KLASSE_2 infinite 40000ms; -webkit-animation: UD_KLASSE_2 infinite 40000ms;}
.klasse_3 { animation: UD_KLASSE_3 infinite 40000ms; -moz-animation: UD_KLASSE_3 infinite 40000ms; -ms-animation: UD_KLASSE_3 infinite 40000ms; -o-animation: UD_KLASSE_3 infinite 40000ms; -webkit-animation: UD_KLASSE_3 infinite 40000ms;}
.klasse_4 { animation: UD_KLASSE_4 infinite 40000ms; -moz-animation: UD_KLASSE_4 infinite 40000ms; -ms-animation: UD_KLASSE_4 infinite 40000ms; -o-animation: UD_KLASSE_4 infinite 40000ms; -webkit-animation: UD_KLASSE_4 infinite 40000ms;}

.klasse_1 {
		width: 100%;
		height: auto;
}

.klasse_2 {
		width: 100%;
		height: auto;
}

.klasse_3 {
		width: 100%;
		height: auto;
}

.klasse_4 {
		width: 100%;
		height: auto;
}

@-moz-keyframes UD_KLASSE_1 {
		0% {opacity:1;}
		20% { opacity:1;}
		25% { opacity:0;}
		95% { opacity:0;}
}

@-moz-keyframes UD_KLASSE_2 {
		0% { opacity:0;}
		20% { opacity:0;}
		25% { opacity:1;}
		45% { opacity:1;}
		50% { opacity:0;}
		100% { opacity:0;}
}

@-moz-keyframes UD_KLASSE_3 {
		0% { opacity:0;}
		45% { opacity:0;}
		50% { opacity:1;}
		70% { opacity:1;}
		75% { opacity:0;}
		100% { opacity:0;}
}

@-moz-keyframes UD_KLASSE_4 {
		0% { opacity:0;}
		70% { opacity:0;}
		75% { opacity:1;}
		95% { opacity:1;}
		100% { opacity:0;}
}

@-ms-keyframes UD_KLASSE_1 {
		0% {opacity:1;}
		20% { opacity:1;}
		25% { opacity:0;}
		95% { opacity:0;}
}

@-ms-keyframes UD_KLASSE_2 {
		0% { opacity:0;}
		20% { opacity:0;}
		25% { opacity:1;}
		45% { opacity:1;}
		50% { opacity:0;}
		100% { opacity:0;}
}

@-ms-keyframes UD_KLASSE_3 {
		0% { opacity:0;}
		45% { opacity:0;}
		50% { opacity:1;}
		70% { opacity:1;}
		75% { opacity:0;}
		100% { opacity:0;}
}

@-ms-keyframes UD_KLASSE_4 {
		0% { opacity:0;}
		70% { opacity:0;}
		75% { opacity:1;}
		95% { opacity:1;}
		100% { opacity:0;}
}

@-webkit-keyframes UD_KLASSE_1 {
		0% {opacity:1;}
		20% { opacity:1;}
		25% { opacity:0;}
		95% { opacity:0;}
}

@-webkit-keyframes UD_KLASSE_2 {
		0% { opacity:0;}
		20% { opacity:0;}
		25% { opacity:1;}
		45% { opacity:1;}
		50% { opacity:0;}
		100% { opacity:0;}
}

@-webkit-keyframes UD_KLASSE_3 {
		0% { opacity:0;}
		45% { opacity:0;}
		50% { opacity:1;}
		70% { opacity:1;}
		75% { opacity:0;}
		100% { opacity:0;}
}

@-webkit-keyframes UD_KLASSE_4 {
		0% { opacity:0;}
		70% { opacity:0;}
		75% { opacity:1;}
		95% { opacity:1;}
		100% { opacity:0;}
}

}

@media only screen and (max-width: 1899px) {
			.reframe { max-width: 1899px }

#ud_slider { 
		width:1899px;
		height: 319px;
}

}

@media only screen and (max-width: 1898px) {
			.reframe { max-width: 1898px }

#ud_slider { 
		width:1580px;
		height: 316px;
}

}

@media only screen and (max-width: 1599px) {
			.reframe { max-width: 1599px }

#ud_slider { 
		width:1280px;
		height: 256px;
}

}

@media only screen and (max-width: 1279px) {
			.reframe { max-width: 1279px }
			
#ud_slider {
		width:1020px;
		height: 204px;
}

}

@media only screen and (max-width: 1023px) {
			.reframe { max-width: 1023px }
			
#ud_slider {
		width:800px;
		height: 160px;
}

}

@media only screen and (max-width: 799px) {
			.reframe { max-width: 799px }

#ud_slider {
		width:640px;
		height: 128px;
}

}

@media only screen and (max-width: 639px) {
			.reframe { max-width: 639px }

#ud_slider {
		width:480px;
		height: 96px;
}

}

@media only screen and (max-width: 480px) {
			.reframe { max-width: 480px }

#ud_slider {
		width: auto;
		height: 96px;
		display: none;
}

#ud_slider2 {
		width:230px;
		height: 307px;
		display: block;
		margin-top: 250px;
}

}