/*------------------------------------------------------------------
[Table of contents]

1.  Template default CSS
	1.1	Variables
	1.2	Mixins
	1.3	Flexbox
	1.4	Reset
2.  Helper Css
3.  Header Section
4.  Hero Section
5.  About Section
6.  Services Section
7.  Testimonial Section
8.  Blog Section
9.  Contact
10.  Footer Style

-------------------------------------------------------------------*/

/*----------------------------------------*/

/* Template default CSS
/*----------------------------------------*/

html,
body {
	height: 100%;
	font-family: "Cabin", sans-serif;
	-webkit-font-smoothing: antialiased;
	font-smooth: antialiased;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	margin: 0;
	color: #111111;
	font-weight: 400;
	font-family: "Plus Jakarta Sans", sans-serif, serif;
}

h1 {
	font-size: 70px;
}

h2 {
	font-size: 36px;
}

h3 {
	font-size: 30px;
}

h4 {
	font-size: 24px;
}

h5 {
	font-size: 18px;
}

h6 {
	font-size: 16px;
}

p {
	font-size: 16px;
	font-family: "Cabin", sans-serif;
	color: #6b6b6b;
	font-weight: 400;
	line-height: 26px;
	margin: 0 0 15px 0;
}

img {
	max-width: 100%;
}

input:focus,
select:focus,
button:focus,
textarea:focus {
	outline: none;
}

a:hover,
a:focus {
	text-decoration: none;
	outline: none;
	color: #24b6e5;
}

ul,
ol {
	padding: 0;
	margin: 0;
}

/*---------------------
  Helper CSS
-----------------------*/

.section-title {
	text-align: center;
	margin-bottom: 22px;
}

.section-title span {
	font-size: 14px;
	color: #24b6e5;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 2px;
}

.section-title h2 {
	font-size: 44px;
	color: #19191a;
	line-height: 58px;
	margin-top: 10px;
}

.set-bg {
	background-repeat: no-repeat;
	background-size: cover;
	background-position: top center;
}

.spad {
	padding-top: 100px;
	padding-bottom: 100px;
}

.spad-2 {
	padding-top: 50px;
	padding-bottom: 70px;
}

.text-white h1,
.text-white h2,
.text-white h3,
.text-white h4,
.text-white h5,
.text-white h6,
.text-white p,
.text-white span,
.text-white li,
.text-white a {
	color: #fff;
}

/* buttons */

.primary-btn {
	display: inline-block;
	font-size: 13px;
	color: #ffffff;
	text-transform: uppercase;
	letter-spacing: 2px;
	font-weight: 700;
	position: relative;
}

.primary-btn:after {
	position: absolute;
	left: 0;
	bottom: -5px;
	width: 100%;
	height: 2px;
	background: #24b6e5;
	content: "";
}

/* Preloader */
#preloder {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 999999;
	background: #ffffff;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
}

.loader {
	width: 80px;
	height: 80px;
	position: relative;
	border-radius: 50%;
	animation: loader 0.8s linear infinite;
	-webkit-animation: loader 0.8s linear infinite;
}

/* Centering logo inside the loader with larger size */
.loader-logo {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 60px;
	/* Increased size of the logo */
	height: auto;
	transform: translate(-50%, -50%);
}

/* Loading text style */
.loading-text {
	margin-top: 20px;
	font-size: 20px;
	font-weight: 900;
	color: #333;
}

/* Loader animation */
@keyframes loader {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
		border: 4px solid #f44336;
		border-left-color: transparent;
	}

	50% {
		-webkit-transform: rotate(180deg);
		transform: rotate(180deg);
		border: 4px solid #673ab7;
		border-left-color: transparent;
	}

	100% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
		border: 4px solid #f44336;
		border-left-color: transparent;
	}
}

@-webkit-keyframes loader {
	0% {
		-webkit-transform: rotate(0deg);
		border: 4px solid #f44336;
		border-left-color: transparent;
	}

	50% {
		-webkit-transform: rotate(180deg);
		border: 4px solid #673ab7;
		border-left-color: transparent;
	}

	100% {
		-webkit-transform: rotate(360deg);
		border: 4px solid #f44336;
		border-left-color: transparent;
	}
}

.spacial-controls {
	position: fixed;
	width: 111px;
	height: 91px;
	top: 0;
	right: 0;
	z-index: 999;
}

.spacial-controls .search-switch {
	display: block;
	height: 100%;
	padding-top: 30px;
	background: #323232;
	text-align: center;
	cursor: pointer;
}

.search-model {
	display: none;
	position: fixed;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	background: #000;
	z-index: 99999;
}

.search-model-form {
	padding: 0 15px;
}

.search-model-form input {
	width: 500px;
	font-size: 40px;
	border: none;
	border-bottom: 2px solid #333;
	background: none;
	color: #999;
}

.search-close-switch {
	position: absolute;
	width: 50px;
	height: 50px;
	background: #333;
	color: #fff;
	text-align: center;
	border-radius: 50%;
	font-size: 28px;
	line-height: 28px;
	top: 30px;
	cursor: pointer;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}

/*---------------------
  Header
-----------------------*/

.header-section.header-normal .menu-item {
	-webkit-box-shadow: 0px 12px 15px rgba(36, 11, 12, 0.05);
	box-shadow: 0px 12px 15px rgba(36, 11, 12, 0.05);
}

.top-nav {
	border-bottom: 1px solid #e5e5e5;
}

.top-nav .tn-left li {
	list-style: none;
	display: inline-block;
	font-size: 16px;
	color: #19191a;
	font-weight: 500;
	padding: 14px 0 12px;
	margin-right: 64px;
	position: relative;
}

.top-nav .tn-left li:after {
	position: absolute;
	right: -32px;
	top: 0;
	width: 1px;
	height: 100%;
	background: #e5e5e5;
	content: "";
}

.top-nav .tn-left li:last-child {
	margin-right: 0;
}

.top-nav .tn-left li:last-child:after {
	display: none;
}

.top-nav .tn-left li i {
	color: #24b6e5;
	margin-right: 4px;
}

.top-nav .tn-right {
	text-align: right;
}

.top-nav .tn-right .top-social {
	display: inline-block;
	margin-right: 35px;
}

.top-nav .tn-right .top-social a {
	display: inline-block;
	font-size: 18px;
	color: #19191a;
	margin-left: 15px;
}

.top-nav .tn-right .bk-btn {
	display: inline-block;
	font-size: 13px;
	font-weight: 700;
	padding: 16px 28px 15px;
	background: #24b6e5;
	color: #ffffff;
	text-transform: uppercase;
	letter-spacing: 2px;
}

.top-nav .tn-right .language-option {
	display: inline-block;
	margin-left: 30px;
	cursor: pointer;
	padding: 13px 0px 11px;
	position: relative;
}

.top-nav .tn-right .language-option:hover .flag-dropdown {
	top: 40px;
	opacity: 1;
	visibility: visible;
}

.top-nav .tn-right .language-option img {
	height: 26px;
	width: 26px;
	border-radius: 50%;
	margin-right: 10px;
}

.top-nav .tn-right .language-option span {
	font-size: 16px;
	color: #19191a;
	text-transform: uppercase;
	font-weight: 500;
}

.top-nav .tn-right .language-option .flag-dropdown {
	position: absolute;
	left: 0;
	top: 60px;
	width: 100px;
	background: #ffffff;
	display: block;
	padding: 10px 15px;
	-webkit-box-shadow: 0px 9px 10px rgba(25, 25, 26, 0.2);
	box-shadow: 0px 9px 10px rgba(25, 25, 26, 0.2);
	opacity: 0;
	visibility: hidden;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
	z-index: 99;
}

.top-nav .tn-right .language-option .flag-dropdown ul li {
	list-style: none;
	text-align: left;
}

