:root {
  --replace-offset: 50%;
  --replace-offset-2: calc((100% - var(--replace-offset) ) * -1)
}

.juttalogo {
  display: inline-block;
  font-weight: 700;
  font-size: 25px;
  letter-spacing: 0.7px;
  color: #000;
  text-transform: uppercase;
}

.juttalogo--invert {
  color: #fff;
}

.js-replace {
  display: grid;
}

.js-replace__item {
  grid-row: -1 / 1;
  grid-column: -1 / 1;
  overflow: hidden;
  will-change: transform;
}

/* item to replace with */
.js-replace__item {
  transform: translateY(calc(var(--replace-offset) * 1));
}
.js-replace__content {
  /* fixes problem with calculating correct height in js */
  border: 1px solid transparent;
  will-change: transform;

  transform: translateY(calc(var(--replace-offset) * -1));
}

/* previous replace item*/
.js-replace__item--active {
  transform: translateY(calc(var(--replace-offset-2) * 1));
}
.js-replace__item--active .js-replace__content {
  transform: translateY(calc(var(--replace-offset-2) * -1));
}


/* REVERSE ANIMATION */
.js-replace--reverse
.js-replace__item {
  transform: translateY(calc(var(--replace-offset-2) * 1));
}
.js-replace--reverse
.js-replace__content {
  transform: translateY(calc(var(--replace-offset-2) * -1));
}

/* previous replace item*/
.js-replace--reverse
.js-replace__item--active {
  transform: translateY(calc(var(--replace-offset) * 1));
}
.js-replace--reverse
.js-replace__item--active .js-replace__content {
  transform: translateY(calc(var(--replace-offset) * -1));
}

.fragenslide {
  height: 100vh;
  display: flex;
  scroll-snap-align: start;
}

.fragencontainer {
  scroll-snap-type: y mandatory;
  overflow-y: scroll;
  height: 100vh;
  -ms-overflow-style: none;  /* Internet Explorer 10+ */
  scrollbar-width: none;  /* Firefox */
}

.fragencontainer::-webkit-scrollbar {
    display: none;  /* Safari and Chrome */
}

.fragencontainer2 {
  scroll-snap-type: y proximity;
  overflow-y: scroll;
  height: 100vh;
  -ms-overflow-style: none;  /* Internet Explorer 10+ */
  scrollbar-width: none;  /* Firefox */
}

.bg-beige {
  background-color: #f2eee2;
}

.bg-beigehell {
  background-color: #FCF9F4;
}

.bg-dark-5 {
  background-color: #111111;
}

.header__wrapper-overlay-menu {
  background-color: #fefbf4 !important;
  background: #fefbf4 !important;
}

.header__burger {
  height: 45px;
  width: auto;
}

#startvideo {
  position: absolute;
  top: -290px;
  left: -150px;
  object-fit: cover;
}

.startP {
  font-size: calc(var(--paragraph-max-font-size) * 1.5px);
  line-height: calc(var(--paragraph-line-height) * 0.85);
  font-weight: 400;
  letter-spacing: -0.75px;
  color: #000000;
}

#startimg {
}

.umarquee {
  width: 100%;
  height: 100px;
}

.umarquee .uinner {
  position: relative;
  width: 100%;
  display: flex;
}

.umarquee .uinner > * {
  white-space: nowrap;
  padding: 0 4rem;
}


#ueber-marquee-cut {
  overflow: hidden;
}


.sm-popup {
  background: #fcf9f4 none repeat scroll 0% 0% !important;
}

.ueber-stern {
  padding: 0px 30px 10px 30px;
  background-image: url(../img/stern.svg);
  background-repeat: no-repeat;
  background-position: center;
}

.ueber-stern-big {
  padding: 0px 30px 5px 30px;
  background-image: url(../img/stern-big.svg);
  background-repeat: no-repeat;
  background-position: center;
}

.ueber-cont {
  max-width: 1100px;
  overflow: hidden;
}

