<!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>
🎉 عيد ميلاد سعيد يا سيرين 🎂
أتمنى لكِ يوم مثل وجهك الحلو، مليان ضحك وراحة وفرح.
كل لحظة تمرّ عليك اليوم تكون بداية سنة أجمل وأخفّ همًا. ✨
من محمد 💖
💖💗💞
<!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>🎉 عيد ميلاد سعيد يا سيرين 🎂
أتمنى لكِ يوم مثل وجهك الحلو، مليان ضحك وراحة وفرح. كل لحظة تمرّ عليك اليوم تكون بداية سنة أجمل وأخفّ همًا. ✨ من محمد 💖