css - トランジションが画像に適用されない

Question

HTML

  <div id="wrapper">
   <a href="myfile.htm"> <img  id="kohv"  src="Alumine valik\kohv.jpg" /></a>
    <a href="myfile.htm"><img  id="tee"  src="Alumine valik\kann.jpg" /> </a>   
    <a href="myfile.htm"><img  id="kakao"  src="Alumine valik\kakao.jpg" /> </a>   
    <a href="myfile.htm"><img  id="masinad"  src="Alumine valik\Masinad.jpg" </a>    
    <a href="myfile.htm"><img  id="hooldus"  src="Alumine valik\wrench.jpg" />  </a>    
</div>

CSS

#kohv { 
        float:left;
        width:100px;
        margin-top:350px;
        height:100px;
        position:relative;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  transition: all 1s ease;
    }
    #kohv:hover{ 
         top: -10px;
         padding-bottom:15px;

    }

ホバー効果でトランジションが追加されません。解決策はありますか? 私は自分の知識ですべてを試し、複数のバリエーションを試し、Google を試しました。私のコードのどこが悪いのか知りたいです。