/*
 * Off Canvas
 * --------------------------------------------------
 */
@media screen and (max-width : 767px) {
    .row-offcanvas {
        position           : relative;
        -webkit-transition : all .25s ease-out;
        -moz-transition    : all .25s ease-out;
        transition         : all .25s ease-out;
        }

    .row-offcanvas-right {
        right : 0;
        }

    .row-offcanvas-left {
        left : 0;
        }


    .row-offcanvas-right
    .sidebar-offcanvas {
        right : -300px; /* 6 columns */
        }

   .row-offcanvas-left.active .sidebar-offcanvas {
        left: 0;
        height: 400px;
        background: #fff;
        color: #34404e;
        position: fixed;
        -webkit-transition: all .25s ease-out;
        -moz-transition: all .25s ease-out;
        transition: all .25s ease-out;
        top: 165px;
        overflow: scroll;
        z-index: 9;
    }

    .row-offcanvas-right.active {
        right : 300px; /* 6 columns */
        }
    .header-section.sticky .sidebar-offcanvas{
        top:60px;
    }

    .sidebar-offcanvas {
        position: fixed;
        top: 188px;
        width: 300px;
        left: -300px;
        -webkit-transition: all .25s ease-out;
        -moz-transition: all .25s ease-out;
        transition: all .25s ease-out;
    }
    .row-offcanvas-left.active .header-section.sticky .sidebar-offcanvas {
        top: 58px;
    }
    }