/* CSS Document */
/* set up the font to be used for the page */

/* set the size of the definition list <dl> and add the background image */
#imap {
  display:block; 
  width:700px; 
  height:525px; 
  background:url(../img/personal.jpg) no-repeat; 
  position:relative;
  margin-left:auto; 
  margin-right:auto;
  }
#imap a{
	border-bottom:none;
}
#imap a:hover{
	border-bottom:none;
}
/* set up the definition list <dt><a> to hold the background image for the hover state */
#imap a#title {
  display:block; 
  width:300px; 
  height:0; 
  overflow:hidden; 
  position:absolute; 
  left:0; 
  top:0; 
  background:transparent url(../img/personal-hover.jpg) no-repeat 400px 400px; 
  cursor:default;
  }
/* the hack for IE pre IE6 */
* html #imap a#title {
  height:525px;
  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 #pic-apontes {
  left:75px; 
  top:190px; 
  z-index:20;
  }
#imap #pic-dansly {
  left:123px; 
  top:145px; 
  z-index:20;
  }
#imap #pic-hortencia {
  left:215px; 
  top:210px; 
  z-index:20;
  }
#imap #pic-sonia {
  left:380px; 
  top:215px; 
  z-index:20;
  }
#imap #pic-apontes02 {
  left:402px; 
  top:130px; 
  z-index:20;
  }
#imap #pic-gabriel {
  left:502px; 
  top:230px; 
  z-index:20;
  }
#imap #pic-cecilia {
  left:200px; 
  top:150px; 
  z-index:20;
  }
#imap #pic-fredy {
  left:305px; 
  top:120px; 
  z-index:20;
  }
#imap #pic-daniel {
  left:560px; 
  top:130px; 
  z-index:20;
  }
/* style the <dd><a> links physical size and the background image for the hover */
#imap a#apontes, #imap a#dansly, #imap a#hortencia, #imap a#sonia, imap a#apontes02, imap a#gabriel {
  display:block; 
  width:85px; 
  height:85px; 
  background:transparent url(../img/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#apontes:hover, #imap a#dansly:hover, #imap a#hortencia:hover, #imap a#sonia:hover, #imap a#apontes02:hover, #imap a#gabriel:hover {
  background-position:0 0;
  }
/* define the common styling for the span text */
#imap a:hover span {
  position:absolute;  
  width:250px;
  text-align:center;
  padding:10px;
  display:block; 
  font-family:arial; 
  font-size:12px; 
  background:#FFFFFF; 
  color:#333333; 
  border:4px solid #111111; 
  }
/* the hack for IE pre IE6 */
* html #imap a:hover span {
  width:250px; w\idth:250px;
  }
/* move the span text to a common position at the bottom of the image map */
#imap a#apontes:hover span {
  left:-36px; 
  top:200px;
  }
#imap a#dansly:hover span {
  left:-113px; top:170px;
  }
#imap a#hortencia:hover span {
  left:-193px; 
  top:196px;
  }
#imap a#sonia:hover span {
  left:-263px; 
  top:186px;
  }
#imap a#apontes02:hover span {
  left:-36px; 
  top:200px;
  }
/* add the style for the link span text - first line */
#imap a span:first-line {
  font-weight:bold; 
  }