/*
 * Responsive Stylesheet
 * Chapter 00 - supplimentary style
 * Chapter 01 - login style
 * Chapter 02 - search style
 * Chapter 03 - flight search result / listing style
 * Chapter 04 - footer style
 * Chapter 05 - font style
 * Chapter 06 - offcanvas style
 * Chapter 07 - cart style
 * Chapter 08 - passenger detail style
 * Chapter 09 - alternate fare rule style
 * Chapter 10 - common page style 
 * Chapter 02A - hotel search style
 * Chapter 11 - tab structure style
 * Chapter 12 - hotel search result / listing style
 * Chapter 13 - hotel detail page style
 * Chapter 14 - rate matrix / calendar search style
 * Chapter 15 - Star ratings filter style
 * Chapter 16 - Hotel info inside map
 * Chapter 17 - owl carousel image slider style
 * Chapter 18 - airline matrix style
 * Chapter 19 - Transfer style
 * Chapter 20 - date & time picker style
 */
header,
.top-header,
.site-footer,
.login-form,
header.top-header figure,
.site-footer-inner,
.copyright,
.footer-links,
.footer-links li,
.page-wrapper-inner,
.header-left,
.header-right,
.trip-way-check,
.terif-class,
.search-column1,
.advanced-search-container,
.adv-search-inner,
.search-result-section,
.search-head,
.searchfldtl-row,
.search-fl-left,
.search-fl-shdl,
.cart-head {
    /* border: solid 1px blue; */
}

.main-container,
.search-container,
.travel-dtl,
.advanced-search,
.adv-filter-div,
.search-column2,
.checkbox-custom,
.travel-class,
.reset-button,
.lbl-loginname,
.pas-seg-select,
aside,
.search-head-left,
.search-flight-detail,
.search-fl-row,
.search-fl-right,
.search-fl-metadetail,
.search-fl-metadetail,
.return-total,
.book-teriff,
.cart-left {
    /* border: solid 1px red; */
}

.search-content,
.search-check-filter,
.search-column3,
.pas-add-right,
.search-list-right,
.search-head-right,
.search-fl-dtl,
.price-start,
.upgrade-teriff,
.cart-right {
    /* border: solid 1px yellowgreen; */
}

.search-flight-detail-container,
.search-flight-more {
    /* border: solid 1px black; */
}

.search-list-aside {
    /*display: none;*/
}

.search-container {
    /*display: none;*/
}

/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
/* Chapter # 00 - supplimentary style */
/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
html,
body {
    height: 100%;
    overflow-x: hidden;
    /* Prevent scroll on narrow devices */
}

.clear {
    display: block;
    clear: both;
}

:root {
    --labelfont: 11px;
    --checkboxfont: 12px;
    --textboxfont: 13px;
    --buttonfont: 12px;
    --deltafont: 15px;
    --alphafont: 14px;
    --betafont: 12px;
    --gammafont: 11px;
    --xxlfont: 22px;
    --xlfont: 18px;
    --viewportsize: auto;
    --buttonradius: 4px;
    --responsive-margin-padding: 8px;
    --primary-color: #00549b;
    --primary-color-lite: #00337C;
    --secondary-color: #bf4e30;
    --secondary-color-lite: #C85F31;
    --tertiary-color: #ECF2FC;
    --star-color: #DFD04A;
    --grey-color: #707070;
    --red-color: #f00;
    --green-color: #008000;
    --secondary-color-style: #0C88E2;
    --tertiary-color-style: #f5f5f5;
}

@media (min-width: 768px) {
    :root {
        --labelfont: 11px;
        --checkboxfont: 12px;
        --textboxfont: 13px;
        --responsive-margin-padding: 16px;
    }
}

@media (min-width: 1280px) {
    :root {
        --labelfont: 11px;
        --checkboxfont: 12px;
        --textboxfont: 13px;
        --buttonfont: 13px;
        --deltafont: 16px;
        --alphafont: 15px;
        --betafont: 13px;
        --gammafont: 12px;
        --xxlfont: 24px;
        --xlfont: 20px;
        --viewportsize: 1140px;
        --responsive-margin-padding: 24px;
    }
}

@media (min-width: 1440px) {
    :root {
        --labelfont: 12px;
        --checkboxfont: 13px;
        --textboxfont: 14px;
        --buttonfont: 14px;
        --deltafont: 17px;
        --alphafont: 16px;
        --betafont: 14px;
        --gammafont: 13px;
        --xxlfont: 26px;
        --xlfont: 22px;
        --viewportsize: 1280px;
    }
}

@media (min-width: 1680px) {
    :root {
        --labelfont: 13px;
        --checkboxfont: 14px;
        --textboxfont: 15px;
        --viewportsize: 1366px;
    }
}

.main-container,
header.top-header,
.site-footer-inner {
    max-width: var(--viewportsize);
}
label.search-lables,
.search-lables i,
.form-cntrl label,
.fl-class,
.fl-traveller,
.fl-dur-dgt {
    font-size: var(--alphafont);
}

.fl-station {
    font-size: var(--alphafont);
}

.search-lables i {
    color: var(--secondary-color);
}

.search-inputs,
.search-inputs input,
.form-grp input,
.header-btn i,
.form-input {
    font-size: var(--textboxfont);
}

.checkbox-custom label,
.travel-class,
.fl-time {
    font-size: var(--alphafont);
}

.btn,
.btn-link,
.header-btn,
.btn-type3.font-16 {
    font-size: var(--buttonfont);
}

.sidebar-title,
.fl-1-from,
.fl-1-to,
.fl-name i,
.cart-head-fl i,
.cart-fl-time,
.lbl-loginname,
.search-flight-more-bar .fl-more i,
.search-flight-more-bar2 .fl-more i,
.filter-header,
.star-ratings,
.hotel-name,
.show-more-rooms-bar .fl-more i,
.sort-header,
.hotel-info2 i,
.hotel-address2 i,
.description-header {
    font-size: var(--alphafont);
}

.search-head-name,
.search-head-name i,
.search-result-number,
.search-flight-more-bar .fl-more,
.search-flight-more-bar2 .fl-more,
.upgrade-teriff,
.fl-stop-from,
.fl-stop-to,
.halt-time,
.halt-lbl,
.fl-name,
.fl-1,
.hide-more-detail,
.cart-head-fl,
.cart-fl-time .cart-fl-station,
.teriff-p-title,
.alt-rate-title-bg,
.alt-rate-title,
.price-tariff,
.fl-pas-num-head,
.pay-method-head,
.selected-ssr-info-label,
.reservation-dtl,
.price-change-info,
.show-rule,
.rate-head,
.return-total,
.col-header,
.condi-link,
.add-remove-box,
.loading-text,
.hotel-info,
.hotel-address,
.hotel-map-link,
.hotel-fav-heart,
.pagination-div ul li,
.show-more-rooms-bar,
.star-ratings2,
.hotel-name2,
.hotel-name3,
.list-back-link,
.available-dates,
.guest-no-header,
.transfer-info {
    font-size: var(--betafont);
}


.fl-seat,
.list-loading,
.fl-dur-total,
.fl-num,
.fl-date,
.cart-fl-num,
.cart-fl-date,
.cart-fl-more-rates,
ul.list-bullet,
.cart-condition,
.rule-condition,
.rule-terms,
.alt-fl-name,
.alt-fl-detail-row,
.fl-frm,
.fl-via,
.fl-frm-date,
.fare-rule-titles,
.rate-title-row,
.rate-vaule-row,
.table td,
.table th,
.summary-text,
.rate-terms-title,
.rate-terms-sec p,
.btn-reset,
.col-text,
.col-text-4a,
.col-text-4b,
.col-text-see,
.pas-lbl,
.col-accommodation,
.col-occupants,
.col-treatments,
.col-farerules,
.row-supplier-info,
.col-farerules-header,
.hotel-info2,
.hotel-info3,
.hotel-address2,
.hotel-metadetail-right,
.col-promotion-header,
.col-promotion,
.warning-container,
.sw-tab-preno-title {
    font-size: var(--gammafont);
}

.price-start,
.cart-price-start,
.cart-card-offer,
.cart-upgrade-teriff,
.reservation-dtl i,
.search-head-date,
.cart-name,
.cart-total,
.hotel-price {
    font-size: var(--deltafont);
}

.price-start span,
.cart-price-start span,
.cart-total span,
.hotel-price span.rate {
    font-size: var(--xxlfont);
}

.book-teriff,
.common-page-header,
.hotel-info i,
.hotel-address i,
.hotel-fav-heart i,
.col-occupants i.fa-male,
.col-occupants i.fa-female,
.transfer-info i {
    font-size: var(--xlfont);
}

/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
/* Chapter 19 - Transfer style */
/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
.sw-relative {
    position: relative;
}

.sw-search-box {
    /* border: solid 1px red; */
    padding: 24px 16px 16px;
}

.sw-search-wrap,
.sw-add-return {
    background-color: #fff;
    box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.16);
    padding: 12px;
    border-radius: var(--buttonradius);
    margin-bottom: calc(var(--bs-gutter-x) * .5);
}

.sw-search-wrap {
    position: relative;
}

.sw-close-return {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1;
    height: 24px;
    width: 24px;
    top: 2px;
    right: 2px;
    color: var(--primary-color);
    font-size: 16px;
    cursor: pointer;
}

.sw-search-label {
    display: flex;
    align-items: center;
    font-size: var(--labelfont);
    color: var(--primary-color);
    font-weight: 600;
    margin-bottom: 5px;
}

.sw-search-label span {
    margin-left: 5px;
}

.sw-search-field-wrap {
    /* border: solid 1px blue; */
    display: flex;
    flex-direction: row;
    width: 100%;
}

.sw-search-field {
    width: 100%;
    flex: 1;
}

.sw-search-field input {
    color: #000;
    font-weight: 500;
    padding: 0;
    padding-right: 0px;
    background-color: transparent;
    border: 0 none;
    font-size: var(--textboxfont);
    width: 100%;
    /* border: solid 1px red; */
}

.sw-search-loader {
    display: flex;
    justify-content: center;
    align-items: center;
    flex: 0;
}

.sw-city-dropdown {
    z-index: 1;
    position: absolute;
    padding: 24px;
    background-color: #fff;
    border-radius: var(--buttonradius);
    background-color: #fff;
    max-height: 300px;
    overflow: auto;
    box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.16);
}

.sw-city-dropdown {
    top: calc(100% + 8px);
    width: calc(100% - 15px);
}

.sw-passenger-title {
    font-weight: 700;
    color: var(--primary-color);
}

.sw-passenger-title i,
.sw-passenger-title svg {}

.sw-entity-list {
    margin: 6px 0 12px 0;
}

.sw-entity-list ul {
    padding-left: 0px;
    margin: 0 0 0 2px;
}

.sw-entity-list ul li {
    display: flex;
    align-items: center;
    list-style: none;
    border-bottom: solid 1px #DFEFFB;
    font-weight: 500;
    padding: 2px 0 2px 0px;
    font-size: var(--mdfont);
}

.sw-entity-list ul li:hover,
.sw-entity-list ul li:focus,
.sw-filter-list ul li:hover,
.sw-filter-list ul li:focus {
    background-color: var(--tertiary-color);
    cursor: pointer;
}

.sw-entity-list ul li::before {
    font-family: 'Font Awesome 5 Pro';
    font-weight: 300;
    color: var(--secondary-color);
    font-size: 12px;
    margin-right: 6px;
}

.city.sw-entity-list ul li::before {
    content: '\f3c5';
}

.hotel.sw-entity-list ul li::before {
    content: '\f594';
}

.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 10rem;
    padding: .5rem 0;
    margin: .125rem 0 0;
    font-size: 1rem;
    color: #212529;
    text-align: left;
    list-style: none;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0, 0, 0, .15);
    border-radius: .25rem;
}

.list-unstyled {
    padding-left: 0;
}

.sw-add-return {
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: var(--labelfont);
    color: var(--primary-color);
    font-weight: 600;
    min-height: 66.5px;
}

.sw-add-return span {
    margin-left: calc(var(--bs-gutter-x) * .5);
}

.sw-guests-input {
    cursor: pointer;
}

.sw-adv-search {
    margin: 16px 0 0 0;
    padding: 16px 0;
    border-top: 1px solid #64B4ED;
}

.sw-adv-search-box {
    padding: 8px 0 0;
}

.sw-qty-control {
    margin-left: unset;
}

.sw-pill,
.sw-pill2 {
    display: inline-block;
    padding: .25em .6em;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: .25rem;
    color: #fff;
    background-color: var(--star-color);
    border-radius: 10rem;
    text-transform: uppercase;
}

.sw-pill {
    font-size: var(--betafont);
}

.sw-pill2 {
    font-size: var(--gammafont);
}

.sw-service-type,
.sw-service-type2 {
    letter-spacing: unset;
    font-weight: 600;
    text-transform: capitalize;
    color: var(--primary-color);
}

.sw-service-type {
    font-size: var(--betafont);
}

.sw-service-type2 {
    font-size: var(--gammafont);
}

.more-transfer-content-box {
    padding: var(--responsive-margin-padding);
}

.sw-transfer-services-list {
    text-align: center;
}

.sw-transfer-service-icon {
    color: var(--primary-color);
}

.sw-transfer-services-details {
    padding: var(--responsive-margin-padding) 0 0 0;
}

.sw-cart-exp-detail2 {
    display: flex;
    flex-direction: row;
}

.sw-tab-preno-title {
    font-weight: 500;
}

.hotel-name2 {
    text-transform: uppercase;
    letter-spacing: 1.7px;
    font-weight: bold;
    /*border: solid 1px lightgray;*/
}

