body {
      background-color: #FAFAFA;
      height: 100vh;
      width: 100vw;
      margin: 0px;
    }


.firebase-emulator-warning {
      background-color: transparent !important;
      border: none !important;
      color: rgba(245, 66, 66, 0.3) !important;
    }

    .main-content {
      height: 100%;
      width: 100%;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: opacity .2s ease-out;
    }

    /* ===== Loader CSS 👇 =====*/
    .splash-img {
      width: 26rem;
      height: 23rem;
      position: absolute;
      opacity: 0;
      pointer-events: none;
    }
    .splash-img:nth-child(1){
          animation: fadeAnimation 1s forwards;
          animation-delay: 0s;
        }
    .splash-img:nth-child(2){
      animation: fadeAnimation 1s forwards;
      animation-delay: 0s;
    }
    .splash-img:nth-child(3){
      animation: fadeAnimation 1s forwards;
      animation-delay: 2s;
    }
    .splash-img:nth-child(4){
      animation: fadeAnimation 1s forwards;
      animation-delay: 4s;
    }
    .splash-img:nth-child(5){
      animation: fadeAnimation 1s forwards;
      animation-delay: 6s;
    }
    .splash-img:nth-child(6){
      animation: fadeAnimation 1s forwards;
      animation-delay: 8s;
    }

    .logo {
      top: -200px;
      position: relative;
      opacity: 0;
      animation: fadeAnimation 2s forwards;
      pointer-events: none;
    }

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