@charset "UTF-8";
/* CSS Document */

body {
	
}

#legend { position:absolute; left:0px; top:0px; }

#imageDisplayContainer {

	position:relative;
}

#loader {
	left:350px;
	top:400px;	
}
	
#myMagnifier {
	position:relative;
	width:800px;
	height:660px;	
}

div.componentOutline {
	width:880px;
	height:665px;
	border:thin #000 solid;
	background-image:url(../graphics/background_ui.png);
}

div.mapContainer {
	width:880px;
}

div.title {
	font-family:Arial, Helvetica, sans-serif;
	font-size:24px;
	font-weight:bold;
}

div.subtitle {
	font-family:Arial, Helvetica, sans-serif;
	font-size:18px;
	font-weight:bold;
}

td#header {
	
}

div.headerText {
	font-family:"Times New Roman", Times, serif;;
	font-size:14px;
	padding-top:20px;
	padding-bottom:5px;
}

td#footer {

}

div.footerText {
	font-family:"Times New Roman", Times, serif;;
	font-size:12px;
	color:#999999;
	width:880px;
	padding-top:20px;
}

a.footerLink {
	font-family:"Times New Roman", Times, serif;;
	font-size:12px;
	color:#999999;
}

#bgImage {
	position:relative;
	top:-1px;	
}

#myGridContainer {
	position:absolute;
	top:40px;
	left:40px;
	width:840px;
	height:560px;
	overflow:scroll;
	overflow-x:hidden;	
}

#readoutContainer {
	font-size:12px;
	position:absolute;
	top:610px;
	left:350px;
	width:430px;
	height:40px;
}

#cityName { width:240px; height:20px; color:red; }
#popDensity { width:90px; height:20px; color:red; }

.IMA-Components-Graph-GridController-Cell { 
	width:7px!important;
	height:10px!important;
}

#legend-button { width:57px; height:16px; position:absolute; top:625px; left:770px; background-image:url(../graphics/legend_button-up.png); cursor:pointer; }
#legend-graphic { width:98px; height:159px; position:absolute; top:445px; left:750px; background-image:url(../graphics/legend.png); display:none; }