/* CSS Document */

/* BODY */

#chromemenu {
width: 100%;
font-family:Arial, Helvetica, sans-serif;
font-weight: bold;
font-size:14pt;
}

#chromemenu img {display:block;}


#chromemenu ul {
/* border: 1px solid #BBB; */
margin-top:0;
/* padding-top:5px; */
width: 100%;
background-color:#ffcc00;
padding: 5px 0;
margin: 0;
text-align: center; /*set value to right for example to align menu to the left of page*/
}

#chromemenu ul li {
display: inline;
}

#chromemenu ul li a {
color: #63350b; /* brown */
/* color: #636363; /* dk grey */
padding: 5px;
margin: 0;
text-decoration: none;
/* border-right: 1px solid #DADADA; */
}

#chromemenu ul li a:hover {
color: b52d04;
/* background: url(../Images/chromebg2.gif) center center repeat-x; */
}

/* -- MAIN-NAV MENU -- */	 
#main-nav {
	width: 800px;
	margin: 0 auto;
	border-right:1px solid #000000;
}

#main-nav ul, li {
list-style:none;
}

.menu {
width:800px; 
height:28px; 
font-size:0.55em; 
position:relative;
z-index:100;
border-right:1px solid #000000;
}

/* hack to correct IE5.5 faulty box model */
* html .menu {
width:800px; 
w\idth:800px;
}

/* style the second level background */
.menu ul ul a.drop, .menu ul ul a.drop:visited {
background:#fd9348; /* url(../images/drop.gif) bottom right no-repeat; */

}
/* style the second level hover */
.menu ul ul a.drop:hover{
background:#f47820; /* url(../images/drop.gif) bottom right no-repeat; */
}
.menu ul ul :hover > a.drop {
background:#f47820; /* url(../images/drop.gif) bottom right no-repeat; */
}

/* style the third level background */
.menu ul ul ul a, .menu ul ul ul a:visited {
background:#f7f1d1; /* not working */
}
/* style the third level hover */
.menu ul ul ul a:hover {background:#f47820; /* url(../images/drop.gif) bottom right no-repeat; */
}

.menu ul ul ul :hover > a.out {
background:#f47820; /* url(../images/drop.gif) bottom right no-repeat; */
}

/* style the fourth level background */
.menu ul ul ul ul a, .menu ul ul ul ul a:visited {
background:#c6dde3; /* bg color for 4th flyout */
}
/* style the fourth level hover */
.menu ul ul ul ul a:hover {background:#f47820; /* url(../images/drop.gif) bottom right no-repeat; */
}

.menu ul ul ul ul :hover > a.last {
background:#f47820; /* url(../images/drop.gif) bottom right no-repeat; */
}

/* style the fifth level background */
.menu ul ul ul ul ul a, .menu ul ul ul ul a:visited {
background:#cccccc; /* bg color for 5th flyout */
}
/* style the fifth level hover */
.menu ul ul ul ul ul a:hover {background:#f47820; /* url(../images/drop.gif) bottom right no-repeat; */
}


/* remove all the bullets, borders and padding from the default list styling */
.menu ul {
padding:0;
margin:0;
list-style-type:none;
 }
 
.menu ul ul {
width:114px; /* was 101px */
}

/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */
.menu li {
float:left;
width:114px; /* was 101x */
position:relative;
}
/* style the links for the top level */
.menu a, .menu a:visited{
display:block; 
font-size:1em;
text-decoration:none; 
color:#ffffff; 
width:114px; /* was 101px */
height:27px; 
border:1px solid #000000; 
border-width:1px 0 1px 1px; 
background:#af1f24;  /* Red for BG color of entire menu */
padding-left:1px; 
line-height:13px;
}

/* a hack so that IE5.5 faulty box model is corrected */
* html .menu a, * html .menu a:visited {
width:114px;  /* was 101px */
w\idth:114px;} /* was 101px */

/* .menu a:active, .menu a:focus {
background-color:#88bf59;
color:#000000;
} -- Not Working -- */

/* hide the sub levels and give them a positon absolute so that they take up no room. Height is for flyout */
.menu ul ul {
visibility:hidden;
position:absolute;
height:0;top:28px;left:0;bottom:0;
width:114px; /* was 101px */
border-top:1px solid #000000;
}

/* another hack for IE5.5 */
* html .menu ul ul {
top:28px;t\op:28px;
}

/* position the third level flyout menu */
.menu ul ul ul{
left:114px;
top:-1px;
width:114px;
}

/* position the third level flyout menu for a left flyout */
.menu ul ul ul.left {
left:-114px;
}

/* position the fourth level flyout menu */
.menu ul ul ul ul{
left:114px;
top:-1px;
width:114px;
}

