body { 
overflow: hidden;
margin: 0px;
padding: 0;
 background: #1f7ea5;
}

.Wrapper{width:1024px; margin: 0 auto; background: url(../images/mapa_off.png) no-repeat center top; padding:0px; position: relative; min-height: 768px;}


#volumen{
    -webkit-appearance: none;
    background-color: black;
    height:3px;
    width:65px;
    position:absolute;
    left:280px;
    top:22px;
}
 
#volumen::-webkit-slider-thumb {
    -webkit-appearance: none;
    position: relative;
    top: -1px;
    z-index: 1;
    width: 11px;
    height: 11px; 
    -webkit-border-radius: 40px;
    -moz-border-radius: 40px;
    border-radius: 40px;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#3F5F6D), color-stop(50%,#3F5F6D), color-stop(51%,#3F5F6D), color-stop(100%,#d5ebfb));
}

/*DIEGO*/
.play-Region-audio{
    width: 28px;
    height: 27px;
    display: block;
    background: url(../images/play-btn.png);
    position: absolute;
    left: 215px;
    top:15px;
}
.play-Region-audio.pause{
    background: url(../images/pause-btn.png);   
}


/**
ANIMACIONES REGIONES**/

.mapa{

}


#bruncatexto{
    
    
    width:74px;
    height:23px;
    position:absolute;
    left:640px;
    top:440px;
    display:block;
    z-index:800000000;
}


#bruncaresaltado{
    
    background:url("../images/brunca1.png") no-repeat;
    width:241px;
    height:242px;
    position:absolute;
    left:563px;
    top:372px;
    display:none;
    z-index:800000000;
}

#chorotegatexto{
    
    
    width:103px;
    height:27px;
    position:absolute;
    left:230px;
    top:220px;
    display:block;
    z-index:800000000;
}


#chorotegaresaltado{
    background:url("../images/chorotega1.png") no-repeat;
    width:241px;
    height:242px;
    position:absolute;
    left:190px;
    top:110px;
    display:none;
    z-index:800000000;
}

#pacificocentraltexto{
    
    
    width:81px;
    height:43px;
    position:absolute;
    left:410px;
    top:340px;
    display:block;
    z-index:800000000;
}

#pacificocentralresaltado{
    
    background:url("../images/PC1.png") no-repeat;
    width:282px;
    height:174px;
    position:absolute;
    left:313px;
    top:245px;
    display:none;
    z-index:800000000;
}


#centraltexto{
    width:83px;
    height:25px;
    position:absolute;
    left:510px;
    top:325px;
    display:block;
    z-index:800000000;
}

#centralresaltado{
    
    background:url("../images/central_color1.png") no-repeat;
    width:268px;
    height:158px;
    position:absolute;
    left:413px;
    top:242px;
    display:none;
    z-index:800000000;
}

#nortetexto{
    width:72px;
    height:42px;
    position:absolute;
    left:440px;
    top:200px;
    display:block;
    z-index:800000000;
}

#norteresaltado{
    
    background:url("../images/HN1.png") no-repeat;
    width:338px;
    height:168px;
    position:absolute;
    left:275px;
    top:130px;
    display:none;
    z-index:800000000;
}


#atlanticotexto{
    
    
    width:100px;
    height:43px;
    position:absolute;
    left:650px;
    top:300px;
    display:block;
    z-index:800000000;
}

#atlanticoresaltado{
    
    background:url("../images/HA1.png") no-repeat;
    width:275px;
    height:298px;
    position:absolute;
    left:553px;
    top:149px;
    display:none;
    z-index:800000000;
}



#pacifico_centralpop{
    background:url("../images/fondo_blanco.png");
    width:1024px;
    height:768px;
    position:absolute;
    top:0;
    left:0;
    
    z-index:100000;
    
}

#huetaratlantico{
    background:url("../images/fondo_blanco.png");
    width:1024px;
    height:768px;
    position:absolute;
    top:0;
    left:0;
    
    z-index:100000;
    
}

#pdf{
    position:absolute;
    top:11px;
    left:99px;
}

#equisBarra{
    position:absolute;
    top:15px;
    left:255px;
}

#playBarra{
    position:absolute;
    top:8px;
    left:205px;
}

#pausaBarra{
    position:absolute;
    top:11px;
    left:245px;
}

#triviaBarra {
    position:absolute;
    top:11px;
    left:10px;
    
}

#muteBarra {
    position:absolute;
    top:8px;
    left:385px;
    
}

#nomuteBarra {
    position:absolute;
    top:8px;
    left:385px;
    
}



#BarraBottom{
background:url("../images/barra-w.png");
position:absolute;
width:297px;
height:58px;
top:690px;
left:350px;
z-index:40000000000;
}

#BarraBottom > img:hover{ cursor: pointer; }


#textoMono{
    background:url("../images/fauna.png");
    position:absolute;
    width:404px;
    height:159px;
    top:30px;
    left:560px;
    display:none;
    z-index:300000;
}

.cerrarTexto{
    background:url("../images/btn.png");
    position:absolute;
    width:21px;
    height:21px;
    top:10px;
    left:370px;
    z-index:400000;
}

#imagenPalmera{
    background:url("../images/04.png");
    position:absolute;
    width:586px;
    height:586px;
    top:165px;
    left:415px;
    opacity:100;

    -webkit-animation-name: mypalmera;
    -webkit-animation-duration: 3.5s;
    -webkit-animation-delay: 0s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: linear,ease-out;
    -webkit-animation-direction: normal;


    -moz-animation-name: mypalmera;
    -moz-animation-duration: 3.5s;
    -moz-animation-delay: 0s;
    -moz-animation-iteration-count: 1;
    -moz-animation-timing-function: linear;
    -moz-animation-direction: normal;

    -ms-animation-name: mypalmera;
    -ms-animation-duration: 3.5s;
    -ms-animation-delay: 0s;
    -ms-animation-iteration-count: 1;
    -ms-animation-timing-function: linear;
    -ms-animation-direction: normal;
}

@keyframes mypalmera
{
    0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
   
}
@-webkit-keyframes mypalmera /* Safari and Chrome */
{
   0% {
        
		opacity:0;
        
    }
 
   
 
    25% 
    {
        
        opacity:100;
        
    }
    
}  

@-moz-keyframes mypalmera /* Safari and Chrome */
{
    0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
} 

@-ms-keyframes mypalmera /* Safari and Chrome */
{
    0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
}   

#textoPalmera{
    background:url("../images/vegetacion.png");
    position:absolute;
    width:444px;
    height:177px;
    top:500px;
    left:555px;
    display:none;
    z-index:300000;
}

.cerrarTextoPalmera{
    background:url("../images/btn.png");
    position:absolute;
    width:21px;
    height:21px;
    top:10px;
    left:410px;
    z-index:400000;
}

