:root {
    --loader-ring-size: 60px;
    --loader-ring-border-size: 5px;
}

.loader-ring {
    position: relative;
    width: var(--loader-ring-size);
    height: var(--loader-ring-size);
    margin: 12px 0;
}

.loader-ring-light {
    width: var(--loader-ring-size);
    height: var(--loader-ring-size);
    border-radius: var(--loader-ring-size);
    box-shadow: 0 var(--loader-ring-border-size) 5px #30adc2 inset;
    animation: rotate-360 2s linear infinite;
}

@keyframes rotate-360 {
    from {
        transform: rotate(0);
    }
    to {
        transform: rotate(360deg);
    }
}