View file Webteck/download-version/index.html

File size: 59.16Kb
<!doctype html>
<html class="no-js" lang="zxx">

<head>
    <meta charset="utf-8">
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <title>Webtek - IT Solution and Technology HTML Template - Home Web Agency</title>
    <meta name="author" content="Webtek">
    <meta name="description" content="Webtek - IT Solution and Technology HTML Template">
    <meta name="keywords" content="Webtek - IT Solution and Technology HTML Template">
    <meta name="robots" content="INDEX,FOLLOW">

    <!-- Mobile Specific Metas -->
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- Favicons - Place favicon.ico in the root directory -->
    <link rel="apple-touch-icon" sizes="57x57" href="assets/img/favicons/apple-icon-57x57.png">
    <link rel="apple-touch-icon" sizes="60x60" href="assets/img/favicons/apple-icon-60x60.png">
    <link rel="apple-touch-icon" sizes="72x72" href="assets/img/favicons/apple-icon-72x72.png">
    <link rel="apple-touch-icon" sizes="76x76" href="assets/img/favicons/apple-icon-76x76.png">
    <link rel="apple-touch-icon" sizes="114x114" href="assets/img/favicons/apple-icon-114x114.png">
    <link rel="apple-touch-icon" sizes="120x120" href="assets/img/favicons/apple-icon-120x120.png">
    <link rel="apple-touch-icon" sizes="144x144" href="assets/img/favicons/apple-icon-144x144.png">
    <link rel="apple-touch-icon" sizes="152x152" href="assets/img/favicons/apple-icon-152x152.png">
    <link rel="apple-touch-icon" sizes="180x180" href="assets/img/favicons/apple-icon-180x180.png">
    <link rel="icon" type="image/png" sizes="192x192" href="assets/img/favicons/android-icon-192x192.png">
    <link rel="icon" type="image/png" sizes="32x32" href="assets/img/favicons/favicon-32x32.png">
    <link rel="icon" type="image/png" sizes="96x96" href="assets/img/favicons/favicon-96x96.png">
    <link rel="icon" type="image/png" sizes="16x16" href="assets/img/favicons/favicon-16x16.png">
    <link rel="manifest" href="assets/img/favicons/manifest.json">
    <meta name="msapplication-TileColor" content="#ffffff">
    <meta name="msapplication-TileImage" content="assets/img/favicons/ms-icon-144x144.png">
    <meta name="theme-color" content="#ffffff">

    <!--==============================
	  Google Fonts
	============================== -->
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Gantari:wght@100;300;400;500;600;700;800;900&family=Inter:wght@100;400;500;600;700;800;900&family=Urbanist:wght@100;300;400;500;600;700;800;900&display=swap" rel="stylesheet">


    <!--==============================
	    All CSS File
	============================== -->
    <!-- Bootstrap -->
    <link rel="stylesheet" href="assets/css/bootstrap.min.css">
    <!-- Fontawesome Icon -->
    <link rel="stylesheet" href="assets/css/fontawesome.min.css">
    <!-- Magnific Popup -->
    <link rel="stylesheet" href="assets/css/magnific-popup.min.css">
    <!-- Swiper css -->
    <link rel="stylesheet" href="assets/css/swiper-bundle.min.css">
    <!-- datetimepicker -->
    <link rel="stylesheet" href="assets/css/jquery.datetimepicker.min.css">
    <!-- Theme Custom CSS -->
    <link rel="stylesheet" href="assets/css/style.css">

</head>

<body>

    <!--[if lte IE 9]>
    	<p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="https://browsehappy.com/">upgrade your browser</a> to improve your experience and security.</p>
  	<![endif]-->


    <!--********************************
   		Code Start From Here 
	******************************** -->
    <div class="cursor"></div>
    <div class="cursor2"></div>

    <!--==============================
     Preloader
  ==============================-->
    <div id="preloader" class="preloader ">
        <button class="th-btn th-radius preloaderCls">Cancel Preloader </button>
        <div id="loader" class="th-preloader">
            <div class="animation-preloader">
                <div class="txt-loading">
                    <span preloader-text="W" class="characters">W</span>

                    <span preloader-text="E" class="characters">E</span>

                    <span preloader-text="B" class="characters">B</span>

                    <span preloader-text="T" class="characters">T</span>

                    <span preloader-text="E" class="characters">E</span>

                    <span preloader-text="C" class="characters">C</span>

                    <span preloader-text="K" class="characters">K</span>
                </div>
            </div>
        </div>
    </div> <!--==============================
    Mobile Menu
  ============================== -->
    <div class="th-menu-wrapper">
        <div class="th-menu-area text-center">
            <button class="th-menu-toggle"><i class="fal fa-times"></i></button>
            <div class="mobile-logo">
                <a href="home-web-agency.html"><img src="assets/img/logo2.svg" alt="Webtek"></a>
            </div>
            <div class="th-mobile-menu">
                <ul>
                    <li class="menu-item-has-children">
                        <a href="home-web-agency.html">Home</a>
                        <ul class="sub-menu">
                            <li><a href="home-web-agency.html">Home Web Agency</a></li>
                            <li><a href="home-startup-agency.html">Home Startup Agency</a></li>
                            <li><a href="home-digital-agency.html">Home Digital Agency</a></li>
                            <li><a href="home-it-solution.html">Home IT-solution</a></li>

                        </ul>
                    </li>
                    <li class="menu-item-has-children">
                        <a href="#">Pages</a>
                        <ul class="sub-menu">
                            <li class="menu-item-has-children">
                                <a href="#">Shop</a>
                                <ul class="sub-menu">
                                    <li><a href="shop.html">Shop</a></li>
                                    <li><a href="shop-details.html">Shop Details</a></li>
                                    <li><a href="cart.html">Cart Page</a></li>
                                    <li><a href="checkout.html">Checkout</a></li>
                                    <li><a href="wishlist.html">Wishlist</a></li>
                                </ul>
                            </li>
                            <li class="menu-item-has-children">
                                <a href="#">Career</a>
                                <ul class="sub-menu">
                                    <li><a href="career.html">Career</a></li>
                                    <li><a href="career-details.html">Career Details</a></li>
                                </ul>
                            </li>
                            <li><a href="about.html">About Us</a></li>
                            <li><a href="appointment.html">Appointment</a></li>
                            <li><a href="team.html">Team</a></li>
                            <li><a href="team-details.html">Team Details</a></li>
                            <li><a href="project.html">project</a></li>
                            <li><a href="project-details.html">project Details</a></li>
                            <li><a href="faq.html">Faq Page</a></li>
                            <li><a href="price.html">Price Package</a></li>
                            <li><a href="error.html">Error Page</a></li>
                        </ul>

                    </li>
                    <li class="menu-item-has-children">
                        <a href="#">Service</a>
                        <ul class="sub-menu">
                            <li><a href="service.html">Service</a></li>
                            <li><a href="service-details.html">Service Details</a></li>
                        </ul>
                    </li>
                    <li class="menu-item-has-children">
                        <a href="#">Blog</a>
                        <ul class="sub-menu">
                            <li><a href="blog-grid.html">Blog Grid</a></li>
                            <li><a href="blog.html">Blog Lists</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>

    <!--==============================
	Header Area
