@keyframes spin-animation {
    0% {
        transform: rotateZ(0deg);
    }

    25% {
        transform: rotateZ(90deg);
    }

    50% {
        transform: rotateZ(180deg);
    }

    75% {
        transform: rotateZ(270deg);
    }

    100% {
        transform: rotateZ(360deg);
    }
}

.spinner {
    font-size: 12rem;
    width: 1em;
    height: 1em;
    background-color: transparent;
    background-image: url('/images/icon-yellow.svg');
    background-size: 33%;
    background-repeat: no-repeat;
    background-position: center;
}

    .spinner > div {
        animation: spin-animation 1.1s infinite cubic-bezier(0.53, 0.21, 0.29, 0.67);
        width: 1em;
        height: 1em;
        border-radius: 50%;
        border: 0.1em solid var(--lemon-background-dark);
        border-top-color: var(--lemon-theme-primary);
        background-color: transparent;
    }