/* CSS Document */

/* Menu code below */

/* The following works in IE7 and others. */
/* IE6 cannot support :hover on anything but an anchor,
 * So we add IE6 support in via javascript.
 */

/* IE6/7 hacks:
 * _rule: value; is read only by IE6
 * *rule: value; is read by IE6 and 7
 */


#menu {
	list-style-type: none;
	width: 938px;
	height: 35px;
	color: #4b4b4b;
	margin: 0;
	padding: 0;
	background-image: url(../images/header/header_img2.gif);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	z-index: 10;
	line-height: 18px;
	font-size: 13px;
}

#menu li {
	display: inline;
	float: left;
	margin: 0;
	padding: 0;
	position: relative;
	z-index: 50;
	text-align: center;
  background-image: url(../images/header/header_img2.gif);
  background-repeat: no-repeat; 
}


#menu li a {
	text-decoration: none;
	color: black;
  display: block;
	padding-top: 8px;
   
	height: 26px;
	text-align: center;
}

#menu li:hover a, #menu li.hover a{
	z-index: 22;
	color: #FFFFFF;
}
#menu ol {
	list-style-type: none;
	display: none;
	position: absolute;
	border: 1px solid #7a7979;
	margin: 0;
	padding: 0;
	padding-bottom: 4px;
	top: 34px;
	left: 0px;
	z-index: 100;
}
#menu #overview ol {
	left: -65px;
	padding-right: -12px;	
}
/* have to undo styles applied earlier */
#menu ol li {
  /* should be display: table, but safari 3 and opera 9 don't let us set widths */
  display: block;
	float: none;
	position: static;
	text-align: left;
	margin: 0px;
	border-left-width: 1px;
	height: 35px;
	padding: 0px 12px;
	background-image: none;
	background-color: #FFFFFF;
	font-size: 11px;
}

#menu ol li span {
	display: table-row;
  *display: block;
	vertical-align: middle;
	margin: 0;
	padding: 0;
  height: 35px;
}

#menu ol li a {
	vertical-align: middle;
	display: table-cell;
  *display: block;
	height: 34px;
	margin: 0;
	padding: 0px 12px;
	line-height: 18px;
  *line-height: 35px;
	background: no-repeat left center;
  margin: 0px 0px;
}

#menu li#helping ol li,
#menu li#helping ol li span,
#menu li#helping ol li a {
	height: 45px;
}
#menu li#helping ol li a {
	height: 44px;
	padding-left: 40px;
  *line-height: 45px;
}

/* drop down hover */
#menu li:hover ol,
#menu li.hover ol {
	display: block;
	border: 1px solid #7a7979;
	background-color: #FFFFFF;
}


#menu li a {
}

#menu li:hover ol li a,
#menu li.hover ol li a {
	text-align: left;
	color: #4b4b4b;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #e5e4e4;
}
#menu li:hover ol li a:hover,
#menu li.hover ol li a:hover {
	color: #0066cc;
	background-color: #eaeaea;
}
#menu li:hover ol li a.nonactive:hover,
#menu li.hover ol li a.nonactive:hover {
	background-color: #FFFFFF;
	color: #4b4b4b;
}

/* navigation widths */
#menu #annual {
	width: 171px;
}
#menu #helping {
	width: 197px;
}
#menu #chairman {
	width: 260px;
}
#menu #financial {
	width: 306px;
}
#menu #overview {
	width: 182px;
}

/* we are attaching the background image onto the a tag
 * because IE6 cannot handle multiple classes on the same element
 * well (and we are using li.selected later */
#menu li:hover a,
#menu li.hover a {
  background-image: url(../images/header/header_img2.gif);
  background-repeat: no-repeat;
}
#menu li:hover ol li a,
#menu li.hover ol li a {
  background-image: none;
}
/* navigation background positions hover/not hover */
#menu #annual,
#menu #annual a {
	background-position: 0px 0px;
}
#menu #annual:hover a, #menu #annual.hover a {
	background-position: 0px -92px;
}

#menu #helping,
#menu #helping a {
	background-position: -171px 0px;
}
#menu #helping:hover a, #menu #helping.hover a {
	background-position: -171px -92px;
}

#menu #chairman,
#menu #chairman a {
	background-position: -368px 0px;
}
#menu #chairman:hover a, #menu #chairman.hover a {
	background-position: -368px -92px;
}

#menu #financial,
#menu #financial a {
	background-position: -628px 0px;
}
#menu #financial:hover a, #menu #financial.hover a {
	background-position: -628px -92px;
}

#menu #overview,
#menu #overview a {
	background-position: -752px 0px;
}
#menu #overview:hover a, #menu #overview.hover a {
	background-position: -753px -92px;
}



/* drop down widths */
#menu #helping ol li {
	width: 205px;
}
#menu #helping ol li a {
  /* 205 - 52 (padding) = 153 */
	width: 153px;
}
#menu #financial ol li {
	width: 240px;
}
#menu #financial ol li a {
  /* 164 - 24 (padding) = 140 */
	width: 216px;
}
#menu #overview ol li {
	width: 220px;
}
#menu #overview ol li a {
  /* 184 - 24 (padding) = 160 */
	width: 195px;
}

/* dropdown icons */
#menu ol li a { background-position: left center !important; }
#menu #helping #bestfriend { background-image: url(../images/icons/bestfriend_icon.gif); }
#menu #helping #olympic { background-image: url(../images/icons/olympic_icon.gif); }
#menu #helping #perfect { background-image: url(../images/icons/perfect_icon.gif); }
#menu #helping #pleasure { background-image: url(../images/icons/pleasure_icon.gif); }
#menu #helping #ideas { background-image: url(../images/icons/ideas_icon.gif); }
#menu #helping #masterpiece { background-image: url(../images/icons/masterpiece_icon.gif); }


/* main menu selected state */
#menu #annual.selected {
	background-position: 0px -46px;
	}

#menu #helping.selected {
	background-position: -171px -46px;
	}


#menu #chairman.selected {
	background-position: -368px -46px;
	}
#menu #financial.selected {
	background-position: -628px -46px;
	}
#menu #overview.selected {
	background-position: -752px -46px;
	}
	
/*	main menu selected font color state  */

#menu li.selected a {
	color: white;
}

/* flyouts */

#menu #business_summary a {
}
#menu #business_summary ol a {
  background-image: none;
}
#menu li:hover ol li ol,
#menu li.hover ol li ol {
	top: 0px;
	left: -210px;
	display: none;
	width: 208px;
	}
#menu li:hover ol li ol a,
#menu li.hover ol li ol a {
	width: 280	
}
#menu li:hover ol li:hover ol,
#menu li:hover ol li.hover ol,
#menu li.hover ol li:hover ol,
#menu li.hover ol li.hover ol {
  display: block;
}