-
Single room
+
Standard rooms
From $99 per night
Accommodation
@@ -372,22 +373,100 @@
-
Accommodation
+
Services
Exceptional service - endless possibilities
-

+
+

+
+
Swimming Pools
+
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
+
+
-

+
+

+
+
Traditional Sauna
+
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
+
+
-

+
+

+
+
Massages and treatments
+
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
+
+
+
+
+
+
+
+
+
+
I recently had the pleasure of staying at the midtown hotel and was blown away by the exceptional service and comfortable accommodations.
+ I would highly recommend this hotel to anyone looking for a relaxing and enjoyable stay.
+
-Jennifer
+
+
+
+
+
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
+ Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
+
-anonymous
+
+
+
+
+
+
+
+
+
diff --git a/hotel_booking/script.js b/hotel_booking/script.js
index 0f0b2fb..60b648c 100644
--- a/hotel_booking/script.js
+++ b/hotel_booking/script.js
@@ -38,8 +38,8 @@ if (window.addEventListener) {
//===== background color (jquery) =====//
$(window).scroll(function() {
var $window = $(window),
- $body = $('body'),
- $panel = $('.panel');
+ $body = $('body'),
+ $panel = $('.panel');
var scroll = $window.scrollTop() + ($window.height() / 3);
$panel.each(function () {
var $this = $(this);
@@ -60,4 +60,12 @@ var swiper = new Swiper(".mySwiper", {
delay: 2500,
disableOnInteraction: false,
},
+});
+var swiper = new Swiper(".swiper-testimonials", {
+ spaceBetween: 30,
+ centeredSlides: true,
+ autoplay: {
+ delay: 2500,
+ disableOnInteraction: false,
+ },
});
\ No newline at end of file
diff --git a/hotel_booking/style.css b/hotel_booking/style.css
index 4c64599..10db81c 100644
--- a/hotel_booking/style.css
+++ b/hotel_booking/style.css
@@ -283,7 +283,6 @@ ul{
.swiper-slide{
text-align: center;
font-size: 18px;
- background: #fff;
display: flex;
justify-content: center;
align-items: center;
@@ -295,7 +294,94 @@ ul{
object-fit: cover;
}
/*-- services --*/
-
+.service-card{
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items:center;
+ text-align: center;
+ color: white;
+ width: 100%;
+ background-color: rgba(0, 0, 0, 0.6);
+}
+.card-title-service{
+ font-size: 32px;
+}
+.card-text-service{
+ font-size: 14px;
+}
+/*--testimonials--*/
+.swiper-testimonials{
+ width: 850px;
+ height: 50vh;
+ justify-content: center;
+ align-items: center;
+}
+.testimonials-text{
+ font-size: 22px;
+}
+.testimonials-user{
+ color: #3C3633;
+}
+.pre-header-testimonials{
+ width: 100px;
+ margin-bottom: 50px;
+ margin-top: 200px;
+}
+/*--Footer--*/
+.footer{
+ width: 100%;
+ height: 100%;
+}
+.footer-grid{
+ display: grid;
+ grid-auto-rows: 1fr;
+ grid-template-columns: 1fr 1fr 1fr;
+}
+.footer-grid-1, .footer-grid-2{
+ display: flex;
+ flex-direction: column;
+ background-color: #194141;
+ height: 100vh;
+ padding-left: 100px;
+ padding-top: 250px;
+ color: #93B1A6;
+}
+.footer-grid-1 a{
+ color: #93B1A6;
+ font-size: 40px;
+ margin-bottom: 30px;
+ transition: all 0.3s ease;
+}
+.footer-grid-2 a{
+ color: #93B1A6;
+ margin-bottom: 20px;
+ transition: all 0.3s ease;
+}
+.footer-grid-2-title a{
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ gap: 20px;
+ color: #93B1A6;
+ font-size: 22px;
+ margin-bottom: 30px;
+}
+.footer-grid-1 a:hover, .footer-grid-2 a:hover{
+ color: white;
+}
+.footer-grid-3{
+ background-color: #112E2E;
+ height: 100vh;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ text-align: center;
+}
+.footer-grid-3-title, .footer-grid-3-social{
+ color: lightgray;
+}
/*---------- Responsive ----------*/
@media (max-width:980px) {
.logo-img{
@@ -310,6 +396,13 @@ ul{
.font-title{
font-size: 50px;
}
+ .profile{
+ padding-left: 50px;
+ padding-right: 50px;
+ }
+ .footer-grid{
+ display: block;
+ }
}
@media (max-width:768px) {
.nav-wrapper {
@@ -372,5 +465,30 @@ ul{
.swiper{
height: 700px;
}
+ .profile{
+ padding-left: 30px;
+ padding-right: 30px;
+ }
+ .pre-header-testimonials{
+ margin-top: 300px;
+ margin-bottom: 30px;
+ }
+ .footer-grid-1, .footer-grid-2{
+ height: 50vh;
+ padding-left: 50px;
+ padding-top: 100px;
+ }
+ .footer-grid-1 a{
+ color: #93B1A6;
+ font-size: 30px;
+ margin-bottom: 20px;
+ }
+ .footer-grid-2 a{
+ margin-bottom: 10px;
+ }
+ .footer-grid-2-title a{
+ font-size: 22px;
+ margin-bottom: 30px;
+ }
}