@font-face {
  font-family: 'PP Editorial Old';
  src: url("../fonts/PPEditorialOld-Ultrabold.woff2") format("woff2"), url("../fonts/PPEditorialOld-Ultrabold.woff") format("woff");
  font-weight: bold;
  font-style: normal;
  font-display: swap; }
@font-face {
  font-family: 'PP Editorial Old';
  src: url("../fonts/PPEditorialOld-Regular.woff2") format("woff2"), url("../fonts/PPEditorialOld-Regular.woff") format("woff");
  font-weight: normal;
  font-style: normal;
  font-display: swap; }
@font-face {
  font-family: 'PP Editorial Old';
  src: url("../fonts/PPEditorialOld-UltraboldItalic.woff2") format("woff2"), url("../fonts/PPEditorialOld-UltraboldItalic.woff") format("woff");
  font-weight: bold;
  font-style: italic;
  font-display: swap; }
@font-face {
  font-family: 'PP Editorial Old';
  src: url("../fonts/PPEditorialOld-UltralightItalic.woff2") format("woff2"), url("../fonts/PPEditorialOld-UltralightItalic.woff") format("woff");
  font-weight: 200;
  font-style: italic;
  font-display: swap; }
@font-face {
  font-family: 'PP Editorial Old';
  src: url("../fonts/PPEditorialOld-Italic.woff2") format("woff2"), url("../fonts/PPEditorialOld-Italic.woff") format("woff");
  font-weight: normal;
  font-style: italic;
  font-display: swap; }
@font-face {
  font-family: 'PP Editorial Old';
  src: url("../fonts/PPEditorialOld-Ultralight.woff2") format("woff2"), url("../fonts/PPEditorialOld-Ultralight.woff") format("woff");
  font-weight: 200;
  font-style: normal;
  font-display: swap; }
@font-face {
  font-family: 'Instrument Sans SemiCondensed';
  src: url("../fonts/InstrumentSansSemiCondensed-Regular.woff2") format("woff2"), url("../fonts/InstrumentSansSemiCondensed-Regular.woff") format("woff");
  font-weight: normal;
  font-style: normal;
  font-display: swap; }
@font-face {
  font-family: 'Instrument Sans SemiCondensed';
  src: url("../fonts/InstrumentSansSemiCondensed-Italic.woff2") format("woff2"), url("../fonts/InstrumentSansSemiCondensed-Italic.woff") format("woff");
  font-weight: normal;
  font-style: italic;
  font-display: swap; }
@font-face {
  font-family: 'Instrument Sans SemiCondensed';
  src: url("../fonts/InstrumentSansSemiCondensed-BoldItalic.woff2") format("woff2"), url("../fonts/InstrumentSansSemiCondensed-BoldItalic.woff") format("woff");
  font-weight: bold;
  font-style: italic;
  font-display: swap; }
@font-face {
  font-family: 'Instrument Sans SemiCondensed';
  src: url("../fonts/InstrumentSansSemiCondensed-Medium.woff2") format("woff2"), url("../fonts/InstrumentSansSemiCondensed-Medium.woff") format("woff");
  font-weight: 500;
  font-style: normal;
  font-display: swap; }
@font-face {
  font-family: 'Instrument Sans Condensed';
  src: url("../fonts/InstrumentSansCondensed-Bold.woff2") format("woff2"), url("../fonts/InstrumentSansCondensed-Bold.woff") format("woff");
  font-weight: bold;
  font-style: normal;
  font-display: swap; }
@font-face {
  font-family: 'Instrument Sans Condensed';
  src: url("../fonts/InstrumentSansCondensed-MediumItalic.woff2") format("woff2"), url("../fonts/InstrumentSansCondensed-MediumItalic.woff") format("woff");
  font-weight: 500;
  font-style: italic;
  font-display: swap; }
