@font-face {
  font-family: 'GillSansInfantW01-Bold';
  src: url('../fonts/GillSansInfantW01-Bold.eot?#iefix') format('embedded-opentype'),  url('../fonts/GillSansInfantW01-Bold.woff') format('woff'), url('../fonts/GillSansInfantW01-Bold.ttf')  format('truetype'), url('../fonts/GillSansInfantW01-Bold.svg#GillSansInfantW01-Bold') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'GillSansInfantW01';
  src: url('../fonts/GillSansInfantW01.eot?#iefix') format('embedded-opentype'),  url('../fonts/GillSansInfantW01.woff') format('woff'), url('../fonts/GillSansInfantW01.ttf')  format('truetype'), url('../fonts/GillSansInfantW01.svg#GillSansInfantW01') format('svg');
  font-weight: normal;
  font-style: normal;
}



@font-face {
  font-family: 'psfonticons';
  src:  url('../fonts/psfonticons.ttf')  format('truetype');
  font-weight: normal;
  font-style: normal;

}

 .palabra_titulo1,.bloque_palabra{
	 
	 margin-bottom: 15px;
 }

 .posicion_imagen{
   position: absolute;
    top: 429px;
    z-index: 6;
    
   
 }
 .panel_final{
	 position: absolute;
    top: 25px;
    left: 228px;
    z-index: 99;
 }
 .pregunta{
	 position: absolute;
	 top: 432px;
	 left: 21px;
	 z-index: 1; 
	 font-size: 20px;
	 width:453px;
 }
 
 
 .preguntas_correctas{
	 position: absolute;
    top: 148px;
    left: 382px;
    z-index: 99;
    color: #F9FA03;
    font-size: 33px;
 }
 
 
 .preguntas_totales{
	 position: absolute;
    top: 148px;
    left: 506px;
    z-index: 99;
    color: #F9FA03;
    font-size: 33px;
 }
 .gris{
 	filter: grayscale(100%);
 }
 
 .panel_gris{
	background: #9e9e9ea1;
    width: 960px;
    height: 500px;
    position: absolute;
    top: 0;
    z-index: 99;
 }
 
 .boton_again{
	position: absolute;
    top: 211px;
    left: 398px;
    z-index: 99;
    cursor: pointer; 
 }
 .boton_yes{
	    position: absolute;
    top: 351px;
    left: 538px;
    z-index: 99;
    cursor: pointer;
 }
 
 .boton_no{
	    position: absolute;
    top: 351px;
    left: 369px;
    z-index: 99;
    cursor: pointer; 
 }
 
 
 .instruccion1{
	 position: absolute;
	 top: 5px;  
	 left: 300px;
	 z-index: 1; 
	 font-size: 20px;
	 color:#90EE90;
	 font-weight: bold;
	 
 }
 .contenedor1{
			font-family: 'GillSansInfantW01',sans-serif;
			font-size: 25px;
			border: 1px solid #a5dff9;
			margin-top: 25px;
			color: #333;
 
			-webkit-border-radius: 9px;
			-moz-border-radius: 9px;
			border-radius: 9px;
			-webkit-box-shadow: 0 4px 6px rgba(33,33,33,.45);
			-moz-box-shadow: 0 4px 6px rgba(33,33,33,.45);
			box-shadow: 0 4px 6px rgba(33,33,33,.45);		
			width: 960px;
			height: 500px;
			min-height:400px;
			
			}
			
			
			.pantalla_inicio{
				background-image: url('../images/fondo1.png');
				width: 960px;
				height: 500px;	 
			}
		
			.contenedor_limite{
 				width: 960px;
				height: 500px;	 
			}
		
			
			.pantalla_juego{
				background-image: url('../images/fondo_juego2.png');
				width: 960px;
				height: 500px;	 
			}
		
		.palabra_principal{
			font-family: 'GillSansInfantW01-Bold',sans-serif;

		}
		
		.texto_dentro{
			position: relative;
    top: -50px;
    left: 8px;
    text-align: center;
    width: 144px;
    line-height: 17px;
    padding: 4px;
		}
		.correctas{
			position: relative;
			top: -56px;
			left: -44px;
			text-align:center;
			color: #90EE90;
		}
		.incorrectas{
			position: relative;
			top: -70px;
			left: -44px;
			text-align:center;
			color: #FD0101;
		}
	 
				
		
		  .how img:hover,.iniciar img:hover {
			  width: 110%;
		  }
		  .iniciar {
				position: absolute;
				top: 234px;
				left: 409px;
				cursor: pointer;
			}
			
		 
	 .oculto{
		 display: none;
	 }
 

.col-md-8{
	    padding-left: 6px !important;
	
}

#parent { 
position: absolute;
    margin-left: 18%;
 } 
#child { 
  position: absolute; 
  right: 27px; 
  top: 32px;
   
}

.flotante{
	
	animation: float 3s ease-in-out infinite;
}

.flotante2{
	
	animation: float2 4s ease-in-out infinite;
}

@keyframes float {
	0% {
 		transform: translatey(0px);
	}
	50% {
 		transform: translatey(-30px);
	}
	100% {
 		transform: translatey(0px);
	}
}

@keyframes float2 {
	0% {
 		transform: translatey(0px);
	}
	50% {
 		transform: translatey(-20px);
	}
	100% {
 		transform: translatey(0px);
	}
}

 

@media only screen and (max-width: 800px) {
	#child{
		left: -6px !important;
     
  }
}