/* =========================================================
   MOS VIDEOS - CINEMATIC SHOPPABLE VIDEO EXPERIENCE
   ========================================================= */

.mos-videos-archive,
.mos-videos-single {
    background:#111;
    color:#fff;
}

.mos-videos-container,
.mos-video-single-container {
    width:min(1280px, calc(100% - 40px));
    margin:0 auto;
}

.mos-videos-hero {
    padding:90px 0 70px;
    background:
        radial-gradient(circle at top right, rgba(255,255,255,.08), transparent 35%),
        #111;
}

.mos-videos-eyebrow,
.mos-videos-section-head span,
.mos-video-type-label {
    display:block;
    margin-bottom:12px;
    font-size:12px;
    letter-spacing:.18em;
    text-transform:uppercase;
    color:#999;
}

.mos-videos-hero h1 {
    margin:0 0 18px;
    color:#fff;
    font-size:clamp(42px, 7vw, 88px);
    line-height:.95;
    font-weight:500;
}

.mos-videos-hero p {
    max-width:700px;
    margin:0;
    color:#bdbdbd;
    font-size:17px;
    line-height:1.7;
}

.mos-videos-section {
    padding:60px 0;
}

.mos-videos-section-head {
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    margin-bottom:26px;
}

.mos-videos-section-head h2 {
    margin:0;
    color:#fff;
    font-size:32px;
    line-height:1.15;
    font-weight:500;
}

.mos-video-grid {
    display:grid;
    grid-template-columns:repeat(2, minmax(0,1fr));
    gap:28px;
}

.mos-video-grid-featured {
    grid-template-columns:repeat(2, minmax(0,1fr));
}

.mos-short-grid {
    display:grid;
    grid-template-columns:repeat(4, minmax(0,1fr));
    gap:20px;
}

.mos-video-card {
    display:block;
    color:#fff !important;
    text-decoration:none !important;
}

.mos-video-card-media {
    position:relative;
    display:block;
    overflow:hidden;
    aspect-ratio:16/9;
    background:#222;
}

.mos-video-card.is-short-card .mos-video-card-media {
    aspect-ratio:9/16;
}

.mos-video-card-media img {
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
    transition:transform .45s ease;
}

.mos-video-card:hover .mos-video-card-media img {
    transform:scale(1.025);
}

.mos-video-card-play {
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
    width:64px;
    height:64px;
    border-radius:50%;
    background:rgba(0,0,0,.65);
    backdrop-filter:blur(8px);
    display:flex;
    align-items:center;
    justify-content:center;
}

.mos-video-card-play span,
.mos-video-play span {
    width:0;
    height:0;
    border-top:8px solid transparent;
    border-bottom:8px solid transparent;
    border-left:13px solid #fff;
    margin-left:4px;
}

.mos-video-card-content {
    display:block;
    padding:15px 0 0;
}

.mos-video-card-content strong {
    display:block;
    color:#fff;
    font-size:17px;
    font-weight:500;
    line-height:1.4;
}

.mos-video-card-content small {
    display:block;
    margin-top:6px;
    color:#888;
    font-size:12px;
}


/* SINGLE */

.mos-videos-single {
    min-height:100vh;
    padding:55px 0 90px;
}

.mos-video-back {
    display:inline-block;
    margin-bottom:45px;
    color:#aaa !important;
    text-decoration:none !important;
    font-size:13px;
}

.mos-video-single-header {
    max-width:900px;
    margin-bottom:30px;
}

.mos-video-single-header h1 {
    margin:0;
    color:#fff;
    font-size:clamp(34px,5vw,64px);
    line-height:1.05;
    font-weight:500;
}

.mos-video-excerpt {
    margin-top:18px;
    color:#aaa;
    line-height:1.7;
}

.mos-video-player {
    position:relative;
    overflow:hidden;
    width:100%;
    background:#000;
}

