
/*NO BORRAR*/
.instruccionb{
	width: 460px;
	height: auto;
	position: absolute;
	top: 140px;
	left: 20px;
	background: #FFFFFF;
	border-radius: 10px;
	font-size: 2em;
	box-shadow: 0 0 10px rgba(0,0,0,0.5);
	padding: 15px;
	color:#006633;
	animation:sombra 1.5s ease-out infinite;
	-webkit-animation:sombra 1.5s ease-out infinite;
	-moz-animation:sombra 1.5s ease-out infinite;
}
@keyframes sombra{
	0%{ box-shadow: 0 0 10px rgba(0,0,0,0.5);}
	30%{ box-shadow: 0 0 10px rgba(0,0,0,0);}
	30%{ box-shadow: 0 0 10px rgba(0,0,0,0);}
	100%{ box-shadow: 0 0 10px rgba(0,0,0,0.5);}
}
@-webkit-keyframes sombra{
	0%{ box-shadow: 0 0 10px rgba(0,0,0,0.5);}
	30%{ box-shadow: 0 0 10px rgba(0,0,0,0);}
	30%{ box-shadow: 0 0 10px rgba(0,0,0,0);}
	100%{ box-shadow: 0 0 10px rgba(0,0,0,0.5);}
}
@-moz-keyframes sombra{
	0%{ box-shadow: 0 0 10px rgba(0,0,0,0.5);}
	30%{ box-shadow: 0 0 10px rgba(0,0,0,0);}
	30%{ box-shadow: 0 0 10px rgba(0,0,0,0);}
	100%{ box-shadow: 0 0 10px rgba(0,0,0,0.5);}
}

.nom_tipo{
	width: 292px;
	height: 90px;
	background: url(../img/nom_tipo_uno.png);
	position: absolute;
	left: 530px;
	top: -5px;
}
/*FIN DE NO BORRAR*/
/*INFO*/
#anDosInfoUno{
	width: 325px;
	height: 108px;
	position: absolute;
	top:400px;
	left:2000px;
	z-index: 100;
	background: url(../img/andos_info_01.png);
}
.andos_info_uno{
	animation:andos_avansad 1s ease-out;
	animation-delay: 1s;
	animation-fill-mode: forwards;
	-webkit-animation:andos_avansad 1s ease-out;
	-webkit-animation-delay: 1s;
	-webkit-animation-fill-mode: forwards;
	-moz-animation:andos_avansad 1s ease-out;
	-moz-animation-delay: 1s;
	-moz-animation-fill-mode: forwards;
}
@keyframes andos_avansad{
	0%{ left: 2000px;}
	100%{ left: 400px;}
}
@-webkit-keyframes andos_avansad{
	0%{ left: 2000px;}
	100%{ left: 400px;}
}
@-moz-keyframes andos_avansad{
	0%{ left: 2000px;}
	100%{ left: 400px;}
}

