/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 1.0.1
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/*
    Add your custom styles here
*/
a:hover {
	text-decoration: none !important;
}

body {
	position: relative;
}

.nav-main-menu {
	position: absolute !important;
    left: 0;
    right: 0;
    top: 0 !important;
	background-color: rgba(255, 255, 255, .3) !important;
}

.nav-main-menu-sticky {
	display: none !important;
}

.nav-main-menu-sticky.elementor-sticky--effects {
	display: flex !important;
	position: fixed !important;
	width: 100% !important;
	background-color: rgba(255, 255, 255, 1) !important;
}

.nav-main-menu:hover {
	background-color: #FFFFFF !important;
}

.nav-menu-ver2.elementor-sticky--effects {
	position: fixed !important;
	top: 0 !important;
	z-index: 99;
}

/* .slide-hotels .swiper-slide-active {
	transform: scale(1.1);
	z-index: 1;
} */

/* .slide-hotels .swiper-slide-prev, .slide-hotels .swiper-slide-next {
	transform: scale(.95);
} */

@media (min-width: 1400px) {
	.video-hero .elementor-video {
		height: 100vh !important;
		object-position: bottom;
	}

	.video-hero.elementor-widget-video .elementor-wrapper {
		aspect-ratio: unset;
		margin-top: -85px;
	}
}

.scroll-section {
  scroll-margin-top: 80px;
}

.resort-slide.elementor-pagination-position-outside .swiper {
	padding-bottom: 5px !important;
}

.room-slide .swiper-pagination {
	bottom: 10px !important;
}
/* end theme website */


/* engine booking */
.engine-box {
	padding: 20px 0;
	background-color: #0C78BE;
}

#frmbooking {
	background-color: transparent;
	padding: 0;
}

.engine-box #frmbooking .form-group {
	padding: 0 1rem;
}

.engine-box #frmbooking .form-group.promotion-code {
	padding-right: 25px;
}

.engine-box #frmbooking select option {
	background-color: #ffffff !important;
	color: #000000;
}

.engine-box #frmbooking select option:default,
.engine-box #frmbooking select option:hover,
.engine-box #frmbooking select option:focus,
.engine-box #frmbooking select option:checked {
	background-color: #000000 !important;
	color: #ffffff;
}

.box_booking_home ::placeholder {
	color: #fff !important;
}

.engine-box #frmbooking .engine-button {
	border-right: none;
}

.engine-box #frmbooking .engine-button .btn-booking {
	font-family: "Zalando Sans", Sans-serif;
}

.bor-r {
	border-right: 2px solid #FFFFFF;
}

.engine-box #frmbooking label {
	display: block;
	clear: both;
	font-size: 11px;
	letter-spacing: 0.5px;
	text-transform: none;
	color: #FFFFFF;
	font-weight: 400;
	padding-left: 0;
	font-family: "Zalando Sans", Sans-serif;
}

.engine-box #frmbooking .form-control {
	padding: 0;
	font-family: "Zalando Sans", sans-serif;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 1px;
	color: #FFFFFF;
	height: auto;
	border: none;
	box-shadow: none;
	border-radius: 0;
	width: 100%;
	display: block;
	position: relative;
	z-index: 1;
	background: transparent;
	border: none;
	cursor: pointer;
}

.engine-box #frmbooking .form-control.spin {
	font-size: 15px;
}

.engine-box #frmbooking .chk-in {
  position: relative;
}

.engine-box #frmbooking .engine-button .btn-booking {
  width: 100%;
  height: 100%;
  margin: 0 auto;
  display: block;
  cursor: pointer;
  background-color: #FFFFFF;
  font-size: 16px !important;
  color: #0C78BE;
  font-weight: 600;
  border: none;
  border-radius: 0;
/*   text-transform: uppercase; */
  -webkit-transition: all .3s linear;
  -moz-transition: all .3s linear;
  -ms-transition: all .3s linear;
  -o-transition: all .3s linear;
  transition: all .3s linear;
}

.engine-box #frmbooking .engine-button .btn-booking:focus {
  outline: none;
}

