﻿
@import url('https://fonts.googleapis.com/css2?family=Libre+Franklin:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

@font-face {
    font-family: Sugar Magic;
    src: url(https://assets.travertex.com/fonts/hp/cust/Travellia/sugarmagic.otf)
}

:root {
    --darkBlue: #1E213B;
    --mossGreen: #588986;
    --mainDarkGreen: #133A4A;
    --white-80: rgba(255, 255, 255, 0.8);
    --white-70: rgba(255, 255, 255, 0.7);
    --mainBackground: #F8F8F8;
    --brown: #816859;
    --lightGrey: #CCCCCC;
    --grey: #BBBBBB;
    --black-33: rgba(0, 0, 0, 0.33);
    --accent1: #2B9F92; /*Green*/
    --accent1a: #2B9F92CC;
    --accent1aRGB: rgba(43, 159, 146, 0.8);
    --accent1aRGB24: rgba(43, 159, 146, 0.24);
    --accent2: #F4A317; /*Orange*/
    --accent3: #F35D53; /*Coral*/
    --fontLibreFranklyn: "Libre Franklin", sans-serrif;
    --fontSugarMagic: 'Sugar Magic', sans-serrif;
    --rating4: #72AA17;
    --rating3: #BCB71F;
    --rating: #BC1F1F;
}

.subnav-summary,
.subnav-rfp,
.subnav-space,
.subnav-faq,
.subnav-logout {
    display: none !important;
}

.HomePageCustomSectionAboveSearchBox {
    display: none;
}

#ViewChange {
    display: none;
}

body {
    --header-img-margin-top: 40px;
    --header-img-margin-bottom: 40px;
    --header-img-height: 36px;
    --header-height: calc(var(--header-img-height) + var(--header-img-margin-top) + var(--header-img-margin-bottom));
    --footer-height: 260px;
    --maincontent-minHeight: calc(100svh - var(--footer-height));
    --searchSection: 125px;
}

header {
    border: 0 !important;
    min-height: var(--header-height);
    z-index: 101;
    background-color: transparent !important;
}

body:not(#pg_Home, #pg_SearchIndv) header {
    background: url(https://assets.travertex.com/hp/img/travellia/searchheader.png) center no-repeat !important;
    background-size: cover !important;
    position: relative;
}

    body:not(#pg_Home, #pg_SearchIndv) header :not(.bgcover) {
        z-index: 101;
    }

    body:not(#pg_Home, #pg_SearchIndv) header::before {
        content: "";
        position: absolute;
        inset: 0;
        background: var(--accent1a);
        background: var(--accent1aRGB);
        z-index: 100;
    }

nav.Navbar {
    max-width: 88.5%;
}

.header-wl {
    -webkit-box-shadow: unset;
    -moz-box-shadow: unset;
    box-shadow: unset;
}

header a,
header a:link,
header a:visited {
    color: white;
}

header .container-wl {
    margin-top: var(--header-img-margin-top);
    margin-bottom: var(--header-img-margin-bottom);
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    max-width: 88.5%;
}

    header .container-wl #navigation-wl {
        position: unset;
        margin-top: 0px;
    }

    header .container-wl .clear {
        display: none;
    }

header .subnav-container {
    position: absolute;
    top: 0;
}

.site7119 header .subnav-container {
    top: 33px;
}

#pg_Home header .subnav-container nav a {
    color: black !important;
}

.site7119 header .subnav-container nav a {
    color: black !important;
}

header .subnav-container,
header .subnav-container .Navbar {
    background: transparent !important;
    background-color: transparent !important;
    text-align: right;
}

#logo-wl #logo,
#logo-wl img {
    height: var(--header-img-height) !important;
    margin-top: 0;
    margin-bottom: 0;
    min-height: unset;
}

.sprite-flags {
    border: 1px solid white;
}

.site7119 .sprite-flags {
    border: 1px solid black;
}

ul#navigation-wl {
    margin: 0;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 10px;
}

    ul#navigation-wl * {
        margin: 0 !important;
        padding: 0 !important;
    }

body header ul#navigation-wl li#message-wl {
    width: 24px;
    height: 24px;
    background-image: url(https://assets.travertex.com/hp/img/travellia/global_B.svg);
    background-repeat: no-repeat;
    background-size: contain;
    color: transparent !important;
    overflow: hidden;
}

ul#navigation-wl li,
ul#navigation-wl li a {
    color: black !important;
}

body:not(#pg_Home) ul#navigation-wl li#message-wl {
    background-image: url(https://assets.travertex.com/hp/img/travellia/global_W.svg);
}

body:not(#pg_Home) ul#navigation-wl li,
body:not(#pg_Home) ul#navigation-wl li a {
    color: white !important;
}


#MainContent {
    min-height: var(--maincontent-minHeight);
}

#pg_SearchIndv #MainContent {
    min-height: var(--maincontent-minHeight);
    margin-top: calc(-1 * (var(--header-height) + 30px)) !important;
    background-color: var(--mainBackground) !important;
}

#ContentInner {
    background-color: transparent;
}

#landingpage #SearchSection {
    max-width: 88.5%;
    min-height: 700px;
    margin-inline: auto;
    border-radius: 50px;
    padding: 50px 0;
    /*padding-top: var(--searchSection);*/
    padding-bottom: 72px;
    box-sizing: border-box;
    text-align: left;
    background-position: center !important;
    position: relative;
    display: flex !important;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

    #landingpage #SearchSection .container {
        width: 92% !important;
        max-width: calc(100% - 50px) !important;
        max-width: 1500px;
        position: absolute;
        inset: 0;
    }

.Travellia.top {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
    font-family: var(--fontLibreFranklyn);
    font-weight: 500;
    font-size: clamp(16px, 3vw, 25px);
    line-height: 100%;
    color: white;
    max-width: calc(100% - 50px) !important;
    margin-inline: auto !important;
}

    .Travellia.top:before {
        content: " ";
        background-image: url(https://assets.travertex.com/hp/img/Travellia/SSPL.svg);
        background-repeat: no-repeat;
        background-size: cover;
        width: 100%;
        max-width: 1000px;
        aspect-ratio: 1008 / 97;
    }

#landingpage .tabs {
    max-width: unset !important;
    z-index: 0 !important;
    display: block;
    position: absolute;
    bottom: 48px;
}

ul.tab-links {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: end;
}

    ul.tab-links * {
        margin: 0 !important;
    }

    ul.tab-links li {
        height: unset !important;
    }

        ul.tab-links li a {
            display: flex !important;
            flex-direction: row;
            justify-content: flex-start;
            align-items: center;
            gap: 16px;
            padding: 18px 40px !important;
            border: 0px;
            background: #343434 !important;
            font-family: var(--fontLibreFranklyn);
            font-weight: 500;
            font-size: 14px;
            line-height: 100%;
            border-radius: 0px;
            color: var(--white-70) !important;
        }

            ul.tab-links li a::before {
                content: "";
                width: 28px;
                height: 28px;
                background-repeat: no-repeat !important;
                background-size: cover !important;
            }

            ul.tab-links li a.tablink1::before {
                background-image: url(https://assets.travertex.com/hp/img/Travellia/hotel.svg) !important;
            }

            ul.tab-links li a.tablink8::before {
                background-image: url(https://assets.travertex.com/hp/img/Travellia/car.svg) !important;
            }

            ul.tab-links li a.tablink2::before {
                background-image: url(https://assets.travertex.com/hp/img/Travellia/meeting.svg) !important;
            }

            ul.tab-links li a.tablink11::before {
                background-image: url(https://assets.travertex.com/hp/img/Travellia/group-booking.svg) !important;
            }

        ul.tab-links li:first-of-type a {
            border-top-left-radius: 16px;
        }

        ul.tab-links li:last-of-type a {
            border-top-right-radius: 16px;
        }

        ul.tab-links li + li a {
            border-left: 1px solid rgba(255, 255, 255, 0.12);
        }

        ul.tab-links li a.current {
            padding: 24px 40px !important;
            border-top-left-radius: 16px;
            border-top-right-radius: 16px;
            background-color: var(--accent1) !important;
        }

#landingpage .tab-panel {
    position: absolute;
    background-color: white !important;
    padding: 0 !important;
    width: 100% !important;
    border-bottom-left-radius: 12px !important;
    border-bottom-right-radius: 12px !important;
    border-top-right-radius: 12px !important;
}

#landingpage #tab1,
#landingpage #tab2 {
    background-color: transparent !important;
}

#landingpage .tab-panel * {
    margin: 0 !important;
}

#landingpage .tab-panel::before {
    content: "" !important;
    position: absolute;
    inset: -24px;
    backdrop-filter: blur(32px);
    z-index: -1;
    background-color: #00000014;
    border-radius: 16px;
}

#landingpage .submitButtonWrapper {
    clear: unset;
    float: none;
    overflow: hidden;
    width: 220px;
    height: 96px;
    flex-shrink: 0;
    border-top-right-radius: 12px;
    border-bottom-right-radius: 12px;
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
}

    #landingpage .submitButtonWrapper button {
        margin: 0 !important;
        padding: 8px !important;
        float: none;
        background: var(--accent1) !important;
        width: 100%;
        height: 100%;
        gap: 8px;
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        border-top-right-radius: 12px;
        border-bottom-right-radius: 12px;
        border-top-left-radius: 0px;
        border-bottom-left-radius: 0px;
        font-family: var(--fontLibreFranklyn);
        font-weight: 600;
        font-size: 20px;
        line-height: 100%;
    }

        #landingpage .submitButtonWrapper button::before {
            content: " ";
            background-image: url(https://assets.travertex.com/hp/img/Travellia/search-normal.svg);
            width: 40px;
            height: 40px;
            background-size: cover;
            flex: 0 0 40px;
        }

