#cra-nav-m3 { z-index: 1100; width:193px; padding: 2px 0px 0px 0px;}
/* hack to correct IE5.5 faulty box model */
* html #cra-nav-m3 {width:193px;}
/* remove all the bullets, borders and padding from the default list styling */
#cra-nav-m3 ul { border: solid 0px red; padding: 0; margin: 0; list-style-type: none; float: left; }
/* float the list to make it horizontal and a relative positon so that you can control the dropdown listmenu positon */
#cra-nav-m3 li { float: left; position: relative; z-index: 1100; }	/*set width here if all li is the same width*/
 
/*MAIN STYLING*/ 
	/* style the links for the top level */
	#cra-nav-m3 a, #cra-nav-m3 a:visited				/*JACK may need to define different language here*/
	{
		display: block; 
		margin: 1px 0px 1px 0px;
		padding: 9px 15px 0px 15px;
		width:163px; 
		height: 22px; 
		
		font-family: helvetica;
		font-size: 12px;
		text-align: center; 
		text-transform: uppercase; 
		text-decoration: none; 
		color: #ffffff; 
	}
	/* a hack so that IE5.5 faulty box model is corrected */
	* html #cra-nav-m3 a, * html #cra-nav-m3 a:visited {}

	/* style the second level links */
	#cra-nav-m3 ul ul a, #cra-nav-m3 ul ul a:visited
	{	
		margin: 0px;
		padding: 9px 5px 4px 25px;
		width: 140px;
		min-height: 15px;
		height: auto !important;
		height: 15px; 
		
		font-family: Arial;
		font-size: 12px;
		font-weight:normal;
		text-transform: none;
		text-align: left;
		color: white; 
		
		border-top: solid 1px #b7b7b7;
		border-left: solid 1px #b7b7b7;
		border-right: solid 1px #636363;
		border-bottom: solid 1px #636363;
	}
	/* yet another hack for IE5.5 */
	* html #cra-nav-m3 ul ul a, * html #cra-nav-m3 ul ul a:visited {width: 140px;}
									
	/* style the third level background */
	#cra-nav-m3 ul ul ul a, #cra-nav-m3 ul ul ul a:visited
	{
		/*padding: 0px 0px 0px 8px;
		width: 176px;
		
		border-left: solid 1px #f2ae80;
		border-right: solid 1px #f2ae80;*/
	}


/* hide the sub levels and give them a positon absolute so that they take up no room */
#cra-nav-m3 ul ul		{ visibility: hidden; position: absolute; left: 193px; top: 0px; background-color: #ffffff; }
#cra-nav-m3 ul ul.left	{ left: -193px; }
/* another hack for IE5.5 */
* html #cra-nav-m3 ul ul {top:0px;}

/* position the third level flyout listmenu */
#cra-nav-m3 ul ul ul		{ left: 172px; top: 0px; }
/* position the third level flyout listmenu for a left flyout */
#cra-nav-m3 ul ul ul.left	{ left: -172px; } /*need to set left to match with width here*/ /*base width 174*/


/* style the table so that it takes no ppart in the layout - required for IE to work */
#cra-nav-m3 table {position:absolute; top:0; left:0; border-collapse:collapse;}


/* HOVER STYLE */
/* style the top level hover */
#cra-nav-m3 a:hover		{ color: #ffffff; text-decoration: underline; background-color:#ffffff; background-image: url("../img/bg-nav-m3-hover.png"); background-position: center; background-repeat: no-repeat; }			/*must have background-color in order to work*/
#cra-nav-m3 :hover > a	{ color: #ffffff; background-color:#ffffff; background-image: url("../img/bg-nav-m3-hover.png"); background-position: center; background-repeat: no-repeat; }
/* style the second level hover */
#cra-nav-m3 ul ul a:hover		{ color: #ffffff; background-color:#966438; background-image: url("../img/bg-nav-m3-l2-hover.png"); background-repeat: no-repeat; background-position:top; }
#cra-nav-m3 ul ul :hover > a	{ color: #ffffff; background-color:#966438; background-image: url("../img/bg-nav-m3-l2-hover.png"); background-repeat: no-repeat; background-position:top; }
/* style the third level hover */
#cra-nav-m3 ul ul ul a:hover	{ color: #ffffff; background-color:#966438; background-image: url("../img/bg-nav-m3-l2-hover.png"); }


/*IMAGE STYLE*/
/* style the background of item with sub menu 
#cra-nav-m3 ul ul a.drop, #cra-nav-m3 ul ul a.drop:visited		
{ background-repeat: no-repeat;	background-position: right center; background-image: url(../image/menu-marker.gif);}
#cra-nav-m3 ul ul a.drop:hover, #cra-nav-m3 ul ul :hover > a.drop	
{ background-repeat: no-repeat;	background-position: right center; background-image: url(../image/menu-markerSub.gif);}
*/

/* style the background of the menu 
#cra-nav-m3 ul ul			{ background-image: url(../image/menu-background.png); background-position: bottom; background-repeat: no-repeat; }
#cra-nav-m3 ul ul ul		{ background-image: url(../image/menu-background.png); background-position: bottom; background-repeat: no-repeat; }
*/

/* style the background of the menu item */
#cra-nav-m3 ul li		{ background-image: url("../img/bg-nav-m3.png"); background-repeat: no-repeat; background-position: center; }
#cra-nav-m3 ul ul li	{ background-color: #838383; background-image: url("../img/bg-nav-m3-l2.png"); background-repeat: no-repeat; background-position: left top; }
#cra-nav-m3 ul ul ul li	{ background-color: #838383; background-image: url("../img/bg-nav-m3-l2.png"); background-repeat: no-repeat; background-position: left top; }



/*FIX CONTROL*/
/* make the second level visible when hover on first level list OR link */
#cra-nav-m3 ul li:hover ul, #cra-nav-m3 ul a:hover ul { visibility: visible; }
/* keep the third level hidden when you hover on first level list OR link */
#cra-nav-m3 ul :hover ul ul { visibility: hidden; }
/* make the third level visible when you hover over second level list OR link */
#cra-nav-m3 ul :hover ul :hover ul { visibility: visible; z-index: 1; }