#tesis-login {
    width: 100%;
    height: 100vh;
    background: url(../img/fondo.jpg);
    background-attachment: fixed;
    background-size: cover;
    z-index: -1;
    padding-top:10%; 
    padding-bottom: 10%;
}

 #tesis-login .jumbotron {
	width: 80%;
	margin-left: 15%;
    background-color: #7F3242;
    color: white;
    border-radius: 10px;
    opacity: 0.9;

}

#login  .btn {
	color: black !important;
    background-color: white !important;
    border: 1px solid  #FFFFC0 ;

}

#login  button:hover {
    color: white !important;
    background-color: black !important;
}
#login  hr {
    background-color: white;
}

#info .alert{
    margin-left: 2%;
    width: 90%;
    opacity: 0.9;
}
.btn-color{
    color: black !important;
    background-color: white !important;
    border: 3px solid  #57B1DC ;
}
#formularios-tesis {
    background-color: #343a40!important;
    overflow-x: hidden;
    
}

 .white{
    color: black !important;
    background-color: white !important;
    border: 1px solid  #FFFFC0 ;
}

.color-white{
    width: 100%;
    background-color: #fff;
}

.botones{
    padding:  3% 5% 5% 5%;
    float:right;
}

#formularios-tesis .jumbotron {
    background-color: #57B1DC;
    margin: 10% 5% 5% 5%;
    border-radius: 1.2em !important;
    color: #000000;
    
}

#formulario {
    padding-top: 3%;
}
.form-group{
    padding: 2px 2px 2px 2px;
}

#informacion{
    margin: 5% 5% 15% 5%;
    color: #FFFF;
}
#informacion h2{
   font-size: 1.5em;
   text-align: center;

}

#informacion .card{
   border:none;
}
#informacion .img{
  width: 40%;
  display: block;
  margin-left: auto;
  margin-right: auto;

}

/*imagen*/

#card{
    margin-right: 15%;
}
div#imagen {
  width: 300px;
  height: 200px;
  background-size: cover;/*sólo para ejemplo*/
  background-image: url("../img/word.png");

}
div#imagen2 {
  width: 300px;
  height: 200px;
  background-size: cover;/*sólo para ejemplo*/
  background-image: url("../img/word1.png");

}
div#imagen3 {
    width: 300px;
    height: 200px;
    background-size: cover;/*sólo para ejemplo*/
    background-image: url("../img/pdf.png");
  
  }

div#inf {
  position:absolute;
  overflow:hidden;
  width: 300px;
  height: 200px;
  background-color: rgba(31, 31, 31, 0.9);
  opacity:0;
  transition: opacity 0.3s;
}

div#imagen:hover div#inf {
  opacity:1;
}

div#imagen2:hover div#inf {
  opacity:1;
}

div#imagen3:hover div#inf {
    opacity:1;
  }

p#headline {
  font-size: 1.2rem;
  text-align: left;
  margin-top: 80px;
  transition: margin-left 0.3s;
}

div#imagen:hover p#headline {
  margin-left: 90px;
}
div#imagen2:hover p#headline {
  margin-left: 90px;
}
div#imagen3:hover p#headline {
    margin-left: 90px;
  }

p#descripcion {
  font-size: 1rem;
  text-align: center;
  margin-top: 70px;
  transition: margin-top 0.4s;
}

div#imagen:hover p#descripcion {
  margin-top: 75px;
}

div#imagen2:hover p#descripcion {
  margin-top: 75px;
}
div#imagen3:hover p#descripcion {
    margin-top: 75px;
  }
  
#mostrar{
    display: none;

}

#copyrights{
    background-color: #343a40;
    padding: 1% 0 1% 0;
    color: white;
}
footer #copyrights a{
  color: #FBC115;
}
.oculto{
  color:white; 
  position:absolute !important;
  clip:rect(0.063em 0.063em 0.063em 0.063em); 
  clip:rect(0.063em,0.063em,0.063em,0.063em);
}
/*file*/
.custom-file-input ~ .custom-file-label::after {
    content: "Adjuntar";
}

@media screen and (max-width: 575px) {
#tesis-login {

    height: 100%;

}


}

sup {
    color: red;
    font-weight: bold;
}

#doc h2{
    font-size: 1em;
}
#herramientas-header sup{
    font-size: 1em;
    color: white;
}

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

#iDatos{
    display: none;
}

#btnMostrarClave{
    border-radius:0 ;
}



/*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 ;
}

a:hover{
    color: white !important;
    background-color: black !important;
}

#mantenimiento { 
 background: url("../img/trati.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%;
}

#mantenimiento .jumbotron{
  background-color: #4A7E8C;
  opacity: 0.9;
  color: #fff;

}

#mantenimiento  .container {
      display: flex;
      justify-content: center;   /* Centra horizontalmente */
      align-items: center;       /* Centra verticalmente */
      height: 100vh;             /* Toma toda la altura de la ventana */
    }