* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.container {
  max-width: 1920px;
  position: relative;
  margin: 0;
  text-align: left;
  padding: 0;
}

body {
  background-color: #02052b;
  font-family: "DMSans_Reg", Arial, sans-serif;
  background-attachment: fixed;
  background-position: center center;
  background-repeat: repeat;
  color: #ffffff;
  font-weight: normal;
  font-size: 13px;
  line-height: 1.1875;
  margin: 0;
  text-align: center;
  padding: 0;
}
.ocultar {
  display: none;
  position: absolute;
  left: 1.2%;
  top: -35%;
  width: 90.5%;
  z-index: 2;
}

.mostrar {
  display: block;
  position: absolute;
  left: 40.2%;
  top: 71%;
  width: 33.1%;
  z-index: 7;
  color: #f7ff00;
  font-size: 17px;
}
.fondovisible {
  display: block;
  width: 100%;
}

.fondovisible2 {
  display: none;
}

.logo {
  position: absolute;
    left: 38.2%;
    top: 6%;
    width: 26.5%;
    z-index: 2;
}

.kit {
  position: absolute;
  left: 44.2%;
  top: 56%;
  width: 13.8%;
  z-index: 1;
}

.botonRetur {
  position: absolute;
  left: 50.8%;
  top: 1.5%;
  width: 8%;
  z-index: 1;
}

.imgbotonretur {
  width: 100%;
}

a {
  text-decoration: none;
}

a:hover {
  text-decoration: none;
}

.textIngresar {
  font-family: "DMSans_Reg", Arial, sans-serif;
  position: absolute;
  text-align: center;
  left: 31.2%;
  top: 32.5%;
  width: 42.2%;
  font-size: 2.85vw;
  letter-spacing: 0.21vw;
  color: #73c6ff;
  padding-bottom: 0.15vw;
  /* border-top: #ffffff00; */
  /* border-left: #ffffff00; */
  /* border-right: #ffffff00; */
  border-bottom: 0.2vw solid #c9c6eef2;
  background-color: #09090945;
  z-index: 1;
  font-weight: 800;
}

.olvido {
  font-family: "DMSans_Reg", Arial, sans-serif;
  position: absolute;
  left: 44.2%;
  top: 94%;
  width: 25.2%;
  font-size: 1.2vw;
  letter-spacing: 0.1vw;
  color: #8ae8ce;
  /* background-color: #00aaac70; */
  padding: 0.2vw;
  cursor: pointer;
  z-index: 5;
}

.textIntro {
  font-family: "DMSans_Reg", Arial, sans-serif;
  position: absolute;
  left: 32.2%;
  top: 41%;
  width: 40.2%;
  font-size: 1.2vw;
  letter-spacing: 0.1vw;
  color: rgb(212, 230, 225);
  padding: 0.2vw;
  cursor: pointer;
  z-index: 5;
}

.poscheck1 {
  position: absolute;
  color: #ffffff00;
  background: #ffff0000;
  border-radius: 0.3vw;
  border: 0.15vw solid #000000;
  font-size: 0.7vw;
  left: 0%;
  top: 46%;
  width: 15%;
  height: 3%;
  /* padding: 0vw 1.2vw 0.0vw 0.2vw; */
}

.recibeInfo1 {
  position: absolute;
  top: 8%;
  left: 6%;
  padding-left: 0.8vw;
}

.checkdiv {
  position: absolute;
  font-family: "DMSans_Reg", Arial, sans-serif;
  color: #8ae8ce;
  font-size: 1.3vw;
  letter-spacing: 0.1vw;
  width: 58%;
  left: 21%;
  top: 82.5%;
}

.botonLogin {
  position: absolute;
  top: 106%;
  left: 29%;
  width: 33%;
  cursor: pointer;
}

@font-face {
  font-family: "colgateReady";
  src: url("../fonts/ColgateReady-Regular.ttf");
}

