Imagem Com Efeito Giratório

Esse post vai ser como personalizar um pouco das imagens do blog e colocar um efeito giratório, mas, já vou dizendo, cada vez que quiser que a imagem tenha esse efeito, vc deve colocar um código. Vou explicar melhor sobre isso:

1- Vá em Modelo >> Editar HTML >> CTRL-F >> Procure por

]]></b:skin>

2- Após encontrar o código acima, cole acima dele o seguinte:

 .rotate{ -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; width:auto; -webkit-transition-duration: 1.20s;}
.rotate:hover{-webkit-transform: rotate(360deg);}

3- Em seguida salve. Assim que salvar escolha um dos códigos abaixo, um é sem link e um com link. Toda vez que quiser que a imagem tenha esse efeito, cole um desses:

Sem link: 

<img src="URLDAIMAGEM" class="rotate">

Com link: 

<a href="URL"> <img src="LINK DA IMAGEM" class="rotate"></a>

Fácil não???