Card 3D view Parallax

-> http://codepen.io/abujupaj/pen/zvgMQL

HTML
--------------------------------------------

<link href='https://fonts.googleapis.com/css?family=Playfair+Display:400,900,700' rel='stylesheet' type='text/css'>

<div id="top">
  <div class="perspective">
    <div class="card">
      <img class="image" src="http://s4.favim.com/orig/141110/casual-look-classy-clothes-fashion-girl-Favim.com-2224954.png">
      <h2>Mode à Paris</h2>
      <span>2017</span>
    </div>
  </div>
</div>

CSS
-------------------------------------------

body{
  font-family:font-family: 'Playfair Display', serif;
  height:100%;
background: #8e9eab;  /* fallback for old browsers */
background: -webkit-linear-gradient(to right, #eef2f3, #8e9eab);  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to right, #eef2f3, #8e9eab); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */


}
.perspective{
    width: 100%;
     perspective: 1000px;
    -webkit-perspective: 1000px;
}
.card{
   position:relative;
   width: 500px;
   height: 333px;
   box-shadow:0 36px 63px -20px #a2a2a2;
   margin: auto;
  margin-top: 100px;
      -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-backface-visibility: hidden;
  
  transition: transform .05s linear;
}

.card h2{
  position: absolute;
  top: 0;
  left:-60px;
  font-size:80px;
  font-weight:100;
  color:#333;
      -webkit-transform: translateZ(80px);
    transform: translateZ(80px);
}

.card span{
  position:absolute;
  bottom:0;
  right: -30px;
  font-size: 100px;
  font-weight:600;
  color:#333;
      -webkit-transform: translateZ(20px);
    transform: translateZ(20px
}

.image{
  margin: auto;
  display: block;
}

JS
----------------------------------------
var o = $(".card");
$("#top").on("mousemove", function(t) {
    var e = -($(window).innerWidth() / 2 - t.pageX) / 20,
        n = ($(window).innerHeight() / 2 - t.pageY) / 10;
    o.attr("style", "transform: rotateY(" + e + "deg) rotateX(" + n + "deg);-webkit-transform: rotateY(" + e + "deg) rotateX(" + n + "deg);-moz-transform: rotateY(" + e + "deg) rotateX(" + n + "deg)")
})