.hotel-name2 {
    margin-bottom: var(--responsive-margin-padding);
}

.sw-ico-color {
    color: var(--secondary-color);
}

.text-firstcolor {
    color: var(--primary-color);
}

.fw-bold {
    font-weight: 600;
}

.sw-tab-preno-title {
    font-weight: 600;
}

.sw-multiselect-wrapper {
    /*border: solid 2px red;*/
    position: relative;
}

.sw-multiselect {
    /*border: solid 2px blue;*/
    background-color: #e9e9ed;
    height: 52px;
    line-height: 52px;
    padding: 0 1rem;
    border-radius: var(--buttonradius);
    overflow: hidden;
    box-shadow: 0px 1px 10px #00000029;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.sw-multiselect-placeholder {
    /* border: solid 1px red; */
    font-weight: 500;
    flex: 1;
}

.sw-multiselect-arrow {
    /* border: solid 1px red; */
    color: var(--primary-color);
}

.sw-multiselect-option {
    border: solid 1px var(--grey-color);
    border-radius: var(--buttonradius);
    background-color: #fff;
    position: absolute;
    z-index: 1;
    top: 55px;
    width: 100%;
    padding: 1rem;
}

.sw-price-metadata {
    /* border: solid 2px red; */
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
    margin-top: 4px;
}

.sw-on-request-pill {
    color: #fff;
    background: #ffc107;
    padding: 3px 5px;
    text-align: center;
    text-transform: uppercase;
    border-radius: 3px;
    letter-spacing: 1px;
    font-weight: 800;
    font-size: 8px;
    margin-right: 8px;
    line-height: initial;
}

.sw-supplier-info {
    font-weight: 600;
    font-size: 10px;
    color: var(--bs-red);
    text-transform: initial;
}

.sw-ancillary-box {
    padding: var(--responsive-margin-padding);
}

.sw-transfer-auxiliary-box {
    /*background-color: #F5F6FA;*/
}

.sw-ex-service-row {
    margin-bottom: var(--responsive-margin-padding);
}

.sw-ex-service-label {
    text-align: center;
    font-size: var(--mdfont);
}


.sw-ex-service-title {
    display: flex;
    font-weight: 600;
    align-items: center;
    font-size: var(--mdfont);
}

.sw-ex-service-badge {
    font-size: var(--labelfont);
    display: block;
    padding: 1px 8px;
    border-radius: 20px;
    margin-left: var(--responsive-margin-padding);
}

.sw-ex-service-badge.green {
    border: solid 1px #669F6A;
    color: #669F6A;
}

.sw-ex-service-badge.skyblue {
    border: solid 1px var(--primary-color);
    color: var(--primary-color);
}

.sw-ex-service-desc {
    font-size: var(--checkboxfont);
    color: #495057;
    margin-top: 0px;
}

.sw-ex-service-free {
    color: #669F6A;
    text-align: center;
    font-size: var(--deltafont);
}

.sw-ex-service-paid {
    text-align: center;
    font-size: var(--deltafont);
}

.sw-search-header {
    color: var(--firstcolor);
    font-weight: bold;
    text-transform: uppercase;
    font-size: var(--deltafont);
}

.sw-ex-service-total {
    font-size: var(--xlfont);
}

.qty-control.sw-small {
    height: 30px;
    width: 105px;
}

.qty-control input.sw-small {
    height: 30px;
    width: 25px;
    /* border: solid 1px red; */
}

.qty-control-down.sw-small,
.qty-control-up.sw-small {
    height: 30px;
    width: 30px;
}


@media (min-width: 768px) {
    .sw-price-metadata {
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start;
    }

    .sw-on-request-pill {
        margin-right: 0px;
    }
}

@media (min-width: 1200px) {
    .sw-add-return {
        min-height: 68px;
    }

    .sw-price-metadata {
        flex-direction: column;
        align-items: flex-end;
        justify-content: flex-end;
    }
}

/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
/* Chapter 20 - date & time picker style
 /* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
label.time-heading {
    display: block;
}

.datepicker-days {
    /* padding: 10px 0px; */
}

.bootstrap-datetimepicker-widget.dropdown-menu {
    position: absolute;
    top: 81px !important;
    left: calc(var(--bs-gutter-x) * .5) !important;
    border: solid 1px transparent;
    border-radius: var(--buttonradius);
    box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.16);
    /*margin: 5px 0px;*/
    min-width: 290px;
    font-size: 14px;
}

.bootstrap-datetimepicker-widget.dropdown-menu::before,
.bootstrap-datetimepicker-widget.dropdown-menu::after {
    display: none;
}

.bootstrap-datetimepicker-widget table th {
    color: #000;
}

.bootstrap-datetimepicker-widget table td,
.bootstrap-datetimepicker-widget table th {
    padding: 5px;
}

.bootstrap-datetimepicker-widget table td.active,
.bootstrap-datetimepicker-widget table td.active:hover {
    background-color: var(--primary-color);
}

.bootstrap-datetimepicker-widget table td.day {
    line-height: unset;
}

.bootstrap-datetimepicker-widget .timepicker .btn {
    box-shadow: none;
}

.closeText::before {
    color: #000;
}

/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
/* Chapter # 01 - login style */
/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
.page-wrapper {
    min-height: calc(100vh - 54px);
}

header.top-header {
    flex-direction: column;
}

header.top-header figure {
    margin: 0 auto;
}

.header-right {
    flex-direction: row;
    margin-top: 5px;
}

.header-btn {
    border-radius: var(--buttonradius);
    margin-left: 5px;
    min-width: 90px;
    min-height: 35px;
    text-transform: uppercase;
    font-weight: 500;
    outline: none;
    -webkit-appearance: none;
    box-shadow: 0px 6px 12px rgba(70, 136, 166, 0.16);
    transition: all 0.3s ease;
}

.header-btn:first-child {
    margin-left: 0px;
}

@media (min-width: 360px) {
    .header-btn {
        margin-left: 10px;
        min-width: 100px;
    }
}

@media (min-width: 375px) {
    .header-btn {
        min-width: 105px;
    }

    .login-form {
        margin: 0px auto;
    }
}

@media (min-width: 576px) {}

@media (min-width: 768px) {
    .page-wrapper {
        min-height: calc(100vh - 62px);
    }

    .header-right {
        margin-top: 0px;
    }

    .header-btn {
        margin-left: 15px;
        min-width: 115px;
        min-height: 40px;
    }
}

@media (min-width: 992px) {
    .page-wrapper {
        min-height: calc(100vh - 45px);
    }

    header.top-header {
        flex-direction: row;
    }
}

@media (min-width: 1200px) {
    .page-wrapper {
        min-height: calc(100vh - 53px);
    }

    header.top-header figure {
        margin: 0;
    }

    .header-btn {
        margin-left: 20px;
        min-width: 130px;
        min-height: 45px;
    }

    .login-form {
        margin: 0px;
    }
}

@media (min-width: 1400px) {}

/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
/* Chapter - 02 - search style */
/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
.main-container {
    padding: 0 5px;
}

.search-tabs ul li {
    font-size: 15px;
    padding: 19px 30px;
}

.search-tabs ul li .fa-plane {
    font-size: 16px;
}

.trip-way-check {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin-bottom: 1px;
}

.trip-way-check .checkbox-custom {
    margin-right: 0px;
    /* 38 */
}

.terif-class {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    flex-direction: row;
    padding-left: 0px;
    align-items: center;
    margin-top: 8px;
}

.travel-class {
    margin-left: 0px;
    height: 21px;
}

.travel-class .fa-chevron-down {
    padding-top: 2px;
}

.travel-class span {
    margin: 0 11px;
}

.travel-dropdown {
    min-width: 156px;
    /* 282px */
    z-index: 3;
}

.search-check-filter {
    display: flex;
    flex-direction: column;
    padding: 18px;
}

.travel-dtl {
    display: flex;
    flex-direction: column;
    padding: 0px 18px 18px 18px;
}

.add-route-div {
    padding: 0px 18px 18px;
}

.search-column1 {
    flex: 0 0 100%;
    display: flex;
}

.travel-dates {
    flex-direction: column;
    margin-left: 0px;
}

.travel-passenger {
    margin-left: 0px;
}

.travel-loc {
    flex-direction: column;
}

.col-htl-search {
        flex: 0 0 70%;
    }

.arrival-loc {
    padding-left: 17px;
}

.from-to-ico {
    right: -18px;
    height: 36px;
    width: 36px;
    font-size: 16px;
    top: 100%;
    margin-top: -20px;
}

.passenger-dropdown {
    right: unset;
    left: 0px;
}

.advanced-search {
    margin: 0 18px;
}

.v-col-3>.col-div {
    flex: 0 0 100%;
    max-width: 100%;
    padding: 0px 5px 11px;
}

.search-column2 {
    position: relative;
}

.remove-row-lg {
    width: 50px;
    height: 50px;
    font-size: 24px;
    margin-left: 0px;
    margin-top: 8px;
}

.remove-row-lg-2 {
    position: absolute;
    background-color: var(--secondary-color);
    color: #fff;
    box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.16);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: opacity 0.2s linear;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    bottom: -18px;
    right: -18px;
    font-size: 24px;
}

.remove-row-lg-2:hover {
    background-color: var(--secondary-color-lite);
}

.add-route-div {
    display: flex;
    justify-content: center;
}

.search-footer {
    justify-content: flex-end;
    padding: 8px 18px;
}

.reset-button-box {
    margin-top: 8px;
    margin-left: 0px;
    /* 38px */
}

.btn {
    border-radius: var(--buttonradius);
}

.btn-reset {
    border-radius: var(--buttonradius);
    cursor: pointer;
    border: 0 none;
    letter-spacing: 1.2px;
    text-align: center;
    padding: 8px;
    outline: none;
    background-color: var(--secondary-color);
    /*#0D8AE4*/
    color: #FFFFFF;
    font-weight: 500;
    text-transform: uppercase;
    box-shadow: 0px 6px 12px rgba(70, 136, 166, 0.16);
    transition: all 0.3s ease;
    text-transform: capitalize;
}

.btn-reset:hover,
.btn-reset:focus {
    background-color: var(--secondary-color-lite);
}

.header-left {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.lbl-loginname {
    padding-left: 0px;
    color: var(--secondary-color);
    font-weight: 600;
}

.search-footer button {
    width: 210px;
}

.inner-bgimg {
    height: 215px;
}

@media (min-width: 375px) {}

@media (min-width: 576px) {}

@media (min-width: 768px) {
    .main-container {
        padding: 0 16px;
    }

    .search-tabs ul li {
        font-size: 16px;
        padding: 23px 33px;
    }

    .search-tabs ul li .fa-plane {
        font-size: 18px;
    }

    .trip-way-check {
        justify-content: unset;
        align-items: center;
    }

    .trip-way-check .checkbox-custom {
        margin-right: 79px;
    }

    .terif-class {
        justify-content: unset;
    }

    .travel-class {
        margin-left: 49px;
    }

    .travel-dtl {
        padding: 0px 24px 24px 24px;
    }

    .travel-dropdown {
        min-width: 300px;
    }

    .fare-dropdown {
        min-width: 170px;
    }

    .search-check-filter {
        padding: 24px 24px 24px 24px;
    }

    .add-route-div {
        padding: 0px 24px 24px;
    }

    .travel-dates {
        flex-direction: row;
    }
    .travel-loc {
        flex-direction: row;
    }

    .arrival-loc {
        padding-left: 39px;
    }

    .from-to-ico {
        right: -20px;
        height: 40px;
        width: 40px;
        font-size: 18px;
        top: 50%;
        margin-top: -20px;
    }

    .advanced-search {
        margin: 0 24px;
    }

    .v-col-3>.col-div {
        flex: 0 0 50%;
        max-width: 50%;
    }

    .remove-row-lg-2 {
        width: 40px;
        height: 40px;
        bottom: -20px;
        right: -20px;
    }

    .add-route-div {
        justify-content: flex-start;
    }

    .search-footer {
        justify-content: flex-end;
        padding: 8px 24px;
    }

    .reset-button-box {
        margin-top: 0px;
        margin-left: 17px;
    }

    .header-left {
        flex-direction: row;
    }

    .lbl-loginname {
        padding-left: 20px;
    }

    .inner-bgimg {
        height: 203px;
    }
}

@media (min-width: 992px) {
    .inner-bgimg {
        height: 163px;
    }
}

@media (min-width: 1200px) {
    .main-container {
        padding: 0 20px;
    }

    .search-tabs ul li {
        font-size: 17px;
        padding: 27px 36px;
    }

    .search-tabs ul li .fa-plane {
        font-size: 20px;
    }

    .trip-way-check {
        margin-bottom: 0px;
    }

    .trip-way-check .checkbox-custom {
        margin-right: 30px;
    }

    .terif-class {
        padding-left: 6px;
        margin-top: 0px;
        justify-content: space-between;
    }

    .travel-class {
        margin-left: 22px;
        /* 38px */
    }

    .search-check-filter {
        flex-direction: row;
    }

    .travel-dtl {
        flex-direction: row;
    }

    .search-column1 {
        flex: 0 0 46%;
    }

    .col-htl-search {
        flex: 0 0 calc(100% - 150px);
    }

    .search-column-trip {
        flex: 0 0 44%;
    }

    .search-inc-fr {
        flex: 0 0 18%;
    }

    .lbl-inl-fr {
        font-size: var(--checkboxfont);
        margin-right: 10px;
        margin-top: 5px;
        font-weight: 500;
        color: #000;
    }

    .travel-dates {
        margin-left: 8px;
    }

    .travel-passenger {
        margin-left: 8px;
    }

    .from-to-ico {
        right: -23px;
        height: 47px;
        width: 47px;
        font-size: 21px;
        top: 50%;
        margin-top: -24px;
    }

    .passenger-dropdown {
        right: 0px;
        left: unset;
    }

    .v-col-3>.col-div {
        flex: 0 0 33.3333333333%;
        max-width: 33.3333333333%;
    }

    .remove-row-lg {
        width: 71px;
        height: unset;
        font-size: 29px;
        margin-left: 8px;
        margin-top: 0px;
    }

    .remove-row-lg-2 {
        width: 71px;
        height: 71px;
        border-radius: var(--buttonradius);
        bottom: 0px;
        right: -80px;
    }

    .reset-button-box {
        margin-left: 22px;
    }

    .btn-reset {
        text-transform: uppercase;
    }

    .inner-bgimg {
        height: 325px;
    }
}

@media (min-width: 1400px) {
    .trip-way-check .checkbox-custom {
        margin-right: 15px
    }

    .terif-class {
        justify-content: space-between;
    }

    .travel-class,
    .reset-button-box {
        margin-left: 38px;
    }

    .inner-bgimg {
        height: 327px;
    }
}

/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
/* Chapter # 03 - flight search result / listing style
 /* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
.search-result-section {
    position: relative;
}

.search-list-right {
    /*flex: 1 1 auto;*/
    width: calc(100% - 5px);
}

