.vreels {
    position: relative;
    min-height: 410px;
}

.vreels_sldr {
    overflow: hidden
}

.vreels_trk {
    display: flex;
    align-items: center;
    gap: 0 20px
}

.vreels_sld {
    position: relative;
    flex: 0 0 230px;
    width: 230px;
    aspect-ratio: 210/374;
    cursor: pointer;
    overflow: hidden;
    border-radius: 10px
}

.vreels_sld_f {
    position: relative;
    width: 100%;
    height: 100%;
    max-height: 410px
}

.vreels_sld_f img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.vreels_sld_t {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    font: 400 16px/20px var(--primary-font);
    color: #fff;
    padding: 12px;
    z-index: 1
}

.vreels_sld_t:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 10%, #000000 100%);
    z-index: -1
}

.vreels_sld_t:before {
    content: "";
    width: 40px;
    height: 40px;
    background: #532487 url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><path fill="%23ffffff" d="M8 19V5l11 7z"/></svg>') 50% 50% no-repeat;
    background-size: 16px;
    display: block;
    border-radius: 50%;
    border: 5px solid var(--accent-yellow);
    margin: 0 0 10px
}

.vreels_sld_play {
    display: none
}

.vreels_sld_prw {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    opacity: 0;
    pointer-events: none
}

