@charset "UTF-8";

@font-face {
    font-family: Söhne;
    font-style: normal;
    font-weight: 400;
    src: url(../fonts/soehne-buch.woff2) format("woff2")
}

@font-face {
    font-family: Söhne;
    font-style: italic;
    font-weight: 400;
    src: url(../fonts/soehne-buch-kursiv.woff2) format("woff2")
}

@font-face {
    font-family: Bau Pro;
    font-style: normal;
    font-weight: 400;
    src: url(../fonts/bau-pro.woff2) format("woff2")
}

@font-face {
    font-family: Bau Pro;
    font-style: normal;
    font-weight: 400;
    src: url(../fonts/bau-pro.woff) format("woff")
}
@font-face {
    font-family: "BrownStd-Bold";
    src: url("../fonts/BrownStd-Bold.woff2") format("woff2");
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "BrownStd-Regular";
    src: url("../fonts/BrownStd-Regular.woff2") format("woff2");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "BrownStd-Light";
    src: url("../fonts/BrownStd-Light.woff2") format("woff2");
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}
:root {
    --color-primary: #bdbbb4;
    --color-secondary: #002534;
    --color-tertiary: #e9f1fa;
    --color-quaternary: #4bb9c8;
    --color-quinary: #1a69b3;
    --color-background: #f3f3f3;
    --color-opacity: 128, 128, 128;
    --color-white: #fff;
    --color-text-dark: #323232;
    --color-text-light: #fff;
    --color-text-lighter: #fff;
    --color-text-body: #323232;
    --color-text-white: #fff;
    --color-text-opacity: 26, 26, 26;
    --font-base: "Söhne", sans-serif;
    --font-heading: "Bau Pro", sans-serif;
    --font-d1: 72px;
    --font-d1-leading: 0.9;
    --font-d2: 48px;
    --font-d2-leading: 1.3;
    --font-t1: 72px;
    --font-t1-leading: 0.9;
    --font-t2: 48px;
    --font-t2-leading: 1.3;
    --font-t3: 32px;
    --font-t3-leading: 1.4;
    --font-t4: 24px;
    --font-t4-leading: 1.5;
    --font-t5: 20px;
    --font-t5-leading: 1.5
}

body {
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: .3px;
    line-height: 1.75
}

body,
html {
    background-color: var(--color-background)
}

.bg-quinary {
    background-color: var(--color-quinary)
}

.c-bottom-bar {
    border-color: hsla(0, 0%, 95%, .1);
    padding-bottom: 16px
}

.booking-widget-active .c-bottom-bar {
    padding-bottom: 80px
}

@media (min-width:1024px) {
    .booking-widget-active .c-bottom-bar {
        padding-bottom: 16px
    }
}

.c-button:before,
.c-link:before {
    background-color: #323232
}

.c-card-post a {
    font-size: 12px;
    letter-spacing: 2.88px;
    line-height: 1.6
}

.c-card-post a,
.c-category-tag {
    font-family: 'BrownStd-Regular';
}

.c-site-header .c-desktop-header {
    border-color: rgba(26, 26, 26, .2)
}

@media (min-width:1024px) {
    .c-site-header .c-desktop-header {
        border-color: transparent
    }
}

.c-site-header .c-desktop-header .c-navigation {
    gap: 32px
}

.c-site-header .c-desktop-header .c-navigation__link {
    font-family: 'BrownStd-Regular';
    font-size: 14px;
    letter-spacing: .3px
}

.c-site-header .c-desktop-header .c-navigation__link:after {
    top: calc(100% + 23px)
}

.c-site-header .c-desktop-header .c-logo {
    margin: 0 auto
}

@media (min-width:1024px) {
    .c-site-header .c-desktop-header .c-logo {
        margin: 0
    }
}

.c-site-header .c-navigation--mobile .c-navigation__link {
    font-family: 'BrownStd-Regular';
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 3.36px
}

.c-site-header .c-mega-menu,
.c-site-header .c-navigation--mobile {
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255/var(--tw-bg-opacity))
}

@media screen and (max-width:1024px) {
    .c-site-header .c-mega-menu__items button:after {
        display: none !important
    }
}

.scrolled .c-desktop-header {
    background-color: #fff !important
}

