Access_New/pages/demo-corporate-about.html
2024-09-05 11:33:27 +05:45

505 lines
27 KiB
HTML
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!doctype html>
<html class="no-js" lang="en">
<head>
<title>Crafto - The Multipurpose HTML5 Template</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="author" content="ThemeZaa">
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
<meta name="description" content="Elevate your online presence with Crafto - a modern, versatile, multipurpose Bootstrap 5 responsive HTML5, SCSS template using highly creative 52+ ready demos.">
<link rel="shortcut icon" href="images/favicon.png">
<link rel="apple-touch-icon" href="images/apple-touch-icon-57x57.png">
<link rel="apple-touch-icon" sizes="72x72" href="images/apple-touch-icon-72x72.png">
<link rel="apple-touch-icon" sizes="114x114" href="images/apple-touch-icon-114x114.png">
<link rel="preconnect" href="https://fonts.googleapis.com" crossorigin>
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="stylesheet" href="css/vendors.min.css" />
<link rel="stylesheet" href="css/icon.min.css" />
<link rel="stylesheet" href="css/style.min.css" />
<link rel="stylesheet" href="css/responsive.min.css" />
<link rel="stylesheet" href="demos/corporate/corporate.css" />
</head>
<body data-mobile-nav-trigger-alignment="right" data-mobile-nav-style="modern" data-mobile-nav-bg-color="#242E45">
<div class="box-layout">
<header>
<nav class="navbar navbar-expand-lg header-light bg-white disable-fixed">
<div class="container-fluid">
<div class="col-auto col-xl-3 col-lg-2 me-lg-0 me-auto">
<a class="navbar-brand" href="demo-corporate.html">
<img src="images/demo-corporate-logo-black.png" data-at2x="images/demo-corporate-logo-black@2x.png" alt class="default-logo">
<img src="images/demo-corporate-logo-black.png" data-at2x="images/demo-corporate-logo-black@2x.png" alt class="alt-logo">
<img src="images/demo-corporate-logo-black.png" data-at2x="images/demo-corporate-logo-black@2x.png" alt class="mobile-logo">
</a>
</div>
<div class="col-auto col-xl-6 col-lg-8 menu-order position-static">
<button class="navbar-toggler float-start" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-label="Toggle navigation">
<span class="navbar-toggler-line"></span>
<span class="navbar-toggler-line"></span>
<span class="navbar-toggler-line"></span>
<span class="navbar-toggler-line"></span>
</button>
<div class="collapse navbar-collapse justify-content-center" id="navbarNav">
<ul class="navbar-nav">
<li class="nav-item"><a href="demo-corporate.html" class="nav-link">Home</a></li>
<li class="nav-item"><a href="demo-corporate-about.html" class="nav-link">About</a></li>
<li class="nav-item dropdown dropdown-with-icon-style02">
<a href="demo-corporate-services.html" class="nav-link">Services</a>
<i class="fa-solid fa-angle-down dropdown-toggle" id="navbarDropdownMenuLink" role="button" data-bs-toggle="dropdown" aria-expanded="false"></i>
<ul class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
<li><a href="demo-corporate-services-details.html"><i class="line-icon-Medal-2"></i>Business planning</a></li>
<li><a href="demo-corporate-services-details.html"><i class="line-icon-Archery-2"></i>Market research</a></li>
<li><a href="demo-corporate-services-details.html"><i class="line-icon-Financial"></i>Business consulting</a></li>
<li><a href="demo-corporate-services-details.html"><i class="line-icon-Money-Bag"></i>Audience analysis</a></li>
</ul>
</li>
<li class="nav-item"><a href="demo-corporate-customer-stories.html" class="nav-link">Testimonials</a></li>
<li class="nav-item"><a href="demo-corporate-pricing.html" class="nav-link">Pricing</a></li>
<li class="nav-item"><a href="demo-corporate-blog.html" class="nav-link">Blog</a></li>
<li class="nav-item"><a href="demo-corporate-contact.html" class="nav-link">Contact</a></li>
</ul>
</div>
</div>
<div class="col-auto col-xl-3 col-lg-2 text-end md-pe-0">
<div class="header-icon">
<div class="header-search-icon icon">
<a href="demo-corporate-about.html#" class="search-form-icon header-search-form"><i class="feather icon-feather-search"></i></a>
<div class="search-form-wrapper">
<button title="Close" type="button" class="search-close">×</button>
<form id="search-form" role="search" method="get" class="search-form text-left" action="search-result.html">
<div class="search-form-box">
<h2 class="text-dark-gray text-center fw-600 mb-4 ls-minus-1px">What are you looking for?</h2>
<input class="search-input" id="search-form-input5e219ef164995" placeholder="Enter your keywords..." name="s" value type="text" autocomplete="off">
<button type="submit" class="search-button">
<i class="feather icon-feather-search" aria-hidden="true"></i>
</button>
</div>
</form>
</div>
</div>
<div class="header-button ms-20px d-none d-xl-inline-block">
<a href="demo-corporate-contact.html" class="btn btn-rounded btn-transparent-light-gray border-1 btn-medium btn-switch-text text-transform-none">
<span>
<span class="btn-double-text fw-600" data-text="Free consultation">Free consultation</span>
<span><i class="fa-regular fa-envelope"></i></span>
</span>
</a>
</div>
</div>
</div>
</div>
</nav>
</header>
<section class="top-space-margin page-title-big-typography border-radius-6px lg-border-radius-0px p-0" data-parallax-background-ratio="0.5" style="background-image: url('images/demo-corporate-about-title-bg.jpg')">
<div class="opacity-extra-medium bg-blue-whale"></div>
<div class="container">
<div class="row align-items-center justify-content-center small-screen">
<div class="col-lg-8 position-relative text-center page-title-extra-large" data-anime="{ &quot;el&quot;: &quot;childs&quot;, &quot;translateY&quot;: [50, 0], &quot;opacity&quot;: [0,1], &quot;duration&quot;: 600, &quot;delay&quot;: 0, &quot;staggervalue&quot;: 300, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<h1 class="m-auto text-white text-shadow-double-large fw-600 ls-minus-2px">About us</h1>
</div>
<div class="down-section text-center" data-anime="{ &quot;translateY&quot;: [-50, 0], &quot;opacity&quot;: [0,1], &quot;duration&quot;: 600, &quot;delay&quot;: 0, &quot;staggervalue&quot;: 300, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<a href="demo-corporate-about.html#down-section" class="section-link">
<div class="text-white">
<i class="feather icon-feather-chevron-down icon-very-medium"></i>
</div>
</a>
</div>
</div>
</div>
</section>
<section id="down-section" class="border-bottom border-color-extra-medium-gray">
<div class="container overlap-gap-section">
<div class="row align-items-end justify-content-center mb-5 md-mb-40px text-center text-md-start">
<div class="col-xl-5 col-lg-6 col-md-10 md-mb-20px text-center text-lg-start" data-anime="{ &quot;el&quot;: &quot;childs&quot;, &quot;translateY&quot;: [30, 0], &quot;opacity&quot;: [0,1], &quot;duration&quot;: 600, &quot;delay&quot;: 0, &quot;staggervalue&quot;: 300, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<span class="ps-25px pe-25px mb-20px text-uppercase text-base-color fs-14 lh-42px fw-700 border-radius-100px bg-gradient-very-light-gray-transparent d-inline-block">About company</span>
<h3 class="text-dark-gray fw-700 mb-0 ls-minus-1px">Powerful agency for corporate business.</h3>
</div>
<div class="col-xl-6 col-lg-6 col-md-10 offset-xl-1 text-center text-lg-start last-paragraph-no-margin">
<p class="w-90 xl-w-100" data-anime="{ &quot;el&quot;: &quot;lines&quot;, &quot;translateY&quot;: [30, 0], &quot;opacity&quot;: [0,1], &quot;duration&quot;: 600, &quot;delay&quot;: 0, &quot;staggervalue&quot;: 300, &quot;easing&quot;: &quot;easeOutQuad&quot; }">We strive to develop real-world web solutions that are ideal for small to large projects with bespoke project requirements. we compelling web, <span class="fw-600 text-dark-gray text-decoration-line-bottom">which are the right-fit for your target.</span></p>
</div>
</div>
<div class="row row-cols-1 row-cols-lg-4 row-cols-md-2 row-cols-sm-2 justify-content-center" data-anime="{ &quot;el&quot;: &quot;childs&quot;, &quot;translateY&quot;: [30, 0], &quot;opacity&quot;: [0,1], &quot;duration&quot;: 600, &quot;delay&quot;: 0, &quot;staggervalue&quot;: 150, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<div class="col custom-icon-with-text-style-02">
<div class="feature-box p-6 last-paragraph-no-margin overflow-hidden md-mb-20px">
<div class="feature-box-icon">
<img class="custom-image-icon mb-20px" src="images/demo-corporate-about-icon-01.png" alt />
</div>
<div class="feature-box-content">
<span class="d-block fs-19 fw-700 text-dark-gray mb-5px">Trusted company</span>
<p>We deliver email marketing campaigns to audience.</p>
</div>
</div>
</div>
<div class="col custom-icon-with-text-style-02">
<div class="feature-box p-6 last-paragraph-no-margin overflow-hidden md-mb-20px">
<div class="feature-box-icon">
<img class="custom-image-icon mb-20px" src="images/demo-corporate-about-icon-02.png" alt />
</div>
<div class="feature-box-content">
<span class="d-block fs-19 fw-700 text-dark-gray mb-5px">Professional work</span>
<p>We also help our clients with social media strategy.</p>
</div>
</div>
</div>
<div class="col custom-icon-with-text-style-02">
<div class="feature-box p-6 last-paragraph-no-margin overflow-hidden xs-mb-20px">
<div class="feature-box-icon">
<img class="custom-image-icon mb-20px" src="images/demo-corporate-about-icon-03.png" alt />
</div>
<div class="feature-box-content">
<span class="d-block fs-19 fw-700 text-dark-gray mb-5px">Award winning</span>
<p>We believe in challenges so we have made challenges.</p>
</div>
</div>
</div>
<div class="col custom-icon-with-text-style-02">
<div class="feature-box p-6 last-paragraph-no-margin overflow-hidden">
<div class="feature-box-icon">
<img class="custom-image-icon mb-20px" src="images/demo-corporate-about-icon-04.png" alt />
</div>
<div class="feature-box-content">
<span class="d-block fs-19 fw-700 text-dark-gray mb-5px">Help any time</span>
<p>We never fail for support for your business anywhere.</p>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="py-0 sm-pt-50px" data-anime="{ &quot;translateY&quot;: [0, 0], &quot;opacity&quot;: [0,1], &quot;duration&quot;: 1200, &quot;delay&quot;: 0, &quot;staggervalue&quot;: 150, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<div class="container overlap-section">
<div class="row justify-content-center g-0">
<div class="col-auto text-center last-paragraph-no-margin icon-with-text-style-08 pt-20px pb-20px ps-8 pe-8 md-ps-30px md-pe-30px bg-white border border-color-extra-medium-gray box-shadow-medium-bottom border-radius-100px xs-border-radius-10px">
<div class="feature-box feature-box-left-icon-middle overflow-hidden">
<div class="feature-box-icon me-10px">
<i class="bi bi-chat-text icon-extra-medium text-base-color"></i>
</div>
<div class="feature-box-content last-paragraph-no-margin text-dark-gray text-uppercase fs-15 fw-700 ls-05px">
Let's make something great work together. <a href="demo-corporate-contact.html" class="text-base-color text-decoration-line-bottom-medium border-1">Got a project in mind?</a>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="position-relative overflow-hidden">
<div class="container">
<div class="row justify-content-center align-items-center mb-3">
<div class="col-xl-5 col-lg-6 md-mb-14 sm-mb-18 xs-mb-23 position-relative" data-anime="{ &quot;translateY&quot;: [0, 0], &quot;opacity&quot;: [0,1], &quot;duration&quot;: 800, &quot;delay&quot;: 100, &quot;staggervalue&quot;: 300, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<div class="w-75 sm-w-80" data-animation-delay="200" data-shadow-animation="true" data-bottom-top="transform: translateY(50px)" data-top-bottom="transform: translateY(-50px)">
<img src="images/demo-corporate-about-img-01.jpg" alt class="border-radius-6px w-100">
<div class="position-absolute top-30px z-index-8 left-minus-90px lg-left-minus-25px sm-left-minus-0px lg-w-30">
<img src="images/demo-corporate-about-01.png" alt />
</div>
</div>
<div class="w-55 overflow-hidden position-absolute right-15px xs-w-55 bottom-minus-50px" data-shadow-animation="true" data-animation-delay="100" data-bottom-top="transform: translateY(20px)" data-top-bottom="transform: translateY(-20px)">
<img src="images/demo-corporate-about-img-02.jpg" alt class="border-radius-6px box-shadow-quadruple-large w-100" />
</div>
</div>
<div class="col-xl-5 offset-xl-1 col-lg-6 text-center text-lg-start" data-anime="{ &quot;translateY&quot;: [0, 0], &quot;opacity&quot;: [0,1], &quot;duration&quot;: 800, &quot;delay&quot;: 150, &quot;staggervalue&quot;: 300, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<div class="swiper position-relative magic-cursor" data-slider-options="{ &quot;autoHeight&quot;: true, &quot;loop&quot;: true, &quot;allowTouchMove&quot;: true, &quot;autoplay&quot;: { &quot;delay&quot;: 4000, &quot;disableOnInteraction&quot;: false }, &quot;navigation&quot;: { &quot;nextEl&quot;: &quot;.swiper-button-next&quot;, &quot;prevEl&quot;: &quot;.swiper-button-prev&quot; }, &quot;effect&quot;: &quot;slide&quot; }">
<div class="swiper-wrapper mb-10px">
<div class="swiper-slide">
<span class="ps-25px pe-25px mb-20px text-uppercase text-base-color fs-14 lh-42px fw-700 border-radius-100px bg-gradient-very-light-gray-transparent d-inline-block">Company mission</span>
<h3 class="text-dark-gray fw-700 ls-minus-1px mb-20px">We help to business growth and solution.</h3>
<p class="w-95 xl-w-100">Lorem ipsum is simply dummy text of the printing and typesetting industry. Lorem ipsum has been industry's standard dummy text ever since the when an unknown adipiscing elit do eiusmod tempor incididunt ut labore printer took and scrambled it specimen book.</p>
</div>
<div class="swiper-slide">
<span class="ps-25px pe-25px mb-20px text-uppercase text-base-color fs-14 lh-42px fw-700 border-radius-100px bg-gradient-very-light-gray-transparent d-inline-block">Company vision</span>
<h3 class="text-dark-gray fw-700 ls-minus-1px mb-20px">A business plan and performance ideas.</h3>
<p class="w-95 xl-w-100">Lorem ipsum is simply dummy text of the printing and typesetting industry. Lorem ipsum has been industry's standard dummy text ever since the when an unknown adipiscing elit do eiusmod tempor incididunt ut labore printer took and scrambled it specimen book.</p>
</div>
<div class="swiper-slide">
<span class="ps-25px pe-25px mb-20px text-uppercase text-base-color fs-14 lh-42px fw-700 border-radius-100px bg-gradient-very-light-gray-transparent d-inline-block">Company value</span>
<h3 class="text-dark-gray fw-700 ls-minus-1px mb-20px">Make the creative solutions for business.</h3>
<p class="w-95 xl-w-100">Lorem ipsum is simply dummy text of the printing and typesetting industry. Lorem ipsum has been industry's standard dummy text ever since the when an unknown adipiscing elit do eiusmod tempor incididunt ut labore printer took and scrambled it specimen book.</p>
</div>
</div>
<div class="d-flex justify-content-center justify-content-lg-start">
<div class="slider-one-slide-prev-1 swiper-button-prev slider-navigation-style-04 border border-color-extra-medium-gray bg-white"><i class="bi bi-arrow-left-short icon-very-medium text-dark-gray"></i></div>
<div class="slider-one-slide-next-1 swiper-button-next slider-navigation-style-04 border border-color-extra-medium-gray bg-white"><i class="bi bi-arrow-right-short icon-very-medium text-dark-gray"></i></div>
</div>
</div>
</div>
</div>
</div>
<img src="images/demo-corporate-about-bg-01.png" class="position-absolute bottom-minus-50px right-minus-50px z-index-minus-1" data-bottom-top="transform: rotate(0deg) translateY(0)" data-top-bottom="transform:rotate(-15deg) translateY(0)" alt />
</section>
<section class="bg-gradient-quartz-white border-radius-6px">
<div class="container">
<div class="row justify-content-center mb-3">
<div class="col-xl-5 col-md-7 col-lg-6 col-sm-8 text-center" data-anime="{ &quot;el&quot;: &quot;childs&quot;, &quot;translateY&quot;: [30, 0], &quot;opacity&quot;: [0,1], &quot;duration&quot;: 600, &quot;delay&quot;:0, &quot;staggervalue&quot;: 300, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<h3 class="text-dark-gray fw-700 ls-minus-1px">Committed staff are ready to help you</h3>
</div>
</div>
<div class="row row-cols-1 row-cols-lg-4 row-cols-sm-2" data-anime="{ &quot;el&quot;: &quot;childs&quot;, &quot;translateY&quot;: [50, 0], &quot;opacity&quot;: [0,1], &quot;duration&quot;: 600, &quot;delay&quot;:0, &quot;staggervalue&quot;: 150, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<div class="col team-style-08 border-radius-6px md-mb-30px">
<figure class="mb-0 position-relative overflow-hidden border-radius-4px">
<img src="images/demo-corporate-team-01.jpg" alt />
<figcaption class="w-100 h-100 d-flex align-items-end p-13 lg-p-8 md-p-10 bg-gradient-base-transparent border-radius-6px">
<div class="w-100">
<span class="team-member-name fw-500 text-white d-block">Jeremy dupont</span>
<span class="member-designation fs-15 lh-20 text-white d-block">Director</span>
</div>
<div class="social-icon d-flex flex-column flex-shrink-1">
<a href="https://www.twitter.com/" target="_blank" class="text-dark-gray bg-white"><i class="fa-brands fa-twitter icon-small"></i></a>
</div>
</figcaption>
</figure>
</div>
<div class="col team-style-08 border-radius-6px md-mb-30px">
<figure class="mb-0 position-relative overflow-hidden border-radius-4px">
<img src="images/demo-corporate-team-02.jpg" alt />
<figcaption class="w-100 h-100 d-flex align-items-end p-13 lg-p-8 md-p-10 bg-gradient-base-transparent border-radius-6px">
<div class="w-100">
<span class="team-member-name fw-500 text-white d-block">Jessica dover</span>
<span class="member-designation fs-15 lh-20 text-white d-block">Founder</span>
</div>
<div class="social-icon d-flex flex-column flex-shrink-1">
<a href="https://www.linkedin.com/" target="_blank" class="text-dark-gray bg-white"><i class="fa-brands fa-linkedin-in icon-small"></i></a>
</div>
</figcaption>
</figure>
</div>
<div class="col team-style-08 border-radius-6px xs-mb-30px">
<figure class="mb-0 position-relative overflow-hidden border-radius-4px">
<img src="images/demo-corporate-team-03.jpg" alt />
<figcaption class="w-100 h-100 d-flex align-items-end p-13 lg-p-8 md-p-10 bg-gradient-base-transparent border-radius-6px">
<div class="w-100">
<span class="team-member-name fw-500 text-white d-block">Matthew taylor</span>
<span class="member-designation fs-15 lh-20 text-white d-block">Manager</span>
</div>
<div class="social-icon d-flex flex-column flex-shrink-1">
<a href="https://www.behance.net/" target="_blank" class="text-dark-gray bg-white"><i class="fa-brands fa-behance icon-small"></i></a>
</div>
</figcaption>
</figure>
</div>
<div class="col team-style-08 border-radius-6px">
<figure class="mb-0 position-relative overflow-hidden border-radius-4px">
<img src="images/demo-corporate-team-04.jpg" alt />
<figcaption class="w-100 h-100 d-flex align-items-end p-13 lg-p-8 md-p-10 bg-gradient-base-transparent border-radius-6px">
<div class="w-100">
<span class="team-member-name fw-500 text-white d-block">Johncy parker</span>
<span class="member-designation fs-15 lh-20 text-white d-block">Manager</span>
</div>
<div class="social-icon d-flex flex-column flex-shrink-1">
<a href="https://www.facebook.com/" target="_blank" class="text-dark-gray bg-white"><i class="fa-brands fa-facebook-f icon-small"></i></a>
</div>
</figcaption>
</figure>
</div>
</div>
</div>
</section>
<section class="pt-0">
<div class="container">
<div class="row justify-content-center">
<div class="col-xl-5 col-lg-6 text-center mb-1" data-anime="{ &quot;translateY&quot;: [0, 0], &quot;opacity&quot;: [0,1], &quot;duration&quot;: 600, &quot;delay&quot;: 0, &quot;staggervalue&quot;: 300, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<span class="text-dark-gray fw-700 fs-15 text-uppercase border-1 pb-5px border-bottom border-color-extra-medium-gray text-dark-gray">Join the 10,000+ companies using crafto</span>
</div>
</div>
<div class="row position-relative clients-style-08 mt-25px" data-anime="{ &quot;translateX&quot;: [0, 0], &quot;opacity&quot;: [0,1], &quot;duration&quot;: 800, &quot;delay&quot;:100, &quot;staggervalue&quot;: 150, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<div class="col swiper text-center feather-shadow" data-slider-options="{ &quot;slidesPerView&quot;: 2, &quot;spaceBetween&quot;:0, &quot;speed&quot;: 3000, &quot;loop&quot;: true, &quot;pagination&quot;: { &quot;el&quot;: &quot;.slider-four-slide-pagination-2&quot;, &quot;clickable&quot;: false }, &quot;allowTouchMove&quot;: false, &quot;autoplay&quot;: { &quot;delay&quot;:0, &quot;disableOnInteraction&quot;: false, &quot;pauseOnMouseEnter&quot;: false}, &quot;navigation&quot;: { &quot;nextEl&quot;: &quot;.slider-four-slide-next-2&quot;, &quot;prevEl&quot;: &quot;.slider-four-slide-prev-2&quot; }, &quot;keyboard&quot;: { &quot;enabled&quot;: true, &quot;onlyInViewport&quot;: true }, &quot;breakpoints&quot;: { &quot;1200&quot;: { &quot;slidesPerView&quot;: 5 }, &quot;768&quot;: { &quot;slidesPerView&quot;: 3 }, &quot;576&quot;: { &quot;slidesPerView&quot;: 2 } }, &quot;effect&quot;: &quot;slide&quot; }">
<div class="swiper-wrapper marquee-slide">
<div class="swiper-slide">
<a href="demo-corporate-about.html#"><img src="images/logo-walmart-dark-blue.svg" alt /></a>
</div>
<div class="swiper-slide">
<a href="demo-corporate-about.html#"><img src="images/logo-netflix-dark-blue.svg" alt /></a>
</div>
<div class="swiper-slide">
<a href="demo-corporate-about.html#"><img src="images/logo-invision-dark-blue.svg" alt /></a>
</div>
<div class="swiper-slide">
<a href="demo-corporate-about.html#"><img src="images/logo-yahoo-dark-blue.svg" alt /></a>
</div>
<div class="swiper-slide">
<a href="demo-corporate-about.html#"><img src="images/logo-amazon-dark-blue.svg" alt /></a>
</div>
<div class="swiper-slide">
<a href="demo-corporate-about.html#"><img src="images/logo-walmart-dark-blue.svg" alt /></a>
</div>
<div class="swiper-slide">
<a href="demo-corporate-about.html#"><img src="images/logo-netflix-dark-blue.svg" alt /></a>
</div>
<div class="swiper-slide">
<a href="demo-corporate-about.html#"><img src="images/logo-invision-dark-blue.svg" alt /></a>
</div>
<div class="swiper-slide">
<a href="demo-corporate-about.html#"><img src="images/logo-yahoo-dark-blue.svg" alt /></a>
</div>
<div class="swiper-slide">
<a href="demo-corporate-about.html#"><img src="images/logo-invision-dark-blue.svg" alt /></a>
</div>
</div>
</div>
</div>
</div>
</section>
<footer class="p-0 fs-16 border-top border-color-extra-medium-gray">
<div class="container">
<div class="row justify-content-center pt-6 sm-pt-40px">
<div class="col-6 col-xl-3 col-lg-12 col-sm-6 last-paragraph-no-margin text-xl-start text-lg-center order-sm-1 lg-mb-50px sm-mb-30px">
<a href="demo-corporate.html" class="footer-logo mb-15px d-inline-block"><img src="images/demo-corporate-logo-black.png" data-at2x="images/demo-corporate-logo-black@2x.png" alt></a>
<p class="lh-30 w-90 xl-w-100 mx-lg-auto mx-xl-0">Gearing your company through an innovative strategy.</p>
<div class="elements-social social-icon-style-02 mt-20px xs-mt-15px">
<ul class="medium-icon dark">
<li class="my-0"><a class="facebook" href="https://www.facebook.com/" target="_blank"><i class="fa-brands fa-facebook-f"></i></a></li>
<li class="my-0"><a class="dribbble" href="http://www.dribbble.com" target="_blank"><i class="fa-brands fa-dribbble"></i></a></li>
<li class="my-0"><a class="twitter" href="https://www.twitter.com" target="_blank"><i class="fa-brands fa-twitter"></i></a></li>
<li class="my-0"><a class="instagram" href="https://www.instagram.com" target="_blank"><i class="fa-brands fa-instagram"></i></a></li>
</ul>
</div>
</div>
<div class="col-6 col-xl-2 col-lg-3 col-sm-4 xs-mb-30px order-sm-3 order-lg-2">
<span class="fs-17 fw-600 d-block text-dark-gray mb-5px">Company</span>
<ul>
<li><a href="demo-corporate-about.html">Who we are</a></li>
<li><a href="demo-corporate-services.html">Our services</a><div class="bg-dark-gray fw-600 text-white lh-22 text-uppercase border-radius-30px ps-10px pe-10px fs-10 ms-10px d-inline-block align-middle">Hot</div></li>
<li><a href="demo-corporate-customer-stories.html">Our clients</a></li>
<li><a href="demo-corporate-contact.html">Contact us</a></li>
</ul>
</div>
<div class="col-6 col-xl-2 col-lg-3 col-sm-4 xs-mb-30px order-sm-4 order-lg-3">
<span class="fs-17 fw-600 d-block text-dark-gray mb-5px">Services</span>
<ul>
<li><a href="demo-corporate-services-details.html">Planning</a></li>
<li><a href="demo-corporate-services-details.html">Research</a></li>
<li><a href="demo-corporate-services-details.html">Consulting</a></li>
<li><a href="demo-corporate-services-details.html">Analysis</a></li>
</ul>
</div>
<div class="col-6 col-xl-2 col-lg-3 col-sm-4 xs-mb-30px order-sm-5 order-lg-4">
<span class="fs-17 fw-600 d-block text-dark-gray mb-5px">Customer</span>
<ul>
<li><a href="demo-corporate-customer-stories.html">Client support</a></li>
<li><a href="demo-corporate-customer-stories.html">Help center</a></li>
<li><a href="demo-corporate-customer-stories.html">System status</a></li>
<li><a href="demo-corporate-customer-stories.html">Feedback</a></li>
</ul>
</div>
<div class="col-xl-3 col-lg-3 col-sm-6 md-mb-50px sm-mb-30px xs-mb-0 order-sm-2 order-lg-5">
<span class="fs-17 fw-600 d-block text-dark-gray mb-5px">Subscribe newsletter</span>
<p class="lh-30 w-95 sm-w-100 mb-15px">Subscribe our newsletter to get the latest news and updates!</p>
<div class="d-inline-block w-100 newsletter-style-02 position-relative">
<form action="email-templates/subscribe-newsletter.php" method="post" class="position-relative">
<input class="border-color-extra-medium-gray bg-transparent border-radius-4px w-100 form-control input-small pe-50px required" type="email" name="email" placeholder="Enter your email" />
<input type="hidden" name="redirect" value>
<button class="btn pe-20px submit lh-16" aria-label="submit"><i class="feather icon-feather-mail icon-small text-dark-gray"></i></button>
<div class="form-results border-radius-4px pt-5px pb-5px ps-15px pe-15px fs-14 lh-22 mt-10px w-100 text-center position-absolute d-none"></div>
</form>
</div>
</div>
</div>
<div class="row justify-content-center align-items-center pt-2">
<div class="col-12">
<div class="divider-style-03 divider-style-03-01 border-color-transparent-white-light"></div>
</div>
<div class="col-lg-5 pt-35px pb-35px md-pt-0 order-2 order-lg-1 text-center text-lg-start last-paragraph-no-margin"><p>&copy; 2024 Crafto is Proudly Powered by <a href="https://www.themezaa.com/" target="_blank" class="text-dark-gray fw-600 text-decoration-line-bottom">ThemeZaa</a></p></div>
<div class="col-lg-7 pt-35px pb-35px md-pt-25px md-pb-5px order-1 order-lg-2 text-center text-lg-end">
<ul class="footer-navbar sm-lh-normal">
<li><a href="demo-corporate-about.html#" class="nav-link">Privacy policy</a></li>
<li><a href="demo-corporate-about.html#" class="nav-link">Terms and conditions</a></li>
<li><a href="demo-corporate-about.html#" class="nav-link">Copyright</a></li>
</ul>
</div>
</div>
</div>
</footer>
<div class="scroll-progress d-none d-xxl-block">
<a href="demo-corporate-about.html#" class="scroll-top" aria-label="scroll">
<span class="scroll-text">Scroll</span><span class="scroll-line"><span class="scroll-point"></span></span>
</a>
</div>
</div>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/vendors.min.js"></script>
<script type="text/javascript" src="js/main.js"></script>
</body>
</html>