.top-nav .tn-right .language-option .flag-dropdown ul li a {
	font-size: 14px;
	text-transform: uppercase;
	font-weight: 500;
	color: #19191a;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}

.top-nav .tn-right .language-option .flag-dropdown ul li a:hover {
	color: #24b6e5;
}

.menu-item {
	position: relative;
	z-index: 9;
}

.menu-item .logo {
	padding: 10px 0;
	width: 140px;
}

.footer-logo {
	width: 150px;
}

@media (max-width: 768px) {
	.footer-logo {
		width: 80px;
	}
}

@media (max-width: 768px) {
	.menu-item .logo {
		width: 120px;
		padding: 6px 0px 0px 8px;
	}
}

.menu-item .logo a {
	display: inline-block;
}

.menu-item .nav-menu {
	text-align: right;
	padding: 7px 0px;
}

.menu-item .nav-menu .mainmenu {
	display: inline-block;
}

.menu-item .nav-menu .mainmenu li {
	list-style: none;
	display: inline-block;
	position: relative;
	z-index: 1;
}

.menu-item .nav-menu .mainmenu li.active a:after {
	opacity: 1;
}

.menu-item .nav-menu .mainmenu li:hover>a:after {
	opacity: 1;
}

.menu-item .nav-menu .mainmenu li:hover .dropdown {
	top: 77px;
	opacity: 1;
	visibility: visible;
}

.menu-item .nav-menu .mainmenu li a {
	font-size: 16px;
	color: #19191a;
	margin-right: 42px;
	font-weight: 500;
	display: inline-block;
	padding: 27px 0;
	position: relative;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}

.menu-item .nav-menu .mainmenu li a:after {
	position: absolute;
	left: 0;
	top: 52px;
	width: 100%;
	height: 2px;
	background: #24b6e5;
	content: "";
	opacity: 0;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}

.menu-item .nav-menu .mainmenu li .dropdown {
	position: absolute;
	left: 0;
	top: 97px;
	width: 180px;
	background: #ffffff;
	z-index: 9;
	opacity: 0;
	visibility: hidden;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
	-webkit-box-shadow: 0px 9px 15px rgba(25, 25, 26, 0.05);
	box-shadow: 0px 9px 15px rgba(25, 25, 26, 0.05);
}

.menu-item .nav-menu .mainmenu li .dropdown li {
	list-style: none;
	display: block;
}

.menu-item .nav-menu .mainmenu li .dropdown li a {
	font-size: 16px;
	color: #19191a;
	display: block;
	text-align: left;
	padding: 8px 15px;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}

.menu-item .nav-menu .mainmenu li .dropdown li a:hover {
	color: #24b6e5;
}

.menu-item .nav-menu .mainmenu li .dropdown li a:after {
	display: none;
}

.menu-item .nav-menu .nav-right {
	display: inline-block;
	margin-left: 43px;
	padding: 27px 0px;
}

.menu-item .nav-menu .nav-right i {
	font-size: 16px;
	color: #19191a;
	cursor: pointer;
}

.canvas-open {
	display: none;
}

.offcanvas-menu-wrapper {
	display: none;
}

/*---------------------
  Hero
-----------------------*/

.hero-section {
	position: relative;
	padding-top: 60px;
	padding-bottom: 100px;
}

.hero-section .container {
	position: relative;
	z-index: 5;
}

.hero-text {
	padding-top: 145px;
}

.hero-text h1 {
	font-size: 80px;
	line-height: 90px;
	color: #ffffff;
	margin-bottom: 16px;
}

.hero-text p {
	font-size: 18px;
	color: #ffffff;
	line-height: 28px;
	margin-bottom: 35px;
}

.booking-form {
	background: #0000007a;
	padding: 45px 40px 45px 40px;
	border-radius: 10px;
	border: 1px solid #d8eb8273;
}

@media (max-width: 576px) {
	.booking-form {
		padding: 15px !important;
	}

	.booking-form>h2 {
		font-size: 30px !important;
	}

	.booking-form h3 {
		font-size: 16px !important;
	}

	.booking-form p {
		font-size: 14px !important;
		line-height: 18px !important;
		margin: 0 !important;
	}
}

.booking-form h3 {
	color: #ffffff;
	text-align: center;
	margin: 10px 0px 0px 0px;
	font-weight: 100;
	font-size: 35px;
}

.booking-form p {
	color: #ffffff;
	text-align: left;
	font-size: 20px;
}

.booking-form form .check-date {
	position: relative;
	margin-bottom: 15px;
}

.booking-form form .check-date label {
	font-size: 14px;
	color: #707079;
	display: block;
	margin-bottom: 10px;
}

.booking-form form .check-date input {
	width: 100%;
	height: 50px;
	border: 1px solid #ebebeb;
	border-radius: 2px;
	font-size: 16px;
	color: #19191a;
	text-transform: uppercase;
	font-weight: 500;
	padding-left: 20px;
}

.booking-form form .check-date i {
	color: #24b6e5;
	position: absolute;
	right: 18px;
	bottom: 17px;
}

.booking-form form .select-option {
	margin-bottom: 0px;
}

.booking-form form .select-option label {
	font-size: 14px;
	color: #707079;
	display: block;
	margin-bottom: 10px;
}

.booking-form form .select-option .nice-select {
	border-radius: 2px;
	border: 1px solid #ebebeb;
	height: 50px;
	line-height: 50px;
	outline: none;
	padding-left: 20px;
	width: 100%;
	float: none;
}

.booking-form form .select-option .nice-select:after {
	border-bottom: 2px solid #24b6e5;
	border-right: 2px solid #24b6e5;
	height: 10px;
	margin-top: 0;
	right: 20px;
	width: 10px;
	top: 36%;
}

.booking-form form input[type=text] {
	border-radius: 12px;
	border: 1px solid #ebebeb;
	border-radius: 50px;
	height: 50px;
	line-height: 50px;
	outline: none;
	padding-left: 20px;
	width: 100%;
	float: none;
}

.booking-form form .select-option .nice-select span {
	font-size: 16px;
	color: #19191a;
	text-transform: uppercase;
	font-weight: 500;
}

.booking-form form .select-option .nice-select .list {
	margin-top: 0;
	width: 100%;
}

.booking-form form button {
	display: block;
	font-size: 14px;
	text-transform: uppercase;
	border: 1px solid #d8eb82;
	border-radius: 2px;
	color: #000;
	font-weight: 500;
	background: #d8eb82;
	width: 100%;
	height: 50px;
	margin-top: 0px;
	border-radius: 12px;
}

.booking-form form button:hover {
	background: #24b6e5 !important;
}

.hero-slider {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
}

.hero-slider.owl-carousel .owl-dots {
	position: absolute;
	left: 0;
	bottom: 23px;
	width: 100%;
	text-align: center;
}

.hero-slider.owl-carousel .owl-dots button {
	height: 6px;
	width: 6px;
	background: #ffffff;
	opacity: 0.5;
	border-radius: 50%;
	margin-right: 10px;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}

.hero-slider.owl-carousel .owl-dots button.active {
	width: 30px;
	border-radius: 50px;
	opacity: 1;
}

.hero-slider.owl-carousel .owl-dots button:last-child {
	margin-right: 0;
}

.hero-slider .owl-stage-outer,
.hero-slider .owl-stage,
.hero-slider .owl-item,
.hero-slider .hs-item {
	height: 100%;
}

/*---------------------
  About US
-----------------------*/

.about-text {
	text-align: center;
	padding: 0 35px;
}

.about-text p {
	color: #595960;
	font-weight: 500;
}

.about-text p.f-para {
	margin-bottom: 10px;
}

.about-text p.s-para {
	margin-bottom: 35px;
}

.about-text .about-btn {
	color: #19191a;
}

.about-pic img {
	min-width: 100%;
}

/*---------------------
  Service Section
-----------------------*/

.services-section {
	padding-bottom: 60px;
	border-top: 1px solid #e5e5e5;
}

.services-section .section-title {
	margin-bottom: 36px;
}

.service-item {
	text-align: center;
	padding: 30px 35px 18px;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}

.service-item:hover {
	background: #24b6e5;
}

.service-item:hover i {
	color: #ffffff;
}

.service-item:hover h4 {
	color: #ffffff;
}

.service-item:hover p {
	color: #ffffff;
}

.service-item i {
	display: inline-block;
	color: #24b6e5;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}

.service-item h4 {
	color: #19191a;
	font-size: 22px;
	margin-bottom: 15px;
	margin-top: 10px;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}

.service-item p {
	color: #707079;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}

/*------------------------
  Home Page Room Section 
-------------------------*/

.hp-room-items {
	margin-left: -15px;
	margin-right: -15px;
	overflow: hidden;
}

.hp-room-items .hp-room-item {
	height: 600px;
	margin-right: -15px;
	position: relative;
	overflow: hidden;
}

.hp-room-items .hp-room-item:hover .hr-text {
	bottom: 135px;
}

.hp-room-items .hp-room-item:hover .hr-text h2 {
	margin-bottom: 30px;
}

.hp-room-items .hp-room-item .hr-text {
	position: absolute;
	left: 45px;
	right: 25px;
	bottom: -250px;
	-webkit-transition: all 0.5s;
	-o-transition: all 0.5s;
	transition: all 0.5s;
}

.hp-room-items .hp-room-item .hr-text h3 {
	color: #ffffff;
	margin-bottom: 15px;
}

.hp-room-items .hp-room-item .hr-text h2 {
	color: #24b6e5;
	font-weight: 700;
	margin-bottom: 50px;
	-webkit-transition: all 0.2s;
	-o-transition: all 0.2s;
	transition: all 0.2s;
}

.hp-room-items .hp-room-item .hr-text h2 span {
	font-family: "Cabin", sans-serif;
	font-size: 16px;
	font-weight: 400;
	color: #ffffff;
}

.hp-room-items .hp-room-item .hr-text table {
	margin-bottom: 30px;
}

.hp-room-items .hp-room-item .hr-text table tbody tr td {
	font-size: 16px;
	color: #ffffff;
	line-height: 36px;
}

.hp-room-items .hp-room-item .hr-text table tbody tr td.r-o {
	width: 120px;
}

.hp-room-items .hp-room-item .hr-text .primary-btn:after {
	background: #ffffff;
}

/*---------------------
  Testimonial Slider
-----------------------*/

.testimonial-section {
	background: #f9f9f9;
}

.testimonial-section .section-title {
	margin-bottom: 30px;
}

.testimonial-slider.owl-carousel .owl-item img {
	width: auto;
	margin: 0 auto;
}

.testimonial-slider.owl-carousel .owl-nav button {
	height: 44px;
	width: 44px;
	border: 1px solid #ebebeb;
	font-size: 24px;
	color: #707079;
	background: #ffffff;
	line-height: 48px;
	text-align: center;
	border-radius: 50%;
	position: absolute;
	left: -190px;
	top: 50%;
	-webkit-transform: translateY(-6px);
	-ms-transform: translateY(-6px);
	transform: translateY(-6px);
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}

.testimonial-slider.owl-carousel .owl-nav button:hover {
	border-color: #19191a;
	color: #19191a;
}

.testimonial-slider.owl-carousel .owl-nav button.owl-next {
	left: auto;
	right: -190px;
}

.testimonial-slider .ts-item {
	text-align: center;
}

.testimonial-slider .ts-item p {
	font-size: 20px;
	color: #707079;
	line-height: 30px;
	margin-bottom: 50px;
}

.testimonial-slider .ts-item .ti-author {
	margin-bottom: 60px;
}

.testimonial-slider .ts-item .ti-author .rating {
	display: inline-block;
}

.testimonial-slider .ts-item .ti-author .rating i {
	color: #f5b917;
	font-size: 16px;
}

.testimonial-slider .ts-item .ti-author h5 {
	font-size: 20px;
	color: #19191a;
	display: inline-block;
}

/*---------------------
  Blog and Event
-----------------------*/

.blog-section {
	padding-bottom: 70px;
}

.blog-section .section-title {
	margin-bottom: 36px;
}

/*---------------------
  Footer Section
-----------------------*/

.footer-section {
	background: #222736;
}

.footer-section .footer-text {
	padding: 80px 0 30px;
}

.footer-section .footer-text .ft-about {
	margin-bottom: 30px;
}

.footer-section .footer-text .ft-about .logo {
	margin-bottom: 20px;
}

.footer-section .footer-text .ft-about .logo a {
	display: inline-block;
}

.footer-section .footer-text .ft-about p {
	color: #aaaab3;
	margin-bottom: 20px;
}

.footer-section .footer-text .ft-about .fa-social a {
	display: inline-block;
	height: 40px;
	width: 40px;
	font-size: 16px;
	line-height: 40px;
	text-align: center;
	color: #ffffff;
	border: 1px solid #5A4D48;
	border-radius: 50%;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
	margin-right: 7px;
}

.footer-section .footer-text .ft-about .fa-social a:hover {
	background: #24b6e5;
	border-color: #24b6e5;
}

.footer-section .footer-text .ft-contact {
	margin-bottom: 30px;
}

.footer-section .footer-text .ft-contact h6 {
	font-size: 14px;
	color: #24b6e5;
	text-transform: uppercase;
	font-weight: 700;
	letter-spacing: 3px;
	font-family: "Cabin", sans-serif;
	margin-bottom: 20px;
}

.footer-section .footer-text .ft-contact ul li a {
	font-size: 16px;
	color: #fff;
	line-height: 32px;
	list-style: none;
}

.footer-section .footer-text .ft-newslatter h6 {
	font-size: 14px;
	color: #24b6e5;
	text-transform: uppercase;
	font-weight: 700;
	letter-spacing: 3px;
	font-family: "Cabin", sans-serif;
	margin-bottom: 20px;
}

.footer-section .footer-text .ft-newslatter p {
	color: #aaaab3;
	margin-bottom: 20px;
}

.footer-section .footer-text .ft-newslatter .fn-form {
	position: relative;
}

.footer-section .footer-text .ft-newslatter .fn-form input {
	width: 100%;
	height: 50px;
	border-radius: 2px;
	background: #393D4A;
	border: none;
	padding-left: 20px;
	font-size: 16px;
	color: #707079;
}

.footer-section .footer-text .ft-newslatter .fn-form button {
	position: absolute;
	right: 0;
	top: 0;
	font-size: 16px;
	background: #24b6e5;
	color: #ffffff;
	padding: 0 16px;
	height: 50px;
	border: none;
	border-radius: 0 2px 2px 0;
}

.footer-section .copyright-option {
	background: rgba(16, 20, 31, 0.2);
	padding: 20px 0;
}

.footer-section .copyright-option ul li {
	list-style: none;
	display: inline-block;
	margin-right: 34px;
}

.footer-section .copyright-option ul li:last-child {
	margin-right: 0;
}

.footer-section .copyright-option ul li a {
	font-size: 16px;
	color: #aaaab3;
}

.footer-section .copyright-option .co-text {
	font-size: 16px;
	color: #707079;
	text-align: right;
}

/* --------------------------------- Other Pages Styles ----------------------------------- */

/*---------------------
  Breadcrumb Section
-----------------------*/

.breadcrumb-section {
	padding: 20px 0px 10px 0px;
}

.breadcrumb-text {
	text-align: left;
}

.breadcrumb-text h2 {
	font-size: 44px;
	color: #19191a;
	margin-bottom: 12px;
}

.breadcrumb-text .bt-option a {
	display: inline-block;
	font-size: 14px;
	color: #24b6e5;
	margin-right: 20px;
	position: relative;
	font-weight: 500;
}

.breadcrumb-text .bt-option a:after {
	position: absolute;
	right: -13px;
	top: 1px;
	content: "";
	font-size: 14px;
	font-family: "FontAwesome";
	color: #aaaab3;
}

.breadcrumb-text .bt-option span {
	display: inline-block;
	font-size: 14px;
	color: #aaaab3;
}

/*------------------------
  About Us Page Section
-------------------------*/

.aboutus-page-section {
	padding-top: 0;
	padding-bottom: 70px;
}

.about-page-text {
	margin-bottom: 65px;
}

.about-page-text .ap-title {
	margin-bottom: 30px;
}

.about-page-text .ap-title h2 {
	font-size: 44px;
	color: #19191a;
	margin-bottom: 18px;
}

.about-page-text .ap-title p {
	font-size: 18px;
	color: #707079;
	line-height: 28px;
}

.about-page-text .ap-services li {
	list-style: none;
	font-size: 20px;
	color: #707079;
	line-height: 42px;
}

.about-page-text .ap-services li i {
	color: #24b6e5;
	margin-right: 5px;
}

.about-page-services .ap-service-item {
	position: relative;
	height: 420px;
	border-radius: 5px;
	margin-bottom: 30px;
}

.about-page-services .ap-service-item .api-text {
	position: absolute;
	left: 0;
	bottom: 40px;
	width: 100%;
	text-align: center;
}

.about-page-services .ap-service-item .api-text h3 {
	color: #ffffff;
}

/*---------------------
  Video Section
-----------------------*/

.video-section {
	height: 500px;
	padding-top: 140px;
}

.video-section .video-text {
	text-align: center;
}

.video-section .video-text h2 {
	font-size: 48px;
	color: #ffffff;
	margin-bottom: 16px;
}

.video-section .video-text p {
	font-size: 20px;
	color: #ffffff;
	margin-bottom: 40px;
}

.video-section .video-text .play-btn {
	display: inline-block;
}

/*---------------------
  Gallery Section
-----------------------*/

.gallery-section {
	padding-bottom: 80px;
}

.gallery-section .section-title {
	margin-bottom: 38px;
}

.gallery-item {
	position: relative;
	height: 279px;
	margin-bottom: 20px;
	border-radius: 5px;
	position: relative;
	z-index: 1;
}

.gallery-item:hover:after {
	opacity: 1;
}

.gallery-item:hover .gi-text {
	opacity: 1;
}

.gallery-item:after {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: rgba(25, 25, 26, 0.3);
	content: "";
	z-index: -1;
	border-radius: 5px;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
	opacity: 0;
}

.gallery-item.large-item {
	height: 576px;
}

.gallery-item .gi-text {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
	opacity: 0;
}

.gallery-item .gi-text h3 {
	color: #ffffff;
}

/*---------------------
  Room Section
-----------------------*/

.rooms-section {
	padding-top: 0;
	padding-bottom: 80px;
}

.room-item {
	margin-bottom: 30px;
}

.room-item img {
	min-width: 100%;
}

.room-item .ri-text {
	border: 1px solid #ebebeb;
	border-top: none;
	padding: 24px 24px 30px 28px;
}

.room-item .ri-text h4 {
	color: #19191a;
	margin-bottom: 17px;
}

.room-item .ri-text h3 {
	color: #24b6e5;
	font-weight: 700;
	margin-bottom: 14px;
}

.room-item .ri-text h3 span {
	font-family: "Cabin", sans-serif;
	font-size: 14px;
	font-weight: 400;
	color: #19191a;
}

.room-item .ri-text table {
	margin-bottom: 18px;
}

.room-item .ri-text table tbody tr td {
	font-size: 16px;
	color: #707079;
	line-height: 36px;
}

.room-item .ri-text table tbody tr td.r-o {
	width: 125px;
}

.room-item .ri-text .primary-btn {
	color: #19191a;
}

.room-pagination {
	text-align: center;
	padding-top: 20px;
}

.room-pagination a {
	font-size: 16px;
	color: #707079;
	border: 1px solid #EFD4B9;
	border-radius: 2px;
	padding: 7px 13px 5px;
	margin-right: 7px;
	display: inline-block;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}

.room-pagination a:last-child {
	margin-right: 0;
}

.room-pagination a:hover {
	background: #24b6e5;
	color: #ffffff;
}

/*-----------------------
  Room Details Section
-------------------------*/

.room-details-section {
	padding-top: 0;
	padding-bottom: 80px;
}

.room-details-item {
	margin-bottom: 50px;
}

.room-details-item img {
	margin-bottom: 40px;
}

.room-details-item .rd-text .rd-title {
	overflow: hidden;
	margin-bottom: 8px;
}

.room-details-item .rd-text .rd-title h3 {
	color: #19191a;
	float: left;
}

.room-details-item .rd-text .rd-title .rdt-right {
	float: right;
	text-align: right;
}

.room-details-item .rd-text .rd-title .rdt-right .rating {
	display: inline-block;
	margin-right: 25px;
	margin-bottom: 10px;
}

.room-details-item .rd-text .rd-title .rdt-right .rating i {
	color: #f5b917;
}

.room-details-item .rd-text .rd-title .rdt-right a {
	display: inline-block;
	color: #ffffff;
	font-size: 13px;
	text-transform: uppercase;
	font-weight: 700;
	background: #24b6e5;
	padding: 14px 28px 13px;
}

.room-details-item .rd-text h2 {
	color: #24b6e5;
	font-weight: 700;
	margin-bottom: 25px;
}

.room-details-item .rd-text h2 span {
	font-family: "Cabin", sans-serif;
	font-size: 16px;
	font-weight: 400;
	color: #19191a;
}

.room-details-item .rd-text table {
	margin-bottom: 32px;
}

.room-details-item .rd-text table tbody tr td {
	font-size: 16px;
	color: #19191a;
	line-height: 36px;
}

.room-details-item .rd-text table tbody tr td.r-o {
	width: 120px;
	color: #707079;
}

.room-details-item .rd-text p {
	color: #707079;
}

.room-details-item .rd-text p.f-para {
	margin-bottom: 22px;
}

.rd-reviews {
	padding-top: 55px;
	border-top: 1px solid #e5e5e5;
	margin-bottom: 50px;
}

.rd-reviews h4 {
	color: #19191a;
	letter-spacing: 1px;
	margin-bottom: 45px;
}

.rd-reviews .review-item {
	margin-bottom: 32px;
}

.rd-reviews .review-item .ri-pic {
	float: left;
	margin-right: 30px;
}

.rd-reviews .review-item .ri-pic img {
	height: 70px;
	width: 70px;
	border-radius: 50%;
}

.rd-reviews .review-item .ri-text {
	overflow: hidden;
	position: relative;
	padding-left: 30px;
}

.rd-reviews .review-item .ri-text:before {
	position: absolute;
	left: 0;
	top: 0;
	width: 1px;
	height: 100%;
	background: #e9e9e9;
	content: "";
}

.rd-reviews .review-item .ri-text span {
	font-size: 12px;
	color: #24b6e5;
	text-transform: uppercase;
	letter-spacing: 3px;
}

.rd-reviews .review-item .ri-text .rating {
	position: absolute;
	right: 0;
	top: 0;
}

.rd-reviews .review-item .ri-text .rating i {
	color: #f5b917;
}

.rd-reviews .review-item .ri-text h5 {
	color: #19191a;
	margin-top: 4px;
	margin-bottom: 8px;
}

.rd-reviews .review-item .ri-text p {
	color: #707079;
	margin-bottom: 0;
}

.review-add h4 {
	color: #19191a;
	letter-spacing: 1px;
	margin-bottom: 45px;
}

.review-add .ra-form input {
	width: 100%;
	height: 50px;
	border: 1px solid #e5e5e5;
	font-size: 16px;
	color: #aaaab3;
	padding-left: 20px;
	margin-bottom: 25px;
}

.review-add .ra-form input::-webkit-input-placeholder {
	color: #aaaab3;
}

.review-add .ra-form input::-moz-placeholder {
	color: #aaaab3;
}

.review-add .ra-form input:-ms-input-placeholder {
	color: #aaaab3;
}

.review-add .ra-form input::-ms-input-placeholder {
	color: #aaaab3;
}

.review-add .ra-form input::placeholder {
	color: #aaaab3;
}

.review-add .ra-form h5 {
	font-size: 20px;
	color: #19191a;
	margin-bottom: 24px;
	float: left;
	margin-right: 10px;
}

.review-add .ra-form .rating {
	padding-top: 3px;
	display: inline-block;
}

.review-add .ra-form .rating i {
	color: #f5b917;
	font-size: 16px;
}

.review-add .ra-form textarea {
	width: 100%;
	height: 132px;
	border: 1px solid #e5e5e5;
	font-size: 16px;
	color: #aaaab3;
	padding-left: 20px;
	padding-top: 12px;
	margin-bottom: 24px;
	resize: none;
}

.review-add .ra-form textarea::-webkit-input-placeholder {
	color: #aaaab3;
}

.review-add .ra-form textarea::-moz-placeholder {
	color: #aaaab3;
}

.review-add .ra-form textarea:-ms-input-placeholder {
	color: #aaaab3;
}

.review-add .ra-form textarea::-ms-input-placeholder {
	color: #aaaab3;
}

.review-add .ra-form textarea::placeholder {
	color: #aaaab3;
}

.review-add .ra-form button {
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	color: #ffffff;
	letter-spacing: 2px;
	background: #24b6e5;
	border: none;
	padding: 14px 34px 13px;
	display: inline-block;
}

.room-booking {
	padding: 0 30px 0 40px;
}

.room-booking h3 {
	color: #19191a;
	margin-bottom: 30px;
}

.room-booking form .check-date {
	position: relative;
	margin-bottom: 15px;
}

.room-booking form .check-date label {
	font-size: 14px;
	color: #707079;
	display: block;
	margin-bottom: 10px;
}

.room-booking form .check-date input {
	width: 100%;
	height: 50px;
	border: 1px solid #ebebeb;
	border-radius: 2px;
	font-size: 16px;
	color: #19191a;
	text-transform: uppercase;
	font-weight: 500;
	padding-left: 20px;
}

.room-booking form .check-date i {
	color: #24b6e5;
	position: absolute;
	right: 18px;
	bottom: 17px;
}

.room-booking form .select-option {
	margin-bottom: 15px;
}

.room-booking form .select-option label {
	font-size: 14px;
	color: #707079;
	display: block;
	margin-bottom: 10px;
}

.room-booking form .select-option .nice-select {
	border-radius: 2px;
	border: 1px solid #ebebeb;
	height: 50px;
	line-height: 50px;
	outline: none;
	padding-left: 20px;
	width: 100%;
	float: none;
}

.room-booking form .select-option .nice-select:after {
	border-bottom: 2px solid #24b6e5;
	border-right: 2px solid #24b6e5;
	height: 10px;
	margin-top: 0;
	right: 20px;
	width: 10px;
	top: 36%;
}

.room-booking form .select-option .nice-select span {
	font-size: 16px;
	color: #19191a;
	text-transform: uppercase;
	font-weight: 500;
}

.room-booking form .select-option .nice-select .list {
	margin-top: 0;
	width: 100%;
}

.room-booking form button {
	display: block;
	font-size: 14px;
	text-transform: uppercase;
	border: 1px solid #24b6e5;
	border-radius: 2px;
	color: #24b6e5;
	font-weight: 500;
	background: transparent;
	width: 100%;
	height: 46px;
	margin-top: 30px;
}

/*---------------------
  Blog Section
-----------------------*/

.blog-section.blog-page {
	padding-top: 0;
	padding-bottom: 88px;
}

.blog-item {
	height: 450px;
	position: relative;
	margin-bottom: 30px;
	border-radius: 5px;
}

.blog-item.small-size {
	height: 400px;
}

.blog-item .bi-text {
	position: absolute;
	left: 0;
	bottom: 25px;
	width: 100%;
	padding-left: 30px;
	padding-right: 30px;
}

.blog-item .bi-text .b-tag {
	display: inline-block;
	color: #ffffff;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 1px;
	background: #24b6e5;
	padding: 3px 10px;
	border-radius: 2px;
}

.blog-item .bi-text h4 {
	margin-top: 18px;
	margin-bottom: 18px;
}

.blog-item .bi-text h4 a {
	color: #ffffff;
}

.blog-item .bi-text .b-time {
	font-size: 12px;
	color: #ffffff;
	text-transform: uppercase;
	letter-spacing: 3px;
}

.load-more {
	text-align: center;
	padding-top: 30px;
}

.load-more .primary-btn {
	color: #19191a;
}

/*----------------------------
  Blog Details Hero Section
----------------------------*/

.blog-details-hero {
	height: 530px;
	padding-top: 165px;
}

.bd-hero-text {
	text-align: center;
}

.bd-hero-text span {
	font-size: 12px;
	color: #ffffff;
	background: #24b6e5;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 1px;
	display: inline-block;
	padding: 4px 16px;
	border-radius: 2px;
}

.bd-hero-text h2 {
	font-size: 44px;
	color: #ffffff;
	line-height: 54px;
	margin-top: 30px;
	margin-bottom: 12px;
}

.bd-hero-text ul li {
	list-style: none;
	font-size: 14px;
	color: #24b6e5;
	margin-right: 35px;
	display: inline-block;
}

.bd-hero-text ul li:last-child {
	margin-right: 0;
}

.bd-hero-text ul li.b-time {
	text-transform: uppercase;
}

/*---------------------
  Blog Details Section
-----------------------*/

.blog-details-section {
	padding-top: 55px;
}

.blog-details-text .bd-title {
	margin-bottom: 52px;
}

.blog-details-text .bd-title p {
	font-size: 18px;
	color: #707079;
	line-height: 30px;
}

.blog-details-text .bd-pic {
	overflow: hidden;
	margin-bottom: 35px;
}

.blog-details-text .bd-pic .bp-item {
	width: calc(33.33% - 10px);
	float: left;
	margin-right: 15px;
}

.blog-details-text .bd-pic .bp-item:last-child {
	margin-right: 0;
}

.blog-details-text .bd-pic .bp-item img {
	min-width: 100%;
}

.blog-details-text .bd-more-text {
	margin-bottom: 50px;
}

.blog-details-text .bd-more-text .bm-item {
	margin-bottom: 30px;
}

.blog-details-text .bd-more-text .bm-item h4 {
	color: #19191a;
	margin-bottom: 20px;
}

.blog-details-text .bd-more-text .bm-item p {
	font-size: 18px;
	color: #707079;
	line-height: 30px;
}

.blog-details-text .tag-share {
	overflow: hidden;
	border-top: 1px solid #ebebeb;
	padding-top: 30px;
	margin-bottom: 75px;
}

.blog-details-text .tag-share .tags {
	float: left;
}

.blog-details-text .tag-share .tags a {
	font-size: 12px;
	color: #707079;
	background: #ebebeb;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 1px;
	display: inline-block;
	padding: 4px 16px;
	border-radius: 2px;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
	margin-right: 6px;
}

.blog-details-text .tag-share .tags a:hover {
	color: #ffffff;
	background: #24b6e5;
}

.blog-details-text .tag-share .social-share {
	float: right;
}

.blog-details-text .tag-share .social-share span {
	display: inline-block;
	font-size: 18px;
	color: #707079;
}

.blog-details-text .tag-share .social-share a {
	display: inline-block;
	font-size: 16px;
	color: #707079;
	margin-left: 30px;
}

.blog-details-text .comment-option {
	margin-bottom: 75px;
}

.blog-details-text .comment-option h4 {
	color: #19191a;
	margin-bottom: 35px;
}

.blog-details-text .comment-option .single-comment-item {
	margin-bottom: 30px;
}

.blog-details-text .comment-option .single-comment-item.first-comment .sc-text {
	padding-left: 22px;
}

.blog-details-text .comment-option .single-comment-item.first-comment .sc-text:before {
	position: absolute;
	left: 0;
	top: 0;
	width: 1px;
	height: 255px;
	background: #ebebeb;
	content: "";
}

.blog-details-text .comment-option .single-comment-item.reply-comment {
	padding-left: 120px;
	margin-bottom: 52px;
}

.blog-details-text .comment-option .single-comment-item.second-comment .sc-text {
	padding-left: 22px;
}

.blog-details-text .comment-option .single-comment-item.second-comment .sc-text:before {
	position: absolute;
	left: 0;
	top: 0;
	width: 1px;
	height: 100px;
	background: #ebebeb;
	content: "";
}

.blog-details-text .comment-option .single-comment-item .sc-author {
	float: left;
	margin-right: 28px;
}

.blog-details-text .comment-option .single-comment-item .sc-author img {
	height: 70px;
	width: 70px;
	border-radius: 50%;
}

.blog-details-text .comment-option .single-comment-item .sc-text {
	display: table;
	position: relative;
}

.blog-details-text .comment-option .single-comment-item .sc-text span {
	font-size: 12px;
	color: #24b6e5;
	text-transform: uppercase;
	letter-spacing: 2px;
}

.blog-details-text .comment-option .single-comment-item .sc-text h5 {
	font-size: 20px;
	color: #19191a;
	margin-top: 4px;
	margin-bottom: 8px;
}

.blog-details-text .comment-option .single-comment-item .sc-text p {
	color: #707079;
	margin-bottom: 18px;
}

.blog-details-text .comment-option .single-comment-item .sc-text a {
	display: inline-block;
	color: #19191a;
	font-size: 14px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 1px;
	padding: 5px 24px;
	border: 1px solid #F9EEE3;
	border-radius: 50px;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
	margin-right: 10px;
}

.blog-details-text .comment-option .single-comment-item .sc-text a:hover {
	background: #24b6e5;
	color: #ffffff;
	border-color: #24b6e5;
}

.blog-details-text .leave-comment h4 {
	color: #19191a;
	margin-bottom: 35px;
}

.blog-details-text .leave-comment .comment-form input {
	width: 100%;
	height: 50px;
	color: #707079;
	font-size: 16px;
	padding-left: 20px;
	border: 1px solid #e5e5e5;
	border-radius: 2px;
	margin-bottom: 20px;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}

.blog-details-text .leave-comment .comment-form input:focus {
	border-color: #24b6e5;
}

.blog-details-text .leave-comment .comment-form textarea {
	width: 100%;
	height: 116px;
	color: #707079;
	font-size: 16px;
	padding-left: 20px;
	border: 1px solid #e5e5e5;
	border-radius: 2px;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
	margin-bottom: 42px;
	resize: none;
	padding-top: 12px;
}

.blog-details-text .leave-comment .comment-form textarea:focus {
	border-color: #24b6e5;
}

.blog-details-text .leave-comment .comment-form button {
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	color: #ffffff;
	letter-spacing: 2px;
	background: #24b6e5;
	border: none;
	padding: 14px 42px 13px;
	display: inline-block;
	border-radius: 2px;
}

/*---------------------
  Recommend Blog
-----------------------*/

.recommend-blog-section {
	padding-top: 65px;
	padding-bottom: 50px;
}

.recommend-blog-section .section-title {
	margin-bottom: 37px;
}

.recommend-blog-section .section-title h2 {
	margin-top: 0;
}

/*---------------------
  Contact Section
-----------------------*/

.contact-section {
	padding-top: 80px;
	padding-bottom: 80px;
}

.contact-text h2 {
	font-size: 44px;
	color: #19191a;
	margin-bottom: 24px;
}

.contact-text p {
	color: #707079;
}

.contact-text table tbody tr td {
	font-size: 16px;
	color: #19191a;
	line-height: 36px;
	font-weight: 500;
}

.contact-text table tbody tr td.c-o {
	color: #707079;
	width: 75px;
}

.contact-form input {
	width: 100%;
	height: 50px;
	border: 1px solid #e1e1e1;
	border-radius: 10px;
	font-size: 16px;
	color: #000;
	padding-left: 25px;
	margin-bottom: 28px;
}

.contact-form input::-webkit-input-placeholder {
	color: #aaaab3;
}

.contact-form input::-moz-placeholder {
	color: #aaaab3;
}

.contact-form input:-ms-input-placeholder {
	color: #aaaab3;
}

.contact-form input::-ms-input-placeholder {
	color: #aaaab3;
}

.contact-form input::placeholder {
	color: #aaaab3;
}

.contact-form textarea {
	width: 100%;
	height: 150px;
	border: 1px solid #e1e1e1;
	font-size: 16px;
	color: #aaaab3;
	padding-left: 25px;
	padding-top: 12px;
	margin-bottom: 33px;
	resize: none;
}

.contact-form textarea::-webkit-input-placeholder {
	color: #aaaab3;
}

.contact-form textarea::-moz-placeholder {
	color: #aaaab3;
}

.contact-form textarea:-ms-input-placeholder {
	color: #aaaab3;
}

.contact-form textarea::-ms-input-placeholder {
	color: #aaaab3;
}

.contact-form textarea::placeholder {
	color: #aaaab3;
}

.contactBtn {
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	color: #ffffff;
	letter-spacing: 2px;
	background: #24b6e5;
	border: none;
	padding: 14px 34px 13px;
	display: inline-block;
}

.contactBtn:hover {
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	color: #ffffff;
	letter-spacing: 2px;
	background: #1798c2;
	border: none;
	padding: 14px 34px 13px;
	display: inline-block;
}

.map {
	height: 470px;
	-webkit-box-shadow: 0px 14px 35px rgba(0, 0, 0, 0.15);
	box-shadow: 0px 14px 35px rgba(0, 0, 0, 0.15);
	margin-top: 75px;
}

.map iframe {
	width: 100%;
}

/*-------------------------------- Respinsive Media Styles --------------------------------*/

@media only screen and (min-width: 1554px) and (max-width: 1920px) {
	.hp-room-items .hp-room-item .hr-text {
		bottom: -200px;
	}
}

@media only screen and (min-width: 1200px) and (max-width: 1250px) {
	.hp-room-items .hp-room-item .hr-text {
		bottom: -288px;
	}
}

@media only screen and (min-width: 1200px) {
	.container {
		max-width: 1170px;
	}
}

/* Medium Device: 1200px */

@media only screen and (min-width: 992px) and (max-width: 1199px) {
	.testimonial-slider.owl-carousel .owl-nav button {
		left: -150px;
	}

	.testimonial-slider.owl-carousel .owl-nav button.owl-next {
		right: -150px;
	}

	.hp-room-items .hp-room-item .hr-text {
		bottom: -322px;
	}

	.hp-room-items .hp-room-item:hover .hr-text {
		bottom: 80px;
	}
}

@media only screen and (max-width: 991px) {
	.top-nav {
		display: none;
	}

	.menu-item .nav-menu {
		display: none;
	}

	.offcanvas-menu-overlay {
		position: fixed;
		left: 0;
		top: 0;
		background: rgba(0, 0, 0, 0.7);
		z-index: 98;
		height: 100%;
		width: 100%;
		visibility: hidden;
		-webkit-transition: 0.3s;
		-o-transition: 0.3s;
		transition: 0.3s;
	}

	.offcanvas-menu-overlay.active {
		visibility: visible;
	}

	.canvas-open {
		position: absolute;
		right: 105px;
		top: 30px;
		font-size: 22px;
		width: 30px;
		height: 30px;
		color: #19191a;
		border: 1px solid #19191a;
		border-radius: 2px;
		line-height: 33px;
		text-align: center;
		z-index: 100;
		display: block;
		cursor: pointer;
	}

	.offcanvas-menu-wrapper {
		position: fixed;
		left: -300px;
		top: 0;
		width: 300px;
		z-index: 999;
		background: #ffffff;
		text-align: center;
		overflow-y: auto;
		height: 100%;
		opacity: 0;
		visibility: hidden;
		-webkit-transition: all 0.5s;
		-o-transition: all 0.5s;
		transition: all 0.5s;
		padding: 80px 30px 30px 30px;
		display: block;
	}

	.offcanvas-menu-wrapper .canvas-close {
		height: 30px;
		width: 30px;
		border: 1px solid #19191a;
		border-radius: 50%;
		text-align: center;
		line-height: 30px;
		cursor: pointer;
		position: absolute;
		right: 30px;
		top: 30px;
		padding-right: 1px;
	}

	.offcanvas-menu-wrapper .search-icon {
		color: #19191a;
		text-align: center;
		cursor: pointer;
		margin-bottom: 10px;
	}

	.offcanvas-menu-wrapper .header-configure-area {
		margin-bottom: 30px;
	}

	.offcanvas-menu-wrapper .header-configure-area .language-option {
		display: inline-block;
		cursor: pointer;
		padding: 13px 0;
		position: relative;
		margin-bottom: 10px;
	}

	.offcanvas-menu-wrapper .header-configure-area .language-option:hover .flag-dropdown {
		top: 40px;
		opacity: 1;
		visibility: visible;
	}

	.offcanvas-menu-wrapper .header-configure-area .language-option img {
		height: 26px;
		width: 26px;
		border-radius: 50%;
		margin-right: 10px;
	}

	.offcanvas-menu-wrapper .header-configure-area .language-option span {
		font-size: 16px;
		color: #19191a;
		text-transform: uppercase;
		font-weight: 500;
	}

	.offcanvas-menu-wrapper .header-configure-area .language-option .flag-dropdown {
		position: absolute;
		left: 0;
		top: 60px;
		width: 100px;
		background: #ffffff;
		display: block;
		padding: 10px 15px;
		-webkit-box-shadow: 0px 9px 10px rgba(25, 25, 26, 0.2);
		box-shadow: 0px 9px 10px rgba(25, 25, 26, 0.2);
		opacity: 0;
		visibility: hidden;
		-webkit-transition: all 0.3s;
		-o-transition: all 0.3s;
		transition: all 0.3s;
		z-index: 99;
	}

	.offcanvas-menu-wrapper .header-configure-area .language-option .flag-dropdown ul li {
		list-style: none;
		text-align: left;
	}

	.offcanvas-menu-wrapper .header-configure-area .language-option .flag-dropdown ul li a {
		font-size: 14px;
		text-transform: uppercase;
		font-weight: 500;
		color: #19191a;
		-webkit-transition: all 0.3s;
		-o-transition: all 0.3s;
		transition: all 0.3s;
	}

	.offcanvas-menu-wrapper .header-configure-area .language-option .flag-dropdown ul li a:hover {
		color: #24b6e5;
	}

	.offcanvas-menu-wrapper .header-configure-area .bk-btn {
		display: inline-block;
		font-size: 13px;
		font-weight: 700;
		padding: 16px 28px 15px;
		background: #24b6e5;
		color: #ffffff;
		text-transform: uppercase;
		letter-spacing: 2px;
	}

	.offcanvas-menu-wrapper .mainmenu {
		display: none;
	}

	.offcanvas-menu-wrapper .slicknav_menu {
		background: transparent;
		padding: 0;
	}

	.offcanvas-menu-wrapper .slicknav_menu .slicknav_btn {
		float: none;
		margin: 0 0 10px 0;
		display: none;
	}

	.offcanvas-menu-wrapper .slicknav_menu .slicknav_nav {
		display: block !important;
	}

	.offcanvas-menu-wrapper .slicknav_menu .slicknav_nav ul {
		margin: 0;
		text-align: left;
	}

	.offcanvas-menu-wrapper .slicknav_menu .slicknav_nav ul li .dropdown {
		padding-left: 20px;
	}

	.offcanvas-menu-wrapper .slicknav_menu .slicknav_nav ul li a {
		margin: 0;
		padding: 10px;
		font-weight: 600;
		font-size: 14px;
		color: #19191a;
		border-bottom: 1px solid #e5e5e5;
		-webkit-transition: all 0.3s;
		-o-transition: all 0.3s;
		transition: all 0.3s;
	}

	.offcanvas-menu-wrapper .slicknav_menu .slicknav_nav ul li a:hover {
		border-radius: 0;
		background: transparent;
		color: #24b6e5;
	}

	.offcanvas-menu-wrapper .slicknav_menu .slicknav_nav .slicknav_row a {
		border-bottom: 0;
		padding-left: 0;
		-webkit-transition: all 0.3s;
		-o-transition: all 0.3s;
		transition: all 0.3s;
	}

	.offcanvas-menu-wrapper .slicknav_menu .slicknav_nav .slicknav_row span {
		color: #19191a;
		-webkit-transition: all 0.3s;
		-o-transition: all 0.3s;
		transition: all 0.3s;
	}

	.offcanvas-menu-wrapper .slicknav_menu .slicknav_nav .slicknav_row:hover a {
		color: #24b6e5;
	}

	.offcanvas-menu-wrapper .slicknav_menu .slicknav_nav .slicknav_row:hover span {
		color: #24b6e5;
	}

	.offcanvas-menu-wrapper .top-social {
		display: inline-block;
		margin-top: 30px;
		margin-bottom: 20px;
	}

	.offcanvas-menu-wrapper .top-social a {
		display: inline-block;
		font-size: 16px;
		color: #19191a;
		margin-right: 20px;
	}

	.offcanvas-menu-wrapper .top-social a:last-child {
		margin-right: 0;
	}

	.offcanvas-menu-wrapper .top-widget li {
		list-style: none;
		font-size: 16px;
		color: #19191a;
		font-weight: 500;
		line-height: 28px;
	}

	.offcanvas-menu-wrapper .top-widget li i {
		color: #dfa974;
		margin-right: 4px;
	}

	.offcanvas-menu-wrapper.show-offcanvas-menu-wrapper {
		left: 0;
		opacity: 1;
		visibility: visible;
	}

	.about-text {
		margin-bottom: 30px;
	}

	.footer-section .copyright-option ul {
		text-align: center;
		margin-bottom: 10px;
	}

	.footer-section .copyright-option .co-text {
		text-align: center;
	}

	.about-pic img {
		margin-bottom: 20px;
	}

	.room-booking {
		padding: 0;
		margin-top: 40px;
	}

	.contact-form {
		padding-top: 30px;
	}

	.hero-text {
		margin-bottom: 40px;
	}
}


/* Tablet Device: 768px */

@media only screen and (min-width: 768px) and (max-width: 991px) {
	.testimonial-slider.owl-carousel .owl-nav button {
		left: -30px;
	}

	.testimonial-slider.owl-carousel .owl-nav button.owl-next {
		right: -30px;
	}

	.hp-room-items {
		margin: 0;
	}

	.hp-room-item {
		margin-bottom: 15px;
	}
}

/* Large Mobile: 480px */

@media only screen and (max-width: 767px) {
	.testimonial-slider.owl-carousel .owl-nav {
		display: none;
	}

	.room-details-item .rd-text .rd-title {
		margin-bottom: 25px;
	}

	.room-details-item .rd-text .rd-title h3 {
		float: none;
		margin-bottom: 30px;
	}

	.room-details-item .rd-text .rd-title .rdt-right {
		float: none;
		text-align: left;
	}

	.footer-section .copyright-option ul li {
		margin-right: 25px;
	}

	.blog-details-text .tag-share .tags {
		float: none;
		margin-bottom: 20px;
	}

	.blog-details-text .tag-share .social-share {
		float: none;
	}

	.about-text .section-title h2 {
		font-size: 30px;
		line-height: 40px;
	}

	.hp-room-items {
		margin: 0 -5px;
	}

	.hp-room-item {
		margin-bottom: 10px;
	}
}

/* Small Mobile: 320px */

@media only screen and (max-width: 479px) {
	.footer-section .copyright-option ul li {
		margin-bottom: 5px;
	}

	.video-section {
		padding-top: 80px;
	}

	.rd-reviews .review-item .ri-pic,
	.blog-details-text .comment-option .single-comment-item .sc-author {
		float: none;
		margin-bottom: 30px;
	}

	.rd-reviews .review-item .ri-text .rating {
		position: relative;
	}

	.rd-reviews .review-item .ri-text,
	.blog-details-text .comment-option .single-comment-item.second-comment .sc-text,
	.blog-details-text .comment-option .single-comment-item.first-comment .sc-text {
		padding-left: 0;
	}

	.blog-details-text .comment-option .single-comment-item.reply-comment {
		padding-left: 30px;
	}

	.rd-reviews .review-item .ri-text:before,
	.blog-details-text .comment-option .single-comment-item.first-comment .sc-text:before,
	.blog-details-text .comment-option .single-comment-item.second-comment .sc-text:before {
		display: none;
	}

	.blog-details-hero {
		padding-top: 70px;
	}

	.blog-details-text .bd-pic .bp-item {
		width: 100%;
		float: none;
		margin-right: 0;
		margin-bottom: 10px;
	}

	.blog-details-text .tag-share .tags a {
		margin-bottom: 6px;
	}

	.blog-details-text .comment-option .single-comment-item .sc-text a {
		margin-bottom: 10px;
	}
}

/* Mobile Hidden CSS  */

@media (max-width: 768px) {

	.hidden-sm,
	.hidden-xs {
		display: none !important;
	}
}


/* Hide for desktop and laptop */
@media screen and (min-width: 1024px) {
	.hidden-lg {
		display: none !important;
	}
}

.no-padding {
	padding: 0px;
}

/* Hotel Details CSS  */

.mySearch {

	height: 40px;
	padding: 10px 16px;
	font-size: 13px;
	line-height: 1.33;
	border-radius: 10px;

}

.btnSearch {

	height: 40px;
	border-radius: 10px;

}

.card-box {

	padding: 24px 10px;
	background: padding-box;
	background: #fff;
	border-radius: 20px;

}

@media (max-width: 768px) {
	.card-box {
		padding: 20px 0px 20px 0px;
		background: padding-box;
		background: #fff;
		border-radius: 10px;
		margin: 0px 10px 0px 10px;
	}
}

.h-100 {
	height: 100% !important;
}

.shadow {
	box-shadow: 0 .25rem 1rem rgba(161, 172, 184, .45) !important;
}


html:not([dir=rtl]) .me-3 {
	margin-right: 1rem !important;
}

html:not([dir=rtl]) .me-2 {
	margin-right: 0.5rem !important;
}

.hotel-card {
	width: 70%;
}

.hotelPowered {
	width: 30%;
}

.card-title>h1 {

	font-size: 30px;
	color: #000;
	letter-spacing: -1px;
	font-weight: 700;

}

@media (max-width: 768px) {
	.card-title>h1 {
		font-size: 18px;
	}
}

.mapText {

	font-size: 15px !important;
	padding-top: 5px;
	color: #666666;

}

@media (max-width: 768px) {
	.mapText {
		font-size: 13px !important;
	}
}

.fa-map-marker {
	color: #9979fd;
}

.small-title>h2 {

	font-size: 30px;
	color: #000000;
	letter-spacing: -1px;
	font-weight: 700;
	margin-top: 0px;

}

.card-p>p {

	font-size: 15px !important;
	font-weight: 400;

}

#readMoreBtn {

	color: #24b6e5;

}

@media (max-width: 768px) {
	.card-p>p {
		font-size: 13px !important;
	}
}

/*slider*/

.slider-container {
	position: relative;
	width: 100%;
	/* Set the container width */
	overflow: hidden;
}

.slider {
	display: flex;
	transition: transform 0.5s ease;
	width: 100%;
}

.slide {
	min-width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
}

.slide img {
	max-width: 100%;
	/* Make images responsive */
	width: 100%;
	height: 500px;
	display: block;
	border-radius: 20px;
}

.slideTrip img {
	max-width: 100%;
	/* Make images responsive */
	width: 100%;
	height: 300px;
	display: block;
	border-radius: 20px;
}

@media (max-width: 768px) {
	.slide img {
		height: 200px;
		width: 100%;
	}

	.slideTrip img {
		height: 200px;
		width: 100%;
	}
}

.icons {
	position: absolute;
	top: 20px;
	right: 20px;
	display: flex;
	gap: 10px;
	z-index: 10;
}

.myHeart {
	background: #fff;
	padding: 10px;
	border-radius: 50px;
	color: #666666;
}

.myHeart:hover {
	color: #ff4a4a;
}

.myDownload {
	background: #fff;
	padding: 10px;
	border-radius: 50px;
	color: #666666;
}

.myDownload:hover {
	background: #fff;
	padding: 10px;
	border-radius: 50px;
	color: #06b6e5;
}

.prev,
.next {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	background-color: #666666;
	border: none;
	color: white;
	font-size: 18px;
	cursor: pointer;
	padding: 8px 16px;
	border-radius: 50px;
}

.prev,
.next:hover {

	background-color: rgba(0, 0, 0, 0.5);

}

.prev {
	left: 10px;
}

.next {
	right: 10px;
}

@media (max-width: 768px) {

	.wishlist,
	.download {
		font-size: 20px;
	}

	.prev,
	.next {
		font-size: 18px;
	}
}

/* Lightbox styling */
.lightbox {
	display: none;
	/* Hidden by default */
	position: fixed;
	z-index: 999;
	align-content: center;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	overflow: auto;
	background-color: rgba(0, 0, 0, 0.9);
}

.lightbox-content {
	margin: auto;
	display: block;
	max-width: 80%;
	max-height: 80%;
}

.close {
	position: absolute;
	top: 20px;
	right: 35px;
	color: #fff;
	font-size: 40px;
	font-weight: bold;
	cursor: pointer;
}

.lightbox-navigation {
	position: absolute;
	top: 50%;
	width: 100%;
	display: flex;
	justify-content: space-between;
	transform: translateY(-50%);
}

.prev-lightbox,
.next-lightbox {
	background-color: rgba(0, 0, 0, 0.5);
	color: #fff;
	border: none;
	cursor: pointer;
	padding: 10px;
	font-size: 18px;
}

@media screen and (max-width: 768px) {
	.lightbox-content {
		max-width: 90%;
		max-height: 70%;
	}
}

/* Lightbox background */
.lightboxVideo-container {
	display: none;
	position: fixed;
	z-index: 1000;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.8);
	justify-content: center;
	align-items: center;
	padding: 10px;
	box-sizing: border-box;
}

/* Lightbox Content */
.lightboxVideo-content {
	position: relative;
	width: 80%;
	/* Make the content responsive to screen size */
	max-width: 900px;
	background: #000;
	padding: 10px;
	box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.3);
	border-radius: 10px;
	box-sizing: border-box;
}

