/*--------------------------------------------------------------------------
Navigation - Level One
--------------------------------------------------------------------------*/

#navigation {
    width: 700px;
    float: left;
    margin: 0;
    display: inline;
    float: left;
    border-bottom-width: 2px;
    border-bottom-style: solid;
    border-bottom-color: #660000;
}

#navigation li {
 margin: 0;
 padding: 0;
 list-style: none;
 white-space: nowrap;
 display: inline;
 float: left;
}

#navigation a {
    margin: 0 1px 0 0;
    padding: 0 0 0 14px;
    color: #fff;
    font-size: 12px;
    text-transform: lowercase;
    display: inline;
    float: left;
    background-color: #ed8181;
    background-image: url(../images/bg-nav-left.gif);
    background-repeat: no-repeat;
    background-position: left top;
}

#navigation a span {    
 padding: 5px 14px 6px 0;  
 background: #ed8181 url('../images/bg-nav-right.gif') no-repeat right top;
 display: block;
 float: left;
 white-space: nowrap;
}

#navigation a:hover {background: #4d80ad url('../images/bg-nav-left.gif') no-repeat 0 -52px;}
#navigation a:hover span {
    background-color: #b10000;
    background-image: url(../images/bg-nav-right.gif);
    background-repeat: no-repeat;
    background-position: 100% -52px;
}


/*Active State*/    
body.home #navigation #home,
body.about #navigation #about,
body.services #navigation #services,
body.links #navigation #links,
body.news #navigation #news,
body.communities #navigation #communities,
body.careers #navigation #careers {
    background-color: #CC0000;
    background-image: url(../images/bg-nav-left.gif);
    background-repeat: no-repeat;
    background-position: 0 -104px;
}
body.otherlinks #navigation #otherlinks {
    background-color: #CC0000;
    background-image: url(../images/bg-nav-left.gif);
    background-repeat: no-repeat;
    background-position: 0 -104px;
}

body.home #navigation #home span,
body.about #navigation #about span,
body.services #navigation #services span,
body.links #navigation #links span,
body.news #navigation #news span,
body.communities #navigation #communities span,
body.careers #navigation #careers span {background: #cc0000 url('../images/bg-nav-right.gif') no-repeat 100% -104px;}
body.otherlinks #navigation #otherlinks span {background: #cc0000 url('../images/bg-nav-right.gif') no-repeat 100% -104px;}


/* Commented Backslash Hack hides rule from IE5-Mac \*/
#navigation a span {float: none;}
/* End IE5-Mac hack */
#navigation a:hover span {color: #fff;}

/*--------------------------------------------------------------------------
Sub Navigation - Level Two
--------------------------------------------------------------------------*/

#sub-navigation {
 width: 232px;
 padding-top: 20px;
 background: transparent url('../images/bg-sub-top.gif') no-repeat 0 0;
 float: left;
}

#sub-navigation ul {
    padding-bottom: 20px;
    margin: 0;
    background-color: #DEDCDC;
    background-image: url(../images/bg-sub-bottom.gif);
    background-repeat: no-repeat;
    background-position: 0 100%;
}

#sub-navigation ul li {
 margin: 0; 
 padding: 4px 0;
 background: none;
}

#sub-navigation ul li a {
 font-size: 11px;
 height: 28px;
 font-weight: bold;
 line-height: 26px;
 background: transparent url('../images/a-subnav.gif') no-repeat 0 0;
 display: block;
 margin: 0 17px;
 padding: 0 0 0 22px;
 color: #666666;
}

#sub-navigation ul li a:hover {background-position: 0 -28px;}
#sub-navigation ul li a.active {background-position: 0 -56px; color:#CC3300;}

/*--------------------------------------------------------------------------
Sub Navigation - Level Three
--------------------------------------------------------------------------*/

#sub-navigation ul ul {
 margin: 8px 0 0 0;
 padding: 0;
 background: none;
}

#sub-navigation ul ul li {
 margin: 0; 
 padding: 0;
}

#sub-navigation ul ul li a {
    margin: 0 17px 0 39px;
    height: 20px;
    line-height: 20px;
    padding: 0 0 0 10px;
    font-weight: normal;
    color: #666666;
    background-color: #DEDCDC;
    background-image: url(../images/a-subnav-arrow.gif);
    background-repeat: no-repeat;
    background-position: 0 50%;
}

#sub-navigation ul ul li a:hover,
#sub-navigation ul ul li a.active {
    color: #CC3300;
    background-color: #DEDCDC;
    background-image: url(../images/a-subnav-arrow.gif);
    background-repeat: no-repeat;
    background-position: 0 50%;
}

/*--------------------------------------------------------------------------
Site Map - Level One
--------------------------------------------------------------------------*/

#map {width: 438px;}

#map li {
 width: 438px;
 margin: 0; 
 padding: 0 0 5px 0;
 background: none;
 float: left;
}

#map li a {
 font-size: 11px;
 height: 30px;
 line-height: 30px;
 font-weight: bold; 
 background: transparent url('../images/a-sitemap.gif') no-repeat 0 0;
 display: block;
 padding: 0 0 0 22px;
 color: #666666;
}

#map li a:hover {
 background: transparent url('../images/a-sitemap.gif') no-repeat 0 -30px;
 color: #be0202;
}

/*--------------------------------------------------------------------------
Site Map - Level Two
--------------------------------------------------------------------------*/

#map .leveltwo li {
 margin: 0 0 0 0; 
 padding: 6px 0 0 0;
 background: none;
}

#map .leveltwo li a {
 height: 28px; 
 line-height: 27px;
 margin: 0 0 0 20px; 
 padding: 0 0 0 10px; 
 background: #c4d6e5 url('../images/a-sitemap-sub.gif') no-repeat 0 0;
 color: #fff;
}

#map .leveltwo li a:hover {
 background: #f1f5f9 url('../images/a-sitemap-sub.gif') no-repeat 0 -28px;
 color: #be0202;
}

/*--------------------------------------------------------------------------
Site Map - Level Three
--------------------------------------------------------------------------*/

#map .leveltwo .levelthree li {
 margin: 0; 
 padding: 4px 0 0 0;
 background: none;
}

#map .leveltwo .levelthree li a {
 font-weight: normal;
 height: 15px;
 line-height: 15px;
 margin: 0 0 0 40px; 
 padding: 0 0 0 10px; 
 background: transparent url('../images/a-subnav-arrow.gif') no-repeat 0 50%;
 color: #666666;
}

#map .leveltwo .levelthree li a:hover {
 color: #be0202;
}

