:root {
  --orange-color: #f5b554; /* Main accent / CTA button color */
  --purple-color: #4c1466; /* Text color */
  --pink-color: #ffedde; /* Page background */
  --text-color: black;
  --bg-color: white;
  --text-grey: #4e4e4e;
}

/* Global font */
body,
html {
  font-family: "Futura", Arial, Helvetica, sans-serif;
  margin: 0;
  background-image: url("/assets/images/banner_bg4.png");
  scroll-behavior: smooth;
}

#scroll-png {
  position: sticky;
  top: 200px;
  left: 95px; /* starting on left */
  width: 100px;
  z-index: 10;
  transition: opacity 0.3s;

  /* oscillating rotation */
  animation: sway 3s ease-in-out infinite;
  transform-origin: center center;
}

@media (max-width: 1200px) {
  body,
  html {
    background-image: none;
  }

  #scroll-png {
    display: none;
  }
}

@keyframes sway {
  0% {
    transform: rotate(-20deg);
  }
  50% {
    transform: rotate(20deg);
  }
  100% {
    transform: rotate(-20deg);
  }
}