body.single-mphb_room_type .singleroom_other_wrapper {
    display: none;
}

.mobile_menu_wrapper,
body.js_nav .mobile_menu_wrapper,
html[data-menu=leftmenu] body.js_nav .mobile_menu_wrapper {
    overflow-y: auto;
    overscroll-behavior: contain;
}

#page_caption.hasbg h1 {
    font-size: 60px !important;
    font-family: "Tinos", sans-serif !important;
}

@media screen and (max-width:1024px) {
    #page_caption.hasbg h1 {
        font-size: 30px !important;
    }

    #singleroom_amenities {
        padding: 20px 0 !important;
    }

    .singleroom_amenities_list_wrapper {
        padding-top: 0 !important;
        margin-left: 0 !important;
    }

    .singleroom_attributes_wrapper,
    #singleroom_book {
        width: 100% !important;
    }

    body.single-mphb_room_type:not(.elementor-page) #page_content_wrapper .inner .sidebar_content.full_width {
        margin-bottom: 0 !important;
    }

    .mphb-reservation-submitted-title {
        margin-top: 40px;
    }
}

#page_caption.hasbg .page_tagline {
    margin-top: 14px;
    font-family: "Tinos", serif;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 2px;
    line-height: 1.5;
    text-transform: uppercase;
    color: #fff;
}

:root {
    --bw-pad: 30px;
    --bw-rail: calc(var(--bw-pad) + max(0px, (100vw - 1425px) / 2));
}

@media (min-width: 1100px) {
    :root {
        --bw-pad: 70px;
    }
}

@media (min-width: 1200px) {
    :root {
        --bw-pad: 90px;
    }
}

.elementor-section.elementor-section-boxed:not(.elementor-section-stretched)>.elementor-container {
    max-width: 100%;
}

.elementor-section.elementor-section-boxed.elementor-section-stretched>.elementor-container {
    max-width: calc(min(1425px, 100vw) - (2 * var(--bw-pad)));
    margin-left: auto;
    margin-right: auto;
}

@media (min-width: 768px) {
    .elementor-container>.elementor-top-column:first-child>.elementor-element-populated {
        padding-left: 0;
    }

    .elementor-container>.elementor-top-column:last-child>.elementor-element-populated {
        padding-right: 0;
    }
}

@media (min-width: 768px) {
    body #menu_wrapper {
        left: var(--bw-rail) !important;
    }
}

/* The right-hand cluster is right-anchored at every width, so this one is safe unscoped. */
body #logo_right_button {
    right: var(--bw-rail) !important;
}

body.single-mphb_room_type #page_content_wrapper {
    width: auto !important;
    max-width: 1425px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: var(--bw-pad) !important;
    padding-right: var(--bw-pad) !important;
    box-sizing: border-box;
}

@media (max-width: 1024px) {

    .slideshow__slide-caption-title,
    .slideshow__slide-caption-title a {
        font-size: 48px !important;
        line-height: 1.15 !important;
    }
}

@media (max-width: 767px) {

    .slideshow__slide-caption-title,
    .slideshow__slide-caption-title a {
        font-size: 34px !important;
    }

    .slideshow__slide-caption-text {
        font-size: 15px !important;
    }
}

/* ============================================================================
   The accommodation attribute row (bed / guests / size / view) — one icon set.

   It was mixing two, which is what made it look untidy: the theme ships four
   raster PNGs (images/icon_bed.png, icon_people.png, icon_size.png,
   icon_view.png — flat grey line art at a fixed size, and visibly soft on a
   retina screen), while every OTHER icon on the page — the amenities under the
   price, the contact details — is a Font Awesome vector. Two weights, two
   colours, two levels of sharpness, side by side.

   Drawn as OUTLINES, not solids. Font Awesome cannot do this: the Free set ships
   Solid for everything and its Regular (outline) face covers only ~160 icons —
   bed, users, ruler, eye and umbrella are all absent from it and fall back to a
   blank box at weight 400 (measured, not assumed). Outline versions of these
   exist only in Font Awesome Pro. So these are stroke-drawn SVGs instead,
   inlined as data URIs: no extra request, sharp at any size, and no paid kit.

   Painted with `mask` rather than `background-image`, so the icon takes its
   colour from `currentColor` — i.e. the row's own text colour. A background
   image would bake the colour into the SVG and stop following the theme.

   The <img> stays in the DOM and is simply not shown: the markup comes from the
   theme's single-room template, and rewriting that would be a theme edit
   destroyed by the next Hoteller update. This is CSS-only and applies to every
   accommodation, current and future.
   ============================================================================ */

.singleroom_attributes_wrapper .room_icon img {
    display: none;
}

.singleroom_attributes_wrapper .room_icon::before {
    content: "";
    display: inline-block;
    width: 24px;
    height: 24px;
    vertical-align: middle;
    background-color: currentColor;
    /* the mask below decides where this shows */
    -webkit-mask: var(--bw-icon) no-repeat center / contain;
    mask: var(--bw-icon) no-repeat center / contain;
}