==============================-->
    <header class="th-header header-layout2 header-absolute">
        <div class="sticky-wrapper">
            <!-- Main Menu Area -->
            <div class="menu-area">
                <div class="container">
                    <div class="row align-items-center justify-content-between">
                        <div class="col-auto">
                            <div class="header-logo">
                                <a href="home-web-agency.html"><img src="assets/img/logo2.svg" alt="Webtek"></a>
                            </div>
                        </div>
                        <div class="col-auto">
                            <nav class="main-menu style2 d-none d-lg-inline-block">
                                <ul>
                                    <li class="menu-item-has-children">
                                        <a href="home-web-agency.html">Home</a>
                                        <ul class="sub-menu">
                                            <li><a href="home-web-agency.html">Home Web Agency</a></li>
                                            <li><a href="home-startup-agency.html">Home Startup Agency</a></li>
                                            <li><a href="home-digital-agency.html">Home Digital Agency</a></li>
                                            <li><a href="home-it-solution.html">Home IT-solution</a></li>

                                        </ul>
                                    </li>
                                    <li class="menu-item-has-children">
                                        <a href="#">Pages</a>
                                        <ul class="sub-menu">
                                            <li class="menu-item-has-children">
                                                <a href="#">Shop</a>
                                                <ul class="sub-menu">
                                                    <li><a href="shop.html">Shop</a></li>
                                                    <li><a href="shop-details.html">Shop Details</a></li>
                                                    <li><a href="cart.html">Cart Page</a></li>
                                                    <li><a href="checkout.html">Checkout</a></li>
                                                    <li><a href="wishlist.html">Wishlist</a></li>
                                                </ul>
                                            </li>
                                            <li class="menu-item-has-children">
                                                <a href="#">Career</a>
                                                <ul class="sub-menu">
                                                    <li><a href="career.html">Career</a></li>
                                                    <li><a href="career-details.html">Career Details</a></li>
                                                </ul>
                                            </li>
                                            <li><a href="about.html">About Us</a></li>
                                            <li><a href="appointment.html">Appointment</a></li>
                                            <li><a href="team.html">Team</a></li>
                                            <li><a href="team-details.html">Team Details</a></li>
                                            <li><a href="project.html">project</a></li>
                                            <li><a href="project-details.html">project Details</a></li>
                                            <li><a href="faq.html">Faq Page</a></li>
                                            <li><a href="price.html">Price Package</a></li>
                                            <li><a href="error.html">Error Page</a></li>
                                        </ul>

                                    </li>
                                    <li class="menu-item-has-children">
                                        <a href="#">Service</a>
                                        <ul class="sub-menu">
                                            <li><a href="service.html">Service</a></li>
                                            <li><a href="service-details.html">Service Details</a></li>
                                        </ul>
                                    </li>
                                    <li class="menu-item-has-children">
                                        <a href="#">Blog</a>
                                        <ul class="sub-menu">
                                            <li><a href="blog-grid.html">Blog Grid</a></li>
                                            <li><a href="blog.html">Blog Lists</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="col-auto">
                            <div class="header-button">
                                <button type="button" class="th-menu-toggle d-block d-lg-none"><i class="far fa-bars"></i></button>
                                <a href="tel:+2586232325" class="th-btn">Call us: +258 6232 3258</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </header>

    <!--==============================
