.marker-cluster {
  background-color: var(--color-primario);
  background-clip: padding-box;
  border-radius: 20px;
}

.marker-cluster div {
  background-color: #f7f7f7;
  color: var(--color-primario);

  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;
  color: inherit;
}

.map_marker {
  color: var(--color-primario);
}

/* estilos mapa */
.popup-active {
  --color-popup: var(--color-primario)
}

.popup-all {
  --color-popup: var(--color-secundario)
}

.leaflet-popup-content-wrapper {
  border: 1px solid var(--color-popup);
}

.leaflet-popup-tip {
  border-radius: 5px;
  background:var(--color-popup);/* linear-gradient(-45deg, var(--color-popup) 0% 20%, #fff 48%); */
}

.leaflet-popup-content {
  margin: 5px
}

.card_map {
  max-width: 220px;
  position: relative;
}

.card_map a {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
}

.card_map_img,
.card_map_img img {
  width: 100%;
  border-radius: 5px;
  overflow: hidden;
}

.card_map_body {
  margin: 5px;
}