/* main page elements for the baltimoresun.com baltimore homicide map
**************************************************************************************************/

body
{
	color: #333;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	margin: 0;
	text-align: center;
}

#header2
{
	margin: 20px auto 0 auto;
	padding: 0 5px 0 0;
	text-align: left;
	width: 778px;
}

#wrapper
{
	border: 1px #003366 solid;
	margin: 0 auto 10px auto;
	padding: 9px;
	text-align: left;
	width: 752px;
}

#error-message
{
	background: #f0f5b8;
	border: 1px #ccc solid;
	clear: both;
	margin-bottom: 10px;
	padding: 10px;
}






/* headings, paragraphs, legend/key, lists, and links
**************************************************************************************************/

dd, dl, dt, h1, h2, li, ol, p, ul { margin-top: 0; }

em, i { font-style: italic; }

strong, b { font-weight: bold; }

h1
{
	background: #fff;
	color: #003D58;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 17px;
	font-weight: bold;
	margin-bottom: 0px;
	margin: 0;
	padding: 0 0 4px 6px;
}

h1#credits
{
	border: 0px #ccc solid;
	height: 30px;
}

h1 img
{
	float: left;
	padding-left: 0px;
}

h1 #page-title
{
	float: right;
	padding: 6px 0px 6px 0;
}

h2
{
	font-size: 13px;
	font-weight: bold;
	margin-bottom: 5px;
}

p
{
	font-size: 9pt;
	line-height: 150%;
	margin-bottom: 10px;
}

p#help
{
	clear: both;
	padding: 0 65px 10px 65px;
}

#error-message p
{
	font-weight: bold;
	margin: 0;
}

p#modified-on
{
	font-size: 8pt;
	margin-bottom: 0;
	padding: 5px 0;
	text-align: center;
}

p#made-by
{
	text-align: center;
}

#legend ul li
{
	font-size: 8pt;
}


dl#key
{
	background: #f8f8f8;
	font-family: arial, helvetica, sans-serif;
	font-size: 10px;
	border: 1px #ccc solid;
	margin-top: 5px;
	padding: 10px 5px;
}

dl#key dt { display: inline; font-size: 11px; font-weight: bold; }
dl#key dd { display: inline; margin-left: 11px; }

dl#key img { display: inline; }

#data-date { clear: both; }



a
{
	color: #003366;
	text-decoration: underline;
}

a:hover
{
	color: #660000;
	text-decoration: underline;
}





/* dropdown text labels and form elements
**************************************************************************************************/

form#controller
{
	clear: both;
	margin-bottom: 10px;
}

form#controller fieldset div label,
form#controller fieldset div input, 
form#controller fieldset div select, 
form#controller fieldset div option
{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
}

form#controller fieldset div.dropdown
{
	float: left;
	margin-right: 5px;
}


form#controller fieldset div.dropdown label, form#controller fieldset div#go label
{
	color: #666;
	line-height: 200%;
}

form#controller fieldset div#go label { font-weight: bold; }


form#controller fieldset div.dropdown select { display: block; text-transform: capitalize; }

form#controller fieldset div.dropdown select#range { text-transform: none; }

form#controller fieldset div#go { float: left; }

form#controller fieldset div#go input { display: block; }






/* gmap and popup bubbles
**************************************************************************************************/

#map
{
	border: 1px #ccc solid;
	clear: both;
	height: 500px;
	margin: 0;
	width: 738px;
}

div#popup {
	background: #fff;
	width: 270px;
}

div#popup dl
{
	font-size: 9pt;
}

div#popup dl dt
{
	font-weight: bold;
	font-size: 10pt;
}

div#popup dl dd
{
	color: #999;
	line-height: 125%;
}

div#popup dl dd em
{
	color: #333;
	font-style: normal;
}




/* styles for bar graph
**************************************************************************************************/

div#bar-graph { margin-bottom: 10px; }

#bar-graph ul
{
	background: #fff url(images/graph-bg3.gif) bottom repeat-x;
	border: 1px #ccc solid;
	clear: both;
	color: #fff;
	font-size: 11px;
	padding: 0 0 40px 40px !important; padding: 0 0 40px 37px;
	vertical-align: text-bottom;
}

#bar-graph ul li
{
	/* bar gradient colors: #003d58 to #1e566e */
	background: #1e566e url(images/bar-bg.gif) bottom repeat-x;
	cursor: help;
	float: left;
	margin: 0 8px 0 0;
	text-align: center;
	vertical-align: text-bottom;
	width: 20px;
}

#bar-graph ul li span.month { display: none; }
#bar-graph ul li span.number { display: none; }





/* map-switching tab styles
**************************************************************************************************/

ul#tabs li
{
	display: inline;
	font-size: 13px;
	font-weight: bold;
}

ul#tabs li a
{
	background: url(images/tab-bg-off.gif) repeat-x;
	border-color: #ccc;
	border-style: solid;
	border-width: 1px;
	color: #666;
	padding: 5px 10px;
	text-decoration: none;
}

ul#tabs li#active a
{
	background: url(images/tab-bg-on.gif) repeat-x;
	color: #fff;
}

ul#tabs li a:hover
{
	background: #827a00;
	color: #fff;
}

ul#tabs li a#first
{
	border-width: 1px 0 1px 1px;
}

#tab-box
{
	border: 1px #ccc solid;
	margin: 5px 0 25px 0;
	padding: 5px;
}






/* admin styles
**************************************************************************************************/

div.admin h2
{
	font-size: 22px;
	padding-top: 10px;
}

div.admin h3
{
	font-size: 15px;
	font-weight: bold;
}

div.admin #geo-box
{
	color: #666;
	font-size: 11px;
}