#landingpage form[name=frmSpace],
#landingpage #frmGroup {
    display: flex !important;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: stretch;
    align-items: stretch;
    width: 100% !important;
    max-width: unset;
    gap: var(--gap);
    --gap: 0px;
}

    #landingpage form[name=frmSpace] *,
    #landingpage #frmGroup * {
        box-sizing: border-box;
    }

    #landingpage #frmGroup .input-group-xl {
        flex-basis: calc(40% - 88px);
    }

    #landingpage #frmGroup .input-group.date1,
    #landingpage #frmGroup .input-group.date2 {
        flex-basis: calc(20% - 44px);
    }

    #landingpage #frmGroup .input-group.nRooms {
        flex-basis: calc(20% - 44px);
    }

#landingpage form[name=frmSpace] {
    display: grid;
    grid-template-columns: 8fr 3fr 3fr 4fr 3fr 170px;
    grid-template-rows: 96px;
}

    #landingpage form[name=frmSpace] :is(.input-group-xl, .input-group) {
        /*flex: 1 1 10%;*/
        width: unset;
    }

    #landingpage form[name=frmSpace] .input-group-xl {
        flex-grow: 8;
        grid-column: 1 / 2;
        grid-row: 1 / 2;
    }

    #landingpage form[name=frmSpace] .input-group:has(#InDate_disp) {
        flex-grow: 3;
        grid-column: 2 / 3;
        grid-row: 1 / 2;
    }

    #landingpage form[name=frmSpace] .input-group:has(select[name=Duration]) {
        flex-grow: 3;
        grid-column: 3 / 4;
        grid-row: 1 / 2;
    }

    #landingpage form[name=frmSpace] .input-group:has(select[name=TimeFrame]) {
        flex-grow: 4;
        grid-column: 4 / 5;
        grid-row: 1 / 2;
    }

    #landingpage form[name=frmSpace] .input-group.SleepingRooms {
        flex-grow: 3;
        grid-column: 5 / 6;
        grid-row: 1 / 2;
    }

    #landingpage form[name=frmSpace] .submitButtonWrapper {
        width: 170px;
        grid-column: 6 / 7;
        grid-row: 1 / 2;
    }

    #landingpage form[name=frmSpace] .input-group-xl,
    #landingpage form[name=frmSpace] .input-group,
    #landingpage #frmGroup .input-group-xl,
    #landingpage #frmGroup .input-group {
        padding: 0 !important;
        margin: 0 !important;
        position: relative;
        min-height: 96px;
    }

        #landingpage form[name=frmSpace] .input-group-xl label,
        #landingpage form[name=frmSpace] .input-group label,
        #landingpage #frmGroup .input-group-xl label,
        #landingpage #frmGroup .input-group label {
            position: absolute;
            top: 15px;
            left: 15px;
            font-family: var(--fontLibreFranklyn);
            font-weight: 500;
            font-size: 12px;
            line-height: 100%;
            z-index: 1;
        }

        #landingpage form[name=frmSpace] .input-group .styled-select {
            margin: 0 !important;
            width: 100%;
            height: 100%;
            border: 0;
        }

            #landingpage form[name=frmSpace] .input-group .styled-select select {
                margin: 0 !important;
                padding: 45px 15px 15px 15px;
                width: 100%;
                height: 100%;
                border-radius: 0;
                border: 0;
            }

        #landingpage form[name=frmSpace] .input-group-xl input,
        #landingpage form[name=frmSpace] .input-group input,
        #landingpage #frmGroup .input-group-xl input,
        #landingpage #frmGroup .input-group input {
            margin: 0 !important;
            padding: 45px 15px 15px 45px;
            width: 100%;
            height: 100%;
            border-radius: 0;
            border: 0;
            background-position-x: 16px;
            background-position-y: 50px;
            background-repeat: no-repeat;
            background-size: 24px;
            position: absolute;
            inset: 0;
        }

        #landingpage #frmGroup .input-group-xl input {
            border-bottom-left-radius: 12px;
        }

            #landingpage form[name=frmSpace] .input-group-xl input[type=text],
            #landingpage #frmGroup .input-group-xl input[type=text] {
                background-image: url(https://assets.travertex.com/hp/img/travellia/locationb.svg);
            }

        #landingpage form[name=frmSpace] .input-group input.datepicker,
        #landingpage #frmGroup .input-group.date1 input[type=text],
        #landingpage #frmGroup .input-group.date2 input[type=text] {
            background-image: url(https://assets.travertex.com/hp/img/travellia/calendar.svg) !important;
        }

        #landingpage form[name=frmSpace] .input-group.SleepingRooms input[type=number],
        #landingpage #frmGroup .input-group.nRooms input[type=number] {
            background-image: url(https://assets.travertex.com/hp/img/travellia/room.svg);
        }

        #landingpage #frmGroup .input-group-xl + .input-group,
        #landingpage #frmGroup .input-group + .input-group {
            border-left: 1px solid #dddddd;
        }

#landingpage #tab2 .form-separation {
    display: none;
}

#landingpage #tab11 {
    min-height: 96px;
    padding: 8px 238px 8px 18px !important;
    box-sizing: border-box;
}

    #landingpage #tab11 form {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
    }

#Search-Box {
    background-color: transparent !Important;
}

    #Search-Box .clear {
        display: none;
    }

    #Search-Box .container_hp {
        display: flex !important;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: stretch;
        align-items: stretch;
        width: 90%;
        gap: var(--gap);
        --gap: 0px;
        max-width: 1500px;
        position: relative;
        padding: 0;
    }

        #Search-Box .container_hp::before {
            content: " ";
            position: absolute;
            inset: -24px;
            backdrop-filter: blur(16px);
            z-index: -1;
            border-radius: 16px;
        }

        #Search-Box .container_hp > * {
            margin: 0;
            padding: 0;
            position: relative;
        }

        #Search-Box .container_hp #destination {
            flex-basis: calc(40% - 88px);
        }

        #Search-Box .container_hp #check-in,
        #Search-Box .container_hp #check-out,
        #Search-Box .container_hp #rooms {
            flex-basis: calc(20% - 44px);
        }

        #Search-Box .container_hp #submit {
            clear: unset;
            float: none;
            overflow: hidden;
            width: 220px;
            height: 96px;
            border-top-right-radius: 12px;
            border-bottom-right-radius: 12px;
            border-top-left-radius: 0px;
            border-bottom-left-radius: 0px;
        }

            #Search-Box .container_hp #submit label {
                display: none;
            }

            #Search-Box .container_hp #submit #btnStartSearch {
                margin: 0 !important;
                padding: 8px !important;
                float: none;
                background: var(--accent1) !important;
                width: 220px;
                height: 96px;
                gap: 8px;
                display: flex;
                flex-direction: row;
                justify-content: center;
                align-items: center;
                border-top-right-radius: 12px;
                border-bottom-right-radius: 12px;
                border-top-left-radius: 0px;
                border-bottom-left-radius: 0px;
                font-family: var(--fontLibreFranklyn);
                font-weight: 600;
                font-size: 20px;
                line-height: 100%;
                box-shadow: unset !important;
            }

            #Search-Box .container_hp #submit .btnStartSearch::before {
                content: " ";
                background-image: url(https://assets.travertex.com/hp/img/Travellia/search-normal.svg);
                width: 40px;
                height: 40px;
                background-size: cover;
                flex: 0 0 40px;
            }

        #Search-Box .container_hp .field-group:first-of-type input {
            border-top-left-radius: 12px !important;
            border-bottom-left-radius: 12px !important;
        }

        #Search-Box .container_hp .field-group label {
            position: absolute;
            top: 15px;
            left: 15px;
            font-family: var(--fontLibreFranklyn);
            font-weight: 500;
            font-size: 12px;
            line-height: 100%;
            z-index: 1;
            color: #333333;
        }

        #Search-Box .container_hp .field-group input,
        #Search-Box .container_hp .field-group .customSelect {
            margin: 0 !important;
            padding: 45px 15px 15px 45px;
            width: 100%;
            height: 100%;
            border-radius: 0;
            border: 0;
            display: flex !important;
            align-items: center;
            background-position-x: 16px;
            background-position-y: 50px;
            background-repeat: no-repeat;
            background-size: 24px;
        }

        #Search-Box .container_hp .field-group#destination input {
            background-image: url(https://assets.travertex.com/hp/img/travellia/locationb.svg);
        }

        #Search-Box .container_hp .field-group:is(#check-in, #check-out) input {
            background-image: url(https://assets.travertex.com/hp/img/travellia/calendar.svg);
        }

        #Search-Box .container_hp .field-group .customSelect {
            background-image: url(https://assets.travertex.com/hp/img/travellia/room.svg);
        }

        #Search-Box .container_hp .field-group + .field-group {
            border-left: 1px solid #dddddd;
        }

        #Search-Box .container_hp .field-group .customSelect,
        #Search-Box .container_hp .field-group input[type=number],
        #Search-Box .container_hp .field-group input[type=submit],
        #Search-Box .container_hp .field-group input[type=text] {
            line-height: unset;
        }

#Rates-Column {
    background-color: #F8F8F8;
    padding-top: 15px;
}

#Rates {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

    #Rates > div {
        border-radius: 15px;
        padding: 12px !important;
        border: 1px solid #0000001A;
        background: white;
    }

        #Rates > div:not(#searchedHotel) {
            --pad: 35px;
            padding-bottom: var(--pad);
        }

    #Rates > #searchedHotel + div {
        padding-top: 0;
    }

    #Rates > div + div {
        padding-top: var(--pad);
    }

    #Rates > #searchedHotel > div {
    }

    #Rates:has(#ForcedHotel, #searchedHotel)::before,
    #ForcedHotel + div::before,
    #searchedHotel + div::before {
        --borderRadiusTop: 5px;
        --borderRadiusBottom: 0;
        --borderRadiusBottom: 5px;
        --BGColor: var(--accent1);
        display: block;
        box-sizing: border-box;
        width: 100%;
        padding: 7px 15px;
        color: #ffffff;
        font-size: 16px;
        font-weight: 600;
        background: var(--BGColor);
        border-top-left-radius: var(--borderRadiusTop);
        border-top-right-radius: var(--borderRadiusTop);
        border-bottom-left-radius: var(--borderRadiusBottom);
        border-bottom-right-radius: var(--borderRadiusBottom);
    }

    #Rates:has(#ForcedHotel)::before {
        content: "This is our featured hotel:";
    }

    #Rates:has(#searchedHotel)::before {
        content: "This is the hotel you searched for:";
        margin-bottom: -8px;
    }

