
.swiper-container {
    margin-left : auto;
    margin-right: auto;
    position    : relative;
    overflow    : hidden;
    list-style  : none;
    padding     : 0;
    z-index     : 1;
}

.swiper-wrapper {
    position           : relative;
    width              : 100%;
    height             : 100%;
    z-index            : 1;
    display            : flex;
    transition-property: transform;
    box-sizing         : content-box;
}

.swiper-slide {
    flex-shrink        : 0;
    width              : 100%;
    height             : 100%;
    position           : relative;
    transition-property: transform;
}

.glightbox-container {
    width                      : 100%;
    height                     : 100%;
    position                   : fixed;
    top                        : 0;
    left                       : 0;
    z-index                    : 999999 !important;
    overflow                   : hidden;
    touch-action               : none;
    -webkit-text-size-adjust   : 100%;
    -moz-text-size-adjust      : 100%;
    text-size-adjust           : 100%;
    -webkit-backface-visibility: hidden;
    backface-visibility        : hidden;
    outline                    : none;
}

.glightbox-container .gcontainer {
    position: relative;
    width   : 100%;
    height  : 100%;
    z-index : 9999;
    overflow: hidden;
}

.glightbox-container .gslider {
    transition     : transform 0.4s ease;
    height         : 100%;
    left           : 0;
    top            : 0;
    width          : 100%;
    position       : relative;
    overflow       : hidden;
    display        : flex !important;
    justify-content: center;
    align-items    : center;
    transform      : translate3d(0, 0, 0);
}

.glightbox-container .gslide {
    width              : 100%;
    position           : absolute;
    -webkit-user-select: none;
    -moz-user-select   : none;
    user-select        : none;
    display            : flex;
    align-items        : center;
    justify-content    : center;
    opacity            : 0;
}

.glightbox-container .gslide.current {
    opacity : 1;
    z-index : 99999;
    position: relative;
}

.glightbox-desc {
    display: none !important;
}

.glightbox-open {
    overflow: hidden;
}



.goverlay {
    width      : 100%;
    height     : calc(100vh + 1px);
    position   : fixed;
    top        : -1px;
    left       : 0;
    background : #000;
    will-change: opacity;
}

.glightbox-mobile .goverlay {
    background: #000;
}

.gprev,
.gnext,
.gclose {
    z-index        : 99999;
    cursor         : pointer;
    width          : 26px;
    height         : 44px;
    border         : none;
    display        : flex;
    justify-content: center;
    align-items    : center;
    flex-direction : column;
}


.glightbox-clean .gslide-description {
    background: #fff;
}

.glightbox-clean .gdesc-inner {
    padding: 22px 20px;
}

.glightbox-clean .gslide-video {
    background: #000;
}

.glightbox-clean .gprev path,
.glightbox-clean .gnext path,
.glightbox-clean .gclose path {
    fill: #fff;
}

.glightbox-clean .gprev {
    position: absolute;
    top     : -100%;
    left    : 30px;
    width   : 40px;
    height  : 50px;
}

.glightbox-clean .gnext {
    position: absolute;
    top     : -100%;
    right   : 30px;
    width   : 40px;
    height  : 50px;
}

.glightbox-clean .gclose {
    width   : 35px;
    height  : 35px;
    top     : 15px;
    right   : 10px;
    position: absolute;
}

.glightbox-clean .gclose svg {
    width : 18px;
    height: auto;
}

/*CSS Animations*/
.gfadeIn {
    animation: gfadeIn 0.5s ease;
}

.gfadeOut {
    animation: gfadeOut 0.5s ease;
}

.gslideOutLeft {
    animation: gslideOutLeft 0.3s ease;
}

.gslideInLeft {
    animation: gslideInLeft 0.3s ease;
}

.gslideOutRight {
    animation: gslideOutRight 0.3s ease;
}

.gslideInRight {
    animation: gslideInRight 0.3s ease;
}

