
.anim-hue {
    animation: hue 20s linear infinite;
}

.anim-hue-pulse {
    animation: huepulse 4s ease 0s infinite normal none;
}

.anim-spin {
    animation: spin 20s linear infinite;
}

.anim-shake {
    animation: shake 2s ease 0s infinite normal none;
}

.anim-slow-shake {
    animation: shake 16s ease 0s infinite normal none;
}

.anim-pulse {
    animation: pulse 2s ease 0s infinite normal none;
}

.anim-spin-turbo {
    animation: spinturbo 2s ease 0s infinite normal none;
}

@keyframes hue {
    100% {
        filter: hue-rotate(360deg);
    }
}

@keyframes huepulse {
    0%,100% {
        filter: hue-rotate(360deg);
    }
    10% {
        filter: hue-rotate(180deg);
    }
    20%,40%,60% {
        filter: hue-rotate(60deg);
    }
    30%,50%,70% {
        filter: hue-rotate(90deg);
    }
    80% {
        filter: hue-rotate(30deg);
    }
    90% {
        filter: hue-rotate(15deg);
    }
}

@keyframes spin {
    100% {
        transform: rotate(360deg);
    }
}

@keyframes spinturbo {
    0% {
        transform: rotate(0);
    }
    100% {
        transform: rotate(360deg);
    }

}

@keyframes shake {
    0%,100% {
        transform: rotate(0deg);
        transform-origin: 50% 50%;
    }
    10% {
        transform: rotate(8deg);
    }
    20%,40%,60% {
        transform: rotate(-10deg);
    }
    30%,50%,70% {
        transform: rotate(10deg);
    }
    80% {
        transform: rotate(-8deg);
    }
    90% {
        transform: rotate(8deg);
    }
}

@keyframes pulse {
    0% {
        animation-timing-function: ease-out;transform: scale(1);transform-origin: center center;
    }
    10% {
        animation-timing-function: ease-in;transform: scale(0.99);
    }
    17% {
        animation-timing-function: ease-out;transform: scale(1.1);
    }
    33% {
        animation-timing-function: ease-in;transform: scale(0.99);
    }
    45% {
        animation-timing-function: ease-out;transform: scale(1.05);
    }
}