@font-face {
  font-family: "colgateBold";
  src: url("../fonts/ColgateReady-Bold.ttf");
}

@font-face {
  font-family: "colgateExtra";
  src: url("../fonts/ColgateReady-ExtraLight.ttf");
}

@font-face {
  font-family: "Ridley-Grotesk";
  src: url("../assets/fonts/RidleyGrotesk-Regular.otf");
}

@font-face {
  font-family: "DeLaGothicOne_Reg";
  src: url("../assets/fonts/DELAGOTHICONE-REGULAR.TTF");
}

@font-face {
  font-family: "DMSans_Reg";
  src: url("../assets/fonts/DMSANS_reg.TTF");
}

.form-register {
  position: absolute;
  border-bottom: 0px;
  border-top: 0px;
  background: #00000000;
    background-position-x: 0%;
    background-position-y: 0%;
    background-repeat: repeat;
    background-size: auto;
  background-position: left;
  background-size: cover;
  left: 28.5%;
  top: 16%;
  width: 50%;
  height: 62%;
  z-index: 2;
}

.form-control1 {
  position: absolute;
    left: 19.65%;
    top: 50.8%;
    width: 52.2%;
    height: 9.2%;
    font-size: 1.85vw;
    font-family: "DMSans_Reg", Arial, sans-serif;
    border: 2px solid #fff;
    border-radius: 6px;
    background: #f7f7f78c;
    box-shadow: 10px 10px 15px #13044eab;
}

.form-control2 {
  position: absolute;
  left: 19.65%;
  top: 65.8%;
  width: 52.2%;
  height: 9.2%;
  font-size: 1.85vw;
  font-family: "DMSans_Reg", Arial, sans-serif;
  border: 2px solid #fff;
  border-radius: 6px;
  background: #f7f7f79e;
  box-shadow: 10px 10px 15px #19395454;
}

.form-control3 {
  position: absolute;
  left: 19.65%;
  top: 78.8%;
  width: 52.2%;
  height: 9.2%;
  font-size: 1.85vw;
  font-family: "DMSans_Reg", Arial, sans-serif;
  border: 2px solid #fff;
  border-radius: 22px;
  background: #f7f7f79e;
  box-shadow: 10px 10px 15px #19395454;
}

input {
  padding-left: 2.25vw;
  /* padding-bottom: 10px; */
}

input:focus,
select:focus {
  background: #fff;
  border: 0vw solid #a5a5a5;
  /* border-bottom: 0.2vw solid #ffffff; */
  outline: none;
  color: #000;
}

input::placeholder {
  color: #000;
  letter-spacing: 0.17vw;
  
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
  /*sirve para que a la hora de seleccionar una opcion guardada no muestre color de fondo y el color de la letra sea parecida a la anterior  */
  transition: background-color 5000s ease-in-out 0s;
  box-shadow: 0 0 0px 1000px unset;
  /* -webkit-text-fill-color: #ffffff; */
}

.inputComun {
  width: 96%;
  height: 6.6%;
  left: 1.5%;
  /* border-radius: 0.5vw; */
  font-family: "colgateReady";
  font-size: 1.2vw;
  color: #ffffff;
  background: #f8f7f700;
  padding-left: 1vw;
  border: 0vw solid #030303;
  border-bottom: 0.2vw solid #ffffff;
  letter-spacing: -0.02vw;
}

.poscorreo {
  position: absolute;
  top: 13.1%;
}

.poscontrasena {
  position: absolute;
  top: 30.2%;
}

input[type="checkbox"] {
  /* visibility: hidden;
  -moz-appearance: initial; */
}

input[type="checkbox"] + label {
  /* -moz-appearance: initial; */
  /* height: 30px; */
}

