/* Slide Animations */
@keyframes appearFromMiddle {
    0% {
      opacity: 0;
      transform: scale(0.5);
    }
    100% {
      opacity: 1;
      transform: scale(1);
    }
  }

@keyframes slightNudge {
    0% {
      transform: translateX(0);
    }
    20% {
      transform: translateX(5px);
    }
    40% {
      transform: translateX(0);
    }
    60% {
      transform: translateX(5px);
    }
    100% {
      transform: translateX(0);
    }
  }

/* @media (min-width: 772px) {
    .mobile-main-content-price-packages-content
    {
        top: 36% !important;
    }
  } */

.mobile-main-content-price-packages-content
{
    top: 10%;
}

/* .mobile-main-content-img {
    overflow: hidden;
} */

.mobile-main-content-img img {
    width: 88%;
    height: auto;
    display: block;
    margin: 0 auto;
    opacity: 0; /* Start with opacity 0 */
}

/* Classes that will be added by JavaScript */
.slide-from-left {
    animation: appearFromMiddle 1s ease-out forwards;
}

.slide-from-right {
    animation: appearFromMiddle 1s ease-out forwards;
}

/* Apply animations to each image with delays */
.mobile-main-content-img:nth-child(1) img {
    animation: appearFromMiddle 1s ease-out forwards, slightNudge 2s ease-in-out 1s infinite;
}

.mobile-main-content-img:nth-child(2) img {
    animation: appearFromMiddle 1s ease-out 0.3s forwards,  slightNudge 2s ease-in-out 1.3s infinite;
    opacity: 0;
}

.mobile-main-content-img:nth-child(3) img {
    animation: appearFromMiddle 1s ease-out 0.6s forwards, slightNudge 2s ease-in-out 1.6s infinite;
    opacity: 0;
}