@font-face {
  font-family: 'Instrument Sans Condensed';
  src: url("../fonts/InstrumentSansCondensed-BoldItalic.woff2") format("woff2"), url("../fonts/InstrumentSansCondensed-BoldItalic.woff") format("woff");
  font-weight: bold;
  font-style: italic;
  font-display: swap; }
@font-face {
  font-family: 'Instrument Sans Condensed';
  src: url("../fonts/InstrumentSansCondensed-Italic.woff2") format("woff2"), url("../fonts/InstrumentSansCondensed-Italic.woff") format("woff");
  font-weight: normal;
  font-style: italic;
  font-display: swap; }
@font-face {
  font-family: 'Instrument Sans SemiCondensed';
  src: url("../fonts/InstrumentSansSemiCondensed-MediumItalic.woff2") format("woff2"), url("../fonts/InstrumentSansSemiCondensed-MediumItalic.woff") format("woff");
  font-weight: 500;
  font-style: italic;
  font-display: swap; }
@font-face {
  font-family: 'Instrument Sans SemiCondensed';
  src: url("../fonts/InstrumentSansSemiCondensed-SemiBold.woff2") format("woff2"), url("../fonts/InstrumentSansSemiCondensed-SemiBold.woff") format("woff");
  font-weight: 600;
  font-style: normal;
  font-display: swap; }
@font-face {
  font-family: 'Instrument Sans Condensed';
  src: url("../fonts/InstrumentSansCondensed-SemiBold.woff2") format("woff2"), url("../fonts/InstrumentSansCondensed-SemiBold.woff") format("woff");
  font-weight: 600;
  font-style: normal;
  font-display: swap; }
@font-face {
  font-family: 'Instrument Sans SemiCondensed';
  src: url("../fonts/InstrumentSansSemiCondensed-Bold.woff2") format("woff2"), url("../fonts/InstrumentSansSemiCondensed-Bold.woff") format("woff");
  font-weight: bold;
  font-style: normal;
  font-display: swap; }
@font-face {
  font-family: 'Instrument Sans Condensed';
  src: url("../fonts/InstrumentSansCondensed-Medium.woff2") format("woff2"), url("../fonts/InstrumentSansCondensed-Medium.woff") format("woff");
  font-weight: 500;
  font-style: normal;
  font-display: swap; }
@font-face {
  font-family: 'Instrument Sans Condensed';
  src: url("../fonts/InstrumentSansCondensed-SemiBoldItalic.woff2") format("woff2"), url("../fonts/InstrumentSansCondensed-SemiBoldItalic.woff") format("woff");
  font-weight: 600;
  font-style: italic;
  font-display: swap; }
@font-face {
  font-family: 'Instrument Sans Condensed';
  src: url("../fonts/InstrumentSansCondensed-Regular.woff2") format("woff2"), url("../fonts/InstrumentSansCondensed-Regular.woff") format("woff");
  font-weight: normal;
  font-style: normal;
  font-display: swap; }
@font-face {
  font-family: 'Instrument Sans';
  src: url("../fonts/InstrumentSans-Regular.woff2") format("woff2"), url("../fonts/InstrumentSans-Regular.woff") format("woff");
  font-weight: normal;
  font-style: normal;
  font-display: swap; }
@font-face {
  font-family: 'Instrument Sans';
  src: url("../fonts/InstrumentSans-Medium.woff2") format("woff2"), url("../fonts/InstrumentSans-Medium.woff") format("woff");
  font-weight: 500;
  font-style: normal;
  font-display: swap; }
@font-face {
  font-family: 'Instrument Sans';
  src: url("../fonts/InstrumentSans-SemiBold.woff2") format("woff2"), url("../fonts/InstrumentSans-SemiBold.woff") format("woff");
  font-weight: 600;
  font-style: normal;
  font-display: swap; }
@font-face {
  font-family: 'Instrument Sans';
  src: url("../fonts/InstrumentSans-Bold.woff2") format("woff2"), url("../fonts/InstrumentSans-Bold.woff") format("woff");
  font-weight: bold;
  font-style: normal;
  font-display: swap; }
