D.A PEDIDO : Tutorial - Efeito deslizar na imagem dos posts

Bom gente, hoje é a pedido que estou fazendo esse tutorial, bom o efeito deslizar na imagem pode ser visto aqui:  http://blogdetestesdelicadaeabusada.blogspot.com.br/  é só passar o mouse por cima.

Bom vamos ao tutorial? sim!!

1 - Vá no seu HTML

2 - agora procure por:

/* Variable definitions

3- agora acima dele cole o código abaixo:

/* Post com imagem deslisante - Delicada e Abusada -
----------------------------------------------- */
.post {
width:600px; /* largura do post */
height:500px; /* altura do post */
background: #ffffff; /* background dos posts */
    margin-top: -28px; /* margem acima - só altere se tiver conhecimentos em html */
overflow:hidden;
float: center;
}
.post h3 { /* Titulos */
font-size: 12px; /* Fonte do título do post */
background: #000000; /* fundo dos titulos */
font-weight:bold;
padding:10px 0;
height: 20px; /* altura do fundo dos titulos */
}
.post-body {
height: 500px; /* altura do post */
overflow:hidden;
}
.post-body img {
max-width: 600px; /*largura do post (sim do post!) */
margin-left: -70px;-moz-transition: all 0.2s ease-in-out; /* o efeito vai da esquerda para direita, se quiser ao contrário, troque left por right */
-webkit-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;}
.post-body img:hover{
margin-left: 0px;}

4 - visualize e veja se está tudo ok, e salve! 

Atenção: O tutorial é grande para uma imagem não é? eu sei, é por que se colocar só o código da imagem, ela fica desalinhada, então isso é para ela não ficar desalinhada. ;)
ah, e outra coisa, quando clica volta as postagem personalizada como era antes, então no caso você deveria personalizar o /* Post

Bom gente, por hoje é só!

beijos,

e não se esqueça de participar dos nossos sorteios...