/**Skeleton Css start **/

.skeleton-wrapper {
    display: block;
    width: 100%;
    padding: 10px;
}

.skeleton-image {
    width: 24%;
    height: 80px;
    background: #e0e0e0;
    border-radius: 8px;
    animation: shimmer 1.5s infinite linear;
    float: left;
}

.skeleton-text {
    width: 100%;
    height: 10px;
    padding: 5px;
    margin: 10px;
    margin-top: 5px;
    background: #e0e0e0;
    border-radius: 4px;
    animation: shimmer 1.5s infinite linear;
}

.skeleton-other {

    width: 70%;
    float: left;

}

.skeleton-text.short {
    width: 60%;
}


@keyframes shimmer {
    0% {
        background-position: 100%;
    }

    100% {
        background-position: -100%;
    }
}

.skeleton-image,
.skeleton-text {
    background: linear-gradient(90deg,
            #e0e0e0 25%,
            #f5f5f5 50%,
            #e0e0e0 75%);
    background-size: 200% 100%;
}

/**Skeleton Css end **/

img.avatar.avatar-sm.avatar-border-white.me-2.fa.fa-user-circle.user-icon:before {
    /* padding-bottom: 0px !important; */
    /* height: 1.5rem; */
    top: -10px !important;
    position: relative;
}

#check-in,
#check-out,
#startDate,
#endDate {
    background-color: #ffffff !important;
    cursor: pointer !important;

}

i.selected-days {
    display: none !important;
}

.close {
    padding: 10px 20px;
}

.img-fluid.card-img-top {
    height: 230px;
    object-fit: cover;
}

#dropdownMenuButton {
    border: none;
}

#front-search-guests {
    margin-top: -10px;
}

.placeSection .d-flex.align-items-lg-stretch.mb-4.col-lg-4:first-child {
    flex: 0 0 auto;
    width: 66.66667%;
}

@keyframes placeholder-glow {
    50% {
        opacity: 0.3;
    }
}

.placeholder-glow .placeholder {
    animation: placeholder-glow 2s ease-in-out infinite;
}

.placeholder {
    display: inline-block;
    min-height: 1em;
    vertical-align: middle;
    cursor: wait;
    opacity: .5;
    background: gray !important;
}


#header {
    display: none;

}

h1,
h2,
h3,
h4,
h5,
h5,
span,
a,
p,
input,
label,
button {
    font-family: "Inter", sans-serif;
    /* color: #333; */
}


.modal-body {
    min-height: 450px;
    overflow: scroll;
}

.ui-autocomplete {
    overflow: auto;
    height: 300px;
}

.single_hotel {
    float: left;
}

#hotels_loader {

    position: relative !important;
}

@media (min-width: 320px) and (max-width: 991px) {
    .event-details-section>div {
        border-bottom: 1px solid #ddd;
    }
}

@media (min-width: 992px) and (max-width: 1399px) {

    .event-details-section>div:nth-child(1),
    .event-details-section>div:nth-child(2),
    .event-details-section>div:nth-child(3) {
        border-right: 1px solid #ddd;
    }

    .event-details-section>div:nth-child(4) {
        font-size: 12px;
        padding-right: 0 !important;
    }

    .event-details-section>div h5 {
        font-size: 16px;
    }

    .event-details-section>div h3 {
        font-size: 18px;
    }

    .event-details-section {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
}


@media (min-width: 1400px) {

    .event-details-section>div:nth-child(1),
    .event-details-section>div:nth-child(2),
    .event-details-section>div:nth-child(3) {
        border-right: 1px solid #ddd;
        padding: 0 1rem;
    }

    .event-details-section>div,
    .event-details-section>div:last-child {
        display: flex;
        justify-content: center;
    }

    .event-details-section>div:last-child>div {
        display: flex;
        flex-direction: column;
        justify-content: center;
    }
}

.bg-sky-50 {
    background-color: rgb(239 246 255);
}

.bg-gray-200 {
    background-color: rgb(229 231 235);
}

.bg-purple-600 {
    background-color: rgb(147 51 234);
}

.text-indigo-950 {
    color: rgb(30 27 75);
}

.open-calendar {
    position: absolute;
    right: 10px;
    bottom: 10px;
    pointer-events: none;
}

.btn-hotel-info {
    position: absolute;
    top: 0px;
    right: 0px;
    padding: 10px;
    background: rgba(25, 160, 180, 0.5);
    border-radius: 0;
}

.justify-content-center {
    text-align: center;
}

a#showMapModal {
    color: white !important;
}

#rooms_container {
    padding: 10px;
}

.main-title {
    font-size: 1.5rem;
}

#search-bar {
    opacity: 0;
    height: 2px;
}

.single_hotel {
    float: none;
}

