I don't know if I'm in the right thread but hope so...I installed a css drop down menu ages ago and in modifying my website would like to add images to the top line when that dropdown category is selected, plus set of images to form a box around the dropdown category (one top image, one bottom image, and an image separating each li item), lastly an arrow on the side of submenus to the next submenu.

I have the pics ready and its all working on another jpeg menu, but am trying to apply the same to my css menu. This is my currnt css code:

Code:
div#dropMenu li a:hover, div#dropMenu li.submenu li.submenu:hover {color: #eb2e83!important;background:#ffffff;}

#dropMenuWrapper {
	width:100%;
	height:25px;
	margin:0;
	font-size:12px;
	}
div#dropMenu {
  	width:100%;
  	margin:0 auto;
    text-align:center;
	z-index:1000;
	position:relative;
	}
div#dropMenu ul {
	margin: 0; 
	padding: 0;
	}
div#dropMenu li {
	position: relative; 
	list-style: none; 
	margin: 0; 
	float: left; 
	line-height: 1em;
	}
div#dropMenu ul.level1 {
	width:75%; 
	margin:0 auto; 
	text-align:center;
	background:#ffffff;
	border-top:0px solid #ffffff;
	border-bottom: 0px solid #ffffff;
	height:25px;
	z-index:1000;
	}
div#dropMenu li:hover {}
div#dropMenu li.submenu {}
div#dropMenu li.submenu:hover {}
div#dropMenu li a {display: block; padding: 7px 25px ;text-decoration: none; color:#400000; text-align:center; border-left:1px solid #ffffff;} 
div#dropMenu>ul a {width: auto;}
div#dropMenu ul ul {position: absolute; width: 13em;display: none;}
div#dropMenu ul ul li {background-image:url('images/hr.gif');
  background-repeat: repeat-x;
  background-position: left bottom; width:13em;}
div#dropMenu li.submenu li.submenu {}
div#dropMenu ul.level1 li.submenu:hover ul.level2, 
div#dropMenu ul.level2 li.submenu:hover ul.level3,
div#dropMenu ul.level3 li.submenu:hover ul.level4,
div#dropMenu ul.level4 li.submenu:hover ul.level5 {display:block;z-index:1000;}
div#dropMenu ul.level2 {top: 2.17em; background:#ffffff;z-index:1000;}
div#dropMenu ul.level3, div#dropMenu ul.level4, div#dropMenu ul.level5 {top: 0; left: 13em; background:#ffffff}
div#dropMenu ul.level2 a {padding: 0.5em 0.25em;color: #400000; text-transform:none;}  /* this is text color on drop-down submenu */
div#dropMenu ul.level2 a:hover {color:#eb2e83;}
The image I would like to appear behind the top selected category is "item1.png",
The image I would like to appear at the top of the dropdown category box is "submenu-top.gif"
The image for the bottom of the dropdown category box is "submenu-bottom.gif"
The image to go in between submenu items is "hr.gif"
The arrow to go next to submenu items which have further subcategories is "arrow.gif"

How/where do I put those images in?