#imagenAlmendro{
    background:url("../images/05.png");
    position:absolute;
    width:496px;
    height:494px;
    top:20px;
    left:20px;
    opacity:100;

    -webkit-animation-name: myalmendro;
    -webkit-animation-duration:4s;
    -webkit-animation-delay: 0s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: linear,ease-out;
    -webkit-animation-direction: normal;


    -moz-animation-name: myalmendro;
    -moz-animation-duration:4s;
    -moz-animation-delay: 0s;
    -moz-animation-iteration-count: 1;
    -moz-animation-timing-function: linear;
    -moz-animation-direction: normal;

    -ms-animation-name: myalmendro;
    -ms-animation-duration: 4s;
    -ms-animation-delay: 0s;
    -ms-animation-iteration-count: 1;
    -ms-animation-timing-function: linear;
    -ms-animation-direction: normal;
}


@keyframes myalmendro
{
    0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
}
@-webkit-keyframes myalmendro /* Safari and Chrome */
{
    0% {
        
		opacity:0;
        
    }
 
    35% {
        
        opacity:100;       
    }
 
    
}  

@-moz-keyframes myalmendro /* Safari and Chrome */
{
    0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
} 

@-ms-keyframes myalmendro /* Safari and Chrome */
{
    0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
}   

#textoAlmendro{
    background:url("../images/relieveYclima.png");
    position:absolute;
    width:434px;
    height:122px;
    top:30px;
    left:30px;
    display:none;
    z-index:300000;
}

.cerrarTextoAlmendro{
    background:url("../images/btn.png");
    position:absolute;
    width:21px;
    height:21px;
    top:10px;
    left:400px;
    z-index:400000;
}


#imagenPesca{
    background:url("../images/08.png");
    position:absolute;
    width:513px;
    height:437px;
    top:313px;
    left:23px;

    -webkit-animation-name: mypesca;
    -webkit-animation-duration: 11s;
    -webkit-animation-delay: 0s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: linear,ease-out;
    -webkit-animation-direction: normal;


    -moz-animation-name: mypesca;
    -moz-animation-duration: 11s;
    -moz-animation-delay: 0s;
    -moz-animation-iteration-count: 1;
    -moz-animation-timing-function: linear;
    -moz-animation-direction: normal;

    -ms-animation-name: mypesca;
    -ms-animation-duration: 11s;
    -ms-animation-delay: 0s;
    -ms-animation-iteration-count: 1;
    -ms-animation-timing-function: linear;
    -ms-animation-direction: normal;
}


@keyframes mypesca
{
    0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
}
@-webkit-keyframes mypesca /* Safari and Chrome */
{
    0% {
        
		opacity:0;
        
    }
 
    27% {
        
        opacity:100;       
    }
 
    
}  

@-moz-keyframes mypesca /* Safari and Chrome */
{
    0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
} 

@-ms-keyframes mypesca /* Safari and Chrome */
{
    0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
} 

#textoPesca{
    background:url("../images/poblacion.png");
    position:absolute;
    width:434px;
    height:126px;
    top:535px;
    left:50px;
    display:none;
    z-index:300000;
}

.cerrarTextoPesca{
    background:url("../images/btn.png");
    position:absolute;
    width:21px;
    height:21px;
    top:10px;
    left:400px;
    z-index:400000;
}

#imagenPuerto{
    background:url("../images/puerto_03.png");
    position:absolute;
    width:542px;
    height:543px;
    top:17px;
    left:270px;
    opacity:100;

    -webkit-animation-name: mypuerto;
    -webkit-animation-duration: 12s;
    -webkit-animation-delay: 0s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: linear;
    -webkit-animation-direction: normal;


    -moz-animation-name: mypuerto;
    -moz-animation-duration: 12s;
    -moz-animation-delay: 0s;
    -moz-animation-iteration-count: 1;
    -moz-animation-timing-function: linear;
    -moz-animation-direction: normal;

    -ms-animation-name: mypuerto;
    -ms-animation-duration: 12s;
    -ms-animation-delay: 0s;
    -ms-animation-iteration-count: 1;
    -ms-animation-timing-function: linear;
    -ms-animation-direction: normal;
}


@keyframes mypuerto
{
    0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
}
@-webkit-keyframes mypuerto /* Safari and Chrome */
{
    0% {
        
		opacity:0;
        
    }
 
    15% {
        
        opacity:100;       
    }
 
    
}  

@-moz-keyframes mypuerto /* Safari and Chrome */
{
    0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
} 

@-ms-keyframes mypuerto /* Safari and Chrome */
{
    0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
} 

#textoPuerto{
    background:url("../images/economia.png");
    position:absolute;
    width:384px;
    height:97px;
    top:270px;
    left:350px;
    display:none;
    z-index:300000;
}

.cerrarTextoPuerto{
    background:url("../images/btn.png");
    position:absolute;
    width:21px;
    height:21px;
    top:10px;
    left:350px;
    z-index:400000;
}
















#imagenlimonense{
    
    position:absolute;
    opacity:100;
    top:20px;
    left:518px;
    width:487px;
    height:356px;
    background:url("../images/nina_limonense_03.png");
    

    -webkit-animation-name: mymono;
    -webkit-animation-duration: 1s;
    -webkit-animation-delay: 0s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: linear,ease-out;
    -webkit-animation-direction: normal;


    -moz-animation-name: mymono;
    -moz-animation-duration: 1s;
    -moz-animation-delay: 0s;
    -moz-animation-iteration-count: 1;
    -moz-animation-timing-function: linear;
    -moz-animation-direction: normal;

    -ms-animation-name: mymono;
    -ms-animation-duration: 1s;
    -ms-animation-delay: 0s;
    -ms-animation-iteration-count: 1;
    -ms-animation-timing-function: linear;
    -ms-animation-direction: normal;
    
    
}

@keyframes mymono
{
    0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
 
    
}
@-webkit-keyframes mymono /* Safari and Chrome */
{
   0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
 
    
}  

@-moz-keyframes mymono /* Safari and Chrome */
{
    0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
 
   
} 

@-ms-keyframes mymono /* Safari and Chrome */
{
   0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }

}   


#textolimonense{
    background:url("../images/poblacion1.png");
    position:absolute;
    width:468px;
    height:142px;
    top:120px;
    left:530px;
    display:none;
    z-index:300000;
}

.cerrarTextolimonense{
    background:url("../images/btn.png");
    position:absolute;
    width:21px;
    height:21px;
    top:10px;
    left:430px;
    z-index:400000;
}

#imagenbosque{
    background:url("../images/HA_0o.png");
    position:absolute;
    width:487px;
    height:356px;
    top:20px;
    left:20px;
    opacity:100;

    -webkit-animation-name: mypalmera;
    -webkit-animation-duration: 3.5s;
    -webkit-animation-delay: 0s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: linear,ease-out;
    -webkit-animation-direction: normal;


    -moz-animation-name: mypalmera;
    -moz-animation-duration: 3.5s;
    -moz-animation-delay: 0s;
    -moz-animation-iteration-count: 1;
    -moz-animation-timing-function: linear;
    -moz-animation-direction: normal;

    -ms-animation-name: mypalmera;
    -ms-animation-duration: 3.5s;
    -ms-animation-delay: 0s;
    -ms-animation-iteration-count: 1;
    -ms-animation-timing-function: linear;
    -ms-animation-direction: normal;
}