.swiper-button-next,
.swiper-button-prev {
    color: #17a2b8 !important;
}

@media (min-width: 769px) {
    .img-fluid.card-img-top {
        height: 500px !important;
        object-fit: cover;
    }
}

body {
    padding-top: 0px !important;
}

#body {
    padding-top: 0px;
    background: #F6F6F6;
}

.author_col {
    display: flex;
    padding: 10px 20px;
    align-items: center;
    border-radius: 12px;
    background: #FFF;
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.15);
    gap: 15px;
}

.left_author_col {
    width: 100px;
    height: 100px;
}

.left_author_col img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 100px;
}

.right_author_col p {
    margin: 0px;
}

.right_author_col .frame-3 p {
    color: #000;
    font-family: "Inter", sans-serif;
}

.author_name {
    font-size: 20px;
    font-weight: 600;
}

.author_event {
    font-size: 16px;
}

.frame-1 {
    display: flex;
    align-items: baseline;
    gap: 15px;
    margin-bottom: 5px;
}

.frame-2 {
    display: flex;
    align-items: center;
    gap: 15px;
}

.frame-5 {
    display: flex;
    padding-left: 15px;
    flex-direction: column;
    align-items: flex-start;
    gap: 5px;
    border-left: 1px dashed #999;
}


.frame-5 p {
    font-size: 13px;
}

.nov-dates {
    color: #205880;
    font-family: "Patrick Hand", sans-serif;
    font-size: 23px;
    font-style: normal;
    font-weight: 400;
    line-height: 26px;
    /* 113.043% */
}

.author_des {
    color: #205880;
    font-family: "Patrick Hand", sans-serif;
    font-size: 23px;
    font-style: normal;
    font-weight: 400;
    line-height: 26px;
    /* 113.043% */

}

.right_author_col {
    display: flex;
    flex-direction: column;
    width: calc(100% - 115px);
}

.author_address,
.author_date {
    display: flex;
    gap: 5px;
    align-items: center;
}

.author_address svg,
.author_date svg {
    width: 18px;
    height: 18px;
}

.upload {
    margin-left: auto;
}

.author_section {
    padding-top: 30px;
}

.hotel_section {
    padding: 20px 0px 0px 0px;
    transition: 0.3s all ease;
}

.hotel_sec_map #map {
    width: 100%;
    border-radius: 12px;
    height: 300px !important;

}

.hotel_image {
    position: relative;
}

.hotel_image .swiper-slide a:after {
    background: rgba(0, 0, 0, 0.2);
    content: "";
    position: absolute;
    top: 0px;
    width: 100%;
    height: 100%;
    border-radius: 10px 10px 0px 0px;
    left: 0px;
    /* Adjust opacity as needed */
    z-index: 1;
}

.event_popup .hotel_image:after {
    background: rgba(0, 0, 0, 0.2);
    content: "";
    position: absolute;
    top: 0px;
    width: 100%;
    height: 100%;
    border-radius: 10px 10px 0px 0px;
    left: 0px;
    /* Adjust opacity as needed */
    z-index: 1;
}

.hotel_image img {
    width: 100%;
    height: 300px;
    object-fit: cover;
    border-radius: 10px 10px 0px 0px;

}


.hotel_image img {
    width: 100%;
    height: 300px;
    object-fit: cover;
    border-radius: 10px 10px 0px 0px;

}

.hotel_list__details {
    border-radius: 0px 0px 10px 10px;
    border-right: 1px solid #EBEBEB;
    border-bottom: 1px solid #EBEBEB;
    border-left: 1px solid #EBEBEB;
    background: #fff;
    display: flex;
    padding: 20px 30px 5px 30px;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    align-self: stretch;
}

.hotel_list__details h4 a {
    margin: 0px 0px 0px 0px;
    color: #333;
    font-size: 17px;
    font-style: normal;
    font-weight: 600;
    line-height: 1.3em;
    display: flex;
}

.hotel_list__details h4 {
    margin: 0px 0px 0px 0px;
    line-height: 130%;
}



.hotel_list__details .hotel_address {
    color: #595959;
    font-size: 13px;
    /* 18.2px */
    margin: 0px;
}

.hotel_list_review p {
    color: #595959;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    /* 19.6px */
    margin: 0px;
    display: flex;
    align-items: center;
    line-height: 1.7em;
}

.hotel_list_review svg {
    width: 17px;
}

span.no_reviews {
    font-weight: 400;
    font-size: 13px;
    position: relative;
    top: 1px;
}

span.ratings {
    margin: 0px 5px 0px 5px;
    line-height: 15px;
}

.single_hotel_info {
    display: flex;
    align-items: center;
}

