/* CSS Document */

/* suggested order ---

display
float
clear
overflow
width
height
margin-
border-
padding-
background-
color
font-
text-

*/

body {
	margin: 20px;
	font: normal 12px/15px Arial, Helvetica, sans-serif;
	color: #555;
	}

h1 {
	margin: 2px 0;
	font: bold 23px/25px "Trebuchet MS", Trebuchet, Verdana, Arial, Helvetica, sans-serif;
	letter-spacing: -0.04em;
	color: #000;
	}
h4 {
	margin: 2px 0;
	font: normal 11px/13px Arial, Helvetica, sans-serif;
	color: #000;
	}

#basic-themes h4 {
	margin: 2px 0;
	font: normal 15px/20px Arial, Helvetica, sans-serif;
	color: #000;
}

#basic-themes li {
	font: normal 14px/20px Arial, Helvetica, sans-serif;
	color: #000;
}

.map-h3 
{
	font-size: 16px; 
	font-weight: bold; 
	font-family: Constantia, "Palatino Linotype", Palatino, Georgia, "Times New Roman", Times, serif;
}

.radioButtonList ul li { /* the rules that do the indenting */
	list-style-type: none;
	text-indent: -2em;
	}	
	
#main {
	width: 960px;
	}

a img {
	border: 0;
	}
	
#layer {
	margin: 10px 0;
	margin-top: 20px;
	width: 460px;
	}	
	
#map-column {
	width: 700px;
	float: right;
	}
#nav-column {
	border-top: 5px solid #fff;
	border-bottom: 5px solid #fff;
	width: 400px;
	}
#ref-column {
	float: right;
	}
	
#map { 
	display: block;
	position: relative;
	margin: 0;
	border: 5px solid #c5ccd4;
	padding: 0;
	width: 450px;
	height: 450px;
	overflow: hidden;
	background-color: #fdf3cc;
	background-color: #ece8d8;
	}
#map-image { 
	position: absolute;
	margin: 0;
	border: 0;
	padding: 0;
	width: 450px;
	height: 450px;
	background-position: 0 0;
	}
#scalebar {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 110px;
	height: 20px;
	background-color: transparent;
	background-image: none;
	background-position: 0 2px;
	background-repeat: no-repeat;
	}
#scalebar:hover {
	background-color: #d0e0bb;
	}
#refmap {
	border: 1px solid #ccc;
	z-index: 1000;
	width: 220px;
	height: 220px;
	background: transparent url(null) top left no-repeat;
 	}	
#legend {
	width: 220px;
	}
#hourglass {
	border: 0;
	z-index: 4000;
	position: absolute;
	top: 0px;
	left: 408px;
	padding:10px;
	background-color:#fff;
	}
	
#footer {
	margin-top: 4px;
	clear: both;
	font: normal 11px/13px Arial, Helvetica, sans-serif;
	color: #888;
	}
#footer hr {
	display: none;	
	}	
	
#controls {
	position: relative;
	}
#pan-dir {
	display: block;
	/*display: none; */
	position: absolute;
	left: 10px;
	top: 10px;
	width: 45px;
	height: 45px;
	border: 0;
	}
#pan-nw {
	position: absolute;
	display: block;
	left: 0;
	top: 0;
	width: 15px;
	height: 15px;
	}
#pan-nw span {
	display: none;
	}
#pan-nw a {
	display: block;
	width: 15px;
	height: 15px;
	text-decoration: none;
	}
#pan-nw a:hover {
	background: url(../images/pan-nw-h.gif) top left no-repeat;
	text-decoration: none;
	}
#pan-n {
	position: absolute;
	display: block;
	left: 15px;
	top: 0;
	width: 15px;
	height: 15px;
	}
#pan-n span {
	display: none;
	}
#pan-n a {
	display: block;
	width: 15px;
	height: 15px;
	background: url(../images/pan-n.gif) top left no-repeat;
	text-decoration: none;
	}
#pan-n a:hover {
	background: url(../images/pan-n-h.gif) top left no-repeat;
	text-decoration: none;
	}
#pan-ne {
	position: absolute;
	display: block;
	left: 30px;
	top: 0;
	width: 15px;
	height: 15px;
	}
#pan-ne span {
	display: none;
	}
#pan-ne a {
	display: block;
	width: 15px;
	height: 15px;
	text-decoration: none;
	}
#pan-ne a:hover {
	background: url(../images/pan-ne-h.gif) top left no-repeat;
	text-decoration: none;
	}
#pan-w {
	position: absolute;
	display: block;
	left: 0px;
	top: 15px;
	width: 15px;
	height: 15px;
	}
#pan-w span {
	display: none;
	}
#pan-w a {
	display: block;
	width: 15px;
	height: 15px;
	background: url(../images/pan-w.gif) top left no-repeat;
	text-decoration: none;
	}
#pan-w a:hover {
	background: url(../images/pan-w-h.gif) top left no-repeat;
	text-decoration: none;
	}
#pan-center {
	position: absolute;
	display: block;
	left: 15px;
	top: 15px;
	width: 15px;
	height: 15px;
	}
#pan-center span {
	display: none;
	}
#pan-center a {
	display: block;
	width: 15px;
	height: 15px;
	background: url(../images/pan-center.gif) top left no-repeat;
	text-decoration: none;
	}
#pan-center a:hover {
	background: url(../images/pan-center-h.gif) top left no-repeat;
	text-decoration: none;
	}
#pan-e {
	position: absolute;
	display: block;
	left: 30px;
	top: 15px;
	width: 15px;
	height: 15px;
	}
