.uk {
	padding:0; 
	list-style-type:none; 
	background: url(images/map.jpg) no-repeat; 
	width:650px; 
	height:725px; 
	margin:0 auto; 
	position:relative; 
	z-index:1000;
	}
	
/* move the text off screen */
.uk li a {
	text-indent:-9999px;
	display:block;
	width:20px;
	height:20px;
	background: url(images/spacer.gif) no-repeat;
	position:absolute;
	left: 474px;
	top: 452px;
	}


	
/* make the images and description invisible and an absolute position so that it does not take up any space */
.uk li a em {
	visibility:hidden; 
	position:absolute;
	}
	
/* position the square markers */
/*city co-ordinates*/
.uk li a.ogden {top:122px; left:251px;}
.uk li a.logan {top:62px; left:266px;}
.uk li a.provo {top:254px; left:289px;}
.uk li a.duchesne {top:266px; left:401px;}
.uk li a.ftduchesne {top:259px; left:459px;}
.uk li a.farmington {top:159px; left:262px;}
.uk li a.slc {top:181px; left:260px;}
.uk li a.manilla {top:163px; left:474px;}
.uk li a.vernal {top:229px; left:487px;}
.uk li a.castled {top:381px; left:345px;}
.uk li a.price {top:322px; left:362px;}
.uk li a.greenR {top:415px; left:430px;}
.uk li a.moab {top:485px; left:497px;}
.uk li a.monticello {top:577px; left:519px;}
.uk li a.bluff {top:667px; left:494px;}
.uk li a.stgeorge {top:684px; left:61px;}
.uk li a.kanab {top:686px; left:191px;}
.uk li a.escalante {top:591px; left:283px;}

/*River co-ordinates*/
.uk li a.bearRI {top:96px; left:322px;}
.uk li a.strawberryRI {top:296px; left:341px;}
.uk li a.provoRI {top:216px; left:276px;}
.uk li a.unitahRI {top:196px; left:453px;}
.uk li a.duchesneRI {top:228px; left:395px;}
.uk li a.greenRI {top:21px; left:432px;}
.uk li a.greenRIV {top:328px; left:421px;}
.uk li a.priceRI {top:329px; left:386px;}
.uk li a.sanrafaelRI {top:388px; left:383px;}
.uk li a.weberRI {top:144px; left:323px;}
.uk li a.yampaRI {top:263px; left:564px;}
.uk li a.whiteRI {top:328px; left:526px;}
.uk li a.colorRI {top:452px; left:474px;}
.uk li a.uncomRI {top:456px; left:578px;}
.uk li a.doloresRI {top:543px; left:546px;}
.uk li a.sanjuanRI {top:628px; left:470px;}
.uk li a.escalanteRI {top:574px; left:337px;}
.uk li a.EsevierRI {top:549px; left:256px;}
.uk li a.sevierRI {top:517px; left:183px;}
.uk li a.virginRI {top:645px; left:119px;}

/* move the text back into view on hover */
.uk li a:hover {
	background:#9b532a; 
	text-indent:0; 
	height:0.90em; 
	font-size:10px; 
	color:#fff; 
	line-height:1em; 
	padding:5px; 
	width:20px;

	}
	

	
/* hack for IE5.x */
* html .uk li a:hover {
	width:auto; 
	height:1.5em; 
	w\idth:auto; 
	he\ight:1.2em;
	}
	
/* make the descriptive text visible, give it a size and position */
.uk li a:hover em {
text-align:center;
	visibility:visible; 
	margin-left:5px; 
	background:#fff; 
	border:1px solid #9b532a;
	width:150px; 
	color:#600; 
	padding:10px;
	padding-right:27px;
	font-style:normal; 
	top:-135px; 
	left:-194px;
	font-family:tahoma, geneva, "lucida sans unicode", "lucida grande", arial, sans-serif; 	
	letter-spacing:1px; 
	line-height:1.3em;
	}
	
	
	
/* hack for IE5.x */
* html .uk li a:hover em {width:200px; w\idth:150px;}

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

/* style the empty span (I know it's not semantically correct) into an arrow point */
.uk li a:hover em span {
	display:block; 
	width:0; 
	height:0; 
	overflow:hidden; 
	border:15px solid #fff; 
	border-width:15px 15px 15px 15px; 
	border-right-color:#9b532a; 
	position:absolute; 
	right:0; 
	top:128px;

	}

/* hack for IE5.x */
* html .uk li a:hover em span {
	width:auto; 
	height:30px; 
	w\idth:0; 
	he\ight:0;
	}