Efeito Css3 - Sipt

Olá Galerinha, olha eu aqui de novo.

Dessa vez trouxe um tutorial bem legal, e é útil para ser usado no gadget Equipe.
Usei a base do efeito Four Sides do Great Help e criei ele.

Visualizem aqui.

Agora procure por ]]></b:skin>

E acima dela cole o seguinte código, alterando os lugares marcados.

#spit{
display: inline-block;
margin-left: 15px;
background-image: url('http://static.tumblr.com/sxeyvs3/7F5mf87po/1.png'),  url('http://static.tumblr.com/sxeyvs3/34bmf87q1/2.png'), url('http://25.media.tumblr.com/fdf4a1e6de6ad20af51276ce03f82019/tumblr_mf53u8DPTn1rxdy7io1_250.png');
background-repeat: no-repeat; background-position: 0px; -webkit-transition: all 1s ease;-moz-transition: all 1s ease;-o-transition: all 1s ease;-ms-transition: all 1s ease;transition: all 1s ease;
background-position: -100px 0px, 100px 0px, 0px 0px;
}
#spit:hover {background-position: -100px 200px, 100px -200px, 0px 0px;
-webkit-transform: rotate(360deg);
}
.hover{border-radius: 100px;height: 200px; width: 200px;}

Agora para você poder usá-lo, adicione o código abaixo em um gadget Javascript/HTML.

<div id="spit" class="hover"></div>

Pronto, Beijos ;*