@keyframes mypalmera
{
    0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
   
}
@-webkit-keyframes mypalmera /* Safari and Chrome */
{
   0% {
        
		opacity:0;
        
    }
 
   
 
    25% 
    {
        
        opacity:100;
        
    }
    
}  

@-moz-keyframes mypalmera /* Safari and Chrome */
{
    0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
} 

@-ms-keyframes mypalmera /* Safari and Chrome */
{
    0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
}   

#textobosque{
    background:url("../images/relieve1.png");
    position:absolute;
    width:448px;
    height:142px;
    top:120px;
    left:30px;
    display:none;
    z-index:300000;
}

.cerrarTextobosque{
    background:url("../images/btn.png");
    position:absolute;
    width:21px;
    height:21px;
    top:10px;
    left:410px;
    z-index:400000;
}

#imagentortuga{
    background:url("../images/HA_03.png");
    position:absolute;
    width:487px;
    height:356px;
    top:390px;
    left:20px;
    opacity:100;

    -webkit-animation-name: myalmendro;
    -webkit-animation-duration:4s;
    -webkit-animation-delay: 0s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: linear,ease-out;
    -webkit-animation-direction: normal;


    -moz-animation-name: myalmendro;
    -moz-animation-duration:4s;
    -moz-animation-delay: 0s;
    -moz-animation-iteration-count: 1;
    -moz-animation-timing-function: linear;
    -moz-animation-direction: normal;

    -ms-animation-name: myalmendro;
    -ms-animation-duration: 4s;
    -ms-animation-delay: 0s;
    -ms-animation-iteration-count: 1;
    -ms-animation-timing-function: linear;
    -ms-animation-direction: normal;
}


@keyframes myalmendro
{
    0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
}
@-webkit-keyframes myalmendro /* Safari and Chrome */
{
    0% {
        
		opacity:0;
        
    }
 
    35% {
        
        opacity:100;       
    }
 
    
}  

@-moz-keyframes myalmendro /* Safari and Chrome */
{
    0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
} 

@-ms-keyframes myalmendro /* Safari and Chrome */
{
    0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
}   

#textotortuga{
    background:url("../images/fauna1.png");
    position:absolute;
    width:433px;
    height:159px;
    top:500px;
    left:33px;
    display:none;
    z-index:300000;
}

.cerrarTextotortuga{
    background:url("../images/btn.png");
    position:absolute;
    width:21px;
    height:21px;
    top:10px;
    left:400px;
    z-index:400000;
}


#imagenbanano{
    background:url("../images/banano_03.png");
    position:absolute;
    width:487px;
    height:356px;
    top:390px;
    left:519px;

    -webkit-animation-name: mypesca;
    -webkit-animation-duration: 11s;
    -webkit-animation-delay: 0s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: linear,ease-out;
    -webkit-animation-direction: normal;


    -moz-animation-name: mypesca;
    -moz-animation-duration: 11s;
    -moz-animation-delay: 0s;
    -moz-animation-iteration-count: 1;
    -moz-animation-timing-function: linear;
    -moz-animation-direction: normal;

    -ms-animation-name: mypesca;
    -ms-animation-duration: 11s;
    -ms-animation-delay: 0s;
    -ms-animation-iteration-count: 1;
    -ms-animation-timing-function: linear;
    -ms-animation-direction: normal;
}


@keyframes mypesca
{
    0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
}
@-webkit-keyframes mypesca /* Safari and Chrome */
{
    0% {
        
		opacity:0;
        
    }
 
    27% {
        
        opacity:100;       
    }
 
    
}  

@-moz-keyframes mypesca /* Safari and Chrome */
{
    0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
} 

@-ms-keyframes mypesca /* Safari and Chrome */
{
    0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
} 

#textobanano{
    background:url("../images/vegetacion1.png");
    position:absolute;
    width:424px;
    height:133px;
    top:500px;
    left:540px;
    display:none;
    z-index:300000;
}

.cerrarTextobanano{
    background:url("../images/btn.png");
    position:absolute;
    width:21px;
    height:21px;
    top:10px;
    left:390px;
    z-index:400000;
}









#textocasas{
    background:url("../images/poblacionC.png");
    position:absolute;
    width:294px;
    height:125px;
    top:580px;
    left:210px;
    display:none;
    z-index:300000;
}

.cerrarTextocasas{
    background:url("../images/btn.png");
    position:absolute;
    width:21px;
    height:21px;
    top:10px;
    left:260px;
    z-index:400000;
}

  

#textocafe{
    background:url("../images/agriculturaC.png");
    position:absolute;
    width:254px;
    height:95px;
    top:380px;
    left:630px;
    display:none;
    z-index:300000;
}

.cerrarTextocafe{
    background:url("../images/btn.png");
    position:absolute;
    width:21px;
    height:21px;
    top:10px;
    left:220px;
    z-index:400000;
}
    

   

#textocordillera{
    background:url("../images/relieveyclimaC.png");
    position:absolute;
    width:345px;
    height:198px;
    top:350px;
    left:30px;
    display:none;
    z-index:300000;
}

.cerrarTextocordillera{
    background:url("../images/btn.png");
    position:absolute;
    width:21px;
    height:21px;
    top:10px;
    left:310px;
    z-index:400000;
}




#textotorres{
    background:url("../images/industriaC.png");
    position:absolute;
    width:225px;
    height:94px;
    top:580px;
    left:550px;
    display:none;
    z-index:300000;
}

.cerrarTextotorres{
    background:url("../images/btn.png");
    position:absolute;
    width:21px;
    height:21px;
    top:10px;
    left:190px;
    z-index:400000;
}



#textovc{
    background:url("../images/vegetacionC.png");
    position:absolute;
    width:291px;
    height:209px;
    top:30px;
    left:30px;
    display:none;
    z-index:300000;
}

.cerrarTextovc{
    background:url("../images/btn.png");
    position:absolute;
    width:21px;
    height:21px;
    top:10px;
    left:260px;
    z-index:400000;
}

#textoyiguirro{
    background:url("../images/faunaC.png");
    position:absolute;
    width:239px;
    height:247px;
    top:30px;
    left:720px;
    display:none;
    z-index:300000;
}

.cerrarTextoyiguirro{
    background:url("../images/btn.png");
    position:absolute;
    width:21px;
    height:21px;
    top:10px;
    left:200px;
    z-index:400000;
}

#textoecon{
    background:url("../images/economiaC.png");
    position:absolute;
    width:194px;
    height:123px;
    top:60px;
    left:415px;
    display:none;
    z-index:300000;
}

.cerrarTextoecon{
    background:url("../images/btn.png");
    position:absolute;
    width:21px;
    height:21px;
    top:10px;
    left:160px;
    z-index:400000;
}