/* 24x24 stroke icons, 1.5px — light enough to sit beside the theme's thin type
   without shouting. Single quotes inside the data URI so the double quotes of the
   SVG attributes survive; # and < > are percent-encoded, as a raw # would be read
   as the start of a URL fragment. */
.singleroom_attributes_wrapper .singleroom_bed_icon::before {
    /* bed */
    --bw-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 20v-8a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v8'/%3E%3Cpath d='M4 10V6a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v4'/%3E%3Cpath d='M12 4v6'/%3E%3Cpath d='M2 18h20'/%3E%3C/svg%3E");
}

.singleroom_attributes_wrapper .singleroom_adults_children_icon::before {
    /* guests */
    --bw-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cpath d='M22 21v-2a4 4 0 0 0-3-3.87'/%3E%3Cpath d='M16 3.13a4 4 0 0 1 0 7.75'/%3E%3C/svg%3E");
}

.singleroom_attributes_wrapper .singleroom_size_icon::before {
    /* size — four corners, reads as floor area rather than a ruler */
    --bw-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 3H5a2 2 0 0 0-2 2v3'/%3E%3Cpath d='M21 8V5a2 2 0 0 0-2-2h-3'/%3E%3Cpath d='M3 16v3a2 2 0 0 0 2 2h3'/%3E%3Cpath d='M16 21h3a2 2 0 0 0 2-2v-3'/%3E%3C/svg%3E");
}

.singleroom_attributes_wrapper .singleroom_view_icon::before {
    /* view */
    --bw-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12s3.5-7 10-7 10 7 10 7-3.5 7-10 7-10-7-10-7Z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
}

/* The theme's CUSTOM attributes (e.g. Kythnos' "Terrace by the Sea", whose icon is
   an uploaded icons8 PNG — a third style again) reuse .singleroom_view_icon, so
   without this they inherit the eye above. Keep this rule BELOW it so it wins. */
.singleroom_attributes_wrapper .singleroom_custom_attributes .singleroom_view_icon::before {
    /* parasol */
    --bw-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 12v7a2 2 0 0 0 4 0'/%3E%3Cpath d='M2 12a10 10 0 0 1 20 0Z'/%3E%3C/svg%3E");
}

/* ---- pull the icon and its value together ----

   The two were drifting apart for a structural reason, not a spacing one: the theme
   gives the icon a 70px-wide box and the value a 252px one, and centres the content
   of each. So a 24px icon floated in the middle of its box while the text floated in
   the middle of its own, and the two ended up ~50px apart with the gap changing from
   row to row as the text length changed.

   Each row becomes a flex pair instead: a tight icon column, then the value hard
   against it. The icon column keeps a fixed width so the icons still line up
   vertically with each other, and the text is left-aligned so every row starts on the
   same rail — with centred text of differing lengths, the left edges were ragged. */
.singleroom_attributes_wrapper .singleroom_attribute {
    display: flex;
    align-items: center;
    gap: 14px;
}

.singleroom_attributes_wrapper .room_icon {
    width: 24px;
    /* the glyph's own width — no empty box around it */
    flex: 0 0 auto;
    text-align: center;
}

.singleroom_attributes_wrapper .room_attribute {
    width: auto;
    flex: 1 1 auto;
    text-align: left;
}

/* ---- the bed line's footnote ----
   attributes.js splits a bed field like "2 Double beds, contact us for details on
   larger groups" into the value and the qualifier below it. The qualifier is a
   caveat, not an attribute: it should be legible but must not compete with the four
   values it sits among. */
.singleroom_bed .bw-bed-note {
    display: block;
    margin-top: 4px;
    font-size: 12px;
    line-height: 1.4;
    opacity: 0.65;
}

/* ============================================================================
   The offer banner (bluewaves.php → bw_offer_banner()).

   The old one was a solid #a1d0d4 slab with white text, a 10px radius and a link
   in a second teal — loud enough to read as an ad, and rounded, which nothing
   else on this site is. This keeps the brand teal but spends it on a single 3px
   rule down the left edge, over a pale wash of the same hue. Square corners,
   the theme's own type, and an icon to mark it as a notice rather than a
   paragraph. It should read as a quiet aside — the sort of thing a good hotel
   prints on a card — not as a banner ad.
   ============================================================================ */

.bw-offer {
    --bw-offer-teal: #a1d0d4;
    --bw-offer-ink: #2d6165;
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 0 0 32px;
    padding: 30px 20px;
    border-left: 3px solid var(--bw-offer-teal);
    background-color: color-mix(in srgb, var(--bw-offer-teal) 16%, white);
    color: var(--bw-offer-ink);

}

.bw-offer__icon {
    flex: 0 0 auto;
    width: 30px;
    height: 30px;
    margin-top: 5px;
    background-color: var(--bw-offer-teal);
    --bw-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12.586 2.586A2 2 0 0 0 11.172 2H4a2 2 0 0 0-2 2v7.172a2 2 0 0 0 .586 1.414l8.704 8.704a2.426 2.426 0 0 0 3.42 0l6.58-6.58a2.426 2.426 0 0 0 0-3.42z'/%3E%3Ccircle cx='7.5' cy='7.5' r='.5' fill='%23000'/%3E%3C/svg%3E");
    -webkit-mask: var(--bw-icon) no-repeat center / contain;
    mask: var(--bw-icon) no-repeat center / contain;

}

