120 lines
2.4 KiB
CSS
120 lines
2.4 KiB
CSS
:root {
|
|
--current-max-width: 113.5rem;
|
|
|
|
--max-width: 94.5rem;
|
|
--max-width-content: min(calc(100dvw - var(--max-width-spacing)), 74.75rem);
|
|
--max-width-text-block: 49.5rem;
|
|
--current-mobile-site-header-height: 52.41px;
|
|
--max-width-navigation: 89.5rem;
|
|
|
|
--max-width-single-spacing: var(--Layout-Mobile-Margin-Margin-min);
|
|
--max-width-spacing: calc(var(--max-width-single-spacing) * 2);
|
|
--max-width-page: min(
|
|
calc(100dvw - var(--max-width-spacing)),
|
|
var(--max-width-navigation)
|
|
);
|
|
|
|
--sitewide-alert-height: 0px; /* Will be overridden when a sitewide alert is visible */
|
|
--main-menu-mobile-height: 75px;
|
|
--main-menu-desktop-height: 125px;
|
|
--booking-widget-mobile-height: 75px;
|
|
--booking-widget-tablet-height: 150px;
|
|
--booking-widget-desktop-height: 77px;
|
|
--hotel-page-map-desktop-width: 23.75rem;
|
|
|
|
/* Z-INDEX */
|
|
--header-z-index: 11;
|
|
--menu-overlay-z-index: 11;
|
|
--booking-widget-z-index: 10;
|
|
--booking-widget-open-z-index: 100;
|
|
--dialog-z-index: 9;
|
|
--back-to-top-button: 80;
|
|
--language-switcher-z-index: 85;
|
|
--sidepeek-z-index: 100;
|
|
--lightbox-z-index: 150;
|
|
--default-modal-overlay-z-index: 100;
|
|
--default-modal-z-index: 101;
|
|
|
|
--modal-box-shadow: 0px 4px 24px 0px rgba(38, 32, 30, 0.08);
|
|
--popup-box-shadow: 0 0 14px 6px rgba(0, 0, 0, 0.1);
|
|
|
|
@supports (interpolate-size: allow-keywords) {
|
|
interpolate-size: allow-keywords;
|
|
}
|
|
}
|
|
|
|
* {
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
html,
|
|
body {
|
|
margin: 0;
|
|
padding: 0;
|
|
scroll-behavior: smooth;
|
|
}
|
|
|
|
body {
|
|
min-height: 100dvh;
|
|
overflow-x: hidden;
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
body.overflow-hidden {
|
|
overflow: hidden;
|
|
}
|
|
|
|
.root {
|
|
isolation: isolate;
|
|
}
|
|
|
|
/* From Tailwind */
|
|
.sr-only {
|
|
position: absolute;
|
|
width: 1px;
|
|
height: 1px;
|
|
padding: 0;
|
|
margin: -1px;
|
|
overflow: hidden;
|
|
clip: rect(0, 0, 0, 0);
|
|
white-space: nowrap;
|
|
border-width: 0;
|
|
}
|
|
|
|
ul {
|
|
padding-inline-start: 0;
|
|
margin-block-start: 0;
|
|
margin-block-end: 0;
|
|
}
|
|
|
|
/* From Tailwind */
|
|
.sr-only {
|
|
position: absolute;
|
|
width: 1px;
|
|
height: 1px;
|
|
padding: 0;
|
|
margin: -1px;
|
|
overflow: hidden;
|
|
clip: rect(0, 0, 0, 0);
|
|
white-space: nowrap;
|
|
border-width: 0;
|
|
}
|
|
|
|
@media screen and (min-width: 768px) {
|
|
:root {
|
|
--max-width-single-spacing: var(--Layout-Tablet-Margin-Margin-min);
|
|
}
|
|
|
|
body.overflow-hidden {
|
|
overflow: auto;
|
|
overflow-x: hidden;
|
|
}
|
|
}
|
|
|
|
@media screen and (min-width: 1367px) {
|
|
:root {
|
|
--max-width-single-spacing: var(--Layout-Desktop-Margin-Margin-min);
|
|
}
|
|
}
|