.mos-video-player.is-long {
    aspect-ratio:16/9;
}

.mos-video-player.is-short {
    aspect-ratio:9/16;
    max-width:520px;
    margin-left:auto;
    margin-right:auto;
}

.mos-video-player img,
.mos-video-player iframe,
.mos-video-player video {
    width:100%;
    height:100%;
    display:block;
    object-fit:cover;
}

.mos-video-play {
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
    width:82px;
    height:82px;
    border:0;
    border-radius:50%;
    background:rgba(0,0,0,.68);
    backdrop-filter:blur(10px);
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
}

.mos-video-description {
    max-width:850px;
    margin:35px auto 0;
    color:#bbb;
    font-size:15px;
    line-height:1.8;
}


/* PRODUCTS */

.mos-video-products-wrap {
    margin-top:65px;
}

.mos-video-products-wrap h3 {
    margin:0 0 22px;
    color:#fff;
    font-size:26px;
    font-weight:500;
}

.mos-video-products {
    display:flex;
    gap:18px;
    overflow-x:auto;
    padding-bottom:8px;
    scroll-snap-type:x proximity;
}

.mos-video-product-card {
    flex:0 0 220px;
    scroll-snap-align:start;
    background:#fff;
    color:#111 !important;
    text-decoration:none !important;
}

.mos-video-product-image {
    display:block;
    aspect-ratio:1/1;
    background:#f5f5f5;
}

.mos-video-product-image img {
    width:100%;
    height:100%;
    object-fit:cover;
}

.mos-video-product-info {
    display:block;
    padding:14px 15px 16px;
}

.mos-video-product-info strong {
    display:block;
    color:#111;
    font-size:14px;
    line-height:1.35;
    font-weight:500;
}

.mos-video-product-price {
    display:block;
    margin-top:7px;
    color:#555;
    font-size:13px;
}

.mos-video-product-link {
    display:inline-block;
    margin-top:12px;
    border-bottom:1px solid #111;
    font-size:12px;
    color:#111;
}


/* MOBILE */

@media (max-width: 767px) {

    .mos-videos-container,
    .mos-video-single-container {
        width:min(100% - 24px, 1280px);
    }

    .mos-videos-hero {
        padding:58px 0 48px;
    }

    .mos-videos-section {
        padding:42px 0;
    }

    .mos-video-grid,
    .mos-video-grid-featured {
        grid-template-columns:1fr;
        gap:26px;
    }

    .mos-short-grid {
        grid-template-columns:repeat(2, minmax(0,1fr));
        gap:12px;
    }

    .mos-video-card-play {
        width:52px;
        height:52px;
    }

    .mos-videos-single {
        padding:35px 0 70px;
    }

    .mos-video-back {
        margin-bottom:28px;
    }

    .mos-video-play {
        width:68px;
        height:68px;
    }

    .mos-video-products-wrap {
        margin-top:45px;
    }

    .mos-video-product-card {
        flex-basis:170px;
    }

}


/* =========================================================
   MOS VIDEO SELF-HOSTED HOVER PREVIEW
   ========================================================= */

@media (min-width: 992px) {

    .mos-video-card.has-hover-preview
    .mos-video-card-media {
        position:relative;
    }

    .mos-video-hover-preview {
        position:absolute;
        inset:0;
        z-index:2;

        display:block;

        width:100%;
        height:100%;

        object-fit:cover;

        background:#000;
    }

    .mos-video-card.has-hover-preview
    .mos-video-card-play {
        z-index:3;
        transition:
            opacity .2s ease,
            transform .2s ease;
    }

    .mos-video-card.is-hover-previewing
    .mos-video-card-play {
        opacity:0;
        transform:
            translate(-50%, -50%)
            scale(.85);
    }

}


/* =========================================================
   MOS VIDEOS PHASE 3 - CINEMATIC VIEWER
   ========================================================= */