#ForcedHotel + div::before,
#searchedHotel + div::before {
    content: "Here are the best deals in the area:";
    --BGColor: var(--brown);
    --borderRadiusBottom: 5px;
    margin-bottom: 20px;
}

.hotel-rates {
    --gap: 20px;
    display: grid;
    grid-template-columns: 250px calc(100% - 250px - 280px - var(--gap) - var(--gap)) 280px;
    grid-template-rows: auto auto;
    column-gap: var(--gap);
    margin: 0px;
    padding: 0px;
    border: 0px !important;
    cursor: unset;
}

    .hotel-rates > div {
        margin: 0 !important;
        padding: 0 !important;
    }

    .hotel-rates .description-column {
        grid-column: 2 / 3;
        grid-row: 1 / 3;
        width: unset !important;
        padding: 10px 10px 0 0 !important;
    }

    .hotel-rates .thumbnail-column {
        grid-column: 1 / 2;
        grid-row: 1 / 3;
        width: unset !important;
        padding: 0;
        max-width: unset !important;
        border-radius: 8px;
    }

    .hotel-rates .rating-column {
        grid-column: 3 / 4;
        grid-row: 2 / 3;
        width: unset !important;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        gap: 4px;
        padding: 6px 6px 18px 6px !important;
        border-radius: 12px;
        background: var(--accent1);
        position: relative;
    }

    .hotel-rates .tvx-column {
        grid-column: 3 / 4;
        grid-row: 1 / 2;
        padding: 10px;
        font-family: var(--fontLibreFranklyn);
        font-style: normal;
        font-weight: 600;
        font-size: 14px;
        line-height: 21px;
        color: black;
        letter-spacing: 0.03em;
    }

    .hotel-rates .thumbnail-column .photo-wrapper {
        height: 100%;
        width: 100%;
        max-height: 100%;
        max-width: 100%;
    }

        .hotel-rates .thumbnail-column .photo-wrapper img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

    .hotel-rates .rating-column * {
        margin: 0;
        padding: 0;
    }

    .hotel-rates .rating-column .pricing {
        padding: 14px 8px !important;
        border-radius: 12px;
        background: #FFFFFFCC;
        display: flex;
        flex-direction: column;
        gap: 8px;
        order: 1;
    }

    .hotel-rates .rating-column .ptPrice {
        order: 3;
        padding-inline: 8px;
    }

    .hotel-rates .rating-column .mysavings {
        border-top: 1px solid #0000001A;
        padding-top: 8px;
    }

    .hotel-rates .rating-column .price,
    .hotel-rates .rating-column .price-old,
    .hotel-rates .rating-column .mysavings,
    .hotel-rates .rating-column .ptPrice {
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 1fr 1fr;
        align-items: center;
    }

        .hotel-rates .rating-column .price span,
        .hotel-rates .rating-column .price-old span,
        .hotel-rates .rating-column .mysavings span,
        .hotel-rates .rating-column .ptPrice span {
            font-family: var(--fontLibreFranklyn);
            font-style: normal !important;
            text-align: right;
            font-size: 20px;
            font-weight: 700 !important;
            line-height: 100%;
            grid-column: 2 / 3;
            grid-row: 1 / 3;
            justify-self: end;
        }

        .hotel-rates .rating-column .price span {
            color: #000000;
            grid-row: 1 / 2;
        }

        .hotel-rates .rating-column .price-old span {
            font-size: 12px;
            font-weight: 400 !important;
            line-height: 140%;
            text-decoration-line: line-through;
            color: #FF0000;
        }

        .hotel-rates .rating-column .mysavings span {
            color: var(--accent1);
        }

        .hotel-rates .rating-column .ptPrice span {
            color: #ffffff;
            grid-row: 1 / 2;
        }

        .hotel-rates .rating-column .price::before,
        .hotel-rates .rating-column .price-old::before,
        .hotel-rates .rating-column .mysavings::before,
        .hotel-rates .rating-column .ptPrice::before {
            font-family: var(--fontLibreFranklyn) !important;
            font-style: normal !important;
            font-weight: 400 !important;
            font-size: 12px !important;
            line-height: 140% !important;
            text-align: left;
            grid-column: 1 / 2;
            grid-row: 1 / 3;
        }

        .hotel-rates .rating-column .price::after,
        .hotel-rates .rating-column .ptPrice::after {
            font-family: var(--fontLibreFranklyn);
            font-weight: 400;
            font-size: 12px;
            line-height: 140%;
            text-align: right;
            flex-basis: 100%;
            grid-column: 2 / 3;
            grid-row: 2 / 3;
        }

        .hotel-rates .rating-column .price::before {
            content: "You pay after discount";
            color: #000000 !important;
        }

        .hotel-rates .rating-column .price::after {
            content: "/ Per night";
            color: #00000080 !important;
        }

        .hotel-rates .rating-column .price-old::before {
            /*content: "Public Price";*/
            color: #000000 !important;
        }

        .hotel-rates .rating-column .mysavings::before {
            content: "Total save";
            color: #000000 !important;
        }

        .hotel-rates .rating-column .ptPrice::before {
            content: "Total Pay (incl, Tax)";
            color: #FFFFFF !important;
        }

        .hotel-rates .rating-column .ptPrice::after {
            content: "/ Total Duration";
            text-decoration: underline;
            color: #FFFFFF !important;
        }

    .hotel-rates .rating-column > a.check-rates {
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden;
        width: 0 !important;
        height: 0 !important;
        order: 2;
    }

        .hotel-rates .rating-column > a.check-rates::after {
            position: absolute;
            top: 0;
            right: 0;
            bottom: 0;
            left: 0;
            z-index: 1;
            content: "";
        }

#Rates-Column .Comments {
    display: block;
}

/*
    .hotel-rates .rating-column #price-xx {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        row-gap: 10px;
    }

        .hotel-rates .rating-column #price-xx > * {
            margin: 0 !important;
            padding: 0 !important;
        }

        .hotel-rates .rating-column #price-xx span.question-mark {
            order: 1;
            display: none;
        }

        .hotel-rates .rating-column #price-xx span.public-label {
            order: 2;
        }

        .hotel-rates .rating-column #price-xx span.public-price {
            order: 3;
            flex-grow: 2;
        }

        .hotel-rates .rating-column #price-xx div.savings {
            order: 5;
            flex-basis: 100%;
            display: flex;
            flex-direction: row;
            align-items: center;
        }

        .hotel-rates .rating-column #price-xx div.total {
            order: 4;
            flex-basis: 100%;
            display: flex;
            flex-direction: row;
            align-items: center;
        }

        .hotel-rates .rating-column #price-xx small {
            display: none;
        }

        .hotel-rates .rating-column #price-xx div.savings .save-label:before {
            content: "";
        }

        .hotel-rates .rating-column #price-xx div.savings span:last-child,
        .hotel-rates .rating-column #price-xx div.total span:last-child {
            flex-grow: 2;
        }

        .hotel-rates .rating-column #price-xx span.public-price,
        .hotel-rates .rating-column #price-xx div.savings span:last-child,
        .hotel-rates .rating-column #price-xx div.total span:last-child,
        .hotel-rates .rating-column > .price > span,
        .hotel-rates .rating-column > .price-old > span,
        .hotel-rates .rating-column > .mysavings > span,
        .hotel-rates .rating-column > .ptPrice > span {
            font-family: var(--fontLibreFranklyn);
            font-style: normal !important;
            font-size: 21px !important;
            line-height: 20px !important;
            font-weight: 700 !important;
            text-align: right;
        }
        .hotel-rates .rating-column #price-xx span.public-price,
        .hotel-rates .rating-column > .price-old > span {
            font-weight: 400 !important;
            text-decoration-line: line-through;
            color: var(--grey);
        }


        .hotel-rates .rating-column #price-xx div.savings span:last-child,
        .hotel-rates .rating-column > .mysavings > span {
            color: var(--accent3);
        }

        .hotel-rates .rating-column #price-xx div.total span:last-child,
        .hotel-rates .rating-column > .price > span {
            color: var(--accent1);
        }


    .hotel-rates .rating-column #price-xx span.public-label,
    .hotel-rates .rating-column #price-xx div.total .youpay,
    .hotel-rates .rating-column #price-xx div.savings .save-label,
    .hotel-rates .rating-column .price > span:before,
    .hotel-rates .rating-column .price-old > span:before,
    .hotel-rates .rating-column .mysavings > span:before {
        font-family: var(--fontRoboto) !important;
        font-style: normal !important;
        font-weight: 500 !important;
        font-size: 9px !important;
        line-height: 120% !important;
        letter-spacing: 0.1em !important;
        text-transform: uppercase !important;
        color: black !important;
    }
*/

.hotel-rates .review-score {
    color: var(--rating3);
    font-family: var(--fontLibreFranklyn);
    font-weight: 600;
    font-size: 16px;
    line-height: 100%;
    display: flex;
    justify-content: end;
    align-items: center;
    gap: 6px;
}

    .hotel-rates .review-score.r3 {
        color: var(--rating);
    }

    .hotel-rates .review-score.r4 {
        color: var(--rating4);
    }

    .hotel-rates .review-score span {
        border-radius: 8px;
        padding: 8px;
        background: var(--rating3);
        color: #ffffff;
        font-family: var(--fontLibreFranklyn);
        font-weight: 600;
        font-size: 16px;
        line-height: 100%;
    }

    .hotel-rates .review-score.r3 span {
        background: var(--rating);
    }

    .hotel-rates .review-score.r4 span {
        background: var(--rating4);
    }

