
/* From Uiverse.io by omar-alghaish */
.loader-1 {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    border: 5px solid rgb(218, 203, 4);
    border-left-color: transparent;
    animation: animate_681 3s linear infinite;
    position: relative;
}

.loader-2 {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    border: 5px solid rgb(0, 119, 255);
    border-top-color: transparent;
    animation: animate_6810 0.9s linear infinite;
    position: absolute;
    margin: 5px;
}

.loader-3 {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    border: 5px solid rgb(30, 255, 0);
    border-right-color: transparent;
    animation: animate_681 2s linear infinite;
    position: absolute;
    margin: 15px;
}

.loader-4 {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 5px solid rgb(194, 3, 92);
    border-bottom-color: transparent;
    animation: animate_6810 0.7s linear infinite;
    position: absolute;
    margin: 25px;
}

@keyframes animate_6810 {
    0% {
        transform: rotate(360deg);
    }
}

@keyframes animate_681 {
    0% {
        transform: rotate(-360deg);
    }
}