.botonsolo {
  position: absolute;
  background: #0058da;;
  left: 33.3%;
  top: 49.2%;
  width: 32.1%;
  height: 8.9%;
  font-family: "DMSans_Reg", Arial, sans-serif;
  font-size: 1.6vw;
  letter-spacing: 0.1vw;
  text-decoration: none;
  color: #fff;
  z-index: 6;
  cursor: pointer;
  border: 0;
  border-top-left-radius: 0.8vw;
  border-bottom-left-radius: 0.8vw;
  border-bottom-right-radius: 0.8vw;
  border-top-right-radius: 0.8vw;
}

@media (max-width: 575px) {

  .mostrar {
    display: block;
    position: absolute;
    left: 10.2%;
    top: 59%;
    width: 79.1%;
    z-index: 7;
    font-size: 15px;
    background: #100e0e2e;
    padding: 2%;
  }

  .textIntro {
    font-family: "DMSans_Reg", Arial, sans-serif;
    position: absolute;
    left: 17.2%;
    top: 28%;
    width: 66.2%;
    font-size: 3.2vw;
    letter-spacing: 0.1vw;
    color: rgb(212, 230, 225);
    padding: 0.2vw;
    cursor: pointer;
    z-index: 5;
    text-align: center;
  }

  .checkdiv {
    font-size: 2.8vw;
    width: 65%;
    left: 9%;
    top: 72%;
  }
  
  .poscheck1 {
    font-size: 3vw;
    left: 7.1%;
    top: 41.4%;
    width: 5%;
    height: 4%;
  }

  .recibeInfo1 {
    top: 10%;
    left: 12%;
    padding-left: 1vw;
  }

  .fondovisible2 {
    display: block;
    width: 100%;
  }
  .fondovisible {
    display: none;
  }
  .logo {
    left: 27.5%;
    top: 13%;
    width: 46.5%;
  }
  .kit {
    left: 24%;
    top: 42.4%;
    width: 50.2%;
  }
  .botonRetur {
    left: 70.8%;
    top: 9%;
    width: 25%;
  }
  .textIngresar {
    left: 14.5%;
    top: 19.7%;
    width: 73%;
    font-size: 4.75vw;
    letter-spacing: 1.1vw;
    border-bottom: 0.5vw solid #cdcaf6;
  }
  .form-register {
    left: 3%;
    top: 24%;
    width: 94%;
    height: 44%;
  }

  .form-control1 {
    left: 9.65%;
    top: 21.8%;
    width: 82.2%;
    height: 12.2%;
    font-size: 4.85vw;
    border-radius: 5px;
    background: #f7f7f7cc;
  }

  .form-control2 {
    left: 9.65%;
    top: 44.8%;
    width: 82.2%;
    height: 12.2%;
    font-size: 4.85vw;
    border-radius: 5px;
    background: #f7f7f7cc;
  }

  .form-control3 {
    left: 9.65%;
    top: 64.8%;
    width: 82.2%;
    height: 12.2%;
    font-size: 4.85vw;
    border-radius: 25px;
    background: #f7f7f7cc;
  }
  
  input:focus {
    border: 0.1vw solid #ffffff;
  }
  .inputComun {
    width: 96%;
    height: 4.5%;
    font-family: "colgateBold";
    left: 2%;
    font-size: 2.5vw;
    padding-left: 2vw;
    padding-bottom: 0.8vw;
    border-bottom: 0.5vw solid #ffffff;
  }
  .poscorreo {
    top: 4.5%;
  }
  .poscontrasena {
    top: 18.4%;
  }
  .botonsolo {
    left: 23%;
    top: 86%;
    width: 53%;
    height: 14.7%;
    font-size: 4.6vw;
    letter-spacing: 0.4vw;
    border-top-left-radius: 2.5vw;
    border-bottom-left-radius: 2.5vw;
    border-bottom-right-radius: 2.5vw;
    border-top-right-radius: 2.5vw;
  }
  .olvido {
    left: 34.2%;
    top: 78%;
    width: 34.2%;
    font-size: 4.2vw;
    letter-spacing: 0.3vw;
    padding: 0.7vw;
  }

  .botonLogin {
    top: 96%;
    left: 23%;
    width: 50%;
  }
}