#spinner-wrapper {
    width: 100vw;
    height: 100lvh;
    background: rgba(0, 0, 0, 0.6);
    position: fixed;
    z-index: 9999;
}

.spinner {
    animation: rotate 2s linear infinite;
    z-index: 2;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -2.5svh 0 0 -2.5vw;
    width: 5vw;
    height: 5svh;

    & .path {
        stroke: hsl(0, 0%, 100%);
        stroke-linecap: round;
        animation: dash 1.5s ease-in-out infinite;
    }

}

@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;
    }
}