* {
    color: inherit;
}

:root {
    /*COLORS*/
    --gold: rgba(171, 138, 16, 1);
    --dark-gold: rgba(108, 87, 10, 1);
    --black: rgba(28, 29, 0, 1);
    --grey: rgba(128, 154, 175, 1);
    --light-grey: rgba(155, 153, 153, 1);
    --dark-grey: rgba(112, 112, 112, 1);
    --blue: rgba(81, 121, 255, 1);
    --light-blue: rgba(235, 245, 249, 1);
    --dark-blue: rgba(0, 46, 69, 1);
    --granate: rgba(138, 0, 12, 1);
    /*FONTS*/
    --bold: 700;
    --medium: 500;
    --regular: 400;
    --font-normal: "montserrat", sans-serif;
    --font-normal-a: "montserrat-alternates", sans-serif;
    --font-special: "cinque-donne", serif;
    --font-special-pro: "cinque-donne-pro", serif;
}

body {
    background-color: #fff;
}

/*HEADER*/

.c-header.dark {
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.8), transparent);
}

.c-header .o-container {
    justify-content: flex-start;
}

/*.c-header__brand > img.small {
    display: none;
}

.c-header__brand > img.big {

}*/

.header_menu {
    display: flex;
    justify-content: end;
    flex-wrap: wrap;
    align-items: center;
    font-family: var(--font-normal);
    font-weight: var(--regular);
    text-transform: uppercase;
    color: #fff;
    background-color: var(--dark-blue);
}

    .header_menu .button {
        background-color: var(--dark-blue);
        text-decoration: none;
        color: #fff;
        font-size: 13px;
        font-weight: var(--regular);
        letter-spacing: 0.33px;
        line-height: 26px;
        cursor: pointer;
        padding: 11px;
        /*margin:-1px;*/
    }

.button.access {
    display: none;
}

.button.active {
    background-color: var(--grey) !important;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

/*fondo subpáginas************************************************/

.cabecera {
    width: 100%;
    height: 250px;
    background-image: url(../img/bg/img-cab-subportada_escudella.jpg);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.cabecera-speakers {
    width: 100%;
    height: 250px;
    background-image: url(../img/bg/img-cab-subportada-Cunillo.jpg);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.cabecera-news {
    width: 100%;
    height: 250px;
    background-image: url(../img/bg/img-cab-subportada_carne.jpg);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

/*HOME*/

.home-slider {
    width: 100%;
    height: 100vh;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    background-size: cover;
    background-position: center top;
    background-image: url(../img/bg/home-slider1.jpg?v=2);
    /*background-image: url(../img/bg/slide-mask.jpg);*/
}

.single-slide {
    width: 100%;
    height: 100vh;
    position: absolute;
    /*opacity: 0;*/
    top: 100%;
    animation: slider-up-animation;
    animation-duration: 20s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
    background-size: cover;
    background-position: center top;
}

#slide-1 {
    animation-delay: 0s;
    background-image: url(../img/bg/home-slider1.jpg?v=2);
}

#slide-2 {
    animation-delay: 5s;
    background-image: url(../img/bg/home-slider2.jpg?v=2);
}

#slide-3 {
    animation-delay: 10s;
    background-image: url(../img/bg/home-slider3.jpg?v=2);
}

#slide-4 {
    animation-delay: 15s;
    background-image: url(../img/bg/home-slider4.jpg?v=2);
}



@keyframes slider-animation {
    0% {
        opacity: 0;
    }

    6% {
        opacity: 1;
    }

    24% {
        opacity: 1;
    }

    30% {
        opacity: 0;
    }

    100% {
        opacity: 0;
    }
}

@keyframes slider-up-animation {
    0% {
        top: 100%;
    }

    5% {
        top: 0;
    }

    25% {
        top: 0;
    }

    30% {
        top: -100%;
    }

    100% {
        top: -100%;
    }
}

.home-slider > img {
    z-index: 50;
}

.aboutUs {
    background-image: url(../img/bg/sustraccion.png), url(../img/bg/sustraccion-fondo.jpg);
    background-position: top;
    background-repeat: no-repeat, no-repeat;
    background-size: 140%, 100%;
    color: var(--dark-blue);
    padding: 96px 40px 40px;
    text-align: center;
    background-color: #ebf5f9;
}

.aboutUs_intro {
}