@font-face {
  font-family: 'Instrument Sans SemiCondensed';
  src: url("../fonts/InstrumentSansSemiCondensed-SemiBoldItalic.woff2") format("woff2"), url("../fonts/InstrumentSansSemiCondensed-SemiBoldItalic.woff") format("woff");
  font-weight: 600;
  font-style: italic;
  font-display: swap; }
@font-face {
  font-family: 'Instrument Sans';
  src: url("../fonts/InstrumentSans-MediumItalic.woff2") format("woff2"), url("../fonts/InstrumentSans-MediumItalic.woff") format("woff");
  font-weight: 500;
  font-style: italic;
  font-display: swap; }
@font-face {
  font-family: 'Instrument Sans';
  src: url("../fonts/InstrumentSans-BoldItalic.woff2") format("woff2"), url("../fonts/InstrumentSans-BoldItalic.woff") format("woff");
  font-weight: bold;
  font-style: italic;
  font-display: swap; }
@font-face {
  font-family: 'Instrument Sans';
  src: url("../fonts/InstrumentSans-Italic.woff2") format("woff2"), url("../fonts/InstrumentSans-Italic.woff") format("woff");
  font-weight: normal;
  font-style: italic;
  font-display: swap; }
@font-face {
  font-family: 'Instrument Sans';
  src: url("../fonts/InstrumentSans-SemiBoldItalic.woff2") format("woff2"), url("../fonts/InstrumentSans-SemiBoldItalic.woff") format("woff");
  font-weight: 600;
  font-style: italic;
  font-display: swap; }
html, body {
  width: 100%;
  max-width: 100%; }

