:root {  --page-width: 2048px; --header-height: 170.5px; --header-height-head: 87px; --header-height-mobile: 117.5px;  --font-family: "Montserrat", sans-serif;  --color-hover: var(--color-primary); --color-dark-rgb: 71,71,73; --error: #b30000;  --gap: 1rem; --section-padding-y: 5rem; --banner-padding-y: 9rem; --spacing: 1.5rem; --slider-arrow-size: 2rem; --checkbox-size: 1rem; --border-width: 1px; --border-radius: 10px; --border-image: linear-gradient(rgba(var(--color-dark-rgb),0.75) 101%, transparent) 0 fill; --box-shadow: 0 0.25rem 0.5rem 0 rgba(var(--color-dark-rgb),0.25); --form-padding: 0.5rem; --text-wide: 90ch; --text-medium: 70ch; --text-narrow: 46ch;  --transition-duration: 0.5s; --transition: ease var(--transition-duration); --animation-speed: 0.5s;  --accessibility-min-size: 24px; } @media (max-width: 991px) { :root { --header-height: var(--header-height-mobile); --header-height-head: 57px; } } @media (max-width: 767px) { :root { --section-padding-y: 3rem; --banner-padding-y: 5rem; } }  @media (max-width: 600px) { body.bricks-is-frontend.admin-bar #brx-header.sticky.scrolling { top: 0; } }    html { scroll-behavior: smooth; scroll-padding-top: var(--header-height); } html, body { font-family: var(--font-family); font-size: 16px; color: var(--color-dark); } body { background-color: var(--color-white); font-weight: 400; line-height: 1.5; overflow-x: clip; } svg:not(.menu-item-icon) path { fill: currentColor; } ::selection { background-color: var(--color-dark); color: var(--color-primary); } * { scrollbar-color: var(--color-dark) var(--color-white); scrollbar-width: thin; }  main img { object-fit: cover; object-position: center center; } a img { transition: var(--transition); } figure a { display: block; height: 100%; border-radius: var(--border-radius); overflow: hidden; } .teaser a.brxe-image:is(:hover, :focus) img, a:is(:hover, :focus) img { transform: scale(1.1); } .slider-wrapper--bg .splide__slide a:is(:hover, :focus) img, .wpml-ls a:is(:hover, :focus) img { transform: none; }  .hidden, [hidden] { display: none!important; opacity: 0; visibility: hidden; } body.bricks-is-frontend :focus-visible { outline: 2px dashed var(--color-dark); outline-offset: 2px; }  .visually-hidden, .link--contact-icononly .text { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; border-width: 0; white-space: nowrap; overflow: hidden; clip: rect(0,0,0,0); } .link--contact-icononly .text { color: transparent; }  section[data-wpr-lazyrender="1"] { content-visibility: visible; }  h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 { margin-bottom: 1rem; font-family: var(--font-family); font-weight: 400; line-height: normal; text-wrap: balance; } h1, .h1 { font-size: 3.5rem; } h2, .h2 { font-size: 2.75rem; } h3, .h3 { font-size: 1.875rem; } h4, .h4 { font-size: 1.25rem; } h5, .h5 { font-size: 1.125rem; } h6, .h6, .box--faq .accordion-title-wrapper .brxe-heading { font-size: 1rem; } @media (max-width: 991px) { h1, .h1 { font-size: 3rem; } h2, .h2 { font-size: 2.25rem; } } @media (max-width: 478px) { h1, .h1 { font-size: 2rem; } h2, .h2 { font-size: 1.875rem; } h3, .h3 { font-size: 1.625rem; } } @media (max-width: 320px) { h1, .h1 { font-size: 1.875rem; } } b, strong { font-weight: 600; } em, address { font-style: normal; } a, a.brxe-text-link .text, a.brxe-text-link .icon { transition: var(--transition); } .brxe-text a:not(.bricks-button), .brxe-text-basic a:not(.bricks-button), label a, .link--contact:is(:hover, :focus) { text-decoration: underline; color: inherit; } a.brxe-text-link .icon path { fill: currentColor; }  .dsgvo-reference { font-size: 0.8rem; }  section { padding: var(--section-padding-y) 1rem; overflow-x: hidden; } section section { padding: 0; } .brxe-container { width: 1180px; align-items: center; } .brxe-container.container--wide { width: 1250px; } .brxe-container.container--narrow { width: 900px; } .brxe-container.container--left { align-items: flex-start; } .brxe-container.container--right { align-items: flex-end; } header + main { margin-top: var(--header-height); } .hero, .banner, .split--fullwidth, .parallax, .slider-wrapper, .slider-wrapper--bg, .map-wrapper { width: 100%; max-width: var(--page-width); } .slider-wrapper .splide__slide, .slider-wrapper--bg, .banner { padding: var(--banner-padding-y) 1rem; } .hero, .banner { border-image: var(--border-image); }  .brxe-text :where(ul, ol) { padding-left: 1.5em; } .brxe-text :where(ol, ul):first-child { margin-top: 0; } .brxe-text :where(ol, ul):last-child { margin-bottom: 0; } .brxe-text :where(ol, ul):only-child { margin: 0; } .brxe-text :where(ol, ul) li:not(:last-child) { margin-bottom: 0.5em; } .brxe-text ul ::marker { color: var(--color-primary); } .bg--primary ul ::marker { color: var(--color-dark); }  figure.caption figcaption { text-align: left; text-transform: uppercase; } .split__img, .slider--small :where(figure.caption, img) { border-radius: var(--border-radius); }  p { margin-bottom: var(--spacing); } p:last-of-type { margin-bottom: 0; } main :where(ul, ol):not(.options-wrapper, .img-gallery) { margin: var(--spacing) 0; padding-left: 2.5ch; } p:not(:last-of-type) + :where(ul, ol):not(.options-wrapper, .img-gallery) { margin-top: calc(var(--spacing) / 2 * -1); } p:last-of-type + :where(ul, ol):not(.options-wrapper, .img-gallery) { margin-top: calc(var(--spacing) / 2); } .brxe-text :where(ul, ol):first-child { margin-top: 0; } .brxe-text :where(ul, ol):last-child { margin-bottom: 0; } .brxe-text :where(ul, ol):only-child { margin: 0; } .brxe-text + :where(h2, h3, h4, h5, h6), :where(p, ul, ol) + :where(h2, h3, h4, h5, h6) { margin-top: 1em; } :where(p, ul, ol, .brxe-text, .brxe-text-basic) + :where(.button-wrapper, .bricks-button) { margin-top: var(--spacing); }  .flex-wrapper { --width-2: calc(50% - var(--gap) / 2); --width-3: calc(33.33% - var(--gap) / 1.5); --width-4: calc(25% - var(--gap) / 1.25); } .text--left { text-align: left; } .text--center { text-align: center; } .text--wide { width: var(--text-wide); } .text--medium { width: var(--text-medium); } .text--narrow { width: var(--text-narrow); } .text--primary { color: var(--color-primary); } .text--secondary { color: var(--color-secondary); } .p-0 { padding: 0; }  .mt-0 { margin-top: 0; } .mt-1 { margin-top: 1rem; } .mt-2 { margin-top: 2rem; } .mt-3 { margin-top: 3rem; } .mt-auto { margin-top: var(--spacing); } .mb-0 { margin-bottom: 0; } .mb-1 { margin-bottom: 1rem; } .mb-2 { margin-bottom: 2rem; } .mb-2 { margin-bottom: 2rem; } .mb-2 { margin-bottom: 2rem; } .mb-3 { margin-bottom: 3rem; } .mb-auto { margin-bottom: var(--spacing); }  header { height: var(--header-height); overflow: visible!important;  content-visibility: visible !important; } header .header-head { background-color: rgba(var(--color-dark-rgb),0.5); } header.scrolling .header-nav, .slider__content { box-shadow: var(--box-shadow); } header.slide-up { overflow: visible!important; transform: none!important; } header.scrolling .header-head { background-color: var(--color-dark); } header.slide-up .header-head { margin-top: calc(var(--header-height-head) * -1); }  div.brxe-nav-menu .bricks-nav-menu a, div.brxe-nav-menu .bricks-mobile-menu-wrapper li a, div.brxe-nav-menu .bricks-nav-menu .sub-menu a, .brxe-nav-menu .bricks-mobile-menu-wrapper .sub-menu, :where(.brxe-nav-menu) .bricks-nav-menu .sub-menu { color: inherit; line-height: inherit; } div.brxe-nav-menu .bricks-nav-menu a:is(:hover, :focus), div.brxe-nav-menu .bricks-mobile-menu-wrapper a:is(:hover, :focus) { text-decoration: underline; } header .bricks-nav-menu-wrapper .bricks-nav-menu > li > :where(a, .brx-submenu-toggle) { min-height: var(--accessibility-min-size); padding: 2em 0; text-align: center; text-transform: uppercase; } header .bricks-nav-menu .brx-submenu-toggle button { min-width: var(--accessibility-min-size); min-height: var(--accessibility-min-size); margin-left: 0.375rem; padding: 0; } header .bricks-nav-menu .brx-submenu-toggle button svg { display: block; width: 0.75rem; min-width: unset; height: auto; margin: 0 auto; }   header .bricks-nav-menu-wrapper .sub-menu { padding: 1rem 0; background-color: var(--color-white); color: var(--color-dark); text-transform: none; box-shadow: var(--box-shadow); }  .bricks-mobile-menu { height: 100%; max-height: 85svh; margin-top: var(--header-height); padding: 0 0 1.5rem; overflow-y: auto; } header.slide-up .bricks-mobile-menu { margin-top: calc(var(--header-height) - var(--header-height-head)); } .bricks-mobile-menu a { padding: 0.5rem 1rem; } .bricks-mobile-menu .sub-menu a { padding-left: 1.5rem; padding-right: 1.5rem; } @layer bricks { .brxe-nav-menu .bricks-mobile-menu .sub-menu { background-color: var(--color-white)!important; } }  .brxe-nav-menu div.aria-current > a, .brxe-nav-menu a[aria-current="page"], a[aria-current="page"]:not(.bricks-button) { text-decoration: underline; }  .footer__nav--legal #menu-menu-legal { flex-wrap: wrap; justify-content: center; row-gap: 0.5em; } .footer__nav--legal li:first-child { margin-left: 0; } .footer__nav--legal li:not(:first-child) { margin-left: 0.5em; padding-left: 0.5em; border-left: var(--border-width) solid var(--color-dark); }  .bricks-button { padding: 0.75rem 1.5rem; border-width: var(--border-width); border-style: solid; border-radius: calc(var(--border-radius) / 2); font-size: 1rem; line-height: normal; text-transform: uppercase; gap: 0.5em; z-index: 1; cursor: pointer; transition: var(--transition-duration); } .bricks-button svg { width: auto; height: 0.85em; } .bricks-button, .bricks-button.bricks-background-secondary:is(:hover, :focus) { border-color: var(--color-dark); background-color: var(--color-dark); color: var(--color-white); } .bricks-button.bricks-background-secondary, .bricks-button:is(:hover, :focus) { border-color: var(--color-primary); background-color: var(--color-primary); color: var(--color-dark); } .bg--primary .bricks-button:is(:hover, :focus), .bg--primary .bricks-button.bricks-background-secondary { border-color: var(--color-dark); } @media (max-width: 1200px) { header .bricks-nav-menu-wrapper, header .bricks-button { font-size: 0.85rem; } header .bricks-button { padding: 0.5rem 1rem; } }   .split { --gap: 3rem; display: flex; flex-flow: row wrap; justify-content: center; align-items: center; gap: var(--gap); isolation: isolate; } .split--reversed { flex-direction: row-reverse; } .split--50-50 .split__img-wrapper, .split--50-50 .split__content { width: calc(50% - var(--gap) / 2); } .split--60-40 .split__img-wrapper { width: calc(40% - var(--gap) / 2); } .split--60-40 .split__content { width: calc(60% - var(--gap) / 2); } .split--70-30 .split__img-wrapper { width: calc(30% - var(--gap) / 2); } .split--70-30 .split__content { width: calc(70% - var(--gap) / 2); } .split:not(.split--stretch) .split__img-wrapper:not(.split__img-wrapper--textonly) { max-height: 25rem; } .split__img { position: relative; width: 100%; height: 100%; object-fit: cover; object-position: center center; } .split__img, .split__img img { max-height: inherit; } .split__img:before { content: ""; position: absolute; bottom: calc(9.5px * 3 * -1); display: block; width: calc(9.5px * 30); height: calc(9.5px * 30); border-radius: 0; background-color: var(--color-primary); -webkit-mask: url("/wp-content/uploads/dot-grid.svg"); mask: url("/wp-content/uploads/dot-grid.svg"); z-index: -1; } .bg--primary .split__img:before { background-color: var(--color-white); } .split .split__img:before { right: calc(9.5px * 3 * -1); }  .split.split--reversed .split__img:before { left: calc(9.5px * 3 * -1); }  .split--relations-reversed.split--60-40 .split__img-wrapper { width: calc(60% - var(--gap) / 2); } .split--relations-reversed.split--60-40 .split__content { width: calc(40% - var(--gap) / 2); } .split--relations-reversed.split--70-30 .split__img-wrapper { width: calc(70% - var(--gap) / 2); } .split--relations-reversed.split--70-30 .split__content { width: calc(30% - var(--gap) / 2); } .split--relations-reversed.split--55-45 .split__img-wrapper { width: calc(55% - var(--gap) / 2); } .split--relations-reversed.split--55-45 .split__content { width: calc(45% - var(--gap) / 2); } @media (max-width: 991px) { .split { --gap: 2rem; } } @media (max-width: 767px) { .split .split__img-wrapper, .split .split__content { width: 100%!important; } .split .split__img-wrapper:not(.split__img-wrapper--textonly) { max-width: 45rem; max-height: 25rem; } } @media (max-width: 478px) { .split__img:before { height: calc(9.5px * 14); } }  .split--fullwidth { --gap: 0px; align-items: stretch; } .split--fullwidth .split__content { display: flex; flex-direction: column; align-items: flex-start; padding: 4rem; } @media (min-width: 1200px) { .split--fullwidth .split__content { padding: 6rem } } @media (max-width: 991px) { .split--fullwidth .split__content { padding: 3rem 1rem; } } @media (max-width: 478px) { .split--fullwidth .split__content { padding: 2.5rem 1rem; } }  .slider .splide__slide, .slider--small { padding-left: var(--slider-arrow-size); padding-right: var(--slider-arrow-size); } .slider-wrapper--bg { padding-left: calc(var(--slider-arrow-size) + 0.5rem); padding-right: calc(var(--slider-arrow-size) + 0.5rem); } .slider-wrapper--bg .slider__content { align-self: flex-end; } .slider-wrapper .slide__img, .slider-wrapper .splide__slide::after { position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: -1; } .slider-wrapper .splide__slide::after { content: ""; display: block; background-color: rgba(0,0,0,0.75); z-index: 0; } .slider .splide__slide > *:not(img) { position: relative; z-index: 5; } @media (max-width: 767px) { .slider-wrapper .splide__slide, .slider-wrapper--bg { padding-top: 5rem; padding-bottom: 5rem; } .slider-wrapper--bg .container--full { padding: 0; } }  .slider--small figcaption { background-image: linear-gradient(0deg,rgba(0,0,0,0.95) 10%,rgba(0,0,0,0.02)); }  .slider-wrapper .splide__arrows, .slider-wrapper--bg .splide__arrows { opacity: 0; visibility: hidden; transition: var(--transition); } .slider-wrapper:is(:hover, :focus-within) .splide__arrows, .slider-wrapper--bg:is(:hover, :focus-within) .splide__arrows { opacity: 1; visibility: visible; } .brxe-slider-nested .splide__arrow { width: var(--slider-arrow-size); height: auto; padding: 0.75rem 0.15rem; background-color: var(--color-dark); font-size: var(--slider-arrow-size); color: var(--color-white); transition: var(--transition); } .slider--small.brxe-slider-nested .splide__arrow { background-color: transparent; color: var(--color-dark); } .brxe-slider-nested .splide__arrow svg { width: 100%; height: 100%; } .brxe-slider-nested .splide__arrow--prev svg { transform: rotate(180deg); } .brxe-slider-nested .splide__arrow:is(:hover, :focus) { background-color: var(--color-primary); color: var(--color-dark); } .slider--small.brxe-slider-nested .splide__arrow:is(:hover, :focus) { background-color: var(--color-dark); color: var(--color-white); } .brxe-slider-nested .splide__track--draggable:hover { cursor: grab; } .brxe-slider-nested .splide__track--draggable:active { cursor: grabbing; } @media (min-width: 2090px) { .brxe-slider-nested .splide__arrow--prev { left: -1rem; } .brxe-slider-nested .splide__arrow--next { right: -1rem; } }   .parallax { background-attachment: fixed; } @supports (-webkit-touch-callout: none) { .parallax { background-attachment: scroll; } }  .hero { --hero-padding-y: 13rem; padding: calc(var(--hero-padding-y) * 1.25) 1rem; padding-top: calc(var(--header-height) + var(--hero-padding-y)); } body.single-room .hero-section { --_heroX: 50%!important; --_heroY: 50%!important; } @media (max-width: 767px) { .hero { --hero-padding-y: 6rem; } } @media (max-width: 478px) { .hero { --hero-padding-y: 3rem; } }  .socials li, .socials li a { flex: 0; } .socials li a { display: block; line-height: 1; } .socials li a span { position: absolute; left: -9999rem; font-size: 0px; color: transparent; } .socials a, .socials a i, a.link--contact-icononly, .link--contact-icononly span { position: relative; z-index: 1; } .socials a::before, a.link--contact-icononly::before { content: ""; position: absolute; top: 50%; left: 50%; padding: 0; border-radius: 50%; background-color: var(--color-white); transform: translate(-50%, -50%); transition: var(--transition); z-index: 0; } .socials a:is(:hover, :focus), a.link--contact-icononly:is(:hover, :focus) { color: var(--color-dark); } .socials a:is(:hover, :focus)::before, a.link--contact-icononly:is(:hover, :focus)::before { padding: 1em; } :where(footer, .bg--primary) .socials a::before, :where(footer, .bg--primary) a.link--contact-icononly::before { background-color: var(--color-dark); } :where(footer, .bg--primary) .socials a:is(:hover, :focus), :where(footer, .bg--primary) a.link--contact-icononly:is(:hover, :focus) { color: var(--color-white); }     @media (max-width: 478px) {  }  .teaser { --_teaser-p-x: 1rem; border-radius: var(--border-radius); background-color: var(--color-white); box-shadow: var(--box-shadow); } .teaser img { transition: var(--transition); } .teaser .brxe-image { width: calc(100% + var(--_teaser-p-x) * 2); max-width: unset; max-height: 20rem; margin: 0 calc(var(--_teaser-p-x) * -1) 1rem; overflow: hidden; aspect-ratio: 4/3; } .teaser .bricks-button { justify-content: flex-start; width: 100%; margin-top: auto; padding-left: 0; padding-right: 0; border: none; border-top: var(--border-width) solid rgba(var(--color-dark-rgb),0.25); border-radius: 0; background-color: transparent; color: var(--color-dark); text-align: left; } .teaser a.bricks-button:is(:hover, :focus) { text-decoration: underline; } .teaser span.bricks-button:is(:hover, :focus) { cursor: default; }  .teaser--unboxed.brxe-div { --_teaser-p-x: 0px; border-radius: none; background-color: transparent; box-shadow: none; } .teaser--unboxed .brxe-image { border-radius: var(--border-radius); }  .teaser--room.brxe-div:is(:hover, :focus) { background-color: var(--color-white); } .teaser--room__details .brxe-text-link { column-gap: 0.5rem; } .teaser--room__details .brxe-text-link svg { max-width: 2em; height: 2em; }  .box { box-shadow: var(--box-shadow); } .box--contact { background-color: var(--color-primary); } .box--contact:is(:hover, :focus) { background-color: var(--color-dark); color: var(--color-white); } .box--contact .box__icon { width: auto; }  .brxe-accordion-nested { width: 100%; max-width: 50rem; } .brxe-accordion-nested > .brxe-block { border: var(--border-width) solid var(--color-primary); border-radius: var(--border-radius); overflow: hidden; } .brxe-accordion-nested > .brxe-block:not(:first-child) { margin-top: var(--spacing); } .brxe-accordion-nested .accordion-title-wrapper { flex-wrap: nowrap; background-color: var(--color-primary); column-gap: 1rem; transition: var(--transition); } .brxe-accordion-nested .accordion-title-wrapper, .brxe-accordion-nested .accordion-content-wrapper { padding: 1rem; } .brxe-accordion-nested .accordion-title-wrapper .brxe-heading { margin-bottom: 0; } .brxe-accordion-nested > .brxe-block:is(:hover, :focus-within, .brx-open) .accordion-title-wrapper { background-color: var(--color-dark); color: var(--color-white); }  .brxe-tabs-nested .tab-menu { position: relative;  justify-content: center; align-items: stretch; overflow-x: auto; } .brxe-tabs-nested .tab-menu::before { content: ""; position: absolute; bottom: 0; left: 0; right: 0; display: block; border-bottom: var(--border-width) solid var(--color-primary); z-index: -1; } .brxe-tabs-nested .tab-title { padding: 1em; } .brxe-tabs-nested .tab-title:is(:hover, :focus) { background-color: var(--color-primary); } .brxe-tabs-nested .tab-title.brx-open { background-color: var(--color-dark); color: var(--color-white); } .brxe-tabs-nested .tab-pane { padding: 2rem 1rem; text-align: center; } .brxe-tabs-nested .tab-pane .brxe-text { width: 100%; margin-left: auto; margin-right: auto; max-width: var(--text-medium); } @media (max-width: 478px) { .brxe-tabs-nested .tab-pane { padding: 1.5rem 0; text-align: left; } }  iframe:focus-visible { outline: none; } iframe { display: block; border: var(--border-width) solid var(--color-dark); overflow: hidden; } .jobs-iframe { border-radius: var(--border-radius); } #myIncertIframe iframe { width: 100%; max-width: var(--page-width); margin: 0 auto; border: none; }  .wpml-ls-legacy-dropdown-click, .wpml-ls-legacy-dropdown-click a { width: var(--accessibility-min-size); height: var(--accessibility-min-size); } .wpml-ls-legacy-dropdown-click a, .wpml-ls-legacy-dropdown-click a.wpml-ls-item-toggle { padding: 0; border: none; background-color: transparent; text-align: center; } .wpml-ls-legacy-dropdown-click .wpml-ls-flag { display: inline-block; vertical-align: text-bottom; } .wpml-ls-legacy-dropdown-click a.wpml-ls-item-toggle::after { display: none; } .wpml-ls-legacy-dropdown-click a.wpml-ls-item-toggle[aria-expanded="true"] { background-color: var(--color-white); } .wpml-ls-legacy-dropdown-click a:is(:hover, :focus) { background-color: var(--color-dark); }  .brxe-form { --checkbox-size: 1rem; } .brxe-form input:not([type="radio"], [type="checkbox"]), .brxe-form select, .brxe-form textarea { padding: 0.75rem 1rem; border: var(--border-width) solid var(--color-dark); border-radius: calc(var(--border-radius) / 2); background-color: var(--color-white); line-height: normal; } .brxe-form textarea { min-height: 8rem; max-height: 25rem; resize: vertical; } select option.placeholder { display: none; visibility: hidden; }  .brxe-form select, .brxe-form select option, .variations_form select, .variations_form select option { font-family: var(--font-family), sans-serif; }   .brxe-form ul.options-wrapper li { display: flex; flex-flow: row nowrap; align-items: flex-start; column-gap: 0.5em; } .brxe-form ul.options-wrapper :where(input[type="radio"], input[type="checkbox"]) { width: var(--checkbox-size); min-width: var(--checkbox-size); height: var(--checkbox-size); margin-top: 0.15em; border: var(--border-width) solid var(--color-dark); font-size: var(--checkbox-size); appearance: none; } .brxe-form ul.options-wrapper input[type="radio"] { border-radius: 50%; } .brxe-form ul.options-wrapper :where(input[type="radio"], input[type="checkbox"]):checked { box-shadow: 0 0 0 2px var(--color-white) inset; background-color: var(--color-dark); } .brxe-form .options-wrapper input + label { max-width: 75ch; font-size: 0.9em; font-weight: 400; text-transform: none; }  .brxe-form .submit-button-wrapper { display: block; width: 100%; margin-top: 1rem; padding: 0 var(--form-padding); }  footer { padding: 3rem 1rem; border-top: var(--border-width) solid rgba(var(--color-dark-rgb),0.1); background-color: var(--color-primary); } .footer-menu--service .bricks-nav-menu > li:first-child { margin-left: 0; }   @keyframes fade-in { from { opacity: 0; } to { opacity: 1; } } @keyframes fade-in-left { from { opacity: 0; transform: translateX(-20%); } to { opacity: 1; transform: translateX(0); } } @keyframes fade-in-right { from { opacity: 0; transform: translateX(20%); } to { opacity: 1; transform: translateX(0); } } @keyframes fade-in-bottom { from { opacity: 0; transform: translateY(20%); } to { opacity: 1; transform: translateY(0); } }  .animation--viewport .fade-in, .animation--viewport .fade-bottom, .animation--viewport .split > div { opacity: 0; } .animation--viewport[animate-vp="true"] .fade-in { animation: fade-in calc(var(--animation-speed) + 1s) forwards; } .animation--viewport[animate-vp="true"] .fade-bottom { animation: fade-in-bottom var(--animation-speed) forwards; }  .animation--viewport .split > div:first-child, .animation--viewport .split.split--reversed > div:last-child { transform: translateX(-20%); } .animation--viewport .split > div:last-child, .animation--viewport .split.split--reversed > div:first-child { transform: translateX(20%); } .animation--viewport[animate-vp="true"] .split > div:first-child, .animation--viewport[animate-vp="true"] .split.split--reversed > div:last-child { animation: fade-in-left var(--animation-speed) forwards; } .animation--viewport[animate-vp="true"] .split > div:last-child, .animation--viewport[animate-vp="true"] .split.split--reversed > div:first-child { animation: fade-in-right var(--animation-speed) forwards; } @media (max-width: 767px) { .animation--viewport .split > div:last-child, .animation--viewport .split.split--reversed > div:first-child { transform: translateX(-20%); } .animation--viewport[animate-vp="true"] .split > div:last-child, .animation--viewport[animate-vp="true"] .split.split--reversed > div:first-child { animation: fade-in-left var(--animation-speed) forwards; } }  .animation--staggered > * { opacity: 0; } .animation--staggered[animate-vp="true"] > * { animation: fade-in var(--animation-speed) forwards; } .animation--staggered > *:nth-child(1) { animation-delay: 0.25s; } .animation--staggered > *:nth-child(2) { animation-delay: 0.5s; } .animation--staggered > *:nth-child(3) { animation-delay: 0.75s; } .animation--staggered > *:nth-child(4) { animation-delay: 1s; } .animation--staggered > *:nth-child(5) { animation-delay: 1.25s; } .animation--staggered > *:nth-child(6) { animation-delay: 1.5s; } .animation--staggered > *:nth-child(7) { animation-delay: 1.75s; } .animation--staggered > *:nth-child(8) { animation-delay: 2s; } .animation--staggered > *:nth-child(9) { animation-delay: 2.25s; } .animation--staggered > *:nth-child(10) { animation-delay: 2.5s; } .animation--staggered > *:nth-child(11) { animation-delay: 2.75s; } .animation--staggered > *:nth-child(12) { animation-delay: 3s; } .animation--staggered > *:nth-child(13) { animation-delay: 3.25s; } .animation--staggered > *:nth-child(14) { animation-delay: 3.5s; } .animation--staggered > *:nth-child(15) { animation-delay: 3.75s; } .animation--staggered > *:nth-child(16) { animation-delay: 4s; } .animation--staggered > *:nth-child(17) { animation-delay: 4.25s; } .animation--staggered > *:nth-child(18) { animation-delay: 4.5s; } .animation--staggered > *:nth-child(19) { animation-delay: 4.75s; } .animation--staggered > *:nth-child(20) { animation-delay: 5s; }  body[data-builder-window="iframe"] :where(.fade-in, .fade-bottom), body[data-builder-window="iframe"] .animation--viewport .split > div:first-child, body[data-builder-window="iframe"] .animation--viewport .split > div:last-child, body[data-builder-window="iframe"] .animation--staggered > * { opacity: 1!important; transform: none!important; animation: none!important; }  @media (prefers-reduced-motion: reduce) { .animation--viewport :where(.fade-in, .fade-bottom), .animation--viewport .split > div:first-child, .animation--viewport .split > div:last-child, .animation--staggered > * { opacity: 1!important; transform: none!important; animation: none!important; } }