.aboutUs_intro-subt {
    font-family: var(--font-normal);
    color: var(--dark-blue);
    font-weight: var(--regular);
    font-size: 15px;
    line-height: 28px;
    text-transform: uppercase;
}

.aboutUs_intro-tit {
    font-family: var(--font-special-pro);
    color: var(--dark-blue);
    font-weight: var(--regular);
    font-size: 40px;
    line-height: 55px;
}

.aboutUs_text {
    padding-top: 40px;
    color: var(--dark-blue);
}

.aboutUs_text-tit {
    font-family: var(--font-normal);
    color: var(--dark-blue);
    font-weight: 500;
    font-size: 24px;
    line-height: 36px;
    text-transform: uppercase;
}

.aboutUs_text-content {
    font-family: var(--font-normal);
    font-weight: var(--regular);
    color: var(--dark-blue);
    font-size: 14px;
    line-height: 20px;
    padding-top: 20px;
}

.description {
    display: flex;
    align-items: baseline;
    justify-content: center;
    padding-bottom: 40px;
    background: linear-gradient(to bottom, #ebf5f9, white);
}

.description_container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 20px;
    max-width: 1050px;
    margin: auto;
}

.cumbre {
    border-color: var(--dark-blue);
}

.fiesta {
    border-color: var(--gold);
}

.description-div {
    font-family: var(--font-normal);
    font-weight: var(--regular);
    width: 80%;
}

.description-div_text {
    border-width: 2px;
    border-style: solid;
    border-top-width: 16px;
    border-top-style: solid;
    color: var(--dark-blue);
    padding: 15px;
    display: grid;
    grid-template-columns: 1fr;
    gap: 30px;
    background-size: contain;
    background-repeat: no-repeat;
    background-color: #ebf5f9;
    box-sizing: border-box;
}

.cumbre > .description-div_text {
    text-align: right;
    border-top-color: var(--dark-blue);
    background-image: url(../img/bg/andorra_profesional.png);
    background-position: left;
    color: var(--dark-blue);
}

.fiesta > .description-div_text {
    text-align: left;
    border-top-color: var(--gold);
    background-image: url(../img/bg/andorra_popular.png);
    background-position: right;
    color: var(--dark-blue);
}

.description-div_text > h3 {
    grid-row: 1/2;
    font-size: 24px;
    line-height: 28px;
    color: var(--dark-blue);
    text-transform: uppercase;
}

.description-div_text > p {
    grid-row: 2/3;
    font-size: 14px;
    line-height: 20px;
    max-width: 180px;
    color: var(--dark-blue);
}

.cumbre > .description-div_text > p {
    margin-left: auto;
}

.description-div_text > div {
    grid-row: 3/4;
    display: flex;
    flex-direction: column;
}

.description_date {
    font-size: 24px;
    line-height: 36px;
    font-weight: var(--bold);
}

.description_hour {
    font-size: 20px;
    line-height: 25px;
}

.description_place {
    font-weight: var(--bold);
    color: var(--gold);
    font-size: 24px;
    line-height: 25px;
}

.description-div_button {
    font-size: 12px;
    line-height: 40px;
    letter-spacing: 0.3px;
    color: #fff;
    text-align: center;
    text-transform: uppercase;
    width: 186px;
    margin: auto;
}

.cumbre > .description-div_button {
    background-color: var(--dark-blue);
}

.fiesta > .description-div_button {
    background-color: var(--gold);
}

.c-detail__star {
    color: #ab8a10;
}

.o-section.o-section-program.u-bg-white.u-pt-20-xs.u-pb-20-xs.u-pb-40 > div.o-container.u-pb-40.u-pt-40 > .o-section__title {
    color: var(--gold);
    font-size: 30px;
    line-height: 36px;
    margin-top: 124px;
}

.o-section.o-section-program.u-bg-white.u-pt-20-xs.u-pb-20-xs.u-pb-40 > div.o-container.u-pb-40.u-pt-40 > p {
    max-width: 144px;
    font-size: 13px;
    line-height: 16px;
    margin-bottom: 86px;
}

.star.starInactive > polygon {
    stroke: var(--gold);
}

.o-section.o-section-program.u-bg-white.u-pt-20-xs.u-pb-20-xs.u-pb-40 > .c-form__button {
    font-size: 18px;
    width: fit-content;
    padding: 0 18px;
}

