/* 
    Document   : mobile
    Created on : Mar 23, 2014, 6:07:44 PM
    Author     : Morgan
    Description: This is rendered when browser is viewed from a mobile browser
*/


@media all and (max-width: 677px) /* Mobile, IPad/Tablets */
{
    .content, .menu ul
    {
        width: 92%;
    }

    .logo img 
    {
        width: 120px;
    }

    .data
    {
        padding: 0;
    }

    .small-menu
    {
        display: block !important;
    }

    .walker
    {
        display: none !important;
    }

    .menu
    {
        margin-top: 0;
        border-top: 0;
    }

    .menu ul li
    {
        clear: both;
        float: none;
        width: auto;
        text-align: left;
        margin-bottom: 5px;
        padding: 5px 0 5px 5px;
        list-style: none outside none;
        border-bottom: 1px solid #EEEEEE;
    }
    
    .menu ul li.current, .menu ul li:hover
    {
        background: #dddddd;
    }

    .menu ul li a
    {
        display: block;
    }

    .menu ul li a span
    {
        display: inline;
    }

    .menu ul li a img
    {
        max-width: 8%;
        vertical-align: middle;
    }
    
    ul.contact-us
    {
        margin: 0;
        width: auto;
        float: none;
        clear: both;
    }
    
    form.contact-us
    {
        width: auto;
        float: none;
        clear: both;
    }
    
    select, select.input
    {
        width: 100%;
    }

    .footer
    {
        text-align: center;
    }
}

@media  (min-width: 576px) and (max-width: 800px)
{
    .content, .menu ul
    {
        width: 96%;
    }

    .logo img 
    {
        width: 35%;
    }
}