更新到最新版本的Firefox后，我的CSS动画出现了问题。

在我的网站上camerabeanbags.co.uk 我有动画按钮，其中渐变在整个资源上设置动画。

这在Google Chrome上运行良好，在Firefox上运行良好，直到我更新了Firefox版本。

在此页面上，您可以找到一个应该设置动画的按钮-添加到篮子按钮在Chrome中设置了动画，但在firefox中没有-https://www.camerabeanbags.co.uk/product/standard-camera-bean-bag/

下面是我为其中一个按钮使用的代码。（添加到篮子按钮）

.single-product div.product form.cart .button {
    color: #fff;
  background: -webkit-linear-gradient(180deg,#1b8c0f, #c2cc36, #1b8c0f);
    background: -moz-linear-gradient(180deg,#1b8c0f, #c2cc36, #1b8c0f);
    background-size: 400% 400%;
    animation: BackgroundGradient 10s ease infinite;
    -moz-animation: BackgroundGradient 10s ease infinite;
    -webkit-box-shadow: inset 0 0 0 0px #ff3366;
    -moz-box-shadow: inset 0 0 0 0px #ff3366;
}

.single-product div.product form.cart .button:hover {
    color: #fff;
  background: -webkit-linear-gradient(180deg,#1b8c0f, #c2cc36, #1b8c0f);
    background: -moz-linear-gradient(180deg,#1b8c0f, #c2cc36, #1b8c0f);
    background-size: 400% 400%;
    animation: BackgroundGradient 3s ease infinite;
     -moz-animation: BackgroundGradient 3s ease infinite;
    -webkit-box-shadow: inset 0 0 0 0px #ff3366;
    -moz-box-shadow: inset 0 0 0 0px #ff3366;
    transition: all .2s ease-in-out; 
    transform: scale(1); 
}



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

@-moz-keyframes BackgroundGradient {
                0% {background-position: 0% 50%;}
                50% {background-position: 100% 50%;}
                100% {background-position: 0% 50%;}
}

我不知道为什么在更新Firefox后，这项功能不起作用。如果您在Chrome和Firefox中打开页面，您将看到动画工作和不工作。任何帮助都将不胜感激，因为我不确定这里会出什么问题。