@keyframes colorstorm {
    0%, 100% {
        filter: hue-rotate(0deg) saturate(10);
    }

    50% {
        filter: hue-rotate(180deg) saturate(10);
    }
}

@keyframes backgroundgradient {
    0% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }
}

@keyframes blinker {
    50% {
        opacity: 0;
    }
}

@keyframes colorswitch {
    0%, 100% {
        color: var(--colorswitch-color1);
    }

    50% {
        color: var(--colorswitch-color2);
    }
}

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

@keyframes flicker {
    0% {
        opacity: 0;
    }

    10% {
        opacity: 0.9;
    }

    20% {
        opacity: 0.99
    }

    30% {
        opacity: 0;
    }

    40% {
        opacity: 0.9;
    }

    50% {
        opacity: 0.99;
    }

    60% {
        opacity: 0;
    }

    70% {
        opacity: 0.9;
    }

    80% {
        opacity: 0.99;
    }

    90% {
        opacity: 0;
    }

    100% {
        opacity: 0.9;
    }
}

@keyframes scanline {
    0% {
        transform: translateY(100%);
    }
}

@keyframes grain {
    0%, 100% {
        transform: translate(0, 0)
    }

    10% {
        transform: translate(-5%, -10%)
    }

    20% {
        transform: translate(-15%, 5%)
    }

    30% {
        transform: translate(7%, -25%)
    }

    40% {
        transform: translate(-5%, 25%)
    }

    50% {
        transform: translate(-15%, 10%)
    }

    60% {
        transform: translate(15%, 0%)
    }

    70% {
        transform: translate(0%, 15%)
    }

    80% {
        transform: translate(3%, 35%)
    }

    90% {
        transform: translate(-10%, 10%)
    }
}