.search-head {
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    padding-left: 10px;
}

.search-head-left {
    flex: 0 0 100%;
    max-width: 100%;
}

.search-head-right {
    text-align: left;
    margin-top: 8px;
    flex: 0 0 100%;
    max-width: 100%;
}

.searchfldtl-row {
    width: 100%;
}

.search-fl-dtl {
    display: flex;
    flex-direction: column;
}

.search-fl-dtl,
.cart-fl-dtl {
    padding: 8px;
}

.search-fl-left {
    padding-right: 0px;
    /* 16 */
}

.search-fl-right {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    flex: 0 0 100%;
    /* 211 */
    max-width: 100%;
    /* 211 */
    padding: 10px;
    margin-top: 8px;
    text-align: right;
    align-items: stretch;
}

.search-fl-row {
    flex-direction: column;
    padding: 10px;
}



.sidebar-box {
    margin: 0 5px;
    padding: 10px 0;
}

.sidebar-box input[type=text] {
    width: 100%;
}

.search-flight-detail {
    margin-top: 10px;
    border-radius: var(--buttonradius);
}

.search-head-name,
.search-result-number {
    margin-bottom: 3px;
}

.lbl-provider {
    font-size: 10px;
    padding: 2px 4px;
    top: -1px;
    right: 0px;
}

.search-fl-metadetail {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.return-total {
    margin-bottom: 10px;
    line-height: 20px;
}

.book-teriff {
    margin-bottom: 0px;
    /* 10 */
}

.price-start {
    margin-bottom: 10px;
}

.upgrade-teriff {
    margin-bottom: 0px;
    margin-top: 10px;
}

.search-flight-more-bar,
.search-flight-more-bar2,
.show-more-rooms-bar {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
}

.search-flight-more-bar,
.search-flight-more-bar2 {
    justify-content: flex-start;
}

.search-flight-more-bar .fl-more,
.search-flight-more-bar2 .fl-more {
    /*border: solid 1px cyan;*/
    flex: 0 0 50%;
    max-width: 50%;
    /*flex: 1;*/
    padding-left: 1px;
    /* 12px */
    align-items: center;
    justify-content: center;
}

.search-flight-more-bar .fl-more,
.hide-more-detail,
.fl-more-halt,
.search-flight-more-bar2 .fl-more {
    min-height: 40px;
}

.more-fl-details,
.fl-name,
.fl-dur-total,
.fl-more-right,
.alt-rate-row {
    /*border: solid 1px red;*/
}

.fl-name-details,
.fl-more-row,
.alt-rate-detail-row {
    /*border: solid 1px blue;*/
}

.fl-more-detail,
.fl-more-left {
    /*border: solid 1px green;*/
}

.fl-more-row {
    flex-direction: column;
    padding: 10px 0px;
}

.fl-name {
    flex: 0 0 33.33333333%;
    max-width: 33.33333333%;
}

.fl-more-left {
    flex: 0 0 25%;
    padding-bottom: 10px;
    border-bottom: solid 1px #DFEFFB;
    margin: 0px 12px 10px 12px;
}

.fl-1 {
    margin-bottom: 10px;
}

.fl-more-times {
    flex: 0 0 calc(100% - 10px);
    margin-bottom: 10px;
    padding-bottom: 10px;
    border-bottom: solid 1px #DFEFFB;
}

.fl-class {
    margin-bottom: 2px;
}

.fl-traveller {
    margin-bottom: 2px;
}

.fl-more-left figure {
    margin-bottom: 6px;
    min-height: 16px;
}

.fl-num {
    margin-bottom: 6px;
}

.fl-name,
.fl-more-right,
.fl-dur-total {
    padding-left: 12px;
}

.popup-content,
.terif--row,
.rule-terms {
    padding: 8px;
}

ul.list-bullet li {
    margin-bottom: 6px;
}

.fare-rule-titles {
    padding: 0px 8px;
    text-transform: capitalize;
}

.rule-condition,
.alt-rate-title,
.alt-rate-detail-row {
    margin: 0 8px;
}

.teriff-p-title,
.alt-rate-title {
    text-transform: capitalize;
}

.alt-rate-title-bg,
.rate-head {
    padding: 0px 8px;
}

.rate-inn-cont {
    padding: 8px;
}

.public-rate {
    flex: 0 0 25%;
    max-width: 25%;
    /*padding-right: 8px;*/
}

.summary-rate {
    flex: 0 0 25%;
    max-width: 25%;
    /*padding-right: 8px;*/
}

.summary-diff {
    flex: 0 0 25%;
    max-width: 25%;
    /*padding-right: 8px;*/
}

.summary-fee {
    flex: 0 0 25%;
    max-width: 25%;
}

.slider-handle {
    top: 2px;
    width: 16px;
    height: 16px;
}

.search-fl-row-sm {
    display: flex;
    flex-direction: column;
    padding: 4px;
    /* background-color: #fff; */
    box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.16);
    border-radius: var(--buttonradius);
    margin-bottom: 8px;
    border: solid 1px var(--bs-gray-400);
}

.search-fl-row-sm:last-child {
    margin-bottom: 0;
}

.sw-list-radio {
    /* border: solid 1px blue; */
    display: flex;
    flex-direction: row;
    align-items: center;
    width: 100%;
    margin-bottom: 8px;
}

.sw-list-radio:last-child {
    margin-bottom: 0px;
}

.sw-list-radio-input {
    margin-right: 8px;
    width: 30px;
    height: 30px;
}



.sw-list-radio-label {
    width: 100%;
    flex: 1;
    border: solid 1px var(--bs-gray-400);
    margin: 0;
    display: flex;
    flex-direction: column;
    padding: 4px;
    border-radius: var(--buttonradius);
    background-color: #fff;
    /* box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.16); */
}

.sw-list-radio-input:checked ~ .sw-list-radio-label {
    background-color: #e6f4ff;
}

.sw-list-radio-label.selected {
   /* background-color: #ccffdd; */
}

@media (min-width: 375px) {}

@media (min-width: 576px) {}

@media (min-width: 768px) {
    .search-list-right {
        width: 100%;
    }

    .search-head {
        justify-content: space-between;
        flex-direction: row;
        padding-left: 5px;
    }

    .search-head-left {
        flex: 0 0 66.6666666667%;
        /* 33.3333333333% */
        max-width: 66.6666666667%;
        /* 33.3333333333% */
    }

    .search-head-right {
        text-align: right;
        margin-top: 0px;
        flex: 0 0 33.3333333333%;
        /* 33.3333333333% */
        max-width: 33.3333333333%;
        /* 33.3333333333% */
    }

    .cart-fl-dtl {
        padding: 16px;
    }

    .search-fl-dtl {
        padding: 16px;
    }


    .search-fl-row {
        flex-direction: row;
        padding: 13px;
    }

    .search-fl-row-sm {
        flex-direction: column;
        /* padding: 13px; */
    }

    .search-fl-right {
        flex-direction: row;
        padding: 13px;
        text-align: left;
        align-items: center;
    }

    .sidebar-box {
        margin: 0 10px;
        padding: 15px 0;
    }

    .search-flight-detail {
        margin-top: 15px;
    }

    .search-head-name,
    .search-result-number {
        margin-bottom: 4px;
    }

    .lbl-provider {
        padding: 3px 5px;
        top: -3px;
        right: 0px;
    }

    .search-fl-metadetail {
        width: 215px;
        flex-direction: column;
    }

    .return-total {
        margin-bottom: 0px;
    }

    .book-teriff {
        margin-bottom: 0px;
    }

    .upgrade-teriff {
        margin-bottom: 0px;
        margin-top: 0px;
    }

    .search-flight-more-bar {
        flex-direction: row;
        justify-content: space-between;
    }

    .search-flight-more-bar2 {
        flex-direction: row;
        justify-content: flex-start;
    }

    .search-flight-more-bar .fl-more,
    .search-flight-more-bar2 .fl-more {
        flex: 0 0 25%;
        max-width: 25%;
        justify-content: center;
    }

    .search-flight-more-bar .fl-more,
    .hide-more-detail,
    .fl-more-halt,
    .search-flight-more-bar2 .fl-more {
        min-height: 44px;
    }

    .fl-more-row {
        flex-direction: row;
        padding: 13px 0px;
    }

    .fl-name,
    .fl-dur-total {
        padding-left: 16px;
    }

    .fl-name {
        flex: 0 0 25%;
        max-width: 25%;
    }

    .fl-more-left {
        padding-bottom: 0px;
        border-bottom: none;
        margin: 0px 0px 0px 16px;
    }

    .fl-more-right {
        padding-left: 0px;
    }

    .fl-more-times {
        flex: 0 0 60%;
        margin-bottom: 0px;
        padding-bottom: 0px;
        border-bottom: none;
    }
    .fl-info-right {
        flex: 0 0 40%;
    }

    .popup-content,
    .terif--row,
    .rule-terms {
        padding: 16px;
    }

    ul.list-bullet li {
        margin-bottom: 8px;
    }

    .fare-rule-titles {
        padding: 0px 16px;
    }

    .rule-condition,
    .alt-rate-title,
    .alt-rate-detail-row {
        margin: 0 16px;
    }

    .alt-rate-title-bg,
    .rate-head {
        padding: 0px 16px;
    }

    .rate-inn-cont {
        padding: 16px;
    }

    .slider-handle {
        top: 1px;
        width: 18px;
        height: 18px;
    }

    .sw-list-radio-label {
        flex-direction: row;
    }
}

@media (min-width: 992px) {

    .search-flight-more-bar .fl-more,
    .search-flight-more-bar2 .fl-more {
        flex: 0 0 25%;
        max-width: 25%;
    }
}

@media (min-width: 1200px) {
    .search-fl-dtl {
        flex-direction: row;
    }

    .cart-fl-dtl {
        padding: 24px;
    }

    .search-fl-row {
        padding: 16px;
    }

    .search-fl-left {
        padding-right: 16px;
    }

    .search-fl-right {
        flex-direction: column;
        flex: 0 0 220px;
        max-width: 220px;
        margin-top: 0px;
        padding: 16px;
        text-align: right;
        align-items: stretch;
    }

    .sidebar-box {
        margin: 0 15px;
        padding: 20px 0;
    }

    .search-flight-detail {
        margin-top: 20px;
    }

    .search-head-name,
    .search-result-number {
        margin-bottom: 5px;
    }

    .lbl-provider {
        padding: 4px 6px;
        top: -5px;
        right: 0px;
    }

    .search-flight-more-bar .fl-more,
    .search-flight-more-bar2 .fl-more {
        flex: 0 0 25%;
        max-width: 25%;
    }

    .search-flight-more-bar .fl-more,
    .hide-more-detail,
    .fl-more-halt,
    .search-flight-more-bar2 .fl-more {
        min-height: 48px;
    }

    .fl-more-row {
        padding: 16px 0px;
    }

    .fl-more-left {
        margin: 0px 0px 0px 24px;
    }

    .fl-name,
    .fl-dur-total {
        padding-left: 24px;
    }

    .fl-more-times {
        flex: 0 0 60%;
    }
    .fl-info-right {
        flex: 0 0 40%;
    }

    .popup-content,
    .terif--row,
    .rule-terms {
        padding: 24px;
    }

    ul.list-bullet li {
        margin-bottom: 10px;
    }

    .fare-rule-titles {
        padding: 0px 24px;
        text-transform: uppercase;
    }

    .rule-condition,
    .alt-rate-title,
    .alt-rate-detail-row {
        margin: 0 24px;
    }

    .teriff-p-title,
    .alt-rate-title {
        text-transform: uppercase;
    }

    .alt-rate-title-bg,
    .rate-head {
        padding: 0px 24px;
    }

    .rate-inn-cont {
        padding: 24px;
    }

    .slider-handle {
        top: 0px;
        width: 20px;
        height: 20px;
    }

    .return-total {
        margin-bottom: 10px;
    }

    .upgrade-teriff {
        margin-top: 10px;
    }
}

@media (min-width: 1400px) {
    .search-fl-right {
        flex: 0 0 264px;
        max-width: 264px;
    }

    .sidebar-box {
        margin: 0 20px;
        padding: 20px 0;
    }
}

/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
/* Chapter # 04 - footer style
 /* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
.site-footer,
.footer-topleft,
.copyright {
    /*border: solid 1px blue;*/
}

