:root {
    --main-color: #3498DB;
    --button-color: black;
    --title-color: black;
    --text-color: black;
    --hover-bg-color: #ffddb3;
    --book-now-txt-color: rgba(108, 117, 125, 1);
    --membership-rate-price: #f29c1f;
    --title-font: 18px;
    --text-font: 14px;
    --spacing1x: 8px;
    --spacing1x: 8px;
    --spacing2x: 16px;
    --spacing3x: 24px;
    --spacing4x: 32px;
    --spacing5x: 48px;

    /* ===== Customer Brand Colours ===== */
    --brand-primary-red: #3498DB;
    /* Pantone 485C */
    --brand-black: #000000;
    /* Black */
    --brand-neutral-gray: #DADBDC;
    /* 20% Black */
    --brand-highlight-yellow: #FFE900;
    /* Pantone 803C */
    --brand-highlight-magenta: #DF1995;
    /* Pantone 225C */
    --brand-highlight-green: #74AA50;
    /* Pantone 7489C */
    --brand-highlight-blue: #307FE2;
    /* Pantone 2727C */
    --header-color: #103F54;
    --btn-color: #103F54;
    --text-color-2: #103F54;
}

/* font futura */
@font-face {
    font-family: "futura";
    src: url('https://ibookingu5.myghs.com/views/nhan/fonts/webfonts/Futura/futura_medium_bt.ttf') format('truetype');
    font-style: normal;
    font-weight: 400;
    font-display: swap;
}

/* font lemon */
@font-face {
    font-family: "lemon-sans";
    src: url('https://ibookingu5.myghs.com/views/nhan/fonts/webfonts/Lemon-Sans/fonnts.com-Lemon_Sans_Next_Cond_Bold.otf') format('opentype');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: "lemon-sans";
    src: url('https://ibookingu5.myghs.com/views/nhan/fonts/webfonts/Lemon-Sans/fonnts.com-Lemon_Sans_Next_Cond_Medium.otf') format('opentype');
    font-weight: 400;
    font-style: normal;
}

body {
    font-family: "futura";
    font-weight: 400;
    font-style: normal;
}

.hotel_item--title {
    font-family: "lemon-sans";
    font-weight: 700;
    font-style: normal;
    text-transform: uppercase;
}

#check_availability_button {
    font-weight: 700 !important;
    text-transform: uppercase;
}

body[data-chain-id='3'] .loyalty_modal--logo {
    filter: invert(1);
}

body[data-chain-id='3'] .corportate--signin {
    display: block;
    margin-top: 12px;
    background: white;
    border: solid 1px black;
    color: black;
}

body[data-chain-id='3'] .hotel_info--description p,
body[data-chain-id='3'] .hotel_info--description ul {
    background-color: #f5f5f5 !important;
}

.hotel_item--description--text p,
.room--desciption p,
.room--rate--description p,
.rate-info-modal_tnc div,
.rate--modal,
.room--modal,
#hotel_info--overview {
    font-family: 'futura';
    font-style: normal;
    font-weight: 400;
}

/* header */

body[data-chain-id='3'] .corp--sigin--btn {
    display: block;
}

.hotels--header--top {
    color: white !important;
    background: var(--header-color) !important;
}

.loyalty_modal--signup {
    color: var(--brand-black);
}

.hotels--header--top.active {
    margin-top: -107px !important;
}

.member--login .member--name {
    color: var(--brand-highlight-yellow) !important;
}

.member--logout--btn {
    color: white !important;
}

.booking--summary--wrapper,
.hotels--header--ri {
    font-size: 15px !important;
}

.hotels--header--li .logo img {
    height: 80px;
}

body[data-chain-id='3'] .hotels--header--bottom {
    top: 100px;
}

/* booking form */
body[data-chain-id='3'] .iB-widget--pc {
    border: 2px solid var(--btn-color) !important;
}

/* new custom  */
body[data-chain-id='3'] #check_availability_button {
    background: var(--btn-color);
    border-color: var(--btn-color);
    color: white;
}

#destination i,
#datepicker i,
#rooms i,
#coupon i {
    color: var(--btn-color) !important;
}

body[data-chain-id='3'] #dropdown_room_modal button {
    background-color: var(--btn-color);
}

body[data-chain-id='3'] .hotel_item--viewrates {
    background: var(--btn-color);
}

body[data-chain-id='3'] #submit_button,
body[data-chain-id='3'] .loyalty--signup_btn,
body[data-chain-id='3'] .filter_active,
body[data-chain-id='3'] .hotels--filter:hover {
    background-color: var(--btn-color) !important;
    border: 1px solid var(--btn-color) !important;
}

body[data-chain-id='3'] .booking--back_to_top {
    background-color: var(--btn-color);
}

