.black{
    color: black;
}
body{
    color: white;
    font-family: 'Gotham-Light';
    font-style: normal;
    /* font-weight: 300; */
    font-size: 24px;
    line-height: 30px;
    background-color: #000;
}
.quitar_padding{
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.header-bg{
    background-image: url("../img/bg-header.jpg");
    background-position: left center;
    background-size: cover;
    background-repeat: no-repeat;
}
.bg_card1{
    background-image: url("../img/bg_card1.png");
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
}
.bg_card2{
    background-image: url("../img/bg_card2.png");
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    min-height: 420px;
}
.bg_card3{
    background-image: url("../img/bg_card3.png");
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    min-height: 420px;
}

.logo{
    height: 30px;
}

.bold{
    font-family: 'Gotham-Black';
}

h1{
    font-size: 55px;
    line-height: normal;
    text-transform: capitalize;
}

a{
    color: #fff;
    text-decoration: none;
}

.header-parrafo{
    font-size: 24px;
    line-height: 30px;
}

.parrafo3{
    font-size: 19px;
    line-height: 30px;
}

.parrafo4{
    font-size: 13px;
    line-height: 30px;
}


.btn{
    font-family: 'Gotham-Black';
    border-radius: 50px;
    border: 2px solid #000;
    background: #FFF;
    color: #000008;
    text-align: center;
    font-size: 14px;
    font-weight: 700;
    line-height: 25px; /* 156.25% */
    padding-left: 30px;
    padding-right: 30px;
}

.btn:hover{
    border: 2px solid #FFF;
    color: #FFF;
    background: #000;
}
.header-nota{
    font-size: 12px;
    font-weight: 300;
    line-height: 18px; /* 150% */
}
.contador{
    font-size: 18px;
    font-family: 'Gotham-Black';
    height: 40px;
    width: 40px;
    background-color: #FFF;
    color: #000;
    border-radius: 25px;
    line-height: 40px;
}
.contador-section{
    height: 200px;
    color: #000;
    background-color:#FFF;
}

.contador-texto{
    color: #000;
    font-size: 20px;
    font-family: 'Gotham-Black';
    line-height: 25px; /* 125% */
}
.contador-dial{
    color: #000;
    font-size: 55px;
    font-family: 'Gotham-Black';
    line-height: normal;
    text-transform: capitalize;

}
.contador-unidad{
    color: #000;
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-family: 'Gotham-Black';
    line-height: 25px; /* 178.571% */
}

  .inches-box{
      box-sizing: border-box;
      background: rgba(29, 29, 29, 0.3);
      border: 1px solid #212121;
      backdrop-filter: blur(20px);
      -webkit-backdrop-filter: blur(20px);
      border-radius: 15px;
  }
  .inches-box-title{
      text-align: center;
      font-size: 55px;
      font-style: normal;
      font-weight: 700;
  }

  .como-participar-textos{
      font-size: 18px;
      font-style: normal;
      line-height: 20px;
  }

  .inches-box-normal{
      font-size: 14px;
      font-style: normal;
      line-height: 15px;
  }

  .inches-box-sub-title{
      font-size: 20px;
      font-style: normal;
      font-weight: 700;
      line-height: 70px;
  }

  .titulo-instrucciones{
      font-size: 55px;
      font-style: normal;
      font-weight: 300;
      line-height: normal;
      text-transform: capitalize;
  }
  .subtitulo-instrucciones{
      font-size: 20px;
      font-weight: 400;
      line-height: 25px; /* 125% */
  }

  .content-section {
      padding: 20px;
      display: flex; /* Añadido para el centrado */
      align-items: center; /* Centra verticalmente el contenido de la columna */
      justify-content: center; /* Centra horizontalmente el contenido de la columna */
  }

  .custom-row-height{
      min-height: 340px; /* Asegura una altura mínima para el centrado vertical */
      border-radius: 8px;
      box-shadow: 0 4px 8px rgba(0,0,0,0.1);
  }
  .form-check-input{
      border-radius: 5px;
      background: transparent;
      border: 0.5px solid #848484;
      color: #fff;
  }
  .form-control{
      border-radius: 5px;
      background: transparent;
      border: 0.5px solid #848484;
      color: #fff;
  }
  .form-select{
      --bs-form-select-bg-img: url(../img/sl.svg) !important;
      background-image: var(--bs-form-select-bg-img), var(--bs-form-select-bg-icon, none);
      border-radius: 5px;
      border: 0.5px solid #848484;
      background-color: transparent;
      color: #fff;
      font-family: 'Gotham-Light';
      font-size:13px;
      min-height: 38px;
  }
  option{
      color: #000;
      font-family: 'Gotham-Light';
      font-size:13px;
  }
  .form-select:disabled {
      background-color: #464646;
  }
  .form-control:focus{
      background: transparent;
      border: 0.5px solid #848484;
      color: #fff;
  }

  .bg-sec-frm{
      background-image: url("../img/bg-frm.png");
      background-position: top center;
      background-size:100% auto;
      background-repeat: no-repeat;
  }

  input[type="file"]::file-selector-button {
          display: none;
  }
  input[type="file"]{
    background-image: url(../img/up.svg);
    background-repeat: no-repeat;
    background-position: right calc(.375em + .1875rem) center;
    background-size: calc(.75em + .375rem) calc(.75em + .375rem);
    min-height: 38px;
    font-family: 'Gotham-Light';
    font-size:13px;
  }
  input[type="file"]:focus{
    background-image: url(../img/up.svg);
    background-repeat: no-repeat;
    background-position: right calc(.375em + .1875rem) center;
    background-size: calc(.75em + .375rem) calc(.75em + .375rem);
  }

  input.fechas{
    background-image: url(../img/año.svg);
    background-repeat: no-repeat;
    background-position: right calc(.375em + .1875rem) center;
    background-size: calc(.75em + 5rem) calc(.75em + .375rem);
  }
  input.fechas:focus{
    background-image: url(../img/año.svg);
    background-repeat: no-repeat;
    background-position: right calc(.375em + .1875rem) center;
    background-size: calc(.75em + 5rem) calc(.75em + .375rem);
  }

  /* Estilos personalizados para el formulario */
  .error {
      color: #dc3545;
      font-size: 12px;
      /* margin-top: 0; */
  }

  .form-control.error,
  .form-select.error {
      border-color: #dc3545;
  }

  .form-control.valid,
  .form-select.valid {
      border-color: #198754;
  }

  /* Estilo para el datepicker */
  .ui-datepicker {
      z-index: 1060 !important; /* Asegura que el datepicker aparezca sobre otros elementos */
  }

 input[type="checkbox"] {
   margin-top: 9px;
  font-size: 18px;
}
 input[type="checkbox"].error {
  border-color: #dc3545;
  font-size: 18px;
}

span#terminos-error {
  display: none !important;
}
span#privacidad-error {
  display: none !important;
}