.single_hotel_info_col {
    border-radius: 32px;
    border: 1px solid #EBEBEB;
    display: flex;
    align-items: center;
    padding: 8px 16px;
    margin-right: 10px;
}

.single_hotel_info_col span {
    font-size: 13px;
    font-style: normal;
    font-weight: 600;
    line-height: 140%;
    /* 18.2px */
    letter-spacing: -0.032px;
}

.single_hotel_info_col svg {
    width: 18px;
    height: 18px;
    margin-right: 8px;
}

.hotel_options .accordion-item {
    border-top: 1px dashed #EBEBEB !important;
    border: 0px;
    padding: 20px 0px 20px 0px;
}

.hotel_options_amadeus.accordion-item {
    border-top: 1px dashed #EBEBEB !important;
    border: 0px;
    padding: 20px 0px 20px 0px;
}

.hotel_options {
    width: 100%;
    margin: 15px 0px 0px 0px;
}

.hotel_options_amadeus {
    width: 100%;
    margin: 15px 0px 0px 0px;
}

.hotel_options .accordion-item .accordion-header button {
    margin: 0px;
    padding: 0px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    border: 0px !IMPORTANT;
    box-shadow: unset;
}

.hotel_options_amadeus .accordion-item .accordion-header button {
    margin: 0px;
    padding: 0px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    border: 0px !IMPORTANT;
    box-shadow: unset;
}

.hotel_options .accordion-item button::after {
    display: none;
}

.hotel_options_amadeus .accordion-item button::after {
    display: none;
}



.hotel_options_title {
    overflow: hidden;
    color: #17A2B8;
    text-overflow: ellipsis;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    /* 20.8px */
    margin: 0px 0px 5px 0px;
}

.hotel_option_price {
    font-size: 13px !IMPORTANT;
    margin: 0px;
    font-weight: 600;
}

.hotel_option_price .regular {
    color: #595959;
    font-style: normal;
    font-weight: 400;
    /* 18.2px */

}

.hotel_options .accordion-item button span.arrow {
    position: absolute;
    right: 0px;
    top: 10px;
}

.hotel_options_amadeus .accordion-item button span.arrow {
    position: absolute;
    right: 0px;
    top: 10px;
}




.accordion-body {
    padding: 20px 0px 0pc 0pc;
}

.single_hotel_info_col.room_details_block {
    display: inline-flex;
    margin-bottom: 20px;
}

.room_dates .form-floating.datepicker-container {
    background: transparent !important;
}

.room_dates .form-floating input {
    background: transparent !important;
    border: 0px;
    padding-bottom: 5px !important;
    height: auto;
}

.room_dates {
    border: 1px solid #ebebeb;
    border-radius: 5px;
    max-width: 290px;
}

.room_dates i {
    color: #000 !important;
    margin-right: 10px;
}

.room_dates .form-floating input:focus {
    border: 0px;
    box-shadow: unset;
}

.room_dates_avail {
    margin-top: 15px;
}

.room_dates_avail svg {
    width: 16px;
    height: 16px;
    margin-right: 10px;
}

.room_dates_avail p {
    font-size: 12px;
    font-style: normal;
}

.room_dates_avail p span {
    font-weight: 600;
    color: #333;
    padding: 0px;
    font-size: 12px;
}

.hotel_list_single {
    margin-bottom: 20px;
}

.updated_price span {
    color: #464646;
    font-size: 16px;
    font-weight: 600;
}

.updated_price .updated_nights {
    color: #595959;
    font-size: 13px;
    margin-bottom: 3px;
}


.updated_price {
    margin-bottom: 2px;
}

.more_info a {
    font-weight: 600;
    color: #17A2B8;
    font-size: 12px;
}



.room_update .more_info {
    color: #17A2B8;
    font-size: 12px;
}

.room_book_btn .btn {
    padding: 10px 20px 12px 20px !important;
    background: #17A2B8;
    border-radius: 50px;
    color: #fff;
    font-size: 14px !important;
    width: 290px;
    max-width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #17A2B8;
    transition: 0.3s all ease;
    box-sizing: border-box;
    font-weight: 600 !important;
    margin: 0px 0px 5px 0px !important;
}

.form-check input {
    border: 1px solid #000;
    border-radius: 0px !important;
    width: 14px !important;
    height: 14px !IMPORTANT;
    position: relative;
    top: 1px;
    background: transparent;
    left: 2px;
}

.hotel_list_single {
    margin-bottom: 20px;
    position: relative;
}

.form-check span {
    color: #595959;
    font-size: 13px;
    font-weight: 400 !IMPORTANT;
    margin-left: 8px;
}

.room_book_btn .btn:hover {
    background: transparent;
    color: #17A2B8;
}

.room_book_btn {
    margin-top: 20px;
}

footer {
    border: 0px;
    text-align: center;
    padding: 15px 0px;
}