.goat {
    max-width: 268px;
    height: 160px;
    border-bottom: solid 3px var(--gold);
    overflow: hidden;
    box-sizing: border-box;
    background-image: url(../../at2022/img/cab-partners@2x.png);
    background-size: 100%;
    background-position-x: center;
    background-position-y: bottom;
    background-repeat: no-repeat;
}

    .goat > img {
        max-width: 80%;
        margin-top: -100px;
    }

.download {
    display: flex;
    flex-direction: row;
    border: solid 2px #fff;
    border-radius: 30px;
    height: 28px;
    width: fit-content;
    justify-content: center;
    align-items: center;
    padding: 0 10px;
    gap: 10px;
    margin: 15px auto 0;
}

    .download > p {
        color: #fff;
        text-transform: uppercase;
    }

.footer-img {
    position: relative;
    transform: translateX(-50%) translateY(63%);
    left: 50%;
    z-index: 500;
    width: 242px;
    max-width: 70%;
}

/*POPULAR*******************************************************************************/

.popular-intro {
    /*    background-color: var(--gold);
*/
    height: 100vh;
    background-image: url(../img/bg/bg_pag_at_popular.jpg);
    background-position-y: top;
    background-position-x: 30%;
    background-size: cover;
    /*    background-blend-mode: color-burn;
*/
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 80px;
    /*padding-top: 250px;*/
}

.popular-intro_text {
    padding-top: 100px;
}

    .popular-intro_text > p {
        color: #fff;
    }

.popular-intro_title {
    font-family: var(--font-special-pro);
    font-weight: var(--regular);
    font-size: 90px;
    text-align: center;
    line-height: 80px;
}

.popular-intro_subtitle {
    font-family: var(--font-normal);
    font-weight: var(--regular);
    font-size: 20px;
    text-align: center;
    line-height: 80px;
    text-transform: uppercase;
}