.bw-offer__body {
    flex: 1 1 auto;
}

/* The theme pads EVERY paragraph with `padding: 1em` via `#page_content_wrapper p`
   (wordpress.css). Both the title and the offer text are paragraphs, so that was
   quietly adding ~48px of invisible space inside a box whose content is only ~75px
   tall — most of the banner's height was padding, not content.

   The ID in the theme's selector outranks a bare class, which is why `padding: 0` on
   .bw-offer__title was ignored. Matching the ID here beats it on specificity and
   keeps !important out of the file. */
#page_content_wrapper .bw-offer p,
.page_content_wrapper .bw-offer p {
    padding: 0;
}

.bw-offer__title {
    margin: 0 0 4px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    /* The theme's body line-height is 1.8 — sane for a paragraph, but on a single
       12px uppercase line it inherits as 21.6px and opens a visible trench between
       the heading and the text below it. A heading is one line; give it one line. */
    line-height: 1.3;
    color: var(--bw-offer-ink);
}

.bw-offer__text,
.bw-offer__text p {
    margin: 0;
    padding: 0;
    /* same 12px <p> padding from the theme — see above */
    /* A step below the body copy (15px), so the notice reads as a secondary voice
       rather than competing with the description that follows it. */
    font-size: 14px;
    line-height: 1.6;
    color: inherit;
}

/* A multi-paragraph offer still needs space BETWEEN its paragraphs — just not around
   the block as a whole. */
.bw-offer__text p+p {
    margin-top: 10px;
}

/* The link is the only thing in here that should look clickable — underlined on the
   ink colour, rather than the old second teal that was barely legible on the slab. */
.bw-offer__text a {
    color: inherit;
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-thickness: 1px;
}

.bw-offer__text a:hover {
    text-decoration-thickness: 2px;
}

/* ============================================================================
   The amenities panel — rebuilt.

   What was there: a full-bleed teal band, an <h2>, and a single run of
   inline-block <li>s each carrying a chevron (::before) and a SOLID Font Awesome
   glyph at 25px. The items wrapped mid-column so the left edges never lined up,
   the chevrons added a second bullet nobody needs, and the solid icons were the
   last place on the page still using the old icon language.

   What it is now: a real two/three-column grid on one rail, no chevrons, and the
   same 1.5px outline icons as the attribute row — so the whole accommodation page
   speaks one visual language.

   The icons are keyed off the Font Awesome CLASS the theme already prints from the
   ACF field on each term (<i class="fa-classic fa-solid fa-wifi">). Nothing in the
   database changes: add a term in wp-admin, pick its FA icon as before, and it gets
   the matching outline here automatically — with a generic check as the fallback for
   any glyph not mapped below, so a new amenity can never render as a blank square.
   ============================================================================ */

/* The teal band is gone. It was doing two jobs badly: shouting for attention that a
   reference list does not need, and forcing white text and white icons that then had
   to be held apart with rules and padding just to stay legible. On the page's own
   white, the list can be dense and quiet — the type does the organising, not the
   colour. The teal survives where it belongs: the BOOK NOW button and the offer
   banner, both of which are actually asking for a decision.

   The section is now bounded by a hairline instead of a slab, and sits on the same
   rail as the page's content. */
#singleroom_amenities {
    padding: 64px 0;
    background-color: #fff;
    border-top: none;
    color: #222;
}

/* The section wraps its content in ANOTHER .page_content_wrapper, with a hardcoded
   `padding: 0 90px`. That is the site's desktop rail expressed as a magic number, so
   it happens to line up at a wide viewport and drifts everywhere else: below 1200px
   the page's real rail narrows to 70px and then 30px, while this stays at 90 and the
   amenities sit inset from the description above them.

   Point it at the same --bw-rail maths the header and the content use, and the block
   tracks the page at every width instead of only at 1440. */
#singleroom_amenities .page_content_wrapper {
    max-width: 1425px;
    margin: 0 auto;
    padding-left: var(--bw-pad);
    padding-right: var(--bw-pad);
    box-sizing: border-box;
}

/* NO horizontal padding here. The theme already centres this box at the content rail
   (it is 1245px wide, auto-centred — the same 97.5px left edge as the page body), so
   the `padding: 0 90px` this rule used to carry was a SECOND rail applied on top of
   the first, and pushed every amenity 90px right of the description above it. The box
   is already on the rail; it just needs to be left alone. */
#singleroom_amenities .singleroom_amenities_content {
    padding: 0;
    box-sizing: border-box;
}

/* A real heading again, in the theme's serif. The 13px uppercase label was far too
   quiet for what is the second most-read block on the page — this is an h2 and should
   carry an h2's weight. */
#singleroom_amenities h2 {
    margin: 0 0 36px;
    font-size: 38px;
    font-weight: 400;
    line-height: 1.2;
    letter-spacing: 0;
    text-transform: none;
    color: #222;
}

