.cs-bottom-right {
    display: flex;
    justify-content: right;
}

.cs-bottom-left {
    display: flex;
    justify-content: start;
}

.cs-bottom-center {
    display: flex;
    justify-content: center;
}

.cs-top-left {
    display: flex;
    justify-content: start;
}

.cs-top-right {
    display: flex;
    justify-content: right;
}

.cs-top-center {
    display: flex;
    justify-content: center;
}

.owl-nav {
    margin: 20px 0px;
    display: flex;
    z-index: 999;
    position: relative;
}

.cm-contentSlider .vc_tta-panel-title {
    display: none;
}

.cm-contentSlider[data-align^="cs-top-"] {
    display: flex;
    flex-direction: column-reverse;
}

.vc_tta.vc_general .owl-item.active .vc_tta-panel-body {
    display: block !important;
}

.vc_controls>.vc_controls-cc {
    top: 10px !important;
}

.vc-main-sortable-container .cm-contentSlider.owl-carousel {
    display: block !important;
}

.cm-shortcode-icon {
    width: 50px !important;
    content: url('./../images/wpbakery_icn.png') !important;
    vertical-align: middle;
}

.cm-shortcode-text {
    text-align: center !important;
    font-weight: 600;
    vertical-align: middle;
}

.slider_counter {
    margin: 0 20px;
    align-self: center;
}

.slider_counter.hide {
    display: none;
}


.cm-contentSlider.cm-left-side .owl-stage-outer {
    -webkit-mask-image: linear-gradient(to left, black calc(100% - var(--gradient-overlay)), transparent 100%);
    mask-image: linear-gradient(to left, black calc(100% - var(--gradient-overlay)), transparent 100%);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
}

.cm-contentSlider.cm-right-side .owl-stage-outer {
    -webkit-mask-image: linear-gradient(to right, black calc(100% - var(--gradient-overlay)), transparent 100%);
    mask-image: linear-gradient(to right, black calc(100% - var(--gradient-overlay)), transparent 100%);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
}

/* .cm-contentSlider.cm-both-side {
    -webkit-mask-image: linear-gradient(to right, transparent, black var(--gradient-overlay2), black var(--gradient-overlay), transparent);
    mask-image: linear-gradient(to right, transparent, black var(--gradient-overlay2), black var(--gradient-overlay), transparent);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
} */


.cm-contentSlider.cm-both-side .owl-stage-outer {
    mask-image: linear-gradient(to right, black calc(100% - var(--gradient-overlay)), transparent 100%),
        linear-gradient(to left, black calc(100% - var(--gradient-overlay)), transparent 100%);
    -webkit-mask-image: linear-gradient(to right, black calc(100% - var(--gradient-overlay)), transparent 100%),
        linear-gradient(to left, black calc(100% - var(--gradient-overlay)), transparent 100%);
    mask-composite: intersect;
    -webkit-mask-composite: destination-in;
    /* For Safari */
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    mask-size: 100% 100%;
    -webkit-mask-size: 100% 100%;
}

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

    .cm-contentSlider.cm-left-side[data-hide-gradient-mobile="yes"] .owl-stage-outer,
    .cm-contentSlider.cm-right-side[data-hide-gradient-mobile="yes"] .owl-stage-outer,
    .cm-contentSlider.cm-both-side[data-hide-gradient-mobile="yes"] .owl-stage-outer {
        -webkit-mask-image: none;
        mask-image: none;
    }

}

/*Dots Styling Start*/
.cm-contentSlider .owl-dots {
    position: absolute;
    bottom: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: var(--dot-spacing);
}

.cm-contentSlider.cm-dots-center .owl-dots {
    left: 50%;
    transform: translateX(-50%);
}

.cm-contentSlider.cm-dots-left .owl-dots {
    left: 0;
}

.cm-contentSlider.cm-dots-right .owl-dots {
    right: 0;
}

.cm-contentSlider .owl-dots .owl-dot {
    width: var(--dot-width);
    aspect-ratio: 1 / 1;
    background: var(--dot-bg-color);
    border-radius: var(--dot-border-radius);
    cursor: pointer;
    transition: all 0.4s ease;
    position: relative;
}

.cm-contentSlider .owl-dots .owl-dot.active {
    background: var(--dot-bg-active-color);
}

.cm-contentSlider .owl-dots .owl-dot:hover {
    background: var(--dot-bg-hover);
}

.cm-contentSlider .owl-dots .owl-dot span {
    display: none;
}

/*Dots Styling End*/