@import url('https://fonts.googleapis.com/css2?family=GFS+Didot&display=swap');

*{
	scroll-behavior: smooth;
}

a{
        color:  #CBDD9B !important;
        text-decoration: none !important;
    }

/*font*/
.ff-didot{
	font-family: "GFS Didot", serif;
	font-weight: 400;
	font-style: normal;
}

.fc-1{
	color: #1b1c21;
}
.fc-2{
	color:  #CBDD9B;
}
.fc-3{
	color: #292b331a;	
}

.fc-custom{
	color: #000;
}

p{
	font-size: 0.9em;
}
.fa.fa-plus, .fa.fa-minus {
  font-size: 14px;
}
@media (max-width: 768px){
	.fs-1{
		font-size: 0.8em!important;
	}

	.fc-custom{
		color: #fff;
	}
}

.hover-fc-2{
	color: #000;
	transition: 0.3s all;
}
.hover-fc-2:hover{
	color:  #CBDD9B;
	transition: 0.3s all;	
}


/*link-custom*/
.link-custom-1 {
	display: inline-block;
	color:  #CBDD9B;
	text-decoration: none;
}
.link-custom-1::after {
	content: '';
	display: block;
	width: 0;
	height: 2px;
	background:  #CBDD9B;
	transition: width .3s;
}
.link-custom-1:hover::after {
	width: 100%;
	transition: width .3s;
}

.link-custom-white {
	display: inline-block;
	color: #fff;
	text-decoration: none;
}
.link-custom-white::after {
	content: '';
	display: block;
	width: 0;
	height: 2px;
	background: #fff;
	transition: width .3s;
}
.link-custom-white:hover::after {
	width: 100%;
	transition: width .3s;
}

/*letter-spacing*/
.ls-1{
	letter-spacing: 2px;
}
.ls-2{
	letter-spacing: 4px;
}
.ls-3{
	letter-spacing: 6px;
}
.ls-4{
	letter-spacing: 8px;
}
.ls-5{
	letter-spacing: 10px;
}

/*background*/
.bg-1{
	background-color: #292b33;
}
.bg-2{
	background-color: #353843;
}

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


/*navbar*/
.navbar-brand{
	z-index: 9999;
}
.burger {
	z-index: 9999;
	display: flex;
	outline: none;
	height: 10px;
	width: 35px;
	border: 0px;
	padding: 0px;
	background: transparent;
	transition: all 250ms ease-out;
	cursor: pointer;
}

.burger:before, .burger:after {
	content: '';
	width: 35px;
	height: 2px;
	position: absolute;
	background: white;
	transition: all 250ms ease-out;
	will-change: transform;
}

.burger:before {
	transform: translateY(-5px);
}

.burger:after {
	transform: translateY(5px);
}

.active.burger:before {
	transform: translateY(0) rotate(45deg);
}

.active.burger:after {
	transform: translateY(0) rotate(-45deg);
} 

.parallax-2 {
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-position: center;
  width: 100%;
  height: 100%;
  margin: 0 auto;
  position: relative;
}
/*cursor*/
#cursor {
	position: fixed;
	top: -5px;
	left: -5px;
	width: 0px;
	height: 0px;
	background-color: white;
	border-radius: 50%;
	pointer-events: none;
	z-index: 9999999 !important;
}

#cursor-border {
	--size: 50px;
	position: fixed;
	top: calc(var(--size) / -2);
	left: calc(var(--size) / -2);
	width: var(--size);
	height: var(--size);
	border-radius: 50%;
	box-shadow: 0 0 0 1px white;
	pointer-events: none;
	transition: top 0.15s ease-out, left 0.15s ease-out, width 0.15s ease-out,
	height 0.15s ease-out, background-color 0.15s ease-out;
	z-index: 99999999 !important;
}


/*parallax*/
.parallax-1 p{
	line-height: 2.3;
	padding: 10px 9%;
}

.parallax-1 a{
	z-index: 9999; 
	position: relative;
}

/*booking widget*/
.border-right-1{
	border-right: 1px solid #fff;
}
.adult-quantity .input-adult{
	border: none;
	background-color: transparent;
	color: #fff;
	pointer-events: none;
	font-size: 1.5rem;
	text-align: center;
	padding: 0 10px;
	width: 5.5rem;
}
.children-quantity .input-children{
	border: none;
	background-color: transparent;
	color: #fff;
	pointer-events: none;
	font-size: 1.5rem;
	text-align: center;
	padding: 0 10px;
	width: 5.5rem;
}
.btn-book{
	background-color:  #CBDD9B;
	font-family: "GFS Didot", serif;
	padding: 8px 40px;
	text-transform: uppercase;
	border: none;
	color: #fff;
	letter-spacing: 2px;
}

.footer_middle h5 {
    letter-spacing: 4px;
    font-family: "GFS Didot", serif;
    font-weight: 400;
    font-style: normal;
	text-transform: uppercase;
}