/* THE GROUPS sit side by side, in columns — this is where the wasted space was.
   Each group used to take a full-width row of its own, so a group of one item (an
   "Entertainment" with a single TV) burned an entire band of the page, and the eye had
   to travel the full width to find the next heading. Laid out as columns, the whole
   list is one compact block that can be read at a glance.

   `columns` rather than `grid`: the groups have wildly different lengths (Scenic views
   has four items, Internet and office has one), and a column layout flows them to fill
   the available height instead of leaving grid cells half empty. break-inside keeps a
   group from being split across a column boundary. */
#singleroom_amenities .bw-amenity-groups {
    display: flex;
    align-items: flex-start;
    gap: 56px;
}

#singleroom_amenities .bw-amenity-column {
    flex: 1 1 0;
    min-width: 0;
}

#singleroom_amenities .bw-amenity-group {
    margin: 0 0 45px;
}

#singleroom_amenities .bw-amenity-column .bw-amenity-group:last-child {
    margin-bottom: 0;
}

#singleroom_amenities .singleroom_amenities_list {
    display: block;
    /* one item per line WITHIN a group; the groups are the columns */
    margin: 0;
    padding: 0;
    list-style: none;
}

#singleroom_amenities .singleroom_amenities_list li {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0;
    max-width: none;
    padding: 7px 0;
    font-size: 14px;
    line-height: 1.5;
    border-bottom: none;

}

/* The theme's chevron. It was a second bullet in front of every icon. */
#singleroom_amenities .singleroom_amenities_list li::before {
    content: none;
}

/* ---- the icons ----
   The <i> keeps its Font Awesome classes (that is how the glyph is identified), but
   the font glyph itself is suppressed with font-size:0 and the element is painted as
   a mask instead. currentColor keeps them the same white as the text beside them. */
