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

*{
	scroll-behavior: smooth;
}

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

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

.fc-custom{
	color: #000;
}

p{
	font-size: 0.9em;
}

@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: #cc7c6e;
	transition: 0.3s all;	
}


/*link-custom*/
.link-custom-1 {
	display: inline-block;
	color: #cc7c6e;
	text-decoration: none;
}
.link-custom-1::after {
	content: '';
	display: block;
	width: 0;
	height: 2px;
	background: #cc7c6e;
	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);
} 


/*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: #cc7c6e;
	font-family: "GFS Didot", serif;
	padding: 8px 40px;
	text-transform: uppercase;
	border: none;
	color: #fff;
	letter-spacing: 2px;
}
@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: 150px;
	
}

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

/*text scroll css*/
.line-text-scroll{
	height: 100%;
	width: 1px;
	background-color: #cc7c6e;
	display: inline-block;
	position: absolute;
	top: 0;
	left: 25%;
}
.line-text-scroll-2{
	height: 100%;
	width: 1px;
	background-color: #cc7c6e;
	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: 30px;
}
.text-scroll-2{
	font-size:100px;
	position:relative;
	left:10px;
	white-space: nowrap;
	right: 81vw;
	font-family: "GFS Didot", serif;
	letter-spacing: 30px;
}
.text-scroll-3{
	font-size:100px;
	position:relative;
	left:10px;
	white-space: nowrap;
	right: 81vw;
	font-family: "GFS Didot", serif;
	letter-spacing: 30px;
}

@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: #cc7c6e!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: #cc7c6e!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 #cc7c6e;
}

#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;
    }
}