footer p,
footer a {
    margin: 0px;
    color: #808080;
    font-size: 12px;
}

footer span.divider {
    color: #000;
}

footer svg {
    height: 22px;
    margin: 0px 7px;
}




.popup_info .hotel_image img {
    width: 100%;
    height: 250px;
    object-fit: cover;
    border-radius: 10px 10px 0px 0px;
    position: relative;
}

.modal-dialog {
    max-width: 600px;
}

.popup_info .hotel_list__details {
    padding: 20px 30px;
    border-radius: 0px 0px 15px 15px;
}

.popup_info .hotel_list__details h4 {
    margin: 0px;
    padding-bottom: 7px;
    color: #333;
    font-size: 17px;
    font-weight: 600;
}

.popup_info .hotel_list__details .hotel_address {
    font-size: 13px;
    color: #595959;
    margin: 0px 0px 7px 0px;
}

.hotel_list_review p {
    color: #595959;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    /* 19.6px */
    margin: 0px;
    display: flex;
    align-items: center;
    line-height: 1.7em;
}

.hotel_list_review svg {
    width: 17px;
}

span.no_reviews {
    font-weight: 400;
    font-size: 13px;
    position: relative;
    top: 1px;
}

span.ratings {
    margin: 0px 5px 0px 5px;
    line-height: 15px;
}

.popup_info .hotel_list_review {
    margin-bottom: 13px;
}

.popup_info_des .accordion-item {
    border: 0px;
    width: 100%;
}

.popup_info_des .accordion-button::after {
    display: none;
}

.popup_info_des .arrow {
    position: absolute;
    right: 0px;
    top: 0px;
}

.popup_info_des button.accordion-button {
    margin: 0px !IMPORTANT;
    padding: 0px 30px 0px 0px;
    box-shadow: unset;
    border: 0px !important;
}

.popup_info_des .accordion-item p {
    font-size: 13px;
    line-height: 1.5em;
}

.popup_info_des .accordion-body {
    padding: 0px;
}

.popup_info_des button.accordion-button p {
    margin: 0px;
}

.popup_info_more {
    margin: 15px 0px 0px 0px;
    max-height: 400px;
    overflow-y: auto;
    overflow-x: hidden;
    width: 100%;
}

.popup_info .hotel_list__details .popup_info_more h4 {
    font-size: 16px;
    font-weight: 600;
}

.popup_info .popup_info_more h5 {
    font-size: 13px;
    font-weight: 500;
}

.popup_info .popup_info_more ul {
    padding: 0px 0px 0px 20px;
}

.popup_info .popup_info_more ul li {
    color: #695959;
    font-size: 13px;
    font-family: 'Inter';
}

.popup_info .popup_info_more ul li::marker {
    color: #595959;
}



.modal-content {
    z-index: 1 !IMPORTANT;
}



.popup_info .hotel_image {
    position: relative;
}

.event_popup .modal-header {
    position: absolute;
    top: 0px;
    z-index: 999999;
    width: 100%;
    border: 0px;
    display: flex;
    align-items: center;
}

.popup_info .hotel_image:after {
    background: rgba(0, 0, 0, 0.2);
    content: "";
    position: absolute;
    top: 0px;
    width: 100%;
    height: 100%;
    border-radius: 10px 10px 0px 0px;
    left: 0px;
    /* Adjust opacity as needed */
    z-index: 1;
}

.hotel_image .swiper-button-prev,
.hotel_image .swiper-button-next {
    width: 30px;
    height: 30px;
    background: #fff;
    border-radius: 50px;
}

.hotel_image .swiper-button-prev:after,
.hotel_image .swiper-button-next:after {
    display: none;
}

.btn-close {
    opacity: 1;
}

.event_popup .modal-header button.btn-close {
    opacity: 1;
    background: #fff;
    border-radius: 50px;
    display: flex;
    padding: 3px;
    align-items: center;
    width: 30px;
    height: 30px;
    justify-content: center;
}

.swiper-button-next svg,
.swiper-button-prev svg {
    width: 16px !important;
    height: 16px !important;
}

.event_popup .modal-header button.btn-close svg {
    width: 24px;
    height: 26px;
}

.event_popup .modal-header .modal_title {
    margin: 0px;
    color: #fff;
    font-size: 15px;
    font-weight: 600;
}

.event_popup .modal-header .modal_title svg {
    margin-right: 10px;
    width: 18px;
    height: 18px;
    position: relative;
    top: -1px;
}

.popup_info_more p {
    font-size: 13px;
    color: #595959;
}

.modal_price_row span.label {
    color: #333;
    font-weight: 500;
}

p.modal_price_row {
    display: flex;
}

.modal_price_row span.price {
    margin-left: auto;
}

