mirror of
https://github.com/rjNemo/vf-site
synced 2026-06-10 11:16:38 +00:00
1310 lines
47 KiB
HTML
1310 lines
47 KiB
HTML
<!doctype html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="utf-8" />
|
||
<meta
|
||
name="viewport"
|
||
content="width=device-width, initial-scale=1, shrink-to-fit=no"
|
||
/>
|
||
|
||
<!-- SEO Meta Tags -->
|
||
<meta name="description" content="Description" />
|
||
<meta name="author" content="Author" />
|
||
|
||
<!-- OG Meta Tags to improve the way the post looks when you share the page on Facebook, Twitter, LinkedIn -->
|
||
<meta property="og:site_name" content="" />
|
||
<!-- website name -->
|
||
<meta property="og:site" content="" />
|
||
<!-- website link -->
|
||
<meta property="og:title" content="" />
|
||
<!-- title shown in the actual shared post -->
|
||
<meta property="og:description" content="" />
|
||
<!-- description shown in the actual shared post -->
|
||
<meta property="og:image" content="" />
|
||
<!-- image link, make sure it's jpg -->
|
||
<meta property="og:url" content="" />
|
||
<!-- where do you want your post to link to -->
|
||
<meta name="twitter:card" content="summary_large_image" />
|
||
<!-- to have large image post format in Twitter -->
|
||
|
||
<!-- Webpage Title -->
|
||
<title>Villa</title>
|
||
|
||
<!-- Styles -->
|
||
<link
|
||
href="https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,400;0,600;0,700;1,400;1,700&display=swap"
|
||
rel="stylesheet"
|
||
/>
|
||
<link
|
||
href="https://fonts.googleapis.com/css2?family=PT+Serif:ital,wght@1,700&display=swap"
|
||
rel="stylesheet"
|
||
/>
|
||
<link href="css/bootstrap.css" rel="stylesheet" />
|
||
<link href="css/fontawesome-all.css" rel="stylesheet" />
|
||
<link href="css/bootstrap-datepicker3.css" rel="stylesheet" />
|
||
<link href="css/swiper.css" rel="stylesheet" />
|
||
<link href="css/magnific-popup.css" rel="stylesheet" />
|
||
<link href="css/styles.css" rel="stylesheet" />
|
||
|
||
<!-- Favicon -->
|
||
<link rel="icon" href="images/favicon.png" />
|
||
</head>
|
||
<body data-spy="scroll" data-target=".fixed-top">
|
||
<!-- Navigation -->
|
||
<nav class="navbar navbar-expand-lg fixed-top navbar-light">
|
||
<div class="container">
|
||
<!-- Text Logo - Use this if you don't have a graphic logo -->
|
||
<!-- <a class="navbar-brand logo-text page-scroll" href="index.html">Villa</a> -->
|
||
|
||
<!-- Image Logo -->
|
||
<a class="navbar-brand logo-image" href="index.html"
|
||
><img src="images/logo.svg" alt="alternative"
|
||
/></a>
|
||
|
||
<button
|
||
class="navbar-toggler p-0 border-0"
|
||
type="button"
|
||
data-toggle="offcanvas"
|
||
>
|
||
<span class="navbar-toggler-icon"></span>
|
||
</button>
|
||
|
||
<div
|
||
class="navbar-collapse offcanvas-collapse"
|
||
id="navbarsExampleDefault"
|
||
>
|
||
<ul class="navbar-nav">
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="article.html"
|
||
>Article <span class="sr-only">(current)</span></a
|
||
>
|
||
</li>
|
||
<li class="nav-item dropdown">
|
||
<a
|
||
class="nav-link dropdown-toggle"
|
||
href="#"
|
||
id="dropdown01"
|
||
data-toggle="dropdown"
|
||
aria-haspopup="true"
|
||
aria-expanded="false"
|
||
>Rooms</a
|
||
>
|
||
<div class="dropdown-menu" aria-labelledby="dropdown01">
|
||
<a class="dropdown-item page-scroll" href="balcony-room.html"
|
||
>Balcony Room</a
|
||
>
|
||
<div class="dropdown-divider"></div>
|
||
<a class="dropdown-item page-scroll" href="panoramic-room.html"
|
||
>Panoramic Room</a
|
||
>
|
||
<div class="dropdown-divider"></div>
|
||
<a
|
||
class="dropdown-item page-scroll"
|
||
href="presidential-room.html"
|
||
>Presidential Room</a
|
||
>
|
||
</div>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="contact.html">Contact</a>
|
||
</li>
|
||
</ul>
|
||
<span class="nav-item ml-auto">
|
||
<a class="btn-outline-sm" href="tel:1-800-324-9832"
|
||
><i class="fas fa-phone-alt"></i>1-800-324-9832</a
|
||
>
|
||
</span>
|
||
<span class="nav-item lang-switch">
|
||
<a class="lang-item no-line active" href="index.html"
|
||
><img src="images/language-en.jpg" alt="alternative" />EN</a
|
||
>
|
||
|
|
||
<a class="lang-item no-line" href="index.html"
|
||
><img src="images/language-it.jpg" alt="alternative" />IT</a
|
||
>
|
||
</span>
|
||
</div>
|
||
<!-- end of navbar-collapse -->
|
||
</div>
|
||
<!-- end of container -->
|
||
</nav>
|
||
<!-- end of navbar -->
|
||
<!-- end of navigation -->
|
||
|
||
<!-- Header -->
|
||
<header id="header" class="header">
|
||
<!-- Header Slider -->
|
||
<div class="swiper-container header-slider">
|
||
<div class="swiper-wrapper">
|
||
<div class="swiper-slide first"></div>
|
||
<div class="swiper-slide second"></div>
|
||
<div class="swiper-slide third"></div>
|
||
</div>
|
||
<!-- end of swiper-wrapper -->
|
||
</div>
|
||
<!-- end of swiper-container -->
|
||
<!-- end of header slider -->
|
||
|
||
<div class="text-container">
|
||
<h1>Villa The Amazing Experience</h1>
|
||
<a
|
||
class="btn-solid-lg popup-with-move-anim"
|
||
href="#header-details-lightbox"
|
||
>Book Us</a
|
||
>
|
||
<a class="btn-outline-lg page-scroll" href="#description">Discover</a>
|
||
</div>
|
||
<!-- end of text-container -->
|
||
</header>
|
||
<!-- end of header -->
|
||
<!-- end of header -->
|
||
|
||
<!-- Header Lightbox -->
|
||
<!-- Lightbox -->
|
||
<div
|
||
id="header-details-lightbox"
|
||
class="lightbox-form zoom-anim-dialog mfp-hide"
|
||
>
|
||
<div class="container">
|
||
<div class="row">
|
||
<button title="Close (Esc)" type="button" class="mfp-close x-button">
|
||
×
|
||
</button>
|
||
<div class="col-lg-12">
|
||
<p>Fill out and send the form to book Villa</p>
|
||
|
||
<!-- Booking Form -->
|
||
<!-- autocomplete = off to avoid display problems in mobile view -->
|
||
<form
|
||
id="bookingForm"
|
||
data-toggle="validator"
|
||
data-focus="false"
|
||
autocomplete="off"
|
||
>
|
||
<div class="form-group">
|
||
<input
|
||
type="text"
|
||
class="form-control-input"
|
||
id="name"
|
||
required
|
||
/>
|
||
<label class="label-control" for="name">Complete name</label>
|
||
<div class="help-block with-errors"></div>
|
||
</div>
|
||
<div class="form-group">
|
||
<input
|
||
type="email"
|
||
class="form-control-input"
|
||
id="email"
|
||
required
|
||
/>
|
||
<label class="label-control" for="email">Email address</label>
|
||
<div class="help-block with-errors"></div>
|
||
</div>
|
||
<div class="form-group">
|
||
<input
|
||
type="text"
|
||
class="form-control-input"
|
||
id="phone"
|
||
required
|
||
/>
|
||
<label class="label-control" for="phone">Phone number</label>
|
||
<div class="help-block with-errors"></div>
|
||
</div>
|
||
<div class="form-group">
|
||
<input
|
||
type="text"
|
||
class="form-control-input"
|
||
id="people"
|
||
required
|
||
/>
|
||
<label class="label-control" for="people"
|
||
>Number of people</label
|
||
>
|
||
<div class="help-block with-errors"></div>
|
||
</div>
|
||
<div class="form-group">
|
||
<select class="form-control-select" id="room" required>
|
||
<option class="select-option" value="" disabled selected>
|
||
Choose room
|
||
</option>
|
||
<option class="select-option" value="Balcony Room">
|
||
Balcony Room
|
||
</option>
|
||
<option class="select-option" value="Panoramic Room">
|
||
Panoramic Room
|
||
</option>
|
||
<option class="select-option" value="Presidential Room">
|
||
Presidential Room
|
||
</option>
|
||
</select>
|
||
<div class="help-block with-errors"></div>
|
||
</div>
|
||
<!-- readonly is enabled to avoid display problems in mobile view -->
|
||
<div class="form-group">
|
||
<input
|
||
type="text"
|
||
class="form-control-input"
|
||
id="start"
|
||
readonly
|
||
required
|
||
/>
|
||
<label class="label-control" for="start">Check-in</label>
|
||
<div class="help-block with-errors"></div>
|
||
</div>
|
||
<div class="form-group">
|
||
<input
|
||
type="text"
|
||
class="form-control-input"
|
||
id="end"
|
||
readonly
|
||
required
|
||
/>
|
||
<label class="label-control" for="end">Check-out</label>
|
||
<div class="help-block with-errors"></div>
|
||
</div>
|
||
<div class="form-group">
|
||
<button type="submit" class="form-control-submit-button">
|
||
Book Now
|
||
</button>
|
||
</div>
|
||
<div class="form-message">
|
||
<div id="msgSubmit" class="h3 text-center hidden"></div>
|
||
</div>
|
||
</form>
|
||
<!-- end of booking form -->
|
||
</div>
|
||
<!-- end of col -->
|
||
</div>
|
||
<!-- end of row -->
|
||
</div>
|
||
<!-- end of container -->
|
||
</div>
|
||
<!-- end of lightbox-form -->
|
||
<!-- end of lightbox -->
|
||
<!-- end of header lightbox -->
|
||
|
||
<!-- Description -->
|
||
<div id="description" class="slider-1 bg-gray">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-lg-12">
|
||
<h2 class="green">Get To Know Villa</h2>
|
||
<p class="p-heading">
|
||
Villa is an unique Bed & Breakfast unit situated on the
|
||
magnificent Mediterranean sea shores, prepared to welcome
|
||
tranquility seeking tourists all year long
|
||
</p>
|
||
</div>
|
||
<!-- end of col -->
|
||
<div class="col-lg-12">
|
||
<!-- Image Slider -->
|
||
<div class="slider-container">
|
||
<div class="swiper-container image-slider">
|
||
<div class="swiper-wrapper">
|
||
<!-- Slide -->
|
||
<div class="swiper-slide">
|
||
<div class="image-container">
|
||
<a
|
||
class="popup-link"
|
||
href="images/description-1.jpg"
|
||
data-effect="fadeIn"
|
||
><img
|
||
class="img-fluid"
|
||
src="images/description-1.jpg"
|
||
alt="alternative"
|
||
/></a>
|
||
</div>
|
||
</div>
|
||
<!-- end of slide -->
|
||
|
||
<!-- Slide -->
|
||
<div class="swiper-slide">
|
||
<div class="image-container">
|
||
<a
|
||
class="popup-link"
|
||
href="images/description-2.jpg"
|
||
data-effect="fadeIn"
|
||
><img
|
||
class="img-fluid"
|
||
src="images/description-2.jpg"
|
||
alt="alternative"
|
||
/></a>
|
||
</div>
|
||
</div>
|
||
<!-- end of slide -->
|
||
|
||
<!-- Slide -->
|
||
<div class="swiper-slide">
|
||
<div class="image-container">
|
||
<a
|
||
class="popup-link"
|
||
href="images/description-3.jpg"
|
||
data-effect="fadeIn"
|
||
><img
|
||
class="img-fluid"
|
||
src="images/description-3.jpg"
|
||
alt="alternative"
|
||
/></a>
|
||
</div>
|
||
</div>
|
||
<!-- end of slide -->
|
||
|
||
<!-- Slide -->
|
||
<div class="swiper-slide">
|
||
<div class="image-container">
|
||
<a
|
||
class="popup-link"
|
||
href="images/description-4.jpg"
|
||
data-effect="fadeIn"
|
||
><img
|
||
class="img-fluid"
|
||
src="images/description-4.jpg"
|
||
alt="alternative"
|
||
/></a>
|
||
</div>
|
||
</div>
|
||
<!-- end of slide -->
|
||
|
||
<!-- Slide -->
|
||
<div class="swiper-slide">
|
||
<div class="image-container">
|
||
<a
|
||
class="popup-link"
|
||
href="images/description-5.jpg"
|
||
data-effect="fadeIn"
|
||
><img
|
||
class="img-fluid"
|
||
src="images/description-5.jpg"
|
||
alt="alternative"
|
||
/></a>
|
||
</div>
|
||
</div>
|
||
<!-- end of slide -->
|
||
|
||
<!-- Slide -->
|
||
<div class="swiper-slide">
|
||
<div class="image-container">
|
||
<a
|
||
class="popup-link"
|
||
href="images/description-6.jpg"
|
||
data-effect="fadeIn"
|
||
><img
|
||
class="img-fluid"
|
||
src="images/description-6.jpg"
|
||
alt="alternative"
|
||
/></a>
|
||
</div>
|
||
</div>
|
||
<!-- end of slide -->
|
||
</div>
|
||
<!-- end of swiper-wrapper -->
|
||
|
||
<!-- Add Arrows -->
|
||
<div class="swiper-button-next"></div>
|
||
<div class="swiper-button-prev"></div>
|
||
<!-- end of add arrows -->
|
||
</div>
|
||
<!-- end of swiper container -->
|
||
</div>
|
||
<!-- end of slider-container -->
|
||
<!-- end of image slider -->
|
||
</div>
|
||
<!-- end of col -->
|
||
</div>
|
||
<!-- end of row -->
|
||
</div>
|
||
<!-- end of container -->
|
||
</div>
|
||
<!-- end of slider-1 -->
|
||
<!-- end of description -->
|
||
|
||
<!-- Facilities -->
|
||
<div class="tabs">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-lg-12">
|
||
<h2>Amazing Facilities</h2>
|
||
<p class="p-heading">
|
||
Everything you need for a relaxed stay. Villa's facilities were
|
||
designed to accommodate the needs of tourists with very high
|
||
demands from all over the world
|
||
</p>
|
||
</div>
|
||
<!-- end of col -->
|
||
</div>
|
||
<!-- end of row -->
|
||
<div class="row">
|
||
<div class="col-lg-12">
|
||
<!-- Tabs Links -->
|
||
<ul class="nav nav-tabs" id="villaTabs" role="tablist">
|
||
<li class="nav-item">
|
||
<a
|
||
class="nav-link active"
|
||
id="nav-tab-1"
|
||
data-toggle="tab"
|
||
href="#tab-1"
|
||
role="tab"
|
||
aria-controls="tab-1"
|
||
aria-selected="true"
|
||
>
|
||
<i class="fas fa-utensils"></i><span>Restaurant</span>
|
||
</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a
|
||
class="nav-link"
|
||
id="nav-tab-2"
|
||
data-toggle="tab"
|
||
href="#tab-2"
|
||
role="tab"
|
||
aria-controls="tab-2"
|
||
aria-selected="false"
|
||
>
|
||
<i class="fas fa-glass-martini-alt"></i><span>Terrace</span>
|
||
</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a
|
||
class="nav-link"
|
||
id="nav-tab-3"
|
||
data-toggle="tab"
|
||
href="#tab-3"
|
||
role="tab"
|
||
aria-controls="tab-3"
|
||
aria-selected="false"
|
||
>
|
||
<i class="fas fa-sun"></i><span>Beach</span>
|
||
</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a
|
||
class="nav-link"
|
||
id="nav-tab-4"
|
||
data-toggle="tab"
|
||
href="#tab-4"
|
||
role="tab"
|
||
aria-controls="tab-4"
|
||
aria-selected="true"
|
||
>
|
||
<i class="fas fa-futbol"></i><span>Playground</span>
|
||
</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a
|
||
class="nav-link"
|
||
id="nav-tab-5"
|
||
data-toggle="tab"
|
||
href="#tab-5"
|
||
role="tab"
|
||
aria-controls="tab-5"
|
||
aria-selected="false"
|
||
>
|
||
<i class="fas fa-car"></i><span>Parking</span>
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
<!-- end of tabs links -->
|
||
|
||
<!-- Tabs Content -->
|
||
<div class="tab-content" id="villaTabsContent">
|
||
<!-- Tab -->
|
||
<div
|
||
class="tab-pane fade show active"
|
||
id="tab-1"
|
||
role="tabpanel"
|
||
aria-labelledby="tab-1"
|
||
>
|
||
<div class="row">
|
||
<div class="col-lg-6">
|
||
<div class="image-container">
|
||
<img
|
||
class="img-fluid"
|
||
src="images/facilities-tab-1.jpg"
|
||
alt="alternative"
|
||
/>
|
||
</div>
|
||
<!-- end of image-container -->
|
||
</div>
|
||
<!-- end of col -->
|
||
<div class="col-lg-6">
|
||
<div class="text-container">
|
||
<h3>Delicious Slow-cooked Local Food</h3>
|
||
<p>
|
||
We serve delicious food from the local cuisine made with
|
||
natural ingredients from local farms and markets.
|
||
Besides the range of meat dishes Villa is vegetarian
|
||
friendly too.
|
||
</p>
|
||
<p>
|
||
No need to hurry in the morning to get good food since
|
||
our breakfast serving times extend in the early noon.
|
||
</p>
|
||
<p class="green">
|
||
<strong>OPEN FROM 8:00 TO 22:00</strong>
|
||
</p>
|
||
</div>
|
||
<!-- end of text-container -->
|
||
</div>
|
||
<!-- end of col -->
|
||
</div>
|
||
<!-- end of row -->
|
||
</div>
|
||
<!-- end of tab-pane -->
|
||
<!-- end of tab -->
|
||
|
||
<!-- Tab -->
|
||
<div
|
||
class="tab-pane fade"
|
||
id="tab-2"
|
||
role="tabpanel"
|
||
aria-labelledby="tab-2"
|
||
>
|
||
<div class="row">
|
||
<div class="col-lg-6">
|
||
<div class="text-container">
|
||
<h3>Beautiful Terrace For Coffee & Drinks</h3>
|
||
<p>
|
||
Start your vacation day with an invigorating coffee and
|
||
choose to sit down and relax or plan your trips to the
|
||
surrounding historical sites and tourists attractions.
|
||
</p>
|
||
<p>
|
||
Besides alcoholic beverages we also serve a great
|
||
assortment of smoothies and non-alcoholic cocktails.
|
||
</p>
|
||
<a class="btn-solid-reg" href="article.html">Article</a>
|
||
<a class="btn-outline-reg" href="contact.html">Contact</a>
|
||
</div>
|
||
<!-- end of text-container -->
|
||
</div>
|
||
<!-- end of col -->
|
||
<div class="col-lg-6">
|
||
<div class="image-container">
|
||
<img
|
||
class="img-fluid"
|
||
src="images/facilities-tab-2.jpg"
|
||
alt="alternative"
|
||
/>
|
||
</div>
|
||
<!-- end of image-container -->
|
||
</div>
|
||
<!-- end of col -->
|
||
</div>
|
||
<!-- end of row -->
|
||
</div>
|
||
<!-- end of tab-pane -->
|
||
<!-- end of tab -->
|
||
|
||
<!-- Tab -->
|
||
<div
|
||
class="tab-pane fade"
|
||
id="tab-3"
|
||
role="tabpanel"
|
||
aria-labelledby="tab-3"
|
||
>
|
||
<div class="row">
|
||
<div class="col-lg-6">
|
||
<div class="image-container">
|
||
<img
|
||
class="img-fluid"
|
||
src="images/facilities-tab-3.jpg"
|
||
alt="alternative"
|
||
/>
|
||
</div>
|
||
<!-- end of image-container -->
|
||
</div>
|
||
<!-- end of col -->
|
||
<div class="col-lg-6">
|
||
<div class="text-container">
|
||
<h3>Warm Beaches And Turquoise Waters</h3>
|
||
<p>
|
||
There are 2 beautiful sunny beaches near Villa,
|
||
conveniently equipped with beach chairs, umbrellas,
|
||
beach bar, showers and trained life guards for your
|
||
safety.
|
||
</p>
|
||
<ul class="list-unstyled li-space-lg">
|
||
<li class="media">
|
||
<i class="fas fa-square"></i>
|
||
<div class="media-body">
|
||
Get sun exposure all day long due to the orientation
|
||
</div>
|
||
</li>
|
||
<li class="media">
|
||
<i class="fas fa-square"></i>
|
||
<div class="media-body">
|
||
Gold sand which extends for a long stretch in the
|
||
water
|
||
</div>
|
||
</li>
|
||
<li class="media">
|
||
<i class="fas fa-square"></i>
|
||
<div class="media-body">
|
||
Amenities are built to provide maximum relaxation
|
||
</div>
|
||
</li>
|
||
</ul>
|
||
<a class="green" href="article.html">Read More >></a>
|
||
</div>
|
||
<!-- end of text-container -->
|
||
</div>
|
||
<!-- end of col -->
|
||
</div>
|
||
<!-- end of row -->
|
||
</div>
|
||
<!-- end of tab-pane -->
|
||
<!-- end of tab -->
|
||
|
||
<!-- Tab -->
|
||
<div
|
||
class="tab-pane fade"
|
||
id="tab-4"
|
||
role="tabpanel"
|
||
aria-labelledby="tab-4"
|
||
>
|
||
<div class="row">
|
||
<div class="col-lg-6">
|
||
<div class="text-container">
|
||
<h3>Kids Are Happy When Having Fun</h3>
|
||
<p>
|
||
Children have their own space to have fun and play games
|
||
under adult supervision so you can enjoy a few moments
|
||
of relaxation in your room or some beach-front
|
||
activities.
|
||
</p>
|
||
<p>
|
||
You can check up on them through the provided video
|
||
surveillance mobile app designed for parents.
|
||
</p>
|
||
<p class="green">
|
||
<strong>OPEN FROM 8:00 TO 22:00</strong>
|
||
</p>
|
||
</div>
|
||
<!-- end of text-container -->
|
||
</div>
|
||
<!-- end of col -->
|
||
<div class="col-lg-6">
|
||
<div class="image-container">
|
||
<img
|
||
class="img-fluid"
|
||
src="images/facilities-tab-4.jpg"
|
||
alt="alternative"
|
||
/>
|
||
</div>
|
||
<!-- end of image-container -->
|
||
</div>
|
||
<!-- end of col -->
|
||
</div>
|
||
<!-- end of row -->
|
||
</div>
|
||
<!-- end of tab-pane -->
|
||
<!-- end of tab -->
|
||
|
||
<!-- Tab -->
|
||
<div
|
||
class="tab-pane fade"
|
||
id="tab-5"
|
||
role="tabpanel"
|
||
aria-labelledby="tab-5"
|
||
>
|
||
<div class="row">
|
||
<div class="col-lg-6">
|
||
<div class="image-container">
|
||
<img
|
||
class="img-fluid rounded"
|
||
src="images/facilities-tab-5.jpg"
|
||
alt="alternative"
|
||
/>
|
||
</div>
|
||
<!-- end of image-container -->
|
||
</div>
|
||
<!-- end of col -->
|
||
<div class="col-lg-6">
|
||
<div class="text-container">
|
||
<h3>No Need To Worry About Your Car</h3>
|
||
<p>
|
||
Villa offers free parking for all its customers in a
|
||
safe and easy to reach area. The parking area is guarded
|
||
and supervised with special cameras for your peace of
|
||
mind
|
||
</p>
|
||
<ul class="list-unstyled li-space-lg">
|
||
<li class="media">
|
||
<i class="fas fa-square"></i>
|
||
<div class="media-body">
|
||
Free access for any type of car and station wagon
|
||
</div>
|
||
</li>
|
||
<li class="media">
|
||
<i class="fas fa-square"></i>
|
||
<div class="media-body">
|
||
Video surveillance and gated access as standard
|
||
options
|
||
</div>
|
||
</li>
|
||
<li class="media">
|
||
<i class="fas fa-square"></i>
|
||
<div class="media-body">
|
||
Enjoy your stay without being concerned about the
|
||
car
|
||
</div>
|
||
</li>
|
||
</ul>
|
||
<p class="green">
|
||
<strong>PARKING SCHEDULE: NON-STOP</strong>
|
||
</p>
|
||
</div>
|
||
<!-- end of text-container -->
|
||
</div>
|
||
<!-- end of col -->
|
||
</div>
|
||
<!-- end of row -->
|
||
</div>
|
||
<!-- end of tab-pane -->
|
||
<!-- end of tab -->
|
||
</div>
|
||
<!-- end of tab-content -->
|
||
<!-- end of tabs content -->
|
||
</div>
|
||
<!-- end of col -->
|
||
</div>
|
||
<!-- end of row -->
|
||
</div>
|
||
<!-- end of container -->
|
||
</div>
|
||
<!-- end of tabs -->
|
||
<!-- end of facilities -->
|
||
|
||
<!-- Rooms -->
|
||
<div class="cards-1">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-lg-12">
|
||
<h2 class="green">Comfort And Relaxation</h2>
|
||
<ul class="list-unstyled li-space-lg p-heading">
|
||
<li class="address">
|
||
Villa's rooms offer comfort and relaxation. All of them include:
|
||
</li>
|
||
<li><i class="fas fa-wifi"></i>Free Wi-Fi</li>
|
||
<li><i class="fas fa-bath"></i>Private bathroom</li>
|
||
<li><i class="fas fa-tablet"></i>Cabinet fridge</li>
|
||
<li><i class="fas fa-tv"></i>Widescreen LCD</li>
|
||
<li><i class="fas fa-snowflake"></i>Air conditioning</li>
|
||
</ul>
|
||
<!-- end of list-unstyled -->
|
||
</div>
|
||
<!-- end of col -->
|
||
</div>
|
||
<!-- end of row -->
|
||
<div class="row">
|
||
<div class="col-lg-12">
|
||
<!-- Card -->
|
||
<div class="card">
|
||
<div class="card-image">
|
||
<a href="balcony-room.html"
|
||
><img
|
||
class="img-fluid"
|
||
src="images/rooms-balcony-room.jpg"
|
||
alt="alternative"
|
||
/></a>
|
||
</div>
|
||
<div class="card-body">
|
||
<h3 class="card-title">Balcony Room - $59/day</h3>
|
||
<p>
|
||
Our entry level room gives you access to all amenities at a
|
||
really affordable price
|
||
</p>
|
||
<a
|
||
class="btn-solid-reg popup-with-move-anim"
|
||
href="#header-details-lightbox"
|
||
>Book Us</a
|
||
>
|
||
<a class="btn-outline-reg" href="balcony-room.html">Details</a>
|
||
</div>
|
||
</div>
|
||
<!-- end of card -->
|
||
|
||
<!-- Card -->
|
||
<div class="card">
|
||
<div class="card-image">
|
||
<a href="panoramic-room.html"
|
||
><img
|
||
class="img-fluid"
|
||
src="images/rooms-panoramic-room.jpg"
|
||
alt="alternative"
|
||
/></a>
|
||
</div>
|
||
<div class="card-body">
|
||
<h3 class="card-title">Panoramic Room - $79/day</h3>
|
||
<p>
|
||
Get the best view to the beautiful sea and the truly splendid
|
||
Villa surroundings
|
||
</p>
|
||
<a
|
||
class="btn-solid-reg popup-with-move-anim"
|
||
href="#header-details-lightbox"
|
||
>Book Us</a
|
||
>
|
||
<a class="btn-outline-reg" href="panoramic-room.html"
|
||
>Details</a
|
||
>
|
||
</div>
|
||
</div>
|
||
<!-- end of card -->
|
||
|
||
<!-- Card -->
|
||
<div class="card">
|
||
<div class="card-image">
|
||
<a href="presidential-room.html"
|
||
><img
|
||
class="img-fluid"
|
||
src="images/rooms-presidential-room.jpg"
|
||
alt="alternative"
|
||
/></a>
|
||
</div>
|
||
<div class="card-body">
|
||
<h3 class="card-title">Presidential Room - $99/day</h3>
|
||
<p>
|
||
High class luxury for the most demanding tourists. Features
|
||
great panorama
|
||
</p>
|
||
<a
|
||
class="btn-solid-reg popup-with-move-anim"
|
||
href="#header-details-lightbox"
|
||
>Book Us</a
|
||
>
|
||
<a class="btn-outline-reg" href="presidential-room.html"
|
||
>Details</a
|
||
>
|
||
</div>
|
||
</div>
|
||
<!-- end of card -->
|
||
</div>
|
||
<!-- end of col -->
|
||
</div>
|
||
<!-- end of row -->
|
||
</div>
|
||
<!-- end of container -->
|
||
</div>
|
||
<!-- end of cards-1 -->
|
||
<!-- end of rooms -->
|
||
|
||
<!-- Attractions -->
|
||
<div class="cards-2 bg-gray">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-lg-12">
|
||
<h2 class="green">Popular Attractions</h2>
|
||
<hr class="hr-heading" />
|
||
</div>
|
||
<!-- end of col -->
|
||
</div>
|
||
<!-- end of row -->
|
||
<div class="row">
|
||
<div class="col-lg-12">
|
||
<!-- Card -->
|
||
<div class="card">
|
||
<div class="card-image">
|
||
<a class="green" href="article.html"
|
||
><img
|
||
class="img-fluid"
|
||
src="images/attraction-1.jpg"
|
||
alt="alternative"
|
||
/></a>
|
||
</div>
|
||
<div class="card-body">
|
||
<p>
|
||
<strong class="green">AFITOS OLD TOWN:</strong> Full of
|
||
historical importance for this part of the world, Afitos Old
|
||
Towm will impress you...
|
||
<a class="green" href="article.html">Read More >></a>
|
||
</p>
|
||
</div>
|
||
</div>
|
||
<!-- end of card -->
|
||
|
||
<!-- Card -->
|
||
<div class="card">
|
||
<div class="card-image">
|
||
<a class="green" href="article.html"
|
||
><img
|
||
class="img-fluid"
|
||
src="images/attraction-2.jpg"
|
||
alt="alternative"
|
||
/></a>
|
||
</div>
|
||
<div class="card-body">
|
||
<p>
|
||
<strong class="green">NAVAGIO BEACH:</strong> Is the most
|
||
famous beach at the Mediterranean sea with white sands and
|
||
cool beach bars. In the week...
|
||
<a class="green" href="article.html">Read More >></a>
|
||
</p>
|
||
</div>
|
||
</div>
|
||
<!-- end of card -->
|
||
|
||
<!-- Card -->
|
||
<div class="card">
|
||
<div class="card-image">
|
||
<a class="green" href="article.html"
|
||
><img
|
||
class="img-fluid"
|
||
src="images/attraction-3.jpg"
|
||
alt="alternative"
|
||
/></a>
|
||
</div>
|
||
<div class="card-body">
|
||
<p>
|
||
<strong class="green">AEGEAN BELVEDERE:</strong> The best
|
||
place to watch the sunset in a romantic atmosphere and maybe
|
||
even drink a glass of wine...
|
||
<a class="green" href="article.html">Read More >></a>
|
||
</p>
|
||
</div>
|
||
</div>
|
||
<!-- end of card -->
|
||
|
||
<!-- Card -->
|
||
<div class="card">
|
||
<div class="card-image">
|
||
<a class="green" href="article.html"
|
||
><img
|
||
class="img-fluid"
|
||
src="images/attraction-4.jpg"
|
||
alt="alternative"
|
||
/></a>
|
||
</div>
|
||
<div class="card-body">
|
||
<p>
|
||
<strong class="green">JAMES WHITE HOUSE:</strong> Don't miss
|
||
this great tourist attraction. The famous writer's house will
|
||
fascinate literature...
|
||
<a class="green" href="article.html">Read More >></a>
|
||
</p>
|
||
</div>
|
||
</div>
|
||
<!-- end of card -->
|
||
</div>
|
||
<!-- end of col -->
|
||
</div>
|
||
<!-- end of row -->
|
||
</div>
|
||
<!-- end of container -->
|
||
</div>
|
||
<!-- end of cards-2 -->
|
||
<!-- end of attractions -->
|
||
|
||
<!-- Testimonials -->
|
||
<div class="slider-2">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-lg-12">
|
||
<h2>Visitor Reviews</h2>
|
||
<hr class="hr-heading" />
|
||
</div>
|
||
<!-- end of col -->
|
||
</div>
|
||
<!-- end of row -->
|
||
<div class="row">
|
||
<div class="col-lg-12">
|
||
<!-- Card Slider -->
|
||
<div class="slider-container">
|
||
<div class="swiper-container card-slider">
|
||
<div class="swiper-wrapper">
|
||
<!-- Slide -->
|
||
<div class="swiper-slide">
|
||
<div class="card">
|
||
<img
|
||
class="card-image"
|
||
src="images/testimonial-1.jpg"
|
||
alt="alternative"
|
||
/>
|
||
<div class="card-body">
|
||
<p class="testimonial-text">
|
||
Our stay at Villa was amazing. I didn't think this
|
||
part of the world can be so beautiful, amazing stay.
|
||
</p>
|
||
<p class="testimonial-author">Jude Thorn - Family</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- end of swiper-slide -->
|
||
<!-- end of slide -->
|
||
|
||
<!-- Slide -->
|
||
<div class="swiper-slide">
|
||
<div class="card">
|
||
<img
|
||
class="card-image"
|
||
src="images/testimonial-2.jpg"
|
||
alt="alternative"
|
||
/>
|
||
<div class="card-body">
|
||
<p class="testimonial-text">
|
||
Loved the villa and its surroundings but I was
|
||
especially impressed by the beautiful sandy beaches
|
||
</p>
|
||
<p class="testimonial-author">Roy Smith - Couple</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- end of swiper-slide -->
|
||
<!-- end of slide -->
|
||
|
||
<!-- Slide -->
|
||
<div class="swiper-slide">
|
||
<div class="card">
|
||
<img
|
||
class="card-image"
|
||
src="images/testimonial-3.jpg"
|
||
alt="alternative"
|
||
/>
|
||
<div class="card-body">
|
||
<p class="testimonial-text">
|
||
WOW! I just can't find the words to describe our
|
||
experience. The staff was great, rooms were very clean
|
||
</p>
|
||
<p class="testimonial-author">Marsha Singer - Family</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- end of swiper-slide -->
|
||
<!-- end of slide -->
|
||
|
||
<!-- Slide -->
|
||
<div class="swiper-slide">
|
||
<div class="card">
|
||
<img
|
||
class="card-image"
|
||
src="images/testimonial-4.jpg"
|
||
alt="alternative"
|
||
/>
|
||
<div class="card-body">
|
||
<p class="testimonial-text">
|
||
So many ways to have fun. You never get bored. You can
|
||
relax at the beach or have fun in the old town
|
||
</p>
|
||
<p class="testimonial-author">Tim Shaw - Family</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- end of swiper-slide -->
|
||
<!-- end of slide -->
|
||
|
||
<!-- Slide -->
|
||
<div class="swiper-slide">
|
||
<div class="card">
|
||
<img
|
||
class="card-image"
|
||
src="images/testimonial-5.jpg"
|
||
alt="alternative"
|
||
/>
|
||
<div class="card-body">
|
||
<p class="testimonial-text">
|
||
Came together with my parents and was able to offer
|
||
them the best vacation they ever had. I will return
|
||
</p>
|
||
<p class="testimonial-author">Lindsay Spice - Family</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- end of swiper-slide -->
|
||
<!-- end of slide -->
|
||
|
||
<!-- Slide -->
|
||
<div class="swiper-slide">
|
||
<div class="card">
|
||
<img
|
||
class="card-image"
|
||
src="images/testimonial-6.jpg"
|
||
alt="alternative"
|
||
/>
|
||
<div class="card-body">
|
||
<p class="testimonial-text">
|
||
Definitely worth the price. The services are of the
|
||
highest quality, staff is very friendly and nice
|
||
</p>
|
||
<p class="testimonial-author">Ann Black - Couple</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- end of swiper-slide -->
|
||
<!-- end of slide -->
|
||
</div>
|
||
<!-- end of swiper-wrapper -->
|
||
|
||
<!-- Add Arrows -->
|
||
<div class="swiper-button-next"></div>
|
||
<div class="swiper-button-prev"></div>
|
||
<!-- end of add arrows -->
|
||
</div>
|
||
<!-- end of swiper-container -->
|
||
</div>
|
||
<!-- end of slider-container -->
|
||
<!-- end of card slider -->
|
||
</div>
|
||
<!-- end of col -->
|
||
</div>
|
||
<!-- end of row -->
|
||
</div>
|
||
<!-- end of container -->
|
||
</div>
|
||
<!-- end of slider-2 -->
|
||
<!-- end of testimonials -->
|
||
|
||
<!-- Location -->
|
||
<div class="basic-1 bg-gray">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-lg-12">
|
||
<h2 class="green">Location Details</h2>
|
||
<ul class="list-unstyled li-space-lg p-heading">
|
||
<li class="address">We're waiting for your visit:</li>
|
||
<li>
|
||
<i class="fas fa-map-marker-alt"></i>Villa Bed & Breakfast,
|
||
Firostefani, 84700, Santorini, Cyclades islands, Greece
|
||
</li>
|
||
<li>
|
||
<i class="fas fa-phone"></i
|
||
><a class="green" href="tel:003024630820">+81 720 2212</a>
|
||
</li>
|
||
<li>
|
||
<i class="fas fa-envelope"></i
|
||
><a class="green" href="mailto:reception@villa.com"
|
||
>reception@villa.com</a
|
||
>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
<!-- end of col -->
|
||
</div>
|
||
<!-- end of row -->
|
||
<div class="row">
|
||
<div class="col-lg-12">
|
||
<div class="map-responsive">
|
||
<iframe
|
||
src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d6423.841890375458!2d25.435475745356655!3d36.386907765681734!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x1499ce86adfd9ff7%3A0xb2a761f740d68afc!2sSantorini!5e0!3m2!1sen!2sro!4v1596106317886!5m2!1sen!2sro"
|
||
allowfullscreen=""
|
||
></iframe>
|
||
</div>
|
||
<!-- end of map-responsive -->
|
||
</div>
|
||
<!-- end of col -->
|
||
</div>
|
||
<!-- end of row -->
|
||
</div>
|
||
<!-- end of container -->
|
||
</div>
|
||
<!-- end of basic-1 -->
|
||
<!-- end of location -->
|
||
|
||
<!-- Footer -->
|
||
<div class="footer">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-lg-12">
|
||
<h3>
|
||
If you are looking too have a comfortable and relaxing time then
|
||
you should get in touch with us using
|
||
<a class="green" href="mailto:reception@villa.com"
|
||
>reception@villa.com</a
|
||
>
|
||
</h3>
|
||
<div class="social-container">
|
||
<span class="fa-stack">
|
||
<a href="#your-link">
|
||
<i class="fas fa-circle fa-stack-2x"></i>
|
||
<i class="fab fa-facebook-f fa-stack-1x"></i>
|
||
</a>
|
||
</span>
|
||
<span class="fa-stack">
|
||
<a href="#your-link">
|
||
<i class="fas fa-circle fa-stack-2x"></i>
|
||
<i class="fab fa-twitter fa-stack-1x"></i>
|
||
</a>
|
||
</span>
|
||
<span class="fa-stack">
|
||
<a href="#your-link">
|
||
<i class="fas fa-circle fa-stack-2x"></i>
|
||
<i class="fab fa-pinterest-p fa-stack-1x"></i>
|
||
</a>
|
||
</span>
|
||
<span class="fa-stack">
|
||
<a href="#your-link">
|
||
<i class="fas fa-circle fa-stack-2x"></i>
|
||
<i class="fab fa-instagram fa-stack-1x"></i>
|
||
</a>
|
||
</span>
|
||
<span class="fa-stack">
|
||
<a href="#your-link">
|
||
<i class="fas fa-circle fa-stack-2x"></i>
|
||
<i class="fab fa-youtube fa-stack-1x"></i>
|
||
</a>
|
||
</span>
|
||
</div>
|
||
<!-- end of social-container -->
|
||
</div>
|
||
<!-- end of col -->
|
||
</div>
|
||
<!-- end of row -->
|
||
</div>
|
||
<!-- end of container -->
|
||
</div>
|
||
<!-- end of footer -->
|
||
<!-- end of footer -->
|
||
|
||
<!-- Copyright -->
|
||
<div class="copyright">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-lg-12">
|
||
<hr class="divider" />
|
||
</div>
|
||
<!-- end of col -->
|
||
</div>
|
||
<!-- end of row -->
|
||
<div class="row">
|
||
<div class="col-lg-6">
|
||
<ul class="list-unstyled li-space-lg p-small">
|
||
<li><a href="article.html">Article</a></li>
|
||
<li><a href="balcony-room.html">Balcony Room</a></li>
|
||
<li><a href="panoramic-room.html">Panoramic Room</a></li>
|
||
<li><a href="presidential-room.html">Presidential Room</a></li>
|
||
<li><a href="contact.html">Contact</a></li>
|
||
</ul>
|
||
<!-- end of list-unstyled -->
|
||
</div>
|
||
<!-- end of col -->
|
||
<div class="col-lg-6">
|
||
<p class="p-small statement">
|
||
Copyright © <a href="#your-link">Name</a>
|
||
</p>
|
||
</div>
|
||
<!-- end of col -->
|
||
</div>
|
||
<!-- enf of row -->
|
||
</div>
|
||
<!-- end of container -->
|
||
</div>
|
||
<!-- end of copyright -->
|
||
<!-- end of copyright -->
|
||
|
||
<!-- Scripts -->
|
||
<script src="js/jquery.min.js"></script>
|
||
<!-- jQuery for Bootstrap's JavaScript plugins -->
|
||
<script src="js/bootstrap.min.js"></script>
|
||
<!-- Bootstrap framework -->
|
||
<script src="js/jquery.easing.min.js"></script>
|
||
<!-- jQuery Easing for smooth scrolling between anchors -->
|
||
<script src="js/swiper.min.js"></script>
|
||
<!-- Swiper for image and text sliders -->
|
||
<script src="js/jquery.magnific-popup.js"></script>
|
||
<!-- Magnific Popup for lightboxes -->
|
||
<script src="js/bootstrap-datepicker.min.js"></script>
|
||
<!-- Datepicker for Bootstrap -->
|
||
<script src="js/scripts.js"></script>
|
||
<!-- Custom scripts -->
|
||
</body>
|
||
</html>
|