.HasChild{
	background:#fff url(../_sysImages/arrows.gif) right no-repeat !important;
}
a.HasChild:hover{
	background:#E6EEF7 url(../_sysImages/arrows.gif) right no-repeat !important;
}

#menuContainer .nav-menu {width:945px;  font:14px "Arial"; text-align: center;}
/* hack to correct IE5.5 faulty box model */
* html #menuContainer .nav-menu {width:945px}
/* remove all the bullets, borders and padding from the default list styling */
#menuContainer .nav-menu ul {margin:0; list-style-type:none !important; padding: 4px 0 0 15px!important;}
#menuContainer .nav-menu ul ul {width:auto; margin: -10px 0 0 -16px!important;z-index: 9999;}


/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */
#menuContainer .nav-menu  li { background-image: none; float: left; height: 23px; border-right: 1px solid #4884b2; padding: 4px 0 0 0; position:relative; margin: 0; z-index:9999;}
#menuContainer .nav-menu  li a{margin-top: -5px; color: #4884b2;	font-size: 14px; display: block; text-decoration:none; line-height:30px;}
#menuContainer .nav-menu li.has-margin{margin:0;}

/* style the links for the top level */
#menuContainer .nav-menu a, 
#menuContainer .nav-menu a:visited {margin: -5px 15px 0 15px; color: #4884b2;	font-size: 14px; display: block;}


/* style the second level background */
#menuContainer .nav-menu ul ul a, 
#menuContainer .nav-menu ul ul a:visited {color: #4884b2; margin: 0; background:#fff; text-decoration:none; font-size: 13px; }
/* style the second level hover */
#menuContainer .nav-menu ul ul a:hover{color: #4884b2; background:#E6EEF7; text-decoration:none !important;}
#menuContainer .nav-menu ul ul :hover > a {color: #4884b2; background:#E6EEF7; text-decoration:none; z-index: 9999;}
/* style the third level background */
#menuContainer .nav-menu ul ul ul a, 
#menuContainer .nav-menu ul ul ul a:visited {margin: 0; background:#fff; text-decoration:none; color: #4884b2; font-size: 13px;}

/* style the third level hover */
#menuContainer .nav-menu ul ul ul a:hover {background:#E6EEF7; text-decoration:none;}

/* hide the sub levels and give them a positon absolute so that they take up no room */
#menuContainer .nav-menu ul ul {visibility:hidden;position:absolute; height:0; top:21px; left:0; width:170px;}
/* another hack for IE5.5 */
* html #menuContainer .nav-menu ul ul {top:21px; z-index:9999;}

/* position the third level flyout menu */
#menuContainer .nav-menu ul ul ul{left:171px; top:-7px; width:170px; margin: -5px 0 0 -16px;}

/* position the third level flyout menu for a left flyout */
/*#menuContainer .nav-menu ul ul ul.left {left:-149px;}

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

/* style the second level links */
#menuContainer .nav-menu ul ul a, #menuContainer .nav-menu ul ul a:visited {color:#4884b2; text-align:left; padding-left: 5px;  line-height:28px; width:165px;  background:#fff;  text-decoration:none;  }
#menuContainer .nav-menu ul ul a:hover{background:#E6EEF7; color:#4884b2 !important; }
/* yet another hack for IE5.5 */
* html #menuContainer .nav-menu ul ul a,
* html #menuContainer .nav-menu ul ul a:visited {width:165px; width:165px;}
* html #menuContainer .nav-menu  li a{display: block; text-decoration:none;}



/* style the top level hover */
#menuContainer .nav-menu a:hover{color:#fff; border-color:#6F8700;  }
#menuContainer .nav-menu :hover > a{color:#fff; border-color:#6F8700; overflow: auto; }

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

/* make the third level visible when you hover over second level list OR link */
#menuContainer .nav-menu ul :hover ul :hover ul{ visibility:visible;}
#menuContainer .nav-menu li li{padding: 0; border-left:1px solid #A4C4E3; border-right:1px solid #A4C4E3; height: 28px; margin: 0;}



/*****************/
/* for left menu */
/*****************/

#meroMenu .navi-menu{width: 203px; _width: 201px !important; font: 14px "Arial"; text-align: left;}

/* remove all the bullets, borders and padding from the default list styling */
#meroMenu .navi-menu ul {margin:0; background-image:none; padding: 0!important;}

