@media (min-width: 761px) and (prefers-reduced-motion: no-preference) {
  .va-the-island-page .va-the-island-timeline.is-va-timeline-animated::before {
    transform: translateX(-.5px) scaleY(var(--va-timeline-progress, 0));
    transform-origin: 50% 0;
    will-change: transform;
  }

  .va-the-island-page .va-the-island-timeline.is-va-timeline-animated .va-the-island-history-row::after {
    opacity: .35;
    transform: translate(-50%, -50%) scale(.58);
  }

  .va-the-island-page .va-the-island-timeline.is-va-timeline-animated .va-the-island-history-row.is-va-timeline-active::after {
    opacity: 1;
    animation: va-history-timeline-dot-pop .5s cubic-bezier(.2, .8, .3, 1.35) both;
  }
}

@keyframes va-history-timeline-dot-pop {
  0% {
    transform: translate(-50%, -50%) scale(.58);
    box-shadow: 0 0 0 5px rgba(255, 255, 255, .75);
  }
  58% {
    transform: translate(-50%, -50%) scale(1.28);
    box-shadow: 0 0 0 10px rgba(35, 167, 250, .16);
  }
  100% {
    transform: translate(-50%, -50%) scale(1);
    box-shadow: 0 0 0 5px rgba(255, 255, 255, .75);
  }
}