/* ==========================================================================
# Image Gallery - begin
========================================================================== */

/* Image Gallery Grid - begin
========================================================================== */

.qodef-image-gallery {

    margin:0 -6px;
    
    .qodef-grayscale .qodef-gallery-image img {
        -webkit-filter: grayscale(100%);
        -moz-filter: grayscale(100%);
        filter: grayscale(100%);
    }

    .qodef-grayscale .qodef-gallery-image:hover img {
        -webkit-filter: grayscale(0);
        filter: none;
    }

    :not(.qodef-grayscale) .qodef-gallery-image img {
        @include qodefTransition(opacity 0.3s ease);
        -webkit-backface-visibility: hidden;

        &:hover{
            opacity:0.9;
        }
    }


    .qodef-gallery-image {
        padding:6px;
        display: inline-block;
        float: left;
        box-sizing: border-box;

        img {
            display: block;
        }
    }

    .qodef-image-gallery-grid.qodef-gallery-columns-2 {

        .qodef-gallery-image {
            width: 50%;

            &:nth-child(2n+1) {
                clear: both;
            }
        }
    }

    .qodef-image-gallery-grid.qodef-gallery-columns-3 {

        .qodef-gallery-image {
            width: 33.3333%;
            
            &:nth-child(3n+1) {
                clear: both;
            }

        }

    }

    .qodef-image-gallery-grid.qodef-gallery-columns-4 {

        .qodef-gallery-image {
            width: 25%;

            &:nth-child(4n+1) {
                clear: both;
            }

        }

    }

    .qodef-image-gallery-grid.qodef-gallery-columns-5 {

        .qodef-gallery-image {
            width: 20%;

            &:nth-child(5n+1) {
                clear: both;
            }

        }

    }

    .owl-carousel .owl-item img.qodef-image-gallery-defined-height {
        width:auto;
        max-width:100%;
    }

}

/* Image Gallery Grid - end
========================================================================== */

/* Image Gallery Slider - begin
========================================================================== */

.qodef-image-gallery {

    .owl-nav {
        width: 100%;
        .owl-prev {
            left: 1.5%;
            position: absolute;
            top: 45%;
            @include qodefTransform(translateY(-50%));
        }
        .owl-next {
            right: 1.5%;
            position: absolute;
            top: 45%;
            @include qodefTransform(translateY(-50%));
        }
        .qodef-prev-icon,
        .qodef-next-icon {
            font-size: 26px;
            line-height: 40px;
            color: #fff;
            vertical-align: middle;
            width: 40px;
            height: 40px;
            display: inline-block;
            text-align: center;

            i {
                line-height: 40px;
            }
        }
    }

    .owl-dots {
        margin-top: 30px;
        text-align: center;

        .owl-dot {
            display: inline-block;
        }

        .owl-dot span {
            display: inline-block;
            width: 10px;
            height: 10px;
            margin: 3px 6px;
            filter: Alpha(Opacity=50);
            opacity: 0.5;
            -webkit-border-radius: 20px;
            -moz-border-radius: 20px;
            border-radius: 20px;
            background: #ccc;
        }

        .owl-dot.active span {
            opacity: 1;
            background:$first-main-color;
        }

    }


}

/* Image Gallery Slider - end
========================================================================== */

/* ==========================================================================
# Image Gallery - end
========================================================================== */