.gradient.popular {
    background: linear-gradient(to bottom, #ebf5f9, white);
    padding: -40px 40px;
    margin: auto;
    text-align: center;
}

.aboutUs_text.popular {
    display: flex;
    flex-direction: column;
}

.aboutUs_intro-subt.popular {
    font-weight: var(--bold);
    font-size: 20px;
    line-height: 25px;
    margin-bottom: 20px;
}

.aboutUs_intro-tit.popular {
    color: var(--granate);
}

.aboutUs-data {
    margin: 10px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.aboutUs-data-text {
    display: flex;
    flex-direction: column;
    gap: 10px;
    text-align: left;
}
.description_date.popular{
    padding: 0 40px;
    font-size: 28px;
    line-height: 36px;
}
.popular > .aboutUs_text-content {
    padding: 0 40px;
}
.description_hour.popular {
    padding: 0 40px;
    font-size: 28px;
    line-height: 36px;
}

.description_place.popular {
    padding: 0 40px;
    font-size: 24px;
    line-height: 36px;
}
.popular-program {
    display: flex;
    flex-direction: column;
    align-items: center;
    box-sizing: border-box;
    margin-bottom: 100px;
}

.pop-prog-div {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    margin: auto;
    width: 90%;
    max-width: 1050px;
    row-gap: 25px;
}

    .pop-prog-div > div{
        display: flex;
        width: 100%;
        justify-content: center;
    }

    .pop-prog-div_tipo {
        border-bottom: var(--gold) 5px solid;
        color: var(--gold);
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 9px;
        text-transform: uppercase;
        cursor: pointer;
        width: 100%;
        height: 100px;
    }

.active.pop-prog-div_tipo {
    border-bottom: var(--granate) 15px solid;
    margin-bottom: -10px;
    z-index: 0;
}

    .active.pop-prog-div_tipo > .pop-text {
        color: var(--granate);
    }

.logo_popular {
    max-width: 49.8px;
    max-height: 49.8px
}

    .pop-prog-div_tipo-icon {
    fill: var(--gold);
}

.active > svg > g > .pop-prog-div_tipo-icon {
    fill: var(--granate);
}

.pop-text {
    color: var(--gold);
    font-size: 14px;
    line-height: 16px;
    text-align: center;
    width: 90%;
    margin: 0 auto 15px;
}

.popular-program.container > div {
    background: linear-gradient(var(--light-blue), transparent);
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 30px;
    width: 100vw;
    max-width: 100vw;
}

.tapa {
    width: 100%;
    box-sizing: border-box;
    max-width: 1050px;
}

.popular-program-title {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 20px;
    font-size: 30px;
    line-height: 36px;
    color: var(--granate);
    text-align: center;
    font-weight: var(--bold);
    padding-top: 50px;
    text-transform: uppercase;
}

    .popular-program-title > h3 {
        font-weight: 700;
        font-size: 18px;
        line-height:36px;
    }

.intro_div {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 20px;
    width: 90%;
    margin: auto;
}
.token {
    margin: auto;
}

.tapa-div {
    display: flex;
    flex-direction: column;
    padding-top: 55px;
    width: 90%;
    margin: auto;
    max-width: 1050px;
    gap: 20px;
}

.tapa-div > h3 {
    color: var(--dark-blue);
    font-size: 18px;
    font-weight: bold;
    line-height: 22px;
    text-transform: uppercase;
}

    .tapa > .tapa-div > .pop-prog_detail{
        border: 0;
    }
        .tapa > .tapa-div > .pop-prog_detail > img {
            max-width: 197px;
            max-height: 197px;
        }

    .pop-prog_detail {
        border: solid #333 1px;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        gap: 16px;
        padding: 20px;
        box-sizing: border-box;
        width: 100%;
        min-height: 153px;
    }

.pop-prog_name {
    font-size: 14px;
    line-height: 16px;
    font-weight: 600;
    color: var(--dark-blue);
    text-transform: uppercase;
}

.pop-prog_place {
    font-size: 16px;
    line-height: 22px;
    font-weight: 600;
    color: var(--dark-blue);
}

.pop-prog_tapa {
    font-size: 20px;
    line-height: 28px;
    letter-spacing: 0.5px;
    font-weight: bold;
    color: var(--gold);
}

.show {
    width: 100%;
    box-sizing: border-box;
    max-width: 1050px;
}

.popular-program-subtitle {
    font-size: 18px;
    line-height: 22px;
    text-transform: uppercase;
    font-weight: 600;
    font-family: var(--font-normal);
}

/* .prop-prog_show-div {
	display: flex;
	flex-direction: row;
	gap: 22px;
}

.pop-prog_div.left {
	text-align: right;
}

.pop-prog_div.right {
	text-align: left;
}

.popular-program > div.show > div > div.pop-prog_div.right > div:nth-child(1) {
	padding-top: 46px;
}

.div_arrow {
	display: flex;
	gap: 27px;
}

.left > .pop-prog_show > .div_arrow {
	justify-content: end;
}

.right > .pop-prog_show > .div_arrow {
	justify-content: start;
} */

.pop-prog_title {
    color: var(--grey);
    font-size: 25px;
    line-height: 36px;
    text-transform: uppercase;
    font-weight: bold;
    padding:47px 0 30px 0;
}

.pop-prog_hour {
    color: var(--granate);
    font-size: 14px;
    letter-spacing: 0.35px;
    line-height: 22px;
}

/* .left > .pop-prog_show > .pop-prog_hour {
	padding-right: 37px;
}

.right > .pop-prog_show > .pop-prog_hour {
	padding-left: 37px;
} */

.pop-prog_tit {
    font-size: 28px;
    line-height: 36px;
    font-weight: var(--regular);
    padding-bottom: 10px;
}

.left > .pop-prog_show > .pop-prog_description {
    padding-right: 37px;
}

.right > .pop-prog_show > .pop-prog_description {
    padding-left: 37px;
}

.pop-prog_description {
    font-size: 18px;
    line-height: 26px;
}

.carrusel-logo {
    width: 100%;
    max-width: 900px;
}

/*CARRUSEL*******************************************************/

#gallery-big {
    display: none;
}

.gallery {
    width: 100%;
    display: flex;
}

.gallery-container-big,
.gallery-container-small {
    align-items: center;
    display: flex;
    margin: 0 auto;
    max-width: 100%;
    /*position: relative;*/
}

.gallery-item-big,
.gallery-item-small {
    opacity: 0;
    position: absolute;
    transition: all 0.5s ease-in-out;
    z-index: 0;
    width: 5%;
}

.gallery-item-1,
.gallery-item-5 {
    height: auto;
    width: 24%;
    max-width: 250px;
    max-height: 250px;
}

.gallery-item-1 {
    left: 15%;
    opacity: 1;
    transform: translateX(-50%);
}

.gallery-item-2,
.gallery-item-4 {
    height: auto;
    width: 36%;
    opacity: 1;
    z-index: 1;
    max-width: 400px;
    max-height: 400px;
}

.gallery-item-2 {
    left: 30%;
    transform: translateX(-50%);
}

.gallery-item-3 {
    height: auto;
    width: 50%;
    opacity: 1;
    left: 50%;
    transform: translateX(-50%);
    z-index: 2;
    max-width: 550px;
    max-height: 550px;
}

.gallery-item-4 {
    left: 70%;
    transform: translateX(-50%);
}

.gallery-item-5 {
    left: 85%;
    opacity: 1;
    transform: translateX(-50%);
}

.gallery-controls-small {
    display: flex;
    justify-content: center;
    position: relative;
    z-index: 5;
    width: 100%;
    margin: auto;
}

    .gallery-controls-small button {
        color: transparent;
        background-color: transparent;
        cursor: pointer;
        height: 200px;
        width: 50%;
    }

        .gallery-controls-big button:focus,
        .gallery-controls-small button:focus {
            outline: none;
        }

.gallery-controls-previous {
    position: relative;
}

.gallery-controls-next {
    position: relative;
}

.selector{
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: baseline;
    max-width: 90vw;
    margin: auto;
    gap: 15px;
    text-align: center;
}
.selector__container {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    color: var(--dark-blue);
    background-color: rgba(235, 245, 249, 0.5);
    /*border: solid 3px var(--dark-blue);*/
    padding: 10px;
    box-sizing: border-box;
    cursor:pointer;
    opacity: 60%;
    border: solid 3px #888;
}
.selector__container.active {
    background-color: rgba(235, 245, 249, 1);
    border-width: 5px;
    border-color: var(--gold);
    opacity: 100%;
}
.selector__label {
    width: 50%;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}

.selector__input{

}
    #selector__input--p {
        font-family: var(--font-normal);
        font-weight: var(--regular);
        color: var(--dark-blue);
        font-size: 14px;
        line-height: 20px;
        padding-top: 20px;
    }

