.rotateUp { -webkit-animation-name: rotateUp; animation-name: rotateUp; } @-webkit-keyframes rotateUp { 0% { opacity: 1; -webkit-transform-origin: 0 0; transform-origin: 0 0; -webkit-transform: perspective(800px) rotateX(0deg) translateZ(0px); transform: perspective(800px) rotateX(0deg) translateZ(0px); } 100% { opacity: 0; -webkit-transform-origin: 50% 0; transform-origin: 50% 0; -webkit-transform: perspective(800px) rotateX(180deg) translateZ(100px); transform: perspective(800px) rotateX(180deg) translateZ(100px); } } @keyframes rotateUp { 0% { opacity: 1; -webkit-transform-origin: 0 0; transform-origin: 0 0; -webkit-transform: perspective(800px) rotateX(0deg) translateZ(0px); transform: perspective(800px) rotateX(0deg) translateZ(0px); } 100% { opacity: 0; -webkit-transform-origin: 50% 0; transform-origin: 50% 0; -webkit-transform: perspective(800px) rotateX(180deg) translateZ(100px); transform: perspective(800px) rotateX(180deg) translateZ(100px); } }