@keyframes bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-100px)}}.bounce{width:100px;height:100px;background-color:#e74c3c;border-radius:50%;animation:bounce 2s infinite}@keyframes fadeIn{0%{opacity:0}100%{opacity:1}}.fade-in{opacity:0;animation:fadeIn 3s forwards}@keyframes rotate{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}.rotate{width:100px;height:100px;background-color:#f1c40f;animation:rotate 2s linear infinite}@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.5)}}.pulse{width:100px;height:100px;border-radius:50%;animation:pulse 2s infinite}.box{width:200px;height:100px;margin:20px;background-color:#3498db;color:#fff;display:flex;justify-content:center;align-items:center;font-family:Arial,sans-serif;opacity:0}@keyframes fadeInLeft{0%{transform:translateX(-100%);opacity:0}100%{transform:translateX(0);opacity:1}}@keyframes fadeInRight{0%{transform:translateX(100%);opacity:0}100%{transform:translateX(0);opacity:1}}@keyframes fadeInTop{0%{transform:translateY(-100%);opacity:0}100%{transform:translateY(0);opacity:1}}@keyframes fadeInBottom{0%{transform:translateY(100%);opacity:0}100%{transform:translateY(0);opacity:1}}.fade-in-left{animation:fadeInLeft 2s forwards}.fade-in-right{animation:fadeInRight 2s forwards}.fade-in-top{animation:fadeInTop 2s forwards}.fade-in-bottom{animation:fadeInBottom 2s forwards}.box1{width:200px;height:100px;background-color:#3498db;color:#fff;display:flex;justify-content:center;align-items:center;font-family:Arial,sans-serif;margin:20px}@keyframes slideInLeft{0%{transform:translateX(-100%);opacity:0}100%{transform:translateX(0);opacity:1}}@keyframes slideInRight{0%{transform:translateX(100%);opacity:0}100%{transform:translateX(0);opacity:1}}@keyframes slideInTop{0%{transform:translateY(-100%);opacity:0}100%{transform:translateY(0);opacity:1}}@keyframes slideInBottom{0%{transform:translateY(100%);opacity:0}100%{transform:translateY(0);opacity:1}}.slide-left{animation:slideInLeft 1s ease-out forwards}.slide-right{animation:slideInRight 1s ease-out forwards}.slide-top{animation:slideInTop 1s ease-out forwards}.slide-bottom{animation:slideInBottom 1s ease-out forwards}