@media all and (min-width: 768px) {
    .selector {
        flex-direction: row;
    }

    .selector__container {
        max-width: 400px;
    }

    .selector__label {
    }

    .selector__input {
    }
        #selector__input--p {
            font-size: 20px;
            line-height: 28px;
            padding-top: 30px;
            max-width: 525px;
            margin: auto;
            min-height: 100px;
        }

    /*HEADER*******************************************************/
    .c-header .o-container {
        justify-content: space-between;
        max-width: 1050px;
    }
    /*    .c-header__brand > img.small{
        display: initial;
        height: 53px;
    }
    .c-header__brand > img.big {
        display: none;
    }*/

    .header_menu {
        margin: 0 auto;
        background-color: transparent;
        width: 100%;
        max-width: 1050px;
    }

        .header_menu .button {
            padding: 17px;
        }

    .button:hover {
        opacity: 70%;
    }

    .button.lang {
        font-size: 12px;
    }

    .button.access {
        display: initial;
    }

    .button.active {
        padding: 17px;
    }

    .c-header__nav a.active {
        border-bottom: solid 2px white;
    }
    /*fondo subpáginas************************************************/

    .cabecera, .cabecera-speakers, .cabecera-news {
        width: 100%;
        height: 300px;
        padding-bottom: 150px;
    }
    /*HOME*****************************************************/
    .o-section.o-section-program.u-bg-white.u-pt-20-xs.u-pb-20-xs.u-pb-40 > .c-form__button {
        width: fit-content;
        padding: 0 18px;
    }

    .home-slider {
        height: 700px;
    }

    #slide-1 {
        height: 700px;
    }

    .single-slide {
        height: 700px;
    }

    .aboutUs {
        background-position: top;
        background-size: 100%, 100%;
    }

    .aboutUs_intro {
        max-width: 1050px;
        margin: auto;
        display: flex;
        flex-direction: column;
    }

    .aboutUs_intro-subt {
        font-size: 24px;
        line-height: 48px;
    }

    .aboutUs_intro-tit {
        font-size: 80px;
        line-height: 80px;
    }

    .aboutUs_text {
        max-width: 525px;
        margin: auto;
    }

    .aboutUs_text-tit {
        font-size: 34px;
        margin-bottom: 10px;
    }

    .aboutUs_text-content {
        font-size: 20px;
        line-height: 28px;
        padding-top: 30px;
        max-width: 525px;
        margin: auto;
        padding-top: 0;
    }

    .description {
    }

    .description_container {
        flex-direction: row;
        flex-flow: wrap;
        justify-content: center;
        align-items: baseline;
    }

    .cumbre {
        border-color: var(--dark-blue);
    }

    .fiesta {
        border-color: var(--gold);
    }

    .description-div {
        width: 500px;
        max-width: none;
    }

    .description-div_text {
        grid-template-rows: 15% 45% 35%;
        gap: 2.5%;
        height: 600px;
        width: 500px;
        padding: 40px;
    }

    .cumbre > .description-div_text {
    }

    .fiesta > .description-div_text {
    }

    .description-div_text > h3 {
        font-size: 34px;
        line-height: 36px;
        max-width: 384px;
    }

    .description-div_text > p {
        font-size: 20px;
        line-height: 28px;
        max-width: 327px;
    }

    .cumbre > .description-div_text > p,
    .cumbre > .description-div_text > h3 {
        margin-left: auto;
    }

    .description-div_text > div {
        flex-direction: column;
        gap: 5%;
    }

    .description_date {
        font-size: 34px;
    }

    .description_hour {
        font-size: 28px;
        line-height: 30px;
        padding-left: 0;
    }

    .description_place {
        font-size: 25px;
        line-height: 30px;
    }

    .description-div_button {
        font-size: 18px;
        line-height: 60px;
        letter-spacing: 0.45px;
        padding: 0 15px;
        width: fit-content;
    }

        .description-div_button:hover {
            opacity: 60%;
        }

    .cumbre > .description-div_button {
    }

    .fiesta > .description-div_button {
    }

    .c-detail__star {
    }

    .o-section.o-section-program.u-bg-white.u-pt-20-xs.u-pb-20-xs.u-pb-40 > div.o-container.u-pb-40.u-pt-40 > .o-section__title {
        font-size: 50px;
        line-height: 50px;
        margin-top: 100px;
    }

    .o-section.o-section-program.u-bg-white.u-pt-20-xs.u-pb-20-xs.u-pb-40 > div.o-container.u-pb-40.u-pt-40 > p {
        max-width: none;
        font-size: 20px;
        line-height: 24px;
        margin-bottom: 93px;
    }

    .o-section.o-section-magazine > div.o-container.u-pb-20-xs.u-pt-20-xs.u-pb-40.u-pt-40 > article {
        max-width: 1050px;
        margin: auto;
    }

    .goat {
        max-width: 65%;
        height: 294px;
        border-bottom: 0;
        overflow: hidden;
        box-sizing: border-box;
        background-image: url(../../at2022/img/cab-partners@2x.png);
    }

        .goat > img {
            max-width: 65%;
            margin-top: -100px;
        }

    .c-partner__title {
        font-size: 16px;
        letter-spacing: 0.4px;
    }

    /*.c-partner__title:first-child {
        text-align: left;
        margin: 0;
    }*/

    .o-container.c-footer__top.u-grid.u-grid-columns-2-equals {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        margin-top: 80px;
    }

    .c-footer__top > div.download {
        display: flex;
        flex-direction: row;
        border: solid 2px #fff;
        border-radius: 30px;
        height: 28px;
        width: fit-content;
        justify-content: center;
        align-items: center;
        padding: 0 10px;
        gap: 10px;
        margin: 15px auto 0;
    }

        .c-footer__top > div.download > p {
            color: #fff;
            text-transform: uppercase;
            font-size: 15px;
        }

    .footer-img {
        width: 714px;
        max-width: 50%;
        transform: translateX(-50%) translateY(60%);
    }

    /*POPULAR************************************************************/

    .popular-intro {
        display: block;
        height: 90vh;
        min-height: 800px;
        max-height: 1100px;
        padding-top: 0;
    }

    .popular-intro_text {
        padding-top: 200px;
    }

    section.grid {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: 1fr;
    }

    .aboutUs.popular {
        grid-column: 1/4;
        grid-row: 1/2;
    }

    #gallery-big {
        display: block;
    }

    .gallery {
        z-index: 5;
        display: flex;
    }

    .gallery-container-big,
    .gallery-container-small {
        align-items: center;
        display: flex;
        margin: 0 auto;
        max-width: 100%;
        /*position: relative;*/
    }

    .gallery-item-big,
    .gallery-item-small {
        height: 0;
        opacity: 0;
        position: absolute;
        transform: translateX(-50%);
        transition: all 0.3s ease-in-out;
        width: 0;
    }

    .gallery-item-1,
    .gallery-item-5 {
        opacity: 1;
        height: auto;
        width: 12%;
    }

    .gallery-item-1 {
    }

    .gallery-item-2,
    .gallery-item-4 {
        opacity: 1;
        height: auto;
        width: 25%;
    }

    .gallery-item-2 {
    }

    .gallery-item-3 {
        opacity: 1;
        height: auto;
        width: 42%;
    }

    .gallery-item-4 {
    }

    .gallery-item-5 {
    }

    .gallery-controls-big {
        gap: 42%;
        position: relative;
        z-index: 5;
        max-width: 839px;
        bottom: 53vh;
        margin: auto;
    }

        .gallery-controls-big button,
        .gallery-controls-small button {
            background-color: transparent;
            height: 200px;
            width: 29%;
        }

            .gallery-controls-big button:focus,
            .gallery-controls-small button:focus {
            }

    .gallery-controls-previous {
    }

    .gallery-controls-next {
    }

    .popular-intro_text > p {
    }

    .popular-intro_title {
        font-size: 140px;
        line-height: 116px;
    }

    .popular-intro_subtitle {
        font-size: 40px;
        line-height: 116px;
    }

    .google-iframe {
        width: 50%;
    }

    .gallery-controls-big {
        display: flex;
        justify-content: center;
        gap: 42%;
        position: relative;
        z-index: 5;
        max-width: 100%;
        top: -25vh;
        margin: auto;
    }

        .gallery-controls-big button {
            color: transparent;
            background-color: transparent;
            cursor: pointer;
            height: 400px;
            width: 25%;
        }

    .gradient.popular {
        grid-column: 1/4;
        grid-row: 2/3;
    }

    body > main > section:nth-child(2) > .aboutUs {
        padding: 0;
        display: flex;
        flex-direction: column;
        min-height: 600px;
    }

    .aboutUs_text.popular > div {
        margin: auto;
        display: flex;
        flex-direction: row-reverse;
        justify-content: space-around;
        text-align: left;
        margin-top: 100px;
        width: 100%;
        max-width: 1050px;
    }

    .aboutUs_text.popular {
        max-width: initial;
        width: 100vw;
    }

    .description_date.popular {
        padding: 0;
        font-size: 44px;
        line-height: 40px;
    }

    .description_hour.popular {
        font-size: 44px;
        line-height: 40px;
        padding: 0;
    }

    .description_place.popular {
        padding:0;
        font-size: 40px;
        font-size: 40px;
        line-height: 40px;
    }

    .aboutUs_intro-subt.popular {
        font-size: 34px;
        line-height: 36px;
    }

    section.popular-program {
        margin-top: 80px;
        margin-bottom: 214px;
    }

    /*    .popular-program #mobile {
      display: none;
    }*/

    .popular-program {
        display: flex;
        flex-direction: column;
        align-items: center;
        max-width: 95%;
        box-sizing: border-box;
        margin: auto;
    }

    .pop-prog-div {
        display: flex;
        justify-content: space-between;
        flex-flow: wrap;
        margin: auto;
        width: 100%;
        max-width: 1050px;
        row-gap: 25px;
    }

        .pop-prog-div > div{
            width: 50%;
        }

        .pop-prog-div_tipo {
            display: flex;
            flex-direction: column;
            gap: 9px;
            text-transform: uppercase;
            cursor: pointer;
            width: 50%;
            max-width: initial;
            height: 180px;
        }
    .logo_popular {
        height:100px;
        width: 100px;
        max-width: 100px;
        max-height: 100px
    }
    .pop-text {
        color: var(--gold);
        font-size: 22px;
        line-height: 28px;
        text-align: center;
    }

    .tapa {
        width: 100%;
        box-sizing: border-box;
        max-width: 1050px;
    }
        .tapa > .tapa-div {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 0;
        }

            .tapa > .tapa-div > div:nth-child(1n) {
                border-left: 1px var(--dark-grey) solid;
            }

            .tapa > .tapa-div > div:nth-child(2n) {
                border-right: 1px var(--dark-grey) solid;
            }

    .popular-program-title {
        font-size: 30px;
        line-height: 36px;
        color: var(--granate);
        text-align: center;
        font-weight: var(--bold);
        margin-bottom: 40px;
        text-transform: uppercase;
    }
        .popular-program-title > h3 {
            font-size: 30px;
        }
    .intro_div {
        flex-direction: row;
        justify-content: center;
        align-items: center;
        max-width: 630px;
    }

        .intro_div > img {
            width: 50%;
        }
        .intro_div > .aboutUs_text-content{
            width: 50%;
        }
    .token {
        max-width: 260px;
    }

    .tapa-div {
        display: flex;
        flex-direction: column;
        gap: 20px;
    }

    .pop-prog_detail {
        border: solid #333 1px;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        box-sizing: border-box;
        width: 100%;
        min-height: 137px;
    }

    .tapa > .tapa-div > .pop-prog_detail {
        width: initial;
        justify-content: flex-start;
    }
        .show > .tapa-div > .pop-prog_detail {
        flex-direction: row;
        justify-content: flex-start;
        align-items: center;
    }

            .show > .tapa-div > .pop-prog_detail > div {
                border-left: 1px var(--dark-blue) solid;
                padding-left: 30px;
            }
    .pop-prog_name {
        font-size: 20px;
        line-height: 22px;
        height: 35px;
        font-weight: 600;
        color: var(--dark-blue);
        text-transform: uppercase;
    }

    .pop-prog_place {
        font-size: 20px;
        line-height: 22px;
        font-weight: var(--medium);
        color: var(--dark-blue);
    }

    .pop-prog_tapa {
        font-size: 24px;
        line-height: 28px;
        margin-top: 8px;
        font-weight: bold;
        color: var(--gold);
    }

    .show {
        width: 100%;
        box-sizing: border-box;
        max-width: 1050px;
    }

    .prop-prog_show-div {
        display: flex;
        flex-direction: row;
        gap: 22px;
    }

    .pop-prog_div {
        display: flex;
        flex-direction: column;
        row-gap: 50px;
    }

        .pop-prog_div.left {
            text-align: right;
        }

        .pop-prog_div.right {
            text-align: left;
        }

    .popular-program > div.show > div > div.pop-prog_div.right > div:nth-child(1) {
        padding-top: 46px;
    }

    .div_arrow {
        display: flex;
        gap: 27px;
    }

    .left > .pop-prog_show > .div_arrow {
        justify-content: end;
    }

    .right > .pop-prog_show > .div_arrow {
        justify-content: start;
    }

    .pop-prog_title {
        padding-top: 70px;
        font-size: 50px;
        line-height: 50px;
    }

    .pop-prog_detail {
        max-width: 100%;
        width: 1050px;
    }

    .left > .pop-prog_show > .pop-prog_hour {
        padding-right: 37px;
    }

    .right > .pop-prog_show > .pop-prog_hour {
        padding-left: 37px;
    }

    .pop-prog_tit {
        font-size: 28px;
        line-height: 36px;
        font-weight: var(--regular);
        padding-bottom: 10px;
    }

    .left > .pop-prog_show > .pop-prog_description {
        padding-right: 37px;
    }

    .right > .pop-prog_show > .pop-prog_description {
        padding-left: 37px;
    }

    .pop-prog_description {
        font-size: 18px;
        line-height: 26px;
    }

    #gallery-small {
        display: none;
    }
}