#imagencentral {
    position:absolute;
    
    top:0px;
    left:0px;

    -webkit-animation-name: mycentral;
    -webkit-animation-duration: 5.5s;
    -webkit-animation-delay: 0s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: linear,ease-out;
    -webkit-animation-direction: normal;


    -moz-animation-name: mycentral;
    -moz-animation-duration: 5.5s;
    -moz-animation-delay: 0s;
    -moz-animation-iteration-count: 1;
    -moz-animation-timing-function: linear;
    -moz-animation-direction: normal;

    -ms-animation-name: mycentral;
    -ms-animation-duration: 5.5s;
    -ms-animation-delay: 0s;
    -ms-animation-iteration-count: 1;
    -ms-animation-timing-function: linear;
    -ms-animation-direction: normal;

}




@keyframes mycentral
{
    0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
   
}
@-webkit-keyframes mycentral /* Safari and Chrome */

{
   0% {
        
		opacity:0;
        
    }
 
   
 
    25% 
    {
        
        opacity:100;
        
    }
    
}  

@-moz-keyframes mycentral /* mozilla */

{
    0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
} 

@-ms-keyframes mycentral  

{
    0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
}   





   

#textoarbol{
    background:url("../images/vegetacionB.png");
    position:absolute;
    width:248px;
    height:233px;
    top:30px;
    left:240px;
    display:none;
    z-index:300000;
}

.cerrarTextoarbol{
    background:url("../images/btn.png");
    position:absolute;
    width:21px;
    height:21px;
    top:10px;
    left:215px;
    z-index:400000;
}

  

#textoesfera{
    background:url("../images/relieveYclimaB.png");
    position:absolute;
    width:231px;
    height:218px;
    top:140px;
    left:770px;
    display:none;
    z-index:300000;
}

.cerrarTextoesfera{
    background:url("../images/btn.png");
    position:absolute;
    width:21px;
    height:21px;
    top:10px;
    left:200px;
    z-index:400000;
}
    

   

#textoballena{
    background:url("../images/faunaB.png");
    position:absolute;
    width:423px;
    height:159px;
    top:540px;
    left:350px;
    display:none;
    z-index:300000;
}

.cerrarTextoballena{
    background:url("../images/btn.png");
    position:absolute;
    width:21px;
    height:21px;
    top:10px;
    left:390px;
    z-index:400000;
}




#textomascara{
    background:url("../images/turismoB.png");
    position:absolute;
    width:244px;
    height:153px;
    top:45px;
    left:530px;
    display:none;
    z-index:300000;
}

.cerrarTextomascara{
    background:url("../images/btn.png");
    position:absolute;
    width:21px;
    height:21px;
    top:10px;
    left:210px;
    z-index:400000;
}



#textonina{
    background:url("../images/poblacionB.png");
    position:absolute;
    width:298px;
    height:167px;
    top:285px;
    left:45px;
    display:none;
    z-index:300000;
}

.cerrarTextonina{
    background:url("../images/btn.png");
    position:absolute;
    width:21px;
    height:21px;
    top:10px;
    left:265px;
    z-index:400000;
}










#textoarroz{
    background:url("../images/vegetacionCH.png");
    position:absolute;
    width:351px;
    height:151px;
    top:300px;
    left:580px;
    display:none;
    z-index:300000;
}

.cerrarTextoarroz{
    background:url("../images/btn.png");
    position:absolute;
    width:21px;
    height:21px;
    top:10px;
    left:320px;
    z-index:400000;
}

  

#textoguanacaste{
    background:url("../images/turismoCH.png");
    position:absolute;
    width:322px;
    height:123px;
    top:570px;
    left:50px;
    display:none;
    z-index:300000;
}

.cerrarTextoguanacaste{
    background:url("../images/btn.png");
    position:absolute;
    width:21px;
    height:21px;
    top:10px;
    left:290px;
    z-index:400000;
}
    

   

#textopuente{
    background:url("../images/poblacionCH.png");
    position:absolute;
    width:397px;
    height:127px;
    top:570px;
    left:460px;
    display:none;
    z-index:300000;
}

.cerrarTextopuente{
    background:url("../images/btn.png");
    position:absolute;
    width:21px;
    height:21px;
    top:10px;
    left:365px;
    z-index:400000;
}




#textosequia{
    background:url("../images/CHrelieveyclima.png");
    position:absolute;
    width:434px;
    height:145px;
    top:45px;
    left:220px;
    display:none;
    z-index:300000;
}

.cerrarTextosequia{
    background:url("../images/btn.png");
    position:absolute;
    width:21px;
    height:21px;
    top:10px;
    left:400px;
    z-index:400000;
}



#textovenado{
    background:url("../images/faunaCH.png");
    position:absolute;
    width:394px;
    height:159px;
    top:250px;
    left:40px;
    display:none;
    z-index:300000;
}

.cerrarTextovenado{
    background:url("../images/btn.png");
    position:absolute;
    width:21px;
    height:21px;
    top:10px;
    left:365px;
    z-index:400000;
}








#textocatarata{
    background:url("../images/vegetacionHN.png");
    position:absolute;
    width:444px;
    height:165px;
    top:460px;
    left:30px;
    display:none;
    z-index:300000;
}

.cerrarTextocatarata{
    background:url("../images/btn.png");
    position:absolute;
    width:21px;
    height:21px;
    top:10px;
    left:400px;
    z-index:400000;
}

  

#textoganado{
    background:url("../images/economiaHN.png");
    position:absolute;
    width:267px;
    height:95px;
    top:600px;
    left:650px;
    display:none;
    z-index:300000;
}

.cerrarTextoganado{
    background:url("../images/btn.png");
    position:absolute;
    width:21px;
    height:21px;
    top:10px;
    left:230px;
    z-index:400000;
}
    

   

#textopez{
    background:url("../images/faunaHN.png");
    position:absolute;
    width:408px;
    height:176px;
    top:20px;
    left:230px;
    display:none;
    z-index:300000;
}

.cerrarTextopez{
    background:url("../images/btn.png");
    position:absolute;
    width:21px;
    height:21px;
    top:10px;
    left:365px;
    z-index:400000;
}




#textopina{
    background:url("../images/agriculturaHN.png");
    position:absolute;
    width:269px;
    height:111px;
    top:270px;
    left:750px;
    display:none;
    z-index:300000;
}

.cerrarTextopina{
    background:url("../images/btn.png");
    position:absolute;
    width:21px;
    height:21px;
    top:10px;
    left:235px;
    z-index:400000;
}



#textovolcan{
    background:url("../images/relieveyclimaHN.png");
    position:absolute;
    width:454px;
    height:145px;
    top:190px;
    left:250px;
    display:none;
    z-index:300000;
}

.cerrarTextovolcan{
    background:url("../images/btn.png");
    position:absolute;
    width:21px;
    height:21px;
    top:10px;
    left:410px;
    z-index:400000;
}


#textozona{
    background:url("../images/poblacionHN.png");
    position:absolute;
    width:257px;
    height:137px;
    top:400px;
    left:550px;
    display:none;
    z-index:300000;
}

.cerrarTextozona{
    background:url("../images/btn.png");
    position:absolute;
    width:21px;
    height:21px;
    top:10px;
    left:225px;
    z-index:400000;
}

