/* * */ /*font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-family: var(--ibe-font, 'Nunito Sans', sans-serif);*/ :root { /* Static IBE visual tokens. Dynamic accent tokens (--ibe-accent*, --ibe-on-accent) are injected per-theme in via includes/ibe_theme_root.php. --ibe-font is set by the active font theme (css/style_{font_style}.css). */ /* One radius scale for the whole IBE (mirrors css/reservation-page.css). */ --radius-xs: 4px; --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 24px; --radius-full: 9999px; --ibe-card-shadow: 0 1px 2px rgba(16, 24, 40, .04), 0 10px 28px rgba(16, 24, 40, .07); --ibe-card-shadow-hover: 0 16px 40px rgba(16, 24, 40, .14); --ibe-transition: .25s cubic-bezier(.4, 0, .2, 1); /* Neutral text/surface system — one ink, one muted, one warm paper, one hairline. Accent-tinted section wash derives from the tenant color. */ --ibe-ink: #1d2129; --ibe-muted: #5f6672; --ibe-paper: #faf9f7; --ibe-hairline: #e9e7e2; --ibe-wash: rgba(var(--ibe-accent-rgb, 28, 60, 107), .07); } body { font-family: var(--ibe-font, 'Nunito Sans', sans-serif); } h1, h3, h4, h5, h6 { font-family: var(--ibe-font, 'Nunito Sans', sans-serif); } nav.navbar.navbar-expand-lg.navbar-light { background: #323a40; } a.navbar-brand { font-size: 20px; color: #fff !important; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 300; letter-spacing: 0px; } section#header { background: #fff; } section#header .row { height: 80vh; align-items: center; justify-content: center; } .hero-logo { text-align: center; } .hero-logo h4 { font-size: 18px; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 600; color: #141414; } .hero-logo h1 { font-size: 40px; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 700; color: #141414; } .slick-slide img { width: 100%; height: 100%; object-fit: cover; } /* .slick-prev:before { content: '\f104'; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); color: #333333; font-size: 25px !important; } .slick-next:before { content: '\f105'; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); color: #333333; font-size: 25px !important; } */ button.slick-prev.slick-arrow { left: 10px; z-index: 1; height: 40px; width: 40px; border-radius: 100%; transition: .3s ease; color: #fff !important; } button.slick-next.slick-arrow { right: 10px; z-index: 1; height: 40px; width: 40px; border-radius: 100%; transition: .3s ease; color: #fff !important; } button.slick-arrow:hover{ } button.slick-arrow:hover.slick-prev:before{ color: #fff !important; } button.slick-arrow:hover.slick-next:before{ color: #fff !important; } .slick-dots li button:before { opacity: 1; color: transparent; border: none; background: #666666; height: 12px; width: 12px; border-radius: 100%; } .slick-dots li.slick-active button:before { opacity: 1; color: transparent; border: none; background: var(--ibe-accent, #deb666); height: 12px; width: 12px; border-radius: 100%; } .slick-dots { } .pad-30{ padding-top: 30px; } .pad-50{ padding-top: 50px; } #rooms{ padding: 120px 0 80px; background: var(--ibe-paper, #f1f0ed); } .sec-title h2 { color: var(--ibe-ink, #333333); font-size: clamp(28px, 3.2vw, 38px); font-weight: 700; letter-spacing: -0.01em; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); } .sec-title h2::after { content: ""; display: block; width: 56px; height: 3px; margin: 16px auto 0; border-radius: 999px; background: var(--ibe-accent, #deb666); } .sec-title h5 { color: #666666; font-size: 20px; font-weight: 400; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); } .card { border: 0; background: #fff; margin-top: 0px; overflow: hidden; } /* Flexbox column so .room-booking-home always sticks to the bottom */ .room-card { display: flex; flex-direction: column; border-radius: var(--radius-lg, 16px); box-shadow: var(--ibe-card-shadow, 0 1px 2px rgba(16, 24, 40, .04), 0 10px 28px rgba(16, 24, 40, .07)); transition: transform var(--ibe-transition, .25s ease), box-shadow var(--ibe-transition, .25s ease); } .room-types:hover .room-card { transform: translateY(-6px); box-shadow: var(--ibe-card-shadow-hover, 0 16px 40px rgba(16, 24, 40, .14)); } .room-card .card-body { flex: 1; } .room-types{ padding-bottom: 20px; } .card img{ border-radius: 0px; } .price { font-weight: 700; font-size: 21px; } /*span.hover-border { border: 3px solid var(--ibe-accent, #deb666); height: 220px; position: absolute; width: 90%; left: 50%; transform: translateX(-50%); top: 15px; opacity: 0; transition: .3s ease; } .card:hover span.hover-border{ opacity: 1; }*/ .next-carousel-nav ul.slick-dots { bottom: 0px; } .next-carousel-nav ul.slick-dots { background: #33333380; } .next-carousel-nav .slick-dots li button:before { opacity: 1; color: transparent; border: none; background: #adb5bd; height: 5px; width: 5px; border-radius: 100%; } .next-carousel-nav .slick-dots li.slick-active button:before { opacity: 1; color: transparent; border: none; background: var(--ibe-accent, #deb666) !important; height: 5px; width: 5px; border-radius: 100%; } .room-booking-home a { width: 100%; display: inline-block; padding: 14px 10px; background: var(--ibe-accent, #deb666); text-align: center; text-decoration: none; color: var(--ibe-on-accent, #2d2d2d); font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 700; font-size: 15px; letter-spacing: .5px; text-transform: uppercase; transition: background var(--ibe-transition, .25s ease), color var(--ibe-transition, .25s ease); } .room-booking-home a:hover{ background: var(--ibe-accent-strong, #c3a25e); color: var(--ibe-on-accent, #fafafa); } .card-body { position: relative; } p.persons { font-size: 13px; font-weight: 600; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); color: #999999; } .room-card .persons { display: inline-block; background: var(--ibe-accent-light, rgba(0, 0, 0, .05)); color: var(--ibe-accent, #555); padding: 4px 12px; border-radius: var(--radius-full, 9999px); font-weight: 700; letter-spacing: .2px; } h5.card-title { font-size: 20px; color: #333333; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 700; } p.card-text { color: #999999; font-size: 14px; /* line-height: 28px; */ font-weight: 200; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); text-align: justify; } .hover-border ul { /* list-style-image: url(../images/list-style.png); */ padding: 0px 0px; float: left; margin-top: 10px; /* overflow:auto; */ padding-right:0px; list-style-type: none; } .card-body{ padding-right: 20px; margin-right:0px; /* height: 300px !important; overflow-y: scroll; */ } .hover-border ul li { margin-left:0px; /* width: 50%; */ font-size: 11px; line-height: 15px; color: #999999; font-weight: 600; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); float:left; margin-right:0px; padding-right: 0px; padding:3px; } .hover-border ul li img{ fill: #EEEEEE; } #rooms-result{ padding-top: 0; } #rooms-result:not(:empty){ padding-top: 80px; } #billing { margin-top: 0; padding: 0; } #billing:not(:empty) { margin-top: 60px; padding-top: 30px; padding-bottom: 80px; } .scrolling{ height:90px; max-height: 90px; width:auto; } .scrolling2{ } .hero-container{ color:#FFFFFF; padding-top:35vh; } .hero-container h1{ font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-size: clamp(34px, 4.6vw, 60px); font-weight: 700; letter-spacing: -0.015em; line-height: 1.12; text-shadow: 0 2px 24px rgba(0,0,0,.35); margin-bottom: 0; } /* Divider under the headline: a short accent rule, not a full-width hr */ .hero-container hr{ width: 64px; margin: 26px auto; border: 0; border-top: 3px solid var(--ibe-accent, #deb666); border-radius: 999px; opacity: 1; } .hero-container p{ max-width: 640px; margin: 0 auto; font-size: 17px; font-weight: 300; line-height: 1.7; color: rgba(255,255,255,.92); text-shadow: 0 1px 12px rgba(0,0,0,.35); } h1.hero-container{ font-weight: 200; } .sec-title { margin-bottom: 40px; } /* Essentials strip: check-in / check-out / cancellation rendered as one hotel-factsheet bar on an accent wash, instead of three floating cards on a full-bleed accent slab. */ #conditions { padding: 72px 0; background: var(--ibe-wash, rgba(222, 182, 102, .07)); border-top: 1px solid var(--ibe-hairline, #e9e7e2); border-bottom: 1px solid var(--ibe-hairline, #e9e7e2); } #conditions .row { background: #fff; border: 1px solid var(--ibe-hairline, #e9e7e2); border-radius: var(--radius-lg, 16px); box-shadow: var(--ibe-card-shadow); overflow: hidden; margin-left: 0; margin-right: 0; } #conditions .row > [class*="col-"] { padding-left: 0; padding-right: 0; } .condition-items { text-align: center; background: transparent; height: auto; padding: 44px 24px; border-radius: 0; box-shadow: none; } /* All three cells share a top line (the inline equal-height helper in conditions.php centers them, which misaligns the labels). */ #conditions .row .condition-items { justify-content: flex-start; } @media (min-width: 768px) { #conditions .row > [class*="col-"] + [class*="col-"] .condition-items { border-left: 1px solid var(--ibe-hairline, #e9e7e2); } } @media (max-width: 767.98px) { #conditions .row > [class*="col-"] + [class*="col-"] .condition-items { border-top: 1px solid var(--ibe-hairline, #e9e7e2); } } .condition-items h4 { color: var(--ibe-muted, #666); font-size: 12px; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 700; text-transform: uppercase; letter-spacing: 0.14em; word-break: normal; overflow-wrap: normal; } .condition-items h3 { color: var(--ibe-ink, #333); font-size: 30px; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 700; margin-top: 10px; margin-bottom: 0; line-height: 1.1; } .condition-items h3 span { font-size: 52px; margin-right: 2px; letter-spacing: -0.02em; } .condition-items p { font-size: 14px; color: var(--ibe-accent, #666); font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 600; margin-top: 12px; } .cancelation-system{ cursor: pointer; } .modal-header { background: #323a40; } .modal-header .modal-title, h5#exampleModalLabel { color: #fff; font-size: 20px; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 700; text-transform: uppercase; width: 100%; text-align: center; } #cancelation .modal-body h6 { font-weight: 700; color: #333; margin: 1rem 0 0.75rem; } #cancelation .modal-body li { color: #555; line-height: 1.55; } #cancelation .modal-body li strong { color: #333; } .modal-body p{ color: #999999; font-size: 16px; line-height: 28px; font-weight: 400; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); } section#service { padding: 0px 0; background: #f1f0ed; } .spa-image { border-radius: 16px; overflow: hidden; box-shadow: 0 8px 32px rgba(0,0,0,0.12); } .spa-image img { width: 100%; position: relative; display: block; } .spa-image span { position: absolute; border: 4px solid var(--ibe-accent, #deb666); width: 90%; left: 50%; height: 90%; transform: translate(-50%, -50%); top: 50%; transition: .3s ease; opacity: 0; } .spa-image:hover span{ opacity: 1; } .spa-content { text-align: center; align-items: center; margin-top: 50px; } .spa-content img { width: 115px; } .spa-content h4 { font-size: 30px; color: #333333; margin-top: 25px; text-transform: uppercase; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 600; margin-bottom: 0; } .spa-content h5 { font-size: 20px; color: #666666; font-weight: 400; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); } .spa-content p { font-size: 16px; color: #666666; font-weight: 400; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); } .restaurant-carousel ul.slick-dots { background: none; } .next-carousel-nav ul.slick-dots { background: #33333380; } .spa-carousel ul.slick-dots { bottom: 0px; background: #33333380; } .spa-carousel .slick-dots li button:before { opacity: 1; color: transparent; border: none; background: #adb5bd; height: 5px; width: 5px; border-radius: 100%; } .spa-carousel .slick-dots li.slick-active button:before { opacity: 1; color: transparent; border: none; background: var(--ibe-accent, #deb666) !important; height: 5px; width: 5px; border-radius: 100%; } .rooms-carousel ul.slick-dots { bottom: 0px; background: #33333380; } .rooms-carousel .slick-dots li button:before { opacity: 1; color: transparent; border: none; background: #adb5bd; height: 5px; width: 5px; border-radius: 100%; } .rooms-carousel .slick-dots li.slick-active button:before { opacity: 1; color: transparent; border: none; background: var(--ibe-accent, #deb666) !important; height: 5px; width: 5px; border-radius: 100%; } .restaurant-carousel ul.slick-dots { bottom: 0px; background: #33333380; } .restaurant-carousel .slick-dots li button:before { opacity: 1; color: transparent; border: none; background: #adb5bd; height: 5px; width: 5px; border-radius: 100%; } .restaurant-carousel .slick-dots li.slick-active button:before { opacity: 1; color: transparent; border: none; background: var(--ibe-accent, #deb666) !important; height: 5px; width: 5px; border-radius: 100%; } .restaurent-row{ /* margin-top: 100px; */ padding-top: 50px; padding-bottom: 50px; } .check-menu-title { font-size: 14px !important; color: #333333 !important; font-weight: 600 !important; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); margin-bottom: 10px; margin-top: 15px; } .spa-content a { padding: 8px 20px; margin-top: 0px; display: inline-block; text-decoration: none; font-size: 16px; font-weight: 600 !important; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); color: var(--ibe-on-accent, #fff); background: var(--ibe-accent, #deb666); transition: .3s ease; } .spa-content a:hover{ background: var(--ibe-accent-strong, #c5a158); } .spa-content.restaurant-content { margin-top: 25px; } section#about { padding: 80px 0; } section#about .row { align-items: stretch; } section#about .col-12.col-lg-5, section#about .col-12.col-lg-7 { display: flex; flex-direction: column; } section#about .about-content { flex: 1; } .about-images img { width: 100%; position: relative; } .about-images{ position: relative; } .about-images:after { content: ""; position: absolute; width: 160px; height: 160px; background: transparent; left: -5px; border-top: 5px solid var(--ibe-accent, #deb666); border-left: 5px solid var(--ibe-accent, #deb666); top: -5px; } .about-images:before { content: ""; position: absolute; width: 160px; height: 160px; background: transparent; right: -5px; border-bottom: 5px solid var(--ibe-accent, #deb666); border-right: 5px solid var(--ibe-accent, #deb666); bottom: -5px; } .about-image-wrap { border-radius: 16px; overflow: hidden; box-shadow: 0 8px 32px rgba(0,0,0,0.12); flex: 1; display: flex; flex-direction: column; min-height: 320px; } .about-image-wrap .hero-slider { flex: 1; display: flex; flex-direction: column; border-radius: 16px; overflow: hidden; min-height: 0; } .about-image-wrap .hero-carousel { flex: 1; display: flex; flex-direction: column; min-height: 0; } .about-image-wrap .hero-img { flex: 1; overflow: hidden; min-height: 0; max-height: none !important; min-height: 0 !important; } .about-image-wrap .hero-img img { width: 100%; height: 100%; object-fit: cover; display: block; } .about-content h3 { font-size: clamp(26px, 2.8vw, 34px); color: var(--ibe-ink, #222); font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 700; letter-spacing: -0.01em; margin-bottom: 14px; } /* Short accent rule under the About heading — same device as .sec-title */ .about-content h3::after { content: ""; display: block; width: 56px; height: 3px; margin: 14px 0 0; border-radius: 999px; background: var(--ibe-accent, #deb666); } .about-content p { font-size: 16px; color: var(--ibe-muted, #666); font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 400; line-height: 1.75; margin-top: 0; margin-bottom: 24px; } .about-amenities-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 12px; margin-top: 4px; } .about-amenity-item { display: flex; align-items: flex-start; gap: 6px; font-size: 12px; line-height: 1.35; color: #666; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); } .about-amenity-item .fa-check { font-size: 9px; margin-top: 3px; color: var(--ibe-accent, #1C3C6B); flex-shrink: 0; } .about-image-wrap .hero-slider { position: relative; } .about-image-wrap .slick-dots { bottom: 10px; line-height: 0; } .about-image-wrap .slick-dots li { width: 10px; height: 10px; margin: 0 2px; } .about-image-wrap .slick-dots li button:before { width: 6px; height: 6px; opacity: 1; color: transparent; background: rgba(255, 255, 255, 0.55); border-radius: 100%; } .about-image-wrap .slick-dots li.slick-active button:before { width: 6px; height: 6px; background: var(--ibe-accent, #deb666); } .hero-slide-counter { position: absolute; bottom: 12px; left: 50%; transform: translateX(-50%); z-index: 2; padding: 4px 10px; border-radius: 999px; background: rgba(0, 0, 0, 0.45); color: #fff; font-size: 11px; font-weight: 600; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); letter-spacing: 0.04em; pointer-events: none; } /* Facilities: same factsheet-strip treatment as #conditions — one white bar on the accent wash with hairline dividers between cells. */ #facili{ padding: 72px 0; background: var(--ibe-wash, rgba(222, 182, 102, .07)); border-top: 1px solid var(--ibe-hairline, #e9e7e2); border-bottom: 1px solid var(--ibe-hairline, #e9e7e2); } #facili .row { display: flex; flex-wrap: wrap; background: #fff; border: 1px solid var(--ibe-hairline, #e9e7e2); border-radius: var(--radius-lg, 16px); box-shadow: var(--ibe-card-shadow); overflow: hidden; margin-left: 0; margin-right: 0; } #facili .row > [class*="col-"] { display: flex; padding-left: 0; padding-right: 0; } .facili-items img { width: 50px; } .facili-items { width: 100%; text-align: center; padding: 40px 24px; background: transparent; border: 0; border-radius: 0; box-shadow: none; } @media (min-width: 768px) { #facili .row > [class*="col-"] + [class*="col-"] .facili-items { border-left: 1px solid var(--ibe-hairline, #e9e7e2); } } @media (max-width: 767.98px) { #facili .row > [class*="col-"] + [class*="col-"] .facili-items { border-top: 1px solid var(--ibe-hairline, #e9e7e2); } } .facili-items i { display: inline-flex; align-items: center; justify-content: center; width: 56px; height: 56px; border-radius: 100%; color: var(--ibe-accent, #333); background: var(--ibe-wash, rgba(222, 182, 102, .1)); } .facili-items i.fa-2x { font-size: 1.4em; } .facili-items h4 { color: var(--ibe-muted, #5f6672); font-size: 15px; line-height: 1.6; margin-top: 16px; margin-bottom: 0; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 400; } .facili-items h4 b { color: var(--ibe-ink, #333333); font-size: 17px; font-weight: 700; } section#contact { padding: 80px 0 40px; } .contact-row{ margin-top: 40px; } .contact-info > div, .contact-info > a { border: 1px solid var(--ibe-hairline, #e8e6e1); border-radius: var(--radius-md, 12px); margin-bottom: 12px; display: flex; align-items: center; padding: 14px 20px; transition: .3s ease; word-break: break-all; background: #fff; box-shadow: var(--ibe-card-shadow); } .contact-info > div:hover, .contact-info > a:hover { border: 1px solid var(--ibe-accent, #deb666); } .contact-info > div:hover .contect-icon, .contact-info > a:hover .contect-icon { border: 1px solid; color: var(--ibe-on-accent, #fff) !important; background: var(--ibe-accent, #deb666); } .contact-info > div:hover .contect-icon i, .contact-info > a:hover .contect-icon i { color: var(--ibe-on-accent, #fff) !important; } .contect-icon { width: 44px; height: 44px; flex: 0 0 44px; text-align: center; line-height: 44px; font-size: 18px; border-radius: 100%; margin-top: 10px; margin-right: 18px; color: var(--ibe-accent, #deb666); background: var(--ibe-wash, rgba(222, 182, 102, .1)); transition: .3s ease; } .contact-text h5 { font-size: 12px; color: var(--ibe-muted, #bababa); font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 600; text-transform: uppercase; letter-spacing: 0.1em; margin-bottom: 4px; } .contact-text h4 { font-size: 15px; color: #444444; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 400; transition: .3s ease; } .contact-info > div:hover .contact-text h4, .contact-info > a:hover .contact-text h4 { font-weight: 700; } .nearby-location { margin-top: 15px; } .nearby-location h5 { font-size: 12px; color: var(--ibe-accent, #deb666); font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 400; } .nearby-location ul { font-size: 13px; padding-left: 0; list-style-type: none; display: flex; flex-wrap: wrap; gap: 8px 24px; } .nearby-location li { color: #444444; } .nearby-location ul li::before { content: "\2022"; color: var(--ibe-accent, #deb666); font-weight: bold; display: inline-block; width: 1em; margin-left: -1em; } h5.dot-style { color: #444444; position: relative; } .map iframe { border: 3px solid #acacac !important; } section#footer { padding: 40px 0; background: #f1f0ed; } .footer-info h1 { font-size: 26px; color: #555; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 700; margin-bottom: 4px; } .footer-info p { font-size: 14px; line-height: 1.5; color: #888; margin: 0; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 400; } .footer-social h3 { font-size: 14px; color: #888; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 600; text-transform: uppercase; letter-spacing: 0.1em; margin-bottom: 12px; } .footer-social { float: right; margin-top: 0; display: flex; flex-direction: column; align-items: flex-end; } .social-link { display: flex; } .social-link h5 { font-size: 17px; color: #999999; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 400; margin-bottom: 0; margin-top: 2px; } .social-link ul li { margin-left: 4px; margin-right: 4px; } .social-link ul li a { text-decoration: none; font-size: 22px; color: #999; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; border: 1px solid #ddd; border-radius: 8px; transition: all .25s ease; } .social-link ul li a:hover { color: var(--ibe-accent, #deb666); border-color: var(--ibe-accent, #deb666); background: rgba(0,0,0,0.03); } section#copyright { background: #12183f; padding: 17px 0; } .copyright-text p { color: #fff; margin-bottom: 0; text-align: center; font-size: 16px; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 400; } .navbar-fixed-top .date-picker-wrapper { position: absolute !important; top: 100%; left: 50% !important; right: auto !important; transform: translateX(-50%); z-index: 1060; margin-left: 0 !important; margin-right: 0 !important; } section#booking-sec { position: relative !important; z-index: 1050; height: 0 !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; overflow: visible !important; } .booking-bg{ background: #323a40; padding: 10px 0; position: fixed !important; left: 0; right: 0; width: 100%; bottom: 0; } .check-footer { text-align: center; } .btn.focus, .btn:focus { outline: 0; box-shadow: none !important; } button.btn.check-btn { color: var(--ibe-on-accent, #2d2d2d); padding: 3px 140px; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 800; font-size: 17px; background: var(--ibe-accent, #deb666); border-radius: var(--radius-sm, 8px); } svg path{ fill: var(--ibe-accent, #deb666) !important; } .icon{ max-width: 100px; } .check-in { width: 48%; float: left; padding: 15px 20px; border-radius: 8px; background: #f1f0ed; } input#datepick-in { border: 1px solid var(--ibe-accent, #deb666); padding: 15px 0px; text-align: center; background: transparent; color: #fff; width: 100%; border-radius: var(--radius-sm, 8px); } .check-out { width: 48%; float: right; padding: 15px 20px; border-radius: 8px; background: #f1f0ed; } input#datepick-out { border: 1px solid var(--ibe-accent, #deb666); padding: 15px 0px; text-align: center; background: transparent; color: #fff; width: 100%; border-radius: var(--radius-sm, 8px); } input:focus { outline: -webkit-focus-ring-color auto 0px !important; } .suit-type { width: 48%; float: left; padding: 15px 20px; margin-top: 20px; border-radius: 8px; background: #f1f0ed; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 600; } .member-number { width: 48%; float: right; padding: 15px 20px; margin-top: 20px; border-radius: 8px; background: #f1f0ed; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 600; font-size: 18px; } input.popup-email { border: 1px solid var(--ibe-accent, #deb666); width: 100%; margin-top: 20px; padding: 15px 25px; background: #f1f0ed; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 600; font-size: 18px; border-radius: 8px; text-transform: lowercase; } button.btn.btn.check-availability { color: var(--ibe-on-accent, #323a40); padding: 8px 0px; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 800; font-size: 15px; background: var(--ibe-accent, #deb666); margin-top: 30px; width: 100%; text-transform: uppercase; border-radius: var(--radius-sm, 8px); } .modal-content { border-radius: var(--radius-lg, 16px); overflow: hidden; } .modal-body { padding: 35px; } button.close { color: #fff !important; opacity: 1; } .suit-type select { border: 1px solid var(--ibe-accent, #deb666); width: 100%; padding: 15px; text-align: center; background: transparent; color: #333333; width: 100%; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 600; font-size: 18px; } .member-number select { border: 1px solid var(--ibe-accent, #deb666); width: 100%; padding: 15px; text-align: center; background: transparent; color: #333333; width: 100%; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 600; font-size: 18px; } .suit-type option{ width: 100%; padding: 15px !important; text-align: center; background: red; color: var(--ibe-on-accent, #333); width: 100%; background: var(--ibe-accent, #deb666) !important; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 600; font-size: 18px; } .member-number option{ border: 1px solid #444444; width: 100%; padding: 15px !important; text-align: center; background: var(--ibe-accent, #deb666) !important; color: var(--ibe-on-accent, #333); width: 100%; background: var(--ibe-accent, #deb666) !important; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 600; font-size: 18px; } .second-modal-header{ background: #323a40 !important; color: #fff; } .second-modal-header h5{ text-align: center; width: 100%; } label { color: #333333; font-size: 18px; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 600; } input::placeholder{ color: #333333; font-size: 15px !important; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 600; } input{ color: #333333 !important; font-size: 18px; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 600; } /* Ensure the active theme font reaches form controls that don't inherit it. */ textarea, option, select, button, .form-control { font-family: var(--ibe-font, 'Nunito Sans', sans-serif); } .ui-datepicker-header.ui-widget-header.ui-helper-clearfix.ui-corner-all { background: var(--ibe-accent, #deb666); color: var(--ibe-on-accent, #fff); font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 400 !important; } a.ui-state-default { text-align: center !important; background: var(--ibe-accent, #deb666) !important; color: var(--ibe-on-accent, #fff) !important; border: 0 !important; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 400 !important; } .ui-datepicker-calendar th { font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 400 !important; } div#ui-datepicker-div { background: #f1f0ed; } td.ui-datepicker-days-cell-over.ui-datepicker-today { border: 1px solid #333 !important; } a.ui-state-default.ui-state-highlight { background: #333 !important; } .modal-open .modal { overflow-x: hidden; overflow-y: auto; background: #e9ecef94; } #button { display: inline-block; background-color: var(--ibe-accent, #deb666); width: 50px; height: 50px; text-align: center; border-radius: 100%; position: fixed; bottom: 30px; right: 30px; transition: background-color .3s, opacity .5s, visibility .5s; opacity: 0; visibility: hidden; z-index: 2000; } #button::after { content: "\f077"; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: normal; font-style: normal; font-size: 16px; line-height: 50px; color: #fff; } #button:hover { cursor: pointer; background-color: var(--ibe-accent-strong, #c5a158); } #button:active { background-color: #c9543a; } #button.show { opacity: 1; visibility: visible; } html{ scroll-behavior: smooth; } /*-------------Availablity Page------------------*/ .navbar-light .navbar-nav .nav-link { color: #fff !important; } .second-page-suite-image { position: relative; } .second-page-suite-image img { width: 100%; } .second-page-suite-image span { position: absolute; border: 4px solid var(--ibe-accent, #deb666); width: 83%; left: 50%; height: 90%; transform: translate(-50%, -50%); top: 50%; transition: .3s ease; opacity: 0; } .second-page-suite-image:hover span { opacity: 1; } .sdf-facility { background: #ebebeb; padding: 5px; } .sdf-facility ul { list-style-image: url(../images/list-style2.png); padding: 0px 0px; margin-top: 10px; list-style-position: inside; } .sdf-facility ul li { margin-right: 12px; font-size: 15px; } .second-page-suite-info p { font-family: var(--ibe-font, 'Nunito Sans', sans-serif); } #availability-header{ padding: 80px 0px; } .quantity { position: relative; } input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; } input[type=number] { -moz-appearance: textfield; } .quantity input { width: 180px; height: 50px; line-height: 1.65; float: left; display: block; padding: 0; margin: 0; text-align: center; position: relative; z-index: 1; border:1px solid #CCC; border-radius: 10px; } .quantity2 input { width: 180px; height: 50px; line-height: 1.65; float: left; display: block; padding: 0; margin: 0; text-align: center; position: relative; z-index: 1; border:1px solid #CCC; border-radius: 10px; } .quantity-nav { float: left; position: absolute; height: 50px; width: 180px; } .quantity-button { position: relative; cursor: pointer; border-left: 1px solid #999999; width: 20px; text-align: center; color: #333; font-size: 13px; line-height: 1.7; -webkit-transform: translateX(-100%); transform: translateX(-100%); -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; -o-user-select: none; user-select: none; } .quantity-button.quantity-up { position: absolute; height: 30px; right: -10px; background: #eee; z-index: 2; width: 30px; text-align: center; line-height: 30px; font-size: 30px; top: 50%; transform: translate(-50%, -50%); border-radius: 10px; } .quantity-button.quantity-down { position: absolute; top: 50%; border-bottom: 1px solid #eee; width: 30px; background: #eee; height: 30px; line-height: 30px; font-size: 25px; left: 35px; z-index: 1; transform: translate(-100%, -50%); text-align: center; border-radius: 10px; } .secont-page-member-select.quantity span { font-size: 20px; font-weight: 600; margin-bottom: 8px; display: inline-block; } .secont-page-member-select.quantity2 span { font-size: 20px; font-weight: 600; margin-bottom: 8px; display: inline-block; } .adult-quantity { width: 33%; float: left; } .child-quantity { width: 33%; float: left; } .child-ages { width: 33%; float: left; } .chd-selects{ width: 23%; float: left; } .age-span { font-size: 20px; font-weight: 600; margin-bottom: 8px; display: inline-block; } .second-suite-price { display: flow-root; width: 35%; float: left; position: relative; } .second-suite-price:after { content: ""; position: absolute; width: 2px; height: 100%; right: 35px; top: 0; } .second-suite-includ { display: flow-root; width: 40%; float: left; position: relative; } /* ===== Rates section ===== */ .ibe-rates-container { margin-top: 1rem; padding-top: 0.5rem; } .ibe-rates { display: flex; flex-direction: column; gap: 0.75rem; } /* ===== Rate Card ===== */ .rate-card { position: relative; border: 1px solid #e5e7eb; border-radius: 12px; padding: 1.1rem 1.25rem 1rem; background: #fff; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); box-sizing: border-box; transition: box-shadow 0.2s ease, border-color 0.2s ease; } .rate-card:hover { box-shadow: 0 4px 20px rgba(0,0,0,0.07); border-color: #d1d5db; } .rate-card--best { border-color: var(--ibe-accent); border-width: 2px; background: linear-gradient(160deg, var(--ibe-accent-light) 0%, #fff 60%); } .rate-card--best:hover { border-color: var(--ibe-accent); box-shadow: 0 4px 20px rgba(var(--ibe-accent-rgb), 0.12); } .rate-card__badge { position: absolute; top: -10px; left: 1.1rem; background: var(--ibe-accent); color: var(--ibe-on-accent, #fff); font-size: 10px; font-weight: 800; padding: 3px 12px; border-radius: 20px; letter-spacing: 0.06em; text-transform: uppercase; box-shadow: 0 2px 8px rgba(var(--ibe-accent-rgb), 0.30); } /* Price */ .rate-card__price-block { display: flex; align-items: baseline; flex-wrap: wrap; gap: 0.25rem 0.6rem; margin-bottom: 0.25rem; margin-top: 0.5rem; } .rate-card__price { font-size: 1.75rem; font-weight: 800; color: #111; line-height: 1.1; letter-spacing: -0.03em; } .rate-card__nights { background: none; border: none; padding: 0; color: var(--ibe-accent); font-size: 0.8125rem; font-family: inherit; cursor: pointer; font-weight: 600; } .rate-card__nights:hover { opacity: 0.8; text-decoration: underline; } .breakdown { margin-bottom: 0.5rem; padding: 6px 0; border-top: 1px solid #f0f0f0; } .breakdown__row { display: flex; justify-content: space-between; padding: 3px 0; font-size: 0.8125rem; color: #6b7280; } .breakdown__val { font-weight: 600; color: #374151; } .breakdown__arrow { font-size: 10px; transition: transform 0.2s ease; color: var(--ibe-accent); } .rate-card__nights[aria-expanded="true"] .breakdown__arrow { transform: rotate(180deg); } /* Title & description */ .rate-card__title { font-size: 1rem; font-weight: 700; color: #222; line-height: 1.35; margin: 0 0 0.2rem 0; word-wrap: break-word; overflow-wrap: break-word; } .rate-card__desc { font-size: 0.75rem; color: #9ca3af; line-height: 1.45; margin: 0 0 0.5rem 0; word-wrap: break-word; overflow-wrap: break-word; } /* Meta — breakfast + cancellation */ .rate-card__meta { font-size: 0.8rem; color: #555; font-weight: 600; margin: 0.35rem 0 0.75rem 0; line-height: 1.45; padding: 5px 10px; background: #f7f7f7; border-radius: 8px; display: inline-block; } /* Cancellation policy indicator */ .rate-card__cancel { white-space: nowrap; cursor: help; } .rate-card__cancel--free { color: #16a34a; } .rate-card__cancel--partial { color: #d97706; } .rate-card__cancel--non_refundable { color: #dc2626; } .rate-card__cancel--neutral { color: inherit; } .rate-card__cancel-info { font-size: 0.7em; opacity: 0.7; vertical-align: middle; } /* Cancellation policy block */ .rate-card__policy { margin: 8px 0 4px; padding: 9px 12px; border-radius: 6px; font-size: 0.8rem; line-height: 1.45; } .rate-card__policy-label { display: block; font-weight: 600; } .rate-card__policy-detail { display: block; font-weight: 400; opacity: 0.8; font-size: 0.75rem; margin-top: 2px; } .rate-card__policy-payment { display: block; font-weight: 400; font-size: 0.75rem; margin-top: 4px; padding-top: 4px; border-top: 1px dashed currentColor; opacity: 0.7; } .rate-card__policy--free { background: rgba(22, 163, 74, 0.07); color: #15803d; } .rate-card__policy--partial { background: rgba(22, 163, 74, 0.07); color: #15803d; } .rate-card__policy--non_refundable { background: rgba(234, 179, 8, 0.10); color: #854d0e; } .rate-card__policy--neutral { background: rgba(156, 163, 175, 0.08); color: #374151; } /* Per-night price */ .rate-card__pernight { font-size: 0.8125rem; color: #6b7280; font-weight: 600; } /* CTA */ .rate-card__cta { width: 100%; margin-top: 0.6rem; } .rate-card__book-btn { display: block; width: 100%; height: 46px; border: none; border-radius: 10px; background: var(--ibe-accent); color: var(--ibe-on-accent, #fff); font-size: 0.9375rem; font-weight: 700; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); cursor: pointer; transition: opacity 0.2s ease, transform 0.1s ease; letter-spacing: 0.01em; } .rate-card__book-btn:hover { opacity: 0.88; transform: translateY(-1px); } .rate-card__book-btn:active { transform: translateY(0); opacity: 1; } /* Quantity counter (shown after booking) */ .rate-card__qty { display: flex; align-items: center; justify-content: center; gap: 0.5rem; height: 46px; border: 2px solid var(--ibe-accent); border-radius: 10px; background: var(--ibe-accent-light); } .rate-card__qty-btn { width: 34px; height: 34px; border: none; border-radius: 8px; background: var(--ibe-accent); color: var(--ibe-on-accent, #fff); font-size: 1.2rem; font-weight: 700; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: opacity 0.15s ease; } .rate-card__qty-btn:hover { opacity: 0.85; } .rate-card__qty-val { font-size: 1.1rem; font-weight: 800; color: var(--ibe-accent); min-width: 1.5rem; text-align: center; } .rate-card__qty-label { font-size: 0.8125rem; color: #555; font-weight: 600; margin-right: 0.25rem; } /* Keep old class references working */ .rate-item {} .second-suite-booking { margin-top: 14px; } .second-suite { display: inline-block; width: 100%; margin-top: 40px; } span.price-include-title { color: #828282; font-size: 12px; font-weight: 600; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); } .second-suite-booking h4 { color: #000; font-size: 20px; font-weight: 700; margin-top: 10px; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); } span.night-counte { font-size: 16px; color: #111111; margin-top: 10px; } .second-suite-booking button { color: #17a2b8; margin-top: 0px; border: 0; background: none; padding: 0; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-size: 12px; } .second-suite-includ h6 { font-size: 16px; margin-top: 8px; color: #333; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 800; } .second-suite-includ h4 { margin-top: 15px; font-size: 22px; color: #000; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 700; } .second-suite-booking label { color: #ff5656; font-weight: 400; font-size: 15px } .second-suite-booking select { border: 1px solid; border-color: #2ba8bc; padding: 10px; background: #f8f9fa; color: #000; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 700; height: 50px; font-size: 14px; } .second-suite-booking select option{ color: #000; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 400; } select:focus { outline: -webkit-focus-ring-color auto 0px; } .suite-tow{ margin-top: 70px; } .footer-price p { color: #fff; font-weight: 500; margin-bottom: 0; margin-top: 8px; font-size: 14px; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); } .footer-price small{ font-family: var(--ibe-font, 'Nunito Sans', sans-serif); } .footer-price p span { color: #28a745; font-weight: 700; font-size: 17px; } .footer-price h4{ font-size: 15px; } .resenvation-bnt button { background: #28a745 !important; color: #fff !important; padding: 10px 20px !important; width: 100%; } /*--------------Form Page Style--------------*/ section#booking-form { padding: 50px 0px 90px 0; } .input-first-name { width: 48%; float: left; margin-bottom: 35px !important; } .input-last-name { width: 48%; float: right; margin-bottom: 35px !important; } .input-level h5 { color: #333333; font-size: 20px; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 400; } .input-email-main { width: 48%; display: grid; float: left; margin-bottom: 35px !important; } .input-phone-main { width: 48%; display: grid; float: right; margin-bottom: 35px !important; } .input-booking-type { width: 48%; float: left; display: grid; margin-bottom: 35px; } .input-booking-day { width: 48%; float: right; display: grid; margin-bottom: 35px; } .input-country { width: 30%; float: left; } .input-state { width: 30%; float: left; } .input-zip { width: 30%; float: right; } .country-seclection { display: flex; justify-content: space-between; width: 100%; margin-bottom: 35px; } .input-flight-no { width: 48%; float: left; display: grid; margin-bottom: 35px; } .input-arrive-time { width: 48%; float: right; display: grid; margin-bottom: 35px; } .input-checkin-time { width: 48%; display: grid; margin-bottom: 35px; } span.payment-info-title { color: #333333; font-size: 26px; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 500; } .reservation-form-title h4 { color: #333333; font-size: 26px; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 500; } .input-address-main { width: 100%; display: grid; margin-bottom: 25px; } .input-address-optional { width: 100%; margin-bottom: 25px; } .input-level select { -webkit-appearance: none; -moz-appearance: window; padding: 2px 50px 2px 2px; border: none; background-image: url(../images/down-arrow.png); background-repeat: no-repeat; background-position: 97% center; border: 1px solid #ced4da; width: 100%; padding: 6px; border-radius: 8px; } select { color: #333333 !important; font-size: 16px; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 600; } .input-level select option{ background: var(--ibe-accent, #deb666); padding: 10px; } .form-control:focus { color: #495057; background-color: #fff; border-color: #80bdff; outline: 0; box-shadow: none; } .back-to-search a { width: 220px; display: inline-block; text-align: center; padding: 6px; text-decoration: none; color: #fff; background: #6c757d; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); border-radius: 10px; } span.badge { background: #5d70ff; /* border-radius: 100%; */ color: #fff; /* font-size: 16px; */ } .suite-counte { font-size: 15px; margin-bottom: 10px !important; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 600; } .total-suite-price { font-size: 17px; margin-bottom: 10px !important; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 600; } ul.include-in-price { padding: 0; list-style: none; font-size: 14px; line-height: 22px; color: #999999; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); } .total-suite-price-title { font-size: 15px; margin-bottom: 10px !important; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 600; } .total-price-amount { font-size: 17px; margin-bottom: 10px !important; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 600; } button#redeem { background: var(--ibe-accent, #deb666); color: var(--ibe-on-accent, #333); font-size: 16px; margin-bottom: 10px !important; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 600; } .visa-image img { width: 50px; margin-bottom: 35px; } label.custom-control-label { font-size: 16px; line-height: 29px; } .confirm-booking-bnt button { background: #dc3545 !important; color: #fff !important; padding: 5px 25px !important; width: 450px; font-size: 22px !important; } button.btn.check-btn.count h3 { font-size: 14px; display: inline-block; } button.btn.check-btn.count h3 { font-size: 14px; display: inline-block; } span#timer { font-size: 15px; margin-left: 10px; } /*-------------------details page----------------------*/ .booking-info-details img { width: 150px; } .b-i-details-content p img { width: auto; } .b-i-details-content p { text-align: left; } .b-i-details-content ul li p { font-size: 16px !important; font-weight: 400; } .b-i-details-content ul li span{ font-size: 16px !important; font-weight: 400; } .booking-info-details { width: 350px; text-align: center; } .booking-info-details img { width: 150px; margin-bottom: 20px; } section#details { padding: 50px 0 90px 0; } .b-i-details-content { text-align: left; } a.checkin-now { border: 2px solid #3e55ff; display: inline-block; padding: 10px 30px; border-radius: 10px; color: #333; font-size: 20px; text-decoration: none; margin-top: 10px; } .bar-code { text-align: right; } .bar-code img { width: 65px; } .bar-code span { font-size: 16px; color: gray; margin-top: 10px; display: inline-block; } .guest-details h4 { margin-bottom: 40px; } .guest-details { width: 350px; } .room-details img { width: 100%; position: relative; z-index: 1; } .room-details { position: relative; } .room-details:before { content: ""; position: absolute; width: 150px; height: 150px; left: -3px; top: -3px; background: var(--ibe-accent, #deb666); } .room-details:after { content: ""; position: absolute; width: 150px; height: 150px; right: -3px; bottom: -3px; background: var(--ibe-accent, #deb666); } .day-and-price-details { display: flex; justify-content: space-between; } .in-and-out-details { display: flex; justify-content: space-between; } .checkin-details { border: 1px solid; width: 48%; text-align: center; padding: 36px 0; border-radius: 20px; } .checkout-details { border: 1px solid; width: 48%; text-align: center; padding: 36px 0; border-radius: 20px; } .room-details-info h4 { font-size: 32px; } .day-and-price-details p { font-size: 18px; margin-top: 10px; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); } .day-and-price-details span { font-size: 18px; margin-top: 10px; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); display: inline-block; color: #3cd35a; } .in-and-out-details h5 { font-size: 26px; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 600; margin-bottom: 16px; } .in-and-out-details p { font-size: 26px; font-size: 18px; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); margin-bottom: 0; } .member-details { display: flex; justify-content: space-between; width: 480px; } .member-details p{ font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-size: 20px; color: #333; } .contact-form form textarea { width: 100%; } .contact-form form button { width: 100%; margin-top: 10px; border-radius: 10px; } .contact-direction a { width: 100%; border-radius: 10px; } h4.contact-form-title { margin-bottom: 20px; } .contact-form { margin-bottom: 25px; } .contact-direction-main{ margin-bottom: 25px; } /*------------------Payment page---------------------*/ section#payment-page { padding: 70px 0 100px 0; } .payment-option-bg { background: #ced4da; padding: 70px 70px; } .visa-image.payment-page-cards img { margin-bottom: 0; } .payment-option-bg p { font-size: 16px; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); } .payment-page-amount-select { background: #fff; padding: 40px 40px; border-radius: 10px; } .visa-image.payment-page-cards { padding: 10px; border-radius: 10px; background: #ced4da; margin-bottom: 30px; } .form-group.bank-payment-box { margin-top: 50px; } .payment-note p { display: inline-block; float: right; margin-top: -50px; } section#contact-form-sec { padding-bottom: 80px; } .card.ability-card { margin-top: 0; border-radius: 0; } .card.ability-card .card-body { /* background: #dee2e6; */ } .card.ability-card .slick-dotted.slick-slider { margin-bottom: 0; } .card.ability-card .card-body { /* background: #dee2e6; */ padding: 0px 15px; } .nearby-location h5 { display: inline; float: left; width: 120px; } .hero-img { width: 100%; overflow: hidden; justify-content: center; max-height: 500px; min-height: 500px; } @media (max-width: 1199.9px) { ol.carousel-indicators { bottom: -45px; } .card-body ul { padding: 0px 0px 0px 0px; /* float: left; */ list-style-type: none; } .card-body ul li { font-size: 14px; } .condition-items { height: auto; padding: 40px 24px; margin-bottom: 20px; } .spa-content { margin-top: 35px; } .spa-content.restaurant-content { margin-top: 0px; } } @media (max-width: 991.9px) { .hero-img { width: 100%; overflow: hidden; justify-content: center; max-height: 300px; min-height: 300px; } .card-body ul li { font-size: 15px; float: left; margin-right: 10px; } .condition-items { height: auto; padding: 36px 20px; } .spa-content img { width: 90px; } .spa-content { margin-top: 5px; } .spa-image span { display: none; } .spa-content h4 { font-size: 25px; margin-top: 15px; } .facili-items h4 { font-size: 17px; margin-top: 20px; } .contact-text h4 { font-size: 14px; } .footer-info p { width: 100%; } .footer-info h1 { font-size: 35px; } .hero-logo h1 { font-size: 24px; } .hero-logo img { width: 130px; } .sec-title h2 { font-size: 28px; } .condition-items h3 { font-size: 30px; } .condition-items h3 span { font-size: 40px; } .quantity-nav { width: 130px; } .quantity input { width: 130px; } .second-suite-price h4 { color: #000; font-size: 23px; } .second-suite-price button { font-size: 13px; } .second-suite-price:after { right: 5px; } .second-suite-includ:after { right: 10px; } .second-suite-includ h4 { font-size: 19px; } button.navbar-toggler { display: none !important; } .member-details { width: auto; } .room-details-info h4 { font-size: 25px; } .member-details p { font-size: 17px; } .in-and-out-details h5 { font-size: 21px; margin-bottom: 8px; } .checkout-details { padding: 20px 0; } .checkin-details { padding: 20px 0; } .input-level h5 { font-size: 16px; } .confirm-booking-bnt button { width: auto; font-size: 20px !important; } .total-suite-price { text-align: right; } button#redeem { width: 195px; border-radius: var(--radius-sm, 8px); margin-top: 10px; } .payment-option-bg p { font-size: 9px; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); } section#contact-form-sec { padding-bottom: 100px; } } #add-discount{ font-size: 12px; } .my-0{ font-size:15px; } @media (max-width: 767.9px) { } @media (max-width: 575.9px) { .navbar-fixed-top .date-picker-wrapper { left: 0 !important; right: 0 !important; transform: none; width: 100%; } .hero-container{ padding-top:30vh; } .hero { position: relative; height: 93vh; z-index: -2; font-size:12px; } .hero h1{ font-size:30px; margin-top:-10px; } .list-group-item { position: relative; display: block; padding: .75rem 1.25rem; background-color: #fff; border: 1px solid rgba(0,0,0,.125); width: 350px; } button.btn.check-btn { padding: 3px 30px; } .hero-slider { margin-top: 0px; } button.slick-prev.slick-arrow { /* display: none !important; */ } button.slick-next.slick-arrow { /* display: none !important; */ } .hero-logo { /* margin-top: 5px; */ /* margin-bottom: 0px; */ } .hero-logo h1 { font-size: 30px; } .sec-title h2 { font-size: 25px; line-height: 40px; } .sec-title h5 { font-size: 17px; } .card-body ul li { font-size: 14px; } span.hover-border{ display: none; } .condition-items { height: auto; padding: 32px 24px; margin-bottom: 30px; } .spa-content { margin-top: 40px; margin-bottom: 40px; } .restaurent-row { margin-top: 50px; } .about-content { text-align: left; margin-top: 32px; } .about-content h3 { font-size: 22px; } .about-amenities-grid { grid-template-columns: 1fr 1fr; } .facili-items { padding: 40px 20px; margin-bottom: 20px; } .contact-text h4 { font-size: 16px; } .nearby-location h5 { font-size: 13px; } .footer-info { text-align: center; } .footer-info h1 { font-size: 30px; } .footer-social { float: none; margin-top: 24px; text-align: center; align-items: center; } .social-link { display: flex; justify-content: center; } .social-link ul.nav { justify-content: center; } #button { width: 40px; height: 40px; bottom: 49px; right: 5px; } #button::after { line-height: 40px; } label { font-size: 15px; } .modal-body { padding: 25px 5px; } .check-in { padding: 15px 10px; } .check-out { padding: 15px 10px; } input::placeholder{ color: #333333; text-transform: uppercase; font-size: 11px !important; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 600; } .suit-type { padding: 15px 10px; } .member-number { padding: 15px 10px; } button.btn.check-btn { font-size: 17px; } button.btn.btn.check-availability { font-size: 16px; } input#datepick-in { padding: 7px 0px; } input#datepick-out { padding: 7px 0px; } .suit-type select { padding: 7px; } .member-number select { padding: 7px; } input.popup-email { padding: 10px 10px; } a.navbar-brand { font-size: 17px; display: block; display: inline-table; } .logo{ max-height: 90px; } .copyright-text p { font-size: 13px; } ol.carousel-indicators li { width: 10px; height: 10px; } a.carousel-control-prev { width: 30px; height: 30px; left: 5px; display: none; } a.carousel-control-next { width: 30px; height: 30px; right: 5px; display: none; } .adult-quantity { width: 50%; float: left; } .child-quantity { width: 45%; float: left; } .second-suite-price { width: 40%; float: left; } .second-suite-includ { width: 70%; float: left; } .second-suite-includ:after { display: none; } .second-suite-price:after { right: 0px; } .second-page-suite-info { margin-top: 20px; } .check-footer.resenvation-bnt button { margin-top: 10px; } #availability-header { padding: 0px 0px 0px; } #availability-header { padding-top:0px; margin-top:0px; } .booking-info-details { width: auto; text-align: center; } .guest-details { width: auto; } .bar-code { text-align: center; margin-top: 30px; } a.checkin-now { display: block; padding: 4px 30px; font-size: 18px; text-align: center; } .room-details { margin-bottom: 20px; } .input-first-name { width: 100%; float: inherit; } .input-last-name { width: 100%; float: inherit; } .input-email-main { width: 100%; float: inherit; } .input-phone-main { width: 100%; float: inherit; } .input-booking-type { width: 100%; float: inherit; } .input-booking-day { width: 100%; float: inherit; } .input-checkin-time { width: 100%; } .input-group-append.redeem-button { width: 100%; } .input-group-append.redeem-button button { width: 100% !important; } input.form-control.redeem-input { border-radius: var(--radius-sm, 8px) !important; } .row.payment-line p { font-size: 14px; } .check-footer.confirm-booking-bnt button { padding: 0px !important; margin-top: 10px; } .back-to-search { text-align: center; } .back-to-search a { font-size: 12px; } .check-footer.confirm-booking-bnt button { padding: 0px !important; margin-top: 10px; font-size: 17px !important; } section#booking-form { padding: 50px 0px 130px 0; } .payment-option-bg { padding: 40px 15px; } .payment-page-amount-select { background: #fff; padding: 20px 15px; border-radius: 10px; } .payment-page-amount-select h4 { font-size: 20px; margin-bottom: 15px; } .visa-image.payment-page-cards { padding: 7px; border-radius: 10px; background: #ced4da; margin-bottom: 25px; } .payment-note p { display: inline-block; float: inherit; margin-top: 10px; } button.btn.check-btn.count.payment-page-f-btn { width: 100%; padding: 7px !important; } section#contact-form-sec { padding-bottom: 120px; } } .rooms-carousel{ max-width: 100%; } .rooms-carousel .team-image, .room-carousel .team-image, .room-editorial__hero, .room-editorial__thumb { overflow: hidden; aspect-ratio: 4 / 5; } .rooms-carousel .team-image.ibe-orient-landscape, .room-carousel .team-image.ibe-orient-landscape, .room-editorial__hero.ibe-orient-landscape, .room-editorial__thumb.ibe-orient-landscape { aspect-ratio: 4 / 3; } .rooms-carousel .team-image.ibe-orient-portrait, .room-carousel .team-image.ibe-orient-portrait, .room-editorial__hero.ibe-orient-portrait, .room-editorial__thumb.ibe-orient-portrait { aspect-ratio: 4 / 5; } .rooms-carousel .team-image.ibe-orient-square, .room-carousel .team-image.ibe-orient-square, .room-editorial__hero.ibe-orient-square, .room-editorial__thumb.ibe-orient-square { aspect-ratio: 1 / 1; } .rooms-carousel .team-image img, .room-carousel .team-image img { width: 100%; height: 100%; object-fit: cover; } .booking-features{ font-size: 12px; } .more-info{ color: var(--ibe-accent, #6bbdcc); font-size: 13px; font-weight: 700; display: inline-block; margin-bottom: 6px; cursor: pointer; } .more-info__arrow{ font-size: 10px; transition: transform 0.2s ease; } .more-info[aria-expanded="true"] .more-info__arrow{ transform: rotate(180deg); } .room-desc{ margin-bottom: 8px; } .room-desc__text{ font-size: 0.8125rem; color: #6b7280; line-height: 1.5; margin: 4px 0 0 0; } .room-result-card.card-body ul{ padding-left: 0px; list-style-type: none; margin-left: 0px; } .room-result-card.card-body li{ margin-left: 0px; padding-left: 0px; } .second-suite-includ{ padding:0px; } .invalid-feedback{ font-size: 12px; display: block; } .date-info{ font-size: 12px; } h2, h3, h4, h5, h6{ font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-size: 30px; font-weight: 700; } .pulse { animation: pulse-animation 2s infinite; } @keyframes pulse-animation { 0% { box-shadow: 0 0 0 0px rgba(0, 0, 0, 0.5); } 100% { box-shadow: 0 0 0 30px rgba(0, 0, 0, 0); } } .payment-secure{ font-size: 11px; } .navbar { position: relative; min-height: 50px; margin-bottom: 20px; border: 1px solid transparent } /* ===================================== */ /* ===== THE INTERESTING STUFF NOW ===== */ /* ===================================== */ .navbar { border: none; -webkit-transition: 0.4s; transition: 0.4s; /* --- navbar sizes --- */ /* --- navbar colors --- */ } .navbar-brand { font-size: 2.25rem; font-weight: 900; color: #4b4b4b; } .navbar--size--xl { padding: 2rem 0; } .navbar--size--lg { padding: 0rem 0; } .navbar--size--md { padding: 0rem 0; } .navbar--color--white { background: #fff; } .navbar--color--primary { background: #37ca7e; } .navbar--color--secondary { background: var(--ibe-accent, #343b3f); background-image: linear-gradient(135deg, var(--ibe-accent, #343b3f) 0%, var(--ibe-accent-strong, #23282b) 100%); color: var(--ibe-on-accent, #fff); box-shadow: 0 6px 24px rgba(16, 24, 40, .16); } .navbar--color--ghost { background: rgba(0,0,0,0.2); } .navbar--color--ghost .navbar-brand, .navbar--color--ghost .navbar-text, .navbar--color--ghost a { color: #fff; } .conditions { margin-left: 0px; padding-left: 0px; } .conditions li{ margin-left:0; padding-left:0; list-style: none; } .discount{ max-width: 80px; padding-right: 10px; } .strike{ text-decoration: line-through; } .new-total{ text-decoration: none; } .other-prices{ display: none; } .date-link{ text-decoration-line: underline; text-decoration-style: wavy; } .bed-types{ font-size: 12px; } h5.card-title{ padding-top: 15px; } @media (min-width:768px) { .navbar { border-radius: 4px } } @media (min-width:768px) { .navbar-header { float: left } } .navbar-collapse { padding-right: 15px; padding-left: 15px; overflow-x: visible; -webkit-overflow-scrolling: touch; } .navbar-collapse.in { overflow-y: auto } @media (min-width:768px) { .navbar-collapse { width: auto; border-top: 0; -webkit-box-shadow: none; box-shadow: none } .navbar-collapse.collapse { display: block!important; height: auto!important; padding-bottom: 0; overflow: visible!important } .navbar-collapse.in { overflow-y: visible } .navbar-fixed-bottom .navbar-collapse, .navbar-fixed-top .navbar-collapse, .navbar-static-top .navbar-collapse { padding-right: 0; padding-left: 0 } } .navbar-fixed-bottom .navbar-collapse, .navbar-fixed-top .navbar-collapse { max-height: 340px } @media (max-device-width:480px) and (orientation:landscape) { .navbar-fixed-bottom .navbar-collapse, .navbar-fixed-top .navbar-collapse { max-height: 200px } } .container-fluid>.navbar-collapse, .container-fluid>.navbar-header, .container>.navbar-collapse, .container>.navbar-header { /* margin-right: -15px; */ /* margin-left: -15px; */ width: 100%; } @media (min-width:768px) { .container-fluid>.navbar-collapse, .container-fluid>.navbar-header, .container>.navbar-collapse, .container>.navbar-header { margin-right: 0; margin-left: 0 } } .navbar-static-top { z-index: 1000; border-width: 0 0 1px } @media (min-width:768px) { .navbar-static-top { border-radius: 0 } } .navbar-fixed-bottom, .navbar-fixed-top { position: fixed; right: 0; left: 0; z-index: 1030 } @media (min-width:768px) { .navbar-fixed-bottom, .navbar-fixed-top { border-radius: 0 } } .navbar-fixed-top { top: 0; border-width: 0 0 1px } .navbar-fixed-bottom { bottom: 0; margin-bottom: 0; border-width: 1px 0 0 } .navbar-brand { float: left; height: 50px; padding: 15px 5px; font-size: 18px; line-height: 20px; } .navbar-brand:focus, .navbar-brand:hover { text-decoration: none } .navbar-brand>img, #logo.img-fluid, .ibe-header__brand img { display: block; max-width: var(--ibe-logo-max-width, 240px); max-height: var(--ibe-logo-max-height, 90px); height: auto; width: auto; object-fit: contain; } @media (min-width:768px) { .navbar>.container .navbar-brand, .navbar>.container-fluid .navbar-brand { margin-left: 0px } } .navbar-toggle { position: relative; float: right; padding: 9px 10px; margin-top: 8px; margin-right: 15px; margin-bottom: 8px; background-color: transparent; background-image: none; border: 1px solid transparent; border-radius: 4px } .navbar-toggle:focus { outline: 0 } .navbar-toggle .icon-bar { display: block; width: 22px; height: 2px; border-radius: 1px } .navbar-toggle .icon-bar+.icon-bar { margin-top: 4px } @media (min-width:768px) { .navbar-toggle { display: none } } .navbar-nav { margin: 7.5px -15px } .navbar-nav>li>a { padding-top: 10px; padding-bottom: 10px; line-height: 20px } @media (max-width:767px) { .rooms-carousel{ max-width: 100%; } #period-col{ margin-top:-30px; } .navbar-nav .open .dropdown-menu { position: static; float: none; width: auto; margin-top: 0; background-color: transparent; border: 0; -webkit-box-shadow: none; box-shadow: none } .navbar-nav .open .dropdown-menu .dropdown-header, .navbar-nav .open .dropdown-menu>li>a { padding: 5px 15px 5px 25px } .navbar-nav .open .dropdown-menu>li>a { line-height: 20px } .navbar-nav .open .dropdown-menu>li>a:focus, .navbar-nav .open .dropdown-menu>li>a:hover { background-image: none } } @media (min-width:768px) { .navbar-nav { float: left; margin: 0 } .navbar-nav>li { float: left } .navbar-nav>li>a { padding-top: 15px; padding-bottom: 15px } } .navbar-form { padding: 10px 15px; margin-top: 8px; margin-right: -15px; margin-bottom: 8px; margin-left: -15px; border-top: 1px solid transparent; border-bottom: 1px solid transparent; -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 1px 0 rgba(255, 255, 255, .1); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 1px 0 rgba(255, 255, 255, .1) } @media (min-width:768px) { .navbar-form .form-group { display: inline-block; margin-bottom: 0; vertical-align: middle } .navbar-form .form-control { display: inline-block; width: auto; vertical-align: middle } .navbar-form .form-control-static { display: inline-block } .navbar-form .input-group { display: inline-table; vertical-align: middle } .navbar-form .input-group .form-control, .navbar-form .input-group .input-group-addon, .navbar-form .input-group .input-group-btn { width: auto } .navbar-form .input-group>.form-control { width: 100% } .navbar-form .control-label { margin-bottom: 0; vertical-align: middle } .navbar-form .checkbox, .navbar-form .radio { display: inline-block; margin-top: 0; margin-bottom: 0; vertical-align: middle } .navbar-form .checkbox label, .navbar-form .radio label { padding-left: 0 } .navbar-form .checkbox input[type=checkbox], .navbar-form .radio input[type=radio] { position: relative; margin-left: 0 } .navbar-form .has-feedback .form-control-feedback { top: 0 } } @media (max-width:767px) { .navbar-form .form-group { margin-bottom: 5px } .navbar-form .form-group:last-child { margin-bottom: 0 } } @media (min-width:768px) { .navbar-form { width: auto; padding-top: 0; padding-bottom: 0; margin-right: 0; margin-left: 0; border: 0; -webkit-box-shadow: none; box-shadow: none } } .navbar-nav>li>.dropdown-menu { margin-top: 0; border-top-left-radius: 0; border-top-right-radius: 0 } .navbar-fixed-bottom .navbar-nav>li>.dropdown-menu { margin-bottom: 0; border-top-left-radius: 4px; border-top-right-radius: 4px; border-bottom-right-radius: 0; border-bottom-left-radius: 0 } .navbar-btn { margin-top: 8px; margin-bottom: 8px } .navbar-btn.btn-sm { margin-top: 10px; margin-bottom: 10px } .navbar-btn.btn-xs { margin-top: 14px; margin-bottom: 14px } .navbar-text { margin-top: 15px; margin-bottom: 15px } @media (min-width:768px) { .navbar-text { float: left; margin-right: 15px; margin-left: 15px } } @media (min-width:768px) { .navbar-left { float: left!important } .navbar-right { float: right!important; margin-right: -15px } .navbar-right~.navbar-right { margin-right: 0 } } .navbar-default { background-color: #f8f8f8; border-color: #e7e7e7 } .navbar-default .navbar-brand { color: #777 } .navbar-default .navbar-brand:focus, .navbar-default .navbar-brand:hover { color: #5e5e5e; background-color: transparent } .navbar-default .navbar-text { color: #777 } .navbar-default .navbar-nav>li>a { color: #777 } .navbar-default .navbar-nav>li>a:focus, .navbar-default .navbar-nav>li>a:hover { color: #333; background-color: transparent } .navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:focus, .navbar-default .navbar-nav>.active>a:hover { color: #555; background-color: #e7e7e7 } .navbar-default .navbar-nav>.disabled>a, .navbar-default .navbar-nav>.disabled>a:focus, .navbar-default .navbar-nav>.disabled>a:hover { color: #ccc; background-color: transparent } .navbar-default .navbar-toggle { border-color: #ddd } .navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover { background-color: #ddd } .navbar-default .navbar-toggle .icon-bar { background-color: #888 } .navbar-default .navbar-collapse, .navbar-default .navbar-form { border-color: #e7e7e7 } .navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:focus, .navbar-default .navbar-nav>.open>a:hover { color: #555; background-color: #e7e7e7 } @media (max-width:767px) { .navbar-default .navbar-nav .open .dropdown-menu>li>a { color: #777 } .navbar-default .navbar-nav .open .dropdown-menu>li>a:focus, .navbar-default .navbar-nav .open .dropdown-menu>li>a:hover { color: #333; background-color: transparent } .navbar-default .navbar-nav .open .dropdown-menu>.active>a, .navbar-default .navbar-nav .open .dropdown-menu>.active>a:focus, .navbar-default .navbar-nav .open .dropdown-menu>.active>a:hover { color: #555; background-color: #e7e7e7 } .navbar-default .navbar-nav .open .dropdown-menu>.disabled>a, .navbar-default .navbar-nav .open .dropdown-menu>.disabled>a:focus, .navbar-default .navbar-nav .open .dropdown-menu>.disabled>a:hover { color: #ccc; background-color: transparent } } .navbar-default .navbar-link { color: #777 } .navbar-default .navbar-link:hover { color: #333 } .navbar-default .btn-link { color: #777 } .navbar-default .btn-link:focus, .navbar-default .btn-link:hover { color: #333 } .navbar-default .btn-link[disabled]:focus, .navbar-default .btn-link[disabled]:hover, fieldset[disabled] .navbar-default .btn-link:focus, fieldset[disabled] .navbar-default .btn-link:hover { color: #ccc } .navbar-inverse { background-color: #222; border-color: #080808 } .navbar-inverse .navbar-brand { color: #9d9d9d } .navbar-inverse .navbar-brand:focus, .navbar-inverse .navbar-brand:hover { color: #fff; background-color: transparent } .navbar-inverse .navbar-text { color: #9d9d9d } .navbar-inverse .navbar-nav>li>a { color: #9d9d9d } .navbar-inverse .navbar-nav>li>a:focus, .navbar-inverse .navbar-nav>li>a:hover { color: #fff; background-color: transparent } .navbar-inverse .navbar-nav>.active>a, .navbar-inverse .navbar-nav>.active>a:focus, .navbar-inverse .navbar-nav>.active>a:hover { color: #fff; background-color: #080808 } .navbar-inverse .navbar-nav>.disabled>a, .navbar-inverse .navbar-nav>.disabled>a:focus, .navbar-inverse .navbar-nav>.disabled>a:hover { color: #444; background-color: transparent } .navbar-inverse .navbar-toggle { border-color: #333 } .navbar-inverse .navbar-toggle:focus, .navbar-inverse .navbar-toggle:hover { background-color: #333 } .navbar-inverse .navbar-toggle .icon-bar { background-color: #fff } .navbar-inverse .navbar-collapse, .navbar-inverse .navbar-form { border-color: #101010 } .navbar-inverse .navbar-nav>.open>a, .navbar-inverse .navbar-nav>.open>a:focus, .navbar-inverse .navbar-nav>.open>a:hover { color: #fff; background-color: #080808 } @media (max-width: 767px) { .footer-price{ font-size: 18px; } .navbar-brand { height: auto; padding: 5px 10px; } .navbar-brand>img, #logo.img-fluid, .ibe-header__brand img { height: auto; margin:0 auto; max-width: var(--ibe-logo-max-width-mobile, 140px); max-height: var(--ibe-logo-max-height-mobile, 40px); } #mobileNav{ margin-top: -50px; } .navbar--color--secondary { padding-top:10px; } .navbar--size--xl { padding: 0rem 0; padding-top:10px; } .navbar{ padding-top: 10px; display: block; } .navbar--color--ghost { /*height: 110px;*/ } .navbar-inverse .navbar-nav .open .dropdown-menu>.dropdown-header { border-color: #080808 } .navbar-inverse .navbar-nav .open .dropdown-menu .divider { background-color: #080808 } .navbar-inverse .navbar-nav .open .dropdown-menu>li>a { color: #9d9d9d } .navbar-inverse .navbar-nav .open .dropdown-menu>li>a:focus, .navbar-inverse .navbar-nav .open .dropdown-menu>li>a:hover { color: #fff; background-color: transparent } .navbar-inverse .navbar-nav .open .dropdown-menu>.active>a, .navbar-inverse .navbar-nav .open .dropdown-menu>.active>a:focus, .navbar-inverse .navbar-nav .open .dropdown-menu>.active>a:hover { color: #fff; background-color: #080808 } .navbar-inverse .navbar-nav .open .dropdown-menu>.disabled>a, .navbar-inverse .navbar-nav .open .dropdown-menu>.disabled>a:focus, .navbar-inverse .navbar-nav .open .dropdown-menu>.disabled>a:hover { color: #444; background-color: transparent } } .navbar-inverse .navbar-link { color: #9d9d9d } .navbar-inverse .navbar-link:hover { color: #fff } .navbar-inverse .btn-link { color: #9d9d9d } .navbar-inverse .btn-link:focus, .navbar-inverse .btn-link:hover { color: #fff } .navbar-inverse .btn-link[disabled]:focus, .navbar-inverse .btn-link[disabled]:hover, fieldset[disabled] .navbar-inverse .btn-link:focus, fieldset[disabled] .navbar-inverse .btn-link:hover { color: #444 } .overlay { position: absolute; z-index: -1; top: 0; left: 0; height: 100%; width: 100%; /* Let the photo breathe mid-frame; keep the top dark for the navbar and the center readable for the headline. */ background: linear-gradient(180deg, rgba(10, 12, 16, .62) 0%, rgba(10, 12, 16, .38) 42%, rgba(10, 12, 16, .46) 100%); } .main-content { background: #f2f2f2; } section { background: #fff; padding: 4rem 0 7rem; } section:nth-child(even) { background: #f5f5f5; } h2, h3 { padding: 2rem 0 0.75rem; font-weight: 700; color: #4b4b4b; } #mobileNav{ margin-top:-25px; } .check-rates{ font-size: 12px; } /* ── Daterangepicker responsive containment ─────────────────────────────── */ /* Never let the picker exceed the viewport width */ .daterangepicker { max-width: calc(100vw - 32px) !important; } /* On smaller desktops / large tablets (564–780px) where two months side-by-side would be too wide, stack the calendars vertically */ @media (min-width: 564px) and (max-width: 780px) { .daterangepicker .drp-calendar.left, .daterangepicker .drp-calendar.right { float: none !important; clear: both !important; display: block !important; max-width: 100% !important; } } /* ========================================================================== Editorial single-room layout Used when the property has exactly one room type — replaces the centered card with a magazine-style two-column gallery + content section. ========================================================================== */ .room-editorial { display: grid; grid-template-columns: 1fr; gap: 40px; align-items: start; width: 100%; } @media (min-width: 992px) { .room-editorial { grid-template-columns: 1.15fr 1fr; gap: 60px; } } .room-editorial__gallery { display: grid; grid-template-columns: 1fr; gap: 12px; width: 100%; min-width: 0; } .room-editorial__hero { width: 100%; overflow: hidden; cursor: zoom-in; background: #e8e6e1; border-radius: var(--radius-lg, 16px); } .room-editorial__hero > img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s ease; } .room-editorial__hero:hover > img { transform: scale(1.03); } .room-editorial__thumbs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; width: 100%; } .room-editorial__thumb { position: relative; width: 100%; overflow: hidden; cursor: zoom-in; background: #e8e6e1; border-radius: var(--radius-md, 12px); } .room-editorial__thumb > img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 0.4s ease, opacity 0.3s ease; } .room-editorial__thumb:hover > img { transform: scale(1.05); } .room-editorial__thumb--more > img { opacity: 0.5; } .room-editorial__thumb-overlay { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: #fff; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-weight: 700; font-size: 22px; background: rgba(45, 45, 45, 0.35); pointer-events: none; } .room-editorial__hidden { display: none !important; } .room-editorial__content { padding: 8px 0; } @media (min-width: 992px) { .room-editorial__content { padding: 24px 0 0; } } .room-editorial__title { font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-size: 32px; font-weight: 700; color: #2d2d2d; margin: 0 0 16px; line-height: 1.2; } @media (min-width: 992px) { .room-editorial__title { font-size: 38px; } } .room-editorial__rule { display: block; width: 56px; height: 2px; background: var(--ibe-accent, #deb666); margin: 0 0 18px; } .room-editorial__persons { display: inline-block; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); font-size: 13px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: #999; margin-bottom: 18px; } .room-editorial__description { color: #555; font-size: 16px; line-height: 1.7; font-weight: 300; font-family: var(--ibe-font, 'Nunito Sans', sans-serif); text-align: left; margin-bottom: 24px; } .room-editorial__amenities { margin-bottom: 28px; } .room-editorial__amenities ul { padding: 0; margin: 0; list-style: none; display: flex; flex-wrap: wrap; gap: 4px; } .room-editorial__amenities ul li { float: none; margin: 0; padding: 0; } .room-editorial__cta { max-width: 320px; } .room-editorial__cta a { padding: 14px 10px; font-size: 16px; letter-spacing: 0.06em; border-radius: var(--radius-sm, 8px); } @media (max-width: 575px) { .room-editorial__title { font-size: 26px; } .room-editorial__thumbs { grid-template-columns: repeat(4, 1fr); gap: 8px; } .room-editorial__cta { max-width: 100%; } }