<?php include 'header.php'; ?>

    <!-- Start main-content -->
	<section class="page-title" style="background-image: url(images/background/page-title-bg.png);">
		<div class="auto-container">
			<div class="title-outer">
				<h1 class="title">Our Projects</h1>
			</div>
		</div>
	</section>
	<!-- end main-content -->

  <section class="projects-section pt-100 pb-70">
  <div class="auto-container">

    <div class="sec-title text-center">
      <h2>Our Recent Projects</h2>
    </div>

    <div class="row">

      <!-- Images 1 to 28 -->

      <!-- Repeat Block -->
      <!-- Image 1 -->
      <div class="col-lg-4 col-md-6 col-sm-6 mb-4">
        <a href="images/projects/01.jpeg" data-fancybox="gallery">
          <img src="images/projects/01.jpeg" class="img-fluid gallery-img" alt="Project 1">
        </a>
      </div>

      <!-- Image 3 -->
      <div class="col-lg-4 col-md-6 col-sm-6 mb-4">
        <a href="images/projects/03.jpeg" data-fancybox="gallery">
          <img src="images/projects/03.jpeg" class="img-fluid gallery-img" alt="Project 3">
        </a>
      </div>

      <!-- Image 5 -->
      <div class="col-lg-4 col-md-6 col-sm-6 mb-4">
        <a href="images/projects/05.jpeg" data-fancybox="gallery">
          <img src="images/projects/05.jpeg" class="img-fluid gallery-img" alt="Project 5">
        </a>
      </div>

      <!-- Image 6 -->
      <div class="col-lg-4 col-md-6 col-sm-6 mb-4">
        <a href="images/projects/06.jpeg" data-fancybox="gallery">
          <img src="images/projects/06.jpeg" class="img-fluid gallery-img" alt="Project 6">
        </a>
      </div>

      <!-- Image 8 -->
      <div class="col-lg-4 col-md-6 col-sm-6 mb-4">
        <a href="images/projects/08.jpeg" data-fancybox="gallery">
          <img src="images/projects/08.jpeg" class="img-fluid gallery-img" alt="Project 8">
        </a>
      </div>

      <!-- Image 10 -->
      <div class="col-lg-4 col-md-6 col-sm-6 mb-4">
        <a href="images/projects/10.jpeg" data-fancybox="gallery">
          <img src="images/projects/10.jpeg" class="img-fluid gallery-img" alt="Project 10">
        </a>
      </div>

      <!-- Image 16 -->
      <div class="col-lg-4 col-md-6 col-sm-6 mb-4">
        <a href="images/projects/16.jpeg" data-fancybox="gallery">
          <img src="images/projects/16.jpeg" class="img-fluid gallery-img" alt="Project 16">
        </a>
      </div>

      <!-- Image 17 -->
      <div class="col-lg-4 col-md-6 col-sm-6 mb-4">
        <a href="images/projects/17.jpeg" data-fancybox="gallery">
          <img src="images/projects/17.jpeg" class="img-fluid gallery-img" alt="Project 17">
        </a>
      </div>

      <!-- Image 18 -->
      <div class="col-lg-4 col-md-6 col-sm-6 mb-4">
        <a href="images/projects/18.jpeg" data-fancybox="gallery">
          <img src="images/projects/18.jpeg" class="img-fluid gallery-img" alt="Project 18">
        </a>
      </div>

      <!-- Image 19 -->
      <div class="col-lg-4 col-md-6 col-sm-6 mb-4">
        <a href="images/projects/19.jpeg" data-fancybox="gallery">
          <img src="images/projects/19.jpeg" class="img-fluid gallery-img" alt="Project 19">
        </a>
      </div>

      <!-- Image 20 -->
      <div class="col-lg-4 col-md-6 col-sm-6 mb-4">
        <a href="images/projects/20.jpeg" data-fancybox="gallery">
          <img src="images/projects/20.jpeg" class="img-fluid gallery-img" alt="Project 20">
        </a>
      </div>

      <!-- Image 23 -->
      <div class="col-lg-4 col-md-6 col-sm-6 mb-4">
        <a href="images/projects/23.jpeg" data-fancybox="gallery">
          <img src="images/projects/23.jpeg" class="img-fluid gallery-img" alt="Project 23">
        </a>
      </div>

      <!-- Image 25 -->
      <div class="col-lg-4 col-md-6 col-sm-6 mb-4">
        <a href="images/projects/25.jpeg" data-fancybox="gallery">
          <img src="images/projects/25.jpeg" class="img-fluid gallery-img" alt="Project 25">
        </a>
      </div>

      <!-- Image 28 -->
      <div class="col-lg-4 col-md-6 col-sm-6 mb-4">
        <a href="images/projects/28.jpeg" data-fancybox="gallery">
          <img src="images/projects/28.jpeg" class="img-fluid gallery-img" alt="Project 28">
        </a>
      </div>
      
        <!-- Picture 1 -->
  <div class="col-lg-4 col-md-6 col-sm-6 mb-4">
    <a href="images/projects/Picture1.jpg" data-fancybox="gallery">
      <img src="images/projects/Picture1.jpg" class="img-fluid gallery-img" alt="Project Image 1">
    </a>
  </div>

  <!-- Picture 2 -->
  <div class="col-lg-4 col-md-6 col-sm-6 mb-4">
    <a href="images/projects/Picture2.png" data-fancybox="gallery">
      <img src="images/projects/Picture2.png" class="img-fluid gallery-img" alt="Project Image 2">
    </a>
  </div>

  <!-- Picture 3 -->
  <div class="col-lg-4 col-md-6 col-sm-6 mb-4">
    <a href="images/projects/Picture3.jpg" data-fancybox="gallery">
      <img src="images/projects/Picture3.jpg" class="img-fluid gallery-img" alt="Project Image 3">
    </a>
  </div>

  <!-- Picture 4 -->
  <div class="col-lg-4 col-md-6 col-sm-6 mb-4">
    <a href="images/projects/Picture4.jpg" data-fancybox="gallery">
      <img src="images/projects/Picture4.jpg" class="img-fluid gallery-img" alt="Project Image 4">
    </a>
  </div>

  <!-- Picture 6 -->
  <div class="col-lg-4 col-md-6 col-sm-6 mb-4">
    <a href="images/projects/Picture6.jpg" data-fancybox="gallery">
      <img src="images/projects/Picture6.jpg" class="img-fluid gallery-img" alt="Project Image 6">
    </a>
  </div>

  <!-- 29 -->
  <div class="col-lg-4 col-md-6 col-sm-6 mb-4">
    <a href="images/projects/29.jpeg" data-fancybox="gallery">
      <img src="images/projects/29.jpeg" class="img-fluid gallery-img" alt="Project Image 29">
    </a>
  </div>

  <!-- 30 -->
  <div class="col-lg-4 col-md-6 col-sm-6 mb-4">
    <a href="images/projects/30.jpeg" data-fancybox="gallery">
      <img src="images/projects/30.jpeg" class="img-fluid gallery-img" alt="Project Image 30">
    </a>
  </div>

    </div>
  </div>
</section>


<script src="https://cdn.jsdelivr.net/npm/@fancyapps/ui/dist/fancybox.umd.js"></script>
<script>
  Fancybox.bind("[data-fancybox='gallery']", {
    Thumbs: false,
    Toolbar: true,
  });
</script>


<?php include 'footer.php'; ?>