.zoomIn {
     -webkit-animation-name: zoomIn;
     animation-name: zoomIn;
     -webkit-animation-duration: 3s;
     animation-duration: 3s;
     -webkit-animation-fill-mode: both;
     animation-fill-mode: both;
 }
 
 @-webkit-keyframes zoomIn {
     0% {
         opacity: 0;
         -webkit-transform: scale3d(.1, .1, .1);
         transform: scale3d(.1, .1, .1);
     }
     50% {
         opacity: 0.5;
     }
 }
 
 @keyframes zoomIn {
     0% {
         opacity: 0;
         -webkit-transform: scale3d(.3, .3, .3);
         transform: scale3d(.3, .3, .3);
     }
     50% {
         opacity: 1;
     }
 }
 
 .box {
     width: 60%;
     position: fixed;
     top: 50%;
     left: 50%;
     /* bring your own prefixes */
     transform: translate(-50%, -50%);
 }
 
 img {
     width: 100%;
     margin: auto, auto;
     display: inline;
 }