.align   { position: absolute; left: 12%; }
  .enhance { position: absolute; left: 83px; top: 20px; font-size: 120px; color:#000099 }

body {
 font-size: 10;
 font-family: Verdana;
 }

td {
 font-size: 10;
 font-family: Verdana;
 }

a:link { COLOR: #FF5A10; TEXT-DECORATION: none;}
a:mailto { COLOR: #FF5A10; TEXT-DECORATION: none;}
a:visit { color: #FF5A10; TEXT-DECORATION: none; }
a:visited { color: #FF5A10; TEXT-DECORATION: none; }
a:hover { color: #FF5A10; text-decoration: underline;}


/*
Inspired and edited from frankmanno.com/ideas/css-imagemap/, but not exactly easy for a very first CSS positioning attempt
*/

img.image{ display: none; }

dl#naviMap{
	margin: 0;
	padding: 0;
	background: transparent url(linktable.gif) top left no-repeat;
	height: 100px;
	width: 518px;
	position: relative;
}

dt{ margin: 0; padding: 0; position: absolute; font-size: 85%; display: none; }
dd{ margin: 0; padding: 0; position: absolute;  font-size: 85%; }

/* ---------- Hotspot Declarations ---------- */
dd#aboutDef{ top: 8px; left: 40px; }
dd#aboutDef a{ position: absolute; width: 134px; height: 41px; text-decoration: none; }
dd#aboutDef a span{ display: none; }
dd#aboutDef a:hover{ position: absolute; background: transparent url(linktable.gif) -40px -108px no-repeat;} 

/* Since you're reading through this, you sneaky user you, know that I had to set each of these by trial and error, until the last two or three where I could do the math in my head compared to the other ones. Knowing the exact sizes of the boxes I was working with helped. A lot. */

dd#hostingDef{ top: 8px; left: 175px; }
dd#hostingDef a{ position: absolute; width: 175px; height: 41px; text-decoration: none; }
dd#hostingDef a span{ display: none; }
dd#hostingDef a:hover{ background: transparent url(linktable.gif) -175px -108px no-repeat; }

dd#rkbaDef{ top: 8px; left: 350px; }
dd#rkbaDef a{ position: absolute; width: 125px; height: 41px; text-decoration: none; }
dd#rkbaDef a span{ display: none; }
dd#rkbaDef a:hover{ background: transparent url(linktable.gif) -350px -108px no-repeat; }

dd#futureDef{ top: 50px; left: 35px; }
dd#futureDef a{ position: absolute; width: 134px; height: 41px; text-decoration: none; }
dd#futureDef a span{ display: none; }
dd#futureDef a:hover{ background: transparent url(linktable.gif) -35px -150px no-repeat; }

dd#athensDef{ top: 50px; left: 175px; }
dd#athensDef a{ position: absolute; width: 175px; height: 41px; text-decoration: none; }
dd#athensDef a span{ display: none; }
dd#athensDef a:hover{ background: transparent url(linktable.gif) -175px -150px no-repeat; }

dd#legalDef{ top: 50px; left: 350px; }
dd#legalDef a{ position: absolute; width: 125px; height: 41px; text-decoration: none; }
dd#legalDef a span{ display: none; }
dd#legalDef a:hover{ background: transparent url(linktable.gif) -350px -150px no-repeat; }

/* and a little functionality upgrade of my own */

dd#upDef{ top: 12px; left: 500px; }
dd#upDef a{ position: absolute; width: 12px; height: 16px; text-decoration: none; }
dd#upDef a span{ display: none; }

dd#downDef{ top: 32px; left: 501px; }
dd#downDef a{ position: absolute; width: 12px; height: 16px; text-decoration: none; }
dd#downDef a span{ display: none; }


dd#homeDef{ top: 52px; left: 487px; }
dd#homeDef a{ position: absolute; width: 12px; height: 16px; text-decoration: none; }
dd#homeDef a span{ display: none; }





iframe { border: 1px dashed #FF5A10 }
div.arrows { width:300px; text-align:right }
div.arrows img { padding:8px }