/* -----------------------------------
nav
----------------------------------- */

.nav-outer
{
    background-color: #00718C;
    border-top: 5px solid #004659;
}

.nav ul
{
    margin: 0;
    padding: 0;
    list-style: none;
}

.nav li { display: inline; }

.nav a
{
    display: block;
    padding: 15px 20px;
    color: #fff;
    background-color: #00718C;
    text-decoration: none;
    line-height: 18px;
    border-top: 1px solid #59A2B4;
}

/*.current a,.current-home a*/
#about .nav-about a,
#homes .nav-about a,
#photos .nav-about a,
#records .nav-about a,
#help .nav-about a,
#contact .nav-about a
{
    color: #fff !important;
    background: #004659;
}

#nav-toggle-nav
{
    display: block;
    padding: 15px 15px 15px 50px;
    color: #fff;
    background-color: #00718C;
    background-image: url(../img/responsive-nav.png);
    background-repeat: no-repeat;
    background-position: 20px 50%;
    text-decoration: none;
    font-weight: bold;
}

.nav a:link,.nav a:visited
{
    color: #fff;
    background-color: #00718C;
}

.nav a:focus,#nav-toggle:focus
{
    color: #fff;
    background-color: #000;
}

.nav a:hover,#nav-toggle:hover
{
    color: #fff;
    background-color: #6D2C55;
}

.nav a:active,#nav-toggle:active
{
    color: #fff;
    background-color: #9F1C20;
}

#subnav { padding-bottom: 1em; }

.current-menu-item a
{
	font-weight: bold;
	color: #000 !important;
}

#nav-toggle-subnav
{
    display: block;
    padding: 10px 5px 10px 30px;
    color: #00718C;
    background-image: url(../img/responsive-nav2.png);
    background-repeat: no-repeat;
    background-position: 0 50%;
    text-decoration: none;
}

/* -----------------------------------
Predefined
----------------------------------- */

.js #nav,.js #subnav
{
    clip: rect(0 0 0 0);
    max-height: 0;
    position: absolute;
    display: block;
    overflow: hidden;
    zoom: 1;
}

#nav.opened,#subnav.opened { max-height: 9999px; }

/* -----------------------------------
Navigation wide screen
----------------------------------- */

@media (min-width: 900px)
{
    .js #nav,.js #subnav { position: relative; }
    .js #nav.closed,.js #subnav.closed { max-height: none; }
    #nav-toggle-nav,#nav-toggle-subnav { display: none; }

    #nav,#subnav
    {
        overflow: hidden;
        zoom: 1;
    }

    .nav a
    {
        float: left;
        padding: 10px 1.00% 10px 1.50%;
        color: #fff;
        border-top: none;
        background-color: #00718C;
        background-image: url(../img/bg-nav.png);
        background-repeat: no-repeat;
        background-position: 100% 0;
        text-decoration: none;
        line-height: 18px;
    }

    .nav-about a { width: 11.50%; }
    .nav-homes a { width: 9.00%; }
    .nav-photos a { width: 9.50%; }
    .nav-records a { width: 12.00%; }
    .nav-browse a { width: 9.50%; }
    .nav-help a { width: 9.50%; }
    .nav-contact a { width: 14.00%; }

    .current a
    {
        color: #fff !important;
        background: #004659 !important;
    }

    .nav-large
    {
        display: block;
        font-size: 18px;
        font-weight: bold;
        text-transform: uppercase;
    }

    .nav-small { font-size: 14px; }

    .nav-home a
    {
        width: 6%;
        height: 56px;
        padding: 0;
        border-left: 0;
        background-image: url(../img/home.png);
        background-repeat: no-repeat;
        background-position: 50% 0;
        text-indent: -500px;
    }

    .current-home a { background-position: 50% -224px; }

    .nav-home a:focus,.nav-home a:hover,.nav-home a:active
    {
        background-image: url(../img/home.png);
        background-repeat: no-repeat;
    }

    .nav-home a:focus { background-position: 50% -112px; }
    .nav-home a:hover { background-position: 50% -56px; }
    .nav-home a:active { background-position: 50% -168px; }
}