.footer-top {
    /*border: solid 2px black;*/
}

.site-footer-inner,
.footer-top-right,
.footer-links {
    /*border: solid 1px red;*/
}

footer {
    padding: 30px 0px;
    font-size: 13px;
    line-height: 17px;
    background-color: var(--primary-color-lite);
    color: #fff;
    border-bottom: 2px solid var(--tertiary-color);
}

.site-footer {}

.site-footer-inner {
    flex-direction: column;
    padding: 10px;
    flex-wrap: wrap;
}

.footer-topleft {
    flex: 0 0 100%;
    max-width: 100%;
    padding-right: 0px;
}

.footer-top-right {
    /*flex: 1 1 auto;*/
    justify-content: space-between;
    flex: 0 0 100%;
    max-width: 100%;
    margin-top: 18px;
}

.footer-txt {
    margin: 25px 0px;
    color: #E2EAF0;
    font-weight: 500;
}

.footer-contact ul {
    flex-direction: column;
}

.footer-contact ul li {
    margin-right: 0px;
    margin-bottom: 10px;
}

.copyright {
    width: 100%;
    text-align: center;
}

.footer-links {
    width: 100%;
    justify-content: space-evenly;
    /* flex-end | space-evenly | center */
}

@media (min-width: 768px) {
    footer {
        padding: 40px 0px;
    }

    .site-footer-inner {
        padding: 14px;
    }

    .footer-contact ul {
        flex-direction: row;
    }

    .footer-contact ul li {
        margin-right: 50px;
        margin-bottom: 0px;
    }
}

@media (min-width: 992px) {
    .site-footer-inner {
        flex-direction: row;
    }

    .copyright {
        width: 50%;
        text-align: left;
    }

    .footer-links {
        width: 50%;
        justify-content: flex-end;
        /* flex-end | center */
    }

    .footer-links li {
        margin-left: 45px;
    }
}

@media (min-width: 1200px) {
    footer {
        padding: 50px 0px;
    }

    .site-footer-inner {
        padding: 18px;
    }

    .footer-topleft {
        flex: 0 0 50%;
        max-width: 50%;
        padding-left: 10%;
    }

    .footer-top-right {
        flex: 0 0 50%;
        max-width: 50%;
        margin-top: 0px;
        justify-content: center;
    }

    .footer-links-list {
        flex: 0 0 35%;
        max-width: 35%;
        margin-top: 0px;
        justify-content: left;
    }

    .footer-cont-link {
        flex: 0 0 40%;
        max-width: 40%;
    }

    .ul-mnu-list {
        width: 250px;
        margin: auto;
    }
}

@media (min-width: 1400px) {}

/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
/* Chapter # 06 - offcanvas style
 /* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
.offcanvas-container,
.child-container {
    /*border: solid 1px blue;*/
    margin: 50px 0px;
}

.btn-filter {
    display: block;
    margin-bottom: 16px;
    min-width: 250px;
}

.col-left {
    flex: 1;
    max-width: 250px;
    /*border: solid 1px red;*/
}

.col-right {
    flex: 1;
    margin-left: 0px;
    /*border: solid 1px pink;*/
}

.search-list-aside {
    margin-right: 5px;
}

.col-left-hotel {
    flex: 1;
    max-width: 175px;
    /* border: solid 1px red; */
}

.col-right-hotel {
    flex: 1;
    margin-left: 0px;
    /* border: solid 1px pink; */
}

@media (min-width: 411px) {
    .col-left-hotel {
        max-width: 195px;
    }
}

@media (min-width: 768px) {
    .search-list-aside {
        margin-right: 0px;
    }

    .col-left-hotel {
        max-width: 350px;
    }
}

@media (min-width: 834px) {
    .col-left-hotel {
        max-width: 383px;
    }
}

@media (min-width: 992px) {
    .btn-filter {
        display: none;
    }

    .col-right {
        margin-left: 24px;
    }

    .col-right-hotel {
        margin-left: 24px;
    }

    .col-left-hotel {
        max-width: 250px;
    }
}

@media (min-width: 1200px) {
    .col-left-hotel {
        max-width: 290px;
    }
}

@media (min-width: 1400px) {
    .col-left-hotel {
        max-width: 300px;
    }
}

@media (min-width: 1600px) {
    .col-left-hotel {
        max-width: 310px;
    }
}

@media screen and (max-width: 991px) {
    .row-offcanvas {
        position: relative;
        -webkit-transition: all .25s ease-out;
        -o-transition: all .25s ease-out;
        transition: all .25s ease-out;
    }

    .row-offcanvas-right {
        right: 0;
    }

    .row-offcanvas-left {
        left: 0;
    }

    .row-offcanvas-right .sidebar-offcanvas {
        right: -50%;
        /* 6 columns */
    }

    .row-offcanvas-left .sidebar-offcanvas {
        left: -50%;
        /* 6 columns */
    }

    .row-offcanvas-right.active {
        right: 50%;
        /* 6 columns */
    }

    .row-offcanvas-left.active {
        left: 50%;
        /* 6 columns */
    }

    .sidebar-offcanvas {
        position: absolute;
        top: 0;
        width: 50%;
        /* 6 columns */
    }
}

/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
/* Chapter # 07 - cart style
 /* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
.cart-price-start,
.cart-upgrade-teriff {
    /* border: solid 1px blue;*/
}

.cart-price-start {
    padding-top: 8px;
}

.cart-card-offer,
.cart-fl-right button.btn {
    /* border: solid 1px green;*/
}

.cart-fl-row,
.cart-fl-row2 {
    flex-direction: column;
    /* border: solid 1px Chartreuse; */
}

.cart-fl-row2 {
    display: flex;
    flex-direction: column;
}

.cart-head {
    align-items: center;
    flex-direction: column;
    justify-content: flex-start;
}

.cart-left {
    margin-bottom: 10px;
}

.cart-right {
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: flex-end;
    /*border: solid 1px Turquoise;*/
}

.cart-total-box {
    margin-right: 0px;
    text-align: center;
}

.cart-fl-dtl {
    flex-direction: column;
    /* border: solid 1px blue; */
}

.cart-fl-left {
    /* border: solid 1px red; */
    flex: 1;
    width: 100%;
}

.cart-fl-left2 {
    /*border: solid 1px red;*/
    flex: 1 1 100%;
    width: 100%;
}

.cart-fl-right {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: stretch;
    flex: 1;
    width: 100%;
    text-align: right;
    padding: var(--responsive-margin-padding);
    /*border: solid 1px Fuchsia;*/
    border: solid 1px var(--bs-gray-300);
    border-radius: var(--buttonradius);
}

.cart-fl-metadetail {
    /* border: solid 1px blue; */
    flex: 1;
    border-bottom: solid 1px #DFEFFB;
    padding-bottom: 4px;
    margin-bottom: 4px;
}

.cart-fl-duration {
    /* border: solid 1px green; */
    flex: 1;
    border-bottom: solid 1px #DFEFFB;
    padding-bottom: 4px;
    margin-bottom: 4px;
}

.cart-fl-timing {
    /* border: solid 1px orange; */
    flex: 1;
    border-bottom: solid 1px #DFEFFB;
    padding-bottom: 4px;
    margin-bottom: 4px;
}

.cart-fl-more-rates {
    /* border: solid 1px red; */
    flex: 2;
    border-bottom: solid 1px #DFEFFB;
    padding-bottom: 8px;
    display: flex;
    flex-direction: column;
    align-content: center;
    justify-content: center;
}

button.min-some-w,
a.min-some-w {
    min-width: unset;
}

.terif--row {
    flex-direction: column;
}

.teriff-logo {
    flex: 1;
}

.teriffincl {
    flex: 1;
}

.teriffPayable {
    flex: 1;
}

.teriffnot-include {
    flex: 1;
}

.teriff-p-title {
    margin: 16px 0px;
}

.teriff-logo figure {
    margin-bottom: 16px;
}

.cart-fl-right button.btn {
    margin-top: 30px;
    max-width: 250px;
}

.btn-type4 {
    align-self: flex-end;
}

.cart-card-offer {
    padding-top: 16px;
}

.cart-reserv-notice {}

.cart-reserv-notice strong {
    font-weight: 600;
}

.price-change-info {
    background: #f6f6f6;
    box-shadow: 0 1px 10px rgb(0, 0, 0, 0.16);
    margin: 8px;
}

.cart-reserv-notice,
.price-change-info {
    padding: 8px;
}

.h-m-52 {
    max-height: 52px;
}

.cart-total-bottom2 {
    border-top: 1px solid var(--secondary-color);
    padding: 8px 0px;
}

.cart-name {
    justify-content: center;
}

.cart-right button+button {
    margin-left: 0px;
}

.hotel-metadetail-left {
    flex: 3;
    /*border: solid 1px red;*/
    border-bottom: solid 1px #DFEFFB;
    padding-bottom: 4px;
    margin-bottom: 4px;
}

.hotel-metadetail-left .date-checkout {
    margin-left: 16px;
}

.hotel-metadetail-right {
    flex: 2;
    /*border: solid 1px blue;*/
    font-weight: 600;
    display: flex;
    flex-direction: column;
    align-content: center;
    justify-content: center;
}

.cart-row {
    border: solid 1px transparent;
}

.warning-container {
    /*border: solid 1px Tan;*/
    margin: 0 var(--responsive-margin-padding) var(--responsive-margin-padding);
}

.warning-container .title {
    font-weight: 600;
    color: #CC3E3E;
}

@media (min-width: 768px) {

    .cart-fl-row,
    .cart-fl-row2 {
        flex-direction: row;
    }

    .cart-head {
        flex-direction: row;
        justify-content: space-between;
    }

    .cart-left {
        margin-bottom: 0px;
    }

    .cart-right {
        flex-direction: row;
    }

    .cart-total-box {
        margin-right: 16px;
    }

    .terif--row {
        flex-direction: row;
    }

    .teriff-p-title {
        margin: 0px 0px 16px 0px;
    }

    .cart-fl-right {
        flex-direction: row;
        text-align: left;
        align-items: center;
    }

    .cart-fl-right button.btn {
        margin-top: 0px;
    }

    .cart-card-offer {
        padding-top: 0px;
    }

    .cart-reserv-notice,
    .price-change-info {
        padding: 16px;
    }

    .price-change-info {
        margin: 16px;
    }

    .cart-fl-metadetail,
    .cart-fl-duration,
    .cart-fl-timing,
    .cart-fl-more-rates,
    .hotel-metadetail-left {
        border-bottom: none;
        padding-bottom: 0px;
        margin-bottom: 0px;
    }

    .cart-total-bottom2 {
        padding: 16px 0px;
    }

    .cart-name {
        justify-content: flex-start;
    }

    .cart-right button+button {
        margin-left: 16px;
    }
}

@media (min-width: 992px) {}

@media (min-width: 1200px) {
    .cart-total-box {
        margin-right: 24px;
    }

    .cart-fl-dtl {
        flex-direction: row;
    }

    .cart-fl-left2 {
        flex: 0 0 66.66666667%;
        width: 66.66666667%;
    }

    .cart-fl-right {
        flex: 1;
        max-width: 300px;
        /* 264 */
        align-self: flex-end;
        align-items: stretch;
    }

    .cart-fl-right {
        flex-direction: column;
        text-align: right;
    }

    .cart-fl-right button.btn {
        margin-top: 30px;
        max-width: 250px;
    }

    .cart-card-offer {
        padding-top: 16px;
    }

    .cart-reserv-notice,
    .price-change-info {
        padding: 24px;
    }

    .price-change-info {
        margin: 24px;
    }

    .cart-total-bottom2 {
        padding: 24px 0px;
    }
}

@media (min-width: 1400px) {}

/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
/* Chapter 08 - passenger detail style
 /* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
.fl-frm-tovr {
    display: none;
}

.fl-pas-dtl-pax-cont {
    margin: 8px;
}

.fl-from-to {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 8px;
}

.fl-frmto-dtl {
    margin-bottom: 8px;
}

.addi-service-container {
    text-align: right;
}

.form-container {
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    flex-direction: column;
}

.form-element {
    padding-right: 0px;
    margin-bottom: 8px;
}

.form-element:last-child {
    margin-bottom: 0px;
}

.ele-1,
.ele-2,
.ele-3,
.ele-4,
.ele-5,
.ele-6,
.ele-7,
.ele-8,
.ele-9,
.ele-10,
.ele-11,
.ele-12,
.ele-13,
.ele-14,
.ele-15 {
    /*border: solid 1px red;*/
}

.ele-1,
.ele-2,
.ele-3,
.ele-4,
.ele-5,
.ele-6,
.ele-7,
.ele-8,
.ele-9,
.ele-10,
.ele-11,
.ele-12,
.ele-13,
.ele-14,
.ele-15 {
    flex: 1 1 100%;
    max-width: 100%;
}

.ele-1a,
.ele-2a,
.ele-3a {
    /*border: solid 1px grey;*/
    flex: 1 1 100%;
    max-width: 100%;
}

.frm-dropdown {
    width: 100%;
}

.selected-ssr-info-label {
    margin-top: 8px;
}

.cart-total-bottom {
    flex-direction: column;
    padding: 8px;
}

.booking-cart-left {
    margin-bottom: 8px;
}

.fl-frm,
.fl-via {
    margin-bottom: 8px;
}

.pay-method-detail {
    padding: 8px;
}

.creditcard-title {
    width: 100%;
}

.pas-add-service {
    padding: 0 8px 8px;
}

.pas-add-detial {
    padding: 8px;
}

.guest-details-box {
    border: solid 1px transparent;
}