Hero Area
==============================-->
    <div class="th-hero-wrapper hero-2 " id="hero" data-bg-src="assets/img/bg/hero_bg_1.jpg">
        <div class="container">
            <div class="row align-items-end">
                <div class="col-lg-6">
                    <div class="hero-style2">
                        <h1 class="hero-title"> World’s No.1 <span class="title">Web Design Agency</span>
                        </h1>
                        <p class="hero-text">Take charge of your business continuity with innovative IT solutions</p>
                        <div class="btn-group  justify-content-center justify-content-lg-start">
                            <a href="service.html" class="th-btn style4">View Services</a>
                            <a href="contact.html" class="th-btn">Make a Reservation</a>
                        </div>
                    </div>
                </div>
                <div class="col-lg-6">
                    <div class="th-hero-img">
                        <img src="assets/img/hero/hero_bg_2_1.png" alt="">
                    </div>
                </div>
            </div>
        </div>
        <div class="ripple-shape">
            <span class="ripple-1"></span>
            <span class="ripple-2"></span>
            <span class="ripple-3"></span>
            <span class="ripple-4"></span>
            <span class="ripple-5"></span>
        </div>
        <div class="th-circle">
            <span class="circle style1"></span>
            <span class="circle style2"></span>
            <span class="circle style3"></span>
        </div>
    </div>
    <!--======== / Hero Section ========--><!--==============================
Service Area  
==============================-->
    <section class="overflow-hidden space">
        <div class="container">
            <div class="title-area text-center">
                <span class="sub-title">Our Best Services</span>
                <h2 class="sec-title">We solve digital challenges</h2>
            </div>
            <div class="slider-area">
                <div class="swiper th-slider has-shadow" id="serviceSlider2" data-slider-options='{"breakpoints":{"0":{"slidesPerView":1},"576":{"slidesPerView":"1"},"768":{"slidesPerView":"2"},"992":{"slidesPerView":"3"},"1200":{"slidesPerView":"4"}}}'>
                    <div class="swiper-wrapper">

                        <div class="swiper-slide">
                            <div class="service-card th-ani">
                                <div class="box-img global-img">
                                    <img src="assets/img/service/service_1_1.jpg" alt="Service">
                                </div>
                                <div class="box-content">
                                    <h3 class="box-title"><a href="service-details.html">Web Development</a></h3>
                                    <p class="service-card_desc">Open the banner maker, template and start customizing.</p>
                                </div>
                                <a href="service-details.html" class="line-btn">Read Details<i class="fa-regular fa-arrow-right"></i></a>
                            </div>
                        </div>
                        <div class="swiper-slide">
                            <div class="service-card th-ani">
                                <div class="box-img global-img">
                                    <img src="assets/img/service/service_1_2.jpg" alt="Service">
                                </div>
                                <div class="box-content">
                                    <h3 class="box-title"><a href="service-details.html">Cyber Security</a></h3>
                                    <p class="service-card_desc">Cybersecurity refers to the practice of protecting computer.</p>
                                </div>
                                <a href="service-details.html" class="line-btn">Read Details<i class="fa-regular fa-arrow-right"></i></a>
                            </div>
                        </div>
                        <div class="swiper-slide">
                            <div class="service-card th-ani">
                                <div class="box-img global-img">
                                    <img src="assets/img/service/service_1_3.jpg" alt="Service">
                                </div>
                                <div class="box-content">
                                    <h3 class="box-title"><a href="service-details.html">App Development</a></h3>
                                    <p class="service-card_desc">App development, short for application development</p>
                                </div>
                                <a href="service-details.html" class="line-btn">Read Details<i class="fa-regular fa-arrow-right"></i></a>
                            </div>
                        </div>
                        <div class="swiper-slide">
                            <div class="service-card th-ani">
                                <div class="box-img global-img">
                                    <img src="assets/img/service/service_1_4.jpg" alt="Service">
                                </div>
                                <div class="box-content">
                                    <h3 class="box-title"><a href="service-details.html">Cloud Service</a></h3>
                                    <p class="service-card_desc">Cloud services refer to a broad category of on-demand</p>
                                </div>
                                <a href="service-details.html" class="line-btn">Read Details<i class="fa-regular fa-arrow-right"></i></a>
                            </div>
                        </div>
                        <div class="swiper-slide">
                            <div class="service-card th-ani">
                                <div class="box-img global-img">
                                    <img src="assets/img/service/service_1_1.jpg" alt="Service">
                                </div>
                                <div class="box-content">
                                    <h3 class="box-title"><a href="service-details.html">Web Development</a></h3>
                                    <p class="service-card_desc">Open the banner maker, template and start customizing.</p>
                                </div>
                                <a href="service-details.html" class="line-btn">Read Details<i class="fa-regular fa-arrow-right"></i></a>
                            </div>
                        </div>
                        <div class="swiper-slide">
                            <div class="service-card th-ani">
                                <div class="box-img global-img">
                                    <img src="assets/img/service/service_1_2.jpg" alt="Service">
                                </div>
                                <div class="box-content">
                                    <h3 class="box-title"><a href="service-details.html">Cyber Security</a></h3>
                                    <p class="service-card_desc">Cybersecurity refers to the practice of protecting computer.</p>
                                </div>
                                <a href="service-details.html" class="line-btn">Read Details<i class="fa-regular fa-arrow-right"></i></a>
                            </div>
                        </div>
                    </div>
                </div>
                <button data-slider-prev="#serviceSlider2" class="slider-arrow slider-prev"><i class="far fa-arrow-left"></i></button>
                <button data-slider-next="#serviceSlider2" class="slider-arrow slider-next"><i class="far fa-arrow-right"></i></button>
            </div>
        </div>
    </section>
    <div class="choose-area m-2 mt-0 th-radius2 overflow-hidden space" data-bg-src="assets/img/bg/choose_bg_1.jpg">
        <div class="container">
            <div class="row">
                <div class="col-lg-6">
                    <div class="title-area wow fadeInLeft">
                        <span class="sub-title style1">Why Choose Us</span>
                        <h2 class="sec-title text-white">Reliable web development company of world’s pioneering brands.</h2>
                    </div>
                    <div class="choose-about wow fadeInUp">
                        <div class="choose-about_icon">
                            <img src="assets/img/icon/choose_1_1.svg" alt="image">
                        </div>
                        <div class="media-body">
                            <h3 class="box-title text-white">Efficiency & Management</h3>
                            <p class="choose-about_text">Efficiency and management are key aspects of any successful organization, whether it's a business.</p>
                        </div>
                    </div>
                    <div class="choose-about wow fadeInUp">
                        <div class="choose-about_icon">
                            <img src="assets/img/icon/choose_1_2.svg" alt="image">
                        </div>
                        <div class="media-body">
                            <h3 class="box-title text-white">Effective Team Work</h3>
                            <p class="choose-about_text">Effective teamwork requires clear communication, mutual trust, and a shared commitment to common goals</p>
                        </div>
                    </div>
                    <div class="choose-about wow fadeInUp">
                        <div class="choose-about_icon">
                            <img src="assets/img/icon/choose_1_3.svg" alt="image">
                        </div>
                        <div class="media-body">
                            <h3 class="box-title text-white">Amazing Growth Flow</h3>
                            <p class="choose-about_text">An amazing growth flow involves a dynamic combination of strategic innovation and adaptable leadership</p>
                        </div>
                    </div>
                    <div class="choose-about wow fadeInUp">
                        <div class="choose-about_icon">
                            <img src="assets/img/icon/choose_1_4.svg" alt="image">
                        </div>
                        <div class="media-body">
                            <h3 class="box-title text-white">Awesome Success Rates</h3>
                            <p class="choose-about_text">Awesome success rates result from meticulous planning, consistent effort, and a resilient mindset</p>
                        </div>
                    </div>
                </div>
                <div class="col-lg-6">
                    <div class="choose-image global-image">
                        <div class="img1 th-anim">
                            <img src="assets/img/normal/choose_1.jpg" alt="Choose">
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div><!--==============================
feature Area  
==============================-->
    <div class="feature-sec m-2 mb-0 th-radius2 overflow-hidden space" id="feature-area">
        <div class="container">
            <div class="title-area text-center">
                <span class="sub-title">Our Features</span>
                <h2 class="sec-title">Explore our amazing features</h2>
            </div>
            <div class="row gy-4  justify-content-center">
                <div class="col-md-6 col-xl-3">
                    <div class="feature-item  th-ani">
                        <div class="feature-item_icon">
                            <img src="assets/img/icon/feature_1_1.svg" alt="icon">
                        </div>
                        <div class="media-body">
                            <h3 class="box-title">Cost-effectiveness</h3>
                            <p class="feature-item_text">Cost-effectiveness is achieved through strategic planning</p>
                        </div>
                    </div>
                </div>
                <div class="col-md-6 col-xl-3">
                    <div class="feature-item th-ani">
                        <div class="feature-item_icon">
                            <img src="assets/img/icon/feature_1_2.svg" alt="icon">
                        </div>
                        <div class="media-body">
                            <h3 class="box-title">Innovative Technology</h3>
                            <p class="feature-item_text">Innovative technology drives progress by seamlessly</p>
                        </div>
                    </div>
                </div>
                <div class="col-md-6 col-xl-3">
                    <div class="feature-item th-ani">
                        <div class="feature-item_icon">
                            <img src="assets/img/icon/feature_1_3.svg" alt="icon">
                        </div>
                        <div class="media-body">
                            <h3 class="box-title">Industry Expertise</h3>
                            <p class="feature-item_text">Industry expertise is the cornerstone of informed decision-making
                            </p>
                        </div>
                    </div>
                </div>
                <div class="col-md-6 col-xl-3">
                    <div class="feature-item th-ani">
                        <div class="feature-item_icon">
                            <img src="assets/img/icon/feature_1_4.svg" alt="icon">
                        </div>
                        <div class="media-body">
                            <h3 class="box-title">Scalability</h3>
                            <p class="feature-item_text">Scalability empowers businesses to grow seamlessly, adapting</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div><!--==============================
