:root {
--grey-500: #4c4c4c;
--grey-200: #D9D9D9;
--white: #ffffff;
--black: #000000;
--gold: #CCA752;
--blue-600: #205376;
--blue-400: #20537666;
--blue-200: #E9EEF1;
--logo-blue: #262E80;
--logo-red: #CC0000;
--logo-yellow: #FFDD00;
--green-600: #5F7A62;
--pad-section-xs: 10px;
--pad-section-s: 15px;
--pad-section-m: 30px;
--pad-section-l: 60px;
--pad-section-xl: 90px;
--pad-section-xxl: 100px;
--space-s: 10px;
--space-m: 15px;
--space-l: 20px;
--space-xl: 30px;
--space-xxl: 45px;
--space-xxxl: 60px;
--border-size: 1px;
--border-radius: 0;
--border-radius-min: 2px;
--border-radius-max: 8px;
--body1-font-size: 20px;
--body2-font-size: 18px;
--body3-font-size: 16px;
--body4-font-size: 14px;
--body5-font-size: 12px;
--body6-font-size: 10px;
--light-weight: 400;
--regular-weight: 400;
--bold-weight: 600;
--semibold-weight: 600;
--header-height: 80px;
--container: 1360px;
--container-pad: 40px;
}
@media (max-width: 992px) {
:root {
--space-xxxl: 30px;
--header-height: 80px;
--container-pad: 40px;
}
}
@media (max-width: 768px) {
:root {
--container-pad: 20px;
}
}
@media (max-width: 575px) {
:root {
--container-pad: 20px;
}
}
*,
*::before,
*::after {
box-sizing: border-box;
}
html,
body { } .container-default {
width: 100%;
max-width: calc(var(--container) + (var(--container-pad) * 2));
margin: 0 auto;
padding-left: var(--container-pad);
padding-right: var(--container-pad);
position: relative;
}
.intro-layout {
display: grid;
grid-template-columns: minmax(0, 1fr) 50%;
grid-template-rows: auto 1fr;
gap: 0 var(--space-xxxl);
align-items: start;
padding-bottom: var(--space-xxxl);
margin-top: calc(var(--space-xxxl) * -1);
}
.intro-layout.home {
margin-top: calc(var(--space-xxxl) * -1  * 2);
padding-bottom: 0;
}
.intro-layout.one-third {
grid-template-columns: minmax(0, 1fr) 33.3%;
}
.intro-layout.two-third {
grid-template-columns: minmax(0, 1fr) 66.6%;
}
.intro-text {
grid-column: 1;
grid-row: 1 / 3;
min-width: 0;
padding-top: calc(2 * var(--space-xxxl));
}
.intro-layout.home .intro-text {
padding-top: calc(2 * var(--space-xxxl) * 2);
display: flex;
flex-direction: column;
align-self: stretch !important;
width: 100%;
justify-content: space-between;
gap: 40px;
}
.intro-layout.home .intro-text .box {
background-color: var(--blue-600);
color: var(--white);
padding: var(--space-xl);
width: 75%;
margin-bottom: -30px;
z-index: 2;
}
.intro-layout.home .intro-text .elements {
display: flex;
flex-direction: column;
justify-content: space-between;
}
.intro-layout.home .intro-text .button-image {
display: flex;
flex-direction: row;
justify-content: space-between;
gap: 40px;
}
.bars-stack {
grid-column: 2;
grid-row: 1;
display: grid;
gap: 0;
}
.headline-bar {
position: relative;
padding: var(--space-xxxl);
color: var(--white);
z-index: 1;
}
.headline-bar:after {
content: "";
position: absolute;
inset: 0;
right: calc(50% - 50vw);
background: var(--blue-600);
z-index: -1;
}
.headline-bar h1 {
color: var(--white);
}
.headline-bar h1 span {
color: var(--gold);
}
.info-bar {
position: relative;
padding: 0;
color: var(--blue-600);
z-index: 1;
}
.info-bar:after {
content: "";
position: absolute;
inset: 0;
right: calc(50% - 50vw);
background: var(--blue-200);
z-index: -1;
}
.info-bar-slider {
aspect-ratio: 3/2;
}
@media (max-width: 992px) {
.info-bar-slider {
max-width: 50%;
}
} .intro-layout.is-reversed {
grid-template-columns: 50% minmax(0, 1fr);
}
.intro-layout.one-third.is-reversed {
grid-template-columns: 33.3% minmax(0, 1fr);
}
.intro-layout.two-third.is-reversed {
grid-template-columns: 66.6% minmax(0, 1fr);
}
.intro-layout.is-reversed .headline-bar {
grid-column: 1;
grid-row: 1;
}
.intro-layout.is-reversed .stat {
grid-column: 1;
grid-row: 2;
}
.intro-layout.is-reversed .intro-text {
grid-column: 2;
grid-row: 1 / 3;
}
.intro-layout.is-reversed .bars-stack {
grid-column: 1;
grid-row: 1;
}
.intro-layout.is-reversed .headline-bar {
padding: var(--space-xxxl) var(--space-xxxl) var(--space-xxxl) 0;
}
.intro-layout.is-reversed .info-bar {
padding: 0;
}
.intro-layout.is-reversed .headline-bar:after,
.intro-layout.is-reversed .info-bar:after {
left: calc(50% - 50vw);
right: 0;
}
@media (max-width: 1200px) {
.intro-layout.home .intro-text .box {
width: 100%;
}
} @media (max-width: 992px) {
.container-default {
padding: 0; 
}
.intro-layout,
.intro-layout.one-third,
.intro-layout.two-third,
.intro-layout.is-reversed,
.intro-layout.one-third.is-reversed,
.intro-layout.two-third.is-reversed {
grid-template-columns: 1fr;
grid-template-rows: auto auto auto;
gap: var(--space-xl);
margin-top: 0;
}
.intro-layout.home {
margin-top: 0;
}
.bars-stack,
.intro-layout.is-reversed .bars-stack {
grid-column: 1;
grid-row: 1;
gap: 0;
}
.intro-text,
.intro-layout.is-reversed .intro-text {
grid-column: 1;
grid-row: 2;
padding-top: 0;
padding-left: var(--container-pad);
padding-right: var(--container-pad);
}
.intro-layout.home .intro-text {
padding-top: 0;
padding-left: 0;
padding-right: 0;
}
.intro-layout.home .intro-text .elements {
padding-left: var(--container-pad);
padding-right: var(--container-pad);
}
.intro-layout.home .intro-text .box {
margin: 0;
}
.stat,
.intro-layout.is-reversed .stat {
grid-column: 1;
grid-row: 3;
}
.info-bar,
.intro-layout.is-reversed .info-bar {
padding-left: 0;
padding-right: 0;
}
.headline-bar,
.intro-layout.is-reversed .headline-bar {
padding-left: var(--container-pad);
padding-right: var(--container-pad);
padding-top: 20px;
padding-bottom: 20px;
}
.headline-bar:after,
.info-bar:after,
.intro-layout.is-reversed .headline-bar:after,
.intro-layout.is-reversed .info-bar:after {
left: calc(50% - 50vw);
right: calc(50% - 50vw);
}
} @media (max-width: 575px) {
.intro-layout,
.intro-layout.one-third,
.intro-layout.two-third,
.intro-layout.is-reversed,
.intro-layout.one-third.is-reversed,
.intro-layout.two-third.is-reversed {
gap: calc(var(--space-xxxl) * 0.6);
padding-bottom: 0;
}
.headline-bar,
.intro-layout.is-reversed .headline-bar {
padding-left: 20px;
padding-right: 20px;
padding-top: 20px;
padding-bottom: 20px;
}
.info-bar,
.intro-layout.is-reversed .info-bar {
padding-top: 0;
padding-bottom: 0;
}
}
.section-with-bleed {
overflow-x: clip;
}
.background-dark {
background-color: var(--blue-600);
}
.background-light {
position: relative;
z-index: 1;
}
.background-light::after {
content: "";
position: absolute;
top: 0;
bottom: 0;
background: var(--blue-200);
z-index: -1;
}
.background-light.right::after {
left: 0;
right: calc(50% - 50vw);
}
.background-light.left::after {
left: calc(50% - 50vw);
right: 0;
} .two-column-button {
display: flex;
flex-direction: row;
}
.two-column-button-left {
}
.two-column-button-right {
display: flex;
align-items: flex-end;
align-self: flex-end;
}
@media (max-width: 768px) {
.two-column-button {
flex-direction: column;
}
.two-column-button-right {
margin-top: var(--space-l);
display: flex;
align-items: flex-start;
align-self: flex-start;
}
}
.contact-column {
display: grid;
grid-template-columns: 2fr 3fr;
flex-direction: row;
justify-content: space-between;
gap: var(--space-xxxl);
}
.contact-column-left {
}
.contact-column-right {
display: flex;
align-self: flex-end;
flex-direction: row;
justify-content: flex-end;
align-items: center;
}
.contact-column-link {
display: flex;
flex-direction: row;
align-items: center;
column-gap: var(--space-l);
justify-content: flex-end;
}
.contact-column-link svg {
fill: var(--gold);
width: 30px;
height: 30px;
}
.contact-column-link span {
font-size: 24px;
line-height: 28px;
color: var(--gold);
}
@media (max-width: 1200px) {
.contact-column-right {
display: flex;
align-self: flex-end;
flex-direction: column;
justify-content: flex-start;
align-items: center;
gap: 20px;
}
.contact-column-link {
display: flex;
flex-direction: row;
align-items: center;
column-gap: var(--space-l);
justify-content: flex-start;
}
}
@media (max-width: 768px) {
.contact-column {
grid-template-columns: 1fr;
flex-direction: column;
gap: 0;
}
.contact-column-right {
margin-top: var(--space-l);
display: flex;
align-items: flex-start;
align-self: flex-start;
}
.contact-column-link svg {
width: 24px;
height: 24px;
}
.contact-column-link span {
font-size: 16px;
line-height: 18px;
}
} .section.section-parallax {
padding-top: var(--pad-section-xl);
padding-bottom: var(--pad-section-xl);
background: linear-gradient(to right, var(--blue-200) 50%, var(--white) 50%);
}
.section.section-parallax2 {
padding-top: var(--pad-section-xl);
padding-bottom: var(--pad-section-xl);
background: linear-gradient(to right, var(--white) 50%, var(--blue-200) 50%);
}
.parallax-image {
display: flex;
align-self: center !important;
justify-content: center;
align-items: center;
background-size: cover;
aspect-ratio: 2 / 1;
position: relative;
}
.home .parallax-image {
max-height: 480px;
}
.parallax-image__heading {
margin-bottom: 0;
padding-top: var(--space-m);
padding-right: var(--space-m);
padding-bottom: var(--space-m);
padding-left: var(--space-m);
background-color: var(--blue-400);
font-size: 30px;
font-weight: var(--semibold-weight);
color: var(--white);
text-align: center;
text-transform: uppercase;
z-index: 1;
}
.parallax-image__box {
position: absolute;
right: 160px;
bottom: -90px;
z-index: 5;
background-color: var(--blue-600);
color: var(--white);
margin: 0;
padding: var(--pad-section-l);
max-width: 720px;
}
@media (max-width: 992px) {
.parallax-image__heading {
font-size: 18px;
line-height: 24px;
}
.parallax-image__box {
max-width: 100%;
margin-left: 40px;
margin-right: 40px;
padding: var(--pad-section-m);
right: 0;
bottom: 40px;
position: relative;
}
}
@media (max-width: 768px) {
.section.section-parallax {
padding-top: 0;
padding-bottom: 60px;
background: none;
}
.section.section-parallax2 {
padding-top: 0;
padding-bottom: 60px;
background: none;
}
.parallax-image__heading {
position: absolute;
bottom: -40px;
text-transform: none;
background-color: var(--blue-600);
width: calc(100% - 2 * 20px);
text-align: left;
padding: 20px 40px 20px 40px;
}
.parallax-image__box {
bottom: -40px;
margin-left: 20px;
margin-right: 20px;
padding: 0 40px 20px 40px;
margin-bottom: 60px;
}
}
@media (max-width: 575px) {
.parallax-image__heading {
font-size: var(--body3-font-size);
line-height: 20px;
bottom: -40px;
width: calc(100% - 2 * 20px);
padding: 20px 20px 20px 20px;
}
.parallax-image__box {
font-size: var(--body3-font-size);
line-height: 20px;
padding: 0 20px 20px 20px;
}
} header .header {
flex-direction: row;
align-self: stretch;
width: 100%;
justify-content: center;
margin-top: 0;
margin-bottom: 0;
padding-top: 0;
padding-bottom: 0;
height: var(--header-height);
background-color: var(--white);
position: relative;
z-index: 1001;
transition: .45s cubic-bezier(.4, 0, .2, 1) !important;
}
header .header .container {
flex-direction: row;
justify-content: space-between;
align-self: center;
align-items: center;
}
header .header .header__logo {
height: 46px;
flex-shrink: 0;
transition: .25s cubic-bezier(.4, 0, .2, 1) !important;
}
header .header .header__logo img {
transition: .25s cubic-bezier(.4, 0, .2, 1);
} header .header__navigation {
display: flex;
justify-content: space-between;
align-items: center;
}
header .header__contact {
display: flex;
justify-content: space-between;
align-items: center;
column-gap: 18px;
margin-left: 30px;
align-self: center;
flex-shrink: 0;
}
header .header__contact a,
header .header__contact svg {
height: 20px;
}
@media (max-width: 1024px) {
header .header__contact {
display: none;
}
}
header .nav-main .bricks-nav-menu li {
padding-top: 0;
padding-bottom: 0;
padding-right: 30px;
line-height: 24px;
border-right: 1px solid var(--blue-600);
display: flex;
align-items: center;
}
header .nav-main .bricks-nav-menu li a {
font-size: var(--body2-font-size);
font-weight: var(--regular-weight);
color: var(--grey-500);
line-height: 24px;
text-transform: uppercase;
}
header .nav-main .bricks-nav-menu li a:hover {
color: var(--blue-600);
}
header .nav-main .bricks-nav-menu .current-menu-item > a {
color: var(--blue-600);
text-decoration: underline;
text-decoration-thickness: 1px;
text-underline-offset: 4px;
}
header .nav-main-mobile .bricks-nav-menu {
}
header .nav-main-mobile .bricks-nav-menu li {
margin-bottom: 30px;
}
header .nav-main-mobile .bricks-nav-menu li a {
font-size: var(--body2-font-size);
color: var(--grey-500);
text-transform: uppercase;
outline: none;
}
header .nav-main-mobile .bricks-nav-menu li a[aria-current="page"],
header .nav-main-mobile .bricks-nav-menu li.current-menu-item a {
font-weight: var(--semibold-weight);
color: var(--blue-600);
}
#mobile-canvas {
position: relative;
display: none;
}
@media (max-width: 1024px) {
#mobile-canvas {
display: flex;
}
}
.brx-offcanvas-backdrop {
display: none;
}
.brxe-offcanvas[data-direction=top] .brx-offcanvas-inner {
position: absolute;
height: 60vh;
}
.brxe-toggle {
--brxe-toggle-scale: 1;
--brxe-toggle-width: 30px;
--brxe-toggle-height: 20px;
--brxe-toggle-bar-height: 2px;
--brxe-toggle-bar-width: 30px;
--brxe-toggle-bar-radius: 0;
outline: none;
}
.brxe-toggle .brxa-wrap {
width: var(--brxe-toggle-width);
height: var(--brxe-toggle-height);
} body {
padding-top: 84px;
}
body.scrolling {
padding-top: 64px;
}
footer .footer_address address,
footer .footer_address p {
margin-bottom: 20px;
font-size: var(--body2-font-size);
font-style: normal;
color: var(--grey-500);
line-height: 24px;
}
footer .footer_address p a,
footer .footer_address address a {
font-size: var(--body2-font-size);
font-weight: var(--regular-weight);
color: var(--grey-500);
border-bottom: 1px solid transparent;
}
footer .footer_address p a:hover,
footer .footer_address address a:hover {
border-bottom: 1px solid var(--grey-500);
}
footer .footer-copyright {
font-size: var(--body3-font-size);
font-weight: var(--semibold-weight);
color: var(--white);
line-height: 18px;
}
.footer_heading {
margin-bottom: var(--space-m);
font-size: var(--body3-font-size);
font-weight: var(--semibold-weight);
color: var(--grey-500);
text-transform: uppercase;
}
#footer-bottom {
}
.footer-bottom-wrapper {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 20px;
}
.footer-bottom-wrapper .footer-col1 {
}
.footer-bottom-wrapper .footer-col2 {
align-items: flex-end;
}
@media (max-width: 1024px) {
.footer-bottom-wrapper {
grid-template-columns: 1fr;
}
.footer-bottom-wrapper .footer-col2 {
align-items: flex-start;
}
}
@media (max-width: 992px) {
body #footer-bottom {
padding-bottom: 100px;
}
}
@media (max-width: 575px) {
body #footer-bottom {
padding-bottom: 80px;
}
footer .footer_address address,
footer .footer_address p {
font-size: var(--body3-font-size);
line-height: 20px;
}
footer .footer_address p a,
footer .footer_address address a {
font-size: var(--body3-font-size);
line-height: 20px;
}
.footer_heading {
font-size: var(--body3-font-size);
line-height: 20px;
}
} .nav-footer_main ul {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 0 60px;
list-style-position: inside;
padding: 0;
margin: 0;
}
.nav-footer_main ul li:nth-child(-n+3) {
grid-column: 1;
}
.nav-footer_main ul li:nth-child(n+4) {
grid-column: 2;
}
.nav-footer_main ul li:nth-child(1) { grid-row: 1; }
.nav-footer_main ul li:nth-child(2) { grid-row: 2; }
.nav-footer_main ul li:nth-child(3) { grid-row: 3; }
.nav-footer_main ul li:nth-child(n+4) { grid-row: auto; }
.nav-footer_main ul li {
font-size: var(--body2-font-size);
font-weight: var(--regular-weight);
color: var(--grey-500);
line-height: 24px;
}
.nav-footer_main ul li a {
font-size: var(--body2-font-size);
font-weight: var(--regular-weight);
color: var(--grey-500);
} .nav-footer_meta ul {
}
.nav-footer_meta ul li {
margin-top: 0;
margin-bottom: 0;
margin-left: 0;
margin-right: 6px;
padding-right: 6px;
padding-left: 0;
padding-top: 0;
padding-bottom: 0;
border-right: 2px solid var(--white);
font-size: var(--body3-font-size);
font-weight: var(--semibold-weight);
color: var(--white);
line-height: 16px;
}
.nav-footer_meta ul li:last-child {
margin-right: 0;
border-right: 0;
}
.nav-footer_meta ul li a {
width: auto;
font-size: var(--body3-font-size);
font-weight: var(--semibold-weight);
color: var(--white);
line-height: 16px;
border-bottom: 1px solid transparent;
display: inline-block;
}
.nav-footer_meta ul li a:hover {
border-bottom: 1px solid var(--white);
}
@media (max-width: 1024px) {
.nav-footer_meta ul {
display: block;
}
.nav-footer_meta ul li {
margin-right: 0;
padding-right: 0;
border-right: 0;
line-height: 24px;
}
}
@media (max-width: 768px) {
.nav-footer_main ul {
display: flex;
flex-direction: column;
gap: 6px;
}
.nav-footer_main ul li {
margin-bottom: 0;
}
}
@media (max-width: 575px) {
.nav-footer_main ul li, 
.nav-footer_main ul li a {
font-size: var(--body3-font-size);
line-height: 20px;
}
} .competence-card-wrapper {
display: grid;
align-items: stretch;
grid-template-columns: repeat(3,1fr);
gap: 30px;
}
.card-competence {
display: flex;
flex-direction: column;
}
.card-competence__image-wrapper {
position: relative;
}
.card-competence__image {
vertical-align: bottom;
}
.card-competence__text-wrapper {
display: flex;
flex-direction: column;
flex-grow: 1;
flex-shrink: 1;
flex-basis: auto;
justify-content: space-between;
}
.card-competence__text-container {
padding-top: 30px;
padding-right: 30px;
padding-bottom: 30px;
padding-left: 30px;
display: flex;
flex-direction: column;
row-gap: 20px;
}
.card-competence__headline-wrapper {
flex-direction: row;
align-self: center !important;
align-items: center;
column-gap: 30px;
}
.card-competence__headline-icon {
width: 36px;
height: 36px;
}
.card-competence__heading {
margin-bottom: 0;
font-size: var(--body2-font-size) !important;
font-weight: var(--semibold-weight);
color: var(--grey-500);
line-height: 24px !important;
}
.card-competence__text {
font-size: var(--body2-font-size) !important;
font-weight: var(--regular-weight);
color: var(--grey-500);
line-height: 24px !important;
}
@media( max-width: 575px) {
.card-competence__headline-wrapper {
column-gap: 15px;
}
.card-competence__text-container {
padding-left: 10px;
padding-right: 10px;
}
.card-competence__heading {
font-size: var(--body3-font-size) !important;
line-height: 20px !important;
}
.card-competence__text {
font-size: var(--body3-font-size) !important;
line-height: 20px !important;
}
} #proof-bar { background: var(--blue-600);
}
#proof-bar .proof-bar-wrapper {
display: grid;
grid-template-columns: 1fr 1fr;
}
#proof-bar .proof-bar-icons {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
grid-gap: 0;
height: 100%;
}
#proof-bar .proof-bar-icon {
width: 100%;
min-width: 205px;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
}
#proof-bar .proof-bar-icon.blue { background: var(--blue-600);
}
#proof-bar .proof-bar-icon.red { background: var(--blue-600);
}
#proof-bar .proof-bar-icon.yellow { background: var(--blue-600);
}
#proof-bar .proof-bar-left {
display: flex;
align-items: center;
justify-content: center;
padding-top: 30px;
padding-bottom: 30px;
}
#proof-bar .proof-bar-right {
display: flex;
align-items: center;
justify-content: center;
height: 100%;
}
#proof-bar .proof-bar-text {
font-size: var(--body2-font-size);
font-weight: var(--regular-weight);
color: var(--white);
line-height: 24px;
}
@media (max-width: 1024px) {
#proof-bar { background: var(--blue-600);
}
#proof-bar .proof-bar-wrapper {
display: grid;
grid-template-columns: 2fr 1fr;
}
#proof-bar .proof-bar-icon {
min-width: 120px;
}
}
@media (max-width: 768px) {
#proof-bar { background: var(--blue-600);
}
#proof-bar .container {
padding: 0;
}
#proof-bar .proof-bar-wrapper {
display: grid;
grid-template-columns: 1fr;
}
#proof-bar .proof-bar-left {
padding-top: 20px;
padding-bottom: 20px;
padding-left: 20px;
padding-right: 20px;
}
#proof-bar .proof-bar-icon {
min-width: 100%;
min-height: 64px;
}
#proof-bar .proof-bar-icon svg {
height: 32px;
}
}
@media (max-width: 575px) {
#proof-bar .proof-bar-text {
font-size: var(--body3-font-size);
line-height: 20px;
}
}
@media (max-width: 991px) {
body {
padding-top: 80px;
} 
}
.section {
background-color: var(--white);
position: relative;
z-index: 1;
}
.section.gradient1 {
background: linear-gradient(to right, var(--blue-200) 50%, var(--white) 50%);
}
.section.gradient2 {
background: linear-gradient(to right, var(--white) 50%, var(--blue-200) 50%);
}
.section.gradient3 {
background: linear-gradient(to bottom, var(--blue-200) 50%, var(--blue-600) 50%);
}
.section.gradient4 {
background: linear-gradient(to bottom, var(--blue-200) 95%, var(--blue-600) 5%);
}
.section.background-light {
background-color: var(--blue-200);
}
.section.background-dark {
background-color: var(--blue-600);
}
.container {
max-width: 100%;
width: 1440px;
margin: 0 auto;
padding-right: var(--container-pad);
padding-left: var(--container-pad);
position: relative;
} h1.h1 {
display: inline-block;
margin: 0 0 var(--space-m) 0;
padding-bottom: 20px;
border-bottom: 1px solid var(--blue-600);
}
h1 span,
h2 span,
h3 span {
color: var(--gold);
}
p {
font-size: var(--body2-font-size);
line-height: 24px;
}
p.small {
font-size: var(--body3-font-size);
font-weight: var(--light-weight);
}
p.small a {
font-size: var(--body3-font-size);
font-weight: var(--bold-weight);
}
strong {
font-weight: var(--bold-weight);
}
p a,
label a {
font-size: var(--body2-font-size);
font-weight: var(--regular-weight);
color: var(--blue-600);
}
p a:hover,
label a:hover {
color: var(--grey-500);
}
address {
font-size: var(--body2-font-size);
font-weight: var(--regular-weight);
}
@media (max-width: 575px) {
p {
font-size: var(--body3-font-size);
line-height: 20px;
}
p a,
label a {
font-size: var(--body3-font-size);
line-height: 20px;
hyphens: auto;
}
address {
font-size: var(--body3-font-size);
line-height: 20px;
}
} .standard-section {
padding-top: var(--pad-section-m);
padding-bottom: var(--pad-section-m);
}
.standard-container {
column-gap: var(--space-xxl);
grid-gap: var(--space-xxl);
grid-template-columns: 1fr;
display: grid;
align-items: initial;
}
.standard-container.col-2-1 {
grid-template-columns: 2fr 1fr;
}
.standard-container.col-1-2 {
grid-template-columns: 1fr 2fr;
}
.standard-container.col-3-2 {
grid-template-columns: 3fr 2fr;
}
.standard-container.col-2-3 {
grid-template-columns: 2fr 3fr;
}
@media (max-width: 992px) {
.standard-container.col-2-1, 
.standard-container.col-1-2 {
grid-template-columns: 1fr;
}
.standard-container.col-3-2, 
.standard-container.col-2-3 {
grid-template-columns: 1fr;
}
} .img-responsive {
width: 100%;
height: auto;
}
.zoom {
overflow: hidden;
}
.zoom img {
display: block;
width: 100%;
height: auto;
transform: translateZ(0);
backface-visibility: hidden;
-webkit-backface-visibility: hidden;
will-change: transform;
transition: transform 1s cubic-bezier(0.4, 0, 0.2, 1);
}
.zoom:hover img {
transform: scale(1.2);
}
.text-wrapper {
max-width: 720px;
margin: 0 auto;
} .social-sharing {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 15px;
margin: 0;
padding: 0;
list-style: none;
}
.social-sharing-item {
margin: 0;
padding: 0;
}
.social-sharing a {
display: flex;
align-items: center;
justify-content: center;
width: 45px;
height: 45px;
background: var(--blue-600);
color: var(--white);
text-decoration: none;
transition: background-color 0.3s ease, color 0.3s ease, transform 0.3s ease;
}
.social-sharing a:hover {
background: var(--gold);
color: var(--grey-500);
transform: translateY(-2px);
}
.social-sharing a svg {
width: 20px;
height: 20px;
display: block;
fill: currentColor;
}
@media (max-width: 767px) {
.social-sharing {
display: grid;
grid-template-columns: repeat(3, 60px);
justify-content: center;
gap: 20px;
}
.social-sharing a {
width: 60px;
height: 60px;
}
}
@media (max-width: 575px) {
.social-sharing {
display: none;
}
} .socialmedia {
margin: 30px 0 0 0;
padding: 0;
display: flex;
align-items: center;
justify-content: flex-start;
}
.socialmedia li {
list-style: none;
margin: 0 20px 0 0;
padding: 0;
}
.socialmedia li:last-child {
margin: 0;
}
.socialmedia li a i {
transition: 0.25s all;
transform: scale(1);
}
.socialmedia li a:hover i {
transform: scale(1.2);
}
.socialmedia li i {
font-size: 24px;
color: var(--blue-600);
} .buttons {
margin: 40px 0 0 0;
padding: 0;
display: flex;
gap: 20px;
}
.buttons li {
margin: 0;
padding: 0;
display: flex;
align-items: center;
justify-content: flex-start;
} .more-link {
padding: 0 0 0 0;
}
.more-link a {
padding: 0 32px 0 0;
font-size: var(--body2-font-size);
font-weight: var(--semibold-weight);
color: var(--grey-500);
text-decoration: none;
line-height: 24px;
border: 0;
position: relative;
display: inline-flex;
align-items: center;
}
.more-link a:hover,
.more-link a:hover span {
color: var(--blue-600);
border: 0;
}
.more-link a:after {
position: absolute;
width: 24px;
height: 24px;
background-color: var(--gold);
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
transition: all 0.5s ease;
transform-origin: unset;
}
.more-link a:after {
content: "";
-webkit-mask-image: url(//www.hausundco.de/wp-content/themes/hausundco/assets/images/icons/arrow-long-right.svg);
mask-image: url(//www.hausundco.de/wp-content/themes/hausundco/assets/images/icons/arrow-long-right.svg);
mask-repeat: no-repeat;
}
.more-link a:hover:after {
background-color: var(--blue-600);
}
.more-link a:after {
left: auto;
right: 0;
}
.more-link a:hover:after {
color: var(--blue-600);
transform-origin: unset;
}
.more-link a:hover:after {
transform: translateX(10px) translateY(0);
}
@media (max-width: 768px) {
.more-link a {
font-size: var(--body3-font-size);
}
.more-link {
padding: 10px 0 0 0;
}
} .hero {
position: relative;
max-height: calc(75vh - var(--header-height));
aspect-ratio: 3/2;
}
.hero2 {
position: relative;
max-height: calc(70vh - var(--header-height));
aspect-ratio: 2/1;
}
.hero2-title {
background-color: var(--blue-600);
padding-top: var(--pad-section-m);
padding-right: var(--pad-section-l);
padding-bottom: var(--pad-section-m);
padding-left: var(--pad-section-l);
color: var(--white);
font-size: 30px;
line-height: 34px;
font-weight: var(--regular-weight);
} .admin-bar .hero .splide__list,
.admin-bar .hero2 .splide__list {
top: calc( var(--header-height) + var(--wp-admin--admin-bar--height));
}
.hero .splide__slide {
height: 100% !important;
}
.hero2 .splide__slide {
justify-content: flex-start;
align-items: flex-start;
}
.hero2 .hero2-title span {
color: var(--gold);
}
@media (max-width: 992px) { .hero2-title {
padding: 15px 30px;
font-size: var(--body2-font-size);
line-height: 24px;
}
}
@media (max-width: 768px) { }
@media (max-width: 575px) { .hero2-title {
padding: 10px 20px;
font-size: var(--body3-font-size);
line-height: 20px;
}
} .page-numbers.prev,
.page-numbers.next {
background-color: transparent !important;
} @media (max-width: 992px) {
.custom-slider-controls {
position: relative;
padding-bottom: 40px;
}
.custom-slider-controls .splide__arrows {
position: absolute;
left: 50%;
bottom: 0;
width: 100%;
transform: translateX(-50%);
pointer-events: none;
}
.custom-slider-controls .splide__arrow {
position: absolute;
top: 50%;
transform: translateY(-50%);
pointer-events: auto;
margin: 0;
color: var(--gold);
}
.custom-slider-controls .splide__arrow svg {
fill: var(--gold);
}
.custom-slider-controls .splide__arrow--prev {
left: 0;
}
.custom-slider-controls .splide__arrow--next {
right: 0;
}
.custom-slider-controls .splide__pagination {
position: absolute;
left: 50%;
bottom: 0;
transform: translateX(-50%) translateY(50%);
width: auto;
margin: 0;
padding: 0;
display: flex;
align-items: center;
justify-content: center;
}
}
@media (max-width: 575px) {
.custom-slider-controls {
padding-bottom: 0;
}
} .image-title {
position: absolute;
background-color: var(--blue-400);
bottom: var(--space-xl);
right: var(--space-xl);
color: var(--white);
font-size: var(--body2-font-size);
font-weight: var(--semibold-weight);
line-height: 24px;
padding: var(--space-s);
}
.image-title.small {
bottom: 0;
right: 0;
font-size: var(--body3-font-size);
line-height: 20px;
} #map {
width: 100%;
height: 450px;
}
#osmap {
width: 100%;
height: 100%;
aspect-ratio: 2/1;
}
#osmap.osmap-small {
width: 100%;
height: 360px;
min-height: 360px;
}
@media (max-width: 768px) {
#map {
height: 320px;
aspect-ratio: 1;
}
#osmap,
#osmap.osmap-small {
width: 100%;
height: 100%;
aspect-ratio: 1;
}
}
.hd_2click.hd_2click_osm[data-link="tm_map_cluster"] {
min-height: 450px;
} .map-popup p.content {
font-size: 16px;
}
.map-popup .button.small {
font-size: var(--body4-font-size);
font-weight: var(--regular-weight);
}
.map-popup .button:after,
.map-popup .button:before {
display: none;
}
.map-popup .button:hover {
background-color: var(--black);
color: var(--white);
border-color: var(--black);
padding: .3em 1em !important;
}
.leaflet-container {
font-family: 'DM Sans', 'Helvetica', sans-serif !important;
font-size: 16px !important;
}
.leaflet-control-attribution {
font-size: 12px !important;
font-weight: var(--regular-weight) !important;
color: var(--black) !important;
letter-spacing: 0 !important;
}
.leaflet-popup {
margin-bottom: 30px;
}
.leaflet-popup-content-wrapper {
box-shadow: 0 0 30px rgba(0, 0, 0, 0.15) !important;
}
.leaflet-popup-content {
margin: 13px 48px 13px 20px !important;
}
.leaflet-popup-content, 
.leaflet-popup-content p {
font-size: 16px;
}
.leaflet-popup-content p {
margin: 0 0 15px 0 !important;
}
.leaflet-popup-content p:last-child {
margin: 0 !important;
}
.leaflet-container p a {
font-size: 16px;
color: var(--grey-500) !important;
}
.leaflet-control-attribution a {
font-size: 12px !important;
font-weight: var(--regular-weight) !important;
color: var(--grey-500) !important;
} .map-routeplaner {
margin-top: 30px !important;
}
.leaflet-custom-popup .leaflet-popup-content {
margin: 0 !important;
}
.leaflet-popup-close-button {
width: 32px !important;
height: 32px !important;
padding: 6px;
box-sizing: content-box !important;
background-color: var(--gold) !important;
background-clip: content-box !important;
border: none;
border-radius: 50%;
position: absolute;
cursor: pointer;
text-indent: -9999px;
overflow: hidden;
top: 0 !important;
right: 0 !important;
}
.leaflet-popup-close-button::before,
.leaflet-popup-close-button::after {
content: "";
position: absolute;
left: 50%;
top: 50%;
width: 20px;
height: 2px;
background-color: var(--grey-500) !important;
transform-origin: center;
}
.leaflet-popup-close-button::before {
transform: translate(-50%, -50%) rotate(45deg);
}
.leaflet-popup-close-button::after {
transform: translate(-50%, -50%) rotate(-45deg);
}
.leaflet-popup-close-button:hover {
background-color: var(--blue-600) !important;
}
.leaflet-popup-close-button:hover::before,
.leaflet-popup-close-button:hover::after {
background-color: var(--white) !important;
}
.leaflet-custom-popup .custom-popup {
text-align: center;
padding: 10px;
background-color: var(--white);
border-radius: 8px;
width: 320px;
}
.leaflet-custom-popup .popup-image {
width: 100%;
height: auto;
border-radius: 4px;
margin-bottom: 10px;
position: relative;
}
.leaflet-custom-popup .popup-image img {
aspect-ratio: 3/2;
}
.leaflet-custom-popup .popup-image a {
position: relative;
width: 100%;
height: 100%;
display: block;
}
.leaflet-custom-popup .popup-title {
margin: 5px 0;
font-size: var(--body4-font-size);
font-weight: var(--bold-weight);
color: var(--grey-500);
line-height: 16px;
}
.leaflet-custom-popup .popup-title a {
color: var(--blue-600);
}
.leaflet-custom-popup .popup-text {
margin: 5px 0 !important;
font-size: var(--body4-font-size);
font-weight: var(--regular-weight);
color: var(--grey-500);
}
.leaflet-custom-popup .popup-button {
position: absolute;
right: 10px;
bottom: 10px;
z-index: 100;
display: inline-block;
padding: 6px 10px;
background-color: var(--gold);
color: var(--grey-500);
text-decoration: none;
border-radius: 4px;
font-size: var(--body4-font-size);
font-weight: var(--semibold-weight);
cursor: pointer;
pointer-events: none;
}
.leaflet-custom-popup a:hover .popup-button {
background-color: var(--blue-600);
color: var(--white);
}
@media (max-width: 575px) {
.leaflet-popup-content {
width: 240px !important;
margin: 40px 20px 20px 20px !important;
}
.leaflet-popup-content,
.leaflet-popup-content p {
font-size: var(--body4-font-size);
line-height: 18px;
}
.leaflet-container p a {
font-size: var(--body4-font-size);
line-height: 18px;
}
.leaflet-custom-popup .custom-popup {
width: 100%;
}
.leaflet-custom-popup .popup-title {
font-size: var(--body4-font-size);
}
.leaflet-custom-popup .popup-text {
font-size: var(--body4-font-size);
}
.leaflet-custom-popup .popup-button {
font-size: var(--body5-font-size);
}
} .stopper {
width: 240px;
height: 240px;
max-width: 240px;
aspect-ratio: 1/1;
margin: 0;
padding: 10px;
background-color: var(--blue-600);
border-radius: 50%;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
text-align: center;
vertical-align: middle;
display: flex;
align-items: center;
justify-content: center;
position: absolute;
top: 160px;
left: 40px;
z-index: 100;
transition: 0.5s all;
}
.stopper:hover {
transform: translateY(-10px);
}
.stopper a {
width: 100%;
height: 100%;
font-size: 35px;
font-weight: var(--regular-weight);
color: var(--white);
letter-spacing: 0;
text-align: center;
line-height: 42px;
-moz-hyphens: auto;
hyphens: auto;
display: flex;
align-items: center;
justify-content: center;
transform: rotate(-10deg);
}
.stopper a span.stopper-mobile {
display: none;
}
.stopper span.stopper-desktop {
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
gap: 0.25em;
}
.stopper span.stopper-info {
font-size: 35px;
font-weight: var(--semibold-weight);
line-height: 42px;
}
.stopper span.stopper-date-time,
.stopper span.stopper-desktop span:not(.stopper-info) {
font-size: var(--body2-font-size);
line-height: 1.3em;
}
.stopper span.stopper-desktop span:not(.stopper-info):not(.stopper-date-time) {
font-size: var(--body1-font-size);
line-height: 20px;
}
.stopper span.stopper-desktop span:not(.stopper-info) {
font-weight: var(--regular-weight);
text-transform: none;
}
@media only screen and (max-width: 1200px) {
.stopper {
width: 200px;
height: 200px;
padding: 10px;
}
.stopper span.stopper-info {
font-size: 24px;
line-height: 32px;
}
}
@media only screen and (max-width: 992px) {
.stopper {
left: 40px;
top: 120px;
width: 160px;
height: 160px;
padding: 10px;
}
.stopper a {
}
.stopper a span.stopper-desktop {
display: none;
}
.stopper a span.stopper-mobile {
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
gap: 0;
}
.stopper span.stopper-mobile span.stopper-info {
font-size: var(--body2-font-size);
line-height: 1.2;
}
.stopper span.stopper-mobile span.stopper-date-time {
font-size: var(--body3-font-size);
line-height: 1.2;
}
}
@media only screen and (max-width: 767px) {
}
@media only screen and (max-width: 575px) {
.stopper {
width: 120px;
height: 120px;
left: 20px;
}
.stopper span.stopper-mobile span.stopper-info {
font-size: var(--body3-font-size);
}
.stopper span.stopper-mobile span.stopper-date-time {
font-size: var(--body4-font-size);
}
} .services {
display: grid;
align-items: initial;
grid-template-columns: 1fr 1fr;
grid-gap: 30px;
align-items: stretch;
}
.services-logo {
position: absolute;
top: 70px;
right: 50%;
left: 50%;
transform: translateX(-50%);
}
.services-item {
display: flex;
flex-direction: column;
align-self: stretch !important;
width: 100%;
background-color: var(--white);
}
.services-item-image {
}
.services-item-text-container {
padding: 60px;
}
.services-item-text-headline {
margin-bottom: 45px;
}
.services-item-text {
}
.services-icons-item {
display: flex;
flex-direction: column;
align-self: stretch !important;
width: 100%;
background-color: var(--white);
}
.services-icons-item-container {
padding-top: 40px;
padding-right: 60px;
padding-bottom: 40px;
padding-left: 60px;
display: flex;
gap: 20px;
flex-direction: column;
}
.services-icons-item-headline-wrapper {
align-items: flex-start;
display: flex;
width: 100%;
flex-direction: row;
column-gap: 20px;
}
.services-icons-item-icon {
width: 45px;
height: 45px;
}
.services-icons-item-headline {
padding-top: 12px;
padding-bottom: 12px;
margin-bottom: 0;
font-size: var(--body2-font-size) !important;
font-weight: var(--semibold-weight);
color: var(--grey-500);
line-height: 24px !important;
}
.services-icons-item-text {
margin-left: 65px;
font-size: var(--body2-font-size) !important;
font-weight: var(--regular-weight);
color: var(--grey-500);
line-height: 24px !important;
}
@media(max-width: 992px) {
.services-logo {
top: 20px;
}
.services-item-text-container {
padding: 40px;
}
.services-icons-item-container {
padding: 40px; 
}
.services-icons-item-text {
margin-left: 0;
}
}
@media(max-width: 768px) {
.services {
grid-template-columns: 1fr;
grid-gap: 20px;
}
.services-item-text-headline {
margin-bottom: 20px;
}
.services-logo {
position: relative;
transform: none;
top: auto;
left: auto;
bottom: auto;
right: auto;
display: flex;
margin: 0 auto;
order: 4;
}
}
@media(max-width: 575px) {
.services-icons-item-icon {
width: 36px;
height: 36px;
}
.services-item-text-container {
padding: 20px;
}
.services-icons-item-container {
padding: 20px;
gap: 10px; 
}
.services-item-text-headline, 
.services-icons-item-headline {
font-size: var(--body3-font-size) !important;
font-weight: var(--semibold-weight);
line-height: 20px !important;
}
.services-item-text,
.services-icons-item-text {
font-size: var(--body3-font-size) !important;
line-height: 20px !important;
}
} .visually-hidden {
position: absolute;
width: 1px;
height: 1px;
margin: -1px;
padding: 0;
border: 0;
overflow: hidden;
clip: rect(0, 0, 0, 0);
clip-path: inset(50%);
white-space: nowrap;
}
.access-btn {
position: fixed;
bottom: 70px;
left: 20px;
display: flex;
align-items: center;
justify-content: center;
width: 64px;
height: 64px;
padding: 0;
border-radius: 50%;
background: linear-gradient(180deg, var(--blue-600) 0%, color-mix(in oklab, var(--blue-600) 85%, var(--blue-600)) 100%);
color: var(--white);
outline: none;
transition: transform 240ms cubic-bezier(.2,.8,.2,1), filter 240ms;
will-change: transform, filter;
z-index: 1000;
} .access-btn:hover,
.access-btn:focus {
transform: translateY(-2px);
outline: none;
}
.access-btn::after {
content: attr(data-tooltip);
position: absolute;
bottom: 100%;
left: 0;
transform: translateY(-8px);
background: var(--blue-600);
color: var(--white);
padding: 0.4em 0.6em;
border-radius: 0.25em;
white-space: nowrap;
font-size: var(--body4-font-size);
opacity: 0;
pointer-events: none;
transition: opacity 200ms ease-in-out;
z-index: 10;
}
.access-btn:hover::after,
.access-btn:focus::after {
opacity: 1;
}
.access-btn.tooltip-hidden::after {
opacity: 0 !important;
visibility: hidden !important;
}
.access-btn:focus-visible{
transform: translateY(-2px);
}
.access-btn i {
font-size: 32px;
}
@media (max-width: 992px) {
.access-btn {
bottom: 20px;
left: 20px;
}
}
@media (max-width: 575px) {
.access-btn {
width: 48px;
height: 48px;
bottom: 10px;
}
}
@supports not (color-mix(in oklab, black 50%, white 50%)){
.access-btn { background: linear-gradient(180deg, var(--blue-600) 0%, var(--blue-600) 100%); }
} .floating-buttons {
top: 25%;
right: 20px;
display: flex;
z-index: 10001;
position: fixed;
transition: ease-in-out 250ms;
visibility: hidden;
align-items: flex-end;
flex-direction: column;
}
.floating-buttons .floating-button {
width: 48px;
height: 48px;
cursor: pointer;
margin: 12px auto 0 0;
display: flex;
align-items: center;
justify-content: center;
outline: none !important;
padding: 0px;
max-width: none !important;
box-shadow: none;
color: var(--white);
text-align: center;
user-select: none;
border-radius: 25px;
background-size: cover;
text-decoration: none;
background-color: var(--blue-600);
background-image: none;
background-repeat: no-repeat;
background-position: center center;
position: relative;
right: 0px;
z-index: 999;
opacity: 1;
visibility: visible;
transition: all 300ms ease-in, right 300ms 0ms, opacity 300ms 0ms;
box-shadow: 0 0 25px rgba(0, 0, 0, 0.2);
}
.floating-buttons .floating-button:hover {
background-color: var(--blue-600);
}
.floating-buttons .floating-button:first-child {
margin-top: 0;
}
.floating-buttons .floating-button:before {
top: 0;
left: 0;
width: 100%;
height: 100%;
content: '';
opacity: 0;
overflow: hidden;
position: absolute;
transition: all 250ms ease-in-out 0s;
visibility: hidden;
border-radius: 0;
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
}
.floating-buttons .floating-button-label {
height: 48px;
padding: 0px 15px 0px 15px;
line-height: 48px;
top: 50%;
font-size: 18px;
font-weight: var(--bold-weight);
color: var(--white);
right: 50px;
margin: 0;
z-index: 1;
position: absolute;
font-size: 16px;
transform: translateY(-50%);
background-color: var(--blue-600);
text-align: right;
transition: all 250ms ease-in-out;
white-space: nowrap;
opacity: 0;
visibility: hidden;
border-radius: 25px;
-webkit-border-radius: 25px;
}
.floating-buttons .floating-button:hover .floating-button-label {
right: 58px;
height: 48px;
padding: 0px 15px 0px 15px;
line-height: 48px;
opacity: 1;
visibility: visible;
}
.floating-buttons .floating-button-label:hover {
background-color: var(--blue-400);
}
.floating-buttons .floating-button i.icon {
width: 32px;
height: 32px;
margin: 0;
display: block;
}
.floating-buttons .floating-button i.icon.phone {
content: '';
-webkit-mask-image: url(//www.hausundco.de/wp-content/themes/hausundco/assets/images/icons/phone.svg);
mask-image: url(//www.hausundco.de/wp-content/themes/hausundco/assets/images/icons/phone.svg);
mask-repeat: no-repeat;
background-color: var(--white);
}
.floating-buttons .floating-button i.icon.contact {
content: '';
-webkit-mask-image: url(//www.hausundco.de/wp-content/themes/hausundco/assets/images/icons/email.svg);
mask-image: url(//www.hausundco.de/wp-content/themes/hausundco/assets/images/icons/email.svg);
mask-repeat: no-repeat;
background-color: var(--white);
}
.floating-buttons .floating-button i.icon.booking {
content: '';
-webkit-mask-image: url(//www.hausundco.de/wp-content/themes/hausundco/assets/images/icons/booking.svg);
mask-image: url(//www.hausundco.de/wp-content/themes/hausundco/assets/images/icons/booking.svg);
mask-repeat: no-repeat;
background-color: var(--white);
}
.mobile-menu-opened .floating-buttons .floating-button {
box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
}
@media screen and (max-width: 992px) {
.floating-buttons .floating-button {
box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
}
}
@media screen and (max-width: 768px) {
.floating-buttons {
top: 50vh;
}
.floating-buttons .floating-button {
width: 44px;
height: 120px;
margin: 0;
transition: none;
}
.floating-buttons .floating-button:before {
display: none;
}
.floating-buttons .floating-button.phone,
.floating-buttons .floating-button.contact {
display: none;
}
.floating-buttons .floating-button-label,
.floating-buttons .floating-button:hover .floating-button-label {
opacity: 1;
visibility: visible;
transform: rotate(-90deg);
height: 44px;
line-height: 44px;
right: 0;
top: 0;
position: relative;
text-transform: uppercase;
font-weight: var(--bold-weight);
}
.floating-buttons .floating-button i.icon {
display: none;
}
}
@media screen and (max-width: 575px) {
.floating-buttons .floating-button-label,
.floating-buttons .floating-button:hover .floating-button-label {
}
} #jobs-list {
list-style: none;
margin: 0;
padding: 0;
display: grid;
grid-template-columns: 1fr;
gap: 40px;
}
#jobs-list li {
background-color: var(--white);
border-radius: 0;
box-shadow: 0 2px 8px rgba(0,0,0,0.1);
padding: 20px 40px;
transition: transform 0.2s, box-shadow 0.2s;
}
#jobs-list li:hover {
transform: translateY(-4px);
box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}
#jobs-list h2 {
margin: 0 0 10px 0;
font-size: 20px;
font-weight: var(--regular-weight);
color: var(--blue-600);
text-transform: uppercase;
}
#jobs-list .jobs-date-teaser {
display: flex;
gap: 5px;
}
#jobs-list .separator {
color: var(--blue-400);
}
#jobs-list time {
display: block;
font-size: var(--body3-font-size);
font-weight: var(--bold-weight);
color: var(--blue-600);
}
#jobs-list .teaser {
font-size: var(--body3-font-size);
color: var(--black);
}
@media (max-width: 992px) {
#jobs-list .jobs-date-teaser {
flex-direction: column;
}
#jobs-list .jobs-date-teaser .separator {
display: none;
}
}
@media (max-width: 575px) {
} .separator {
display: inline;
margin: 0 5px;
}
.address .separator {
margin: 0 5px 0 0;
} @media (max-width: 575px) {
.separator,
.address .separator {
font-size: 0;
margin: 0;
}
.separator::after {
content: '';
display: block;
margin: 0;
}
} .image-gallery {
display: flex; }
.image-gallery img {
width: 100%;
height: auto;
}
.image-gallery .overlay {
background-color: transparent;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 2;
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
.image-gallery a {
z-index: 1;
position: relative;
width: 100%;
height: 100%;
display: block;
}
.image-gallery a:hover .overlay {
background-color: rgba(255, 255, 255, 0.3);
}
.image-gallery .title {
display: none;
}
.image-gallery a:hover .title {
width: 100%;
height: 100%;
font-size: 20px;
color: var(--white);
letter-spacing: 1px;
text-transform: uppercase;
text-shadow: 0 0 20px rgba(0, 0, 0, 0.85);
display: flex;
align-items: center;
justify-content: center;
position: absolute;
left: 0;
top: 0;
z-index: 5;
}
@media screen and (max-width: 992px) {
.image-gallery .title {
font-size: 24px;
}
}
@media screen and (max-width: 575px) {
.image-gallery .overlay {
display: none;
}
.image-gallery .title,
.image-gallery a:hover .title {
font-size: 18px;
color: var(--grey-500);
letter-spacing: 0;
position: relative;
display: inline-block;
text-align: left;
text-shadow: none;
text-transform: uppercase;
}
} .nav-single {
width: 100%;
padding: 0;
display: grid;
grid-template-columns: 3fr 1fr 3fr;
gap: 40px;
justify-content: space-between;
align-items: flex-start;
}
.nav-single .nav-label,
.nav-single .mobile {
font-size: var(--body3-font-size);
letter-spacing: 0;
line-height: 20px;
}
.nav-single .nav-next .nav-label {
text-align: right;
}
.nav-single .nav-prev .nav-label {
text-align: left;
}
.nav-single .nav-grid .nav-label {
text-indent: -9999px;
height: 0;
}
.nav-single p {
font-size: 16px;
}
.nav-prev,
.nav-next,
.nav-grid {
min-width: 80px;
}
.nav-prev {
display: flex;
align-items: flex-start;
justify-content: flex-start;
}
.nav-next {
display: flex;
align-items: flex-start;
justify-content: flex-end;
}
.nav-grid {
display: flex;
align-items: center;
justify-content: center;
height: 100%;
}
.nav-grid a {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.nav-grid a:hover .icon-grid {
background-color: var(--blue-600);
}
.nav-grid .icon-grid {
width: 45px;
height: 40px;
background-color: var(--gold);
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
gap: 7px;
position: relative;
}
.nav-grid .icon-grid .line {
display: flex;
height: 2px;
width: 31px;
background-color: var(--white);
opacity: 1;
-webkit-transition: .3s ease-in-out;
-moz-transition: .3s ease-in-out;
-o-transition: .3s ease-in-out;
transition: .3s ease-in-out;
}
.nav-prev span,
.nav-next span,
.nav-grid span {
font-size: var(--body3-font-size);
color: var(--grey-500);
line-height: 20px;
display: flex;
}
.nav-prev span.nav-title,
.nav-next span.nav-title {
font-size: var(--body2-font-size);
color: var(--blue-600);
line-height: 24px;
}
.nav-prev p,
.nav-next p {
padding: 0;
margin: 0;
}
.nav-prev p {
text-align: left;
}
.nav-prev p a,
.nav-next p a {
padding: 0 48px 0 0;
font-size: var(--body2-font-size);
font-weight: var(--semibold-weight);
color: var(--blue-600);
text-decoration: none;
line-height: 24px;
border: 0;
position: relative;
display: flex;
flex-direction: column;
max-width: 360px;
}
.nav-prev p a {
padding: 0 0 0 48px;
}
.nav-prev p a:hover,
.nav-next p a:hover,
.nav-prev p a:hover span,
.nav-next p a:hover span {
color: var(--blue-600);
border: 0;
}
.nav-prev p a:before, 
.nav-next p a:after {
position: absolute;
width: 30px;
height: 30px;
background-color: var(--gold);
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
transition: all 0.5s ease;
transform-origin: unset;
}
.nav-next p a:after {
content: "";
-webkit-mask-image: url(//www.hausundco.de/wp-content/uploads/arrow-right.svg);
mask-image: url(//www.hausundco.de/wp-content/uploads/arrow-right.svg);
mask-repeat: no-repeat;
}
.nav-prev p a:before {
content: "";
-webkit-mask-image: url(//www.hausundco.de/wp-content/uploads/arrow-left.svg);
mask-image: url(//www.hausundco.de/wp-content/uploads/arrow-left.svg);
mask-repeat: no-repeat;
}
.nav-prev p a:hover:before, 
.nav-next p a:hover:after {
background-color: var(--blue-600);
}
.nav-prev p a:after {
content: '';
-webkit-mask-image: none;
mask-image: none;
background-color: transparent;
}
.nav-next p a:after {
left: auto;
right: 0;
}
.nav-prev p a:before {
left: 0;
right: auto;
}
.nav-prev p a:hover:before,
.nav-next p a:hover:after {
color: var(--blue-600);
transform-origin: unset;
}
.nav-next p a:hover:after {
transform: translateX(10px) translateY(0);
}
.nav-prev p a:hover:before {
transform: translateX(-10px) translateY(0);
}
.nav-single span.mobile {
display: none;
}
@media (max-width: 767px) {
.nav-single {
grid-template-columns: 1fr;
gap: 30px;
}
.nav-grid {
display: none;
}
.nav-next {
justify-content: flex-start;
}
.nav-prev p a,
.nav-next p a {
padding: 0;
font-size: var(--body3-font-size);
}
.nav-prev p a:before,
.nav-next p a:after {
display: none;
}
.nav-prev p,
.nav-next p {
padding: 10px 0 0 0;
}
.nav-single span.mobile {
display: inline-block;
}
.nav-single .nav-label {
display: none;
}
} .grid-icons .icon {
fill: var(--grey-500);
} .table-scrollable {
width: 100%;
overflow-y: auto;
margin: 0 0 1em;
}
.table-scrollable::-webkit-scrollbar {
-webkit-appearance: none;
width: 14px;
height: 14px;
}
.table-scrollable::-webkit-scrollbar-thumb {
border-radius: 8px;
border: 3px solid var(--white);
background-color: rgba(0, 0, 0, .3);
}
.table-scrollable table {
width: 100%;
border-collapse: collapse;
}
.table-scrollable table thead th {
color: var(--blue-600);
}
.table-scrollable table td,
.table-scrollable table th {
font-size: var(--body1-font-size);
}
.table-scrollable table td,
.table-scrollable table th {
border-bottom: 1px solid var(--grey-300);
}
@media screen and (max-width: 768px) {
.table-scrollable table td,
.table-scrollable table th {
white-space: nowrap;
}
}
.wp-block-table td, .wp-block-table th {
border: 0;
}
.wp-block-table thead {
border-bottom: var(--border-size) solid var(--grey-300);
}
.wp-block-table tfoot {
border: 0;
}
.table, .table table {
width: 100%;
border: 0;
padding: 0;
margin: 0 0 1em;
}
.table thead th {
font-size: 20px;
font-weight: var(--bold-weight);
color: var(--grey-500);
}
.table td {
min-width: 160px;
padding: 15px 0;
font-size: 20px;
font-weight: var(--regular-weight);
color: var(--grey-500);
border-left: var(--border-size) solid transparent;
border-top: var(--border-size) solid transparent;
border-right: var(--border-size) solid transparent;
border-bottom: var(--border-size) solid var(--grey-300);
}
.table td a {
border-bottom: var(--border-size) solid var(--grey-500);
}
.table td a:hover {
border-bottom: var(--border-size) solid transparent;
}
.wp-block-table th {
font-weight: var(--bold-weight);
}
@media screen and (max-width: 768px) {
.table td {
width: 100%;
display: block;
}
.table td:first-child {
padding: 10px 0 0 0;
border-bottom: 0;
}
.table td {
padding: 0 0 10px 0;
}
} .table-container {
display: flex;
flex-direction: column;
gap: 15px;
}
.table-row { display: grid;
grid-template-columns: 1fr 1fr;
gap: 10px;
align-items: stretch;
}
.table-cell {
padding: 5px 0;
font-size: var(--body2-font-size);
line-height: 24px;
}
.cell-short { font-weight: var(--semibold-weight);
}
.cell-long { }
@media (max-width: 575px) {
.table-container {
margin-bottom: 15px;
gap: 0;
}
.table-row {
grid-template-columns: 1fr;
gap: 0; }
.table-cell {
font-size: var(--body3-font-size);
line-height: 20px;
}
.cell-short {
flex: 1;
}
.cell-long {
flex: 1;
}
} input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
border-color: var(--grey-500);
-webkit-text-fill-color: var(--grey-500);
-webkit-box-shadow: 0 0 0px 1000px rgba(0, 0, 0, 0.05) inset;
transition: background-color 5000s ease-in-out 0s;
} #breadcrumb {
padding-top: var(--pad-section-s);
padding-bottom: var(--pad-section-s);
}
.breadcrumb {
color: var(--grey-500);
display: flex;
align-items: center;
}
.breadcrumb a {
color: var(--grey-500);
}
.breadcrumb .current-page {
font-weight: var(--bold-weight);
color: var(--grey-500);
}
.breadcrumb .delimiter:after {
content: '';
width: 16px;
height: 16px;
-webkit-mask-image: url(//www.hausundco.de/wp-content/themes/hausundco/assets/images/icons/chevron-right.svg);
mask-image: url(//www.hausundco.de/wp-content/themes/hausundco/assets/images/icons/chevron-right.svg);
mask-repeat: no-repeat;
background-color: var(--grey-400);
position: relative;
margin: 0 8px;
display: flex;
justify-content: center;
align-items: center;
}
@media (max-width: 768px) {
#breadcrumb {
display: none;
}
} .brxe-post-sharing a { border-radius: 0; } .crop-3-1 {
position: relative;
width: 100%;
padding-top: 33.3333%;
overflow: hidden;
}
.crop-3-1 img {
position: absolute;
top: 50%;
left: 50%;
min-width: 100%;
min-height: 100%;
transform: translate(-50%, -50%);
}
@media (max-width: 992px) {
.crop-3-1 {
padding-top: 50%;
}
}
@media (max-width: 768px) {
.crop-3-1 {
aspect-ratio: auto;
}
.crop-3-1 img {
width: 100%;
height: auto;
object-fit: none;
}
} .wps-form {
width: 100%;
margin: 0 auto;
padding: 0;
}
.wps-form-row {
display: flex;
flex-direction: column;
width: 100%;
margin-bottom: 5px;
}
.wps-form-row .wpcf7-form-control {
width: 100%;
}
.wps-form-column {
flex: 1;
padding: 0.5rem 0;
width: 100%;
}
.wps-form-column.center {
text-align: center;
}
.wps-form-column.right {
text-align: right;
}
.wps-form-column.single {
padding: 0.5rem 0 !important;
}
@media only screen and (min-width: 48em) {
.wps-form-row {
flex-direction: row;
}
.wps-form-column {
padding: 0.5rem 1rem;
}
.wps-form-column:nth-child(odd) {
padding: 0.5rem 1rem 0.5rem 0;
}
.wps-form-column:nth-child(even) {
padding: 0.5rem 0 0.5rem 1rem;
}
}
.wps-form fieldset {
margin: 0 0 40px 0;
padding: 0;
border: 0;
}
.wpcf7-form-control-wrap,
.wpcf7-quiz-label {
margin: 0 0 10px 0;
display: block;
}
.wpcf7-form label {
margin: 0 0 5px 0;
font-size: var(--body3-font-size);
color: var(--grey-500);
font-weight: var(--regular-weight);
letter-spacing: 0;
line-height: 24px;
display: block;
}
.wpcf7-form label a {
text-decoration: none;
}
.sr-only {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border: 0;
}
.wpcf7-select,
.wpcf7-text,
.wpcf7-textarea,
.wpcf7-date,
.wpcf7-email,
.wpcf7-number {
width: 100%;
padding: 5px 20px !important;
background-color: var(--white) !important;
font-size: var(--body2-font-size) !important;
letter-spacing: 0;
color: var(--black) !important;
line-height: 40px;
border-radius: var(--border-radius-max);
-webkit-border-radius: var(--border-radius-max);
-moz-border-radius: var(--border-radius-max);
border: 1px solid var(--grey-200);
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}
.wpcf7-textarea {
padding: 10px 20px !important;
}
.wpcf7-select:focus,
.wpcf7-text:focus,
.wpcf7-textarea:focus,
.wpcf7-date:focus,
.wpcf7-email:focus,
.wpcf7-number:focus,
.wpcf7-select:hover,
.wpcf7-text:hover,
.wpcf7-textarea:hover,
.wpcf7-date:hover,
.wpcf7-email:hover,
.wpcf7-number:hover {
border: 1px solid var(--grey-500) !important;
border-radius: var(--border-radius-max) !important;
outline: 4px solid var(--grey-200) !important;
}
.wpcf7-select {
padding: 5px 20px !important;
line-height: 40px;
-webkit-appearance: none;
max-width: 100%;
overflow: hidden;
word-wrap: normal !important;
white-space: normal;
}
.wpcf7-date {
padding: 12px 20px !important;
line-height: 24px;
-webkit-appearance: none;
}
.wpcf7-submit {
width: auto !important;
padding: 12px 24px;
min-width: 160px;
background-color: var(--gold);
font-size: var(--body3-font-size);
font-weight: var(--semibold-weight);
color: var(--grey-500);
text-transform: uppercase;
text-align: center;
text-decoration: none;
line-height: 22px;
letter-spacing: 0;
border: var(--border-size) solid var(--gold);
border-radius: var(--border-radius);
-moz-border-radius: var(--border-radius);
-webkit-border-radius: var(--border-radius);
-webkit-appearance: none;
display: inline-flex;
align-items: center;
justify-content: center;
transition: 0.25s ease-in;
overflow: hidden;
}
.wpcf7-submit:hover {
background-color: var(--blue-600);
border: var(--border-size) solid var(--blue-600);
color: var(--white);
}
.wpcf7-submit:focus,
.wp-core-ui .button-primary.focus, 
.wp-core-ui .button-primary:focus {
outline: 0 !important;
box-shadow: none !important;
}
.wpcf7-submit:disabled {
opacity: 0.5;
}
.wpcf7-spinner {
display: none;
width: 0;
height: 0;
}
.wpcf7-submitting .wpcf7-spinner {
display: inline-block;
width: 16px;
height: 16px;
margin-left: 10px;
vertical-align: middle;
}
.visually-hidden {
position: absolute !important;
width: 1px; 
height: 1px; 
padding: 0; 
margin: -1px; 
overflow: hidden;
clip: rect(0,0,0,0); 
white-space: nowrap;
border: 0;
}
.required {
color: var(--blue-600);
}
.wpcf7-form p {
margin: 0 0 10px 0;
}
.wpcf7-not-valid {
border: var(--border-size) solid var(--logo-red) !important;
}
.wpcf7-not-valid-tip {
font-size: var(--body3-font-size);
font-weight: var(--regular-weight);
color: var(--logo-red) !important;
}
.wpcf7-list-item {
margin: 0 !important;
}
.wpcf7-form span.wpcf7-list-item {
display: block;
}
.wpcf7-form .wpcf7-checkbox label,
.wpcf7-form .wpcf7-acceptance label {
position: relative;
font-size: var(--body3-font-size) !important;
font-weight: var(--regular-weight);
display: flex;
gap: 12px;
}
.wpcf7-form .wpcf7-checkbox label a,
.wpcf7-form .wpcf7-acceptance label a {
font-size: var(--body3-font-size) !important;
font-weight: var(--semibold-weight);
}
.wpcf7-form .wpcf7-checkbox input[type="checkbox"],
.wpcf7-form .wpcf7-acceptance input[type="checkbox"] {
position: relative;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
width: 20px;
height: 20px;
min-width: 20px;
min-height: 20px;
padding: 0;
border: 2px solid var(--white);
background-color: var(--white);
outline: 1px solid var(--grey-200);
border-radius: var(--border-radius-min);
cursor: pointer;
transition: background-color 0.3s ease, border-color 0.3s ease;
}
.wpcf7-form .wpcf7-checkbox input[type="checkbox"]:focus,
.wpcf7-form .wpcf7-acceptance input[type="checkbox"]:focus {
outline: 1px solid var(--grey-500);
}
.wpcf7-form .wpcf7-checkbox input[type="checkbox"]:checked,
.wpcf7-form .wpcf7-acceptance input[type="checkbox"]:checked {
background-color: var(--grey-500);
border-color: var(--white);
}
::placeholder {
color: var(--grey-500) !important;
opacity: 1;
}
.wpcf7-form .wpcf7-select option:first-child {
color: var(--grey-500) !important;
}
@media (max-width: 575px) {
.wpcf7-select, .wpcf7-text, .wpcf7-textarea, .wpcf7-date, .wpcf7-email, .wpcf7-number {
font-size: var(--body3-font-size) !important;
}
} .wpcf7-response-output,
.wpcf7-validation-errors,
.wpcf7-acceptance-missing {
margin: 0 0 10px 0 !important;
padding: 0 !important;
font-size: 18px;
font-weight: var(--regular-weight);
color: var(--logo-red);
background-color: transparent;
border: 0 !important;
border-radius: var(--border-radius-max);
-webkit-border-radius: var(--border-radius-max);
-moz-border-radius: var(--border-radius-max);
}
.wpcf7 form.sent .wpcf7-response-output,
.wpcf7-mail-sent-ok {
color: var(--green-600) !important;
} .cf7-modal {
position: fixed;
z-index: 1001;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.5);
display: flex;
justify-content: center;
align-items: center;
padding: 0;
box-sizing: border-box;
}
.cf7-modal-content {
background-color: var(--white);
padding: 10px 20px;
border-radius: var(--border-radius-max);
text-align: center;
max-width: 400px;
width: 100%;
box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
transition: 0.5s ease-in-out;
font-size: 18px;
}
.cf7-modal-success .cf7-modal-content {
background-color: var(--green-600);
color: var(--white);
}
.cf7-modal-error .cf7-modal-content {
background-color: var(--logo-red);
color: var(--white);
}
@media (max-width: 575px) {
.cf7-modal-content {
max-width: 90%;
}
}
.form form fieldset input.field.error:focus,
.form form fieldset select.error:focus,
.form form fieldset textarea.error:focus,
.formTab form fieldset input.field.error:focus,
.formTab form fieldset select.error:focus,
.formTab form fieldset textarea.error:focus,
.form form fieldset input[type="checkbox"].error:focus+label:before {
border: var(--border-size) solid var(--logo-red);
}
p.error {
width: auto;
max-width: 640px;
margin: 0 auto 25px auto;
padding: 10px;
font-size: 32px;
color: var(--white);
text-align: left;
line-height: 125%;
background-color: var(--logo-red);
}
p.success {
width: auto;
max-width: 640px;
margin: 0 auto 25px auto;
padding: 10px;
font-size: 32px;
color: var(--white);
text-align: left;
line-height: 125%;
background-color: var(--green-600);
}
p.error i,
p.success i {
margin-right: 10px;
}
span.error {
font-weight: var(--bold-weight);
color: var(--logo-red);
}
span.required {
color: var(--blue-600);
} input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
border-color: var(--grey-500);
-webkit-text-fill-color: var(--grey-500);
-webkit-box-shadow: 0 0 0px 1000px rgba(0, 0, 0, 0.05) inset;
transition: background-color 5000s ease-in-out 0s;
} .tags li a { padding: 10px; border: 2px solid var(--blue-200); font-size: 18px; font-weight: var(--semibold-weight); color: var(--blue-600); text-transform: none; line-height: 24px; }
.tags li a:hover { background-color: var(--blue-600); color: var(--white); border: 2px solid var(--blue-600); }
.press { margin-bottom: 60px; }
.press h2 { margin-bottom: 20px; }
.press figure { position: relative; margin-bottom: 40px !important; }
.press figcaption { position: relative; margin: 0 !important; padding: 15px; background-color: var(--blue-600); font-size: 18px; font-weight: var(--regular-weight); color: var(--white); line-height: 24px; }
@media(max-width: 575px) {
.tags li a { font-size: var(--body3-font-size); line-height: 20px; }
.press figcaption {
font-size: var(--body3-font-size);
line-height: 20px;
}
} .scrollToTopBtn {
position: fixed;
bottom: 70px;
right: 20px;
z-index: 1000;
opacity: 0;
background: var(--blue-600);
border: 0 !important;
cursor: pointer;
width: 60px;
height: 60px;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
transition: transform 240ms cubic-bezier(.2,.8,.2,1), filter 240ms;
will-change: transform, filter;
}
.scrollToTopBtn:hover {
transform: translateY(-2px);
}
.scrollToTopBtn i {
color: var(--white) !important;
}
.scrollToTopBtn:hover i {
color: var(--black) !important;
}
.showBtn {
opacity: 1;
}
.opened .showBtn {
opacity: 0;
}
@media (max-width: 992px) {
.scrollToTopBtn {
bottom: 20px;
right: 20px;
}
}
@media (max-width: 575px) {
.scrollToTopBtn {
width: 48px;
height: 48px;
bottom: 10px;
}
.scrollToTopBtn img {
width: 20px;
height: auto;
}
} .pt-s {
padding-top: var(--pad-section-s);
}
.pt-m {
padding-top: var(--pad-section-m);
}
.pt-l {
padding-top: var(--pad-section-l);
}
.pt-xl {
padding-top: var(--pad-section-xl);
}
.pt-xxl {
padding-top: var(--pad-section-xxl);
}
.pb-s {
padding-bottom: var(--pad-section-s);
}
.pb-m {
padding-bottom: var(--pad-section-m);
}
.pb-l {
padding-bottom: var(--pad-section-l);
}
.pb-xl {
padding-bottom: var(--pad-section-xl);
}
.pb-xxl {
padding-bottom: var(--pad-section-xxl);
} .bg-blue-200 {
background-color: var(--blue-200);
} @supports (-webkit-touch-callout: none) {
.parallax-image {
background-attachment: scroll !important;
}
}
#datenschutz h2, #impressum h2 {
margin-bottom: 20px;  
}
#datenschutz h3, #impressum h3 {
margin-bottom: 15px;
font-size: 20px;
}
#datenschutz h4, #impressum h4 {
margin-bottom: 10px;
font-size: 18px;
color: var(--grey-500);
}
#datenschutz p, #impressum p {
margin-bottom: 30px;  
}
.input-range {
display: flex;
align-items: center;
gap: 15px;
}
.input-range input[type="number"] {
flex: 1;
min-width: 0;
}
.range-separator {
flex-shrink: 0;
color: var(--bricks-color-secondary, #666);
} .load-more-wrapper {
text-align: center;
margin-top: 2rem;
}
.load-more-btn {
cursor: pointer;
} .tm-cluster-map {
width: 100%;
max-height: 600px;
aspect-ratio: 3/2;
}
@media (max-width: 768px) {
.tm-cluster-map {
min-height: 320px;
max-height: 320px;
aspect-ratio: 1;
}
}