html - 背景サイズを使用したFirefoxのぼやけた画像?

Question

背景画像を使用して Twitter の背景ボタンを作成しました。

html:

<span class="twitterSocial"><a href="#"></a></span>

Retina ディスプレイ画面に対応するために、元の背景画像を少し大きく (64px x 64px) し、css background-size を使用してサイズを縮小しました。chromeでの画像表示はシャープですが、Firefoxでは画像を少し大きくしたのにぼやけて見えます…。

CSS:

.twitterSocial a {
    background: url("http://oncorz.com/ci/css/newTheme/images/twitter_icon.png") no-repeat scroll center center / contain rgba(0, 0, 0, 0);
    display: block;
    float: left;
    height: 39px;
    opacity: 1;
    transition: all 0.4s ease 0s;
    width: 39px;
}

http://codepen.io/vincentccw/pen/krqLC