.puntarenas
{
	opacity:100;
    width:224px;
    height:226px;
	position:absolute;
	margin-top: 376px;
    left: 574px;
    
    
    /**Webkit**/
    -webkit-animation-name: puntarenas-animation;
    -webkit-animation-duration: 2s;
    -webkit-animation-delay: 0s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: linear;
    -webkit-animation-direction: normal;
    
    /**mozilla**/
    -moz-animation-name: puntarenas-animation;
    -moz-animation-duration: 2s;
    -moz-animation-delay: 0s;
    -moz-animation-iteration-count: 1;
    -moz-animation-timing-function: linear;
    -moz-animation-direction: normal;
    
    /**ms**/
    -ms-animation-name: puntarenas-animation;
    -ms-animation-duration: 2s;
    -ms-animation-delay: 0s;
    -ms-animation-iteration-count: 1;
    -ms-animation-timing-function: linear;
    -ms-animation-direction: normal;
    
    
     
    
}

@keyframes puntarenas-animation {
     0%{
        
		opacity:0;
        
    }
 
    50%{
        
        opacity:70;       
    }
 
    100%{
        
        opacity:100;
        
    }
}



/**PUNTARENAS webkit-ms-moz**/
@-webkit-keyframes puntarenas-animation {
     0%{
        
		opacity:0;
        
    }
 
    50%{
        
        opacity:70;       
    }
 
    100%{
        
        opacity:100;
        
    }
}
  

/**PUNTARENAS webkit-ms-moz**/
@-moz-keyframes puntarenas-animation {
    
	0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
       
    }
}

/**PUNTARENAS webkit-ms-moz**/
@-ms-keyframes puntarenas-animation {
     0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
}

.puntarenas1
{
	opacity: 100;
	width:273px;
    height:165px;
    position:absolute;
    left:315px;
    margin-top: 253px;
    
    /**webkit**/
    -webkit-animation-name: sanjose-animation;
    -webkit-animation-duration: 3s;
    -webkit-animation-delay: 0s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: linear;
    -webkit-animation-direction: normal;
    /**mozilla**/
    -moz-animation-name: sanjose-animation;
    -moz-animation-duration: 3s;
    -moz-animation-delay: 0s;
    -moz-animation-iteration-count: 1;
    -moz-animation-timing-function: linear;
    -moz-animation-direction: normal;
    /**ms**/
    -ms-animation-name: sanjose-animation;
    -ms-animation-duration: 3s;
    -ms-animation-delay: 0s;
    -ms-animation-iteration-count: 1;
    -ms-animation-timing-function: linear;
    -ms-animation-direction: normal;
	
	
}



/**SAN JOSÉ webkit-moz-ms**/
@keyframes sanjose-animation {
    0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
} 


@-webkit-keyframes sanjose-animation {
    0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
} 

/**SAN JOSÉ webkit-moz-ms**/
@-moz-keyframes sanjose-animation {
     0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
}

/**SAN JOSÉ webkit-moz-ms**/
@-ms-keyframes sanjose-animation {
     0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
}



.guanacaste
{
	width:218px;
    height:229px;
	opacity: 100;
    position:absolute;    
    left: 203px;
    margin-top: 113px;
	
    /**webkit**/
    -webkit-animation-name: guanacaste-animation;
    -webkit-animation-duration: 4s;
    -webkit-animation-delay: 0s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: linear;
    -webkit-animation-direction: normal;
    /**moz**/
    -moz-animation-name: guanacaste-animation;
    -moz-animation-duration: 4s;
    -moz-animation-delay: 0s;
    -moz-animation-iteration-count: 1;
    -moz-animation-timing-function: linear;
    -moz-animation-direction: normal;
    /**ms**/
    -ms-animation-name: guanacaste-animation;
    -ms-animation-duration: 4s;
    -ms-animation-delay: 0s;
    -ms-animation-iteration-count: 1;
    -ms-animation-timing-function: linear;
    -ms-animation-direction: normal;
	
	
}



/**Guanacaste webkit-moz-ms**/
@keyframes guanacaste-animation {
     0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
}


@-webkit-keyframes guanacaste-animation {
     0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
}

/**Guanacaste webkit-moz-ms**/
@-moz-keyframes guanacaste-animation {
     0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
}

/**Guanacaste webkit-moz-ms**/
@-ms-keyframes guanacaste-animation {
     0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
}

.alajuela
{
	opacity: 100;
    width:327px;
	height:157px;
    position:absolute;
    left: 282px;
    margin-top:132px;
	
    
    /**webkit**/
    -webkit-animation-name: alajuela-animation;
    -webkit-animation-duration: 6s;
    -webkit-animation-delay: 0s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: linear;
    -webkit-animation-direction: normal;
    /**moz**/
    -webkit-animation-name: alajuela-animation;
    -webkit-animation-duration: 6s;
    -webkit-animation-delay: 0s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: linear;
    -webkit-animation-direction: normal;
    /**ms**/
    -ms-animation-name: alajuela-animation;
    -ms-animation-duration: 6s;
    -ms-animation-delay: 0s;
    -ms-animation-iteration-count: 1;
    -ms-animation-timing-function: linear;
    -ms-animation-direction: normal;
	
	

}





/**alajuela webkit-moz-ms**/
@keyframes alajuela-animation {
     0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
}


@-webkit-keyframes alajuela-animation {
     0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
}

/**alajuela webkit-moz-ms**/
@-moz-keyframes alajuela-animation {
     0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
}

/**alajuela webkit-moz-ms**/
@-ms-keyframes alajuela-animation {
     0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
}

.cartago
{
	
    width:258px;
	height:151px;
    position:absolute;
    margin-left:424px;
    margin-top: 243px;
	display:block;
    /**webkit**/
    -webkit-animation-name: cartago-animation;
    -webkit-animation-duration: 7s;
    -webkit-animation-delay: 0s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: linear;
    -webkit-animation-direction: normal;
    /**moz**/
    -moz-animation-name: cartago-animation;
    -moz-animation-duration: 7s;
    -moz-animation-delay: 0s;
    -moz-animation-iteration-count: 1;
    -moz-animation-timing-function: linear;
    -moz-animation-direction: normal;
    /**ms**/
    -ms-animation-name: cartago-animation;
    -ms-animation-duration: 7s;
    -ms-animation-delay: 0s;
    -ms-animation-iteration-count: 1;
    -ms-animation-timing-function: linear;
    -ms-animation-direction: normal;
	
	
}


/**Cartago webkit-moz-ms**/
@keyframes cartago-animation {
     0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
}


@-webkit-keyframes cartago-animation {
     0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
}


/**Cartago webkit-moz-ms**/
@-moz-keyframes cartago-animation {
     0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
}

/**Cartago webkit-moz-ms**/
@-ms-keyframes cartago-animation {
    0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
}



.limon
{
	opacity: 100;
	width:264px;
	height:291px;
    position:absolute;
    margin-top: 150px;
    left: 560px;
	
    /**webkit**/
    -webkit-animation-name: limon-animation;
    -webkit-animation-duration: 5s;
    -webkit-animation-delay: 0s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: linear;
    -webkit-animation-direction: normal;
    /**moz**/
    -moz-animation-name: limon-animation;
    -moz-animation-duration: 5s;
    -moz-animation-delay: 0s;
    -moz-animation-iteration-count: 1;
    -moz-animation-timing-function: linear;
    -moz-animation-direction: normal;
     /**ms**/
    -ms-animation-name: limon-animation;
    -ms-animation-duration: 5s;
    -ms-animation-delay: 0s;
    -ms-animation-iteration-count: 1;
    -ms-animation-timing-function: linear;
    -ms-animation-direction: normal;
	
	

}



