@media(max-width: 1366px) { ul.amenity.feat-amn { margin-bottom:0; gap: 10px } } @media(max-width: 1024px) and (min-width:981px) { section.details .booking-box { padding:30px 25px } .details-amenities { width: 100%; margin-top: 30px } section.details .booking-form { margin-top: 0; padding-left: 0; position: relative; top: 0 } .col-8.details-content { width: 100% } a.sticky.main-btn { display: block } } @media(max-width: 980px) { section.details { padding:40px 20px; padding-top: 125px } section.details .row.gallery { margin-bottom: 30px } .col-8.details-content { width: 100% } .details-amenities { width: 100%; margin-top: 30px } section.details .booking-form { margin-top: 0; padding-left: 0; position: relative; top: 0 } section.details h2 { font-size: 36px } section.details h6 { font-size: 22px } a.sticky.main-btn { display: block } section.details .amenities li { gap: 10px; width: 50% } .book-now-mob { display: block } .book-now-mob p.price { display: none } } @media(max-width: 540px) { #tidio-chat iframe { inset:auto -7px 55px auto !important } header.mob-header { position: relative } .details-header { display: flex } .details-header-left,.details-header-right { padding: 10px; padding-bottom: 0 } .details-header-right { text-align: right } .details-icon,.details-share { width: 30px; height: 30px; background: #2b2b2b; border-radius: 100%; display: flex; justify-content: center; align-items: center; cursor: pointer; color: var(--primary-color) } .details-icon i,.details-share i { color: var(--white-color) } .details-icon:hover,.details-share:hover { background: var(--secondary-color) } .details-share { margin-left: auto } section.details { padding: 25px 12px } section.details .gallery .col-6.left { width: 100%; margin-bottom: var(--m14) } section.details .gallery .col-6.left img { height: 200px; border-radius: 12px 12px 0 0 } section.details .gallery .col-6.right { width: 100% } section.details .gallery .col-6.right img { height: 150px } section.details .gallery .col-6.right .col-6:nth-child(2) img { border-radius: 0 } section.details .gallery .col-6.right .col-6:nth-child(3) img { border-radius: 0 0 0 12px } section.details .row.gallery { margin-bottom: 20px } section.details h2 { font-size: 28px } section.details h6 { font-size: 21px } .amenities .amn-list { height: 145px } section.details .booking-box { padding: 30px 20px; padding-bottom: 5px } section.details .booking-box h4 { font-size: 25px } ul.amenity { gap: 10px; justify-content: space-between } ul.amenity li { display: flex; flex-direction: column; align-items: center; gap: 5px } ul.amenity li i { padding-right: 0 } .feat-para { height: auto } .feat-para p { white-space: nowrap; overflow: hidden; text-overflow: ellipsis } a.sticky.main-btn { transform: rotate(0); position: relative; width: auto; text-align: center; left: 0; right: 0; top: 0; bottom: 0; z-index: 1; font-size: 14px } .book-now-mob { display: flex; justify-content: space-between; padding: 10px 12px; background: #2f2f2f; position: fixed; width: 100%; bottom: 0; z-index: 10; align-items: center } .book-now-mob p.price { color: var(--secondary-color); margin-bottom: 0; line-height: 1.4; font-size: 21px; font-weight: 700 } .book-now-mob p.price span { font-size: 14px; font-weight: 600 } footer .copyright { padding-bottom: var(--p75) } .book-now-mob p.price { display: inline-block } #amn { width: 100%; margin-top: 0; position: fixed; left: 0; top: 100%; height: 100vh; z-index: 11; background: #1e1e1e; transition: all .3s ease; overflow-y: scroll } section.details .booking-box h4.req { display: block } section.details .booking-box h4.prc { display: none } section.details .booking-box .close2 { display: inline-block } .row.guest-form div#gaurav-new-data-area { margin-bottom: 14px; margin-top: 14px } .row.guest-form div#gaurav-new-data-area .col-md-6 { margin-bottom: 5px } section.details .gallery .col-6.left a.main-btn { bottom: 10px } .call-btn { bottom: 75px } .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%; background-size: 60%; background-position: center } #st-1.st-animated { display: flex; flex-wrap: wrap; gap: 20px } #st-1.st-has-labels .st-btn.st-remove-label { min-width: 50px; background-color: transparent; padding: 10px; border: 1px solid #fff; border-radius: 10px; width: 28%; margin-right: 0; height: 50px !important; display: flex !important; align-items: center; justify-content: center } #st-1 .st-btn>img { display: inline-block !important; height: 25px !important; width: 25px !important; position: relative !important; top: 0 !important; vertical-align: 0 !important } } @media(max-width: 360px) { ul.amenity li { display:flex; flex-direction: column; align-items: center; gap: 5px } ul.amenity li i { padding-right: 0 } section.details h6 { font-size: 20px } section.details .gallery button.main-btn { width: 120px } section.details h2 { font-size: 24px } .calendar_weekdays div,.calendar_content div { width: 38px !important; height: 38px !important } }