@media screen and (max-width: 768px) {
	.lightboxVideo-content {
		width: 95%;
		/* Adjust for smaller screens */
	}
}

.video-responsive {
	position: relative;
	padding-bottom: 56.25%;
	/* Maintain aspect ratio (16:9) */
	height: 0;
	overflow: hidden;
}

.video-responsive iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/* Close Button */
.lightboxVideo-close {
	position: absolute;
	top: 10px;
	right: 20px;
	font-size: 30px;
	font-weight: bold;
	color: #ffffff;
	cursor: pointer;
	z-index: 10;
}

/* Thumbnail styles */
.lightboxVideo-thumbnail {
	width: 100%;
	position: relative;
	display: inline-block;
	cursor: pointer;
}

.lightboxVideo-thumbnail img {
	cursor: pointer;
	width: 100%;
	height: 300px;
	/* Adjust height to maintain aspect ratio */
	border-radius: 20px;
	object-fit: cover;
	/* Ensure image covers the entire space without distortion */
}

@media screen and (max-width: 768px) {
	.lightboxVideo-thumbnail img {
		height: 150px;
		/* Adjust thumbnail height dynamically */
	}
}

/* Play Icon */
.lightboxVideo-play-icon {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	font-size: 24px;
	color: #ffffff;
	background-color: #24b6e5;
	border-radius: 50%;
	padding: 12px 15px;
	pointer-events: none;
}

