body {margin: 0;}

#mapid {
	width: 99%; 
	max-width: 736px; 
	height: 600px; 
	border: 1px solid #ccc;
}

#progress {
    display: none;
    position: absolute;
    z-index: 1000;
    left: 400px;
    top: 300px;
    width: 200px;
    height: 20px;
    margin-top: -20px;
    margin-left: -100px;
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.7);
    border-radius: 4px;
    padding: 2px;
}

#progress-bar {
    width: 0;
    height: 100%;
    background-color: #76A6FC;
    border-radius: 4px;
}

.legend { padding: 6px 8px; font: 14px/16px Arial, Helvetica, sans-serif; background: white; background: rgba(255,255,255,0.8); border-radius: 4px; border: 2px solid black; border-color: rgba(0,0,0,0.2);}
.legend img.icon {width:16px; vertical-align: middle;}

.marker-cluster-small {
	background-color: rgba(255,165,0,.4);
	}
.marker-cluster-small div {
	background-color: rgba(255,165,0,.6);
	}
.marker-cluster-medium {
	background-color: rgba(255,165,0,.4);
	}
.marker-cluster-medium div {
	background-color: rgba(255,165,0,.6);
	}

.marker-cluster-large {
	background-color: rgba(255,165,0,.4);
	}
.marker-cluster-large div {
	background-color: rgba(255,165,0,.6);
	}

	/* IE 6-8 fallback colors */
.leaflet-oldie .marker-cluster-small {
	background-color: rgb(255,165,0);
	}
.leaflet-oldie .marker-cluster-small div {
	background-color: rgb(255,165,0);
	}

.leaflet-oldie .marker-cluster-medium {
	background-color: rgb(255,165,0);
	}
.leaflet-oldie .marker-cluster-medium div {
	background-color: rgb(255,165,0);
	}

.leaflet-oldie .marker-cluster-large {
	background-color: rgb(255,165,0);
	}
.leaflet-oldie .marker-cluster-large div {
	background-color: rgb(255,165,0);
}

.leaflet-popup-content h3 {margin: 6px 0;}
.leaflet-popup-content p {margin: 2px 0 3px;}
.marker-cluster {
	background-clip: padding-box;
	border-radius: 20px;
	}
.marker-cluster div {
	width: 30px;
	height: 30px;
	margin-left: 5px;
	margin-top: 5px;

	text-align: center;
	border-radius: 15px;
	/*font: 12px "Helvetica Neue", Arial, Helvetica, sans-serif;*/
	}
.marker-cluster span {
	line-height: 30px;
	}
	
.leaflet-div-icon {
	background: transparent;
	border: none;
}

.leaflet-marker-icon.leaflet-numbered-icon img {width: 16px; }
.leaflet-marker-icon.leaflet-numbered-icon .number{
	position: relative;
	top: -22px;
	font-size: 12px;
	width: 16px;
	text-align: center;
	color: orange;
	font-weight: bold;
}

span.number {float:left; padding-top: 2px;}