.guest-form-box {
    /*border: solid 1px greenyellow;*/
    margin: 0 var(--responsive-margin-padding) var(--responsive-margin-padding) var(--responsive-margin-padding);
}

.guest-no-header {
    letter-spacing: 1.2px;
    color: var(--primary-color);
    font-weight: bold;
    text-transform: uppercase;
    margin-bottom: 8px;
}

.guest-no-header i {
    color: var(--secondary-color);
}

.guest-single-box {
    margin-bottom: var(--responsive-margin-padding);
}

@media (min-width: 768px) {
    .fl-pas-dtl-pax-cont {
        margin: 16px;
    }

    .fl-from-to {
        flex-direction: row;
        flex-wrap: wrap;
        padding: 16px;
    }

    .fl-frmto-dtl {
        margin-bottom: 16px;
        flex: 1 1 30%;
        max-width: 30%;
        margin-right: 20px;
    }

    .addi-service-container {
        flex: 1 1 34%;
        max-width: 34%;
    }

    .border-right {
        border-right: solid 1px var(--tertiary-color);
    }

    .fl-frm-tovr {
        display: none;
    }

    .form-container {
        flex-direction: row;
    }

    .guest-details-box .ele-3a {
        padding-right: 0px;
    }

    .form-element {
        padding-right: 20px;
    }

    .form-element:nth-child(2),
    .form-element:nth-child(4),
    .form-element:nth-child(6),
    .form-element:nth-child(8),
    .form-element:nth-child(10),
    .form-element:nth-child(12),
    .form-element:nth-child(14),
    .form-element:nth-child(16) {
      /*  padding-right: 0px;*/
    }

    .ele-1,
    .ele-2,
    .ele-3,
    .ele-4,
    .ele-5,
    .ele-6,
    .ele-7,
    .ele-8,
    .ele-9,
    .ele-10,
    .ele-11,
    .ele-12,
    .ele-13,
    .ele-14,
    .ele-15 {
        flex: 1 1 50%;
        max-width: 50%;
    }

    .ele-1a,
    .ele-2a {
        flex: 1 1 50%;
        max-width: 50%;
    }

    .frm-dropdown {
        width: 50%;
    }

    .cart-total-bottom {
        padding: 16px;
    }

    .booking-cart-left {
        margin-bottom: 16px;
    }

    .pay-method-detail {
        padding: 16px;
    }

    .creditcard-title {
        width: 50%;
    }

    .pas-add-service {
        padding: 0px 16px 16px 16px;
    }

    .pas-add-detial {
        padding: 16px;
    }
}

@media (min-width: 992px) {
    .cart-total-bottom {
        flex-direction: row;
        justify-content: space-between;
    }

    .booking-cart-left {
        margin-bottom: 0px;
    }
}

@media (min-width: 1200px) {
    .fl-pas-dtl-pax-cont {
        margin: 24px;
    }

    .fl-from-to {
        padding: 24px;
    }

    .fl-frmto-dtl {
        flex: 1 1 25%;
        max-width: 25%;
    }

    .addi-service-container {
        flex: 1 1 46%;
        max-width: 46%;
    }

    .ele-1 {
        flex: 1 1 100%;
        max-width: 100%;
    }

    .ele-2,
    .ele-3,
    .ele-4,
    .ele-5,
    .ele-6,
    .ele-7,
    .ele-8,
    .ele-9,
    .ele-10,
    .ele-11,
    .ele-12,
    .ele-13,
    .ele-14,
    .ele-15 {
        flex: 1 1 33.33333333%;
        max-width: 33.33333333%;
    }

    .ele-1a,
    .ele-2a {
        flex: 1 1 33.33333333%;
        max-width: 33.33333333%;
    }

    .ele-3a {
        flex: 1 1 66.66666667%;
        max-width: 66.66666667%;
    }

    .frm-dropdown {
        width: 33.33333333%;
    }

    .pas-title {
        width: calc(33.33% - 16px);
    }

    .guest-details-box .ele-3a {
        padding-right: 20px;
    }

    .form-element {
        margin-bottom: 16px;
        padding-right: 20px;
    }

    .form-element:nth-child(2),
    .form-element:nth-child(6),
    .form-element:nth-child(8),
    .form-element:nth-child(10),
    .form-element:nth-child(12) {
        padding-right: 20px;
    }

    .form-element:nth-child(4),
    .form-element:nth-child(7),
    .form-element:nth-child(10),
    .form-element:nth-child(13) {
       /* padding-right: 0px;*/
    }

    .cart-total-bottom {
        padding: 24px;
        flex-direction: row;
        justify-content: space-between;
    }

    .pay-method-detail {
        padding: 24px;
    }

    .creditcard-title {
        width: 33.33333333%;
    }

    .pas-add-service {
        padding: 0px 24px 24px 24px;
    }

    .pas-add-detial {
        padding: 24px;
    }
}

@media (min-width: 1400px) {}

/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
/* Chapter 09 - alternate fare rule style
 /* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
.alt-fare-rule-row {
    /*border: solid 2px cyan;*/
}

.row-changes {
    /*border: solid 1px deeppink;*/
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    padding: 8px 8px 0px;
}

.fare-change-box {
    /*border: solid 1px deeppink;*/
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    flex: 1 1 100%;
    width: 100%;
}

.refund-box {
    /*border: solid 1px seagreen;*/
    flex: 1 1 100%;
    width: 100%;
}
.alt-refund-box {
    flex: 1 1 25%;
    width: 25%;
}
.regole-box,
.cambi-box {
    /*border: solid 1px powderblue;*/
    width: 100%;
}

.rimborso-box {
    /*border: solid 1px powderblue;*/
    width: 100%;
}

.col-fare-rules {
    /*border: solid 1px seagreen;*/
    flex: 0 0 100%;
    width: 100%;
    margin-bottom: 8px;
}

.col-changes {
    /*border: solid 1px darkmagenta;*/
    flex: 0 0 100%;
    width: 100%;
    margin-bottom: 8px;
}

.col-ticket-refunds {
    /*border: solid 1px powderblue;*/
    flex: 0 0 100%;
    width: 100%;
}

.col-header {
    font-weight: 600;
    text-transform: uppercase;
    padding: 0px 0px 4px;
    /* 4 6 8 */
    border-bottom: solid 1px #707070;
}

.col-text-see {
    border: solid 1px #DFEFFB;
    flex: 0 0 98%;
    width: 98%;
    text-align: center;
    padding: 4px 0px;
    border-radius: var(--buttonradius);
    margin-bottom: 4px;
}

.col-text-see a {
    display: block;
    text-decoration: underline;
}

.col-text {
    padding: 2px 8px 2px 0px;
    font-weight: 500;
}

.col-text .fa-times {
    color: var(--primary-color);
    padding-right: 10px;
}

.col-text a {
    text-decoration: underline;
    float: right;
    padding-right: 8px;
}

.col-text a:hover,
.col-text a:focus {
    text-decoration: none;
}

.row-changes2 {
    /*border: solid 1px deeppink;*/
    display: flex;
    justify-content: flex-start;
    flex-direction: row;
    flex-wrap: wrap;
    padding: 8px 8px 0px;
}

.col-volo {
    /*border: solid 1px orange;*/
    margin-bottom: 10px;
    flex: 0 0 50%;
    width: 50%;
}

.alt-total-rate {
    /*border: solid 1px cyan;*/
    display: flex;
    align-items: center;
    flex-direction: column;
    border-top: 1px solid #707070;
    justify-content: space-between;
    padding-top: 8px;
    margin: 8px 8px;
}

.col-conditions {
    /*border: solid 1px red;*/
    flex: 0 0 100%;
    width: 100%;
}

.col-prezzo {
    /*border: solid 1px blue;*/
    display: flex;
    flex-direction: row;
    align-items: center;
    align-self: flex-end;
}

.condi-link {
    cursor: pointer;
    color: var(--primary-color);
    text-transform: capitalize;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    font-weight: 600;
    letter-spacing: 1.1px;
}

@media (min-width: 768px) {
    .row-changes {
        flex-direction: row;
        flex-wrap: wrap;
        padding: 16px 16px 0px;
    }

    .regole-box,
    .cambi-box {
        width: 50%;
    }

    .alt-fare-change-box .regole-box,
    .alt-fare-change-box .cambi-box {
        width: 33.3333%;
    }

    .row-changes2 {
        padding: 16px 16px 0px;
    }

    .col-fare-rules {
        flex: 0 0 50%;
        width: 50%;
    }

    .col-changes {
        flex: 0 0 50%;
        width: 50%;
    }

    .col-ticket-refunds {
        flex: 0 0 50%;
        width: 50%;
    }

    .col-header,
    .col-header-3a,
    .col-header-3b {
        padding: 0px 0px 6px;
        /* 4 6 8 */
    }

    .col-volo {
        flex: 0 0 33.33333333%;
        width: 33.33333333%;
    }

    .alt-total-rate {
        margin: 8px 16px;
        flex-direction: row;
    }

    .col-conditions {
        flex: 1 0 50%;
        width: 50%;
    }
}

@media (min-width: 992px) {
    .col-fare-rules {
        flex: 0 0 33.33333333%;
        width: 33.33333333%;
        margin-bottom: 0px;
    }

    .col-changes {
        flex: 0 0 33.33333333%;
        width: 33.33333333%;
        margin-bottom: 0px;
    }

    .col-ticket-refunds {
        flex: 0 0 33.33333333%;
        width: 33.33333333%;
    }

    .col-volo {
        flex: 0 0 25%;
        width: 25%;
    }
}

@media (min-width: 1200px) {

    .row-changes,
    .row-changes2 {
        padding: 24px 24px 0px;
    }

    .fare-change-box {
        flex: 1 1 66.66666667%;
        width: 66.66666667%;
    }

    .refund-box {
        flex: 1 1 33.33333333%;
        width: 33.33333333%;
    }
    .alt-fare-change-box {
        flex: 1 1 75%;
        width: 75%;
    }

    .alt-refund-box {
        flex: 1 1 25%;
        width: 25%;
    }

    .alt-fare-change-box {
        flex: 1 1 75%;
        width: 75%;
    }
    .col-header,
    .col-header-3a,
    .col-header-3b {
        padding: 0px 0px 8px;
        /* 4 6 8 */
    }

    .alt-total-rate {
        margin: 8px 24px;
    }
}

/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
/* Chapter 10 - common page style 
 /* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
.common-page-container {
    background-color: #FFFFFF;
    box-shadow: 0px 1px 5px #00000029;
    margin-bottom: 8px;
    padding: 8px;
    border-radius: var(--buttonradius);
    display: flex;
    flex-direction: column;
}

.col-page-image {
    /*border: solid 1px red;*/
    flex: 0 0 100%;
    width: 100%;
}

.col-page-image img {
    display: block;
    border-radius: var(--buttonradius);
    overflow: hidden;
    max-height: 200px;
    width: 100%;
    object-fit: cover;
    object-position: center center;
}

.col-page-text {
    /*border: solid 1px blue;*/
    flex: 0 0 100%;
    width: 100%;
    padding: 10px 0px 0px 0px;
    font-size: var(--alphafont);
}

.common-page-header {
    text-transform: capitalize;
    font-weight: 500;
    margin-bottom: 10px;
}

.loader-inner {
    /*border: solid 2px red;*/
    height: 100%;
    display: flex;
    justify-content: center;
    padding: 8px;
    align-items: center;
    /*background-color: #fff;*/
}

.loader-body {
    /*border: solid 2px blue;*/
    text-align: center;
}

.loading-text {
    color: var(--primary-color);
    font-weight: 700;
    letter-spacing: 1.3px;
    text-transform: uppercase;
    margin-top: 16px
}

.loader-body figure img {
    /*border: solid 2px pink;*/
    max-width: 90%;
}


@media (min-width: 768px) {
    .common-page-container {
        margin-bottom: 16px;
        padding: 16px;
    }

    .col-page-image img {
        max-height: 300px;
        width: 100%;
    }


    .loader-body figure img {
        max-width: 80%;
    }
}

@media (min-width: 1200px) {
    .common-page-container {
        margin-bottom: 24px;
        padding: 24px;
        flex-direction: row;
    }

    .col-page-image {
        flex: 0 0 40%;
        width: 40%;
    }

    .col-page-image img {
        max-height: 400px;
    }

    .col-page-text {
        flex: 0 0 60%;
        width: 60%;
        padding: 0px 0px 0px 24px;
    }
}

/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
/* Chapter 02A - hotel search style
 /* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
.hotel-search-box,
.hotel-search-box2 {
    /*border: solid 1px red;*/
    padding: 18px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
}

.col-city,
.col-dates,
.col-guests,
.child-age-box,
.col-dates2,
.col-guests2,
.col-update-search {
    /*border: solid 1px blue;*/
}

.col-city {
    flex: 1 1 100%;
    width: 100%;
}

.col-dates {
    flex: 1 1 100%;
    width: 100%;
}

.col-dates2 {
    flex: 1 1 100%;
    width: 100%;
}

.col-guests {
    flex: 1 1 100%;
    width: 100%;
}

.col-guests2 {
    flex: 1 1 100%;
    width: 100%;
}
.col-distance {
    flex: 1 1 150px;
    width: 150px;
}

.col-guests-htl {
    flex: 1 1 65%;
    width: 65%;
}

.col-update-search {
    flex: 1 1 100%;
    width: 100%;
    padding-left: 0px;
}

.col-dates2,
.col-guests2,
.col-update-search {}

.col-update-search button {
    width: 100%;
}

.camera-box {
    border-bottom: solid 1px #DFEFFB;
    margin-bottom: 5px;
    padding-bottom: 10px;
}

.camera-box:last-child {
    margin-bottom: 0px;
}

.child-age-box {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
}