.altocard {
  height: 100vh;
}

.form-control::-moz-placeholder {
  font-family: Gotham-Light;
  color: #fff;
  font-size: 13px;
}
.form-control:-ms-input-placeholder,
.form-control:-ms-textarea-placeholder {
  font-family: Gotham-Light;
  color: #fff;
  font-size: 13px;
}
.form-control::-webkit-input-placeholder,
.form-control::-webkit-textarea-placeholder {
  font-family: Gotham-Light;
  color: #fff;
  font-size: 13px;
}
.loader {
  width: 45px;
  height: 45px;
  border: dotted 6px #ff6568;
  margin: 0 auto;
  border-radius: 100%;
  animation-name: turn;
  animation-duration: 1.5s;
  animation-play-state: running;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;
  animation-direction: normal;
}
@keyframes turn {
  from {
    transform: rotateZ(0deg);
  }
  to {
    transform: rotateZ(-360deg);
  }
}

@media (min-height: 820px) {
}
@media (max-width: 1300px) {
  /*
  .header-parrafo{
      font-size: 20px;
  }
      */
}
@media (max-width: 1200px) {
  h1{
      font-size: 48px;
  }
  /*
  .header-parrafo{
      font-size: 22px;
  }
  */
  .parrafo3{
      font-size: 18px;
  }

  .parrafo4{
      font-size: 12px;
  }
  .contador-dial{
    font-size: 45px;
  }
  .inches-box-normal{
      /*font-size: 13px;*/
  }
  .altocard {
    height: 90vh;
  }
  .form-control::-moz-placeholder {
    font-size: 12px;
  }
  .form-control:-ms-input-placeholder,
  .form-control:-ms-textarea-placeholder {
    font-size: 12px;
  }
  .form-control::-webkit-input-placeholder,
  .form-control::-webkit-textarea-placeholder {
    font-size: 12px;
  }
  .form-select{
      font-size:12px;
  }
  option{
      font-size:12px;
  }
}

@media (max-width: 990px) {
  h1{
      font-size: 42px;
  }
  /*
  .header-parrafo{
      font-size: 20px;
  }
  */
  .parrafo3{
      font-size: 16px;
  }

  .parrafo4{
      font-size: 11px;
  }
  .contador-dial{
    font-size: 35px;
  }
  .inches-box-normal{
      /*font-size: 12px;*/
  }
  .altocard {
    height: 60vh;
  }
  .form-control::-moz-placeholder {
    font-size: 11px;
  }
  .form-control:-ms-input-placeholder,
  .form-control:-ms-textarea-placeholder {
    font-size: 11px;
  }
  .form-control::-webkit-input-placeholder,
  .form-control::-webkit-textarea-placeholder {
    font-size: 11px;
  }
  .form-select{
      font-size:11px;
  }
  option{
      font-size:11px;
  }
  .img_cards{
    max-width: 190px;
  }
  .altocard {
    height: 70vh;
  }
}

.banner-auto-fix{
    margin-top: -150px; 
    margin-bottom: -225px;
}

@media (max-width: 768px) {
  .banner-auto-fix{
    margin-top: unset; 
    margin-bottom: unset;
}

  .altocard {
    height: 40vh;
  }
  .img_cards{
    max-width: 130px;
  }
  .header-bg{
      background-image:  url("../img/bg-header-mb.jpg");
      background-position: top center;
      background-size: cover;
  }
  .bg_card1{
      /*background-image: none;*/
  }
}
.hidden-text-input {
  color: transparent;
}