body.mos-video-viewer-open {
    overflow:hidden !important;
}


.mos-video-viewer {
    position:fixed;
    inset:0;
    z-index:999999;

    display:none;

    color:#fff;
}


.mos-video-viewer.is-open {
    display:block;
}


.mos-video-viewer-backdrop {
    position:absolute;
    inset:0;

    background:rgba(5,5,5,.96);

    backdrop-filter:blur(8px);
}


.mos-video-viewer-shell {
    position:relative;
    z-index:2;

    width:100%;
    height:100%;

    overflow-y:auto;

    overscroll-behavior:contain;
}


.mos-viewer-content {
    width:min(
        1180px,
        calc(100% - 120px)
    );

    min-height:100%;

    margin:0 auto;

    padding:
        55px
        0
        90px;

    transition:
        opacity .16s ease,
        transform .16s ease;
}


.mos-viewer-content.move-next {
    opacity:.15;
    transform:translateX(-30px);
}


.mos-viewer-content.move-prev {
    opacity:.15;
    transform:translateX(30px);
}


/* Vertical animation for Shorts */

.mos-video-viewer.is-short-viewer
.mos-viewer-content.move-next {
    transform:translateY(-30px);
}


.mos-video-viewer.is-short-viewer
.mos-viewer-content.move-prev {
    transform:translateY(30px);
}


.mos-viewer-meta {
    max-width:950px;
    margin-bottom:22px;
}


.mos-viewer-label {
    display:block;

    margin-bottom:10px;

    color:#888;

    font-size:11px;
    letter-spacing:.18em;
    text-transform:uppercase;
}


.mos-viewer-meta h2 {
    margin:0;

    color:#fff;

    font-size:clamp(
        30px,
        4vw,
        56px
    );

    line-height:1.05;

    font-weight:500;
}


.mos-viewer-player {
    position:relative;

    overflow:hidden;

    margin:
        0
        auto;

    background:#090909;
}


.mos-viewer-player.is-long {
    width:100%;
    aspect-ratio:16/9;
}


.mos-viewer-player.is-short {
    width:min(
        440px,
        100%
    );

    aspect-ratio:9/16;
}


.mos-viewer-poster,
.mos-viewer-player iframe,
.mos-viewer-player video {
    display:block;

    width:100%;
    height:100%;

    object-fit:cover;
}


.mos-viewer-play {
    position:absolute;

    left:50%;
    top:50%;

    transform:
        translate(-50%,-50%);

    display:flex;
    align-items:center;
    justify-content:center;

    width:78px;
    height:78px;

    padding:0;

    border:0;
    border-radius:50%;

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

    backdrop-filter:blur(9px);

    cursor:pointer;
}


.mos-viewer-play span {
    width:0;
    height:0;

    margin-left:5px;

    border-top:
        10px solid transparent;

    border-bottom:
        10px solid transparent;

    border-left:
        16px solid #fff;
}


.mos-viewer-products {
    margin-top:34px;
}


.mos-viewer-products
.mos-video-products-wrap {
    margin-top:0;
}


.mos-viewer-close {
    position:fixed;

    right:25px;
    top:22px;

    z-index:10;

    width:46px;
    height:46px;

    padding:0;

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

    border-radius:50%;

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

    color:#fff;

    font-size:29px;
    font-weight:300;
    line-height:1;

    cursor:pointer;
}


.mos-viewer-counter {
    position:fixed;

    left:25px;
    top:30px;

    z-index:10;

    color:#bbb;

    font-size:12px;

    letter-spacing:.08em;
}


.mos-viewer-nav {
    position:fixed;

    z-index:10;

    top:50%;

    transform:
        translateY(-50%);

    display:flex;
    align-items:center;
    justify-content:center;

    width:52px;
    height:70px;

    padding:0;

    border:0;

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

    color:#fff;

    cursor:pointer;
}


.mos-viewer-nav span {
    font-size:42px;
    line-height:1;
}


