.logo-size {
  width: 700px;
  height: 500px;
}
@media (max-width: 750px) {
  .logo-size {
    height: 130px;
  }
}

.logo-text {
  animation: moving-text 1.5s ease-out forwards;
}

.layer-1 {
  animation: moving-layer-1 1.2s ease-out forwards;
}

.layer-2 {
  animation: moving-layer-2 1.4s ease-out forwards;
}

.layer-3 {
  animation: moving-layer-3 1.6s ease-out forwards;
}

@keyframes moving-layer-1 {
  0% {
    transform: translate(664px, 200px) scale(2);
  }
  100% {
    transform: translate(664px, 103px) scale(4);
  }
}
@keyframes moving-layer-2 {
  0% {
    transform: translate(664px, 200px) scale(2);
  }
  100% {
    transform: translate(718px, 57px) scale(4);
  }
}
@keyframes moving-layer-3 {
  0% {
    transform: translate(664px, 200px) scale(2);
  }
  100% {
    transform: translate(786px, 0px) scale(4);
  }
}
@keyframes moving-text {
  0% {
    transform: translate(-200px, 347px);
  }
  100% {
    transform: translate(123px, 347px);
  }
}
.earth-background {
  position: absolute;
  opacity: 0.4;
  width: 140%;
  animation: rotate 250s linear infinite;
}

@keyframes rotate {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

/*# sourceMappingURL=animated_logo.css.map */