/**Limón webkit-moz-ms**/
@keyframes limon-animation {
     0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
}


@-webkit-keyframes limon-animation {
     0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
}


/**Limón webkit-moz-ms**/
@-moz-keyframes limon-animation {
    0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
}

/**Limón webkit-moz-ms**/
@-ms-keyframes limon-animation {
    0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        background-position: right;
    }
}


.mep{
margin-top:60px;
margin-left:85px;
}



.niebla
{
	 
	 left:-100px; 
	 position:absolute;
     z-index:1;
	 bottom:-50px;
	 height:200px;
    /**Webkit**/
    -webkit-animation-name: niebla-animation;
    -webkit-animation-duration: 210s;
    -webkit-animation-delay: 0s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -webkit-animation-direction: normal;
    
    animation-name: niebla-animation;
    animation-duration: 210s;
    animation-delay: 0s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    animation-direction: normal;
    
    
    /**mozilla**/
    -moz-animation-name: niebla-animation;
    -moz-animation-duration: 210s;
    -moz-animation-delay: 0s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    -moz-animation-direction: normal;
    
    /**ms**/
    -ms-animation-name: niebla-animation;
    -ms-animation-duration: 210s;
    -ms-animation-delay: 0s;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
    -ms-animation-direction: normal;
    
            
}

/**niebla webkit-moz-ms**/
@keyframes niebla-animation {
     0% {
        
		left:-650px;
        
    }
    
	50% {
        
        left: 1050px;       
    }
     
    100% 
    {
        
        left:-1100px;
		
        
    }
}






@-webkit-keyframes niebla-animation {
     0% {
        
		left:-650px;
        
    }
    
	50% {
        
        left: 1050px;       
    }
     
    100% 
    {
        
        left:-1100px;
		
        
    }
}


/**niebla webkit-moz-ms**/
@-moz-keyframes niebla-animation {
    0% {
        
		left:-650px;
        
    }
    
	50% {
        
        left: 1050px;       
    }
     
    100% 
    {
        
        left:-1100px;
        
    }
}

/**niebla webkit-moz-ms**/
@-ms-keyframes niebla-animation {
    0% {
        
		left:-650px;
        
    }
    
	50% {
        
        left: 1050px;       
    }
     
    100% 
       {
        
        left:-1100px;
        
    }
        
}



.niebla1
{
	 
	 left:-100px; 
	 position:absolute;
     z-index:1;
	 bottom:80%;
     height:217px;
    /**Webkit**/
    -webkit-animation-name: niebla1-animation;
    -webkit-animation-duration: 210s;
    -webkit-animation-delay: 0s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -webkit-animation-direction: normal;
    
    
    animation-name: niebla1-animation;
    animation-duration: 210s;
    animation-delay: 0s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    animation-direction: normal;
    
    /**mozilla**/
    -moz-animation-name: niebla1-animation;
    -moz-animation-duration: 210s;
    -moz-animation-delay: 0s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    -moz-animation-direction: normal;
    
    /**ms**/
    -ms-animation-name: niebla1-animation;
    -ms-animation-duration: 210s;
    -ms-animation-delay: 0s;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
    -ms-animation-direction: normal;
    
            
}

/**niebla webkit-moz-ms**/
@keyframes niebla1-animation {
     0% {
        
		left:-650px;
        
    }
    
	50% {
        
        left: 1050px;       
    }
     
    100% 
    {
        
        left:-1100px;
		
        
    }
}






@-webkit-keyframes niebla1-animation {
     0% {
        
		left:-650px;
        
    }
    
	50% {
        
        left: 1050px;       
    }
     
    100% 
    {
        
        left:-1100px;
		
        
    }
}


/**niebla webkit-moz-ms**/
@-moz-keyframes niebla1-animation {
    0% {
        
		left:-650px;
        
    }
    
	50% {
        
        left: 1050px;       
    }
     
    100% 
    {
        
        left:-1100px;
        
    }
}

/**niebla webkit-moz-ms**/
@-ms-keyframes niebla1-animation {
    0% {
        
		left:-650px;
        
    }
    
	50% {
        
        left: 1050px;       
    }
     
    100% 
       {
        
        left:-1100px;
        
    }
        
}



.tit_region{
width:260px;
height:143px;
position:absolute;
margin-top: 30px;
left: 713px;

/**webkit**/
    -webkit-animation-name: titregiones-animation;
    -webkit-animation-duration: 0.5s;
    -webkit-animation-delay: 0s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: linear;
    -webkit-animation-direction: normal;
    /**moz**/
    -webkit-animation-name: titregiones-animation;
    -webkit-animation-duration: 0.5s;
    -webkit-animation-delay: 0s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: linear;
    -webkit-animation-direction: normal;
    /**ms**/
    -ms-animation-name: titregiones-animation;
    -ms-animation-duration: 0.5s;
    -ms-animation-delay: 0s;
    -ms-animation-iteration-count: 1;
    -ms-animation-timing-function: linear;
    -ms-animation-direction: normal;
}

/**regiones webkit-moz-ms**/
@-webkit-keyframes titregiones-animation {
     0% {
        
		width: 0px;
        height:0px;
        
    }
 
     
    100% 
    {
		
        width:260px;
		height:143px;
        
    }
}


/**regiones webkit-moz-ms**/
@-moz-keyframes titregiones-animation {
     0% {
        
		width: 0px;
        height:50px;
        
    }
 
     
    100% 
    {
        width:224px;
		height:60px;
        
    }
}

/**regiones webkit-moz-ms**/
@-ms-keyframes titregiones-animation {
    0% {
        
		width: 0px;
        height:50px;
        
    }
 
     
    100% 
    {
        width:224px;
		height:60px;
        
    }
}




.menu1{
bottom:-550px;
margin-left:30px;
padding:0;
z-index:1;
}

.menu1 ul{

margin:0 2px;
padding-left:5px;
line-height:30px;
-moz-border-radius-topleft:5px;
-moz-border-radius-topright:5px;
-moz-border-radius-bottomleft:5px;
-moz-border-radius-bottomright:5px;

border-radius-topleft:5px;
border-radius-topright:5px;
border-radius-bottomleft:5px;
border-radius-bottomright:5px;



-webkit-border-top-left-radius:5px;
-webkit-border-top-right-radius:5px;
-webkit-border-bottom-left-radius:5px;
-webkit-border-bottom-right-radius:5px;

-ms-border-top-left-radius:5px;
-ms-border-top-right-radius:5px;
-ms-border-bottom-left-radius:5px;
-ms-border-bottom-right-radius:5px;
}

