/* This CSS sets the default styles for the main navigation. */

/* ---------- Main navigation ---------- */

#navbar #navigation {
    width: 695px;
    padding-right: 265px; /*leaves room for #search and #text-resizer*/
}

#navigation ul { margin: 0 auto; }

#navigation ul:after {
    clear: both;
    content: ".";
    display: block;
    height: 0;
    visibility: hidden;
}

.ie #navigation ul { height: 1%; }

.ie6 #navigation, .ie6 #navigation ul { overflow: visible; }

#navigation li {
    float: left;
    list-style-type: none;
    position: relative;
}

#navigation .child-menu { display: none; }

/*------ Navigation portlet ------*/

.nav-menu li a.ancestor { font-weight: bold; }

.nav-menu li a.selected {
    color: #000;
    font-weight: bold;
    text-decoration: none;
}

.nav-menu ul { padding-left: 10px; }

/*------ DENR'S MEGA-MENU  ------*/

#navigation ul,
#navigation li,
#navigation li a {
    margin-left: 0;
    margin-right: 0;
}

#navigation li a {
    display: block;
    font-size: 12px;
    font-weight: bold;
    padding: 5px 20px;
    text-decoration: none;
    text-transform: uppercase;
    border-bottom: none;
    cursor: pointer !important;
}

#navigation li.level-one { height: 24px; /* See javascript.js */}

#navigation li.level-one.has-children {
    background-image: url(../images/design_elements/nav-bar-tab-has-children.png);
    background-repeat: no-repeat;
    background-position: right 0%;
}

#navigation li.level-one.has-children:hover {
    background-position: right 50%;
}

#navigation li.level-one.has-children.open {
    background-position: right 100%;
}

#navigation a.level-one {
    padding: 0 1.5em;
    color: #3a522e;
    text-shadow: 1px 1px 1px #bbbbbb;
    white-space: nowrap;        
}

#navigation ul.level-one li#selected a.level-one,
#navigation ul.level-one li.open a.level-one,
#navigation ul.level-one a.level-one:hover {
    color: #ffffff;
    text-shadow: 1px 1px 1px #333333;
}

#navigation li.open {
    background-color: #55677f;
    border-radius: 5px;
}

#navigation li.level-one.open:first-child {}

#navigation li.level-one.open.no-children {}

#navigation li.open a.level-one { color: #ffffff; }

#navigation ul.level-two {
    background-color: #E8EADC ;  /*color blender - 1 step between body bg and white (content-wrapper)*/
    background-image: url(../images/design_elements/nav-mega-menu-bg.png);
    background-repeat: no-repeat;
    background-position: left bottom;
    border-top: 4px solid #55677f;
    margin-top: -4px;
    padding-bottom: 30px;
    padding-top: 36px;
    right: auto;
    display: none;
    /* 960-40 (left/right offset = 20) See javascript.js */
    width: 920px;
    /* min-height hack (even IE6 is happy) */
    min-height:1px;
    height:auto !important;
    height:1px;
}

#navigation li.level-one-copy { 
    width: 910px !important;
    position:absolute;
    left:0;
    top: 0;
    border-bottom: 1px solid #bbb;
    background: rgba(225, 225, 225, 0.5) url(../images/design_elements/gradient-left-right-white.png) repeat-y ;
    background-size: 100% auto;
    -mozilla-box-shadow: #555 0px 0px 1px;
    -webkit-box-shadow: #555 0px 0px 1px;
    box-shadow: #555 0px 0px 1px;
}

.ie7 #navigation li.level-one-copy,
.ie8 #navigation li.level-one-copy { background: white url(../images/design_elements/gradient-right-left-white.png) repeat-y top left;  }

#navigation li.level-two {
    /* 920/4=230; 220+5(padding-left)+5(padding-right)=230 */
    width: 220px;
    padding: 5px;
    line-height: 1.2;
}

#navigation a.level-two,
#navigation a.level-three,
#navigation a.level-four { text-transform: capitalize; }

#navigation a.level-two:link,
#navigation a.level-three:link,
#navigation a.level-four:link { color: #55677f; }

#navigation a.level-two:visited,
#navigation a.level-three:visited,
#navigation a.level-four:visited { color: #55677f; }

#navigation a.level-two:hover,
#navigation a.level-three:hover,
#navigation a.level-four:hover { color: #b21d1d; }

#navigation a.level-two:active,
#navigation a.level-three:active,
#navigation a.level-four:active { color: #b21d1d; }

#navigation a.level-two {
    padding: 5px 10px;
    font-size: 14px;
}

#navigation ul.level-three { margin-bottom: 20px;}

#navigation li.level-three { width: 220px; /* see above */}

#navigation ul.level-four {
    margin: 0px 0px 6px 20px;
    border-left: 1px dotted grey;
}

#navigation li.level-four { width: 210px; /* add values together; see above */}

#navigation a.level-three { font-weight: normal; }

#navigation a.level-four {
    line-height: 1.2;
    font-weight: normal;
    padding: 3px 0px 0px 10px;
}

#navigation li.level-four a.show-more {
    padding-left: 20px;
    font-style: italic;
}

#navigation li.level-four a.hidden {
    display: none;
    width: auto;
    padding: 3px 0px 0px 10px !important;
}