OPCODE-Open-Spring-Fest · MD-IRFAN-RAJ · Oct 13, 2025 · Oct 13, 2025 · Oct 13, 2025 · Oct 13, 2025
diff --git a/bihar-culture-landing/assets/images/folksong.jpg b/bihar-culture-landing/assets/images/folksong.jpg
diff --git a/bihar-culture-landing/assets/images/madhubani.jpg b/bihar-culture-landing/assets/images/madhubani.jpg
diff --git a/bihar-culture-landing/assets/images/silk.jpg b/bihar-culture-landing/assets/images/silk.jpg
diff --git a/bihar-culture-landing/culture.html b/bihar-culture-landing/culture.html
@@ -2,43 +2,107 @@
 <html lang="en">
 <head>
   <meta charset="UTF-8">
-  <title>Bihar Culture</title>
+  <title>Bihar Culture & Arts</title>
   <link rel="stylesheet" href="style.css">
 </head>
+
 <body>
-  <header class="sub-hero">
-    <h1>Culture & Arts</h1>
+
+  <!-- ===== HEADER ===== -->
+  <header>
+    <div class="header-content">
+      <h1>Culture & Arts of Bihar</h1>
+      <h2>Where Tradition Meets Timeless Beauty</h2>
+      <p class="tagline">Explore the rich art, music, and heritage that define the soul of Bihar.</p>
+    </div>
   </header>
 
-  <nav>
-    <a href="index.html">Home</a>
-    <a href="culture.html">Culture</a>
-    <a href="history.html">History</a>
-    <a href="festivals.html">Festivals</a>
-    <a href="tourism.html">Tourism</a>
-    <a href="modern.html">Modern Bihar</a>
+  <!-- ===== NAVIGATION ===== -->
+  <nav class="main-navigation">
+    <div class="nav-container">
+      <a href="index.html" class="nav-link">Home</a>
+      <a href="culture.html" class="nav-link active">Culture</a>
+      <a href="history.html" class="nav-link">History</a>
+      <a href="festivals.html" class="nav-link">Festivals</a>
+      <a href="tourism.html" class="nav-link">Tourism</a>
+      <a href="modern.html" class="nav-link">Modern Bihar</a>
+    </div>
   </nav>
 
-  <main>
-    <section>
-      <h2>Madhubani Art</h2>
-      <p>Famous traditional painting style originating from Mithila region.</p>
-      <img src="assets/images/madhubani.jpg" alt="Madhubani Art">
+  <!-- ===== MAIN CONTENT ===== -->
+  <main class="main-content">
+
+    <!-- Hero Intro -->
+    <section class="hero-section">
+      <div class="hero-content">
+        <h2>Experience Bihar’s Artistic Legacy</h2>
+        <p>From Madhubani paintings to Bhagalpuri silk, Bihar’s cultural heritage blends creativity and tradition. These art forms are not just beautiful—they tell stories of devotion, nature, and everyday life.</p>
+      </div>
     </section>
 
-    <section>
-      <h2>Bhojpuri Folk Songs</h2>
-      <p>Rich oral tradition of songs sung during festivals and weddings.</p>
+    <!-- ===== FEATURED ART FORMS ===== -->
+    <div class="features-grid">
+
+      <div class="feature-card">
+        <img src="assets/images/madhubani.jpg" alt="Madhubani Art" style="width:100%; border-radius:12px; margin-bottom:1rem;">
+        <h3>Madhubani Art</h3>
+        <p>Famous traditional painting style originating from Mithila, known for its vibrant colors and mythological themes.</p>
+        <a href="#" class="explore-link">Explore More →</a>
+      </div>
+
+      <div class="feature-card">
+        <img src="assets/images/folksong.jpg" alt="Bhojpuri Folk Songs" style="width:100%; border-radius:12px; margin-bottom:1rem;">
+        <h3>Bhojpuri Folk Songs</h3>
+        <p>Rich oral tradition of songs sung during weddings, harvests, and festivals, reflecting local joy and emotion.</p>
+        <a href="#" class="explore-link">Listen Now →</a>
+      </div>
+
+      <div class="feature-card">
+        <img src="assets/images/silk.jpg" alt="Bhagalpuri Silk" style="width:100%; border-radius:12px; margin-bottom:1rem;">
+        <h3>Bhagalpuri Silk</h3>
+        <p>Known as ‘Tussar Silk’, handwoven in Bhagalpur, cherished worldwide for its texture and natural sheen.</p>
+        <a href="#" class="explore-link">View Collection →</a>
+      </div>
+
+    </div>
+
+    <!-- ===== CULTURE HIGHLIGHTS ===== -->
+    <section class="highlights-section">
+      <h2>Cultural Highlights</h2>
+      <div class="highlights-grid">
+        <div class="highlight-item">
+          <h4>Classical Dance</h4>
+          <p>Vibrant forms like Jat-Jatin and Bidesia bring Bihar’s folk energy to life.</p>
+        </div>
+        <div class="highlight-item">
+          <h4>Traditional Attire</h4>
+          <p>Women wear Madhubani-printed sarees, while men don Dhoti-Kurta during festivals.</p>
+        </div>
+        <div class="highlight-item">
+          <h4>Cultural Fairs</h4>
+          <p>Chhath Puja and Sonepur Mela are major events showcasing devotion and tradition.</p>
+        </div>
+      </div>
     </section>
 
-    <section>
-      <h2>Bhagalpuri Silk</h2>
-      <p>Known as ‘Tussar Silk’, handwoven in Bhagalpur, cherished worldwide.</p>
+    <!-- ===== CALL TO ACTION ===== -->
+    <section class="call-to-action">
+      <div class="cta-content">
+        <h2>Want to Contribute to Bihar’s Cultural Archive?</h2>
+        <p>Help us preserve Bihar’s artistic legacy by sharing stories, pictures, and experiences from your region.</p>
+        <a href="#" class="cta-button">Contribute Now</a>
+      </div>
     </section>
+
   </main>
 
+  <!-- ===== FOOTER ===== -->
   <footer>
-    <p>Contribute more cultural content here!</p>
+    <div class="footer-content">
+      <p>© 2025 Bihar Culture | Designed with ❤️ by Swasti Jain</p>
+      <p>Celebrating the spirit, art, and heritage of Bihar.</p>
+    </div>
   </footer>
+
 </body>
 </html>
diff --git a/bihar-culture-landing/style.css b/bihar-culture-landing/style.css
@@ -494,3 +494,18 @@ footer {
     transform: translateY(0);
   }
 }
+
+
+.feature-card img {
+  width: 100%;
+  height: 220px;              /* ✅ Fixed height for uniform cards */
+  object-fit: cover;          /* ✅ Keeps aspect ratio & crops neatly */
+  border-radius: 12px;
+  margin-bottom: 1rem;
+  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
+  transition: transform 0.3s ease;
+}
+
+.feature-card img:hover {
+  transform: scale(1.03);     /* ✅ Adds subtle hover zoom */
+}