CSS анимация не работает в Firefox - псевдо

У меня есть некоторые анимации CSS, которые не будут работать в Firefox. Они применяются к псевдоэлементу (: after), и все работают нормально в каждом другом браузере.

Анимации применяются здесь

:after
{
    display:block;
    background:url('../img/snow.png'), url('../img/snow2.png') ;
    -webkit-animation: snow 15s linear infinite;
    -moz-animation: snow 15s linear infinite;
    -ms-animation: snow 15s linear infinite;
    animation-name:snow;
    animation-duration:15s;
    animation-timing-function:linear;
    height:500px;
    width:100%;
    content:'';
    position:absolute;
    top:0;
    left:0;
}

А сами анимации здесь:

@-webkit-keyframes snow {
 0% {background-position: 0px 0px;}
 100% {background-position: 0px 1000px, 0 500px;}
}
@keyframes snow {
 0% {background-position: 0px 0px;}
 100% {background-position: 0px 1000px, 0 500px;}
}

@-moz-keyframes snow {
 0% {background-position: 0px 0px;}
 100% {background-position: 0px 1000px, 0 500px;}
}
@-ms-keyframes snow {
 0% {background-position: 0px 0px;}
 100% {background-position: 0px 1000px, 0 500px;}
}

Любая помощь или совет будут очень полезны!