body{
  font-family: var(--bs-body-font-family) !important;
    font-size: var(--bs-body-font-size) !important;
    font-weight: var(--bs-body-font-weight) !important;
    line-height: var(--bs-body-line-height) !important;
}
#cuerpoLogin{
  top: 0%;
  left: 50%;
  transform: translateX(-50%);
  position: absolute;
  z-index: 900;
  

}


#cuerpoPendienteActivacion{
  font-family: calibri;
  top: 10%;
  left: 50%;
  transform: translateX(-50%);
  width: 40%;
  margin-top:5%;
  /*height: 50%;*/
  position: absolute;
  background-color: #ffffff;
  border: 2px solid #e50040;
  border-radius: 6px;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  padding: 28px;

}
#cuerpoPendienteActivacionLogin{
  font-family: calibri;
  top: 10%;
  left: 50%;
  transform: translateX(-50%);
  width: 40%;
  margin-top:5%;
  /*height: 50%;*/
  position: absolute;
  background-color: #ffffff;
  border: 2px solid #e50040;
  border-radius: 6px;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  padding: 28px;

}
.botonesUsuario {
  padding-top: 25px;
  align-items: center;
  margin: auto;
  text-align: center;
  display: flex;
  width: fit-content;
}

.botonesUsuario button {
  cursor: pointer;
  background-color: #434343;
  border: 2px solid grey;
  color: white;
  margin: 5px;
  /*width: 100px;*/
  border-radius: 5px;
  padding-top: 8px;
  padding-bottom: 8px;
  padding-left: 32px;
  padding-right: 32px;
  font-size: 1em;
}

.botonesUsuario button:hover{
background-color: #e50040;
transition-duration: 1s;
}
.botonesUsuario button:not(hover){
transition-duration: 1s;
}

.botonesUsuario button:disabled {
  opacity: 0.5; /* cambia la opacidad para indicar que el botón está deshabilitado */
  cursor: not-allowed; /* cambia el cursor para indicar que el botón no se puede hacer clic */
  pointer-events: none; /* desactiva todos los eventos del mouse para el botón */
}
.capa_logo {
  width: 100%;
  text-align: center;
}

.capa_logo img{
width: 100%;
}

#close-button-login {
cursor: pointer;
position: absolute;
top: 10px;
right: 4px;
background-color: #434343;
border: 2px solid black;
color: white;
/* otros estilos del botón */
}
#close-button-login:hover {
background-color: #f99904;
}
.close-button-login2 {
  cursor: pointer;
  position: absolute;
  top: 10px;
  right: 4px;
  background-color: #434343;
  border: 2px solid black;
  color: white;
  /* otros estilos del botón */
}
.close-button-login2:hover {
  background-color: #e50040;
}

.capa_cerrarMensaje{
  padding-right: 20px;
  text-align: right;
}

.cuerpoMensaje{
  width: 100%;
  margin-top: 10%;
}
#cuerpoRecuperar{
  top: 0%;
  z-index: 900;
  position: absolute;

}
#panelRegistro{
  top: 0%;
  z-index: 900;
  position: absolute;

}
#scrollregistro{
  overflow-y: scroll;
  scrollbar-color: rgba(0, 0, 0, .5) rgba(0, 0, 0, 0);
  scrollbar-width: thin;
}

#scrollregistro::-webkit-scrollbar{
-webkit-appearance: none;
}

#scrollregistro::-webkit-scrollbar:vertical {
  width:10px;
}

#scrollregistro::-webkit-scrollbar-button:increment,.contenedor::-webkit-scrollbar-button {
  display: none;
}

#scrollregistro::-webkit-scrollbar:horizontal {
  height: 10px;
}

#scrollregistro::-webkit-scrollbar-thumb {
  background-color: #797979;
  border-radius: 20px;
  border: 2px solid #f1f2f3;
}

#scrollregistro::-webkit-scrollbar-track {
  border-radius: 10px;
}
  
  #boton_registrate2{
  
      width: 90%;
  }
.scale-up-ver-top {
	-webkit-animation: scale-up-ver-top 0.4s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
	        animation: scale-up-ver-top 0.4s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
}
.scale-in-center {
	-webkit-animation: scale-in-center 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	        animation: scale-in-center 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

.tracking-in-expand-fwd {
	-webkit-animation: tracking-in-expand-fwd 0.8s cubic-bezier(0.215, 0.610, 0.355, 1.000) both;
	        animation: tracking-in-expand-fwd 0.8s cubic-bezier(0.215, 0.610, 0.355, 1.000) both;
}
#bordemuro{
  border-left: 2px solid red
}

#hayAvatar{
  max-height: 45vh;
}

@-webkit-keyframes scale-up-ver-top {
    0% {
      -webkit-transform: scaleY(0.4);
              transform: scaleY(0.4);
      -webkit-transform-origin: 100% 0%;
              transform-origin: 100% 0%;
    }
    100% {
      -webkit-transform: scaleY(1);
              transform: scaleY(1);
      -webkit-transform-origin: 100% 0%;
              transform-origin: 100% 0%;
    }
  }
  @keyframes scale-up-ver-top {
    0% {
      -webkit-transform: scaleY(0.4);
              transform: scaleY(0.4);
      -webkit-transform-origin: 100% 0%;
              transform-origin: 100% 0%;
    }
    100% {
      -webkit-transform: scaleY(1);
              transform: scaleY(1);
      -webkit-transform-origin: 100% 0%;
              transform-origin: 100% 0%;
    }
  }

  @-webkit-keyframes scale-in-center {
    0% {
      -webkit-transform: scale(0);
              transform: scale(0);
      opacity: 1;
    }
    100% {
      -webkit-transform: scale(1);
              transform: scale(1);
      opacity: 1;
    }
  }
  @keyframes scale-in-center {
    0% {
      -webkit-transform: scale(0);
              transform: scale(0);
      opacity: 1;
    }
    100% {
      -webkit-transform: scale(1);
              transform: scale(1);
      opacity: 1;
    }
  }

  @-webkit-keyframes tracking-in-expand-fwd {
    0% {
      letter-spacing: -0.5em;
      -webkit-transform: translateZ(-700px);
              transform: translateZ(-700px);
      opacity: 0;
    }
    40% {
      opacity: 0.6;
    }
    100% {
      -webkit-transform: translateZ(0);
              transform: translateZ(0);
      opacity: 1;
    }
  }
  @keyframes tracking-in-expand-fwd {
    0% {
      letter-spacing: -0.5em;
      -webkit-transform: translateZ(-700px);
              transform: translateZ(-700px);
      opacity: 0;
    }
    40% {
      opacity: 0.6;
    }
    100% {
      -webkit-transform: translateZ(0);
              transform: translateZ(0);
      opacity: 1;
    }
  }
  @media (max-width: 850px) {

    #bordemuro{
        border-top: 1px solid red;
        border-left: none;
        
    }
    #scrollregistro{
      height: 100vh !important;
      overflow-y: auto;
      overflow-x: hidden;
    }

    #cuerpoPendienteActivacion{
      width: 80%;
      
    
    }

    #cuerpoLogin {
      top: 0%;
      position: absolute;
      z-index: 900;
      padding-left: 0%;
      padding-right: 0%;
  }

  #panelLogin{
    height: 100vh !important;
  }

  #cardLogin{
    height: 100vh;

  }
    
}