﻿.global-loading-spinner.xs > svg {
    width: 14px;
    height: 14px;
}
.global-loading-spinner.sm > svg {
    width: 16px;
    height: 16px;
}
.global-loading-spinner.md > svg {
    width: 48px;
    height: 48px;
}
.global-loading-spinner.lg > svg {
    width: 64px;
    height: 64px;
}
.global-loading-spinner > svg > circle {
    stroke-width: 4px;
}
.animate-dash {
    animation: dash 1.5s ease-in-out infinite;
}
.animate-spin {
    animation: spin 1.4s linear infinite;
}

@keyframes spin {
    100% {
        transform: rotate(360deg);
    }
    0% {
        transform: rotate(0);
    }
    100% {
        transform: rotate(360deg);
    }
}

@keyframes dash {
    0% {
        stroke-dasharray: 1,150;
        stroke-dashoffset: 0;
    }
    
    50% {
        stroke-dasharray: 90,150;
        stroke-dashoffset: -35;
    }
    100% {
        stroke-dasharray: 90,150;
        stroke-dashoffset: -124;
    }
}