.loading { text-align: center; color: #000; width: 235px; height: 20px; margin: auto; height: 20px; position: absolute; left: 0; top: 0; bottom: 0; right: 0; text-transform: uppercase; }
	.loading img { float: left; }
.clear { clear: both; }
.markerHolder { position: relative; }
.marker { width: 37px; height: 37px; background: url(../images/crosshairs@2x.png) no-repeat 0 0; background-size: 37px 74px; position: absolute; left: 0; top: 0; cursor: pointer; }
	.marker:hover, .active_marker { background-position: 0 100%; }

.detailsReveal { background: #499922 url(../images/popup_bottom.png) no-repeat 50% 100%; background-size: 188px 26px; padding: 10px; color: #FFF; position: absolute; top: 0; left: 0; width: 220px; /*height:90px;*/ z-index: 9999; opacity: .95; display: none; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -webkit-box-shadow: 0px 0px 13px 5px rgba(0,0,0,0.35); -moz-box-shadow: 0px 0px 13px 5px rgba(0,0,0,0.35); box-shadow: 0px 0px 13px 5px rgba(0,0,0,0.35); }

	.detailsReveal h1 { font-weight: bold; color: #fff; text-align: center; font-size: 14px; border-top: 2px solid #fff; padding: 5px 0 12px; }
	.detailsReveal.revealRight { right: 0; left: auto; }

@media only screen and (min-width: 40em) and (max-width: 50em) {
	.detailsReveal { width: 186px; padding: 10px; }
		.detailsReveal h1 { font-size: 14px; }
}

@media only screen and (min-width: 50.01em) and (max-width: 75em) {
	.detailsReveal { width: 225px; padding: 10px; }
		.detailsReveal h1 { font-size: 17px; }
}

@media only screen and (min-width: 75.01em) and (max-width: 90em) {

	.detailsReveal { width: 250px; /*height:90px;*/ padding: 10px 16px; }
		.detailsReveal h1 { font-size: 20px; }
}