SASS - CSS - анимация работает в хроме, а не в firefox

Я пытаюсь добиться простого перехода цвета с двумя состояниями для div

это угловой проект, он использует файлы scss для CSS

Я нашел несколько других тем по этому поводу, но даже если я пытаюсь применить исправления, это все равно не работает в firefox.

вот как я использую код ниже:

@include errorDivPulse($black,$orange,$white,#ff1200,animC);
.errorDiv {
    @include errorDiv($black,$orange,animC);
}

выглядит это так (просто повтор с префиксами):

@mixin errorDiv($foreGround,$backGround,$animName) {
    color: $foreGround !important; 
    background-color: $backGround !important; 

    @if ($animName) {
        -moz-animation: $animName 1s infinite;
        -webkit-animation: $animName 1s infinite;
        -ms-animation: $animName 1s infinite;
        animation: $animName 1s infinite;
    }
}

@mixin errorDivPulse ($color1, $backGround1, $color2, $backGround2,$animName ) {
    @-moz-keyframes #{$animName} {
        0% {
            color: $color1;
            background-color: $backGround1; 
        }
        50% {
            color: $color2;
            background-color: $backGround2; 
        }
        100 {
            color: $color1;
            background-color: $backGround1; 
        }
    }
    @-webkit-keyframes #{$animName} {
        0% {
            color: $color1;
            background-color: $backGround1; 
        }
        50% {
            color: $color2;
            background-color: $backGround2; 
        }
        100 {
            color: $color1;
            background-color: $backGround1; 
        }
    }
    @-ms-keyframes #{$animName} {
        0% {
            color: $color1;
            background-color: $backGround1; 
        }
        50% {
            color: $color2;
            background-color: $backGround2; 
        }
        100 {
            color: $color1;
            background-color: $backGround1; 
        }
    }
    @keyframes #{$animName} {
        0% {
            color: $color1;
            background-color: $backGround1; 
        }
        50% {
            color: $color2;
            background-color: $backGround2; 
        }
        100 {
            color: $color1;
            background-color: $backGround1; 
        }
    }
}