.spinner {
    animation: rotate 2s linear infinite;
    z-index: 2;
    top: 50%;
    left: 50%;
    margin-top: 2px;
    width: 20px;
    height: 20px;
}

.spinner .path {
    stroke: #13316e;
    stroke-linecap: round;
    animation: dash 1.5s ease-in-out infinite;
}

.spinner .tick {
    display: none;
}

.spinner.complete .tick {
    display: block;
}

.spinner.complete,
.spinner.not-started {
    animation: none;
}

    .spinner.complete .path {
        stroke: #13316e;
        stroke-dashoffset: 0;
        animation: none;
        fill: #13316e;
    }

    .spinner.not-started .path {
        stroke: #ccc;
        stroke-dashoffset: 0;
        animation: none;
    }

@keyframes rotate {
    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;
    }
}

.progresslist {
    list-style: none;
}
.progresslist li {
    display: grid;
    grid-template-columns: min-content 1fr;
    grid-gap: 20px;
    margin-top: 10px;
}


/* loading 
<div class="loader-container">
    <div class="bouncing-dots">
        <div class="dot"></div>
        <div class="dot"></div>
        <div class="dot"></div>
    </div>
</div>
*/
.loader-container {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
}

.bouncing-dots {
    display: flex;
    justify-content: space-between;
    width: 20px;
}

.dot {
    width: 5px;
    height: 5px;
    background-color: #13316e;
    border-radius: 50%;
    animation: bounce 1.5s infinite;
}

.dot--white{
    background-color: #fff1f1;
}

    .dot:nth-child(1) {
        animation-delay: 0s;
    }

    .dot:nth-child(2) {
        animation-delay: 0.3s;
    }

    .dot:nth-child(3) {
        animation-delay: 0.6s;
    }

@keyframes bounce {
    0%, 100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-10px);
    }
}