/* CSS for image map */


/* set up the font to be used for the page */
body {
  font-family: verdana, tahoma, arial, sans-serif;
  }

/* set the size of the definition list <dl> and add the background image */
#imap {
  display:block; 
  width:640px; 
  height:480px; 
  background:url(images/image.gif) no-repeat; 
  position:relative;
  }

	/* set up the definition list <dt><a> to hold the background image for the hover state */
#imap a#title {
  display:block;
  width:640px;
  height:0;
  padding-top:480px;
  overflow:hidden;
  position:absolute;
  left:0;
  top:0;
  background:transparent url(images/hoover.gif) no-repeat 640px 640px;
  cursor:default;
  }
/* the hack for IE pre IE6 */
* html #imap a#title {
  height:480px;
  he\ight:0;
  }
	
/* the <dt><a> hover style to move the background image to position 0 0 */
#imap a#title:hover {
  background-position: 0 0;
  z-index:10;
  }

	/* place the <dd>s in the correct absolute position */
#imap dd {
  position:absolute;
  padding:0;
  margin:0;
  }

#imap #solid {
  left:317px;
  top:218px;
  z-index:20;
  }
#imap #raiden {
  left:203px;
  top:315px;
  z-index:20;
  }
#imap #rose {
  left:233px;
  top:203px;
  z-index:20;
  }
#imap #otacon {
  left:383px;
  top:124px;
  z-index:20;
  }
#imap #olga {
  left:303px;
  top:30px;
  z-index:20;
  }
#imap #emma {
  left:148px;
  top:203px;
  z-index:20;
  }
#imap #colonel {
  left:63px;
  top:273px;
  z-index:20;
  }
#imap #fortune {
  left:482px;
  top:82px;
  z-index:20;
  }
#imap #vamp {
  left:182px;
  top:50px;
  z-index:20;
  }
#imap #revolver {
  left:31px;
  top:49px;
  z-index:20;
  }
#imap #solidus {
  left:397px;
  top:6px;
  z-index:20;
  }

/* style the <dd><a> links physical size and the background image for the hover */
#imap a#snake, #imap a#jack, #imap a#hal, #imap a#mary, #imap a#knife, #imap a#emmer, #imap a#queen, #imap a#ocelot, #imap a#campbell, #imap a#ninja, #imap a#ssnake {
  display:block;
  width:85px;
  height:85px;
  background:transparent url(images/hover.gif) -100px -100px no-repeat;
  text-decoration:none;
  z-index:20;
  }
	

/* style the span text so that it is not initially displayed */
#imap a span, #imap a:visited span {
  display:none;
  }
	
/* move the link background image to position 0 0 when hovered */
#imap a#snake:hover, #imap a#jack:hover, #imap a#hal:hover, #imap a#mary:hover {
  background-position:0 0;
  }

/* move the link background image to position 0 0 when hovered */
#imap a#knife:hover, #imap a#emmer:hover, #imap a#queen:hover, #imap a#ocelot:hover {
  background-position:0 0;
  }
	
/* move the link background image to position 0 0 when hovered */
#imap a#campbell:hover, #imap a#ninja:hover, #imap a#ssnake:hover {
  background-position:0 0;
  }

/* define the common styling for the span text */
#imap a:hover span {
  position:absolute;  
  width:388px; 
  display:block; 
  font-family:arial; 
  font-size:12px; 
  background:#fff; 
  color:#000; 
  border:1px solid #000; 
  padding:5px;
  }
/* the hack for IE pre IE6 */
* html #imap a:hover span {
  width:400px; w\idth:388px;
  }	
	
/* move the span text to a common position at the bottom of the image map */
#imap a#snake:hover span {
  left:-317px; 
  top:270px;
  }
#imap a#jack:hover span {
  left:-203px; top:175px;
  }
#imap a#mary:hover span {
  left:-233px; 
  top:285px;
  }
#imap a#emmer:hover span {
  left:-148px; 
  top:285px;
  }
#imap a#campbell:hover span {
  left:-63px; 
  top:215px;
  }
#imap a#ocelot:hover span {
  left:-31px; 
	top:440px;
  }
#imap a#queen:hover span {
  left:-482px; 
  top:405px;
  }
#imap a#hal:hover span {
  left:-383px; 
  top:365px;
  }
#imap a#knife:hover span {
  left:-181px; 
	top:440px;
  }
#imap a#ninja:hover span {
  left:-303px; 
  top:460px;
  }
#imap a#ssnake:hover span {
  left:-397px; 
  top:480px;
  }
	
/* add the style for the link span text - first line */
#imap a span:first-line {
  font-weight:bold; 
  font-style:italic;
	color: #0076A3;
  }