.color-prediction-section .coin_1 {
  transform: translateX(400px) rotate(820deg);
  opacity: 0;
  transition: all 1s ease;
}

.color-prediction-section .coin_2 {
  transform: translateX(350px) rotate(720deg);
  opacity: 0;
  transition: all 0.8s ease;
}

.color-prediction-section:hover .coin_1 {
  transform: translateX(0) rotate(0deg);
  opacity: 1;
}

.color-prediction-section:hover .coin_2 {
  transform: translateX(-15px) rotate(0deg);
  opacity: 1;
}


@keyframes sectionReveal {

  0% {
    opacity: 0;
    transform: translateY(-120px);
  }

  60% {
    opacity: 1;
    transform: translateY(20px);
  }

  80% {
    transform: translateY(-8px);
  }

  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes phoneFloat {
  0% {
    transform: translateY(0px) rotate(0deg);
  }

  25% {
    transform: translateY(-12px) rotate(-2deg);
  }

  50% {
    transform: translateY(0px) rotate(0deg);
  }

  75% {
    transform: translateY(12px) rotate(2deg);
  }

  100% {
    transform: translateY(0px) rotate(0deg);
  }
}
@media (min-width: 0px) and (max-width: 991.98px) {
  .color-prediction-section .coin_1 {
    transform: translateX(0) rotate(0deg);
    opacity: 1;
  }

  .color-prediction-section .coin_2 {
    transform: translateX(0px) rotate(0deg);
    opacity: 1;
  }
  .color-prediction-section:hover .coin_2 {
    transform: translateX(0px) rotate(0deg);
    opacity: 1;
  }
  .color-prediction-section .coin_container {
    gap: 12px;
  }
}