.ueber-list {
  position: absolute;
  left: -345px;
  font-size: 42px;
  letter-spacing: -1.5px;
  color: #E7DED0;
  overflow: hidden;
  display: inline-block;
  font-weight: 700;
  text-transform: uppercase;
  font-size: calc(var(--h2-max-font-size) * 0.8px);
}

.header_sticky {
  box-shadow: none;
  padding-top: 30px;
}

.header_sticky_shadow {
  box-shadow: 0px 0px 30px 0px rgba(24, 24, 24, 0.1) !important;
}

.ueberH {
  font-weight: 600;
  letter-spacing: -1.6px;
  font-size: calc(var(--h3-min-font-size) * 1px + (var(--h3-max-font-size) - var(--h3-min-font-size)) * ((100vw - 320px) / 2240) + 12px);
}

.ueberH2 {
  font-weight: 700;
  letter-spacing: -0.75px;
  color: #981C26;
  text-transform: uppercase;
  font-size: 25px;
  margin-bottom: 0px;
}

.ueberP {
  font-weight: 600;
  letter-spacing: -0.6px;
  color: #000;
  font-size: calc(var(--paragraph-max-font-size) * 1.1px);
  line-height: 32px;
}

.popupHeading {
  text-align: center;
  font-weight: 700;
  font-size: calc(var(--h3-max-font-size) * 1.2px);
  letter-spacing: -2px;
  color: #981C26;
  margin-bottom: 0.25em;
}

.popupSubheading {
  text-align: center;
  font-weight: bold;
  font-size: 25px;
  letter-spacing: 0.25px;
  margin-bottom: 1em;
  font-weight: 800;
}

.popupText {
  font-size: 28px;
  font-weight: 400;
  letter-spacing: -1.2px;
  color: #000;
  line-height: calc(var(--paragraph-line-height) * 0.8);
}

.popupClose {
  margin: 20px 0px 20px 0px;
  text-align: right;
  font-size: calc(var(--h3-max-font-size) * 1.6px);
  font-weight: 300;
}

.popupOpen {
  font-weight: bold;
  font-size: 20px;
  letter-spacing: -0.8px;
  color: #981C26;
}

.popupOpen a {
  color: #981C26;
}

.popupOpen a:hover {
  color: #70131b;
}


.popupPrice {
  text-transform: uppercase;
  font-weight: bold;
  font-size: 20px;
  letter-spacing: -0.8px;
  color: #981C26;
  margin-top: 1em;
  margin-bottom: 4em;
}

.popupPrice a {
  color: #981C26;
}

.popupPrice a:hover {
  color: #70131b;
}

.popup-outside {
  max-height: 100vh;
  overflow-y: scroll;
}

.popup-inside {
  min-height: 100vh;
}

.first-popupText {
  margin-right: 60px;
}

.footer-herz {
  padding: 0px 6px 3px 14px;
  background-image: url(../img/herz.svg);
  background-repeat: no-repeat;
  background-position: center;
}

.h4041 {
  font-weight: 700;
  margin-bottom: 0px;
  text-transform: uppercase;
}

.h4043 {
  font-weight: 600;
  margin-top: 0px;
  text-transform: uppercase;
  letter-spacing: -1px;
}

/* (A) FIXED WRAPPER */ /*
.ueber-wrap {
  overflow: hidden; /* HIDE SCROLL BAR */ /*
  height: 120px;
}

/* (B) MOVING TICKER WRAPPER */ /*
.ueber-move { display: flex; }

/* (C) ITEMS - INTO A LONG HORIZONTAL ROW */ /*
.ueber-item {
  flex-shrink: 0;
  box-sizing: border-box;
  padding: 10px;
}

/* (D) ANIMATION - MOVE ITEMS FROM RIGHT TO LEFT */
/* 4 ITEMS -400%, CHANGE THIS IF YOU ADD/REMOVE ITEMS */ /*
@keyframes tickerh {
  0% { transform: translate3d(100%, 0, 0); }
  100% { transform: translate3d(-100%, 0, 0); }
}
.ueber-move { animation: tickerh linear 45s infinite; }
.ueber-move:hover { animation-play-state: paused; }
*/