/* Share popup styling */
.share-popup {
	display: none;
	/* Ensure the popup is hidden by default */
	position: fixed;
	z-index: 20;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.5);
	justify-content: center;
	align-items: center;
}

.share-content {
	background-color: #fff;
	padding: 20px;
	border-radius: 8px;
	width: 500px;
	max-width: 100%;
	text-align: center;
	position: relative;
}

.share-content h3 {
	margin-bottom: 15px;
}

.share-list {
	list-style-type: none;
	padding: 0;
	display: flex;
	gap: 20px;
	justify-content: center;
}

.share-list li {
	margin: 10px 0;
}

.share-list a {
	text-decoration: none;
	color: #24b6e5;
	font-size: 18px;
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 8px;
	border: 1px solid #ddd;
	border-radius: 4px;
	transition: background-color 0.3s;
}

.share-list a:hover {
	background-color: #24b5e513;
}

.close-share {
	position: absolute;
	top: 8px;
	right: 10px;
	cursor: pointer;
	font-size: 20px;
	color: #fff;
	background: #666666;
	padding: 0px 10px;
	border-radius: 50px;
	line-height: 30px;
}

@media screen and (max-width: 480px) {
	.share-content {
		width: 90%;
	}

	.share-list a {
		font-size: 14px;
		padding: 10px;
	}
}

/* Modal content */
.modal-content {
	background-color: #fefefe;
	margin: 10% auto;
	padding: 0;
	border-radius: 10px;
	width: 80%;
	/* Responsive width */
	max-width: 600px;
	/* Limit the maximum width */
	box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
	animation: fadeIn 0.3s ease;
	/* Animation for smooth appearance */
	font-size: 13px;
}

/* Modal header */
.modal-header {
	background-color: #ffffff;
	color: white;
	padding: 10px 20px;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	border-bottom: 1px solid #e1e1e1;
	color: #192027;
}

.modal-header h2 {
	margin: 0;
	font-size: 1.5em;
}

/* Modal body */
.modal-body {
	padding: 20px;
	font-size: 1em;
	color: #333;
}

/* Close button (X) */
.closeBtn {
	color: #192027;
	font-size: 28px;
	font-weight: bold;
	cursor: pointer;
}

.closeBtn:hover,
.closeBtn:focus {
	color: #000;
	text-decoration: none;
	cursor: pointer;
}

/* Animation */
@keyframes fadeIn {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

/* Responsive adjustments */
@media (max-width: 600px) {
	.modal-content {
		width: 95%;
		/* Make the modal content narrower on smaller screens */
	}
}

.hrLine {
	height: 1px;
	width: 100%;
	background: #78787830;
}

.price-card {

	border: 1px solid #d8d8d8;
	border-radius: 16px;
	padding: 16px;

}

.price-card a {
	color: #000;
}

.phone-title>h2 {

	font-size: 24px;
	color: #000;
	letter-spacing: -1px;
	font-weight: 700;
	text-align: center;
	margin: 0px 0px 10px 0px;

}

.saleText>p {

	font-size: 12px;
	color: #787878;

}

.saleBtn {
	margin: 10px 0px;
	padding: 3px 9px;
	font-size: 14px;
	color: #3e5062;
	border-radius: 50px;
	background: #3e506214;
	border: 1px solid #3e5062;
}

.saleBtn:hover {
	padding: 3px 9px;
	font-size: 14px;
	color: #3e5062;
	border-radius: 50px;
	background: #3e506214;
	border: 1px solid #3e5062;
}

.price-heading>h2 {

	font-size: 20px;
	color: #000000;
	letter-spacing: -1px;
	font-weight: 600;
	margin: 0px;

}

.price-heading>p {
	font-size: 14px;
	padding: 5px 50px 0px 0px;
	line-height: 20px;
}

.myInfo {
	background: #24b6e5;
	border-radius: 50px;
	padding: 8px 13px;
	font-size: 16px;
	position: absolute;
	right: 30px;
	color: #fff;
}

@media only screen and (max-width: 767px) {
	.myInfo {
		background: #24b6e5;
		border-radius: 50px;
		padding: 8px 13px;
		font-size: 16px;
		position: absolute;
		right: 70px;
		color: #fff;
	}
}

.myPhone {
	background: #d7ea82;
	border-radius: 50px;
	padding: 9px 10px;
	font-size: 15px;
	position: absolute;
	right: 30px;
	color: #666666;
}

.makeRelative {
	position: relative;
}

.price {
	font-size: 35px;
	color: #000000;
	letter-spacing: -1px;
	font-weight: 700;
}

.priceDark {
	font-size: 35px;
	color: #ff0000;
	letter-spacing: -1px;
	font-weight: 700;
}

.tax {
	font-size: 14px;
}

.taxDark {
	font-size: 14px;
	color: #000000;
}

.makeFlex {

	display: flex;
	gap: 5px;
	align-items: center;

}

.myBtn {

	border-radius: 10px;
	border: none;
	padding: 10px 15px;
	text-transform: uppercase;
	font-size: 14px;
	width: 100%;
	background: #d7ea82;
	box-shadow: none;
	color: #000;

}

.myBtn:hover {

	background: #24b6e5;

}

/* .callNow {

	border-radius: 10px;
	border: none;
	padding: 10px 50px;
	text-transform: uppercase;
	font-size: 18px;
	font-weight: 900;
	background: #d7ea82;
	box-shadow: none;
	color: #000;

} */

/* .callNow:hover {

	background: #24b6e5;

} */

.transparentBtn {

	background: transparent;
	border: none;
	padding: 10px 15px;
	text-transform: uppercase;
	font-size: 12px;
	width: 100%;
	color: #1b8345;
	box-shadow: none;

}

.transparentBtn:hover {

	background: transparent;
	border: none;
	padding: 10px 15px;
	text-transform: uppercase;
	font-size: 12px;
	width: 100%;
	color: #1b8345;
	box-shadow: none;

}

.phone-card {
	align-items: center;
	display: flex;
	margin-left: 15px;
}

@media only screen and (max-width: 767px) {
	.phone-card {
		margin-left: 5px;
	}
}

.phoneIcon {
	font-size: 40px;
	background: #d7ea82;
	padding: 12px 16px;
	border-radius: 50px;
}


.phone>h6 {
	font-size: 20px;
	color: #00277a;
	font-weight: 700;
	margin: 0px;
}

.phone>h2 {
	font-size: 26px;
	font-weight: 900;
	color: #00277a;
}

@media only screen and (max-width: 767px) {
	.phone>h2 {
		font-size: 28px;
	}
}

.phone>p {
	font-size: 14px;
	margin: 0px;
	color: #000;
}

.mapSec {
	display: grid;
}

.mapBtn {
	background: transparent;
	border: none;
	font-size: 12px;
	color: #000000;
	box-shadow: none;
	border: 1px solid #24b6e5;
	padding: 0px 5px 0px 5px;
}

.mapBtn:hover {
	background: #24b6e5;
	font-size: 12px;
	color: #ffffff;
	box-shadow: none;
	border: 1px solid #24b6e5;
	padding: 0px 5px 0px 5px;
}

.mapSec a {
	background: #24b6e5;
	color: #fff;
	font-size: 12px;
	box-shadow: none;
	padding: 10px;
	border: none;
}

.mapSec a:hover {
	background: #24b6e5;
	color: #fff;
}

.locationText {

	flex: 1;

}

.locationText>h4 {

	font-size: 18px;
	font-weight: 600;
	color: #3e5062;
	margin: 0px;

}

.locationText>p {

	font-size: 14px;
	margin: 0px;
	padding-right: 22px;
	line-height: 20px;

}

.loc-icon {
	flex-shrink: 0;
	height: 56px;
	margin-right: 16px;
	object-fit: cover;
	width: 78px;
}

.loc-card {
	align-items: center;
	display: flex;
}

.poweredBy>p {

	text-align: center;
	text-transform: uppercase;
	font-size: 11px;
	margin-bottom: -3px;

}

.amenities>h4 {

	color: #000;
	font-weight: 700;

}

.htlAmenities {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
}

.featuredAmenities {
	display: grid;
	flex-wrap: wrap;
	gap: 20px
}

ul.featuredAmenities {
	margin: 0px;
	padding: 0px;
}

ul.htlAmenities.horizontal {
	margin: 0px;
	padding: 0px;
}

.htlAmenities__item {
	align-items: center;
	display: flex;
	font-size: 15px;
}

.htlAmenities__item>i {

	color: #9979fd;

}

@media only screen and (max-width: 767px) {
	.amenities {
		display: none;
	}
}

.hotel-desc>p {

	padding-right: 50px;
	text-align: justify;

}

/* General Styling */
.stickyNav {
	background-color: #fff;
	position: fixed;
	top: -100px;
	/* Initially hide the navbar */
	left: 0;
	width: 100%;
	z-index: 1000;
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
	transition: top 0.3s ease;
	/* Smooth transition for showing/hiding */
}

.dtlsSecTabs__list {
	display: flex;
	justify-content: space-around;
	flex-wrap: wrap;
}

.dtlsSecTab__item {
	padding: 10px 20px;
	cursor: pointer;
	text-align: center;
	font-weight: bold;
	color: #333;
	transition: color 0.3s;
}

.dtlsSecTab__item:hover {
	color: #24b6e5;
}

.dtlsSecTab__item.active {
	color: #24b6e5;
	/* Change text color for the active tab */
	border-bottom: 2px solid #24b6e5;
	/* Add a bottom border to indicate active */
	font-weight: bold;
}

/* Responsive Styling */
@media (max-width: 768px) {
	.dtlsSecTabs__list {
		flex-direction: row;
	}

	.dtlsSecTab__item {
		padding: 15px;
		border-bottom: 1px solid #f1f1f1;
	}
}

.ovrlRating__rating {
	align-items: center;
	background-color: #2757ae;
	border-radius: 16px;
	color: #fff;
	display: flex;
	flex-shrink: 0;
	font-size: 22px;
	font-weight: 900;
	height: 56px;
	justify-content: center;
	margin-right: 16px;
	width: 78px;
}

.ovrlRating__title {
	color: #2757ae;
	font-size: 18px;
	font-weight: 900;
	line-height: 20px;
}

.ovrlRating__subTitle {
	display: inline;
	font-size: 13px !important;
	line-height: 17px;
	margin-top: 3px;
}

.lowText {

	color: #666666;
	font-size: 12px;

}

.promo {
	background: #bbade830;
	padding: 10px;
	border: 1px solid #bbade8;
	border-style: dashed;
	border-radius: 12px;
}

.search-box {
	position: relative;
	width: 100%;
	padding: 25px 0px;
}

@media (max-width: 768px) {
	.search-box {
		position: relative;
		width: 100%;
		padding: 10px 0px 10px 0px;
	}
}

.search-box input {
	width: 100%;
	padding: 20px;
	font-size: 14px;
	border: 1px solid #ccc;
	border-radius: 25px;
	outline: none;
}

.search-box .search-icon {
	position: absolute;
	right: 5px;
	top: 50%;
	transform: translateY(-50%);
	font-size: 16px;
	color: #000;
	background: #d7ea82;
	padding: 6px 10px;
	border-radius: 50px;
}

.booking-search-icon {
	position: absolute;
	right: 25px;
	top: 50%;
	transform: translateY(-50%);
	font-size: 16px;
	color: #000;
	background: #d7ea82;
	padding: 10px 10px;
	border-radius: 50px;
	pointer-events: none;
}

.myLogo {

	margin-top: 10px;
	text-align: left;
	width: 100%;

}

.headIcons {
	margin-top: 30px;
}

.myIcons {
	font-size: 24px;
	color: #66666673;
}

.iconList {
	display: flex;
	gap: 20px;
	justify-content: flex-end;
	margin-right: 20px;
}

@media (max-width: 768px) {
	.iconList {
		margin-right: 0px;
		margin-top: 7px;
	}
}

.myNav {

	display: flex !important;
	justify-content: center;

}

.navBtn {
	background: #d7ea82;
	padding: 8px 12px;
	border: none;
	border-radius: 10px;
	color: #666;
	font-size: 16px;
}

.myNav>li>a {

	color: #666666;
	text-transform: uppercase;
	font-size: 14px;

}

.myNav>li>a:hover {

	color: #666666;
	text-transform: uppercase;
	font-size: 14px;

}

/* Location CSS */

#map {
	height: 475px !important;
	width: 100%;
	border-radius: 10px !important;
}

@media (max-width: 768px) {
	#map {
		height: 500px !important;
		min-height: 500px !important;
	}
}


/* Styles for the labels */
.label-container {
	position: absolute;
	background-color: #fcfdf5cf;
	border-radius: 4px;
	padding: 8px;
	font-size: 12px;
	font-weight: bold;
	border: 1px solid #666666;
	text-align: center;
	white-space: nowrap;
}

.label-name {
	background-color: #24b6e5;
	color: white;
	padding: 2px 5px;
	border-radius: 4px;
}

.label-distance {
	background-color: #666666;
	color: white;
	padding: 2px 5px;
	border-radius: 4px;
	margin-top: 5px;
}

/* Add a max-height for the attraction list and enable scrolling */
.attraction-list {
	max-height: 300px;
	overflow-y: auto;
	padding: 10px;
	border: 1px solid #d9ea80;
	background-color: #fcfdf5;
	border-radius: 10px 6px 0px 10px;
}

@media (max-width: 768px) {
	.attraction-list {
		max-height: 200px;
	}
}

/* Custom scrollbar styling */
.attraction-list::-webkit-scrollbar {
	width: 8px;
}

.attraction-list::-webkit-scrollbar-track {
	background: #f1f1f1;
}

.attraction-list::-webkit-scrollbar-thumb {
	background-color: #888;
	border-radius: 10px;
}

.attraction-list::-webkit-scrollbar-thumb:hover {
	background-color: #666666;
}

.attraction-item {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 10px;
	border-bottom: 1px solid #d7ea82;
	cursor: pointer;
}

.attraction-item:hover {
	background-color: #ffffff;
}

.attraction-details {
	display: flex;
	align-items: center;
	font-size: 14px;
}

.attraction-icon {
	margin-right: 10px;
}

.distance-info {
	font-weight: bold;
	color: #38bde7;
	font-size: 13px;
}

.category-buttons {
	margin: 10px 0;
	display: flex;
}

@media (max-width: 768px) {
	.category-buttons {
		display: flex;
	}
}


.category-buttons button {
	padding: 10px;
	margin-right: 5px;
	cursor: pointer;
	background: #d7ea823b;
	color: #000;
	border: 1px solid #d7ea82;
	border-radius: 10px;
	width: 100%;
	font-size: 18px;
	font-weight: 600;
}

@media (max-width: 768px) {
	.category-buttons button {
		font-size: 14px;
	}
}

.category-buttons button:hover {

	background: #d7ea82;
}

.category-buttons button.active {
	background: #d7ea82;
}

.category-buttons button:focus {
	outline: none;
	color: #000;
	background: #d7ea82;
}

.call-deals {
	border: 1px solid #bbade8;
	background-color: #bbade81f;
	border-radius: 16px;
	padding: 16px;
}

.call-dealsDark {
	border: 1px solid #bbade8;
	background-color: #bbade8;
	border-radius: 16px;
	padding: 16px;
}

.calldeals-headingDark {
	background: #fff;
	border-radius: 15px;
	padding: 10px 0px 10px 0px;
}

.calldeals-headingDark>h2 {
	font-weight: 700;
	font-size: 28px;
	color: #25b6e5;
}

.calldeals-heading>h5 {
	font-weight: 700;
	font-size: 22px;
}

.calldeals-heading h2 {
	background: #ffffff;
	color: #8c6eee;
	font-weight: 700;
	font-size: 30px;
	border: 1px solid #bbade8;
	padding: 10px;
	border-radius: 12px;
	box-shadow: 0 .25rem 1rem rgba(161, 172, 184, .45) !important;
}

.calldeals-headingDark>p {
	margin: 0px;
	color: #000000;
}

.calldeals-heading>p {
	margin: 0px;
}

.calldeals-details {
	padding: 20px 5px 0px 5px;
}

.calldeals-detailsDark {
	padding: 20px 5px 0px 5px;
}


.calldeals-details>h3 {
	font-size: 20px;
	font-weight: 600;
}

.calldeals-details ul {
	font-size: 14px;
	padding: 10px 25px 10px 25px;
	color: #000;
}

.calldeals-detailsDark ul {
	font-size: 14px;
	padding: 10px 25px 10px 25px;
	color: #fff;
}

.calldeals-detailsDark>h3 {
	font-size: 20px;
	font-weight: 600;
	color: #fff;
}

.calldeals-detailsDark ul {
	font-size: 14px;
	padding: 10px 25px 10px 25px;
}

.book-direct {
	border: 1px solid #24b6e5;
	background-color: #24b6e512;
	border-radius: 16px;
	padding: 16px;
}

.book-directDark {
	border: 1px solid #24b6e5;
	background-color: #24b6e5;
	border-radius: 16px;
	padding: 16px;
}

.bookdirect-heading h2 {
	background: #ffffff;
	color: #24b6e5;
	font-weight: 700;
	font-size: 30px;
	border: 1px solid #24b6e5;
	padding: 10px;
	border-radius: 12px;
	box-shadow: 0 .25rem 1rem rgba(161, 172, 184, .45) !important;
}

@media only screen and (max-width: 767px) {
	.bookdirect-heading>h2 {
		font-size: 30px;
	}
}


.bookdirect-heading>h5 {
	font-weight: 700;
	font-size: 22px;
}

