@import url('https://fonts.googleapis.com/css2?family=Philosopher:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Comfortaa:wght@300;400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Dancing+Script:wght@400;500;600;700&display=swap');

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

.ff-primary {
	font-family: 'Philosopher', sans-serif;
}

.ff-secondary {
	font-family: 'Comfortaa', cursive;
}

.ff-trinary {
	font-family: 'Dancing Script', cursive;
}

.text-justify {
	text-align: justify;
}


/*========================================SECTION NAVBAR*/
.navbar .nav-link {
	color: #fff;
	/*border: 2px solid #fff;*/
	padding: 15px 20px !important;
	font-size: 1.2rem;
}

.nav-img-xl {
	display: block;
	margin: 0 auto;
	height: 12vh;
	transition: all 0.6s ease-out;
}

.nav-img-sm {
	display: block;
	margin: 0 auto;
	height: 10vh;
	transition: all 0.6s ease-out;
}

.nav-active {
	background-color: #a1782d;
	box-shadow: 1px 12px 25px 2px rgba(0,0,0,0.51);
	transition: all 0.6s ease-out;
}

.left, 
.right {
	width: 10%;
}

.left a {
	display: inline;
	float: left;
}

.right a {
	display: inline;
	float: right;
}

@media (min-width: 768px) {
	.navbar .nav-link {
		color: #fff;
		border: 2px solid #fff;
		padding: 15px 20px !important;
		font-size: 0.8rem;
	}
}

/*======================================== TUTUP SECTION NAVBAR*/
#hero .swiper {
	height: 100vh;
	color: #fff;
}

#hero .hero-banner {
	height: 100vh;
	width: 100vw;
	background-color: rgb(37 37 37 / 30%);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	font-family: 'Philosopher', sans-serif;
}


.hero-banner .banner-text {
	font-size: 3rem; 
	font-weight: bold;
	padding: 0 10px;
	line-height: 3rem;
	text-align: center;
}

.banner-text span {
	font-size: 3rem; 
	font-weight: lighter;
}

.hero-slide.swiper-slide {
	background-size: cover !important;
	background-position: center !important;
	background-repeat: no-repeat !important;
}

/*======================================== SECTION HERO*/

#heroVideo {
	width: 100%;
	height: 100vh;
	object-fit: cover;
}

.row.hero-banner {
	height: 100vh;
	width: 100%;
	align-items: center;
	margin: 0;
	font-family: 'Philosopher', sans-serif;
	font-size: 3rem;
	position: relative;
}

.sc-down {
    position: absolute !important;
    bottom: 5%;
    color: #fff;
    width: 100%;
    /*width: auto;*/
    display: flex;
    justify-content: center;
}
.scroll-down:before {
    border: 2px solid white;
    border-width: 0px 0 4px 4px;
    content: "";
    display: block;
    height: 20px;
    left: calc(50% - 10px);
    position: absolute;
    top: calc(50% - 8px);
    transform: rotate(-45deg);
    width: 20px;
}

.sc-down a {
	color: #fff;
}

.sc-down a:hover {
	color: #fff;
}

.scroll-down {
    animation: bounce 1s infinite alternate;
 		-webkit-animation: bounce 1s infinite alternate;
}
@keyframes bounce {
  from {
    transform: translateY(0px);
  }
  to {
    transform: translateY(-15px);
  }
}
@-webkit-keyframes bounce {
  from {
    transform: translateY(0px);
  }
  to {
    transform: translateY(-15px);
  }
}


@media (min-width: 768px) {
	.row.hero-banner {
		font-size: 4rem;
		line-height: 3rem;
	}
}

/*======================================== TUTUP SECTION HERO*/



/*======================================== WELCOME SECTION*/

.title {
	font-family: 'Philosopher', sans-serif;
	font-size: 3rem;
	line-height: 3rem;
}

.title-3 {
	font-family: 'Philosopher', sans-serif;
	font-size: 3rem;
	line-height: 3rem;
}

.welcome-img {
	width: 190px;
    margin: 0 auto;
    display: block;
}

.welcome-info {
	list-style: none;
	text-align: center;
}

.welcome-info li {
	padding: 10px 0;
}

.welcome-info a {
	text-decoration: none;
	color: #000;
}

.line {
	background: black;
    width: 1px;
    height: 100%;
}

@media (min-width: 768px) {
	.title {
		font-family: 'Philosopher', sans-serif;
		font-size: 3.5rem;
		line-height: 3.5rem;
	}
}
/*======================================== TUTUP WELCOME SECTION*/