button, input, optgroup, select, textarea {
   
    font-family: inherit;
    line-height: inherit;
    background: none;
    border: none;
    border-bottom: 1px solid white;
    padding: 9px 0px;
    color: #fff;
    width: 100%;
    font-size: 20px;
    margin: 10px 5px;
}
button, input::placeholder, optgroup::placeholder, select::placeholder, textarea::placeholder {
  color: #fff;
  opacity: 1; /* Overrides default transparency in Firefox */
}
input:active, optgroup:active, select:active, textarea:active, input:focus-visible, optgroup:focus-visible, select:focus-visible, textarea:focus-visible  {
   	border: none;
	border-bottom: 1px solid white;
	border-radius: 0;
}
.wpcf7-submit {
    width: auto;
    border: none;
    color:  #CBDD9B;
    text-transform: uppercase;
    font-weight: bold;
    letter-spacing: 2px;
}
.wpcf7 input[type="date"]::-webkit-calendar-picker-indicator {
  filter: invert(1);
}
.wpcf7 input:focus,
.wpcf7 textarea:focus,
.wpcf7 select:focus {
  outline: none;
  box-shadow: none;
  border: none;
}
@media (max-width: 768px){
	.border-right-1{
		border-right: none;
	}
	.adult-quantity .input-adult{
		border: none;
		background-color: transparent;
		color: #fff;
		pointer-events: none;
		font-size: 14px;
		text-align: center;
		padding: 0 10px;
		width: 5.5rem;
	}
	.children-quantity .input-children{
		border: none;
		background-color: transparent;
		color: #fff;
		pointer-events: none;
		font-size: 14px;
		text-align: center;
		padding: 0 10px;
		width: 5.5rem;
	}
}


/*general*/
.logo-header{
	max-width: 200px;
	
}

@media (max-width: 768px){
	.logo-header{
		max-width: 100px;
		
	}
}

/*text scroll css*/
.line-text-scroll{
	height: 100%;
	width: 1px;
	background-color:  #CBDD9B;
	display: inline-block;
	position: absolute;
	top: 0;
	left: 25%;
}
.line-text-scroll-2{
	height: 100%;
	width: 1px;
	background-color:  #CBDD9B;
	display: inline-block;
	position: absolute;
	top: 0;
	left: 50%;
}
.text-scroll{
	font-size:150px;
	position:relative;
	left:10px;
	white-space: nowrap;
	right: 81vw;
	font-family: "GFS Didot", serif;
	letter-spacing: 10px;
}
.text-scroll-2{
	font-size:60px;
	position:relative;
	left:80%;
	white-space: nowrap;
	right: 81vw;
	font-family: "GFS Didot", serif;
	letter-spacing: 10px;
}
.text-scroll-3{
	font-size:100px;
	position:relative;
	left:10px;
	white-space: nowrap;
	right: 81vw;
	font-family: "GFS Didot", serif;
	letter-spacing: 10px;
}

@media (max-width: 768px){
	.text-scroll{
		font-size:50px;
		position:relative;
		left:10px;
		white-space: nowrap;
		right: 81vw;
		font-family: "GFS Didot", serif;
		letter-spacing: 30px;
	}
	.text-scroll-2{
		font-size:50px;
		position:relative;
		left:10px;
		white-space: nowrap;
		right: 81vw;
		font-family: "GFS Didot", serif;
		letter-spacing: 30px;
	}
	.text-scroll-3{
		font-size:50px;
		position:relative;
		left:10px;
		white-space: nowrap;
		right: 81vw;
		font-family: "GFS Didot", serif;
		letter-spacing: 30px;
	}
}

/*home css*/
#home #section-2:before{
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 50%;
	margin-top: -1px;
	background-color: #292b33;
}
#home .sliderRoom .swiper-pagination .swiper-pagination-bullet-active{
	background-color:  #CBDD9B!important;
	width: 15px!important;
	height: 15px!important;
	vertical-align: middle;
}
#home .sliderRoom .swiper-pagination .swiper-pagination-bullet{
	background-color: #8C7E72;
	width: 10px;
	height: 10px;
}
.img-room{
  aspect-ratio: 1.85/ 1;
}
#home .img-offer{
	aspect-ratio: 4/3;
}
@media (max-width: 768px){
	.img-room{
		aspect-ratio: 8/12;
	}
	#home .img-offer{
		aspect-ratio: 8/12;
	}
}

#home .section-3:before{
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 40%;
	background-color: #292b33;
}
@media (max-width: 768px){
	#home .section-3:before{
		content: "";
		position: absolute;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 50%;
		background-color: #292b33;
	}
}
#home .sliderExperience .swiper-pagination-2 .swiper-pagination-bullet-active{
	background-color:  #CBDD9B!important;
	width: 10px!important;
	height: 10px!important;
}
#home .sliderExperience .swiper-pagination-2 .swiper-pagination-bullet{
	background-color: #fff;
	width: 10px;
	height: 10px;
}
#home .pagination-slider-experience{
	margin-top: -25px;
}
#home .sliderReview .btn-prev-1 span, #home .sliderReview .btn-next-1 span{
	width: 40px; 
	height: 40px; 
	display:inline-block;
	border: 1px solid  #CBDD9B;
}

#home .section-5:before{
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 75%;
	height: 75%;
	margin-top: -1px;
	background-color: #353843;
	z-index: -1;
}
#home .img-story{
	width: 100%;
	height: 100%;
}
#home .img-villas{
	width: 0;
	height: 100%;
	transition: 0.3s ease-out;
}
@media (max-width: 768px){
	#home .img-story{
		width: 80%;
		height: 100%;
	}
	#home .img-villas{
		width: 0;
		height: 100%;
		transition: 0.3s ease-out;
	}	
	#home .section-5 .fs-5{
		font-size: 12px!important;
	}
}
.px-custom {
    padding-right: 10% !important;
    padding-left: 10% !important;
}

@media (min-width: 992px) {
    .pl-custom {
        padding-left: 13% !important;
    }
}
.element-img {
    /* Default styles for screens above 768px */
    aspect-ratio: 1/1;
    height: 90vh;
}

@media (max-width: 768px) {
    .element-img {
        /* Styles for screens 768px and below */
        aspect-ratio: 16/9;
        height: 29vh;
    }
}