.modal_price_list {
    border-top: 1px solid #EBEBEB;
    padding-top: 20px;
}

.hotel_sec_map div[role=dialog] h3 {
    font-size: 17px;
}

.hotel_sec_map div[role=dialog] p {
    font-weight: 600;
}

.hotel_list__details h4 a:hover {
    color: #17A2B8;
}

.single_hotel_info_col {
    cursor: pointer;
}

.hotel_sec_map .form-check-input:checked {
    background-color: #17A2B8;
    border-color: #17A2B8;
}

.hotel_image .swiper-button-prev:hover svg path,
.hotel_image .swiper-button-next:hover path {
    color: #fff;
    fill: #fff;
}

.hotel_image .swiper-button-prev:hover,
.hotel_image .swiper-button-next:hover {
    background: #17A2B8;
}

.hotel_image .swiper-button-prev,
.hotel_image .swiper-button-next {
    transition: 0.3s all ease;
}

.hotel_sec_map #map button[title="Close"] {
    display: none !important;
}

.form-check-input {
    opacity: 0;
    position: absolute;
}

label.form-check-label {
    font-family: 'Inter';
    font-size: 11px;
    font-weight: 400;
    color: #17A2B8 !important;
}

/* The container around the toggle */
.toggle-switch {
    display: inline-block;
    width: 55px;
    height: 22px;
    position: relative;
    background-color: transparent;
    border-radius: 15px;
    cursor: pointer;
    transition: background-color 0.3s;
    color: #17A2B8 !important;
    font-size: 10px;
    text-align: center;
    border: 1px solid #BFBFBF;
    line-height: 21px;
}

/* The circle inside the toggle */
.toggle-switch::after {
    content: '';
    position: absolute;
    top: 1px;
    left: 1px;
    width: 18px;
    height: 18px;
    background-color: #17A2B8 !important;
    border-radius: 50%;
    transition: transform 0.3s;
}

/* Text for Off state */
.toggle-switch::before {
    content: 'Off';
    position: absolute;
    right: 10px;
    color: #17A2B8 !important;
    transition: opacity 0.3s;
}

/* When the checkbox is checked */

.form-check-input:checked+.toggle-switch::after {
    transform: translateX(31px);
}

/* Text for On state */
.form-check-input:checked+.toggle-switch::before {
    content: 'On';
    left: 10px;
    right: auto;
}

div#chooseRoomHeading {
    margin: 15px 0px 0px 10px;
    padding: 0px;
    display: flex;
    align-items: center;
}

.add_room_label svg path {
    fill: #212529;
}

.back_btn a.btn {
    padding: 0px;
    background: transparent;
    border: 0px;
    color: #17a2b8;
    font-weight: 400;
}

.back_btn svg {
    width: 18px;
    height: 18px;
    position: relative;
    top: -1px;
}

.hotel_options .accordion-item .accordion-header.page_block button {
    margin-left: 40px;
    width: calc(100% - 40px);
}

.hotel_options_amadeus .accordion-item .accordion-header.page_block button {
    margin-left: 40px;
    width: calc(100% - 40px);
}

.accordion-header {
    position: relative;
}

.checkbox-container {
    display: inline-block;
    position: absolute;
    width: 20px;
    height: 20px;
    left: 0px;
    cursor: pointer;
    top: 50%;
    transform: translateY(-50%);
}


/* Hide the default checkbox input */
.checkbox-container input {
    opacity: 0;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    cursor: pointer;
}

/* SVG icon for unchecked state */
.checkbox-container svg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transition: all 0.2s ease;
}

.checkbox-container svg.input_checked {
    width: 11px;
    height: 11px;
    top: 4px;
    left: 4px;
    opacity: 0;
    stroke-width: 1px;
    stroke: #17a2b8;
}

.checkbox-container input:checked+svg.input_checked {
    opacity: 1;
}

.checkbox-container svg.input_checked path {
    fill: #17a2b8;
}

.fin_req p {
    font-size: 13px ! IMPORTANT;
    margin: 0px;
    font-weight: 600;
    color: #212529;
    margin-bottom: 10px;
}

@media (min-width:1200px) {
    .inner_map {
        position: fixed;
        width: 450px;
    }

    .hotel_section {
        padding: 0px 0px 0px 0px;
        transition: 0.3s all ease;
        height: calc(100vh - 227px);
        overflow-y: scroll;
        scrollbar-width: none;
        margin: 25px 0px 0px 0px;
    }
}

@media (min-width:1025px) {

    .hotel_list::-webkit-scrollbar {
        display: none;
        /* For Chrome, Safari, and Opera */
    }

    .fixed #map {
        position: fixed !important;
        width: 460px !IMPORTANT;
    }

    .hotel_section .hotel_col_sm {
        padding-bottom: 50px;
    }
}


