﻿/********************
*   Mobile Styles   *
********************/
@media only screen and (max-width: 850px)
{

    /* header
                ----------------------------------------------------------*/
    header .float-left, header .float-right
    {
        float: none;
    }

    /* logo */
    header .site-title
    {
        margin: 10px;
        text-align: center;
    }

    /* login */
    #login
    {
        font-size: .85em;
        margin: 0 0 12px;
        text-align: center;
        float: none!important;
    }

    #login ul
    {
        margin: 5px 0;
        padding: 0;
    }

    #login li
    {
        display: inline;
        list-style: none;
        margin: 0;
        padding: 0;
    }

    #login a
    {
        background: none;
        color: #999;
        font-weight: 600;
        margin: 2px;
        padding: 0;
    }

    #login a:hover
    {
        color: #333;
    }

    /* menu */
    nav
    {
        margin-bottom: 5px;
    }

    /*ul#menu
    {
        margin: 0;
        padding: 0;
        text-align:left;
    }

    ul#menu li
    {
        margin: 0;
        padding: 0;
    }
    ul#menu li:after { margin-left:0px;}*/
    
    ul#menu
    {
        margin: 0;
        padding: 0;
        text-align:right;
    }

    ul#menu>li
    {
    margin: 3px;
    padding: 6px;
    background-color: #666;
    display: inline-block;
    border-radius: 5px;
        }
    ul#menu li:after { content:""; margin-left:0px;}
    
    ul#menu ul {right:0; left:auto; top:20px; width:auto; }
    ul#menu ul a{ white-space:nowrap; }
    
    ul.menu-right { margin:6px; }
    #headerCartItemListCotainer {left: 0; top: 10px;}

.searchForm { width:100%; }
.searchForm input[type="text"]{ width:85%; }

.custFooterBg .form-inline { display:block; background-color:transparent;}
.custFooterBg .form-inline input.form-control{ margin:3px auto; border-radius:inherit;}


    /* main layout
                ----------------------------------------------------------*/
    .main-content, .featured + .main-content
    {
        background-position: 10px 0;
    }

    .content-wrapper
    {
        padding-right: 10px;
        padding-left: 10px;
    }

    .featured .content-wrapper
    {
        padding: 10px;
    }

    /* page content */
    article, aside
    {
        float: none;
        width: 100%;
    }

    /* ordered list */
    ol.round
    {
        list-style-type: none;
        padding-left: 0;
    }

    ol.round li
    {
        padding-left: 10px;
        margin: 25px 0;
    }

    ol.round li.zero, ol.round li.one, ol.round li.two, ol.round li.three, ol.round li.four, ol.round li.five, ol.round li.six, ol.round li.seven, ol.round li.eight, ol.round li.nine
    {
        background: none;
    }

    /* features */
    section.feature
    {
        float: none;
        padding: 10px;
        width: auto;
    }

    section.feature img
    {
        color: #999;
        content: attr(alt);
        font-size: 1.5em;
        font-weight: 600;
    }

    /* forms */
    fieldset input[type="text"], fieldset input[type="password"]
    {
        width: 90%;
    }

    /* login page */
    #loginForm
    {
        border-right: none;
        float: none;
        width: auto;
    }

    #loginForm .validation-error
    {
        display: block;
        margin-left: 15px;
    }

    #socialLoginForm
    {
        margin-left: 0;
        float: none;
        width: auto;
    }

    /* footer
                ----------------------------------------------------------*/
    footer .float-left, footer .float-right
    {
        float: none;
    }

    footer
    {
        text-align: center;
        height: auto;
        padding: 10px 0;
    }

    footer p
    {
        margin: 0;
    }

    ul#social
    {
        padding: 0;
        margin: 0;
    }

    a.facebook, a.twitter
    {
        background: none;
        display: inline;
        float: none;
        padding-left: 0;
        text-indent: 0;
    }

    .content-left-col
    {
        width: auto;
        float: none;
    }
    .content-right-col
    {
        width: auto;
        float: none;
    }

    .header-top span
    {
        display: block;
    }
    
    .top-menu{ height:auto; border:1px solid transparent;}
    .top-menu .float-left{ margin: 4px 0 0 0; }

    ul.product-list li { width: 48%;}
    ul.product-item li { margin-bottom:5px; }
    ul.product-item li div { display:block; width:inherit; }

    ul.cart-list li { display: block; border-bottom:1px solid #cccccc;}
    ul.cart-list li .cartImg,
    ul.cart-list li .cartDetails,
    ul.cart-list li .cartQTY 
    { display:block; width:98%; border:none; text-align:justify; }
    ul.cart-list li .cartQTY span.qty-selection { display:inline-table; margin-left: 3px; margin-right:3px;}
    .removeCart {display: inline; }
    
    .cartTotal div.float-left,
    .cartTotal div.float-right
     { float:none;}
     
    .checkout,
    .width48per { width:99%;}     

    #dealerList p { width: 30%;}

    .shipping li {width: 99%;}

    ul.product-item li div.L, 
    ul.product-item li div.R  {width: 99%;}
    .Qty .highlight { display:block;}
    
    ul.product-item p { text-indent: 0;}
    
    .pageDiv span {display:block; }
    .pageDiv select { width:50%; }
    
    .affix { position: static; }
}

@media only screen and (max-width: 360px)
{
    footer
    {
    }
    
}

