/*
 * Functional loading indicators must keep moving independently of the page
 * that created them. Tabler's webfont only supplies the glyph; it does not
 * animate ti-loader or ti-loader-2 by itself.
 */
@keyframes softyu-loader-spin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

/* Backwards-compatible name for older inline loading states. */
@keyframes spin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

.ti.ti-loader,
.ti.ti-loader-2 {
    display: inline-block;
    transform-origin: center;
    animation: softyu-loader-spin 0.8s linear infinite;
    animation-play-state: running;
    will-change: transform;
}