+\r
+/*@media screen {*/\r
+ a.ext-link .icon {\r
+ background: URL(../images/extlink.gif) left center no-repeat;\r
+ padding-left: 16px;\r
+ }\r
+\r
+a.info{\r
+ position:relative; /*this is the key*/\r
+ z-index:24;\r
+ color:#000;\r
+ }\r
+\r
+a.info:hover{z-index:25;}\r
+\r
+a.info span{display: none}\r
+\r
+a.info:hover span{ /*the span will display just on :hover state*/\r
+ display:block;\r
+ position:absolute;\r
+ top:1em; left:-7em; width: 100%;\r
+ border:1px solid #AAA;\r
+ color:#DDD;\r
+ background-color:black; \r
+ text-align: center}\r
+\r
+div#legend a:hover span {display: block;\r
+ float: left; width: 30em;\r
+ padding: 5px; margin: 5px; z-index: 100;\r
+ color: #333; background: white;\r
+ font: 10px Verdana, sans-serif; text-align: left;}\r
+\r
+div#links a:hover span {display: block;\r
+ /*position: absolute; top: 200px; left: 0; width: 125px;*/\r
+ /*position: relative; top: 0px; left: 40; width: 30em;*/\r
+ float: left; width: 30em;\r
+ padding: 5px; margin: 5px; z-index: 100;\r
+ color: #AAA; background: black;\r
+ font: 10px Verdana, sans-serif; text-align: center;}\r
+\r
+\r
+div.oneline { clear : both; }\r
+a.left { float: left; }\r
+a.right { float: right; }\r
+\r
+ /** html a.ext-link .icon { display: inline-block; }*/\r
+/*}*/\r
+\r