#singleroom_amenities .singleroom_amenities_list i,
.bw-amenities i {
    display: inline-block;
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    margin-top: 2px;
    /* optical: sits on the first line's cap-height */
    font-size: 0;
    /* kills the solid FA glyph underneath */
    /* Was white on teal. On the page's own ground it inherits the text colour, but at
       60% — the icon is a marker, not a second word, and at full strength 14 of them
       in a column start to read as noise. */
    background-color: currentColor;
    opacity: 0.6;

    -webkit-mask: var(--bw-icon, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E")) no-repeat center / contain;
    mask: var(--bw-icon, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E")) no-repeat center / contain;
}

/* Mapped by the FA class the ACF field emits. Unscoped, so the same outline shows up
   wherever an amenity icon is printed — the panel here AND the cards in the listing
   loop (.bw-amenities, see bluewaves.php). */
.fa-wind {
    --bw-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M17.7 7.7a2.5 2.5 0 1 1 1.8 4.3H2'/%3E%3Cpath d='M9.6 4.6A2 2 0 1 1 11 8H2'/%3E%3Cpath d='M12.6 19.4A2 2 0 1 0 14 16H2'/%3E%3C/svg%3E");
}

.fa-fan {
    --bw-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 12c0-3 2.5-5.5 5.5-5.5S23 9 23 12'/%3E%3Cpath d='M12 12c3 0 5.5 2.5 5.5 5.5S15 23 12 23'/%3E%3Cpath d='M12 12c0 3-2.5 5.5-5.5 5.5S1 15 1 12'/%3E%3Cpath d='M12 12c-3 0-5.5-2.5-5.5-5.5S9 1 12 1'/%3E%3Ccircle cx='12' cy='12' r='1.5'/%3E%3C/svg%3E");
}

.fa-umbrella-beach {
    --bw-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 12v7a2 2 0 0 0 4 0'/%3E%3Cpath d='M2 12a10 10 0 0 1 20 0Z'/%3E%3C/svg%3E");
}

.fa-city {
    --bw-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 21h18'/%3E%3Cpath d='M5 21V7l7-4v18'/%3E%3Cpath d='M19 21V11l-7-4'/%3E%3Cpath d='M9 9v.01M9 13v.01M9 17v.01'/%3E%3C/svg%3E");
}

.fa-tree,
.fa-tree-city {
    --bw-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22v-7'/%3E%3Cpath d='m9 15-3-3 2-.5L5 8l2-.5L12 2l5 5.5L19 8l-3 3.5 2 .5-3 3Z'/%3E%3C/svg%3E");
}

.fa-soap {
    --bw-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2.7c1.5 2 4 5 4 7.3a4 4 0 0 1-8 0c0-2.3 2.5-5.3 4-7.3Z'/%3E%3Cpath d='M6 18h12'/%3E%3Cpath d='M6 21h12'/%3E%3C/svg%3E");
}

.fa-bed {
    --bw-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 20v-8a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v8'/%3E%3Cpath d='M4 10V6a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v4'/%3E%3Cpath d='M12 4v6'/%3E%3Cpath d='M2 18h20'/%3E%3C/svg%3E");
}

.fa-video {
    --bw-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m22 8-6 4 6 4V8Z'/%3E%3Crect x='2' y='6' width='14' height='12' rx='2'/%3E%3C/svg%3E");
}

.fa-tv {
    --bw-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='7' width='20' height='13' rx='2'/%3E%3Cpath d='m17 2-5 5-5-5'/%3E%3C/svg%3E");
}

.fa-square-parking {
    --bw-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='2'/%3E%3Cpath d='M9 17V7h4a3 3 0 0 1 0 6H9'/%3E%3C/svg%3E");
}

.fa-wifi {
    --bw-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20h.01'/%3E%3Cpath d='M2 8.82a15 15 0 0 1 20 0'/%3E%3Cpath d='M5 12.859a10 10 0 0 1 14 0'/%3E%3Cpath d='M8.5 16.429a5 5 0 0 1 7 0'/%3E%3C/svg%3E");
}

.fa-sink {
    --bw-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 13h18'/%3E%3Cpath d='M5 13v3a4 4 0 0 0 4 4h6a4 4 0 0 0 4-4v-3'/%3E%3Cpath d='M12 13V6a2 2 0 0 1 2-2h1'/%3E%3C/svg%3E");
}

.fa-kitchen-set {
    --bw-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12h20'/%3E%3Cpath d='M4 12v5a3 3 0 0 0 3 3h10a3 3 0 0 0 3-3v-5'/%3E%3Cpath d='m7 9 2-5'/%3E%3Cpath d='m17 9-2-5'/%3E%3C/svg%3E");
}

.fa-person-walking {
    --bw-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='13' cy='4' r='2'/%3E%3Cpath d='m11 8-3 3 2 3'/%3E%3Cpath d='M11 8h2l2 4 3 1'/%3E%3Cpath d='m10 14-2 8'/%3E%3Cpath d='m13 13 2 4 1 5'/%3E%3C/svg%3E");
}

.fa-map-location-dot {
    --bw-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 10c0 4.993-5.539 10.193-7.399 11.799a1 1 0 0 1-1.202 0C9.539 20.193 4 14.993 4 10a8 8 0 0 1 16 0'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E");
}

.fa-utensils {
    --bw-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 2v7c0 1.1.9 2 2 2h1a2 2 0 0 0 2-2V2'/%3E%3Cpath d='M6 11v11'/%3E%3Cpath d='M5 2v5'/%3E%3Cpath d='M7 2v5'/%3E%3Cpath d='M18 2c-1.7 0-3 2.2-3 5s1 4 2 4v11'/%3E%3C/svg%3E");
}

.fa-hot-tub-person {
    --bw-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12h18v4a4 4 0 0 1-4 4H7a4 4 0 0 1-4-4Z'/%3E%3Cpath d='M7 9c0-1 1-1.5 1-2.5S7 4.5 7 3.5'/%3E%3Cpath d='M12 9c0-1 1-1.5 1-2.5S12 4.5 12 3.5'/%3E%3Cpath d='M17 9c0-1 1-1.5 1-2.5S17 4.5 17 3.5'/%3E%3C/svg%3E");
}

.fa-dog {
    --bw-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='4' r='2'/%3E%3Ccircle cx='18' cy='8' r='2'/%3E%3Ccircle cx='20' cy='16' r='2'/%3E%3Cpath d='M9 10a5 5 0 0 1 5 5v3.5a3.5 3.5 0 0 1-6.84 1.045Q6.52 17.48 4.46 16.84A3.5 3.5 0 0 1 5.5 10Z'/%3E%3C/svg%3E");
}

.fa-door-open {
    --bw-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M13 4h3a2 2 0 0 1 2 2v14'/%3E%3Cpath d='M2 20h3'/%3E%3Cpath d='M13 20h9'/%3E%3Cpath d='M10 12v.01'/%3E%3Cpath d='M13 4.562v16.157a1 1 0 0 1-1.242.97L5 20V5.562a2 2 0 0 1 1.515-1.94l4-1A2 2 0 0 1 13 4.561Z'/%3E%3C/svg%3E");
}

.fa-bell {
    --bw-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.268 21a2 2 0 0 0 3.464 0'/%3E%3Cpath d='M3.262 15.326A1 1 0 0 0 4 17h16a1 1 0 0 0 .74-1.673C19.41 13.956 18 12.499 18 8A6 6 0 0 0 6 8c0 4.499-1.411 5.956-2.738 7.326'/%3E%3C/svg%3E");
}

.fa-water {
    --bw-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 6c.6.5 1.2 1 2.5 1C7 7 7 5 9.5 5c2.6 0 2.4 2 5 2 2.5 0 2.5-2 5-2 1.3 0 1.9.5 2.5 1'/%3E%3Cpath d='M2 12c.6.5 1.2 1 2.5 1 2.5 0 2.5-2 5-2 2.6 0 2.4 2 5 2 2.5 0 2.5-2 5-2 1.3 0 1.9.5 2.5 1'/%3E%3Cpath d='M2 18c.6.5 1.2 1 2.5 1 2.5 0 2.5-2 5-2 2.6 0 2.4 2 5 2 2.5 0 2.5-2 5-2 1.3 0 1.9.5 2.5 1'/%3E%3C/svg%3E");
}

.fa-feather {
    --bw-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12.67 19a2 2 0 0 0 1.416-.588l6.154-6.172a6 6 0 0 0-8.49-8.49L5.586 9.914A2 2 0 0 0 5 11.328V18a1 1 0 0 0 1 1z'/%3E%3Cpath d='M16 8 2 22'/%3E%3Cpath d='M17.5 15H9'/%3E%3C/svg%3E");
}

.fa-bath {
    --bw-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12h20v3a5 5 0 0 1-5 5H7a5 5 0 0 1-5-5Z'/%3E%3Cpath d='M4 12V5a2 2 0 0 1 4 0v1'/%3E%3Cpath d='M5 20l-1 2'/%3E%3Cpath d='M19 20l1 2'/%3E%3C/svg%3E");
}

.fa-shower {
    --bw-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 20V6a3 3 0 0 1 6 0v1'/%3E%3Ccircle cx='16' cy='7' r='4'/%3E%3Cpath d='M12 15v.01M16 17v.01M20 15v.01M14 20v.01M18 20v.01'/%3E%3C/svg%3E");
}

.fa-shirt {
    --bw-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='2' width='18' height='20' rx='2'/%3E%3Ccircle cx='12' cy='13' r='5'/%3E%3Cpath d='M7 6h.01'/%3E%3C/svg%3E");
}

#singleroom_amenities .bw-amenity-group__title {
    margin: 0 0 6px;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: rgb(0 0 0 / 0.45);

}

#singleroom_amenities .singleroom_amenities_list li span {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

#singleroom_amenities .bw-amenity-note {
    font-size: 12px;
    line-height: 1.35;
    /* The name is the fact; the note is the gloss. Stepped back, so the list still
       scans on the names alone. */
    color: rgb(0 0 0 / 0.5);
}

