#imap {
	display:block;
	width:400px;
	height:450px;
	background:url(../course/img/map.jpg) no-repeat;
	position:relative;
	margin-top: 8px;
	margin-left: 75px;
  }
  
/* set up the definition list <dt><a> to hold the background image for the hover state */
#imap a#title {
  display:block; 
  width:400px; 
  height:0; 
  padding-top:281px; 
  overflow:hidden; 
  position:absolute; 
  left:0; 
  top:0; 
  background:transparent url(../course/img/map_hover.jpg) no-repeat 400px 400px; 
  cursor:default;
  }
/* the hack for IE pre IE6 */
* html #imap a#title {
  height:240px;
  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;
  }
  
#imap dd {
  position:absolute; 
  padding:0; 
  margin:0;
  }
#imap #pic1 {
  left:176px; 
  top:152px; 
  z-index:20;
  }
#imap #pic2 {
  left:64px; 
  top:86px; 
  z-index:20;
  }
#imap #pic3 {
  left:16px; 
  top:120px; 
  z-index:20;
  }
#imap #pic4 {
  left:154px; 
  top:229px; 
  z-index:20;
  }
#imap #pic5 {
  left:57px; 
  top:128px; 
  z-index:20;
  }
#imap #pic6 {
  left:124px; 
  top:133px; 
  z-index:20;
  }
#imap #pic7 {
  left:179px; 
  top:113px; 
  z-index:20;
  }
#imap #pic8 {
  left:159px; 
  top:36px; 
  z-index:20;
  }
#imap #pic9 {
  left:186px; 
  top:95px; 
  z-index:20;
  }
#imap #pic10 {
  left:247px; 
  top:229px; 
  z-index:20;
  }
#imap #pic11 {
  left:193px; 
  top:170px; 
  z-index:20;
  }
#imap #pic12 {
  left:158px; 
  top:249px; 
  z-index:20;
  }
#imap #pic13 {
  left:243px; 
  top:249px; 
  z-index:20;
  }
#imap #pic14 {
  left:280px; 
  top:172px; 
  z-index:20;
  }
#imap #pic15 {
  left:365px; 
  top:116px; 
  z-index:20;
  }
#imap #pic16{
  left:280px; 
  top:108px; 
  z-index:20;
  }
#imap #pic17{
  left:246px; 
  top:209px; 
  z-index:20;
  }
#imap #pic18{
  left:218px; 
  top:121px; 
  z-index:20;
  }
#imap #pic19{
  left:220px; 
  top:99px; 
  z-index:20;
  }
  
  /* style the <dd><a> links physical size and the background image for the hover */
#imap a#hole1, #imap a#hole2, #imap a#hole3, #imap a#hole4, #imap a#hole5, #imap a#hole6, #imap a#hole7, #imap a#hole8, #imap a#hole9, #imap a#hole10, #imap a#hole11,
#imap a#hole12, #imap a#hole13, #imap a#hole14, #imap a#hole15, #imap a#hole16, #imap a#hole17, #imap a#hole18, #imap a#hole19 {
  display:block; 
  width:17px; 
  height:17px; 
  background:transparent url(../course/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#hole1:hover, #imap a#hole2:hover, #imap a#hole3:hover, #imap a#hole4:hover, #imap a#hole5:hover, #imap a#hole6:hover, #imap a#hole7:hover, #imap a#hole8:hover,
#imap a#hole9:hover, #imap a#hole10:hover, #imap a#hole11:hover, #imap a#hole12:hover, #imap a#hole13:hover, #imap a#hole14:hover, #imap a#hole15:hover, 
#imap a#hole16:hover, #imap a#hole17:hover, #imap a#hole18:hover, #imap a#hole19:hover {
  background-position:0 0;
  }

/* define the common styling for the span text */
#imap a:hover span {
  position:absolute;  
  width:400px; 
  display:block; 
  font-family:arial; 
  font-size:12px; 
  background:#e8e7f5; 
  color:#000; 
  border:1px solid #560b74; 
  padding:5px;
  }
/* the hack for IE pre IE6 */
* html #imap a:hover span {
  width:400px; w\idth:400px;
  }
#imap a:hover span IMG{
	float: left;
	margin-right: 10px;
	border: 1px solid #000000;

} 
  
  
 /* move the span text to a common position at the bottom of the image map */
#imap a#hole1:hover span {
  left:-177px; 
  top:135px;
  }
#imap a#hole2:hover span {
  left:-65px; 
  top:202px;
  }
#imap a#hole3:hover span {
  left:-17px; 
  top:168px;
  }
#imap a#hole4:hover span {
  left:-154px; 
  top:58px;
  }
#imap a#hole5:hover span {
  left:-57px; 
  top:159px;
  }
#imap a#hole6:hover span {
  left:-124px; 
  top:155px;
  }
#imap a#hole7:hover span {
  left:-179px; 
  top:174px;
  }
#imap a#hole8:hover span {
  left:-159px; 
  top:251px;
  }
#imap a#hole9:hover span {
  left:-186px; 
  top:192px;
  }
#imap a#hole10:hover span {
  left:-247px; 
  top:58px;
  }
#imap a#hole11:hover span {
  left:-193px; 
  top:117px;
  }
#imap a#hole12:hover span {
  left:-158px; 
  top:38px;
  }
#imap a#hole13:hover span {
  left:-243px; 
  top:38px;
  }
#imap a#hole14:hover span {
  left:-280px; 
  top:116px;
  }
#imap a#hole15:hover span {
  left:-365px; 
  top:173px;
  }
#imap a#hole16:hover span {
  left:-280px; 
  top:180px;
  }
#imap a#hole17:hover span {
  left:-246px; 
  top:78px;
  }
#imap a#hole18:hover span {
  left:-218px; 
  top:167px;
  }
#imap a#hole19:hover span {
  left:-220px; 
  top:189px;
  }
  
 /* add the style for the link span text - first line */
#imap a span:first-line {
  font-weight:bold;   
  }