.hotel-rates .recent-reviews {
    display: none;
}

.hotel-rates .star-rating {
    display: none;
}

.hotel-rates .description-column .hotel-name {
    font-family: var(--fontLibreFranklyn);
    font-family: var(--fontSugarMagic);
    font-weight: 400;
    font-size: 26px;
    line-height: 100%;
    color: #000000 !important;
}

.hotel-rates .description-column .address {
    font-family: var(--fontLibreFranklyn);
    font-weight: 600;
    font-size: 14px;
    line-height: 100%;
    color: #000000;
    white-space: unset;
}

.hotel-rates .description-column .distance {
    font-family: var(--fontLibreFranklyn);
    font-weight: 400;
    font-size: 12px;
    line-height: 100%;
    color: #999999;
    background-color: transparent;
}

.hotel-rates .description-column .features {
    color: #228015;
}

    .hotel-rates .description-column .features li {
        font-family: var(--fontLibreFranklyn);
        font-weight: 600;
        font-size: 12px;
        line-height: 150%;
    }

.hotel-rates .clear {
    display: none;
}

.savingsmode .hotel-rates .price .total {
    border-top: 0px solid #d0cccc;
}

#guest-review-range {
    display: none;
}

#paging-bottom a:link,
#paging-bottom a:visited {
    color: var(--accent1) !Important;
}

#Links-Sidebar {
    padding: 0;
}

.filter-section {
    background-color: transparent;
    /*width: 100%;*/
}

#Links-Sidebar h4,
#Filter .category {
    color: black !Important;
}

#hotelResultsCount {
    color: black !Important;
}

.star-icon,
.star-rating .fa-star,
.star-rating .fa-star-half-o {
    color: var(--accent2) !Important;
}

.star-icon {
    width: 12px;
    height: 12px;
    padding: 0px;
}

.ui-slider-tip {
    color: black !important;
    background-color: white !Important;
    border: 1px solid var(--accent1) !important;
}

.ui-slider-float .ui-slider-tip::before,
.ui-slider-float .ui-slider-pip .ui-slider-tip-label::before {
    border-top-color: var(--accent1) !important;
}

body .filter-section .ui-slider .ui-slider-range {
    background: linear-gradient(90deg, var(--accent1), #5ED4C6, var(--accent1));
}

a:link,
a:visited {
    color: black;
    text-decoration: none;
}

#Map {
    height: unset;
    aspect-ratio: 10 / 3;
    display: flex;
    justify-content: center;
    align-items: center;
}

    #Map span {
        position: unset;
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        gap: 4px;
        padding: 12px 20px;
        border-radius: 6px;
        background: #2B9F92;
        font-family: var(--fontLibreFranklyn);
        font-weight: 600;
        font-size: 18px;
        line-height: 100%;
    }

        #Map span::before {
            content: "";
            background-image: url(https://assets.travertex.com/hp/img/travellia/location.svg);
            background-repeat: no-repeat;
            background-size: cover;
            width: 18px;
            height: 18px;
        }

#pg_SearchIndv #page-header-wrapper2 {
    padding-top: calc(var(--searchSection) + var(--header-height));
    padding-bottom: 72px;
    box-sizing: border-box;
    background: url(https://assets.travertex.com/hp/img/travellia/searchheader.png) center no-repeat !important;
    background-size: cover !important;
    position: relative;
}

    /*
#pg_SearchIndv.site7119 #page-header-wrapper2 {
    background: url(//cdn.hotelplanner.com/common/images/site/7119/shutterstock_1481786072-wide.jpg ) bottom no-repeat !important;
    background-size: cover !important;
}
*/

    #pg_SearchIndv #page-header-wrapper2::before {
        content: "";
        position: absolute;
        inset: 0;
        background: var(--accent1a);
        background: var(--accent1aRGB);
        z-index: 100;
    }

    #pg_SearchIndv #page-header-wrapper2 #Search-Box {
        position: relative;
        inset: 0;
        background: var(--accent1a);
        background: var(--accent1aRGB);
        z-index: 100;
    }

#Rates-Column #sort-by li.active,
#Rates-Column #sort-by li.active:hover {
    background-color: var(--accent1) !important;
    color: white !important;
    -moz-box-shadow: none;
    box-shadow: none;
}

#sort-by #savings-sort-option {
    color: var(--accent1);
    -moz-box-shadow: none;
    box-shadow: none;
}

#Profile {
    background-color: unset;
}

#Gallery {
    --h: 375px;
    --w: 100%;
    --gap: .75em;
    width: 100%;
    margin-top: 0;
    margin-bottom: 30px;
    padding-bottom: 0;
    overflow: hidden;
    height: unset;
}

    #Gallery::before {
        content: " ";
        position: absolute;
        inset: 0;
        z-index: 1000;
    }

#Profile .rg-image-nav,
.rg-caption-wrapper {
    display: none;
}

#Profile .container-fluid {
    display: flex;
    flex-direction: row;
    justify-content: center;
}

    #Profile .container-fluid > .col-xs-12 {
        display: flex;
        flex-direction: column;
        padding-top: 50px;

        @media (max-width: 1200px) {
            width: 100%;
        }
    }

    #Profile .container-fluid > :not(.col-xs-12) {
        display: none;
    }

    #Profile .container-fluid .col-xs-12 #HotelName {
        order: 2;
    }

    #Profile .container-fluid .col-xs-12 #Overview {
        order: 1;
    }

    #Profile .container-fluid .col-xs-12 #Ext-Search-Form {
        order: 4;
        border: 1px solid #c0ccdb;
        background-color: unset !important;
    }

    #Profile .container-fluid #topDetails {
        order: 3;
    }

    #Profile .container-fluid .col-xs-12 #Rates-Selection {
        order: 5;
    }

    #Profile .container-fluid .col-xs-12 #MapSection {
        order: 6;
    }

    #Profile .container-fluid .col-xs-12 #Reviews {
        order: 9;
    }

        #Profile .container-fluid .col-xs-12 #Reviews > * {
            display: none !important;
        }

        #Profile .container-fluid .col-xs-12 #Reviews .user-reviews-section:has(+ #epsGuestReviews),
        #Profile .container-fluid .col-xs-12 #Reviews .user-reviews-section + #epsGuestReviews {
            display: block !important;
        }

    #Profile .container-fluid .col-xs-12 #Description {
        order: 8;
    }

    #Profile .container-fluid .col-xs-12 #MapSection :has(#map) {
        gap: 10px;
        border-top-left-radius: 12px;
        border-top-right-radius: 12px;
    }

    #Profile .container-fluid .col-xs-12 #MapSection #Whats-near {
        gap: 10px;
        border-radius: 12px;
    }

        #Profile .container-fluid .col-xs-12 #MapSection #Whats-near .map-title {
            font-family: var(--fontLibreFranklyn);
            font-weight: 700;
            font-size: 22px;
            line-height: 100%;
            color: #000000;
        }

        #Profile .container-fluid .col-xs-12 #MapSection #Whats-near .whats-near-by > span {
            font-family: var(--fontLibreFranklyn);
            font-weight: 600;
            font-size: 22px;
            line-height: 100%;
            color: var(--accent1);
        }

        #Profile .container-fluid .col-xs-12 #MapSection #Whats-near ul {
            display: flex;
            flex-direction: column;
            gap: 12px;
        }

            #Profile .container-fluid .col-xs-12 #MapSection #Whats-near ul li {
                font-family: var(--fontLibreFranklyn);
                font-weight: 500;
                font-size: 16px;
                line-height: 140%;
                color: #999999;
            }

    #Profile .container-fluid .col-xs-12 #Description {
        display: flex;
        flex-direction: column;
        gap: 15px;
    }

        #Profile .container-fluid .col-xs-12 #Description > * {
            padding: 0;
        }

        #Profile .container-fluid .col-xs-12 #Description .dot-line:nth-child(1),
        #Profile .container-fluid .col-xs-12 #Description .dot-line:nth-child(2) {
            display: none;
        }

        #Profile .container-fluid .col-xs-12 #Description .col-lg-3 {
        }

            #Profile .container-fluid .col-xs-12 #Description .col-lg-3 .sub-section {
                font-family: var(--fontLibreFranklyn);
                font-weight: 700;
                font-size: 28px;
                line-height: 100%;
                color: #000000;
            }

        #Profile .container-fluid .col-xs-12 #Description .col-lg-9 {
        }

        #Profile .container-fluid .col-xs-12 #Description .col-lg-9 {
            padding-left: 15px;
        }

    #Profile .container-fluid .amenities ul li {
        background: url(https://assets.travertex.com/hp/img/travellia/tick.svg);
        background-repeat: no-repeat;
        background-position: left center;
        padding-left: 30px;
    }

    #Profile .container-fluid * {
        box-sizing: border-box;
    }

    #Profile .container-fluid #topDetails {
        display: flex;
        flex-direction: row;
        align-items: stretch;
        gap: 10px;
        display: grid;
        grid-template-columns: auto 33%;
        grid-template-rows: 300px 276px;
        gap: 24px;

        @media (max-width: 900px) {
            grid-template-columns: 100%;
            grid-template-rows: 300px auto;
        }
    }

        #Profile .container-fluid #topDetails .sub-section {
            font-family: var(--fontLibreFranklyn);
            font-weight: 700;
            font-size: 28px;
            line-height: 100%;
            color: #000000;
        }

    #Profile .container-fluid #topDescription,
    #Profile .container-fluid #topAmenities {
        display: flex;
        flex-direction: column;
        gap: 15px;
    }

    #Profile .container-fluid #topDescription {
        flex: 1 1 70%;
        grid-column: 1 / 2;
        grid-row: 1 / 2;
    }

    #Profile .container-fluid #topAmenities {
        flex: 1 1 auto;
        grid-column: 1 / 2;
        grid-row: 2 / 3;
        container-name: topAmenities;
        container-type: inline-size;
    }

    #Profile .container-fluid #MapSection2 {
        grid-column: 2 / 3;
        grid-row: 1 / 3;
        display: flex;
        flex-direction: column;
        position: relative;

        @media (max-width: 900px) {
            display: none;
        }
    }

        #Profile .container-fluid #MapSection2 .map {
            position: relative;
            width: 100%;
            aspect-ratio: 47 / 20;
            overflow: hidden;
            height: 100%;
            max-height: 200px;
        }

            #Profile .container-fluid #MapSection2 .map:has(div:empty) {
                display: none;
            }

        #Profile .container-fluid #MapSection2 .content {
            padding: 24px 20px;
            flex: 1 1 auto;
            display: flex;
            flex-direction: row;
            flex-wrap: wrap;
            justify-content: space-between;
            gap: 24px;
            overflow-y: auto;
        }

            #Profile .container-fluid #MapSection2 .content .map-title {
                flex-basis: 100%;
                display: flex;
                gap: 8px;
                font-family: var(--fontLibreFranklyn);
                font-weight: 700;
                font-size: 22px;
                line-height: 100%;
                flex-basis: fit-content;
            }

                #Profile .container-fluid #MapSection2 .content .map-title::before {
                    content: "";
                    background-image: url(https://assets.travertex.com/hp/img/travellia/locationb.svg);
                    background-repeat: no-repeat;
                    background-size: cover;
                    width: 24px;
                    height: 24px;
                }

                #Profile .container-fluid #MapSection2 .content .map-title i {
                    display: none;
                }

            #Profile .container-fluid #MapSection2 .content .whats-near-by {
                flex: 1 1 auto;
            }

            #Profile .container-fluid #MapSection2 .content .miles {
                flex: 1 1 fit-content;
                width: unset;
            }

            #Profile .container-fluid #MapSection2 .content :is(.whats-near-by, .miles) span {
                display: none;
            }

            #Profile .container-fluid #MapSection2 .content ul {
                display: flex;
                flex-direction: column;
                gap: 16px;
                padding: 0;
            }

                #Profile .container-fluid #MapSection2 .content ul li {
                    list-style: none;
                    font-family: Libre Franklin;
                    font-weight: 400;
                    font-size: 16px;
                    line-height: 140%;
                    color: #444444;
                    display: flex;
                    flex-direction: row;
                    justify-content: space-between;
                }

                    #Profile .container-fluid #MapSection2 .content ul li span {
                        font-weight: 500;
                        color: #333333;
                    }

    #Profile .container-fluid #topDescription > :last-child {
        overflow-y: auto;
        max-height: 100%;
        flex: 1 1 auto;
        padding-left: 15px;
    }

    #Profile .container-fluid #topAmenities > :last-child {
        overflow-y: auto;
        max-height: 100%;
        flex: 1 1 auto;
        padding-left: 15px;
        text-align: center;
    }

    #Profile .container-fluid #topAmenities .amenities {
        display: none
    }




    #Profile .container-fluid #topAmenities ul {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
        grid-auto-flow: row;
        justify-items: stretch;
        align-items: stretch;
        gap: 8px;
        margin: 0;
        padding: 0;
    }

        #Profile .container-fluid #topAmenities ul li {
            list-style: none;
            display: flex;
            flex-direction: row;
            justify-content: start;
            align-items: center;
            gap: 8px;
            padding: 8px 12px;
            border-radius: 48px;
            background: rgba(43, 159, 146, 0.04);
            font-family: var(--fontLibreFranklyn), Libre Franklyn;
            font-weight: 600;
            font-size: 14px;
            line-height: 100%;
            border-radius: 48px;
            text-align: left;
        }

            #Profile .container-fluid #topAmenities ul li::before {
                content: "";
                background-image: url(https://assets.travertex.com/hp/img/travellia/tick.svg);
                background-repeat: no-repeat;
                background-size: cover;
                width: 18px;
                height: 18px;
                flex: 0 0 18px;
            }

    #Profile .container-fluid #topAmenities .cbMore {
        appearance: none;
        width: 0;
        height: 0;
        position: absolute;
    }

        #Profile .container-fluid #topAmenities .cbMore:checked {
            color: red;
        }

    #Profile .container-fluid #topAmenities :is(.cbMoreLabel, .cbLessLabel) {
        display: block;
        cursor: pointer;
        margin: 10px auto;
    }

    #Profile .container-fluid #topAmenities .cbMoreLabel {
        display: none;
    }

    #Profile .container-fluid #topAmenities .cbLessLabel {
        display: block;
    }

    #Profile .container-fluid #topAmenities #ascbMore:checked ~ .cbMoreLabel {
        display: block;
    }

    #Profile .container-fluid #topAmenities #ascbMore:checked ~ .cbLessLabel {
        display: none;
    }

    #Profile .container-fluid #topAmenities:has(#ascbMore:checked) ul li:nth-child(12) ~ li {
        display: none;
    }

