.main-container-splash-screen {
  position:absolute; left:50%; top:50%; transform: translate(-50%, -50%)
}

.animation-container {
  width: 200px;
  height: 300px;
  position: relative;
  left: calc(50% - 90px);
}

.container-splash-screen {
  position: relative;
  top: 30px;
  height: 300px;
  transform: scale(0.4) translateX(0) scaleY(0.7);
}

.y-axis-container {
  animation: bounce 2.6s infinite ease-in-out;
}

.coin {
  position: absolute;
  height: 304px;
  left: 0;
  width: 170px;
  background: gold;
  border-radius: 100%;
  overflow: hidden;
}

.side-coin {
  position: absolute;
  left: 85px;
  height: 300px;
  width: 35px;
  background: #f5b642;
}

.side {
  position: absolute;
  background: #f5b642;
  left: 22px;
  width: 165px;
  height: 304px;
  top: -2px;
}

.shine {
  width: 400px;
  height: 20px;
  background: rgba(255, 255, 255, 0.65);
  transform: rotate(25deg);
  animation: shine 5s infinite;
}

.flash {
  z-index: 200;
  position: absolute;
  width: 15px;
  height: 15px;
  background: white;
  top: 30px;
  right: 20px;
  animation: flash 7s infinite;
}

.dai {
  position: absolute;
  width: 100px;
  height: 100px;
  background: #faf20a;
  border: 1px solid white;
  transform: rotate(53deg) skew(26deg);
  top: 94px;
  left: 35px;
  overflow: hidden;
}

.cutout {
  z-index: 20;
  width: 150%;
  height: 150%;
  background: #ffee38;
  transform: rotate(45deg);
  position: absolute;
  top: 29px;
  left: 29px;
}

.dai-shadow {
  z-index: 20;
  width: 150%;
  height: 150%;
  background: rgba(0, 0, 0, 0.07);
  transform: rotate(45deg);
  position: absolute;
  top: 29px;
  right: 29px;
}

.inner-dai {
  position: relative;
  background: white;
  height: 70px;
  width: 70px;
  top: 15px;
  left: 15px;
}

.inner-inner-dai {
  position: relative;
  background: #ffee38;
  width: 20px;
  height: 20px;
  top: 25px;
  left: 25px;
}

#loading-bg .shadow {
  position: relative;
  left: calc(50% - 55px);
  top: -40px;
  background: rgba(0, 0, 0, 0.2);
  height: 30px;
  width: 100px;
  animation: scaling 2.6s infinite;
  border-radius: 100%;
}
.column-products {
  max-width: 30px;
}
@keyframes bounce {
  20% {
    animation-timing-function: ease-out;
    transform: translateY(-60px);
  }

  50% {
    animation-timing-function: ease-out;
    transform: translateY(-80px);
  }
}

@keyframes scaling {
  20% {
    transform: scale(0.6);
  }

  50% {
    transform: scale(0.5);
  }
}

@keyframes flash {
  0% {
    transform: rotate(0deg) scale(0);
  }
  8% {
    transform: rotate(0deg) scale(0);
  }
  10% {
    transform: rotate(150deg) scale(1.8);
  }
  15% {
    transform: rotate(45deg) scale(0);
  }
  100% {
    transform: rotate(45deg) scale(0);
  }
}

@keyframes shine {
  20% {
    transform: rotate(25deg) translateY(400px);
  }

  100% {
    transform: rotate(25deg) translateY(400px);
  }
}