.bookdirect-headingDark {
	background: #ffffff;
	border: 1px solid #24b6e5;
	margin-top: 10px;
	padding: 10px 0px 10px 0px;
	border-radius: 15px;
	box-shadow: 0 .25rem 1rem rgba(161, 172, 184, .45) !important;
}

.bookdirect-headingDark>h2 {
	color: #8c6eee;
	font-weight: 700;
	font-size: 28px;
}

.online-rate {
	background: #666666;
	margin-top: 20px;
	padding: 10px 20px;
	border-radius: 12px;
	box-shadow: 0 .25rem 1rem rgba(161, 172, 184, .45) !important;
}

.online-rate>h2 {
	color: #fff;
	font-weight: 700;
	font-size: 30px;
}

.online-rate span {
	color: #fff;
	text-decoration-color: #ff0000 !important;
	font-weight: 700;
	font-size: 35px;
	text-decoration: line-through;
}

@media (max-width: 768px) {
	.online-rate>h2 {
		font-size: 18px;
	}
}

.amenities-content {
	max-height: 500px;
	/* Default state */
	overflow: hidden;
	transition: max-height 0.3s ease;
}

@media (max-width: 768px) {
	.amenities-content {
		max-height: 150px;
		/* Adjust the value as needed */
		overflow: hidden;
	}
}

.amenities-content>h5 {
	font-size: 18px;
	margin: 0;
}

.amenities-content-icon>p {
	font-size: 14px;
}

.amenities-content-icon>i {
	color: #9979fd !important;
}

.other-amenities>p {
	margin: 0px;
}

.other-amenities {
	display: grid;
	flex-wrap: wrap;
	gap: 10px
}

ul.other-amenities {
	margin: 0px;
	padding: 0px;
}

ul.other-amenities.horizontal {
	margin: 0px;
	padding: 0px;
}

.other-amenities__item {
	display: flex;
	font-size: 13px;
}

.other-amenities__item>i {

	color: #666666;
	padding-top: 3px;

}

.room-box .property-text {
	border: 1px solid #ebebeb;
	border-top: none;
	padding: 24px 20px 24px 20px;
	border-radius: 0px 0px 10px 10px;
}

.property-text h4 {
	color: #19191a;
	margin: 0px 0px 06px 0px;
	font-size: 16px;
	font-weight: 600;
}

.property-text p {
	color: #666666;
	margin-bottom: 0px;
	font-size: 14px;
}

.property-text h3 {
	color: #24b6e5;
	font-weight: 700;
	margin: 5px 0px 10px 0px;
}

.property-text h3 span {
	font-family: "Cabin", sans-serif;
	font-size: 14px;
	font-weight: 400;
	color: #19191a;
}

.property-text .primary-btn {
	color: #19191a;
}

.ps-1 {

	padding: 0px 15px 10px 15px;

}

.text-dark {

	font-weight: 600;

}

.online-rateprice {
	color: #24b6e5;
	font-size: 35px;
	letter-spacing: -1px;
	font-weight: 700;
}

@media (max-width: 768px) {
	.hiddenAmenities {
		display: none;
	}
}


.mb-icon {
	position: absolute;
	right: 150px;
	top: 35px;
	display: flex;
	gap: 10px;
	z-index: 999;
}

.mb-heart,
.mb-user {
	color: #000;
}

@media (max-width: 768px) {

	#wellnessRecreation,
	#safetySecurity,
	#commonArea,
	#accessibility1,
	#mediaTechnology,
	#foodDrink,
	#businessConference,
	#outDoor1 {
		display: none;
	}
}

/* Styling the checkboxes with the custom class */
.amenities-checkbox {
	width: 18px;
	/* Set the desired width */
	height: 20px;
	/* Set the desired height */
	accent-color: #9979fd;
	/* Set the color of the checkbox */
	border: 2px solid #9979fd;
	/* Set the border color */
	cursor: pointer;
	/* Change cursor to pointer on hover */
	vertical-align: middle;
	/* Align checkbox vertically */
	margin-right: 5px;
	/* Space between checkbox and label */
}

/* Styling the label to align with checkbox and increase font size */
.amenities-checkbox+label {
	font-size: 15px;
	/* Set font size */
	vertical-align: middle;
	/* Align label vertically */
	display: inline-flex;
	/* Use flex to align items */
	align-items: center;
	/* Center items */
}

/* Optional styling to enhance the look */
.amenities-checkbox:hover {
	box-shadow: 0 0 5px #9979fd;
	/* Add a glow effect on hover */
}

.customIcon {
	display: flex;
	font-size: 15px;
}


.report {
	color: #ff0000;
	border: 1px solid #ff0000;
	padding: 1px 5px 1px 5px;
}

.width-50 {
	width: 50%;
}

.width-70 {
	width: 70%;
}

@media (max-width: 768px) {
	.width-50 {
		width: 50%;
	}

	.mbw-100 {
		width: 100%;
	}
}

#more {
	display: none;
}

.pet img {
	position: absolute;
	top: -190px;
	right: 13px;
	width: 100px;
}

@media (max-width: 768px) {
	.pet img {
		position: absolute;
		top: -325px;
		right: 13px;
		width: 70px;
	}
}

@media (max-width: 361px) {
	.pet img {
		position: absolute;
		top: -365px;
		right: 13px;
		width: 70px;
	}
}

/* Hotel Deals Page CSS */

.dealsHeading {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.dealsHeading img {
	height: 45px;
}

.dealsHeading>h1 {
	color: #24b6e5 !important;
}

.dealsCon>p {
	text-align: justify !important;
}

@media (max-width: 576px) {
	.dealsHeading>h1 {
		font-size: 20px !important;
	}

	.dealsCon>h3 {
		font-size: 20px !important;
	}

	.dealsCon>p {
		text-align: justify !important;
		font-size: 14px !important;
	}

	.dealsHeading img {
		height: 30px;
	}
}

#more-text {
	display: none;
}

#dots {
	display: inline;
}

.custom-btn {
	border-radius: 10px;
	border: none;
	font-size: 16px;
	font-weight: 900;
	background: transparent;
	box-shadow: none;
	color: #24b6e5;
	text-align: left;
}

.custom-btn:hover {
	color: #000000;
}

.background-image-section {
	position: relative;
	background-image: url('../img/sunset.webp');
	/* Replace with the actual image URL */
	background-size: cover;
	background-color: no-repeat;
	background-position: center;
	height: auto;
	/* Adjust height as needed */
}

.background-image-section::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.6);
	/* Black overlay with 60% opacity */
	z-index: 1;
}

.background-image-section .row {
	position: relative;
	z-index: 2;
	/* Ensures the content is above the overlay */
}

.booking-form-bg {
	position: relative;
	/* Make sure the element is positioned relative to contain the overlay */
	background-image: url('../img/sunset.jpg');
	/* Change to your image path */
	background-size: cover;
	background-position: center;
	padding: 20px;
	border-radius: 20px;
	color: white;
	z-index: 1;
	/* Ensure content is above the overlay */
}

.booking-form-bg::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	border-radius: 20px;
	background: rgb(0 0 0 / 70%);
	;
	/* This is the overlay color. Adjust the opacity (0.5) for transparency */
	z-index: -1;
	/* Ensure the overlay stays behind the content */
}

#js-map-container {
	height: 20em;
}

.selectBox {
	padding: 30px 0px 30px 0px;
}

@media (max-width: 576px) {
	.selectBox {
		padding: 10px 0px 10px 0px;
	}
}

.booking-form>h2 {
	color: #fff !important;
	text-align: center;
	font-size: 50px;
}

.text-darkColor {
	font-weight: bold !important;
	color: #bbade8 !important;
}

.last-minute {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 0px 0px 0px 50px;
}

.lastHead {
	width: 70%;
}

.jaksonville {
	width: 30%;
}

.jaksonville img {
	height: 165px;
}

@media (max-width: 576px) {
	.jaksonville img {
		height: 80px;
	}
}

.filterBtn {
	background-color: #d8eb82;
	color: #000;
	border: none;
}

.filterBtn:hover {
	background-color: #24b6e5;
	color: #fff;
	border: none;
}

#cityMap {
	height: 16.6em;
	border-radius: 20px;
	margin-top: 20px;
	width: 100%;
}

.hotel-box {
	padding: 10px 0px;
	border-radius: 10px;
	border: 1px solid #9979fd59;
	align-items: center;
	border-top: 10px solid #bbade8;
}

.hotel-box {
	display: none;
}

.hotel-box:nth-child(-n+5) {
	display: flex;
	/* Show first 5 items */
}

#load-more-btn {
	padding: 10px 20px;
	font-size: 16px;
	font-weight: bold;
	background-color: #d7ea82;
	color: #000;
	border: none;
	border-radius: 5px;
	cursor: pointer;
}

#load-more-btn:hover {
	background-color: #24b6e5;
	color: #fff;
}

.hotelImg img {
	height: 120px;
	width: 300px;
	border-radius: 10px;
}

/* .hotel-boxText {
	padding: 0px 40px 0px 40px;
} */

.hotel-boxText h4 {
	font-size: 28px;
	margin-bottom: 8px;
	color: #9979fd;
}

.hotel-boxText p {
	font-size: 16px;
	color: #000;
	margin: 0px;
}

.hoteltitlewrap {
	word-wrap: break-word;
}

.hotelIcon {
	color: #000;
	font-size: 16px;
}

.feat-banner {
	position: absolute;
	height: 55px;
	width: 55px;
	top: -1px;
    left: -1px;
	background: url(../img/featured-banner-sm.png);
	margin: 0;
	padding: 0;
	z-index: 200;
}

.hotelImg p {
	text-align: center;
	color: #000;
	margin: 10px 0px 0px 0px;
}

.hotel-boxBtn {
	width: 25%;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.hotel-boxBtn a {
	width: 100%;
	border-radius: 10px;
	border: none;
	padding: 10px;
	text-transform: uppercase;
	font-size: 16px;
	font-weight: 900;
	background: #d7ea82;
	box-shadow: none;
	color: #000;
}

.hotel-boxBtn a:hover {
	background: #24b6e5;
	color: #fff;
}

.hotel-boxBtn p {
	text-align: center;
	font-size: 36px;
	color: #000;
	font-weight: 900;
}

.hotel-boxBtnoff {
	width: 25%;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.hotel-boxBtnoff a {
	width: 100%;
	border-radius: 10px;
	border: none;
	padding: 10px;
	text-transform: uppercase;
	font-size: 16px;
	font-weight: 900;
	background: #d7ea82;
	box-shadow: none;
	color: #000;
}

.hotel-boxBtnoff a:hover {
	background: #24b6e5;
	color: #fff;
}

.hotel-boxBtnoff p {
	text-align: center;
	font-size: 36px;
	color: #000;
	font-weight: 900;
}

.hotel-box {
	position: relative;
}

.showingResult {
	display: flex;
	justify-content: space-between;
}

.amenitiesSelect {
	width: 100%;
	margin-bottom: 20px;
}


.cityHeading {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.cityHeading h2 {
	color: #24b6e5 !important;
	font-size: 30px !important;
}

.cityHeading Button {
	border-radius: 10px;
	border: none;
	padding: 10px 22px;
	text-transform: uppercase;
	font-size: 16px;
	font-weight: 900;
	background: #d8eb82;
	box-shadow: none;
	color: #000;
	width: 20%;
}

.cityHeading Button:hover {
	color: #000;
	background: #d7ec78;
}

.cityHeading Button:focus {
	background: #d8eb82;
	color: #000;
	border-color: transparent;
	box-shadow: none;
}

.citymapIcon {
	color: #000;
}

.price-input {
	width: 100%;
	display: flex;
	margin: 20px 0 25px;
}

.price-input .field {
	display: flex;
	width: 100%;
	height: 45px;
	align-items: center;
}

.field input {
	width: 100%;
	height: 100%;
	outline: none;
	font-size: 16px;
	margin-left: 5px;
	border-radius: 5px;
	text-align: center;
	border: 1px solid #999;
	-moz-appearance: textfield;
}

input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
	-webkit-appearance: none;
}

.price-input .separator {
	width: 110px;
	display: flex;
	font-size: 19px;
	align-items: center;
	justify-content: center;
}

.rangeslider {
	height: 5px;
	position: relative;
	background: #ddd;
	border-radius: 5px;
}

.rangeslider .progress {
	height: 100%;
	left: 25%;
	right: 25%;
	position: absolute;
	border-radius: 5px;
	background: #24b6e5;
}

.range-input {
	position: relative;
}

.range-input input {
	position: absolute;
	width: 100%;
	height: 5px;
	top: -5px;
	background: none;
	pointer-events: none;
	-webkit-appearance: none;
	-moz-appearance: none;
}

input[type="range"]::-webkit-slider-thumb {
	height: 17px;
	width: 17px;
	border-radius: 50%;
	background: #24b6e5;
	pointer-events: auto;
	-webkit-appearance: none;
	box-shadow: 0 0 6px rgba(0, 0, 0, 0.05);
}

input[type="range"]::-moz-range-thumb {
	height: 17px;
	width: 17px;
	border: none;
	border-radius: 50%;
	background: #24b6e5;
	pointer-events: auto;
	-moz-appearance: none;
	box-shadow: 0 0 6px rgba(0, 0, 0, 0.05);
}

@media (max-width: 576px) {
	.hotel-boxText {
		padding: 0px 8px 0px 8px;
	}
}

.cityBox {
	padding: 50px 0px 50px 0px;
}

@media (max-width: 576px),
(max-width: 768px) {
	.hotel-box {
		padding: 0;
		border-radius: 10px;
		border: 1px solid #9979fd59;
		align-items: start;
		padding-top: 10px;
		padding-bottom: 10px;
		border-top: 10px solid #bbade8;
	}

	.last-minute {
		padding: 0px;
	}

	.cityBox {
		padding: 30px 0px 30px 0px;
	}

	.hotel-boxText h4 {
		font-size: 90%;
	}

	.hotelImg img {
		height: 49px !important;
		width: 79px !important;
	}

	.hotel-boxText p {
		font-size: 70%;
		line-height: 16px;
	}

	.hotel-boxBtn p {
		font-size: 85%;
		margin: 0;
	}

	.hotel-boxBtnoff p {
		font-size: 100%;
		line-height: 18px;
	}

	.hotel-boxBtn a {
		font-size: 10px;
		padding: 5px 3px;
		width: 100%;
	}

	.hotel-boxBtnoff a {
		font-size: 10px;
		padding: 5px 3px;
		width: 100%;
	}

	.thumbnailwidth {
		width: 45%;
	}

	.xs-pad-left {
		width: 55%;
		padding-left: 10px;
		padding-right: 0px;
	}

	.xs-pad-right {
		padding-left: 0px;
		padding-right: 10px;
	}

	.hotelIcon {
		color: #000;
		font-size: 12px;
	}

	.hotelImg p {
		text-align: center;
		color: #000;
		margin: 5px 0px 0px 0px;
		font-size: 70%;
	}
}

.cityMbBtns {
	display: flex;
	justify-content: space-between;
	width: 100%;
}

.cityMbBtns Button {
	border-radius: 10px;
	border: none;
	padding: 0px 20px;
	text-transform: uppercase;
	font-size: 12px;
	font-weight: 900;
	background: #d8eb82;
	box-shadow: none;
	color: #000;
}

.cityMbBtns Button:focus {
	background: #d8eb82;
	color: #000;
	border-color: transparent;
	box-shadow: none;
}

.cityMbBtns Button:hover {
	color: #000;
	background: #d7ec78;
}

.overflow {
	overflow: hidden;
}

.cityMap {
	height: 250px;
	width: 100%;
	border-radius: 20px;
	margin-top: 15px;
}

/* Main Page Map CSS */

.info-window {
	font-family: Arial, sans-serif;
	width: 200px;
	text-align: center;
}

.info-window img {
	width: 100%;
	height: auto;
	border-radius: 5px;
}

.info-window h3 {
	font-size: 16px;
	margin: 10px 0 5px;
	color: #24b6e5;
	/* Hotel name in green */
}

.info-window p {
	font-size: 14px;
	margin: 0;
	font-weight: bold;
	color: #000;
}

.info-window .offer {
	font-size: 18px;
	color: #24b6e5;
	/* Offer in green */
	margin-top: 10px;
	font-weight: bold;
}

.padding-30 {
	padding: 30px;
}

/* Default state for the phone link */
.phone-link {
	text-decoration: none;
	color: #000;
	/* Default color */
}

/* Hover and focus state for the phone link */
.phone-link:hover,
.phone-link:focus {
	text-decoration: none;
	color: #24b6e5;
	/* Change to red on hover */
}


/* Default state for the phone link */
.direct-call-link {
	text-decoration: none;
	color: #007bff;
	/* Default color */
}

/* Hover and focus state for the phone link */
.direct-call-link:hover,
.direct-call-link:focus {
	text-decoration: none;
	color: #24b6e5;
	/* Change to red on hover */
}

/* Thank You Page */

.thankyouHeading h2 {
	color: #24b6e5 !important;
}

.thankyouHeading p {
	color: #000 !important;
}

.thankyouHappens ul li {
	margin-left: 40px;
	line-height: 35px;
}

.thankyouHappens ol li {
	margin-left: 40px;
	line-height: 35px;
}

.thankyouButton p {
	color: #000;
	font-size: 26px;
	margin: 20px 0px 30px 0px;
}

.thankyouButton a {
	border-radius: 10px;
	border: none;
	padding: 10px 50px;
	text-transform: uppercase;
	font-size: 18px;
	font-weight: 900;
	background: #d7ea82;
	box-shadow: none;
	color: #000;
}

.thankyouButton a:hover {
	border-radius: 10px;
	border: none;
	padding: 10px 50px;
	text-transform: uppercase;
	font-size: 18px;
	font-weight: 900;
	background: #24b6e5;
	box-shadow: none;
	color: #fff;
}

@media (max-width: 576px) {
	.thankyouHeading h2 {
		font-size: 30px;
	}

	.thankyouHappens h2 {
		font-size: 30px;
	}

	.thankyouButton p {
		font-size: 20px;
	}
}

/*---------------------
  Sign Up Section
-----------------------*/
.sign-up input {
	width: 100%;
	height: 50px;
	border: 1px solid #24b6e530;
	border-radius: 10px;
	font-size: 16px;
	color: #000;
	padding-left: 25px;
	margin-bottom: 28px;
}

.sign-up input:focus {
	border: 1px solid #24b6e5;
}

.sign-up input::-webkit-input-placeholder {
	color: #aaaab3;
}

.sign-up input::-moz-placeholder {
	color: #aaaab3;
}

.sign-up input:-ms-input-placeholder {
	color: #aaaab3;
}

.sign-up input::-ms-input-placeholder {
	color: #aaaab3;
}

.sign-up input::placeholder {
	color: #aaaab3;
}

.sign-up textarea::-webkit-input-placeholder {
	color: #aaaab3;
}

.sign-up textarea::-moz-placeholder {
	color: #aaaab3;
}

.sign-up textarea:-ms-input-placeholder {
	color: #aaaab3;
}

.sign-up textarea::-ms-input-placeholder {
	color: #aaaab3;
}

.sign-up textarea::placeholder {
	color: #aaaab3;
}

.sign-upBtn {
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	color: #ffffff;
	letter-spacing: 2px;
	background: #24b6e5;
	border: none;
	padding: 14px 34px 13px;
	display: inline-block;
	border-radius: 10px;
}

.sign-upBtn:hover {
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	color: #ffffff;
	letter-spacing: 2px;
	background: #1798c2;
	border: none;
	padding: 14px 34px 13px;
	display: inline-block;
}

@media (max-width: 576px) {
	.sign-upBtn {
		width: 100%;
	}

	.accountHD {
		font-size: 22px;
	}
}

.password-wrapper {
	position: relative;
}

.toggle-password {
	position: absolute;
	right: 30px;
	top: 30%;
	transform: translateY(-50%);
	cursor: pointer;
	color: #24b6e5;
}

.toggle-password-login {
	position: absolute;
	right: 30px;
	top: 36%;
	transform: translateY(-50%);
	cursor: pointer;
	color: #24b6e5;
}

.tacbox {
	display: flex;
	margin-left: 1em;
}

.tacbox input {
	height: 1em;
	width: 1em;
	margin-right: 10px;
	margin-top: 2px;
}

.tacbox label {
	display: inline-block;
	margin-bottom: 0rem;
	font-size: 12px;
}

@media (max-width: 576px) {
	.tacbox label {
		font-size: 10px;
	}
}

.border-top {
	border-top: 10px solid #24b6e5 !important;
}


.pleaseLogin p {
	margin: 0px;
	padding-right: 5px;
	text-align: center;
}


.wishlistbox {
	display: flex;
	background-color: #ffffff;
	padding: 20px;
	border-radius: 20px;
	margin-bottom: 20px;
}

.wishlistImg img {
	border-radius: 20px;
	width: 100%;
	max-width: 200px;
	height: auto;
}

.wishlistText {
	margin: 0px 20px 0px 20px;
}

.wishlistText a {
	font-size: 20px;
	color: #9979fd;
	line-height: 25px;
}

.wishlistText p {
	font-size: 14px;
	line-height: 18px;
}

.wishlistPrice {
	font-size: 24px !important;
	margin: 0px 0px 10px 0px;
	color: #000;
	font-weight: 900;
}

.wishlistIcon {
	font-size: 14px;
	color: #000;
}

.wishlistBtn {
	border-radius: 10px;
	border: none;
	padding: 10px 20px;
	text-transform: uppercase;
	font-size: 16px !important;
	font-weight: 900;
	background: #d7ea82;
	box-shadow: none;
	color: #000 !important;
}

.wishlistBtn:hover {
	background: #24b6e5;
	color: #fff !important;
}

.trash i {
	background: #d7ea8240;
	padding: 9px 10px;
	border-radius: 50%;
	border: 1px solid #d7ea82;
	cursor: pointer;
}

@media (max-width: 576px) {
	.wishlistbox {
		padding: 15px;
	}

	.wishlistText {
		margin: 0px 10px 0px 10px;
	}

	.wishlistText a {
		font-size: 16px;
		line-height: 24px;
	}

	.wishlistText p {
		font-size: 12px;
		line-height: 14px;
	}

	.wishlistImg img {
		border-radius: 15px;
		width: 100%;
		max-width: 250px;
		height: auto;
	}

	.wishlistBtn {
		padding: 5px 15px;
		font-size: 14px !important;
	}
}

/* Customizing the accordion appearance */
.accordion-container {
	width: 100%;
}

.accordion h2 {
	text-align: center;
	margin-bottom: 20px;
}

.accordion-item {
	border-bottom: 1px solid #e0e0e0;
}

.accordion-header {
	background: #f9f9f9;
	cursor: pointer;
	padding: 15px;
	width: 100%;
	text-align: left;
	border: none;
	outline: none;
	transition: background 0.3s ease;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.accordion-header:hover {
	background: #e2e2e2;
}

.accordion-content {
	display: none;
	padding: 15px;
	border-top: 1px solid #e0e0e0;
	background-color: #f9f9f9;
}

.accordion-content p {
	margin: 0;
}

.accordion-header.active+.accordion-content {
	display: block;
}

.icon i {
	font-size: 1.2em;
	transition: transform 0.3s ease;
}

/* Rotate icon when active */
.accordion-header.active .icon i {
	transform: rotate(180deg);
}

/* Responsive styles */
@media (max-width: 600px) {
	.accordion-container {
		width: 100%;
		padding: 10px;
	}
}

/* 404 Page CSS */
#notfound {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100vh;
	overflow: hidden;
}

#notfound .notfound {
	position: absolute;
	left: 50%;
	top: 50%;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	text-align: center;
	max-width: 600px;
	width: 100%;
	line-height: 1.4;
}

.notfound {
	max-width: 520px;
	width: 100%;
	line-height: 1.4;
}

.notfound .notfound-404 {
	position: absolute;
	left: 0;
	top: 0;
	height: 150px;
	width: 200px;
	z-index: -1;
}

.notfound .notfound-404 h1 {
	font-size: 238px;
	font-weight: 700;
	margin: 0px;
	color: #24b6e52e;
	text-transform: uppercase;
	letter-spacing: 7px;
	position: absolute;
	left: 50%;
	top: 10%;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, 100%);
}

