/* off canvas menu styles */
@media (max-width: 991px) {

    .offcanvasbody #header {
        position: fixed;
        top: 0;
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
    }

    .offcanvasbody .navbar-offcanvas {
        position: fixed !important;
        z-index: 1000;
        height: 100% !important;
    }

    .offcanvasbody .mobile-search-container {
        position: fixed;
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
    }

    #header .mobile-menu {
        position: absolute;
        left: 0;
        z-index: 2;
    }

    .mobile-search {
        position: absolute;
        right: 45px;
        z-index: 2;
    }

    .mobile-search-container {
        display: none;
        width: 100%;
        position: relative;
        left: 0;
        top: 0;
        z-index: 996;
    }

    .mobile-search a, .mobile-basket a {
        margin: 0 5px;
    }

    .search {
        height: 46px;
        border-bottom: 1px solid #DDD;
    }

    .search .keyword {
        height: 46px;
        font-size: 120%;
        background: #fff !important;
    }

    .searchbox {
        padding: 0;
    }

    .search .submit {
        top: 10px !important;
        right: 10px !important;
    }

    .mobile-basket {
        position: absolute;
        z-index: 2;
    }

    .menu-icon {
        display: block !important;
        opacity: 1;
        background: none;
        border: none;
        z-index: 999;
        margin: 0 5px !important;
        outline: 0;
    }

    /* OFF CANVAS MENU */
    .tabs.offcanvastabs > div > ul > li:hover, .tabs.offcanvastabs > div > ul > li.current{
        background: none;
        box-shadow: none;
    }
    .tabs #tabwrap.offcanvasnavwrap{
        display: block !important;
    }
    .tabs .offcanvasnavwrap li {
        margin: 0;
        width: 100%;
        display: block;
        padding: 6px 0;
        background: none;
    }
    .tabs .offcanvasnavwrap li a.toplevelcat{
        font-weight: bold;
        padding: 15px 0 5px;
        margin: 0;
        /*text-transform: uppercase;*/
    }
    .tabs .offcanvasnavwrap li.current a.toplevelcat{
        color: #FFFFFF;
    }
    .tabs .offcanvasnavwrap li:hover a.toplevelcat{
        color: #FFFFFF;
    }
    .tabs .offcanvasnavwrap li a.toplevelcat.offcanvassubitems, .tabs ul li.brandsdropdowntab a{
        background: transparent url("../png/navarrow.png") no-repeat right center;
        background-size: 18px 22px;
    }
    .tabs .offcanvasnavwrap a{
        text-align: left;
    }
    .tabs ul li ul.offcanvasmenusection, .tabs ul li ul.offcanvasmenusection li ul.offcanvassubnav{
        display: block;
        position: relative;
        border: none;
        box-shadow: none;
        top: 0;
        padding: 0;
        background: none;
    }
    .tabs ul li ul.offcanvasmenusection{
        display: none;
    }
    .tabs ul li.brandsdropdowntab ul.offcanvasmenusection{
        display: none;
    }

    .tabs ul li ul.offcanvasmenusection li
    {
        padding: 0;
        margin: 0;
    }

    .tabs ul li ul.offcanvasmenusection li a
    {
        font-size: 100%;
        padding: 8px;
        margin: 0;
        float: left;
        width: 100%;
        color: #FFF;
    }
    .tabs ul li ul.offcanvasmenusection li a.mainoption {
        border: none;
        font-weight: bold;
        padding: 8px;
        background: none;
    }
    .tabs ul li ul.offcanvasmenusection li a.suboption {
        padding: 8px 16px;
    }
    .tabs ul li ul.offcanvasmenusection li em {
        width: 100%;
        color: #fff;
        text-align: left;
    }
    .tabs ul li ul.offcanvasmenusection li a.mainoption:hover, .tabs ul li ul.offcanvasmenusection li a.suboption:hover {
        background: none;
        color: #FFFFFF;
    }
    .tabs ul li ul.offcanvasmenusection li em {
        display: block;
        float: left;
        padding: 8px;
    }
    .offcanvas-toggle{
        background: none !important;
    }
    a.closeoffcanvas{
        position: absolute;
        top: 10px;
        right: 10px;
        z-index: 999;
    }
    .offcanvasbody #jquery-live-search {
        position: absolute !important;
        top: 95px !important;
        border: none;
    }
}