:root {
    --primary-color: 212, 28, 8;
    --white-color: 255, 255, 255;
    --primary-green: 0, 160, 86;
    --main-green: 25, 135, 84;
    --main-green-hover: 18, 115, 70;
    --border-gray: 221, 221, 221;
    --light-gray: 249, 249, 249;
    --light-gray-bkg: 243, 243, 243;
    --light-blue: 10, 88, 202;
    --black-color: 0, 0, 0;
    --medium-gray: 153, 153, 153;
    --disabled: 181, 181, 181;
    --url-blue: 51, 122, 183;
    --url-hover: 35, 82, 124;
    --dark-gray: 51, 51, 51;
    --secondary-button: 255, 147, 0;
    --secondary-button-hover: 229. 133, 3;
}

@keyframes slide {
    0% {
        left: -100%;
        transform: translateX(-100%);
    }

    100% {
        left: 0;
        transform: translateX(0);
    }
}

@-webkit-keyframes slide {
    0% {
        left: -100%;
        transform: translateX(-100%);
    }

    100% {
        left: 0;
        transform: translateX(0);
    }
}

@-moz-keyframes slide {
    0% {
        left: -100%;
        transform: translateX(-100%);
    }

    100% {
        left: 0;
        transform: translateX(0);
    }
}

@-o-keyframes slide {
    0% {
        left: -100%;
        transform: translateX(-100%);
    }

    100% {
        left: 0;
        transform: translateX(0);
    }
}

@-ms-keyframes slide {
    0% {
        left: -100%;
        transform: translateX(-100%);
    }

    100% {
        left: 0;
        transform: translateX(0);
    }
}

@keyframes slide-back {
    0% {
        left: 0;
        transform: translateX(0);
        display: inline-block;
    }

    100% {
        left: -100%;
        transform: translateX(-100%);
        display: none;
    }
}

@-webkit-keyframes slide-back {
    0% {
        left: 0;
        transform: translateX(0);
        display: inline-block;
    }

    100% {
        left: -100%;
        transform: translateX(-100%);
        display: none;
    }
}

@-moz-keyframes slide-back {
    0% {
        left: 0;
        transform: translateX(0);
        display: inline-block;
    }

    100% {
        left: -100%;
        transform: translateX(-100%);
        display: none;
    }
}

@-o-keyframes slide-back {
    0% {
        left: 0;
        transform: translateX(0);
        display: inline-block;
    }

    100% {
        left: -100%;
        transform: translateX(-100%);
        display: none;
    }
}

@-ms-keyframes slide-back {
    0% {
        left: 0;
        transform: translateX(0);
        display: inline-block;
    }

    100% {
        left: -100%;
        transform: translateX(-100%);
        display: none;
    }
}

@keyframes show {
    0% {
        height: 0;
    }

    100% {
        height: auto;
    }
}

@-webkit-keyframes show {
    0% {
        height: 0;
    }

    100% {
        height: auto;
    }
}

@-moz-keyframes show {
    0% {
        height: 0;
    }

    100% {
        height: auto;
    }
}

@-o-keyframes show {
    0% {
        height: 0;
    }

    100% {
        height: auto;
    }
}

@-ms-keyframes show {
    0% {
        height: 0;
    }

    100% {
        height: auto;
    }
}