.notfound h2 {
	font-size: 28px;
	color: #23b6e6 !important;
	text-align: left;
}

.notfound p {
	text-align: left;
}

.notfound .notfound-search {
	position: relative;
	padding-right: 123px;
	width: 100%;
	margin: 30px 0px 20px;
}

.notfound .notfound-search input {
	width: 100%;
	height: 40px;
	padding: 3px 15px;
	color: #222;
	font-size: 18px;
	font-weight: 400;
	background: #fff;
	border: 2px solid rgba(21, 23, 35, 0.2);
	-webkit-transition: 0.2s all;
	transition: 0.2s all;
}

.notfound .notfound-search input:focus {
	border-color: #57a3f8;
}

.notfound .notfound-search button {
	position: absolute;
	right: 0px;
	top: 0px;
	width: 120px;
	height: 40px;
	text-align: center;
	border: none;
	background: #57a3f8;
	cursor: pointer;
	padding: 0;
	color: #fff;
	font-weight: 700;
	font-size: 18px;
}

.notFound {
	border: 1px solid #ebebeb;
	border-radius: 50px;
	height: 50px;
	line-height: 50px;
	outline: none;
	padding-left: 20px;
	width: 100%;
	float: none;
}

.notFoundBtn h5 {
	margin-bottom: 20px;
}

.notFoundBtn a {
	background: transparent;
	font-size: 12px;
	color: #000000;
	box-shadow: none;
	border: 1px solid #24b6e5;
	padding: 10px;
	border-radius: 10px;
}

.notFoundBtn a:hover {
	background-color: #24b6e5;
	color: #fff;
}

.notFoundLogo {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 0px 5px;
}

.notFoundLogo img {
	width: 30%;
}

.notFoundText {
	padding: 0px 20px;
}

/* Responsive Adjustments for Width 1336px */
@media only screen and (max-width: 1336px) {
	#notfound {
		height: 90vh;
		padding: 20px;
	}

	.notfound h2 {
		font-size: 20px;
	}

	.notfound p {
		font-size: 14px;
	}

	.notFoundLogo img {
		width: 35%;
	}

	.errorimg {
		width: 35% !important;
	}
}

/* Additional Mobile Adjustments */
@media only screen and (max-width: 768px) {
	.notfound .notfound-404 h1 {
		font-size: 120px;
	}

	.notfound h2 {
		font-size: 22px;
	}
}

@media only screen and (max-width: 480px) {
	.notfound .notfound-404 h1 {
		font-size: 100px;
	}

	.notfound h2 {
		font-size: 18px;
	}
}

/* Profile popup CSS */
.top-social,
.mb-icon {
	display: flex;
	align-items: center;
	justify-content: flex-end;
}

.profile-popup {
	position: absolute;
	top: 40px;
	/* Adjust this based on the icon size */
	right: 0;
	background-color: #fff;
	border: 1px solid #ccc;
	border-radius: 10px;
	width: 180px;
	box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
	z-index: 10;
	padding: 0;
}

.profile-popup ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

.profile-popup li {
	padding: 12px 15px;
	display: flex;
	align-items: center;
	cursor: pointer;
	font-size: 14px;
	transition: background-color 0.3s ease;
}

.profile-popup li:hover {
	background-color: #f0f0f0;
}

.profile-popup li i {
	margin-right: 10px;
	font-size: 16px;
}

.profile-popup-hidden {
	display: none;
	/* Hidden by default */
}

.profile-a {
	display: block !important;
	margin-left: 0px !important;
	color: #19191a !important;
}

.mb-overlay {
	z-index: 999;
}

/* Plan a trip CSS */
.trip-section {
	position: relative;
	background-image: url('..//css//images/plan-trip.webp');
	/* Replace with your desired background image */
	background-size: cover;
	background-position: center;
	height: 180px;
	/* Set height for the entire section */
	display: flex;
	/* Use flexbox for centering */
	justify-content: center;
	/* Center horizontally */
	align-items: center;
	/* Center vertically */
}

.trip-section::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.5);
	/* Semi-transparent overlay */
	z-index: 1;
	/* Ensure the overlay stays above the background but below the text */
}

.inner-trip {
	position: relative;
	background-color: #000;
	background-size: cover;
	background-position: center;
	height: 150px;
	/* Set height for the entire section */
	display: flex;
	/* Use flexbox for centering */
	justify-content: center;
	/* Center horizontally */
	align-items: center;
	/* Center vertically */
}

.trip-banner {
	position: relative;
	z-index: 2;
	/* Ensure text is above the overlay */
	text-align: center;
	color: white;
}

.trip-banner h1 {
	font-size: 3rem;
	/* Adjust font size as needed */
	margin: 0;
	color: #fff;
}

.trip-banner h1 span {
	color: #24b6e5;
}

@media only screen and (max-width: 480px) {
	.trip-banner h1 {
		font-size: 1.8rem;
	}

	.inner-trip {
		height: 80px;
	}

	.trip-section {
		height: 80px;
	}
}

.trip-heading {
	position: absolute;
	bottom: 0;
	left: 0;
	padding: 15px;
	font-size: 24px;
	color: white;
	text-decoration: none;
}

.plantrip-form {
	width: 40%;
	margin-top: 30px;
}


.plantrip-form form input[type=text] {
	border: 1px solid #ebebeb;
	border-radius: 50px;
	height: 50px;
	line-height: 50px;
	outline: none;
	padding-left: 20px;
	float: none;
}

@media only screen and (max-width: 480px) {
	.plantrip-form {
		width: 100%;
	}
}

.destination-form {
	width: 40%;
	text-align: center;
}


.destination-form form input[type=text] {
	border: 1px solid #ebebeb;
	border-radius: 50px;
	height: 50px;
	line-height: 50px;
	outline: none;
	padding-left: 20px;
	float: none;
}

@media only screen and (max-width: 480px) {
	.destination-form {
		width: 100%;
	}
}

/* Trip Search Styles */
.trip-search {
	display: flex;
	justify-content: center;
	/* Center the search form */
	width: 100%;
	/* Adjust width if necessary */
}

.trip-search-container {
	position: relative;
	width: 500px;
	/* Set width of the search bar */
}

.trip-search-input {
	width: 100%;
	padding: 10px 40px 10px 15px;
	/* Add padding for the icon */
	font-size: 1rem;
	border: none;
	border-radius: 50px;
	outline: none;
}

.trip-search-icon {
	position: absolute;
	right: 10px;
	/* Position the icon inside the input field */
	top: 50%;
	transform: translateY(-50%);
	font-size: 1.2rem;
	/* Adjust icon size */
	color: #aaa;
	/* Adjust icon color */
	pointer-events: none;
	/* Prevent the icon from interfering with input */
}

/* Add gap between columns */
.trip-gap {
	display: flex;
	gap: 20px;
	/* Adjust the gap size as needed */
}

.trip-position-relative {
	position: relative;
	background-size: cover;
	height: 200px;
	border-radius: 20px;
	/* Optional: Add rounded corners to the boxes */
	overflow: hidden;
	/* Optional: To ensure the background image doesn't overflow */
}

.trip-overlay {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	top: 0;
	background: linear-gradient(to top, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0));
}

.trip-forward-icon {
	position: absolute;
	top: 10px;
	right: 10px;
	padding: 11px 12px;
	font-size: 16px;
	cursor: pointer;
	color: #000;
	background: #fff;
	border-radius: 50px;
}

.trip-list {
	border: 1px solid #dddddd;
	border-radius: 0px 0px 20px 20px;
	padding: 20px;
}

.openingheading {
	display: flex;
	align-items: center;
}

.opening h3 {
	font-size: 16px;
	text-decoration: none;
	font-weight: 700;
	color: #191E3B;
	margin-bottom: 10px;
}

.opening-hours i {
	color: #24b6e6;
	font-size: 16px;
}

.opening-hours span {
	color: #000;
	font-size: 16px;
}

.opening-hours {
	border-radius: 20px;
}

.opening-hour-list {
	padding: 20px 20px 0px 0px;
}

.opening-list {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.day-list {
	font-size: 14px;
	font-weight: 700;
}

.time-list {
	font-size: 14px;
	font-weight: 700;
}

.opening-desc h5 {
	font-weight: 700;
}

.trip-address {
	display: flex;
	align-items: center;
}

.trip-address span {
	color: #191E3B;
	font-size: 14px;
}

.trip-address i {
	color: #191E3B;
	font-size: 14px;
}

.trip-website {
	display: flex;
	align-items: center;
}

.trip-website a {
	margin-left: 0.5rem;
	font-size: 14px;
}

.trip-website i {
	color: #191E3B;
	font-size: 14px;
}

.trip-btn a {
	background: #24b5e6;
	font-size: 14px;
	color: #fff;
	padding: 5px 10px;
	border-radius: 5px;
}

.trip-img img {
	border-radius: 20px 20px 0px 0px;
	width: 100%;
}

.trip-detail {
	display: flex;
	align-items: center;
	justify-content: center;
}

.trip-detail span {
	color: #191E3B;
	font-size: 24px;
}

.trip-detail a {
	margin-left: 0.5rem;
	font-size: 24px;
}

.trip-detail i {
	color: #ffc107;
	font-size: 24px;
}

.trip-detail-review {
	display: flex;
	align-items: center;
	justify-content: center;
}

.trip-detail-review span {
	color: #191E3B;
	font-size: 24px;
}

.trip-detail-review a {
	margin-left: 0.5rem;
	font-size: 24px;
}

.trip-detail-review i {
	color: #ffc107;
	font-size: 24px;
}

.trip-review {
	display: flex;
	align-items: center;
}

.trip-review span {
	color: #191E3B;
	font-size: 14px;
}

.trip-review a {
	margin-left: 0.5rem;
	font-size: 14px;
}

.trip-review i {
	color: #ffc107;
	font-size: 14px;
}

.trip-review-detail {
	border: 1px solid #dddddd;
	border-radius: 20px;
	padding: 20px;
}

.review-heading {
	display: flex;
}

.user-meta-info h3 {
	font-size: 16px;
	text-decoration: none;
	font-weight: 700;
	color: #191E3B;
}

.user-meta-info p {
	font-size: 14px;
	margin: 0px;
}

.user-meta-info p span {
	background: #24b5e6;
	font-size: 14px;
	color: #fff;
	padding: 2px 10px;
	border-radius: 5px;
	margin-left: 10px;
}

.review-heading img {
	width: 20px;
	height: 20px;
}

.review-text p {
	font-size: 14px;
	padding-top: 10px;
	margin: 0px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	/* Number of lines to show initially */
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: normal;
	max-height: 4rem;
	/* Adjust based on line height */
	transition: max-height 0.3s ease;
	position: relative;
}

.review-text.expanded p {
	display: block;
	-webkit-line-clamp: unset;
	max-height: 100%;
	/* Removes the height restriction */
}

.read-more-btn {
	border: none;
	background: none;
	color: #007bff;
	cursor: pointer;
	padding: 0;
	margin-top: 5px;
	text-decoration: underline;
}

/* Accordion Styling */
button.opening-accordion {
	background-color: transparent;
	border: none;
	outline: none;
	text-align: left;
	font-size: 16px;
	font-weight: 700;
	color: #333;
	cursor: pointer;
	transition: background-color 0.2s linear;
}

button.opening-accordion:after {
	font-family: FontAwesome;
	content: "\f107";
	font-family: "fontawesome";
	font-size: 16px;
	float: right;
	margin-left: 10px;
}

button.opening-accordion.is-open:after {
	content: "\f106";
}

button.opening-accordion:hover,
button.opening-accordion.is-open {
	background-color: transparent;
}

.opening-accordion-content {
	background-color: transparent;
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.2s ease-in-out;
}

/* AI Box */
.aiHeading span {
	color: #23b6e6;
}

.aiBox {
	background: #ececec !important;
	border-radius: 15px !important;
	border: 1px solid #23b6e6;
}

.aiText {
	padding: 10px 0px;
}

.aiText h3 {
	font-size: 16px;
	margin-bottom: 15px;
}

.aiText button {
	background: #23b6e6;
	font-size: 18px;
	padding: 10px;
	border-radius: 10px;
	border: none;
}

.aiText button:hover {
	background: #109ac7;
}

.custom-row {
	display: flex;
	flex-wrap: wrap;
	/* Ensures proper wrapping on smaller screens */
	gap: 1rem;
	/* Adds consistent spacing between columns */
	justify-content: center;
}

.col-mdc-4 {
	flex: 0 0 calc(33.333% - 1rem);
	/* Adjust width to include the gap */
	max-width: calc(33.333% - 1rem);
	/* Ensures alignment */
}

.col-mdc-6 {
	flex: 0 0 calc(50% - 1rem);
	/* Adjust width to include the gap */
	max-width: calc(50% - 1rem);
	/* Ensures alignment */
}

@media (max-width: 912px) {
	.col-tripList {
		flex: 0 0 calc(50% - 1rem);
		/* Adjust width to include the gap */
		max-width: calc(50% - 1rem);
		/* Ensures alignment */
	}
}

@media (max-width: 912px) {
	.col-ipad {
		flex: 0 0 calc(100% - 0rem);
		/* Adjust width to include the gap */
		max-width: calc(100% - 0rem);
		/* Ensures alignment */
	}
}

@media (max-width: 853px) {
	.col-ipad {
		flex: 0 0 calc(100% - 0rem);
		/* Adjust width to include the gap */
		max-width: calc(100% - 0rem);
		/* Ensures alignment */
	}
}

@media (max-width: 768px) {
	.col-mb {
		flex: 0 0 calc(50% - 1rem);
		/* Adjust width to include the gap */
		max-width: calc(50% - 1rem);
		/* Ensures alignment */
	}

	.col-sm-12 {
		flex: 0 0 calc(100% - 0rem);
		/* Adjust width to include the gap */
		max-width: calc(100% - 0rem);
		/* Ensures alignment */
	}

	.trip-position-relative {
		height: 150px;
	}

	.col-ipad {
		flex: 0 0 calc(100% - 0rem);
		/* Adjust width to include the gap */
		max-width: calc(100% - 0rem);
		/* Ensures alignment */
	}

}

.wishlistOriginal {
	color: #707070;
	font-size: 14px;
	text-decoration-color: #ff0000 !important;
	font-weight: 700;
	text-decoration: line-through;
}

.hotel-btn {
	background: #ff5f611f;
	padding: 5px;
	font-size: 12px;
	text-transform: uppercase;
	color: #ff0002;
	font-weight: 600;
	border-radius: 6px;
	text-align: center;
}

.attraction-btn {
	background: #8c6eee1f;
	padding: 5px;
	font-size: 12px;
	text-transform: uppercase;
	color: #aa00ff;
	font-weight: 600;
	border-radius: 6px;
	text-align: center;
}

.heart-icon {
	position: absolute;
	top: 15px;
	right: 28px;
	background: #fff;
	border-radius: 50px;
	padding: 8px 11px;
}

.heart-icon a {
	color: #c1c0c0;
	font-size: 18px;
}

.heart-icon a:hover {
	color: #dc3545;
}

.trash-icon {
	position: absolute;
	top: 15px;
	right: 28px;
}

.trash-icon i {
	background: #fff;
	padding: 9px 10px;
	border-radius: 50%;
	border: 1px solid #d7ea82;
	cursor: pointer;
	font-size: 18px;
}

.top-social {
	position: relative;
	display: flex;
	gap: 15px;
	margin: 20px;
	z-index: 999;
}

.top-social a {
	text-decoration: none;
	color: #19191a;
	font-size: 24px;
	position: relative;
}

/* Popup Menu Styling */
.user-popup {
	display: none;
	position: absolute;
	top: 60px;
	left: 10px;
	/* Position the popup on the left side */
	background-color: white;
	border: 1px solid #ccc;
	box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2);
	z-index: 1000;
	width: 150px;
	border-radius: 10px;
	text-align: left;
	padding: 15px;
}

