yogiwhere/public/frontend/reservation.html

880 lines
25 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0">
<!-- FONTS -->
<link href='https://fonts.googleapis.com/css?family=Work+Sans:400,300,500,600,700' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Philosopher:400,400italic,700,700italic' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Bilbo+Swash+Caps' rel='stylesheet' type='text/css'>
<!-- STYLESHEETS -->
<link href="css/bootstrap.css" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="font-awesome/css/font-awesome.min.css">
<link href="css/vertical.min.css" rel="stylesheet" type="text/css">
<link href="css/magnific-popup.css" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="css/flaticon.css">
<link rel="stylesheet" href="css/owl.carousel.css">
<link rel="stylesheet" href="css/ihover.css">
<link rel="stylesheet" type="text/css" href="revslider/css/settings.css" media="screen">
<link href="css/styles.css" rel="stylesheet" type="text/css">
<title>Relish</title>
</head>
<body>
<!-- PAGE -->
<div class="page" id="top">
<!-- preloader -->
<div id="preloader">
<div class="preloader-wave"></div>
</div>
<!-- / preloader -->
<!-- site top panel -->
<div class="site-top-panel">
<div class="container">
<div class="row">
<div class="col-md-6 col-sm-8">
<div class="tel-wrap">
<address>
<a href="tel:475-1969996"><i class="fa fa-phone"></i>(475) 196-9996</a>
<span>|</span>
<a href="mailto:relish.support@gmail.com"><i class="fa fa-envelope"></i>relish.support@gmail.com</a>
</address>
</div>
</div>
<div class="col-md-6 col-sm-4">
<div class="lang-wrap">
<div class="currency">
<select name="billing_lang" class="cur-change">
<option value="">USD</option>
<option value="eur">EUR</option>
<option value="gbp">GBP</option>
<option value="au">AUD</option>
</select>
</div>
<span>|</span>
<div class="lang-bar">
<div>
<ul>
<li>
<a href="#" class="lang-sel icl-en">
<img src="images/flag/us.png" class="icflag" alt>
&nbsp;EN
</a>
<ul>
<li class="icl-fr">
<a href="#">
<img src="images/flag/fr.png" class="icflag" alt>
&nbsp;FR
</a>
</li>
<li class="icl-de">
<a href="#">
<img src="images/flag/de.png" class="icflag" alt>
&nbsp;DE
</a>
</li>
</ul>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- /site top panel -->
<!-- sticky menu -->
<header class='sticky-header js-stick top-fixed'>
<div class="container">
<nav class="main-nav">
<div class="full-wrapper align-center">
<!-- logo sticky -->
<div class="nav-logo-wrap-sticky">
<a href="index.html" class="logo">
<img src="images/logo.png" data-at2x="images/logo@2x.png" alt>
</a>
</div>
<!-- / logo sticky -->
<!-- menu mobile bars -->
<div class="mobile-nav">
<i class="fa fa-bars"></i>
</div>
<!-- / menu mobile bars -->
<div class="inner-nav desktop-nav">
<ul class="clearlist">
<li>
<a href="index.html" class="nav-submenu">Home</a>
</li>
<li class="sep">
<a>/</a>
</li>
<li>
<a href="#" class="nav-submenu active">Pages</a>
<!-- submenu -->
<ul class="submenu submenu-mega">
<li class="submenu-mega-col">
<a class="submenu-mega-title font-alt">Pages</a>
<ul>
<li>
<a href="home-1.html">Home 2</a>
</li>
<li>
<a href="home-2.html">Home 3</a>
</li>
<li>
<a href="about-1.html">About us 1</a>
</li>
<li>
<a href="team.html">Our Team</a>
</li>
</ul>
</li>
<li class="submenu-mega-col">
<a class="submenu-mega-title font-alt">Content</a>
<ul>
<li>
<a href="pricing-tables.html">Pricing</a>
</li>
<li>
<a href="reservation.html">Reservation</a>
</li>
<li>
<a href="services.html">Services</a>
</li>
<li>
<a href="shortcodes.html">Shortcodes</a>
</li>
<li>
<a href="typography.html">Typography</a>
</li>
</ul>
</li>
<li class="submenu-mega-col">
<a class="submenu-mega-title font-alt">Portfolio</a>
<ul>
<li>
<a href="gallery-fullwidth-filter.html">Filter</a>
</li>
<li>
<a href="gallery-right-sidebar.html">Right Sidebar</a>
</li>
<li>
<a href="gallery-one-column.html">One Column</a>
</li>
<li>
<a href="gallery-two-column.html">Two Column</a>
</li>
<li>
<a href="gallery-three-column.html">Three Column</a>
</li>
</ul>
</li>
<li class="submenu-mega-col">
<a class="submenu-mega-title font-alt">Blog</a>
<ul>
<li>
<a href="blog-default.html">Default</a>
</li>
<li>
<a href="blog-post.html">Blog Post</a>
</li>
<li>
<a href="blog-two-col.html">Two Columns</a>
</li>
<li>
<a href="blog-three-col.html">Three Columns</a>
</li>
<li>
<a href="blog-fullwidth.html">Full Width</a>
</li>
</ul>
</li>
</ul>
<!-- / submenu -->
</li>
<li class="sep">
<a>/</a>
</li>
<li>
<a href="#" class="nav-submenu">Gallery</a>
<!-- submenu -->
<ul class="submenu">
<li>
<a href="gallery-fullwidth.html">Full Width</a>
</li>
<li>
<a href="gallery-fullwidth-filter.html">Filter</a>
</li>
<li>
<a href="gallery-right-sidebar.html">Right Sidebar</a>
</li>
<li>
<a href="gallery-one-column.html">One Column</a>
</li>
<li>
<a href="gallery-two-column.html">Two Column</a>
</li>
<li>
<a href="gallery-three-column.html">Three Column</a>
</li>
</ul>
<!-- / submenu -->
</li>
<!-- logo menu -->
<li class="nav-logo-wrap">
<a href="index.html" class="logo">
<img src="images/logo.png" data-at2x="images/logo@2x.png" alt>
</a>
</li>
<!-- / logo menu -->
<li>
<a href="#" class="nav-submenu">Blog</a>
<!-- submenu -->
<ul class="submenu">
<li>
<a href="blog-default.html">Default</a>
</li>
<li>
<a href="blog-post.html">Blog Post</a>
</li>
<li>
<a href="blog-two-col.html">Two Columns</a>
</li>
<li>
<a href="blog-three-col.html">Three Columns</a>
</li>
<li>
<a href="blog-fullwidth.html">Full Width</a>
</li>
</ul>
<!-- / submenu -->
</li>
<li class="sep">
<a>/</a>
</li>
<li>
<a href="#" class="nav-submenu">Shop</a>
<!-- submenu -->
<ul class="submenu">
<li>
<a href="shop-product-list.html">Product List</a>
</li>
<li>
<a href="shop-single-item.html">Single Item</a>
</li>
<li>
<a href="shop-cart.html">Shop Cart</a>
</li>
<li>
<a href="shop-checkout.html">Checkout</a>
</li>
</ul>
<!-- / submenu -->
</li>
<li class="sep">
<a>/</a>
</li>
<li>
<a href="contact.html">Location</a>
</li>
</ul>
<div class="menu-rect">
<img src="images/lines/rectangle-1.png" data-at2x="images/lines/rectangle-1@2x.png" alt>
</div>
</div>
</div>
</nav>
</div>
</header>
<!-- / sticky menu -->
<!-- breadcrumb -->
<section class="breadcrumb-section" data-background="images/section-bg/section-bg-4.jpg">
<div class="container align-center">
<nav class="breadcrumb">
<a href="index.html">Home</a>
<a href="#">Reservation</a>
</nav>
</div>
</section>
<!-- /breadcrumb -->
<hr class="mt-0 mb-0 alt-2" />
<!-- page section -->
<section class="page-section">
<div class="container align-center">
<h3 class="section-title bottom-line long font-alt">Book An Procedure<span>We are Open for You</span></h3>
<div class="col-md-10 col-md-offset-1 mb-30">
<p>Phasellus sodales elementum vestibulum. In et dolor felis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum nec ornare mi, ac porttitor nisi.</p>
</div>
<!-- procedure items -->
<div class="row mt-30">
<!-- procedure item -->
<div class="col-md-6 col-lg-4 mb-md-30">
<div class="procedure-item ih-item circle effect13 from_left_and_right font-alt">
<a href="#">
<div class="procedure-media img">
<img src="images/procedure/img-1.jpg" data-at2x="images/procedure/img-1@2x.jpg" alt>
</div>
<div class="info">
<h3>Opening Time</h3>
<div>
<div class="img-line">
<img src="images/lines/img-line-4.png" data-at2x="images/lines/img-line-4@2x.png" alt>
</div>
Monday - Friday
<span>08:00 - 17:30</span>
</div>
<div>
<div class="img-line">
<img src="images/lines/img-line-4.png" data-at2x="images/lines/img-line-4@2x.png" alt>
</div>
Saturday
<span>12:00 - 17:30</span>
</div>
<div>
<div class="img-line">
<img src="images/lines/img-line-4.png" data-at2x="images/lines/img-line-4@2x.png" alt>
</div>
Sunday
<span>CLOSED</span>
</div>
</div>
</a>
</div>
</div>
<!-- /procedure item -->
<!-- procedure item -->
<div class="col-md-6 col-lg-4 mb-md-30">
<div class="procedure-item ih-item circle effect13 from_left_and_right font-alt">
<a href="#">
<div class="procedure-media img">
<img src="images/procedure/img-2.jpg" data-at2x="images/procedure/img-2@2x.jpg" alt>
</div>
<div class="info">
<h3>Opening Time</h3>
<div>
<div class="img-line">
<img src="images/lines/img-line-4.png" data-at2x="images/lines/img-line-4@2x.png" alt>
</div>
Monday - Friday
<span>08:00 - 17:30</span>
</div>
<div>
<div class="img-line">
<img src="images/lines/img-line-4.png" data-at2x="images/lines/img-line-4@2x.png" alt>
</div>
Saturday
<span>12:00 - 17:30</span>
</div>
<div>
<div class="img-line">
<img src="images/lines/img-line-4.png" data-at2x="images/lines/img-line-4@2x.png" alt>
</div>
Sunday
<span>CLOSED</span>
</div>
</div>
</a>
</div>
</div>
<!-- /procedure item -->
<!-- procedure item -->
<div class="col-md-12 col-lg-4">
<div class="procedure-item ih-item circle effect13 from_left_and_right font-alt">
<a href="#">
<div class="procedure-media img">
<img src="images/procedure/img-3.jpg" data-at2x="images/procedure/img-3@2x.jpg" alt>
</div>
<div class="info">
<h3>Opening Time</h3>
<div>
<div class="img-line">
<img src="images/lines/img-line-4.png" data-at2x="images/lines/img-line-4@2x.png" alt>
</div>
Monday - Friday
<span>08:00 - 17:30</span>
</div>
<div>
<div class="img-line">
<img src="images/lines/img-line-4.png" data-at2x="images/lines/img-line-4@2x.png" alt>
</div>
Saturday
<span>12:00 - 17:30</span>
</div>
<div>
<div class="img-line">
<img src="images/lines/img-line-4.png" data-at2x="images/lines/img-line-4@2x.png" alt>
</div>
Sunday
<span>CLOSED</span>
</div>
</div>
</a>
</div>
</div>
<!-- /procedure item -->
</div>
<!-- /procedure items -->
<!-- selection boxes -->
<div class="row mt-20">
<!-- selection box -->
<div class="col-lg-3 col-md-6">
<div class="select">
<h3 class="select-title font-alt">
<span>01.</span>
Select Service
</h3>
<div class="selection-box">
<select>
<option>Detox Body Treatments</option>
<option>Skin Care</option>
<option>Health & Wellness</option>
<option>Power of Water</option>
<option>Red Rock Treatments</option>
<option>Massage</option>
</select>
</div>
</div>
</div>
<!-- /selection box -->
<!-- selection box -->
<div class="col-lg-3 col-md-6">
<div class="select">
<h3 class="select-title font-alt">
<span>02.</span>
Select Staff
</h3>
<div class="selection-box">
<select>
<option>Jane Doe</option>
<option>Jhon Doe</option>
</select>
</div>
</div>
</div>
<!-- /selection box -->
<!-- selection box -->
<div class="col-lg-3 col-md-6">
<div class="select">
<h3 class="select-title font-alt">
<span>03.</span>
Select Day
</h3>
<div class="selection-box">
<select>
<option>21-08-2016</option>
<option>22-08-2016</option>
<option>23-08-2016</option>
<option>24-08-2016</option>
<option>25-08-2016</option>
<option>26-08-2016</option>
</select>
</div>
</div>
</div>
<!-- /selection box -->
<!-- selection box -->
<div class="col-lg-3 col-md-6">
<div class="select">
<h3 class="select-title font-alt">
<span>04.</span>
Select Time
</h3>
<div class="selection-box">
<select>
<option>10:30 am</option>
<option>11:30 am</option>
<option>12:30 pm</option>
<option>13:30 pm</option>
<option>14:30 pm</option>
<option>15:30 pm</option>
<option>16:30 pm</option>
<option>17:30 pm</option>
<option>18:30 pm</option>
</select>
</div>
</div>
</div>
<!-- /selection box -->
</div>
<!-- selection boxes -->
<a href="#" class="button mt-40">Make an appointment</a>
</div>
</section>
<!-- /page section -->
<div class="sep-lane"><span><img src="images/lines/img-line-0.png" data-at2x="images/lines/img-line-0@2x.png" alt></span></div>
<!-- /page section -->
<section class="page-section">
<div class="container align-center">
<h3 class="section-title bottom-line long font-alt">Most Popular Today<span>Designed For You</span></h3>
<div class="col-md-10 col-md-offset-1 mb-30">
<p>Phasellus sodales elementum vestibulum. In et dolor felis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum nec ornare mi, ac porttitor nisi</p>
</div>
<!-- gift items -->
<div class="row mt-30">
<div class="col-lg-3 col-md-6 mb-30">
<div class="gift-item alt-1">
<div class="gift-wrapper font-alt">
<div class="gift-media">
<img src="images/gifts/img-1.jpg" data-at2x="images/gifts/img-1@2x.jpg" alt>
<div class="gift-inside">
<div class="gift-title">
<div class="img-line">
<img src="images/lines/img-line-4.png" data-at2x="images/lines/img-line-4@2x.png" alt>
</div>
<span>Day Spa</span>
<div class="img-line">
<img src="images/lines/img-line-4.png" data-at2x="images/lines/img-line-4@2x.png" alt>
</div>
<h3>Detox Day</h3>
</div>
<div class="gift-price">
$60
</div>
</div>
</div>
</div>
<p>The full works breakfast both mornings</p>
<a href="#" class="button small">Book Online</a>
</div>
</div>
<div class="col-lg-3 col-md-6 mb-30">
<div class="gift-item alt-1">
<div class="gift-wrapper font-alt">
<div class="gift-media">
<img src="images/gifts/img-2.jpg" data-at2x="images/gifts/img-2@2x.jpg" alt>
<div class="gift-inside">
<div class="gift-title">
<div class="img-line">
<img src="images/lines/img-line-4.png" data-at2x="images/lines/img-line-4@2x.png" alt>
</div>
<span>One Day</span>
<div class="img-line">
<img src="images/lines/img-line-4.png" data-at2x="images/lines/img-line-4@2x.png" alt>
</div>
<h3>Spa Break</h3>
</div>
<div class="gift-price">
$55
</div>
</div>
</div>
</div>
<p>Full use of spa facilities throughout your stay </p>
<a href="#" class="button small">Book Online</a>
</div>
</div>
<div class="col-lg-3 col-md-6 mb-30">
<div class="gift-item alt-1">
<div class="gift-wrapper font-alt">
<div class="gift-media">
<img src="images/gifts/img-3.jpg" data-at2x="images/gifts/img-3@2x.jpg" alt>
<div class="gift-inside">
<div class="gift-title">
<div class="img-line">
<img src="images/lines/img-line-4.png" data-at2x="images/lines/img-line-4@2x.png" alt>
</div>
<span>Special</span>
<div class="img-line">
<img src="images/lines/img-line-4.png" data-at2x="images/lines/img-line-4@2x.png" alt>
</div>
<h3>Winter Spa</h3>
</div>
<div class="gift-price">
$45
</div>
</div>
</div>
</div>
<p>£25.00 per person per night to spend in one of our restaurants</p>
<a href="#" class="button small">Book Online</a>
</div>
</div>
<div class="col-lg-3 col-md-6 mb-30">
<div class="gift-item alt-1">
<div class="gift-wrapper font-alt">
<div class="gift-media">
<img src="images/gifts/img-4.jpg" data-at2x="images/gifts/img-4@2x.jpg" alt>
<div class="gift-inside">
<div class="gift-title">
<div class="img-line">
<img src="images/lines/img-line-4.png" data-at2x="images/lines/img-line-4@2x.png" alt>
</div>
<span>2 Night</span>
<div class="img-line">
<img src="images/lines/img-line-4.png" data-at2x="images/lines/img-line-4@2x.png" alt>
</div>
<h3>Spa Stay</h3>
</div>
<div class="gift-price">
$75
</div>
</div>
</div>
</div>
<p>2 fabulous nights in a stylish room or superior suite</p>
<a href="#" class="button small">Book Online</a>
</div>
</div>
</div>
<!-- /gift items -->
</div>
</section>
<!-- /page section -->
<hr class="mt-0 mb-0 alt-2">
<!-- footer -->
<footer>
<div class="footer-rect">
<img src="images/lines/rectangle-3.png" data-at2x="images/lines/rectangle-3@2x.png" alt>
</div>
<!-- footer top -->
<div class="footer-section">
<div class="container">
<div class="row">
<!-- footer about -->
<div class="col-md-4 col-xs-12 mb-lg-30">
<div class="footer-about align-center">
<h3 class="footer-title font-alt">About Relish</h3>
<div class="img-line">
<img src="images/lines/img-line-1.png" data-at2x="images/lines/img-line-1@2x.png" alt>
</div>
<p class="align-left mb-40">Lorem ipsum dolor sit amet, consectetuer adipiscing no. Aenean comodo ligula eget dolor. Senean masas, cum sociis natoque nean comodo.</p>
<h3 class="footer-title-small font-alt">NEWSLETTER SIGNUP</h3>
<form class="form">
<input type="email" class="input-sm mb-20" value="" placeholder="Your Email">
<button class="button small button-newsletter" name="submit" type="submit" >OK</button>
</form>
</div>
</div>
<!-- / footer about -->
<!-- footer tweets -->
<div class="col-md-4 col-xs-12 mb-lg-30">
<div class="footer-tweets align-center">
<h3 class="footer-title font-alt">Latest Tweets</h3>
<div class="img-line">
<img src="images/lines/img-line-1.png" data-at2x="images/lines/img-line-1@2x.png" alt>
</div>
<div class="twitter-footer align-left"></div>
</div>
</div>
<!-- / footer tweets -->
<!-- footer contacts -->
<div class="col-md-4 col-xs-12 mb-lg-30">
<div class="footer-contact align-center">
<h3 class="footer-title font-alt">Contacts</h3>
<div class="img-line">
<img src="images/lines/img-line-1.png" data-at2x="images/lines/img-line-1@2x.png" alt>
</div>
<p>Little Lonsdale St, Talay Victoria 8011 Philippines</p>
E-mail: <a href="#">mail@mail.com</a><br />
Tel: <a href="#">+4723-000-5555</a><br />
Fax: <a href="#">+4723-000-5556</a>
<h3 class="footer-title-small font-alt">Working Hours</h3>
Mon - Fr: 9:00 - 19:00 <br />
Sat: 10:00 - 15:00
</div>
</div>
<!-- / footer contacts -->
</div>
</div>
</div>
<!-- / footer top -->
<!-- footer bottom -->
<div class="bottom-footer">
<div class="container">
<!-- footer copy -->
<div class="footer-copy">
Copyright © 2016 relish.com. All rights reserved. Terms of Use l Privacy Policy
</div>
<!-- / footer copy -->
<!-- footer social -->
<div class="footer-soc-links">
<a href="#">
<i class="flaticon-social"></i>
</a>
<a href="#">
<i class="flaticon-social-4"></i>
</a>
<a href="#">
<i class="flaticon-social-5"></i>
</a>
<a href="#">
<i class="flaticon-connection"></i>
</a>
<a href="#">
<i class="flaticon-social-2"></i>
</a>
</div>
<!-- / footer social -->
</div>
</div>
<!-- / footer bottom -->
</footer>
<!-- / footer -->
<!-- scroll-top -->
<div id="scroll-top">
<i class="fa fa-angle-up"></i>
top
</div>
<!-- / scroll-top -->
</div>
<!-- / PAGE -->
<!-- SCRIPTS -->
<script src="js/jquery.min.js"></script>
<script src="js/jquery.easing.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/owl.carousel.min.js"></script>
<script src="js/isotope.pkgd.min.js"></script>
<script src="js/jquery.fitvids.js"></script>
<script src="js/jquery.magnific-popup.js"></script>
<script src="js/imagesloaded.pkgd.min.js"></script>
<script src="js/masonry.pkgd.min.js"></script>
<script src="js/jquery.sticky.js"></script>
<script src="js/jquery.form.min.js"></script>
<script src="js/jquery.validate.min.js"></script>
<script src="js/jquery.parallax.min.js"></script>
<script src="js/jquery.appear.js"></script>
<script src="js/retina.min.js"></script>
<script type='text/javascript' src='revslider/js/jquery.themepunch.tools.min.js'></script>
<script type='text/javascript' src='revslider/js/jquery.themepunch.revolution.min.js'></script>
<script type='text/javascript' src='revslider/js/jquery.themepunch.tools.min.js'></script>
<script type='text/javascript' src='revslider/js/jquery.themepunch.revolution.min.js'></script>
<script type="text/javascript" src="revslider/js/extensions/revolution.extension.slideanims.min.js"></script>
<script type="text/javascript" src="revslider/js/extensions/revolution.extension.layeranimation.min.js"></script>
<script type="text/javascript" src="revslider/js/extensions/revolution.extension.navigation.min.js"></script>
<script type="text/javascript" src="revslider/js/extensions/revolution.extension.parallax.min.js"></script>
<script type="text/javascript" src="revslider/js/extensions/revolution.extension.video.min.js"></script>
<script type="text/javascript" src="revslider/js/extensions/revolution.extension.actions.min.js"></script>
<script type="text/javascript" src="revslider/js/extensions/revolution.extension.kenburn.min.js"></script>
<script type="text/javascript" src="revslider/js/extensions/revolution.extension.migration.min.js"></script>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false&amp;language=en"></script>
<script src="js/gmap3.min.js"></script>
<script src="js/jquery.ui.min.js"></script>
<script src="js/jquery.tweet.js"></script>
<script src="js/scripts.js"></script>
<!-- / SCRIPTS -->
</body>
</html>