body[data-chain-id='3'] .filter_submit,
body[data-chain-id='3'] .modalFilters--apply {
    background: var(--btn-color) !important;
    border: 1px solid var(--btn-color) !important;
}

body[data-chain-id='3'] .rooms--info--name p,
body[data-chain-id='3'] .rate--detail--button ,
body[data-chain-id='3'] .room--rate--member .room--rate--price__old p,
body[data-chain-id='3'] .room--rate--price__current p,
body[data-chain-id='3'] .estimate-reward,
body[data-chain-id='3'] .room--rates--footer,
body[data-chain-id='3'] .hotel_item--link--details span,
.hotel_item--link--details i ,
.hotel--sort .value{
    color: var(--text-color-2) !important;
}

body[data-chain-id='3'] .estimate-reward {
    align-self: center;
}

body[data-chain-id='3'] .ui-datepicker-header,
body[data-chain-id='3'] .bs--toggle--breakdown:after {
    background: var(--btn-color) !important;
}

body[data-chain-id='3'] .bs--hotel--name ,
body[data-chain-id='3'] .bs--toggle--breakdown{
    color: var(--text-color-2);
}

/* end new custom */

#cancel-reservation a {
    color: white !important;
}

/* hotel item */
.hotel_item--title {
    color: var(--text-color-2) !important;
}

/* .hotel--banner--wrapper {
    display: block !important;
} */

/* room */

body[data-chain-id='3'] .room-caption {
    top: 12px;
    right: 20px;
}

.rooms--info--name p {
    color: var(--brand-primary-red);
}

body[data-chain-id='3'] .hotel_info--services_wrapper {
    display: none;
}

.member--corportate--signin {
    /* display: flex; */
    display: none;
    align-items: center;
    gap: 4px;
}

.member--corportate--signin a {
    color: white;
}

body[data-chain-id='3'] .room--footer--rates[data-rates="2"] {
    width: 95%;
}

body[data-chain-id='3'] .corp--logout a {
    color: yellow;
}

body[data-chain-id='3'] .form-check-input:checked {
    background-color: var(--btn-color);
    border-color: var(--btn-color);
}

body[data-chain-id='3'] .hotels--header--member_card {
    width: 100%;
}

body[data-chain-id='3'] .corp--message {
    white-space: normal;
    max-width: 300px;
}

/* rate */
.room--rate--btn.member_exclusive {
    background-color: var(--brand-primary-red) !important;
    border-color: var(--brand-primary-red) !important;
}

body[data-chain-id='3'] .rate--modal .amenity_item {
    color: var(--brand-primary-red);
    border: 1px solid var(--brand-primary-red);
}

body[data-chain-id='3'] .room--footer--rates[data-rates="2"] .rate-primary {
    align-items: baseline;
}

body[data-chain-id='3'] .room--footer--rates[data-rates="1"] .rate-secondary {
    align-items: start !important;
}

body[data-chain-id='3'] .room--footer--rates.regular_rate[data-rates="1"] .room--rate--btns .room--rate--btn.primary {
    margin: 5px 0;
}

/* Inform */

body[data-chain-id='3'] .inform--header {
    padding: 10px 0;
}

.inform--header--name {
    color: var(--main-color) !important;
}

body[data-chain-id='3'] .hotels--filter__brands {
    display: none;
}

/* swt up tạm  */
/* body[data-chain-id='3'] .rate--item .room--rate[data-rate-code="B2G1"] .room--footer--rates.regular_rate[data-rates="1"] .room--rate--btns .room--rate--btn.primary{
    color: black;
} */

body[data-chain-id='3'] #alt_list {
    display: none;
}


body[data-chain-id='3'] .hotel--sort--modal_list li[data-sort='ai-suggest'] {
    display: flex;
}

body[data-chain-id='3'] .ai--suggest--tag {
    display: block;
}

/* @media screen and (min-width: 1441px) {
    body[data-chain-id='3'] .inform--header {
        padding-left: calc((100vw - 1440px) / 2 + 100px) !important;
        padding-right: calc((100vw - 1440px) / 2 + 100px) !important;
    }
} */


@media (min-width: 1400px) {
    body[data-chain-id='3'] .container {
        max-width: 1440px;
    }
}


@media (min-width: 1200px) {
    body[data-chain-id='3'] .container {
        max-width: 1280px;
    }
}


@media (max-width: 1200px) {
    body[data-chain-id='3'] .inform_container {
        padding: 0;
    }
}


@media screen and (max-width: 1000px) {
    body[data-chain-id='3'] .estimate-reward {
        align-self: flex-start;
        margin-left: 20px;
    }
}

@media screen and (max-width: 768px) {
    body[data-chain-id='3'] .hotels--header--bottom.active {
        top: 2px;
    }
}

@media screen and (max-width: 400px) {
    body[data-chain-id='3'] .hotels--header--li .logo img {
        aspect-ratio: 1;
    }
}