body {
    overflow: hidden; /* Prevents scrolling while the loading animation is displayed */
    background-color: #FEF3F2;
}

.loading-img {
    display: flex; /* Use flexbox for alignment */
    flex-direction: column; /* Stack children vertically */
    align-items: center; /* Center children horizontally */
    justify-content: center; /* Center children vertically */
    height: 100vh; /* Full viewport height */
    position: relative; /* Allows absolute positioning of child elements */
    overflow: hidden; /* Hides any overflow content */
    margin: 0; /* Remove default margin */
    padding: 0; /* Remove default padding */
}

.loading-img img:first-child {
    width: 150px; /* Set width for the bracelet image, can be adjusted */
    position: absolute; /* Allows for free positioning */
    animation: jump 1s ease-in-out infinite; /* Apply the jump animation */
    margin-bottom: 150px; /* Space below the bracelet image */
}

.loading-img img:last-child {
    width: 300px; /* Set width for the logo, can be adjusted */
    margin-top: 100px; /* Space above the logo */
    position: static; /* Default positioning for the logo */
}

@keyframes jump {
    0%, 100% {
        transform: translateY(0); /* Start and end at original position */
    }
    50% {
        transform: translateY(-30px); /* Move up by 30 pixels */
    }
}