/* For larger screens (laptop/desktop) */
@media (min-width: 1024px) {
	.user-popup {
		left: 20px;
		/* Slightly adjusted for better spacing */
	}
}

/* For smaller screens (mobile) */
@media (max-width: 767px) {
	.user-popup {
		left: 5px;
		/* Adjusted to fit within smaller viewports */
		width: 120px;
		/* Narrower width for mobile devices */
	}
}

.user-popup a {
	display: block;
	padding: 5px 0px;
	text-decoration: none;
	font-size: 16px !important;
	color: #19191a;
}

.user-popup a:hover {
	background-color: #f5f5f5;
}

/* Wishlist Bubble Styling */
.top-social a .wishlist-bubble {
	position: absolute;
	top: -5px;
	right: -10px;
	background-color: red;
	color: white;
	font-size: 12px;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
}

@media only screen and (max-width: 480px) {
	.top-social a {
		font-size: 20px;
	}

	.top-social {
		z-index: 999;
		margin: -3px;
	}
}

/* ChatBot CSS */
/* Chat Container */
.chat-container {
	flex: 1;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	padding: 60px;
}

/* Messages Container */
.messages {
	flex: 1;
	overflow-y: auto;
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 15px;
	background-color: white;
	border-radius: 20px 20px 0px 0px;
	border-top: 1px solid #24b6e5;
	border-left: 1px solid #24b6e5;
	border-right: 1px solid #24b6e5;
	max-height: calc(100vh - 80px);
	/* Adjust height dynamically */
}

/* Scrollbar Styling */
.messages::-webkit-scrollbar {
	width: 4px;
}

.messages::-webkit-scrollbar-thumb {
	background-color: #cccccc;
	border-radius: 4px;
}

.messages::-webkit-scrollbar-thumb:hover {
	background-color: #a6a6a6;
}

.messages::-webkit-scrollbar-track {
	background-color: #f4f4f4;
	border-radius: 4px;
}

/* Individual Message Styling */
.message {
	display: flex;
	align-items: center;
	padding: 8px 12px;
	border-radius: 5px;
	max-width: 80%;
}

.message.bot {
	background-color: #f6f6f6;
	color: #282828;
	align-self: flex-start;
	position: relative;
	border-radius: 10px 10px 10px 0px;
}

.message.user {
	background-color: #8c6eee;
	color: #fff;
	align-self: flex-end;
	border-radius: 10px 10px 0px 10px;
}

/* Hotel List Styling */
.hotel-list {
	border: 1px solid #8c6eee;
	border-radius: 5px;
	padding: 10px;
	background-color: #fff;
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
	display: flex;
	flex-direction: column;
	gap: 15px;
}

.hotel-item {
	display: flex;
	gap: 10px;
	border-bottom: 1px solid #ddd;
	padding-bottom: 10px;
	margin-bottom: 10px;
}

.hotel-item:last-child {
	border-bottom: none;
	margin-bottom: 0;
	padding-bottom: 0;
}

.hotel-item img {
	width: 80px;
	height: 80px;
	border-radius: 5px;
	object-fit: cover;
}

.hotel-details {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.hotel-details .hotel-name {
	font-weight: bold;
	font-size: 14px;
}

.hotel-details .hotel-description {
	font-size: 12px;
	color: #555;
	margin-top: 5px;
}

.hotel-details .hotel-price {
	font-size: 14px;
	color: #2196f3;
	font-weight: bold;
	margin-top: 5px;
}

/* Input Bar */
.input-bar {
	display: flex;
	align-items: center;
	padding: 10px;
	background-color: #24b6e54f;
	border-radius: 0px 0px 20px 20px;
	border-bottom: 1px solid #24b6e5;
	height: 60px;
	/* Fixed height */
}

.input-bar input {
	flex: 1;
	padding: 10px;
	border: 1px solid #ddd;
	border-radius: 10px;
	font-size: 16px;
}

.input-bar button {
	margin-left: 10px;
	padding: 10px 16px;
	background-color: #d7ea82;
	color: #000;
	border: none;
	border-radius: 10px;
	cursor: pointer;
	font-size: 16px;
}

.input-bar button:hover {
	background-color: #8c6eee;
}

/* Chat Heading */
.chatHeading {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.chatHeading h2 {
	color: #282828;
	font-size: 34px;
	padding: 10px 0px 0px 0px;
}

.chatHeading a {
	font-size: 12px;
	text-align: center;
	background: #24b6e5;
	padding: 5px 8px;
	border-radius: 8px;
	color: #fff;
}

.hr {
	margin: 15px 0px;
	border: 1px solid #f1f1f1;
}

/* Typing Indicator */
.typing-indicator {
	display: flex;
	align-items: center;
	gap: 5px;
	margin-left: 10px;
}

.typing-indicator span {
	display: inline-block;
	width: 8px;
	height: 8px;
	background-color: #bbb;
	border-radius: 50%;
	animation: typing 1.5s infinite;
}

.typing-indicator span:nth-child(2) {
	animation-delay: 0.2s;
}

.typing-indicator span:nth-child(3) {
	animation-delay: 0.4s;
}

@keyframes typing {

	0%,
	80%,
	100% {
		opacity: 0;
	}

	40% {
		opacity: 1;
	}
}

/* Suggestion Icon */
.suggestion-icon {
	margin-right: 10px;
	font-size: 20px;
	color: #000;
	cursor: pointer;
	background: #fff;
	padding: 6px 14px;
	border-radius: 8px;
	border: 1px solid #24b6e559;
}

/* Suggestions */
.suggestions-container {
	margin-top: 20px;
	padding: 10px;
	background-color: #f4f4f4;
	border-radius: 5px;
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.suggestion-heading h6 {
	font-size: 14px;
	margin-bottom: 10px;
	font-weight: bold;
}

.suggestion-box {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 10px;
	border: 1px solid #ddd;
	border-radius: 5px;
	background-color: #fff;
	margin-bottom: 10px;
	cursor: pointer;
	transition: background-color 0.2s ease;
}

.suggestion-box:hover {
	background-color: #e1f5fe;
}

.suggestion-box i {
	color: #2196f3;
}

.suggestion-box p {
	flex: 1;
	margin: 0 10px;
	font-size: 14px;
}

/* Responsive Styling */
@media (max-width: 768px) {
	.chat-container {
		padding: 12px;
	}

	.messages {
		padding: 10px;
		max-height: calc(75vh - 0px);
		/* Reduce height for smaller screens */
	}

	.input-bar input {
		font-size: 14px;
		padding: 8px;
	}

	.input-bar button {
		padding: 8px 12px;
		font-size: 14px;
	}

	.hotel-item img {
		width: 60px;
		height: 60px;
	}

	.hotel-details .hotel-name {
		font-size: 12px;
	}

	.hotel-details .hotel-description,
	.hotel-details .hotel-price {
		font-size: 12px;
	}

	.suggestion-box p {
		font-size: 12px;
	}

	.chatHeading h2 {
		font-size: 20px;
		padding-right: 30px;
	}
}

@media only screen and (max-width: 820px) {
	.canvas-open {
		right: 60px;
	}

	.mb-icon {
		right: 110px;
	}
}

@media only screen and (max-width: 768px) {
	.canvas-open {
		top: 20px;
	}

	.mb-icon {
		top: 25px;
	}
}

@media only screen and (max-width: 767px) {
	.canvas-open {
		right: 20px;
	}

	.mb-icon {
		right: 65px;
	}
}

.nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active {
	color: #fff;
	background-color: #23b6e6;
	border-color: #dee2e6 #dee2e6 #fff;
}

/* Hotel Coupon Page CSS */

.hotelcoupon {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.hotelsCoupon img {
	height: 45px;
}

.hotelsHeading>h1 {
	color: #24b6e5 !important;
	font-size: 55px;
}

.hotelsHeading>h3 {
	font-size: 26px;
	margin-top: 5px;
}

@media (max-width: 576px) {
	.hotelsHeading>h1 {
		font-size: 20px !important;
	}

	.hotelsHeading>h3 {
		font-size: 12px;
	}

	.hotelsCoupon img {
		height: 30px;
	}
}

.besDealsBG {
	background: #f7f7f7;
	padding: 20px 0px 40px 0px;
}

.best-deals h2 span {
	font-weight: 800;
	color: #24b6e5;
}

.location-box {
	position: relative;
	overflow: hidden;
	/* Ensures the gradient stays within the box */
}

.location-box img {
	border-radius: 14px;
	height: 185px;
	width: 100%;
	/* Ensures the image fills the container */
	object-fit: cover;
	/* Ensures the image is cropped appropriately */
}

.location-box::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	/* Covers the entire box */
	border-radius: 14px;
	/* Matches the image's border radius */
	background: linear-gradient(to top, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0));
	/* Gradient from black to transparent */
	z-index: 1;
	/* Places the gradient above the image */
}

.location-box a {
	position: absolute;
	bottom: 15px;
	/* Adjusted for better visibility */
	left: 20px;
	color: #fff;
	z-index: 2;
	/* Ensures text is above the gradient */
	font-weight: bold;
	/* Optional: Makes the text stand out more */
}


@media (max-width: 768px) {
	.best-deals h2 {
		font-size: 22px;
	}
}

.destination img {
	border-radius: 20px 20px 0px 0px;
	width: 100%;
	height: 170px;
}

.destination-text {
	padding: 20px;
	border: 1px solid #00000014;
	border-radius: 0px 0px 20px 20px;
	text-align: left;
}

.destination-text a {
	/* font-size: 18px; */
	font-weight: 700;
	color: #24b6e5;
}

.destination-text p {
	font-size: 14px;
	margin-bottom: 0px;
}

.hotel-banner {
	background-image: url(../img/miami.jpeg);
	background-size: cover;
	background-position: center;
	border-radius: 30px;
	height: 500px;
	padding: 120px 50px;
}

.hotel-banner-text {
	text-align: left;
	background: #fff;
	border-radius: 20px;
	padding: 40px;
}

.hotel-banner-text a {
	background: #24b6e5;
	color: #fff;
	padding: 10px;
	border-radius: 12px;
	border: none;
}

.hotel-banner-text a:hover {
	background: #24b6e5;
}

@media (max-width: 576px) {
	.hotel-banner {
		height: 400px;
		padding: 50px;
	}

	.hotel-banner-text {
		padding: 20px;
	}

	.hotel-banner-text h3 {
		font-size: 26px;
	}
}

.guideBox {
	display: flex;
	justify-content: space-between;
}

@media (max-width: 576px) {
	.guidehotelsCoupon img {
		height: 30px;
		width: 250px;
	}
}

.guide h3 {
	color: #ffffff;
	text-align: center;
	margin: 10px 0px 0px 0px;
	font-weight: 100;
	font-size: 35px;
}

.guide p {
	color: #ffffff;
	text-align: center;
	font-size: 16px;
}

.guideBtn {
	display: flex;
	align-items: center;
	gap: 10px;
}

.guideOne {
	color: #000;
	background-color: #fff;
	border: none;
	font-size: 16px;
}

.guideTwo {
	color: #fff;
	background-color: #24b6e5;
	border: none;
	font-size: 16px;
}

.guideOne:hover {
	color: #fff;
	background-color: #24b6e5;
	border: none;
}

.guideTwo:hover {
	color: #fff;
	background-color: #24b6e5;
	border: none;
}

@media (max-width: 576px) {
	.guideOne {
		font-size: 14px;
	}

	.guideTwo {
		font-size: 14px;
	}

	.guide h3 {
		font-size: 24px;
	}
}

.guidePDF img {
	border-radius: 20px;
	margin-top: 10px;
	height: 150px;
}

.guidePDF a {
	font-size: 18px;
	font-weight: 700;
	color: #a487ff;
}


.guideText p {
	margin-bottom: 0px;
}

.guideDownload {
	color: #fff;
	background-color: #24b6e5;
	border: none;
	padding: 5px;
	font-size: 12px;
}

.guideDownload:hover {
	color: #fff;
	background-color: #24b6e5;
	border: none;
}

.hotelsHeading p {
	font-size: 12px;
	margin: 5px 0px 10px 0px;
	line-height: 1rem;
}

.background-image-destination {
	position: relative;
	background-image: url('../img/Destinationsbanner.jpg');
	/* Replace with the actual image URL */
	background-size: cover;
	background-color: no-repeat;
	background-position: center;
	height: auto;
	/* Adjust height as needed */
}

.background-image-destination::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.6);
	/* Black overlay with 60% opacity */
	z-index: 1;
}

.background-image-destination .row {
	position: relative;
	z-index: 2;
	/* Ensures the content is above the overlay */
}

.destinationTemp {
	background: #0000007a;
	padding: 25px 40px 25px 40px;
	border-radius: 10px;
	border: 1px solid #d8eb8273;
}

.destinationTemp h3 {
	color: #fff;
	text-align: center;
}

.destination-bg-image {
	background-image: url('../img/HC-searchbox.jpg');
	background-size: cover;
	background-position: top;
	background-repeat: no-repeat;
	height: 250px;
	padding-top: 80px;
	border-radius: 20px;
}

.destinationBtbn {
	background-color: #3eba58;
	color: #fff;
	border: none;
}

.destinationBtbn:hover {
	background-color: #24b6e2;
}

.destinationForm {
	padding: 0px 20px;
}

.destinationDark {
	background: #00000014;
	padding: 8px 20px;
	border: 1px solid #00000014;
	border-radius: 15px;
	text-align: left;
}

.destinationDark a {
	font-size: 18px;
	font-weight: 700;
	color: #24b6e5;
}

.destinationDark p {
	font-size: 14px;
	margin-bottom: 0px;
}

.desHeight {
	height: 225px;
}


@media (max-width: 576px) {
	.desHeight {
		height: 270px;
	}
}

.destinationDetail {
	background: #0000007a;
	padding: 25px 40px 25px 40px;
	border-radius: 10px;
	border: 1px solid #d8eb8273;
}

.destinationDetail h1 {
	color: #fff;
	text-align: center;
	font-size: 35px;
}

.destination-sec1 h2 span {
	font-weight: 700;
	color: #23b6e6;
}

.destination-sec1 p {
	margin-bottom: 0px;
}

.destination-banner {
	background-image: url(../img/miami-beach.webp);
	background-size: cover;
	background-position: center;
	border-radius: 30px;
	height: 300px;
	padding: 35px 50px;
}

.destination-banner-text {
	text-align: left;
	background: #ffffffe0;
	border-radius: 20px;
	padding: 40px;
}

.destination-banner-text a {
	background: #24b6e5;
	color: #fff;
	padding: 10px;
	border-radius: 12px;
	border: none;
}

.destination-banner-text a:hover {
	background: #24b6e5;
}

@media (max-width: 576px) {
	.destination-banner {
		height: 300px;
		padding: 50px;
	}

	.destination-banner-text {
		padding: 20px;
	}

	.destination-banner-text h3 {
		font-size: 26px;
	}
}

.destination-sec2 h3 {
	color: #2e2e2e;
	font-size: 22px;
	padding: 30px 0px 20px 30px;
}

.destination-sec2 ul {
	margin-left: 50px;
}

.destination-sec2 ul li {
	padding-bottom: 12px;
}

.destination-sec2 p {
	margin-left: 50px;
	margin-bottom: 0px;
}

.destination-articles {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 20px;
	margin-top: 20px;
	justify-content: center;
}

.destination-articles a {
	background: #fff;
	padding: 10px;
	border: 1px solid #23b6e6;
	border-radius: 10px;
	color: #000;
	margin-top: 20px;
}

@media (max-width: 768px) {
	.destinationDetail h1 {
		font-size: 18px;
	}

	.destination-articles {
		flex-direction: column !important;
		gap: 0px !important;
	}
}

.destination-border {
	border: 1px solid #24b6e5;
	border-radius: 20px;
	padding: 20px;
}

.des-detail-box {
	display: flex;
	align-items: center;
	gap: 20px;
}

.des-detail img {
	width: 180px;
	border-radius: 20px;
}

.dest-detail-btn {
	background: none;
	border: none;
	color: #24b6e5;
	cursor: pointer;
	padding: 0;
	text-decoration: underline;
}


@media (max-width: 768px) {
	.des-detail-box img {
		width: 150px;
		height: auto;
	}
}

.featured-heart-icon {
    position: absolute;
    top: 15px;
    right: 28px;
    background: #fff;
    border-radius: 50px;
    padding: 4px 8px;
}

.featured-heart-icon a {
	color: #c1c0c0;
	font-size: 16px;
}

.featured-heart-icon a:hover {
	color: #dc3545;
}

.dealsBtn {
	border: none;
	background: transparent !important;
	color: #9979fd !important;
}

.dealsBtn:hover {
	background: transparent !important;
	color: #9979fd !important;
}

/* .callnow-btn {
	border-radius: 10px;
	border: none;
	background: #d7ea82;
	color: #000 !important;
}

.callnow-btn:hover {
	background: #24b6e5;
	color: #fff !important;
} */

.directionBtn {
	background: transparent;
	color: #707070 !important;
	text-decoration: underline;
	border: none;
}
.directionBtn:hover{
	background: transparent;
}

.text-decoration-line-through {
	text-decoration-color: #ff0000 !important;
	text-decoration: line-through;
}

.featured-price{
	font-size: 28px;
    color: #000000;
    letter-spacing: -1px;
    font-weight: 700;
}

/* AI Cards CSS */
.city-card {
	background: #f8f9ff;
	border-radius: 16px;
	padding: 24px;
	border: 1px solid #e5e7eb;
	transition: all 0.3s ease;
	position: relative;
	overflow: hidden;
	height: 100%;
}

.city-card:hover {
	transform: translateY(-2px);
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

.city-header {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	margin-bottom: 16px;
}

.city-info h2 {
	color: #24b6e5;
	font-size: 24px;
	font-weight: 600;
	margin-bottom: 4px;
}

.city-info .state {
	color: #6b7280;
	font-size: 14px;
	font-weight: 500;
}

.featured-events {
	color: #6b7280;
	font-style: italic;
	margin-bottom: 16px;
	font-size: 14px;
	line-height: 1.4;
}

.events-section h3 {
	color: #6b7280;
	font-size: 14px;
	font-weight: 600;
	margin-bottom: 12px;
	display: flex;
	align-items: center;
}

.events-section h3::before {
	content: "🎭";
	margin-right: 8px;
}

.event-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 16px;
}

.event-tag {
    background: transparent;
    color: #24b6e5;
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 500;
    transition: all 0.2s ease;
    pointer-events: auto;
    border: 1px solid #24b6e5;
}

.event-tag:hover {
	background: transparent;
	transform: scale(1.05);
}

.event-tag.tertiary {
	background: #a5abe9;
}

.description {
	color: #4b5563;
	font-size: 14px;
	line-height: 1.5;
}

.generate-btn {
	background: linear-gradient(135deg, #ff6b6b, #ee5a24);
	color: white;
	border: none;
	padding: 14px 32px;
	border-radius: 25px;
	font-size: 16px;
	font-weight: 600;
	cursor: pointer;
	transition: all 0.3s ease;
	display: block;
	margin: 0 auto;
	box-shadow: 0 4px 15px rgba(255, 107, 107, 0.3);
}

.generate-btn:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 25px rgba(255, 107, 107, 0.4);
}

.generate-btn::before {
	content: "🖼️";
	margin-right: 8px;
}


.discounted{
	font-size: 20px;
}
.discounted span {
    color: #24b6e5;
    font-weight: bold;
}

/* Fix sidebar scroll issue */
#sidenav-main {
  position: fixed;            /* already present */
  top: 90px;
  bottom: 30px;
  left: 0;
  right: auto;
  width: 250px;               /* or whatever width you're using */
  overflow-y: auto;
  overflow-x: hidden;
  max-height: 100vh;          /* ensure height is limited to viewport */
}
/* Optional scrollbar styling for WebKit (Chrome, Edge, Safari) */
#sidenav-main::-webkit-scrollbar {
  width: 6px;
}
#sidenav-main::-webkit-scrollbar-track {
  background: #f1f1f1;
}
#sidenav-main::-webkit-scrollbar-thumb {
  background-color: #c1c1c1;
  border-radius: 4px;
}
#sidenav-main::-webkit-scrollbar-thumb:hover {
  background-color: #999;
}

