#loading-screen {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  overflow: hidden;

  &.done {
    animation: preloaderFade 2s;
    opacity: 0;
  }

  .scene {
    position: absolute;
    transform: scale(calc(100vmax / 2048px));
    left: 50%;
    top: 54%;

    @media @portrait {
      top: 50%;
    }

    .ship-top {
      position: absolute;
      transform: translate(-1024px, -1024px);
    }

    .ship-sail {
      position: absolute;
      transform: translate(-314px, -800px);
    }

    .ship-middle {
      position: absolute;
      transform: translate(-1024px, -1024px);
    }

    .new-logo {
      position: absolute;
      transform: translate(-348px, -420px) scale(0.4);

      &.dd {
        transform: translate(-348px, -460px) scale(0.4);
      }
    }
  }
}

@keyframes preloaderFade {
  0% { opacity: 1; }
  100% { opacity: 0; }
}