@keyframes fadeIn {
    0% {
        height: 0;
    }

    100% {
        height: auto;
    }

    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@-webkit-keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@-moz-keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@-o-keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@-ms-keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes fadeOut {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

@-webkit-keyframes fadeOut {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

@-moz-keyframes fadeOut {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

@-o-keyframes fadeOut {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

@-ms-keyframes fadeOut {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

@keyframes hide {
    0% {
        height: auto;
    }

    100% {
        height: 0;
    }
}

@-webkit-keyframes hide {
    0% {
        height: auto;
    }

    100% {
        height: 0;
    }
}

@-moz-keyframes hide {
    0% {
        height: auto;
    }

    100% {
        height: 0;
    }
}

@-o-keyframes hide {
    0% {
        height: auto;
    }

    100% {
        height: 0;
    }
}

@-ms-keyframes hide {
    0% {
        height: auto;
    }

    100% {
        height: 0;
    }
}

body {
    font-size: 16px;
    line-height: 1.5rem !important;
}

.content {
    flex: 1 0 auto;
}

footer {
    flex-shrink: 0;
}


/* header */
.navbar {
    display: flex;
    flex-direction: column;
}

    .navbar.sticky-top {
        padding: 0 !important;
        background-color: rgb(var(--white-color));
        box-shadow: 0 1px 3px rgba(var(--black-color),.3);
    }

        .navbar.sticky-top .container-fluid {
            position: relative;
            padding: 0px !important;
            display: flex;
            align-items: center;
            justify-content: space-between;
        }

.navbar-brand {
    padding-top: 0.75rem !important;
    padding-bottom: 0.75rem !important;
}

    .navbar-brand img {
        height: 3rem;
    }

.navbar-toggler {
    border: none !important;
}

.header-actions {
    display: flex;
    align-items: center;
}

    .header-actions.mobile {
        display: none;
    }

    .header-actions a {
        margin-left: 1rem;
        text-decoration: none;
        color: rgb(var(--primary-color));
        font-size: 0.9rem;
        display: flex;
        align-items: center;
        justify-content: center;
    }

        .header-actions a:hover,
        .header-actions a:focus,
        .header-actions a:active {
            color: rgba(var(--primary-color), .85);
        }

        .header-actions a:before {
            content: "";
            display: inline-block;
            position: relative;
            background-position: center;
            background-size: contain;
            background-repeat: no-repeat;
        }

        .header-actions a.phone:before {
            background-image: url("./images/phone-icon-red.svg");
            width: 14px;
            height: 14px;
            margin-right: 5px;
            margin-bottom: -2px;
        }

        .header-actions a.email:before {
            background-image: url("./images/envelope-icon-red.svg");
            width: 14px;
            height: 14px;
            margin-bottom: -2px;
            margin-right: 5px;
        }

    .header-actions select {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        margin-left: 1rem;
        font-size: 0.9rem;
        outline: 0 !important;
        border: none !important;
        line-height: 1rem;
        color: rgb(var(--primary-color));
    }

        .header-actions select:active,
        .header-actions select:hover,
        .header-actions select:focus {
            outline: 0 !important;
            box-shadow: none !important;
            background-color: #fff !important;
        }

        .header-actions select option {
            font-size: 0.9rem;
            color: rgb(0, 0, 0);
            background-color: #fff !important;
        }

.navbar-collapse {
    width: 100%;
    display: flex;
    justify-content: space-between;
    background-color: rgb(var(--primary-color));
}

    .navbar-collapse .container {
        padding-left: 0 !important;
        padding-right: 0 !important;
        display: flex;
        align-items: stretch;
        justify-content: space-between;
    }

    .navbar-collapse .navbar-nav {
        margin-left: -0.75rem !important;
    }

    .navbar-collapse ul li a {
        color: #fff;
        text-decoration: none;
        padding-left: 0.75rem !important;
        padding-right: 0.75rem !important;
        font-size: 0.9rem;
    }

        .navbar-collapse ul li a:hover,
        .navbar-collapse ul li a:focus,
        .navbar-collapse ul li a:active,
        .navbar-collapse ul li a:focus-visible,
        .bold-nav:hover,
        .bold-nav:focus,
        .bold-nav:active {
            background-color: rgba(255, 255, 255, .2);
            color: #fff;
        }

.bold-nav {
    color: #fff;
    text-decoration: none;
    font-weight: 700;
    height: auto;
    display: flex;
    align-items: center;
    padding: 0 0.75rem;
    margin-right: -0.75rem;
}
/* header end */

/* homepage  */
.carousel {
    width: 100%;
    height: auto;
    max-width: 1920px;
    position: relative;
    margin:  0 auto;
}

    .carousel .carousel-inner,
    .carousel .carousel-inner .carousel-item {
        width: 100%;
        height: auto;
    }

        .carousel .carousel-inner .carousel-item a img {
            width: 100%;
            height: auto;
            margin: 0 auto;
        }
.carousel-controls {
    position:  absolute;
    left: 0;
    right: 0;
    top:  0;
    width:  100%;
    height: 100%;
    max-width: 1920px;
    z-index: 1;
    margin:  auto;
}

.advanced-search {
    background-color: rgba(0, 0, 0, 0.8);
    padding: 1rem 0.5rem;
    border-radius: 1rem;
    z-index: 2;
    margin-top: -3rem !important;
    position: relative;
    margin-bottom: 2.5rem !important;
    align-items: stretch;
}

    .advanced-search .col {
        padding-right: 0 !important;
    }

    .advanced-search button {
        border: none;
        background-color: #fff !important;
    }

        .advanced-search button.search {
            color: #fff;
            background-color: rgb(var(--main-green)) !important;
            width: 100%;
            padding: 0.5rem 0;
            text-align: center;
            border-radius: 0.25rem;
            height: 100%;
        }

button.search-option {
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 0.5rem;
    width: 100%;
    border-radius: 0.25rem;
}

    button.search-option::after {
        display: none;
    }

.advanced-search .dropdown {
    width: 100%;
}

.advanced-search .col:first-of-type {
    padding-left: 0 !important;
}

.search-option .title-form {
    position: relative;
    color: rgb(var(--primary-color));
    font-size: 0.8rem;
    text-transform: uppercase;
    margin-bottom: 0.3rem;
    line-height: 1rem;
    display: block;
    width: 100%;
    text-align: left;
}

    .search-option .title-form:after {
        display: inline-block;
        position: absolute;
        right: 0;
        content: "";
        background-image: url("./images/chevron-down-red.svg");
        width: 12px;
        height: 12px;
        background-position: center;
        background-size: contain;
        background-repeat: no-repeat;
    }

.search-option .selected-value {
    line-height: 1rem;
    text-align: left;
}

.advanced-search .dropdown-menu {
    padding: 0.6rem !important;
    width: 100%;
}

    .advanced-search .dropdown-menu.p-0 {
        padding: 0.6rem 0 !important;
    }

.advanced-search .dropdown-option {
    display: flex;
    flex-direction: column;
    margin-bottom: 0.5rem;
}

    .advanced-search .dropdown-option .form-label {
        font-size: 0.9rem;
        font-weight: 700;
        margin-bottom: 0.25rem;
    }

    .advanced-search .dropdown-option .room-title {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        background-color: rgb(var(--light-gray));
        padding: 0 0.6rem;
        margin-bottom: 0.5rem;
        height: 1.8rem;
    }

    .advanced-search .dropdown-option .remove-room {
        background-image: url("./images/close-button.svg");
        width: 24px;
        height: 24px;
        background-position: center;
        background-size: contain;
        background-repeat: no-repeat;
        opacity: 0.5;
        padding: 0;
        margin-right: -0.3rem;
    }

        .advanced-search .dropdown-option .remove-room:hover,
        .advanced-search .dropdown-option .remove-room:focus,
        .advanced-search .dropdown-option .remove-room:focus-visible,
        .advanced-search .dropdown-option .remove-room:active {
            opacity: 1;
        }

    .advanced-search .dropdown-option .form-label.room {
        margin-bottom: 0;
    }

    .advanced-search .dropdown-option select {
        border-color: rgb(var(--border-gray)) !important;
        border-radius: 0.2rem;
    }

.advanced-search .select-button {
    margin: auto;
    margin-top: 0.5rem;
    position: relative;
    background-color: rgb(var(--main-green)) !important;
    color: #fff;
    display: block;
    border-radius: 0.25rem;
    font-size: 0.9rem;
    padding: 0.4rem 1.5rem;
}

    .advanced-search .select-button:hover,
    .advanced-search .select-button:active,
    .advanced-search .select-button:focus,
    .advanced-search .select-button:focus-visible {
        background-color: rgb(var(--main-green-hover)) !important;
        color: #fff !important;
    }

icon-shape {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    vertical-align: middle;
}

.icon-sm {
    width: 1.8rem;
    height: 1.8rem;
}

.person-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.5rem;
    padding: 0 0.6rem;
}

    .person-row .person-value {
        background-color: rgb(var(--white-color));
        width: 40px;
        margin: auto !important;
        border: none !important;
        outline: none !important;
    }

    .person-row .input-group {
        display: flex;
        align-items: center;
        flex-direction: row;
        padding-right: 1.5rem !important;
    }
/* Chrome, Safari, Edge, Opera */
input.person-value::-webkit-outer-spin-button,
input.person-value::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
/* Firefox */
input.person-value[type=number] {
    -moz-appearance: textfield;
}

.add-room::before {
    content: "+";
    display: inline-block;
    position: relative;
    margin-right: 0.2rem;
    font-size: 1.2rem;
    font-weight: 500;
}

.add-room {
    color: rgb(var(--light-blue));
    text-decoration: underline;
    font-size: 0.9rem;
    border-top: 1px solid rgba(var(--black-color), 0.15);
    margin: 0 0.6rem;
}

.promo-image img {
    width: 100%;
    max-width: 1920px;
    margin: auto;
    display: block;
    position: relative;
}

.offers {
    padding: 3rem 0 1.5rem 0;
}

    .offers p {
        line-height: 1.5rem;
        margin-bottom: 1rem;
        text-align: center;
    }

.category {
    display: block;
    width: 100%;
    overflow: hidden;
    position: relative;
    height: 15rem;
    border-radius: 0.5rem;
    margin-bottom: 1.5rem;
}

    .category .title {
        color: rgb(var(--white-color));
        font-size: 1.1rem;
        font-weight: 600;
        text-transform: uppercase;
        position: absolute;
        right: 0.75rem;
        bottom: 0.75rem;
        z-index: 1;
    }

    .category .image {
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: transform .2s;
        display: block;
        background-position: center;
        background-size: cover;
    }

        .category .image:hover {
            transform: scale(1.3);
        }

.primary-title {
    color: rgb(var(--primary-color));
    margin-top: 1rem;
}

.hotels {
    padding: 1rem 0;
    background-color: rgb(var(--light-gray));
}

.hotel-tile {
    width: 100%;
    position: relative;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
    border-radius: 0.5rem;
    margin-bottom: 1.5rem;
    text-decoration: none;
    color: rgb(var(--black-color));
    display: block;
    transition: transform .2s;
    overflow: hidden;
}

    .hotel-tile:hover,
    .hotel-tile:focus,
    .hotel-tile:active,
    .hotel-tile:focus-visible {
        box-shadow: rgba(0, 0, 0, 0.36) 0px 1px 4px;
    }

        .hotel-tile:hover .image,
        .hotel-tile:focus .image,
        .hotel-tile:active .image,
        .hotel-tile:focus-visible .image {
            transform: scale(1.2);
        }

    .hotel-tile .price {
        position: absolute;
        z-index: 1;
        right: 0.5rem;
        top: 0.5rem;
        background-color: rgba(0, 0, 0, 0.65);
        color: #ffffff;
        padding: 0.25rem 0.5rem;
        border-radius: 0.25rem;
    }

    .hotel-tile .image {
        width: 100%;
        height: 16rem;
        background-size: cover;
        background-position: center;
        display: block;
        border-top-left-radius: 0.5rem;
        border-top-right-radius: 0.5rem;
        z-index: 1;
        transition: transform .2s;
    }

.hotel-info {
    background-color: rgb(var(--white-color));
    border-bottom-left-radius: 0.5rem;
    border-bottom-right-radius: 0.5rem;
    padding: 1rem;
    z-index: 2;
    background-color: rgb(var(--white-color));
    position: relative;
}

    .hotel-info .name {
        font-weight: 600;
        margin-bottom: 0.5rem;
        font-size: 1.2rem;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .hotel-info .location {
        line-height: 1.2rem;
    }

        .hotel-info .location::before {
            content: "";
            margin-right: 0.3rem;
            position: relative;
            display: inline-block;
            width: 1.1rem;
            height: 1.1rem;
            margin-bottom: -0.2rem;
            background-image: url("./images/address-icon-red.svg");
            background-size: contain;
            background-position: center;
            background-repeat: no-repeat;
        }

h2 {
    text-align: center;
}

.offers h1 {
    text-align: center;
    font-size: 2rem;
}

.reviews {
    margin: 2rem 0;
}

    .reviews .subtitle {
        font-size: 1.1rem;
        color: rgb(var(--main-green));
        text-align: center;
    }

.ReviewsMultiCarousel {
    overflow: hidden;
    padding: 15px;
    width: 100%;
    position: relative;
}

    .ReviewsMultiCarousel .ReviewsMultiCarousel-inner {
        transition: 1s ease all;
        float: left;
        display: flex;
        align-items: stretch;
    }

        .ReviewsMultiCarousel .ReviewsMultiCarousel-inner .item {
            float: left;
        }

            .ReviewsMultiCarousel .ReviewsMultiCarousel-inner .item > .content {
                text-align: center;
                padding: 1rem 1.5rem;
                margin: 0.25rem;
                background: rgba(var(--light-gray), 0.9);
                border-radius: 0.5rem;
                height: 100%;
            }

.content p {
    font-size: 0.9rem;
    line-height: 1.5rem;
}

    .content p.author {
        font-weight: 600;
    }

.ReviewsMultiCarousel .leftLst,
.ReviewsMultiCarousel .rightLst {
    position: absolute;
    border-radius: 50%;
    top: calc(50% - 20px);
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: rgb(var(--primary-color));
    border-color: transparent;
    !important;
}

    .ReviewsMultiCarousel .leftLst:hover,
    .ReviewsMultiCarousel .rightLst:hover,
    .ReviewsMultiCarousel .leftLst:focus,
    .ReviewsMultiCarousel .rightLst:focus,
    .ReviewsMultiCarousel .leftLst:focus-visible,
    .ReviewsMultiCarousel .rightLst:focus-visible,
    .ReviewsMultiCarousel .leftLst:active,
    .ReviewsMultiCarousel .rightLst:active {
        border-color: transparent;
        !important;
        background-color: rgba(var(--primary-color), 0.7) !important;
    }

.ReviewsMultiCarousel .leftLst {
    left: 0;
}

.ReviewsMultiCarousel .rightLst {
    right: 0;
}

    .ReviewsMultiCarousel .leftLst.over,
    .ReviewsMultiCarousel .rightLst.over {
        pointer-events: none;
        background: rgb(var(--disabled)) !important;
        text-align: center;
    }

.stars {
    color: #f9c71b;
    margin: 1rem auto;
}


/* homepage end  */


/* hotel list  */
.hotel-progress-bar {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    flex-grow: 1;
    position: relative;
    margin: 1.5rem 0;
}

.progress-bar-step {
    display: flex;
    position: relative;
    background-color: rgb(var(--light-gray));
    width: 25%;
    text-align: center;
    align-items: center;
    justify-content: center;
    border-right: 1px solid rgba(var(--medium-gray), 0.5);
}

    .progress-bar-step::after {
        background-image: url("./images/arrow-right-black.svg");
        width: 12px;
        height: 12px;
        display: inline-block;
        position: absolute;
        right: 0.5rem;
        background-position: center;
        background-size: contain;
        background-repeat: no-repeat;
        content: "";
    }

    .progress-bar-step .step-title {
        color: rgb(var(--medium-gray));
        font-size: 0.9rem;
        text-align: center;
        width: fit-content;
        display: flex;
        align-items: center;
        line-height: 1.1rem;
        padding-right: 1rem;
    }

    .progress-bar-step.checked {
        background-color: rgb(var(--primary-color));
    }

        .progress-bar-step.checked::after {
            background-image: url("./images/arrow-right-white.svg");
        }

        .progress-bar-step.checked .step-title {
            color: rgb(var(--white-color));
        }

    .progress-bar-step .step-title .fa {
        font-size: 0.6rem;
        font-weight: 400;
        margin-right: 0.2rem;
        margin-left: 0.5rem;
    }

    .progress-bar-step.checked.go-back .step-title::before {
        content: none;
    }

    .progress-bar-step.checked .step-title::before {
        content: "";
        display: inline-block;
        position: relative;
        width: 16px;
        height: 16px;
        background-image: url("./images/check-white.svg");
        background-position: center;
        background-size: contain;
        background-repeat: no-repeat;
    }

.results-title {
    text-decoration: none;
}

    .results-title .primary,
    .results-title .secondary {
        display: flex;
        flex-direction: row;
        align-items: center;
        flex-wrap: wrap;
    }

        .results-title .primary span,
        .results-title .secondary span {
            padding-right: 0.3rem;
        }

    .results-title .primary {
        margin-bottom: 0.5rem;
    }

    .results-title .secondary {
        margin-bottom: 1.3rem;
    }

    .results-title .primary span {
        color: rgb(var(--url-blue));
        font-size: 2rem;
        line-height: 3rem;
    }

    .results-title:hover .primary span,
    .results-title:active .primary span,
    .results-title:focus .primary span,
    .results-title:focus-visible .primary span {
        color: rgb(var(--url-hover));
    }

    .results-title .secondary span {
        color: rgb(var(--medium-gray));
        font-size: 1.3rem;
    }

.search-and-pagination {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}

.search-info {
    margin-bottom: 1rem;
}

    .search-info .search-row {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
    }

        .search-info .search-row span {
            padding-right: 0.3rem;
            font-size: 0.75rem;
            line-height: 1rem;
            color: rgb(var(--dark-gray));
        }

            .search-info .search-row span.bold {
                font-weight: 700;
            }

.pagination .page-item .page-link {
    color: rgb(var(--medium-gray));
    padding: 0.15rem 0.65rem;
    margin: 3px;
    border-radius: 2px;
}

.pagination .page-item.active .page-link {
    background-color: rgb(var(--primary-color));
    color: rgb(var(--white-color));
    border: 1px solid rgb(var(--primary-color));
}

.pagination-bottom {
    display: flex;
    justify-content: flex-end;
    flex-grow: 1;
}

.sort-by {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 1rem;
}

    .sort-by span {
        font-size: 0.75rem;
        color: rgb(var(--dark-gray));
        padding-right: 0.3rem;
        line-height: 1rem;
    }

    .sort-by .sort-option {
        color: rgb(var(--dark-gray));
        font-size: 0.75rem;
        line-height: 1.2rem;
        padding-left: 0.3rem;
        padding-right: 0.3rem;
        border: 1px solid rgb(var(--border-gray));
        margin-right: 0.3rem;
    }

        .sort-by .sort-option:last-of-type {
            margin-right: 0;
        }

        .sort-by .sort-option.selected,
        .sort-by .sort-option:hover,
        .sort-by .sort-option:active,
        .sort-by .sort-option:focus,
        .sort-by .sort-option:focus-visible {
            border: 1px solid rgb(var(--primary-color));
            background-color: rgb(var(--primary-color));
            color: rgb(var(--white-color));
            outline: none !important;
        }

            .sort-by .sort-option.selected option,
            .sort-by .sort-option:hover option,
            .sort-by .sort-option:active option,
            .sort-by .sort-option:focus option,
            .sort-by .sort-option:focus-visible option {
                background-color: rgb(var(--white-color));
                color: rgb(var(--black-color));
                outline: none !important;
            }

        .sort-by .sort-option option:hover {
            background-color: rgb(var(--primary-color)) !important;
            color: rgb(var(--white-color)) !important;
        }

.change-search {
    border: 1px solid rgb(var(--border-gray));
    text-align: center;
    outline: none;
    background-color: transparent;
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    border-radius: 0.25rem;
}

    .change-search:hover,
    .change-search:active,
    .change-search:focus,
    .change-search:focus-visible {
        outline: none !important;
    }

    .change-search span {
        font-size: 0.9rem;
        display: inline-block;
    }

        .change-search span::before {
            content: "";
            display: inline-block;
            position: relative;
            background-image: url("./images/search-icon.svg");
            background-position: center;
            background-repeat: no-repeat;
            background-size: contain;
            width: 14px;
            height: 14px;
            margin-right: 0.5rem;
        }

.change-search-form {
    margin: 0.5rem 0;
    padding: 0.5rem;
    background-color: rgba(var(--primary-color), .25);
    border-radius: 0.25rem;
}

    .change-search-form .row {
        margin-left: 0 !important;
        margin-right: 0 !important;
        margin-bottom: 0.3rem;
    }

        .change-search-form .row .col-md-6:first-of-type {
            padding-right: 0.25rem !important;
            padding-left: 0 !important;
        }

        .change-search-form .row .col-md-6:last-of-type {
            padding-left: 0.25rem !important;
            padding-right: 0 !important;
        }

        .change-search-form .row .col-md-12 {
            padding-left: 0 !important;
            padding-right: 0 !important;
        }

    .change-search-form label {
        font-size: 0.9rem;
        color: rgb(var(--dark-gray));
        margin-bottom: 0.2rem;
    }

    .change-search-form select {
        border: 1px solid rgb(var(--border-gray));
        width: 100%;
        padding-left: 0.5rem;
    }

    .change-search-form input {
        display: block;
        border: 1px solid rgb(var(--border-gray));
        width: 100%;
        padding-left: 0.5rem;
    }

    .change-search-form .subtitle {
        font-size: 0.8rem;
        text-transform: uppercase;
        font-weight: 700;
        margin-top: 1rem;
    }

.new-search {
    border-radius: 0.25rem;
    color: rgb(var(--white-color));
    background-color: rgb(var(--primary-green));
    margin-top: 1rem;
    width: 100%;
    display: block;
    border: 1px solid rgb(var(--primary-green));
    text-align: center;
    font-size: 0.9rem;
    padding: 0.2rem;
}

    .new-search:hover,
    .new-search:focus,
    .new-search:active,
    .new-search:focus-visible {
        outline: none;
        background-color: rgb(var(--main-green));
        border: 1px solid rgb(var(--main-green));
    }

.collapse-row {
    border-top: 1px solid rgb(var(--border-gray));
    padding: 0.5rem 0;
}

    .collapse-row:last-of-type {
        border-bottom: 1px solid rgb(var(--border-gray));
        margin-bottom: 2rem;
    }

    .collapse-row.colored {
        background-color: rgba(var(--primary-color), 0.05);
    }

    .collapse-row button {
        border: none !important;
        box-shadow: none !important;
        outline: none !important;
        position: relative;
        width: 100%;
        margin-bottom: 0.5rem;
        font-size: 0.9rem;
        font-weight: 600;
        background-color: transparent;
        text-align: left;
        position: relative;
    }

    .collapse-row .collapse-button::before {
        content: "";
        display: inline-block;
        position: absolute;
        right: 0.5rem;
        top: 0.5rem;
        width: 14px;
        height: 14px;
        background-image: url("./images/chevron-down-icon.svg");
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
    }

    .collapse-row .collapse-button[aria-expanded="true"]::before {
        background-image: url("./images/chevron-up-icon.svg");
    }

.collapse-info {
    display: block;
    position: relative;
    width: 100%;
}

    .collapse-info button {
        border: none !important;
        box-shadow: none !important;
        outline: none !important;
        position: relative;
        padding: 0;
        font-size: 0.9rem;
        font-weight: 600;
        position: relative;
        background-color: transparent;
        color: rgb(var(--url-blue));
    }

    .collapse-info .collapse-button:hover {
        color: rgb(var(--url-hover));
    }

    .collapse-info .collapse-button::before {
        content: "";
        display: inline-block;
        position: absolute;
        right: -1rem;
        top: 0.5rem;
        width: 12px;
        height: 12px;
        background-image: url("./images/chevron-down-icon-blue.svg");
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
    }

    .collapse-info .collapse-button[aria-expanded="true"]::before {
        background-image: url("./images/chevron-up-icon-blue.svg");
    }

.collapse-row input {
    border: 1px solid rgb(var(--border-gray));
    margin-bottom: 0.5rem;
    width: 100%;
    font-size: 0.9rem;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}

.collapse-row button.custom-search {
    border: 1px solid rgb(var(--secondary-button));
    background-color: rgb(var(--secondary-button));
    font-size: 0.8rem;
    color: rgb(var(--white-color));
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    margin-left: auto;
    margin-right: 0;
    outline: none !important;
    border-radius: 0.25rem;
    display: block;
    width: auto;
}

    .collapse-row button.custom-search:hover,
    .collapse-row button.custom-search:active,
    .collapse-row button.custom-search:focus,
    .collapse-row button.custom-search:focus-visible {
        border: 1px solid rgb(var(--secondary-button-hover));
        background-color: rgb(var(--secondary-button-hover));
    }

.collapse .option-row {
    margin: 0.25rem 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: row;
}

    .collapse .option-row .form-check {
        display: flex;
        flex-direction: row;
        align-items: center;
        margin-bottom: 0;
    }

        .collapse .option-row .form-check input {
            width: 1rem;
            height: 1rem;
            margin: 0 0.5rem 0 -1.5rem !important;
        }

        .collapse .option-row .form-check label {
            font-size: 0.9rem;
            line-height: 1rem;
            color: rgb(var(--dark-gray));
        }

        .collapse .option-row .form-check .stars,
        .hotel-container .stars {
            margin: 0;
            color: rgb(var(--secondary-button));
            display: flex;
            align-items: center;
        }

            .collapse .option-row .form-check .stars .fa-lg,
            .hotel-container .stars .fa-lg {
                font-size: 0.9rem !important;
                line-height: 1rem !important;
                margin-right: 0.1rem;
            }

    .collapse .option-row .results span {
        font-size: 0.9rem;
        margin-left: 0.25rem;
        color: rgb(var(--dark-gray));
    }

.hotel-container {
    box-shadow: 0 1px 6px rgba(var(--black-color),.2);
    padding: 1rem;
    border-radius: 0.25rem;
    margin-bottom: 1rem;
}

    .hotel-container:hover,
    .hotel-container:focus,
    .hotel-container:focus-visible,
    .hotel-container:active {
        box-shadow: 0 1px 6px rgba(var(--main-green),.7);
    }

    .hotel-container .hotel-thumbnail {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .hotel-container h2 {
        text-align: left;
        margin-bottom: 0;
        line-height: 1.8rem;
        margin-top: 0.5rem;
    }

    .hotel-container .col-xs-12:last-of-type {
        padding-left: 0 !important;
        flex-direction: column;
        justify-content: space-between;
        display: flex;
    }

    .hotel-container .stars {
        align-items: flex-start;
    }

.rooms-options-container {
    margin-top: 1rem;
    border: 1px solid rgb(var(--border-gray));
}

    .rooms-options-container .room-row {
        display: table;
        width: 100%;
        table-layout: fixed;
        background-color: rgb(var(--light-gray-bkg));
        border-bottom: 1px solid rgb(var(--border-gray));
    }

        .rooms-options-container .room-row:last-of-type {
            border-bottom: none;
        }

        .rooms-options-container .room-row.head {
            background-color: rgb(var(--light-gray));
            font-weight: 700;
        }

        .rooms-options-container .room-row .column {
            display: table-cell;
            width: 25%;
            padding: 0.2rem;
            font-size: 80%;
            line-height: 1rem;
            vertical-align: middle;
        }

            .rooms-options-container .room-row .column .type {
                margin-bottom: 0.5rem;
            }

            .rooms-options-container .room-row .column.price {
                text-align: center;
            }

        .rooms-options-container .room-row .primary-button {
            margin: 0.1rem auto;
        }

        .rooms-options-container .room-row .green-text {
            color: rgb(var(--main-green));
            letter-spacing: 1px;
            font-size: 1rem;
            font-weight: 500;
        }

        .rooms-options-container .room-row .old-price {
            text-decoration: line-through;
            color: rgb(var(--dark-gray));
            padding: 0.35rem 0;
            font-size: 0.9rem;
        }

        .rooms-options-container .room-row .new-price {
            color: rgb(var(--main-green));
            font-size: 1rem;
        }

            .rooms-options-container .room-row .new-price span:first-of-type {
                font-weight: 600;
                font-size: 1.1rem;
            }

            .rooms-options-container .room-row .new-price span:last-of-type {
                font-size: 80%;
            }

        .rooms-options-container .room-row a {
            color: rgb(var(--url-blue));
            text-decoration: none;
            outline: none;
        }

            .rooms-options-container .room-row a:hover,
            .rooms-options-container .room-row a:active,
            .rooms-options-container .room-row a:focus,
            .rooms-options-container .room-row a:focus-visible {
                color: rgb(var(--url-hover));
            }

        .rooms-options-container .room-row .column.transport {
            width: 20%;
        }

.hide-on-collapse {
    opacity: 1;
    animation: fadeIn 0.3s;
    animation-fill-mode: forwards;
}

.hotel-container:has(.collapse.show) .hide-on-collapse {
    animation: fadeOut 0.3s;
    animation-fill-mode: forwards;
}

.add-favorite {
    border: none !important;
    outline: none;
    background-color: transparent;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    margin-left: 0.5rem;
}

    .add-favorite img {
        width: 0.9rem;
        height: 0.9rem;
        margin-right: 0.3rem;
    }

    .add-favorite:hover,
    .add-favorite:active,
    .add-favorite:focus,
    .add-favorite:focus-visible {
        outline: none !important;
    }

    .add-favorite span {
        font-size: 0.8rem;
        line-height: 0.8rem;
        color: rgb(var(--dark-gray));
    }

.hotel-row {
    display: flex;
    flex-direction: row;
    align-items: center;
}

.hotel-container .hotel-info {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding: 0;
    background-color: transparent;
    border-radius: 0;
}

.hotel-info-column .detail {
    font-size: 0.8rem;
    color: rgb(var(--dark-gray));
    text-align: right;
    line-height: 0.8rem;
}

    .hotel-info-column .detail.uppercase {
        text-transform: uppercase;
        font-weight: 600;
        font-size: 0.7rem;
    }

.hotel-info-column .benefits {
    display: flex;
    align-items: center;
    flex-direction: row;
    justify-content: flex-end;
}

    .hotel-info-column .benefits .icons {
        color: rgba(var(--dark-gray), 0.85);
        margin-right: 0.3rem;
        font-size: 0.9rem;
    }

    .hotel-info-column .benefits span {
        font-size: 0.9rem;
        color: rgba(var(--dark-gray), 0.85);
    }

.initial-price {
    display: flex;
    justify-content: flex-end;
    color: rgba(var(--dark-gray), 0.85);
    line-height: 1.2rem;
    text-decoration: line-through;
}

    .initial-price span:first-of-type {
        font-size: 0.9rem;
    }

    .initial-price span:last-of-type {
        font-size: 0.8rem;
    }

    .initial-price sup {
        top: 0.35rem !important;
    }

    .initial-price span:last-of-type,
    .discounted-price span:last-of-type {
        padding-left: 0.25rem;
    }

.discounted-price {
    display: flex;
    justify-content: flex-end;
    color: rgb(var(--primary-green));
    margin-top: 0.3rem;
}

    .discounted-price span:first-of-type {
        font-size: 1.6rem;
        font-weight: 600;
    }

    .discounted-price sup {
        font-size: 0.9rem;
        top: 0.45rem !important;
    }

    .discounted-price span:last-of-type {
        font-size: 1.1rem;
    }

.hotel-info .package-details {
    display: flex;
    flex-wrap: wrap;
}

    .hotel-info .package-details span {
        font-size: 0.8rem;
        color: rgb(var(--dark-gray));
        margin-right: 0.5rem;
        line-height: 1rem;
    }

        .hotel-info .package-details span.bold {
            font-weight: 600;
            margin-right: 0.3rem;
        }

.hotel-info.bottom {
    align-items: flex-end;
}

.hotel-info .see-details {
    background-color: rgb(var(--primary-green));
    border: 1px solid rgb(var(--primary-green));
    border-radius: 0.25rem;
    color: rgb(var(--white-color));
    text-align: center;
    padding: 0.25rem 1rem;
    outline: none;
    margin-left: 1rem;
    display: inline-block;
    position: relative;
    margin-top: 1rem;
    min-width: 8rem;
}

    .hotel-info .see-details:hover,
    .hotel-info .see-details:active,
    .hotel-info .see-details:focus,
    .hotel-info .see-details:focus-visible {
        background-color: rgb(var(--main-green));
        border: 1px solid rgb(var(--main-green));
    }

.show-filters,
.hide-filters {
    display: none;
}
/* hotel list end  */

/* hotel details page  */
.hotel-details-title {
    text-decoration: none;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

    .hotel-details-title .primary {
        color: rgb(var(--url-blue));
        font-size: 2rem;
        line-height: 2rem;
        padding-right: 0.3rem;
        text-transform: uppercase;
    }

    .hotel-details-title .secondary {
        font-size: 2rem;
        line-height: 2.2rem;
        color: red;
        font-weight: 700;
        padding-right: 0.3rem;
    }

    .hotel-details-title:hover .primary,
    .hotel-details-title:active .primary,
    .hotel-details-title:focus .primary,
    .hotel-details-title:focus-visible .primary {
        color: rgb(var(--url-hover));
    }

    .hotel-details-title .stars {
        margin: 0 1rem 0 0.5rem;
    }

        .hotel-details-title .stars .fa {
            font-size: 1rem;
        }

.share-options {
    margin-top: 0.5rem;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
}

    .share-options button {
        border: none;
        box-shadow: none;
        width: fit-content;
        margin-right: 0.5rem;
        margin-bottom: 0.5rem;
        border-radius: 0.25rem;
        font-size: 0.8rem;
        color: rgb(var(--white-color));
        line-height: 1rem;
        position: relative;
        padding-left: 1.3rem;
        height: 1.2rem;
        display: flex;
        align-items: center;
        flex-direction: row;
    }

        .share-options button.fb {
            background-color: #1877f2;
        }

        .share-options button::before {
            content: "";
            display: inline-block;
            position: absolute;
            left: 0.25rem;
            top: 0.2rem;
            width: 0.8rem;
            height: 0.8rem;
            background-size: contain;
            background-position: center;
            background-repeat: no-repeat;
        }

        .share-options button.fb::before {
            background-image: url("./images/fb-icon.svg");
        }

        .share-options button.whatsapp {
            background-color: #25d366;
        }

            .share-options button.whatsapp::before {
                background-image: url("./images/whatsapp-icon.svg");
            }

        .share-options button.pdf {
            background-color: #cc0000;
        }

            .share-options button.pdf::before {
                background-image: url("./images/pdf-icon.svg");
            }

        .share-options button.favorites {
            background-color: #017942;
        }

            .share-options button.favorites::before {
                background-image: url("./images/heart-icon-white.svg");
            }

            .share-options button.whatsapp::before,
            .share-options button.favorites::before {
                width: 0.7rem;
                height: 0.7rem;
                top: 0.25rem;
            }

.hotel-location-info {
    display: flex;
    margin-bottom: 1rem;
    flex-direction: row;
    align-items: center;
    flex-wrap: wrap;
}

    .hotel-location-info span {
        padding-right: 0.3rem;
        font-size: 1rem;
        color: rgb(var(--medium-gray));
    }

#carouselHotel {
    margin-bottom: 2rem;
}

.hotel-details-page .change-search-form {
    margin-top: 3.5rem;
}

.hotel-extra .nav-tabs {
    border-bottom: 2px solid rgb(var(--primary-color));
}

    .hotel-extra .nav-tabs .nav-item {
        max-width: calc(25% - 3px);
        margin-right: 3px;
    }

        .hotel-extra .nav-tabs .nav-item:last-of-type {
            max-width: 25%;
            margin-right: 0;
        }

    .hotel-extra .nav-tabs .nav-link {
        border-top-left-radius: 0.2rem;
        border-top-right-radius: 0.2rem;
        background-color: rgba(var(--primary-color), 0.2);
        color: rgb(var(--black-color));
        border: 1px solid rgba(var(--primary-color), 0.1);
        transition: all 0.1s ease-in;
        text-transform: uppercase;
        font-size: 0.9rem;
        max-width: 100%;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
    }

        .hotel-extra .nav-tabs .nav-link:hover,
        .hotel-extra .nav-tabs .nav-link:active,
        .hotel-extra .nav-tabs .nav-link:focus,
        .hotel-extra .nav-tabs .nav-link:focus-visible {
            border: 1px solid rgb(var(--primary-color));
            background-color: rgb(var(--primary-color));
            color: rgb(var(--white-color));
        }

        .hotel-extra .nav-tabs .nav-link.active {
            background-color: rgb(var(--primary-color));
            color: rgb(var(--white-color));
            border: 1px solid rgb(var(--primary-color));
        }

.hotel-extra .tab-content {
    padding: 1rem 0;
    font-size: 0.9rem;
    line-height: 1.4rem;
}

    .hotel-extra .tab-content .subtitle {
        font-weight: 600;
    }

    .hotel-extra .tab-content .info {
        margin-bottom: 0.5rem;
    }

        .hotel-extra .tab-content .info .bold {
            padding-right: 0.3rem;
            font-weight: 600;
        }

    .hotel-extra .tab-content a {
        color: rgb(var(--url-blue));
        font-weight: 500;
    }

        .hotel-extra .tab-content a:hover,
        .hotel-extra .tab-content a:active,
        .hotel-extra .tab-content a:focus,
        .hotel-extra .tab-content a:focus-visible {
            color: rgb(var(--url-hover));
        }

.hotel-extra .info-message {
    border: 1px solid rgba(var(--primary-color), 0.2);
    padding: 1rem;
    border-radius: 0.5rem;
    margin: 1rem 0;
}

    .hotel-extra .info-message p {
        font-size: 0.85rem;
        line-height: 1.3rem;
    }

        .hotel-extra .info-message p:last-of-type {
            margin-bottom: 0;
        }

        .hotel-extra .info-message p:before {
            content: "";
            display: inline-block;
            position: relative;
            margin-right: 0.25rem;
            background-image: url('./images/info-icon.svg');
            background-position: center;
            background-size: contain;
            background-repeat: no-repeat;
            width: 0.9rem;
            height: 0.9rem;
            margin-bottom: -0.1rem;
        }

.hotel-extra .tab-content .basic-info {
    margin-bottom: 1rem;
}

    .hotel-extra .tab-content .basic-info span {
        font-size: 0.9rem;
        padding-right: 0.3rem;
    }

        .hotel-extra .tab-content .basic-info span.bold {
            font-weight: 600;
        }

.hotel-extra .nav-tabs.offer-filters {
    border-bottom: none;
    margin-bottom: 0.5rem;
}

    .hotel-extra .nav-tabs.offer-filters button {
        border: 1px solid rgba(var(--medium-gray), 0.3);
        border-radius: 0.25rem;
        margin-right: 0.25rem;
        background-color: transparent;
        color: rgb(var(--dark-gray));
        padding: 0.2rem 0.5rem;
    }

        .hotel-extra .nav-tabs.offer-filters button.active {
            border: 1px solid rgba(var(--medium-gray), 1);
        }

.offers-table .offers-table-head,
.offers-table .offers-table-body .offers-row {
    display: table;
    width: 100%;
    table-layout: fixed;
}

.offers-table .offers-table-body .offers-row {
    background-color: rgb(var(--light-gray-bkg));
    border-bottom: 1px solid rgba(var(--border-gray), 1);
    padding: 0.25rem 0;
}

    .offers-table .offers-table-body .offers-row.selected {
        background-color: rgb(var(--white-color));
    }

.offers-table .offers-table-head {
    background-color: rgba(var(--medium-gray), 0.3);
    font-weight: 700;
}

    .offers-table .offers-table-head .table-column-title {
        padding: 3px 5px;
        display: table-cell;
        vertical-align: top;
        font-size: 0.9rem;
        color: rgb(var(--dark-gray));
    }

        .offers-table .offers-table-head .table-column-title:first-of-type,
        .offers-table .offers-table-body .offers-column:first-of-type {
            width: 37%;
        }

        .offers-table .offers-table-head .table-column-title:nth-of-type(2),
        .offers-table .offers-table-head .table-column-title:nth-of-type(3),
        .offers-table .offers-table-head .table-column-title:nth-of-type(5),
        .offers-table .offers-table-body .offers-column:nth-of-type(2),
        .offers-table .offers-table-body .offers-column:nth-of-type(3),
        .offers-table .offers-table-body .offers-column:nth-of-type(5) {
            width: 20%;
        }

        .offers-table .offers-table-head .table-column-title:nth-of-type(4),
        .offers-table .offers-table-body .offers-column:nth-of-type(4) {
            width: 21%;
        }

        .offers-table .offers-table-head .table-column-title:nth-of-type(5),
        .offers-table .offers-table-body .offers-column:nth-of-type(5) {
            text-align: center;
        }

        .offers-table .offers-table-head .table-column-title:nth-of-type(6),
        .offers-table .offers-table-body .offers-column:nth-of-type(6) {
            width: 19%;
            text-align: center;
        }

.offers-table .offers-table-body .offers-column {
    padding: 3px 5px;
    display: table-cell;
    vertical-align: top;
    font-size: 0.9rem;
}

.offers-table p {
    font-size: 0.75rem;
    margin-bottom: 0.2rem;
    line-height: 1rem;
}

    .offers-table p.gray {
        color: rgb(var(--medium-gray));
    }

    .offers-table p span {
        padding-right: 0.25rem;
        line-height: 1rem;
    }

    .offers-table p.note {
        line-height: 1.2rem;
    }

    .offers-table p.bold {
        font-weight: 600;
    }

    .offers-table p .fa-question-circle {
        color: rgb(var(--url-blue));
        margin-left: -0.2rem;
    }

.hotel-extra .tab-content a.thin {
    font-weight: 400;
}

.offers-table .tooltip-info {
    color: rgb(var(--url-blue));
    border-bottom: 1px dotted rgb(var(--url-blue));
    line-height: 0.75rem;
    display: inline-block;
}

.offers-table span.bold {
    font-weight: 500;
    font-size: 0.8rem;
}

.offers-table .hotel-title {
    display: flex;
    flex-wrap: wrap;
}

    .offers-table .hotel-title .stars {
        margin: 0 0 0 0.3rem;
    }

        .offers-table .hotel-title .stars .fa {
            font-size: 0.7rem;
            line-height: 0.9rem;
        }

.offers-table a {
    text-decoration: none;
    color: rgb(var(--url-blue));
}

    .offers-table a:hover,
    .offers-table a:active,
    .offers-table a:focus,
    .offers-table a:focus-visible {
        color: rgb(var(--url-hover));
    }

.offers-table .benefits {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

    .offers-table .benefits .item {
        border-radius: 0.2rem;
        margin-right: 0.3rem;
        color: rgb(var(--white-color));
        font-size: 0.75rem;
        background-color: rgb(var(--primary-color));
        padding: 0.1rem 0.3rem;
        line-height: 1rem;
    }

        .offers-table .benefits .item span {
            line-height: 1rem;
        }

    .offers-table .benefits .fa {
        font-size: 0.8rem;
        margin-right: 0.1rem;
        line-height: 1rem;
    }

.offers-table .offers-column span {
    font-size: 0.75rem;
}

.offers-table .dotted-bottom {
    border-bottom: 1px dashed rgb(var(--border-gray));
    padding-bottom: 0.5rem;
    margin-bottom: 0.5rem;
}

.offers-table span.uppercase {
    text-transform: uppercase;
    font-weight: 600;
}

.offers-table .offers-column p.price,
.offers-table .offers-column p.price span {
    font-size: 1rem;
    line-height: 1rem;
}

    .offers-table .offers-column p.price span {
        padding-right: 0;
    }

        .offers-table .offers-column p.price span:last-of-type {
            padding-left: 0.2rem;
            font-size: 0.75rem;
        }

    .offers-table .offers-column p.price.initial {
        color: rgba(var(--medium-gray), 0.8);
        text-decoration: line-through;
    }

    .offers-table .offers-column p.price.discounted {
        color: rgb(var(--primary-green));
    }

        .offers-table .offers-column p.price.discounted span:first-of-type {
            font-weight: 700;
        }

.offers-table .offers-column p.primary-color {
    color: rgb(var(--primary-green));
}

.offers-table .tooltip-info.primary-color {
    color: rgb(var(--primary-green));
    border-bottom: 1px dotted rgb(var(--primary-green));
    font-weight: 600;
}

.offers-table button.primary-color {
    border-radius: 0.25rem;
    background-color: rgb(var(--main-green));
    color: rgb(var(--white-color));
    font-weight: 700;
    text-align: center;
    padding: 0.2rem 0.5rem;
    border: 1px solid rgb(var(--main-green));
    margin-top: 0.5rem;
}

    .offers-table button.primary-color:hover,
    .offers-table button.primary-color:active,
    .offers-table button.primary-color:focus,
    .offers-table button.primary-color:focus-visible {
        background-color: rgb(var(--main-green-hover));
        border: 1px solid rgb(var(--main-green-hover));
    }

    .offers-table button.primary-color span {
        font-size: 0.9rem;
        text-transform: uppercase;
    }

.testimonials-container {
    background-color: rgb(var(--light-gray));
    padding: 2rem 0 1rem 0;
    margin: 3rem 0 2rem 0;
}

    .testimonials-container .subtitle {
        font-size: 1.1rem;
        color: rgb(var(--main-green));
        display: block;
        text-align: center;
        margin-bottom: 1.5rem;
    }

.testimonials {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    column-gap: 2rem;
}

    .testimonials .item {
        margin-bottom: 2rem;
        box-shadow: 0 2px 7px rgba(var(--black-color),.3);
        padding: 1rem 2rem;
        background-color: rgb(var(--white-color));
    }

.client-feedback {
    position: relative;
    margin-bottom: 2rem;
    background-color: rgba(var(--main-green), .15);
    border-radius: 0.25rem;
}

    .client-feedback .form-group {
        display: flex;
        flex-direction: row;
        align-items: center;
    }

        .client-feedback .form-group .title {
            padding-right: 2rem;
            width: auto;
        }

    .client-feedback .column {
        padding: 2rem;
        width: auto;
        flex-grow: 1;
    }

        .client-feedback .column:last-of-type {
            width: 70%;
            margin: 0.75rem;
            background-color: rgb(var(--white-color));
        }

    .client-feedback .rate {
        height: 2rem;
        position: relative;
        display: block;
        width: fit-content;
        margin-left: 0;
        margin-right: auto;
    }

        .client-feedback .rate:not(:checked) > input {
            position: absolute;
            top: -100%;
            opacity: 0;
        }

        .client-feedback .rate:not(:checked) > label {
            float: right;
            width: 1em;
            overflow: hidden;
            white-space: nowrap;
            cursor: pointer;
            font-size: 30px;
            color: #ccc;
        }

            .client-feedback .rate:not(:checked) > label:before {
                content: '★ ';
            }

        .client-feedback .rate > input:checked ~ label {
            color: #ffc700;
        }

        .client-feedback .rate:not(:checked) > label:hover,
        .client-feedback .rate:not(:checked) > label:hover ~ label {
            color: #f9cf1b;
        }

        .client-feedback .rate > input:checked + label:hover,
        .client-feedback .rate > input:checked + label:hover ~ label,
        .client-feedback .rate > input:checked ~ label:hover,
        .client-feedback .rate > input:checked ~ label:hover ~ label,
        .client-feedback .rate > label:hover ~ input:checked ~ label {
            color: #f9cf1b;
        }

    .client-feedback button {
        margin: auto;
        background-color: rgb(var(--main-green));
        color: rgb(var(--white-color));
        border-radius: 0.3rem;
        display: block;
        margin-top: 1rem;
        padding: 0.3rem 1.5rem;
    }

        .client-feedback button:hover,
        .client-feedback button:focus,
        .client-feedback button:active,
        .client-feedback button:focus-visible {
            background-color: rgb(var(--main-green-hover));
            color: rgb(var(--white-color));
        }

    .client-feedback h4 {
        margin: auto;
        max-width: 10rem;
        text-align: center;
    }
/* hotel details end  */

/* booking start */
.booking-title {
    border-bottom: 1px solid rgb(var(--border-gray));
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
}

    .booking-title .subtitle {
        font-size: 1.3rem;
        color: rgb(var(--medium-gray));
    }

    .booking-title button,
    .booking-summary .main-summary button {
        background-color: transparent;
        border: none;
        color: rgb(var(--url-blue));
        outline: none;
        padding: 0;
    }

        .booking-title button:hover,
        .booking-title button:focus,
        .booking-title button:active,
        .booking-title button:focus-visible,
        .booking-summary .main-summary buton:hover,
        .booking-summary .main-summary button:focus,
        .booking-summary .main-summary button:focus-visible,
        .booking-summary .main-summary button:active {
            color: rgb(var(--url-hover)) !important;
            background-color: transparent !important;
        }

    .booking-title .hotel-details-title .stars {
        margin: 0 0.5rem 0 0.3rem;
    }

.modal-title {
    font-size: 1.5rem;
    font-weight: 600;
}

.flight-info-details {
    display: table;
    width: 100%;
    border: 1px solid rgb(var(--border-gray));
}

    .flight-info-details .column {
        display: table-cell;
        width: 50%;
        height: 100%;
    }

        .flight-info-details .column:last-of-type {
            border-left: 1px solid rgb(var(--border-gray));
        }

    .flight-info-details .header-info {
        background-color: rgba(var(--light-gray), 1);
        padding: 0.2rem 0.7rem;
    }

        .flight-info-details .header-info .gray-text {
            color: rgb(var(--medium-gray));
        }

        .flight-info-details .header-info .fa.departure {
            transform: rotate(45deg);
            margin-right: 0.25rem;
        }

        .flight-info-details .header-info .fa.return {
            transform: rotate(-135deg);
            margin-right: 0.25rem;
        }

        .flight-info-details .header-info .uppercase {
            text-transform: uppercase;
            font-size: 0.9rem;
            font-weight: 700;
        }

    .flight-info-details .row-info .primary {
        font-size: 1.1rem;
        color: rgb(var(--primary-color));
        font-weight: 700;
    }

    .flight-info-details .row-info p {
        margin-bottom: 0;
    }

    .flight-info-details .row-info span {
        font-size: 0.9rem;
    }

    .flight-info-details .body-info {
        padding: 0.5rem 0;
    }

        .flight-info-details .body-info td {
            padding: 0.25rem;
        }

        .flight-info-details .body-info .small-label {
            font-size: 0.8rem;
            line-height: 0.8rem;
        }

        .flight-info-details .body-info .primary {
            color: rgb(var(--primary-color));
            text-transform: uppercase;
            font-size: 0.9rem;
            font-weight: 600;
        }

        .flight-info-details .body-info .mb-1 {
            margin-bottom: 1rem;
        }

        .flight-info-details .body-info .mb-small {
            margin-bottom: 0.25rem;
            font-size: 0.75rem;
        }

        .flight-info-details .body-info .secondary {
            color: rgb(var(--medium-gray));
            text-transform: uppercase;
        }

        .flight-info-details .body-info .small-label .bold {
            font-weight: 600;
        }

        .flight-info-details .body-info .uppercase {
            text-transform: uppercase;
        }

    .flight-info-details .primary-small,
    .flight-info-details .secondary-small {
        line-height: 1rem;
    }

        .flight-info-details .primary-small span {
            color: rgb(var(--primary-color));
            font-weight: 600;
            font-size: 0.8rem;
            line-height: 0.9rem;
        }

        .flight-info-details .secondary-small span {
            font-size: 0.8rem;
            line-height: 0.9rem;
        }

.booking-section {
    margin-bottom: 1rem;
}

    .booking-section .form-title,
    .section-title {
        font-size: 1.5rem;
        line-height: 2rem;
        font-weight: 500;
        margin-bottom: 0.5rem;
    }

    .booking-section .form {
        border: 1px solid rgb(var(--border-gray));
        padding: 1rem 0.5rem 0.5rem 0.5rem;
        box-shadow: 0 2px 5px rgba(var(--black-color), .1);
    }

        .booking-section .form.gray {
            background-color: rgb(var(--light-gray-bkg));
            border: none;
        }

        .booking-section .form.info {
            padding: 0.5rem;
        }

        .booking-section .form .row {
            margin: 0 0 0.5rem 0;
        }

        .booking-section .form .form-group,
        .booking-section .form .col {
            padding: 0 5px;
        }

            .booking-section .form .form-group input,
            .booking-section .form .form-group select {
                width: 100%;
                border: 1px solid rgb(var(--border-gray));
                height: 1.8rem;
                font-size: 0.9rem;
            }

        .booking-section .form sup {
            font-size: 1.2rem;
            top: 0;
        }

        .booking-section .form label {
            font-size: 0.9rem;
            font-weight: 500;
            margin-bottom: 0.3rem;
            color: rgb(var(--dark-gray));
        }

            .booking-section .form label.extra-bold {
                font-weight: 700;
            }

    .booking-section .room-container {
        border: 1px solid rgb(var(--border-gray));
        border-radius: 0.25rem;
        background-color: rgb(var(--white-color));
    }

        .booking-section .room-container .room-header {
            display: flex;
            align-items: center;
            justify-content: space-between;
            border-bottom: 1px solid rgb(var(--border-gray));
            padding: 0.5rem;
            background-color: rgb(var(--light-gray));
            border-top-left-radius: 0.25rem;
            border-top-right-radius: 0.25rem;
        }

.room-container .room-header .title {
    font-size: 1.2rem;
    font-weight: 500;
}

.booking-section .form .room-container .row {
    margin: 0.5rem 5px 0.75rem 5px;
}

.booking-section .no-radius {
    border-radius: 0;
    border: 1px solid rgb(var(--border-gray));
    box-shadow: 0 2px 5px rgba(var(--black-color), .1);
}

.booking-section .info-row {
    margin-bottom: 0.5rem;
}

    .booking-section .info-row:last-of-type {
        margin-bottom: 0;
    }

    .booking-section .info-row span.green-bold {
        font-weight: 700;
        color: rgb(var(--main-green));
    }

.booking-section .form-check-label span {
    font-size: 1rem;
    font-weight: 500;
}

.booking-section .form-check.white {
    border-radius: 0.25rem;
    background-color: rgb(var(--white-color));
    padding: 0.5rem;
    margin: 0.25rem 0 0.5rem 0;
}

    .booking-section .form-check.white:last-of-type {
        margin-bottom: 0;
    }

    .booking-section .form-check.white input {
        margin-left: 0.5rem;
        margin-top: 0.5rem;
    }

    .booking-section .form-check.white label {
        margin-left: 0.5rem;
    }

.booking-section .form-check .medium-title {
    font-size: 1.2rem;
    line-height: 2rem;
}

.booking-section .form-check .note {
    font-weight: 400;
}

.booking-section .form-check.white:has(:checked) {
    border: 1px solid rgb(var(--url-blue));
}

.booking-section .note-title {
    margin-bottom: 0.5rem;
}

.booking-section .small-note {
    font-size: 85%;
}

.booking-section span.bold {
    font-weight: 600;
}

.booking-section span.red {
    color: red;
}

.booking-section .pt-4 {
    padding-top: 4rem;
}

.booking-section .form-check.small-text a,
.booking-section .form-check.small-text span {
    font-size: 0.9rem;
}

.booking-section .form-check.small-text a {
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 600;
}

.booking-section.mt-1 {
    margin-top: 1.25rem !important;
}

button.primary-button {
    margin: auto;
    border: 1px solid rgb(var(--main-green));
    background-color: rgb(var(--main-green));
    color: rgb(var(--white-color));
    border-radius: 0.3rem;
    display: block;
    margin: 1rem auto;
    padding: 0.3rem 1.5rem;
}

    button.primary-button:hover,
    button.primary-button:focus,
    button.primary-button:active,
    button.primary-button:focus-visible {
        background-color: rgb(var(--main-green-hover));
        color: rgb(var(--white-color));
    }

.booking-summary {
    border: 2px solid rgb(var(--border-gray));
    padding: 0.5rem;
    margin-bottom: 1rem;
}

    .booking-summary .main-summary {
        text-align: center;
        position: sticky;
        top: 7.1rem;
        background-color: rgb(var(--white-color));
        padding: 0.5rem;
        margin: 0 -0.5rem;
        border: 3px solid transparent;
        z-index: 1;
    }

        .booking-summary .main-summary.sticky-element {
            border: 3px solid rgb(var(--primary-color));
            box-shadow: 0 2px 10px rgba(var(--border-gray), 1);
            margin: 0 calc(-0.5rem - 3px);
        }

    .booking-summary .uppercase-bold {
        text-transform: uppercase;
        font-weight: 700;
        line-height: 1rem;
    }

    .booking-summary .main-summary button {
        font-size: 0.9rem;
    }

    .booking-summary .red-subtitle {
        color: red;
        font-weight: 700;
        font-size: 1rem;
        margin-top: 0.5rem;
        border-bottom: 1px dotted red;
        padding-bottom: 0.75rem;
        margin-bottom: 0.3rem;
    }

    .booking-summary .main-summary .price span {
        color: rgb(var(--primary-green));
    }

        .booking-summary .main-summary .price span:first-of-type {
            font-size: 2rem;
            font-weight: 700;
        }

        .booking-summary .main-summary .price span:last-of-type {
            font-size: 1.3rem;
        }

    .booking-summary .red-box {
        color: rgb(var(--white-color));
        font-weight: 500;
        font-size: 1.2rem;
        margin: 0.5rem -0.5rem;
        padding: 0.25rem 0.5rem;
        background-color: rgb(var(--primary-color));
    }

    .booking-summary img {
        width: 100%;
        height: auto;
    }

    .booking-summary .gray-box {
        margin: 0.5rem -0.5rem;
        padding: 0.5rem;
        background-color: rgb(var(--light-gray-bkg));
    }

        .booking-summary .gray-box .stars {
            margin: 0;
        }

            .booking-summary .gray-box .stars .fa {
                font-size: 1rem;
            }

        .booking-summary .gray-box .red-subtitle {
            padding-bottom: 0;
            border: none;
            margin: 0;
        }

    .booking-summary .bold-note span {
        font-size: 85%;
        font-weight: 700;
    }

    .booking-summary .info-row {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
    }

        .booking-summary .info-row span {
            font-size: 90%;
            padding-right: 0.25rem;
        }

            .booking-summary .info-row span.bold {
                font-weight: 700;
            }

        .booking-summary .info-row p {
            display: inline-block;
            margin-bottom: 0;
        }

            .booking-summary .info-row p .green {
                color: rgb(var(--primary-green));
                border-bottom: 1px dotted;
                font-size: 0.85rem;
            }

        .booking-summary .info-row .low-op {
            opacity: 0.5;
        }

        .booking-summary .info-row.mb-1 {
            margin-bottom: 1rem;
        }

        .booking-summary .info-row.mt-1 {
            margin-top: 0.75rem !important;
        }

        .booking-summary .info-row.mt-025 {
            margin-top: 0.25rem !important;
        }

    .booking-summary .dashed-line {
        border-bottom: 1px dashed rgb(var(--primary-color));
        padding: 0.25rem 0;
    }

    .booking-summary .info-row .fa-plane {
        transform: rotate(45deg);
        margin-right: 0.25rem;
    }

        .booking-summary .info-row .fa-plane.return {
            transform: rotate(-135deg);
        }

    .booking-summary .info-row .fa {
        align-self: center;
    }

    .booking-summary .info-row .dotted-red {
        border-bottom: 1px dotted;
        color: rgb(var(--primary-color));
        line-height: 0.85rem;
    }
/* booking end */


/* booking confirmation  */
.content.confirmation {
    max-width: 800px;
    margin: auto;
    display: block;
    position: relative;
}

    .content.confirmation .container {
        border: 1px solid rgba(var(--primary-color), 0.1);
        margin-top: 2rem;
        margin-bottom: 2rem;
        padding: 0;
    }

    .content.confirmation .confirmation-title {
        font-size: 2.2rem;
        display: block;
        position: relative;
        line-height: 3rem;
        text-align: center;
        font-weight: 500;
        padding: 0.75rem 1rem;
        background-color: rgba(var(--primary-color), 0.1);
    }

    .content.confirmation .subtitle {
        text-align: left;
        padding-top: 1rem;
        padding: 0.5rem 1rem;
    }

    .content.confirmation h4 {
        margin-bottom: 0;
        margin-top: 0.5rem;
    }

    .content.confirmation .table-container {
        margin: 1rem;
        border: 1px solid rgb(var(--border-gray));
    }

        .content.confirmation .table-container .header-info {
            background-color: rgba(var(--border-gray), 0.3);
            padding: 0.5rem 1rem;
        }

    .content.confirmation p {
        margin-bottom: 0;
    }

    .content.confirmation h5 {
        margin-bottom: 0;
    }

    .content.confirmation table td {
        padding: 0.25rem 0.5rem;
        border-bottom: 1px dashed rgba(var(--border-gray), 0.8) !important;
    }

    .content.confirmation table tr td:first-of-type {
        font-weight: bold;
        padding-left: 1rem;
    }

    .content.confirmation table tr td:last-of-type {
        padding-right: 1rem;
    }

    .content.confirmation .price {
        padding: 1rem;
        text-align: right;
        font-size: 1.8rem;
    }

        .content.confirmation .price span.colored {
            color: rgb(var(--primary-color));
        }

        .content.confirmation .price span:last-of-type {
            font-size: 1.1rem;
        }

        .content.confirmation .price span:nth-of-type(2) {
            font-weight: bold;
        }

    .content.confirmation table p.bold,
    .content.confirmation table span.bold {
        font-weight: 700;
    }

    .content.confirmation table p.bold {
        margin-top: 1rem;
    }

    .content.confirmation button {
        margin-bottom: 2rem;
    }
/* booking confirmation end  */

/* contact start */
.contact-page .address-map {
    margin-bottom: 2rem;
}

.contact-page h1 {
    text-align: center;
}

.contact-page .delimiter {
    width: 3rem;
    height: 2px;
    background-color: rgb(var(--primary-color));
    display: block;
    position: relative;
    margin: 0.75rem auto;
}

.contact-page .subtitle {
    color: rgb(var(--medium-gray));
    margin-bottom: 2rem;
    text-align: center;
    display: block;
}

.contact-page h4 {
    text-align: left;
    font-weight: 500;
}

.contact-page .info-row {
    margin-bottom: 1.5rem;
}

    .contact-page .info-row .title {
        color: rgb(var(--primary-green));
        font-weight: 500;
        font-size: 1.1rem;
    }

    .contact-page .info-row .info {
        font-size: 95%;
        color: rgb(var(--dark-gray));
    }

    .contact-page .info-row a {
        color: rgb(var(--dark-gray));
        text-decoration: none;
    }

        .contact-page .info-row a:hover,
        .contact-page .info-row a:focus,
        .contact-page .info-row a:focus-visible,
        .contact-page .info-row a:active {
            color: rgb(var(--url-hover));
            text-decoration: none;
        }

.contact-page .contact-data {
    margin-bottom: 2rem;
}

.contact-page .form-group {
    margin-bottom: 0.75rem;
}

.contact-page form .row {
    margin: 0 0 0.75rem 0;
}

    .contact-page form .row .col-md-6:first-of-type {
        padding: 0 0.35rem 0 0;
    }

    .contact-page form .row .col-md-6:last-of-type {
        padding: 0 0 0 0.35rem;
    }

.contact-page form label {
    color: rgb(var(--dark-gray));
    font-size: 90%;
    font-weight: 500;
}

.contact-page button {
    display: block;
    margin: auto;
}
/* contact end */


/*  blog list  */
.blog-list-page {
    margin-top: 2rem;
    margin-bottom: 2rem;
}

.blog-tile {
    color: rgb(var(--black-color));
    text-decoration: none;
    margin-bottom: 2rem;
    display: block;
    position: relative;
}

    .blog-tile .image {
        width: 100%;
        height: 16rem;
        margin-bottom: 0.5rem;
        overflow: hidden;
        border-radius: 0.25rem;
        position: relative;
    }

        .blog-tile .image .location {
            font-size: 90%;
            background-color: rgba(var(--primary-color), 1);
            color: rgb(var(--white-color));
            padding: 0 0.5rem;
            position: absolute;
            top: 2rem;
            right: 0;
            z-index: 1;
            border-top-left-radius: 0.25rem;
            border-bottom-left-radius: 0.25rem;
            line-height: 1.6rem;
            height: 1.6rem;
            max-width: 10rem;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

    .blog-tile img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: all .2s ease-in-out;
        border-radius: 0.25rem;
        z-index: 0;
    }

    .blog-tile:hover img,
    .blog-tile:focus img,
    .blog-tile:focus-visible img,
    .blog-tile:active img {
        transform: scale(1.2);
    }

    .blog-tile .date {
        font-size: 90%;
        color: rgba(var(--medium-gray));
    }

    .blog-tile .title {
        font-size: 1.1rem;
        font-weight: 600;
        overflow: hidden;
        display: -webkit-box;
        -webkit-line-clamp: 2; /* number of lines to show */
        line-clamp: 2;
        -webkit-box-orient: vertical;
    }

.blog-list-page nav {
    text-align: center;
    margin: 2rem 0 1rem auto;
    width: fit-content;
}
/*  blog list end  */

/* blog article  */
.blog-article {
    margin-top: 1rem;
    margin-bottom: 3rem;
}

    .blog-article .hero-image {
        width: 100%;
        aspect-ratio: 1/0.3;
        margin-bottom: 1rem;
    }

        .blog-article .hero-image img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

    .blog-article .date-container {
        display: flex;
        align-items: center;
        margin-bottom: 1rem;
    }

        .blog-article .date-container .fa {
            color: rgb(var(--main-green));
        }

    .blog-article .date {
        color: rgb(var(--medium-gray));
        margin-left: 0.5rem;
    }

    .blog-article p {
        font-size: 1rem;
        line-height: 1.5rem;
    }

    .blog-article .highlight {
        background-color: rgba(var(--medium-gray), 0.2);
        border-radius: 0.25rem;
        padding: 1rem 2rem;
        font-size: 2rem;
        line-height: 2.6rem;
        font-weight: 600;
        margin: 1.5rem auto;
        display: block;
        position: relative;
        color: rgb(var(--dark-gray));
    }

    .blog-article .tags {
        margin: 1rem 0;
        padding-top: 1rem;
        border-top: 1px solid rgba(var(--medium-gray), 0.3);
        display: flex;
        align-items: center;
        flex-wrap: wrap;
    }

        .blog-article .tags a {
            display: inline-block;
            line-height: 2rem;
            padding: 0 1rem;
            border: 1px solid rgba(var(--primary-green));
            color: rgb(var(--primary-green));
            border-radius: 0.25rem;
            margin-right: 0.5rem;
            text-decoration: none;
        }

            .blog-article .tags a:hover {
                background-color: rgb(var(--primary-green));
                color: rgb(var(--white-color));
            }

        .blog-article .tags span {
            display: inline-block;
            margin-right: 0.5rem;
            text-transform: uppercase;
            font-weight: 600;
            color: rgba(var(--black-color));
            border: none;
        }

.related-articles {
    display: block;
    margin-top: 2rem;
}
/* blog article end  */


/* cookies page  */
.cookies-page {
    margin-top: 2rem;
    margin-bottom: 2rem;
}

    .cookies-page .title {
        font-size: 2.5rem;
        text-align: center;
        display: block;
        margin-bottom: 2rem;
        font-weight: 600;
    }

    .cookies-page .section {
        margin-bottom: 1.5rem;
    }

    .cookies-page p {
        font-size: 0.95rem;
        line-height: 1.5rem;
        margin-bottom: 0.5rem;
    }

    .cookies-page h3 {
        font-weight: 700;
    }

    .cookies-page a {
        color: rgb(var(--url-blue));
        text-decoration: none;
    }

        .cookies-page a:hover {
            color: rgb(var(--url-hover));
        }

/* cookies page end  */

/* about page  */
.about-page .main-info {
    padding: 2.5rem 0 1.5rem 0;
}

.about-page h2 {
    text-align: left;
}

.about-page .main-info .info-section {
    margin-bottom: 1.5rem;
}

.about-page .main-info span.bold {
    font-weight: bold;
}

.about-page .about-image {
    width: 100%;
    height: auto;
}

    .about-page .about-image img {
        width: 100%;
        height: auto;
    }

.about-page .extra-info ul {
    list-style: none;
    padding-left: 1rem;
}

    .about-page .extra-info ul li {
        margin-bottom: 0.5rem;
    }

.about-page .extra-info .fa {
    color: rgb(var(--primary-green));
    margin-right: 0.5rem;
}

.about-page .quote {
    padding: 1.5rem;
    border-radius: 0.5rem;
    background-color: rgb(var(--light-gray-bkg));
    text-align: center;
    font-size: 1.2rem;
    margin: 1rem 0 1.5rem 0;
    font-weight: 500;
}

.team-title {
    text-align: center;
    text-transform: uppercase;
    margin: 2rem 0 1rem 0;
}

.team-carousel {
    margin-bottom: 2rem;
}

.TeamMultiCarousel {
    overflow: hidden;
    padding: 15px;
    width: 100%;
    position: relative;
}

    .TeamMultiCarousel .TeamMultiCarousel-inner {
        transition: 1s ease all;
        float: left;
        display: flex;
        align-items: stretch;
    }

        .TeamMultiCarousel .TeamMultiCarousel-inner .item {
            float: left;
        }

            .TeamMultiCarousel .TeamMultiCarousel-inner .item > .content {
                text-align: center;
                padding: 1rem 1.5rem;
                margin: 0.25rem;
                background: rgba(var(--main-green), 0.1);
                border-radius: 0.5rem;
                height: 100%;
            }

    .TeamMultiCarousel .item .bold {
        font-weight: bold;
    }

    .TeamMultiCarousel .item p {
        margin-bottom: 0.25rem;
    }

    .TeamMultiCarousel .item .user-name {
        font-size: 1.5rem;
        font-weight: 500;
        margin-bottom: 0.75rem;
    }

    .TeamMultiCarousel .item .user-image {
        width: 8rem;
        height: 8rem;
        border-radius: 50%;
        background-color: rgb(var(--white-color));
        display: block;
        position: relative;
        margin: 0 auto 1rem auto;
    }

        .TeamMultiCarousel .item .user-image img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            border-radius: 50%;
        }

        .TeamMultiCarousel .item .user-image .fa {
            font-size: 8rem;
            color: rgba(var(--main-green), 0.2);
        }

    .TeamMultiCarousel .item .role {
        color: rgb(var(--main-green));
        font-size: 1rem;
        margin-bottom: 0.75rem;
    }

    .TeamMultiCarousel a {
        color: rgb(var(--url-blue));
    }

        .TeamMultiCarousel a:hover {
            color: rgb(var(--url-hover));
        }

    .TeamMultiCarousel .leftTeamLst,
    .TeamMultiCarousel .rightTeamLst {
        position: absolute;
        border-radius: 50%;
        top: calc(50% - 20px);
        width: 40px;
        height: 40px;
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: rgb(var(--primary-color));
        border-color: transparent;
        !important;
    }

        .TeamMultiCarousel .leftTeamLst:hover,
        .TeamMultiCarousel .rightTeamLst:hover,
        .TeamMultiCarousel .leftTeamLst:focus,
        .TeamMultiCarousel .rightTeamLst:focus,
        .TeamMultiCarousel .leftTeamLst:focus-visible,
        .TeamMultiCarousel .rightTeamLst:focus-visible,
        .TeamMultiCarousel .leftTeamLst:active,
        .TeamMultiCarousel .rightTeamLst:active {
            border-color: transparent;
            !important;
            background-color: rgba(var(--primary-color), 0.7) !important;
        }

    .TeamMultiCarousel .leftTeamLst {
        left: 0;
    }

    .TeamMultiCarousel .rightTeamLst {
        right: 0;
    }

        .TeamMultiCarousel .leftTeamLst.over,
        .TeamMultiCarousel .rightTeamLst.over {
            pointer-events: none;
            background: rgb(var(--disabled)) !important;
            text-align: center;
        }

.documents-title {
    display: block;
    text-align: center;
    margin-bottom: 1.5rem;
}

.company-documents {
    margin-bottom: 2rem;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

    .company-documents .item {
        display: inline-flex;
        margin-right: 1rem;
    }

        .company-documents .item a {
            text-decoration: none;
            color: rgb(var(--black-color));
        }

    .company-documents .title {
        margin-top: 0.5rem;
        text-align: center;
    }

    .company-documents img {
        height: 15rem;
        width: auto;
    }
/* about page end  */

/* footer */
.footer-container {
    background-color: rgb(var(--primary-color));
    color: rgb(var(--white-color));
    padding: 2rem 0 1rem 0;
}

.footer-heading {
    font-size: 1.1rem;
    font-weight: 700;
}

.footer-container a {
    color: rgb(var(--white-color));
    text-decoration: none;
    font-size: 0.9rem;
}

    .footer-container a:hover,
    .footer-container a:focus,
    .footer-container a:active {
        color: rgba(var(--white-color), .85);
    }

.footer-container .footer-row {
    display: flex;
    flex-direction: row;
    margin-bottom: 1rem;
    font-size: 0.9rem;
}

.footer-container .icon-container {
    background-color: rgba(var(--white-color), .25);
    width: 30px;
    height: 30px;
    line-height: 28px;
    border-radius: 50%;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 0.5rem;
}

    .footer-container .icon-container img {
        width: 30px;
        height: 15px;
        object-fit: contain;
    }

.footer-container .subtitle {
    font-size: 0.8rem;
    margin-top: 0.8rem;
    margin-bottom: 0.3rem;
}

.footer-container .input-group .form-control {
    border-top-left-radius: 0.25rem;
    border-bottom-left-radius: 0.25rem;
    border: 1px solid var(--white-color);
}

    .footer-container .input-group .form-control:focus {
        border: 1px solid rgb(var(--main-green));
        box-shadow: none;
    }

.footer-container .input-group .btn {
    border-top-right-radius: 0.25rem;
    border-bottom-right-radius: 0.25rem;
}

.footer-container .form-check {
    margin-top: 0.5rem;
}

.footer-container .form-check-label {
    font-size: 0.8rem;
    line-height: 1.2rem;
}

.footer-gdpr {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: rgba(255, 255, 255, .1);
    width: 100%;
}

    .footer-gdpr a {
        font-size: 0.8rem;
        padding: 0 0.25rem;
    }

.footer-payments {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0.5rem 0;
}

    .footer-payments img {
        height: 2.5rem;
        margin: 0 0.1rem;
    }

/* footer end */

@media(max-width: 767px) {
    .container {
        max-width: 100% !important;
    }

    .navbar-brand {
        margin-left: 1rem;
        margin-right: 0;
    }

    .navbar-toggler {
        margin-right: 1rem;
    }

    #navbarMenu {
        padding: 0 1rem;
    }

    .content p {
        font-size: 1.1rem;
        line-height: 1.8rem;
    }

    .about-page ul li span {
        font-size: 1.1rem;
        line-height: 1.8rem;
    }

    .header-actions.mobile {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        margin-top: 1rem;
        padding: 1rem 0;
        border-top: 1px solid rgba(var(--white-color), .7);
    }

    .header-actions.desktop {
        display: none;
    }

    .bold-nav {
        padding: 0;
    }

    .header-actions.mobile a {
        color: rgb(var(--white-color));
        margin-bottom: 0.25rem;
    }

    .header-actions.mobile a,
    .header-actions.mobile select {
        margin-left: 0;
    }

    .header-actions.mobile select {
        margin-top: 0.5rem;
    }

    .header-actions.mobile a::before {
        display: none;
    }

    .advanced-search {
        margin-top: 1.5rem !important;
        margin-bottom: 1.5rem !important;
        margin-left: 0.5rem !important;
        margin-right: 0.5rem !important;
    }

        .advanced-search .col-xs-12 {
            margin-bottom: 0.5rem;
        }

            .advanced-search .col-xs-12:last-of-type {
                margin-bottom: 0;
            }

    #homeBanner1 .swiper-wrapper .swiper-slide a img {
        width: 100%;
        height: 15rem;
        object-fit: cover;
    }

    #homeBanner2 .swiper-wrapper .swiper-slide a img {
        width: 100%;
        height: 15rem;
        object-fit: cover;
    }

    .promo-image img {
        width: 100%;
        height: 15rem;
        object-fit: cover;
    }

    .offers {
        padding: 1rem 0;
    }

        .offers p {
            font-size: 1.3rem;
            line-height: 1.7rem;
        }

    .category {
        margin-bottom: 1rem;
    }

    .hotel-container .hotel-info {
        flex-direction: column;
        align-items: center;
    }

    .hotel-info-column {
        justify-content: center;
    }

        .hotel-info-column .hotel-row,
        .hotel-info-column .hotel-address {
            justify-content: center;
            display: flex;
        }

        .hotel-info-column .hotel-address {
            margin-bottom: 0.5rem;
        }

        .hotel-info-column .detail {
            text-align: center;
        }

    .hotel-info .package-details {
        align-items: center;
        justify-content: center;
        margin-top: 0.5rem;
    }

    .hotel-info-column .benefits {
        justify-content: center;
    }

    .hotel-list-sidebar,
    .hotel-details-sidebar {
        animation: linear;
        animation-duration: 0.5s;
        position: absolute;
        display: none;
        z-index: 3;
        background-color: rgb(var(--white-color));
    }

        .hotel-list-sidebar.show,
        .hotel-details-sidebar.show {
            animation-name: slide;
            -webkit-animation-name: slide;
            display: inline-block;
        }

        .hotel-list-sidebar.hide,
        .hotel-details-sidebar.hide {
            animation-name: slide-back;
            -webkit-animation-name: slide-back;
            animation-fill-mode: forwards;
        }

    .collapse-info {
        text-align: center;
    }

    .show-filters,
    .hide-filters {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        width: 100%;
        color: rgb(var(--dark-gray));
        border: 1px solid rgb(var(--dark-gray));
        border-radius: 0.25rem;
        margin-bottom: 0.5rem;
        min-height: 2.4rem;
        background-color: transparent;
    }

        .show-filters span,
        .hide-filters span {
            margin-left: 0.3rem;
        }

    #carouselHotel {
        margin-bottom: 1rem;
    }

    .offers-table .offers-table-body .offers-row {
        display: flex;
        flex-direction: column;
        border: 1px solid rgb(var(--border-gray));
        border-radius: 0.25rem;
        margin-bottom: 1rem;
        padding: 0;
    }

    .offers-table .offers-table-body .offers-column {
        padding: 0 0.5rem 0.5rem 0.5rem;
    }

        .offers-table .offers-table-body .offers-column:first-of-type,
        .offers-table .offers-table-body .offers-column:nth-of-type(2),
        .offers-table .offers-table-body .offers-column:nth-of-type(3),
        .offers-table .offers-table-body .offers-column:nth-of-type(4),
        .offers-table .offers-table-body .offers-column:nth-of-type(5),
        .offers-table .offers-table-body .offers-column:nth-of-type(6) {
            display: block;
            width: 100%;
        }

    .offers-table p,
    .offers-table .offers-column span,
    .offers-table span {
        font-size: 1rem;
        line-height: 1.2rem;
    }

    .hotel-details-page .change-search-form {
        margin-top: 0;
    }

    .offers-table .offers-column .info-title {
        background-color: rgba(var(--primary-color), 0.1);
        margin-left: -0.5rem;
        margin-right: -0.5rem;
        padding: 0.1rem 0.5rem 0.2rem 0.5rem;
    }

    .offers-table button.primary-color {
        width: 100%;
    }

    .hotel-extra .tab-content {
        font-size: 1.1rem;
        line-height: 1.6rem;
    }

    .hotel-extra .info-message p {
        font-size: 0.9rem;
        line-height: 1.3rem;
    }

    .client-feedback .form-group {
        flex-direction: column;
    }

    .client-feedback .column:last-of-type {
        width: 90%;
        margin: 0 0 1rem 0;
    }

    .client-feedback .column {
        padding: 1rem;
    }

    .client-feedback h4 {
        max-width: 100%;
    }

    .flight-info-details {
        display: block;
        table-layout: auto;
    }

        .flight-info-details .column {
            display: block;
            width: 100%;
            height: auto;
        }

            .flight-info-details .column:last-of-type {
                border-left: none;
            }

    .booking-page {
        flex-direction: column-reverse;
    }

    .booking-summary .main-summary {
        top: 4.1rem;
    }

    .hide-on-collapse {
        animation: show 0.3s;
        transition: transform 0.3s ease-out;
        overflow: hidden;
        animation-fill-mode: forwards;
    }

    .hotel-container:has(.collapse.show) .hide-on-collapse {
        animation: hide 0.3s;
        transition: transform 0.3s ease-out;
        animation-fill-mode: forwards;
    }

    .hotel-container:has(.collapse.show) button.hide-on-collapse {
        padding: 0;
        border: none;
        animation-fill-mode: forwards;
    }

    .content.confirmation .container {
        margin-top: 0;
    }

    .content.confirmation .confirmation-title {
        font-size: 2rem;
        line-height: 3rem;
        text-align: left;
    }

    .blog-article .hero-image {
        aspect-ratio: 1/0.7;
    }

    .blog-article p {
        font-size: 1.2rem;
        line-height: 1.8rem;
    }

    .footer-gdpr {
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    .footer-payments {
        align-items: center;
        justify-content: center;
        flex-wrap: wrap;
    }

        .footer-payments img {
            margin-top: 0.5rem;
        }
}

@media(min-width: 768px) and (max-width: 1023px) {
    .advanced-search .col-md-12 {
        margin-bottom: 1rem;
    }

    .header-actions.mobile {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        margin-top: 1rem;
        padding: 1rem 0;
        border-top: 1px solid rgba(var(--white-color), .7);
    }

    .header-actions.desktop {
        display: none;
    }

    .bold-nav {
        padding: 0;
    }

    .header-actions.mobile a {
        color: rgb(var(--white-color));
        margin-bottom: 0.25rem;
    }

    .header-actions.mobile a,
    .header-actions.mobile select {
        margin-left: 0;
    }

    .header-actions.mobile select {
        margin-top: 0.5rem;
    }

    .header-actions.mobile a::before {
        display: none;
    }

    .booking-summary .main-summary {
        top: 4.1rem;
    }
}

@media(min-width: 768px) and (max-width: 1024px) {
    .advanced-search button.search {
        padding: 0 0.5rem;
        line-height: 1.25rem;
    }

    .advanced-search {
        margin-top: -4.8rem !important;
    }
}

@media(max-width: 1023px) {
    .rooms-options-container .room-row {
        display: block;
    }

        .rooms-options-container .room-row.head {
            display: none;
        }

        .rooms-options-container .room-row .column {
            width: 100%;
            display: block;
        }

            .rooms-options-container .room-row .column.transport {
                width: 100%;
            }

            .rooms-options-container .room-row .column.price {
                width: 50%;
                text-align: left;
                display: inline-block;
            }

            .rooms-options-container .room-row .column:last-of-type {
                display: inline-block;
                width: 45%;
            }

        .rooms-options-container .room-row .primary-button {
            margin: 1rem 0 1rem auto;
        }
}

@media(max-width: 1024px) {
    .navbar.sticky-top {
        box-shadow: 0 2px 10px rgba(var(--black-color),.1);
    }

    .navbar-brand img {
        height: 2.5rem;
    }

    .navbar-collapse .container {
        flex-direction: column;
    }

    .advanced-search {
        padding: 1rem 0.5rem;
    }

    .hotel-container .col-xs-12:last-of-type {
        padding-left: 0.5rem !important;
        margin-top: 1rem;
    }

    .hotel-container .hotel-thumbnail {
        height: 10rem;
    }

    .testimonials {
        grid-auto-flow: row;
        grid-template-columns: auto;
    }

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

@media(min-width: 1024px) and (max-width: 1200px) {
    .navbar-collapse ul li a {
        font-size: 0.8rem;
        padding-left: 0.45rem !important;
        padding-right: 0.45rem !important;
    }

    .bold-nav {
        font-size: 0.8rem;
    }

    .navbar-collapse .container {
        flex-direction: row;
    }

    .modal-dialog {
        max-width: 900px !important;
    }
}

@media(min-width: 769px) and (max-width: 1199px) {
    .container {
        max-width: 760px !important;
    }
}

@media(min-width: 1200px) and (max-width: 1400px) {
    .container {
        max-width: 1180px !important;
    }

    .modal-dialog {
        max-width: 900px !important;
    }
}

@media(min-width: 1300px) {

    .advanced-search {
        margin-top: -2.5rem !important;
    }

    .modal-dialog {
        max-width: 900px !important;
    }
}



.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default,
.ui-button,
html .ui-button.ui-state-disabled:hover,
html .ui-button.ui-state-disabled:active {
  color: #454545 !important;
}

.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active,
a.ui-button:active,
.ui-button:active,
.ui-button.ui-state-active:hover {
  background: none !important;
  border: none !important;
}

.ui-state-active.ui-datepicker-current-day,
.ui-state-default.ui-state-active {
  background: #007fff !important;
  color: #fff !important;
}

.ui-datepickerNew-trigger {
    display: none;
}

.validation-message {
    color: red;
}


.ui-autocomplete {
    border: 1px solid #c5c5c5;
    height: auto;
    max-height: 300px;
    overflow-x: hidden;
    overflow-y: scroll;
    width: auto;
}


.ui-menu-item-wrapper {
    padding: 4px 12px;
    color: black;
    background-color: white;
    color: black;
}

.ui-state-active {
    background-color: grey !important;
    color: black !important;
}





#homeBanner1 {
    width: 100%;
    height: auto;
    max-width: 1920px;
    position: relative;
    margin: 0 auto;
}

#homeBanner1 .swiper-wrapper,
.homeBanner1 .swiper-wrapper .swiper-slide {
    width: 100%;
    height: auto;
}

#homeBanner1 .swiper-wrapper .swiper-slide img {
    width: 100%;
    height: auto;
    margin: 0 auto;
}


#homeBanner2 {
    width: 100%;
    height: auto;
    max-width: 1920px;
    position: relative;
    margin: 0 auto;
}

    #homeBanner2 .swiper-wrapper,
    .homeBanner2 .swiper-wrapper .swiper-slide {
        width: 100%;
        height: auto;
    }

        #homeBanner2 .swiper-wrapper .swiper-slide img {
            width: 100%;
            height: auto;
            margin: 0 auto;
        }



#details-tab-pane h1 {
    font-size: 1rem;
}

#details-tab-pane h2 {
    font-size: .9rem;
    text-align: left;
}

#details-tab-pane h3 {
    font-size: .9rem;
    font-weight:normal;
}

.info h2 {
    font-size: 1rem;
    text-align: left;
}

.info h3 {
    font-size: .9rem;
    font-weight: normal;
}

.is-invalid {
    border-color: #000;
}

.invalid-feedback {
    color: #000;
}

.is-invalid-red {
    border-color: red;
}

.invalid-feedback-red {
    color: red;
}