/*//////////////////////////////////////////////////////////////////////////////////// DONE //////*/
@media all and (max-width: 480px) {

    html {
        font-size: calc(18px + (22 - 18) * (100vw - 300px) / (480 - 300));
    }
}

@media all and (max-width: 719px) {

    /*////////////////////////////////////////////////////////////////////////// NAVIGATION //////*/
    #c-interactive__header--cj20t20 {
        width: 90%;
        height: auto;
    }

    .c-interactive__burger-button:hover .c-icon__path {
        fill: var(--c-page__color-dark) !important;
        transition-duration: 0ms !important;
    }

    /*////////////////////////////////////////////////////////////// INTERACTIVE COMPONENTS //////*/
    .c-interactive {
        margin: 0 auto !important;
    }

    .c-interactive__button {
        padding: 0.68rem 0.7rem 0 0;
    }

    .c-interactive__articles {
    }

    .c-interactive__articles-inner {
        height: 95%;
    }

    .c-interactive__slice {
        top: var( --c-interactive__slice--top-mobile );
        left: var( --c-interactive__slice--left-mobile );

        perspective: var( --c-interactive__slice--perspective-mobile );
        perspective-origin: var( --c-interactive__slice--perspective-origin-mobile );
    }

    .c-interactive__articles .c-interactive__slice {
        padding: 2.58rem 0.58rem 2.38rem 0.12rem;
    }

    .c-interactive__slice:first-child .c-interactive__slice-stage::after {
        transform: translate3d( -50%, -500%, 0px );
        font-size: 0.5rem;
    }

    .c-interactive__content--article {
        padding: 0;
    }

    .c-interactive__eq {
        bottom: 2%;
        right: 2%;
    }

    /*/////////////////////////////////////////////////////////////////// GUTENBERG HEADING //////*/
    .c-interactive__content-source h1[class=''],
    .c-interactive__content-source h2[class=''],
    .c-interactive__content-source h3[class=''],
    .c-interactive__content-source h4[class=''],
    .c-interactive__content-source h5[class=''],
    .c-interactive__content-source h6[class=''],
    .c-interactive__content-source h1:not([class]),
    .c-interactive__content-source h2:not([class]),
    .c-interactive__content-source h3:not([class]),
    .c-interactive__content-source h4:not([class]),
    .c-interactive__content-source h5:not([class]),
    .c-interactive__content-source h6:not([class]) {
        margin: 1.38rem auto 1rem;
        font-size: 1rem;
        line-height: 1;
    }

    .c-interactive__content--article h1[class=''],
    .c-interactive__content--article h2[class=''],
    .c-interactive__content--article h3[class=''],
    .c-interactive__content--article h4[class=''],
    .c-interactive__content--article h5[class=''],
    .c-interactive__content--article h6[class=''],
    .c-interactive__content--article h1:not([class]),
    .c-interactive__content--article h2:not([class]),
    .c-interactive__content--article h3:not([class]),
    .c-interactive__content--article h4:not([class]),
    .c-interactive__content--article h5:not([class]),
    .c-interactive__content--article h6:not([class]) {
        margin: 0 auto 1em;
        font-size: 1.38em;
    }

    /*///////////////////////////////////////////////////////////////// GUTENBERG PARAGRAPH //////*/
    .c-interactive__content-source p[class=''],
    .c-interactive__content-source p:not([class]),
    .c-interactive__content-source p.has-text-align-center,
    .c-interactive__content-source p.has-text-align-left,
    .c-interactive__content-source p.has-text-align-right {
        line-height: 1.78;
    }

    /*//////////////////////////////////////////////////////////////////////// MNMNTL IMAGE //////*/
    .c-interactive__content-source .mnmntl-image__image {
        max-height: none;
    }

    .c-interactive__content-source .mnmntl-image__image[data-orientation="portrait"] {
        max-height: 50vh;
    }

    /*////////////////////////////////////////////////////////////////// MNMNTL GROUP IMAGE //////*/
    .c-interactive__content-source .mnmntl-image-group__item--4 {
        flex: 0 1 25% !important;
    }

    #c-interactive__slice--11 .mnmntl-image__media {
        width: 65%;
        margin: 0 auto;
    }

    #c-interactive__slice--977 .mnmntl-image-group__caption {
        height: auto;
        line-height: 1;
        text-align: center;
        padding: 5px 0px;
        background-color: var(--c-page__color-grey-dark-a75);
        text-transform: uppercase;
        font-size: 9px;
    }

    #c-interactive__slice--977 .mnmntl-image-group__credit {
        top: 0;
        bottom: auto;
        background-color: var(--c-page__color-grey-dark-a75);
        width: 18px;
        height: 18px;
        padding: 4px;
    }

    /*////////////////////////////////////////////////////////////////////////////// FOOTER //////*/

    /*
    .c-interactive__footer-buttons .c-icon {
        padding: 0 0 13px 28px;
    }

    .c-interactive__footer-buttons .c-icon--A {
        padding: 4px 0 9px 28px;
    }

    .c-interactive__footer-buttons .c-icon--fb {
        padding: 0 0 13px 25px;
    }
    */

    .c-interactive__footer {
        padding: 0 15px 0 0;
    }

    .c-interactive__footer-buttons .c-icon {
        padding: 15px 17px;
    }

    /*//////////////////////////////////////////////////////////////////////////// SPECIFIC //////*/
    #c-interactive__slider--193 {
        transform: translate3d( -50%, -400%, 0 );
    }

    #c-interactive__slider--534 {
        transform: translate3d( -50%, -300%, 0 );
    }

    #c-interactive__slice--562 p[class=''],
    #c-interactive__slice--562 p:not([class]),
    #c-interactive__slice--562 p.has-text-align-center,
    #c-interactive__slice--562 p.has-text-align-left,
    #c-interactive__slice--562 p.has-text-align-right {
        font-size: 1rem;
    }

    #c-interactive__slice--562 a {
        font-size: 0.88rem;
        line-height: 2.25;
    }

    #c-interactive__slice--1757 .wp-block-embed figcaption,
    #c-interactive__slice--1757 .c-embed__content-wrapper figcaption {
        font-size: 0.68rem;
    }
}

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

    html {
        font-size: 22px;
    }
}

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

    .c-interactive__content-source {
        font-size: calc(18px + (20 - 18) * (100vw - 720px) / (1440 - 720));
    }
}

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

    .c-interactive__content-source {
        font-size: 20px;
    }
}