/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */
#meroMenu .navi-menu  li {text-align: left; position: relative; background-image:none; margin: -5px 0 -10px -15px; _margin-right: -6px;_margin-left: -14px;}

/* style the second level background */
#meroMenu .navi-menu ul a,
#meroMenu .navi-menu ul a:visited {padding: 5px 0 0 5px; color: #4884b2; margin: 0; background:#fff; text-decoration:none; font-size: 13px; display: block; width:195px; _width:190px;height: 23px;}

/* style the second level hover */
#meroMenu .navi-menu ul a:hover{padding: 5px 0 0 5px; display: block; width:195px; height: 23px; color: #4884b2; background:#E6EEF7; text-decoration:none !important;}
#meroMenu .navi-menu ul :hover > a {padding: 5px 0 0 5px; display: block; width:195px; height: 23px; color: #4884b2; background:#E6EEF7; text-decoration:none;}

/* style the third level background */
#meroMenu .navi-menu ul ul a,
#meroMenu .navi-menu ul ul a:visited {padding: 5px 0 0 5px; display: block; width:135px; height: 23px; margin: 0; background:#fff; text-decoration:none; color: #4884b2; font-size: 13px;}

/* style the third level hover */
#meroMenu .navi-menu ul ul a:hover {padding: 5px 0 0 5px; display: block; width:135px; height: 23px; background:#E6EEF7; text-decoration:none;}

/* hide the sub levels and give them a positon absolute so that they take up no room */
#meroMenu .navi-menu ul ul {visibility:hidden; height:0; _height:0; position: relative; top:0;}

/* another hack for IE5.5 */
* html #meroMenu .navi-menu ul ul{left: 169px; position: absolute; margin-top: 30px;}

/* position the third level flyout menu */
#meroMenu .navi-menu ul ul{left:169px; top:-40px; width:135px; margin: 0 0 0 -15px;}

/* position the third level flyout menu for a left flyout */
/*#meroMenu .navi-menu ul ul ul.left {left:-149px;}*/

/* position the third level flyout menu */
#meroMenu .navi-menu ul ul ul{visibility:hidden; left:140px; width:140px; margin: 2px 0 0 0;}

/** #meroMenu .navi-menu ul ul ul{left:140px; top:-13px; width:140px;}*/

* html #meroMenu .navi-menu ul ul ul{left:140px; top:-16px; width:140px; margin: 0;}

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

/* style the second level links */
#meroMenu .navi-menu ul a{color:#4884b2; text-align:left; padding: 5px 0 0 5px; width:195px; background:#fff;  text-decoration:none;  }
#meroMenu .navi-menu ul a:hover{color:#4884b2; text-align:left; padding: 5px 0 0 5px; width:195px; background:#E6EEF7; color:#4884b2 !important; }
/*#meroMenu .navi-menu ul ul a:visited {color:#4884b2; text-align:left; padding: 5px 0 0 5px; width:165px;  background:#fff;  text-decoration:none;  }*/

/* yet another hack for IE5.5 */
* html #meroMenu .navi-menu li a{display: block; text-decoration:none;}

/* style the top level hover */
#meroMenu .navi-menu a:hover{color:#fff;  }
#meroMenu .navi-menu :hover > a{color:#fff; overflow: auto; }

/* make the second level visible when hover on first level list OR link */
#meroMenu .navi-menu ul li:hover ul,
#meroMenu .navi-menu ul a:hover ul{visibility:visible; }
* html #meroMenu .navi-menu ul li a:hover ul{visibility:visible;}
* html #meroMenu .navi-menu :hover > a{color:#fff; overflow: auto; }

/* keep the third level hidden when you hover on first level list OR link */
#meroMenu .navi-menu ul :hover ul ul{visibility:hidden;}
#meroMenu .navi-menu ul ul :hover ul{visibility:visible;}

* html #meroMenu .navi-menu ul li a:hover ul,
* html #meroMenu .navi-menu ul li ul li a:hover ul{visibility: visible;}
* html #meroMenu .navi-menu ul li a:hover ul ul{visibility: hidden;}


/* make the third level visible when you hover over second level list OR link */
#meroMenu .navi-menu ul :hover ul{ visibility:visible;}
#meroMenu .navi-menu li li{padding: 0; border-left:1px solid #A4C4E3; border-right:1px solid #A4C4E3; width:140px; height:28px; margin: 0; *margin-bottom: -3px !important; _margin-bottom: 0 !important; display: block};

#menuContainer .nav-menu li li a{display:block}