.pulse, .pulse.animated {
  --pulse-color: rgba(10,66,255,0.5);
  --pulse-size: 25px;
  box-shadow: 0 0 0 0 var(--pulse-color);
  animation: pulse 2.5s infinite ease-in-out !important;
}

/* Pause animation cleanly on hover */

.pulse:hover {
  animation-play-state: paused !important;
  box-shadow: 0px 0px 15px rgba(0,50,125,0.4) !important;
}

@keyframes pulse {
  0% {
    transform: scale(1);
    box-shadow: 0 0 0 0 var(--pulse-color);
  }
  50% {
    transform: scale(1.05);
    box-shadow: 0 0 0 var(--pulse-size) rgba(255, 0, 0, 0);
  }
  100% {
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(255, 0, 0, 0);
  }
}

/* Accessibility: Respect user settings */

@media (prefers-reduced-motion: reduce) {
  .pulse, .pulse.animated {
    animation: none !important;
  }
}