@media all and (min-width: 1450px) {

    .tapa > .tapa-div {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
    }
        .tapa > .tapa-div > div:nth-child(2n) {
            border-right:0;
        }
        .tapa > .tapa-div > div:nth-child(4n) {
            border-right: 1px var(--dark-grey) solid;
        }
    .pop-prog_name{
        height: 95px;
    }
    .pop-prog_tapa{
        margin-top: 0;
    }
}

@media all and (min-width: 1600px) {
/*    .aboutUs_intro-subt.popular {
        padding-top: 18vh;
    }*/
}

.hidden {
    display: none !important;
}


/*************************************************************
    MODAL 
 ************************************************************/

.modal {
    display: none;
    position: fixed;
    z-index: 10;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgb(0,0,0);
    background-color: rgba(0,0,0,0.4);
}

.modal-content {
    background-color: #fefefe;
    margin: 15% auto;
    padding: 0 20px 20px;
    border: 1px solid #888;
    width: fit-content;
    display: flex;
    flex-direction: column;
}
.modal-header {
    transform: translateX(10px);
}
.close {
    color: #aaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
}

    .close:hover,
    .close:focus {
        color: black;
        text-decoration: none;
        cursor: pointer;
    }


@media (max-width:991px){
    .modal-content {
        margin-top: 125px;
    }
}