stuck on imagemap

[jonfanta]

Hi i am trying to make a 2 layer map. i have an image with that is a map. and on the map i wanted to add dots, second layer. i wanted to make 3 groups with every group a different colour. Every ID is a location and a group can be 20 people/locations. So i thought i make a class( class=end) and sommon that class in the css with a color. The problem now is that the color of that class doesn't show on the map. i have looked a lot on the internet and this forum, but i am now really stuck. can someone show me the way?

This is my HTML:

<DIV id=imagemap>
<IMG height=728 src="map.jpg" width=728 useMap=#iDelta border=0>
<MAP name=iDelta> 
<!-- Area id's start with a -->
<area class="end" id=a7 onmouseover="D(this.id,1);" onMouseOut="D(this.id);" onClick="L(this.id,1);" shape=CIRCLE coords=263,233,25;>
<area id=a23 onMouseOver="D(this.id,1);" onMouseOut="D(this.id);" onClick="L(this.id,1);" shape="poly" coords="349,78,366,109,428,75,416,46">
<area id=t1  onmouseover="D(this.id,1);" onMouseOut="D(this.id);" onClick="L(this.id,1);" shape="poly" coords="348,140,372,180,433,138,419,127,377,120">

This is my css:

IMG{
	z-index: -1;
	POSITION: relative;
	LEFT: 0px; 
	VISIBILITY: visible; 
	WIDTH: 728Spx; 
	TOP: 0px; 
	HEIGHT: 728px;
	background-color: transparant 

}

.end {
	z-index: 4;
	BACKGROUND-COLOR: #f00;
	POSITION: absolute;
	VISIBILITY: hidden;
	
}

[jonfanta]

no one any idea?