.scene {
    width: 180px;
    height: 180px;
    position: relative;
    margin: 0 auto;
}

.circle {
    width: 130px;
    height: 130px;
    border: 2px solid #427337;
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(0deg);
    animation: rotateCircle 10s linear infinite; /* Rotate the entire circle */
}

.orbit {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    transform-origin: 50% 50%;
}
/* WhatsApp container styles */
#whatsapp-container {
    width: 39px;
    position: fixed;
    bottom: 20px;
    right: 20px;
    display: none;
    z-index: 999;
}

#whatsapp-container img {
    width: 60px; /* Adjust the size as needed */
    height: auto;
    cursor: pointer;
}

.image {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 60px;
}

.ball {
    width: 20px;
    height: 20px;
    background: #34BD6B;
    border-radius: 50%;
    position: absolute;
    top: 0;
    left: 73%;
    transform: translateX(-50%);
    animation: moveBall 5s linear infinite;
}

.ball-2 {
    width: 20px;
    height: 20px;
    background: #34BD6B;
    border-radius: 50%;
    position: absolute;
    top: 95%;
    right: 50%;
    transform: translateX(-50%);
    animation: moveBall2 5s linear infinite;
}

@keyframes rotateCircle {
    0% {
        transform: translate(-50%, -50%) rotate(0deg);
    }
    100% {
        transform: translate(-50%, -50%) rotate(360deg);
    }
}

@keyframes moveBall {
    0% {
        transform: translateX(-50%) rotate(0deg);
    }
    100% {
        transform: translateX(-50%) rotate(360deg);
    }
}

@keyframes moveBall2 {
    0% {
        transform: translateX(-50%) rotate(0deg);
    }
    100% {
        transform: translateX(-50%) rotate(360deg);
    }
}

@keyframes rotateImage {
    0% {
        transform: translate(-50%, -50) rotate(0deg);
    }
    100% {
        transform: translate(-50%, -50) rotate(0deg);
    }
}