.bw-section-title {
    max-width: 1425px;
    margin: 0 auto 36px;
    padding: 0 var(--bw-pad);
    box-sizing: border-box;
    font-size: 38px;
    font-weight: 400;
    line-height: 1.2;
    color: #222;
}

.mobile_menu_wrapper {
    background-color: transparent !important;
}

@media screen and (min-width:1024px) {
    body.modalview {
        background: radial-gradient(circle, rgba(163, 209, 213, 0.8) 0%, rgba(255, 255, 255, 0) 100%);
    }
}

.top-email a i.fa-envelope {
    display: inline-block;
    width: 15px;
    height: 15px;
    margin-right: 3px;
    vertical-align: middle;
    font-size: 0;
    line-height: 1;
    background-color: currentColor;
    -webkit-mask: var(--bw-icon) no-repeat center / contain;
    mask: var(--bw-icon) no-repeat center / contain;
    --bw-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='4' width='20' height='16' rx='2'/%3E%3Cpath d='m22 7-8.97 5.7a1.94 1.94 0 0 1-2.06 0L2 7'/%3E%3C/svg%3E");
}

.gallery_grid_item a.tg_gallery_lightbox[href$=".mp4"] {
    position: relative;
    display: block;
}

.gallery_grid_item a.tg_gallery_lightbox[href$=".mp4"]::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 64px;
    height: 64px;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    background-color: rgb(161 208 212 / 0.95);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fff'%3E%3Cpath d='M10 7.6l6.4 4.4-6.4 4.4z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 22px 22px;
    pointer-events: none;
    transition: background-color 250ms ease, transform 250ms ease;
    z-index: 2;
}

.gallery_grid_item a.tg_gallery_lightbox[href$=".mp4"]:hover::after {
    background-color: rgb(161 208 212 / 1);
    transform: translate(-50%, -50%) scale(1.08);
}

.bw-listing .mphb-room-type .mphb-view-details-button {
    margin-top: 20px;
}

.bw-gallery-video {
    height: 600px;
}

.bw-gallery-video__media {
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: cover;
    background: #000;
}

body.bw-discover-page #wrapper {
    overflow-x: clip;
}

body.bw-discover-page #page_caption.hasbg h1 {
    font-size: clamp(40px, 7vw, 76px) !important;
    line-height: 1.06;
    letter-spacing: -0.015em;
}

.bw-discover {
    --bw-discover-ink: #0f172b;
    --bw-discover-accent: #2d6165;
    --bw-discover-band: #f9f9f9;
    --bw-discover-text: #4a5565;
    counter-reset: bw-discover;
}

.bw-discover__section {
    counter-increment: bw-discover;
    position: relative;
    padding: clamp(54px, 7vw, 104px) 0;
}

.bw-discover__section:nth-of-type(even)::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    width: 100vw;
    transform: translateX(-50%);
    background: var(--bw-discover-band);
}

.bw-discover__inner {
    position: relative;
}

#page_content_wrapper .bw-discover__title {
    margin: 0 0 26px;
    font-family: "Tinos", serif;
    font-size: clamp(31px, 3.7vw, 44px);
    font-weight: 400;
    line-height: 1.16;
    letter-spacing: -0.01em;
    color: var(--bw-discover-ink);
}