.vreels_sld_prw video {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.vreels_nav {
    display: none
}

.vreel-sw {
    display: none;
    position: fixed;
    inset: 0 0 0 0;
    overflow: hidden;
    z-index: 100000009
}

.vreel-sw.is-active {
    display: block
}

.vreel-sw:before {
    content: "";
    position: absolute;
    inset: 0 0 0 0;
    opacity: .95;
    background-color: #151515
}

.vreel-sw_help {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 0 20px 10px;
    font: 16px/20px var(--primary-font);
    color: #fff;
    text-align: center;
    pointer-events: none
}

.vreel-sw_sldr {
    position: absolute;
    inset: 0 -40px 0 0;
    overflow: hidden;
    display: flex
}

.vreel-sw_trk {
    position: relative;
    display: flex;
    align-items: center;
    flex-direction: column;
    width: 100%;
    padding-right: 40px;
    overflow-y: auto;
    -webkit-scroll-snap-type: y mandatory;
    -ms-scroll-snap-type: y mandatory;
    scroll-snap-type: y mandatory;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch
}

.vreel-sw_sld {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    flex: 0 0 100%;
    height: 100%;
    width: 100%;
    scroll-snap-align: start;
    scroll-snap-stop:always;opacity: 1
}

.vreel-sw_sld_ct {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden
}

.vreel-sw_sld_img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.vreel-sw_sld_tl {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    padding: 0 20px 70px;
    font: 400 16px/20px var(--primary-font);
    color: #fff;
    text-shadow: 0 0 5px rgba(0,0,0,.85);
    pointer-events: none
}

.vreel-sw_vid {
    position: absolute;
    top: 50%;
    justify-content: center;
    align-items: center;
    flex: 0 0 100%;
    height: 100%;
    width: calc(100% - 40px);
    z-index: 3;
    transform: translateY(-50%);
    display: none
}

.vreel-sw_vid.is-active {
    display: block
}

.vreel-sw_vid video {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.vreel-sw_ctrls {
    position: absolute;
    top: 10px;
    right: 10px;
    display: flex;
    flex-direction: column;
    padding-top: 60px;
    z-index: 5
}

.vreel-sw_nav {
    display: none
}

.vreel-sw_sh {
    position: absolute;
    inset: 0;
    z-index: 15;
    justify-content: center;
    align-items: center;
    display: none
}

.vreel-sw_sh_hz {
    position: absolute;
    inset: 0;
    opacity: .95;
    background-color: #212121;
    z-index: -1
}

.vreel-sw_sh_wr {
    position: relative;
    width: calc(100% - 20px);
    max-width: 460px;
    padding: 20px;
    margin: 0 10px;
    background: #fff
}

.vreel-sw_sh_tl {
    font: 600 21px/23px var(--primary-font);
    color: #333
}

.vreel-sw_sh_links {
    display: flex;
    justify-content: center;
    gap: 0 60px;
    padding: 30px 0 20px
}

.vreel-sw_sh_links .vreel-sw_btn {
    position: relative;
    width: auto;
    height: auto;
    border: none;
    border-radius: 0;
    background: none;
    font: 600 16px var(--primary-font);
    color: #333;
    display: flex;
    flex-direction: column
}

.vreel-sw_sh_links .vreel-sw_btn:hover {
    background: none;
    border: none
}

.vreel-sw_sh_links .vreel-sw_btn:hover::before {
    background: #333
}

.vreel-sw_sh_links .vreel-sw_btn+.vreel-sw_btn::after {
    content: "";
    position: absolute;
    pointer-events: none;
    top: 0;
    bottom: 0;
    left: -30px;
    width: 1px;
    background: #ddd
}

.vreel-sw_sh_close {
    position: absolute;
    right: 20px;
    top: 20px;
    width: 30px;
    height: 30px
}

.vreel-sw_sh_copy-wr {
    display: flex;
    justify-content: space-between;
    padding: 10px;
    background-color: #fcfcfc;
    color: #333;
    font: 15px/35px var(--primary-font)
}

.vreel-sw_sh_copy {
    padding: 0 15px;
    border-radius: 35px;
    font: 15px/35px var(--primary-font);
    color: #fff;
    background-color: #ff4438;
    margin-left: 10px;
    flex: 0 0 auto;
    transition: background .25s ease-in-out
}

.vreel-sw_sh_url {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.vreel-sw_sh.is-active {
    display: flex
}

.vreel-sw_btn {
    display: flex;
    width: 40px;
    height: 40px;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    background: rgba(67,67,67,.4) url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><path fill="%23ffffff" d="M6.4 19L5 17.6l5.6-5.6L5 6.4L6.4 5l5.6 5.6L17.6 5L19 6.4L13.4 12l5.6 5.6l-1.4 1.4l-5.6-5.6z"/></svg>') 50% 50% no-repeat;
    background-size: 24px;
    transition: background .25s ease-in-out,border-color .25s ease-in-out;
    cursor: pointer
}

.vreel-sw_btn_snd {
    background: rgba(67,67,67,.4) url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><path fill="%23ffffff" d="M14 20.725v-2.05q2.25-.65 3.625-2.5t1.375-4.2t-1.375-4.2T14 5.275v-2.05q3.1.7 5.05 3.138T21 11.975t-1.95 5.613T14 20.725M3 15V9h4l5-5v16l-5-5zm11 1V7.95q1.175.55 1.838 1.65T16.5 12q0 1.275-.663 2.363T14 16m-4-7.15L7.85 11H5v2h2.85L10 15.15zM7.5 12"/></svg>') 50% 50% no-repeat
}

.vreel-sw_btn_snd.is-muted {
    background: rgba(67,67,67,.4) url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><path fill="%23ffffff" d="M16.775 19.575q-.275.175-.55.325t-.575.275q-.375.175-.762 0t-.538-.575q-.15-.375.038-.737t.562-.538q.1-.05.188-.1t.187-.1L12 14.8v2.775q0 .675-.612.938T10.3 18.3L7 15H4q-.425 0-.712-.288T3 14v-4q0-.425.288-.712T4 9h2.2L2.1 4.9q-.275-.275-.275-.7t.275-.7t.7-.275t.7.275l17 17q.275.275.275.7t-.275.7t-.7.275t-.7-.275zm2.225-7.6q0-2.075-1.1-3.787t-2.95-2.563q-.375-.175-.55-.537t-.05-.738q.15-.4.538-.575t.787 0Q18.1 4.85 19.55 7.05T21 11.975q0 .825-.15 1.638t-.425 1.562q-.2.55-.612.688t-.763.012t-.562-.45t-.013-.75q.275-.65.4-1.312T19 11.975m-4.225-3.55Q15.6 8.95 16.05 10t.45 2v.25q0 .125-.025.25q-.05.325-.35.425t-.55-.15L14.3 11.5q-.15-.15-.225-.337T14 10.775V8.85q0-.3.263-.437t.512.012M9.75 6.95Q9.6 6.8 9.6 6.6t.15-.35l.55-.55q.475-.475 1.087-.213t.613.938V8q0 .35-.3.475t-.55-.125z"/></svg>') 50% 50% no-repeat
}

.vreel-sw_btn_prv {
    background: rgba(67,67,67,.4) url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><path fill="%23ffffff" d="m14 18l-1.4-1.45L16.15 13H4v-2h12.15L12.6 7.45L14 6l6 6z"/></svg>') 50% 50% no-repeat;
    transform: rotate(-90deg)
}

.vreel-sw_btn_nxt {
    background: rgba(67,67,67,.4) url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><path fill="%23ffffff" d="m14 18l-1.4-1.45L16.15 13H4v-2h12.15L12.6 7.45L14 6l6 6z"/></svg>') 50% 50% no-repeat;
    transform: rotate(90deg)
}

.vreel-sw_btn_close {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 7;
    background: rgba(67,67,67,.4) url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><path fill="%23ffffff" d="M6.4 19L5 17.6l5.6-5.6L5 6.4L6.4 5l5.6 5.6L17.6 5L19 6.4L13.4 12l5.6 5.6l-1.4 1.4l-5.6-5.6z"/></svg>') 50% 50% no-repeat;
    background-size: 24px
}

.vreel-sw_btn.is-disabled {
    opacity: .4;
    pointer-events: none
}

.vreel-sw_logo,.vreel-sw_help {
    display: none
}

@media(max-width: 995px) {
    .vreels_sldr {
        scroll-behavior:smooth;
        scroll-snap-type: x mandatory;
        overflow-x: auto
    }

    .vreels_sld {
        scroll-snap-align: start
    }
}

@media(min-width: 768px) {
    .vreel-sw_sld_ct {
        width:350px;
        height: 622px;
        border-radius: 10px
    }

    .vreel-sw_vid {
        width: 350px;
        height: 622px;
        flex: 0 0 622px;
        border-radius: 10px
    }

    .vreel-sw_ctrls {
        top: 50%;
        right: calc(50% - 60px);
        margin-top: -311px;
        margin-right: -175px;
        gap: 15px 0;
        padding-top: 55px
    }

    .vreel-sw_nav {
        display: flex;
        flex-direction: column;
        gap: 15px 0;
        position: absolute;
        bottom: 50%;
        right: calc(50% - 60px);
        margin-bottom: -311px;
        margin-right: -175px
    }

    .vreel-sw_btn_close {
        top: 50%;
        right: calc(50% - 60px);
        margin-top: -311px;
        margin-right: -175px
    }
}

@media(min-width: 996px) {
    .vreels_nav {
        position:absolute;
        display: flex;
        top: 50%;
        left: -20px;
        right: -20px;
        justify-content: space-between;
        margin: -17.5px 0 0
    }

    .vreels_btn {
        width: 40px;
        height: 40px;
        border-radius: 50%;
        box-shadow: 0px 2px 4px 0px rgba(34,39,61,.5019607843);
        background: #ffc2ff url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><path fill="%23532487" d="m14 18l-1.4-1.45L16.15 13H4v-2h12.15L12.6 7.45L14 6l6 6z"/></svg>') 50% 50% no-repeat;
        background-size: 26px;
        text-indent: -100px;
        overflow: hidden;
        cursor: pointer
    }

    .vreels_btn:hover {
        background: #ffc2ff url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><path fill="%23ffff00" d="m14 18l-1.4-1.45L16.15 13H4v-2h12.15L12.6 7.45L14 6l6 6z"/></svg>') 50% 50% no-repeat;
        background-size: 24px
    }

    .vreels_btn_prv {
        transform: rotate(180deg)
    }

    .vreels_btn.is-disabled {
        visibility: hidden
    }

    .vreel-sw_btn_snd:hover {
        background: rgba(67,67,67,.4) url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><path fill="%23ffff00" d="M14 20.725v-2.05q2.25-.65 3.625-2.5t1.375-4.2t-1.375-4.2T14 5.275v-2.05q3.1.7 5.05 3.138T21 11.975t-1.95 5.613T14 20.725M3 15V9h4l5-5v16l-5-5zm11 1V7.95q1.175.55 1.838 1.65T16.5 12q0 1.275-.663 2.363T14 16m-4-7.15L7.85 11H5v2h2.85L10 15.15zM7.5 12"/></svg>') 50% 50% no-repeat;
        background-size: 24px
    }

    .vreel-sw_btn_snd.is-muted:hover {
        background: rgba(67,67,67,.4) url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><path fill="%23ffff00" d="M16.775 19.575q-.275.175-.55.325t-.575.275q-.375.175-.762 0t-.538-.575q-.15-.375.038-.737t.562-.538q.1-.05.188-.1t.187-.1L12 14.8v2.775q0 .675-.612.938T10.3 18.3L7 15H4q-.425 0-.712-.288T3 14v-4q0-.425.288-.712T4 9h2.2L2.1 4.9q-.275-.275-.275-.7t.275-.7t.7-.275t.7.275l17 17q.275.275.275.7t-.275.7t-.7.275t-.7-.275zm2.225-7.6q0-2.075-1.1-3.787t-2.95-2.563q-.375-.175-.55-.537t-.05-.738q.15-.4.538-.575t.787 0Q18.1 4.85 19.55 7.05T21 11.975q0 .825-.15 1.638t-.425 1.562q-.2.55-.612.688t-.763.012t-.562-.45t-.013-.75q.275-.65.4-1.312T19 11.975m-4.225-3.55Q15.6 8.95 16.05 10t.45 2v.25q0 .125-.025.25q-.05.325-.35.425t-.55-.15L14.3 11.5q-.15-.15-.225-.337T14 10.775V8.85q0-.3.263-.437t.512.012M9.75 6.95Q9.6 6.8 9.6 6.6t.15-.35l.55-.55q.475-.475 1.087-.213t.613.938V8q0 .35-.3.475t-.55-.125z"/></svg>') 50% 50% no-repeat;
        background-size: 24px
    }

    .vreel-sw_btn_prv:hover {
        background: rgba(67,67,67,.4) url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><path fill="%23ffff00" d="m14 18l-1.4-1.45L16.15 13H4v-2h12.15L12.6 7.45L14 6l6 6z"/></svg>') 50% 50% no-repeat;
        background-size: 24px
    }

    .vreel-sw_btn_nxt:hover {
        background: rgba(67,67,67,.4) url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><path fill="%23ffff00" d="m14 18l-1.4-1.45L16.15 13H4v-2h12.15L12.6 7.45L14 6l6 6z"/></svg>') 50% 50% no-repeat;
        background-size: 24px
    }

    .vreel-sw_btn_close:hover {
        background: rgba(67,67,67,.4) url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><path fill="%23ffff00" d="M6.4 19L5 17.6l5.6-5.6L5 6.4L6.4 5l5.6 5.6L17.6 5L19 6.4L13.4 12l5.6 5.6l-1.4 1.4l-5.6-5.6z"/></svg>') 50% 50% no-repeat;
        background-size: 24px
    }
}

.c-cad.vids-new>div.vreels,.c-cad.vids-new>div#modal {
    border-bottom: none;
    padding: 0
}