About Area  
==============================-->
    <div class="space-top" id="about-sec">
        <div class="container">
            <div class="about-area">
                <div class="row">
                    <div class="about-title-area">
                        <div class="title-area mb-25">
                            <span class="sub-title style1">About Us</span>
                            <h2 class="sec-title">A preferred Web development company of world’s pioneering brands.</h2>
                            <p class="about-text mb-0">Their team's technical expertise is truly outstanding. They took the time
                                to thoroughly understand our goals and requirements and then designed and implemented
                                solutions that not only addressed our immediate challenges but also positioned us for future growth</p>
                        </div>
                        <div class="checklist">
                            <ul>
                                <li>Turn your data into insights that drive business growth.</li>
                                <li>Identify trends and patterns in your data.</li>
                            </ul>
                        </div>
                        <div class="btn-group mt-45 justify-content-start">
                            <a href="about.html" class="th-btn">Learn More About Us</a>
                        </div>
                    </div>
                </div>
                <div class="about-shape th-anim"><img src="assets/img/bg/about_bg_1.png" alt=""></div>
            </div>
        </div>
    </div><!--==============================
Cta Area  
==============================-->
    <section class="space">
        <div class="container">
            <div class="cta-area">
                <div class="cta-feature_wrapper">
                    <div class="cta-feature_img th-anim">
                        <img src="assets/img/normal/cta-1.png" alt="">
                    </div>
                    <div class="cta-title-area">
                        <div class="title-area mb-45 text-center">
                            <span class="sub-title"> Lets’s consultation </span>
                            <h2 class="sec-title">We Make Awesome IT Services For Your Newly Business</h2>
                        </div>
                        <div class="feature-area2">
                            <a href="about.html" class="th-btn">Start A Projects</a>
                            <div class="feature-wrapper style2">
                                <div class="feature-icon">
                                    <a href="tel:+2583258235"><i class="fa-solid fa-phone"></i></a>
                                </div>
                                <div class="media-body">
                                    <p class="header-info_link"><a href="tel:+2583258235">Call Us: 258-3258 235</a></p>
                                    <span class="header-info_label">For any question</span>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="cta-feature_img th-anim">
                        <img src="assets/img/normal/cta-2.png" alt="">
                    </div>
                </div>
                <div class="swiper th-slider brand-slider" id="brandSlider2" data-slider-options='{"breakpoints":{"0":{"slidesPerView":1},"576":{"slidesPerView":"2"},"768":{"slidesPerView":"3"},"992":{"slidesPerView":"3"},"1200":{"slidesPerView":"4"},"1400":{"slidesPerView":"5"}}}'>
                    <div class="swiper-wrapper">
                        <div class="swiper-slide">
                            <div class="brand-card wow fadeInLeft">
                                <a href="">
                                    <img class="original" src="assets/img/brand/brand_3_1.svg" alt="Brand Logo">
                                    <img class="gray" src="assets/img/brand/brand_3_1.svg" alt="Brand Logo">
                                </a>
                            </div>
                        </div>
                        <div class="swiper-slide">
                            <div class="brand-card wow fadeInLeft">
                                <a href="">
                                    <img class="original" src="assets/img/brand/brand_3_2.svg" alt="Brand Logo">
                                    <img class="gray" src="assets/img/brand/brand_3_2.svg" alt="Brand Logo">
                                </a>
                            </div>
                        </div>
                        <div class="swiper-slide">
                            <div class="brand-card wow fadeInLeft">
                                <a href="">
                                    <img class="original" src="assets/img/brand/brand_3_3.svg" alt="Brand Logo">
                                    <img class="gray" src="assets/img/brand/brand_3_3.svg" alt="Brand Logo">
                                </a>
                            </div>
                        </div>
                        <div class="swiper-slide">
                            <div class="brand-card wow fadeInLeft">
                                <a href="">
                                    <img class="original" src="assets/img/brand/brand_3_4.svg" alt="Brand Logo">
                                    <img class="gray" src="assets/img/brand/brand_3_4.svg" alt="Brand Logo">
                                </a>
                            </div>
                        </div>
                        <div class="swiper-slide">
                            <div class="brand-card wow fadeInLeft">
                                <a href="">
                                    <img class="original" src="assets/img/brand/brand_3_5.svg" alt="Brand Logo">
                                    <img class="gray" src="assets/img/brand/brand_3_5.svg" alt="Brand Logo">
                                </a>
                            </div>
                        </div>
                        <div class="swiper-slide">
                            <div class="brand-card wow fadeInLeft">
                                <a href="">
                                    <img class="original" src="assets/img/brand/brand_3_1.svg" alt="Brand Logo">
                                    <img class="gray" src="assets/img/brand/brand_3_1.svg" alt="Brand Logo">
                                </a>
                            </div>
                        </div>
                        <div class="swiper-slide">
                            <div class="brand-card wow fadeInLeft">
                                <a href="">
                                    <img class="original" src="assets/img/brand/brand_3_2.svg" alt="Brand Logo">
                                    <img class="gray" src="assets/img/brand/brand_3_2.svg" alt="Brand Logo">
                                </a>
                            </div>
                        </div>
                    </div>

                </div>
            </div>
        </div>
    </section><!--==============================
