.map,
.map-v {
  height: 400px;
  width: 100%;
  margin: 15px 0;
}

.g1,.g2,.g3,.g4,.g5,.g6,.g7,.g8,.g9,.g10,.gm,
.v1,.v2,.v3,.v4,.v5,.v6,.v7,.v8 {
	width: 20px;
	height: 20px;
	border-radius: 50%;	
	position: absolute;
	transform: rotate(-45deg);
	left: 50%;
	top: 50%;
}

.g1:after,
.g2:after,
.g3:after,
.g4:after,
.g5:after,
.g6:after,
.g7:after,
.g8:after,
.v1:after,
.v2:after,
.v3:after,
.v4:after,
.v5:after,
.v6:after,
.v7:after,
.v8:after  {
	content:'';
	width:4px; 
	height:4px; 
	margin:8px 0 0 8px; 
	background:#fff; 
	position:absolute; 
	border-radius:50%; 
}

.g1,.c1:before { background: rgba(43, 67, 140, 0.7); }
.g2,.c2:before { background: rgba(242, 188, 29, 0.7); }
.g3,.c3:before { background: rgba(242, 41, 41, 0.7); }
.g4,.c4:before { background: rgba(232, 142, 217, 0.7); }
.g5,.c5:before { background: rgba(107, 132, 0, 0.7); }
.g6,.c6:before { background: rgba(107, 116, 166, 0.7); }
.g7,.c7:before { background: rgba(37, 80, 76, 0.7); }
.g8,.c8:before { background: rgba(247, 234, 223, 0.7); }
.g9,.c9:before { background: rgba(173, 223, 167, 0.7); }
.g10,.c10:before { background: rgba(196, 106, 31, 0.7); }

.v1,.vl1:before { background: rgba(17,181,106, 1); }
.v2,.vl2:before { background: rgba(107,238,131, 1); }
.v3,.vl3:before { background: rgba(231,240,115, 1); }
.v4,.vl4:before { background: rgba(228,121,119, 1); }
.v5,.vl5:before { background: rgba(231,10,23, 1); }
.v6,.vl6:before { background: rgba(174,10,23, 1); }
.v7,.vl7:before { background: rgba(139,148,161, 1); }

.gm,
.cm:before,
.cm-beta:before {
	/*background-image: url(/sites/default/files/design/colors4.png);*/
	background-image: url("data:image/svg+xml;utf8,<svg width='280' height='280' viewBox='-140 -140 280 280' xmlns='http://www.w3.org/2000/svg'><circle r='140' fill='none'/><path d='M0,0 L0,-140 A140,140 0 0,1 70,-121.2 Z' fill='%2396D040'/><path d='M0,0 L70,-121.2 A140,140 0 0,1 121.2,-70 Z' fill='%2351B334'/><path d='M0,0 L121.2,-70 A140,140 0 0,1 140,0 Z' fill='%233F8F68'/><path d='M0,0 L140,0 A140,140 0 0,1 121.2,70 Z' fill='%233C6DAE'/><path d='M0,0 L121.2,70 A140,140 0 0,1 70,121.2 Z' fill='%23A94EAB'/><path d='M0,0 L70,121.2 A140,140 0 0,1 0,140 Z' fill='%23DA4FA3'/><path d='M0,0 L0,140 A140,140 0 0,1 -70,121.2 Z' fill='%23EB4CA8'/><path d='M0,0 L-70,121.2 A140,140 0 0,1 -121.2,70 Z' fill='%23EC632B'/><path d='M0,0 L-121.2,70 A140,140 0 0,1 -140,0 Z' fill='%23EF8933'/><path d='M0,0 L-140,0 A140,140 0 0,1 -121.2,-70 Z' fill='%23F3B13D'/><path d='M0,0 L-121.2,-70 A140,140 0 0,1 -70,-121.2 Z' fill='%23F7CF46'/><path d='M0,0 L-70,-121.2 A140,140 0 0,1 0,-140 Z' fill='%23EEE74C'/></svg>");
	background-repeat: no-repeat;
	background-position: center center;
}

.map-legend { margin-bottom: 20px; }
.map-legend:after {
	clear: both;
	content: '';
	display: block;
}

.legend-item {
	line-height: 20px; 
	margin-bottom: 10px;
	min-width: 50%;
	float: left;
	font-size: 12px;
}

.legend-item:before {
	width: 20px; 
	height: 20px; 
	line-height: 24px; 
	display: inline-block;
	margin-right: 5px;
	float: left;
	content: '';
	border-radius: 50%;
}

.leaflet-popup-content h3 { margin-top: 0 !important; }

.leaflet-popup-content p { 
	margin: 5px 0; 
	display: block; 
	line-height: 20px;
	min-width: 170px;
	clear: both;
}
.leaflet-popup-content p:before {
	width: 20px; 
	height: 20px; 
	line-height: 20px; 
	display: inline-block;
	margin-right: 5px;
	float: left;
	content: '';
	border-radius: 50%;
}

.v-dsc div { 
	font-weight: bold;
    border-bottom: solid 1px #ccc;
    margin-bottom: 5px;
    padding-bottom: 5px;
}
.v-dsc div:last-child {
	border-bottom: solid 0px #ccc;
}
.v-dsc div span { font-weight: normal; font-style: italic; }