/******************

Color scheme

******************/

body
{
    background-color: #fff; /* Body background color */
}

#nav
{
    border: 1px solid #5A5A5A; /* Navigation border */

    /* Navigation background gradient */
    background: #5A5A5A;
    background: -moz-linear-gradient(90deg,  #5A5A5A, #838383);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #838383), color-stop(100%, #5A5A5A));
    background: -webkit-linear-gradient(90deg,  #5A5A5A, #838383);
    background: -o-linear-gradient(90deg,  #5A5A5A, #838383);
    background: -ms-linear-gradient(90deg,  #5A5A5A, #838383);
    background: linear-gradient(90deg,  #5A5A5A, #838383);
}

#nav a:hover
{
    background: #4A4A4A; /* Navigation link background on hover */
}

#search
{
    border: 1px solid #4A4A4A; /* Searchbox border */
}


/* #Media Queries
================================================== */

/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 767px)
{
    #nav
    {
        /* Navigation is transparent for mobile devices */
        background: transparent;
        border: none;

        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
    }

    #nav > a
    {
        color: #555; /* Navigation link colors for mobile devices */
    }

    #nav > a:hover, #nav > a:active
    {
        background: transparent; /* Navigation links background is transparent for mobile devices */
    }

    #search
    {
        border-color: #999; /* Searchbox border for mobile devices */
    }
}