:root {
    --c-var-animation-duration: 5s
}

.ajaxmask {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.35);
    z-index: 9998;
    display: none;
}


#imgAjaxLoading {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: none;
    display: flex;
    align-items: center;
    justify-content: center;
}


.c-progress-spinner {
    display: -moz-inline-stack;
    display: inline-block;
    height: 100px;
    width: 100px;
    margin: 0 auto;
    position: relative
}

    .c-progress-spinner:before {
        content: "";
        display: block;
        padding-top: 100%
    }

    .c-progress-spinner .c-progress-spinner-svg {
        height: 100%;
        width: 100%;
        margin: auto;
        transform-origin: center center;
        transform: rotate(-90deg);
        position: absolute;
        inset: 0
    }

        .c-progress-spinner .c-progress-spinner-svg .c-progress-spinner-circle {
            stroke-dasharray: 0,200;
            stroke-dashoffset: 0;
            stroke: var(--c-thm-color-primary);
            stroke-linecap: round;
            animation: c-progress-spinner-dash var(--c-var-animation-duration) ease-in-out infinite,c-progress-spinner-color 6s ease-in-out infinite
        }

body > .c-progress-spinner {
    position: absolute;
    top: 50%;
    left: 50%
}

@keyframes c-progress-spinner-rotate {
    to {
        transform: rotate(360deg)
    }
}

@keyframes c-progress-spinner-dash {
    0% {
        stroke-dasharray: 1,200;
        stroke-dashoffset: 0
    }

    50% {
        stroke-dasharray: 89,200;
        stroke-dashoffset: -35px
    }

    to {
        stroke-dasharray: 89,200;
        stroke-dashoffset: -124px
    }
}

@keyframes c-progress-spinner-dash-det {
    0% {
        stroke-dasharray: 0,200;
        stroke-dashoffset: 0
    }

    to {
        stroke-dasharray: 200,200;
        stroke-dashoffset: 0
    }
}

@keyframes c-progress-spinner-color {
    to,0% {
        stroke: var(--c-thm-color-primary)
    }

    40% {
        stroke: var(--c-thm-color-primary)
    }

    66% {
        stroke: var(--c-thm-color-primary)
    }

    80%,90% {
        stroke: var(--c-thm-color-primary)
    }
}