/*======================================== HOME SECTION*/
#home-accommodations .swiper {
	height: 70vh;
	color: #fff;
}

#home-accommodations .acco-banner {
	height: 70vh;
	width: 100vw;
	background-color: rgb(37 37 37 / 45%);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 0 10%;
}

.acco-banner {
	font-size: 2rem;
}

.acco-banner .banner-text {
	font-size: 1rem;  
	/*padding: 0 20%;*/
}


.acco-slide.swiper-slide {
	background-size: cover !important;
	background-position: center !important;
	background-repeat: no-repeat !important;
}

.disco-link {
	text-decoration: none;
	color: #fff;
	border: 2px solid #fff;
	padding: 10px;
	font-size: 1rem;
}

.disco-link:hover {
	background-color: #a1782d;
	transition: all 1s ease-out;
}

.disco-link2 {
	text-decoration: none;
	display: inline-block;
	color: #252525;
	border: 2px solid #252525;
	padding: 15px 30px;
	font-size: 1rem;
}

.disco-link2:hover {
	background-color: #a1782d;
	border: 2px solid #a1782d;
	transition: all 1s ease-out;
	color: #fff;
}

@media (min-width: 768px) {
	.acco-banner .banner-text {
		font-size: 1rem;  
		padding: 0 20%;
	}

	.title-3 {
		font-family: 'Philosopher', sans-serif;
		font-size: 3rem;
		line-height: 5rem;
	}
}
/*======================================== TUTUP HOME ACCOMMODATION SECTION*/





/*======================================== TUTUP HOME RESTAURANT SECTION*/
.rest-img img {
	/*width: 100%;
	height: 50vh;
	object-fit: cover;
	padding: 55px;*/

	/*width: 100%;
    height: 35vh;
    object-fit: cover;
    padding: 20px 80px;
    transition: all 1s ease-out;*/
}

.rest-img .swiper-slide img {
	width: 100% !important;
	height: 50vh !important;
	object-fit: cover;
	object-position: center;
	padding: 30px;
}

.rest-des {
	/*padding-left: 15%;*/
}

.rest-ul {
	list-style: none;
	padding: 0 !important;
}

.rest-link {
	cursor: pointer;
	margin: 10px auto;
	font-family: 'Philosopher', sans-serif;
	font-size: 2rem;
	font-weight: lighter;
}

.rest-link:hover {
	color: #a1782d;
}

.slide-nav-dining{
    width: 15%;
    position: absolute;
    z-index: 1;
    bottom: 70px;
    right: 10%;
}

.slide-nav-dining-m{
    width: 25%;
    position: absolute;
    z-index: 1;
    bottom: 70px;
    right: 10%;
}

@media (min-width: 768px){
	/*.rest-img img {
		width: 35vw;
	    height: 75vh;
	    object-fit: cover;
	    padding: 30px;
	    transition: all 1s ease-out;
	}*/

	/*.myDining .swiper-slide {
		width: 30vw !important;
		height: 75vh;
	}*/

	.rest-img .swiper-slide img {
		/*width: 30vw !important;*/
		height: 75vh !important;
		object-fit: cover;
		object-position: center;
		padding: 30px;

	}

	.rest-des {
		padding-left: 0;
	}
}

/*@media (min-width: 992px){
	.rest-img img {
		width: 35vw;
	    height: 75vh;
	    object-fit: cover;
	    padding: 55px 10px;
	    transition: all 1s ease-out;
	}

	.rest-des {
		padding-left: 10%;
	}
}*/

/*======================================== TUTUP HOME RESTAURANT SECTION*/


/*======================================== HOME SPA SECTION*/

#home-spa .spa-img img {
	width: 100%;
	height: 50vh;
    object-fit: cover;
    padding: 15px 0px;
}

.slide-nav-wellness{
    width: 15%;
    position: absolute;
    z-index: 1;
    bottom: 70px;
    left: 10%;
}

.slide-nav-wellness-m{
    width: 25%;
    position: absolute;
    z-index: 1;
    bottom: 70px;
    left: 10%;
}

@media (min-width: 768px){
	#home-spa .spa-des {
		padding-right: 15%
	}

	#home-spa .swiper-slide img {
		/*width: 30vw;*/
		height: 75vh;
		object-fit: cover;
		padding: 30px;;
	}
}
/*======================================== TUTUP HOME SPA SECTION*/

