div#navigation_container {
	width:770px;
	background-color:#222;
	margin:0 30px;
	float:left;
	padding:0;
}

div.navigation * {
	margin:0;
 	padding:0;
}


/* Menu colors and fonts are set here */
div.navigation {
	/* you must link to the hover.htc file for this menu to work in IE6 and earlier */
	behavior:url(../../lib/js_tools/csshover.htc);
 	font-family: arial, sans-serif;   /* font family for menu */
 	font-size:.7em;
 	background-color:#222; /* menu background color */
 	background-color:transparent;
}

div.navigation ul {
	display:inline; /* Fixes margin-doubling bug in IE6 */
}

div.navigation li {
	background-color:#222; /*Background color of the level 1 menu items */
	border-right:1px solid #333; /* Creates dividing lines to right of each horiz level 1 menu item */
}

div.navigation li:hover {
	/* Background color of hovered menu items */
	z-index:1000;
}

div.navigation a {
	color:#776; /* Sets the color of all menu links */
	padding:.2em 5px;
}

div.navigation a:hover {
	color:#d48826; /* Color of hovered menu choice */
	z-index:1000;
}

div.navigation ul li ul {
	border-right:1px solid #333;
	border-left:1px solid #333;
	width:12em; /* Sets the width of menu levels 2 - 4, in respect to the text size */
}

div.navigation li li { 
	background-color:#222; /* Background color of the level 2 menu */
	border-bottom:1px solid #333; /* Adds lines between menu choices.*/
}

div.navigation ul li ul li ul  {
	border-top:1px solid #CCB; /* Sets the border-top of levels 3 and 4 of a horizontal menu */
	top:-1px; /* Set to negative value of border-top for perfect pop-out alignment. */
}
 
div.navigation li li li { 
	background-color:#222;	/* Background color of the level 3 menu */
}

div.navigation li li li li { 
	background-color:#222; /* Background color of the level 4 menu */
}

/* Adds transparency to a navigation menu */
div.navigation.transparent ul ul li {
	opacity:0.9; /** For Safari support */    
	-moz-opacity:0.9; /* For firefox support */
	filter:alpha(opacity=90);  /* For IE support */
}


/* Menu layout settings */
div.navigation {
	float:left;
}

div.navigation ul {
	float:left;
	font-size:1em;
}

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

div.navigation a {
	display:block;
	text-decoration:none;
	padding:5px 1em;
}


/* Menu drop-down settings */
div.navigation ul li ul { 
 	position:absolute;
 	border:0;
 	margin-left:0px;
 	width:12em;
}

div.navigation ul li ul li {
	width:100%;
	padding:0;
	border-left:0;
	border-right:0;
}

div.navigation ul li ul {
	display:none; /* Hides the drop-down whe the menu is not hovered */
}

div.navigation ul li:hover ul {
	display:block; /* shows the drop-down when the menu is hovered */
	z-index:1000; /* Safari needs this to display menu on top of other page elements */
}
 
/* pop-outs starts here */
body div.navigation ul li ul li ul  {
	position:absolute;
	visibility:hidden; /* Ensures that the level 3 menu is not shown when the level 3 is shown */
	left:100%;
	top:-1px;
}

div.navigation ul li ul li:hover ul {
	visibility:visible; /* Shows the level 3 menu when the associated level 2 li is hovered */
} 

/* second and third level popouts here*/
div.navigation ul li ul li:hover ul li ul {
	visibility:hidden; /* Ensures that the level 4 menu is not shwon when the level 3 menu is shown */
}

div.navigation ul li ul li ul li:hover ul {
	visibility:visible; /* Shows the level 4 menu when associated level 3 li is hovered */
}