HTML

<div id="containerEx19">
<div class="ex19"><img src="http://img1.liveinternet.ru/images/attach/b/4/103/221/103221855_1154721.gif" alt="" width="150" height="170" /> <img src="http://img0.liveinternet.ru/images/attach/c/8/100/904/100904650_46.gif" alt="" width="150" height="170" /></div>
</div>

CSS

<style type="text/css"><!--
/*GloriaV */
/*URL: http://tutorialgloriav.eklablog.com/*/
#containerEx19 {width: 800px;
margin: 0 auto;
}
.ex19 img {
margin: 20px;
border: 1px dotted #fff; 
border-radius: 1em/0.5em;
-webkit-box-shadow: 2px 2px 3px 3px rgba(0,0,0,0.2); 
-moz-box-shadow: 2px 2px 3px 3px rgba(0,0,0,0.2); 
 box-shadow:2px 2px 3px 3px rgba(0,0,0,0.2); 
-webkit-transition: all 0.5s ease-out;
-moz-transition: all 0.5s ease;
-ms-transition: all 0.5s ease;
}
.ex19 img:hover {
 opacity:0; transition:.5s 0.2s; 
transition:.4s ease-out; 
-webkit-transition:0.4s ease-out; -webkit-transform:rotateX(90deg) translate(-3px,-3%); transform:rotateX(90deg) translate(-3px,-3%); 
}
z-index:2; transform:scale(1.2);
-webkit-transform:scale(1.2); }
box-shadow:0 0 0 2px #FFF, 0 0 20px 5px #000; transition:.1s; -webkit-transition:0.1s; }
ransform:scale(1.1); -webkit-transform:scale(1.1); }
--></style>