Imagem com efeito giratório #2

Aiin estava com saudades da minha plantação de xuxu mais linda das galaxias :) Bah demorei p/ aparecer né?! pois é, realmente não consegui passar aqui, estou trabalhando mais que burro de carga rsrsrs
Mas hoje tenho o dia livre (wiiiiiiiiiiiiiiii) e postarei um tuto simples, vocês lembram que já  postei sobre efeito giratório em imagem? aquele bonitinho que a maioria usava nos afiliados, se não lembram vejam aqui .. hoje vou postar o efeito giratório  também, mas não igual o outro lógiiico muié espero que gostem :)


Vá em Design   Editar HTML   Ctrl F e procure por ]]></b:skin>

Cole acima de ]]></b:skin> este código:

Efeito 1:

.rotate{
width:auto;
border-radius:5px;
border: 4px double #ff73da;
-webkit-transition-duration: 1.00s;
-moz-transition-duration: 1.00s;
transition-duration: 1.00s;}

.rotate:hover{
width:auto;
-webkit-transform: rotateY(-360deg);
border: 4px solid #ff73da;
-webkit-transition-duration: 1.00s;
-moz-transition-duration: 1.00s;
transition-duration: 1.00s;}

Imagem gira para o lado =>

Efeito 2:

.rotate{
width:auto;
border: 4px solid #ff73da;
-webkit-transition-duration: 1.00s;
-moz-transition-duration: 1.00s;
transition-duration: 1.00s;}
.rotate:hover{
width:auto;
border: dashed 4px #ff73da;
-webkit-transform: rotatex(-360deg);
-webkit-transition-duration: 1.00s;
-moz-transition-duration: 1.00s;
transition-duration: 1.00s;}

Imagem gira para cima ^

  Depois de escolher o estilo Salve!!
 Modifique como quiser o que esta destacado em rosa

 Obs: Agora para que o código funcione coloque onde você quiser que apareça esse efeito o seguinte código:

Se quiser por link na imagem:

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

Se não quiser link na imagem:

<img src="LINK DA IMAGEM" class="rotate">

Nesse post tem estilos de bordas : \o/
Aqui tem as cores : \o/

Espero que tenham gostado é simples, mais é bacaninha o efeito!