.menu1 li{
margin:5px;
padding:0;
list-style:none;
float:left;
position:relative;

-moz-border-radius-topleft:5px;
-moz-border-radius-topright:5px;
-moz-border-radius-bottomleft:5px;
-moz-border-radius-bottomright:5px;

border-radius-topleft:5px;
border-radius-topright:5px;
border-radius-bottomleft:5px;
border-radius-bottomright:5px;

-webkit-border-top-left-radius:5px;
-webkit-border-top-right-radius:5px;
-webkit-border-bottom-left-radius:5px;
-webkit-border-bottom-right-radius:5px;

-ms-border-top-left-radius:5px;
-ms-border-top-right-radius:5px;
-ms-border-bottom-left-radius:5px;
-ms-border-bottom-right-radius:5px;
}

.prueba{
margin-left:-10px;
}

.menu1 ul ul li{
background-color:#4C4C4C;
padding-right:10px;
}

.menu1 ul li a{
text-align:left;
font-family:"Arial", cursive;
text-decoration:none;
padding-left:5px;
height:30px;
width:150px;
display:block;
color:#ffffff;
font-size:11;
}

.menu1 ul ul{
	
	position:absolute;
	visibility:hidden;
	bottom:30px;
	background-color:#2B2B2B;
	z-index:1;
}

.menu1 ul li:hover ul{
	visibility:visible;
	
}

.menu1 .primertab:hover {
color:#F59000;
}

.menu1 {
position: relative;
/**webkit**/
    -webkit-animation-name: menu-animation;
    -webkit-animation-duration: 0.5s;
    -webkit-animation-delay: 0s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: linear;
    -webkit-animation-direction: normal;
    /**moz**/
    -webkit-animation-name: menu-animation;
    -webkit-animation-duration: 0.5s;
    -webkit-animation-delay: 0s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: linear;
    -webkit-animation-direction: normal;
    /**ms**/
    -ms-animation-name: menu-animation;
    -ms-animation-duration: 0.5s;
    -ms-animation-delay: 0s;
    -ms-animation-iteration-count: 1;
    -ms-animation-timing-function: linear;
    -ms-animation-direction: normal;

    animation-name: menu-animation;
    animation-duration: 0.5s;
    animation-delay: 0s;
    animation-iteration-count: 1;
    animation-timing-function: linear;
    animation-direction: normal;


}


/**menu webkit-moz-ms**/
@keyframes menu-animation {
     0% {
        opacity:0;
		bottom:-650px;
		/**-webkit-transform: rotate(0deg);**/
		        
    }
 
    
		
    100% 
    {
		opacity:100;
        bottom:-550px;
        /**-webkit-transform: rotate(360deg);**/
    }
}



@-webkit-keyframes menu-animation {
     0% {
        opacity:0;
		bottom:-650px;
		/**-webkit-transform: rotate(0deg);**/
		        
    }
 
    
		
    100% 
    {
		opacity:100;
        bottom:-550px;
        /**-webkit-transform: rotate(360deg);**/
    }
}


/**menu webkit-moz-ms**/
@-moz-keyframes titcostarica-animation {
     0% {
        opacity:0;
		bottom:-650px;
		/**-webkit-transform: rotate(0deg);**/
		        
    }
 
    
	
    100% 
    {
		opacity:100;
        bottom:-550px;
        /**-webkit-transform: rotate(360deg);**/
    }
}

/**menu webkit-moz-ms**/
@-ms-keyframes titcostarica-animation {
    0% {
        opacity:0;
		bottom:-650px;
		/**-webkit-transform: rotate(0deg);**/
		        
    }
 
 
	
    100% 
    {
		opacity:100;
        bottom:-550px;
        /**-webkit-transform: rotate(360deg);**/
    }
}


.menu1 ul li:hover li a:hover{
color:#F59000;
}

.menu1 .creditos{
margin-left:260px;
}

.olas{
position:absolute;
z-index:-1;
left:-10px;
top:-21px;
opacity:0.7;
/**webkit**/
    -webkit-animation-name: ola-animation;
    -webkit-animation-duration: 3s;
    -webkit-animation-delay: 0s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: linear;
    -webkit-animation-direction: normal;
    /**moz**/
    -moz-animation-name: ola-animation;
    -moz-animation-duration: 3s;
    -moz-animation-delay: 0s;
    -moz-animation-iteration-count: 1;
    -moz-animation-timing-function: linear;
    -moz-animation-direction: normal;
    /**ms**/
    -ms-animation-name: ola-animation;
    -ms-animation-duration: 3s;
    -ms-animation-delay: 0s;
    -ms-animation-iteration-count: 1;
    -ms-animation-timing-function: linear;
    -ms-animation-direction: normal;
}

/**ola webkit-moz-ms**/
@-webkit-keyframes ola-animation {
     0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:0.4;       
    }
 
    100% 
    {
        
        opacity:0.7;
        
    }
}


/**ola webkit-moz-ms**/
@-moz-keyframes ola-animation {
     0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
}

/**ola webkit-moz-ms**/
@-ms-keyframes ola-animation {
    0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
}


#imagencentraltrivia{
    position:absolute;
    z-index:300000000000;
    display:block;
    

    /**webkit**/
    -webkit-animation-name: trivia-animation;
    -webkit-animation-duration: 2s;
    -webkit-animation-delay: 0s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: linear;
    -webkit-animation-direction: normal;
    /**moz**/
    -moz-animation-name: trivia-animation;
    -moz-animation-duration: 2s;
    -moz-animation-delay: 0s;
    -moz-animation-iteration-count: 1;
    -moz-animation-timing-function: linear;
    -moz-animation-direction: normal;
    /**ms**/
    -ms-animation-name: trivia-animation;
    -ms-animation-duration: 2s;
    -ms-animation-delay: 0s;
    -ms-animation-iteration-count: 1;
    -ms-animation-timing-function: linear;
    -ms-animation-direction: normal;
}



@-webkit-keyframes trivia-animation {
     0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:0.4;       
    }
 
    100% 
    {
        
        opacity:1;
        
    }
}



@-moz-keyframes trivia-animation {
    0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:0.4;       
    }
 
    100% 
    {
        
        opacity:1;
        
    }
}


@-ms-keyframes trivia-animation {
    0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:0.4;       
    }
 
    100% 
    {
        
        opacity:1;
        
    }
}



#imagencheck{
    position:absolute;
    z-index:500000000000;
    left:570px;
    top:250px;
    display:none;
    opacity:0;
}

#cerrar {

position:absolute;
z-index:900000000000;
top:10px;
left:980px;
}

#imagenequis{
    position:absolute;
    z-index:500000000000;
    left:320px;
    top:250px;
    display:none;
    opacity:0;
    
}

    
  

#imagenequis2{
    position:absolute;
    z-index:500000000000;
    left:320px;
    top:500px;
    display:none;
    opacity:0;
}

#imagenequis3{
    position:absolute;
    z-index:500000000000;
    top:500px;
    left:570px;
    display:none;
    opacity:0;
}



















#imagencheckB{
    position:absolute;
    z-index:500000000000;
    left:320px;
    top:500px;
   display:none;
    opacity:0;
}