.bw-discover__title::before {
    content: counter(bw-discover, decimal-leading-zero);
    display: block;
    margin-bottom: 18px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.24em;
    line-height: 1;
    color: var(--bw-discover-accent);
}

.bw-discover__title::after {
    content: "";
    display: block;
    width: 58px;
    height: 2px;
    margin-top: 26px;
    background: var(--bw-discover-ink);
}

.bw-discover__body {
    max-width: 68ch;
}

#page_content_wrapper .bw-discover__body p {
    margin: 0 0 1.4em;
    font-size: 17px;
    line-height: 1.85;
    color: var(--bw-discover-text);
}

#page_content_wrapper .bw-discover__body p:last-child {
    margin-bottom: 0;
}

.bw-discover__subtitle {
    margin: 26px 0 0;
    font-size: 16px;
    line-height: 1.6;
    letter-spacing: 0.02em;
    color: var(--bw-discover-accent);
}

@media (min-width: 900px) {
    .bw-discover__inner {
        display: grid;
        grid-template-columns: minmax(240px, 330px) 1fr;
        gap: clamp(44px, 5.5vw, 96px);
        align-items: start;
    }

    #page_content_wrapper .bw-discover__title {
        margin-bottom: 0;
    }

    .bw-discover__section:nth-of-type(even) .bw-discover__inner {
        grid-template-columns: 1fr minmax(240px, 330px);
    }

    .bw-discover__section:nth-of-type(even) .bw-discover__head {
        grid-column: 2;
        grid-row: 1;
        text-align: right;
    }

    .bw-discover__section:nth-of-type(even) .bw-discover__title::after {
        margin-left: auto;
    }

    .bw-discover__section:nth-of-type(even) .bw-discover__body {
        grid-column: 1;
        grid-row: 1;
        justify-self: end;
    }
}

@media screen and (min-width:1024px) {
    .mobile_menu_wrapper {
        min-width: 520px;
        padding: 40px !important;
    }
}

@media screen and (min-width:1024px) and (max-width:1200px) {
    .mobile_menu_wrapper {
        padding: 20px !important;
    }

    .mobile_main_nav li a,
    #sub_menu li a {
        font-size: 20px !important;
    }
}

.bw-cf7-row>p {
    margin: 0;
}

.wpcf7-form textarea.bw-cf7-message {
    height: 132px;
    min-height: 0;
    resize: vertical;
}

@media (min-width: 768px) {
    .bw-cf7-row {
        display: grid;
        grid-template-columns: 1fr 1fr;
        column-gap: 24px;
    }
}

#maps:has(.elementor-widget-google_maps) {
    --bw-maps-ink: #0f172b;
    --bw-maps-accent: #2d6165;
    --bw-maps-band: #f9f9f9;
    --bw-maps-text: #4a5565;
    position: relative;
    counter-reset: bw-maps;
    padding: clamp(54px, 7vw, 104px) 0;
}

#maps:has(.elementor-widget-google_maps)::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    width: 100vw;
    transform: translateX(-50%);
    background: var(--bw-maps-band);
}

#maps:has(.elementor-widget-google_maps)>.elementor-container {
    position: relative;
}

#maps:has(.elementor-widget-google_maps) .elementor-column {
    counter-increment: bw-maps;
}

#page_content_wrapper #maps:has(.elementor-widget-google_maps) .elementor-widget-heading,
#page_content_wrapper #maps:has(.elementor-widget-google_maps) .elementor-widget-text-editor,
#page_content_wrapper #maps:has(.elementor-widget-google_maps) .elementor-heading-title,
#page_content_wrapper #maps:has(.elementor-widget-google_maps) .elementor-widget-text-editor p {
    text-align: left;
}

#maps:has(.elementor-widget-google_maps) .elementor-widget-heading .elementor-widget-container::before {
    content: counter(bw-maps, decimal-leading-zero);
    display: block;
    margin-bottom: 16px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.24em;
    line-height: 1;
    color: var(--bw-maps-accent);
}

#page_content_wrapper #maps:has(.elementor-widget-google_maps) .elementor-heading-title {
    margin: 0;
    font-family: "Tinos", serif;
    font-size: clamp(21px, 1.9vw, 26px);
    font-weight: 400;
    line-height: 1.24;
    letter-spacing: -0.01em;
    color: var(--bw-maps-ink);
}

#maps:has(.elementor-widget-google_maps) .elementor-heading-title b {
    font-weight: 400;
}

#maps:has(.elementor-widget-google_maps) .elementor-widget-heading .elementor-widget-container::after {
    content: "";
    display: block;
    width: 58px;
    height: 2px;
    margin-top: 22px;
    background: var(--bw-maps-ink);
}

#maps:has(.elementor-widget-google_maps) .elementor-widget-google_maps {
    margin-top: 28px;
}

#maps:has(.elementor-widget-google_maps) .elementor-custom-embed {
    overflow: hidden;
    line-height: 0;
}

