/* CSS Document */
#fondo{
	width: 778px;
	height: 348px;
	background-image: url(animacion-imagnes/top1.jpg);
	top: 0px;
	left: 0px;
	position: absolute;
	z-index: 5;
	animation: 10s fondoc 1;
	-webkit-animation: 10s fondoc 1;
	-moz-animation: 10s fondoc 1;
	-o-animation: 10s fondoc 1;
	}
@keyframes fondoc {
	0%{opacity:0; }
	10%{opacity:1;}
	20%{opacity:0;}
	22%{opacity:0;}
	100%{opacity:0;}
	}
#contenedor{
	width:300px;
	height:293px;
	background-color: transparent;
	position:relative;
	overflow:hidden;
	}
#imag1{
	z-index:1;
	width:300px;
	height:293px;
	top: 0px;
	left: 0px;
	position: absolute;
	background-image: url(imag/animacion/imag1.fw.png);
	animation: 20s anime1 infinite;
	-webkit-animation: 20s anime1 infinite;
	-moz-animation: 20s anime1 infinite;
	-o-animation: 20s anime1 infinite;
	}
@keyframes anime1 {
	0%{ opacity:0;}
	5%{ opacity:1}
	15%{opacity:0;}
	18%{opacity:0;}
	100%{opacity:0;}
	}
#imag2{
	z-index:2;
	width:300px;
	height:293px;
	top: 0px;
	left: 0px;
	position: absolute;
	background-image: url(imag/animacion/imag2.fw.png);
	animation: 20s anime2 infinite;
	-webkit-animation: 20s anime2 infinite;
	-moz-animation: 20s anime2  infinite;
	-o-animation: 20s anime2  infinite;
	}
@keyframes anime2 {
	0%{opacity:0; }
	10%{opacity:0;}
	15%{opacity:1;}
	25%{opacity:0;}
	100%{opacity:0;}
	}
#imag3{
	z-index:3;
	width:300px;
	height:293px;
	top: 0px;
	left: 0px;
	position: absolute;
	background-image: url(imag/animacion/imag3.fw.png);
	animation: 20s anime3 1;
	-webkit-animation: 20s anime3  infinite;
	-moz-animation: 20s anime3  infinite;
	-o-animation: 20s anime3  infinite;
	}
@keyframes anime3 {
	0%{opacity:0; }
	20%{opacity:0;}
	25%{opacity:1;}
	35%{opacity:0;}
	100%{opacity:0;}
	}
#imag4{
	z-index:4;
	width:300px;
	height:293px;
	top: 0px;
	left: 0px;
	position: absolute;
	background-image: url(imag/animacion/imag4.fw.png);
	animation: 20s anime4 1;
	-webkit-animation: 20s anime4  infinite;
	-moz-animation: 20s anime4  infinite;
	-o-animation: 20s anime4  infinite;
	}
@keyframes anime4 {
	0%{opacity:0; }
	30%{opacity:0;}
	35%{opacity:1;}
	40%{opacity:0;}
	100%{opacity:0;}
	} 
#imag5{
	z-index:5;
	width:300px;
	height:293px;
	top: 0px;
	left: 0px;
	position: absolute;
	background-image: url(imag/animacion/imag5.fw.png);
	animation: 20s anime5 1;
	-webkit-animation: 20s anime5  infinite;
	-moz-animation: 20s anime5  infinite;
	-o-animation: 20s anime5  infinite;
	}
@keyframes anime5 {
	0%{opacity:0; }
	40%{opacity:0;}
	45%{opacity:1;}
	50%{opacity:0;}
	100%{opacity:0;}
	} 
#imag6{
	z-index:6;
	width:300px;
	height:293px;
	top: 0px;
	left: 0px;
	position: absolute;
	background-image: url(imag/animacion/imag6.fw.png);
	animation: 20s anime6 1;
	-webkit-animation: 20s anime6  infinite;
	-moz-animation: 20s anime6  infinite;
	-o-animation: 20s anime6  infinite;
	}
@keyframes anime6 {
	0%{opacity:0; }
	50%{opacity:0;}
	55%{opacity:1;}
	60%{opacity:0;}
	100%{opacity:0;}
	} 
#imag7{
	z-index:7;
	width:300px;
	height:293px;
	top: 0px;
	left: 0px;
	position: absolute;
	background-image: url(imag/animacion/imag7.fw.png);
	animation: 20s anime7 1;
	-webkit-animation: 20s anime7  infinite;
	-moz-animation: 20s anime7  infinite;
	-o-animation: 20s anime7  infinite;
	}
@keyframes anime7 {
	0%{opacity:0; }
	60%{opacity:0;}
	65%{opacity:1;}
	70%{opacity:0;}
	100%{opacity:0;}
	}
#imag8{
	z-index:8;
	width:300px;
	height:293px;
	top: 0px;
	left: 0px;
	position: absolute;
	background-image: url(imag/animacion/imag8.fw.png);
	animation: 20s anime8 1;
	-webkit-animation: 20s anime8  infinite;
	-moz-animation: 20s anime8  infinite;
	-o-animation: 20s anime8  infinite;
	}
@keyframes anime8 {
	0%{opacity:0; }
	70%{opacity:0;}
	75%{opacity:1;}
	80%{opacity:1;}
	90%{opacity:1;}
	100%{opacity:0;}
	}