body {
  background: #efe9e7;
  color: #2b2524;
  font-family: "Instrument Sans";
  overflow-x: hidden;
  font-size: 20px; }
  body .display-0 {
    font-size: calc(1.8rem + 1.5vw);
    font-weight: 300;
    line-height: 1.2; }
  body .display-7 {
    font-size: calc(1.3rem + 1.5vw);
    font-weight: 300;
    line-height: 1.2; }
  @media (min-width: 1200px) {
    body .display-0 {
      font-size: 9rem; }
    body .display-7 {
      font-size: 2rem; } }
  body .color-anthrazit {
    color: #2b2524; }
  body .color-dunkelgruen {
    color: #66755f; }
  body .color-mittelgruen {
    color: #51744d; }
  body .color-hellgruen {
    color: #cbe3c4; }
  body .color-weiss {
    color: #fff; }
  body .color-warmesbeige {
    color: #f0eadc; }
  body .color-kuehlesbeige {
    color: #efe9e7; }
  body .color-baumringe {
    color: #f8f6f5; }
  body .lineheight-05 {
    line-height: .5em; }
  body .lineheight-07 {
    line-height: .7em; }
  body .lineheight-075 {
    line-height: .75em; }
  body .letterspacing-01 {
    letter-spacing: .1em; }
  body .letterspacing-015 {
    letter-spacing: .15em; }
  body .letterspacing-03 {
    letter-spacing: .3em; }
  body .font-serif {
    font-family: "PP Editorial Old"; }
  body .fw-200 {
    font-weight: 200; }
  body .visible-mobile {
    display: none !important; }
  @media screen and (max-width: 992px) {
    body .hide-mobile {
      display: none !important; }
    body .visible-mobile {
      display: block !important; } }

.slider-container {
  position: relative;
  width: 80%;
  margin: auto; }
  .slider-container .slider-default {
    display: flex;
    transition: transform 0.5s ease-in-out; }
    .slider-container .slider-default .slide {
      min-width: 100%;
      box-sizing: border-box;
      text-align: center;
      padding: 0 10px;
      aspect-ratio: 10 / 6;
      max-height: 80vh; }
      @media screen and (max-width: 992px) {
        .slider-container .slider-default .slide {
          aspect-ratio: 3 / 4; } }
      .slider-container .slider-default .slide img {
        width: 100%;
        object-fit: cover;
        max-height: 100%; }
        @media screen and (max-width: 992px) {
          .slider-container .slider-default .slide img {
            max-height: none;
            height: calc(100% - 65px); } }
      .slider-container .slider-default .slide .caption {
        color: #2b2524;
        font-weight: 200;
        text-transform: uppercase;
        width: 100%;
        text-align: left;
        font-size: .8em;
        padding: 20px 0;
        opacity: 0;
        transition: opacity 3s ease; }
      .slider-container .slider-default .slide.active .caption {
        opacity: 1; }
    .slider-container .slider-default.advanced .caption {
      text-transform: none; }
  .slider-container .prev-default, .slider-container .next-default,
  .slider-container .prev-advanced, .slider-container .next-advanced {
    position: absolute;
    bottom: 13px;
    background-color: rgba(0, 0, 0, 0.4);
    color: #fff;
    border: none;
    cursor: pointer;
    border-radius: 50px;
    aspect-ratio: 1 /1;
    height: 38px; }
    .slider-container .prev-default:hover, .slider-container .next-default:hover,
    .slider-container .prev-advanced:hover, .slider-container .next-advanced:hover {
      transform: scale(1.05); }
  .slider-container .prev-advanced, .slider-container .next-advanced {
    bottom: inherit;
    top: 0; }
  .slider-container .prev-default,
  .slider-container .prev-advanced {
    right: 60px; }
  .slider-container .next-default,
  .slider-container .next-advanced {
    right: 10px; }

#main-menu-container #main-menu {
  position: fixed;
  z-index: 999;
  width: 100vw;
  top: 0;
  background: #2b2524;
  color: #efe9e7;
  display: none; }
  #main-menu-container #main-menu.active {
    display: block; }
  #main-menu-container #main-menu .menu-item:hover {
    color: #cbe3c4; }
  #main-menu-container #main-menu #main-menu-close {
    width: 35px;
    height: 35px;
    position: absolute;
    right: 35px;
    top: 15px;
    background: url(../images/close.svg);
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;
    cursor: pointer; }
  #main-menu-container #main-menu img.logo {
    width: 102px; }
  #main-menu-container #main-menu a {
    color: #efe9e7;
    text-decoration: none; }
#main-menu-container #main-menu-show {
  width: 150px;
  height: 50px;
  position: fixed;
  right: 35px;
  top: 25px;
  background: url(../images/btn-menu.svg);
  background-size: contain;
  background-position: center center;
  background-repeat: no-repeat;
  cursor: pointer;
  z-index: 200; }
#main-menu-container #btn-toggle-sound {
  width: 50px;
  height: 50px;
  position: fixed;
  right: 190px;
  top: 25px;
  background: url(../images/btn-sound.svg);
  background-size: contain;
  background-position: center center;
  background-repeat: no-repeat;
  cursor: pointer;
  z-index: 200; }

#sticky-header {
  background: rgba(43, 37, 36, 0.7);
  pointer-events: none;
  position: fixed;
  top: -100px;
  width: 100%;
  color: white;
  text-align: center;
  padding: 25px 0;
  z-index: 100;
  opacity: 0;
  transition: top 0.5s, opacity 0.5s; }
  #sticky-header.visible {
    top: 0;
    opacity: 1; }
  #sticky-header > img {
    height: 50px; }

@media screen and (min-width: 993px) {
  @keyframes slideInRight {
    from {
      transform: translateX(-100%);
      opacity: 0; }
    to {
      transform: translateX(0);
      opacity: 1; } }
  @keyframes slideInLeft {
    from {
      transform: translateX(100%);
      opacity: 0; }
    to {
      transform: translateX(0);
      opacity: 1; } }
  @keyframes fadeIn {
    from {
      opacity: 0; }
    to {
      opacity: 1; } }
  .animated-element {
    opacity: 0; }

  .animated.slide-left {
    animation: slideInLeft 3s forwards; }
  .animated.slide-right {
    animation: slideInRight 3s forwards; }
  .animated.fade-in {
    animation: fadeIn 2s forwards; } }