.gzoomIn {
    animation: gzoomIn 0.5s ease;
}

.gzoomOut {
    animation: gzoomOut 0.5s ease;
}

@keyframes lightboxLoader {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

@keyframes gfadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes gfadeOut {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}

@keyframes gslideInLeft {
    from {
        opacity  : 0;
        transform: translate3d(-60%, 0, 0);
    }

    to {
        visibility: visible;
        transform : translate3d(0, 0, 0);
        opacity   : 1;
    }
}

@keyframes gslideOutLeft {
    from {
        opacity   : 1;
        visibility: visible;
        transform : translate3d(0, 0, 0);
    }

    to {
        transform : translate3d(-60%, 0, 0);
        opacity   : 0;
        visibility: hidden;
    }
}

@keyframes gslideInRight {
    from {
        opacity   : 0;
        visibility: visible;
        transform : translate3d(60%, 0, 0);
    }

    to {
        transform: translate3d(0, 0, 0);
        opacity  : 1;
    }
}

@keyframes gslideOutRight {
    from {
        opacity   : 1;
        visibility: visible;
        transform : translate3d(0, 0, 0);
    }

    to {
        transform: translate3d(60%, 0, 0);
        opacity  : 0;
    }
}

@keyframes gzoomIn {
    from {
        opacity  : 0;
        transform: scale3d(0.3, 0.3, 0.3);
    }

    to {
        opacity: 1;
    }
}

@keyframes gzoomOut {
    from {
        opacity: 1;
    }

    50% {
        opacity  : 0;
        transform: scale3d(0.3, 0.3, 0.3);
    }

    to {
        opacity: 0;
    }
}

@media (min-width: 769px) {
    .glightbox-container .ginner-container {
        width         : auto;
        height        : auto;
        flex-direction: row;
    }

    .glightbox-container .ginner-container.desc-top .gslide-description {
        order: 0;
    }

    .glightbox-container .ginner-container.desc-top .gslide-image,
    .glightbox-container .ginner-container.desc-top .gslide-image img {
        order: 1;
    }

    .glightbox-container .ginner-container.desc-left .gslide-description {
        order: 0;
    }

    .glightbox-container .ginner-container.desc-left .gslide-image {
        order: 1;
    }

    .gslide-image img {
        max-height: 97vh;
        max-width : 100%;
    }

    .gslide-image img.zoomable {
        cursor: zoom-in;
    }

    .zoomed .gslide-image img.zoomable {
        cursor: grab;
    }

    .gslide-inline {
        max-height: 95vh;
    }

    .gslide-external {
        max-height: 100vh;
    }

    .gslide-description.description-left,
    .gslide-description.description-right {
        max-width: 275px;
    }

    .glightbox-open {
        height: auto;
    }

    .goverlay {
        background: rgba(0, 0, 0, 0.92);
    }

    .glightbox-clean .gslide-media {
        box-shadow: 1px 2px 9px 0px rgba(0, 0, 0, 0.65);
    }

    .glightbox-clean .description-left .gdesc-inner,
    .glightbox-clean .description-right .gdesc-inner {
        position  : absolute;
        height    : 100%;
        overflow-y: auto;
    }

    .glightbox-clean .gprev,
    .glightbox-clean .gnext,
    .glightbox-clean .gclose {
        background-color: rgba(0, 0, 0, 0.32);
    }

    .glightbox-clean .gprev:hover,
    .glightbox-clean .gnext:hover,
    .glightbox-clean .gclose:hover {
        background-color: rgba(0, 0, 0, 0.7);
    }

    .glightbox-clean .gprev {
        top: 45%;
    }

    .glightbox-clean .gnext {
        top: 45%;
    }
}

@media (min-width: 992px) {
    .glightbox-clean .gclose {
        right: 24px;
    }
}

@media screen and (max-height: 420px) {
    .goverlay {
        background: #000;
    }
}