/* width is (200px * num of cols) + margin + (8px + num of gaps) */
@container (width <= calc((200px * 2) + 15px + 8px)) {
    #Profile .container-fluid #topAmenities:has(#ascbMore:checked) ul li:nth-child(6) ~ li {
        display: none;
    }
}

@container (width <= calc((200px * 3) + 15px + (8px * 2))) {
    #Profile .container-fluid #topAmenities:has(#ascbMore:checked) ul li:nth-child(8) ~ li {
        display: none;
    }
}
@container (width <= calc((200px * 4) + 15px + (8px * 3))) {
    #Profile .container-fluid #topAmenities:has(#ascbMore:checked) ul li:nth-child(9) ~ li {
        display: none;
    }
}






#signInModal { display: none;}




#Profile a.blue-links:link {
    color: #999999;
}

#Profile .container-fluid .col-xs-12 #MapSection #Whats-near .miles ul li {
    color: #b2b2B2;
}

#Profile h2 {
    color: var(--accent1);
}

a#streetViewBtn,
a#streetViewBtn:hover,
.fancyscroll::-webkit-scrollbar-thumb {
    background-color: var(--accent1) !important;
    border-color: var(--accent1) !important;
}

#Profile #Seasonality,
#Profile #RelatedHotels,
#Profile #WeatherInfo,
#Profile #testimonials {
    display: none;
}

.quick-links[href="#WeatherInfo"],
.quick-links[href="/Group-Rate/#ContentTable"] {
    display: none !important;
}


#Submenu-Top {
    background-color: var(--accent1);
}

#Reviews .user-reviews-section:has(+ .row),
#Reviews > .row,
#Reviews .user-reviews-section:has(+ #trustyou-section),
#Reviews #trustyou-section,
#Reviews .dot-line {
    display: none !important;
}

#HotelName {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 1em;
}

.fa.fa-star,
.fa-star.on,
.fa.fa-star-half,
.fa-star.on:before {
    color: var(--accent2) !important;
}

.rateSearchForm {
    background-color: unset !important;
}

#rateSearchForm text {
    fill: #000000 !important;
}

#HotelName {
    margin-bottom: 20px;
}

    #HotelName * {
        font-size: 1em;
        line-height: 1.25em;
        margin: 0 !important;
        padding: 0 !important;
    }

        #HotelName *:not(.fa) {
            font-family: var(--fontLibreFranklyn);
            font-weight: 500;
        }

    #HotelName > .row {
        flex-grow: 1;
    }

        #HotelName > .row > div:first-of-type {
            display: flex;
            flex-direction: row;
            gap: 5px;
        }

    #HotelName #hotel-logo {
        aspect-ratio: 1;
    }

        #HotelName #hotel-logo img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            max-height: unset;
        }

    #HotelName #hotel-contact {
        font-family: var(--fontLibreFranklyn);
        font-weight: 600;
        font-size: 1.2em;
        line-height: 2em;
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        gap: 5px;
        height: 100%;
    }

        #HotelName #hotel-contact h1 {
            font-family: var(--fontLibreFranklyn);
            font-family: var(--fontSugarMagic);
            font-size: 2em;
            line-height: 1.1em;
            color: black !important;
        }

        #HotelName #hotel-contact #hotel-address {
            display: flex;
            flex-direction: row;
            flex-wrap: wrap;
        }

            #HotelName #hotel-contact #hotel-address #highwayInfo {
                flex-basis: 100%;
            }

        #HotelName #hotel-contact #star-rating {
            display: flex;
            flex-direction: row;
            flex-wrap: wrap;
            color: transparent;
        }

            #HotelName #hotel-contact #star-rating * {
                display: none;
            }

            #HotelName #hotel-contact #star-rating .fa {
                display: block;
            }

    #HotelName #Review-Top,
    #HotelName div.clean-shadow {
        -webkit-box-shadow: unset;
        -moz-box-shadow: unset;
        box-shadow: unset;
    }

    /*.hotel-name:link, .hotel-name:visited, .todo-name {
    color: black !Important;
    font-family: var(--fontSugarMagic);
    font-style: normal;
    font-weight: 700;
    font-size: 21px;
    line-height: 25px;
}*/

    #HotelName #g2 {
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        gap: 1em;
    }

        #HotelName #g2 * {
            margin: 0 !important;
            padding: 0 !important;
            width: max-content !important;
        }

        #HotelName #g2 #Action-Box {
            margin: 0;
            padding: .5em 1.5em !important;
            font-weight: 600;
            border-radius: calc(.5em - 2px) !important;
            height: 2.75em;
            width: fit-content;
            font-family: var(--fontLibreFranklyn);
            display: inline-flex;
            justify-content: center;
            align-items: center;
            border: none !important;
            color: white !important;
            background-color: var(--accent1) !important;
        }

        #HotelName #g2 #Review-Top {
            display: flex;
            flex-direction: row;
            flex-wrap: wrap;
            align-items: center;
            gap: .5em;
        }

            #HotelName #g2 #Review-Top #word-rating {
                display: flex;
                flex-direction: row;
                align-items: center;
                gap: 6px;
                flex-basis: 100%;
            }

                #HotelName #g2 #Review-Top #word-rating .word {
                    font-family: var(--fontLibreFranklyn);
                    font-weight: 600;
                    font-size: 16px;
                    line-height: 100%;
                    color: var(--rating3);
                    order: 2;
                }

                    #HotelName #g2 #Review-Top #word-rating .word.r3 {
                        color: var(--rating);
                    }

                    #HotelName #g2 #Review-Top #word-rating .word.r4 {
                        color: var(--rating4);
                    }

                #HotelName #g2 #Review-Top #word-rating .outof5 {
                    display: none;
                }

                #HotelName #g2 #Review-Top #word-rating .puntuation {
                    display: inline-flex;
                    justify-content: center;
                    align-items: center;
                    color: white;
                    font-family: var(--fontLibreFranklyn);
                    font-weight: 700;
                    font-size: 18px;
                    line-height: 100%;
                    border-radius: 8px;
                    padding: 8px !important;
                    background: var(--rating3);
                    order: 1;
                }

                    #HotelName #g2 #Review-Top #word-rating .puntuation.r3 {
                        background: var(--rating);
                    }

                    #HotelName #g2 #Review-Top #word-rating .puntuation.r4 {
                        background: var(--rating4);
                    }

            #HotelName #g2 #Review-Top .based {
                color: rgb(55 65 81 / 1);
                font-size: .875em;
                line-height: 1.25em;
                width: 7em !important;
                flex-basis: 100%;
            }

    #HotelName #Features {
        display: none;
    }

