KeymailSpecials2/Components/Pages/Movers.razor

752 lines
37 KiB
Plaintext
Raw 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.

@page "/"
@layout KeymailSpecials2.Components.Layout.NoNav
<html dir="ltr" lang="en-US">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta http-equiv="x-ua-compatible" content="IE=edge">
<meta name="author" content="SemiColonWeb">
<meta name="description" content="Create Packers, Movers &amp; Shipping Websites with Canvas Template. Get Canvas to build powerful websites easily with the Highly Customizable &amp; Best Selling Bootstrap Template, today.">
<!-- Font Imports -->
<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=Poppins:wght@300;400;500;600;700&display=swap" rel="stylesheet">
<!-- Core Style -->
<link rel="stylesheet" href="style.css">
<!-- Font Icons -->
<link rel="stylesheet" href="css/font-icons.css">
<!-- Plugins/Components CSS -->
<link rel="stylesheet" href="css/components/datepicker.css">
<!-- Niche Demos -->
<link rel="stylesheet" href="demos/movers/movers.css">
<!-- Custom CSS -->
<link rel="stylesheet" href="css/custom.css">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Document Title
============================================= -->
<title>Movers Demo | Canvas</title>
</head>
<body class="stretched">
<!-- Document Wrapper
============================================= -->
<div id="wrapper">
<!-- Header
============================================= -->
<header id="header" class="dark header-size-sm" data-sticky-shrink="false">
<div class="container">
<div class="header-row">
<!-- Logo
============================================= -->
<div id="logo" class="ms-auto ms-md-0">
<a href="">
<img class="logo-default" srcset="images/logo.png, images/logo@2x.png 2x" src="images/logo@2x.png" alt="Canvas Logo">
<img class="logo-dark" srcset="images/logo-dark.png, images/logo-dark@2x.png 2x" src="images/logo-dark@2x.png" alt="Canvas Logo">
</a>
</div><!-- #logo end -->
</div>
</div>
<div id="header-wrap">
<div class="container">
<div class="header-row justify-content-between flex-row-reverse flex-lg-row">
<div class="header-misc">
<!-- Top Search
============================================= -->
<div id="top-search" class="header-misc-icon">
<a href="#" id="top-search-trigger"><i class="uil uil-search"></i><i class="bi-x-lg"></i></a>
</div><!-- #top-search end -->
<!-- Header Buttons
============================================= -->
<div class="header-buttons d-none d-sm-inline-block">
<a href="#slider" data-scrollto="#slider" data-offset="-80" class="button button-rounded button-white button-light button-small m-0">Get a Quote</a>
</div>
</div>
<div class="primary-menu-trigger">
<button class="cnvs-hamburger" type="button" title="Open Mobile Menu">
<span class="cnvs-hamburger-box"><span class="cnvs-hamburger-inner"></span></span>
</button>
</div>
<form class="top-search-form" action="search.html" method="get">
<input type="text" name="q" class="form-control" value="" placeholder="Type &amp; Hit Enter.." autocomplete="off">
</form>
</div>
</div>
</div>
<div class="header-wrap-clone"></div>
</header><!-- #header end -->
<!-- Slider
============================================= -->
<section id="slider" class="slider-element bg-color" style="height: auto; padding: 60px 0; background: url('demos/movers/images/bg-2.png') no-repeat center center / 100% 100%;">
<div class="container mt-4" style="z-index: 2">
<div class="text-center">
<h2 class="text-white h2 fw-semibold mb-2">Welcome to KeyMailSpecials.com!</h2>
<p class="text-white-50"></p>
</div>
<div class="row mt-5 justify-content-center">
<div class="col-lg-6">
<ul class="nav nav-tabs nav-justified flex-column border-bottom-0 flex-md-row bg-color mt-4" role="tablist">
<li class="nav-item">
<a class="nav-link py-3 active" id="login-tab" data-bs-toggle="tab" href="#login" role="tab" aria-controls="login" aria-selected="true">Login</a>
</li>
<li class="nav-item">
<a class="nav-link py-3" id="register-tab" data-bs-toggle="tab" href="#register" role="tab" aria-controls="register" aria-selected="false">Register</a>
</li>
</ul>
<div class="tab-content rounded-bottom shadow bg-white py-4 px-5">
<div class="tab-pane fade show active" id="login" role="tabpanel" aria-labelledby="login-tab">
<p class="mb-4">Please enter your login information.</p>
<div class="form-widget">
<div class="form-result"></div>
<form class="row login-form position-relative mb-0" action="include/form.php" method="post" enctype="multipart/form-data">
<div class="form-process">
<div class="css3-spinner">
<div class="css3-spinner-scaler"></div>
</div>
</div>
<div class="col-sm-6 form-group">
<div class="input-group">
<!--<span class="input-group-text bg-transparent"><i class="bi-telephone-outbound"></i></span>-->
<span class="input-group-text bg-transparent"><i class="bi-person"></i></span>
<input type="text" name="login-form-phone" id="login-form-phone" class="form-control required" value="" placeholder="Username">
</div>
</div>
<div class="col-sm-6 form-group">
<div class="input-group">
<span class="input-group-text bg-transparent"><i class="bi-calendar-week"></i></span>
<input type="text" class="form-control home-date required" name="login-form-date" id="login-form-date" value="" placeholder="Password">
</div>
</div>
<div class="col-12 d-none">
<input type="text" id="login-form-botcheck" name="login-form-botcheck" value="">
</div>
<div class="col-12">
<button type="submit" name="login-form-submit" class="btn bg-color text-white fw-medium w-100 py-2 mt-2">Contact Us</button>
</div>
<input type="hidden" name="prefix" value="login-form-">
<input type="hidden" name="subject" value="Home Moving Request">
<input type="hidden" name="html_title" value="Home Moving">
</form>
</div>
</div>
<div class="tab-pane fade" id="register" role="tabpanel" aria-labelledby="register-tab">
<p class="mb-4">Share your Office Shifting details by Filling out an Easy Form. Get Free Quotes from Verified Packers &amp; Movers Instantly.</p>
<div class="form-widget">
<div class="form-result"></div>
<form class="row register-form position-relative mb-0" action="include/form.php" method="post" enctype="multipart/form-data">
<div class="form-process">
<div class="css3-spinner">
<div class="css3-spinner-scaler"></div>
</div>
</div>
<div class="col-sm-6 form-group">
<div class="input-group">
<span class="input-group-text bg-transparent"><i class="bi-truck"></i></span>
<input type="text" name="register-form-location-from" id="register-form-location-from" class="form-control required" value="" placeholder="Location From">
</div>
</div>
<div class="col-sm-6 form-group">
<div class="input-group">
<span class="input-group-text bg-transparent"><i class="bi-map"></i></span>
<input type="text" name="register-form-location-to" id="register-form-location-to" class="form-control required" value="" placeholder="Location To">
</div>
</div>
<div class="col-sm-6 form-group">
<div class="input-group">
<span class="input-group-text bg-transparent"><i class="bi-person"></i></span>
<input type="text" name="register-form-name" id="register-form-name" class="form-control required" value="" placeholder="Your Full Name">
</div>
</div>
<div class="col-sm-6 form-group">
<div class="input-group">
<span class="input-group-text bg-transparent"><i class="bi-envelope"></i></span>
<input type="email" name="register-form-email" id="register-form-email" class="form-control required" value="" placeholder="Your Email">
</div>
</div>
<div class="col-sm-6 form-group">
<div class="input-group">
<span class="input-group-text bg-transparent"><i class="bi-telephone-outbound"></i></span>
<input type="text" name="register-form-phone" id="register-form-phone" class="form-control required" value="" placeholder="Your Phone Number">
</div>
</div>
<div class="col-sm-6 form-group">
<div class="input-group">
<span class="input-group-text bg-transparent"><i class="bi-calendar-week"></i></span>
<input type="text" class="form-control home-date required" name="register-form-date" id="register-form-date" value="" placeholder="Your Date">
</div>
</div>
<div class="col-12 d-none">
<input type="text" id="register-form-botcheck" name="register-form-botcheck" value="">
</div>
<div class="col-12">
<button type="submit" name="register-form-submit" class="btn bg-color text-white fw-medium w-100 py-2 mt-2">Contact Us</button>
</div>
<input type="hidden" name="prefix" value="register-form-">
<input type="hidden" name="subject" value="Office Moving Request">
<input type="hidden" name="html_title" value="Office Moving">
</form>
</div>
</div>
</div>
</div>
<div class="col-lg-5 d-none d-lg-flex flex-wrap justify-content-center">
<img src="demos/movers/images/2.svg" alt="Image 1" class="d-flex align-self-end ms-5 mt-3">
</div>
</div>
</div>
<div class="svg-separator">
<div>
<svg preserveAspectRatio="xMidYMax meet" viewBox="0 0 1600 100" data-height="100">
<path style="opacity: 1;fill: rgba(255,255,255,0.75);" d="M1040,56c0.5,0,1,0,1.6,0c-16.6-8.9-36.4-15.7-66.4-15.7c-56,0-76.8,23.7-106.9,41C881.1,89.3,895.6,96,920,96
C979.5,96,980,56,1040,56z"></path> <path style="opacity: 1;fill: rgba(255,255,255,0.75);" d="M1699.8,96l0,10H1946l-0.3-6.9c0,0,0,0-88,0s-88.6-58.8-176.5-58.8c-51.4,0-73,20.1-99.6,36.8 c14.5,9.6,29.6,18.9,58.4,18.9C1699.8,96,1699.8,96,1699.8,96z"></path> <path style="opacity: 1;fill: rgba(255,255,255,0.75);" d="M1400,96c19.5,0,32.7-4.3,43.7-10c-35.2-17.3-54.1-45.7-115.5-45.7c-32.3,0-52.8,7.9-70.2,17.8 c6.4-1.3,13.6-2.1,22-2.1C1340.1,56,1340.3,96,1400,96z"></path> <path style="opacity: 1;fill: rgba(255,255,255,0.75);" d="M320,56c6.6,0,12.4,0.5,17.7,1.3c-17-9.6-37.3-17-68.5-17c-60.4,0-79.5,27.8-114,45.2 c11.2,6,24.6,10.5,44.8,10.5C260,96,259.9,56,320,56z"></path> <path style="opacity: 1;fill: rgba(255,255,255,0.75);" d="M680,96c23.7,0,38.1-6.3,50.5-13.9C699.6,64.8,679,40.3,622.2,40.3c-30,0-49.8,6.8-66.3,15.8 c1.3,0,2.7-0.1,4.1-0.1C619.7,56,620.2,96,680,96z"></path> <path style="opacity: 1;fill: rgba(255,255,255,0.75);" d="M-40,95.6c28.3,0,43.3-8.7,57.4-18C-9.6,60.8-31,40.2-83.2,40.2c-14.3,0-26.3,1.6-36.8,4.2V106h60V96L-40,95.6
z"></path>
<path style="opacity: 1;fill: rgba(255,255,255,0.3);;" d="M504,73.4c-2.6-0.8-5.7-1.4-9.6-1.4c-19.4,0-19.6,13-39,13c-19.4,0-19.5-13-39-13c-14,0-18,6.7-26.3,10.4 C402.4,89.9,416.7,96,440,96C472.5,96,487.5,84.2,504,73.4z"></path> <path style="opacity: 1;fill: rgba(255,255,255,0.3);;" d="M1205.4,85c-0.2,0-0.4,0-0.6,0c-19.5,0-19.5-13-39-13s-19.4,12.9-39,12.9c0,0-5.9,0-12.3,0.1 c11.4,6.3,24.9,11,45.5,11C1180.6,96,1194.1,91.2,1205.4,85z"></path> <path style="opacity: 1;fill: rgba(255,255,255,0.3);;" d="M1447.4,83.9c-2.4,0.7-5.2,1.1-8.6,1.1c-19.3,0-19.6-13-39-13s-19.6,13-39,13c-3,0-5.5-0.3-7.7-0.8 c11.6,6.6,25.4,11.8,46.9,11.8C1421.8,96,1435.7,90.7,1447.4,83.9z"></path> <path style="opacity: 1;fill: rgba(255,255,255,0.3);;" d="M985.8,72c-17.6,0.8-18.3,13-37,13c-19.4,0-19.5-13-39-13c-18.2,0-19.6,11.4-35.5,12.8 c11.4,6.3,25,11.2,45.7,11.2C953.7,96,968.5,83.2,985.8,72z"></path> <path style="opacity: 1;fill: rgba(255,255,255,0.3);;" d="M743.8,73.5c-10.3,3.4-13.6,11.5-29,11.5c-19.4,0-19.5-13-39-13s-19.5,13-39,13c-0.9,0-1.7,0-2.5-0.1 c11.4,6.3,25,11.1,45.7,11.1C712.4,96,727.3,84.2,743.8,73.5z"></path> <path style="opacity: 1;fill: rgba(255,255,255,0.3);;" d="M265.5,72.3c-1.5-0.2-3.2-0.3-5.1-0.3c-19.4,0-19.6,13-39,13c-19.4,0-19.6-13-39-13 c-15.9,0-18.9,8.7-30.1,11.9C164.1,90.6,178,96,200,96C233.7,96,248.4,83.4,265.5,72.3z"></path> <path style="opacity: 1;fill: rgba(255,255,255,0.3);;" d="M1692.3,96V85c0,0,0,0-19.5,0s-19.6-13-39-13s-19.6,13-39,13c-0.1,0-0.2,0-0.4,0c11.4,6.2,24.9,11,45.6,11 C1669.9,96,1684.8,96,1692.3,96z"></path> <path style="opacity: 1;fill: rgba(255,255,255,0.3);;" d="M25.5,72C6,72,6.1,84.9-13.5,84.9L-20,85v8.9C0.7,90.1,12.6,80.6,25.9,72C25.8,72,25.7,72,25.5,72z"></path>
<path style="fill: rgb(255, 255, 255);" d="M-40,95.6C20.3,95.6,20.1,56,80,56s60,40,120,40s59.9-40,120-40s60.3,40,120,40s60.3-40,120-40s60.2,40,120,40s60.1-40,120-40s60.5,40,120,40s60-40,120-40s60.4,40,120,40s59.9-40,120-40s60.3,40,120,40s60.2-40,120-40s60.2,40,120,40s59.8,0,59.8,0l0.2,143H-60V96L-40,95.6z"></path>
</svg>
<div class="bg-white" style="height: 150px"></div>
</div>
</div>
</section>
<!-- Content
============================================= -->
<section id="content">
<div class="content-wrap pb-0">
<div class="container">
<div class="row justify-content-center mb-5">
<div class="col-lg-7 text-center">
<div class="heading-block">
<h3 class="text-transform-none mb-3 fw-semibold ls-0">How We Make your Shifting Easy</h3>
<span class="text-black-50">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptate corporis, facilis assumenda optio consequuntur amet iure, quidem animi nam inventore!</span>
</div>
</div>
<div class="col-lg-8">
<div class="row align-items-center">
<div class="col-sm-6">
<img src="demos/movers/images/others/4.png" alt="Image 1">
</div>
<div class="col-sm-6">
<h3>After you Share your Shifting details, Our Team will contact you.</h3>
<p class="mb-2">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nisi deserunt doloremque facilis rem, in recusandae, vel.</p>
<a target="_blank" href="https://icons8.com" class="color btn btn-sm p-0 btn-link"><u>illustration by Ouch.pics</u> <i class="bi-arrow-right"></i></a>
</div>
</div>
<div class="row align-items-center mt-5">
<div class="col-sm-6 mb-4 mb-sm-0">
<h3>Pack &amp; Load your Stuffs.</h3>
<p class="mb-2">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nisi deserunt doloremque facilis rem, in recusandae, vel.</p>
<a target="_blank" href="https://icons8.com" class="color btn btn-sm p-0 btn-link"><u>illustration by Ouch.pics</u> <i class="bi-arrow-right"></i></a>
</div>
<div class="col-sm-6">
<img src="demos/movers/images/others/2.png" alt="Image 1">
</div>
</div>
<div class="row align-items-center mt-5">
<div class="col-sm-6">
<img src="demos/movers/images/others/1.png" alt="Image 1">
</div>
<div class="col-sm-6">
<h3>Deliver whenever you are Ready.</h3>
<p class="mb-2">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nisi deserunt doloremque facilis rem, in recusandae, vel.</p>
<a target="_blank" href="https://icons8.com" class="color btn btn-sm p-0 btn-link"><u>illustration by Ouch.pics</u> <i class="bi-arrow-right"></i></a>
</div>
</div>
</div>
</div>
</div>
<div class="clear"></div>
<div class="section p-0 dark mb-0" style="background: linear-gradient(to right, rgba(25,102,221,0.2), rgba(25,102,221,0.5)), url('demos/movers/images/section/1.jpg') no-repeat center center / cover; min-height: 400px">
<div class="container">
<div class="row justify-content-between mb-4" style="padding: 100px 0 160px;">
<div class="col-lg-5 col-md-6 offset-lg-1 pt-3">
<a href="https://www.youtube.com/watch?v=P3Huse9K6Xs" data-lightbox="iframe" class="play-video ms-3"><i class="bi-play"></i></a>
<h2 class="display-4 fw-bold text-white mt-6">Services we can help you with.</h2>
</div>
<div class="col-lg-5 col-md-6 mb-0 mb-md-5">
<p class="mb-5">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Incidunt distinctio dolor nemo quasi cum. A ipsam tempora voluptatem officiis! Accusantium!</p>
<h3 class="mb-2 text-white">Service We Provide:</h3>
<div class="d-flex">
<ul class="col-6 iconlist">
<li class="my-2"><i class="bi-check-circle-fill fw-light"></i> <span class="ps-2">100% Trustable</span></li>
<li class="my-2"><i class="bi-check-circle-fill fw-light"></i> <span class="ps-2">100% Safe &amp; Secure</span></li>
<li class="my-2"><i class="bi-check-circle-fill fw-light"></i> <span class="ps-2">On-Time Delivery</span></li>
<li class="my-2"><i class="bi-check-circle-fill fw-light"></i> <span class="ps-2">Verified Movers</span></li>
<li class="my-2"><i class="bi-check-circle-fill fw-light"></i> <span class="ps-2">Liecenced Company</span></li>
<li class="my-2"><i class="bi-check-circle-fill fw-light"></i> <span class="ps-2">No Hidden Charges</span></li>
<li class="my-2"><i class="bi-check-circle-fill fw-light"></i> <span class="ps-2">Live Chat</span></li>
</ul>
<ul class="col-6 iconlist">
<li class="my-2"><i class="bi-check-circle-fill fw-light"></i> <span class="ps-2">24x7 Support</span></li>
<li class="my-2"><i class="bi-check-circle-fill fw-light"></i> <span class="ps-2">No Extra Payments</span></li>
<li class="my-2"><i class="bi-check-circle-fill fw-light"></i> <span class="ps-2">Also Deliver on Sunday</span></li>
<li class="my-2"><i class="bi-check-circle-fill fw-light"></i> <span class="ps-2">Minimum 1 Mover Free</span></li>
<li class="my-2"><i class="bi-check-circle-fill fw-light"></i> <span class="ps-2">Track Items by App</span></li>
<li class="my-2"><i class="bi-check-circle-fill fw-light"></i> <span class="ps-2">International Delivery</span></li>
<li class="my-2"><i class="bi-check-circle-fill fw-light"></i> <span class="ps-2">Door to Door</span></li>
</ul>
</div>
</div>
</div>
</div>
<div class="clear"></div>
</div>
<div class="section section-features bg-transparent mt-0 p-0">
<div class="container">
<div class="row col-mb-50 col-mb-lg-80">
<div class="col-md-4">
<div class="feature-box media-box">
<div class="fbox-icon position-relative mb-4" style="background-image: url('demos/movers/images/featured-img/1.jpg');">
<i class="bi-house"></i>
</div>
<div class="fbox-content">
<h3 class="fw-semibold">Office Moving.</h3>
<p class="text-muted">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eligendi rem, facilis nobis voluptatum.</p>
</div>
</div>
</div>
<div class="col-md-4">
<div class="feature-box media-box">
<div class="fbox-icon position-relative mb-4" style="background-image: url('demos/movers/images/featured-img/2.jpg');">
<i class="bi-building"></i>
</div>
<div class="fbox-content">
<h3 class="fw-semibold">Home Moving.</h3>
<p class="text-muted">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eligendi rem, facilis nobis voluptatum.</p>
</div>
</div>
</div>
<div class="col-md-4">
<div class="feature-box media-box">
<div class="fbox-icon position-relative mb-4" style="background-image: url('demos/movers/images/featured-img/3.jpg');">
<i class="bi-globe"></i>
</div>
<div class="fbox-content">
<h3 class="fw-semibold">International Moving.</h3>
<p class="text-muted">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eligendi rem, facilis nobis voluptatum.</p>
</div>
</div>
</div>
<div class="col-md-4">
<div class="feature-box media-box">
<div class="fbox-icon position-relative mb-4">
<i class="fa-solid fa-paw"></i>
</div>
<div class="fbox-content">
<h3 class="fw-semibold">Pet Shifting.</h3>
<p class="text-muted">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eligendi rem, facilis nobis voluptatum.</p>
</div>
</div>
</div>
<div class="col-md-4">
<div class="feature-box media-box">
<div class="fbox-icon position-relative mb-4" style="background-image: url('demos/movers/images/featured-img/1.jpg');">
<i class="bi-car-front"></i>
</div>
<div class="fbox-content">
<h3 class="fw-semibold">Car Shifting.</h3>
<p class="text-muted">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eligendi rem, facilis nobis voluptatum.</p>
</div>
</div>
</div>
<div class="col-md-4">
<div class="feature-box media-box">
<div class="fbox-icon position-relative mb-4">
<i class="bi-truck"></i>
</div>
<div class="fbox-content">
<h3 class="fw-semibold">Hire Truck.</h3>
<p class="text-muted">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eligendi rem, facilis nobis voluptatum.</p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="clear"></div>
<div class="section-map mb-6 mt-6">
<div class="container">
<img src="demos/hosting/images/svg/map.png" alt="Map Image" class="img-fluid map-image">
<div class="map-title">
<h2 class="text-center">More than 21 Countries included in Our Network. Some of Our Most Popular Countries</h2>
<div class="d-flex justify-content-center">
<ul class="iconlist m-0 pe-5">
<li><img src="demos/hosting/images/flags/uk.png" alt="Country Flag"><a href="#">United Kingdom</a></li>
<li><img src="demos/hosting/images/flags/us.png" alt="Country Flag"><a href="#">USA</a></li>
<li><img src="demos/hosting/images/flags/br.png" alt="Country Flag"><a href="#">Brazil</a></li>
<li><img src="demos/hosting/images/flags/sa.png" alt="Country Flag"><a href="#">South Africa</a></li>
<li><img src="demos/hosting/images/flags/in.png" alt="Country Flag"><a href="#">India</a></li>
</ul>
<ul class="iconlist m-0 ps-5">
<li><img src="demos/hosting/images/flags/si.png" alt="Country Flag"><a href="#">Singapore</a></li>
<li><img src="demos/hosting/images/flags/ja.png" alt="Country Flag"><a href="#">Japan</a></li>
<li><img src="demos/hosting/images/flags/au.png" alt="Country Flag"><a href="#">Australia</a></li>
<li><img src="demos/hosting/images/flags/ca.png" alt="Country Flag"><a href="#">Canada</a></li>
<li><a href="#" class="text-black-50">See all..</a></li>
</ul>
</div>
</div>
</div>
<div class="counter-section">
<div class="row align-items-stretch m-0 w-100 text-center">
<div class="col-sm-3 col-6">
<div class="counter-dots"></div>
<div class="counter font-secondary"><span data-from="100" data-to="11000" data-refresh-interval="50" data-speed="2100" data-comma="true"></span>+</div>
<h5 class="text-capitalize ls-0 mt-0"><u>Moved Monthly</u></h5>
</div>
<div class="col-sm-3 col-6">
<div class="counter-dots"></div>
<div class="counter font-secondary"><span data-from="3" data-to="26" data-refresh-interval="50" data-speed="2200" data-comma="true"></span>+</div>
<h5 class="text-capitalize ls-0 mt-0"><u>Years of Experience</u></h5>
</div>
<div class="col-sm-3 col-6">
<div class="counter-dots"></div>
<div class="counter font-secondary"><span data-from="100" data-to="6000" data-refresh-interval="25" data-speed="2300" data-comma="true"></span>+</div>
<h5 class="text-capitalize ls-0 mt-0"><u>Trained Manpower</u></h5>
</div>
<div class="col-sm-3 col-6">
<div class="counter-dots"></div>
<div class="counter font-secondary"><span data-from="1" data-to="21" data-refresh-interval="10" data-speed="2100" data-comma="true"></span>+</div>
<h5 class="text-capitalize ls-0 mt-0"><u>Countries Worldwide</u></h5>
</div>
</div>
</div>
</div>
<div class="clear"></div>
<div class="section section-gradient m-0">
<div class="svg-separator top rotate">
<div>
<svg preserveAspectRatio="xMidYMax meet" class="svg-separator sep3" viewBox="0 0 1600 100">
<path style="opacity: 1;fill: #FFF;" d="M-40,71.627C20.307,71.627,20.058,32,80,32s60.003,40,120,40s59.948-40,120-40s60.313,40,120,40s60.258-40,120-40s60.202,40,120,40s60.147-40,120-40s60.513,40,120,40s60.036-40,120-40c59.964,0,60.402,40,120,40s59.925-40,120-40s60.291,40,120,40s60.235-40,120-40s60.18,40,120,40s59.82,0,59.82,0l0.18,26H-60V72L-40,71.627z"></path>
<path class="svg-themecolor" style="opacity: 0.1;" d="M-40,83.627C20.307,83.627,20.058,44,80,44s60.003,40,120,40s59.948-40,120-40s60.313,40,120,40s60.258-40,120-40s60.202,40,120,40s60.147-40,120-40s60.513,40,120,40s60.036-40,120-40c59.964,0,60.402,40,120,40s59.925-40,120-40s60.291,40,120,40s60.235-40,120-40s60.18,40,120,40s59.82,0,59.82,0l0.18,14H-60V84L-40,83.627z"></path>
<path style="fill: #FFF;" d="M-40,95.627C20.307,95.627,20.058,56,80,56s60.003,40,120,40s59.948-40,120-40s60.313,40,120,40s60.258-40,120-40s60.202,40,120,40s60.147-40,120-40s60.513,40,120,40s60.036-40,120-40c59.964,0,60.402,40,120,40s59.925-40,120-40s60.291,40,120,40s60.235-40,120-40s60.18,40,120,40s59.82,0,59.82,0l0.18,138H-60V96L-40,95.627z"></path>
</svg>
</div>
</div>
<div class="container">
<div class="mx-auto mw-lg" style="padding: 120px 0 50px;">
<div class="d-flex justify-content-between align-items-center mb-4 dark">
<h3 class="mb-0">What Our Users Say:</h3>
<a href="#" class="button button-white button-light button-rounded button-small fw-medium m-0">View More</a>
</div>
<div class="row row-eq-height justify-content-center">
<div class="col-md-6">
<div class="bg-white shadow-sm d-flex justify-content-center flex-column rounded">
<div class="d-flex flex-row mb-4 align-items-center">
<a href="#"><img class="rounded-circle" src="demos/pet/images/testimonials/1.jpg" alt="Customer Testimonails" width="80" height="80"></a>
<h4 class="ms-3 mb-0">John Doe</h4>
</div>
<div class="border-start border-width-3 ps-4">
<h4 class="mb-4 fw-normal">Assertively leverage existing integrated communities after turnkey quality vectors. Assertively coordinate sustainable quality vectors and pandemic markets. Assertively leverage existing integrated communities.</h4>
<div class="h6 text-uppercase fw-bold ls-1">- Fig Nelson</div>
</div>
</div>
</div>
<div class="col-md-6 mt-3 mt-md-0">
<div class="bg-white shadow-sm d-flex justify-content-center flex-column mb-3 rounded p-5">
<div class="border-start border-width-3 ps-4">
<p class="mb-4">Incidunt deleniti blanditiis quas aperiam recusandae consequatur ullam quibusdam cum libero illo rerum repellendus!</p>
<div class="h6 text-uppercase fw-bold ls-1">- Fig Nelson</div>
</div>
</div>
<div class="bg-white shadow-sm d-flex justify-content-center flex-column rounded p-5">
<div class="border-start border-width-3 ps-4">
<p>Incidunt deleniti blanditiis quas aperiam recusandae consequatur ullam quibusdam cum libero illo rerum repellendus!</p>
<div class="h6 text-uppercase fw-bold ls-1">- Fig Nelson</div>
</div>
</div>
</div>
</div>
<div class="grid-bg d-none d-md-block">
<img src="demos/movers/images/dot-grid.svg" alt="Dot Image">
</div>
</div>
</div>
</div>
<div class="container mb-5">
<div class="section-clients mx-auto" style="max-width: 700px">
<div class="text-center mb-4">
<span class="badge rounded-pill lightthemecolor color text-uppercase ls-1 fw-medium py-2 px-3">Weve valuable Organizations Since 2021</span>
</div>
<div class="clear"></div>
<div class="toggle mt-5" data-state="open">
<div class="toggle-header flex-row-reverse">
<div class="toggle-icon">
<i class="toggle-closed bi-plus-circle"></i>
<i class="toggle-open bi-x-circle"></i>
</div>
<div class="toggle-title fw-medium">
Why Canvas for Home Shifting?
</div>
</div>
<div class="toggle-content text-black-50">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Assumenda, dolorum, vero ipsum molestiae minima odio quo voluptate illum excepturi quam cum voluptates doloribus quae nisi tempore necessitatibus dolores ducimus enim libero eaque explicabo suscipit animi at quaerat aliquid ex expedita perspiciatis? Saepe, aperiam, nam unde quas beatae vero vitae nulla.</div>
</div>
<div class="toggle">
<div class="toggle-header flex-row-reverse">
<div class="toggle-icon">
<i class="toggle-closed bi-plus-circle"></i>
<i class="toggle-open bi-x-circle"></i>
</div>
<div class="toggle-title fw-medium">
Advanced Moving Equipments
</div>
</div>
<div class="toggle-content text-black-50">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Assumenda, dolorum, vero ipsum molestiae minima odio quo voluptate illum excepturi quam cum voluptates doloribus quae nisi tempore necessitatibus dolores ducimus enim libero eaque explicabo suscipit animi at quaerat aliquid ex expedita perspiciatis? Saepe, aperiam, nam unde quas beatae vero vitae nulla.</div>
</div>
<div class="toggle border-0">
<div class="toggle-header flex-row-reverse">
<div class="toggle-icon">
<i class="toggle-closed bi-plus-circle"></i>
<i class="toggle-open bi-x-circle"></i>
</div>
<div class="toggle-title fw-medium">
Best Moving Equipments
</div>
</div>
<div class="toggle-content text-black-50">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Assumenda, dolorum, vero ipsum molestiae minima odio quo voluptate illum excepturi quam cum voluptates doloribus quae nisi tempore necessitatibus dolores ducimus enim libero eaque explicabo suscipit animi at quaerat aliquid ex expedita perspiciatis? Saepe, aperiam, nam unde quas beatae vero vitae nulla.</div>
</div>
</div>
</div>
<div class="clear"></div>
<div class="section dark pt-0 mb-0 bg-color" style="background: url('demos/movers/images/bg-2.png') no-repeat center bottom / 100%; overflow: visible">
<svg viewBox="0 0 1960 206.8" class="bg-white">
<path class="svg-themecolor" style="opacity:0.2;" d="M0,142.8A2337.49,2337.49,0,0,1,297.5,56.3C569.33-3.53,783.89.22,849.5,2.3c215.78,6.86,382.12,45.39,503.25,73.45,158.87,36.8,283.09,79.13,458.75,54.55A816.49,816.49,0,0,0,1983,86.8v110H0Z"></path>
<path class="svg-themecolor" d="M.5,152.8s498-177,849-150,1031,238,1134,94v110H.5Z"></path>
</svg>
<div class="container">
<div class="row align-items-center justify-content-center text-center my-4">
<div class="col-sm-8">
<div class="heading-block border-bottom-0 mb-4">
<h2 class="fw-semibold ls-0 text-transform-none mb-3" style="font-size: 44px; line-height: 1.3">Contact Our Movers Specialist</h2>
<p>Phosfluorescently develop customized relationships vis-a-vis B2C infomediaries.</p>
</div>
<a href="demo-movers-contact.html" class="button button-white button-light button-rounded fw-medium m-0">Get In Touch</a>
</div>
</div>
</div>
</div>
</div>
</section><!-- #content end -->
<!-- Footer
============================================= -->
<footer id="footer" class="bg-transparent border-0">
<div class="container">
<!-- Footer Widgets
============================================= -->
<div class="footer-widgets-wrap pb-4">
<div class="row">
<div class="col-lg-2 col-md-2 col-6">
<div class="widget">
<h4 class="ls-0 mb-4 text-transform-none">Features</h4>
<ul class="list-unstyled iconlist ms-0">
<li class="mb-2"><a href="#">Help Center</a></li>
<li class="mb-2"><a href="#">Paid with Moblie</a></li>
<li class="mb-2"><a href="#">Status</a></li>
<li class="mb-2"><a href="#">Changelog</a></li>
<li class="mb-2"><a href="#">Contact Support</a></li>
</ul>
</div>
</div>
<div class="col-lg-2 col-md-2 col-6">
<div class="widget">
<h4 class="ls-0 mb-4 text-transform-none">Support</h4>
<ul class="list-unstyled iconlist ms-0">
<li class="mb-2"><a href="#">Home</a></li>
<li class="mb-2"><a href="demo-movers-company.html">About</a></li>
<li class="mb-2"><a href="demo-movers-faqs.html">FAQs</a></li>
<li class="mb-2"><a href="#">Support</a></li>
<li class="mb-2"><a href="demo-movers-contact.html">Contact</a></li>
</ul>
</div>
</div>
<div class="col-lg-2 col-md-2 col-6">
<div class="widget">
<h4 class="ls-0 mb-4 text-transform-none">Trending</h4>
<ul class="list-unstyled iconlist ms-0">
<li class="mb-2"><a href="#">Shop</a></li>
<li class="mb-2"><a href="#">Portfolio</a></li>
<li class="mb-2"><a href="#">Blog</a></li>
<li class="mb-2"><a href="#">Events</a></li>
<li class="mb-2"><a href="#">Forums</a></li>
</ul>
</div>
</div>
<div class="col-lg-2 col-md-2 col-6">
<div class="widget">
<h4 class="ls-0 mb-4 text-transform-none">Get to Know us</h4>
<ul class="list-unstyled iconlist ms-0">
<li class="mb-2"><a href="#">Corporate</a></li>
<li class="mb-2"><a href="#">Agency</a></li>
<li class="mb-2"><a href="#">eCommerce</a></li>
<li class="mb-2"><a href="#">Personal</a></li>
<li class="mb-2"><a href="#">OnePage</a></li>
</ul>
</div>
</div>
<div class="col-lg-4 col-md-4 text-md-end">
<div class="widget">
<h4 class="ls-0 mb-4 text-transform-none">Headquarters:</h4>
<div>
<address>
795 Folsom Ave, Suite 600<br>
San Francisco, CA 94107<br>
</address>
<h3 class="mb-3"><a href="tel:+111-22-33-44"><i class="fa-solid fa-phone me-1" style="font-size: 22px;"></i> +111 22-33-44</a></h3>
<div class="d-flex justify-content-md-end">
<a href="#" class="social-icon si-small text-white bg-facebook" title="Facebook">
<i class="fa-brands fa-facebook-f"></i>
<i class="fa-brands fa-facebook-f"></i>
</a>
<a href="#" class="social-icon si-small text-white bg-instagram" title="instagram">
<i class="bi-instagram"></i>
<i class="bi-instagram"></i>
</a>
<a href="#" class="social-icon si-small text-white bg-paypal" title="Paypal">
<i class="fa-brands fa-paypal"></i>
<i class="fa-brands fa-paypal"></i>
</a>
<a href="#" class="social-icon si-small text-white bg-wikipedia me-0" title="Apple Pay">
<i class="fa-brands fa-apple-pay"></i>
<i class="fa-brands fa-apple-pay"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div><!-- .footer-widgets-wrap end -->
</div>
<!-- Copyrights
============================================= -->
<div id="copyrights" class="bg-transparent">
<div class="container">
<div class="row justify-content-between align-items-center">
<div class="col-md-6 text-black-50">
Copyrights &copy; 2023 All Rights Reserved by Canvas Inc.
</div>
<div class="col-md-6 d-md-flex flex-md-column align-items-md-end mt-4 mt-md-0">
<div class="copyrights-menu copyright-links text-black-50">
<a href="demo-movers-company.html">About</a>/<a href="demo-movers-rates.html">Rates</a>/<a href="demo-movers-faqs.html">FAQs</a>/<a href="demo-movers-contact.html">Contact</a>
</div>
</div>
</div>
</div>
</div><!-- #copyrights end -->
</footer><!-- #footer end -->
</div><!-- #wrapper end -->
<!-- Go To Top
============================================= -->
<div id="gotoTop" class="uil uil-angle-up"></div>
<!-- JavaScripts
============================================= -->
<script src="js/plugins.min.js"></script>
<script src="js/functions.bundle.js"></script>
<script src="js/components/datepicker.js"></script>
<!--<script>
jQuery('.home-date').datepicker({
autoclose: true,
startDate: "today",
});
</script>-->
</body>
</html>