/*-- variables --*/


body {
  background-image: url("assets/bg.webp");
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  height: 100dvh;
  width: 100dvw;
  padding: 2em;
}

/*-- moving clouds --*/

.marquee {
  z-index: 0;
  position: fixed;
  opacity: 0.8;
  display: flex;
  animation: marquee 150s linear infinite running;
}

.marquee .clouds {
  width: 100vW;
}

.marquee .clouds img {
  max-width: initial;
}

@keyframes marquee {
  0% {
    transform: translateX(0);
  }

  100% {
    transform: translateX(-50%);
  }
}