.age-control {
    flex: 0 1 49%;
    width: 49%;
    margin-top: 4px;
}

.age-control label {
    display: block;
    font-size: 11px;
    font-weight: 600;
}

.age-select {
    display: block;
    width: 100%;
    height: 30px;
    padding: .375rem 2.25rem .375rem .75rem;
    -moz-padding-start: calc(0.75rem - 3px);
    line-height: 1.5;
    border: 1px solid var(--primary-color);
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
    word-wrap: normal;
}

.age-select::after {
    display: block;
    clear: both;
    content: "";
}

.add-remove-box {
    text-align: right;
}

.add-remove-box a {
    padding: 0px 0px 3px;
    display: block;
}

.link-remove {
    color: maroon;
}

.link-remove:hover {
    color: maroon;
}

.link-add {
    color: var(--primary-color);
}

@media (min-width: 768px) {
    .hotel-search-box {
        padding: 24px;
    }

    .hotel-search-box2 {
        flex-direction: row;
        flex-wrap: wrap;
    }

    .col-guests2 {
        flex: 1 1 50%;
        width: 50%;
    }

    .col-update-search {
        flex: 1 1 50%;
        width: 50%;
        padding-left: 8px;
    }
}

@media (min-width: 992px) {
    .col-dates2 {
        flex: 1 1 40%;
        width: 40%;
    }

    .col-guests2 {
        flex: 1 1 35%;
        width: 35%;
        padding-left: 8px;
    }

    .col-update-search {
        flex: 1 1 25%;
        width: 25%;
    }
}

@media (min-width: 1200px) {
    .hotel-search-box {
        flex-direction: row;
    }

    .col-dates2 {
        flex: 1 1 40%;
        width: 40%;
    }

    .col-guests2 {
        flex: 1 1 35%;
        width: 35%;
        padding-left: 0px;
    }

    .col-update-search {
        flex: 1 1 25%;
        width: 25%;
    }
}

@media (min-width: 1600px) {
    .col-dates2 {
        flex: 1 1 40%;
        width: 40%;
    }

    .col-guests2 {
        flex: 1 1 40%;
        width: 40%;
    }

    .col-update-search {
        flex: 1 1 20%;
        width: 20%;
    }
}

/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
/* Chapter 11 - tab structure style  
 /* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
.search-tabs-container {
    display: flex;
    flex-direction: column;
    background-color: var(--tertiary-color);
    box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.16);
}

.tabs {
    /*border: solid 2px orangered;*/
    display: flex;
    flex-direction: row;
    background-color: var(--primary-color-lite);
    overflow-x: auto;
}

.tab {
    /*border: solid 1px blue;*/
    cursor: pointer;
    color: #fff;
    text-transform: uppercase;
    margin-bottom: unset;
    font-weight: 600;
    letter-spacing: 1px;
    /* 1.7 */
    font-size: 15px;
    padding: 20px;
}

.panels {
    width: 100%;
    /*overflow:hidden;*/
}

.panel {
    display: none;
    animation: fadein .8s;
}

@keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

.panel-title {
    font-size: 1.5em;
    font-weight: bold
}

.radio {
    display: none;
}

#one:checked ~ .panels #one-panel,
#two:checked ~ .panels #two-panel,
#three:checked ~ .panels #three-panel,
#four:checked ~ .panels #four-panel,
#eleven:checked ~ .panels #eleven-panel {
    display: block
}

#one:checked~.tabs #one-tab,
#two:checked~.tabs #two-tab,
#three:checked~.tabs #three-tab,
#four:checked ~ .tabs #four-tab,
#eleven:checked~.tabs #eleven-tab,
.active-tab {
    background-color: rgba(255, 255, 255, 0.8);
    color: var(--primary-color);
    pointer-events: none;
}

@media (min-width: 768px) {
    .tab {
        letter-spacing: 1.7px;
        font-size: 16px;
        padding: 23px 33px;
    }
}

@media (min-width: 1200px) {
    .tab {
        font-size: 17px;
        padding: 27px 36px;
    }
}

/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
/* Chapter 12 - hotel search result / listing style
 /* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
.color-red {
    color: var(--red-color);
}

.color-green {
    color: var(--green-color);
}

.color-grey {
    color: var(--grey-color);
}

.hotel-search-filter-box {
    padding: var(--responsive-margin-padding);
    background-color: #fff;
    box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.1);
    border-radius: var(--buttonradius);
}

.filter-container {
    border-bottom: solid 2px #EBECF0;
    padding-bottom: var(--responsive-margin-padding);
    margin-bottom: var(--responsive-margin-padding);
}

.hotel-search-filter-box .filter-container:last-child {
    border-bottom: none;
    padding-bottom: 0px;
    margin-bottom: 0px;
}

.hotel-map-box {
    position: relative;
    height: 210px;
    /* 370 */
    width: 100%;
    box-shadow: 0px 1px 10px #0000001A;
    border-radius: var(--buttonradius);
    border: solid 1px #EBECF0;
    /*display: flex;*/
    justify-content: center;
    align-items: center;
}

.open-map-button {
    position: absolute;
    width: 100%;
    bottom: 0;
}

.open-map-button button {
    width: 100%;
}

.filter-property {
    /*border: solid 1px red;*/
}

.textbox-with-icon {
    position: relative;
}

.textbox-with-icon input[type="text"] {
    border-radius: 2px;
    min-height: 52px;
}

.textbox-with-icon input[type="text"],
.selectbox-with-icon select,
.selectbox-with-icon2 select {
    width: 100%;
    outline: none;
    border: none;
    padding: 8px 16px;
    transition: 0.3s;
    box-shadow: 0px 1px 10px #00000029;
}

.textbox-with-icon i {
    position: absolute;
    right: 16px;
    top: 18px;
    font-size: 16px;
    color: var(--primary-color);
    transition: 0.3s;
}

.selectbox-with-icon,
.selectbox-with-icon2 {
    position: relative;
    display: block;
    height: 52px;
    line-height: 52px;
    border-radius: var(--buttonradius);
    overflow: hidden;
    box-shadow: 0px 1px 10px #00000029;
}

.selectbox-with-icon select,
.selectbox-with-icon2 select {
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    appearance: none;
    outline: 0;
    background-image: none;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0 0 0 8px;
    cursor: pointer;
    font-weight: 500;
}

.selectbox-with-icon::after,
.selectbox-with-icon2::after {
    content: '\f078';
    font-family: 'Font Awesome 5 Pro';
    font-weight: 900;
    color: var(--primary-color);
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    padding: 0 1em;
    pointer-events: none;
}

.star-rating-box i {
    /*color: var(--star-color);
   font-size: 22px;*/
}

.hotel-search-sort-box {
    /* border: solid 1px blue; */
    margin-top: var(--responsive-margin-padding);
}

.sort-header {
    color: var(--primary-color);
    font-weight: 500;
    margin-bottom: 12px;
}

.sort-para-box {
    /* border: solid 1px cyan; */
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    flex-wrap: wrap;
}

.selectbox-with-icon {
    /*border: solid 1px red;*/
    flex: 0 0 48%;
    width: 48%;
    margin-bottom: 10px;
}

.selectbox-with-icon2 {
    /*border: solid 1px red;*/
    flex: 0 0 100%;
    width: 100%;
}

.hotel-search-list-box {
    /*border: solid 1px orange;*/
}

.single-hotel-box-container {
    /*border: 1px solid #E0EAFC;*/
    box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.16);
    margin-top: 16px;
}

.single-hotel-box {
    position: relative;
    background-color: var(--tertiary-color);
    padding: var(--responsive-margin-padding);
    display: flex;
    flex-direction: column;
}

.col-hotel-data {
    /*border: solid 1px black;*/
    background-color: #fff;
    box-shadow: 0px 1px 10px #00000029;
    border-radius: var(--buttonradius);
    padding: 8px;
    /* 12 */
    flex: 1 1 65%;
    display: flex;
    flex-direction: column;
}

.col-price-data {
    /* border: solid 2px greenyellow; */
    text-align: right;
    flex: 1 1 31%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 8px 0px;
    margin: 0px 0px 0px 0px;
    /* left 24 */
}

.hotel-offer {
    position: absolute;
    top: -10px;
    /* -12 */
    left: 0;
    background: #275189;
    color: #fff;
    border-radius: 9px 0 0 0;
    font-size: 8px;
    /* 10px */
    font-weight: 600;
    padding: 2px 4px;
    /* 4 6 */
    text-transform: uppercase;
}

.hotel-thumbnail {
    /*border: solid 2px red;*/
    flex: 0 0 160px;
    width: 100%;
    height: 160px;
    overflow: hidden;
    border-radius: 6px;
}

.hotel-thumbnail img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    /* contain-width & cover-height */
    object-position: center center;
}

.hotel-details {
    margin-left: 0px;
    flex: 1 1 100%;
}

.star-ratings {
    margin: 4px 0px 8px;
    /*border: solid 1px grey;*/
}

.no-star-ratings {
    height: 23px;
}

.no-hotel-info {
    height: 28px;
    /* 20 height + 8 margin */
}

.star-ratings,
.star-ratings2 {
    color: var(--star-color);
}

.hotel-name,
.hotel-name2,
.hotel-name3 {
    text-transform: uppercase;
    letter-spacing: 1.7px;
    font-weight: bold;
    /*border: solid 1px lightgray;*/
}

.hotel-name,
.hotel-name2 {
    margin-bottom: var(--responsive-margin-padding);
}

.hotel-name3 {
    margin-bottom: 8px;
}

.hotel-info,
.hotel-address,
.hotel-map-link,
.hotel-info2,
.hotel-info3,
.hotel-address2,
.transfer-info {
    font-weight: 600;
    /*border: solid 1px darkgray;*/
}

.hotel-info3 {
    color: var(--primary-color);
}

.hotel-info,
.hotel-address,
.hotel-info2,
.hotel-info3,
.hotel-address2 {
    margin-top: 8px;
    /* 12 */
    display: flex;
    flex-direction: row;
    align-items: center;
}

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

.hotel-info i,
.hotel-address i,
.transfer-info i {
    text-align: center;
}

.hotel-info i,
.hotel-address i,
.hotel-info2 i,
.hotel-address2 i,
.transfer-info i {
    display: block;
    min-width: 24px;
}

.hotel-info2 i,
.hotel-address2 i {
    color: var(--secondary-color);
    text-align: left;
}

.hotel-info span,
.hotel-address span,
.hotel-info2 span,
.hotel-address2 span,
.transfer-info span {
    padding-left: 8px;
}

.hotel-address3,
.text-treatment,
.text-facility {
    font-size: 10px;
}

.hotel-address3,
.text-facility {
    color: var(--grey-color);
}

.hotel-map-link {
    padding-left: 32px;
}

.hotel-map-link a {
    text-decoration: underline;
}

.hotel-price {
    text-transform: uppercase;
    font-weight: bold;
    color: var(--secondary-color);
    letter-spacing: 1.8px;
    /*border: solid 1px lightgray;*/
    text-align: right;
}

.hotel-price span.rate {}

.hotel-fav-heart {
    color: var(--grey-color);
}

.hotel-fav-heart i {
    display: block;
    min-width: 24px;
    text-align: center;
    padding-left: 8px;
    color: #E94848;
}

.fav-hotel-check label {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
    cursor: pointer;
}

.fav-hotel-check label span {
    display: block;
}

.fav-hotel-check input[type="checkbox"],
.fav-hotel-check .checked {
    display: none;
}

.fav-hotel-check input[type="checkbox"]:checked~.checked {
    display: block;
}

.fav-hotel-check input[type="checkbox"]:checked~.unchecked {
    display: none;
}

.hotel-fav-heart,
.hotel-detail-btn {
    margin-top: 8px;
}

.hotel-detail-btn {
    align-self: flex-end;
    /*border: solid 1px lightskyblue;*/
}

.hotel-detail-btn .btn {
    width: 100%;
    max-width: 250px;
    background-color: #fff;
    color: var(--primary-color);
    border: solid 1px var(--primary-color);
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0px 16px;
    /* 0px 16px */
}

.single-hotel-more-box {}

.show-more-rooms-bar {
    background-color: #fff;
    position: relative;
}

.show-more-rooms-bar .fl-more {
    /*border: solid 1px cyan;*/
    display: flex;
    flex: 0 0 100%;
    width: 100%;
    min-height: 50px;
    /*flex: 1;*/
    align-items: center;
    justify-content: center;
    color: var(--primary-color);
    font-weight: 500;
    cursor: pointer;
    transition: all 0.3s;
}

.show-more-rooms-bar .fl-more.active {
    background-color: #DFEFFB;
}

.show-more-rooms-bar .fl-more i {
    margin-left: 8px;
    transition: transform 0.3s;
}

.show-more-rooms-bar .fl-more.active i {
    transform: rotate(180deg);
}

.accordion-more-rooms-content,
.accordion-more-rooms-content2 {
    display: none;
    /*padding: var(--responsive-margin-padding);*/
}

.more-rooms-content-box {
    /*border: solid 1px cyan;*/
    margin-bottom: 10px;
}

.room-option-box,
.room-header-box {
    /*border: solid 1px blue;*/
    display: flex;
    flex-direction: column;
    border-bottom: solid 1px var(--grey-color);
    margin-left: var(--responsive-margin-padding);
    margin-right: var(--responsive-margin-padding);
    margin-bottom: 12px;
    padding: 4px;
}

.room-header-box {
    margin-top: var(--responsive-margin-padding);
    text-transform: uppercase;
}

.room-option-box {
    border: solid 1px #e6e6e6;
    border-radius: var(--buttonradius);
}

