@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: 40px 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: #fff;
        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: 19px;
        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;
        font-size: 14px;
        width: auto;
    }

    .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
    }
  section.details .gallery button.main-btn {
    font-size:14px;
  }
}

@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
    }
}