<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Rangpur City - Culture</title>
  <link rel="stylesheet" href="style.css">
</head>
<body>

<header>
  <div class="container header-center">
    <div class="logo-center">
      <img src="logo.png" alt="Rangpur City Logo" class="logo-img">
    </div>

    <nav class="nav-center">
      <ul>
        <li><a href="index.html">Home</a></li>
        <li><a href="about.html">About</a></li>
        <li><a href="places.html">Places</a></li>
        <li><a href="food.html">Food</a></li>
        <li><a href="culture.html" class="active">Culture</a></li>
        <li><a href="contact.html">Contact</a></li>
      </ul>
    </nav>
  </div>
</header>

<main>
  <div class="container">
    <h2 class="section-title">Culture and Traditions</h2>

    <div class="banner">
      <p>Rangpur has a rich local culture. People celebrate festivals, wear traditional clothes, enjoy folk music, and follow family traditions with pride.</p>
    </div>

    <div class="grid">
      <div class="card">
        <img src="nouka.jpg" alt="Festivals" class="card-img">
        <h3>Festivals</h3>
        <p>Religious and seasonal festivals are celebrated with joy. People spend time with family and neighbours.</p>
      </div>

      <div class="card">
        <img src="music.jpg" alt="Music" class="card-img">
        <h3>Music</h3>
        <p>Folk songs and local music are part of cultural identity in northern Bangladesh.</p>
      </div>

      <div class="card">
        <img src="dress.jpg" alt="Clothing" class="card-img">
        <h3>Clothing</h3>
        <p>Traditional dresses such as saree, salwar kameez, and panjabi are popular during special events.</p>
      </div>

      <div class="card">
        <img src="language.jpg" alt="Language" class="card-img">
        <h3>Language</h3>
        <p>Bengali is the main language, and local dialects add unique cultural identity.</p>
      </div>

      <div class="card">
        <img src="religions.jpg" alt="Religion" class="card-img">
        <h3>Religion</h3>
        <p>People follow different religions peacefully and celebrate together with harmony.</p>
      </div>

      <div class="card">
        <img src="craft.jpg" alt="Craft" class="card-img">
        <h3>Handicrafts</h3>
        <p>Local handmade crafts and traditional arts are important parts of culture.</p>
      </div>
    </div>

    <div class="card" style="margin-top: 25px;">
      <h3>Simple Cultural Points</h3>
      <ul class="list">
        <li>People respect family values and local customs.</li>
        <li>Traditional food is important during festivals.</li>
        <li>Village life keeps many cultural traditions alive.</li>
        <li>Local hospitality makes visitors feel welcome.</li>
      </ul>
    </div>

    <div class="page-buttons">
      <a href="index.html" class="nav-btn">Home</a>
      <a href="about.html" class="nav-btn">About</a>
      <a href="places.html" class="nav-btn">Places</a>
      <a href="food.html" class="nav-btn">Food</a>
      <a href="culture.html" class="nav-btn active-btn">Culture</a>
      <a href="contact.html" class="nav-btn">Contact</a>
    </div>
  </div>
</main>

<footer>
  <p>&copy; 2026 Rangpur City Website | Swastika Sarker</p>
</footer>

</body>
</html>