.room-header-box .col-accommodation,
.room-header-box .col-occupants,
.room-header-box .col-treatments,
.room-header-box .col-farerules,
.room-header-box .col-farerules-header,
.room-header-box .col-promotion-header {
    font-weight: 600;
}

.rooms-info {
    /*border: solid 1px grey;*/
    display: flex;
    flex: 1 1 100%;
    width: 100%;
    flex-direction: column;
    justify-content: space-evenly;
    /*background-color: cyan;*/
}

.room-price {
    /*border: solid 1px lightgray;*/
    flex: 1 1 100%;
    width: 100%;
    display: flex;
    flex-direction: row;
    /*justify-content: space-between;*/
    align-items: center;
    flex-wrap: wrap;
    padding: 5px 0px 0px;
    /*background-color: yellow;*/
}

.row-room-info {
    /*border: solid 1px lime;*/
    width: 100%;
    border-bottom: solid 1px #DFEFFB;
    padding: 5px 0px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}

.room-header-box .row-room-info {
    border-bottom: none;
}

.col-accommodation,
.col-occupants,
.col-treatments,
.col-farerules,
.col-promotion {
    /*border: solid 1px black;*/
    font-weight: 500;
}

.col-accommodation {
    flex: 0 0 53%;
    padding-right: 5px;
}

.col-occupants {
    flex: 0 0 22%;
}

.col-treatments {
    flex: 0 0 25%;
}

.col-room-price,
.col-cart-btn {
    /*border: solid 1px grey;*/
}

.col-promotion,
.col-promotion-header {
    flex: 0 0 25%;
    width: 25%;
    /*border: solid 2px cyan;*/
}

.col-farerules,
.col-farerules-header {
    flex: 0 0 25%;
    width: 25%;
    /*border: solid 2px red;*/
}

.col-room-price {
    flex: 0 0 33%;
    /* 35 */
    width: 33%;
    text-align: right;
}

.col-cart-btn {
    flex: 0 0 17%;
    /* 15 */
    width: 17%;
    display: flex;
    justify-content: flex-end;
}

.col-farerules-header,
.col-promotion-header {
    display: none;
}

.row-supplier-info {
    /*border: solid 1px red;*/
    /*background-color: lime;*/
    flex: 0 0 100%;
    width: 100%;
    text-align: right;
}

.row-supplier-info .supplier-code {
    font-size: 10px;
    letter-spacing: 1.1px;
    color: var(--grey-color);
}

.text-tariff {
    font-size: 17px;
    font-weight: 700;
}

.hotel-cart-ico {}

.slider-strips {
    padding-top: 8px;
}

@media (min-width: 375px) {}

@media (min-width: 576px) {}

@media (min-width: 768px) {
    .single-hotel-box-container {
        margin-top: 24px;
    }

    .col-hotel-data {
        flex-direction: row;
        padding: 12px;
    }

    .hotel-details {
        margin-left: 12px;
    }

    .col-price-data {
        flex-direction: row;
        /* align-items: center; */
        padding: 12px 0px 0px 12px;
    }

    .hotel-offer {
        top: -11px;
        /* -12 */
        left: 0;
        font-size: 9px;
        /* 10px */
        padding: 3px 5px;
        /* 4 6 */
    }

    .hotel-price {
        text-align: left;
    }

    .hotel-address3,
    .text-treatment,
    .text-facility {
        font-size: 11px;
    }

    .hotel-fav-heart,
    .hotel-detail-btn {
        margin-top: 0px;
    }

    .selectbox-with-icon {
        flex: 0 0 24%;
        width: 24%;
        margin-bottom: 0px;
    }

    .col-promotion,
    .col-promotion-header {
        flex: 0 0 30%;
        width: 30%;
    }

    .col-farerules,
    .col-farerules-header {
        flex: 0 0 36%;
        width: 36%;
    }

    .col-room-price {
        flex: 0 0 25%;
        /* 35 */
        width: 25%;
    }

    .col-cart-btn {
        flex: 0 0 9%;
        /* 15 */
        width: 9%;
    }

    .hotel-thumbnail {
        height: 150px;
    }
}

@media (min-width: 992px) {}

@media (min-width: 1200px) {
    .single-hotel-box-container {
        margin-top: 32px;
    }

    .single-hotel-box {
        flex-direction: row;
    }

    .hotel-name3 {
        margin-bottom: 12px;
    }

    .hotel-address3,
    .text-treatment,
    .text-facility {
        font-size: 12px;
    }

    .hotel-info,
    .hotel-address,
    .hotel-info2,
    .hotel-info3,
    .hotel-address2 {
        margin-top: 12px;
    }

    .col-price-data {
        flex-direction: column;
        padding: 0px;
        margin: 0px 0px 0px 12px;
        /* align-items: unset; */
        /* left 24 */
    }

    .hotel-offer {
        top: -12px;
        /* -12 */
        left: 0;
        font-size: 10px;
        /* 10px */
        padding: 4px 6px;
        /* 4 6 */
    }

    .hotel-price {
        text-align: right;
    }

    .hotel-detail-btn {
        align-self: unset;
    }

    .hotel-detail-btn .btn {
        width: 100%;
        max-width: unset;
    }

    .room-option-box {
        border: solid 1px transparent;
        border-radius: unset;
    }

    .room-option-box,
    .room-header-box {
        flex-direction: row;
        border-bottom: solid 1px var(--grey-color);
        margin-bottom: 0px;
        padding: 0px 0px 12px 0px;
    }

    .rooms-info {
        flex: 1 1 50%;
        width: 50%;
    }

    .room-price {
        flex: 1 1 50%;
        width: 50%;
        padding: 0px 0px 0px;
    }

    .col-farerules-header,
    .col-promotion-header {
        display: block;
    }

    .rooms-info .row-room-info:last-child {
        border-bottom: none;
    }

    .text-tariff {
        letter-spacing: 1.1px;
    }

    .col-promotion,
    .col-promotion-header {
        flex: 0 0 25%;
        width: 25%;
    }

    .col-farerules,
    .col-farerules-header {
        flex: 0 0 25%;
        width: 25%;
    }

    .col-room-price {
        flex: 0 0 35%;
        width: 35%;
    }

    .col-cart-btn {
        flex: 0 0 15%;
        width: 15%;
    }

    .room-header-box {
        text-transform: capitalize;
    }

    .no-star-ratings {
        height: 25px;
    }

    .no-hotel-info {
        height: 34px;
        /* 22 height + 12 margin */
    }

    .hotel-thumbnail {
        height: 175px;
    }
}

@media (min-width: 1400px) {
    .col-hotel-data {
        flex: 1 1 67%;
    }

    .col-price-data {
        flex: 1 1 28%;
    }

    .col-price-data {
        margin: 0px 0px 0px 24px;
        /* left 24 */
    }

    .selectbox-with-icon {
        flex: 0 0 23%;
        width: 23%;
        margin-bottom: 0px;
    }

    .rooms-info {
        /*flex: 1 1 50%;
     width: 50%;*/
    }

    .room-price {
        /*flex: 1 1 50%;
     width: 50%;*/
    }

    .text-tariff {
        font-size: 18px;
        letter-spacing: 1.4px;
    }

    .col-promotion,
    .col-promotion-header {
        flex: 0 0 25%;
        width: 25%;
    }

    .col-farerules,
    .col-farerules-header {
        flex: 0 0 27%;
        width: 27%;
    }

    .col-room-price {
        flex: 0 0 34%;
        width: 34%;
    }

    .col-cart-btn {
        flex: 0 0 14%;
        width: 14%;
    }

    .room-header-box {
        text-transform: uppercase;
    }

    .hotel-thumbnail {
        height: 185px;
    }
}

@media (min-width: 1920px) {
    .col-hotel-data {
        flex: 1 1 69%;
    }

    .col-price-data {
        flex: 1 1 27%;
    }
}

/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
/* Chapter 13 - hotel detail page style
 /* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
.hotel-metadata-box,
.hotel-rate-box,
.available-rooms-box {
    padding: var(--responsive-margin-padding);
}

.hotel-metadata-box,
.list-back-link,
.hotel-rate-box {
    margin-bottom: var(--responsive-margin-padding);
}

.hotel-metadata-box,
.available-rooms-box {
    background-color: var(--tertiary-color);
    box-shadow: 0px 1px 10px #00000029;
}

.list-back-link {
    text-transform: uppercase;
    font-weight: 600;
    letter-spacing: 1.4px;
}

.list-back-link a,
.list-back-link a:hover {
    text-decoration: none;
}

.list-back-link i,
.list-back-link span {
    display: inline-block;
}

.list-back-link span {
    margin-left: 10px;
}

.hotel-rate-box {
    /*border: solid 1px blue;*/
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    box-shadow: 0px 1px 10px #00000029;
    background-color: #fff;
}

.hotel-rb-name {
    flex: 1;
    /*border: solid 1px cyan;*/
}

.hotel-rb-rate {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    flex: 1;
    /*max-width: 270px;*/
    /*border: solid 1px red;*/
    text-align: right;
    margin-top: 10px;
}

.see-rooms-btn {
    margin-top: 10px;
    align-self: flex-end;
}

.see-rooms-btn button {
    width: 210px;
}

.hotel-photo-map-box {
    /*border: solid 1px darkmagenta;*/
    display: flex;
    flex-direction: column;
}

.hotel-photos-container {
    /*border: solid 5px cyan;*/
    flex: 1;
}

.hotel-photos-container2 {
    /*border: solid 5px cyan;*/
    flex: 1;
    width: 100%;
}

.hotel-map-box-container {
    /*border: solid 1px red;*/
    width: 100%;
    margin-top: 10px;
}

.available-rooms-box {
    position: relative;
}

.available-rooms-child {
    background-color: #fff;
    box-shadow: 0px 1px 10px #00000029;
    border-radius: var(--buttonradius);
    padding-top: var(--responsive-margin-padding);
    padding-bottom: var(--responsive-margin-padding);
}

.available-dates {
    font-weight: 600;
    padding-left: var(--responsive-margin-padding);
    padding-bottom: var(--responsive-margin-padding);
    border-bottom: solid 1px #DFEFFB
}

.available-dates i {
    color: var(--secondary-color);
    padding-right: 10px;
}

.hr-primary {
    border-top: solid 1px var(--primary-color);
    margin-top: var(--responsive-margin-padding);
    margin-bottom: var(--responsive-margin-padding);
}

.description-box {
    display: flex;
    flex-direction: column;
}

.structure-desc-box,
.services-box {
    box-shadow: 0px 1px 10px #00000029;
    padding: var(--responsive-margin-padding);
    background-color: #fff;
}

.structure-desc-box {
    flex: 1 1 70%;
}

.services-box {
    flex: 1 1 30%;
    margin-left: 0;
    margin-top: var(--responsive-margin-padding);
}

.description-header {
    font-weight: bold;
    text-transform: uppercase;
    margin-bottom: var(--responsive-margin-padding);
    letter-spacing: 2.1px;
}

.description-text {
    text-align: justify;
}

.description-list {
    padding-left: 0px;
    list-style-position: inside;
    list-style: none;
}

.description-list li {}

.description-list li:before {
    font-family: 'Font Awesome 5 Pro';
    font-weight: 900;
    content: '\f111';
    font-size: 10px;
    padding-right: 10px;
}

@media (min-width: 768px) {
    .hotel-rate-box {
        flex-direction: row;
    }

    .hotel-rb-name {
        flex: 2;
    }

    .hotel-rb-rate {
        margin-top: 0px;
    }

    .hotel-map-box {
        height: 370px;
    }
}

@media (min-width: 992px) {
    .description-box {
        flex-direction: row;
    }

    .services-box {
        flex: 1 1 30%;
        margin-left: var(--responsive-margin-padding);
        margin-top: 0;
    }
}

@media (min-width: 1200px) {
    .hotel-rb-name {
        flex: 3;
    }

    .hotel-photo-map-box {
        flex-direction: row;
    }

    .hotel-map-box-container {
        max-width: 370px;
        margin-top: 0px;
        margin-left: 24px;
    }

    .hotel-map-box {
        height: 300px;
    }
}

@media (min-width: 1400px) {
    .hotel-map-box {
        height: 310px;
    }
}

/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
/* Chapter 14 - rate matrix / calendar search style
 /* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
.matrix-container,
.sw-airline-matrix-container {
    margin-top: var(--responsive-margin-padding);
    background-color: var(--tertiary-color);
    border: 1px solid var(--tertiary-color);
    box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.16);
    padding: var(--responsive-margin-padding);
    border-radius: var(--buttonradius);
    /*border: solid 2px red;*/
}

.rate-matrix-box {}

.rate-row {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    background-color: #fff;
}

.rate-col {
    border-top: solid 1px #dfdfdf;
    border-left: solid 1px #dfdfdf;
    text-align: center;
    font-weight: 500;
    display: flex;
    justify-content: center;
    align-items: center;
    flex: 1 1 12.5%;
    width: 12.5%;
    height: 50px;
    /* 60 */
    padding: 0px 0px;
    /* 8 */
    cursor: pointer;
}

.rate-col:hover {
    background-color: var(--secondary-color);
}

.rate-row .rate-col:last-child {
    border-right: solid 1px #dfdfdf;
}

.rate-matrix-box .rate-row:last-child .rate-col {
    border-bottom: solid 1px #dfdfdf;
}

.rate-row .rate-col:first-child {
    font-weight: 600;
    justify-content: flex-start;
}

.rate-row .rate-col:first-child:hover {
    background-color: unset;
    cursor: unset;
}

.rate-row .rate-col:first-child.suggested-row-col:first-child:hover {
    background-color: rgba(13, 138, 228, 0.6);
}

