@@include('header.htm', {
  "title": "Single Hotel Fullwidth - Star Travel",
  "parents": "hotels",
  "active": "single-hotel-fullwidth"
})

@@include('page-title.htm', {
  "title": "Marriott Hotel",
  "title-border": "",
  "text": "Lorem ipsum dolor sit amet, consectetur adipisicing elit",
  "bg-image": "assets/img/pages/page-title-bg12.jpg"
})

<!-- ====================================
———	PACKAGES SECTION
===================================== -->
<section class="py-10">
  <div class="container">
    <div class="row">
      <div class="col-md-12">
        <div id="package-slider" class="owl-carousel owl-theme package-slider">
          <div class="item">
            <img src="assets/img/holets/hotel-slider-03.jpg" alt="image">
          </div>

          <div class="item">
            <img src="assets/img/holets/hotel-slider-01.jpg" alt="image">
          </div>

          <div class="item">
            <img src="assets/img/holets/hotel-slider-02.jpg" alt="image">
          </div>
        </div>

        <div class="mt-8">
          <h2 class="text-uppercase mb-5">Description</h2>
          <p class="mb-6">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
            labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
            aliquip commodo consequat. Duis aute irure dolor in reprehenderit</p>

          <div class="mb-5">
            <div class="row">
              <div class="col-lg-6">
                <ul class="list-unstyled mb-0">
                  <li class="media">
                    <div class="text-gray-color mr-2">
                      <i class="fa fa-dot-circle-o" aria-hidden="true"></i>
                    </div>
                    <div class="media-body">
                      <p>Cras tincidunt mi a sodales pulvinar.</p>
                    </div>
                  </li>

                  <li class="media">
                    <div class="text-gray-color mr-2">
                      <i class="fa fa-dot-circle-o" aria-hidden="true"></i>
                    </div>
                    <div class="media-body">
                      <p>Mauris in libero sodales ultrices purus</p>
                    </div>
                  </li>

                  <li class="media">
                    <div class="text-gray-color mr-2">
                      <i class="fa fa-dot-circle-o" aria-hidden="true"></i>
                    </div>
                    <div class="media-body">
                      <p>Quisque vulputate enim eu fringilla.</p>
                    </div>
                  </li>

                  <li class="media">
                    <div class="text-gray-color mr-2">
                      <i class="fa fa-dot-circle-o" aria-hidden="true"></i>
                    </div>
                    <div class="media-body">
                      <p>Eleifend mi vel nisl lobortis nec tincidunt</p>
                    </div>
                  </li>

                  <li class="media">
                    <div class="text-gray-color mr-2">
                      <i class="fa fa-dot-circle-o" aria-hidden="true"></i>
                    </div>
                    <div class="media-body">
                      <p>Mauris in libero sodales ultrices purus</p>
                    </div>
                  </li>
                </ul>
              </div>

              <div class="col-lg-6">
                <ul class="list-unstyled mb-0">
                  <li class="media">
                    <div class="text-gray-color mr-2">
                      <i class="fa fa-dot-circle-o" aria-hidden="true"></i>
                    </div>
                    <div class="media-body">
                      <p>Praesent nec nisl iaculis, pulvinar nunc.</p>
                    </div>
                  </li>

                  <li class="media">
                    <div class="text-gray-color mr-2">
                      <i class="fa fa-dot-circle-o" aria-hidden="true"></i>
                    </div>
                    <div class="media-body">
                      <p>Sed at erat lacinia, condimentum eros non</p>
                    </div>
                  </li>

                  <li class="media">
                    <div class="text-gray-color mr-2">
                      <i class="fa fa-dot-circle-o" aria-hidden="true"></i>
                    </div>
                    <div class="media-body">
                      <p>Mauris in libero sodales ultrices purus at</p>
                    </div>
                  </li>
                </ul>
              </div>
            </div>
          </div>
        </div>

        <div class="mb-6">
          <h2 class="text-uppercase mb-5">Rooms types</h2>
          <p class="mb-5">Pellen tesque vitae ultrices magna. Cras vul putate commodo justo. Fusce vitae justo efficitur, condi mentum ante a,
          tempor velit. Proin portt itor tortor</p>
        </div>

        <div class="mb-6 border-bottom">
          <h4 class="text-uppercase mb-5">Double Room</h4>
          <p class="">Consuat sed libero eu feugiat. Praesent vel hendrerit erat. Phasellus gravida efficitur lectus, placerat semper est
          tristique nec. Proin magna enim, nunc ultricies dui sit amet, consectetur adipisicing elit, sed do eiusmod tempor
          incididunt ut labore et dolore magna</p>

          <div class="d-md-flex justify-content-between align-items-center mb-5">
            <ul
              class="list-unstyled d-flex flex-wrap justify-content-center justify-content-md-start font-weight-medium mb-md-0">
              <li class="">
                <a href="" class="text-gray-color hover-text-primary mr-4">
                  <img class="mr-2" src="assets/img/packages/shape-icon-1.png" alt="Image">Breakfast
                </a>
              </li>

              <li class="">
                <a href="" class="text-gray-color hover-text-primary mr-4">
                  <img class="mr-2" src="assets/img/packages/shape-icon-2.png" alt="Image">Plasma TV
                </a>
              </li>

              <li class="">
                <a href="" class="text-gray-color hover-text-primary">
                  <img class="mr-2" src="assets/img/packages/shape-icon-3.png" alt="Image">Free wifi
                </a>
              </li>
            </ul>

            <h5 class="text-center text-lg-left">
              <span class="text-gray-color font-weight-bold text-capitalize">Par night:</span>
              <span class="text-primary font-weight-bold">$150</span>
            </h5>
          </div>

          <div class="row">
            <div class="col-lg-10 col-xl-8">
              <div class="pb-3">
                <div class="row">
                  <div class="col-6 col-md col-lg mb-2 pr-1 pr-md-2">
                    <div class="media img-overlay">
                      <div class="media-content w-100">
                        <img class="media-img rounded w-100" src="assets/img/packages/double-room-img1.jpg" alt="Generic placeholder image">
                      <a href="assets/img/holets/hotel-list-01.jpg" data-fancybox="gallery" class="hover-img-overlay-dark"></a>
                      </div>
                    </div>
                  </div>
              
                  <div class="col-6 col-md col-lg mb-2 pl-1 pr-md-0">
                    <div class="media img-overlay">
                      <div class="media-content w-100">
                        <img class="media-img rounded w-100" src="assets/img/packages/double-room-img2.jpg" alt="Generic placeholder image">
                        <a href="assets/img/holets/hotel-list-02.jpg" data-fancybox="gallery" class="hover-img-overlay-dark"></a>
                      </div>
                    </div>
                  </div>
              
                  <div class="col-6 col-md col-lg mb-2 pr-1">
                    <div class="media img-overlay">
                      <div class="media-content w-100">
                        <img class="media-img rounded w-100" src="assets/img/packages/double-room-img3.jpg" alt="Generic placeholder image">
                        <a href="assets/img/holets/hotel-list-03.jpg" data-fancybox="gallery" class="hover-img-overlay-dark"></a>
                      </div>
                    </div>
                  </div>
              
                  <div class="col-6 col-md col-lg mb-2 pl-1 pl-md-2 px-md-0">
                    <div class="media img-overlay">
                      <div class="media-content w-100">
                        <img class="media-img rounded w-100" src="assets/img/packages/double-room-img4.jpg" alt="Generic placeholder image">
                        <a href="assets/img/holets/hotel-list-04.jpg" data-fancybox="gallery" class="hover-img-overlay-dark"></a>
                      </div>
                    </div>
                  </div>
              
                  <div class="col-6 col-md col-lg mb-2 pr-1 pr-md-3 pl-md-3">
                    <div class="media img-overlay">
                      <div class="media-content w-100">
                        <img class="media-img rounded w-100" src="assets/img/packages/double-room-img5.jpg" alt="Generic placeholder image">
                        <a href="assets/img/holets/hotel-list-05.jpg" data-fancybox="gallery" class="hover-img-overlay-dark"></a>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>

        <div class="mb-8 border-bottom">
          <h4 class="text-uppercase mb-5">Single Room</h4>
          <p class="">Donec phareta nec quam congue egestas. Sed aliquam mauris quam, id molestie erat tristique vel. Donec euismod malesuada
          rhoncus. Nulla vestibulum Ut enim ad minim veniam quis nostrud exercitation ullamco laboris nisi ut aliquip commodo
          consequat</p>

          <div class="d-md-flex justify-content-between align-items-center mb-5">
            <ul
              class="list-unstyled d-flex flex-wrap justify-content-center justify-content-md-start font-weight-medium mb-md-0">
              <li class="">
                <a href="" class="text-gray-color hover-text-primary mr-4">
                  <img class="mr-2" src="assets/img/packages/shape-icon-1.png" alt="Image">Breakfast
                </a>
              </li>

              <li class="">
                <a href="" class="text-gray-color hover-text-primary mr-4">
                  <img class="mr-2" src="assets/img/packages/shape-icon-2.png" alt="Image">Plasma TV
                </a>
              </li>

              <li class="">
                <a href="" class="text-gray-color hover-text-primary">
                  <img class="mr-2" src="assets/img/packages/shape-icon-3.png" alt="Image">Free wifi
                </a>
              </li>
            </ul>

            <h5 class="text-center text-lg-left">
              <span class="text-gray-color font-weight-bold text-capitalize">Par night:</span>
              <span class="text-primary font-weight-bold">$100</span>
            </h5>
          </div>

          <div class="row">
            <div class="col-lg-10 col-xl-8">
              <div class="pb-3">
                <div class="row">
                  <div class="col-6 col-md col-lg mb-2 pr-1 pr-md-2">
                    <div class="media img-overlay">
                      <div class="media-content w-100">
                        <img class="media-img rounded w-100" src="assets/img/packages/single-room-img1.jpg" alt="Generic placeholder image">
                        <a href="assets/img/holets/hotel-list-01.jpg" data-fancybox="gallery" class="hover-img-overlay-dark"></a>
                      </div>
                    </div>
                  </div>
              
                  <div class="col-6 col-md col-lg mb-2 pl-1 pr-md-0">
                    <div class="media img-overlay">
                      <div class="media-content w-100">
                        <img class="media-img rounded w-100" src="assets/img/packages/single-room-img2.jpg" alt="Generic placeholder image">
                        <a href="assets/img/holets/hotel-list-02.jpg" data-fancybox="gallery" class="hover-img-overlay-dark"></a>
                      </div>
                    </div>
                  </div>
              
                  <div class="col-6 col-md col-lg mb-2 pr-1">
                    <div class="media img-overlay">
                      <div class="media-content w-100">
                        <img class="media-img rounded w-100" src="assets/img/packages/single-room-img3.jpg" alt="Generic placeholder image">
                        <a href="assets/img/holets/hotel-list-03.jpg" data-fancybox="gallery" class="hover-img-overlay-dark"></a>
                      </div>
                    </div>
                  </div>
              
                  <div class="col-6 col-md col-lg mb-2 pl-1 pl-md-2 px-md-0">
                    <div class="media img-overlay">
                      <div class="media-content w-100">
                        <img class="media-img rounded w-100" src="assets/img/packages/single-room-img4.jpg" alt="Generic placeholder image">
                        <a href="assets/img/holets/hotel-list-04.jpg" data-fancybox="gallery" class="hover-img-overlay-dark"></a>
                      </div>
                    </div>
                  </div>
              
                  <div class="col-6 col-md col-lg mb-2 pr-1 pr-md-3 pl-md-3">
                    <div class="media img-overlay">
                      <div class="media-content w-100">
                        <img class="media-img rounded w-100" src="assets/img/packages/single-room-img5.jpg" alt="Generic placeholder image">
                        <a href="assets/img/holets/hotel-list-05.jpg" data-fancybox="gallery" class="hover-img-overlay-dark"></a>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>

        <div class="mb-7">
          <h2 class="text-uppercase mb-6">Location</h2>
          <p class="mb-0">Pellen tesque vitae ultrices magna. Cras vul putate commodo justo. Fusce vitae justo efficitur, condi mentum ante a,
          tempor velit. Proin portt itor tortor</p>
        </div>

        <div class="mb-7" id="map" style="width:100%; height:400px;"></div>

        <div class="mb-7">
          <h2 class="text-uppercase mb-6">Reviews</h2>
          <p class="mb-6">Pulla consuat sed libero eu feugiat. Praesent vel hendrerit erat. Phasellus gravida efficitur
            lectus, placerat semper
            est tristique nec. Proin magna enim</p>
        
          <div class="d-flex align-items-center mb-6">
            <h3 class="text-uppercase mb-0">
              <span class="mr-2">Reviews (3)</span>
        
              <span class="text-warning">
                <i class="fa fa-star" aria-hidden="true"></i>
                <i class="fa fa-star" aria-hidden="true"></i>
                <i class="fa fa-star" aria-hidden="true"></i>
                <i class="fa fa-star" aria-hidden="true"></i>
                <i class="fa fa-star-half-o" aria-hidden="true"></i>
              </span>
            </h3>
          </div>
        
          <div class="media mb-6">
            <a class="mr-6" href="">
              <img class="rounded" src="assets/img/blog/comments-02.jpg" alt="Generic placeholder image">
            </a>
        
            <div class="media-body">
              <h5>Samanta Doe</h5>
              <span class="star add-rating-default pb-1"></span>
              <p class="mb-0">Pellen tesque vitae ultrices magna. Cras vul putate commodo justo. Fusce vitae justo
                efficitur, condi mentum ante.</p>
            </div>
          </div>
        
          <div class="media mb-6">
            <a class="mr-6" href="">
              <img class="rounded" src="assets/img/blog/comments-01.jpg" alt="Generic placeholder image">
            </a>
        
            <div class="media-body">
              <h5>Amanda Smith</h5>
              <span class="star add-rating-default pb-1"></span>
              <p class="mb-0">Nunc ultricies dui sit amet, consectetur adipisicing elit, sed do eiusmod tempor
                incididunt ut labore et dolore magna
                aliqua.</p>
            </div>
          </div>
        
          <div class="media">
            <a class="mr-6" href="">
              <img class="rounded" src="assets/img/blog/comments-03.jpg" alt="Generic placeholder image">
            </a>
            <div class="media-body">
              <h5>Rodney Artichoke</h5>
              <span class="star add-rating-default pb-1"></span>
              <p class="mb-0">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque
                laudan totam rem ape riam</p>
            </div>
          </div>
        </div>
        
        <form class="">
          <h3 class="text-uppercase mb-6">Leave your review</h3>
        
          <p class="rating-view d-flex align-items-center">
            <span class="content-view">Want to Rate it?</span>
            <span class="star add-rating-default ml-2"></span>
          </p>
        
          <div class="form-group mb-6">
            <textarea class="form-control border-0 bg-smoke" placeholder="Comment" rows="6"></textarea>
          </div>
        
          <div class="">
            <button type="button" onclick="location.href='javascript:void(0)';"
              class="btn btn-hover btn-outline-secondary text-uppercase">
              Submit
            </button>
          </div>
        </form>
      </div>
    </div>
  </div>