.mos-viewer-prev {
    left:18px;
}


.mos-viewer-next {
    right:18px;
}


/*
 * Short-video viewer:
 * arrows become vertical.
 */

.mos-video-viewer.is-short-viewer
.mos-viewer-prev {
    left:auto;
    right:24px;
    top:42%;

    width:48px;
    height:48px;

    transform:
        rotate(90deg);
}


.mos-video-viewer.is-short-viewer
.mos-viewer-next {
    right:24px;
    top:58%;

    width:48px;
    height:48px;

    transform:
        rotate(90deg);
}


.mos-viewer-loading,
.mos-viewer-error {
    display:flex;
    align-items:center;
    justify-content:center;

    min-height:60vh;

    color:#999;

    font-size:14px;
}


.mos-viewer-deep-link {
    display:inline-block;

    margin-top:30px;

    color:#777 !important;

    font-size:11px;

    text-decoration:none !important;

    border-bottom:
        1px solid #555;
}


/* MOBILE */

@media (max-width: 767px) {

    .mos-viewer-content {
        width:100%;

        padding:
            70px
            14px
            90px;
    }


    .mos-viewer-meta {
        margin-bottom:16px;
    }


    .mos-viewer-meta h2 {
        font-size:27px;
    }


    .mos-viewer-close {
        top:14px;
        right:14px;

        width:42px;
        height:42px;
    }


    .mos-viewer-counter {
        left:16px;
        top:26px;
    }


    /*
     * Mobile navigation is primarily swipe.
     * Keep arrows subtle.
     */

    .mos-viewer-nav {
        width:38px;
        height:54px;

        opacity:.55;
    }


    .mos-viewer-prev {
        left:4px;
    }


    .mos-viewer-next {
        right:4px;
    }


    .mos-video-viewer.is-short-viewer
    .mos-viewer-prev,
    .mos-video-viewer.is-short-viewer
    .mos-viewer-next {
        right:8px;

        width:38px;
        height:38px;
    }


    .mos-viewer-play {
        width:66px;
        height:66px;
    }


    .mos-viewer-products {
        margin-top:24px;
    }

}


/* =========================================================
   MOS VIEWER V3.1 - TRUE VIEWPORT FULLSCREEN
   ========================================================= */

.mos-video-viewer {
    position:fixed !important;

    top:0 !important;
    right:0 !important;
    bottom:0 !important;
    left:0 !important;

    width:100vw !important;
    height:100vh !important;
    height:100dvh !important;

    margin:0 !important;

    z-index:2147483000 !important;
}


.mos-video-viewer-backdrop {
    position:fixed !important;
    inset:0 !important;

    width:100vw !important;
    height:100vh !important;
    height:100dvh !important;
}


.mos-video-viewer-shell {
    position:absolute !important;
    inset:0 !important;

    width:100% !important;
    height:100% !important;

    margin:0 !important;

    overflow-x:hidden !important;
    overflow-y:auto !important;
}


.mos-viewer-content {
    position:relative;

    padding-top:70px !important;
}


.mos-viewer-meta {
    display:block !important;

    position:relative !important;

    visibility:visible !important;
    opacity:1 !important;

    z-index:2;

    margin-bottom:24px !important;
}


.mos-viewer-meta h2 {
    display:block !important;

    visibility:visible !important;
    opacity:1 !important;

    color:#fff !important;

    margin:
        0
        0
        18px !important;
}


.mos-viewer-label {
    display:block !important;

    visibility:visible !important;
    opacity:1 !important;
}


/* Viewer should sit above Kera header / admin toolbar */

body.mos-video-viewer-open
.mos-video-viewer {
    transform:none !important;
}


@media (max-width: 767px) {

    .mos-viewer-content {
        padding-top:72px !important;
    }

}