.owl-nav {
	position: absolute;
	top: 35%;
	width: 100%;
	display: flex;
	justify-content: space-between;
}

.owl-nav i {
	background: #000;
	color: #fff;
	padding: 13px 15px;
	border-radius: 30%;
	font-size: 16px;
}

.owl-nav button {
	border: none;
	background: transparent;
}

.owl-prev {
	margin-left: -22px;
}

.owl-next {
	margin-right: -22px;
}

/* Default (Desktop) */
.owl-prev {
	margin-left: -22px;
}

.owl-next {
	margin-right: -22px;
}

/* Mobile Responsive */
@media (max-width: 768px) {

	.owl-prev,
	.owl-next {
		margin: 0 !important;
	}
}

/* Make Owl stage flex so items match height */
.partners-carousel .owl-stage {
    display: flex;
}
.partners-carousel .owl-item {
    display: flex;
}

/* Card container */
.partners-carousel .destination {
    display: flex;
    flex-direction: column;
    height: 100%;
}

/* Image area */
.partners-carousel .trip-img img {
    width: 100%;
    height: 200px; /* fixed image height */
   /* object-fit: cover;*/
    display: block;
}

/* Text area flexes */
.partners-carousel .destination-text {
    display: flex;
    flex-direction: column;
    flex: 1;
}

/* Push "Visit Website" to the bottom */
.partners-carousel .trip-website {
    margin-top: auto;
}

.tier-1-carousel .owl-stage{
	display: flex;
}
.tier-1-carousel .owl-item{
	display: flex;
}

.tier-2-carousel .owl-stage{
	display: flex;
}
.tier-2-carousel .owl-item{
	display: flex;
}

.tier-3-carousel .owl-stage{
	display: flex;
}
.tier-3-carousel .owl-item{
	display: flex;
}

/* New Hotel Listing CSS of city page START */
.city-hotel {
	background: var(--bg);
	position: relative;
	padding: 10px;
	border-radius: 10px;
	border: 1px solid #9979fd59;
	align-items: center;
	border-top: 10px solid #bbade8;
	margin-bottom: 30px;
}

.city-hotel::after {
	content: "";
	position: absolute;
	inset: 10px;
	border: 2px solid var(--coral);
	border-radius: 20px;
	pointer-events: none;
	opacity: .4;
}

/* image box */
.city-hotel-thumb {
	aspect-ratio: 1 / 1;
	border: 2px solid var(--coral);
	border-radius: 18px;
	position: relative;
	overflow: hidden;
	background: #f1f1f1;
}

.city-hotel-thumb::after {
	content: "";
	position: absolute;
	inset: 10px;
	border: 2px solid var(--coral);
	border-radius: 14px;
	opacity: .35;
	pointer-events: none;
}

.city-hotel-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.city-hotel-title {
	color: #0f172a;
	font-weight: 500;
	font-size: 20px;
}

.city-hotel-meta a {
	color: var(--ink);
	text-decoration: underline;
	font-size: 14px;
	margin-top: 10px;
}

.city-pill {
	border: 2px solid var(--coral);
	color: var(--ink);
	border-radius: 14px;
	padding: .4rem .9rem;
	background: transparent;
	font-size: .9rem;
}

.btn-coral {
	width: 100%;
	border-radius: 10px;
	border: none;
	padding: 10px;
	text-transform: uppercase;
	font-size: 16px;
	font-weight: 900;
	background: #d7ea82;
	box-shadow: none;
	color: #000;
}

.btn-coral:hover {
	background: #20b8eb;
	color: #fff9f9;
}

.price-wrap {
	border-radius: 10px;
	display: block;
	text-align: center;
	margin: 0 auto;
}

.old-price {
	text-decoration: line-through;
	text-decoration-color: red;
	/* 👈 makes the strike line red */
	opacity: .6;
	margin-right: .25rem;
	font-size: 16px !important;
}

.new-price {
	font-weight: 700;
	font-size: 35px !important;
	color: #000;
}

.city-other {
	color: #6c757d;
	font-size: 12px;
	text-align: center;
	margin-bottom: 10px;
}

/* Responsive layout for the heading + button */
.cityHeading {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}

.cityHeading h2 {
	color: #24b6e5;
	font-size: 30px;
	font-weight: 600;
	margin: 0;
	line-height: 1.2;
	flex: 1 1 auto;
	word-break: break-word;
	/* handles long city names */
}

#mapViewBtn {
	flex: 0 0 auto;
	/* keep button’s size on desktop */
	white-space: nowrap;
}

.feat-banner-city {
	position: absolute;
	height: 55px;
	width: 55px;
	top: -13px;
	left: -4px;
	background: url(../img/featured-banner-sm.png);
	margin: 0;
	padding: 0;
	z-index: 200;
}

 
/* Mobile: stack + full-width button */
@media (max-width: 576px) {
	.cityHeading {
		flex-direction: column;
		align-items: stretch;
	}

	.cityHeading h2 {
		font-size: 20px !important;
		text-align: center;
	}

	#mapViewBtn {
		width: 100%;
	}
}

@media (max-width: 576px) {
	.city-hotel-title {
		font-size: 13px;
	}

	.city-hotel-meta a {
		font-size: 10px;
		margin-top: 0px !important;
	}

	.new-price {
		font-size: 16px !important;
	}

	.old-price {
		margin: 0px !important;
		font-size: 10px !important;
	}

	.city-hotel-icon {
		font-size: 10px;
	}

	.city-hotel-meta {
		font-size: 10px;
	}

	.city-other {
		text-align: right;
		margin-bottom: 5px;
		font-size: 9px;
	}
	.cityBtn a{
		font-size: 12px;
	}
	.price-wrap {
		text-align: right;
	}
	.city-btn a {
        font-size: 10px;
        border-radius: 8px;
        padding: 5px 3px;
        width: 100%;
    }
	.city-pad-left {
        width: 55%;
        padding-left: 10px;
        padding-right: 0px;
    }
	.citymb-padding {
        padding: 0px 8px 0px 8px;
    }
	.cityImg img {
        height: 280px !important;
        width: 100% !important;
        object-fit: cover;
        border-radius: 10px;
    }
}


.hotelImg img {
    width: 100%;
    height: 250px;
    object-fit: cover;
    border-radius: 10px; 
    display: block; 
}

 

@media (max-width: 576px),
(max-width: 768px) {
	.hotelImg img {
		height: 280px !important;
		width: 100% !important;
		object-fit: cover;
		border-radius: 10px;
	}
	
}
.btn-primary {
    color: #fff;
    background-color: #24b6e5;
    border-color: #24b6e5;
}
.city-btn a {
    width: 100%;
    border-radius: 10px;
    border: none;
    padding: 10px;
    text-transform: uppercase;
    font-size: 16px;
    font-weight: 900;
    background: #d7ea82;
    box-shadow: none;
    color: #000;
}

@media (max-width: 991.98px) {
    .city-bottom {
        position: absolute;
        right: 0px;
        bottom: 0px;
        z-index: 3;
        border-radius: 12px;
        padding: 0px 12px;
        max-width: calc(100% - 24px);
    }
	.city-content-width {
        position: relative;
        padding-bottom: 130px;
    }
}

.cityImg img {
    width: 100%;
    height: 250px;
    object-fit: cover;
    border-radius: 10px;
    display: block;
}



/* New Hotel Listing CSS of city page START */
.city-hotel {
	position: relative;
	padding: 10px 0px;
	border-radius: 10px;
	border: 1px solid #9979fd59;
	align-items: center;
	border-top: 10px solid #bbade8;
}

.city-hotel {
	display: none;
}

.city-hotel:nth-child(-n+5) {
	display: flex;
	/* Show first 5 items */
}

/* image box */
.cityImg img {
	width: 100%;
	height: 250px;
	object-fit: cover;
	border-radius: 10px;
	display: block;
}

.city-hotel-title {
	color: #0f172a;
	font-weight: 500;
	font-size: 20px;
}

.city-hotel-meta a {
	color: var(--ink);
	text-decoration: underline;
	font-size: 14px;
	margin-top: 10px;
}

.city-pill {
	border: 2px solid var(--coral);
	color: var(--ink);
	border-radius: 14px;
	padding: .4rem .9rem;
	background: transparent;
	font-size: .9rem;
}

.btn-coral {
	width: 100%;
	border-radius: 10px;
	border: none;
	padding: 10px;
	text-transform: uppercase;
	font-size: 16px;
	font-weight: 900;
	background: #d7ea82;
	box-shadow: none;
	color: #000;
}

.btn-coral:hover {
	background: #20b8eb;
	color: #fff9f9;
}

.price-wrap {
	border-radius: 10px;
	display: block;
	text-align: center;
	margin: 0 auto;
}

.old-price {
	text-decoration: line-through;
	text-decoration-color: red;
	/* 👈 makes the strike line red */
	opacity: .6;
	margin-right: .25rem;
	font-size: 16px !important;
}

.new-price {
	font-weight: 700;
	font-size: 35px !important;
	color: #000;
}

.city-other {
	color: #6c757d;
	font-size: 12px;
	text-align: center;
	margin-bottom: 10px;
}

/* Responsive layout for the heading + button */
.cityHeading {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}

.cityHeading h2 {
	color: #24b6e5;
	font-size: 30px;
	font-weight: 600;
	margin: 0;
	line-height: 1.2;
	flex: 1 1 auto;
	word-break: break-word;
	/* handles long city names */
}

#mapViewBtn {
	flex: 0 0 auto;
	/* keep button’s size on desktop */
	white-space: nowrap;
}

.feat-banner-city {
	position: absolute;
	height: 55px;
	width: 55px;
	top: -13px;
	left: -4px;
	background: url(../img/featured-banner-sm.png);
	margin: 0;
	padding: 0;
	z-index: 200;
}

.city-btn a {
	width: 100%;
	border-radius: 10px;
	border: none;
	padding: 10px;
	text-transform: uppercase;
	font-size: 16px;
	font-weight: 900;
	background: #d7ea82;
	box-shadow: none;
	color: #000;
}

.city-btn a:hover {
	background: #24b6e5;
	color: #fff;
}

/* Mobile: stack + full-width button */
@media (max-width: 576px) {
	.cityHeading {
		flex-direction: column;
		align-items: stretch;
	}

	.cityHeading h2 {
		font-size: 20px !important;
		text-align: center;
	}

	#mapViewBtn {
		width: 100%;
	}
}

@media (max-width: 576px) {
	.city-hotel {
		align-items: start;
	}
	.cityImg img {
		height: 280px !important;
		width: 100% !important;
		object-fit: cover;
		border-radius: 10px;
	}
	.city-pad-left {
		width: 55%;
		padding-left: 10px;
		padding-right: 0px;
	}
	.city-pad-right {
		padding-left: 0px;
		padding-right: 10px;
	}
	.city-content-width {
		width: 45%;
	}
	.citymb-padding {
		padding: 0px 8px 0px 8px;
	}
	.city-hotel-title {
		font-size: 13px;
	}

	.city-hotel-meta a {
		font-size: 10px;
		margin-top: 0px !important;
	}

	.new-price {
		font-size: 16px !important;
	}

	.old-price {
		margin: 0px !important;
		font-size: 10px !important;
	}

	.city-hotel-icon {
		font-size: 10px;
	}

	.city-hotel-meta {
		font-size: 10px;
	}

	.city-other {
		text-align: right;
		margin-bottom: 5px;
		font-size: 9px;
	}
	.cityBtn a{
		font-size: 12px;
	}
	.price-wrap {
		text-align: right;
	}
	.city-btn a {
		font-size: 10px;
		border-radius: 8px;
		padding: 5px 3px;
		width: 100%;
	}
}

/* Mobile & tablet only */
@media (max-width: 991.98px) {
	/* anchor to the text column, not the whole card */
	.city-content-width {
		position: relative;
		padding-bottom: 130px;
	}

	.city-bottom {
		position: absolute;
		right: 0px;
		bottom: 0px;
		z-index: 3;
		border-radius: 12px;
		padding: 0px 12px;
		max-width: calc(100% - 24px);
	}
}

/* =============== New Hotel Details Page CSS START =============== */
.todays-deal {
	width: 100%;
	background: #24b6e5;
	padding: 20px 0px;
	border: 2px solid #00000066;
	border-radius: 12px;
}

.todays-deal h2 {
	color: #fff;
	font-size: 24px;
	font-weight: 600;
}

.todays-deal img {
	position: absolute;
	right: 14px;
	top: 40px;
	height: 45px;
	width: auto;
	transform: rotate(-35deg);
}

.rates-box {
	border: 1px solid #b9b9b9;
	background-color: #d2d2d2;
	border-radius: 16px;
	padding: 6px;
	margin-bottom: 16px;
}

.discount-rates {
	width: 100%;
	background: #fff;
	padding: 20px 0px;
	border: 2px solid #00000066;
	border-radius: 12px;
	text-align: center;
}

.discount-rates span {
	color: #000;
	font-size: 24px;
	font-weight: 600;
	text-align: center;
}

.discount-rates-tax {
	font-size: 14px !important;
	color: #6c757d !important;
}

.rates-date p {
	text-align: center;
	color: #ae184a;
	margin: 10px 0px;
	font-size: 14px;
}

.online-rates {
	width: 100%;
	background: #fff;
	padding: 20px 0px;
	border: 2px solid #00000066;
	border-radius: 12px;
	text-align: center;
}

.online-rates span {
	color: #666666;
	font-size: 24px;
	font-weight: 600;
	text-align: center;
}

.online-rates-tax {
	font-size: 14px !important;
	color: #000 !important;
}

.call-now {
	display: flex;
	width: 70%;
	background: #d7ea82;
	padding: 12px 0px;
	border: 2px solid #00000066;
	border-radius: 12px;
	justify-content: center;
	margin: 0 auto;
	/* Centers the button horizontally */
}

.call-now h2 {
	color: #000;
	font-size: 28px;
	font-weight: 600;
}

.call-now h2 i {
	background: #24b6e5;
	color: #000;
	border-radius: 100px;
	padding: 11px 14px;
	margin-right: 2px;
}

.call-now-details h4 {
	color: #676767;
	font-size: 18px;
	text-align: center;
	margin-bottom: 0px;
}

.call-now-details p {
	color: #676767;
	font-size: 14px;
	text-align: center;
	margin-bottom: 0px;
}

@media (max-width: 768px) {
	.call-now {
		width: 70%;
		/* wider on mobile */
		margin: 0 auto;
		/* ensure centering */
	}
}

.how-it-works {
	border: 1px solid #9979fd;
	background-color: #bbade81f;
	border-radius: 16px;
	padding: 16px;
}

/* =============== New Hotel Details Page CSS END =============== */
/* =============== CITY MAP VIEW LAYOUT CSS START =============== */
/* ===== Fullscreen wrapper ===== */
#mapViewSection {
	position: fixed;
	inset: 0;
	z-index: 9999;
	background: #fff;
	display: none;
}

#hotelMap {
	width: 100%;
	height: 100%;
}

/* ===== Close button (top-right) ===== */
.map-close-btn {
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 1001;
	background: #fff;
	border: 1px solid #d0d0d0;
	border-radius: 999px;
	padding: 8px 14px;
	font-weight: 600;
	cursor: pointer;
	box-shadow: 0 4px 12px rgba(0, 0, 0, .25);
}

.map-close-btn:hover {
	background: #0b4ea2;
	color: #fff;
}

/* ===== Move zoom controls to TOP-LEFT ===== */
.leaflet-top.leaflet-left {
	top: 12px;
	left: 12px;
}

/* ===== Hide Leaflet attribution (note: check OSM/Mapbox terms) ===== */
.leaflet-control-attribution {
	display: none !important;
}

/* anchor wrapper: makes the bubble's bottom center sit on the map point */
.price-pin{
  position: relative;
  left: 0; top: 0;
  /* center horizontally and lift the bubble by its height + pointer (6px) */
  transform: translate(-50%, calc(-100% - 6px));
}

/* Enhanced price marker with hover animation */
.price-marker {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 12px;
    min-height: 28px;
    background: #0b4ea2;
    color: #fff;
    font-weight: 700;
    font-size: 12px;
    line-height: 1;
    border-radius: 4px;
    white-space: nowrap;
    box-shadow: 0 2px 8px rgba(0,0,0,.25);
    cursor: pointer;
    transition: all 0.3s ease; /* Smooth transition for all properties */
}

/* Attractive hover effect */
.price-marker:hover {
    transform: scale(1.1) translateY(-5px); /* Scale up and lift slightly */
    box-shadow: 0 8px 25px rgba(11, 78, 162, 0.4); /* Enhanced shadow with brand color */
    background: linear-gradient(135deg, #0b4ea2, #0a3d7a); /* Subtle gradient on hover */
    z-index: 1000; /* Bring to front on hover */
}

/* Enhanced triangle with hover effect */
.price-marker::after {
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: -6px;
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 6px solid #0b4ea2;
    transition: border-top-color 0.3s ease; /* Smooth color transition for triangle */
}

/* Triangle hover effect */
.price-marker:hover::after {
    border-top-color: #0a3d7a; /* Darker triangle on hover */
}

/* Enhanced ground shadow with hover animation */
.price-marker::before {
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: -12px;
    width: 16px;
    height: 6px;
    border-radius: 50%;
    background: rgba(0, 0, 0, .18);
    filter: blur(1px);
    transition: all 0.3s ease; /* Animate shadow changes */
}

/* Shadow grows on hover to match lifted marker */
.price-marker:hover::before {
    width: 20px;
    height: 8px;
    background: rgba(0, 0, 0, .25);
    filter: blur(2px);
}


/* price bubble */
/* .price-marker{
  position: relative;                  
  display: inline-flex;
  align-items: center;
  justify-content: center;             
  padding: 0 12px;
  min-height: 28px;                   
  background:#0b4ea2;                  
  color:#fff;
  font-weight:700;
  font-size:12px;
  line-height:1;
  border-radius:4px;
  white-space:nowrap;
  box-shadow:0 2px 8px rgba(0,0,0,.25);
}
 */
 
/* .price-marker::after{
  content:"";
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  bottom:-6px;
  width:0; height:0;
  border-left:6px solid transparent;
  border-right:6px solid transparent;
  border-top:6px solid #0b4ea2;
} */

/* .price-marker::before {
	 
	content: "";
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	bottom: -12px;
	width: 16px;
	height: 6px;
	border-radius: 50%;
	background: rgba(0, 0, 0, .18);
	filter: blur(1px);
} */
/* ===== Bottom details panel (renamed to map-hotel-details) ===== */
.map-hotel-details {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 1000;
	background: #fff;
	box-shadow: 0 -6px 18px rgba(0, 0, 0, .18);
	display: none;
	padding: 16px 18px;
	margin: 100px;
    border-radius: 10px;
}

/* layout: image left, text right */
.map-hotel-details .details-wrap {
	display: flex;
	gap: 14px;
	align-items: flex-start;
}

.map-hotel-details .thumb {
    flex: 0 0 170px;
    width: 100%;
    height: 200px;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .12);
}

.map-hotel-details .thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.map-hotel-details .body {
	display: flex;
	flex-direction: column;
	gap: 5px;
}

.map-hotel-details h5 {
	margin: 0;
	font-size: 16px;
	font-weight: 700;
}

.map-hotel-details p {
	margin: 0;
	color: #444;
	font-size: 13px;
}

.map-hotel-details .price {
    font-weight: 800;
    margin-top: 4px;
    font-size: 20px;
}

/* inner close button on panel */
.details-close-btn {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 1;
    background: #fff;
    border: 1px solid #24b6e5;
    border-radius: 999px;
    padding: 6px 10px;
    font-size: 12px;
    cursor: pointer;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .15);
}

.details-close-btn:hover {
	background: #24b6e5;
	color: #fff;
}

@media (max-width: 768px) {
	.map-hotel-details {
	margin: 10px;
   }
   .map-hotel-details .details-wrap {
    align-items: center;
	}
}	
/* =============== CITY MAP VIEW LAYOUT CSS END =============== */
