* {
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  margin: 0;
  padding: 0;
}

body {
  margin: 0;
  padding: 0;
  background-image: url("./backgroundLight.svg");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}

#root {
  display: flex;
  align-items: stretch;
  height: 100vh;
}

@keyframes welcomeFadeIn {
  0% {
    opacity: 0;
    transform: translateY(20px) scale(0.6);
  }
  100% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes bounce {
  0%, 80%, 100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-8px);
  }
}

#loading-vantage-message-container {
  display: flex;
  flex: 1;
  /*background-image: url("./backgroundLight.svg");*/
  /*background-size: cover;*/
  /*background-repeat: no-repeat;*/
  /*background-position: center;*/

  & > #loading-vantage-message {
    background-color: rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(11px);
    -webkit-backdrop-filter: blur(11px);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    align-content: center;
    flex: 1;
    color: rgb(48, 58, 56);

    & > #loading-vantage-message-title {
      font-size: 40px;
      animation: welcomeFadeIn 1s ease-in-out;
      font-weight: 600;

      & > span {
        display: inline-block;
        animation: bounce 1s infinite;
        background-color: rgb(48, 58, 56);
        width: 8px;
        height: 8px;
        border-radius: 50%;
        margin-inline: 3px;

        &:nth-child(1) {
          animation-delay: 0.1s;
        }

        &:nth-child(2) {
          animation-delay: 0.2s;
        }

        &:nth-child(3) {
          animation-delay: 0.3s;
        }
      }
    }
  }
}