<!--
author: Boostraptheme
author URL: https://boostraptheme.com
License: Creative Commons Attribution 4.0 Unported
License URL: https://creativecommons.org/licenses/by/4.0/
-->

<!DOCTYPE html>
<html class="no-js" prefix="og: http://ogp.me/ns#"  lang="en-IN">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <title>Beauty &amp; Salon - Free Bootstrap 4 Template</title>
        <meta http-equiv="x-ua-compatible" content="ie=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> 

        <meta name="description" content="Salon Bootstrap Themes & Templates Salon bootstrap themes and templates will help you create an amazing website for your beauty salon of any kind in no time." /> 
        <link href="img/beauty-salon_logo_96dp.png" rel="apple-touch-icon" sizes="96x96">
        <link href="img/beauty-salon_logo_96dp.png" rel="icon" sizes="96x96" type="image/png">
        <meta content="img/beauty-salon_logo_96dp.png" name="msapplication-TileImage">
        
        <meta property="og:url" content="https://www.boostraptheme.com/demo/index.html" />
        <meta property="og:title" content="Beauty and Salon - Free Bootstrap 4 Template | Boostraptheme" />
        <meta property="og:locale" content="en_IN" /> 
        <meta property="og:site_name" content="Boostraptheme" />
        <meta name="twitter:card" content="summary" />
        <meta name="twitter:site" content="BoostrapTheme" />
        <meta name="twitter:creator" content="BoostrapTheme" />
		
		<link href="https://fonts.googleapis.com/css?family=Lobster|Roboto:400,700" rel="stylesheet">
		<link href="https://fonts.googleapis.com/css?family=Great+Vibes" rel="stylesheet">
        <link rel='stylesheet' href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
        <link rel="stylesheet" href="css/owl.carousel.min.css">
        <link rel="stylesheet" href="css/owl.theme.default.min.css">
        <link rel="stylesheet" href="css/magnific-popup.css">
        <link rel="stylesheet" href="css/animate.min.css">
        <link rel="stylesheet" href="css/app.css">

        <script src="js/jquery.min.js"></script>
        <script> 
            $(window).on('load', function(){ $(".loader").fadeOut(2000); }); 
            $(function () {
                new WOW().init();
            });
        </script>

    </head>

    <body>

        <div class="loader"></div>
        <!-- NAVIGATION 
            =================-->
            <div class="topmenu">
              <div class="container">
                <div class="row"  id="page-top">
                  <div class="col-md-6 col-sm-6 phone"> 
                        <div><i class="fa fa-phone"></i> Call Now: (91) 999 9999 99</div> 
                  </div>	
                  <div class="col-md-6 col-sm-6 address"> 
                        <div><i class="fa fa-map-marker"></i> Dros Began, India 222312</div> 
                  </div> 
                </div>
              </div>
            </div> 

            <nav class="navbar navbar-expand-lg navbar-light" id="mainNav" data-toggle="affix">
              <div class="container-fluid">
              	<a class="navbar-brand js-scroll-trigger" href="index.html"><img src="img/logo.png" style="max-height: 60px;" alt="" class="img-fluid"></a>
                <button class="navbar-toggler navbar-toggler-center  ml-auto py-3 my-2 " type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
                  Menu
                  <i class="fa fa-bars"></i>
                </button>
                <div class="collapse navbar-collapse" id="navbarResponsive">
                  <ul class="navbar-nav text-uppercase ml-auto">
                  	<li class="nav-item">
                      <a class="nav-link js-scroll-trigger" href="#home">Home</a>
                    </li>
                  	<li class="nav-item">
                      <a class="nav-link js-scroll-trigger" href="#services">Services</a>
                    </li>
                    <li class="nav-item">
                      <a class="nav-link js-scroll-trigger" href="#about">About</a>
                    </li>  
                    <li class="nav-item">
                      <a class="nav-link js-scroll-trigger" href="#team">Team</a>
                    </li>
                    <li class="nav-item">
                      <a class="nav-link js-scroll-trigger" href="#portfolio">Customer style</a>
                    </li>
                    <li class="nav-item">
                      <a class="nav-link js-scroll-trigger" href="#testimonials">Testimonials</a>
                    </li> 
                    <li class="nav-item">
                      <a class="nav-link js-scroll-trigger" href="#contact">Contact</a>
                    </li>
                  </ul>
                </div>
              </div>
            </nav>

        <!-- HEADER 
            =================-->
            <header id="home">
                <div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
                    <ol class="carousel-indicators">
                      <li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
                      <li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
                    </ol>
                    <div class="carousel-inner" role="listbox">
                      <div class="carousel-item active" > 
                        <div class="home-content-box"> 
                            <div class="home-content-box-inner text-center">
                                <div class="home-heading animated fadeInDown" >
                                    <h3>Fascinating than any <br> fashion salon</h3>
                                </div>
                                <div class="home-btn wow fadeInUp" data-wow-delay="0.3s" >
                                    <a class=" js-scroll-trigger" href="#contact" role="button" title="View Our Work"><button class="btn btn-lg btn-general btn-greenish ">Book Now</button></a>
                                </div>
                            </div>
                        </div>                    
                      </div>
                      <div class="carousel-item" >
                        <div class="home-content-box"> 
                            <div class="home-content-box-inner text-center">
                                <div class="home-heading animated fadeInDown" >
                                	<h3>your hair style <br> our passionate team </h3>
                                </div>
                                <div class="home-btn fadeInDown">
                                    <a class=" js-scroll-trigger" href="#contact" role="button" title="View Our Work"><button class="btn btn-lg btn-general btn-greenish ">Book Now</button></a>
                                </div>
                            </div>
                        </div> 
                      </div> 
                    </div> 
                </div>
            </header>
 

        <!-- SERVICES 
            =================-->
            <section id="services" class="services">
                <div class="container">
                	<div class="row mb-5">
                        <div class="col-md-12 text-center mb-5">
                            <div class="heading wow fadeInUp" data-wow-delay="0.3s">
                                <h1>Services</h1>
                                <div class="bord-bot"></div>
                            </div>
                        </div>
                    </div>
                    <div class="row text-center">
                        <div class="col-md-3 col-sm-6">
                            <div class="service-cont wow fadeInUp" data-wow-delay="0.3s">
                                <img src="img/service/service-1.jpg" alt="" class="img-fluid">
                                <div class="service-desc">Haircut <p>₹100</p></div>

                            </div>
                        </div>
                        <div class="col-md-3 col-sm-6">
                            <div class="service-cont wow fadeInUp" data-wow-delay="0.6s">
                                <img src="img/service/service-2.jpg" alt="" class="img-fluid">
                                <div class="service-desc">Treaming <p>₹120</p></div>
                                
                            </div>
                        </div>
                        <div class="col-md-3 col-sm-6">
                            <div class="service-cont wow fadeInUp" data-wow-delay="0.9s">
                                <img src="img/service/service-3.jpg" alt="" class="img-fluid">
                                <div class="service-desc">Shaving <p>₹80</p></div>
                                
                            </div>
                        </div>
                        <div class="col-md-3 col-sm-6">
                            <div class="service-cont wow fadeInUp" data-wow-delay="1.2s">
                                <img src="img/service/service-4.jpg" alt="" class="img-fluid">
                                <div class="service-desc">Coloring <p>₹70</p></div>
                                
                            </div>
                        </div>
                    </div>
                </div>
            </section>

        <!-- ABOUT 
            =================-->
            <section id="about" class="about">
                <div class="container">
                    <div class="row mb-5">
                        <div class="col-md-12 text-center ">
                            <div class="heading wow fadeInUp" data-wow-delay="0.3s">
                                <h1>About Us</h1>
                                <div class="bord-bot"></div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-4 my-auto">
                            <div class="body-cont mb-5 wow fadeInUp" data-wow-delay="0.6s">
                                <h3>Good Hair style Good Selfie</h3>
                                <div class="bord-bottom"></div>
                                <p>Running a salon successfully might not even seem very much managerial, but do not be fooled. Making up a winning salon simply means tying all the various aspects of luxury, style and beauty. Interior design is one of the factors that really encompass not just the layout of the salon but also the furniture of the salon as well.</p>
                                <a href="#contact" class="img-fluid js-scroll-trigger"><button class="btn btn-general btn-white">ENQUIRIES</button></a>
                            </div>
                        </div>
                        <div class="col-md-8 m-auto text-center">
                            <div class="body-img-1 wow fadeInUp" data-wow-delay="0.9s">
                                <img src="img/treamer-small.png" alt="" class="img-fluid">
                            </div>
                        </div>
                    </div> 
                </div>
            </section> 

		<!-- PERFECT STYLE 
            =================-->
            <section class="perfect-style" id="perfect-style">
            	<div class="container">
            		<div class="row">
            			<div class="col-md-6 my-auto">
            				<div class="perfect-style-desc text-center  wow fadeInLeft" data-wow-delay="0.3s">
            					<h3>Perfect Style</h3>
								<p>Its professional salon really offers a very large number of various different kinds of treatments and each and every treatment come with corresponding furniture of the salon. all, products and treatments are really important aspects of the salon experience. </p>
            				</div>
            			</div>
            		</div>
            	</div>
            </section>

        <!-- TEAM 
            =================-->
            <section id="team" class="team pb-5">
                <div class="container">
                    <div class="row">
                        <div class="col-md-4 col-sm-6">
                            <div class="our-team wow fadeInUp" data-wow-delay="0.3s">
                                <div class="pic">
                                    <img src="img/team/team-1.jpg">
                                    <ul class="social">
                                        <li><a href="#"><i class="fa fa-facebook"></i></a></li>
                                        <li><a href="#"><i class="fa fa-twitter"></i></a></li>
                                        <li><a href="#"><i class="fa fa-google-plus"></i></a></li>
                                        <li><a href="#"><i class="fa fa-linkedin"></i></a></li>
                                    </ul>
                                </div>
                                <div class="team-content">
                                    <h3 class="title">Taneswar khan</h3>
                                    <small class="post">Founder</small>
                                </div>
                                <div class="team-layer">
                                    <a href="#">Taneswar khan</a>
                                    <span class="post">Founder</span>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-4 col-sm-6">
                            <div class="our-team wow fadeInUp" data-wow-delay="0.6s">
                                <div class="pic">
                                    <img src="img/team/team-2.jpg">
                                    <ul class="social">
                                        <li><a href="#"><i class="fa fa-facebook"></i></a></li>
                                        <li><a href="#"><i class="fa fa-twitter"></i></a></li>
                                        <li><a href="#"><i class="fa fa-google-plus"></i></a></li>
                                        <li><a href="#"><i class="fa fa-linkedin"></i></a></li>
                                    </ul>
                                </div>
                                <div class="team-content">
                                    <h3 class="title">krish Modi</h3>
                                    <small class="post">CEO &amp; Cofounder</small>
                                </div>
                                <div class="team-layer">
                                    <a href="#">krish Modi</a>
                                    <span class="post">CEO &amp; Cofounder</span>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-4 col-sm-6">
                            <div class="our-team wow fadeInUp" data-wow-delay="0.9s">
                                <div class="pic">
                                    <img src="img/team/team-3.jpg">
                                    <ul class="social">
                                        <li><a href="#"><i class="fa fa-facebook"></i></a></li>
                                        <li><a href="#"><i class="fa fa-twitter"></i></a></li>
                                        <li><a href="#"><i class="fa fa-google-plus"></i></a></li>
                                        <li><a href="#"><i class="fa fa-linkedin"></i></a></li>
                                    </ul>
                                </div>
                                <div class="team-content">
                                    <h3 class="title">Trisca Ben</h3>
                                    <small class="post">Finances</small>
                                </div>
                                <div class="team-layer">
                                    <a href="#">Trisca Ben</a>
                                    <span class="post">Finances</span>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </section>

        <!-- PORTFOLIO 
            =================-->
            <section id="portfolio" class="portfolio pb-0 pt-5">
                <div class="container-fluid">
                	<div class="row mb-5">
                        <div class="col-md-12 text-center mb-3">
                            <div class="heading wow fadeInUp" data-wow-delay="0.3s">
                                <h1>Our Customer Style</h1>
                                <div class="bord-bot"></div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-3 col-sm-6 p-0">
                            <div class="port-cont">
                                <a href="img/portfolio/portfolio-1.jpg" title="Salon Style">
                                    <img src="img/portfolio/portfolio-1.jpg" alt="Salon Style" class="img-fluid">
                                </a>
                            </div>
                        </div>
                        <div class="col-md-3 col-sm-6 p-0">
                            <div class="port-cont">
                                <a href="img/portfolio/portfolio-2.jpg" title="Salon Style">
                                    <img src="img/portfolio/portfolio-2.jpg" alt="Salon Style" class="img-fluid">
                                </a>
                            </div>
                        </div>
                        <div class="col-md-3 col-sm-6 p-0">
                            <div class="port-cont">
                                <a href="img/portfolio/portfolio-3.jpg" title="Salon Style">
                                    <img src="img/portfolio/portfolio-3.jpg" alt="Salon Style" class="img-fluid">
                                </a>
                            </div>
                        </div>
                        <div class="col-md-3 col-sm-6 p-0">
                            <div class="port-cont">
                                <a href="img/portfolio/portfolio-4.jpg" title="Salon Style">
                                    <img src="img/portfolio/portfolio-4.jpg" alt="Salon Style" class="img-fluid">
                                </a>
                            </div>
                        </div>
                        <div class="col-md-3 col-sm-6 p-0">
                            <div class="port-cont">
                                <a href="img/portfolio/portfolio-8.jpg" title="Salon Style">
                                    <img src="img/portfolio/portfolio-8.jpg" alt="Salon Style" class="img-fluid">
                                </a>
                            </div>
                        </div>
                        <div class="col-md-3 col-sm-6 p-0">
                            <div class="port-cont">
                                <a href="img/portfolio/portfolio-6.jpg" title="Salon Style">
                                    <img src="img/portfolio/portfolio-6.jpg" alt="Salon Style" class="img-fluid">
                                </a>
                            </div>
                        </div>
                        <div class="col-md-3 col-sm-6 p-0">
                            <div class="port-cont">
                                <a href="img/portfolio/portfolio-7.jpg" title="Salon Style">
                                    <img src="img/portfolio/portfolio-7.jpg" alt="Salon Style" class="img-fluid">
                                </a>
                            </div>
                        </div>
                        <div class="col-md-3 col-sm-6 p-0">
                            <div class="port-cont">
                                <a href="img/portfolio/portfolio-5.jpg" title="Salon Style">
                                    <img src="img/portfolio/portfolio-5.jpg" alt="Salon Style" class="img-fluid">
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
            </section>

        <!-- TESTIMONIALS 
            =================-->
            <section id="testimonials" class="testimonials">
                <div class="container">
                    <div class="row">
                        <div class="col-md-12">
                            <div id="testimonial-slider" class="owl-carousel owl-theme">
                                <div class="testimonial">
                                    <div class="pic">
                                        <img src="img/client/client-1.jpg">
                                    </div>
                                    <p class="description">
                                        If you are going to have a successful beauty salon, then you must have beauty salon equipment. Although there are plenty of other things that go into the making of a respectable and popular salon like competitive or affordable rates.
                                    </p>
                                    <h3 class="title">Rahul Singh</h3>
                                    <small class="post">- india</small>
                                </div>
                                <div class="testimonial">
                                    <div class="pic">
                                        <img src="img/client/client-2.jpg">
                                    </div>
                                    <p class="description">
                                        style of a salon by the kind of furniture that it makes use of. Hence it is important to select the right kind of salon furniture and place it appropriately so that you are able to build an image that you are a fashionable stylist in the minds. 
                                    </p>
                                    <h3 class="title">Bhuvan Shah</h3>
                                    <small class="post">- india</small>
                                </div>
                                <div class="testimonial">
                                    <div class="pic">
                                        <img src="img/client/client-3.jpg">
                                    </div>
                                    <p class="description">
                                        salon stock taking a crucial task for each and every owner. It is very well known by each and every person that the beauty products are very expensive and that is the reason why the salon owners know that they will get the best deal done when they go online.
                                    </p>
                                    <h3 class="title">Pranav Mishra</h3>
                                    <small class="post">- India</small>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </section> 
  
        <!-- CONTACT FORM
            =================-->
            <section id="contact" class="contact pb-0">
              <div class="container"> 
                <div class="row mb-5">
                    <div class="col-md-12 text-center">
                        <div class="heading">
                            <h1>Contact Us</h1>
                            <div class="bord-bot"></div>
                            <p class="desc">We would love to hear from you!</p>
                        </div>
                    </div>
                </div>
                <div class="row">
                  <div class="col-lg-12">
                    <form id="contactForm" name="sentMessage" novalidate>
                      <div class="row">
                        <div class="col-md-6">
                          <div class="form-group">
                            <input class="form-control" id="name" type="text" placeholder="Your Name *" required data-validation-required-message="Please enter your name.">
                            <p class="help-block text-danger"></p>
                          </div>
                          <div class="form-group">
                            <input class="form-control" id="email" type="email" placeholder="Your Email *" required data-validation-required-message="Please enter your email address.">
                            <p class="help-block text-danger"></p>
                          </div>
                          <div class="form-group">
                            <input class="form-control" id="phone" type="tel" placeholder="Your Phone *" required data-validation-required-message="Please enter your phone number.">
                            <p class="help-block text-danger"></p>
                          </div>
                        </div>
                        <div class="col-md-6">
                          <div class="form-group">
                            <textarea class="form-control" id="message" placeholder="Your Message *" required data-validation-required-message="Please enter a message."></textarea>
                            <p class="help-block text-danger"></p>
                          </div>
                        </div>
                        <div class="clearfix"></div>
                        <div class="col-lg-12 text-center">
                          <div id="success"></div>
                          <button id="sendMessageButton" class="btn btn-general btn-greenish btn-xl text-uppercase" type="submit"  style="color:white; border-color: white;">Send Message</button>
                        </div>
                      </div>
                    </form>
                  </div>
                </div>
              </div>
 
              <!-- FOOTER 
                   =================-->
                <footer>
                  <div class="container-fluid">
                    <div class="row">
                      <div class="col-md-5">
                        <span class="copyright">Copyright &copy; 2018 Design By <a href="https://boostraptheme.com/">Boostraptheme</a></span>
                      </div>
                      <div class="col-md-3">
                        <ul class="list-inline social-buttons">
                          <li class="list-inline-item">
                            <a href="#">
                              <i class="fa fa-twitter"></i>
                            </a>
                          </li>
                          <li class="list-inline-item">
                            <a href="#">
                              <i class="fa fa-facebook"></i>
                            </a>
                          </li>
                          <li class="list-inline-item">
                            <a href="#">
                              <i class="fa fa-linkedin"></i>
                            </a>
                          </li>
                        </ul>
                      </div>
                      <div class="col-md-4">
                        <ul class="list-inline quicklinks">
                          <li class="list-inline-item">
                            <a href="#">Privacy Policy</a>
                          </li>
                          <li class="list-inline-item">
                            <a href="#">Terms of Use</a>
                          </li>
                        </ul>
                      </div>
                    </div>
                  </div>
                </footer> 

                <a href="#page-top" id="back-to-top" class="btn btn-sm btn-green btn-back-to-top  js-scroll-trigger hidden-sm hidden-xs" title="home" role="button">
                    <i class="fa fa-angle-double-up"></i>
                </a>

            </section>
  
        <script src="js/popper.min.js"></script>
        <script src="js/bootstrap.min.js"></script>
        <script src="js/jquery.easing.min.js"></script>
        <script src="js/jquery.magnific-popup.min.js"></script> 
        <script src="js/owl.carousel.min.js"></script>
        <script src="js/jqBootstrapValidation.min.js"></script>
        <script src="js/contact_me.min.js"></script>
        <script src="js/wow.min.js"></script>
        <script src="js/app.js"></script>
        <!--Start of Tawk.to Script-->
            <script type="text/javascript">
            var Tawk_API=Tawk_API||{}, Tawk_LoadStart=new Date();
            (function(){
            var s1=document.createElement("script"),s0=document.getElementsByTagName("script")[0];
            s1.async=true;
            s1.src='https://embed.tawk.to/5a6d77fc4b401e45400c7419/default';
            s1.charset='UTF-8';
            s1.setAttribute('crossorigin','*');
            s0.parentNode.insertBefore(s1,s0);
            })(); 
            </script>
        <!--End of Tawk.to Script-->
    </body>
</html>