<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Government Service Assistance Center</title> <style> @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&family=Roboto:wght@400;500&display=swap'); body { margin: 0; padding: 0; font-family: 'Poppins', sans-serif; background: linear-gradient(135deg, #0f172a 0%, #1e2937 100%); color: white; display: flex; justify-content: center; align-items: center; min-height: 100vh; } .poster { width: 100%; max-width: 1200px; background: white; color: #1e2937; border-radius: 20px; overflow: hidden; box-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.4); margin: 20px; } .header { background: linear-gradient(90deg, #1e40af 0%, #3b82f6 100%); padding: 30px 40px; position: relative; color: white; text-align: center; } .header::before { content: ''; position: absolute; top: -50%; right: -10%; width: 300px; height: 300px; background: rgba(255,255,255,0.15); border-radius: 50%; z-index: 1; } .logo { display: inline-flex; align-items: center; gap: 15px; margin-bottom: 15px; } .logo-icon { background: white; color: #1e40af; width: 70px; height: 70px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 36px; font-weight: bold; box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.3); } .title { font-size: 42px; font-weight: 700; margin: 0; text-shadow: 0 4px 6px rgba(0,0,0,0.3); letter-spacing: -1px; } .subtitle { font-size: 22px; margin: 8px 0 0; opacity: 0.95; font-weight: 500; } .badge { position: absolute; top: 25px; right: 40px; background: #f59e0b; color: white; padding: 12px 25px; border-radius: 9999px; font-weight: 700; font-size: 18px; box-shadow: 0 10px 15px -3px rgb(245 158 11 / 0.4); transform: rotate(12deg); } .tagline { background: #dc2626; color: white; padding: 12px; text-align: center; font-size: 18px; font-weight: 600; } .content { padding: 40px; display: grid; grid-template-columns: 1fr 380px; gap: 35px; } .services { display: flex; flex-direction: column; gap: 18px; } .service-card { background: #f8fafc; border-radius: 16px; padding: 20px; display: flex; align-items: flex-start; gap: 18px; border-left: 6px solid #3b82f6; transition: all 0.3s ease; } .service-card:hover { transform: translateY(-4px); box-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1); } .service-icon { width: 52px; height: 52px; background: #dbeafe; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 28px; flex-shrink: 0; } .service-text h3 { margin: 0 0 6px 0; color: #1e40af; font-size: 20px; } .fees { background: #fff1f2; border-radius: 16px; padding: 25px; border: 2px solid #fda4af; } .fees h2 { color: #e11d48; margin: 0 0 20px 0; font-size: 24px; text-align: center; } .fee-row { display: flex; justify-content: space-between; align-items: center; padding: 14px 0; border-bottom: 1px dashed #fda4af; font-size: 18px; } .fee-row:last-child { border-bottom: none; } .fee-amount { background: #e11d48; color: white; padding: 6px 18px; border-radius: 9999px; font-weight: 700; font-size: 19px; } .location { background: linear-gradient(135deg, #0ea5e9, #22d3ee); color: white; border-radius: 16px; padding: 25px; margin-bottom: 25px; } .map-visual { height: 180px; background: url('https://picsum.photos/id/1015/800/300') center/cover; border-radius: 12px; margin: 15px 0; position: relative; } .map-pin { position: absolute; top: 50%; left: 55%; transform: translate(-50%, -50%); font-size: 42px; filter: drop-shadow(0 4px 6px rgba(0,0,0,0.3)); } .timing { background: #ecfdf5; border-radius: 16px; padding: 22px; } .timing h3 { color: #10b981; margin-top: 0; } .contact-bar { background: #1e2937; color: white; padding: 22px 40px; display: flex; align-items: center; justify-content: space-between; font-size: 20px; } .phone { font-size: 32px; font-weight: 700; letter-spacing: 2px; } .documents { margin-top: 30px; padding-top: 25px; border-top: 2px dashed #cbd5e1; } .doc-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); gap: 15px; margin-top: 15px; } .doc-item { text-align: center; background: #f1f5f9; padding: 12px 8px; border-radius: 12px; font-size: 13px; font-weight: 500; } .footer { background: #1e40af; color: white; text-align: center; padding: 22px; font-size: 18px; font-weight: 600; } .star { color: #fbbf24; } </style> </head> <body> <div class="poster"> <!-- HEADER --> <div class="header"> <div class="logo"> <div class="logo-icon">ποΈ</div> <div> <div style="font-size:18px; opacity:0.9;">GOVERNMENT OF INDIA</div> </div> </div> <h1 class="title">GOVERNMENT SERVICE<br>ASSISTANCE CENTER</h1> <p class="subtitle">Fast β’ Easy β’ Reliable Help for All Services</p> <div class="badge">β TRUSTED β’ β QUICK β’ β DIGITAL</div> </div> <div class="tagline"> β Hassle-Free β’ β Transparent β’ β 100% Digital Services </div> <div class="content"> <!-- LEFT COLUMN --> <div> <div class="services"> <div class="service-card"> <div class="service-icon">π</div> <div class="service-text"> <h3>DBT (Direct Benefit Transfer)</h3> <p>Link your bank account instantly for government benefits</p> </div> </div> <div class="service-card"> <div class="service-icon">πͺͺ</div> <div class="service-text"> <h3>ABHA (Ayushman Bharat) Card</h3> <p>Create your Health ID card online</p> </div> </div> <div class="service-card"> <div class="service-icon">πΊ</div> <div class="service-text"> <h3>Anupurna Bhandar Form</h3> <p>Online submission for ration & food security</p> </div> </div> </div> <!-- LOCATION --> <div class="location"> <h3 style="margin:0 0 12px 0; font-size:22px;">π OUR LOCATION</h3> <div class="map-visual"> <span class="map-pin">π</span> </div> <p><strong>Bishnupur State Bank Branch Side,</strong><br> Ramkrishna Pally, Radhalaya Road, Near Thakur Talimi School,<br> <strong>Opposite last house on the road.</strong></p> </div> <!-- DOCUMENTS --> <div class="documents"> <h3 style="color:#334155; margin-bottom:12px;">π REQUIRED DOCUMENTS</h3> <div class="doc-grid"> <div class="doc-item">Aadhaar Card</div> <div class="doc-item">Bank Passbook</div> <div class="doc-item">Mobile Linked Aadhaar</div> <div class="doc-item">PAN Card</div> <div class="doc-item">Pension Card</div> <div class="doc-item">Voter Card</div> <div class="doc-item">Any Other Proof</div> </div> </div> </div> <!-- RIGHT COLUMN --> <div> <!-- FEES --> <div class="fees"> <h2>π° SERVICE CHARGES</h2> <div class="fee-row"> <span><strong>DBT Link</strong></span> <span class="fee-amount">βΉ20</span> </div> <div class="fee-row"> <span><strong>ABHA Card</strong></span> <span class="fee-amount">βΉ25</span> </div> <div class="fee-row"> <span><strong>Anupurna Bhandar Form</strong></span> <span class="fee-amount">βΉ50</span> </div> </div> <!-- TIMING --> <div class="timing"> <h3>π OPERATING HOURS</h3> <p><strong>Every Sunday:</strong> 10:00 AM - 8:00 PM</p> <p><strong>Other Days:</strong> 9:00 AM - 8:00 PM</p> </div> <!-- HOW TO REACH --> <div style="background:#fefce8; padding:22px; border-radius:16px; margin-top:25px;"> <h3 style="color:#854d0e; margin-top:0;">πΆ VISIT US OR CONTACT</h3> <p><strong>β Walk-in at our center</strong></p> <p style="margin:15px 0;">OR</p> <div style="background:white; padding:15px; border-radius:12px; display:flex; align-items:center; gap:12px;"> <span style="font-size:42px;">π¬</span> <div> <strong>WhatsApp / Online</strong><br> Send documents for quick assistance </div> </div> </div> <!-- CONTACT --> <div style="background:#166534; color:white; padding:28px; border-radius:16px; margin-top:25px; text-align:center;"> <p style="margin:0 0 8px 0; font-size:18px;">π FOR ANY HELP CALL</p> <div class="phone">76998 44219</div> </div> </div> </div> <div class="footer"> β No time limit β’ Services available every day β<br> <span style="font-size:15px; opacity:0.9;">Your Service β’ Our Responsibility</span> </div> </div> </body> </html>
government service poster
PDF Document Β· PDF
Create high-resolution PNG images for printing
government service poster PRINT
Image Β· PNG
government service poster WEB
Image Β· PNG