/* 
DATA-LOAD STATUS
*/
/* body[data-load="false"] * {transition: 0s !important;}
body[data-load="false"] header {translate: 0 -100%;}
body[data-load="false"] #footer-container {translate: 0 100%;}

body[data-load="false"] #loading-screen {z-index: 500;}
body[data-load="true"] #loading-screen {display: none !important;} */




/* 
TRANSITIONS
*/
/* #transition-overlay {z-index: 99999999;}
body[data-transition="false"] #transition-overlay {display: none !important;} */




/* 
NAV BUILDER
*/
#nav-builder,
#nav-builder * {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    appearance: none !important;
}




/* 
HERO
*/
#hero {z-index: -1;}
#hero * {transition: opacity 1000ms;}

body[data-template="article"] #hero *,
body[data-template="bar_food"] #hero *,
body[data-template="default"] #hero *,
body[data-template="event"] #hero *,
body[data-template="faq"] #hero *,
body[data-template="location"] #hero *,
body[data-template="penthouse"] #hero *,
body[data-template="product"] #hero *,
body[data-template="rooms"] #hero *,
body[data-template="room"] #hero *,
body[data-template="shop"] #hero * {opacity: 0;}




/* 
BACKGROUNDS
*/
.page-background {
    position: sticky;
    top: 0;
    right: 0;
    left: 0;
    opacity: .5;
    z-index: 0;
}

.page-header {
    position: sticky;
    top: 0;
    z-index: 2;
    min-width: 100vw;
    max-width: 100vw;
    min-height: var(--header_height);
    max-height: var(--header_height);
    transition: min-height 750ms, max-height 750ms;
}

.page-header .--media {opacity: .5;}




/* CENTER ITEM */
.page-center {
    position: absolute;
    top: 50vh;
    left: 50vw;
    transform: translate(-50%, -50%);
    z-index: 5;
    width: 100%;
    max-width: var(--max_width);
    margin: 0 auto;
    padding: 0 var(--size_xl);
}

.page-center.t-xlarge {
    max-width: unset;
    padding: 0 var(--size_m);
}

.page-title {
    margin-bottom: var(--size_l);
}




/* 
BUTTONS
*/
.button {
    background: white;
    padding: .75rem var(--size_m);
    border-radius: var(--size_s);
}
.button,
.button span {
    white-space: nowrap;
    overflow: hidden;
}

.button.--loc_color {
    background: var(--c-location);
    color: var(--c-text-location);
}
.button.--gray {background: rgb(240, 240, 240);}
.button.--dark {
    background: black;
    color: white;
}

@media only screen and (min-width: 1096px) {.button {padding: .5rem 1rem;}}

@media (hover: hover) {
    .button.--hover {transition: background 500ms, color 500ms;}

    .button.--hover:hover,
    .button.--hovering {
        background: black;
        color: white;
    }

    .button.--loc_color.--hover:hover,
    .button.--loc_color.--hovering {
        background: var(--c-text-location);
        color: var(--c-location) !important;
    }

    .button.--dark.--hover:hover,
    .button.--dark.--hovering {
        background: rgb(240, 240, 240);
        color: black;
    }

    /* TARGET */
    body[data-transition="true"] .button.--hovering {transition: 0s;}
}



/* #location-booking {
    top: calc(var(--size_xxl) + calc(33px * 4) + calc(var(--size_s) * 4));
    transform: translate(-50%, 0);
    opacity: 0;
    visibility: hidden;
    transition: top 500ms, translate 500ms, transform 500ms, width 500ms;
}

body[data-template="location"] #location-booking,
body[data-template="rooms"] #location-booking,
body[data-template="room"] #location-booking {
    opacity: 1;
    visibility: visible;
}

body[data-template="rooms"] #location-booking,
body[data-template="room"] #location-booking {
    top: 50vdh !important;
    transform: translate(-50%, -50%) !important;
}

#location-booking-section > iframe {
    width: calc(100vw - 2rem);
    height: calc(100dvh - 16rem);
    transform: translate(1rem, 1rem);
    z-index: 10;
}

#ot-widget-container13 {
    position: absolute;
    display: flex;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}
#bar_food-booking iframe {margin: auto;}

@media only screen and (min-width: 768px) {
    #location-booking {
        top: calc(var(--size_xxl) + 33px + var(--size_s));
        width: 368px;
    }

    #location-booking-section > iframe {
        width: 100vw;
        height: 100dvh;
        transform: translate(0, 0);
    }

    #location-booking-section > button {
        top: var(--size);
        left: var(--size);
        bottom: unset;
        transform: translate(0);
    }

    body[data-template="rooms"] #location-booking,
    body[data-template="room"] #location-booking {
        top: 50dvh !important;
        transform: translate(-50%, -50%) !important;
        width: 20vw !important;
    }
}
@media only screen and (min-width: 1096px) {
    #location-booking {
        top: calc(var(--size_xxl) + 28px + var(--size_s));
        width: calc(120rem - calc(var(--size_l) * 2));
    }

    body[data-template="rooms"] #location-booking,
    body[data-template="room"] #location-booking {
        top: 50dvh !important;
        transform: translate(-50%, -50%) !important;
        width: 20vw !important;
    }
} */