/**
 * @package   floatingcircles
 * @copyright (c)2024 WeDevlops Team / WeDevlops.com
 * @license   GNU General Public License version 2 or later
 */
/* General styles for floating circles */
.circle {
    position: absolute;
    width: 20px; /* Circle width */
    height: 20px; /* Circle height */
    background-color: #FFD700; /* Default color */
    border-radius: 50%; /* Make it a circle */
    opacity: 0.8; /* Slight transparency */
    animation: floatUp linear infinite;
}

/* Animation for floating up */
@keyframes floatUp {
    from {
        transform: translateY(0);
        opacity: 1;
    }
    to {
        transform: translateY(-100vh); /* Move up the full viewport height */
        opacity: 0; /* Fade out */
    }
}