.animated-heart {
    position: absolute;
    z-index: 1;
    top: 50%;
    left: 50%;
    opacity: 0;
    width: 500px;
    height: 500px;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url(../img/heart-filled-white.svg);
    background-size: 100%;
    transform: scale3d(0.05,0.05,0.05) translate3d(-50%,-50%,0);
    transform-origin: top left;
}

.animated-heart.has-like {
    animation: heart_float_away 1 500ms ease-in-out;
}
@-webkit-keyframes heart_float_away { 0% { opacity: 0; -webkit-transform: scale3d(0.05, 0.05, 0.05) translate3d(-50%, -50%, 0); -moz-transform: scale3d(0.05, 0.05, 0.05) translate3d(-50%, -50%, 0); transform: scale3d(0.05, 0.05, 0.05) translate3d(-50%, -50%, 0); }
  40% { opacity: 1; }
  100% { -webkit-transform: scale3d(1, 1, 1) translate3d(-50%, -50%, 0); -moz-transform: scale3d(1, 1, 1) translate3d(-50%, -50%, 0); transform: scale3d(1, 1, 1) translate3d(-50%, -50%, 0); } }
@-moz-keyframes heart_float_away { 0% { opacity: 0; -webkit-transform: scale3d(0.05, 0.05, 0.05) translate3d(-50%, -50%, 0); -moz-transform: scale3d(0.05, 0.05, 0.05) translate3d(-50%, -50%, 0); transform: scale3d(0.05, 0.05, 0.05) translate3d(-50%, -50%, 0); }
  40% { opacity: 1; }
  100% { -webkit-transform: scale3d(1, 1, 1) translate3d(-50%, -50%, 0); -moz-transform: scale3d(1, 1, 1) translate3d(-50%, -50%, 0); transform: scale3d(1, 1, 1) translate3d(-50%, -50%, 0); } }
@-ms-keyframes heart_float_away { 0% { opacity: 0; -webkit-transform: scale3d(0.05, 0.05, 0.05) translate3d(-50%, -50%, 0); -moz-transform: scale3d(0.05, 0.05, 0.05) translate3d(-50%, -50%, 0); transform: scale3d(0.05, 0.05, 0.05) translate3d(-50%, -50%, 0); }
  40% { opacity: 1; }
  100% { -webkit-transform: scale3d(1, 1, 1) translate3d(-50%, -50%, 0); -moz-transform: scale3d(1, 1, 1) translate3d(-50%, -50%, 0); transform: scale3d(1, 1, 1) translate3d(-50%, -50%, 0); } }
@-o-keyframes heart_float_away { 0% { opacity: 0; -webkit-transform: scale3d(0.05, 0.05, 0.05) translate3d(-50%, -50%, 0); -moz-transform: scale3d(0.05, 0.05, 0.05) translate3d(-50%, -50%, 0); transform: scale3d(0.05, 0.05, 0.05) translate3d(-50%, -50%, 0); }
  40% { opacity: 1; }
  100% { -webkit-transform: scale3d(1, 1, 1) translate3d(-50%, -50%, 0); -moz-transform: scale3d(1, 1, 1) translate3d(-50%, -50%, 0); transform: scale3d(1, 1, 1) translate3d(-50%, -50%, 0); } }
@keyframes heart_float_away { 0% { opacity: 0; -webkit-transform: scale3d(0.05, 0.05, 0.05) translate3d(-50%, -50%, 0); -moz-transform: scale3d(0.05, 0.05, 0.05) translate3d(-50%, -50%, 0); transform: scale3d(0.05, 0.05, 0.05) translate3d(-50%, -50%, 0); }
  40% { opacity: 1; }
  100% { -webkit-transform: scale3d(1, 1, 1) translate3d(-50%, -50%, 0); -moz-transform: scale3d(1, 1, 1) translate3d(-50%, -50%, 0); transform: scale3d(1, 1, 1) translate3d(-50%, -50%, 0); } }