.engine-box #frmbooking .engine-button .btn-booking:hover {
  background-color: #000000;
  color: #FFFFFF;
}

.promotion_home input::placeholder {
  color: #fff;
  opacity: 1;
}

.engine-box #frmbooking .chk-in .etmDateRange {
  position: relative;
}

.colm-1 {
	-ms-flex: 0 0 50%;
	flex: 0 0 50%;
	max-width: 50%;
}

.colm-2 {
	-ms-flex: 0 0 100%;
	flex: 0 0 100%;
	max-width: 100%;
}

.colm-3 {
	-ms-flex: 0 0 50%;
	flex: 0 0 50%;
	max-width: 50%;
}

.engine-resort .hotel-select.colm-4 {
	-ms-flex: 0 0 100%;
	flex: 0 0 100%;
	max-width: 100%;
}

#engine-header-fixed {
	position: fixed;
    top: 59px !important;
	width: 100% !important;
    left: 0;
    z-index: 1;
}

#engine-header-demo1 {
	position: fixed;
	top: 107px !important;
	width: 100% !important;
    left: 0;
    z-index: 4;
}

#btn-reserve-head a {
	cursor: pointer;
	color: #0C78BE !important;
}

#btn-reserve-head a:hover {
	color: #FFF !important;
}

@media (min-width: 798px) {
	#engine-header-fixed {
		top: 196px !important;
	}
}

@media (min-width: 992px) {
	#engine-header-fixed {
		top: 176px !important;
	}
	
	#engine-header-fixed.engine-sticky-active {
		top: 67px !important;
	}
	
	#engine-header-demo1.engine-sticky-active {
		top: 87px !important;
	}
	
	.colm-1 {
		-ms-flex: 0 0 15.5%;
		flex: 0 0 15.5%;
		max-width: 15.5%;
	}
	
	.colm-2 {
		-ms-flex: 0 0 18.5%;
		flex: 0 0 18.5%;
		max-width: 18.5%;
	}

	.colm-3 {
		-ms-flex: 0 0 23.5%;
		flex: 0 0 23.5%;
		max-width: 23.5%;
	}
	
	.engine-resort .hotel-select.colm-4 {
		-ms-flex: 0 0 28%;
		flex: 0 0 28%;
		max-width: 28%;
	}
	
	.engine-resort .colm-3 {
		-ms-flex: 0 0 19%;
		flex: 0 0 19%;
		max-width: 19%;
	}
	
	.engine-resort .colm-2 {
		-ms-flex: 0 0 11%;
		flex: 0 0 11%;
		max-width: 11%;
	}
	
	.engine-resort .colm-1 {
		-ms-flex: 0 0 11%;
		flex: 0 0 11%;
		max-width: 11%;
	}
	
	.engine-resort #frmbooking .form-group {
		padding: 0 1rem;
	}
	
	.engine-resort #frmbooking .engine-button, .engine-box #frmbooking .engine-button {
		padding: 0
	}
	
	.engine-resort .hotel-select.colm-3, .engine-resort .hotel-select.colm-4 {
		border-right: 2px solid #000;
	}
}

@media screen and (max-width: 545px) {
	.colm-1, .colm-2, .colm-3 {
		-ms-flex: 0 0 100%;
		flex: 0 0 100%;
		max-width: 100%;
	}
}

@media screen and (max-width: 991px) {
	.engine-box .form-row {
		flex-wrap: wrap;
	}
	
	.engine-box #frmbooking .form-group {
		margin-bottom: 1rem;
	}
	
	.chk-out-home.bor-r {
		border: none;
	}
	
	.engine-box #frmbooking .form-group.engine-button {
		margin-bottom: 0;
	}

	.engine-box #frmbooking .engine-button .btn-booking {
		padding: 0 .4rem;
		height: 50px;
	}
}