/* position the fifth level flyout menu */
.menu ul ul ul ul ul{
left:114px;
top:-1px;
width:114px;
}
/* .menu ul ul a:active, .menu ul ul a:focus {
background-color:#88bf59;
color:#000000;
} --Not Working --*/

.menu ul li ul li a:active, .menu ul li ul li a:focus {
background-color:#ffc399; /* this is 2nd level BG color */
color:#000000;
}

/* style the table so that it takes no part in the layout - required for IE to work */
.menu table {position:absolute;
top:0;
left:0;
border-collapse:collapse;}

/* style the second level links */
.menu ul ul a, .menu ul ul a:visited {
background-color:#ffc399; /* this is 2nd level BG color */
color:#000000;
height:auto; 
line-height:1em;
padding:5px 5px; 
width:103px; /* was 114px needs to be 11px less than normal width?  */
border-width:0 1px 1px 1px;
}

/* yet another hack for IE5.5 */
* html .menu ul ul a, * html .menu ul ul a:visited {
width:114px;
w\idth:114px;
}

.menu a:active {
display:block; 
font-size:1em;
text-decoration:none; 
color:#000000; 
width:114px; 
height:27px; 
border:1px solid #000000; 
border-width:1px 0 1px 1px; 
background:#f7f1d1; 
padding-left:1px; 
line-height:13px;
}

/* style the third level links */
.menu ul ul ul a, .menu ul ul ul a:visited {
background-color:#f7f1d1; /* this is 3rd level BG */
color:#000000;
height:auto; 
line-height:1em;
padding:5px 5px; 
width:103px; /* was 114px needs to be 11px less than normal width?  */
border-width:0 1px 1px 1px;
}

/* yet another hack for IE5.5 */
* html .menu ul ul ul a, * html .menu ul ul ul a:visited {
width:114px;
w\idth:114px;
}

/* style the fourth level links */
.menu ul ul ul ul a, .menu ul ul ul ul a:visited {
background-color:#d1edf7; /* this is 4th level BG */
color:#000000;
height:auto; 
line-height:1em;
padding:5px 5px; 
width:103px; /* was 114px needs to be 11px less than normal width?  */
border-width:0 1px 1px 1px;
}

/* yet another hack for IE5.5 */
* html .menu ul ul ul ul a, * html .menu ul ul ul ul a:visited {
width:114px;
w\idth:114px;
}

/* style the fifth level links */
.menu ul ul ul ul ul a, .menu ul ul ul ul ul a:visited {
background-color:#cccccc; /* this is 5th level BG */
color:#000000;
height:auto; 
line-height:1em;
padding:5px 5px; 
width:103px; /* was 114px needs to be 11px less than normal width?  */
border-width:0 1px 1px 1px;
}

/* yet another hack for IE5.5 */
* html .menu ul ul ul ul ul a, * html .menu ul ul ul ul ul a:visited {
width:114px;
w\idth:114px;
}

/* style the top level hover */
.menu a:hover, .menu ul ul a:hover, .menu a:active, .menu ul ul a:active, .menu a:focus, .menu ul ul a:focus {
color:#fff; 
background:#f47820;
}

.menu :hover > a, .menu ul ul :hover > a, .menu ul ul ul :hover > a, .menu ul ul ul ul :hover > a, .menu ul ul ul ul ul :hover > a {
color:#fff;
background:#f47820; 
}

/* make the second level visible when hover on first level list OR link */
.menu ul li:hover ul,
.menu ul a:hover ul{
visibility:visible;
}
/* keep the third level hidden when you hover on first level list OR link */
.menu ul li:hover ul ul,
.menu ul a:hover ul ul{
visibility:hidden;
}
/* make the third level visible when you hover over second level list OR link */
.menu ul ul li:hover ul,
.menu ul a:hover ul ul ul{
visibility:visible;
}

/* keep the fourth level hidden when you hover over first or second level list or link */
.menu ul li:hover ul ul ul,
.menu ul a:hover ul ul ul {
visibility:hidden;
}

/* make the fourth level visible when you hover over third level list OR link */
.menu ul ul ul li:hover ul,
.menu ul a:hover ul ul ul ul{
visibility:visible;
}

/* keep the fifth level hidden when you hover on first, second or third level list OR link */
.menu ul li:hover ul ul ul ul,
.menu ul a:hover ul ul ul ul {
visibility:hidden;
}

/* make the fifth level visible when you hover over fourth level list OR link */
.menu ul ul ul ul li:hover ul,
.menu ul a:hover ul ul ul ul ul {
visibility:visible;
}
/* -- END MAIN-NAV MENU -- */