/*======================================== HOME EVENT SECTION*/
#home-event .swiper {
	 width: 100%;
     height: 100%;
}
#home-event .swiper-slide {
	height: 50vh;
	display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    /*padding-left: 20px;*/
    background-size: cover !important;
    background-position: center !important;
    cursor: pointer;
}

#home-event .swiper-slide img {
	display: block;
	height: 55vh;
    width: 100%;
    object-fit: cover;
}

#home-event .swiper-button-next,
#home-event .swiper-button-prev {
	color: #000;
}

#home-event .row {
	margin: 5% 0;
}

#home-event .swiper-button-next{
    right: unset;
    left: 85px;
}

#home-event .m-event {
	display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0 12%;
}

#home-event .cover-1 {
	height: 100%;
	width: 95%;
	position: relative;
	background-size: cover !important;
	background-position: center !important;
}

#home-event .cover-2 {
	height: 100%;
	width: 100%;
	background: #25252599;
	position: relative;
}

.cover-1 .content {
	position: absolute;
	bottom: 0;
	right: 0;
	top: 0;
	margin: auto;
	/*padding: 0 4em;*/
	z-index: 2;
	height: 3em;
	transition: all .2s ease;
	color: #fff;
	text-align: center;
}

.title-4 {
	font-family: 'Philosopher', sans-serif;
	font-size: 2rem;
	line-height: 2.6rem;
}

.cover-1:hover .content {
	height: 15em;
	transition: all .2s ease;
}

.content h2 {
	font-size: 2em;
	font-weight: normal;
	margin: 0 0 5px 0;
}

.content .description {
	height: 0;
	opacity: 0;
	visibility: hidden;
	margin: 5px;
	line-height: 1.5em;
	
}

.cover-1:hover .description{
	/*height: 3em;*/
	opacity: 1;
	visibility: visible;
	transition: all .2s ease;
}

.cover-1 .description .link {
	height: 1.5em;
	line-height: 1.5;
	transition: all .2s ease;
	display: block;
	font-size: 0.85em;
	font-style: italic;
}

.description ul {
	list-style: none;
	padding: 0;
}

.description li {
	padding: 5px 0px !important;
}

.description li a{
	text-decoration: none;
	color: #fff;
}

.line-2 {
	display: block;
	height: 5px;
	width: 100px;
	background-color: #a1782d;
	margin: 0 auto;
}

@media (min-width: 768px) {
	#home-event .swiper-slide {
		height: 70vh;
	}

	.title-4 {
		font-family: 'Philosopher', sans-serif;
		font-size: 2.5rem;
		line-height: 2.6rem;
	}
}



/*========================================================*/

.slick-offers .offers-content{
	background-color: white; 
	height: 60vh; 
	width: 100%; 
	margin: 0 10px;
}

.slick-offers .slick-list{
	padding: 0 !important;
}

.offers-cover-sm {
	height: 100%;
    width: 100%;
    background: rgb(37 37 37 / 28%);
    position: relative;
}

.offers-cover-sm .content {
	position: absolute;
	bottom: 0;
	right: 0;
	top: 0;
	margin: auto;
	padding: 0 2em;
	z-index: 2;
	height: 3em;
	transition: all .2s ease;
	color: #fff;
	text-align: center;
}

.offers-cover-sm .content .description {
	height: 0;
	opacity: 0;
	visibility: hidden;
	margin: 5px;
	line-height: 1.5em;
	
}
.offers-cover-sm:hover .content {
	height: 15em;
	transition: all .2s ease;
}

.offers-cover-sm:hover .description{
	height: 3em;
	opacity: 1;
	visibility: visible;
	transition: all .2s ease;
}

.disco-link3 {
	text-decoration: none;
	display: inline-block;
	color: #fff;
	border: 2px solid #fff;
	padding: 8px 30px;
	font-size: 1rem;
}




