``````css.firework {position: absolute;Top: 0;left: 0;width: 10px;height: 10px;background-color: f00;border-radius: 50%;animation: firework 5s infinite;}.fuse {position: absolute;top: -20px;left: 5px;width: 2px;height: 20px;background-color: fff;animation: fuse 5s infinite;}.burst {position: absolute;top: -10px;left: 5px;width: 20px;height: 20px;background-color: ff0;border-radius: 50%;animation: burst 5s infinite;}.star {position: absolute;top: 0;left: 0;width: 2px;height: 2px;background-color: fff;border-radius: 50%;animation: star 5s infinite;}@keyframes firework{0% {top: 0;left: 0;}50% {top: 50vh;left: 50vw;}100% {top: 100vh;left: 100vw;}}@keyframes fuse {0% {top: -20px;opaCity: 1;}50% {top: 0;opacity: 0;}100% {top: -20px;opacity: 1;}}@keyframes burst {0% {top: -10px;width: 20px;height: 20px;opacity: 0;}50% {top: -50px;width: 100px;height: 100px;opacity: 1;}100% {top: -10px;width: 20px;height: 20px;opacity: 0;}}@keyframes star {0% {top: 0;left: 0;opacity: 1;}50% {top: 50px;left: 50px;opacity: 0;}100% {top: 0;left: 0;opacity: 1;}}```

``````css.red-envelope {width: 200px;height: 100px;perspective: 1000px;position: relative;}.front, .back, .flap, .money {width: 200px;height: 100px;position: absolute;backface-visibility: hidden;}.front {transform: translateZ(100px) rotateY(0deg);}.back {transform: translateZ(100px) rotateY(180deg);}.flap {transform: translateZ(50px) rotateY(90deg);transition: transform 0.5s ease-in-out;}.money {transform: translateZ(50px) rotateY(-90deg);}.red-envelope:hover .flap {transform: translateZ(50px) rotateY(0deg);}```

``````csssvg {width: 100px;height: 100px;animation: lantern 5s infinite;}@keyframes lantern{0% {transform: scale(1);}50% {transform: scale(1.2);}100% {transform: scale(1);}}```