.rotate-360 { animation: loading 20s linear infinite; @keyframes loading { 0% { transform: rotate(0); } 100% { transform: rotate(360deg); } } } @keyframes jumpTwo { 0% { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } 40% { -webkit-transform: translate3d(0, 20px, 0); transform: translate3d(0, 20px, 0); } 100% { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } .jump { animation: jumpTwo 8s linear infinite; @keyframes jumpTwo { 0% { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } 40% { -webkit-transform: translate3d(0, 20px, 0); transform: translate3d(0, 20px, 0); } 100% { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } }