.loading-wrap {
    display: inline-block;
    position: absolute;
    top: calc(50vh - 57px);
    left: calc(50vw - 100px);
}
.loading-animation {
    width: 201px;
    height: 114px;
    background-image: url("./img/sprites.png");
    background-position: -604px 0px;
    background-size: 1207px 913px;
    transform: translate(0px, 0px);
    background-repeat: no-repeat;
    animation-name: keyframes-images;
    animation-duration: 1.8s;
    animation-delay: 0s;
    animation-iteration-count: infinite;
    animation-fill-mode: forwards;
    animation-timing-function: steps(1);
}

@keyframes keyframes-images {
    0% {
        width: 201px;
        height: 114px;
        background-image: url("./img/sprites.png");
        background-position: -604px 0px;
        background-size: 1207px 913px;
        transform: translate(0px, 0px);
    }

    2.22% {
        background-position: -604px -114px;
    }

    4.44% {
        background-position: -604px -228px;
    }

    6.67% {
        background-position: -604px -342px;
    }

    8.89% {
        background-position: -604px -456px;
    }

    11.11% {
        height: 115px;
        background-position: 0px 0px;
    }

    13.33% {
        background-position: -201px 0px;
    }

    15.56% {
        width: 202px;
        height: 114px;
        background-position: 0px -115px;
        transform: translate(-1px, 0px);
    }

    17.78% {
        background-position: 0px -229px;
    }

    20.00% {
        width: 201px;
        background-position: 0px -571px;
        transform: translate(0px, 0px);
    }

    22.22% {
        width: 202px;
        background-position: -402px 0px;
        transform: translate(-1px, 0px);
    }

    24.44% {
        width: 201px;
        background-position: -201px -571px;
        transform: translate(0px, 0px);
    }

    26.67% {
        background-position: -402px -571px;
    }

    28.89% {
        background-position: -603px -571px;
    }

    31.11% {
        background-position: 0px -685px;
    }

    33.33% {
        width: 202px;
        background-position: -402px -114px;
        transform: translate(-1px, 0px);
    }

    35.56% {
        background-position: -402px -228px;
    }

    37.78% {
        width: 201px;
        background-position: -201px -685px;
        transform: translate(0px, 0px);
    }

    40.00% {
        background-position: -402px -685px;
    }

    42.22% {
        background-position: -603px -685px;
    }

    44.44% {
        background-position: -805px 0px;
    }

    46.67% {
        background-position: -805px -114px;
    }

    48.89% {
        background-position: -805px -228px;
    }

    51.11% {
        width: 202px;
        background-position: 0px -343px;
        transform: translate(-1px, 0px);
    }

    53.33% {
        width: 201px;
        background-position: -805px -342px;
        transform: translate(0px, 0px);
    }

    55.56% {
        width: 202px;
        background-position: -202px -343px;
        transform: translate(-1px, 0px);
    }

    57.78% {
        background-position: 0px -457px;
    }

    62.22% {
        width: 201px;
        background-position: -805px -456px;
        transform: translate(0px, 0px);
    }

    64.44% {
        width: 202px;
        background-position: -202px -457px;
        transform: translate(-1px, 0px);
    }

    66.67% {
        width: 201px;
        background-position: -805px -570px;
        transform: translate(0px, 0px);
    }

    68.89% {
        background-position: -805px -684px;
    }

    71.11% {
        background-position: 0px -799px;
    }

    73.33% {
        background-position: -201px -799px;
    }

    75.56% {
        background-position: -402px -799px;
    }

    77.78% {
        background-position: -603px -799px;
    }

    80.00% {
        background-position: -804px -799px;
    }

    82.22% {
        background-position: -1006px 0px;
    }

    84.44% {
        background-position: -1006px -114px;
    }

    86.67% {
        background-position: -1006px -228px;
    }

    88.89% {
        background-position: -1006px -342px;
    }

    91.11% {
        background-position: -1006px -456px;
    }

    93.33% {
        background-position: -1006px -570px;
    }

    95.56% {
        background-position: -1006px -684px;
    }

    97.78%,
    100% {
        background-position: -1006px -798px;
    }
}