/* =========================================================
   MOS VIEWER V3.2
   SHORT VIDEO POSTER FIX
   Do not crop Vimeo / vertical-video posters on first open.
   ========================================================= */

.mos-video-viewer.is-short-viewer
.mos-viewer-player.is-short {
    background:#000 !important;
}


.mos-video-viewer.is-short-viewer
.mos-viewer-player.is-short
.mos-viewer-poster {
    width:100% !important;
    height:100% !important;

    object-fit:contain !important;
    object-position:center center !important;

    background:#000 !important;
}


/*
 * Actual playing video still fills its proper player area.
 */

.mos-video-viewer.is-short-viewer
.mos-viewer-player.is-short video,
.mos-video-viewer.is-short-viewer
.mos-viewer-player.is-short iframe {
    width:100% !important;
    height:100% !important;
}


@media (max-width:767px) {

    .mos-video-viewer.is-short-viewer
    .mos-viewer-player.is-short {
        width:min(100%, 430px) !important;
        margin-left:auto !important;
        margin-right:auto !important;
    }

}


/* =========================================================
   MOS VIEWER V3.3
   Restore full/tall Short Viewer poster.
   Keep correct first-load positioning.
   ========================================================= */

.mos-video-viewer.is-short-viewer
.mos-viewer-player.is-short {
    width:min(440px, 100%) !important;
    aspect-ratio:9/16 !important;

    margin-left:auto !important;
    margin-right:auto !important;

    background:#000 !important;
}


.mos-video-viewer.is-short-viewer
.mos-viewer-player.is-short
.mos-viewer-poster {
    width:100% !important;
    height:100% !important;

    object-fit:cover !important;
    object-position:center center !important;

    display:block !important;

    opacity:0;
    transition:opacity .15s ease;
}


.mos-video-viewer.is-short-viewer
.mos-viewer-player.is-short
.mos-viewer-poster.is-ready {
    opacity:1;
}


@media (max-width:767px) {

    .mos-video-viewer.is-short-viewer
    .mos-viewer-player.is-short {
        width:min(100%, 430px) !important;
    }

}

/* =========================================================
   MOS VIDEOS V4
   Separate Long / Short navigation
   + smaller mobile product cards
   ========================================================= */


/* You're caught up */

.mos-viewer-caught-up {
    min-height:75vh;

    display:flex;
    align-items:center;
    justify-content:center;

    text-align:center;
}

.mos-viewer-caught-up h2 {
    margin:8px 0 10px;

    color:#fff;

    font-size:clamp(
        30px,
        5vw,
        54px
    );

    font-weight:500;
}

.mos-viewer-caught-up p {
    margin:0;

    color:#999;

    font-size:14px;
}

.mos-viewer-caught-back {
    margin-top:24px;

    padding:10px 18px;

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

    background:transparent;

    color:#fff;

    cursor:pointer;
}


/*
 * Phone + tablet:
 * navigation is gestures, not arrows.
 */
@media (max-width:1199px) {

    .mos-video-viewer
    .mos-viewer-nav {
        display:none !important;
    }


    /*
     * Compact promoted products.
     */
    .mos-viewer-products {
        margin-top:22px !important;
    }

    .mos-viewer-products
    .mos-video-products-wrap h3 {
        margin-bottom:12px !important;

        font-size:18px !important;
    }

    .mos-viewer-products
    .mos-video-products {
        gap:10px !important;

        padding-bottom:6px;
    }

    .mos-viewer-products
    .mos-video-product-card {
        flex:
            0
            0
            132px !important;
    }

    .mos-viewer-products
    .mos-video-product-image {
        aspect-ratio:1/1 !important;
    }

    .mos-viewer-products
    .mos-video-product-info {
        padding:
            8px
            9px
            10px !important;
    }

    .mos-viewer-products
    .mos-video-product-info strong {
        font-size:11px !important;
        line-height:1.25 !important;
    }

    .mos-viewer-products
    .mos-video-product-price {
        margin-top:5px !important;

        font-size:10px !important;
        line-height:1.35 !important;
    }

    .mos-viewer-products
    .mos-video-product-link {
        margin-top:7px !important;

        font-size:10px !important;
    }
}