.rate-matrix-box .rate-row:first-child .rate-col {
    font-weight: 600;
}

.rate-matrix-box .rate-row:first-child .rate-col:hover {
    background-color: unset;
    cursor: unset;
}

.rate-matrix-box .rate-row:first-child .suggested-row-col:hover {
    background-color: rgba(13, 138, 228, 0.6);
}

.rate-col span,
.m-l-10,
.sw-airline-matrix td {
    font-size: 8px;
}

.lowest-rate,
.lowest-rate-i {
    background-color: #ccffdd;
    font-weight: 600;
}

.highest-rate,
.highest-rate-i {
    background-color: #ffb3b3;
    font-weight: 600;
}

.suggested-rate {
    background-color: var(--primary-color);
    color: #fff;
    font-weight: 600;
}

.suggested-row-col {
    background-color: rgba(0, 84, 155, 0.6);
    color: #fff;
}

.price-indicator-row {
    display: flex;
    flex-direction: row;
    align-items: center;
    margin-top: var(--responsive-margin-padding);
}

.indicator-box {
    height: 20px;
    /* 30 */
    width: 20px;
    border: solid 1px #dfdfdf;
    border-radius: var(--buttonradius);
}

.m-l-10 {
    margin-left: 10px;
    font-weight: 600;
}

.col-info {
    display: unset;
    color: var(--primary-color);
}

.col-info-child {
    position: relative;
}

.col-info .info-right {
    position: absolute;
    right: 0px;
    top: 5px;
}

.col-info .info-left {
    position: absolute;
    left: 0px;
    top: 31px;
}

.col-info .info-right i,
.col-info .info-left i {
    color: var(--secondary-color);
}

@media (min-width: 768px) {
    .rate-col {
        height: 54px;
        padding: 0px 4px;
    }

    .rate-col span,
    .m-l-10,
    .sw-airline-matrix td {
        font-size: 10px;
        letter-spacing: 1px;
    }

    .indicator-box {
        height: 24px;
        width: 24px;
    }
}

@media (min-width: 1200px) {
    .rate-col {
        height: 58px;
        padding: 0px 8px;
    }

    .rate-col span,
    .m-l-10,
    .sw-airline-matrix td {
        font-size: 12px;
    }

    .indicator-box {
        height: 28px;
        width: 28px;
    }
}

@media (min-width: 1600px) {
    .rate-col {
        height: 60px;
        padding: 0px 10px;
    }

    .rate-col span,
    .m-l-10,
    .sw-airline-matrix td {
        font-size: 14px;
    }

    .indicator-box {
        height: 30px;
        width: 30px;
    }
}

/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
/* Chapter 15 - Star ratings filter style
 /* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
.stella-rating {
    position: relative;
    float: left;
    margin-bottom: 0px;
    color: var(--star-color);
    cursor: pointer;
}

.stella-rating input[type="checkbox"],
.stella-rating .checked {
    display: none;
}

.stella-rating input[type="checkbox"]:checked~.checked {
    display: inline-block;
    color: var(--star-color);
}

.stella-rating input[type="checkbox"]:checked~.unchecked {
    display: none;
    color: var(--star-color);
}

.stella-rating span:before {
    font-family: 'Font Awesome 5 Pro';
    font-weight: 400;
    content: '\f006';
}

.stella-rating input[type="checkbox"]:checked~span:before {
    font-family: 'Font Awesome 5 Pro';
    font-weight: 900;
    content: '\f005';
}

.stella-number-filter {
    position: absolute;
    top: 9px;
    left: 13px;
    font-size: 10px;
    display: inline-block;
    color: var(--star-color);
    font-weight: 600;
}

.stella-rating input[type="checkbox"]:checked~.checked~.stella-number {
    color: #fff;
}

.stella-rating input[type="checkbox"]:checked~.checked~.stella-number-filter {
    color: #fff;
}

/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */

/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
/* Chapter 16 - Hotel info inside map
 /* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */

.hotel-info-mono {
    /*border: solid 1px red;*/
}

.hotel-box-mono {
    border: solid 1px #fff;
    position: relative;
    /*border: solid 1px transparent;*/
    display: flex;
    flex-direction: column;
    background-color: #fff;
    width: 100%;
    max-width: 450px;
    border-radius: 4px;
    box-shadow: 0px 1px 10px #00000029;
}

.hotel-box-mono .close {
    position: absolute;
    right: 1px;
    top: 1px;
    background-color: #fff;
    cursor: pointer;
}

.hotel-box-mono .close i {
    font-size: 18px;
    color: red;
}

.hotel-box-mono .pointer {
    position: absolute;
    left: calc(50% - 11px);
    bottom: -16px;
    cursor: pointer;
}

.hotel-box-mono .pointer i {
    font-size: 32px;
    color: var(--primary-color);
    display: block;
    height: 26px;
    width: 22px;
}

.hotel-box-mono .hotel-ratings {
    position: absolute;
    top: -1px;
    left: -1px;
    background-color: rgba(13, 138, 228, 0.9);
    color: #fff;
    text-align: center;
    padding: 8px;
    border-radius: 4px;
}

.hotel-box-mono .hotel-ratings .digit {
    font-weight: 500;
    font-size: 13px;
}

.hotel-box-mono .hotel-ratings .text {
    font-weight: 400;
    font-size: 10px;
}

.hotel-box-mono .col-hotel-data {
    /*border: solid 1px black;*/
    padding: 8px;
    flex: 1 1 100%;
    display: flex;
    flex-direction: column;
    background-color: #fff;
    border-radius: 4px;
}

.hotel-box-mono .hotel-thumbnail {
    flex: 0 0 150px;
    width: 100%;
    height: 150px;
    overflow: hidden;
    border-radius: 4px;
}

.hotel-box-mono .hotel-thumbnail img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    /* contain-width & cover-height */
    object-position: center center;
    border-radius: 4px;
}

.hotel-box-mono .hotel-details {
    margin-left: 8px;
    flex: 1 1 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
}

.hotel-box-mono .star-ratings {
    margin: 0px 0px 4px;
    color: #DFD04A;
}

.hotel-box-mono .no-star-ratings {
    height: 18px;
}

.hotel-box-mono .hotel-name {
    font-size: 13px;
    text-transform: uppercase;
    font-weight: bold;
}

.hotel-box-mono .hotel-name a {
    color: var(--secondary-color);
    text-decoration: none;
}

.hotel-box-mono .hotel-name a:hover {
    text-decoration: underline;
}

.hotel-box-mono .star-ratings,
.hotel-box-mono .hotel-address {
    font-size: 10px;
}

.hotel-box-mono .room-info {
    font-size: 11px;
}

.hotel-box-mono .hotel-address {
    color: grey;
    margin-bottom: 8px;
}

.hotel-box-mono .hotel-address,
.hotel-box-mono .room-info {
    font-weight: 600;
    margin-top: 4px;
    display: flex;
    flex-direction: row;
    align-items: center;
}

.hotel-box-mono .hotel-address i {
    text-align: center;
    display: block;
    min-width: 16px;
}

.hotel-box-mono .hotel-address span {
    padding-left: 4px;
}

.hotel-box-mono .room-price {
    font-weight: bold;
    margin-top: 8px;
    font-size: 20px;
    color: var(--secondary-color);
}

@media (min-width: 768px) {
    .hotel-box-mono .col-hotel-data {
        flex-direction: row;
    }
}

/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
/* Chapter 17 - owl carousel image slider style
 /* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
.owl-next,
.owl-prev {
    width: 22px;
    height: 40px;
    margin-top: -20px;
    position: absolute;
    top: 50%;
}

.owl-prev {
    left: 10px;
}

.owl-next {
    right: 10px;
}

.slider {
    /*width:900px;*/
    margin: 0 auto;
    margin-bottom: 10px;
}

.navigation-thumbs {
    /*width:900px; */
    margin: 0 auto;
}

.slider .item {
    /*border: solid 1px blue;*/
    flex: 0 0 500px;
    width: 100%;
    height: 250px;
    overflow: hidden;
}

.slider .item img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    /* contain-width & cover-height */
    object-position: center center;
}

.navigation-thumbs .item {
    /*border: solid 1px red;*/
    flex: 0 0 80px;
    width: 100%;
    height: 35px;
    overflow: hidden;
}

.navigation-thumbs .item img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    /* contain-width & cover-height */
    object-position: center center;
}

.dd-adv-fl-hr,
.dd-adv-fl-min {
    margin-right: 8px;
    min-width: 50%;
}

.frm-dropdown-adv-fl-hr,
.frm-dropdown-adv-fl-min {
    min-width: 100%;
}

@media (min-width: 768px) {
    .slider .item {
        height: 400px;
    }

    .navigation-thumbs .item {
        height: 60px;
    }
}

@media (min-width: 1200px) {
    .hotel-photos-container2 {
        width: 1px;
    }

    .slider .item {
        height: 400px;
    }

    .navigation-thumbs .item {
        height: 60px;
    }
}

@media (min-width: 1440px) {
    .slider .item {
        height: 450px;
    }

    .navigation-thumbs .item {
        height: 70px;
    }
}

@media (min-width: 1920px) {
    .slider .item {
        height: 500px;
    }

    .navigation-thumbs .item {
        height: 80px;
    }
}

/*
 /* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
/* Chapter 18 - airline matrix style
 /* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
.sw-airline-matrix-container {
    overflow: auto;
    width: 360px;
}

.sw-airline-matrix {
    /*border: solid 1px red;*/
    width: 100%;
}

.sw-airline-matrix td {
    border: solid 1px #dfdfdf;
    background-color: #fff;
    text-align: center;
    font-weight: 500;
    cursor: pointer;
    padding: 5px 0 5px 5px;
}

.sw-airline-matrix td:hover {
    /*background-color: #E4740D;*/
}

.sw-airline-matrix td.suggested-rate {
    background-color: var(--primary-color);
    color: #fff;
    font-weight: 600;
}

.sw-airline-matrix td:first-child {
    text-align: left;
    width: 200px;
    font-weight: 600;
    cursor: unset;
    padding-left: 10px;
}

.sw-airline-matrix tr:first-child td {
    cursor: unset;
}

.sw-airline-matrix td.rate-row {
    background-color: unset;
}

.sw-airline-matrix td.rate-row .rate-col {
    border: unset;
}

.sw-airline-matrix-logo {
    height: 100%;
    width: 100%;
    text-align: center;
    /*border: solid 1px red;*/
}

.sw-airline-matrix-logo img {
    width: 50px;
    object-fit: contain;
    /* contain-width & cover-height */
    object-position: center center;
}

.col-info-child2 {
    position: relative;
    min-height: 80px;
    color: var(--primary-color);
}

.info-right2 {
    position: absolute;
    right: 3px;
    top: 3px;
}

.info-left2 {
    position: absolute;
    left: 0px;
    bottom: 3px;
}

.info-right2 i,
.info-left2 i {
    color: var(--secondary-color);
}

.sw-nodata {
    cursor: not-allowed !important;
    color: var(--grey-color);
}

@media (min-width: 390px) {
    .sw-airline-matrix-container {
        width: 375px;
    }
}

@media (min-width: 411px) {
    .sw-airline-matrix-container {
        width: 400px;
    }
}

@media (min-width: 428px) {
    .sw-airline-matrix-container {
        width: 413px;
    }
}

@media (min-width: 768px) {
    .sw-airline-matrix-container {
        width: 736px;
    }
}

@media (min-width: 810px) {
    .sw-airline-matrix-container {
        width: 778px;
    }
}

@media (min-width: 820px) {
    .sw-airline-matrix-container {
        width: 788px;
    }
}

@media (min-width: 834px) {
    .sw-airline-matrix-container {
        width: 802px;
    }
}

@media (min-width: 1024px) {
    .sw-airline-matrix-container {
        width: 718px;
    }
}

@media (min-width: 1200px) {
    .sw-airline-matrix-container {
        width: 886px;
    }
}

@media (min-width: 1280px) {
    .sw-airline-matrix-container {
        width: 826px;
    }
}

@media (min-width: 1440px) {
    .sw-airline-matrix-container {
        width: 966px;
    }
}

@media (min-width: 1920px) {
    .sw-airline-matrix-container {
        width: 1052px;
    }
}

/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
/* datepicker customisation style  
/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */
/* .datepicker {
    border: solid 1px var(--first-color);
    border-radius: var(--radius);
    box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.16);
    font-size: var(--font-nano);
    color: var(--first-color);
    font-family: unset;
    z-index: 3;
    left: -12px;
    top: calc(100% + 18px);
}

.datepicker__close-button,
.datepicker__clear-button,
.datepicker__submit-button {
    border-radius: var(--radius);
    text-transform: uppercase;
}

.datepicker__close-button,
.datepicker__clear-button {
    background-color: var(--second-color);
}

.datepicker__submit-button {
    background-color: var(--first-color);
}

.datepicker__month-day--today {
    background-color: var(--first-color);
}

.datepicker__month-day--first-day-selected,
.datepicker__month-day--last-day-selected {
    background-color: var(--first-color-lite);
}

.datepicker__month {
    font-size: var(--font-nano);
}

.datepicker__week-name {
    font-size: var(--font-pico);
    font-weight: 500;
}

.datepicker__tooltip {
    background-color: var(--second-color);
    color: #fff;
    border-radius: var(--radius);
}

.datepicker__info--selected-label {
    color: var(--second-color);
} */

/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------- */

/*
 @media (min-width: 375px) {}
 
 @media (min-width: 576px) {}
 
 @media (min-width: 768px) {}
 
 @media (min-width: 992px) {}
 
 @media (min-width: 1200px) {}
 
 @media (min-width: 1400px) {}
 */