Process Area  
==============================-->
    <section class="space" data-bg-src="assets/img/bg/process_bg_1.jpg">
        <div class="container">
            <div class="title-area text-center text-md-start">
                <span class="sub-title">OUR WORK PROCESS</span>
                <h2 class="sec-title">Bringing the best IT vendors to you.</h2>
            </div>
            <div class="row">
                <div class="col-md-6 col-lg-3 process-box-wrap">
                    <div class="process-box">
                        <div class="process-box_icon">
                            <img src="assets/img/icon/process_1_1.svg" alt="service image">
                            <p class="box-number">01</p>
                        </div>
                        <h3 class="process-box_title">Project Planning</h3>
                        <p class="process-box_text">Internal or 'organic' sources without turnkey growth strategies. Seamlessly promote client-centered</p>
                    </div>
                </div>
                <div class="col-md-6 col-lg-3 process-box-wrap">
                    <div class="process-box">
                        <div class="process-box_icon">
                            <img src="assets/img/icon/process_1_2.svg" alt="service image">
                            <p class="box-number">02</p>
                        </div>
                        <h3 class="process-box_title">Request A Meeting</h3>
                        <p class="process-box_text">Vulnerable for web iterate process before meta services impact with olisticly enable geting.</p>
                    </div>
                </div>
                <div class="col-md-6 col-lg-3 process-box-wrap">
                    <div class="process-box">
                        <div class="process-box_icon">
                            <img src="assets/img/icon/process_1_3.svg" alt="service image">
                            <p class="box-number">03</p>
                        </div>
                        <h3 class="process-box_title">Start Planning</h3>
                        <p class="process-box_text">Of setting for web iterate process before meta services impact with olisticly enable power.</p>
                    </div>
                </div>
                <div class="col-md-6 col-lg-3 process-box-wrap">
                    <div class="process-box">
                        <div class="process-box_icon">
                            <img src="assets/img/icon/process_1_4.svg" alt="service image">
                            <p class="box-number">04</p>
                        </div>
                        <h3 class="process-box_title">Request A Meeting</h3>
                        <p class="process-box_text">Getting on for web iterate process before meta services impact with olisticly enable silent.</p>
                    </div>
                </div>
            </div>
        </div>
    </section><!--==============================
