#octocat{height:300px;width:200px;background:url(https://raw.githubusercontent.com/codypearce/codepen-files/main/pens/octocat/octocat.png) 0;animation:animateSprite 15s steps(1) infinite,swim 15s ease-in-out infinite;position:absolute;right:-180px;top:50%;margin-top:-60px;z-index:100;transform-origin:top left;transform:scale(.4)}#octocat2{animation:animateSprite 15s steps(1) infinite,swim2 15s ease-in-out infinite}#octocat2,#octocat3{height:300px;width:200px;background:url(https://raw.githubusercontent.com/codypearce/codepen-files/main/pens/octocat/octocat.png) 0;position:absolute;right:-180px;top:50%;margin-top:-40px;z-index:100;transform-origin:top left;transform:scale(.3)}#octocat3{animation:animateSprite 15s steps(1) infinite,swim3 15s ease-in-out infinite}@keyframes animateSprite{0%{background-position:-600px}20%{background-position:0}25%{background-position:-200px}35%{background-position:-400px}40%{background-position:-400px}50%{background-position:-200px}60%{background-position:0}67%{background-position:-600px}to{background-position:-600px}}@keyframes swim{0%{transform:scale(.4) translateX(0)}20%{transform:scale(.4) translateX(-550px)}25%{transform:scale(.4) translateX(-550px)}35%{transform:scale(.4) translateX(-550px) translateY(-90px)}50%{transform:scale(.4) translateX(-150px) translateY(10px)}60%{transform:scale(.4) translateX(-150px) translateY(-90px)}67%{transform:scale(.4) translateX(-150px) translateY(-90px)}to{transform:scale(.4) translateX(-1150px) translateY(300px)}}@keyframes swim2{0%{transform:scale(.3) translateX(0)}20%{transform:scale(.3) translateX(-1000px)}25%{transform:scale(.3) translateX(-1000px)}35%{transform:scale(.3) translateX(-1000px) translateY(-90px)}50%{transform:scale(.3) translateX(-250px) translateY(10px)}60%{transform:scale(.3) translateX(-250px) translateY(-90px)}67%{transform:scale(.3) translateX(-250px) translateY(-90px)}to{transform:scale(.3) translateX(-3350px) translateY(100px)}}@keyframes swim3{0%{transform:scale(.3) translateX(0)}20%{transform:scale(.3) translateX(-550px)}25%{transform:scale(.3) translateX(-550px)}35%{transform:scale(.3) translateX(-550px) translateY(-90px)}50%{transform:scale(.3) translateX(-150px) translateY(10px)}60%{transform:scale(.3) translateX(-150px) translateY(-90px)}67%{transform:scale(.3) translateX(-150px) translateY(-90px)}to{transform:scale(.3) translateX(-2150px) translateY(100px)}}.typing-demo{font-family:monospace}