#anDosInfoDos{
	width: 383px;
	height: 84px;
	position: absolute;
	top:400px;
	left:780px;
	background: url(../img/andos_info_02.png);
	opacity: 0;
	z-index: 100;
}
.andos_info_dos{
	animation:andos_avansae 3s ease-out;
	animation-fill-mode: forwards;
	animation-delay: 1s;
	animation-play-state: running;
	-webkit-animation:andos_avansae 3s ease-out;
	-webkit-animation-fill-mode: forwards;
	-webkit-animation-delay: 1s;
	-webkit-animation-play-state: running;
	-moz-animation:andos_avansae 3s ease-out;
	-moz-animation-fill-mode: forwards;
	-moz-animation-delay: 1s;
	-moz-animation-play-state: running;
}
@keyframes andos_avansae{
	0%{ opacity: 0;}
	100%{ opacity: 100;}
}
@-webkit-keyframes andos_avansae{
	0%{ opacity: 0;}
	100%{ opacity: 100;}
}
@-moz-keyframes andos_avansae{
	0%{ opacity: 0;}
	100%{ opacity: 100;}
}
/*FIN INFO*/
#andos_agua{
	width: 309px;
	height: 330px;
	text-align: center;
	background: url(../img/agua_andos_04.png),
				url(../img/agua_andos_01.png); 
	position: absolute;
	top: 210px;
	left: 800px;
	visibility: visible;
}
.andosAgua{
	animation:andos_avansaa 0.5s ease-out;
	animation-delay: 1s;
	animation-fill-mode: forwards;
	-webkit-animation:andos_avansaa 0.5s ease-out;
	-webkit-animation-delay: 1s;
	-webkit-animation-fill-mode: forwards;
	-moz-animation:andos_avansaa 0.5s ease-out;
	-moz-animation-delay: 1s;
	-moz-animation-fill-mode: forwards;
}
@keyframes andos_avansaa{
	0%{ left: 800px;}
	100%{ left: 550px;}
}
@-webkit-keyframes andos_avansaa{
	0%{ left: 800px;}
	100%{ left: 550px;}
}
@-moz-keyframes andos_avansaa{
	0%{ left: 800px;}
	100%{ left: 550px;}
}
/*animacion de arena evento*/
#andos_arena{
	width: 309px;
	height: 330px;
	top: 210px;
	left: 550px;
	position: absolute;
	background: url(../img/agua_andos_03.png);
	visibility: hidden;
	opacity: 0%;
}
.andosArena{
	animation:andos_aparecec 3s ease-out;
	animation-fill-mode: forwards;
	animation-play-state: running;
	-webkit-animation:andos_aparecec 3s ease-out;
	-webkit-animation-fill-mode: forwards;
	-webkit-animation-play-state: running;
	-moz-animation:andos_aparecec 3s ease-out;
	-moz-animation-fill-mode: forwards;
	-moz-animation-play-state: running;
}
@keyframes andos_aparecec{
	0%{opacity: 0;}
	100%{opacity: 100%;}
}
@-webkit-keyframes andos_aparecec{
	0%{opacity: 0;}
	100%{opacity: 100%;}
}
@-moz-keyframes andos_aparecec{
	0%{opacity: 0;}
	100%{opacity: 100%;}
}
/*ESPATULA APARECE*/
#andos_esp{
	width: 380px;
	height: 50px;
	top: 290px;
	left: 550px;
	position: absolute;
	background: url(../img/esp_andos_06.png)no-repeat;
	cursor: pointer;
	opacity:0;
	transform:rotate(80deg);
}
.andosEsp{
	animation:andos_aparece 0.5s ease-out;
	animation-delay: 1.5s;
	animation-fill-mode: forwards;
	-webkit-transform:rotate(80deg);
	-webkit-animation:andos_aparece 0.5s ease-out;
	-webkit-animation-delay: 1.5s;
	-webkit-animation-fill-mode: forwards;
	-moz-transform:rotate(80deg);
	-moz-animation:andos_aparece 0.5s ease-out;
	-moz-animation-delay: 1.5s;
	-moz-animation-fill-mode: forwards;
}
@keyframes andos_aparece{
	0%{ opacity: 0;}
	100%{ opacity: 100;}
}
@-webkit-keyframes andos_aparece{
	0%{ opacity: 0;}
	100%{ opacity: 100;}
}
@-moz-keyframes andos_aparece{
	0%{ opacity: 0;}
	100%{ opacity: 100;}
}
/*ESPATULA MOVIMIENTO*/
#andos_esp_dos{
	width: 380px;
	height: 50px;
	top: 290px;
	left: 550px;
	position: absolute;
	background: url(../img/esp_andos_05.png)no-repeat;
	visibility: hidden;
	transform:rotate(80deg);
}
.andosEspDos{
	animation:andos_apareceb 0.5s ease-out;
	animation-iteration-count: 6;
	animation-fill-mode: forwards;
	animation-play-state: running;
	-webkit-transform:rotate(80deg);
	-webkit-animation:andos_apareceb 0.5s ease-out;
	-webkit-animation-iteration-count: 6;
	-webkit-animation-fill-mode: forwards;
	-webkit-animation-play-state: running;
	-moz-transform:rotate(80deg);
	-moz-animation:andos_apareceb 0.5s ease-out;
	-moz-animation-iteration-count: 6;
	-moz-animation-fill-mode: forwards;
	-moz-animation-play-state: running;
}
@keyframes andos_apareceb{
	0%{left: 550px;}
	50%{left: 500px;}
	100%{left: 550px;}
}
@-webkit-keyframes andos_apareceb{
	0%{left: 550px;}
	50%{left: 500px;}
	100%{left: 550px;}
}
@-moz-keyframes andos_apareceb{
	0%{left: 550px;}
	50%{left: 500px;}
	100%{left: 550px;}
}

#andos_esp:hover{
	transform:scale(1.1) rotate(80deg);
	-webkit-transform:scale(1.1) rotate(80deg);
	-moz-transform:scale(1.1) rotate(80deg);
}

#andos_agua_dos{
	width: 309px;
	height: 330px;
	top: 210px;
	left: 800px;
	position: absolute;
	background: url(../img/agua_andos_02.png);
}

.andosAguaDos{
	animation:andos_avansab 0.5s ease-out;
	animation-delay: 1s;
	animation-fill-mode: forwards;
	-webkit-animation:andos_avansab 0.5s ease-out;
	-webkit-animation-delay: 1s;
	-webkit-animation-fill-mode: forwards;
	-moz-animation:andos_avansab 0.5s ease-out;
	-moz-animation-delay: 1s;
	-moz-animation-fill-mode: forwards;
}

@keyframes andos_avansab{
	0%{ left: 800px;}
	100%{ left: 550px;}
}
@-webkit-keyframes andos_avansab{
	0%{ left: 800px;}
	100%{ left: 550px;}
}
@-moz-keyframes andos_avansab{
	0%{ left: 800px;}
	100%{ left: 550px;}
}