<!DOCTYPE html> <html lang="gu"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>રઘુવંશી સમાજ પરિચય સંમેલન</title> <style> @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Gujarati:wght@400;700&display=swap'); body { font-family: 'Noto Sans Gujarati', sans-serif; background-color: #f4f4f4; display: flex; justify-content: center; align-items: center; min-height: 100vh; margin: 0; padding: 20px; } .card { background: white; width: 100%; max-width: 400px; border-radius: 15px; box-shadow: 0 10px 25px rgba(0,0,0,0.1); overflow: hidden; border: 2px solid #e67e22; position: relative; } .header { background: linear-gradient(135deg, #ff9966 0%, #ff5e62 100%); color: white; text-align: center; padding: 20px; position: relative; } .om { font-size: 2rem; opacity: 0.8; margin-bottom: 5px; display: block; } .title { font-size: 1.4rem; font-weight: 700; margin: 0; line-height: 1.3; } .subtitle { font-size: 1rem; margin-top: 5px; opacity: 0.9; } .content { padding: 25px 20px; text-align: center; } .date-box { background-color: #fff3e0; color: #d35400; display: inline-block; padding: 8px 16px; border-radius: 50px; font-weight: bold; margin-bottom: 20px; border: 1px solid #ffe0b2; } .status-container { display: flex; flex-direction: column; gap: 15px; margin-bottom: 20px; } .status-box { padding: 15px; border-radius: 8px; border-left: 5px solid; text-align: left; } .male { background-color: #ffebee; border-left-color: #c62828; color: #c62828; } .female { background-color: #e8f5e9; border-left-color: #2e7d32; color: #2e7d32; } .label { font-size: 0.9rem; font-weight: bold; display: block; margin-bottom: 4px; text-transform: uppercase; } .status-text { font-size: 1.1rem; font-weight: 700; } .note { font-size: 0.95rem; color: #555; margin-bottom: 25px; line-height: 1.5; background: #f9f9f9; padding: 10px; border-radius: 8px; } .contact-btn { background-color: #25D366; color: white; text-decoration: none; padding: 12px 25px; border-radius: 50px; font-weight: bold; display: inline-flex; align-items: center; gap: 10px; transition: transform 0.2s; box-shadow: 0 4px 6px rgba(0,0,0,0.1); } .contact-btn:hover { transform: scale(1.05); background-color: #128C7E; } .footer { background-color: #333; color: white; text-align: center; padding: 10px; font-size: 0.8rem; } .decorative-line { height: 4px; background: repeating-linear-gradient(45deg, #e67e22, #e67e22 10px, #fff 10px, #fff 20px); margin-bottom: 0; } .contact-name { display: block; margin-bottom: 5px; color: #333; font-weight: bold; } </style> </head> <body> <div class="card"> <div class="decorative-line"></div> <div class="header"> <span class="om">🕉️</span> <h1 class="title">રઘુવંશી સમાજ રામ ગ્રુપ</h1> <p class="subtitle">પરિચય સંમેલન - ૨૦૨૫</p> </div> <div class="content"> <div class="date-box"> 📅 તા. ૧૪/૧૨/૨૦૨૫ </div> <div class="status-container"> <!-- Male Status --> <div class="status-box male"> <span class="label">ભાઈ ઉમેદવારો (Male)</span> <span class="status-text">❌ જગ્યા ભરાઈ ગઈ છે (FULL)</span> </div> <!-- Female Status --> <div class="status-box female"> <span class="label">બહેન ઉમેદવારો (Female)</span> <span class="status-text">✅ થોડી બેઠકો ખાલી છે</span> </div> </div> <p class="note"> જે બહેન ઉમેદવારોએ હજુ સુધી રજીસ્ટ્રેશન કરાવ્યું નથી, તેમને આજે જ રજીસ્ટ્રેશન કરાવી લેવા વિનંતી. </p> <span class="contact-name">સંપર્ક: દીપ્તિ બેન</span> <a href="tel:+919276252602" class="contact-btn"> 📞 +91 92762 52602 </a> </div> <div class="footer"> જય રઘુવંશી | જય સિયારામ </div> </div> </body> </html>
