@charset "utf-8";
/* CSS Document */

body {
	padding:1%;	
}

#container {
	padding:1.1111%;
	min-width:900px;
	max-width:1000px;	
}


#map-title {
	border-bottom:1px solid #ccc;
	margin:8px;
	margin-bottom:12px;
	padding-bottom:12px;
}

#map-title h1 {
	font:24px "Trebuchet MS", Arial, Helvetica, sans-serif;
	color:#333;
	margin:0px; padding:0px;
	padding:0px 8px;

}

#map-description p {
	font:13px "Trebuchet MS", Arial, Helvetica, sans-serif;	
	color:#333;
	line-height:20px;
	margin-top:0px; padding-top:0px;
	padding:0px 12px;
}

#map-description a {
	color:#5298b7;	
}

#map_canvas {
	border:1px solid #ccc;
	width:100%; height:80%;
	float:left;	
}

#content_window {
	border:1px solid #ccc;
	float:right;
	overflow:auto;
	width:24%; height:75%;
	float:right;
}

#content_window table {
	font-family:12px "Trebuchet MS", Arial, Helvetica, sans-serif;
	padding:4px !important;
	color:#555;	
}

#content_window table a {
	color:#5298b7;	
}

#content_window td {
	padding:4px;	
}

span.tia-id {
	color:#fff;
	font-weight:bold;
	font-size:14px;	
}

span.proj-head {
	font:18px "Trebuchet MS", Arial, Helvetica, sans-serif;
}

#content_table tr {
	background-color:#fff !important;	
}

input {
	border:1px solid #ccc !important;	
}

input.button {
	cursor:pointer;
	-moz-border-radius: 5px;
	border-radius: 5px;
	background-color:#5298b1;
	color:#fff;
	border:none !important;
	padding:3px;
	font:12px "Trebuchet MS", Arial, Helvetica, sans-serif;
}

#map-form {
	margin-bottom:20px;
}

#search-address {
	display:block;
	float:left;
	margin-right:20px;	
}


#address {
	width:175px;
	padding:3px;
	margin-bottom:4px;
	font:12px "Trebuchet MS", Arial, Helvetica, sans-serif;
	color:#333;	
}

#map-form, #map-form select {
	font:12px "Trebuchet MS", Arial, Helvetica, sans-serif;
	color:#333;	
}

#legend {
	font:12px "Trebuchet MS", Arial, Helvetica, sans-serif;
	color:#333;	
	margin-bottom:20px;
	width:700px;
	margin-left:auto;
	margin-right:auto;
	margin-top:4px;
}

#legend-space  {
	margin-top:6px;
	float:center;
}

span.legend-desc {
	float:left;
	font-weight:bold;
	display:block;
	margin-top:20px;	
}

#legend ul {
	list-style-type:none;	
	
}

#legend li {
	float:left;
	margin-left:10px;
	padding:15px 4px 2px 40px;
	margin-top:5px;
	background-repeat:no-repeat;
	background-position:0px 9px;
	display:block;
	height:40px;	
}

li.basicneeds {
	background-image:url(images/basicneeds.png);
		
}

li.education {
	background-image:url(images/education.png);
			
}

li.health {
	background-image:url(images/health.png);
		
}

li.homelessness {
	background-image:url(images/homelessness.png);
	
}

li.income {
	background-image:url(images/income.png);
			
}


#legend img {
}

#footer {
	float:left;
	width:100%;
	border-top:1px solid #ccc;	
}

#footer p {
	font:11px "Trebuchet MS", Arial, Helvetica, sans-serif;
	color:#666;
	text-align:center;
}

#footer p a {
	color:#5298b1;	
}


@media (max-width: 480px) {
	
	body {
		padding:10px;
		height:400px;	
	}
	
	#search-address {
		float:none;	
		margin-right:0px;
	}
	
	#address {
		width:125px;	
	}

	#map_canvas {
		width:100%;
		float:none;
	}
	
	#content_window {
		width:100%;
		float:none;
		margin-top:10px;
		overflow:visible;
		height:auto;
	}
	
	
	.search-label {
		display:block;
	}
	
	.filter {
		font-weight:bold;	
	}
	
	span.legend-desc  {
		float:none;
	}
	
	#legend li {
		float:none;
		margin-left:0px;	
	}
	
	#legend ul {
		margin-left:0px; padding-left:0px;	
	}
}