添加类时 Firefox 过渡

看看 http://gull.calvin-evans.mixture.io/

当你点击其中一个大的棕色矩形时，一个"dropped"类会与jQuery一起应用，这会改变顶部位置。这在最新版本的 FF 中根本没有像在大多数其他浏览器中那样过渡，我不知道为什么。当我使用浏览器内调试器并在标记中手动添加类时，它会血腥过渡！太奇怪了。如果有人对此有任何想法，将不胜感激。

这是我的CSS（更少）作为记录：

.card {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    -webkit-transition: 0.6s  top 0;
    -moz-transition: 0.6s  top 0;
    -o-transition: 0.6s  top 0;
    -ms-transition: 0.6s  top 0;
    transition: 0.6s  top 0;
    img {
        width: 100%;
    }
    &.one {
        z-index: 4;
        background: @brown1;
        background-size:100% auto;
        top: 0%;
        &.dropped {
            top: 90%;   
        }
    }
    &.two {
        z-index: 3;
        background: @brown2;
        top: 0;
        &.dropped {
            top: 85%;   
        }
    }
    &.three {
        z-index: 2;
        background: @brown3;
        top: 0;
        &.dropped {
            top: 80%;   
        }
    }
}