#pan-e span {
	display: none;
	}
#pan-e a {
	display: block;
	width: 15px;
	height: 15px;
	background: url(../images/pan-e.gif) top left no-repeat;
	text-decoration: none;
	}
#pan-e a:hover {
	background: url(../images/pan-e-h.gif) top left no-repeat;
	text-decoration: none;
	}
#pan-sw {
	position: absolute;
	display: block;
	left: 0px;
	top: 30px;
	width: 15px;
	height: 15px;
	}
#pan-sw span {
	display: none;
	}
#pan-sw a {
	display: block;
	width: 15px;
	height: 15px;
	text-decoration: none;
	}
#pan-sw a:hover {
	background: url(../images/pan-sw-h.gif) top left no-repeat;
	text-decoration: none;
	}
#pan-s {
	position: absolute;
	display: block;
	left: 15px;
	top: 30px;
	width: 15px;
	height: 15px;
	}
#pan-s span {
	display: none;
	}
#pan-s a {
	display: block;
	width: 15px;
	height: 15px;
	background: url(../images/pan-s.gif) top left no-repeat;
	text-decoration: none;
	}
#pan-s a:hover {
	background: url(../images/pan-s-h.gif) top left no-repeat;
	text-decoration: none;
	}
#pan-se {
	position: absolute;
	display: block;
	left: 30px;
	top: 30px;
	width: 15px;
	height: 15px;
	}
#pan-se span {
	display: none;
	}
#pan-se a {
	display: block;
	width: 15px;
	height: 15px;
	text-decoration: none;
	}
#pan-se a:hover {
	background: url(../images/pan-se-h.gif) top left no-repeat;
	text-decoration: none;
	}


#zoom { 
	display: block;
	position: absolute;
	top: 60px;
	left: 24px;
	}
#zoom span {
	display: none;
	}
#zoom-in {
	display: block;
	width: 15px;
	height: 15px;
	margin: 1px;
	padding: 0;
	}
#zoom-in a {
	display: block;
	width: 15px;
	height: 15px;
	margin: 0;
	padding: 0;
	background: url(../images/zoom-in.gif) top left no-repeat;
	text-decoration: none;
	}
#zoom-in a:hover {
	background: url(../images/zoom-in-h.gif) top left no-repeat;
	text-decoration: none;
	}
#zoom-out {
	display: block;
	width: 15px;
	height: 15px;
	margin: 1px;
	padding: 0;
	}
#zoom-out a {
	display: block;
	width: 15px;
	height: 15px;
	margin: 0;
	padding: 0;
	background: url(../images/zoom-out.gif) top left no-repeat;
	text-decoration: none;
	}
#zoom-out a:hover {
	background: url(../images/zoom-out-h.gif) top left no-repeat;
	text-decoration: none;
	}
.z {
	display: block;
	margin: 1px;
	width: 15px;
	height: 8px;
	}
.z a {
	display: block;
	margin: 0;
	width: 15px;
	height: 8px;
	background: url(../images/zooms.gif) top left no-repeat;
	text-decoration: none;
	}
.z a:hover {
	background: url(../images/zooms-h.gif) top left no-repeat;
	text-decoration: none;
	}
.za {
	display: block;
	margin: 1px;
	width: 15px;
	height: 8px;
	}
.za a {
	display: block;
	margin: 0;
	width: 15px;
	height: 8px;
	background: url(../images/zooms-h.gif) top left no-repeat;
	text-decoration: none;
	}
.za a:hover {
	background: url(../images/zooms-h.gif) top left no-repeat;
	text-decoration: none;
	}
	
	
	
.dt {
	margin: 10px 0;
	border: 0;
	border-collapse: collapse;
	}
	
.dt th {
	text-align: left;
	vertical-align: bottom;
	padding: 1px 2px;
	font-size: 12px;
	color: #333;
	}
	
.dt td {
	text-align: left;
	vertical-align: top;
	padding: 1px 2px;
	font-size: 11px;
	color: #555;
	}
	
.dt td.metatext {
	padding-top: 2px;
	font-size: 10px;
	line-height: 11px;
	}

.dt td, .dt th {border:0;}

	
	
	
#identify-box {
	position: absolute;
	width: 225px;
	z-index: 3000;
	display: none;
	padding-bottom: 20px;
	text-align: center;
	/* border: 1px solid #c5d393;
	background-color: #ecf8ba;
	background-color: #efc; */
	background: transparent url(../images/bg-idbox2.gif) top left no-repeat;
	}
#identify {
	height: 147px;
	padding: 0 10px;
	margin: 0 5px 28px 5px;
	overflow: hidden;
	}
#identify .dt {
	width: 100%;
	border-collapse: collapse;
	border: 0;
	}
#identify .dt th {
	padding: 2px 4px;
	font-weight: bold;
	font-size: 11px;
	line-height: 12px;
	border: 0;
	}
#identify .dt td {
	padding: 1px 4px;
	font-weight: normal;
	font-size: 11px;
	line-height: 12px;
	border: 0;
	border-bottom: 1px solid #c0c0c0;
	}	


	
#legend .dt {
	border: 0;
	}
#legend .dt {
	border: 0;
	}
#legend .dt tr {
	margin: 0;
	border:0;
	}
#legend .dt th, #legend .dt td {
	margin: 0;
	border:0;
	border-bottom: 0;
	border-right: 0;
	padding: 1px 2px;
	}
#legend .dt td h4 {
	font-size: 12px;
	font-weight: bold;
	color: #000;
	}