.root {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate3d(0px, 0px, 600px) rotateX(0deg) rotateY(0deg) rotateZ(0deg);
    transform-style: preserve-3d;
}

.playerAnimationWalking {
    --animation-duration: 1s;
}
.playerAnimationRunning {
    --animation-duration: .66s;
}
.playerAnimationWalking,
.playerAnimationRunning {
    animation: playerAnimationWalkingY calc(var(--animation-duration) / 2) ease-in-out infinite,
        playerAnimationWalkingX var(--animation-duration) ease-in-out calc(var(--animation-duration) / -2) infinite;
}

@keyframes playerAnimationWalkingY {
    0%, 100% {
        margin-top: 0;
    }
    50% {
        margin-top: -5px;
    }
}

@keyframes playerAnimationWalkingX {
    0%, 100% {
        margin-left: -3px;
    }
    50% {
        margin-left: 3px;
    }
}