appointment Area  
==============================-->
    <section class="space-top">
        <div class="container">
            <div class="appointment-area th-radius position-relative overflow-hidden" data-bg-src="assets/img/bg/appointment_bg_1.jpg">
                <div class="row">
                    <div class="col-xl-5">
                        <div class="title-area mb-35 text-xl-start">
                            <span class="sub-title style1 text-white">Need Help?</span>
                            <h2 class="sec-title text-white">We are ready to work for your projects</h2>
                            <p class="sec-desc text-white">Phasellus parturient est cum dictum habitant eros fames, enim
                                curabitur
                                convallis arcu dictumst fermentum cubilia leo maecenas in pellentesque.</p>
                        </div>
                        <div class="feature-wrapper style4">
                            <div class="feature-icon">
                                <a href="tel:+2583258235"><i class="fa-solid fa-phone"></i></a>
                            </div>
                            <div class="media-body">
                                <p class="header-info_link"><a href="tel:+2583258235">Call Us: 258-3258 235</a></p>
                                <span class="header-info_label">For any question</span>
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-7">
                        <div class="appointment-area-wrapper">
                            <form action="mail.php" method="POST" class="appointment-form2 input-smoke ajax-contact">
                                <div class="row">
                                    <div class="form-group col-md-6">
                                        <input type="text" class="form-control" name="name" id="name" placeholder="Your Name">
                                    </div>
                                    <div class="form-group col-md-6">
                                        <input type="email" class="form-control" name="email" id="email" placeholder="Email Address">
                                    </div>
                                    <div class="form-group col-md-6">
                                        <input type="tel" class="form-control" name="number" id="number" placeholder="Phone Number">
                                    </div>
                                    <div class="form-group col-md-6">
                                        <input type="text" class="form-control" name="text" id="text" placeholder="What is your budget?">
                                    </div>
                                    <div class="form-group col-12">
                                        <textarea name="message" id="message" cols="30" rows="3" class="form-control" placeholder="Write your message here"></textarea>
                                    </div>
                                    <div class="form-btn col-12">
                                        <button class="th-btn style3">Submit Message</button>
                                    </div>
                                </div>
                                <p class="form-messages mb-0 mt-3"></p>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section><!--==============================
