{% extends "layout.html" %}
{% block  content %}
<!-- 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 -->

{% endblock %}