/*
 * DESKTOP
 */
.mtg-responsive-slider-mobile {
    display: none;
}


@media screen and (max-width:767px) {

    /*
     * ======================================================
     * PRIORIDAD SNAPSHOTS
     * ======================================================
     *
     * JS agrega mtg-rsm-priority INMEDIATAMENTE
     * después de mover el renderer al lugar del hero.
     */

    body.mtg-rsm-priority
    .mtg-hero-slider-v2,

    body.mtg-rsm-priority
    [data-mtg-hero-slider] {

        display:
            none !important;
    }


    body.mtg-rsm-priority
    .mtg-responsive-slider-mobile {

        display:
            block !important;

        position:
            relative !important;

        width:
            100% !important;

        max-width:
            100% !important;

        margin:
            0 !important;

        padding:
            0 !important;

        overflow:
            hidden !important;

        background:
            #111 !important;
    }


    /*
     * Capturas 1440x810
     */
    .mtg-rsm-track {

        position:
            relative;

        width:
            100%;

        aspect-ratio:
            16 / 9;

        overflow:
            hidden;

        background:
            #111;
    }


    .mtg-rsm-slide {

        display:
            none;

        position:
            absolute;

        inset:
            0;

        width:
            100%;

        height:
            100%;
    }


    .mtg-rsm-slide.is-active {

        display:
            block;
    }


    .mtg-rsm-slide img {

        display:
            block;

        width:
            100%;

        height:
            100%;

        max-width:
            100%;

        max-height:
            100%;

        margin:
            0;

        padding:
            0;

        object-fit:
            contain;

        object-position:
            center center;

        background:
            #111;
    }

    /*
     * FLECHAS MOBILE
     */

    .mtg-rsm-arrow {

        position:
            absolute;

        top:
            50%;

        transform:
            translateY(-50%) !important;

        transform-origin:
            center center !important;

        z-index:
            15;

        display:
            flex;

        align-items:
            center;

        justify-content:
            center;

        width:
            34px;

        height:
            44px;

        min-width:
            34px;

        min-height:
            44px;

        padding:
            0;

        margin:
            0;

        border:
            1px solid
            rgba(
                255,
                255,
                255,
                .35
            );

        border-radius:
            9px;

        background:
            rgba(
                0,
                0,
                0,
                .34
            );

        color:
            #fff;

        font-size:
            31px;

        font-weight:
            300;

        line-height:
            1;

        cursor:
            pointer;

        touch-action:
            manipulation;

        user-select:
            none;

        -webkit-user-select:
            none;

        -webkit-touch-callout:
            none;

        -webkit-tap-highlight-color:
            transparent;

        backdrop-filter:
            blur(3px);

        transition:
            background .15s ease,
            transform .15s ease;
    }


    
.mtg-rsm-arrow:active {

        background:
            rgba(
                0,
                0,
                0,
                .58
            );

        transform:
            translateY(-50%) !important;
    }



    .mtg-rsm-arrow--prev {

        left:
            7px;
    }


    .mtg-rsm-arrow--next {

        right:
            7px;
    }

}