/*  ----------------------------------------------------------------------------------------------------------------------------------------------  */


/*  ------------------------------------------------------------------------------------------- For portrait tablets (600 wide - 32 for scrollbar)  */


/*  ----------------------------------------------------------------------------------------------------------------------------------------------  */

#navbtn {
    display: none;
    float: left;
    margin: 0;
    padding: 0 0 0 50px;
    width: 200px;
    background: transparent url('../images/bg-navbtn-smart.png') no-repeat right center;
    background-size: 100px auto;
    font: 700 30pt/100px Khand, Arial, 'Helvetica Neue', Helvetica, sans-serif;
    text-transform: uppercase;
    overflow: hidden;
    color: rgba(0, 0, 0, 0.8);
    text-shadow: 0px 1px 1px rgba(255, 255, 255, 0.1);
    letter-spacing: -3px;
}

#navbtn:hover {
    color: rgba(0, 0, 0, 1);
}

@media screen and (max-width: 991px) {
    .content {
        width: 568px;
    }
    header {
        height: 125px;
    }
    #logo {
        top: 5px;
        left: 0;
        width: 232px;
        height: 90px;
    }
    nav {
        right: 0;
    }
    ul#menu {
        display: none;
        position: absolute;
        width: 200px;
        top: 100px;
        right: 0;
        z-index: 300;
    }
    ul#menu li {
        display: inline;
        margin: 0;
        float: none;
        -webkit-border-radius: 0;
        border-radius: 0;
    }
    ul#menu li:last-child {
        float: none;
    }
    ul#menu li a {
        padding: 0 20px 0;
        width: 100%;
        height: 50px;
        line-height: 50px;
        background: rgba(0, 0, 0, 0.9);
        text-align: left;
        color: #d1d1d1;
        letter-spacing: -0.5px;
        font-size: 12pt;
        border-bottom: 1px solid rgba(0, 0, 0, 0.1);
        text-align: center;
        text-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
    }
    ul#menu li a:hover {
        color: #fff;
        background-color: #3da5ff;
        border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    }
    ul#menu li:last-child a {
        float: none;
        border: none;
        -webkit-border-radius: 0 0 4px 4px;
        border-radius: 0 0 4px 4px;
    }
    ul#menu li ul,
    ul#menu li ul li {
        display: none;
    }
    .pg-home ul#menu li.btn-home,
    .pg-about ul#menu li.btn-about,
    .pg-new-parts ul#menu li.btn-new-parts a,
    .pg-stock ul#menu li.btn-stock,
    .pg-parts ul#menu li.btn-parts,
    .pg-vehiclemodels li.btn-vehiclemodels,
    .pg-contact ul#menu li.btn-contact {
        border: none;
    }
    .pg-home ul#menu li.btn-home a,
    .pg-about ul#menu li.btn-about a,
    .pg-stock ul#menu li.btn-stock a,
    .pg-parts ul#menu li.btn-parts a,
    .pg-vehiclemodels ul#menu li.btn-vehiclemodels a,
    .pg-contact ul#menu li.btn-contact a {
        color: #277ac2;
        cursor: default;
    }
    .pg-home ul#menu li.btn-home a:hover,
    .pg-about ul#menu li.btn-about a:hover,
    .pg-stock ul#menu li.btn-stock a:hover,
    .pg-parts ul#menu li.btn-parts a:hover,
    .pg-vehiclemodels ul#menu li.btn-vehiclemodels a:hover,
    .pg-contact ul#menu li.btn-contact a:hover {
        background: rgba(0, 0, 0, 0.9);
        border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    }
    #navbtn {
        display: block;
    }
    section.left {
        float: none;
        margin: 0 0 50px;
        padding: 50px 50px;
        width: 100%;
        background: rgba(0, 0, 0, 0.5);
    }
    section.left h2 {
        padding: 0 0 7px;
    }
    section.right {
        clear: both;
        float: none;
        width: auto;
    }
    ul.listgal li {
        margin: 6px 4px 55px;
        width: 169px;
        height: 91px;
    }
    /*  ---end---  */
}