css - img: ホバー トランジションが指定された変数と一致しない

Question

http://coreytegeler.com/new/上向き矢印をクリックして図の上にカーソルを合わせると、私が話している内容が表示されます

わかりましたので、シルエットのホバー時に反転効果を作成しようとしています。それに応じてすべての CSS を変更し、マイナーな JS を使用して画像を置き換えましたが、画像のフェード遷移は他のすべてよりもはるかに高速です。本来よりもはるかに長い時間を設定しても、影響はないようです。

以下のリンクで私のスタイル シートを見ることができるはずです。かなり小さいですが、競合が発生する可能性があると考えているため、私が話している特定の行ではなく、すべてを表示できるようにしました。 http://coreytegeler.com/new/css/style.css

#shadow {
    width:33%;
    -webkit-transition: all 2.2s ease-in-out;
    -moz-transition: all 2.2s ease-in-out;
    -o-transition: all 2.2s ease-in-out;
    transition: all 2.2s ease-in-out;   
}
#shadow:hover {
    -webkit-transition: all 2.2s ease-in-out;
    -moz-transition: all 2.2s ease-in-out;
    -o-transition: all 2.2s ease-in-out;
    transition: all 2.2s ease-in-out;   
}