@keyframes animateHintText {
  0% {
    transform: rotate(0deg) translateY(-2em);
    opacity: 0.1; }
  20% {
    transform: rotate(5deg) translateY(-1.5em);
    opacity: 0.5; }
  40% {
    transform: rotate(2deg) translateY(-1em);
    opacity: 0.1; }
  60% {
    transform: rotate(-3deg) translateY(-0.5em);
    opacity: 0.5; }
  80% {
    transform: rotate(-1deg) translateY(-1.5em);
    opacity: 0.5; }
  100% {
    transform: rotate(0deg) translateY(-2em);
    opacity: 0.1; } }
@keyframes spinBaumringLeft {
  0% {
    transform: rotate(0deg);
    margin-left: 50vw;
    opacity: 0.1; }
  5% {
    opacity: 0.5; }
  10% {
    opacity: 0.1; }
  15% {
    opacity: 0.5; }
  20% {
    opacity: 0.1; }
  25% {
    opacity: 0.5; }
  30% {
    opacity: 0.1; }
  35% {
    opacity: 0.5; }
  40% {
    opacity: 0.1; }
  45% {
    opacity: 0.5; }
  50% {
    transform: rotate(-90deg);
    margin-left: -10vw;
    opacity: 0.5; }
  55% {
    opacity: 0.1; }
  60% {
    opacity: 0.5; }
  65% {
    opacity: 0.1; }
  70% {
    opacity: 0.5; }
  75% {
    opacity: 0.1; }
  80% {
    opacity: 0.5; }
  85% {
    opacity: 0.1; }
  90% {
    opacity: 0.5; }
  95% {
    opacity: 0.1; }
  100% {
    transform: rotate(0deg);
    margin-left: 50vw;
    opacity: 0.5; } }
@keyframes spinBaumringRight {
  0% {
    transform: rotate(0deg);
    margin-left: -10vw;
    opacity: 0.1; }
  5% {
    opacity: 0.5; }
  10% {
    opacity: 0.1; }
  15% {
    opacity: 0.5; }
  20% {
    opacity: 0.1; }
  25% {
    opacity: 0.5; }
  30% {
    opacity: 0.1; }
  35% {
    opacity: 0.5; }
  40% {
    opacity: 0.1; }
  45% {
    opacity: 0.5; }
  50% {
    transform: rotate(90deg);
    margin-left: 50vw;
    opacity: 0.5; }
  55% {
    opacity: 0.1; }
  60% {
    opacity: 0.5; }
  65% {
    opacity: 0.1; }
  70% {
    opacity: 0.5; }
  75% {
    opacity: 0.1; }
  80% {
    opacity: 0.5; }
  85% {
    opacity: 0.1; }
  90% {
    opacity: 0.5; }
  95% {
    opacity: 0.1; }
  100% {
    transform: rotate(0deg);
    margin-left: -10vw;
    opacity: 0.1; } }
@keyframes animateScrollIndicator {
  0% {
    bottom: 0; }
  50% {
    bottom: 10px; }
  100% {
    bottom: 0; } }
@keyframes animateLinkIndicator {
  0% {
    margin-left: -10px; }
  50% {
    margin-left: 10px; }
  100% {
    margin-left: -10px; } }
.baumring {
  pointer-events: none;
  position: absolute;
  z-index: 10;
  display: block;
  mix-blend-mode: color-dodge;
  opacity: 0.5;
  width: 1200px;
  animation: spinBaumringRight 90s ease infinite;
  transform-origin: center; }
  .baumring.right {
    animation: spinBaumringLeft 90s ease infinite; }
  @media screen and (max-width: 992px) {
    .baumring {
      display: none !important; } }

