body {
    margin: 0;
  }

  html {
    overflow-x: hidden;
    overflow-y: scroll;
  }

  #loading-bg {
    position: absolute;
    display: block;
    background: var(--initial-loader-bg, #fff);
    block-size: 50px;
    inline-size: 100%;
  }

  .loading-logo {
    position: absolute;
    inset-block-start: calc(50%);
    inset-inline-start: calc(50%);
    transform: translate(-50%, -50%);
    /* transform: translateY(-100%); */
  }

  .loading {
    position: absolute;
    block-size: 4px;
    inline-size: 80%;
    inset-block-start: 50%;
    inset-inline-start: 10%;
    background-color: var(--initial-loader-bg, #eee);
    overflow: hidden;
  }

  .loading .bar {
    position: absolute;
    block-size: 100%;
    inline-size: 100%;
    background-color: #00aa00;
    animation: loading-animation 1s infinite;
  }

  #loading-gif{
    max-width: 300px;
    max-height: 300px;
  }

  @keyframes loading-animation {
    0% {
      transform: translateX(-100%);
    }

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