#imagenequisB{
    position:absolute;
    z-index:500000000000;
    left:320px;
    top:250px;
   display:none;
    opacity:0;
    
}

    
  

#imagenequis2B{
    position:absolute;
    z-index:500000000000;
    
     left:570px;
     top:250px;
   display:none;
    opacity:0;
}

#imagenequis3B{
    position:absolute;
    z-index:500000000000;
    top:500px;
    left:570px;
   display:none;
    opacity:0;
}












#imagencheck3B{
    position:absolute;
    z-index:500000000000;
    top:500px;
    left:570px;
   display:none;
    opacity:0;
}



#imagenequisB3{
    position:absolute;
    z-index:500000000000;
    left:320px;
    top:250px;
   display:none;
    opacity:0;
    
}

    
  

#imagenequis2B3{
    position:absolute;
    z-index:500000000000;
    
     left:570px;
     top:250px;
   display:none;
    opacity:0;
}

#imagenequis3B3{
    position:absolute;
    z-index:500000000000;
    left:320px;
    top:500px;
    
   display:none;
    opacity:0;
}



#imagencheck3B2{
    position:absolute;
    z-index:500000000000;
    top:510px;
    left:570px;
   display:none;
    opacity:0;
}



#imagenequisB32{
    position:absolute;
    z-index:500000000000;
    left:320px;
    top:260px;
   display:none;
    opacity:0;
    
}

    
  #imagencreditos
  {
  background:url("../pdf/Creditos.png");   
  width:370px;
  height:641px;
  position:absolute;
  z-index:700000000000;
  left:300px;
  top:48px;
  display:none;
  }

#imagenequis2B32{
    position:absolute;
    z-index:500000000000;
    
     left:570px;
     top:260px;
   display:none;
    opacity:0;
}

#imagenequis3B32{
    position:absolute;
    z-index:500000000000;
    left:320px;
    top:510px;
    
   display:none;
    opacity:0;
}











#imagencheck3B2-1{
    position:absolute;
    z-index:500000000000;
   left:570px;
     top:260px;
   display:none;
    opacity:0;
}



#imagenequisB32-1{
      position:absolute;
    z-index:500000000000;
     top:510px;
    left:570px;
    
   display:none;
    opacity:0;
    
}

    
  

#imagenequis2B32-1{
    position:absolute;
    z-index:500000000000;
    left:320px;
    top:260px;
     
   display:none;
    opacity:0;
}

#imagenequis3B32-1{
    position:absolute;
    z-index:500000000000;
    left:320px;
    top:510px;
    
   display:none;
    opacity:0;
}















#imagencheck3B2-2{
    position:absolute;
    z-index:500000000000;
    left:320px;
    top:510px;
   display:none;
    opacity:0;
}



#imagenequisB32-2{
    position:absolute;
    z-index:500000000000;
    left:320px;
    top:260px;
   display:none;
    opacity:0;
    
}

    
  

#imagenequis2B32-2{
    position:absolute;
    z-index:500000000000;
    
     left:570px;
     top:260px;
   display:none;
    opacity:0;
}

#imagenequis3B32-2{
    position:absolute;
    z-index:500000000000;
    
    top:510px;
    left:570px;
   display:none;
    opacity:0;
}






































#imagencheck4B{
    position:absolute;
    z-index:500000000000;
    left:320px;
    top:250px;
   display:none;
    opacity:0;
   
}



#imagenequisB4{
    position:absolute;
    z-index:500000000000;
    top:500px;
    left:570px;
    display:none;
    opacity:0;
    
}

    
  

#imagenequis2B4{
    position:absolute;
    z-index:500000000000;
    display:none;
    opacity:0;
     left:570px;
     top:250px;
   
}

#imagenequis3B4{
    position:absolute;
    z-index:500000000000;
    left:320px;
    top:500px;
    display:none;
    opacity:0;
  
}

















#color1{
    position:absolute;
    z-index:400000000000;
    left:250px;
    top:188px;
    display:none;
    
}

    

#color2{
    position:absolute;
    z-index:400000000000;
    left:518px;
    top:188px;
    display:none;
    
    
    
}

#color3{
    position:absolute;
    z-index:400000000000;
    display:none;
    left:250px;
    top:450px;
    
}

#color4{
    position:absolute;
    z-index:400000000000;
    left:518px;
    top:450px;
    display:none;
    
}








#color1Versiondos{
    position:absolute;
    z-index:400000000000;
    left:250px;
    top:218px;
    display:none;
    
}

    

#color2Versiondos{
    position:absolute;
    z-index:400000000000;
    left:518px;
    top:218px;
    display:none;
    
    
    
}

#color3Versiondos{
    position:absolute;
    z-index:400000000000;
    display:none;
    left:250px;
    top:480px;
    
}

#color4Versiondos{
    position:absolute;
    z-index:400000000000;
    left:518px;
    top:480px;
    display:none;
    
}




















#colorV1{
    position:absolute;
    z-index:400000000000;
    left:250px;
    top:208px;
    display:none;
    
}

    

#colorV2{
    position:absolute;
    z-index:400000000000;
    left:518px;
    top:208px;
    display:none;
    
    
    
}

#colorV3{
    position:absolute;
    z-index:400000000000;
    display:none;
    left:250px;
    top:470px;
    
}

#colorV4{
    position:absolute;
    z-index:400000000000;
    left:518px;
    top:470px;
    display:none;
    
}



















#siguiente {

    position:absolute;
    z-index:400000000000;
    top:700px;
    left:840px;
    opacity:0.6;
    display:none;

    -webkit-transition: all 400ms ease-in;
    -moz-transition: all 400ms ease-in;
    -ms-transition: all 400ms ease-in;

}

    #siguiente:hover {

        opacity:6;
    }
    
    
    
    
    #imagenMono1{
    
    position:absolute;
    width:401px;
    height:259px;
    top:20px;
    left:595px;
    opacity:100;
    background:url("../images/mono.png");
    z-index:60000;
    

    -webkit-animation-name: mymono;
    -webkit-animation-duration: 1s;
    -webkit-animation-delay: 0s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: linear,ease-out;
    -webkit-animation-direction: normal;


    -moz-animation-name: mymono;
    -moz-animation-duration: 1s;
    -moz-animation-delay: 0s;
    -moz-animation-iteration-count: 1;
    -moz-animation-timing-function: linear;
    -moz-animation-direction: normal;

    -ms-animation-name: mymono;
    -ms-animation-duration: 1s;
    -ms-animation-delay: 0s;
    -ms-animation-iteration-count: 1;
    -ms-animation-timing-function: linear;
    -ms-animation-direction: normal;
    
    
}

@keyframes mymono
{
    0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
 
    
}
@-webkit-keyframes mymono /* Safari and Chrome */
{
   0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
 
    
}  

@-moz-keyframes mymono /* Safari and Chrome */
{
    0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }
 
   
} 

@-ms-keyframes mymono /* Safari and Chrome */
{
   0% {
        
		opacity:0;
        
    }
 
    50% {
        
        opacity:70;       
    }
 
    100% 
    {
        
        opacity:100;
        
    }

}