.headerResp {
  padding-right: 0px;
  padding-left: 0px;
}

#footer-links {
  font-weight: 300;
  padding-top: 2.8rem;
}

.footer-inner-links {
  line-height: 35px;
  font-size: 20px;
}

.h-red {
  position: absolute;
  top: calc(100vh * -0.25);
  left: calc(100vw * 0.08);
  letter-spacing: -5.5px; /* später -5.5 */
  line-height: calc(100vh / 20 + 100vw / 60 + 10px);
  color: #981C26;
  font-size: calc(100vh / 20 + 100vw / 60);
  font-weight: 400;
  overflow-x: visible;
  white-space: nowrap;
  z-index: 99;
}

.fragentext {
  min-height: 300px;
}


.footer-link {
  color: #d1d1d1;
}


.footer-email {
  text-decoration: underline;
}

.footerH {
  font-weight: 400;
  font-size: 50px;
  letter-spacing: -2.2px;
}
.footerH-small {
  font-weight: 400;
  font-size: 36px;
  letter-spacing: -1.8px;
  color: #981C26;
}

.footerH-small-link {
  text-decoration: underline;
  color: #981C26;
}

.footerH-small-link:hover {
  color: #70131b;
    text-decoration: underline;
}

.mobileS {
  display: none;
}

.sliderP {
  max-width: 1320px;
  text-align: center;
  font-weight: 600;
  font-size: 40px;
  line-height: 55px;
  letter-spacing: -1.2px;
  color: #000;
  white-space: normal;
}

.sliderPend {
  max-width: 960px;
  text-align: center;
  font-weight: 600;
  font-size: 40px;
  line-height: 55px;
  letter-spacing: -1.2px;
  color: #fff;
  white-space: normal;
}

#schwerpunkteHeading {
  font-weight: 600;
  letter-spacing: -2px;
  color: #981C26;
  text-transform: uppercase;
  font-size: calc(var(--h2-max-font-size) * 0.7px);
}

.schwerpunkteSubheading {
  text-transform: uppercase;
  letter-spacing: 0.25px;
  font-weight: 800;
  color: #000;
}

.schwerpunteP {
  font-size: calc(var(--paragraph-max-font-size) * 1.5px);
  line-height: calc(var(--paragraph-line-height) * 0.85);
  font-weight: 400;
  letter-spacing: -1.2px;
  color: #000;
  margin-top: 0.8em;
}

.schwerpunteL {
  text-transform: uppercase;
  font-weight: bold;
  font-size: calc(var(--paragraph-max-font-size) * 1.1px);
  letter-spacing: -0.8px;
  color: #981C26;
}

.underline {
  text-decoration: underline;
}

.schwerpunteLsm {
  display: none;
  text-transform: uppercase;
  text-decoration: underline;
  font-weight: bold;
  font-size: calc(var(--paragraph-max-font-size) * 1.1px);
  letter-spacing: -0.8px;
  color: #981C26;
  margin-bottom: 2em;
}

.header__widget-title {
  color: #981C26;
}

.header__wrapper-menu {
  margin-top: calc(var(--gutter-horizontal) * 3);
}

.header__wrapper-overlay-widgets {
  margin-bottom: var(--gutter-horizontal);
}

.ms-bullets {
  margin-bottom: -52px;
}

#impressumHeading {
  font-weight: 600;
  letter-spacing: -2px;
  color: #981C26;
  text-transform: uppercase;
  font-size: calc(var(--h2-max-font-size) * 0.8px);
}

.impressumSubheading {
  text-transform: uppercase;
  letter-spacing: 0.25px;
  font-weight: 800;
  color: #000;
}

