body:not(.elementor-editor-active) .pxl-element-slider {
    opacity: 0;
}
.pxl-element-slider {
    position: relative;
    @include transition(all 250ms linear 0ms);
    border-radius: inherit;
    .pxl-slider--content {
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
        .elementor-top-section {
            left: 0 !important;
            right: 0 !important;
        }
    }
    .pxl-slider-progressbar {
        position: absolute;
        left: 0;
        top: 0;
        background-color: $primary_color;
        height: 2px;
        z-index: 100;
        width: 0;
        @include transition(all 100ms linear 0ms);
    }
    .pxl-slider--image {
        position: absolute;
        top: 0;
        right: 0;
        width: 100%;
        height: 100%;
        @include transition(all 300ms linear 0ms);
    }
    .pxl-slider--mainimage {
        position: absolute;
        top: 0;
        right: 0;
        width: 100%;
        height: 100%;
        z-index: -2;
        @include transition(all 600ms linear 0ms);
        overflow: hidden;
        &.wow {
            visibility: visible;
        }
        &.pxl-image--kenburns.animated {
            animation-name: pxl_kenburns;
            animation-timing-function: linear;
            animation-iteration-count: infinite;
            animation-duration: 40s;
            transform: scale(1.2);
        }
    }
    .pxl-slider--overlay {
        position: absolute;
        top: 0;
        right: 0;
        width: 100%;
        height: 100%;
        z-index: -1;
        overflow: hidden;
    }
    .pxl-slider--inner {
        position: relative;
        z-index: 1;
        overflow: hidden;
        height: 800px;
    }
    .pxl-slider--mainimage, .pxl-slider--image, .pxl-slider--inner, .pxl-swiper-slide, .pxl-swiper-wrapper, .pxl-swiper-container, .pxl-carousel-inner {
        border-radius: inherit;
    }

    .pxl-swiper-arrow-wrap {
        margin: 0;
        .pxl-swiper-arrow {
            margin: 0;
            position: absolute;
            top: 50%;
            @include transform(translate(0, -50%));
            color: $primary_color;
            background-color: #fff;
            @include box-shadow(0 10px 60px rgba(#8997BA, 0.15));
            opacity: 0;
            @media #{$max-lg} {
                font-size: 14px;
                width: 56px;
                height: 56px;
                line-height: 56px;
            }
            &:hover {
                background-color: $primary_color;
                color: #fff;
                @include box-shadow(none);
            }
        }
        .pxl-swiper-arrow-prev {
            left: 60px;
            @media #{$max-lg} {
                left: 30px;
            }
        }
        .pxl-swiper-arrow-next {
            right: 60px;
            @media #{$max-lg} {
                right: 30px;
            }
        }
    }
    .pxl-swiper-pagination {
        margin: 0;
        position: absolute;
        left: 0;
        right: 0;
        bottom: 30px;
        z-index: 99;
    }
    &:hover .pxl-swiper-arrow-wrap { 
       .pxl-swiper-arrow {
            opacity: 1;
       }
    }
}