You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

946 lines
60 KiB

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="HTML5 Template">
<!-- Site Title -->
<title>Bizzpro - Digital Corporate Business Creative Html Template</title>
<!-- Site Favicon -->
<link rel="icon" type="image/x-icon" href="assets/imgs/icon/favicon.png">
<!-- Fonts -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<!-- All CSS Files -->
<link rel="stylesheet" href="assets/css/all.min.css">
<link rel="stylesheet" href="assets/css/bootstrap.min.css">
<link rel="stylesheet" href="assets/css/meanmenu.min.css">
<link rel="stylesheet" href="assets/css/swiper-bundle.min.css">
<link rel="stylesheet" href="assets/css/magnific-popup.css">
<link rel="stylesheet" href="assets/css/aos.css">
<link rel="stylesheet" href="assets/css/progressbar.css">
<link rel="stylesheet" href="assets/css/master.css">
</head>
<body>
<!-- Preloader -->
<div id="preloader">
<div id="loader"></div>
</div>
<!-- Scroll to top -->
<button id="scroll_top" class="scroll-top">
<i class="fa-solid fa-arrow-up"></i>
</button>
<!-- Offcanvas area start -->
<div class="offcanvas__area">
<div class="offcanvas__inner">
<div class="offcanvas__top">
<img src="assets/imgs/logo/logo2.png" alt="Logo">
<button id="offcanvas_close">
<i class="fa-solid fa-xmark"></i>
</button>
</div>
<div class="offcanvas__search">
<form action="#">
<input type="text" placeholder="Search..." name="s">
</form>
</div>
<div class="offcanvas__menu">
<div class="offcanvas-menu">
<ul>
<li><a href="#">Home</a>
<ul>
<li><a href="index.html">Home 01</a></li>
<li><a href="index-2.html">Home 02</a></li>
<li><a href="index-3.html">Home 03</a></li>
</ul>
</li>
<li><a href="about.html">About</a></li>
<li><a href="#">Service</a>
<ul>
<li><a href="service.html">Service</a></li>
<li><a href="software-details.html">Service details</a></li>
</ul>
</li>
<li><a href="#">Pages</a>
<ul>
<li><a href="project.html">portfolio</a></li>
<li><a href="project-details.html">portfolio details</a></li>
<li><a href="team.html">team</a></li>
<li><a href="team-details.html">team details</a></li>
<li><a href="faq.html">faq</a></li>
</ul>
</li>
<li><a href="#">blog</a>
<ul>
<li><a href="blog.html">Blog</a></li>
<li><a href="blog-grid.html">Blog Grid</a></li>
<li><a href="blog-details.html">Blog details</a></li>
</ul>
</li>
<li><a href="contact.html">Contact</a></li>
</ul>
</div>
</div>
<div class="offcanvas__map">
<iframe src="https://www.google.com/maps/embed?pb=!1m10!1m8!1m3!1d1511.2499674845235!2d-73.99553882767792!3d40.75102778252164!3m2!1i1024!2i768!4f13.1!5e0!3m2!1sen!2sbd!4v1686536419224!5m2!1sen!2sbd" loading="lazy"></iframe>
</div>
<div class="offcanvas__btm">
<div class="footer__address-3">
<ul>
<li>
<span>
<i class="fa-solid fa-location-dot"></i>
</span>
<p class="text-white">Burmsille Street, MN 55337, <br> United States </p>
</li>
<li>
<span>
<i class="fa-solid fa-phone"></i>
</span>
<div>
<a href="tel:+88014420420">+(1) 123 456 7890</a>
<a href="tel:+88014420420">+(1) 098 765 4321</a>
</div>
</li>
<li>
<span>
<i class="fa-solid fa-envelope"></i>
</span>
<div>
<a href="mailto:info@driller.com">info@driller.com</a>
<a href="mailto:info.example@driller.com">info.example@driller.com</a>
</div>
</li>
</ul>
</div>
<div class="footer__social-3">
<ul>
<li>
<a href="#">
<i class="fa-brands fa-facebook-f"></i>
</a>
</li>
<li>
<a href="#">
<i class="fa-brands fa-twitter"></i>
</a>
</li>
<li>
<a href="#">
<i class="fa-brands fa-instagram"></i>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
<!-- Offcanvas area end -->
<div id="smooth-wrapper">
<div id="smooth-content">
<!-- Header area start -->
<header class="header__area pos-abs plr-100">
<div class="header__inner">
<div class="header__logo">
<a href="index.html"><img src="assets/imgs/logo/logo.png" alt="Site Logo"></a>
</div>
<div class="header__menu">
<nav class="main-menu">
<ul>
<li class="has-dropdown">
<a href="#">Home</a>
<ul class="main-dropdown">
<li>
<a href="index.html">Home 01</a>
</li>
<li>
<a href="index-2.html">Home 02</a>
</li>
<li>
<a href="index-3.html">Home 03</a>
</li>
</ul>
</li>
<li>
<a href="about.html">About</a>
</li>
<li class="has-dropdown">
<a href="#">Service</a>
<ul class="main-dropdown">
<li><a href="service.html">Service</a></li>
<li><a href="software-details.html">Service details</a></li>
</ul>
</li>
<li class="has-megamenu"><a href="#">pages</a>
<ul class="main-dropdown">
<li><a href="project.html">portfolio</a></li>
<li><a href="project-details.html">portfolio details</a></li>
<li><a href="team.html">team</a></li>
<li><a href="team-details.html">team details</a></li>
<li><a href="faq.html">faq</a></li>
</ul>
</li>
<li class="has-dropdown"><a href="#">blog</a>
<ul class="main-dropdown">
<li><a href="blog.html">Blog</a></li>
<li><a href="blog-grid.html">Blog Grid</a></li>
<li><a href="blog-details.html">blog details</a></li>
</ul>
</li>
<li>
<a href="contact.html">Contact</a>
</li>
</ul>
</nav>
</div>
<div class="header__others">
<div class="header__search">
<button class="search-icon">
<i class="fa-solid fa-magnifying-glass"></i>
</button>
<button class="search-close">
<i class="fa-solid fa-xmark"></i>
</button>
</div>
<div class="header__offcanvas">
<button class="menu_icon bg-base">
<img src="assets/imgs/icon/menu.png" alt="Menu Icon">
</button>
</div>
</div>
</div>
</header>
<div class="search__form">
<form action="#">
<input type="text" name="s" placeholder="Search...">
</form>
</div>
<!-- Header area end -->
<main>
<!-- Hero area start -->
<section class="hero__area_1" style="background-image: url('assets/imgs/hero/00.png');">
<div class="hero__area_1_inner">
<div class="hero_1_content">
<h1 class="hero__title heading-animation"> Experience <img class="cxuSpin-slow" src="assets/imgs/hero/02.png" alt="img">
<br> the <span>power of agency</span>
</h1>
<div class="video_area" data-lag="0.3">
<a href="https://www.youtube.com/watch?v=FYpsf0ACkmI" class="popup-link">
<img class="cxuSpin-slow2" src="assets/imgs/hero/03.png" alt="Hero Image">
<i class="fa-solid fa-play"></i>
</a>
</div>
</div>
<div class="main-thumb text-end">
<img class="main-img" src="assets/imgs/hero/01.png" alt="Hero Image">
</div>
</div>
</section>
<!-- Hero area end -->
<!-- Service area start -->
<section class="service__area pt-150 pb-130">
<div class="container">
<div class="bg-light1 border-radius-25 pt-120 px-lg-5 px-4 pb-90 pb-120">
<div class="row pb-120">
<div class="col-xxl-7 col-xl-7 col-xl-7">
<div class="service__title-wrap" data-aos="fade-up">
<h2 class="sec-subtitle">best service <span>best service</span>
</h2>
<h3 class="sec-title heading-animation">Innovative solutions for <br> a digital world </h3>
</div>
</div>
<div class="col-xxl-5 col-xl-5 col-xl-5">
<div class="service__text p-animation pt-0">
<p class="ms-0">Which is the same as saying through shrinking from toil and pain in These cases are many perfectly simple and easy to distinguish thiIn a free hour this when</p>
</div>
</div>
</div>
</div>
<div class="service-inner px-lg-5 px-4">
<div class="row pt-4">
<div class="col-xxl-4 col-xl-4 col-xl-4 col-md-6 mb-4">
<div class="service__item style2">
<div class="service__content">
<div class="icon-box">
<img src="assets/imgs/service/4/4.png" alt="Service Icon">
</div>
<a href="software-details.html">
<div class="service__title">Pixel Perfect Design</div>
</a>
<p>Health and medical is a encompasses a wide range of topics related to health</p>
<a class="db-btn-arrow" href="software-details.html">Read More <i class="fa-solid fa-arrow-right"></i>
</a>
</div>
</div>
</div>
<div class="col-xxl-4 col-xl-4 col-xl-4 col-md-6 mb-4">
<div class="service__item style2">
<div class="service__content">
<div class="icon-box">
<img src="assets/imgs/service/4/5.png" alt="Service Icon">
</div>
<a href="software-details.html">
<div class="service__title">Creative Edge Solutions</div>
</a>
<p>Health and medical is a encompasses a wide range of topics related to health</p>
<a class="db-btn-arrow" href="software-details.html">Read More <i class="fa-solid fa-arrow-right"></i>
</a>
</div>
</div>
</div>
<div class="col-xxl-4 col-xl-4 col-xl-4 col-md-6 mb-4">
<div class="service__item style2">
<div class="service__content">
<div class="icon-box">
<img src="assets/imgs/service/4/6.png" alt="Service Icon">
</div>
<a href="software-details.html">
<div class="service__title">The Pixel Producers</div>
</a>
<p>Health and medical is a encompasses a wide range of topics related to health</p>
<a class="db-btn-arrow" href="software-details.html">Read More <i class="fa-solid fa-arrow-right"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Service area end -->
<!-- About area start -->
<section class="about__area pb-5">
<div class="container">
<div class="row">
<div class="col-xxl-6 col-xl-6 col-xl-6 col-md-6">
<div class="about__imgs" data-aos="fade-up">
<div class="image-1">
<img class="border-radius-25" src="assets/imgs/about/1.png" alt="Image">
</div>
<div class="image-2">
<img src="assets/imgs/about/3.png" alt="Image" data-speed="0.85">
</div>
<div class="bell">
<span>
<i class="fa-regular fa-bell text-white"></i>
</span>
</div>
<div class="projects">
<img src="assets/imgs/icon/medal.png" alt="Medal Icon">
<p>
<span class="counter_fast">230+</span>Project Complete
</p>
</div>
</div>
</div>
<div class="col-xxl-6 col-xl-6 col-xl-6 col-md-6">
<div class="about__content" data-aos="fade-up" data-aos-delay="500">
<h2 class="sec-subtitle">ABOUT US <span>About Us</span>
</h2>
<h3 class="sec-title heading-animation">Innovative solutions for a digital world</h3>
<div class="p-animation">
<p>Which is the same as saying through shrinking from toil and pain. These cases are many perfectly simple and easy to distinguish. In a free hour this when our power of choice is untrammelled and when nothing prevents</p>
</div>
<ul data-aos="fade-up">
<li>How to improve your busines for Helping us </li>
<li>making this the first true generator on the Internet</li>
<li>Creative this the first true generator on the designe</li>
</ul>
<div data-aos="fade-up" data-aos-delay="300">
<a class="db-btn-arrow" href="about.html">Read More <i class="fa-solid fa-arrow-right"></i>
</a>
</div>
</div>
</div>
</div>
<img src="assets/imgs/shape/6.png" alt="Zigzag Shape" class="shape">
</div>
</section>
<!-- About area end -->
<!-- Counter area start -->
<section class="counter__area bg-white">
<div class="container">
<div class="row">
<div class="col-xxl-12">
<div class="counter__inner">
<div class="counter__item" data-aos="fade-right">
<div class="counter__number counter_slow style2">200+
</div>
<h3 class="counter__title color-heading">Happy customer </h3>
</div>
<div class="counter__item" data-aos="fade-right" data-aos-delay="300">
<div class="counter__number counter_slow style2">300+
</div>
<h3 class="counter__title color-heading">total branches </h3>
</div>
<div class="counter__item" data-aos="fade-right" data-aos-delay="600">
<div class="counter__number counter_slow style2">550+
</div>
<h3 class="counter__title color-heading">Project complete </h3>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Counter area end -->
<!-- intro area start -->
<div class="intro-area bg-light1 pt-150">
<div class="container pb-130">
<div class="pt-0 mb-5" data-aos="fade-up" data-aos-delay="500">
<h2 class="sec-subtitle">Our Intro <span>Our Intro</span>
</h2>
<h3 class="sec-title heading-animation">Story with passion</h3>
</div>
<div class="row">
<div class="col-lg-3 col-md-6">
<div class="single-intro-inner">
<div class="thumb">
<img class="w-100" src="assets/imgs/intro/5.png" alt="img">
</div>
<div class="details">
<div class="icon-box">
<img src="assets/imgs/intro/1.png" alt="img">
</div>
<span></span>
<p>Our services</p>
<h5>Regular update</h5>
</div>
</div>
</div>
<div class="col-lg-3 col-md-6">
<div class="single-intro-inner">
<div class="thumb">
<img class="w-100" src="assets/imgs/intro/6.png" alt="img">
</div>
<div class="details">
<div class="icon-box">
<img src="assets/imgs/intro/2.png" alt="img">
</div>
<span></span>
<p>Our Update</p>
<h5>Work From Home</h5>
</div>
</div>
</div>
<div class="col-lg-3 col-md-6">
<div class="single-intro-inner">
<div class="thumb">
<img class="w-100" src="assets/imgs/intro/7.png" alt="img">
</div>
<div class="details">
<div class="icon-box">
<img src="assets/imgs/intro/3.png" alt="img">
</div>
<span></span>
<p>With Humble</p>
<h5>Work With Humble</h5>
</div>
</div>
</div>
<div class="col-lg-3 col-md-6">
<div class="single-intro-inner">
<div class="thumb">
<img class="w-100" src="assets/imgs/intro/8.png" alt="img">
</div>
<div class="details">
<div class="icon-box">
<img src="assets/imgs/intro/4.png" alt="img">
</div>
<span></span>
<p>the power</p>
<h5>Clean Need Project</h5>
</div>
</div>
</div>
</div>
</div>
<div class="exp-area" style="background-image: url('assets/imgs/intro/9.png');">
<div class="container">
<div class="row">
<div class="col-lg-6">
<div class="pt-5 pb-5 about__content pt-0" data-aos="fade-up" data-aos-delay="500">
<h3 class="sec-title heading-animation">Experience the power of transformation</h3>
<p class="border-bottom-1-black mb-lg-5 mb-4 pb-lg-5 pb-4">There are many variations of passages of Lorem Ipsum available ours but the majority have suffered alteration in some form, by injected humour or randomised words which don look even the design here us</p>
<div class="row">
<div class="col-md-6">
<ul>
<li class="pb-3">Be positive but realistic designer </li>
<li class="pb-3">Know your target market </li>
<li class="pb-3">Simplify your processes creative </li>
</ul>
</div>
<div class="col-md-6">
<ul>
<li class="pb-3">How to improve your busines</li>
<li class="pb-3">making this the first true</li>
<li class="pb-3">Creative this the first true</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- intro area end -->
<!-- Contact area start -->
<section class="contact__areas pt-150 pb-130">
<div class="container">
<div class="box-shadow p-xl-5 p-4 border-radius-50">
<div class="row">
<div class="col-xxl-6 col-xl-6 col-lg-6 mb-lg-0 mb-4">
<img class="border-radius-25" src="assets/imgs/intro/10.png" alt="img">
</div>
<div class="col-xxl-6 col-xl-6 col-lg-6 align-self-center">
<div class="contact__form contact__form-5 mt-0 pt-0 pb-0">
<div class="" data-aos="fade-up" data-aos-delay="600">
<form action="#">
<input type="text" name="name" placeholder="Name*" required>
<input type="email" name="email" placeholder="E-mail*" required>
<input type="text" name="subject" placeholder="subject*" required>
<textarea name="comments" placeholder="Comment*" required></textarea>
<button class="submit btn-rollover bg-base" type="submit">Submit <i class="fa-solid fa-arrow-right"></i>
</button>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Contact area end -->
<!-- Text Slider area start -->
<section class="textslider__area bg-white p-0">
<div class="textslider__inner">
<div class="swiper textslider__active textslider_1">
<div class="swiper-wrapper">
<div class="swiper-slide">
<div class="textslider__slide">
<h2>Unleash U <span>-</span></h2>
</div>
</div>
<div class="swiper-slide">
<div class="textslider__slide">
<h2>Business <span>-</span></h2>
</div>
</div>
<div class="swiper-slide">
<div class="textslider__slide">
<h2>Potential <span>-</span></h2>
</div>
</div>
<div class="swiper-slide">
<div class="textslider__slide">
<h2>Experience <span>-</span></h2>
</div>
</div>
<div class="swiper-slide">
<div class="textslider__slide">
<h2>Unleash U <span>-</span></h2>
</div>
</div>
<div class="swiper-slide">
<div class="textslider__slide">
<h2>Consult <span>-</span></h2>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="textslider__area bg-white p-0">
<div class="textslider__inner">
<div class="swiper textslider__active-3 textslider_2">
<div class="swiper-wrapper">
<div class="swiper-slide">
<div class="textslider__slide">
<h2>Unleash U <span>-</span></h2>
</div>
</div>
<div class="swiper-slide">
<div class="textslider__slide">
<h2>Business <span>-</span></h2>
</div>
</div>
<div class="swiper-slide">
<div class="textslider__slide">
<h2>Potential <span>-</span></h2>
</div>
</div>
<div class="swiper-slide">
<div class="textslider__slide">
<h2>Experience <span>-</span></h2>
</div>
</div>
<div class="swiper-slide">
<div class="textslider__slide">
<h2>Unleash U <span>-</span></h2>
</div>
</div>
<div class="swiper-slide">
<div class="textslider__slide">
<h2>Consult <span>-</span></h2>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Text Slider area end -->
<!-- FAQs area start -->
<section class="faq__area bg-white pt-150 pb-120">
<div class="container">
<div class="row">
<div class="col-xxl-6 col-xl-6 col-xl-6">
<div class="sec-title-wrap mb-5 mb-lg-0" data-aos="fade-up">
<h2 class="sec-subtitle">Some Faq <span>Some Faq</span>
</h2>
<h3 class="sec-title heading-animation">Experience the <br> power</h3>
<div class="p-animation">
<p class="color-heading mb-5">Et purus duis sollicitudin dignissim habitant. <br> Egestas nulla quis venenatis cras sed eu massa eu <br> faucibus. Urna fusce aenean tortor </p>
<a class="bg-base btn-rollover border-radius-25" href="#">LEARN MORE</a>
</div>
</div>
</div>
<div class="col-xxl-6 col-xl-6 col-xl-6">
<div class="faq__list">
<div class="accordion" id="accordionExample">
<div class="accordion-item style-2" data-aos="fade-up">
<h2 class="" id="headingOne">
<button class="accordion-button color-heading" type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne"> How much agencies charge for their services ? </button>
</h2>
<div id="collapseOne" class="accordion-collapse collapse show" aria-labelledby="headingOne" data-bs-parent="#accordionExample">
<div class="accordion-body">
<p class="color-heading">It is a long established fact that a reader will be distr acted bioiiy the rea dablea content of a page when looking at its layout Thoiie point of using.It is a long this established fact that a reader</p>
</div>
</div>
</div>
<div class="accordion-item style-2" data-aos="fade-up" data-aos-delay="300">
<h2 class="" id="headingTwo">
<button class="color-heading accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo"> How long does i digital agency to complete a project ? </button>
</h2>
<div id="collapseTwo" class="accordion-collapse collapse" aria-labelledby="headingTwo" data-bs-parent="#accordionExample">
<div class="accordion-body">
<p class="color-heading">This is the third item's accordion body. It is hidden by default, until the collapse plugin adds the appropriate classes that we use to style each element. These classes control the overall appearance, as well as the showing and hiding via CSS transitions.</p>
</div>
</div>
</div>
<div class="accordion-item style-2" data-aos="fade-up" data-aos-delay="600">
<h2 class="" id="headingThree">
<button class="color-heading accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree"> What services do digital agencies typically offer ? </button>
</h2>
<div id="collapseThree" class="accordion-collapse collapse" aria-labelledby="headingThree" data-bs-parent="#accordionExample">
<div class="accordion-body">
<p class="color-heading">This is the third item's accordion body. It is hidden by default, until the collapse plugin adds the appropriate classes that we use to style each element.</p>
</div>
</div>
</div>
<div class="accordion-item style-2" data-aos="fade-up" data-aos-delay="900">
<h2 class="" id="headingFour">
<button class="color-heading accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseFour" aria-expanded="false" aria-controls="collapseFour"> How do I know if a digital agency is business ? </button>
</h2>
<div id="collapseFour" class="accordion-collapse collapse" aria-labelledby="headingFour" data-bs-parent="#accordionExample">
<div class="accordion-body">
<p class="color-heading">This is the third item's accordion body. It is hidden by default, until the collapse plugin adds the appropriate classes that we use to style each element.</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- FAQs area end -->
<!-- Who we are area start -->
<section class="who__area" style="background-image: url('assets/imgs/hero/00.png');">
<div class="who__area_inner pt-5 pb-5" style="background-image: url('assets/imgs/intro/11.png');">
<div class="container mt-xl-5 mb-xl-5">
<div class="row">
<div class="col-xxl-5 col-xl-5 col-lg-6">
<div class="who__left">
<div class="sec-title-wrap pb-3" data-aos="fade-up">
<h2 class="sec-subtitle">who we are <span>who we are</span>
</h2>
<h3 class="sec-title heading-animation">Transforming ideas <br> into reality </h3>
</div>
<div class="who__features">
<div class="who__feature" data-aos="fade-up" data-aos-delay="300">
<div class="number">
<span class="color-base">01</span>
</div>
<div class="who__content">
<h4 class="title">Creative Craze</h4>
<p>Health and medical is a encompasses a wide range of topics related to health</p>
</div>
</div>
<div class="who__feature" data-aos="fade-up" data-aos-delay="600">
<div class="number">
<span class="color-base">02</span>
</div>
<div class="who__content">
<h4 class="title">Art on Mine</h4>
<p>Health and medical is a encompasses a wide range of topics related to health</p>
</div>
</div>
<div class="who__feature" data-aos="fade-up" data-aos-delay="900">
<div class="number">
<span class="color-base">03</span>
</div>
<div class="who__content">
<h4 class="title">Agencey Power</h4>
<p>Health and medical is a encompasses a wide range of topics related to health</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Who we are area end -->
<!-- Newsletter area start -->
<section class="newsletter__area bg-light1 pt-120 pb-120">
<div class="container">
<div class="row">
<div class="col-xxl-5 col-xl-5 col-lg-5 align-self-center">
<h2 class="sec-subtitle">Newsletter <span>Newsletter</span></h2>
<h3 class="sec-title heading-animation pb-0">Want to Be a Member?</h3>
</div>
<div class="col-xxl-7 col-xl-7 col-lg-7">
<div class="newsletter__right ps-xxl-5">
<form action="#" class="ps-xxl-5">
<input class="border-radius-50" type="email" name="email" placeholder="Enter Your Email">
<button type="submit" class="submit btn-rollover border-radius-50 border-radius-50-hover bg-base">Subscribe Now</button>
</form>
</div>
</div>
</div>
</div>
</section>
<!-- Newsletter area end -->
<!-- Blog area start -->
<section class="blog__area pt-150 pb-150">
<div class="container">
<div class="row">
<div class="col-xxl-12">
<div class="sec-title-wrap" data-aos="fade-up">
<h2 class="sec-subtitle">Our Blog <span>Our Blog</span>
</h2>
<h3 class="sec-title heading-animation">Let’s Checkout our All <br> Letest News </h3>
</div>
</div>
<div class="col-xxl-12">
<div class="blog__list">
<article class="blog__item" data-aos="fade-up" data-aos-delay="300">
<div class="blog__thumb">
<div class="shine">
<a href="blog-details.html">
<img class="border-radius-25" src="assets/imgs/blog/1.png" alt="Thumbnail">
</a>
</div>
<div class="date">16 <br> March </div>
</div>
<ul class="blog__meta">
<li>
<a href="#">
<i class="fa-regular fa-user"></i> By admin </a>
</li>
<li>
<a href="#">
<i class="fa-regular fa-comments"></i> Comments (05) </a>
</li>
</ul>
<a href="blog-details.html">
<h4 class="blog__title">Standard chunk of Lorem Ipsum Our Company</h4>
</a>
<a class="db-btn-arrow" href="blog-details.html">Read More <i class="fa-solid fa-arrow-right"></i>
</a>
</article>
<article class="blog__item" data-aos="fade-up" data-aos-delay="600">
<div class="blog__thumb">
<div class="shine">
<a href="blog-details.html">
<img class="border-radius-25" src="assets/imgs/blog/2.png" alt="Thumbnail">
</a>
</div>
<div class="date">16 <br> March </div>
</div>
<ul class="blog__meta">
<li>
<a href="">
<i class="fa-regular fa-user"></i> By admin </a>
</li>
<li>
<a href="">
<i class="fa-regular fa-comments"></i> Comments (05) </a>
</li>
</ul>
<a href="blog-details.html">
<h4 class="blog__title">These cases are many simple and easy</h4>
</a>
<a class="db-btn-arrow" href="blog-details.html">Read More <i class="fa-solid fa-arrow-right"></i>
</a>
</article>
<article class="blog__item" data-aos="fade-up" data-aos-delay="900">
<div class="blog__thumb">
<div class="shine">
<a href="blog-details.html">
<img class="border-radius-25" src="assets/imgs/blog/3.png" alt="Thumbnail">
</a>
</div>
<div class="date">16 <br> March </div>
</div>
<ul class="blog__meta">
<li>
<a href="">
<i class="fa-regular fa-user"></i> By admin </a>
</li>
<li>
<a href="">
<i class="fa-regular fa-comments"></i> Comments (05) </a>
</li>
</ul>
<a href="blog-details.html">
<h4 class="blog__title">The standard chunk of Ipsum Our Company</h4>
</a>
<a class="db-btn-arrow" href="blog-details.html">Read More <i class="fa-solid fa-arrow-right"></i>
</a>
</article>
</div>
</div>
</div>
</div>
</section>
<!-- Blog area end -->
</main>
<!-- Footer area start -->
<footer class="footer__area footer_two_area">
<div class="footer__widgets">
<div class="container">
<div class="footer_top">
<div class="row">
<div class="col-lg-7">
<h6 class="text-white">Have an idea?</h6>
<h2 class="text-white mb-4 mb-lg-0">Get in <span>touch</span></h2>
</div>
<div class="col-md-5 text-lg-end">
<a data-lag="0.3" href="contact.html">Get a quote <i class="fa fa-arrow-right"></i></a>
</div>
</div>
</div>
</div>
<div class="container">
<div class="row">
<div class="col-xxl-3 col-xl-3 col-lg-6 col-md-6">
<div class="footer__logo">
<img src="assets/imgs/logo/logo2.png" alt="Footer Logo">
<p><strong>bill.sanders@example.com</strong></p>
<p>© Yoursitename 2024 | All Rights Reserved</p>
</div>
</div>
<div class="col-xxl-3 col-xl-3 col-lg-6 col-md-6">
<div class="footer__service">
<h2 class="footer__title">Useful Links</h2>
<ul>
<li>
<a href="about.html">About Us</a>
</li>
<li>
<a href="about.html">Our Team</a>
</li>
<li>
<a href="about.html">Recent News </a>
</li>
<li>
<a href="about.html">Project</a>
</li>
</ul>
</div>
</div>
<div class="col-xxl-3 col-xl-3 col-lg-6 col-md-6">
<div class="footer__service">
<h2 class="footer__title">More Servicve</h2>
<ul>
<li>
<a href="about.html">Ui Design</a>
</li>
<li>
<a href="about.html">Ux Design</a>
</li>
<li>
<a href="about.html">Digital Marketing</a>
</li>
<li>
<a href="about.html">Video Editing</a>
</li>
</ul>
</div>
</div>
<div class="col-xxl-3 col-xl-3 col-lg-6 col-md-6">
<div class="footer__address">
<h2 class="footer__title">Address</h2>
<ul>
<li>
<span>
<i class="fa-solid fa-paper-plane"></i>
</span>
<p>Old city Street,Usa <br>1212 New york-3500</p>
</li>
<li>
<span>
<i class="fa-solid fa-phone"></i>
</span>
<a href="tel:+88014420420">+88 014 420420</a>
</li>
<li>
<span>
<i class="fa-solid fa-envelope"></i>
</span>
<a href="mailto:urcompany@mail.com">urcompany@mail.com</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</footer>
<!-- Footer area end -->
</div>
</div>
<!-- All JS Files -->
<script src="assets/js/jquery-3.6.1.min.js"></script>
<script src="assets/js/bootstrap.bundle.min.js"></script>
<script src="assets/js/jquery.meanmenu.min.js"></script>
<script src="assets/js/swiper-bundle.min.js"></script>
<script src="assets/js/jquery.magnific-popup.min.js"></script>
<script src="assets/js/counter.js"></script>
<script src="assets/js/progressbar.js"></script>
<script src="assets/js/aos.js"></script>
<script src="assets/js/gsap.min.js"></script>
<script src="assets/js/SplitText.min.js"></script>
<script src="assets/js/ScrollSmoother.min.js"></script>
<script src="assets/js/ScrollTrigger.min.js"></script>
<script src="assets/js/vanilla-tilt.min.js"></script>
<script src="assets/js/main.js"></script>
</body>
</html>