@font-face{
  font-family: "lust";
  src: url("../bower_components/fonts/lust/Lust Slim.otf");
}


html{
  margin: 0;
  padding: 0;
  font-size: 16px;
}

.row {
    margin:0;
    padding: 0;
}


/*Accesibilidad*/
#herramientas-header sup{
  font-size: 1em;
  color: white;
}

#herramientas-header a{
  border: 0.01em solid white;
  background-color: transparent;
  color: white;
}


/*Menu*/

.navbar {
    background-color:#343a40 !important; 
    font-family: "Verdana"; 
    

}

.navbar .navbar-brand{
 font-family: "andalia"; 
 font-size: 1.9em !important;
 /*text-shadow: -3px 1px 0 #E96465;*/
}
.navbar span{
  color: white;
}
.navbar a{
    color: #fff;
}

.navbar a:hover{
  color: #FAB800;
}

.navbar .btn-registro{
  color: white;
  border-color: #B7B7B7;
  
}

.navbar .btn-registro:hover{
  background-color: #B7B7B7 !important;
  color: black;
}

/*registro-login*/
#documentos {
  border-left: 1px solid #fff;
  height: auto;
}

#fondo{
  background: url(../img/fondo-2026.jpg) no-repeat left center;
  background-color: #fff;
  -webkit-background-size: cover;
 -moz-background-size: cover;
 -o-background-size: cover;
 background-size: cover;
 background-attachment: fixed;
 height: 100%;
 width: 100%;
}
@media (min-width: 1600px) {
  #fondo {
    background-position: center;
    /*height: 100vh;*/
  }
}
@media screen and (max-width: 1024px) {
  #fondo {
  background: url(../img/fondo-2026.jpg) no-repeat left center;
  background-color: #fff;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  background-attachment: fixed;
  width: 100%;
  height: 100%;
  }

}


#fondo h1{
  font-size: 1.5em;
}
#fondo h2{
  font-size: 1.3em;
}
#registro{
  padding: 3%;
  color: #fff;
}
#registro .jumbotron{
  padding: 2%;
  opacity:0.9; 
  background-color: #4A7E8C;

}
#registro .img-registro{
  width: 80%;
}
#registro form label{
  color: #ffff;;
}

#registro select option{
  color: #000040;
}

#registro form .btn{
  background-color: #2B3B4D;
  color: white;

}

#documentos .btn{
  background-color: #2B3B4D;
  color: white;
}

@media only screen and (max-width: 500px) {
    .navbar .navbar-brand{
      font-size: 1.2em !important;
    }
}
/*Cuentos*/
#background-cuentos{
  background: url(../img/fondo-2026.jpg) no-repeat right center; 
  background-color: #fff;
  -webkit-background-size: cover;
 -moz-background-size: cover;
 -o-background-size: cover;
 background-size: cover;
 background-attachment: fixed;
 width: 100%;
 
}
@media (min-width: 1600px) {
  #background-cuentos {
    background-position: center;
    height: 100vh;
  }
}
#cuentos{
  padding:6%;

}

#cuentos .jumbotron{
  opacity: 0.8;
  background-color: #747CEB;
  color: #fff;
}

#cuentos .btn{
  background-color: #2B3B4D;
  color: white; 
}
#cuentos .btn:hover{
  background-color: white;
  color: black; 
}

#cuentos form label{
  color: #fff;
}

.info h2, h3{
  font-size: 1em;
} 

.list-group .list-group-item{
  background-color: #2D3E50;
}

.list-group-item i{
color: white;
}

#show_hide_password  .input-group-text{
  background-color: #2D3E50;
  border-color: #2D3E50;
  
}
#show_hide_password  .input-group-text i{
  color: #fff;
  
}

.facebook:hover{
  background-color: #0B84EE;

}

.twitter:hover{
  background-color: #1DA1F2;
}
.instagram:hover{
  background-color: #E1474B;
}


/*recuperación de contraseña*/
#rFondo{
  background: url(../img/recuperar.jpg) no-repeat center center; 
  background-color: #fff;
  -webkit-background-size: cover;
 -moz-background-size: cover;
 -o-background-size: cover;
 background-size: cover;
 background-attachment: fixed;
 width: 100%;
}
#verificar .card{
  opacity: 0.9;
 }
#verificar .card-header{
  background-color: #4A7E8C;
  color: white;
 }

#verificar .card-header{
  background-color: #4A7E8C;
  color: white;
 }


.w-30 {
width: 30%;
}

.text-black{
  color: black;
}

.text-black:hover{
  color: white;
}

/*footer*/
footer{
  font-family: "Verdana"; 
  background-color: #343a40;
  color: #DDD;
  text-align: left;
  padding: 2%;
  border-top: 4px solid rgb(39,128,175) !important;

}

footer a{
  color: #FAB800;
}

footer a:hover{
  color: #fff;
}

/*404*/
#error { 
    background-image: url("../img/fondo_404.png"); 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;

}
.error-template {padding: 40px 15px;text-align: center;}
.error-actions {margin-top:15px;margin-bottom:15px;}
.error-actions .btn { margin-right:10px; }

#error img{
    width: 30%;
    border-bottom: 1em solid #2D2A73 ;
}

#verificar {
width: 100%;
padding: 8%;

}
#verificar .btn{
  background-color: #2B3B4D;
  color: white;
  border:none;
}

.fin { 
  background: url("../img/Apertura.jpg") no-repeat center center; 
  background-color: #fff;
  -webkit-background-size: cover;
 -moz-background-size: cover;
 -o-background-size: cover;
 background-size: cover;
 background-attachment: fixed;
 width: 100%;
}


.fin .jumbotron{
  background-color: #4A7E8C;
  opacity: 0.8;
  color: #fff;
}
.fin .btn{
  background-color: #343a40;

}

 .image{
   width: 60%;
   height: 60%;
 }

 @media screen and (max-width: 575px) {
 
  .image{
       width: 35%;
       height: 35%;
       display: block;
       margin-left: auto;
       margin-right: auto;
  
      }
  }

  #preguntas .modal-header, .modal-footer{
    padding: 2%;
    background-color: #6D76B7;
    color: white;
  
  }

  #preguntas .close-white{
    color: white;
  }
  
  #bases .modal-header, .modal-footer{
    padding: 2%;
    background-color: #6D76B7;
    color: white;
  
  }

  #bases .close-white{
    color: white;
  }

   
.ocultar {
  display: none;
}

.mostrar {
  display: block;
}

#fondo-activacion{
  background: url(../img/fondo-2024-activacion.jpg) no-repeat right center;
  background-color: #fff;
  -webkit-background-size: cover;
 -moz-background-size: cover;
 -o-background-size: cover;
 background-size: cover;
 background-attachment: fixed;
 width: 100%;
}

@media (min-width: 1600px) {
  #fondo-activacion {
    background-position: center;
    height: 100vh;
  }
}
@media screen and (min-width: 912px) and (max-width: 1368px) {
  #fondo-activacion {
  background: url(../img/fondo-2024.jpg) no-repeat center center;
  background-color: #fff;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  background-attachment: fixed;
  width: 100%;
  height: 100vh;
  }

}