688 lines
41 KiB
HTML
688 lines
41 KiB
HTML
|
<!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/spa-salon/spa-salon.css" />
|
||
|
|
</head>
|
||
|
|
<body class="overflow-x-hidden" data-mobile-nav-style="classic">
|
||
|
|
|
||
|
|
<header>
|
||
|
|
|
||
|
|
<nav class="navbar navbar-expand-lg header-transparent bg-transparent center-logo disable-fixed">
|
||
|
|
<div class="container-fluid">
|
||
|
|
<div class="col-auto col-lg-2 menu-logo">
|
||
|
|
<div class="d-none d-lg-block">
|
||
|
|
<a href="tel:1800222000" class="widget-text text-white-hover fs-16 lg-fs-15"><i class="feather icon-feather-phone icon-small me-5px lg-me-2px"></i>1 800 222 000</a>
|
||
|
|
</div>
|
||
|
|
<a class="navbar-brand" href="demo-spa-salon.html">
|
||
|
|
<img src="images/demo-spa-salon-logo-white.png" data-at2x="images/demo-spa-salon-logo-white@2x.png" alt class="default-logo">
|
||
|
|
<img src="images/demo-spa-salon-logo-white.png" data-at2x="images/demo-spa-salon-logo-white@2x.png" alt class="alt-logo">
|
||
|
|
<img src="images/demo-spa-salon-logo-black.png" data-at2x="images/demo-spa-salon-logo-black@2x.png" alt class="mobile-logo">
|
||
|
|
</a>
|
||
|
|
</div>
|
||
|
|
<div class="col-auto col-lg-8 menu-order">
|
||
|
|
<button class="navbar-toggler float-end" 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-between" id="navbarNav">
|
||
|
|
<ul class="navbar-nav navbar-left justify-content-end">
|
||
|
|
<li class="nav-item"><a href="demo-spa-salon.html" class="nav-link">Home</a></li>
|
||
|
|
<li class="nav-item"><a href="demo-spa-salon-about.html" class="nav-link">About</a></li>
|
||
|
|
<li class="nav-item"><a href="demo-spa-salon-treatments.html" class="nav-link">Treatments</a></li>
|
||
|
|
</ul>
|
||
|
|
<ul class="navbar-nav navbar-right justify-content-start">
|
||
|
|
<li class="nav-item"><a href="demo-spa-salon-packages.html" class="nav-link">Packages</a></li>
|
||
|
|
<li class="nav-item"><a href="demo-spa-salon-facility.html" class="nav-link">Facility</a></li>
|
||
|
|
<li class="nav-item"><a href="demo-spa-salon-contact.html" class="nav-link">Contact</a></li>
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="col-auto col-lg-2 text-end">
|
||
|
|
<div class="header-icon">
|
||
|
|
<div class="header-social-icon icon">
|
||
|
|
<a href="https://www.facebook.com" target="_blank"><i class="fa-brands fa-facebook-f"></i></a>
|
||
|
|
<a href="https://www.instagram.com" target="_blank"><i class="fa-brands fa-instagram"></i></a>
|
||
|
|
<a href="https://www.twitter.com" target="_blank"><i class="fa-brands fa-twitter"></i></a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</nav>
|
||
|
|
</header>
|
||
|
|
|
||
|
|
|
||
|
|
<section class="p-0 bg-dark-gray">
|
||
|
|
<div class="swiper full-screen ipad-top-space-margin md-h-600px sm-h-500px swiper-number-pagination-style-01 magic-cursor drag-cursor base-color" data-slider-options="{ "slidesPerView": 1, "loop": true, "pagination": { "el": ".swiper-number", "clickable": true }, "navigation": { "nextEl": ".slider-one-slide-next-1", "prevEl": ".slider-one-slide-prev-1" }, "autoplay": { "delay": 5000, "disableOnInteraction": false }, "keyboard": { "enabled": true, "onlyInViewport": true }, "effect": "fade" }" data-number-pagination="1" data-anime-text="{ "translateY": [50,0], "opacity": [0,1], "easing": "easeOutQuad", "duration": 500, "delay": { "staggervalue": 20 } }">
|
||
|
|
<div class="swiper-wrapper">
|
||
|
|
<div class="swiper-slide">
|
||
|
|
<div class="position-absolute left-0px top-0px w-100 h-100 cover-background" style="background-image:url('images/demo-spa-salon-slider-01.jpg');" data-anime="{ "translateY": [0, 0], "opacity": [1,1], "scale": [1,1.1], "duration": 7000, "delay": 0, "staggervalue": 300, "easing": "easeOutQuad" }"></div>
|
||
|
|
<div class="opacity-light bg-gradient-nero-grey-brown"></div>
|
||
|
|
<div class="container h-100">
|
||
|
|
<div class="row align-items-center h-100 justify-content-center">
|
||
|
|
<div class="col-xl-8 col-lg-9 position-relative text-white text-center">
|
||
|
|
<span class="fs-15 d-block mb-15px ls-4px text-uppercase" data-anime="{ "opacity": [0, 1], "easing": "easeOutCubic", "duration": 500, "delay": 200 }">Unforgettable treat</span>
|
||
|
|
<div class="alt-font fs-80 sm-fs-60 xs-fs-50 mb-40px w-80 lg-w-100 md-w-90 sm-w-100 mx-auto sm-mb-35px anime-text ls-minus-2px" data-fancy-text="{ "opacity": [0, 1], "translateY": [50, 0], "string": ["Relax your mind soul and body"], "duration": 500, "delay": 200, "speed": 10, "easing": "easeOutQuad" }"></div>
|
||
|
|
<a href="demo-spa-salon-contact.html" class="btn btn-medium fw-500 btn-double-border btn-border-color-transparent-white" data-anime="{ "opacity": [0, 1], "easing": "easeOutCubic", "delay": 800, "duration": 800 }">
|
||
|
|
<span>
|
||
|
|
<span class="btn-double-text" data-text="Book appointment">Book appointment</span>
|
||
|
|
</span>
|
||
|
|
</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="swiper-slide">
|
||
|
|
<div class="position-absolute left-0px top-0px w-100 h-100 cover-background" style="background-image:url('images/demo-spa-salon-slider-03.jpg');" data-anime="{ "translateY": [0, 0], "opacity": [1,1], "scale": [1,1.1], "duration": 7000, "delay": 0, "staggervalue": 300, "easing": "easeOutQuad" }"></div>
|
||
|
|
<div class="opacity-light bg-gradient-nero-grey-brown"></div>
|
||
|
|
<div class="container h-100">
|
||
|
|
<div class="row align-items-center h-100 justify-content-center">
|
||
|
|
<div class="col-xl-8 col-lg-9 position-relative text-white text-center">
|
||
|
|
<span class="fs-15 d-block mb-15px ls-4px text-uppercase" data-anime="{ "opacity": [0, 1], "easing": "easeOutCubic", "duration": 500, "delay": 200 }">Ayurvedic treatments</span>
|
||
|
|
<div class="alt-font fs-80 sm-fs-60 xs-fs-50 mb-40px w-80 lg-w-100 md-w-90 sm-w-100 mx-auto sm-mb-35px anime-text ls-minus-2px" data-fancy-text="{ "opacity": [0, 1], "translateY": [50, 0], "string": ["Help for your mind relaxing"], "duration": 500, "delay": 200, "speed": 10, "easing": "easeOutQuad" }"></div>
|
||
|
|
<a href="demo-spa-salon-contact.html" class="btn btn-medium fw-500 btn-double-border btn-border-color-transparent-white" data-anime="{ "opacity": [0, 1], "easing": "easeOutCubic", "delay": 800, "duration": 800 }">
|
||
|
|
<span>
|
||
|
|
<span class="btn-double-text" data-text="Book appointment">Book appointment</span>
|
||
|
|
</span>
|
||
|
|
</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="swiper-slide">
|
||
|
|
<div class="position-absolute left-0px top-0px w-100 h-100 cover-background" style="background-image:url('images/demo-spa-salon-slider-02.jpg');" data-anime="{ "translateY": [0, 0], "opacity": [1,1], "scale": [1,1.1], "duration": 7000, "delay": 0, "staggervalue": 300, "easing": "easeOutQuad" }"></div>
|
||
|
|
<div class="opacity-light bg-gradient-nero-grey-brown"></div>
|
||
|
|
<div class="container h-100">
|
||
|
|
<div class="row align-items-center h-100 justify-content-center">
|
||
|
|
<div class="col-xl-8 col-lg-9 position-relative text-white text-center">
|
||
|
|
<span class="fs-15 d-block mb-15px ls-4px text-uppercase" data-anime="{ "opacity": [0, 1], "easing": "easeOutCubic", "duration": 500, "delay": 200 }">Therapy packages</span>
|
||
|
|
<div class="alt-font fs-80 sm-fs-60 xs-fs-50 mb-40px w-80 lg-w-100 md-w-90 sm-w-100 mx-auto sm-mb-35px anime-text ls-minus-2px" data-fancy-text="{ "opacity": [0, 1], "translateY": [50, 0], "string": ["Therapy for rest and relaxation"], "duration": 500, "delay": 200, "speed": 10, "easing": "easeOutQuad" }"></div>
|
||
|
|
<a href="demo-spa-salon-contact.html" class="btn btn-medium fw-500 btn-double-border btn-border-color-transparent-white" data-anime="{ "opacity": [0, 1], "easing": "easeOutCubic", "delay": 800, "duration": 800 }">
|
||
|
|
<span>
|
||
|
|
<span class="btn-double-text" data-text="Book appointment">Book appointment</span>
|
||
|
|
</span>
|
||
|
|
</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="swiper-pagination container right-0px text-center swiper-pagination-clickable swiper-number fs-14 xs-w-100"></div>
|
||
|
|
|
||
|
|
|
||
|
|
<div class="slider-one-slide-prev-1 icon-very-small text-white swiper-button-prev slider-navigation-style-06 bg-black-transparent-light h-55px w-55px d-none d-sm-flex border-radius-100"><i class="fa-solid fa-chevron-left"></i></div>
|
||
|
|
<div class="slider-one-slide-next-1 icon-very-small text-white swiper-button-next slider-navigation-style-06 bg-black-transparent-light h-55px w-55px d-none d-sm-flex border-radius-100"><i class="fa-solid fa-chevron-right"></i></div>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
|
||
|
|
|
||
|
|
<section class="pt-60px pb-60px background-repeat border-bottom border-color-light-gray" style="background-image:url('images/demo-spa-salon-home-bg-01.jpg');">
|
||
|
|
<div class="container-fluid ps-9 pe-9 lg-ps-1 lg-pe-1 md-ps-15px md-pe-15px">
|
||
|
|
<div class="row row-cols-1 row-cols-lg-4 row-cols-sm-2 justify-content-center" data-anime="{ "el": "childs", "opacity": [0,1], "duration": 600, "delay": 0, "staggervalue": 100, "easing": "easeOutQuad" }">
|
||
|
|
|
||
|
|
<div class="col icon-with-text-style-03 border-end border-color-light-gray md-mb-30px xs-border-end-0">
|
||
|
|
<div class="feature-box ps-8 pe-8 xl-ps-2 xl-pe-2">
|
||
|
|
<div class="feature-box-icon">
|
||
|
|
<i class="line-icon-Medal-2 icon-extra-large text-base-color mb-20px"></i>
|
||
|
|
</div>
|
||
|
|
<div class="feature-box-content last-paragraph-no-margin">
|
||
|
|
<span class="d-inline-block text-dark-gray alt-font fs-22">Ultra luxury studio</span>
|
||
|
|
<p class="lh-26">Modern infrastructure</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
|
||
|
|
<div class="col icon-with-text-style-03 border-end border-color-light-gray md-mb-30px md-border-end-0">
|
||
|
|
<div class="feature-box ps-8 pe-8 xl-ps-2 xl-pe-2">
|
||
|
|
<div class="feature-box-icon">
|
||
|
|
<i class="line-icon-Moustache-Smiley icon-extra-large text-base-color mb-20px"></i>
|
||
|
|
</div>
|
||
|
|
<div class="feature-box-content last-paragraph-no-margin">
|
||
|
|
<span class="d-inline-block text-dark-gray alt-font fs-22">Certified manpower</span>
|
||
|
|
<p class="lh-26">Amazing experience</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
|
||
|
|
<div class="col icon-with-text-style-03 border-end border-color-light-gray xs-border-end-0 xs-mb-30px">
|
||
|
|
<div class="feature-box ps-8 pe-8 xl-ps-2 xl-pe-2">
|
||
|
|
<div class="feature-box-icon">
|
||
|
|
<i class="line-icon-Tree-3 icon-extra-large text-base-color mb-20px"></i>
|
||
|
|
</div>
|
||
|
|
<div class="feature-box-content last-paragraph-no-margin">
|
||
|
|
<span class="d-inline-block text-dark-gray alt-font fs-22">Natural environment</span>
|
||
|
|
<p class="lh-26">Unwind and discover joy</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
|
||
|
|
<div class="col icon-with-text-style-03">
|
||
|
|
<div class="feature-box ps-8 pe-8 xl-ps-2 xl-pe-2">
|
||
|
|
<div class="feature-box-icon">
|
||
|
|
<i class="line-icon-Environmental-3 icon-extra-large text-base-color mb-20px"></i>
|
||
|
|
</div>
|
||
|
|
<div class="feature-box-content last-paragraph-no-margin">
|
||
|
|
<span class="d-inline-block text-dark-gray alt-font fs-22">Ayurvedic therapy</span>
|
||
|
|
<p class="lh-26">Herbal remedies</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
|
||
|
|
|
||
|
|
<section class="background-repeat" style="background-image:url('images/demo-spa-salon-home-bg-01.jpg');">
|
||
|
|
<div class="container">
|
||
|
|
<div class="row align-items-center mb-10 md-mb-17 xs-mb-25">
|
||
|
|
<div class="col-xl-5 col-lg-6 md-mb-70px sm-mb-45px">
|
||
|
|
<span class="fs-15 mb-15px text-base-color fw-500 d-block text-uppercase ls-2px" data-anime="{ "el": "lines", "translateY": [30, 0], "opacity": [0,1], "duration": 600, "delay": 0, "staggervalue": 100, "easing": "easeOutQuad" }">About studio</span>
|
||
|
|
<h3 class="alt-font ls-minus-1px text-dark-gray w-80 xl-w-90 md-w-100" data-anime="{ "el": "lines", "translateY": [30, 0], "opacity": [0,1], "delay": 0, "duration": 600, "staggervalue": 100, "easing": "easeOutQuad" }">Relax at the luxury spa massage and therapy studio.</h3>
|
||
|
|
<p class="w-80 md-w-100 mb-40px" data-anime="{ "el": "lines", "translateY": [30, 0], "opacity": [0,1], "delay": 200, "duration": 600, "staggervalue": 100, "easing": "easeOutQuad" }">A design-led approach guides the team, implementing practices, products and services that are thoughtful and environmentally sound. Family of professionals that creates intelligent designs that help the face of hospitality.</p>
|
||
|
|
<div class="d-inline-block w-100" data-anime="{ "el": "childs", "translateY": [50, 0], "opacity": [0,1], "delay":300, "duration": 600, "staggervalue": 300, "easing": "easeOutQuad" }">
|
||
|
|
<a href="demo-spa-salon-about.html" class="btn btn-small btn-double-border btn-border-base-color me-25px xs-me-15px">
|
||
|
|
<span>
|
||
|
|
<span class="btn-double-text" data-text="Explore more">Explore more</span>
|
||
|
|
<span><i class="fa-solid fa-arrow-right"></i></span>
|
||
|
|
</span>
|
||
|
|
</a>
|
||
|
|
<div class="fw-500 d-inline-block align-middle text-dark-gray fs-18 xs-mt-20px xs-mb-20px"><i class="bi bi-telephone-outbound icon-small me-10px"></i><a href="tel:1800222000">1 800 222 000</a></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="col-xl-6 col-lg-5 position-relative offset-lg-1 offset-md-2">
|
||
|
|
<span class="position-absolute fs-75 left-20px top-80px text-dark-gray fw-600 z-index-1 ls-minus-4px lg-top-40px" data-anime="{ "opacity": [0,1], "duration": 600, "delay": 1000, "staggervalue": 100, "easing": "easeOutQuad" }"><span class="fs-15 d-table lh-16 text-uppercase text-medium-gray fw-500 ls-1px">Started in</span>1995</span>
|
||
|
|
<div class="w-80 overflow-hidden position-relative md-w-90 border-radius-6px float-end" data-anime="{ "effect": "slide", "color": "#F4866E", "direction":"rl", "easing": "easeOutQuad", "duration": 600, "delay":500}">
|
||
|
|
<img class="w-100" src="images/demo-spa-salon-home-01.jpg" alt>
|
||
|
|
</div>
|
||
|
|
<div class="position-absolute left-minus-70px bottom-minus-30px w-60 overflow-hidden md-left-minus-100px sm-left-15px" data-bottom-top="transform: translateY(50px)" data-top-bottom="transform: translateY(-50px)" data-anime="{ "effect": "slide", "color": "#36332e", "direction":"lr", "easing": "easeOutQuad", "duration": 600, "delay":500}">
|
||
|
|
<img class="w-100 border-radius-6px" src="images/demo-spa-salon-home-02.jpg" alt>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="row row-cols-1 row-cols-md-4 row-cols-sm-2 text-center text-sm-start" data-anime="{ "el": "childs", "translateY": [30, 0], "opacity": [0,1], "delay":300, "staggervalue": 300, "easing": "easeOutQuad" }">
|
||
|
|
<div class="col last-paragraph-no-margin sm-mb-30px">
|
||
|
|
<h2 class="fw-600 ls-minus-3px text-dark-gray m-0">9.98<sup><i class="bi bi-arrow-up-short icon-medium text-base-color animation-float"></i></sup></h2>
|
||
|
|
<p class="text-dark-gray lh-28">Google reviews</p>
|
||
|
|
</div>
|
||
|
|
<div class="col last-paragraph-no-margin sm-mb-30px">
|
||
|
|
<h2 class="fw-600 ls-minus-3px text-dark-gray m-0">30k<sup><i class="bi bi-arrow-up-short icon-medium text-base-color animation-float"></i></sup></h2>
|
||
|
|
<p class="text-dark-gray lh-28">Instagram followers</p>
|
||
|
|
</div>
|
||
|
|
<div class="col last-paragraph-no-margin xs-mb-30px">
|
||
|
|
<h2 class="fw-600 ls-minus-3px text-dark-gray m-0">96%<sup><i class="bi bi-arrow-up-short icon-medium text-base-color animation-float"></i></sup></h2>
|
||
|
|
<p class="text-dark-gray lh-28">Repeat customers</p>
|
||
|
|
</div>
|
||
|
|
<div class="col last-paragraph-no-margin">
|
||
|
|
<h2 class="fw-600 ls-minus-3px text-dark-gray m-0">28+<sup><i class="bi bi-arrow-up-short icon-medium text-base-color animation-float"></i></sup></h2>
|
||
|
|
<p class="text-dark-gray lh-28">Years of experience</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
|
||
|
|
|
||
|
|
<section class="background-repeat border-top border-color-light-gray position-relative overlap-height z-index-1" style="background-image:url('images/demo-spa-salon-home-bg-01.jpg');">
|
||
|
|
<div class="position-absolute right-minus-50px overlap-section z-index-minus-1 d-none d-lg-inline-block" data-bottom-top="transform: translateY(-50px)" data-top-bottom="transform: translateY(50px)">
|
||
|
|
<img src="images/demo-spa-salon-bg-img-02.png" alt>
|
||
|
|
</div>
|
||
|
|
<div class="position-absolute left-minus-100px top-50 z-index-minus-1 d-none d-lg-inline-block" data-bottom-top="transform: translateY(-50px)" data-top-bottom="transform: translateY(50px)">
|
||
|
|
<img src="images/demo-spa-salon-bg-img-03.png" alt>
|
||
|
|
</div>
|
||
|
|
<div class="container overlap-gap-section">
|
||
|
|
<div class="row justify-content-center mb-2">
|
||
|
|
<div class="col-lg-6 col-md-8 text-center" data-anime="{ "el": "childs", "translateY": [30, 0], "opacity": [0,1], "delay":0, "duration": 600, "staggervalue": 300, "easing": "easeOutQuad" }">
|
||
|
|
<span class="fs-15 mb-5px text-base-color fw-500 d-block text-uppercase ls-2px">Luxury services</span>
|
||
|
|
<h3 class="alt-font ls-minus-1px text-dark-gray w-65 xl-w-80 sm-w-100 mx-auto">Explore our spa and body services</h3>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="row mb-5 xs-mb-15px">
|
||
|
|
<div class="col-12 position-relative">
|
||
|
|
<div class="outside-box-right-40 sm-outside-box-right-0">
|
||
|
|
<div class="swiper magic-cursor drag-cursor" data-slider-options="{ "slidesPerView": 1, "spaceBetween": 30, "loop": true, "autoplay": { "delay": 3000, "disableOnInteraction": false }, "pagination": { "el": ".slider-three-slide-pagination", "clickable": true, "dynamicBullets": false }, "keyboard": { "enabled": true, "onlyInViewport": true }, "breakpoints": { "992": { "slidesPerView": 3 }, "768": { "slidesPerView": 2 }, "320": { "slidesPerView": 1 } }, "effect": "slide" }">
|
||
|
|
<div class="swiper-wrapper pt-20px pb-20px">
|
||
|
|
|
||
|
|
<div class="swiper-slide">
|
||
|
|
<div class="row g-0 services-box-style-02 border-radius-6px overflow-hidden hover-box dark-hover">
|
||
|
|
<div class="col-sm-6 position-relative bg-very-light-gray p-10 xxl-p-6 xs-p-10">
|
||
|
|
<div class="services-box-icon mb-65px position-relative z-index-9 lg-mb-30px">
|
||
|
|
<img class="w-75px lg-w-65px" src="images/demo-spa-salon-icon-01.png" alt>
|
||
|
|
</div>
|
||
|
|
<div class="services-box-content last-paragraph-no-margin position-relative z-index-9">
|
||
|
|
<span class="d-inline-block alt-font text-dark-gray fs-24 mb-5px">Beauty</span>
|
||
|
|
<p class="text-light-opacity lh-30">Bring brighter and younger looking skin.</p>
|
||
|
|
</div>
|
||
|
|
<div class="box-overlay bg-dark-gray"></div>
|
||
|
|
</div>
|
||
|
|
<div class="col-sm-6 services-box-img overflow-hidden">
|
||
|
|
<div class="h-100 cover-background position-relative xs-h-300px" style="background-image: url('images/demo-spa-salon-home-03.jpg')">
|
||
|
|
<span class="position-absolute left-minus-30px bottom-50px fs-100 lg-fs-80 xs-fs-90 fw-600 text-very-light-gray xl-bottom-25px md-left-minus-20px">01</span>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
|
||
|
|
<div class="swiper-slide">
|
||
|
|
<div class="row g-0 services-box-style-02 border-radius-6px overflow-hidden hover-box dark-hover">
|
||
|
|
<div class="col-sm-6 position-relative bg-very-light-gray p-10 xxl-p-6 xs-p-10">
|
||
|
|
<div class="services-box-icon mb-65px position-relative z-index-9 lg-mb-30px">
|
||
|
|
<img class="w-75px lg-w-65px" src="images/demo-spa-salon-icon-02.png" alt>
|
||
|
|
</div>
|
||
|
|
<div class="services-box-content last-paragraph-no-margin position-relative z-index-9">
|
||
|
|
<span class="d-inline-block alt-font text-dark-gray fs-24 mb-5px">Therapy</span>
|
||
|
|
<p class="text-light-opacity lh-30">Bring brighter and younger looking skin.</p>
|
||
|
|
</div>
|
||
|
|
<div class="box-overlay bg-dark-gray"></div>
|
||
|
|
</div>
|
||
|
|
<div class="col-sm-6 services-box-img">
|
||
|
|
<div class="h-100 cover-background position-relative xs-h-300px" style="background-image: url('images/demo-spa-salon-home-04.jpg')">
|
||
|
|
<span class="position-absolute left-minus-30px bottom-50px fs-100 lg-fs-80 xs-fs-90 fw-600 text-very-light-gray xl-bottom-25px md-left-minus-20px">02</span>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
|
||
|
|
<div class="swiper-slide">
|
||
|
|
<div class="row g-0 services-box-style-02 border-radius-6px overflow-hidden hover-box dark-hover">
|
||
|
|
<div class="col-sm-6 position-relative bg-very-light-gray p-10 xxl-p-6 xs-p-10">
|
||
|
|
<div class="services-box-icon mb-65px position-relative z-index-9 lg-mb-30px">
|
||
|
|
<img class="w-75px lg-w-65px" src="images/demo-spa-salon-icon-03.png" alt>
|
||
|
|
</div>
|
||
|
|
<div class="services-box-content last-paragraph-no-margin position-relative z-index-9">
|
||
|
|
<span class="d-inline-block alt-font text-dark-gray fs-24 mb-5px">Massage</span>
|
||
|
|
<p class="text-light-opacity lh-30">Bring brighter and younger looking skin.</p>
|
||
|
|
</div>
|
||
|
|
<div class="box-overlay bg-dark-gray"></div>
|
||
|
|
</div>
|
||
|
|
<div class="col-sm-6 services-box-img">
|
||
|
|
<div class="h-100 cover-background position-relative xs-h-300px" style="background-image: url('images/demo-spa-salon-home-05.jpg')">
|
||
|
|
<span class="position-absolute left-minus-30px bottom-50px fs-100 lg-fs-80 xs-fs-90 fw-600 text-very-light-gray xl-bottom-25px md-left-minus-20px">03</span>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
|
||
|
|
<div class="swiper-slide">
|
||
|
|
<div class="row g-0 services-box-style-02 border-radius-6px overflow-hidden hover-box dark-hover">
|
||
|
|
<div class="col-sm-6 position-relative bg-very-light-gray p-10 xxl-p-6 xs-p-10">
|
||
|
|
<div class="services-box-icon mb-65px position-relative z-index-9 lg-mb-30px">
|
||
|
|
<img class="w-75px lg-w-65px" src="images/demo-spa-salon-icon-01.png" alt>
|
||
|
|
</div>
|
||
|
|
<div class="services-box-content last-paragraph-no-margin position-relative z-index-9">
|
||
|
|
<span class="d-inline-block alt-font text-dark-gray fs-24 mb-5px">Beauty</span>
|
||
|
|
<p class="text-light-opacity lh-30">Bring brighter and younger looking skin.</p>
|
||
|
|
</div>
|
||
|
|
<div class="box-overlay bg-dark-gray"></div>
|
||
|
|
</div>
|
||
|
|
<div class="col-sm-6 services-box-img overflow-hidden">
|
||
|
|
<div class="h-100 cover-background position-relative xs-h-300px" style="background-image: url('images/demo-spa-salon-home-03.jpg')">
|
||
|
|
<span class="position-absolute left-minus-30px bottom-50px fs-100 lg-fs-80 xs-fs-90 fw-600 text-very-light-gray xl-bottom-25px md-left-minus-20px">01</span>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
|
||
|
|
<div class="swiper-slide">
|
||
|
|
<div class="row g-0 services-box-style-02 border-radius-6px overflow-hidden hover-box dark-hover">
|
||
|
|
<div class="col-sm-6 position-relative bg-very-light-gray p-10 xxl-p-6 xs-p-10">
|
||
|
|
<div class="services-box-icon mb-65px position-relative z-index-9 lg-mb-30px">
|
||
|
|
<img class="w-75px lg-w-65px" src="images/demo-spa-salon-icon-02.png" alt>
|
||
|
|
</div>
|
||
|
|
<div class="services-box-content last-paragraph-no-margin position-relative z-index-9">
|
||
|
|
<span class="d-inline-block alt-font text-dark-gray fs-24 mb-5px">Therapy</span>
|
||
|
|
<p class="text-light-opacity lh-30">Bring brighter and younger looking skin.</p>
|
||
|
|
</div>
|
||
|
|
<div class="box-overlay bg-dark-gray"></div>
|
||
|
|
</div>
|
||
|
|
<div class="col-sm-6 services-box-img">
|
||
|
|
<div class="h-100 cover-background position-relative xs-h-300px" style="background-image: url('images/demo-spa-salon-home-04.jpg')">
|
||
|
|
<span class="position-absolute left-minus-30px bottom-50px fs-100 lg-fs-80 xs-fs-90 fw-600 text-very-light-gray xl-bottom-25px md-left-minus-20px">02</span>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
|
||
|
|
<div class="swiper-slide">
|
||
|
|
<div class="row g-0 services-box-style-02 border-radius-6px overflow-hidden hover-box dark-hover">
|
||
|
|
<div class="col-sm-6 position-relative bg-very-light-gray p-10 xxl-p-6 xs-p-10">
|
||
|
|
<div class="services-box-icon mb-65px position-relative z-index-9 lg-mb-30px">
|
||
|
|
<img class="w-75px lg-w-65px" src="images/demo-spa-salon-icon-03.png" alt>
|
||
|
|
</div>
|
||
|
|
<div class="services-box-content last-paragraph-no-margin position-relative z-index-9">
|
||
|
|
<span class="d-inline-block alt-font text-dark-gray fs-24 mb-5px">Massage</span>
|
||
|
|
<p class="text-light-opacity lh-30">Bring brighter and younger looking skin.</p>
|
||
|
|
</div>
|
||
|
|
<div class="box-overlay bg-dark-gray"></div>
|
||
|
|
</div>
|
||
|
|
<div class="col-sm-6 services-box-img">
|
||
|
|
<div class="h-100 cover-background position-relative xs-h-300px" style="background-image: url('images/demo-spa-salon-home-05.jpg')">
|
||
|
|
<span class="position-absolute left-minus-30px bottom-50px fs-100 lg-fs-80 xs-fs-90 fw-600 text-very-light-gray xl-bottom-25px md-left-minus-20px">03</span>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="row mb-5 xs-mb-8">
|
||
|
|
<div class="col-12 text-center">
|
||
|
|
<h5 class="alt-font text-dark-gray">Revitalize your senses and refresh? <a href="demo-spa-salon-packages.html" class="text-dark-gray text-dark-gray-hover text-decoration-line-bottom">Explore package</a></h5>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="row justify-content-center">
|
||
|
|
<div class="col-lg-6">
|
||
|
|
<ul class="pricing-table-style-12 pe-15px md-pe-0" data-anime="{ "el": "childs", "translateY": [30, 0], "opacity": [0,1], "duration": 600, "delay": 0, "staggervalue": 300, "easing": "easeOutQuad" }">
|
||
|
|
<li class="last-paragraph-no-margin">
|
||
|
|
<img src="images/demo-spa-salon-home-06.jpg" class="w-120px border-radius-100" alt>
|
||
|
|
<div class="ms-30px xs-ms-0 flex-grow-1">
|
||
|
|
<div class="d-flex align-items-center w-120 fs-18">
|
||
|
|
<span class="fs-22 alt-font text-dark-gray">Makeup & massage</span>
|
||
|
|
<div class="divider-style-03 divider-style-03-02 border-color-light-gray flex-grow-1 ms-20px me-20px"></div>
|
||
|
|
<div class="ms-auto fs-26 alt-font text-dark-gray"><sub>$</sub>43</div>
|
||
|
|
</div>
|
||
|
|
<p>50 Minute relaxation massage.</p>
|
||
|
|
</div>
|
||
|
|
</li>
|
||
|
|
<li class="last-paragraph-no-margin">
|
||
|
|
<img src="images/demo-spa-salon-home-07.jpg" class="w-120px border-radius-100" alt>
|
||
|
|
<div class="ms-30px xs-ms-0 flex-grow-1">
|
||
|
|
<div class="d-flex align-items-center w-120 fs-18">
|
||
|
|
<span class="fs-22 alt-font text-dark-gray">Relaxing head</span>
|
||
|
|
<div class="divider-style-03 divider-style-03-02 border-color-light-gray flex-grow-1 ms-20px me-20px"></div>
|
||
|
|
<div class="ms-auto fs-26 alt-font text-dark-gray"><sub>$</sub>45</div>
|
||
|
|
</div>
|
||
|
|
<p>One of the best ways to relax head.</p>
|
||
|
|
</div>
|
||
|
|
</li>
|
||
|
|
<li class="last-paragraph-no-margin">
|
||
|
|
<img src="images/demo-spa-salon-home-08.jpg" class="w-120px border-radius-100" alt>
|
||
|
|
<div class="ms-30px xs-ms-0 flex-grow-1">
|
||
|
|
<div class="d-flex align-items-center w-120 fs-18">
|
||
|
|
<span class="fs-22 alt-font text-dark-gray">Geothermal spa</span>
|
||
|
|
<div class="divider-style-03 divider-style-03-02 border-color-light-gray flex-grow-1 ms-20px me-20px"></div>
|
||
|
|
<div class="ms-auto fs-26 alt-font text-dark-gray"><sub>$</sub>39</div>
|
||
|
|
</div>
|
||
|
|
<p>Comforting stimulating atmosphere.</p>
|
||
|
|
</div>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
<div class="col-lg-6">
|
||
|
|
<ul class="pricing-table-style-12 ps-15px md-ps-0 md-pt-20px" data-anime="{ "el": "childs", "translateY": [30, 0], "opacity": [0,1], "duration": 600, "delay": 0, "staggervalue": 300, "easing": "easeOutQuad" }">
|
||
|
|
<li class="last-paragraph-no-margin">
|
||
|
|
<img src="images/demo-spa-salon-home-09.jpg" class="w-120px border-radius-100" alt>
|
||
|
|
<div class="ms-30px xs-ms-0 flex-grow-1">
|
||
|
|
<div class="d-flex align-items-center w-120 fs-18">
|
||
|
|
<span class="fs-22 alt-font text-dark-gray">Body relaxation</span>
|
||
|
|
<div class="divider-style-03 divider-style-03-02 border-color-light-gray flex-grow-1 ms-20px me-20px"></div>
|
||
|
|
<div class="ms-auto fs-26 alt-font text-dark-gray"><sub>$</sub>35</div>
|
||
|
|
</div>
|
||
|
|
<p>Progressive muscle relaxation.</p>
|
||
|
|
</div>
|
||
|
|
</li>
|
||
|
|
<li class="last-paragraph-no-margin">
|
||
|
|
<img src="images/demo-spa-salon-home-10.jpg" class="w-120px border-radius-100" alt>
|
||
|
|
<div class="ms-30px xs-ms-0 flex-grow-1">
|
||
|
|
<div class="d-flex align-items-center w-120 fs-18">
|
||
|
|
<span class="fs-22 alt-font text-dark-gray">Finnish sauna</span>
|
||
|
|
<div class="divider-style-03 divider-style-03-02 border-color-light-gray flex-grow-1 ms-20px me-20px"></div>
|
||
|
|
<div class="ms-auto fs-26 alt-font text-dark-gray"><sub>$</sub>55</div>
|
||
|
|
</div>
|
||
|
|
<p>Traditional finnish sauna experience.</p>
|
||
|
|
</div>
|
||
|
|
</li>
|
||
|
|
<li class="last-paragraph-no-margin">
|
||
|
|
<img src="images/demo-spa-salon-home-11.jpg" class="w-120px border-radius-100" alt>
|
||
|
|
<div class="ms-30px xs-ms-0 flex-grow-1">
|
||
|
|
<div class="d-flex align-items-center w-120 fs-18">
|
||
|
|
<span class="fs-22 alt-font text-dark-gray">Aromatherapy</span>
|
||
|
|
<div class="divider-style-03 divider-style-03-02 border-color-light-gray flex-grow-1 ms-20px me-20px"></div>
|
||
|
|
<div class="ms-auto fs-26 alt-font text-dark-gray"><sub>$</sub>35</div>
|
||
|
|
</div>
|
||
|
|
<p>Using concentrated essential oils.</p>
|
||
|
|
</div>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
|
||
|
|
|
||
|
|
<section class="background-repeat border-top border-color-light-gray position-relative overlap-height z-index-1" style="background-image:url('images/demo-spa-salon-home-bg-01.jpg');">
|
||
|
|
<div class="overlap-section text-center mb-6 z-index-minus-1 d-none d-md-block">
|
||
|
|
<img src="images/demo-spa-salon-bg-img-04.jpg" alt>
|
||
|
|
</div>
|
||
|
|
<div class="position-absolute right-minus-100px top-50 z-index-minus-1 d-none d-lg-inline-block" data-bottom-top="transform: translateY(-50px)" data-top-bottom="transform: translateY(50px)">
|
||
|
|
<img src="images/demo-spa-salon-bg-img-05.png" alt>
|
||
|
|
</div>
|
||
|
|
<div class="container overlap-gap-section">
|
||
|
|
<div class="row align-items-center position-relative justify-content-center justify-content-lg-start">
|
||
|
|
<div class="position-absolute left-0px top-0px h-100 w-130px d-none d-lg-inline-block">
|
||
|
|
<div class="vertical-title-center align-items-center justify-content-center">
|
||
|
|
<div class="title fs-16 ls-2px text-uppercase">Spa therapy for <span class="text-dark-gray fw-600">rest</span> and <span class="text-dark-gray fw-600 fancy-text-style-4"><span data-fancy-text="{ "effect": "rotate", "string": ["Relaxation", "Enjoyment", "Happiness"], "speed": 50 }"></span> </span></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="col-lg-5 col-md-11 position-relative offset-lg-1 md-mb-35px">
|
||
|
|
<img src="images/demo-spa-salon-home-12.jpg" class="w-100 border-radius-4px" alt>
|
||
|
|
</div>
|
||
|
|
<div class="col-xl-5 col-lg-6 col-md-11 ps-8 md-ps-15px" data-anime="{ "el": "childs", "translateY": [30, 0], "opacity": [0,1], "duration": 600, "delay": 0, "staggervalue": 300, "easing": "easeOutQuad" }">
|
||
|
|
<span class="fs-15 lg-10px mb-5px text-base-color fw-500 d-block text-uppercase ls-2px">Benefits of spa</span>
|
||
|
|
<h3 class="alt-font ls-minus-1px text-dark-gray">100% natural and organic products.</h3>
|
||
|
|
<p class="w-80 xl-w-90 md-w-100 mb-10px">Everybody is looking for places where to relax and get more energy. Revitalize your senses and refresh your mind.</p>
|
||
|
|
<ul class="p-0 list-style-01 fs-20 alt-font mb-25px">
|
||
|
|
<li class="border-color-light-gray pt-15px pb-15px text-dark-gray">Increased happiness</li>
|
||
|
|
<li class="border-color-light-gray pt-15px pb-15px text-dark-gray">Promotes radiant skin</li>
|
||
|
|
<li class="border-color-light-gray pt-15px pb-15px text-dark-gray">Promotes a better sleep</li>
|
||
|
|
</ul>
|
||
|
|
<div class="d-inline-block w-100">
|
||
|
|
<a href="demo-spa-salon-treatments.html" class="btn btn-small btn-double-border btn-border-base-color">
|
||
|
|
<span>
|
||
|
|
<span class="btn-double-text" data-text="View treatments">View treatments</span>
|
||
|
|
<span><i class="fa-solid fa-arrow-right"></i></span>
|
||
|
|
</span>
|
||
|
|
</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
|
||
|
|
|
||
|
|
<section class="background-repeat p-0" style="background-image:url('images/demo-spa-salon-home-bg-01.jpg');">
|
||
|
|
<div class="container-fluid p-0">
|
||
|
|
<div class="row align-items-center g-0 justify-content-center">
|
||
|
|
<div class="col">
|
||
|
|
<div class="divider-style-03 divider-style-03-01 border-color-light-gray"></div>
|
||
|
|
</div>
|
||
|
|
<div class="col-5 col-lg-2 col-sm-3 text-center position-relative">
|
||
|
|
<img src="images/demo-spa-salon-home-13.png" class="animation-rotation" alt>
|
||
|
|
<div class="absolute-middle-center lg-w-75"><img src="images/demo-spa-salon-home-14.png" alt></div>
|
||
|
|
</div>
|
||
|
|
<div class="col">
|
||
|
|
<div class="divider-style-03 divider-style-03-01 border-color-light-gray"></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
|
||
|
|
|
||
|
|
<section class="background-repeat overlap-height position-relative pt-4 md-pt-8" style="background-image:url('images/demo-spa-salon-home-bg-01.jpg');">
|
||
|
|
<div class="position-absolute left-minus-100px top-50 d-none d-lg-inline-block" data-bottom-top="transform: translateY(-50px)" data-top-bottom="transform: translateY(50px)">
|
||
|
|
<img src="images/demo-spa-salon-bg-img-03.png" alt>
|
||
|
|
</div>
|
||
|
|
<div class="container overlap-gap-section">
|
||
|
|
<div class="row justify-content-center mb-6 md-mb-8 xs-mb-40px">
|
||
|
|
<div class="col-xl-10 testimonials-style-11 position-relative ps-15 pe-15 sm-ps-15px sm-pe-15px text-center">
|
||
|
|
<div class="swiper slider-custom-text" data-slider-options="{ "loop": true, "keyboard": { "enabled": true, "onlyInViewport": true }, "autoplay": { "delay": 4000, "disableOnInteraction": false }, "navigation": { "nextEl": ".swiper-button-next-nav", "prevEl": ".swiper-button-previous-nav", "effect": "fade" } }">
|
||
|
|
<div class="swiper-wrapper">
|
||
|
|
|
||
|
|
<div class="swiper-slide text-center">
|
||
|
|
<h6 class="alt-font lh-40 text-dark-gray mb-20px">The wonderful services you offer locally are great for our community. People are tired of having to travel out of town for things.</h6>
|
||
|
|
<span class="fs-15 text-base-color fw-500 d-block text-uppercase ls-2px">Jonsan donner</span>
|
||
|
|
<span class="fs-14 lh-20 text-dark-gray fw-500 text-uppercase d-block ls-05px">Relax massage</span>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
|
||
|
|
<div class="swiper-slide text-center">
|
||
|
|
<h6 class="alt-font lh-40 text-dark-gray mb-20px">This place is beautiful. The outside, the inside, staff communication is all on point! The staff is very friendly, informative and patient.</h6>
|
||
|
|
<span class="fs-15 text-base-color fw-500 d-block text-uppercase ls-2px">Lauren cruikshank</span>
|
||
|
|
<span class="fs-14 lh-20 text-dark-gray fw-500 text-uppercase d-block ls-05px">Relax massage</span>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
|
||
|
|
<div class="swiper-slide text-center">
|
||
|
|
<h6 class="alt-font lh-40 text-dark-gray mb-20px">The ambiance as soon as you enter puts you at ease immediately. The staff is so sweet and generous and the services they offer are to die for!</h6>
|
||
|
|
<span class="fs-15 text-base-color fw-500 d-block text-uppercase ls-2px">Rosemary downing</span>
|
||
|
|
<span class="fs-14 lh-20 text-dark-gray fw-500 text-uppercase d-block ls-05px">Scalp massage</span>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="swiper-button-previous-nav swiper-button-prev slider-custom-text-prev fs-14 text-uppercase text-dark-gray fw-500 ls-1px">prev</div>
|
||
|
|
<div class="swiper-button-next-nav swiper-button-next slider-custom-text-next fs-14 text-uppercase text-dark-gray fw-500 ls-1px">next</div>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="row row-cols-2 row-cols-lg-6 row-cols-sm-3 text-center justify-content-center clients-style-05" data-anime="{ "el": "childs", "translateY": [30, 0], "opacity": [0,1], "duration": 600, "delay": 0, "staggervalue": 200, "easing": "easeOutQuad" }">
|
||
|
|
|
||
|
|
<div class="col md-mb-30px">
|
||
|
|
<div class="client-box">
|
||
|
|
<a href="demo-spa-salon.html#"><img src="images/demo-spa-salon-client-01.png" class="h-110px" alt></a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
|
||
|
|
<div class="col md-mb-30px">
|
||
|
|
<div class="client-box">
|
||
|
|
<a href="demo-spa-salon.html#"><img src="images/demo-spa-salon-client-02.png" class="h-110px" alt></a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
|
||
|
|
<div class="col md-mb-30px">
|
||
|
|
<div class="client-box">
|
||
|
|
<a href="demo-spa-salon.html#"><img src="images/demo-spa-salon-client-03.png" class="h-110px" alt></a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
|
||
|
|
<div class="col xs-mb-30px">
|
||
|
|
<div class="client-box">
|
||
|
|
<a href="demo-spa-salon.html#"><img src="images/demo-spa-salon-client-04.png" class="h-110px" alt></a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
|
||
|
|
<div class="col">
|
||
|
|
<div class="client-box">
|
||
|
|
<a href="demo-spa-salon.html#"><img src="images/demo-spa-salon-client-05.png" class="h-110px" alt></a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
|
||
|
|
<div class="col">
|
||
|
|
<div class="client-box">
|
||
|
|
<a href="demo-spa-salon.html#"><img src="images/demo-spa-salon-client-06.png" class="h-110px" alt></a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
|
||
|
|
|
||
|
|
<footer class="half-footer pb-45px border-top border-color-light-gray background-repeat" style="background-image:url('images/demo-spa-salon-home-bg-01.jpg');">
|
||
|
|
<div class="container">
|
||
|
|
<div class="overlap-section position-absolute left-0px right-0px text-center d-none d-md-inline-block" data-anime="{ "el": "childs", "translateY": [0, 0], "scale": [0.7, 1], "rotateZ": [50, 0], "opacity": [0,1], "duration": 800, "delay": 200, "staggervalue": 300, "easing": "easeOutQuad" }">
|
||
|
|
<img src="images/demo-spa-salon-home-15.png" alt class="lg-w-20">
|
||
|
|
</div>
|
||
|
|
<div class="row">
|
||
|
|
<div class="col-lg-3 col-md-4 col-sm-6 last-paragraph-no-margin me-auto z-index-1 text-center text-sm-start xs-mb-20px">
|
||
|
|
<span class="fs-20 fw-500 text-dark-gray d-block mb-5px">Studio location</span>
|
||
|
|
<p class="w-100">401 Broadway, 24th Floor<br>New York, NY 10013.</p>
|
||
|
|
</div>
|
||
|
|
<div class="col-lg-3 col-md-4 col-sm-6 last-paragraph-no-margin text-center text-sm-end z-index-1">
|
||
|
|
<span class="fs-20 fw-500 text-dark-gray d-block mb-5px">How can we help?</span>
|
||
|
|
<a href="cdn-cgi/l/email-protection.html#8ae3e4ece5caf3e5fff8eee5e7ebe3e4a4e9e5e7"><span class="__cf_email__" data-cfemail="d1b8bfb7be91a8bea4a3b5bebcb0b8bfffb2bebc">[email protected]</span></a><br>
|
||
|
|
<a href="cdn-cgi/l/email-protection.html#9bf3e9dbe2f4eee9fff4f6faf2f5b5f8f4f6"><span class="__cf_email__" data-cfemail="d5bda795acbaa0a7b1bab8b4bcbbfbb6bab8">[email protected]</span></a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="row align-items-center justify-content-center mt-20px mb-10px md-mb-20px">
|
||
|
|
<div class="col d-none d-md-flex">
|
||
|
|
<div class="divider-style-03 divider-style-03-01 border-color-light-gray"></div>
|
||
|
|
</div>
|
||
|
|
<div class="col-xl-4 col-lg-5 col-md-7 text-center elements-social social-icon-style-04">
|
||
|
|
<ul class="large-icon dark mb-0">
|
||
|
|
<li><a class="facebook" href="https://www.facebook.com/" target="_blank"><i class="fa-brands fa-facebook-f"></i><span></span></a></li>
|
||
|
|
<li><a class="dribbble" href="http://www.dribbble.com" target="_blank"><i class="fa-brands fa-dribbble"></i><span></span></a></li>
|
||
|
|
<li><a class="twitter" href="https://www.twitter.com" target="_blank"><i class="fa-brands fa-twitter"></i><span></span></a></li>
|
||
|
|
<li><a class="instagram" href="https://www.instagram.com" target="_blank"><i class="fa-brands fa-instagram"></i><span></span></a></li>
|
||
|
|
<li><a class="linkedin" href="http://www.linkedin.com" target="_blank"><i class="fa-brands fa-linkedin-in"></i><span></span></a></li>
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
<div class="col d-none d-md-flex">
|
||
|
|
<div class="divider-style-03 divider-style-03-01 border-color-light-gray"></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="row align-items-center">
|
||
|
|
<div class="col-md-6 last-paragraph-no-margin text-center text-md-start sm-mb-10px">
|
||
|
|
<p>© 2024 <a href="index.html" target="_blank" class="text-decoration-line-bottom text-dark-gray fw-500">Crafto.</a> All rights reserved.</p>
|
||
|
|
</div>
|
||
|
|
<div class="col-md-6 text-center text-md-end last-paragraph-no-margin">
|
||
|
|
<p>Proudly Powered by <a href="https://www.themezaa.com/" target="_blank" class="text-decoration-line-bottom text-dark-gray fw-500">ThemeZaa</a></p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</footer>
|
||
|
|
|
||
|
|
|
||
|
|
<div class="scroll-progress d-none d-xxl-block">
|
||
|
|
<a href="demo-spa-salon.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>
|
||
|
|
|
||
|
|
|
||
|
|
<script data-cfasync="false" src="cdn-cgi/scripts/5c5dd728/cloudflare-static/email-decode.min.js"></script><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>
|