ꦫꦣꦺꦤ꧀ꦄꦤ꧀ꦠꦱꦺꦤ

PATH: home / lab2454c / fcxpro.com / wp-content / plugins / webon-core / inc / shortcodes / frame-slider / assets / css / scss

/* ==========================================================================
   Frame Slider shortcode style - begin
   ========================================================================== */

.qodef-frame-slider-holder {
    position: relative;

.qodef-frame-slider-image {
        position: absolute;
        top: 0;
        left: 50%;
        width: 43.5%;
        transform: translateX(-50%);
        pointer-events: none;
        z-index: 100;

img {
            width: 100%;
        }
    }

.qodef-m-swiper {
        overflow: hidden;
    }

.qodef-m-item {
        height: 0;
        width: 0;
        margin: 0 -3.82%;
        padding-left: 50%;
        padding-top: calc(50% * 550 / 760); // 829 x 563 is ratio of notebook screen on frame image

img {
            position: absolute;
            top: -29px; // should be 0, frame image has antialiased transparent top
            left: 0;
            width: 100%;
            height: 100%;
            border-radius: 4%;
            transform: scale(.786);
            object-fit: contain;
            transition: transform .4s ease-out, all .3s .1s;
        }

&.swiper-slide-active,
        &.swiper-slide-duplicate-active{

img {
                transform: scale(.86);
                top: -35px;
            }
        }
    }

.qodef-m-items {
        opacity: 0;
        transition: opacity .5s;

&.qodef-swiper--initialized {
            opacity: 1;
        }
    }
}

/* ==========================================================================
   Frame Slider shortcode style - end
   ========================================================================== */

[+] ..
[-] _frame-slider-responsive.scss [edit]
[-] _frame-slider-default.scss [edit]