SIRO #30
Description
<!doctype html>
<title>عيد ميلاد سعيد يا سيرين 🎂</title> <style> body{ background: radial-gradient(circle at top, #ff9ab3 0%, #ff6b9a 40%, #0f1724 100%); font-family: 'Segoe UI', sans-serif; color: #fff; display: flex; align-items: center; justify-content: center; height: 100vh; flex-direction: column; overflow: hidden; margin: 0; } h1{ font-size: 2.2em; margin-bottom: 10px; text-shadow: 0 0 10px #ff8bb8; } p{ text-align: center; max-width: 400px; font-size: 1.1em; line-height: 1.5em; } .cake{ position: relative; width: 120px; height: 100px; margin: 30px 0; } .cake .layer{ position: absolute; bottom: 0; width: 100%; height: 60px; background: linear-gradient(to top, #ff8bb8, #ffd1e0); border-radius: 10px; } .cake .icing{ position: absolute; top: 0; left: 0; right: 0; height: 20px; background: #fff; border-radius: 10px 10px 0 0; } .candle{ position: absolute; top: -50px; left: 50%; transform: translateX(-50%); width: 10px; height: 50px; background: linear-gradient(to bottom, #fff3b0, #ffb86b); border-radius: 5px; } .flame{ position: absolute; top: -18px; left: 50%; transform: translateX(-50%); width: 15px; height: 25px; background: radial-gradient(circle at 50% 40%, #fff 10%, #ffd166 40%, #ff6b00 70%, transparent 100%); border-radius: 50%; animation: flicker 0.9s infinite; } @Keyframes flicker { 0%, 100% { transform: translateX(-50%) scale(1); opacity: 1; } 50% { transform: translateX(-50%) scale(1.1); opacity: 0.8; } } .hearts { position: absolute; bottom: 10%; animation: float 4s infinite ease-in-out; font-size: 22px; } @Keyframes float { 0% { transform: translateY(0); opacity: 1; } 100% { transform: translateY(-100px); opacity: 0; } } </style>🎉 عيد ميلاد سعيد يا سيرين 🎂
أتمنى لكِ يوم مثل وجهك الحلو، مليان ضحك وراحة وفرح. كل لحظة تمرّ عليك اليوم تكون بداية سنة أجمل وأخفّ همًا. ✨ من محمد 💖
💖💗💞