<style>
.flip-container {perspective: 1000px;}
.flip-container:hover .flipper, .flip-container.hover .flipper {transform: rotateY(180deg);}
.flip-container, .front, .back {width: 320px;height:200px;}
.flipper {transition: 0.6s;transform-style: preserve-3d;position: relative;}
.front, .back {backface-visibility: hidden;position: absolute;top: 0;left: 0;}
.front {z-index: 2;transform: rotateY(0deg);}
.back {transform: rotateY(180deg);}
</style>
<div class="flip-container" ontouchstart="this.classList.toggle('hover');">
 <div class="flipper">
  <div class="front">
<img src="http://i.imgur.com/gCr4ycDm.jpg" width="320" height="200"/>
  </div>
  <div class="back">
<img src="http://i.imgur.com/pyL40yfm.jpg" width="320" height="200"/>
  </div>
 </div>
</div>