@media (max-width:767px) {
    .frame-1 {
        flex-direction: column;
        gap: 7px;
    }

    .checkbox-container svg.input_checked {


        left: 5px;

    }

    .left_author_col {
        width: 75px;
        height: 75px;
    }

    .popup_info .hotel_image img {
        height: 150px;
    }

    .right_author_col p {
        font-size: 14px;
    }

    .frame-5 p {
        font-size: 12px;
    }

    .hotel_section {
        padding: 130px 0px 05px 0px;
        margin: 20px 0px 0px 0px;
    }

    footer {
        padding: 15px 0px 20px 0px;
    }

    .author_section {
        padding-top: 0px;
        position: fixed;
        top: 0px;
        width: 100%;
        z-index: 99;
    }

    .author_section .container {
        width: 100%;
        padding: 0px;
        max-width: 100%;
    }

    .author_col {
        border-radius: 0px !important;
        padding: 20px 20px 15px 20px;
        gap: 10px;
    }

    .left_author_col {
        width: 95px;
        height: 95px;
    }

    .frame-1 {
        gap: 5px;
        margin-bottom: 5px;
    }

    .right_author_col .upload {
        position: absolute;
        right: 15px;
        top: 15px;
    }

    .frame-5 {
        padding: 0PX !IMPORTANT;
        border: 0px !important;
        gap: 0px !important;
    }

    .author_name {
        font-size: 16px;
        line-height: 1.2em;
    }

    .right_author_col p {
        font-size: 14px;
    }

    .right_author_col p {
        margin: 0px;
    }

    .author_address,
    .author_date {
        gap: 5px;

    }

    .author_address svg,
    .author_date svg {
        width: 16px;
        height: 16px;
    }

    .frame-5 p {
        font-size: 13px;
        color: #4D4D4D;
    }



    .hotel_section .row {
        flex-direction: column-reverse;
    }

    .hotel_sec_map #map {
        height: 150px !IMPORTANT;
        margin-bottom: 10px;
    }

    .hotel_col_sm {
        margin-top: 20px;
    }

    .hotel_image img {
        height: 233px;
    }

    footer p span:not(.divider) {
        display: block;
        padding: 7px 0px 5px 0px;
    }

}

@media (min-width: 1400px) {
    .container {
        max-width: 1140px;
    }
}


@media (max-width:767px) {
    .container {
        padding-left: 20px;
        padding-right: 20px;
    }

    /* The container around the toggle */
    .toggle-switch {
        display: inline-block;
        width: 48px;
        height: 21px;
        position: relative;
        background-color: transparent;
        border-radius: 15px;
        cursor: pointer;
        transition: background-color 0.3s;
        color: #17A2B8 !important;
        font-size: 10px;
        text-align: center;
        border: 1px solid #BFBFBF;
        line-height: 21px;
    }

    /* The circle inside the toggle */
    .toggle-switch::after {
        content: '';
        position: absolute;
        top: 1px;
        left: 1px;
        width: 17px;
        height: 17px;
        background-color: #17A2B8 !important;
        border-radius: 50%;
        transition: transform 0.3s;
    }

    /* Text for Off state */
    .toggle-switch::before {
        content: 'Off';
        position: absolute;
        right: 5px;
        color: #17A2B8 !important;
        transition: opacity 0.3s;
        top: 2px;
        content: 'OFF';
        line-height: 1.4em;
    }

    /* When the checkbox is checked */

    .form-check-input:checked+.toggle-switch::after {
        transform: translateX(27px);
    }

    /* Text for On state */
    .form-check-input:checked+.toggle-switch::before {
        left: 7px;
        right: auto;
        content: 'ON';
    }

    div#chooseRoomHeading {
        margin: 15px 0px 0px 10px;
        padding: 0px 10px;
        display: flex;
        align-items: center;
    }

    .room_dates {
        max-width: 100%;
    }

    .room_book_btn .btn {
        width: 100%;
    }

    .form-floating>label {
        font-size: 12px !important;
        padding-left: 10px;
    }

    .room_dates .form-floating input {
        font-size: 13px;
        padding-right: 10px ! IMPORTANT;
        padding-left: 10px !important;
    }

    .room_dates .me-2 {
        margin-right: 0px !important;
    }

    .room_dates i {
        color: #000 !important;
        margin-right: 0px;
    }
}

@media (min-width:1025px) {
    .hotel_section {
        margin: 20px 0px 0px 0px;
    }

    .hotel_list {
        padding-right: 3px;
    }

    .hotel_sec_map .inner_map {
        padding-left: 3px;
    }
}

.hotel_list_single {
    margin-bottom: 30px;
}

