Untitled

<section id="project">
        <div class="d-flex flex-column align-items-center">
            <div class="text-center container w-50 mb-4">
                <h2 class="text-construction fw-bold ">Our Project</h2>
                <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Tempore cum labore fugiat vitae enim
                    iure
                    nostrum eligendi voluptate, aperiam unde.</p>
            </div>

            <!-- Tabs Js -->
            <ul>
                <li class="list list-active" data-filter="all">All</li>
                <li class="list" data-filter="remodelling">Remodelling</li>
                <li class="list" data-filter="construction">Construction</li>
                <li class="list" data-filter="repairs">Repairs</li>
                <li class="list" data-filter="design">Design</li>
            </ul>

            <div class="tab-list">
                <div class="tab-box remodelling">
                    <img src="https://bootstrapmade.com/demo/templates/UpConstruction/assets/img/features-1.jpg"
                        alt="tab">
                </div>
                <div class="tab-box construction">
                    <img src="https://bootstrapmade.com/demo/templates/UpConstruction/assets/img/features-2.jpg"
                        alt="tab">
                </div>
                <div class="tab-box repairs">
                    <img src="https://bootstrapmade.com/demo/templates/UpConstruction/assets/img/features-3.jpg"
                        alt="tab">
                </div>
                <div class="tab-box design">
                    <img src="https://bootstrapmade.com/demo/templates/UpConstruction/assets/img/features-4.jpg"
                        alt="tab">
                </div>
            </div>
        </div>
    </section>