#map {
  margin:0;
  padding:0;
  width:1024px;
  height:796px;
  background:url(mythicalcreatures.jpg) top left no-repeat #fff;
  font-family:arial, helvetica, sans-serif;
  font-size:8pt;
}

#map li {
  margin:0;
  padding:0;
  list-style:none;
}

#map li a {
  position:absolute;
  display:block;
  /*
     Specifying a background image
     (a 1px by 1px transparent gif)
     fixes a bug in older versions of
     IE that causeses the block to not
     render at its full dimensions.
  */
  background:url(blank.gif);
}

#map li a span { display:none; }

#map li a:hover span {
  position:relative;
  display:block;
  width:200px;
  left:20px;
  top:20px;
  padding:5px;
  border:1px solid #000;
  background:#fff;
  text-decoration:none;
  color:#000;
  filter:alpha(opacity=80);
  opacity:0.8;
}

#map a.human {
    top:410px;
    left:420px;
    width:80px;
    height:40px;
    text-decoration:none;
}

#map a.dog {
    top:400px;
    left:690px;
    width:60px;
    height:40px;
    text-decoration:none;
}

#map a.eagle {
    top:170px;
    left:210px;
    width:80px;
    height:40px;
    text-decoration:none;
}

#map a.snake {
    top:200px;
    left:350px;
    width:80px;
    height:40px;
    text-decoration:none;
}

#map a.lion {
 top:220px;
     left:590px;
     width:80px;
     height:20px;
    text-decoration:none;
}

#map a.horse {
    top:470px;
                    left:140px;
                    width:80px;
                    height:20px;
    text-decoration:none;
}

#map a.bull {
    top:600px;
        left:610px;
        width:80px;
        height:20px;
text-decoration:none;
}

#map a.narwhal {
    top:670px;
            left:320px;
            width:80px;
            height:20px;
text-decoration:none;
}

#map a.orthrus {
    top:350px;
    left:730px;
    width:60px;
    height:40px;
    text-decoration:none;
}

#map a.cerberus {
    top:390px;
        left:750px;
        width:60px;
        height:40px;
    text-decoration:none;
}

#map a.unicorn {
    top:570px;
left:180px;
width:80px;
height:20px;
    text-decoration:none;
}

#map a.mermaid {
top:580px;
left:420px;
width:80px;
height:20px;
text-decoration:none;
}

#map a.minotaur {
    top:530px;
    left:550px;
    width:80px;
    height:20px;
text-decoration:none;
}

#map a.echidna {
    top:260px;
        left:380px;
        width:80px;
        height:20px;
    text-decoration:none;
}

#map a.harpy {
    top:330px;
            left:270px;
            width:80px;
            height:20px;
    text-decoration:none;
}

#map a.griffin {
    top:160px;
    left:540px;
    width:80px;
    height:20px;
    text-decoration:none;
}

#map a.manticore {
    top:270px;
         left:540px;
         width:80px;
         height:20px;
        text-decoration:none;
}

#map a.pegasus {
    top:350px;
left:200px;
width:80px;
height:20px;
    text-decoration:none;
}

#map a.centaur {
    top:460px;
                left:260px;
                width:80px;
                height:20px;
    text-decoration:none;
}

#map a.camahueto {
    top:630px;
        left:530px;
        width:80px;
        height:20px;
text-decoration:none;
}

#map a.cynocephalus {
    top:400px;
	left:580px;
	width:90px;
	height:40px;
    text-decoration:none;
}

#map a.cockatrice {
    top:170px;
left:350px;
width:80px;
height:20px;
    text-decoration:none;
}

#map a.mermahuataur {
    top:580px;
    left:500px;
    width:80px;
    height:20px;
    text-decoration:none;
}