image map in header not showing

I am trying to add an image map that shows up on pages linked from the home page. The home page shows the image and is mapped OK. I added a page called SOAP but that has an empty box shown instead. Uncreated pages that I have yet to add text to have the correct image with the map but get ‘this is somewhat embarrassing’ on them. I think that there is an invalid location referenced in the code but I am not sure.

The website is grapefru.it/soap

I modified the header.php below the body part:

<div style="text-align: center;">
<h1 style="font-family: Arial;"></h1>
&nbsp;<img src="bigtree_layered_with_text_upload.png" usemap="#map"
 border="0" height="720" width="720">
<map name="map">
<area shape="circle" coords="304,98,41" alt="Cosmology"
 href="cosmology.html">
<area shape="circle" coords="237,201,43" alt="nutrition"
 href="nutrition.html">
<area shape="circle" coords="453,166,42" alt="drugs" href="drugs">
<area shape="circle" coords="158,316,43" alt="strange uses"
 href="strange_uses.html">
<area shape="circle" coords="292,283,43" alt="Your Advert"
 href="youradvert.html">
<area shape="circle" coords="433,293,41" alt="Tea" href="tea.html">
<area shape="circle" coords="555,238,42" alt="Art" href="art.html">
<area shape="circle" coords="116,451,42" alt="Perfume"
 href="perfume.html">
<area shape="circle" coords="243,445,43" alt="marketing"
 href="marketing.html">
<area shape="circle" coords="473,452,42" alt="soap" href="soap">
<area shape="circle" coords="562,362,42" alt="RSS" href="RSS.html">
<area shape="circle" coords="659,334,40" alt="Articles"
 href="articles.html">
</map>

The href with html at the end were to allow me to test the image map but don’t link to real pages yet.

I had a quick check to see if this type of issue had been already answered but didn’t find anything exactly like it.

Thanks