Blog Area  
==============================-->
    <section class="overflow-hidden space" id="blog-sec">
        <div class="container">
            <div class="title-area text-center">
                <span class="sub-title">News & Article</span>
                <h2 class="sec-title">Latest news and updates</h2>
            </div>
            <div class="slider-area">
                <div class="swiper th-slider has-shadow" id="blogSlider1" data-slider-options='{"breakpoints":{"0":{"slidesPerView":1},"576":{"slidesPerView":"1"},"768":{"slidesPerView":"2"},"992":{"slidesPerView":"2"},"1200":{"slidesPerView":"3"}}}'>
                    <div class="swiper-wrapper">
                        <div class="swiper-slide">
                            <div class="blog-box th-ani">
                                <div class="blog-img">
                                    <img src="assets/img/blog/blog_2_1.jpg" alt="blog image">
                                </div>
                                <div class="blog-box_content">
                                    <div class="blog-meta">
                                        <a href="blog.html"><i class="far fa-calendar"></i>25 Feb , 2024</a>
                                        <a class="author" href="blog.html"><i class="far fa-user"></i>By Webtek</a>
                                    </div>
                                    <h3 class="box-title"><a href="blog-details.html">Developers within IT teams are responsible for creating and deploying software</a></h3>
                                    <a href="blog-details.html" class="line-btn">Read Details<i class="fa-solid fa-angles-right"></i></a>
                                </div>
                            </div>
                        </div>

                        <div class="swiper-slide">
                            <div class="blog-box th-ani">
                                <div class="blog-img">
                                    <img src="assets/img/blog/blog_2_2.jpg" alt="blog image">
                                </div>
                                <div class="blog-box_content">
                                    <div class="blog-meta">
                                        <a href="blog.html"><i class="far fa-calendar"></i>25 Feb , 2024</a>
                                        <a class="author" href="blog.html"><i class="far fa-user"></i>By Webtek</a>
                                    </div>
                                    <h3 class="box-title"><a href="blog-details.html">Implementing Strategic IT Solutions for the Seamless Integration enhanced Security</a></h3>
                                    <a href="blog-details.html" class="line-btn">Read Details<i class="fa-solid fa-angles-right"></i></a>
                                </div>
                            </div>
                        </div>

                        <div class="swiper-slide">
                            <div class="blog-box th-ani">
                                <div class="blog-img">
                                    <img src="assets/img/blog/blog_2_3.jpg" alt="blog image">
                                </div>
                                <div class="blog-box_content">
                                    <div class="blog-meta">
                                        <a href="blog.html"><i class="far fa-calendar"></i>25 Feb , 2024</a>
                                        <a class="author" href="blog.html"><i class="far fa-user"></i>By Webtek</a>
                                    </div>
                                    <h3 class="box-title"><a href="blog-details.html">Developers within IT teams are responsible for creating and deploying software</a></h3>
                                    <a href="blog-details.html" class="line-btn">Read Details<i class="fa-solid fa-angles-right"></i></a>
                                </div>
                            </div>
                        </div>

                        <div class="swiper-slide">
                            <div class="blog-box th-ani">
                                <div class="blog-img">
                                    <img src="assets/img/blog/blog_2_1.jpg" alt="blog image">
                                </div>
                                <div class="blog-box_content">
                                    <div class="blog-meta">
                                        <a href="blog.html"><i class="far fa-calendar"></i>25 Feb , 2024</a>
                                        <a class="author" href="blog.html"><i class="far fa-user"></i>By Webtek</a>
                                    </div>
                                    <h3 class="box-title"><a href="blog-details.html">Embracing Next-Generation IT Solutions to Propel Businesses into a New Era of Efficiency.</a></h3>
                                    <a href="blog-details.html" class="line-btn">Read Details<i class="fa-solid fa-angles-right"></i></a>
                                </div>
                            </div>
                        </div>

                        <div class="swiper-slide">
                            <div class="blog-box th-ani">
                                <div class="blog-img">
                                    <img src="assets/img/blog/blog_2_2.jpg" alt="blog image">
                                </div>
                                <div class="blog-box_content">
                                    <div class="blog-meta">
                                        <a href="blog.html"><i class="far fa-calendar"></i>25 Feb , 2024</a>
                                        <a class="author" href="blog.html"><i class="far fa-user"></i>By Webtek</a>
                                    </div>
                                    <h3 class="box-title"><a href="blog-details.html">Developers within IT teams are responsible for creating and deploying software</a></h3>
                                    <a href="blog-details.html" class="line-btn">Read Details<i class="fa-solid fa-angles-right"></i></a>
                                </div>
                            </div>
                        </div>

                        <div class="swiper-slide">
                            <div class="blog-box th-ani">
                                <div class="blog-img">
                                    <img src="assets/img/blog/blog_2_3.jpg" alt="blog image">
                                </div>
                                <div class="blog-box_content">
                                    <div class="blog-meta">
                                        <a href="blog.html"><i class="far fa-calendar"></i>25 Feb , 2024</a>
                                        <a class="author" href="blog.html"><i class="far fa-user"></i>By Webtek</a>
                                    </div>
                                    <h3 class="box-title"><a href="blog-details.html">Implementing Strategic IT Solutions for the Seamless Integration enhanced Security</a></h3>
                                    <a href="blog-details.html" class="line-btn">Read Details<i class="fa-solid fa-angles-right"></i></a>
                                </div>
                            </div>
                        </div>

                    </div>
                </div>
                <button data-slider-prev="#blogSlider1" class="slider-arrow slider-prev"><i class="far fa-arrow-left"></i></button>
                <button data-slider-next="#blogSlider1" class="slider-arrow slider-next"><i class="far fa-arrow-right"></i></button>
            </div>
        </div>
    </section><!--==============================
Brand Area  
==============================-->
    <div class="brand-area space-bottom">
        <div class="container">
            <div class="swiper th-slider" id="brandSlider1" data-slider-options='{"breakpoints":{"0":{"slidesPerView":1},"576":{"slidesPerView":"2"},"768":{"slidesPerView":"3"},"992":{"slidesPerView":"3"},"1200":{"slidesPerView":"4"},"1400":{"slidesPerView":"5"}}}'>
                <div class="swiper-wrapper">
                    <div class="swiper-slide">
                        <div class="brand-item wow fadeInLeft">
                            <a href="">
                                <img class="original" src="assets/img/brand/brand_1_1.svg" alt="Brand Logo">
                                <img class="gray" src="assets/img/brand/brand_1_1.svg" alt="Brand Logo">
                            </a>
                        </div>
                    </div>
                    <div class="swiper-slide">
                        <div class="brand-item wow fadeInLeft">
                            <a href="">
                                <img class="original" src="assets/img/brand/brand_1_2.svg" alt="Brand Logo">
                                <img class="gray" src="assets/img/brand/brand_1_2.svg" alt="Brand Logo">
                            </a>
                        </div>
                    </div>
                    <div class="swiper-slide">
                        <div class="brand-item wow fadeInLeft">
                            <a href="">
                                <img class="original" src="assets/img/brand/brand_1_3.svg" alt="Brand Logo">
                                <img class="gray" src="assets/img/brand/brand_1_3.svg" alt="Brand Logo">
                            </a>
                        </div>
                    </div>
                    <div class="swiper-slide">
                        <div class="brand-item wow fadeInLeft">
                            <a href="">
                                <img class="original" src="assets/img/brand/brand_1_4.svg" alt="Brand Logo">
                                <img class="gray" src="assets/img/brand/brand_1_4.svg" alt="Brand Logo">
                            </a>
                        </div>
                    </div>
                    <div class="swiper-slide">
                        <div class="brand-item wow fadeInLeft">
                            <a href="">
                                <img class="original" src="assets/img/brand/brand_1_5.svg" alt="Brand Logo">
                                <img class="gray" src="assets/img/brand/brand_1_5.svg" alt="Brand Logo">
                            </a>
                        </div>
                    </div>
                    <div class="swiper-slide">
                        <div class="brand-item wow fadeInLeft">
                            <a href="">
                                <img class="original" src="assets/img/brand/brand_1_1.svg" alt="Brand Logo">
                                <img class="gray" src="assets/img/brand/brand_1_1.svg" alt="Brand Logo">
                            </a>
                        </div>
                    </div>
                    <div class="swiper-slide">
                        <div class="brand-item wow fadeInLeft">
                            <a href="">
                                <img class="original" src="assets/img/brand/brand_1_2.svg" alt="Brand Logo">
                                <img class="gray" src="assets/img/brand/brand_1_2.svg" alt="Brand Logo">
                            </a>
                        </div>
                    </div>
                </div>

            </div>
        </div>
    </div> <!--==============================
	Footer Area
