@charset "utf-8";
/* CSS Document */
html, body {
	margin: 0;
	padding: 0;
	overflow-x: hidden;
	font-family: "Outfit", sans-serif;
}
body::-webkit-scrollbar-track {
 -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
 border-radius: 10px;
 background-color: #F5F5F5;
}
body::-webkit-scrollbar {
.hero-btn-wrap a background-color: #F5F5F5;
}
 body::-webkit-scrollbar-thumb {
 background-color: #666;
}
h1, h2, h3, h4, h5, h6, p, ul, ol {
	margin: 0;
	padding: 0
}
a, button {
	text-decoration: none;
	transition: ease-in 0.3s;
	-moz-transition: ease-in 0.3s;
	-webkit-transition: ease-in 0.3s;
	-ms-transition: ease-in 0.3s;
	-o-transition: ease-in 0.3s;
}
img {
	max-width: 100%
}
/* CSS Document */

/* CSS header */

.header-main-wraper {
	position: relative;
}
.header-main-wraper:before {
	content: "";
	position: absolute;
	background: url(../images/plants.png) no-repeat top;
	bottom: -231px;
	width: 250px;
	height: 250px;
	background-size: contain;
	z-index: 11;
	right: -42px;
}
.header-main-wrap {
	position: absolute;
	z-index: 111;
	width: 100%;
	padding: 25px 15px;
}
.header-main-wrap:before {
	content: '';
	background: url(https://dianeoceanfrontsuites.com/wp-content/uploads/2026/04/Rectangle-45.png) no-repeat top;
	width: 100%;
	height: 185px;
	background-size: cover;
	position: absolute;
	top: 0;
	left: 0
}
.header-main-wrap .container-fluid {
	position: relative;
	z-index: 111
}
.header-main-wrap .row {
	align-items: center
}
.header-main-wrap .site-logo img {
	width: 120px;
}
.site-nav-wrap {
	margin-left: -70px;
}
.site-nav-wrap ul {
	list-style: none;
	display: flex;
	gap: 18px;
}
.site-nav-wrap ul li a {
	font-size: 16px;
	color: #fff;
	font-weight: 400;
	padding: 6px 12px 8px 12px;
	border-radius: 8px;
	margin-right: 5px;
}
.active-nav {
	background: #648BE8;
}
.site-nav-wrap ul li a:hover {
	background: #FFDE7A;
	color: #000 !important
}
.hero-area-wraper .slider-image-wraper {
	height: 100vh;
	background-size: cover !important;
	padding-top: 210px;
	background-color: #ccc
}
.header-main-wraper .carousel-btn {
	position: relative;
	right: 31px;
	bottom: 28px;
}
.header-main-wraper .carousel-control-prev {
	right: 55px;
	left: auto;
}
.header-main-wraper .carousel-control-next, .header-main-wraper .carousel-control-prev {
	width: 45px;
	height: 45px;
	border-radius: 50%;
	top: auto;
	bottom: 25px;
	background-size: 50% !important;
	opacity: 1;
	background: #648be8;
}
.header-main-wraper .carousel-control-next-icon, .header-main-wraper .carousel-control-prev-icon {
	background-size: 65% 100%;
	border-radius: 50%;
}
.right-btn-wraper ul {
	list-style: none;
	display: flex;
	gap: 18px;
	justify-content: end;
	align-items: center;
}
.right-btn-wraper ul li a {
	font-weight: 500;
}
.right-btn-wraper ul li a img {
	position: relative;
	top: -2px;
	width: 15px;
	margin-right: 5px;
}
.right-btn-wraper ul li .phone-header {
	border: 1px solid #0E1830;
	background: #0E1830;
	border-radius: 10px;
	padding: 12px 20px;
	color: #fff
}
.right-btn-wraper ul li .phone-header img {
	filter: brightness(0) invert(1);
}
.right-btn-wraper ul li .phone-header:hover {
	opacity: 0.8
}
.calendar-header {
	border: 1px solid #FFDE7A;
	background: #FFDE7A;
	border-radius: 10px;
	padding: 12px 20px;
	color: #0E1830 !important
}
.calendar-header:hover {
	opacity: 0.8;
}
.text-hero-wrap {
	position: relative;
	background: rgba(17, 44, 108, 0.5);
	padding: 45px;
	border-radius: 15px;
	backdrop-filter: blur(3px);
}
.text-hero-wrap h1 {
	font-size: 60px;
	line-height: 60px;
	letter-spacing: -3px;
	color: #fff;
	font-weight: 400;
}
.text-hero-wrap h1 span {
	color: #FFDE7A;
}
.text-hero-wrap p {
	font-size: 22px;
	color: #fff;
	font-weight: 200;
	line-height: 30px;
	padding-top: 15px;
	padding-bottom: 30px;
	padding-right: 10px;
}
.text-hero-wrap p strong {
	font-weight: 700;
}
.hero-btn-wrap a {
	background: #648BE8;
	border-radius: 10px;
	padding: 12px 20px;
	color: #fff !important;
	margin-right: 20px;
	font-weight: 500
}
.hero-btn-wrap a:hover {
	opacity: 0.8;
}
.hero-btn-wrap a img {
	position: relative;
	top: -2px;
	width: 15px;
	margin-right: 5px;
}
.hero-btn-wrap a:nth-child(1) img {
	filter: brightness(0) invert(1);
}
.hero-btn-wrap a:nth-child(2) {
	background: #FFDE7A;
	border-radius: 10px;
	padding: 12px 20px;
	color: #0E1830 !important;
}
.video-btn-hero {
	position: absolute;
	bottom: 127px;
	right: -445px;
	width: 138px;
}
/* CSS header */

/* CSS Content */

.advantages-main-wraper {
	padding: 85px 0 100px 0;
	background: #648BE8 url(../images/bg-points.jpg) no-repeat top;
	background-size: cover;
	height: 450px;
}
.advantages-main-wraper ul {
	list-style: none;
}
.advantages-main-wraper ul li {
	position: relative;
}
.advantages-main-wraper ul li:before {
	content: "";
	position: absolute;
	right: -25px;
	background: url(../images/waves.svg) no-repeat;
	width: 55px;
	height: 10px;
	background-size: contain;
	top: 50px;
}
.advantages-main-wraper ul li:nth-child(3):before {
	display: none;
}
.list-advantages-wraper {
	text-align: center;
	padding: 0 50px;
}
.list-advantages-icon {
	width: 120px;
	height: 120px;
	border-radius: 50%;
	text-align: center;
	background: #fff;
	margin: 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 15px;
}
.list-advantages-text h5 {
	color: #fff;
	font-size: 22px;
	margin-bottom: 10px;
}
.list-advantages-text p {
	color: #fff;
	font-size: 16px;
	font-weight: 300;
}
.about-main-wraper {
	padding: 80px 0 40px 0;
}
.heading-text-wraper .row {
	align-items: center;
}
.heading-location-wrp h2 {
	font-size: 80px;
	line-height: 70px;
	color: #021237;
	font-weight: 300;
	letter-spacing: -4px;
}
.heading-location-wrp h2 span {
	background: #EFF3FD;
	padding: 1px 15px;
	color: #648BE8;
	border-bottom: 3px solid #648BE8;
	position: relative;
	top: 10px;
	font-size: 65px;
	line-height: 65px;
	font-weight: 500;
	letter-spacing: -2px;
	border-radius: 20px 20px 0px 0px;
}
.heading-location-wrp p {
	font-size: 22px;
	font-weight: 400;
	color: #021237;
	padding-top: 35px;
}
.about-text-wraper {
	padding-left: 80px;
}
.about-text-wraper h6 {
	font-size: 30px;
	color: #021237;
	line-height: 36px;
}
.about-text-wraper p {
	font-size: 18px;
	color: #020E2A;
	font-weight: 300;
	padding: 10px 0;
	line-height: 26px
}
.btn-about-wrap a {
	font-size: 16px;
	color: #648BE8;
}
.btn-about-wrap a span {
	border-bottom: 1px solid #648BE8;
}
.btn-about-wrap a span:hover {
	color: #021237;
	border-bottom: 1px solid #021237;
}
.btn-about-wrap a img {
	position: relative;
	top: 0px;
	left: 3px;
	width: 18px;
}
.about-gallery-listing {
	margin-top: 60px;
}
.gallery-left-list ul {
	list-style: none;
}
.gallery-left-list ul li {
	margin-bottom: 25px;
}
.big-image-wrap {
	height: 400px;
	overflow: hidden;
	border-radius: 20px;
}
.small-image-wrap {
	height: 135px;
	overflow: hidden;
	border-radius: 20px;
}
.inner-review-box {
	border: 1px solid #D5DBEA;
	padding: 15px 25px;
	border-radius: 12px;
	display: flex;
	align-items: center;
	gap: 15px;
	width: 50%;
	margin: 0 auto;
}
.review-text h6 {
	font-size: 40px;
	color: #021237;
	line-height: 40px;
}
.review-text p {
	font-size: 18px;
	font-weight: 400;
	letter-spacing: -1px;
	color: #021237;
}
.review-box-wrap {
	margin: 44px 0
}
.images-gallery-center ul {
	list-style: none;
	display: flex;
	gap: 25px;
}
.images-gallery-center ul li {
	height: 365px;
	border-radius: 20px;
	overflow: hidden;
}
.near-attraction-wraper {
	position: relative;
	padding-top: 40px
}
.near-attraction-wraper:before {
	content: "";
	position: absolute;
	background: url(../images/plants.png) no-repeat top;
	bottom: -272px;
	width: 400px;
	height: 400px;
	background-size: contain;
	z-index: 11;
	right: -80px;
}
.near-attraction-wraper h2 {
	text-align: center;
	margin-bottom: 70px;
	font-size: 60px;
	line-height: 60px;
	color: #021237;
	font-weight: 300;
	letter-spacing: -3px;
}
.near-attraction-wraper h2 span {
	background: #EFF3FD;
	padding: 1px 15px;
	color: #648BE8;
	border-bottom: 3px solid #648BE8;
	font-size: 65px;
	line-height: 65px;
	font-weight: 500;
	letter-spacing: -2px;
	border-radius: 20px 20px 0px 0px;
}
.near-attraction-wraper .carousel {
	margin-bottom: 60px;
	position: relative;
}
.attraction-list-wraper {
	width: 80%;
	margin: 0 auto;
}
.attraction-list-wraper .image-attraction-wrap {
	width: 400px;
	border-radius: 25px;
	overflow: hidden;
	margin: 0 auto;
	height: 500px;
}
.attraction-list-wraper .text-attraction-wrp span {
	display: block;
	font-size: 25px;
	color: #648BE8;
}
.attraction-list-wraper .text-attraction-wrp h3 {
	font-size: 45px;
	letter-spacing: -1px;
	color: #021237;
	line-height: 50px;
	font-weight: 400;
	margin: 10px 0;
}
.attraction-list-wraper .text-attraction-wrp p {
	font-size: 18px;
	color: #021237;
	line-height: 28px;
	font-weight: 300;
	padding-top: 10px
}
.book-suite-wrp {
	margin-top: 20px;
}
.book-suite-wrp a {
	font-size: 16px;
	color: #648BE8;
}
.book-suite-wrp a strong {
	border-bottom: 1px solid #648BE8;
	font-weight: normal
}
.book-suite-wrp a img {
	position: relative;
	top: -1px;
	left: 3px;
	width: 20px;
}
.attraction-list-wraper .row {
	align-items: center;
}
.attraction-btn .carousel-control-next, .attraction-btn .carousel-control-prev {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	top: 0;
	background-size: 30% !important;
	opacity: 1;
	background: #fff;
	border: 1px solid #D5DBEA
}
.attraction-btn .carousel-control-prev {
	right: 47px;
	left: auto;
}
.attraction-btn .carousel-control-next-icon, .attraction-btn .carousel-control-prev-icon {
	background-size: 54% 100% !important;
	filter: brightness(0%);
}
.attraction-btn {
	position: absolute;
	top: 30px;
	right: 145px;
}
.contact-main-wraper {
	background: #FFDE7A url(../images/bg-contact.jpg) no-repeat top;
	background-size: cover;
	padding: 130px 0 140px 0
}
.book-text-wraper h4 {
	font-size: 60px;
	line-height: 80px;
	color: #021237;
	font-weight: 300;
	letter-spacing: -2px;
}
.book-text-wraper h4 span {
	background: #f5e1a6;
	padding: 1px 15px;
	color: #648BE8;
	border-bottom: 3px solid #648BE8;
	font-size: 65px;
	line-height: 65px;
	font-weight: 500;
	letter-spacing: -2px;
	border-radius: 20px 20px 0px 0px;
}
.book-text-wraper p {
	font-size: 20px;
	color: #021237;
	line-height: 28px;
	font-weight: 300;
	padding: 40px 0;
	padding-right: 80px
}
.book-btn-wraper {
}
.book-btn-wraper .phone-btn {
	border: 1px solid #0E1830;
	background: #0E1830;
	border-radius: 10px;
	padding: 12px 20px;
	color: #fff;
	margin-right: 15px;
}
.book-btn-wraper .phone-btn img {
	position: relative;
	top: -2px;
	width: 15px;
	margin-right: 5px;
	filter: brightness(0) invert(1);
}
.book-btn {
	background: #021237;
	border-radius: 10px;
	padding: 12px 30px;
	color: #fff !important;
}
.book-btn:hover {
	background: #648BE8;
}
.book-btn img {
	position: relative;
	top: -2px;
	width: 15px;
	margin-right: 5px;
	filter: brightness(0) invert(1);
}
.contact-main-wraper .row {
	align-items: center;
}
.book-reservation-wrap h5 {
	font-size: 30px;
	color: #021237;
	margin-bottom: 25px;
}
.book-reservation-wrap .form-group {
	margin-bottom: 20px;
}
.book-reservation-wrap .form-group .form-control {
	height: 45px;
	border: none;
	outline: none;
	box-shadow: none;
	border-radius: 8px;
	font-size: 14px;
	padding-left: 15px;
	padding-left: 20px
}
.textarea-group .form-control {
	border: none;
	outline: none;
	box-shadow: none;
	border-radius: 8px;
	font-size: 14px;
	padding-top: 20px;
	padding-left: 20px;
	resize: none
}
.contact-btn-wrap {
	text-align: right;
}
.textarea-group{
	margin-bottom:15px;
}
.contact-btn-wrap button {
	background: #648BE8;
	border-radius: 10px;
	padding: 10px 30px;
	color: #fff !important;
	border: none;
}
.contact-btn-wrap button img {
	position: relative;
	top: -2px;
	width: 15px;
	margin-right: 5px;
	filter: brightness(0) invert(1);
}
.contact-btn-wrap button:hover {
	background: #021237
}
.photo-gallery-wraper {
	padding: 60px 0;
}
.photo-gallery-wraper h3 {
	text-align: center;
	margin-bottom: 40px;
	font-size: 60px;
	line-height: 60px;
	color: #021237;
	font-weight: 300;
	letter-spacing: -3px;
}
.photo-gallery-wraper h3 span {
	background: #EFF3FD;
	padding: 1px 15px;
	color: #648BE8;
	border-bottom: 3px solid #648BE8;
	font-size: 65px;
	line-height: 65px;
	font-weight: 500;
	letter-spacing: -2px;
	border-radius: 20px 20px 0px 0px;
}
.photo-gallery-wraper p {
	text-align: center;
	font-size: 16px;
	color: #021237;
	line-height: 26px;
	font-weight: 300;
	padding: 0 320px;
	padding-bottom: 30px
}
.gallery {
	column-count: 4;
	column-gap: 20px;
	padding: 20px;
}
.gallery img {
	width: 100%;
	margin-bottom: 20px;
	border-radius: 20px;
	transition: transform 0.3s ease, opacity 0.3s ease;
}
.gallery img:hover {
	transform: scale(1.03);
	opacity: 0.9;
}

/* Responsive */
@media (max-width: 1200px) {
.gallery {
	column-count: 3;
}
}
 @media (max-width: 768px) {
.gallery {
	column-count: 2;
}
}
 @media (max-width: 480px) {
.gallery {
	column-count: 1;
}
}
/* Lightbox */
.lightbox {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.8);
	display: none;
	justify-content: center;
	align-items: center;
}
.lightbox img {
	max-width: 90%;
	max-height: 80%;
	border-radius: 10px;
}
#close {
	position: absolute;
	top: 20px;
	right: 40px;
	color: white;
	font-size: 40px;
	cursor: pointer;
}
.see-all-photo {
	text-align: center;
	margin-top: 30px;
}
.see-all-photo a {
	background: #021237;
	border-radius: 10px;
	padding: 12px 20px;
	color: #fff !important;
}
.see-all-photo a img {
	position: relative;
	top: -2px;
	width: 15px;
	margin-right: 5px;
	filter: brightness(0) invert(1);
}
.see-all-photo a:hover {
	background: #648BE8
}
.review-main-wraper {
	padding: 120px 0 100px 0;
	background: #648BE8 url(../images/review-bg.jpg) no-repeat top;
	background-size: cover;
	height: 630px;
}
.review-main-wraper h3 {
	text-align: center;
	margin-bottom: 70px;
	font-size: 60px;
	line-height: 60px;
	color: #fff;
	font-weight: 300;
	letter-spacing: -3px;
}
.review-main-wraper h3 span {
	background: #7395e8;
	padding: 1px 15px;
	color: #fff;
	border-bottom: 3px solid #f5e1a6;
	font-weight: 500;
	letter-spacing: -2px;
	border-radius: 20px 20px 0px 0px;
}
.review-listing-wraper {
	background: #fff;
	border-radius: 20px;
	padding: 25px;
}
.review-listing-wraper:before {
	content: "";
	position: absolute;
	background: url(../images/arrow-review.svg) no-repeat top;
	width: 30px;
	height: 30px;
	background-size: contain;
	bottom: -20px;
}
.review-listing-wraper span {
	background: #FFDE7A;
	padding: 4px 10px;
	color: #051737;
	border-radius: 6px;
	margin-right: 5px;
	float: right;
	margin-top: -4px;
	font-weight: 500;
}
.review-listing-wraper p {
	font-size: 18px;
	color: #021237;
	font-weight: 300;
	padding-top: 20px;
	padding-bottom: 5px;
	height:110px;
}
.review-client-info h6 {
	font-size: 18px;
	margin-bottom: 0;
	color: #021237;
	text-align: right;
	font-style: italic;
	padding-right: 5px;
}
.review-client-star a img {
	margin-top: -3px;
}
.owl-dots {
	display: none;
}
.owl-nav {
	position: absolute;
	top: 80px;
	width: 100%;
	text-align: right;
}
.owl-nav button {
	border: none;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	color: #fff !important;
	padding-top: 0;
	display: inline-block;
	font-size: 28px;
	margin-right: 5px;
}
.owl-prev {
	position: absolute;
	left: -60px;
	background: #021237 url(../images/left-arrow.svg) no-repeat top !important;
	background-position: 50% !important;
	background-size: 40% !important;
}
.owl-next {
	position: absolute;
	right: -60px;
	background: #021237 url(../images/right-arrow.svg) no-repeat top !important;
	background-position: 50% !important;
	background-size: 40% !important;
}
.insta-feed-wraper {
	padding: 100px 0 100px 0
}
.insta-feed-wraper .carousel-wrap:hover .owl-nav {
	display: block;
}
.insta-feed-wraper h2 {
	font-size: 60px;
	color: #1d1a2d;
	font-weight: 400;
	margin-bottom: 10px;
	text-align: center;
	letter-spacing: -3px
}
.insta-feed-wraper h2 span {
	background: #EFF3FD;
	padding: 1px 15px;
	color: #648BE8;
	border-bottom: 3px solid #648BE8;
	font-size: 65px;
	line-height: 65px;
	font-weight: 500;
	letter-spacing: -2px;
	border-radius: 20px 20px 0px 0px;
}
.insta-feed-wraper p {
	text-align: center;
	font-size: 16px;
	color: #021237;
	line-height: 26px;
	font-weight: 300;
	padding: 20px 220px 0 220px;
	padding-bottom: 10px;
}
.insta-feed-wraper p {
	font-size: 16px;
	line-height: 28px;
	color: #000;
	margin-bottom: 60px;
}
.intagram-image-wrap {
	height: 500px;
	background-size: cover !important;
	border-radius: 20px;
}
.intagram-image-wrap a {
	height: 500px;
	background: rgba(100, 139, 232, 0.8);
	display: block;
	color: #fff;
	text-align: center;
	font-size: 30px;
	position: relative;
	bottom: -500px;
	letter-spacing: -1px;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 20px;
}
.intagram-image-wrap:hover a {
	bottom: 0;
}
.insta-feed-wraper .owl-nav {
	top: 50%;
}
.intagram-image-wrap a span {
	border-bottom: 1px solid #fff;
}
.modal-open {
	padding-right: 0 !important;
}
.modal-dialog {
	max-width: 800px;
}
.inner-review-icon {
	width: 80px
}
.modal {
	backdrop-filter: blur(3px);
}
.modal-body .modal-dialog {
	margin-top: 110px;
}
.modal-content {
	border-radius: 15px;
}
.modal-content iframe {
	border-radius: 15px;
}
.btn-close {
	position: absolute;
	right: 0;
	top: -31px;
	color: #fff;
	filter: brightness(0) invert(1);
	box-shadow: none;
	outline: none
}
.drawer-menu {
	box-sizing: border-box;
	position: fixed;
	top: 0;
	right: 0;
	width: 280px;
	height: 100vh;
	padding: 65px 0 0 0;
	background: #112c6c;
	-webkit-transition-property: all;
	transition-property: all;
	-webkit-transition-duration: .5s;
	transition-duration: .5s;
	-webkit-transition-delay: 0s;
	transition-delay: 0s;
	-webkit-transform-origin: right center;
	-ms-transform-origin: right center;
	transform-origin: right center;
	-webkit-transform: perspective(500px) rotateY(-90deg);
	transform: perspective(500px) rotateY(-90deg);
	opacity: 0;
	overflow: auto;
}
.drawer-menu li {
	text-align: left;
}
.drawer-menu li a {
	display: block;
	height: auto;
	line-height: 62px;
	font-size: 16px;
	font-weight: 500;
	color: #fff;
	-webkit-transition: all .8s;
	transition: all .8s;
	padding-left: 30px;
	border-bottom: 1px solid #1b397f;
}
.drawer-menu li a:hover {
	color: #1a1e24;
	background: #fff;
}
/* checkbox */
.check {
	display: none;
}
/* menu button - label tag */
.menu-btn {
	position: absolute;
	display: block;
	top: 0;
	right: 18px;
	display: block;
	width: 50px;
	height: 40px;
	font-size: 10px;
	text-align: center;
	cursor: pointer;
	z-index: 3;
	background: #648be8;
	border-radius: 6px;
}
.menu-bar {
	position: relative;
	left: 10px;
	top: 8px;
}
.bar {
	position: absolute;
	top: 4px;
	left: 0;
	display: block;
	width: 28px;
	height: 1px;
	background: #fff;
	-webkit-transition: all .5s;
	transition: all .5s;
	-webkit-transform-origin: left top;
	-ms-transform-origin: left top;
	transform-origin: left top;
}
.bar.middle {
	top: 12px;
	opacity: 1;
}
.bar.bottom {
	top: 20px;
	-webkit-transform-origin: left bottom;
	-ms-transform-origin: left bottom;
	transform-origin: left bottom;
}
.menu-btn__text {
	position: absolute;
	bottom: -15px;
	left: 0;
	right: 0;
	margin: auto;
	color: #fff;
	-webkit-transition: all .5s;
	transition: all .5s;
	display: block;
	visibility: visible;
	opacity: 1;
}
.menu-btn:hover .bar {
	background: #18b6a4;
}
.close-menu {
	position: fixed;
	top: 0;
	right: 280px;
	width: 100%;
	height: 100vh;
	background: rgba(0,0,0,0);
	cursor: url(http://theorthodoxworks.com/demo/images/cross.svg), auto;
	-webkit-transition-property: all;
	transition-property: all;
	-webkit-transition-duration: .3s;
	transition-duration: .3s;
	-webkit-transition-delay: 0s;
	transition-delay: 0s;
	visibility: hidden;
	opacity: 0;
}
/* checked */
.check:checked ~ .drawer-menu {
	-webkit-transition-delay: .3s;
	transition-delay: .3s;
	-webkit-transform: none;
	-ms-transform: none;
	transform: none;
	opacity: 1;
	z-index: 2;
}
.check:checked ~ .contents {
	-webkit-transition-delay: 0s;
	transition-delay: 0s;
	-webkit-transform: translateX(-300px);
	-ms-transform: translateX(-300px);
	transform: translateX(-300px);
}
.check:checked ~ .menu-btn .menu-btn__text {
	visibility: hidden;
	opacity: 0;
}
.check:checked ~ .menu-btn .bar.top {
	width: 40px;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
	background: #fff;
	top: 0
}
.check:checked ~ .menu-btn .bar.middle {
	opacity: 0;
}
.check:checked ~ .menu-btn .bar.bottom {
	width: 40px;
	top: 28px;
	background: #fff;
	-webkit-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	transform: rotate(-45deg);
}
.check:checked ~ .close-menu {
	-webkit-transition-duration: 1s;
	transition-duration: 1s;
	-webkit-transition-delay: .3s;
	transition-delay: .3s;
	background: rgba(0,0,0,.5);
	visibility: visible;
	opacity: 1;
	z-index: 3;
}
.drawer-menu ul {
	list-style: none;
	margin-top: 50px;
}
.drawer-menu ul li a {
	text-decoration: none;
}
.drawer-menu ul li a img {
	margin-right: 5px;
	margin-top: -2px;
}
.menusitebar-main-wraper {
	display: none;
}
.inner-hero-area-wraper {
	height: 300px;
	background: url(https://dianeoceanfrontsuites.com/wp-content/uploads/2026/04/inner-hero-scaled.jpg) no-repeat bottom;
	background-size: cover;
	padding: 200px 0 220px 0;
	text-align: center;
	color: #fff;
}
.inner-hero-area-wraper h1 {
	font-size: 70px;
	letter-spacing: -2px;
	font-weight: 400;
}
.suites-listing-wraper {
	padding: 40px;
}
.suites-listing-wraper ul {
	list-style: none;
}
.suites-listing-wraper ul li {
	border: 1px solid #eaedf0;
	padding: 25px;
	border-radius: 10px;
	margin-bottom: 25px;
}
.suites-listing-wraper li h2 {
	text-align: center;
	font-size: 50px;
	color: #021237;
	font-weight: 300;
	letter-spacing: -2px;
	margin-bottom: 30px;
}
.suites-listing-wraper p {
	text-align: center;
	font-size: 18px;
	color: #020E2A;
	font-weight: 300;
	padding: 3px 0;
	line-height: 30px;
	padding: 0 30px;
	padding-bottom: 30px;
}
.suites-listing-wraper li h2 span {
	background: #EFF3FD;
	padding: 1px 15px;
	color: #648BE8;
	border-bottom: 3px solid #648BE8;
	border-radius: 10px 10px 0px 0px;
	font-weight: 500;
}
.images-list {
	display: flex;
	gap: 15px
}
.suite-info-wraper {
	margin-top: 15px;
}
.suite-info-wraper span {
	display: block;
	padding: 3px 0;
	color: #000;
	font-size: 18px;
	font-weight: 300;
}
.btn-reserve-wrap {
	margin-top: 30px;
	margin-bottom: 20px;
	text-align: center;
}
.btn-reserve-wrap a {
	background: #648BE8;
	border-radius: 10px;
	padding: 12px 20px;
	color: #fff !important;
	margin-right: 20px;
	font-weight: 500;
}
.about-section-wraper {
	padding: 60px 0;
}
.policy-image-wrap img {
	width: 100%;
	border-radius: 20px;
}
.policy-text-main-wrap h5 {
	font-size: 36px;
	font-weight: 400;
	color: #021237;
}
.policy-text-main-wrap p {
	font-size: 18px;
	color: #020E2A;
	font-weight: 300;
	padding: 10px 0;
	line-height: 26px;
}
.policy-text-main-wrap ul {
	list-style: none;
}
.policy-text-main-wrap ul li {
	font-size: 16px;
	color: #020E2A;
	font-weight: 300;
	padding: 10px 0;
	line-height: 26px;
	background: #f0f5ff;
	padding: 8px 15px;
	border-radius: 10px;
	margin-bottom: 5px;
}
.specail-btn-wrap {
	margin-top: 30px;
}
.specail-btn-wrap a {
	background: #648BE8;
	border-radius: 10px;
	padding: 12px 20px;
	color: #fff !important;
	margin-right: 20px;
	font-weight: 500;
}
.specail-btn-wrap a img {
	filter: brightness(0) invert(1);
	margin-top: -2px;
	margin-right: 5px;
}
.fees-section-wraper {
	padding: 20px;
	background: #f0f5ff;
	border-radius: 15px
}
.fees-section-wraper h5 {
	font-size: 36px;
	font-weight: 400;
	color: #021237;
}
.fees-section-wraper p {
	font-size: 18px;
	color: #020E2A;
	font-weight: 300;
	padding: 10px 0;
	line-height: 26px;
}
.fees-section-wraper tr {
	background: #fff;
	border-bottom: 8px solid #f0f5ff
}
.fees-section-wraper tr td {
	font-size: 18px;
	color: #020E2A;
	font-weight: 300;
	padding: 10px 0;
	line-height: 26px;
	padding-left: 15px
}
.policies-acessibiltiy-wraper {
	padding: 30px 0 60px 0;
}
.policies-main-wrap {
	padding: 25px;
	background: #f0f5ff;
	border-radius: 15px;
}
.policies-main-wrap h5 {
	font-size: 36px;
	font-weight: 400;
	color: #021237;
}
.policies-main-wrap ul {
	list-style: none;
}
.policies-main-wrap ul li {
	font-size: 18px;
	color: #020E2A;
	font-weight: 300;
	padding: 3px 0;
	line-height: 26px;
}
.policies-main-wrap p {
	font-size: 18px;
	color: #020E2A;
	font-weight: 300;
	padding: 3px 0;
	line-height: 30px;
}
.modal.show .modal-dialog {
    margin-top: 10%;
}
.modal.fade .modal-dialog {
  transform: translateY(30px);
  opacity: 0;
  transition: all 0.9s ease;
}

.modal.fade.show .modal-dialog {
  transform: translateY(0);
  opacity: 1;
}
/* CSS Content */

/* CSS footer */

.footer-main-wraper {
	background:url(https://dianeoceanfrontsuites.com/wp-content/uploads/2026/04/Vector-8-scaled.png) no-repeat top;
	background-size: cover;
	padding: 100px 0 30px 0;
	margin-top: -74px;
    position: relative;
}
.footer-logo {
	text-align: center;
}
.footer-main-wraper p {
	font-size: 20px;
    color: #fff;
    font-weight: 300;
    padding-left: 45px;
    width: 71%;
}
.logo-detail {
	display: flex;
	gap: 35px;
	align-items: center;
}
.footer-contact-info {
	padding: 20px;
	margin-top: 40px;
	border-top: 1px solid #1d3364;
	border-bottom: 1px solid #1d3364;
}
.footer-contact-info ul {
	list-style: none;
}
.footer-contact-info ul li {
	font-size: 16px;
	color: #fff
}
.footer-contact-info ul li span {
	width: 40px;
	height: 40px;
	background: #638ae9;
	color: #fff;
	text-align: center;
	margin-right: 5px;
	display: inline-block;
	text-align: center;
	border-radius: 50%;
	padding-top: 7px;
	float: left;
	margin-right: 8px;
}
.footer-contact-info ul li strong {
	position: relative;
	top: 8px;
	color: #fff;
	font-weight: 400;
}
.footer-contact-info ul li a {
	position: relative;
	top: 8px;
	color: #fff;
	font-weight: 400;
}
.footer-contact-info ul li span img {
	width: 41%
}
.footer-nav-wrap ul {
	list-style: none;
	margin-top: 25px;
}
.footer-nav-wrap ul li {
	display: inline-block;
	margin-right: 25px;
}
.footer-nav-wrap ul li a {
	font-size: 14px;
	opacity: 0.4;
	color: #000;
	text-decoration: none;
}
.copyright-text {
	text-align: right;
	font-size: 14px;
	color: #000;
	margin-top: 25px;
}
.footer-logo img {
	margin-top: -42px;
	width:150px
}
.nav-copyright-wrap .copyright-text {
	text-align: center;
	color: #fff;
	font-size: 14px;
	font-weight: 300;
	margin-top: 37px;
	opacity: 0.5;
}

/* CSS footer */

/* CSS media */


@media (max-width:1650px) and (min-width:1170px) {
.site-nav-wrap {
	margin-left: -30px;
}
}
@media screen and (max-width:1169px) {
.site-nav-wrap {
	margin-left: -30px;
}
.container, .container-md, .container-sm {
	max-width: 100%;
}
.site-nav-wrap {
	display: none;
}
.slider-image-wraper .col-md-6 {
	width: 100%;
}
.text-hero-wrap {
	width: 50%;
	margin: 0 auto;
	text-align: center;
}
.hero-area-wraper .slider-image-wraper {
	height: auto;
	padding: 180px 0 120px 0
}
.right-btn-wraper ul {
	display: none;
}
.list-advantages-wraper {
	padding: 0 20px;
}
.header-main-wraper:before {
	display: none;
}
.menusitebar-main-wraper {
	display: block;
}
.calendar-header {
	padding: 0;
	margin: 0;
	border-radius: 0
}
.big-image-wrap {
	height: auto;
}
.images-gallery-center ul li {
	height: auto;
}
.book-text-wraper h4 span {
	font-size: 55px
}
}
@media screen and (max-width:768px) {
.text-hero-wrap {
	width: 100%;
	padding: 20px
}
.menu-btn {
	top: 4px;
	right: 10px;
}
.hero-btn-wrap a {
	display: block;
	margin-bottom: 10px;
}
.text-hero-wrap h1 {
	font-size: 40px;
	line-height: 40px;
	letter-spacing: -1px;
}
.text-hero-wrap p {
	padding: 20px 0;
}
.hero-btn-wrap a {
	margin-right: 0
}
.advantages-main-wraper {
	height: auto;
}
.advantages-main-wraper {
	background: #648BE8
}
.advantages-main-wraper ul li:before {
	display: none;
}
.list-advantages-wraper {
	margin-bottom: 30px;
}
.advantages-main-wraper {
	padding: 40px 0;
}
.heading-location-wrp h2 {
	font-size: 60px;
	line-height: 60px;
}
.about-text-wraper {
	padding-left: 0px;
	padding-top: 10px;
}
.about-gallery-listing {
	margin-top: 0px;
}
.inner-review-box {
	width: 100%
}
.review-box-wrap {
	margin: 0 0 20px 0;
}
.images-gallery-center ul {
	display: block;
}
.images-gallery-center ul li {
	margin-bottom: 15px;
}
.attraction-list-wraper {
	width: 100%;
	margin: 0 auto;
}
.attraction-btn {
	position: absolute;
	top: 20px;
	right: 20px;
}
.near-attraction-wraper:before {
	display: none;
}
.contact-main-wraper {
	background: #FFDE7A;
	padding: 40px 0;
}
.book-text-wraper p {
	padding-right: 0;
}
.book-text-wraper {
	margin-bottom: 25px;
}
.photo-gallery-wraper p {
	padding: 0;
}
.insta-feed-wraper p {
	padding: 0;
}
.photo-gallery-wraper h3 {
	font-size: 40px;
	line-height: 40px;
	letter-spacing: -1px;
}
.review-main-wraper {
	background: #648BE8;
	height: auto;
	padding: 60px 0;
}
.review-main-wraper h3 {
	margin-bottom: 40px;
	font-size: 40px;
	line-height: 40px;
}
.insta-feed-wraper h2 {
	font-size: 40px;
}
.insta-feed-wraper h2 span {
	font-size: 40px;
	line-height: 40px;
	display: block;
}
.insta-feed-wraper {
	padding: 40px 0
}
.footer-main-wraper {
	background: #021237;
	padding: 40px 0;
}
.logo-detail {
	display: block;
	margin-top: 30px;
}
.footer-main-wraper p {
	font-size: 20px;
	padding-left: 0;
	text-align: center;
	padding: 10px 20px;
}
.footer-contact-info ul li {
	margin-bottom: 15px;
}
.heading-location-wrp h2 span {
	font-size: 50px;
}
.about-main-wraper {
	padding: 40px 0 40px 0;
}
.photo-gallery-wraper h3 span {
	font-size: 40px;
}
.near-attraction-wraper h2 {
	line-height: 90px;
}
.suites-listing-wraper {
    padding:40px 0;
}
.suites-listing-wraper ul li {
    border: none;
    padding: 0;
}
}

/* CSS media */