body { margin: 0; font-family: Arial, sans-serif; }
#map { height: 100vh; width: 100%; }
#controls {
   padding: 10px; border-radius: 5px;
}
select { margin: 5px; padding: 5px; }
.pulse-marker {
  position: absolute;
  transform: translate(-50%, -50%);
}
.controls select {
    width: 100%;
    border: 1px solid #ddd;
    border-radius: 5px;
    text-align: center;
    font-size: 14px;
}
.controls {
    box-shadow: inset 0 0 20px 5px #ddd;
    max-width: 100%;
    position: relative;
    padding-right: 10px;
    margin: 6px 0px;
    border-radius: 5px;
}
.pulse-marker::before,
.pulse-marker::after {
  content: "";
  position: absolute;
  width: 20px;
  height: 20px;
  border: 0.1px solid red;
  border-radius: 50%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  animation: pulse 2s infinite ease-out;
}

.pulse-marker::after {
  animation-delay: 1s;
}

@keyframes pulse {
  0% {
    transform: translate(-50%, -50%) scale(0.5);
    opacity: 1;
  }
  100% {
    transform: translate(-50%, -50%) scale(2.5);
    opacity: 0;
  }
}

.ring-marker {
    pointer-events: auto; /* Enable click events */
    cursor: pointer;
}

@keyframes expandRing {
    0% {
        transform: scale(1);
        opacity: 0.9;
    }
    100% {
        transform: scale(2);
        opacity: 0;
    }
}

.btn svg {
    vertical-align: text-top;
    margin-right: 5px;
}
.table>tbody {
    font-size: 14px;
}