/*------------------------------------------------------------------------------ gallery section */
#gallery {
    background: #fbfbfb;
    padding: 100px;
}

    #gallery h4 {
        text-align: center;
        color: #0e0e0e;
        text-transform: uppercase;
        margin-bottom: 5px;
        font-size: 15px;
    }

    #gallery h3 {
        text-align: center;
        font-size: 35px;
    }

    #gallery p.description {
        text-align: center;
        width: 450px;
        margin: 15px auto;
    }

    #gallery .haircut-line {
        width: 340px;
        margin: 15px auto 0 auto;
    }

        #gallery .haircut-line .left-line {
            height: 1px;
            background: #ddd;
            float: left;
            width: 150px;
        }

        #gallery .haircut-line .right-line {
            height: 1px;
            background: #ddd;
            float: right;
            width: 150px;
        }

        #gallery .haircut-line i {
            color: #ddd;
            position: absolute;
            margin-top: -8px;
            left: 50%;
            margin-left: -8px;
        }

    #gallery .gallery-filters {
        margin: 70px 0 30px 0;
        text-align: center;
    }

    #gallery .gallery-items {
        font-size: 0;
        text-align: center;
        width: 100%;
        /*margin-left: -1%;*/
    }

    #gallery .gallery-item {
        width: 24%;
        margin: 5px;
        display: inline-block;
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        border-radius: 3px;
        background-size: cover !important;
        position: relative;
    }

        #gallery .gallery-item .item-background {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: #271c10;
            opacity: 0;
            -webkit-border-radius: 3px;
            -moz-border-radius: 3px;
            border-radius: 3px;
            cursor: pointer;
        }

            #gallery .gallery-item .item-background .icon-box {
                width: 50px;
                height: 50px;
                -webkit-border-radius: 100%;
                -moz-border-radius: 100%;
                border-radius: 100%;
                border: 1px solid #0e0e0e;
                position: absolute;
                top: 50%;
                margin-top: -25px;
                left: 50%;
                margin-left: -25px;
            }

                #gallery .gallery-item .item-background .icon-box i {
                    color: #0e0e0e;
                    font-size: 20px;
                    position: absolute;
                    top: 14px;
                    left: 15px;
                }

@media (max-width: 849px) {

    #gallery {
        padding: 50px;
    }

        #gallery p.description {
            width: 100%;
        }

        #gallery .haircut-line {
            width: 100%;
        }

            #gallery .haircut-line .left-line,
            #gallery .haircut-line .right-line {
                width: 45%;
            }

        #gallery .gallery-item {
            width: 100%;
            margin: 10px 0;
            display: block;
        }
}

@media (max-width: 599px) {

    #gallery .gallery-filters button {
        width: 100%;
        display: block;
        margin-bottom: 5px;
    }
}