.ribbon-info {
    background-color: #17A2B8 !important;
    font-family: 'Inter';
    padding: 5px 10px !important;
    font-size: 12px;
}

.ribbon::before {
    content: "";
    border-left: 12px solid transparent;
    border-right: 0 solid transparent;
    border-top: 14px solid #17A2B8;
    position: absolute;
    bottom: -14px;
    left: 0;
}

.ribbon-info::before {
    border-top-color: #17A2B8;
}

.add_to_block_manual.loading {
    position: relative;
    pointer-events: none;
    /* Disable pointer events */
}

.add_to_block_manual.loading::after {
    content: '';
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    border: 2px solid #ccc;
    border-top-color: #333;
    border-radius: 50%;
    width: 12px;
    height: 12px;
    animation: spin 0.6s linear infinite;
}

@keyframes spin {
    from {
        transform: translateY(-50%) rotate(0deg);
    }

    to {
        transform: translateY(-50%) rotate(360deg);
    }
}



nav svg {
    width: 25px;
    height: 25px;
}

nav {
    display: inline-block;
}



#pagination {
    margin-top: 30px;
    margin-bottom: 30px;
}

#pagination p {
    color: #464646;
}

#pagination p {
    margin-top: 0;
    margin-bottom: 1rem;
}

#pagination a {
    color: #2f708f;
    text-decoration: none;
}

#pagination a:hover {
    color: #265a72;
    text-decoration: underline;
}

#pagination svg {
    vertical-align: middle;
}

#pagination ::-moz-focus-inner {
    padding: 0;
    border-style: none;
}

#pagination .row>* {
    flex-shrink: 0;
    width: 100%;
    max-width: 100%;
    padding-right: calc(var(--bs-gutter-x) * 0.5);
    padding-left: calc(var(--bs-gutter-x) * 0.5);
    margin-top: var(--bs-gutter-y);
}

@media (min-width: 768px) {
    #pagination .col-md-12 {
        flex: 0 0 auto;
        width: 100%;
    }
}

#pagination .shadow-sm {
    box-shadow: 0 0.1rem 0.3rem rgba(0, 0, 0, 0.1) !important;
}

#pagination .border {
    border: 1px solid #dee2e6 !important;
}

#pagination .px-2 {
    padding-right: 0.5rem !important;
    padding-left: 0.5rem !important;
}

#pagination .px-4 {
    padding-right: 1.5rem !important;
    padding-left: 1.5rem !important;
}

#pagination .py-2 {
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
}

#pagination .bg-white {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-white-rgb), var(--bs-bg-opacity)) !important;
}

#pagination .bg-white {
    background-color: #fff !important;
}

#pagination .text-sm {
    font-size: 0.875rem !important;
}

#pagination .text-gray-500 {
    color: #adb5bd !important;
}

#pagination .text-gray-700 {
    color: #495057 !important;
}

#pagination .text-gray-500 {
    color: #adb5bd;
}

#pagination .text-gray-700 {
    color: #495057;
}

/*! CSS Used from: https://groupbook.getjanhost.dev/public/frontend/css/custom.css */
#pagination a:hover {
    text-decoration: none;
}

/*! CSS Used from: Embedded */
#pagination *,
#pagination::after,
#pagination::before {
    box-sizing: border-box;
    border-width: 0;
    border-style: solid;
    border-color: #e5e7eb;
}

#pagination::after,
#pagination::before {
    --tw-content: '';
}

#pagination a {
    color: inherit;
    text-decoration: inherit;
}

#pagination:-moz-focusring {
    outline: auto;
}

#pagination p {
    margin: 0;
}

#pagination :disabled {
    cursor: default;
}

#pagination svg {
    display: block;
    vertical-align: middle;
}

#pagination *,
#pagination ::before,
::after {
    --tw-border-spacing-x: 0;
    --tw-border-spacing-y: 0;
    --tw-translate-x: 0;
    --tw-translate-y: 0;
    --tw-rotate: 0;
    --tw-skew-x: 0;
    --tw-skew-y: 0;
    --tw-scale-x: 1;
    --tw-scale-y: 1;
    --tw-scroll-snap-strictness: proximity;
    --tw-ring-offset-width: 0px;
    --tw-ring-offset-color: #fff;
    --tw-ring-color: rgb(59 130 246 / 0.5);
    --tw-ring-offset-shadow: 0 0 #0000;
    --tw-ring-shadow: 0 0 #0000;
    --tw-shadow: 0 0 #0000;
    --tw-shadow-colored: 0 0 #0000;
}

#pagination .relative {
    position: relative;
}

#pagination .z-0 {
    z-index: 0;
}

#pagination .ml-3 {
    margin-left: 0.75rem;
}

#pagination .-ml-px {
    margin-left: -1px;
}

#pagination .flex {
    display: flex;
}