@media screen and (max-width:767px) {
	
	.check-availability .availability-form .awe-calendar-wrapper {
		width: 100% !important;
    	margin: 0
	}

	.engine-box #frmbooking label {
		margin-top: 0px;
		margin-bottom: 6px;
		font-size: 14px
	}

	.engine-box #frmbooking .engine-button .btn-booking {
    	width: 100%;
	}

	.engine-box #frmbooking .form-control {
		font-size: 16px;
		padding: 0;
		height: 35px;
	}

	.engine-box #frmbooking .chk-in::after {
		background-size: 24px;
		bottom: 25px;
		right: 15px;
		width: 24px;
		height: 24px;
	}

	.engine-box #frmbooking .engine-button .btn-booking {
		padding: 15px 15px;
		height: 50px;
		font-size: 12px;
	}
	
	#engine-header-demo1 {
		top: 88px !important;
	}
}

@media screen and (max-width: 545px) {
	.bor-r {
		border: none;
	}
	
	.bor-b {
		border-bottom: 1px solid #FFF !important;
	}
	
	.engine-box #frmbooking .form-group {
		padding: 0;
	}
	
	.engine-box {
		padding: 15px 20px;
	}
}

/* engine blue */
.engine-box.engine-resort {
	width: 100%;
	background-color: #0C78BE;
}

.engine-box.engine-resort #frmbooking label, .engine-box.engine-resort #frmbooking .form-control {
	color: #FFFFFF;
}

.engine-box.engine-resort .select-button .btn-link {
	color: #FFFFFF;
}

.engine-box.engine-resort .bor-r, .engine-box.engine-resort .bor-b {
	border-color: #FFFFFF;
}

.engine-box.engine-resort .custom-select-trigger:after {
	border-bottom: 1px solid #FFFFFF;
    border-right: 1px solid #FFFFFF;
}

.engine-box.engine-resort #frmbooking .engine-button .btn-booking {
	background-color: #FFFFFF;
	color: #0C78BE;
}

.engine-box.engine-resort #frmbooking .engine-button .btn-booking:hover {
	background-color: #d4e9ff;
	color: #000000;
}

@media (min-width: 1400px) {
	.engine-box.engine-resort {
		width: 1300px !important;
		margin: 0 auto;
	}
}

@media (min-width: 1500px) {
	.engine-box.engine-resort {
		width: 1400px !important;
	}
	
	#engine-header-demo1 .engine-box.engine-resort {
		width: 100% !important;
	}
}

/** Custom Select **/
.custom-select-wrapper select {
	display: none;
}

.custom-select {
	position: relative;
	display: inline-block;
	z-index: 9999 !important;
}

.custom-select-trigger {
	position: relative;
	display: block;
	width: 100%;
	cursor: pointer;
}

.custom-select-trigger:after {
	position: absolute;
	display: block;
	content: '';
	width: 10px;
	height: 10px;
	top: 50%;
	right: 0;
	margin-top: -3px;
	border-bottom: 1px solid #000000;
	border-right: 1px solid #000000;
	transform: rotate(45deg) translateY(-50%);
	transition: all .3s ease-in-out;
	transform-origin: 50% 0;
}

.custom-select.opened .custom-select-trigger:after {
	margin-top: 3px;
	transform: rotate(-135deg) translateY(-50%);
}

.custom-options {
	position: absolute;
	display: block;
	top: 100%;
	left: 0;
	right: 0;
	min-width: 100%;
	margin: 0 0;
	box-shadow: 0 2px 1px rgba(0, 0, 0, .07);
	background: #ffffff;
	transition: all .3s ease-in-out;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transform: translateY(-15px);
	z-index: 100000;
}

.custom-select.opened .custom-options {
	opacity: 1;
	visibility: visible;
	pointer-events: all;
	transform: translateY(0);
}

.custom-options:before {
	position: absolute;
	display: block;
	content: '';
	bottom: 100%;
	right: 25px;
	width: 7px;
	height: 7px;
	margin-bottom: -4px;
	border-top: 1px solid #ffffff;
	border-left: 1px solid #ffffff;
	background: #ffffff;
	transform: rotate(45deg);
	transition: all .3s ease-in-out;
}

.custom-option {
	position: relative;
	display: block;
	padding: 13px 15px;
	border-bottom: 1px solid #c3c3c3;
	color: #000000;
	font-size: 13px;
    font-weight: normal;
	line-height: 21px;
	cursor: pointer;
	transition: all .4s ease-in-out;
}