#Action-Box i {
    display: none;
}

#HotelName #g2 #review-button {
    display: none;
}

#HotelName #map-phone {
    display: none;
}

#Profile button.orange-flatBtn,
#Profile #Ext-Search-Form button.orange-flatBtn,
#Profile #Ext-Search-Form button.orange-flatBtn:hover {
    font-family: var(--fontLibreFranklyn);
    border: 0px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    color: white !important;
    font-weight: 600;
    font-size: 16px;
    line-height: 22.4px;
    padding: 8px 24px !important;
    background-color: var(--accent1) !Important;
    border-color: var(--accent1) !Important;
    border-radius: 12px);
    width: fit-content;
}

#Profile button.orange-flatBtn {
    width: 100%;
}

#Gallery + * {
    display: none;
}

.rg-image-wrapper {
    height: var(--h) !important;
    border-radius: 20px 0 0 20px;
}

.rg-image {
    border-radius: 20px 0 0 20px;
}

    .rg-image img {
        height: var(--h);
        object-fit: cover;
        max-height: 100%;
    }

.es-carousel-wrapper {
    padding: unset !important;
    margin: 0px 0px !important;
}

.rg-view {
    display: none;
}

.es-nav {
    display: none;
}

.es-carousel {
    height: var(--h);
}

    .es-carousel ul {
        margin: 0 !important;
        margin-left: 0 !important;
        width: 511px !important;
        width: 100% !important;
        display: flex !important;
        flex-flow: column wrap !important;
        height: var(--h) !important;
        gap: 3px;
        display: grid !important;
        grid-template-columns: [start] calc((var(--w) - var(--gap)) / 2) [middle] calc((var(--w) - var(--gap)) / 2) [end];
        grid-template-rows: [top] calc((var(--h) - var(--gap)) / 2) [middle] calc((var(--h) - var(--gap)) / 2) [bottom];
        gap: var(--gap);
    }

        .es-carousel ul li {
            width: unset !important;
            margin: 0px !important;
            height: 125px !important;
        }

            .es-carousel ul li:nth-child(2) {
                grid-column-start: start;
                grid-column-end: middle;
                grid-row-start: top;
                grid-row-end: middle;
            }

            .es-carousel ul li:nth-child(3) {
                grid-column-start: middle;
                grid-column-end: end;
                grid-row-start: top;
                grid-row-end: middle;
            }

                .es-carousel ul li:nth-child(3) * {
                    border-radius: 0 20px 0 0;
                }

            .es-carousel ul li:nth-child(4) {
                grid-column-start: start;
                grid-column-end: middle;
                grid-row-start: middle;
                grid-row-end: bottom;
            }

            .es-carousel ul li:nth-child(5) {
                grid-column-start: middle;
                grid-column-end: end;
                grid-row-start: middle;
                grid-row-end: bottom;
            }

                .es-carousel ul li:nth-child(5) * {
                    border-radius: 0 0 20px 0;
                }

        .es-carousel ul li {
            width: unset !important;
            height: unset !important;
            margin: 0px !important;
        }

            .es-carousel ul li a {
                width: 100% !important;
                height: 100% !important;
                position: relative;
            }

            .es-carousel ul li:nth-child(5) a::before {
                content: var(--carContent);
                position: absolute;
                inset: 0;
                display: flex;
                justify-content: center;
                align-items: center;
                color: #fff;
                background-color: rgba(28, 28, 28, 0.65);
                backdrop-filter: blur(4px);
                -webkit-backdrop-filter: blur(4px);
                border-radius: 0 0 20px 0;
                z-index: 1;
            }

            .es-carousel ul li a img {
                width: 100% !important;
                height: 100% !important;
                object-fit: cover;
            }

#tvxModalr {
    justify-content: center;
    align-items: center;
    backdrop-filter: blur(10px);
}

    #tvxModalr .tvxModal-content {
        position: relative;
        margin: unset;
        width: unset;
    }

.carousel {
    max-width: 100%;
    width: 720px;
}

    .carousel .carousel-inner,
    .carousel img,
    .carousel .carousel-control {
        border-radius: 20px;
    }

#rg-gallery {
    display: flex;
    gap: var(--gap);
}

    #rg-gallery .rg-image-wrapper {
        flex-basis: 40%;
        flex-grow: 1;
        display: block;
    }

        #rg-gallery .rg-image-wrapper .rg-image {
            display: block;
            position: relative;
            inset: 0;
            height: 100%;
            max-width: 100%;
            max-height: 100%;
        }

    #rg-gallery .rg-thumbs {
        height: var(--h) !important;
        flex-basis: 40%;
        flex-grow: 1;
    }

#epsGuestReviews .pagination ul {
    display: flex;
    flex-direction: row;
}

#epsGuestReviews .pagination .clear {
    clear: both;
}

#QuickJumpTo {
    display: none;
}

.pac-container::after {
    display: none !important;
    content: unset !important
}

#Amenities > div {
    display: flex;
    flex-direction: column;
}

#Amenities .field-wrap {
    --s: 2em;
    font-size: 14px;
    display: grid;
    grid-template-columns: var(--s) auto;
    gap: 0.5em;
    padding-block: 8px;
    align-items: center;
}

    #Amenities .field-wrap label {
        font-family: var(--fontLibreFranklyn);
        font-weight: 500;
        font-size: 14px;
        line-height: 100%;
        max-width: max-content;
    }

    #Amenities .field-wrap input[type="checkbox"] {
        -webkit-appearance: none;
        appearance: none;
        background-color: #fff;
        margin: 0;
        width: var(--s);
        height: var(--s);
        position: relative;
    }

        #Amenities .field-wrap input[type="checkbox"]::before {
            content: "";
            position: absolute;
            inset: 0;
            background-image: url(https://assets.travertex.com/hp/img/travellia/square-notick.svg);
            background-size: cover;
        }

        #Amenities .field-wrap input[type="checkbox"]:checked::before {
            background-image: url(https://assets.travertex.com/hp/img/travellia/square-tick.svg);
        }

#filter-stars {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 12px;
}

    #filter-stars .category {
        flex-basis: 100%;
        order: 1;
    }

    #filter-stars .star-row {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 6px;
        border-radius: 12px;
        padding: 12px;
        border: 1px solid rgba(0, 0, 0, 0.6);
        position: relative;
    }

        #filter-stars .star-row:has(#Rating5) {
            order: 6;
        }

        #filter-stars .star-row:has(#Rating4) {
            order: 5;
        }

        #filter-stars .star-row:has(#Rating3) {
            order: 4;
        }

        #filter-stars .star-row:has(#Rating2) {
            order: 3;
        }

        #filter-stars .star-row::before {
            font-family: var(--fontLibreFranklyn);
            font-weight: 500;
            font-size: 12px;
            line-height: 100%;
            color: #999999;
            z-index: 9;
        }

        #filter-stars .star-row:has(#Rating5)::before {
            content: "5";
        }

        #filter-stars .star-row:has(#Rating4)::before {
            content: "4";
        }

        #filter-stars .star-row:has(#Rating3)::before {
            content: "3";
        }

        #filter-stars .star-row:has(#Rating2)::before {
            content: "0-2";
        }

        #filter-stars .star-row .star-icon:not(:first-child) {
            display: none;
        }

        #filter-stars .star-row input[type=checkbox] {
            -webkit-appearance: none;
            appearance: none;
            background-color: #fff;
            width: 0;
            position: absolute;
            inset: 0;
            width: unset;
            height: unset;
            border-radius: 13px;
            margin: 0;
        }

            #filter-stars .star-row input[type=checkbox]::before {
                content: "";
                position: absolute;
                inset: 0;
                border-radius: 13px;
                z-index: 10;
            }

            #filter-stars .star-row input[type=checkbox]:checked::before {
                content: "";
                background-color: #2B9F9255;
                border-radius: 12px;
            }

        #filter-stars .star-row label {
            z-index: 9;
        }

#price-range {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 16px;
}

    #price-range * {
        margin: 0;
        box-sizing: border-box;
    }

    #price-range .category {
        flex-basis: 100%;
        padding-bottom: 0 !important;
    }

    #price-range #pmin,
    #price-range #pmax {
        flex: 1 1 40%;
        display: flex;
        flex-direction: column;
        gap: 6px;
        font-family: var(--fontLibreFranklyn);
        font-weight: 500;
        font-size: 14px;
        line-height: 100%;
        color: #999999;
    }

    #price-range #PriceMin,
    #price-range #PriceMax {
        width: 100%;
        padding: 12px 24px;
        border-radius: 50px;
        border: 2px solid #00000026;
        font-family: var(--fontLibreFranklyn);
        font-weight: 500;
        font-size: 14px;
        line-height: 100%;
    }

    #price-range .slider_container {
        display: none;
    }

