section.details { padding: 40px 40px; padding-top: 125px } section.details .container { padding-left: 0; padding-right: 0 } section.details .row { justify-content: space-between } section.details .star-rating { position: relative; display: inline-block; width: 0; height: 0; margin-left: .9em; margin-right: .9em; margin-bottom: 2em; border-right: .3em solid transparent; border-bottom: .7em solid #e4a853; border-left: .3em solid transparent; font-size: 8px } section.details .star-rating:before,section.details .star-rating:after { content: ""; display: block; width: 0; height: 0; position: absolute; top: .6em; left: -1em; border-right: 1em solid transparent; border-bottom: .7em solid #e4a853; border-left: 1em solid transparent; transform: rotate(-35deg) } section.details .rating { margin-bottom: 5px } section.details .star-rating:after { transform: rotate(35deg) } section.details h6 { font-size: 24px; color: var(--white-color); font-weight: 400; line-height: 1.25em } section.details .luxury { font-family: var(--other-font); font-weight: 400; font-size: 15px; text-transform: uppercase; letter-spacing: 6px; margin-bottom: 5px; color: var(--territiary-color) } section.details h2 { font-size: 45px; margin-bottom: 10px } section.details .details-para p { margin-bottom: 30px } section.details .check-in-out li { line-height: 1.75em; margin-bottom: 10px; display: flex; align-items: center; gap: 15px } section.details .check-in-out li i { font-size: 18px; color: var(--territiary-color) } section.details .check-in-out { margin-bottom: 20px } section.details .instructions,section.details .pets,section.details .children,section.details .details-para { margin-bottom: 20px } section.details .details-btn { padding-top: 15px } section.details .details-btn a { display: block; font-size: 15px; padding: 15px 22px } section.details .amenities li img { width: 25px; margin-top: 0 } section.details .amenities li { display: flex; align-items: flex-start; gap: 15px; line-height: 1.75em; margin-bottom: 10px; width: 50% } section.details .hidden-gallery { display: none } section.details .row.gallery { margin-bottom: 40px } section.details .gallery .col-6 { padding: 0; width: 49.5% } section.details .gallery .col-6.left { width: 50.5%; position: relative } section.details .gallery .col-6.left a.main-btn { width: 180px; position: absolute; right: 10px; bottom: 20px; background: #00000073; padding: 16px 20px } section.details .gallery .col-6.right { width: 48.5% } section.details .gallery .col-6.right .row { gap: 2% } section.details .gallery .col-6.right .row .col-6 { padding: 0; width: 49%; margin-bottom: var(--m14); position: relative } section.details .gallery .col-6.right img { width: 100%; height: 193px; object-fit: cover } section.details .gallery .col-6.left img { height: 400px; object-fit: cover; width: 100%; border-radius: 12px 0 0 12px } section.details .gallery .col-6.right .col-6:nth-child(2) img { border-radius: 0 12px 0 0 } section.details .gallery .col-6.right .col-6:nth-child(4) img { border-radius: 0 0 12px 0 } section.details .gallery button.main-btn { width: 150px; position: absolute; right: 10px; bottom: 10px; background: #00000073 } section.details .booking-form { margin-top: 0; padding-left: 20px; position: sticky; top: 70px; z-index: 3 } section.details .booking-box { background: #1e1e1e; padding: 30px; width: 100% } section.details .booking-box form .row { position: relative } section.details .booking-box form .row .col-12 { padding-left: 0; padding-right: 0 } section.details .booking-box h4 { border-bottom: 1px solid #ffffff38; font-size: 27px; padding-bottom: 15px; color: var(--white-color); font-weight: 400 } section.details .booking-box h4.req { display: none } section.details .booking-box h4.prc { display: block } section.details .booking-box .close2 { font-size: 20px; color: rgba(255,255,255,0.5); cursor: pointer; position: absolute; right: 20px; display: none } section.details .booking-box h4 span { font-size: 17px } section.details .booking-box label { color: var(--primary-color); font-size: 15px; font-weight: 400; margin-bottom: 6px } section.details .booking-box input.form-control { display: block; width: 100%; font-size: 13px; color: rgba(255,255,255,0.5); padding: 15px; background: #222; border: 1px solid rgba(255,255,255,0.5); box-shadow: none; border-radius: 12px; margin-bottom: 15px } section.details .booking-box input.form-control.gst { margin-bottom: 5px } section.details .booking-box input:focus-visible { outline: -webkit-focus-ring-color auto 0 !important } section.details .booking-box input.form-control:focus { color: rgba(255,255,255,0.5) !important; background-color: #222 !important; border-color: rgba(255,255,255,0.5) !important; outline: 0; box-shadow: 0 0 0 0rem rgba(13,110,253,.25) !important } section.details .booking-box input::placeholder { color: rgba(255,255,255,0.5) !important } section.details .booking-box .form-text { position: relative; margin-top: 0 } section.details .booking-box .form-text i { font-size: 15px; right: 15px; color: var(--territiary-color); position: absolute; top: 47px } section.details .booking-box .col-6 { width: 49%; padding: 0 } section.details .booking-box select { display: block; width: 100%; font-size: 15px; color: rgba(255,255,255,0.5); padding: 20px 20px 20px 20px; background: #222; border: 0; box-shadow: none; border-radius: 0; margin-bottom: 15px } section.details .booking-box button.main-btn { width: 100%; height: 55px; display: block !important; margin-top: 10px } pre { white-space: pre-line; word-break: break-word; display: block; margin-top: 0; margin-bottom: 1rem; overflow: auto; font-size: var(--f16) } pre p { white-space: pre-line; text-align: justify !important } section.details .col-12.main-tabs { margin-bottom: 30px } section.details .tab-details { position: sticky; top: 0; display: flex; align-items: center; gap: 20px } section.details .tab-details a { display: inline-block; padding: 10px 15px; border-bottom: 2px solid transparent } section.details .tab-details a:hover { border-color: var(--secondary-color) } div#virtual { padding-left: 0; margin-top: 25px } .amenities { margin-bottom: 20px } .amenities .amn-list { display: flex; flex-wrap: wrap; justify-content: space-between; height: 105px; overflow: hidden } .amenities a.main-btn.show-amn { display: block; width: 220px; margin-top: 10px; background: transparent; border: 1px solid var(--secondary-color); display: inline-flex; width: auto; margin-top: 10px; background: transparent; gap: 8px; align-items: center; background: transparent; border: 1px solid rgba(255,255,255,0.5); font-size: 14px } a.main-btn.show-amn svg { fill: var(--white-color) } .amenities a.main-btn.show-amn:hover { background: var(--secondary-color) } .col-12.md-12.sm-12.datepicker-common-2.datepicker-main { position: relative; padding-left: 0; padding-right: 0 } .col-12.guest { padding: 0 } input#demo17 { top: auto !important; bottom: 15px !important; width: 100% !important; height: 52px !important } #datepicker-demo17.datepicker { right: 0 !important } ul.amenity { display: flex; align-items: center; gap: 16px; margin-bottom: 20px } ul.amenity li { color: var(--white-color); line-height: 1.6rem } ul.amenity li i { font-size: 14px; color: var(--secondary-color); padding-right: 5px } .main-instruction { height: 140px; overflow: hidden } a.main-btn.show-space { display: inline-flex; width: auto; margin-top: 10px; background: transparent; gap: 8px; align-items: center; background: transparent; border: 1px solid rgba(255,255,255,0.5); font-size: 14px } a.main-btn.show-space:hover { background: var(--secondary-color) } a.main-btn.show-space svg { fill: var(--white-color) } .row.featured-row { padding: 0; margin-top: 40px } .row.featured-row h3 { font-size: 27px; color: var(--white-color); font-weight: 400 } .row.featured-row img { width: 100%; height: 200px; object-fit: cover; margin-bottom: 20px } .feat-cont h4 { margin-bottom: 10px; font-size: 20px } .feat-para { height: 58px; overflow: hidden; margin-bottom: 10px } .feat-cont h4 a { font-family: var(--secondary-font); color: var(--white-color); font-weight: 400 } .row.featured-row .owl-nav { display: flex; justify-content: center; gap: 50px; margin-top: 20px } .row.featured-row .owl-carousel .owl-nav button.owl-next,.row.featured-row .owl-carousel .owl-nav button.owl-prev { width: 40px; height: 40px; background: transparent; border-radius: 100%; border: 1px solid var(--white-color) } .row.featured-row .owl-carousel .owl-nav button.owl-next i,.row.featured-row .owl-carousel .owl-nav button.owl-prev i { color: #fff } .row.featured-row .owl-carousel .owl-nav button.owl-next:hover,.row.featured-row .owl-carousel .owl-nav button.owl-prev:hover { background: var(--secondary-color); border-color: var(--secondary-color) } hr { opacity: .50; margin: 20px 0 } ul.amenity.feat-amn { margin-bottom: 0; gap: 16px } a.sticky.main-btn { transform: rotate(-90deg); position: fixed; left: auto; right: -55px; top: 52%; z-index: 3; display: none; letter-spacing: 0 } .main-btn span { display: block; position: relative } .huflDf,.hcGQjI .AISummaryContent__SummaryTextStyle-sc-1rdgk7n-1,.hcGQjI .AISummaryContent__SummaryListStyle-sc-1rdgk7n-5,.kNfncX,.czAlWK,.czAlWK * { color: #fff !important } .hcGQjI .AISummaryContent__StyledCheckmark-sc-1rdgk7n-4 { fill: #fff !important } .book-now-mob { display: none } div#guestsss { width: 100%; min-width: 250px; background: #222; padding: var(--p20); position: absolute; z-index: 9; left: 0; border-radius: 10px; display: none; box-shadow: 0 0 2px 0 #888 } #guestsss .close1 { position: absolute; right: 10px; left: auto; top: .3rem !important; font-size: var(--f18); color: var(--secondary-color); cursor: pointer } #guestsss .adult-box { display: flex; justify-content: space-between; align-items: center; margin-bottom: var(--m20) } #guestsss .adult-box p { margin-bottom: 0; letter-spacing: 0; font-size: 15px } .guest button.button1 { background: transparent; height: 44px; width: 50px; text-align: center; border-radius: 22px 0 0 22px; font-size: var(--f20); margin-left: 0; border: 0 solid rgba(255,255,255,0.5); color: rgba(255,255,255,0.5); transition: all .3s; cursor: pointer; display: inline-flex; justify-content: center; align-items: center; border-right: 0 solid } .guest button.button11.button1 { margin-left: 0; border-right: 0 solid; border-left: 0 solid; border-radius: 0 22px 22px 0 } section.details .booking-box .form-text button.button1 i { position: relative; top: 0; right: 0; color: rgba(255,255,255,0.5); font-size: 14px } .adult-btn { display: flex; align-items: center; position: absolute; top: 33px; right: 5px } .guest button.button1:hover { background: var(--secondary-color); border-color: var(--secondary-color) } section.details .booking-box button.main-btn.close111 { width: auto; height: auto } section.details .box-btn { text-align: right } div#featured-slide .feat { transition: all ease-in-out 300ms; margin-top: 10px } div#featured-slide .feat:hover { transform: translateY(-5px) } .row.guest-form div#gaurav-new-data-area { padding: 0; margin-bottom: 10px } .row.guest-form div#gaurav-new-data-area .col-md-6 { padding: 0; width: 50%; font-size: 14px } .row.guest-form div#gaurav-new-data-area .col-md-6:last-child { text-align: right } .details-header { display: none } .discount-box { background-color: #282828; padding: 15px 20px; margin-top: 15px } .disc-details { display: flex; align-items: center; gap: 20px } .disc-details i { font-size: 21px; color: var(--secondary-color) } .disc-details li { margin-bottom: 6px; list-style: disc } .disc-details ul { padding-left: 10px } .modal-header .btn-close { transition: all .3s ease } .share-area { position: relative } .share-area .property-modal { display: flex; gap: 15px } div#exampleModal .modal-header { border-color: #fff } div#exampleModal .modal-content { background: #000 } .share-area .property-modal img { width: 100px; object-fit: cover; height: 70px; border-radius: 5px } .share-area .prop-name { display: flex; align-items: center } .property-modal h3 { font-size: var(--f17); color: var(--white-color) } .icon-body { margin-top: 0 } .icon-body .row { gap: 24.5px } .icon-body .col-6 { padding: 10px; border: 1px solid #fff; border-radius: 10px; width: 28% } div#exampleModal h2#exampleModalLabel { color: var(--white-color) } .icons { display: flex; align-items: center; gap: 10px; justify-content: center } .icons i,a.btn.tooltipped.tooltipped-s i { font-size: var(--f28) } .icons h4,a.btn.tooltipped.tooltipped-s h4 { font-size: 11px; font-family: var(--primary-font); font-weight: 500; margin-bottom: 0; color: #fff } .share-area .icon-area { display: none; flex-direction: column; align-items: center; position: absolute; width: 40px; right: 0; background: var(--white-color); box-shadow: rgba(0,0,0,0.12) 0 6px 16px; z-index: 1 } .share-area:hover .icon-area { display: block } .share-area a { display: inline-block; background: transparent; border: transparent; color: var(--white-color); font-size: var(--f14); font-weight: 400; padding: var(--p8); width: 100%; text-align: center } .share-area a svg { fill: #fff } .share-area .btn-close { background: url("../images/close.png"); background-repeat: no-repeat; background-size: 100% } p.addr { display: flex; align-items: center; gap: 5px; color: var(--white-color) } p.addr i { color: var(--secondary-color) } div#loc iframe { filter: invert(1) } .row.guest-form div#gaurav-new-data-area .col-md-6 { margin-bottom: 5px }