</section>

<!-- ====================================
———	PACKAGES LIKE SECTION
===================================== -->
<section class="pb-10">
  <div class="container">
    <div class="text-uppercase mb-4">
      <h2 class="mb-0">you may also like</h2>
    </div>
    <div class="row">
      <div class="col-md-6 col-lg-4 mb-5 mb-lg-0">
        <div class="card card-bg">
          <a href="" class="position-relative">
            <img class="card-img-top" src="assets/img/holets/hotel-list-01.jpg" alt="Card image cap">
            <div class="card-img-overlay card-hover-overlay rounded-top d-flex flex-column">
              <ul class="list-unstyled d-flex mt-auto text-warning mb-1">
                <li>
                  <i class="fa fa-star mr-1" aria-hidden="true"></i>
                </li>
                <li>
                  <i class="fa fa-star mr-1" aria-hidden="true"></i>
                </li>
                <li>
                  <i class="fa fa-star mr-1" aria-hidden="true"></i>
                </li>
                <li>
                  <i class="fa fa-star mr-1" aria-hidden="true"></i>
                </li>
                <li>
                  <i class="fa fa-star-o" aria-hidden="true"></i>
                </li>
              </ul>
              <h6 class="text-white font-weight-bold">4 Review</h6>
            </div>
          </a>

          <div class="card-body">
            <h5>
              <a href="" class="card-title text-uppercase">The London Hotel</a>
            </h5>

            <p class="mb-7">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt
              ut labore et dolore
              aliqua.</p>

            <div class="d-flex justify-content-between align-items-center">
              <div>
                <p class="mb-0 text-capitalize">Start from</p>
                <h3 class="text-primary">$40</h3>
              </div>

              <div>
                <a href="booking-step-1.html" class="btn btn-xs btn-outline-secondary text-uppercase">Book now</a>
              </div>
            </div>
          </div>
        </div>
      </div>

      <div class="col-md-6 col-lg-4 mb-5 mb-lg-0">
        <div class="card card-bg">
          <a href="" class="position-relative">
            <img class="card-img-top" src="assets/img/holets/hotel-list-02.jpg" alt="Card image cap">
            <div class="card-img-overlay card-hover-overlay rounded-top d-flex flex-column">
              <ul class="list-unstyled d-flex mt-auto text-warning mb-1">
                <li>
                  <i class="fa fa-star mr-1" aria-hidden="true"></i>
                </li>
                <li>
                  <i class="fa fa-star mr-1" aria-hidden="true"></i>
                </li>
                <li>
                  <i class="fa fa-star mr-1" aria-hidden="true"></i>
                </li>
                <li>
                  <i class="fa fa-star-o mr-1" aria-hidden="true"></i>
                </li>
                <li>
                  <i class="fa fa-star-o" aria-hidden="true"></i>
                </li>
              </ul>
              <h6 class="text-white font-weight-bold">3 Review</h6>
            </div>
          </a>

          <div class="card-body">
            <h5>
              <a href="" class="card-title text-uppercase">The Europe Hotel</a>
            </h5>

            <p class="mb-7">Integer purus ex, dictum nec elementum eu, tristique vel lectus. Donec rutrum lectus et
              pharetra egestas.</p>

            <div class="d-flex justify-content-between align-items-center">
              <div>
                <p class="mb-0 text-capitalize">Start from</p>
                <h3 class="text-primary">$35</h3>
              </div>

              <div>
                <a href="booking-step-1.html" class="btn btn-xs btn-outline-secondary text-uppercase">Book now</a>
              </div>
            </div>
          </div>
        </div>
      </div>

      <div class="col-md-6 col-lg-4">
        <div class="card card-bg">
          <a href="" class="position-relative">
            <img class="card-img-top" src="assets/img/holets/hotel-list-03.jpg" alt="Card image cap">
            <div class="card-img-overlay card-hover-overlay rounded-top d-flex flex-column">
              <ul class="list-unstyled d-flex mt-auto text-warning mb-1">
                <li>
                  <i class="fa fa-star mr-1" aria-hidden="true"></i>
                </li>
                <li>
                  <i class="fa fa-star mr-1" aria-hidden="true"></i>
                </li>
                <li>
                  <i class="fa fa-star mr-1" aria-hidden="true"></i>
                </li>
                <li>
                  <i class="fa fa-star mr-1" aria-hidden="true"></i>
                </li>
                <li>
                  <i class="fa fa-star" aria-hidden="true"></i>
                </li>
              </ul>
              <h6 class="text-white font-weight-bold">5 Review</h6>
            </div>
          </a>

          <div class="card-body">
            <h5>
              <a href="" class="card-title text-uppercase">The Rookery Hotel</a>
            </h5>

            <p class="mb-7">Sed ut perspi ciatis unde omnis iste natus error volu ptatem accusantium unde omnis iste
              doloremque laudan totam</p>

            <div class="d-flex justify-content-between align-items-center">
              <div>
                <p class="mb-0 text-capitalize">Start from</p>
                <h3 class="text-primary">$30</h3>
              </div>

              <div>
                <a href="booking-step-1.html" class="btn btn-xs btn-outline-secondary text-uppercase">Book now</a>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</section>

@@include('footer.htm')