#rateTable {
    display: flex;
    flex-direction: column;
    gap: 20px;
    font-family: var(--fontLibreFranklyn) !important;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(315px, 1fr));
    grid-auto-flow: row;
    justify-items: stretch;
    align-items: stretch;
}

#Rates-Selection .rate-selection {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
    margin: 0;
    padding: 0 !important;
    border: 0;
    border: 1px solid #0000001A;
    border-radius: 15px;
    box-sizing: border-box;
    padding-bottom: 14px !important;
}

    #Rates-Selection .rate-selection * {
        margin: 0 !important;
    }

    #Rates-Selection .rate-selection .room-wrapper {
        display: flex;
        flex-direction: column;
        gap: 14px;
        flex-grow: 1;
        width: 100% !important;
    }

        #Rates-Selection .rate-selection .room-wrapper .thumbnail-wrapper {
            aspect-ratio: 387 / 180;
            padding: 0;
            overflow: hidden;
            flex: 0 0 auto;
            width: 100%;
            display: block !important;
        }

            #Rates-Selection .rate-selection .room-wrapper .thumbnail-wrapper .nothumbavail,
            #Rates-Selection .rate-selection .room-wrapper .thumbnail-wrapper a.room-image {
                border-top-left-radius: 15px;
                border-top-right-radius: 15px;
                width: 100% !important;
                height: 100% !important;
                background-size: cover !important;
            }

            #Rates-Selection .rate-selection .room-wrapper .thumbnail-wrapper .MostPopular {
                display: none;
            }

        #Rates-Selection .rate-selection .room-wrapper .room-description {
            display: flex !important;
            flex-direction: column;
            gap: 12px;
            flex-grow: 1;
            font-size: 1.2em !important;
            padding-inline: 14px !important;
            padding-bottom: 32px !important;
            width: calc(100% - 28px) !important;
            position: relative;
        }

            #Rates-Selection .rate-selection .room-wrapper .room-description > * {
                font-family: var(--fontLibreFranklyn);
                font-weight: 500;
                font-size: 14px !important;
                line-height: 150% !important;
                color: #999999;
            }

                #Rates-Selection .rate-selection .room-wrapper .room-description > *:empty {
                    display: none;
                }

            #Rates-Selection .rate-selection .room-wrapper .room-description .more-info {
                position: absolute;
                bottom: 8px;
                width: 100% !important;
                padding: 0;
                display: flex;
                justify-content: center;
                align-items: center;
                gap: 5px;
                font-family: Gilroy;
                font-weight: 600;
                font-size: 16px;
                line-height: 100%;
                color: #0F7FDB;
            }

                #Rates-Selection .rate-selection .room-wrapper .room-description .more-info i {
                    display: none;
                }

            #Rates-Selection .rate-selection .room-wrapper .room-description .room-title {
                font-weight: 600 !important;
                font-size: 18px !important;
                line-height: 100% !important;
                color: black !important;
                order: 1;
            }

            #Rates-Selection .rate-selection .room-wrapper .room-description .sale {
                order: 2;
                color: #2B9F92;
            }

            #Rates-Selection .rate-selection .room-wrapper .room-description .room-adds {
                order: 5;
            }

            #Rates-Selection .rate-selection .room-wrapper .room-description .nonSmoking {
                order: 4;
            }

            #Rates-Selection .rate-selection .room-wrapper .room-description .nonrefundableinfo,
            #Rates-Selection .rate-selection .room-wrapper .room-description .cancelinfo {
                order: 99;
                color: #2B9F92;
            }

            #Rates-Selection .rate-selection .room-wrapper .room-description *:is(.nonrefundableinfo, .cancelinfo):not(:has(+ .book-fast)) {
                margin-top: auto !important;
            }

            #Rates-Selection .rate-selection .room-wrapper .room-description .book-fast {
                order: 100;
                font-family: var(--fontLibreFranklyn);
                font-weight: 600;
                font-size: 12px;
                line-height: 100%;
                text-align: center;
                color: #FF0000;
                margin-top: auto !important;
            }

    #Rates-Selection .rate-selection .rates-icon {
        flex-basis: content;
        width: 100%;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        gap: 4px;
        padding-inline: 14px !important;
        position: relative;
    }

        #Rates-Selection .rate-selection .rates-icon > div {
            display: flex !important;
            flex-direction: column;
            justify-content: space-between;
            align-content: flex-end;
            gap: 12px;
            height: 100%;
        }

            #Rates-Selection .rate-selection .rates-icon > div:before,
            #Rates-Selection .rate-selection .rates-icon > div::after {
                display: none;
            }

            #Rates-Selection .rate-selection .rates-icon > div > div {
                width: 100%;
                padding: 0;
            }

            #Rates-Selection .rate-selection .rates-icon > div .booknow-container {
                position: unset;
            }

                #Rates-Selection .rate-selection .rates-icon > div .booknow-container > form {
                    display: flex;
                    justify-content: center;
                    align-items: center;
                }

        /*                #Rates-Selection .rate-selection .rates-icon > div .booknow-container button::before {
                    content: "";
                    position: absolute;
                    inset: 0;
                    z-index: 1;
                }
*/

        #Rates-Selection .rate-selection .rates-icon .price-container {
            display: flex;
            flex-direction: column;
            order: 1;
            gap: 4px;
            padding-top: 6px;
            padding-right: 6px;
            padding-bottom: 18px;
            padding-left: 6px;
            border-radius: 12px;
            background: var(--accent1aRGB24);
        }

            #Rates-Selection .rate-selection .rates-icon .price-container > * {
                font-family: var(--fontLibreFranklyn);
                font-weight: 700;
                font-size: 20px;
                line-height: 140%;
            }

            #Rates-Selection .rate-selection .rates-icon .price-container .pricing {
                display: flex;
                flex-direction: column;
                order: 1;
                gap: 8px;
                padding: 8px;
                border-radius: 12px;
                background: var(--white-80);
            }

            #Rates-Selection .rate-selection .rates-icon .price-container .price,
            #Rates-Selection .rate-selection .rates-icon .price-container .ptPrice {
                display: flex;
                flex-direction: row;
                flex-wrap: wrap;
                justify-content: space-between;
                align-items: center;
                text-align: right;
            }

                #Rates-Selection .rate-selection .rates-icon .price-container .price::before,
                #Rates-Selection .rate-selection .rates-icon .price-container .ptPrice::before,
                #Rates-Selection .rate-selection .rates-icon .price-container .price::after,
                #Rates-Selection .rate-selection .rates-icon .price-container .ptPrice::after {
                    font-family: var(--fontLibreFranklyn);
                    font-weight: 400;
                    font-size: 12px;
                    line-height: 140%;
                }

                #Rates-Selection .rate-selection .rates-icon .price-container .price::before,
                #Rates-Selection .rate-selection .rates-icon .price-container .ptPrice::before {
                    text-align: left;
                }

                #Rates-Selection .rate-selection .rates-icon .price-container .price::after,
                #Rates-Selection .rate-selection .rates-icon .price-container .ptPrice::after {
                    text-align: right;
                    flex-basis: 100%;
                    flex-shrink: 1;
                }

            #Rates-Selection .rate-selection .rates-icon .price-container .price {
            }

                #Rates-Selection .rate-selection .rates-icon .price-container .price::before {
                    content: "Room Rate";
                    color: #000000;
                }

                #Rates-Selection .rate-selection .rates-icon .price-container .price::after {
                    content: "/ Per night";
                    color: #808080;
                }

            #Rates-Selection .rate-selection .rates-icon .price-container .ptPrice {
                z-index: 2;
                position: relative;
                color: #007568;
                order: 3;
            }

                #Rates-Selection .rate-selection .rates-icon .price-container .ptPrice::before,
                #Rates-Selection .rate-selection .rates-icon .price-container .ptPrice::after {
                    color: var(--accent1);
                }

                #Rates-Selection .rate-selection .rates-icon .price-container .ptPrice::before {
                    content: "Total Pay (incl, Tax)";
                }

                #Rates-Selection .rate-selection .rates-icon .price-container .ptPrice::after {
                    content: "/ Total Duration";
                }

        #Rates-Selection .rate-selection .rates-icon :is(.post-pay, .pay-now) {
            color: var(--accent1);
            float: right;
        }

            #Rates-Selection .rate-selection .rates-icon :is(.post-pay, .pay-now) i {
                color: var(--accent1);
            }

        #Rates-Selection .rate-selection .rates-icon .nightly-rates,
        #Rates-Selection .rate-selection .rates-icon br {
            display: none;
        }

#rateTable .fa {
    display: inline;
}

#pg_CheckOut #btnCheckoutSubmit,
#pg_CheckOut #btnCheckoutSubmit2 {
    padding: 24px;
    border-radius: 12px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--accent1);
    font-family: var(--fontLibreFranklyn);
    font-weight: 600;
    font-size: 16px;
    line-height: 22.4px;
}

#applyVoucher {
    background: var(--accent1) !important;
}

#pg_CheckOut #btnCheckoutSubmit {
    display: none !important;
}

#pg_CheckOut #total {
    padding: 24px 18px !important;
    border-radius: 12px;
    background: #E5F3F2;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}

    #pg_CheckOut #total,
    #pg_CheckOut #total * {
        margin: 0;
        padding: 0;
        font-family: var(--fontLibreFranklyn);
        font-weight: 700;
        font-size: 20px;
        line-height: 100%;
        color: var(--accent1);
    }

        #pg_CheckOut #total #discountSummary {
            flex-basis: 100%;
        }

#pg_CheckOut #btnCheckoutSubmit2 {
    display: block !important;
}

#col1 #checkoutForm {
    padding: 0;
}

