@charset "UTF-8";


 

.SrcElem { 
	background-color: #fff;
	padding: 4px;
	border-radius: 4px;
	-ms-border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;	
	box-shadow: 0px 0px 8px #999;
	-webkit-box-shadow: 0px 0px 8px #999;
	-moz-box-shadow: 0px 0px 8px #999;
}
  
.DstElem {
	/*border:1px solid  rgb(153, 0, 255);*/
}

#dest_01 {
	background-image: url('../img/actividad/d01.png');
    background-position: center;
    background-repeat: no-repeat;
}
#dest_02 {
	background-image: url('../img/actividad/d02.png');
    background-position: center;
    background-repeat: no-repeat;
}
#dest_03 {
	background-image: url('../img/actividad/d03.png');
    background-position: center;
    background-repeat: no-repeat;
}
#dest_04 {
	background-image: url('../img/actividad/d04.png');
    background-position: center;
    background-repeat: no-repeat;
}

.s_text {
 	position: absolute;
 	top: 450px;
 	left: 30px;
	width: 100%;
	height: 50px; 
}

.txt { 
	/*float: left;*/
	position:absolute;
	top: 0px;
	line-height: 50px;
	font-size: 26px;
	font-family: 'Escolar';
	text-align: center;
}

#pos1 { width: 260px; left: 0px; }
#pos2{ width: 210px; left: 260px; }
#pos3{ width: 200px; left: 490px; }
#pos4{ width: 300px; left: 670px; }



 #frame01 {
 	position:absolute;
 	top: 90px;
 	left: 100px;
 	display: none;
 }

 #frame02 {
 	position:absolute;
 	top: 90px;
 	left: 315px;
 	display: none;
 }

 #frame03 {
 	position:absolute;
 	top: 90px;
 	left: 555px;
 	display: none;
 }

 #frame04 {
 	position:absolute;
 	top: 90px;
 	left: 775px;
 	display: none;
 }

  


.buttonOK{
	background-color: rgb(0, 255, 0);
	box-shadow: 0px 0px 20px rgb(0, 255, 0);
	-webkit-box-shadow: 0px 0px 20px rgb(0, 255, 0);
	-moz-box-shadow: 0px 0px 20px rgb(0, 255, 0);
	}
		

.buttonKO{
	background-color: rgba(255,0,0,0.5);
	border-radius: 4px;
	-ms-border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	box-shadow: 0px 0px 8px rgb(255, 0, 0);
	-webkit-box-shadow: 0px 0px 8px rgb(255, 0, 0);
	-moz-box-shadow: 0px 0px 8px rgb(255, 0, 0);
	}




.anim_angel {
	animation: anim linear 6s 1; /* IE 10+ */
	-webkit-animation: anim linear 6s 1; /* Safari 4+ */
	-moz-animation:    anim linear 6s 1; /* Fx 5+ */
    -o-animation:      anim linear 6s 1; /* Opera 12+ */
	-ms-animation:      anim linear 6s 1;
}

@keyframes anim {
	from{
		}
	to {
		left: -300px;
	}	
	0%  	{
				 
			}
	50% 	{
				top: 320px;
			}	
}

@-webkit-keyframes anim {
	from{
		}
	to {
		left: -300px;
	}	

	0%  	{
				  
			}
	50% 	{
				top: 320px;
			}		
}