.bg-sapphire-events {
  background: linear-gradient(
    to bottom,
    #07011a 0%,    /* Deep purple at the top */
    #1c0e42 20%,   /* Slightly lighter purple */
    #2b1050 50%,   /* Darker purple/almost black in the middle */
    #5a4329 100%   /* Brownish tone at the bottom */
  );
}

.stars {
  position: absolute;
  background: transparent;
  animation: animStar linear infinite;
}

.stars-small {
  width: 1px;
  height: 1px;
  box-shadow: 0 0 #fff; /* A base shadow to be replaced by JS */
  animation-duration: 200s;
}

.stars-medium {
  width: 2px;
  height: 2px;
  box-shadow: 0 0 #fff;
  animation-duration: 400s;
}

.stars-big {
  width: 3px;
  height: 3px;
  box-shadow: 0 0 #fff;
  animation-duration: 800s;
}

/* .stars, .stars:after {
  animation-name: animStar, twinkle;
  animation-duration: inherit, 2s;
  animation-timing-function: linear, ease-in-out;
  animation-delay: inherit;
  animation-iteration-count: infinite, infinite;
} */

@keyframes animStar {
  from {
    transform: translateY(-4000px);
  }
  to {
    transform: translateY(2000px);
  }
}

/* @keyframes twinkle {
  0%, 100% { opacity: 0.5; }
  50% { opacity: 1; }
  75% { opacity: 0.7; }
  25% { opacity: 0.2; }
} */