File Content: index.php <?php //Header File include 'header.php'; ?> <!-- =========== Start Main Area ========= --> <main class="site-main"> <!-- =========== Start Banner Area ========= --> <section class="site-banner"> <div class="container"> <div class="row"> <div class="col-lg-6 col-md-12"> <div class="site-title"> <h3 class="title-text">Hey</h3> <h2 class="title-text text-uppercase">I am Jewel</h2> <h4 class="title-text text-uppercase">Senior Wordpress Developer</h4> <div class="site-buttons"> <div class="d-flex flex-row flex-wrap"> <button type="button" class="btn button primary-button mr-4 text-uppercase">Hire me</button> <button type="button" class="btn button secondary-button text-uppercase">Get cv</button> </div> </div> </div> </div> <div class="col-lg-6 col-md-12"> <div class="banner-image"> <img src="./img/banner/banner-image.png" alt="" class="img-fluid"> </div> </div> </div> </div> </section> <!-- =========== End Banner Area ========= --> <!-- =========== End About Area ========= --> <div class="about-area"> <div class="container-fluid"> <div class="row"> <div class="col-lg-6 col-md-12"> <div class="about-image"> <img src="./img/about-us.png" alt=""> </div> </div> <div class="col-lg-6 col-md-12"> <div class="about-title"> <h2 class="text-uppercase pt-5"> <span>Let me</span> <span>introduce</span> <span>myself</span> </h2> <div class="paragrap py-4 w-75"> <p class="para">Lorem ipsum dolor sit amet consectetur adipisicing elit. Sit, eligendi?</p> <p class="para">Lorem ipsum dolor, sit amet consectetur adipisicing elit. Pariatur rem delectus odio molestias amet nisi.</p> </div> <button type="button" class="btn button primary-button text-uppercase">Download cv</button> </div> </div> </div> </div> </section> <!-- =========== End About Area ========= --> <!-- =========== Start Brand Area ========= --> <section class="brand-area"> <div class="container-fluid"> <div class="row"> <div class="col-xl-6 col-lg-12 col-md-12"> <div class="row"> <div class="col-lg-4 col-md-4 col-sm-6"> <div class="single-brand"> <img src="./img/brands/logo1.png" alt="Brand-1"> </div> </div> <div class="col-lg-4 col-md-4 col-sm-6"> <div class="single-brand"> <img src="./img/brands/logo2.png" alt="Brand-2"> </div> </div> <div class="col-lg-4 col-md-4 col-sm-6"> <div class="single-brand"> <img src="./img/brands/logo3.png" alt="Brand-3"> </div> </div> <div class="col-lg-4 col-md-4 col-sm-6"> <div class="single-brand"> <img src="./img/brands/logo4.png" alt="Brand-4"> </div> </div> <div class="col-lg-4 col-md-4 col-sm-6"> <div class="single-brand"> <img src="./img/brands/logo5.png" alt="Brand-5"> </div> </div> <div class="col-lg-4 col-md-4 col-sm-6"> <div class="single-brand"> <img src="./img/brands/logo6.png" alt="Brand-6"> </div> </div> <div class="col-lg-4 col-md-4 col-sm-6"> <div class="single-brand"> <img src="./img/brands/logo7.png" alt="Brand-7"> </div> </div> <div class="col-lg-4 col-md-4 col-sm-6"> <div class="single-brand"> <img src="./img/brands/logo8.png" alt="Brand-8"> </div> </div> <div class="col-lg-4 col-md-4 col-sm-6"> <div class="single-brand"> <img src="./img/brands/logo9.png" alt="Brand-9"> </div> </div> </div> </div> <div class="col-xl-6 col-lg-12 col-md-12"> <div class="experience-area"> <div class="d-flex flex-row years-area"> <h2 class="p-3 years">10</h2> <h2> <span>Years</span> <span>Experience</span> <span>Working</span> </h2> </div> <div class="d-flex flex-row flex-wrap call-area"> <span><i class="fas fa-phone-alt fa-3x px-3"></i></span> <div class="call-now"> <a href="#" class="text-uppercase h4 font-roboto">Call Now</a> <span class="font-roboto py-2">(+880)-1826103631</span> </div> </div> <div class="bg-panel"></div> </div> </div> </div> </div> </section> <!-- =========== End Brand Area ========= --> <!-- =========== Start Service Area ========= --> <section class="services-area"> <div class="container"> <div class="row"> <div class="col-lg-12 text-center services-list"> <h2 class="text-uppercase title-text">Services Offer</h2> <p class="para">Lorem ipsum dolor, sit amet consectetur adipisicing elit. Possimus est, rerum quos ipsa facere quis!</p> </div> </div> <div class="container services-list"> <div class="row"> <div class="col-lg-3 col-md-6 col-sm-12"> <div class="services"> <div class="services-img text-center py-4"> <img src="./img/services/s1.png" alt="Service-1"> </div> <div class="card-body text-center"> <h5 class="card-title text-uppercase font-roboto">Wp Developer</h5> <p class="card-text text-secondary"> Some quick example text to build on the card title and make up the bulk of the card's content. </p> </div> </div> </div> <div class="col-lg-3 col-md-6 col-sm-12"> <div class="services"> <div class="services-img text-center py-4"> <img src="./img/services/s2.png" alt="Service-2"> </div> <div class="card-body text-center"> <h5 class="card-title text-uppercase font-roboto">ui/ux design</h5> <p class="card-text text-secondary"> Some quick example text to build on the card title and make up the bulk of the card's content. </p> </div> </div> </div> <div class="col-lg-3 col-md-6 col-sm-12"> <div class="services"> <div class="services-img text-center py-4"> <img src="./img/services/s3.png" alt="Service-3"> </div> <div class="card-body text-center"> <h5 class="card-title text-uppercase font-roboto">Web Developer</h5> <p class="card-text text-secondary"> Some quick example text to build on the card title and make up the bulk of the card's content. </p> </div> </div> </div> <div class="col-lg-3 col-md-6 col-sm-12"> <div class="services"> <div class="services-img text-center py-4"> <img src="./img/services/s4.png" alt="Service-4"> </div> <div class="card-body text-center"> <h5 class="card-title text-uppercase font-roboto">seo optize</h5> <p class="card-text text-secondary"> Some quick example text to build on the card title and make up the bulk of the card's content. </p> </div> </div> </div> </div> </div> </div> </section> <!-- =========== End Service Area ========= --> <!-- =========== Start Project Area ========= --> <section class="project-area"> <div class="container"> <div class="project-title pb-5"> <h2 class="text-uppercase title-h1 pb-5">Recentl Done Project</h2> <h2 class="text-uppercase pb-5 title-h1 ">Quality Work</h2> </div> <div class="button-group"> <button type="button" class="active" id="btn1" data-filter="*">All</button> <button type="button" data-filter=".popular">Popular</button> <button type="button" data-filter=".latest">Latest</button> <button type="button" data-filter=".following">Following</button> <button type="button" data-filter=".upcoming">Upcoming</button> </div> <div class="row grid"> <div class="col-lg-4 col-md-6 col-sm-12 element-item latest"> <div class="our-project"> <div class="img"> <a class="test-popup-link" href="./img/portfolio/p2.jpg"> <img src="./img/portfolio/p1.jpg" alt="portfolio-1"> </a> </div> <div class="title py-4"> <h4 class="text-uppercase">Minimal Design</h4> <span class="text-secondary">Latest,Portfolio</span> </div> </div> </div> <div class="col-lg-4 col-md-6 col-sm-12 element-item popular"> <div class="our-project"> <div class="img"> <a class="test-popup-link" href="./img/portfolio/p2.jpg"> <img src="./img/portfolio/p2.jpg" alt="portfolio-2" class="img-fluid"> </a> </div> <div class="title py-4"> <h4 class="text-uppercase">Paint Wall</h4> <span class="text-secondary">Popular, Portfolio</span> </div> </div> </div> <div class="col-lg-4 col-md-6 col-sm-12 element-item popular"> <div class="our-project"> <div class="img"> <a class="test-popup-link" href="./img/portfolio/p3.jpg"> <img src="./img/portfolio/p3.jpg" alt="portfolio-3" class="img-fluid"> </a> </div> <div class="title py-4"> <h4 class="text-uppercase">Female light</h4> <span class="text-secondary">Popular, Portfolio</span> </div> </div> </div> <div class="col-lg-4 col-md-6 col-sm-12 element-item upcoming"> <div class="our-project"> <div class="img"> <a class="test-popup-link" href="./img/portfolio/p4.jpg"> <img src="./img/portfolio/p4.jpg" alt="portfolio-4" class="img-fluid"> </a> </div> <div class="title py-4"> <h4 class="text-uppercase">Fourth Air</h4> <span class="text-secondary">Upcoming, Portfolio</span> </div> </div> </div> <div class="col-lg-4 col-md-6 col-sm-12 element-item upcoming"> <div class="our-project"> <div class="img"> <a class="test-popup-link" href="./img/portfolio/p5.jpg"> <img src="./img/portfolio/p5.jpg" alt="portfolio-5" class="img-fluid"> </a> </div> <div class="title py-4"> <h4 class="text-uppercase">Muliple fown</h4> <span class="text-secondary">Upcoming, Portfolio</span> </div> </div> </div> <div class="col-lg-4 col-md-6 col-sm-12 element-item following"> <div class="our-project"> <div class="img"> <a class="test-popup-link" href="./img/portfolio/p6.jpg"> <img src="./img/portfolio/p6.jpg" alt="portfolio-6" class="img-fluid"> </a> </div> <div class="title py-4"> <h4 class="text-uppercase">Together sign</h4> <span class="text-secondary">Following, Portfolio</span> </div> </div> </div> <div class="col-lg-4 col-md-6 col-sm-12 element-item following"> <div class="our-project"> <div class="img"> <a class="test-popup-link" href="./img/portfolio/p7.jpg"> <img src="./img/portfolio/p7.jpg" alt="portfolio-7" class="img-fluid"> </a> </div> <div class="title py-4"> <h4 class="text-uppercase">Green Heaven</h4> <span class="text-secondary">Following, Portfolio</span> </div> </div> </div> <div class="col-lg-4 col-md-6 col-sm-12 element-item following"> <div class="our-project"> <div class="img"> <a class="test-popup-link" href="./img/portfolio/p8.jpg"> <img src="./img/portfolio/p8.jpg" alt="portfolio-8" class="img-fluid"> </a> </div> <div class="title py-4"> <h4 class="text-uppercase">Fly Male</h4> <span class="text-secondary">Following, Portfolio</span> </div> </div> </div> <div class="col-lg-4 col-md-6 col-sm-12 element-item upcoming"> <div class="our-project"> <div class="img"> <a class="test-popup-link" href="./img/portfolio/p9.jpg"> <img src="./img/portfolio/p9.jpg" alt="portfolio-9" class="img-fluid"> </a> </div> <div class="title py-4"> <h4 class="text-uppercase">Camera Lens</h4> <span class="text-secondary">Upcoming, Portfolio</span> </div> </div> </div> </div> </div> </section> <!-- =========== End Project Area ========= --> <!-- ============ About Me Area ========== --> <section class="about-area"> <div class="container"> <div class="row text-center"> <div class="col-12"> <div class="about-title"> <h2 class="text-uppercase title-h1">Client Say about me</h2> <p class="para"> Lorem ipsum dolor sit, amet consectetur adipisicing elit. Repellendus, deleniti recusandae. Esse incidunt rem repellendus ab voluptates maxime? Nemo, numquam! </p> </div> </div> </div> </div> <div class="container carousel py-lg-5"> <div class="owl-carousel owl-theme"> <div class="client row"> <div class="col-lg-4 col-md-12 client-img"> <img src="./img/testimonials/t1.jpg" alt="img1" class="img-fluid"> </div> <div class="col-lg-8 col-md-12 about-client"> <h4 class="text-uppercase">John Martin</h4> <p class="para">Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quidem architecto consequuntur ratione, obcaecati corrupti deserunt.</p> </div> </div> <div class="client row"> <div class="col-lg-4 col-md-12 client-img"> <img src="./img/testimonials/t2.jpg" alt="img2" class="img-fluid"> </div> <div class="col-lg-8 col-md-12 about-client"> <h4 class="text-uppercase">Mac Hill</h4> <p class="para">Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quidem architecto consequuntur ratione, obcaecati corrupti deserunt.</p> </div> </div> <div class="client row"> <div class="col-lg-4 col-md-12 client-img"> <img src="./img/testimonials/t1.jpg" alt="img1" class="img-fluid"> </div> <div class="col-lg-8 col-md-12 about-client"> <h4 class="text-uppercase">John Martin</h4> <p class="para">Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quidem architecto consequuntur ratione, obcaecati corrupti deserunt.</p> </div> </div> <div class="client row"> <div class="col-lg-4 col-md-12 client-img"> <img src="./img/testimonials/t2.jpg" alt="img2" class="img-fluid"> </div> <div class="col-lg-8 col-md-12 about-client"> <h4 class="text-uppercase">Mac Hill</h4> <p class="para">Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quidem architecto consequuntur ratione, obcaecati corrupti deserunt.</p> </div> </div> <div class="client row"> <div class="col-lg-4 col-md-12 client-img"> <img src="./img/testimonials/t1.jpg" alt="img1" class="img-fluid"> </div> <div class="col-lg-8 col-md-12 about-client"> <h4 class="text-uppercase">John Martin</h4> <p class="para">Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quidem architecto consequuntur ratione, obcaecati corrupti deserunt.</p> </div> </div> <div class="client row"> <div class="col-lg-4 col-md-12 client-img"> <img src="./img/testimonials/t2.jpg" alt="img2" class="img-fluid"> </div> <div class="col-lg-8 col-md-12 about-client"> <h4 class="text-uppercase">Mac Hill</h4> <p class="para">Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quidem architecto consequuntur ratione, obcaecati corrupti deserunt.</p> </div> </div> </div> </div> </section> <!-- ========== End About Me Area =============== --> <!-- ========================== Subscribe me Area ============================ --> <section class="subscribe-us-area"> <div class="container subscribe"> <div class="row"> <div class="col-lg-12 text-center subscribe-title"> <h4 class="text-uppercase">Get Update From anywhere</h4> <p class="para">Lorem ipsum dolor sit amet consectetur adipisicing elit. Laboriosam, consequuntur.</p> </div> </div> <div class="d-sm-flex justify-content-center"> <form class="w-50"> <div class="row d-flex flex-row flex-wrap"> <div class="col input-textbox"> <input type="text" id="txtemail" class="form-control" placeholder="Email"> </div> <div class="col"> <div class="btn-submit"> <button type="submit" class="btn btn-success float-right">Subscribe</button> </div> </div> </div> </form> </div> </div> </section> <!-- ========================== End Subscribe me Area ============================ --> </main> <!-- =========== End Main Area ========= --> <?php //Header File include 'footer.php'; ?> Submit