/*logo de esri*/
      .esriControlsBR{
        display: none;
      }

      .esriSimpleSlider div{
        width: 25px;
        height: 25px;
      }


      html, body, #map {
        height: 100%;
        width: 100%;
        margin: 0;
        padding: 0;
      }

            #meta {
            padding: 5px;
            position: absolute;
            left: 1%;
            top: 10%;
            width: 25%;
            height: auto;
            z-index: 40;
            background-color: rgba(0,0,0,0.3);
            color: #FFF;            
           /* border: 1px solid #FFF;*/
            -webkit-border-radius: 5px;
            -moz-border-radius: 5px;
            border-radius: 5px; 
            font-family: arial;
            font-size: 0.7em;

            animation: meta 4s forwards;
            animation-delay: 3s;
            visibility: hidden;
            opacity: 0;

          }

          #meta h3 {
            color: #FFF;
            font-size: 2em;
            text-align: center;

          }

          label{
          padding-right: 10px;
          font-size: 15px;
          }

          a{
          position: absolute;
          z-index: 999;
          bottom: 10px;
          left:10px;
          color: white;
          /*font-size: 25px;*/
          text-decoration: none;
          color:white;
          }
		  
		    #logoCenapred{
			  position: absolute;
			  bottom: 20px;
			  left:15px;
			  z-index: 5;
      }
      
      @keyframes meta {
        100% {
            visibility: visible;
            opacity: 1;
            z-index: 50;
        }
    }

/*********************************************
estilos para el input radio*/

#meta input[type="radio"]{
  display: none;
}

#meta .radio label{
  color: #3CB8E4;
  /*background: rgba(74,196,239,0.5);*/
  padding: 5px 15px 5px 42px;
  display: inline-block;
  position: relative;
  cursor: pointer;
}

#meta .radio label:hover{
  background: rgba(114,202,233,0.3);
}

/*circulo de input tipo radio*/
#meta .radio label:before{
  content: "";
  width:  14px;
  height: 14px;
  display: inline-block;
  border: 2px solid #3CB8E4;
  border-radius: 50%;
  position: absolute;
  left: 14px;
}



#meta input[type="radio"]:checked + label:before{
  content: "";
  width:  14px;
  height: 14px;
  background: #3CB8E4;
}
/*
.imagen {
  position: absolute;
  top: 50%;
  right: 10%;
  display: inline-block;
}
*/

#barra1 {
  position: absolute;
  top: 45%;
  right: 35%;
  width: 20px;
  height: 5px;
  background: #b7eef1;
  border-radius: 4px;
}

#barra2 {
  position: absolute;
  top: 50%;
  right: 35%;
  width: 20px;
  height: 5px;
  background: #74b5e8;
  border-radius: 4px;
}

#barra3 {
  position: absolute;
  top: 55%;
  right: 35%;
  width: 20px;
  height: 5px;
  background: #1f84e1;
  border-radius: 4px;
}

#barra4 {
  position: absolute;
  top: 60%;
  right: 35%;
  width: 20px;
  height: 5px;
  background: #1945b8;
  border-radius: 4px;
}

#barra5 {
  position: absolute;
  top: 65%;
  right: 35%;
  width: 20px;
  height: 5px;
  background: #070791;
  border-radius: 4px;
}

.medida1 {
  position: absolute;
  top: 40%;
  right: 10%;
  font-size: medium; 
}

.medida2 {
  position: absolute;
  top: 45%;
  right: 10%;
  font-size: medium; 
}

.medida3 {
  position: absolute;
  top: 50%;
  right: 10%;
  font-size: medium; 

}

.medida4 {
  position: absolute;
  top: 55%;
  right: 10%;
  font-size: medium; 

}

.medida5 {
  position: absolute;
  top: 60%;
  right: 10%;
  font-size: medium; 

}

#img1 {  display: none;  }
#img2 {  display: none;  }
#img3 {  display: none;  }
#img4 {  display: none;  }
#img5 {  display: none;  }
#img6 {  display: none;  }

#barras {  display: none;  }

.descripcion {
  text-align: center;
  font-size: 1.3em;
  display: block;
}

.img-simbologia {
  display: none;
}


@media only screen and (max-width: 1400px) {
  .simbologia {
    display: none;
  }

  .img-simbologia {
    display: flex;
    margin: auto;
  }

  #meta {
    font-size: 0.5em;
    width: 50%;
  }
}