#preloader{
    background-color: var(--bs-white);
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 999999999;
    display: flex;
    align-items: center;
    justify-content: center;
}
.loader{
    position: relative;
    display: flex;
    justify-content: space-around;
    align-items: center;
    gap: 15px;
    .circle {
        width: 15px;
        height: 15px;
        background-color: var(--bs-primary);
        border-radius: 50%;
        animation: bounce 1.1s infinite ease-in-out;
        &:nth-child(1) {
            animation-delay: 0s;
        }
        &:nth-child(2) {
            animation-delay: 0.2s;
        }
        &:nth-child(3) {
            animation-delay: 0.4s;
        }
        &:nth-child(4) {
            animation-delay: 0.6s;
        }
    }
}

/* Bounce animation */
@keyframes bounce {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-20px);
    }
}