#pagination .inline-flex {
    display: inline-flex;
}

#pagination .hidden {
    display: none;
}

#pagination .h-5 {
    height: 1.25rem;
}

#pagination .w-5 {
    width: 1.25rem;
}

#pagination .flex-1 {
    flex: 1 1 0%;
}

#pagination .cursor-default {
    cursor: default;
}

#pagination .items-center {
    align-items: center;
}

#pagination .justify-between {
    justify-content: space-between;
}

#pagination .rounded-md {
    border-radius: 0.375rem;
}

#pagination .rounded-l-md {
    border-top-left-radius: 0.375rem;
    border-bottom-left-radius: 0.375rem;
}

#pagination .rounded-r-md {
    border-top-right-radius: 0.375rem;
    border-bottom-right-radius: 0.375rem;
}

#pagination .border {
    border-width: 1px;
}

#pagination .border-gray-300 {
    --tw-border-opacity: 1;
    border-color: rgb(209 213 219 / var(--tw-border-opacity));
}

#pagination .bg-white {
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity));
}

#pagination .px-2 {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}

#pagination .px-4 {
    padding-left: 1rem;
    padding-right: 1rem;
}

#pagination .py-2 {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}

#pagination .text-sm {
    font-size: 0.875rem;
    line-height: 1.25rem;
}

#pagination .font-medium {
    font-weight: 500;
}

#pagination .leading-5 {
    line-height: 1.25rem;
}

#pagination .text-gray-700 {
    --tw-text-opacity: 1;
    color: rgb(55 65 81 / var(--tw-text-opacity));
}

#pagination .text-gray-500 {
    --tw-text-opacity: 1;
    color: rgb(107 114 128 / var(--tw-text-opacity));
}

#pagination .shadow-sm {
    --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
    --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

#pagination .ring-gray-300 {
    --tw-ring-opacity: 1;
    --tw-ring-color: rgb(209 213 219 / var(--tw-ring-opacity));
}

#pagination .transition {
    transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}

#pagination .duration-150 {
    transition-duration: 150ms;
}

#pagination .ease-in-out {
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

#pagination .hover\:text-gray-500:hover {
    --tw-text-opacity: 1;
    color: rgb(107 114 128 / var(--tw-text-opacity));
}

#pagination .hover\:text-gray-400:hover {
    --tw-text-opacity: 1;
    color: rgb(156 163 175 / var(--tw-text-opacity));
}

#pagination .focus\:z-10:focus {
    z-index: 10;
}

#pagination .focus\:border-blue-300:focus {
    --tw-border-opacity: 1;
    border-color: rgb(147 197 253 / var(--tw-border-opacity));
}

#pagination .focus\:outline-none:focus {
    outline: 2px solid transparent;
    outline-offset: 2px;
}

#pagination .focus\:ring:focus {
    --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
    --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);
    box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}

#pagination .active\:bg-gray-100:active {
    --tw-bg-opacity: 1;
    background-color: rgb(243 244 246 / var(--tw-bg-opacity));
}

#pagination .active\:text-gray-700:active {
    --tw-text-opacity: 1;
    color: rgb(55 65 81 / var(--tw-text-opacity));
}

#pagination .active\:text-gray-500:active {
    --tw-text-opacity: 1;
    color: rgb(107 114 128 / var(--tw-text-opacity));
}

@media (min-width: 640px) {
    #pagination .sm\:flex {
        display: flex;
    }

    #pagination .sm\:hidden {
        display: none;
    }

    #pagination .sm\:flex-1 {
        flex: 1 1 0%;
    }

    #pagination .sm\:items-center {
        align-items: center;
    }

    #pagination .sm\:justify-between {
        justify-content: space-between;
    }
}

#paginationContainer {
    margin-top: 5px;
    margin-bottom: 5px;
}


.price-per-night {
    font-size: calc(1.275rem + 0.3vw);
    line-height: 26px;
}

.header-container {
    background-color: rgb(239 246 255);
}

.request_room {
    margin-bottom: 6px !important;
}


/* Default: Hide on larger screens */
#mobileFooterFinalizeBlockRequest {
    display: none;
}

/* Show and fix it at the bottom only for mobile devices */
@media screen and (max-width: 768px) {
    #mobileFooterFinalizeBlockRequest {
        display: block;
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        background-color: #333;
        color: white;
        text-align: center;
        padding: 10px;
        z-index: 100;
        margin: 0px;
    }



    #finalizeBlockRequestButton {
        margin: 0 auto !important;
    }

    .blkRequestText {
        text-align: center !important;
        color: #fff !important;
        margin-bottom: 10px;
        margin-top: 10px !important;
    }

    #blockRequestCart {
        margin-top: 10px;
        margin-bottom: 10px;
    }


}