// Case Tabs
.pxl-tabs {
    .pxl-tab--title {
        display: inline-flex;
        cursor: pointer;
        @include transition(all 250ms linear 0ms);
        position: relative;
    }
    .pxl-tab--content {
        display: none;
        width: 100%;
    }
    .elementor-section.elementor-section-stretched {
        width: auto !important;
        left: 0 !important;
        right: 0 !important;
    }
    .pxl-tabs--elementor > .elementor {
        margin: 0 -15px;
    }
    &.tab-effect-fade {
        .pxl-tab--content {
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            height: 100% !important;
            display: block !important;
            opacity: 0 !important;
            visibility: hidden;
            @include transition(all .5s cubic-bezier(.645,.045,.355,1));
            transform: translateY(30px);
            &.active {
                position: static;
                opacity: 1 !important;
                visibility: visible;
                transform: translateY(0px);
            }
        }
        .pxl-tabs--content {
            position: relative;
        }
    }
}

// Case Counter
.pxl-counter {
    .pxl--counter-number {
        display: inline-flex;
        flex-wrap: wrap;
        align-items: center;
    }
}
.pxl-counterslide {
    display: -moz-inline-box;
    -moz-box-orient: vertical;
    display: inline-flex;
    vertical-align: middle;
    *vertical-align: auto;
    position: relative;
    .pxl-counterslide-inside {
      display: inline-flex;
    }
    .pxl-counterslide-digit-spacer {
        visibility: hidden;
    }
    .pxl-counterslide-digit, .pxl-counterslide-digit-spacer {
        display: -moz-inline-box;
        -moz-box-orient: vertical;
        display: inline-flex;
        vertical-align: middle;
        *vertical-align: auto;
        position: relative;
    }
    .pxl-counterslide-digit-inner {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        overflow: hidden;
    }
    .pxl-counterslide-ribbon {
        display: block;
    }
    .pxl-counterslide-ribbon-inner {
        display: block;
        -webkit-backface-visibility: hidden;
    }
    .pxl-counterslide-value {
        display: block;
        -webkit-transform: translateZ(0);
    }
    .pxl-counterslide-value.pxl-counterslide-last-value {
        position: absolute;
    }
    &.pxl-counterslide-animating-up .pxl-counterslide-ribbon-inner {
        -webkit-transition: -webkit-transform 2s;
        -moz-transition: -moz-transform 2s;
        -ms-transition: -ms-transform 2s;
        -o-transition: -o-transform 2s;
        transition: transform 2s;
    }
    &.pxl-counterslide-animating-up.pxl-counterslide-animating .pxl-counterslide-ribbon-inner {
        -webkit-transform: translateY(-100%);
        -moz-transform: translateY(-100%);
        -ms-transform: translateY(-100%);
        -o-transform: translateY(-100%);
        transform: translateY(-100%);
    }
    &.pxl-counterslide-animating-down .pxl-counterslide-ribbon-inner {
        -webkit-transform: translateY(-100%);
        -moz-transform: translateY(-100%);
        -ms-transform: translateY(-100%);
        -o-transform: translateY(-100%);
        transform: translateY(-100%);
    }
    &.pxl-counterslide-animating-down.pxl-counterslide-animating .pxl-counterslide-ribbon-inner {
        -webkit-transition: -webkit-transform 2s;
        -moz-transition: -moz-transform 2s;
        -ms-transition: -ms-transform 2s;
        -o-transition: -o-transform 2s;
        transition: transform 2s;
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
        transform: translateY(0);
    }
}

// Case Accordion
.pxl-accordion {
    .pxl-accordion--title {
        margin-bottom: 0;
        cursor: pointer;
    }
    .pxl-accordion--content {
        display: none;
    }
}

// Case Progressbar
.pxl--progressbar {
    @include transition(width 1.4s ease);
    width: 0;
    &.vertical {
        @include transition(height 1.4s ease);
        height: 0;
    }
}

// Case Video Player
.pxl-video-player1 {
    .pxl-overlay-color {
        z-index: 88;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }
    .pxl-video--holder {
        + .btn-video-wrap {
            position: absolute;
            z-index: 99;
            text-align: center;
            &.p-center {
                top: 50%;
                left: 50%;
                @include transform(translate(-50%, -50%));
            }
        }
    }
    .pxl-video--imagebg {
        position: relative;
        overflow: hidden;
        .bg-image {
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: -60px;
        }
    }
    .pxl-video--inner{
        overflow: hidden;
        .pxl-video--holder{
            width: 100%;
            height: 100%;
        }
        img{
            object-fit: cover;
            width: 100%;
            height: 100%;
        }
    }
    &.pxl-video-style3{
        .pxl-video--inner{
            overflow: hidden;
            .pxl-video--holder{
                width: 100%;
                height: 100%;
            }
            img{
                object-fit: cover;
                width: 100%;
                height: 100%;
            }
        }
        .pxl-video--holder {
            + .btn-video-wrap {
                &.p-center {
                    top: 0;
                    left: 0;
                    transition: transform 0.1s;
                }
            }
        }
    }
    
    &.pxl-video-style5{
        i{
            font-size: 42px;
            color: #fff;
        }
    }
    ///
    /// 
    &.style-1{
        position: relative;
        z-index: 1;
        .pxl-video--inner{
            &::before{
                position: absolute;
                content: '';
                width: calc(100% + 32px);
                height: calc(100% + 32px);
                transform: translate(-50%,-50%);
                top: 50%;
                left: 50%;
                background: #fff;
                border-radius: inherit;
                z-index: -1;
            }
        }
        
    }
    &.style-2{
        position: relative;
        z-index: 1;
        .pxl-video--inner{
            &::before{
                position: absolute;
                content: '';
                width: calc(100% + 32px);
                height: calc(100% + 32px);
                transform: translate(-50%,-50%);
                top: 50%;
                left: 50%;
                background: $heading_color;
                border-radius: inherit;
                z-index: -1;
            }
        }
        
    }
}