@import "../media_multiple.css";

@media (min-width: 1600px) {
  .container {
    max-width: 1440px;
  }
}

@media (min-width: 1400px) {}

@media (min-width: 1200px){}

@media (min-width: 995px) {}

@media (max-width: 2000px) {}

@media (max-width: 1900px) {}

@media (max-width: 1600px) {
  /* BANNER 1600 */
  .bannerSection .promoBanner {
    min-width: 360px;
  }
  .bannerSection .promoBanner .info-banner p.main {
    font-size: 57px;
  }
  .bannerSection .promoBanner .info-banner p {
    font-size: 18px;
  }
  .bannerSection .banner-portada {
    background-size: cover;
    border-radius: 10px;
  }
  .bannerSection .formCalcBanner {
    min-width: 360px;
  }
  /* TARIFAS 1600 */
  .cardsSection .cardsContainer {
    gap: 10px;
  }
}

@media (max-width: 1400px) {
  .normalDots .slick-dots li {
    display: none;
  }
}

@media (max-width: 1300px){}

@media (max-width: 1250px){}

@media (max-width: 1200px) {
  /* BANNER 1200 */
  .bannerSection .title {
    font-size: 66px;
  }
  .bannerSection .franja-banner {
    width: 414px;
  }
  .bannerSection .franja-banner .promo {
    font-size: 21px;
  }
  .bannerSection .franja-banner .promosection .mainText {
    font-size: 24px;
  }
  /* FRANJA 1200 */
  .franjaOferta p {
    font-size: 30px;
  }
  /* CALCULADORA PASO 1200 */
  .calculadoraSection .checkSelectCalc label {
    font-size: 18px;
    width: 30%
  }
  .calculadoraSection .terminos .checkmark {
    left: 237px;
  }
  /* TARIFAS 1200 */
  .cardsSection .container {
    max-width: 100%;
  }
  .cardsSection .cardContain {
    padding: 0 0 25px 0px;
  }
}


/* ----------- TABLET ----------- */

@media (min-width: 768px) and (max-width: 1024px) {
}

/* ----------- FIN TABLET ----------- */

/* ----------- MOBILE LADSCAPE ----------- */
@media only screen and (min-device-width: 480px) 
                 and (max-device-width: 640px) 
                 and (orientation: landscape) {


}
/* ----------- FIN MOBILE LADSCAPE ----------- */


@media (max-width: 1130px) {
  /* TARIFAS 1130 */
  .cardsSection .cardsContainer .cardContain {
    margin: 10px;
    width: 400px;
  }
  .cardsSection .card .main-card {
    min-height: 333px;
  }
}

@media (max-width: 1024px) {
  footer {
    height: 116px;
  }
}

@media (max-width: 991px) {
  /* BANNER 991 */
  .bannerSection .formCalcBanner {
    min-width: 330px;
  }
  .bannerSection .promoBanner {
    min-width: 330px;
  }
  .bannerSection .banner-portada {
    display: none;
  }
  .bannerSection .promoBanner .info-banner p {
    font-size: 16px;
  }
  .bannerSection .promoBanner .info-banner p.main {
    font-size: 50px;
  }
  .bannerSection .promoBanner .price {
    font-size: 30px;
  }
  /* CALCULADORA PASOS 991 */
  .calculadoraSection.pasos .fase2 .checkSelectCalc label {
    width: 48%;
  }
  .calculadoraSection .checkSelectCalc label {
    gap: 6px;
    font-size: 18px;
    padding: 20px;
  }
  .calculadoraSection .checkSelectCalc label img {
    height: 26px;
  }
  .calculadoraSection .terminos .checkmark {
    left: 119px;
  }
}

@media(max-width: 820px) {}

@media(max-width: 767px) {
  section:not(.banner-central) {
    padding: 24px 0;
  }  
  /* BANNER 767 */
  .bannerSection {
    background-size: 96rem;
    background-position: 27% 0rem !important;
  }
  .bannerSection .bannerContainer {
    flex-direction: column;
    align-items: flex-start;
    padding: 30px 0;
    gap: 0;
  }
  .bannerSection .promoBanner {
    min-width: 330px;
    width: 100%;
    align-items: center;
    justify-content: center;
    gap: 16px;
    min-height: unset;
    background-color: unset;
    padding: 0;
  }
  .bannerSection .promoBanner .info-banner p.mancheta {
    width: 100%;
  }
  .bannerSection .promoBanner .info-banner p.main {
    font-size: 58px;
  }
  .bannerSection .promoBanner .info-banner p {
    text-align: center;
    font-size: 20px;
  }
  .bannerSection .promoBanner .price {
    font-size: 32px;
  }
  .bannerSection .formCalcBanner {
    top: 2rem;
    position: relative;
    margin: auto;
    margin-bottom: 30px;
    width: 100%;
    min-height: unset;
  }
  .bannerSection .calcBanner {
    width: 100%;
  }
  /* FRANJA 767 */
  .franjaOferta p {
    font-size: 20px;
    line-height: 1;
  }
  /* VENTAJAS 767 */
  .ventajasSection .ventajasContainer .ventaja {
    padding: 0 0 30px 0;
  }
  /* TARIFAS 767 */
  .cardsSection .cardContain {
    padding: 0;
  }
  .normalDots .slick-dots li {
    display: flex;
    color: #D9D9D9;
    background-color: white;
    border: 1px solid #D9D9D9;
    border-radius: 50px;
    font-size: 14px;
    font-weight: 400;
    max-width: unset;
    margin: 0;
  }
  .cardsSection .normalDots .slick-dots .slick-active {
    background-color: white;
    color: var(--dark-blue);
    border: 1px solid var(--dark-blue);
    color: var(--dark-blue);
  }
  /* CALCULADORA PASOS 767 */
  .calculadoraSection.pasos .img-calc-movil {
    display: block;
    background-size: cover;
    border-radius: 10px;
    height: 179px;
    width: 100%;
  }
  .calculadoraSection.pasos .checkSelectCalc {
    margin: 10px 0 0;
    justify-content: center;
  }
  .calculadoraSection.pasos .checkSelectCalc label {
    width: 32%
  }
  .calculadoraSection.pasos .fase3 .checkSelectCalc label {
    width: 48%;
  }
  .calculadoraSection.pasos .calculadoraContainer .formArea .inputForm {
    flex-direction: column;
    gap: 6px;
  }
  .calculadoraSection.pasos .calculadoraContainer .formArea .inputForm input {
    width: 100%;
  }
  .calculadoraSection.pasos .text-datos {
    font-size: 16px;
  }
  .calculadoraSection .terminos .checkmark {
    left: 27px;
  }
  /* FOTOFACTURA 767 */
  .facturaSection #formDataFactBanner .inputsContainer .factura,
  .facturaSection #formDataFactBanner .inputsContainer .phoneCont {
    width: 43%;
  }
}

