/* table font size */
.smallstyle {font-size: small}

/* setup the background image of Michigan */
.mi {padding:0; margin:0; list-style-type:none; background:#fff url(images/css images/michigan-physical-map.gif); background-repeat:no-repeat; background-position:center; width:100%; height:492px; margin:0px 10px 0px 10px; position:relative; z-index:1;}

/* table formatting */
.mi table {
margin:-2px;
border:0;
padding:0;
border-collapse:collapse;
font-size:1em;
}

/* move the text off screen */
.mi li a {text-indent:-999px; display:block; width:30px; height:30px; background:transparent url(images/blueflame_icon.gif); background-repeat:no-repeat; line-height:8px; text-decoration:none;}

/* make the images and description invisible and an absolute position so that it does not take up any space */
.mi li a dl {visibility:hidden; position:absolute;}

/* style links */
.mi a.link {text-decoration:underline;}

/* position the square markers */
.mi li a.corp {position:absolute; top:310px; left:380px; z-index:4;}
.mi li a.rich {position:absolute; top:330px; left:380px; z-index:4;}
.mi li a.lape {position:absolute; top:310px; left:325px; z-index:5;}

/*.mi li a.lexi {position:absolute; top:390px; left:270px; z-index:5;}  //lexington*/

.mi li a.mio {position:absolute; top:120px; left:245px; z-index:6;}
.mi li a.west {position:absolute; top:162px; left:240px; z-index:6;}
.mi li a.midl {position:absolute; top:235px; left:240px; z-index:6;}
.mi li a.harr {position:absolute; top:200px; left:185px; z-index:7;}

/* display area highlight when moused over */
.mi li a:hover.corp {position:absolute; display:block; width:60px; height:60px; top:287px; left:357px; background:transparent url(images/css images/area_highlight.gif); background-repeat:no-repeat;}
.mi li a:hover.rich {position:absolute; display:block; width:60px; height:60px; top:307px; left:357px; background:transparent url(images/css images/area_highlight.gif); background-repeat:no-repeat;}
.mi li a:hover.lape {position:absolute; display:block; width:60px; height:60px; top:287px; left:302px; background:transparent url(images/css images/area_highlight.gif); background-repeat:no-repeat;}

/*.mi li a:hover.lexi {position:absolute; display:block; width:60px; height:60px; top:370px; left:255px; background:transparent url(images/css images/area_highlight.gif); background-repeat:no-repeat;}  //lexington*/

.mi li a:hover.mio {position:absolute; display:block; width:60px; height:60px; top:97px; left:222px; background:transparent url(images/css images/area_highlight.gif); background-repeat:no-repeat;}
.mi li a:hover.west {position:absolute; display:block; width:60px; height:60px; top:139px; left:217px; background:transparent url(images/css images/area_highlight.gif); background-repeat:no-repeat;}
.mi li a:hover.midl {position:absolute; display:block; width:60px; height:60px; top:212px; left:217px; background:transparent url(images/css images/area_highlight.gif); background-repeat:no-repeat;}
.mi li a:hover.harr {position:absolute; display:block; width:60px; height:60px; top:177px; left:162px; background:transparent url(images/css images/area_highlight.gif); background-repeat:no-repeat;}

/* make the descriptive text visible, give it a size and position */
/* formatting for ballon */
.mi li a:hover dl {visibility:visible; width:200px; padding:0 0 20px 0; height:auto; top:-100px; left:65px;}
.mi li a:hover dt {margin:0; padding:5px; font-size:1.4em; font-weight:bold; color: #000; text-align:center;}
.mi li a:hover dd {margin:0; padding:5px 15px; color:#000; font-size:1em; border:1px solid #000; border-width:0 1px; background:#ffffff;}
.mi li a:hover dd p {padding:0; margin:0; line-height:1.5em;}

/* hack for IE5.x */
* html .mi li a:hover dl {width:200px; w\idth:150px;}

/* give the image a border and margin 
.mi li a:hover dl img {border:1px solid #000; display:block; margin-bottom:10px;}
*/

/* display area highlight when moused over */
.mi li a:hover {display:block; width:60px; height:60px; top:-30px; left:-30px; background:transparent url(images/css images/area_highlight.gif); background-repeat:no-repeat;}

/* style the pointer */
.mi li a:hover dl em {display:block; width:36px; height:36px; position:absolute; left:-35px; top:75px; background:transparent url(images/css images/pointer.gif);}

/* hack for IE5.x */
* html .mi li a:hover dl em {width:36px; height:36px; w\idth:0; he\ight:0;}