i.icon-eduspot {
	background-image: url("../img/icon-eduspot.png");
	background-position: 0px 0px;
	width: 20px;
}

#map {
	height: 500px;
}

ul#idps {
	height: 350px;
	overflow-y: auto;
}

a.discoidp, a.defaultidp {
	font-weight: bold;
}

/* responsive, source : http://twitter.github.com/bootstrap/scaffolding.html#responsive */

/* Large desktop */
@media (min-width: 1200px) {
	#map { height: 560px; }
	ul#idps {
		height: 350px;
		overflow-y: auto;
	}
}
 
/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) {
	#map { height: 500px; }
	ul#idps {
		height: 290px;
		overflow-y: auto;
	}
}
 
/* Landscape phone to portrait tablet */
@media (max-width: 767px) {
	#map { height: 450px; }
	ul#idps {
		height: 240px;
		overflow-y: auto;
	}
}
 
/* Landscape phones and down */
@media (max-width: 480px) {
	#map { height: 300px; }
	ul#idps {
		height: 200px;
		overflow-y: auto;
	}
}

/* leaflet control fit */

.leaflet-container .leaflet-control-fit {
        margin-left: 13px;
        margin-top: 12px;
        }
.leaflet-control-fit a {
        width: 22px;
        height: 22px;
        text-align: center;
        text-decoration: none;
        color: black;
        background-position: 50% 50%;
        background-repeat: no-repeat;
        display: block;
        }
.leaflet-control-fit a:hover {
        background-color: #fff;
	color: #777;
        }
.leaflet-control-fit-metro {
	padding-top: 3px;
        }
.leaflet-control-fit-world {
	padding-top: 3px;
        }

.leaflet-touch .leaflet-control-fit a {
        width: 30px;
        height: 30px;
        }

/* leaflet MarkerCluster */

.marker-cluster {
	background-clip: padding-box;
	border-radius: 7px;
	}
.marker-cluster div {
	width: 30px;
	height: 30px;
	margin-left: 5px;
	margin-top: 5px;

	text-align: center;
	border-radius: 7px;
	/* font: 12px "Helvetica Neue", Arial, Helvetica, sans-serif; */
	font-weight: bold;
	}
.marker-cluster span {
	line-height: 30px;
	}

.marker-cluster-one { }
.marker-cluster-one div { background-color: rgba(0, 204, 255, 0.6); 
	width: 25px;
	height: 25px;
}

.marker-cluster-small { background-color: rgba(0, 204, 255, 0.6); }
.marker-cluster-small div { background-color: rgba(0, 170, 221, 0.6); }

.marker-cluster-medium { background-color: rgba(0, 170, 221, 0.6); }
.marker-cluster-medium div { background-color: rgba(0, 136, 204, 0.6); }

.marker-cluster-large { background-color: rgba(0, 136, 204, 0.6); }
.marker-cluster-large div { background-color: rgba(0, 102, 170, 0.6); }

