/**************************************/
/*           NAVIGATION
/**************************************/

#nav {
background:url(../images/slices/navBkgd.jpg) repeat-x;
font-family:"Palatino Linotype", "Helvetica Neue", Georgia, "Times New Roman", Times, serif;
height:31px;
width:904px;
margin-left:23px;
font-size:1.1em;
position:absolute;
z-index:5;
padding:0;
white-space:nowrap;
}

#nav li {
display:inline;
font-weight:800;
text-decoration:none;
z-index:2;
height:60px;
margin:0 4px;
}


#nav li a {
padding:0 .7em;
color:#FFFFFF;
text-transform:uppercase;
text-decoration:none;
margin:5px 0 0 0;
font-weight:bold;
outline:none;
line-height:2em;
}

#nav li a:link, #nav li a:visited {
color:#FFFFFF;
text-decoration:none;
}

#nav li a:hover {
color:#d1b866;
text-decoration:none;
}


#nav .selected
{
    color:#d1b866 !important;
}


/**************************************/
/*        BEGIN DROPDOWN MENU
/**************************************/

#nav li ul {/*hides second level menu and positions it*/
background-image:url(../images/slices/subnavBkgd.png);
width:904px;
height:26px;
display: none;
position: absolute; 
font-weight:100;
margin: 28px 0 0;/*TOP MARGIN MOVES IT DOWN*/
z-index:7;
top:-10px;
left:0px;
padding-top: 10px;
}

#nav li li {
padding:0;
margin:0;
display:inline;
}

#container #nav li li a, #container #nav li li a:visited {
text-decoration:none;
position:relative;
color:#1b1a49;
text-transform:none;
font-weight:100;
padding:.8em 1em 1.6em 0;/*top padding necessary to access hovered menu*/
}

#container  #nav li li a:hover { /*black hover color*/
text-decoration:underline;
}
/*
shows second level menu on hover
#nav li:hover ul, #nav li.over ul{ 
display: block;
}
shows second level menu on hover
#nav li ul:hover
{
display: block;
}
*/

/* 
this will display the menu for the current branch, but i don't 
know how to make it disappear when another menu is hovered over
*/

#nav li ul.showme
{
    display:block;
}

li > ul {
top: auto;
left: auto;
}

.left {
left:0px;
text-align:center;
}

.middle {
text-align:center;
}

.right {
text-align:center;
}