@font-face{
  font-family: 'dinmedum';
  src: url(font/din-medium-webfont.428d9935fb11daf02bb2.woff2);
}
@font-face{
  font-family: 'direg';
  src: url(font/din-regular-webfont.7b7a5d0acbdf89ba29e7.woff2);
}
.fw-normal{
  font-family: 'direg';
}
.switch {
  position: relative;
  display: inline-block;
  width: 42px;
  height: 14px;
}
.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}
.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}
.slider:before {
  position: absolute;
  content: "";
  height: 21px;
  width: 21px;
  left: -4px;
  bottom: -4px;
  box-shadow: 0px 0px 10px 0px #0005;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slider {
  background-color: #2196F3;
}

input:focus + .slider {
  box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}
.slider.round {
  border-radius: 34px;
}
.slider.round:before {
  border-radius: 50%;
}
.carousel{
  max-width: 360px;
}
.login{
  max-width: 402px;
}
html,body{
  height: 100dvh;
}
.logo{
  height: 38px;
  margin: 15px;
}
.mujer{
  background:url(img/persona.1832d24d31d540e61533.png) no-repeat ;
  background-position-x: 10%;
  background-size:cover ;
}
h1{
  color: rgb(66, 169, 5);
  font-size: 30px;
  margin-bottom: 16px;
}
.form-control{
  height: 50px;
  font-family: 'direg';
  border-color: rgb(187, 187, 187)!important;
  border-left-color: #0071ce!important;
  border-left-width: 3px;

}
.field{
  margin-bottom: 16px;
}
.escalabe{
  width: 50%;
}
.btn-primary{
  background-color: #42a905!important;
  border-color: #42a905!important;
  height: 40px;
}
ul{
  font-size: 14px;
}
ul li a{
  color: rgb(0, 113, 206)!important;
}
body{
  background-color: #faf9f8;
}
.ojo{
  right: 16px;
  bottom: 16px;
}
.loader {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  display: block;
  margin:15px auto;
  position: relative;
  color: #42a905;
  box-sizing: border-box;
  animation: animloader 2s linear infinite;
}

@keyframes animloader {
  0% {
    box-shadow: 14px 0 0 -2px,  38px 0 0 -2px,  -14px 0 0 -2px,  -38px 0 0 -2px;
  }
  25% {
    box-shadow: 14px 0 0 -2px,  38px 0 0 -2px,  -14px 0 0 -2px,  -38px 0 0 2px;
  }
  50% {
    box-shadow: 14px 0 0 -2px,  38px 0 0 -2px,  -14px 0 0 2px,  -38px 0 0 -2px;
  }
  75% {
    box-shadow: 14px 0 0 2px,  38px 0 0 -2px,  -14px 0 0 -2px,  -38px 0 0 -2px;
  }
  100% {
    box-shadow: 14px 0 0 -2px,  38px 0 0 2px,  -14px 0 0 -2px,  -38px 0 0 -2px;
  }
}
@media (max-width:590px){
  .form-control{
    height: 40px;
  }
  .logo{
    height: 30px;
    margin:15px 0px;
  }
  form .btn{
    max-width: 100px !important;
    display: block;
    margin-left: auto;
  }
  .login{
    padding: 26px 10px 26px 10px;
  }
  .meolvide{
    font-size: 13px;
  }
}