.scroll-indicator {
  font-family: "PP Editorial Old";
  color: #fff;
  position: absolute;
  bottom: 15px;
  left: 50%;
  transform: translateX(-50%);
  height: 100px;
  letter-spacing: .15em;
  font-weight: 200;
  text-decoration: none; }
  .scroll-indicator .arrow {
    height: 50px;
    width: 30px;
    background: url(../images/arrow-down.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center center;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    animation: animateScrollIndicator 2s ease-in-out infinite; }

.link-indicator {
  margin-top: -.2em; }
  .link-indicator .arrow {
    display: inline-block;
    height: 30px;
    width: 50px;
    background: url(../images/arrow-right.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center center;
    transform: translateX(-50%);
    animation: animateLinkIndicator 2s ease-in-out infinite; }
    .link-indicator .arrow.color-dunkelgruen {
      background-image: url(../images/arrow-right-dunkelgruen.svg); }

.scale-up {
  transition: transform .5s ease; }
  .scale-up:hover {
    transform: scale(1.1); }

.fading-hint {
  position: absolute;
  animation: animateHintText 10s linear infinite; }

#load-mask {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 9999999;
  background-color: #66755f;
  background-image: url(../images/loading-baumring.png);
  background-size: cover;
  background-position: center center;
  color: #efe9e7; }
  #load-mask #load-mask-progress {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 20px; }

.full-height-container {
  display: flex;
  flex-direction: column;
  min-height: 100vh; }

.content {
  flex: 1;
  /* Flexbox, um den Inhalt zu strecken */ }

#home-hero {
  background: url(../images/home-hero1.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  z-index: 100; }
  #home-hero img {
    position: absolute;
    top: 45%;
    left: 50%;
    transform: translate(-50%, -50%);
    max-width: 80vw; }
  #home-hero .coordinates {
    position: absolute;
    left: 50px;
    bottom: 50px;
    color: #fff;
    font-size: .7em; }
    @media screen and (max-width: 992px) {
      #home-hero .coordinates {
        left: 15px; } }
  #home-hero .coordinates-label {
    position: absolute;
    left: 300px;
    bottom: 50px;
    color: #fff;
    font-size: .7em; }
    @media screen and (max-width: 992px) {
      #home-hero .coordinates-label {
        left: auto;
        right: 15px; } }

#home-manifest {
  background: url(../images/e1be9ea1a8bc6c8599fa9113a06aa911.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  height: 80vh; }

#home-suites {
  background: url(../images/e4d62a7f0a40ad3c856dd2ceb23ad996.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  height: 80vh; }

#booking-hero {
  background: url(../images/booking-hero1.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  z-index: 100; }
  #booking-hero img {
    width: 102px; }

#booking-map iframe {
  border: none !important;
  width: 100%;
  height: 600px;
  z-index: 10; }

#suites-hero {
  background: url(../images/suites-hero1.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  z-index: 100; }
  #suites-hero img {
    width: 102px; }

#suites-basilika {
  background: url(../images/3dc6274dc7b0eb137a51ae7a5d7b847f.jpg);
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
  background-position: center center;
  height: 80vh; }
  @media screen and (max-width: 992px) {
    #suites-basilika {
      background-attachment: scroll;
      height: 60vh; } }

#manifest-hero {
  background: url(../images/manifest-hero1.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  z-index: 100; }
  #manifest-hero img {
    width: 102px; }

#manifest-mood {
  background: url(../images/7babbbf29ae1fec90d82b3f1b5613dd3.jpg);
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
  background-position: center center;
  height: 80vh; }
  @media screen and (max-width: 992px) {
    #manifest-mood {
      background-attachment: scroll;
      height: 60vh; } }

#manifest-bts {
  margin-top: -100px;
  padding-top: 200px;
  background-color: #51744d;
  color: #fff; }

/*# sourceMappingURL=styles.css.map */
