html, body {
	height: 100%;
	padding: 0;
	margin: 0;
	font-family: sans-serif;
	font-size: small;
}

#map {
	width: 100%;
	height: 90%;
	padding: 0;
	margin: 0;
}
.map:-moz-full-screen {
	height: 100%;
}
.map:-webkit-full-screen {
	height: 100%;
}
.map:fullscreen {
	height: 100%;
}
/* position the rotate control lower than usual */
.ol-rotate {
	top: 3em;
}
.ol-rotate {
	top: 2.5em;
	right: 0.5em;
}

#minDist{
	position: absolute;
	background:rgba(255,255,0,0.7);
	color: blue;
	z-index: 10000;
	bottom: 30%;
}
#info{
	position: absolute;
	background:rgba(255,255,0,0.3);
	color: green;
	z-index: 10000;
	bottom: 40%;
}

.olControlButton1ItemActive {
    position: absolute;
    background-image: url('OpenLayers/img/drag-rectangle-off.png');
    top: 2px;
    right: 2px;
    width: 18px;
    height: 18px;
    margin: 1px;
}   

.olControlPanel {
	/* border: 1px solid black; */
	top: 70px;
	left: 8px;
	/* width: 27px; */
	/* height: 27px; */
	position: absolute;
	cursor: pointer;
	background: rgba(255,255,255,0.4);
}
		    
.rotate-north {
	top: 80px;
	left: .5em;
}

.popup-image {
    width: 200px;
    margin: 10px 0px 5px 22px;
}