/*1*/

#menu ul li a{
/******/background: #81a2a2;		
/******/color: #ecf2f2;
}
/*4a*/
#menu li:hover > a{
/******/background: #eee7eb; /*tab link background during hover state*/
/******/color: #81a2a2;
}
/*4b*/
#menu li.parent >a{ /* item in the top level which is a parent*/
		background-image:url(http://www.californiadar.org/chapter_base_css/templates/chapters5template/images/downdesert.gif);
		background-position: 98% 50%;
		background-repeat: no-repeat;
}
/*4c*/
/*hover for items which are parents*/
#menu li.parent:hover > a {
/******/background: #eee7eb;
/******/color:  #81a2a2;
		background-image:url(http://www.californiadar.org/chapter_base_css/templates/chapters5template/images/downdesert-hover.gif);
		background-position: 98% 50%;
		background-repeat: no-repeat;
}
/*5*/
 
/* When the mouse is over a list (li) element with unordered-list (ul) element inside then show it. The position when its shown is defined in the previous block of CSS*/
#menu ul li:hover > ul {
/******/border: 1px solid #81a2a2;	

}
/*Styles 2nd level a tag*/
#menu ul ul a {
/******/border-bottom: 1px solid #ecf2f2;
}

/* Styles the anchor (a) tag when mouse over 2nd level*/
#menu ul ul a:hover {
/******/background: #eee7eb; 
/******/color: #81a2a2;
}