/* Always set the map height explicitly to define the size of the div
* element that contains the map. */
#map {
height: 100%;
}
/* Optional: Makes the sample page fill the window. */
html, body {
height: 100%;
margin: 0;
padding: 0;
}



#legend{
	position:absolute;
	font: 12pt sans-serif;
	z-index: 50;
	padding: 10px;
	padding-top: 60px;
}

#maptitle{
	z-index: 100;
}

.legtext{
	display: inline;
	position: absolute;
	margin-left: 10px;
	height: 62px;
	line-height: 62px;

}

#village, #semoir, #cluster{
	position: absolute;
	top: 0; 
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
}

.legimg{
	display: inline-block;
	width: 54px;
	height: 53px;
	text-align: center;
	position: relative;
}

.mapinfo{
	position: absolute;
	width: 360px;
	font: 18pt sans-serif;
	padding: 10px;
	margin: 10px;
	border: 1pt solid white;
	border-radius: 3px;
	background-color: white;
	box-shadow: 2px 2px 2px #ddd, -2px -2px 2px #ddd;
}

.quote{
	max-width: 400px;
}

.villageName{
	font-weight: bold;
}