/**
* User Marker
**/

.user-marker-container {
  z-index: 0;

}

.user-marker-circle {
  height: 16px;
  width: 16px;
  border-radius: 100%;
  background: rgba(255, 167, 0, 0.8);
  border: 2px solid rgba(255, 167, 0, 0.85);
  position: relative;
}

.user-marker-ripple {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  z-index: -1;
  background: #b37d16;
  border-radius: 100%;
  animation: ripple 2s linear infinite;
}

@keyframes ripple {
  from {
    opacity: 0.4;
  }
  to {
    transform: scale(3);
    opacity: 0;
  }
}
