How do I get rid of this border outline for my image map areas when clicked (OS X Chrome Only)

Question

I have this image map

http://corfro.com/projects/charlie-faye-tour-map/

And when you click on the different cities a black border shows up on the area but only happening in Chrome. (you might need to click a few times on different cities but the border will show up - once the bus arrives at the city the borders start showing up)

I've tried the following but to no avail.

a{outline:none;}
map > area,
map > area:active,
map > area:focus {outline: none; border:0; }

Do you guys have any suggestions? Any help is much appreciated as this is driving me crazy!

Answer 1

Old trick <area onfocus="blur(); (...) />" Good luck;

Answer 2

I had a similar problem on IE9 and this worked:

#MyImageMap, #MyImage {
    outline: none;
}

Original source of the idea: "One note about image maps is that you'll want to disable the border on the img, map, and area tags using CSS." http://forums.macrumors.com/showthread.php?t=1342928

(the area is a child of the map)