==============================-->
    <footer class="footer-wrapper footer-layout1" data-bg-src="assets/img/bg/footer_bg_1.jpg">
        <div class="widget-area">
            <div class="container">
                <div class="row justify-content-between">
                    <div class="col-xl-12">
                        <div class="footer-top-area">
                            <div class="footer-top">
                                <div class="footer-logo">
                                    <a href="index.html"><img src="assets/img/logo-footer.svg" alt="Webtek"></a>
                                </div>
                                <div class="">
                                    <p class="footer-text">Their team's technical expertise is truly outstanding. They took
                                        the time to thoroughly understand our goals and requirements and then designed and
                                        implemented solutions that not only addressed our immediate challenges but also
                                        positioned us for future growth.</p>
                                </div>
                            </div>
                            <div class="footer-menu-area">
                                <ul class="footer-menu">
                                    <li>
                                        <a href="index.html">Home</a>
                                    </li>
                                    <li><a href="#">Pages</a></li>
                                    <li><a href="service.html">Services</a></li>
                                    <li><a href="blog.html">Blog</a></li>
                                    <li><a href="contact.html">Contact</a></li>
                                </ul>
                                <div class="th-social">
                                    <a href="https://www.facebook.com/"><i class="fab fa-facebook-f"></i></a>
                                    <a href="https://www.twitter.com/"><i class="fab fa-twitter"></i></a>
                                    <a href="https://www.linkedin.com/"><i class="fab fa-linkedin-in"></i></a>
                                    <a href="https://www.whatsapp.com/"><i class="fab fa-whatsapp"></i></a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row gy-4 justify-content-center justify-content-lg-between">
                    <div class="col-lg-auto">
                        <div class="info-box">
                            <div class="info-box_icon">
                                <i class="fa-solid fa-location-dot"></i>
                            </div>
                            <div>
                                <span class="info-box_subtitle">Address</span>
                                <p class="info-box_text">12 Division Park, SKY <span class="d-block"> 12546. Berlin</span></p>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-auto">
                        <div class="info-box">
                            <div class="info-box_icon">
                                <i class="fa-solid fa-envelope"></i>
                            </div>
                            <div>
                                <span class="info-box_subtitle">Email</span>
                                <p class="info-box_text">
                                    <a href="mailto:help@webteck-mail.com" class="info-box_link">help@webteck-mail.com</a>
                                    <a href="mailto:24/7@webteck-online.com" class="info-box_link">24/7@webteck-online.com</a>
                                </p>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-auto">
                        <div class="info-box">
                            <div class="info-box_icon">
                                <i class="fa-solid fa-phone"></i>
                            </div>
                            <div>
                                <span class="info-box_subtitle">Call</span>
                                <p class="info-box_text">
                                    <a href="tel:+215253632156" class="info-box_link">+(215) 2536-32156</a>
                                    <a href="tel:+452369421587" class="info-box_link">+(452) 3694-21587</a>
                                </p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="copyright-wrap text-center">
            <div class="container">
                <p class="copyright-text">Copyright <i class="fal fa-copyright"></i> 2024 <a href="home-web-agency.html">Webtek</a>. All Rights Reserved.</p>
            </div>
        </div>
    </footer>

    <!--********************************
			Code End  Here 
	******************************** -->

    <!-- Scroll To Top -->
    <div class="scroll-top">
        <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
            <path d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" style="transition: stroke-dashoffset 10ms linear 0s; stroke-dasharray: 307.919, 307.919; stroke-dashoffset: 307.919;">
            </path>
        </svg>
    </div>



    <!--==============================
    All Js File
============================== -->
    <!-- Jquery -->
    <script src="assets/js/vendor/jquery-3.7.1.min.js"></script>
    <!-- Swiper Js -->
    <script src="assets/js/swiper-bundle.min.js"></script>
    <!-- Bootstrap -->
    <script src="assets/js/bootstrap.min.js"></script>
    <!-- Magnific Popup -->
    <script src="assets/js/jquery.magnific-popup.min.js"></script>
    <!-- Counter Up -->
    <script src="assets/js/jquery.counterup.min.js"></script>
    <!-- Range Slider -->
    <script src="assets/js/jquery-ui.min.js"></script>
    <!-- imagesloaded -->
    <script src="assets/js/imagesloaded.pkgd.min.js"></script>

    <!-- isotope -->
    <script src="assets/js/isotope.pkgd.min.js"></script>
    <!-- datetimepicker -->
    <script src="assets/js/jquery.datetimepicker.min.js"></script>

    <!-- gsap -->
    <script src="assets/js/gsap.min.js"></script>

    <!-- ScrollTrigger -->
    <script src="assets/js/ScrollTrigger.min.js"></script>

    <!-- nice select -->
    <script src="assets/js/nice-select.min.js"></script>

    <script src="assets/js/smooth-scroll.js"></script>

    <!-- Main Js File -->
    <script src="assets/js/main.js"></script>
</body>

</html>