.tinRightOut { -webkit-animation-name: tinRightOut; animation-name: tinRightOut; } @-webkit-keyframes tinRightOut { 0%, 20%, 40%, 50% { opacity: 1; -webkit-transform: scale(1, 1) translateX(0); transform: scale(1, 1) translateX(0); } 10%, 30% { opacity: 1; -webkit-transform: scale(1.1, 1.1) translateX(0); transform: scale(1.1, 1.1) translateX(0); } 100% { opacity: 0; -webkit-transform: scale(1, 1) translateX(900%); transform: scale(1, 1) translateX(900%); } } @keyframes tinRightOut { 0%, 20%, 40%, 50% { opacity: 1; -webkit-transform: scale(1, 1) translateX(0); transform: scale(1, 1) translateX(0); } 10%, 30% { opacity: 1; -webkit-transform: scale(1.1, 1.1) translateX(0); transform: scale(1.1, 1.1) translateX(0); } 100% { opacity: 0; -webkit-transform: scale(1, 1) translateX(900%); transform: scale(1, 1) translateX(900%); } }