@keyframes avatar2 { 0% { transform: translate3d(0, 0, 0); } 25% { transform: translate3d(0, 0, 0); } 40% { transform: translate3d(-120px, 0, 0); } 75% { transform: translate3d(-120px, 0, 0); } 90% { transform: translate3d(-240px, 0, 0); } 90.0001% { transform: translate3d(0, 0, 0); } } @keyframes avatar3 { 0% { transform: translate3d(0, 0, 0); } 27% { transform: translate3d(0, 0, 0); } 35% { transform: translate3d(-120px, 0, 0); } 59% { transform: translate3d(-120px, 0, 0); } 67% { transform: translate3d(-240px, 0, 0); } 91% { transform: translate3d(-240px, 0, 0); } 99% { transform: translate3d(-360px, 0, 0); } 99.00001% { transform: translate3d(0, 0, 0); } }