@media (max-width:480px) {

    .mos-viewer-products
    .mos-video-product-card {
        flex:
            0
            0
            118px !important;
    }

}


/*
 * Desktop Long:
 * left/right arrows.
 */
@media (min-width:1200px) {

    .mos-video-viewer.is-long-viewer
    .mos-viewer-prev,
    .mos-video-viewer.is-long-viewer
    .mos-viewer-next {
        display:flex !important;
    }


    /*
     * Desktop Short:
     * arrows become vertical.
     */
    .mos-video-viewer.is-short-viewer
    .mos-viewer-prev,
    .mos-video-viewer.is-short-viewer
    .mos-viewer-next {
        display:flex !important;
    }
}


/* =========================================================
   MOS VIDEOS V6
   Compact product cards - desktop + tablet + mobile
   Full product image, no crop
   ========================================================= */

/* ALL VIEWER SIZES */

.mos-viewer-products {
    margin-top:22px !important;
}

.mos-viewer-products
.mos-video-products-wrap h3 {
    margin:0 0 12px !important;

    font-size:19px !important;
    line-height:1.25 !important;
}

.mos-viewer-products
.mos-video-products {
    display:flex !important;

    gap:12px !important;

    overflow-x:auto !important;
    overflow-y:hidden !important;

    padding:0 0 8px !important;

    scroll-snap-type:x proximity;
    -webkit-overflow-scrolling:touch;
}

.mos-viewer-products
.mos-video-product-card {
    flex:0 0 150px !important;

    width:150px !important;

    background:#fff !important;

    scroll-snap-align:start;

    overflow:hidden !important;

    border-radius:0 !important;
}

/* Full eyewear image - never crop */

.mos-viewer-products
.mos-video-product-image {
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    width:100% !important;
    height:112px !important;

    aspect-ratio:auto !important;

    padding:8px !important;

    background:#fff !important;

    box-sizing:border-box !important;
}

.mos-viewer-products
.mos-video-product-image img {
    display:block !important;

    width:100% !important;
    height:100% !important;

    object-fit:contain !important;
    object-position:center center !important;
}

/* Product text */

.mos-viewer-products
.mos-video-product-info {
    padding:9px 10px 11px !important;
}

.mos-viewer-products
.mos-video-product-info strong {
    display:block !important;

    min-height:0 !important;

    color:#111 !important;

    font-size:12px !important;
    line-height:1.3 !important;
}

.mos-viewer-products
.mos-video-product-price {
    display:block !important;

    margin-top:6px !important;

    font-size:11px !important;
    line-height:1.35 !important;
}

.mos-viewer-products
.mos-video-product-price del {
    font-size:10px !important;
}

.mos-viewer-products
.mos-video-product-price ins {
    font-size:11px !important;

    text-decoration:none !important;
}

.mos-viewer-products
.mos-video-product-link {
    display:inline-block !important;

    margin-top:8px !important;

    font-size:10px !important;
    line-height:1.2 !important;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width:1199px) {

    .mos-viewer-products
    .mos-video-product-card {
        flex-basis:132px !important;
        width:132px !important;
    }

    .mos-viewer-products
    .mos-video-product-image {
        height:98px !important;
        padding:6px !important;
    }

    .mos-viewer-products
    .mos-video-product-info strong {
        font-size:11px !important;
    }

    .mos-viewer-products
    .mos-video-product-price {
        font-size:10px !important;
    }
}


/* =========================================================
   PHONE
   ========================================================= */

@media (max-width:600px) {

    .mos-viewer-products
    .mos-video-products-wrap h3 {
        font-size:17px !important;
    }

    .mos-viewer-products
    .mos-video-product-card {
        flex-basis:116px !important;
        width:116px !important;
    }

    .mos-viewer-products
    .mos-video-product-image {
        height:86px !important;
        padding:5px !important;
    }

    .mos-viewer-products
    .mos-video-product-info {
        padding:7px 8px 9px !important;
    }

    .mos-viewer-products
    .mos-video-product-info strong {
        font-size:10px !important;
    }

    .mos-viewer-products
    .mos-video-product-price,
    .mos-viewer-products
    .mos-video-product-price ins {
        font-size:9px !important;
    }

    .mos-viewer-products
    .mos-video-product-price del {
        font-size:8px !important;
    }

    .mos-viewer-products
    .mos-video-product-link {
        font-size:9px !important;
    }

}


/* =========================================================
   MOS VIDEOS V7
   Universal LEFT / RIGHT navigation
   ========================================================= */

/* Show navigation on desktop, tablet and phone */

.mos-video-viewer
.mos-viewer-nav {
    display:flex !important;

    top:50% !important;

    width:44px !important;
    height:60px !important;

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


/* Kill old Short vertical arrow positioning */

.mos-video-viewer.is-short-viewer
.mos-viewer-prev {
    left:8px !important;
    right:auto !important;
    top:50% !important;

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

.mos-video-viewer.is-short-viewer
.mos-viewer-next {
    right:8px !important;
    left:auto !important;
    top:50% !important;

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


/* Long uses same left/right layout */

.mos-video-viewer.is-long-viewer
.mos-viewer-prev {
    left:8px !important;
    right:auto !important;
}

.mos-video-viewer.is-long-viewer
.mos-viewer-next {
    right:8px !important;
    left:auto !important;
}


/* Phone: keep arrows compact */

@media (max-width:600px) {

    .mos-video-viewer
    .mos-viewer-nav {
        width:32px !important;
        height:46px !important;

        background:rgba(0,0,0,.42) !important;

        opacity:.8 !important;
    }

    .mos-video-viewer
    .mos-viewer-nav span {
        font-size:30px !important;
    }

}


/* =========================================================
   MOS VIDEOS V7 PRODUCT CARDS
   Full product frame - never use cropped presentation
   ========================================================= */

.mos-viewer-products
.mos-video-product-image {
    overflow:hidden !important;

    background:#fff !important;
}

.mos-viewer-products
.mos-video-product-image img {
    width:100% !important;
    height:100% !important;

    max-width:100% !important;
    max-height:100% !important;

    object-fit:contain !important;
    object-position:center center !important;

    transform:none !important;
}


/* Desktop */

@media (min-width:1200px) {

    .mos-viewer-products
    .mos-video-product-card {
        flex:0 0 150px !important;
        width:150px !important;
        max-width:150px !important;
    }

    .mos-viewer-products
    .mos-video-product-image {
        width:150px !important;
        height:105px !important;

        padding:7px !important;

        box-sizing:border-box !important;
    }

}


/* Tablet */

@media (min-width:601px) and (max-width:1199px) {

    .mos-viewer-products
    .mos-video-product-card {
        flex:0 0 132px !important;
        width:132px !important;
        max-width:132px !important;
    }

    .mos-viewer-products
    .mos-video-product-image {
        width:132px !important;
        height:92px !important;

        padding:6px !important;

        box-sizing:border-box !important;
    }

}


/* Phone */

@media (max-width:600px) {

    .mos-viewer-products
    .mos-video-product-card {
        flex:0 0 116px !important;

        width:116px !important;
        max-width:116px !important;

        min-width:116px !important;
    }

    .mos-viewer-products
    .mos-video-product-image {
        width:116px !important;
        height:82px !important;

        min-width:116px !important;

        padding:5px !important;

        box-sizing:border-box !important;
    }

    .mos-viewer-products
    .mos-video-product-image img {
        object-fit:contain !important;
    }

}