.impressumP {
  font-size: calc(var(--paragraph-max-font-size) * 1.3px);
  line-height: calc(var(--paragraph-line-height) * 0.85);
  font-weight: 400;
  letter-spacing: -0.8px;
  color: #000;
  margin-top: 1em;
}

.footer-text {
  color: #d1d1d1
  line-height: 30px;
  letter-spacing: -0.75px;
  font-style: normal;
  font-weight: 400;
  font-size: 20px;
}

.mantra-heading {
  font-size: 25px;
  text-transform: capitalize;
  font-weight: bold;
  letter-spacing: 0.25px;
  color: #000000;
}

.vortraege-h {
  font-weight: 600;
  font-size: 50px;
  letter-spacing: -2px;
  color: #981C26;
  /*text-transform: uppercase;*/
}

.slider__heading {
  max-width: 1200px;
}

@media screen and (min-width: 2560px) {
  p {
  font-size: calc(var(--paragraph-max-font-size) * 1.15px);
  }
}


@media screen and (max-width: 2400px) {
  #startvideo {
    left: -250px;
  }
}


@media screen and (max-width: 2000px) {
  #startvideo {
    left: -150px;
  }
  #ueber-marquee-cut {
    overflow: visible;
  }
}

@media screen and (max-width: 1800px) {
  #startvideo {
    top: -200px;
  .popup-outside {
    overflow: scroll !important;
  }
  .startP {
    font-size: calc(var(--paragraph-max-font-size) * 1.4px);
  }
  .ueberP {
    font-size: calc(var(--paragraph-max-font-size) * 1.1px);
  }

  .sliderP {
    font-size: 34px;
    line-height: 48px;
  }
  .sliderPend {
    font-size: 34px;
    line-height: 48px;
  }
}

@media screen and (max-width: 1580px) {
  .section-services__wrapper-letter {
    display: none !important;
  }
  #startvideo {
    top: -190px;
  }
  #schwerpunkteHeading {
    font-size: calc(var(--h2-max-font-size) * 0.6px);
  }
}

@media screen and (max-width: 1460px) {
  .popupHeading {
    font-size: 44px;
    margin-bottom: 0.25em;
  }
  .popupSubheading {
    font-size: 22px;
    margin-bottom: 1em;
  }
  .popupText {
    font-size: 24px;
  }
  .schwerpunteP {
    font-size: calc(var(--paragraph-max-font-size) * 1.2px);
  }
  #startvideo {
    top: -180px;
  }
  .startP {
    font-size: calc(var(--paragraph-max-font-size) * 1.2px);
    line-height: calc(var(--paragraph-line-height) * 0.85);
  }
  .footerH {
    font-size: 45px;
    letter-spacing: -2.0px;
  }
  .footerH-small {
    font-size: 32px;
    letter-spacing: -1.6px;
  }
  #schwerpunkteHeading {
    font-size: calc(var(--h2-max-font-size) * 0.5px);
  }
  .sliderP {
    font-size: 30px;
    line-height: 44px;
  }
  .sliderPend {
    font-size: 30px;
    line-height: 44px;
  }
}

@media screen and (max-height: 1150px) {

  .h-red {
    position: absolute;
    top: calc(100vh * -0.35);
  }

  .header__wrapper-menu {
    margin-top: calc(var(--gutter-horizontal) * 2.5);
  }

}
@media screen and (max-height: 950px) {
  #startvideo {
    top: -130px;
  }
  .h-red {
    top: -100px;
    line-height: 75px;
    font-size: 65px;
  }/*
  #startvideo {
    top: -380px;
  }*/
  .container-fluid_paddings {
    padding-top: 0px;
    padding-bottom: calc(var(--gutter-horizontal) / 2);
  }
  .section-masthead__wrapper-scroll-down {
    display: none !important;
  }
  .header__wrapper-menu {
    margin-top: calc(var(--gutter-horizontal) * 2);
  }
  .header__wrapper-overlay-widgets {
    margin-bottom: calc(var(--gutter-horizontal) * 0.5);
  }
}