.c-dropdown-button {
    background: transparent;
    border-radius: 0;
    border-width: 1px;
    font-size: 16px;
    font-style: normal
}

.c-dropdown-button input[type=text] {
    background: transparent;
    color: rgba(26, 26, 26, .8);
    font-family: var(--font-base);
    font-size: 16px !important;
    font-style: normal;
    font-weight: 400;
    letter-spacing: 1.28px;
    line-height: 1.75
}

.c-dropdown-button input[type=text]::-moz-placeholder {
    color: rgba(26, 26, 26, .8);
    font-size: 16px !important;
    font-style: normal;
    font-weight: 400;
    letter-spacing: 1.28px;
    line-height: 1.75
}

.c-dropdown-button input[type=text]::-moz-placeholder,
.c-dropdown-button input[type=text]::-ms-input-placeholder,
.c-dropdown-button input[type=text]::placeholder {
    color: rgba(26, 26, 26, .8);
    font-size: 16px !important;
    font-style: normal;
    font-weight: 400;
    letter-spacing: 1.28px;
    line-height: 1.75
}

.c-dropdown-content {
    border: 1px solid #e6e6e6;
    border-radius: 0;
    box-shadow: none
}

.c-dropdown-content input[type=checkbox] {
    border-color: hsla(0, 0%, 50%, .3);
    border-radius: 4px;
    border-width: 1px
}

.c-dropdown-content label {
    color: rgba(26, 26, 26, .8);
    font-family: var(--font-base);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: 1.28px;
    line-height: 1.75
}

.c-dropdown-content .peer:checked~.peer-checked\:block {
    background-color: rgba(26, 26, 26, .6);
    border-radius: 4px
}

select.c-dropdown {
    background-color: transparent;
    border-radius: 0;
    border-width: 1px;
    color: rgba(26, 26, 26, .8);
    font-family: var(--font-base);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    letter-spacing: 1.28px;
    line-height: 1.75
}

.c-footer .max-w-\[252px\] {
    margin: 0 auto 80px
}

.c-footer .c-logo svg path {
    fill: #fff
}

.c-footer .c-logo .c-lazy-wrapper svg {
    margin: 0;
    width: 100%
}

.c-footer .divide-text-opacity\/20>:not([hidden])~:not([hidden]) {
    border-color: hsla(0, 0%, 95%, .1)
}

.c-footer .c-button {
    padding: 12px 24px
}

.c-footer .c-button:before {
    display: none
}

.c-footer .c-button--outline {
    border: 2px solid var(--color-text-light)
}

@media screen and (max-width:768px) {
    .c-footer .c-button--outline {
        width: 100%
    }
}

.c-footer .c-button--outline:before {
    display: none
}

.c-footer .c-button--outline:hover {
    background-color: var(--color-text-light);
    border-color: var(--color-text-light);
    color: var(--color-quinary)
}

.c-footer .c-button--outline:hover svg path {
    stroke: var(--color-quinary)
}

.c-footer .c-button--opacity {
    background-color: var(--color-text-light);
    border: 2px solid var(--color-text-light);
    color: var(--color-quinary)
}

@media screen and (max-width:768px) {
    .c-footer .c-button--opacity {
        width: 100%
    }
}

.c-footer .c-button--opacity:hover {
    background-color: transparent;
    border: 2px solid var(--color-text-light);
    color: currentColor
}

.c-footer .c-button--opacity:hover svg path {
    stroke: currentColor !important
}

.c-contact__form .gform_confirmation_wrapper {
    background-color: var(--color-tertiary)
}

.c-heading {
    font-family:'BrownStd-Regular';
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 3.36px;
    text-transform: uppercase
}

@media screen and (min-width:768px) {
    .c-heading {
        font-size: 18px;
        letter-spacing: 4.32px
    }
}

.c-heading--small {
    font-family: 'BrownStd-Regular';
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 3.36px;
    text-transform: uppercase
}

@media screen and (min-width:768px) {
    .c-heading--small {
        font-size: 18px;
        letter-spacing: 4.32px
    }
}

.swiper-pagination .swiper-pagination-bullet-active {
    background-color: rgba(26, 26, 26, .6) !important
}