@media(max-width: 576px) {
}

@media(max-width: 550px) {
  /* TARIFAS 550 */
  .cardsSection .cardsContainer .cardContain {
    width: 362px;
  }
  /* CALCULADORA PASOS 550 */
  .calculadoraSection .checkSelectCalc {
    flex-direction: column;
    gap: 5px;
  }
  .calculadoraSection.pasos .fase2 .checkSelectCalc label,
  .calculadoraSection.pasos .fase3 .checkSelectCalc label,
  .calculadoraSection.pasos .checkSelectCalc label {
    width: 100%;
  }
  .calculadoraSection.pasos .calculadoraContainer .formArea .terminos {
    display: unset;
    padding-left: 30px;
  }
  .calculadoraSection .terminos .checkmark {
    left: 0;
  }
  /* FOTOFACTURA 550 */
  .facturaSection #formDataFactBanner .envioContainer {
    width: 100%;
  }  
  .facturaSection #formDataFactBanner .inputsContainer {
    flex-direction: column;
  }
  .facturaSection #formDataFactBanner #drop_file_zone #drag_upload_file, 
  .facturaSection #formDataFactBanner #telefono {
    margin-top: 8px;
  }
  .facturaSection #formDataFactBanner .inputsContainer .factura,
  .facturaSection #formDataFactBanner .inputsContainer .phoneCont {
    max-width: unset;
    width: 100%;
  }
  .facturaSection h2 {
    font-size: 24px;
  }
}

@media(max-width: 450px) {
  /* VENTAJAS 450 */
  .ventajasSection h2, .cardsSection h2, .calculadoraSection h2, .c2c-section .c2c-container h2 {
    font-size: 24px;
  }
  /* TARIFAS 450 */
  .cardsSection .card .franjaCard {
    font-size: 16px;
  }
  .cardsSection .cardsContainer .cardContain {
    width: 320px;
  }
  .cardsSection .cardsContainer .cardContain button {
    padding: 8px 16px;
  }
  .normalDots .slick-dots li {
    padding: 5px;
    font-size: 12px;
  }
  /* C2C SECTION 450 */
  .c2c-section .c2c-container .formc2c .inputForm .input-phone {
    min-width: unset;
  }
  .c2c-section .c2c-container .formc2c .c2cForm {
    width: 100%;
  }
  /* FOOTER 450 */
  footer {
    height: 159px;
  }
  footer .footerContainer .enlaces {
    flex-direction: column;
  }
  .calculadoraSection .calculadoraContainer .formArea .terminos {
    font-size: 12px;
  }
}

@media(max-width: 378px) {
  /* BANNER 378 */
  .bannerSection .formCalcBanner {
    min-width: 300px;
    padding: 24px 16px;
  }
  .bannerSection .promoBanner {
    min-width: unset;
  }
  .bannerSection .promoBanner .info-banner p {
    font-size: 18px;
  }
  .bannerSection .formCalcBanner .inputArea .inputContainer .inputForm {
    gap: 6px;
  }
}

@media(max-width: 360px) {
  /* BANNER 360 */
  .bannerSection .promoBanner .info-banner p {
    font-size: 16px;
  }
  .bannerSection .promoBanner .info-banner p.main {
    font-size: 50px;
  }
  .bannerSection .promoBanner .price {
    font-size: 30px;
  }
  /* TARIFAS 360 */
  .cardsSection .cardsContainer .cardContain {
    width: 300px;
  }
}

@media(max-width: 340px) {
  /* TARIFAS 340 */
  .cardsSection .cardsContainer .cardContain {
    width: 280px;
  }
  .cardsSection .cardsContainer .cardContain button, 
  .cardsSection .cardsContainer .cardContain a {
    font-size: 14px;
  }
}

@media(max-width: 300px) {}