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

:root {
    /* colores */
    --color--white: #fff;
    --color--black: #000;
    --color--new-black: #0D0D0D;
    --color--black-header: #262626;
    --color--green: #009900;
    --color--spring-green: #A8B400;
    --color--ui-green: #008a00;
    --color--red: #E60000;
    --color--grey: #4A4D4E;
    --color--dark-grey: #333;
    --color--extra-dark-grey: #25282B;
    --color--ligth-grey: #666;
    --color--extra-ligth-grey: #F2F2F2;
    --color--turquoise: #007C92;
    --color--turquoise-ligth: #0096AD;
    --color--aqua-blue: #00B0CA;
    --color--aubergine: #5E2750;
    --color--red-violet: #9C2AA0;
    --color--fresh-orange: #EB9700;
    --color--lemon-yellow: #FECB00;
    --color--orange: #EB6100;
    --color--maroon: #990000;
    --color--red-christmas: #bd0000;
    /* Yu */
    --color--yu: linear-gradient(to top right, #e60000 40%, #e60000 20%, #9c2aa0 55%, #00b0ca);
    /* TV */
    --color--fileteBg: linear-gradient(to top right, #e60000 40%, #820000 90%);
    --color--cine-fans: #0096ad;
    --color--sports: #00697c;
    --color--family-fans: #fecb00;
    --color--serie-fans: #b04a98;
    --color--serie-lovers: #5e2750;
    --color--documentales: #b7bf10;
    --color--family-lovers: #eb6100;
    --color--netflix: #9c2aa0;
    --color--deportes: #007C92;
    /* fuentes */
    --font-ligth: 'VodafoneLight', Arial, sans-serif;
    --font-bold: 'VodafoneBold', Arial, sans-serif;
    --font-regular: 'VodafoneRegular', arial, sans-serif;
    /* paddings */
    --padding-rate: 16px;
}


/* Clases de utilidad */


/* colores */

.vf-color-primary,
.vf-color-red {
    color: var(--color--red);
}

.vf-color--white {
    color: var(--color--white);
}

.vf-color--new-black {
    color: var(--color--new-black);
}

.vf-color-grey {
    color: var(--color--grey);
}

.vf-color-dark-grey {
    color: var(--color--dark-grey);
}

.vf-color-ligth-grey {
    color: var(--color--ligth-grey);
}

.vf-color-extra-dark-grey {
    color: var(--color--extra-dark-grey);
}

.vf-color-turquoise {
    color: var(--color--turquoise);
}

.vf-color-aqua-blue {
    color: var(--color--aqua-blue);
}

.vf-color-aubergine {
    color: var(--color--aubergine);
}

.vf-color-red-violet {
    color: var(--color--red-violet);
}

.vf-color-spring-green {
    color: var(--color--spring-green);
}

.vf-color-fresh-orange {
    color: var(--color--fresh-orange);
}

.vf-color-lemon-yellow {
    color: var(--color--lemon-yellow);
}

.vf-color-orange {
    color: var(--color--orange);
}

.vf-color-red-christmas {
    color: var(--color--red-christmas);
}

.vf-color-yu {
    background-image: var(--color--yu);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.vf-bgColor-red-rates-degrede {
    color: var(--color--fileteBg);
}

/* background - color */

.vf-bgColor-red {
    background-color: var(--color--red);
}

.vf-bgColor-green {
    background-color: var(--color--green);
}

.vf-bgColor-ui-green {
    background-color: var(--color--ui-green);
}

.vf-bgColor-white {
    background-color: var(--color--white);
}

.vf-bgColor-grey {
    background-color: var(--color--grey);
}

.vf-bgColor-extra-dark-grey {
    background-color: var(--color--extra-dark-grey);
}

.vf-bgColor-dark-grey {
    background-color: var(--color--dark-grey);
}

.vf-bgColor-ligth-grey {
    background-color: var(--color--ligth-grey);
}

.vf-bgColor-extra-ligth-grey {
    background-color: var(--color--extra-ligth-grey);
}

.vf-bgColor-black {
    background-color: var(--color--black);
}

.vf-bgColor-new-black {
    background-color: var(--color--new-black);
}

.vf-bgColor-turquoise {
    background-color: var(--color--turquoise);
}

.vf-bgColor-turquoise-ligth {
    background-color: var(--color--turquoise-ligth);
}

.vf-bgColor-aqua-blue {
    background-color: var(--color--aqua-blue);
}

.vf-bgColor-aubergine {
    background-color: var(--color--aubergine);
}

.vf-bgColor-red-violet {
    background-color: var(--color--red-violet);
}

.vf-bgColor-spring-green {
    background-color: var(--color--spring-green);
}

.vf-bgColor-fresh-orange {
    background-color: var(--color--fresh-orange);
}

.vf-bgColor-lemon-yellow {
    background-color: var(--color--lemon-yellow);
}

.vf-bgColor-maroon {
    background-color: var(--color--maroon);
}

.vf-bgColor-red-christmas {
    background-color: var(--color--red-christmas);
}

.vf-bgColor-orange {
    background-color: var(--color--orange);
}

.vf-bgColor-red-degrede {
    background-image: linear-gradient(86deg, #820000, #e60000 55%, #e60000);
}

.vf-bgColor-yu {
    background-image: var(--color--yu);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

/* backgrouds con degradado */

.bg-red--degree {
    background-image: linear-gradient(45deg, #820000 0%, #E60000 100%);
}

.bg-ligth--degree {
    background-image: linear-gradient(75.17deg, #EAEAEA 23.06%, #F4F4F4 80.95%);
}

.bg-yu--degree {
    background-image: linear-gradient(80.44deg, #E60000 22.79%, #9C2AA0 82.4%);
}

.bg-new-black--degree {
    background-image: linear-gradient(45deg, #262626 0%, #262626 100%);
}

.bg-red-rates-degrede {
    background-image: var(--color--fileteBg);
}


/* backgrouds con degradado */


/* Colores TV */

.vf-peques {
    background-color: var(--color--family-fans);
}

.vf-serielovers {
    background-color: var(--color--serie-lovers);
}

.vf-documentales {
    background-color: var(--color--documentales);
}

.vf-familylovers {
    background-color: var(--color--family-lovers);
}

.vf-cinefans {
    background-color: var(--color--cine-fans);
}

.vf-seriefans {
    background-color: var(--color--serie-fans);
}

.vf-deportes {
    background-color: var(--color--deportes);
}

.vf-netflix {
    background-color: var(--color--netflix);
}


/* Colores TV */


/* Clases de utilidad */

.vf-display-desktop {
    display: none;
}

.vf-visibility-hidden {
    visibility: hidden;
}

.vf-text-align-left {
    text-align: left;
}

.vf-display-none {
    display: none;
}

.vf-no-margin-left {
    margin-left: 0;
}


/* Clases de utilidad */


/* items ocultos */

[class*="-description"].vf--hidden-visually {
    display: none;
}


/*Item tachado*/

.item--line-through {
    font-size: 14px;
    text-decoration: line-through;
}

.item--line-through--turquoise {
    color: #007C92;
}

.item--line-through--black {
    text-decoration: line-through;
    color: #333;
}

.item--line-through--ligth-grey {
    color: #666;
}


/*Item tachado*/


/* Llama gratis */

.layer-content__text a.drp-phone::before {
    content: "llama gratis ";
}


/* Llama gratis */


/*backgroun secciones*/

.section--bg-ligth {
    background: #f4f4f4;
}

.section--bg-dark {
    background: #333;
}


/*backgroun secciones*/


/*Cintillo promo banner*/

.featured__container {
    display: flex;
    gap: 8px;
}

.carousel-mobiles .featured__container {
    width: 100%;
    margin-bottom: 20px;
}

.featured__container.container--duo {
    justify-content: center;
}

.section-rates .featured__container {
    margin-left: 16px;
}

.section-rates .featured__container.container--devices {
    margin-left: 0;
}

.rate-box__content .featured {
    border-radius: 20px;
    padding: 4px 12px;
    width: fit-content;
}

.promo-device-module__container .featured {
    border-radius: 20px;
    padding: 4px 12px;
    width: fit-content;
}

.module-container .featured {
    border-radius: 20px;
    padding: 4px 12px;
    width: fit-content;
}

.banner-rate-box .featured {
    margin-top: 12px;
}

.featured__item {
    font-size: 14px;
}


/* Cintillos tv cartera */

.rate-box .features-container {
    position: relative;
}

.promo-box .featur {
    border-top-right-radius: 6px;
    border-top-left-radius: 6px;
    min-height: 8px;
    position: absolute;
    width: 100%;
    top: -24px;
}

.promo-box .featur:has(.featur__item:empty) {
    top: -8px;
}

.promo-box .featur__item {
    font-size: 14px;
    padding-left: 16px;
    height: 100%;
    line-height: 2;
    font-weight: bold;
}


/* cintillos tv cartera*/


/*Chevron carrusel*/

.slick-arrow {
    position: absolute;
    /*top: calc(50% - 40px);*/
    bottom: 0;
    z-index: 1;
    background-color: transparent;
    border: 0;
    font-size: 0;
    height: 40px;
    width: 39px;
    cursor: pointer;
    text-indent: -9999px;
    -webkit-transform: translate(0, 0);
    -moz-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
}

.slick-prev {
    /*left: 50px;*/
    background-image: url(../imgs/rates/arrow-left-ligth.png);
    background-repeat: no-repeat;
}

.slick-next {
    /*right: 50px;*/
    background-image: url(../imgs/rates/arrow-right-ligth.png);
    background-repeat: no-repeat;
}

.section--bg-ligth .slick-prev {
    /*left: 50px;*/
    background-image: url(../imgs/rates/arrow-left-dark.png);
    background-repeat: no-repeat;
}

.section--bg-ligth .slick-next {
    /*right: 50px;*/
    background-image: url(../imgs/rates/arrow-right-dark.png);
    background-repeat: no-repeat;
}


/*Align items*/

.vf-align-left {
    text-align: left;
}

.vf-align-rigth {
    text-align: right;
}

.vf-align-center {
    text-align: center;
}


/**/

.rate-box.rate-featured,
.banner-rate-box.rate-featured .banner-rate-box__content {
    position: relative;
    border: solid 2px;
}

.rate-featured.color-black,
.rate-featured.color-black .banner-rate-box__content {
    border-color: #000000;
}

.rate-featured.color-black .rate-badge {
    background-color: #000000;
}

.rate-box.rate-featured.color-turquoise,
.banner-rate-box.rate-featured.color-turquoise {
    border-color: #007C92;
}

.rate-featured.color-turquoise>.rate-badge {
    background-color: #007C92;
}

.rate-featured.color-red,
.rate-featured.color-red .banner-rate-box__content {
    border-color: #E60000;
}

.rate-featured.color-red .rate-badge {
    background-color: #E60000;
}

.rate-badge {
    height: 28px;
    width: calc(100% + 4px);
    position: absolute;
    top: -26px;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    left: -2px;
}

.rate-box {
    width: 225px;
    max-width: 100%;
}

.section-rates .section--rates__container {
    width: 100%;
    margin-bottom: 20px;
    padding-bottom: 40px;
    display: flex;
    justify-content: center;
}

.section-rates .belt {
    width: 100%;
}

a.button--white {
    color: var(--color--black);
    background-color: var(--color--white);
}


/* items flex */

.flex-row-reverse {
    flex-direction: row-reverse;
}

/* items flex */



/* buttons */

.button--green {
    background-color: var(--color--green);
    color: #fff;
}

.button--red {
    background-color: var(--color--red);
    color: #fff;
}

/* buttons */

.features-item__item-icons__container-item>img {
    border-radius: 6px;
    width: 100%;
    height: 100%;
    max-height: 40px;
}

.features-item__item-icons__container-item {
    height: 100%;
    max-width: 40px;
}

.section-banner .features-item__item-icons__container-item>img {
    border-radius: 6px;
    width: 100%;
    height: 100%;
    max-height: 40px;
}

.card-rate .list-options--item>img {
    border-radius: 6px;
    max-width: 40px;
    width: 100%;
}

@media screen and (min-width: 768px) {
    .main-tv .featured__container {
        display: flex;
        gap: 8px;
    }

    .featured__container.container--duo {
        justify-content: flex-start;
    }

    .section-rates .featured__container.container--duo {
        margin-left: 16px;
    }

    /*Align items*/
    .vf-align-left--tablet {
        text-align: left;
    }

    .vf-align-rigth--tablet {
        text-align: right;
    }

    .vf-align-center--tablet {
        text-align: center;
    }
}

@media screen and (min-width: 1024px) {

    /*Align items*/
    .vf-align-left--desktop {
        text-align: left;
    }

    .vf-align-rigth--desktop {
        text-align: right;
    }

    .vf-align-center--desktop {
        text-align: center;
    }

    .section-rates .section--rates__container {
        width: 95%;
        margin: 20px auto 0;
    }
}

@media screen and (min-width:1280px) {
    .section-rates .belt {
        width: 95%;
    }

    .section-rates .section-cobertura .belt {
        width: 100%;
    }

    /* cambios de background desktop - mobile */
    .vf-bgColor--change-turquoise-desktop {
        background-color: var(--color--turquoise);
    }

    /* cambios de background desktop - mobile */
}