@media (min-width: 768px){
	.slick-offers .offers-content{
		height: 35vh; 
		margin: 0 10px;
	}

	.slick-offers .slick-list{
		padding: 0 20% 0 20%!important;
	}
	.slick-offers .slick-slide{
		opacity: .2;
		/*visibility: hidden;*/
	}
	.slick-offers .slick-slide.slick-current{
		visibility: visible;
	}

	.slick-offers .slick-slide.slick-active{
		opacity: 1!important;
	}
	.slick-offers .slick-prev,
	.slick-offers .slick-next{
		font-size: 48px;
		color: #a1782d;
		width: unset;
		height: unset;
		z-index: 2;
	}

	.slick-offers .slick-prev:hover,
	.slick-offers .slick-next:hover {
		color: #a1782d;
	}
	.slick-offers .slick-prev:focus,
	.slick-offers .slick-next:focus {
		color: #a1782d;
	}
	.slick-offers .slick-prev::before,
	.slick-offers .slick-next::before {
		content: unset;
	}
	.slick-offers .slick-prev {
		left: 15%;
	}
	.slick-offers .slick-next {
		right: 15%;
	}
	.card-offers {
		height: 45vh !important;
	}
	.offers-img {
		height: 50vh;
		width: 100%;
		object-fit: cover;
		object-position: center;
	}
}
@media (min-width: 992px){
	.slick-offers .offers-content{
		height: 50vh; 
		margin: 0 10px;
	}
}
@media (min-width: 1200px){
	.slick-offers .offers-content{
		height: 50vh; 
		margin: 0 10px;
	}
}






.reviewSwiper .swiper-slide {
	height: 50vh;
}

.reviewSwiper .swiper-slide .banner {
	height: 100%;
	width: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	/*padding: 0 16%;*/
}

a.review {
	text-decoration: none;
	color: #000;
	cursor: pointer;
	font-size: 2rem;
	line-height: 3rem;
}

a.review:hover {
	color: #a1782d;
}

.reviewSwiper .banner-text {
	font-size: 0.7rem;
}

#nextSwipe,
#prevSwipe {
	color:  #a1782d;
}

@media (min-width: 768px){
	.reviewSwiper .swiper-slide .banner {
		height: 100%;
		width: 100%;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		padding: 0 16%;
	}

	a.review {
		text-decoration: none;
		color: #000;
		cursor: pointer;
		font-size: 3rem;
	}

	.reviewSwiper .banner-text {
		font-size: 1rem;
	}
}



footer {
	color: #fff !important;
}

img.footer-logo {
	width: 30%;
	/*margin-right: 20px;*/
}

.side-map li a {
	text-decoration: none;
}

.social-link {
	width: 40px;
	height: 40px;
	font-size: 1rem;
	text-decoration: none;
	display: flex;
	align-items: center;
	justify-content: center;
	/*border: 1px solid rgba(0, 0, 0, .75);*/
	border: 1px solid #fff;
	border-radius: 50%;
	transition: 500ms ease;
	/*color: rgba(0, 0, 0, .75);*/
	color: #fff;
}

.social-link:hover, .social-link:active {
	background-color: rgba(0, 0, 0, .75);
	color: #fff;
}



/*=============================================== ACCOMMODATION*/
#header {
    height: 100vh;
    background-repeat: no-repeat;
    background-size: cover !important;
    background-position: center !important;
}
.header-cover {
    background-color: rgb(37 37 37 / 50%);
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.header-cover .description {
    color: #fff;
    text-align: center;
}
p.tagline {
    /*padding: 0 25%;*/
}

@media (min-width: 768px) {
	#header {
	    height: 75vh;
	    background-repeat: no-repeat;
	    background-size: cover !important;
	    background-position: center !important;
	}

	p.tagline {
	    padding: 0 25%;
	}
}


.link-more {
	text-decoration: none;
	color: #a1782d;
}
.btn-detail {
    text-decoration: none;
    color: #000;
    border: 1px solid #000;
    padding: 10px 20px;
    transition: 1s all;
}
.btn-detail:hover {
    background-color: #a1782d;
    color: #fff;
    border: 1px solid #a1782d;
}
.btn-book {
    text-decoration: none;
    color: #fff;
    background-color: #a1782d;
    border: 1px solid #a1782d;
    padding: 10px 20px;
    transition: 1s all;
}
.btn-book:hover {
    background-color: #8a150f;
    color: #fff;
    border: 1px solid #8a150f;
}


.line-3 {
	display: block;
	height: 3px;
	width: 100%;
	background-color: #a1782d;
	margin: 0 auto;
}


.slide-nav-event{
    width: 20%;
    position: absolute;
    z-index: 1;
    bottom: 70px;
    right: 5%;
}

.slide-nav-event-modal{
    width: 13%;
    position: absolute;
    z-index: 1;
    bottom: 70px;
    right: 5%;
}

.slide-nav-event-m{
    width: 25%;
    position: absolute;
    z-index: 1;
    bottom: 16%;
    right: 0%;
}