#maps:has(.elementor-widget-google_maps) .elementor-custom-embed iframe {
    display: block;
    width: 100%;
    height: 260px;
    border: 0;
    filter: grayscale(1) contrast(0.95);
    transition: filter 0.5s ease;
}

#maps:has(.elementor-widget-google_maps) .elementor-column:hover .elementor-custom-embed iframe {
    filter: grayscale(0) contrast(1);
}

#maps:has(.elementor-widget-google_maps) .elementor-widget-text-editor {
    margin-bottom: 0;
}

#page_content_wrapper #maps:has(.elementor-widget-google_maps) .elementor-widget-text-editor p {
    margin: 20px 0 0;
    padding: 0;
    font-size: 16px;
    line-height: 1.75;
    color: var(--bw-maps-text);
}

#maps:has(.elementor-widget-google_maps) .elementor-widget-button {
    margin-top: 20px;
}

#maps:has(.elementor-widget-google_maps) .elementor-button-wrapper {
    text-align: left;
    line-height: 1;
}

#page_content_wrapper #maps:has(.elementor-widget-google_maps) a.elementor-button {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 0;
    background: transparent;
    border: 0;
    border-radius: 0;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--bw-maps-accent);
    transition: color 0.3s ease;
}

#page_content_wrapper #maps:has(.elementor-widget-google_maps) a.elementor-button::after {
    content: "";
    width: 22px;
    height: 1px;
    background: currentColor;
    transition: width 0.35s ease;
}

#page_content_wrapper #maps:has(.elementor-widget-google_maps) a.elementor-button:hover {
    background: transparent;
    color: var(--bw-maps-ink);
}

#page_content_wrapper #maps:has(.elementor-widget-google_maps) a.elementor-button:hover::after {
    width: 34px;
}

@media (min-width: 768px) {
    #page_content_wrapper #maps:has(.elementor-widget-google_maps) .elementor-heading-title {
        min-height: 2.48em;
    }
}

@media (max-width: 767px) {
    #maps:has(.elementor-widget-google_maps) .elementor-column:not(:last-child) .elementor-widget-wrap {
        margin-bottom: 46px;
    }
}

#footer .social_wrapper ul li a {
    transition: opacity 0.25s ease;
}

#footer .social_wrapper ul li a:hover,
#footer .social_wrapper ul li a:focus-visible {
    opacity: 0.6;
}

.mphb-reserve-rooms-details,
#mphb-price-details>table>tbody>tr.mphb-price-breakdown-booking.mphb-price-breakdown-group,
.mphb-required-fields-tip,
#mphb-price-details {
    display: none !important;
}

#mphb-price-details tr,
#mphb-price-details th,
#mphb-price-details td {
    padding: 0;
    border: none !important;
    font-weight: 400;
}

#mphb-price-details>table>tfoot>tr>th.mphb-table-price-column>span {
    font-weight: bold;
}

table.mphb-price-breakdown {
    width: auto !important;
}

.mphb-booking-details-title,
.mphb-price-breakdown-title,
.mphb-customer-details-title,
.mphb-reservation-submitted-title {
    font-family: "Tinos", serif !important;
    font-size: 24px;
}

body.page-id-29 #page_caption.hasbg .page_tagline {
    max-width: 620px;
    margin-left: auto;
    margin-right: auto;
    font-size: 17px;
    letter-spacing: 0;
    line-height: 1.6;
    text-transform: none;
}

@media (min-width: 768px) {
    #mphb-customer-details {
        display: grid;
        grid-template-columns: 1fr 1fr;
        column-gap: 24px;
    }

    #mphb-customer-details>* {
        grid-column: 1 / -1;
        margin-left: 0;
        margin-right: 0;
    }

    #mphb-customer-details>.mphb-customer-name,
    #mphb-customer-details>.mphb-customer-last-name,
    #mphb-customer-details>.mphb-customer-email,
    #mphb-customer-details>.mphb-customer-phone {
        grid-column: span 1;
    }
}

#mphb-customer-details input[type="text"],
#mphb-customer-details input[type="email"],
#mphb-customer-details input[type="tel"],
#mphb-customer-details select,
#mphb-customer-details textarea {
    width: 100%;
    box-sizing: border-box;
}

#mphb-customer-details select {
    padding: 10px 24px 10px 0;
    background-color: #fff;
    border: 0;
    border-bottom: 1px solid #222222;
    border-radius: 0;
    outline: none;
    transition: border-color linear .3s;
    -webkit-appearance: none;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23222' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 2px center;
    background-size: 16px 16px;
}

@media screen and (max-width: 1024px) {
    .gt_white_content {
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        margin: 0 !important;
        position: static !important;
    }

    .gt_black_overlay {
        display: none !important;
    }

    .gt_white_content,
    .gt_white_content a {
        padding: 0 !important;
        border: none !important;
    }

    .glink.nturl {
        display: block !important;
        width: 100% !important;
        overflow: hidden;
        text-overflow: ellipsis;
        margin-bottom: 4px;
    }

    .glink.gt-current-lang {
        display: none !important;
    }
}