@media screen and (max-width: 990px) {
  .headerResp {
    padding-right: 20px;
    padding-left: 20px;
  }
  .h-red {
    font-size: 60px;
    line-height: 66px;
    top: calc(100vh * 0.4);
    left: 0px;
  }
  .popupHeading {
    font-size: 32px;
    margin-bottom: 0.25em;
  }
  .popupSubheading {
    font-size: 16px;
    margin-bottom: 0.25em;
  }
  .popupText {
    font-size: 14px;
    margin-bottom: 0px;
    margin-top: 0px;
    letter-spacing: 0px;
  }
  .popupPrice {
    font-weight: normal;
    font-size: 16px;
  }
  .sm-popup {
    margin: 0px 0px 0px 0px;
  }
  .makeResponsivePad {
    padding: 0px 20px 0px 20px;
  }
  #schwerpunkteMehrDesktop {
    display: none;
  }
  .schwerpunteLsm {
    display: inherit;
  }
  #section-marquee {
    display: none;
  }
  .section-image {
    margin-top: 4em;
    margin-bottom: 2em;
  }
  #last-section-image{
    display: none;
  }
  #startimg {
    height: 90vh;
    max-width: none;
  }
  #schwerpunkteHeading {
    font-size: calc(var(--h2-max-font-size) * 0.6px);
  }
  .schwerpunteP {
    font-size: calc(var(--paragraph-max-font-size) * 1.2px);
  }
  .popupClose {
    font-size: calc(var(--h3-max-font-size) * 1.4px);
  }
  .popupHeading {
    text-align: left;
    font-weight: 700;
    font-size: calc(var(--h3-max-font-size) * 1px);
    margin-bottom: 0.25em;
  }
  .popupSubheading {
    text-align: left;
    font-size: 22px;
    letter-spacing: 0.25px;
    margin-bottom: 1em;
  }
  .popupText {
    font-size: 22px;
    font-weight: 400;
  }
  .ueber-stern-big {
    display: none;
  }
  .first-popupText {
    margin-right: 0px !important;
  }
  .footerH {
    font-size: 32px;
    letter-spacing: -1.2px;
  }
  .footerH-small {
    font-size: 22px;
    letter-spacing: -0.8px;
  }
  .sliderP {
    font-size: 26px;
    line-height: 34px;
    letter-spacing: normal;
    padding: 20px;
  }
  .sliderPend {
    font-size: 26px;
    line-height: 34px;
    letter-spacing: normal;
    padding: 20px;
  }
  .header__wrapper-menu {
    margin-top: calc(var(--gutter-horizontal) * 4);
  }
  .desktopS {
    display: none;
  }
  .mobileS {
    display: block !important;
  }
}


@media screen and (max-height: 760px) {
  #startvideo {
    top: -165px;
  }
  .h-red {
    top: -120px;
  }
  .schwerpunteP {
    font-size: calc(var(--paragraph-max-font-size) * 1.2px);
  }
}

@media screen and (max-width: 600px) {
  .h-red {
    top: -460px;
    font-size: 50px;
    line-height: 50px;
  }
  #first-image {
    display: none;
  }
  .sliderP {
    font-size: 22px;
    line-height: 30px;
    letter-spacing: normal;
    padding: 20px;
  }
  .sliderPend {
    font-weight: 600;
    font-size: 22px;
    line-height: 30px;
    letter-spacing: normal;
    padding: 20px;
  }
  .ms-btn-container {
    margin-top: 65px;
  }
  #schwerpunkteHeading {
    padding-top: 1.5em;
  }
  .ueberP {
    font-size: calc(var(--paragraph-max-font-size) * 1.1px);
  }
  .clearfix::after {
    padding-top: 2em;
  }
  #impressumHeading {
    font-size: calc(var(--h2-max-font-size) * 0.65px);
    margin-top: 3em;
    word-break: break-all;
  }
  #mobile-nomargintop {
    margin-top: 0px;
  }
  #mobile-nopdtop {
    padding-top: 0px;
  }
}