#paymentMethodTabs::before {
    content: "Choose Payment Method";
    display: block;
    font-size: 16px;
    color: #1b2c42;
    font-weight: bold;
    margin-bottom: 12px;
}

.paymentMethodTab.selected {
    border: 2px solid var(--accent1);
    color: black;
    background: #2B9F9233;
}

#tg-button-opt-in {
    background: #2B9F9233;
    border: 2px solid var(--accent1);
}

.SumoSelect > .SlectBox > span:before,
#ccGroup .form-control-feedback.fa-credit-card,
.form-control-feedback.fa-lock,
.form-control-feedback.fa-ticket-alt {
    color: var(--accent1) !important;
}

#book {
    padding: 20px;
    background-color: transparent;
    border-bottom: 2px solid transparent;
    color: #134318;
}

#hotel-header figure img {
    border-radius: 12px;
}

a.check-rates:link,
a.check-rates:visited {
    font-family: var(--fontRoboto);
    font-style: normal;
    font-weight: 900;
    font-size: 12px;
    line-height: 120%;
    text-align: center;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    background: var(--accent1) !important;
    border-radius: 5px;
    padding: 16px;
}

a.closeDatepicker,
a.closeDatepicker:hover {
    background: var(--accent1);
}

.ui-datepicker-calendar .ui-state-hover {
    color: #FFFFFF;
    border-color: var(--accent1);
    background-color: var(--accent1);
}

.ui-datepicker-calendar .ui-state-active {
    color: var(--accent2);
    border-color: var(--accent2);
    background: #fff;
}

input[type=submit],
button[type=submit] {
    background-color: var(--accent1);
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}

#pg_GroupAccount #btnSubmit {
    padding: .5rem 1.5rem;
    height: 2.75rem;
    margin-block: auto !important;
}

#pg_GroupAccount #btnSubmit,
#pg_GroupAccount .alt-btn {
    color: white !important;
    font-weight: 600 !important;
    background: var(--accent1) !important;
    border-radius: calc(.5rem - 2px);
    white-space: nowrap;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: fit-content;
    font-family: var(--fontLibreFranklyn);
    border: 0 !important;
}

#pg_GroupAccount h2,
#pg_GroupAccount h3 {
    color: black;
}

#btnPasswd {
    display: none !important;
}

.custom-discounts {
    padding: 20px;
    background-color: #e3f9e4;
    border-bottom: 2px solid #d1edd4;
    color: #134318 !important;
}

#pg_CheckOut {
    font-family: var(--fontLibreFranklyn);
}

    #pg_CheckOut .guest-options a {
        color: var(--accent1);
        font-weight: 500;
    }

    #pg_CheckOut #checkoutForm .guest-options .checkbox.active {
        color: var(--accent1);
    }

    #pg_CheckOut .featuresList {
        display: none;
    }

@media (min-width: 1025px) {
    #pg_SearchIndv #Content {
        display: grid;
        grid-template-columns: 20% 80%;
        grid-template-rows: auto auto auto;
        box-sizing: border-box;
        column-gap: 15px;
        row-gap: 15px;
    }

        #pg_SearchIndv #Content #Filter-Column {
            grid-column: 1 / 2;
            grid-row: 2 / 3;
            width: unset !important;
            background: white;
            border-radius: 15px;
        }

        #pg_SearchIndv #Content #Rates-Column {
            grid-column: 2 / 3;
            grid-row: 1 / 4;
            width: unset !important;
        }

        #pg_SearchIndv #Content #Links-Column {
            grid-column: 1 / 2;
            grid-row: 1 / 2;
            width: unset !important;
        }

            #pg_SearchIndv #Content #Filter-Column .container_hp,
            #pg_SearchIndv #Content #Links-Column .container_hp {
                padding: 0;
            }
}

@media (max-width: 1300px) {
    #landingpage .tabs:has(#tab2.currentTab) {
        bottom: 144px;
    }

    #landingpage form[name=frmSpace] {
        display: grid !important;
        grid-template-columns: 3fr 3fr 4fr 3fr 170px;
        grid-template-rows: 96px 96px;
    }

        #landingpage form[name=frmSpace] .input-group-xl {
            grid-column: 1 / 5;
            grid-row: 1 / 2;
        }

        #landingpage form[name=frmSpace] .input-group:has(#InDate_disp) {
            grid-column: 1 / 2;
            grid-row: 2 / 3;
        }

        #landingpage form[name=frmSpace] .input-group:has(select[name=Duration]) {
            grid-column: 2 / 3;
            grid-row: 2 / 3;
        }

        #landingpage form[name=frmSpace] .input-group:has(select[name=TimeFrame]) {
            grid-column: 3 / 4;
            grid-row: 2 / 3;
        }

        #landingpage form[name=frmSpace] .input-group.SleepingRooms {
            grid-column: 4 / 5;
            grid-row: 2 / 3;
        }

        #landingpage form[name=frmSpace] .submitButtonWrapper {
            grid-column: 5 / 6;
            grid-row: 1 / 3;
            height: unset;
        }

    #topDetails {
    }
}

@media (max-width: 960px) {
    #landingpage .tab-panel {
        position: unset !important;
    }
}

@media (max-width: 780px) {
    #rg-gallery .rg-thumbs {
        display: block;
    }
}

@media (max-width: 767px) {
    body {
        --header-img-margin-top: 30px;
        --header-img-margin-bottom: 31px;
        --header-img-height: 55px;
        --searchSection: 50px;
    }

    #landingpage #SearchSection {
        padding: 50px 0;
        gap: 50px;
    }

        #landingpage #SearchSection .container {
            position: relative;
        }

    #landingpage .tabs {
        position: relative;
        bottom: unset;
    }

    #landingpage #tab11 {
        padding: 8px 18px 104px 18px !important;
        box-sizing: border-box;
    }

        #landingpage #tab11 form {
            position: absolute;
            top: unset;
            left: 0;
            right: 0;
            bottom: 0;
        }

    #landingpage form[name=frmSpace],
    #landingpage #frmGroup {
        flex-wrap: wrap;
    }

    ul.tab-links {
        border-top-left-radius: 16px;
        border-top-right-radius: 16px;
        background: #343434 !important;
        flex-direction: column;
        align-items: stretch;
    }

        ul.tab-links li + li a {
            border-top: 1px solid rgba(255, 255, 255, 0.12);
            border-left: 0px solid rgba(255, 255, 255, 0.12);
        }

    #landingpage form[name=frmSpace],
    #landingpage #frmGroup {
        flex-direction: column;
    }

    #landingpage .submitButtonWrapper {
        width: 100%;
        border-top-right-radius: 0;
        border-bottom-left-radius: 12px;
    }

        #landingpage .submitButtonWrapper button {
            border-top-right-radius: 0;
            border-bottom-left-radius: 12px;
        }

    #landingpage #frmGroup .input-group-xl input {
        border-bottom-left-radius: 0 !important;
        border-top-right-radius: 12px !important;
    }

    #landingpage form[name=frmSpace] .input-group-xl input,
    #landingpage form[name=frmSpace] .input-group input,
    #landingpage #frmGroup .input-group-xl input,
    #landingpage #frmGroup .input-group input {
    }

    .hotel-rates {
        grid-template-columns: 40vw auto;
        grid-template-rows: auto 40vw auto;
        gap: 10px;
    }

        .hotel-rates .description-column {
            grid-column: 1 / 3;
            grid-row: 1 / 2;
        }

        .hotel-rates .thumbnail-column {
            grid-column: 1 / 2;
            grid-row: 2 / 3;
        }

        .hotel-rates .rating-column {
            grid-column: 2 / 3;
            grid-row: 2 / 3;
        }

        .hotel-rates .tvx-column {
            grid-column: 1 / 3;
            grid-row: 3 / 4;
        }

    #Search-Box .container_hp {
        padding-inline: 10px;
        flex-wrap: wrap;
    }

        #Search-Box .container_hp #destination,
        #Search-Box .container_hp > #submit {
            flex: 1 1 100%;
        }

        #Search-Box .container_hp > #check-in,
        #Search-Box .container_hp > #check-out,
        #Search-Box .container_hp > #rooms {
            flex: 1 1 30%;
        }

        #Search-Box .container_hp #submit {
            width: 100%;
            border-top-right-radius: 0px;
            border-bottom-left-radius: 12px;
        }

            #Search-Box .container_hp #submit #btnStartSearch {
                width: 100%;
                border-top-right-radius: 0px;
                border-bottom-left-radius: 12px;
            }

        #Search-Box .container_hp .field-group:first-of-type input {
            border-top-right-radius: 12px !important;
            border-bottom-left-radius: 0px !important;
        }

    #logo-wl #logo {
        height: auto;
    }

    #logo-wl img {
        position: absolute;
        top: 30px;
        left: clamp(20px, 18%, 86px);
        right: clamp(20px, 18%, 86px);
        height: auto !important;
    }
}

@media (max-width: 685px) {
    #Gallery {
        --h: calc(100vw - 10px);
        --gap: 5px;
    }

    #rg-gallery {
        flex-direction: column;
    }

        #rg-gallery > * {
            width: 100%;
        }

    .rg-image-wrapper {
        height: var(--h) !important;
        border-radius: 20px 20px 0 0;
    }

    .rg-image {
        border-radius: 20px 20px 0 0;
    }

    .es-carousel ul li {
    }

        .es-carousel ul li:nth-child(3) * {
            border-radius: 0 0 0 0;
        }

        .es-carousel ul li:nth-child(4) *,
        .es-carousel ul li:nth-child(4)::before {
            border-radius: 0 0 0 20px;
        }

    #HotelName #g2 {
        display: none;
    }
}

@media (max-width: 550px) {
    #destination,
    #rooms,
    .field-group label {
        display: block;
    }

    .field-group label {
        color: black;
    }

    #city-name,
    #form-details {
        display: none;
    }

    #Search-Box .container_hp #destination {
        display: block;
    }

    #city-name,
    #form-details {
        display: none;
    }
}