.custom-option:last-of-type {
	border-bottom: 0;
}

.custom-option:hover, .custom-option.selection {
	background: #000000;
	color: #FFFFFF;
}
/* End Custom Select */

/* QTY Custom */
.select-form {
	position: relative;
}

.quantity-control {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: fit-content;
	margin: 0 auto;
	background: #eaeaea;
	border-radius: 10px;
	padding: 1rem 0.4rem;
	margin-top: 4rem;
}

.adults-select .input-group {
	flex-wrap: nowrap;
}

.select-button .btn-link {
	background: none;
    color: #FFFFFF;
    font-size: 22px;
    font-weight: 300;
    text-decoration: none;
	border-radius: 0;
    border: none !important;
    height: 15px;
    width: 5px;
    padding: 5px 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.select-button .btn-link:hover {
	color: #f3f3f3;
}

/* End QTY Custom */


.daterangepicker.show-calendar {
  z-index: 99999999 !important;
}

@media (min-width:1200px) {
  .booking-wrapper {
    max-width: 1200px;
    margin: auto;
  }
}

/* calendar style */
.mobile-bottom-sticky-calendar {
  z-index: 100000000 !important;
  padding: 30px 0;
}

.daterangepicker td.active,
.daterangepicker td.active:hover {
  background-color: #000000 !important
}

.daterangepicker .calendar-table .next span,
.daterangepicker .calendar-table .prev span {
  color: #333;
  border: solid #333;
  border-width: 0 2px 2px 0;
  border-radius: 0;
  display: inline-block;
  padding: 3px
}

.mobile-bottom-sticky-calendar .show_summary_mobile {
  background-color: #b3b1b1;
  color: #fff;
  border: 1px solid #b3b1b1 !important
}

.mobile-bottom-sticky-calendar .show_summary_mobile:hover {
  background-color: #b3b1b1
}

.mobile-bottom-sticky-calendar .mobile-continute-checkout {
  background-color: #000000 !important;
  border: 1px solid #000000 !important
}

.mobile-bottom-sticky-calendar .mobile-continute-checkout:hover {
  background-color: #686868 !important
}

.daterangepicker .calendar-table tr:first-child th {
  background-color: #f1f1f1 !important
}

#ui-datepicker-div {
  display: none !important
}

.daterangepicker .calendar-table td,
.daterangepicker .calendar-table th {
  	padding: 0 0;
	font-family: "Zalando Sans", Sans-serif;
}

@media only screen and (min-width:992px) {
  .daterangepicker .calendar-table table thead tr:first-child th {
    background-color: #000000 !important;
    color: #fff !important;
    height: 35px;
    line-height: 35px
  }

  .daterangepicker .calendar-table .next span,
  .daterangepicker .calendar-table .prev span {
    color: #fff;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    border-radius: 0;
    display: inline-block;
    padding: 3px
  }
}

@media only screen and (max-width:991px) {
  .mobile-bottom-sticky {
    display: none !important;
  }

  .daterangepicker .mobile-calendar-header {
    background-color: #000000 !important
  }

  .daterangepicker .mobile-calendar-header .check-in .date-check-title,
  .daterangepicker .mobile-calendar-header .check-out .date-check-title {
    color: #000000;
    font-size: 14px
  }

  .daterangepicker .mobile-calendar-header p {
    color: #fff
  }

  .daterangepicker .mobile-calendar-header .main-title {
    font-size: 16px;
    color: #fff
  }

  .daterangepicker .calendar-table td,
  .daterangepicker .calendar-table th {
    height: 35px;
    line-height: 35px;
    font-size: 14px
  }

  .daterangepicker .mobile-calendar-header .check-in .date,
  .daterangepicker .mobile-calendar-header .check-out .date {
    font-size: 41px !important
  }

  .daterangepicker .mobile-calendar-header .check-in .date-check-title,
  .daterangepicker .mobile-calendar-header .check-out .date-check-title {
    color: #fff !important;
    margin-bottom: 15px !important
  }
}