/* remove the list style */
#nav { margin:0; padding:0; list-style:none; background:url(../../images/menuh-arp.jpg) repeat-x; height:37px }
/* make the LI display inline */
/* it's position relative so that position absolute */
/* can be used in submenu */
#nav li { float:left; display:block; height:33px; position:relative; padding: 0 7px; z-index:500; margin:0 1px 0 0; border-right:#ccc solid 1px; background:url(../../images/menuh-arp.jpg) repeat-x;  }
#nav li:hover { background:url(../../images/menuh-arpactiv.jpg) repeat-x; }
/* this is the parent menu */
#nav li a { display:block; padding:8px 5px 0 5px; font-weight: normal; height:29px; text-decoration:none; color:#fff; text-align:left;  }
#nav li a:hover { color:#fff; text-decoration:none }
/* you can make a different style for default selected value */
#nav a.selected { color: #FFFF00; }
/* submenu, it's hidden by default */
#nav ul { position:absolute; left:0; display:none; margin:0 0 0 -1px; padding:0; list-style:none; }
#nav ul li { width:170px; float:left; border-top:1px solid #006600; }
/* display block will make the link fill the whole area of LI */
#nav ul a { display:block; height:15px; padding: 5px 5px; color:#fff; }
#nav ul a:hover { text-decoration:none; }
/* fix ie6 small issue */
/* we should always avoid using hack like this */
/* should put it into separate file : ) */
#nav ul { margin:0 0 0 -2px; }