/* Pirate Seas scene animations */

/* Waves slide sideways by one wavelength (100px) per loop, so they repeat seamlessly. */
.pi-wave-back {
  animation: pi-wave 9s linear infinite;
}

.pi-wave-front {
  animation: pi-wave 6s linear infinite reverse;
}

.pi-wave-near {
  animation: pi-wave 4s linear infinite;
}

@keyframes pi-wave {
  from { transform: translateX(0); }
  to { transform: translateX(-100px); }
}

.pi-ship {
  transform-box: fill-box;
  transform-origin: 50% 100%;
  animation: pi-rock 4s ease-in-out infinite alternate;
}

@keyframes pi-rock {
  from { transform: rotate(-3deg) translateY(2px); }
  to { transform: rotate(3deg) translateY(-3px); }
}