@charset "UTF-8";
@import "../bower_components/magnific-popup/dist/magnific-popup.css";
:root {
  --orange: #f0411d;
  --bgOrange: #f95645;
  --mw: 1312;
  --gap: 20;
  --gapP: calc((var(--gap) / var(--mw)) * 100%);
  --col: 77;
  --colP: calc((var(--col) / var(--mw)) * 100%);
  --logo: 192;
  --logoP: calc((var(--logo) / var(--mw)) * 100%);
  --logoImageP: calc((var(--logo) / var(--mw)) * 100%);
  --naviwidth: 240;
  --naviwidthP: calc((var(--naviwidth) / var(--mw)) * 100%);
  --regelwidth: 514;
  --regelwidthP: calc(var(--regelwidth) / var(--mw) * 100%);
  --fliestextWidth: 560;
  --fliestextWidthP: calc(var(--fliestextWidth) / var(--mw) * 100%);
  --fliestextWidthHome: 504;
  --fliestextWidthHomeP: calc(var(--fliestextWidthHome) / var(--mw) * 100%);
  --headerimage: 104x;
  --headerimageP: calc(var(--headerimage) / var(--mw) * 100%);
  --textblockaufrotheadline: 368;
  --textblockaufrotheadlineP: calc(
    var(--textblockaufrotheadline) / var(--mw) * 100%
  );
  --textblockaufrot: 756;
  --textblockaufrotP: calc(var(--textblockaufrot) / var(--mw) * 100%);
  --linksBildRechtsTextleftbox: 688;
  --linksBildRechtsTextleftboxP: calc(
    var(--linksBildRechtsTextleftbox) / var(--mw) * 100%
  );
  --mwipad: 768;
  --gapPipad: calc(var(--gap) / var(--mwipad) * 100%);
  --colPipad: calc(var(--col) / var(--mwipad) * 100%);
  --leftNrightIpad: calc(var(--colPipad) * 0.5 + var(--gapPipad) * 1);
  --rightboxIpad: calc(var(--colPipad * 4 + var(--gapPipad) * 3));
  --mwiphone: 320;
  --leftNrightiphone: calc(10px / var(--mwiphone) * 100%);
  --leftNrightiphoneAbsolute: 10px;
  --rightboxiphone: calc(222px / var(--mwiphone) * 100%);
  --footera: 271;
  --footeraP: calc(var(--footera) / var(--mw) * 100%);
  --minmainwidth: 1343;
  --minmainwidthPX: 1343px;
}

/* GRID  */
:root {
  --gridWrapperWidth: 95.55%;
}

@media screen and (min-width: 1200px) {
  :root {
    --gridWrapperWidth: 67.7%;
  }
}
/*   */
#gridoverlay {
  position: fixed;
  z-index: 10;
  pointer-events: none;
}

#gridwrapper {
  height: 100vw;
  z-index: 1;
}
#gridwrapper #gridoverlay {
  height: 100vw;
}
#gridwrapper #gridoverlay > div {
  background: rgba(0, 0, 0, 0.1);
}

.gridwrapper {
  display: flex;
  justify-content: center;
  width: var(--gridWrapperWidth);
  max-width: 1680px;
  margin-inline: auto;
}

.gridbox {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  flex: 0 1 100%;
  gap: var(--gapPercent, 1.1vw);
}

:root {
  --desktopTopPosition: translateY(8vw);
}

@media screen and (min-width: 1200px) {
  :root {
    --desktopTopPosition: translateY(250px);
  }
}
body.home {
  background-color: #f7eded;
}
body.home:before {
  height: 10vw;
  margin-top: 8vw;
  margin-bottom: 4vw;
}

body:not(.home):before {
  margin-top: 9vw;
  height: 10vw;
}

body .homelink {
  top: 0;
}

@media screen and (min-width: 1200px) {
  body .homelink {
    display: none;
  }
}
header .top {
  margin-top: initial;
}

body.home #logo-body-home {
  display: none;
}

.hideAnimationOnStart {
  z-index: 3;
}
.hideAnimationOnStart + main.fw {
  z-index: 2;
}
.hideAnimationOnStart a#logo {
  transform: var(--desktopTopPosition);
}

@media screen and (min-width: 1200px) {
  body.home #logo {
    display: none;
  }
  body.home #logo-body-home {
    position: relative;
    grid-column: 4/8;
    display: flex;
    justify-content: center;
  }
  body.home #logo-body-home img {
    height: auto;
    width: 70%;
    padding-block: clamp(2vw, 2vw, 40px);
  }
  body:not(.home) #logo {
    margin-top: initial;
  }
}
:root {
  --menuBackground: #f0411de6;
}

@media screen and (max-width: 1199px) {
  body {
    padding-top: 0;
  }
  body > header.hideAnimationOnStart {
    background: var(--menuBackground);
  }
  body > header.hideAnimationOnStart:before {
    background: none;
  }
  body > header.hideAnimationOnStart #mobilemenuetrigger {
    background: none;
    border-color: transparent;
  }
  body > header.hideAnimationOnStart #mobilemenuetrigger.active span {
    background-color: #fff;
  }
  body > header.hideAnimationOnStart #mobilemenuetrigger span {
    background-color: var(--menuBackground);
  }
  header .iw #mainMenue > div > ul li a {
    background-image: url(../_grfx/pfeile/pfeilnavi-white.svg);
    background-color: none;
    color: #fff;
  }
  header .iw #mainMenue > div > ul li a:hover {
    background-color: #fff;
    color: var(--menuBackground);
  }
  header .iw #mainMenue > div > ul > li.current-open-submenue > ul.sub-menu > li a {
    color: #fff;
  }
  header .iw #mainMenue > div > ul li.current-open-submenue :is(a, a:hover),
header .iw #mainMenue > div > ul li a:hover {
    background-image: url(../_grfx/pfeile/pfeilnavi.svg);
    background-color: #fff;
    color: var(--menuBackground);
  }
  header .iw .top.tinyMenuTopRightWrapper {
    background: none;
    border-top-color: #fff;
    color: #fff;
  }
  header .iw .top.tinyMenuTopRightWrapper a {
    color: #fff;
  }
}
@media screen and (min-width: 1200px) {
  body.menueopen {
    overflow-y: hidden;
    max-height: 100vh;
  }
  #mobilemenuetrigger {
    display: grid;
    grid-template-columns: 30px -webkit-min-content;
    grid-template-columns: 30px min-content;
    grid-gap: 0.5em;
    left: initial;
    top: initial;
    width: initial;
    position: absolute;
    height: 30px;
    z-index: 4;
    transition: all 0.3s ease-out;
    transform: translate(calc(2.5vw + 100px), 50px) scale(1.2);
  }
  #mobilemenuetrigger + .iw {
    z-index: 3;
  }
  #mobilemenuetrigger span {
    background-color: var(--bgOrange);
    display: block;
    align-self: center;
    grid-column: 1/2;
    grid-row: 1/2;
    height: 2px;
    transition: all 0.5s ease-out;
  }
  #mobilemenuetrigger span:first-child {
    transform: translateY(-5px);
  }
  #mobilemenuetrigger span:nth-child(2) {
    transform-origin: 0% 50%;
    transition: all 0.3s ease-out;
  }
  #mobilemenuetrigger span:last-child {
    transform: translateY(5px);
  }
  #mobilemenuetrigger:after {
    color: var(--bgOrange);
    content: "MENÜ";
    grid-column: 2/3;
    justify-self: right;
    align-self: center;
  }
  body.menueopen #mobilemenuetrigger span {
    background-color: #fff;
  }
  body.menueopen #mobilemenuetrigger span:first-child {
    transform: translateY(0) rotate(45deg) scaleX(0.6);
  }
  body.menueopen #mobilemenuetrigger span:nth-child(2) {
    transform: scaleX(0);
  }
  body.menueopen #mobilemenuetrigger span:last-child {
    transform: translateY(0) rotate(-45deg) scaleX(0.6);
  }
  body.menueopen #mobilemenuetrigger:after {
    color: #fff;
  }
  body header .top {
    height: initial;
  }
  body header .top.tinyMenuTopRightWrapper {
    overflow: visible;
  }
  body header .top #tinyMenuTopRight .menu-tinymenu-container #menu-tinymenu {
    display: flex;
    justify-content: flex-end;
    -moz-column-gap: 1em;
         column-gap: 1em;
    transform: translateY(7px);
  }
  body header .top #tinyMenuTopRight .menu-tinymenu-container #menu-tinymenu li a {
    color: #000;
    background: none;
    padding: 0.7em 0;
  }
  body > header.hideAnimationOnStart #mainMenue {
    display: none;
  }
  body > header.hideAnimationOnStart #mainMenue #menu-mainmenue {
    transform: translate(260px, 5vw);
  }
  body > header.hideAnimationOnStart #mainMenue #menu-mainmenue:before {
    content: "";
    border-top: 2px solid #fff;
    display: block;
    margin-bottom: 0.5em;
  }
  body > header.hideAnimationOnStart #mainMenue #menu-mainmenue li a {
    color: #fff;
  }
  body > header.hideAnimationOnStart #mainMenue #menu-mainmenue li.current-menu-ancestor > a, body > header.hideAnimationOnStart #mainMenue #menu-mainmenue li.current-menu-item > a, body > header.hideAnimationOnStart #mainMenue #menu-mainmenue li.current_page_item > a, body > header.hideAnimationOnStart #mainMenue #menu-mainmenue li:focus > a, body > header.hideAnimationOnStart #mainMenue #menu-mainmenue li:hover > a {
    background-color: #fff;
    color: var(--bgOrange) !important;
  }
  body > header.hideAnimationOnStart #mainMenue #menu-mainmenue li:hover ul.sub-menu {
    background: none;
  }
  body > header.hideAnimationOnStart.active #mainMenue {
    display: block;
  }
  body > header.hideAnimationOnStart.active #mainMenue:before {
    z-index: -1;
    position: fixed;
    inset: 0;
    background: var(--menuBackground);
    display: block;
    content: "";
  }
  body > header.hideAnimationOnStart.active #mainMenue #menu-mainmenue li.hasAnimation a {
    color: #fff;
  }
  body.home > header.hideAnimationOnStart #mainMenue #menu-mainmenue {
    transform: translate(260px, 200px);
  }
}
.home_header {
  --gridTemplateRows: calc((192 / 360) * 100vw) auto;
  --fontSizeH1: calc((18 / 360) * 100vw);
  --lineHeightH1: calc(1em / (18 / 20));
  --fontSizeH1Pt: calc((38 / 360) * 100vw);
  --fontSizeRegelInfo: calc((12 / 360) * 100vw);
  --regelInfoMt: calc((16 / 360) * 100vw);
  --imgshadow: calc((2 / 360) * 100vw);
}

@media screen and (min-width: 1200px) {
  .home_header {
    --gridTemplateRows: clamp(200px, calc((692 / 1920) * 100vw), 902px) auto;
    --fontSizeH1: clamp(12px, calc((84 / 1920) * 100vw), 100px);
    --fontSizeH1Pt: calc((135 / 1920) * 100vw);
    --fontSizeH1Pt: 1.7em;
    --fontSizeRegelInfo: clamp(12px, calc((30 / 1920) * 100vw), 39px);
    --regelInfoMt: clamp(10px, calc((73 / 1920) * 100vw), 73px);
  }
}
.home_header .gridbox {
  grid-template-rows: var(--gridTemplateRows);
}
.home_header .gridbox .rule_and_source {
  text-align: left;
  grid-area: rule;
}
.home_header .gridbox .rule_and_source h1.regel {
  padding-top: var(--fontSizeH1Pt);
  color: var(--unnamed-color-f0411d);
  text-align: left;
  letter-spacing: 0px;
  font-weight: normal;
  color: var(--orange);
  font-size: var(--fontSizeH1);
  line-height: var(--lineHeightH1);
}
.home_header .gridbox .rule_and_source h1.regel::first-letter {
  margin-left: -0.5em;
}
.home_header .gridbox .rule_and_source div.regelinfo {
  font-size: var(--fontSizeRegelInfo);
  margin-top: calc(var(--fontSizeRegelInfo) * 2.5);
  margin-top: var(--regelInfoMt);
}
.home_header .gridbox .bar {
  grid-area: bar;
}
.home_header .gridbox .bar:before {
  display: block;
  width: 100%;
  border-top: 2px solid var(--orange);
  content: " ";
  overflow: hidden;
}
.home_header .gridbox .image {
  display: contents;
}
.home_header .gridbox .image img {
  grid-area: imag;
  width: 100%;
  height: auto;
  box-shadow: var(--gapPercent) var(--gapPercent) 0 var(--gapPercent) #444;
  box-shadow: var(--gapVW) var(--gapVW) 0 0 #d0d0d0;
  box-shadow: var(--imgshadow) var(--imgshadow) 0 0 #d0d0d0;
}
.home_header .gridbox .head {
  grid-area: head;
  width: 100%;
  height: auto;
}

.home_header div.gridbox {
  grid-template-areas: ".   rule rule rule    rule rule rule rule   head head head head " "bar imag imag imag    imag imag imag .      head head head head";
}

@media screen and (min-width: 1200px) {
  .home_header div.gridbox {
    grid-template-areas: "rule rule rule rule  rule rule rule rule   head head head head " "imag imag imag imag  imag imag imag .      head head head head";
  }
  .home_header .gridbox .rule_and_source {
    grid-column: 1/10;
  }
  .home_header .gridbox .bar {
    grid-column: 1/3;
    grid-row: 2/3;
    position: relative;
  }
  .home_header .gridbox .bar:before {
    width: 75%;
    right: calc(100% + 4vw);
    position: absolute;
  }
}
.home_section_1 {
  --fontSizeH1: calc((37 / 360) * 100vw);
  --lineHeightH1: 1em;
  --fontSizeText1: calc((12 / 360) * 100vw);
  --lineHeightText1: calc(1em / (12 / 15));
  --mbText1: 1em;
  --prText1: 0;
  --fontSizeTeaser: clamp(12px, calc((16 / 360) * 100vw), 40px);
  --pbTeaserText1: 0;
  --pbTeaserText2: 8em;
  --lineHeightTeaser: 6vw;
  --mtImage: calc((55 / 360) * 100vw);
  --mbImage: calc((20 / 360) * 100vw);
  --borderImage: calc((10 / 360) * 100vw);
  --colorH1: #f0411d;
  --teaserTopOffset: 10vw;
  --teaser-text-width: 87%;
  --rauteWidth: 85%;
  --colSpanHrText1: 5 / 7;
  --displayHrRaute: none;
}

@media screen and (min-width: 1200px) {
  .home_section_1 {
    /* HEADLINE AND TEXT1  */
    --fontSizeH1: clamp(12px, calc((83 / 1920) * 100vw), 104px);
    --lineHeightH1: 0.94em;
    --fontSizeText1: clamp(16px, calc((37 / 1920) * 100vw), 48px);
    --lineHeightText1: 1.35em;
    --mbText1: 2.5em;
    --prText1: 2em;
    /*  TEASER  */
    --fontSizeTeaser: clamp(12px, calc((22 / 1920) * 100vw), 28px);
    --lineHeightTeaser: clamp(16px, 3vw, 27px);
    --pbTeaserText1: 1em;
    --pbTeaserText2: 0em;
    --teaser-text-width: initial;
    --rauteWidth: 100%;
    --mtImage: clamp(20px, 7vw, 60px);
    --mbImage: clamp(20px, 7vw, 60px);
    --borderImage: clamp(10px, calc((10 / 1920) * 100vw), 20px);
    --colSpanHrText1: 7 / 8;
    --displayHrRaute: block;
  }
}
.home_section_1 > * {
  text-align: left;
}
.home_section_1 div.gridbox hr.hr_headline {
  all: unset;
  border-top: 2px solid var(--colorH1);
  grid-column: 1/2;
  grid-row: 1/2;
}
.home_section_1 div.gridbox hr.hr_text1 {
  all: unset;
  border-top: 2px solid #323232;
  grid-column: var(--colSpanHrText1);
  grid-row: 2/3;
  align-self: flex-end;
}
.home_section_1 div.gridbox hr.hr_raute {
  all: unset;
  border-top: 2px solid #003807;
  grid-column: 1/5;
  grid-row: 5/6;
  align-self: flex-end;
  display: var(--displayHrRaute);
}
.home_section_1 div.gridbox h1 {
  grid-area: head;
  font-size: var(--fontSizeH1);
  line-height: var(--lineHeightH1);
  color: var(--colorH1);
  font-weight: normal;
  padding-bottom: 0.4em;
  position: relative;
}
.home_section_1 div.gridbox .text1 {
  grid-area: tex1;
  position: relative;
  font-size: var(--fontSizeText1);
  line-height: var(--lineHeightText1);
  padding-right: var(--prText1);
  color: var(--colorH1);
  margin-bottom: var(--mbText1);
}
.home_section_1 div.gridbox .teaser {
  position: relative;
  display: contents;
}
.home_section_1 div.gridbox .teaser div.image {
  margin-top: var(--mtImage);
  margin-bottom: var(--mbImage);
  border: var(--borderImage) solid #fff;
  overflow: hidden;
  border-radius: 50%;
  aspect-ratio: 1/1;
  align-self: center;
}
.home_section_1 div.gridbox .teaser div.image img {
  width: 100%;
  height: 100%;
  min-width: 100%;
  min-height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.home_section_1 div.gridbox .teaser .teaser-text {
  justify-self: center;
  width: var(--teaser-text-width);
  line-height: 1.25em;
  align-self: center;
}
.home_section_1 div.gridbox .teaser .teaser-text h2 {
  font-size: var(--fontSizeTeaser);
  line-height: 1.25em;
  padding-right: var(--pbTeaserText1);
}
.home_section_1 div.gridbox .teaser .teaser-text h2 + div {
  font-size: var(--fontSizeTeaser);
  line-height: 1.25em;
  margin-top: 0.8em;
  padding-right: var(--pbTeaserText1);
}
.home_section_1 div.gridbox .teaser.teaser-1 .image {
  grid-area: teai1;
}
.home_section_1 div.gridbox .teaser.teaser-1 .teaser-text {
  grid-area: teat1;
}
.home_section_1 div.gridbox .teaser.teaser-2 .image {
  grid-area: teai2;
}
.home_section_1 div.gridbox .teaser.teaser-2 .teaser-text {
  grid-area: teat2;
  padding-bottom: var(--pbTeaserText2);
}
.home_section_1 div.gridbox .teaser a {
  display: inline-block;
  margin-top: 0.8em;
  font-size: var(--fontSizeTeaser);
  text-decoration: underline;
}
.home_section_1 div.gridbox .teaser a:hover {
  text-decoration: none;
}
.home_section_1 div.gridbox .home_section_1_raute {
  grid-area: raut;
  width: var(--rauteWidth);
  height: auto;
  margin-bottom: 2vw;
}

.home_section_1 div.gridbox {
  grid-template-areas: ".   head head  head     head  head  head  head     head  .    .    . " ".   raut raut  raut     tex1  tex1  tex1  tex1     tex1  tex1 tex1 . " ".   .    .     teai1    teai1 teai1 teai1 teai1    teai1 .     .    . " ".   .    teat1 teat1    teat1 teat1 teat1 teat1    teat1 teat1 .    . " ".   .    .     teai2    teai2 teai2 teai2 teai2    teai2 .     .    . " ".   .    teat2 teat2    teat2 teat2 teat2 teat2    teat2 teat2 .    . ";
}

@media screen and (min-width: 1200px) {
  .home_section_1 div.gridbox {
    grid-template-areas: ".      head head head    head head   tex1  tex1    tex1  tex1  tex1  tex1    " "raut   raut raut raut    .    .      tex1  tex1    tex1  tex1  tex1  tex1    " "raut   raut raut raut    .    .      teai1 teai1   teai1 teat1 teat1 teat1 " "raut   raut raut raut    .    .      teai2 teai2   teai2 teat2 teat2 teat2 " "raut   raut raut raut    .    .      .     .       .     .     .     . ";
    /* GRID TEMPLATE ROWS all minimal height last one can grow  */
    grid-template-rows: minmax(-webkit-min-content, 0) repeat(3, -webkit-min-content) 1fr;
    grid-template-rows: minmax(min-content, 0) repeat(3, min-content) 1fr;
  }
}
.home_section_2 {
  --fontSizeH1: calc((40 / 360) * 100vw);
  --fontSizeDivText: calc((16 / 360) * 100vw);
  --mtText: 1em;
  --lineHeightText: 1.230769230769231em;
  --imageBorder: #f6dad6;
  --imageBorderWidth: calc((8 / 360) * 100vw);
  --circleKircheOutline: calc((14 / 360) * 100vw);
  --circles: #f95645;
  --circleSize: scale(1);
  --circleLudgerirastPos: 50% 10%;
  --circleLudgerirastScale: 1.73;
  --circleBuchhandlungPos: 0 0;
  --circleBuchhandlungScale: 0;
  --circleBenediktTransform: scale(1) translateY(-29vw);
  --circleGastTransform: scale(10) translateY(-19.4vw);
}

@media screen and (min-width: 1200px) {
  .home_section_2 {
    --fontSizeH1: clamp(12px, calc((60 / 1920) * 100vw), 78px);
    --fontSizeDivText: clamp(12px, calc((26 / 1920) * 100vw), 41px);
    --lineHeightText: 1.25em;
    --imageBorderWidth: clamp(10px, calc((12 / 1920) * 100vw), 30px);
    --circleKircheOutline: clamp(20px, calc((24 / 1920) * 100vw), 60px);
    --circleSize: scale(0.8);
    --circleLudgerirastScale: 0;
    --circleBuchhandlungPos: 50% 0%;
    --circleBuchhandlungScale: 2;
    --textOffsetBuchhandlungScale: translateY(-1em);
    --circleBenediktTransform: scale(1) translateY(-27%);
    --circleGastTransform: scale(4) translateY(-12%);
  }
}
.home_section_2 {
  position: relative;
}
.home_section_2 .gridbox a {
  display: contents;
  text-align: left;
}
.home_section_2 .gridbox a h1 {
  font-size: var(--fontSizeH1);
  font-weight: 400;
  color: #1a1719;
}
.home_section_2 .gridbox a .text {
  font-size: var(--fontSizeDivText);
  margin-top: var(--lineHeightText);
  line-height: var(--lineHeightText);
  color: #1a1719;
}
.home_section_2 .gridbox a div.img {
  display: flex;
  position: relative;
  overflow: hidden;
  grid-area: i;
  justify-self: center;
  border-radius: 50%;
  background: #f6dad6;
  border: var(--imageBorderWidth) solid #f6dad6;
  aspect-ratio: 1/1;
  width: 100%;
  align-items: center;
  justify-items: center;
  grid-area: i1;
  transform: var(--circleSize);
}
.home_section_2 .gridbox a div.img img {
  width: 100%;
  height: auto;
  min-width: 100%;
  min-height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.home_section_2 .gridbox a div.img > div {
  position: absolute;
}
.home_section_2 .gridbox a div.img .image-sepia {
  mix-blend-mode: luminosity;
}
.home_section_2 .gridbox a div.img .image-colored {
  opacity: 0;
  transition: all 0.3s ease-out;
}
.home_section_2 .gridbox a:hover div.img .image-colored {
  opacity: 1;
}
.home_section_2 .gridbox a:nth-child(1) .textwrapper {
  grid-area: t1;
}
.home_section_2 .gridbox a:nth-child(1) div.img {
  grid-area: i1;
  box-shadow: 0 0 0 var(--circleKircheOutline) var(--bgOrange);
}
.home_section_2 .gridbox a:after {
  display: grid;
  align-self: stretch;
  z-index: -2;
  content: "";
  background-size: contain;
  background-repeat: no-repeat;
}
.home_section_2 .gridbox a:nth-child(2):after {
  background-image: url("../tpl_flex/home_section_2/grfx/circle-ludgerirast.svg");
  background-position: var(--circleLudgerirastPos);
  grid-area: i2;
  transform: scale(var(--circleLudgerirastScale));
}
.home_section_2 .gridbox a:nth-child(2) .textwrapper {
  grid-area: t2;
}
.home_section_2 .gridbox a:nth-child(2) div.img {
  grid-area: i2;
}
.home_section_2 .gridbox a:nth-child(3):after {
  background-image: url("../tpl_flex/home_section_2/grfx/circle-ludgerirast.svg");
  background-position: var(--circleBuchhandlungPos);
  grid-area: i3;
  transform: scale(var(--circleBuchhandlungScale));
}
.home_section_2 .gridbox a:nth-child(3) .textwrapper {
  grid-area: t3;
  transform: var(--textOffsetBuchhandlungScale);
}
.home_section_2 .gridbox a:nth-child(3) div.img {
  grid-area: i3;
}
.home_section_2 .gridbox a:nth-child(4):after {
  background-image: url("../tpl_flex/home_section_2/grfx/circle-benedikt.svg");
  background-position: 50% 50%;
  grid-area: i4;
  transform: var(--circleBenediktTransform);
}
.home_section_2 .gridbox a:nth-child(4) .textwrapper {
  grid-area: t4;
}
.home_section_2 .gridbox a:nth-child(4) div.img {
  grid-area: i4;
}
.home_section_2 .gridbox a:nth-child(5):after {
  background-image: url("../tpl_flex/home_section_2/grfx/big-half-circle.svg");
  background-position: 50% 100%;
  grid-area: i5;
  transform: var(--circleGastTransform);
}
.home_section_2 .gridbox a:nth-child(5) .textwrapper {
  grid-area: t5;
}
.home_section_2 .gridbox a:nth-child(5) div.img {
  grid-area: i5;
}

.home_section_2 {
  overflow: hidden;
  padding-top: 5vw;
  padding-bottom: 8vw;
  width: 100%;
}
.home_section_2 .gridbox {
  margin-inline: 2.5%;
  grid-template-areas: ".  .  .  i1 i1 i1 i1 i1 i1  .  .  ." ".  t1 t1 t1 t1 t1 t1 t1 t1  t1 t1 ." ".  .  .  i2 i2 i2 i2 i2 i2  .  .  ." ".  t2 t2 t2 t2 t2 t2 t2 t2  t2 t2 ." ".  .  .  i3 i3 i3 i3 i3 i3  .  .  ." ".  t3 t3 t3 t3 t3 t3 t3 t3  t3 t3 ." ".  .  .  i4 i4 i4 i4 i4 i4  .  .  ." ".  t4 t4 t4 t4 t4 t4 t4 t4  t4 t4 ." ".  .  .  i5 i5 i5 i5 i5 i5  .  .  ." ".  t5 t5 t5 t5 t5 t5 t5 t5  t5 t5 .";
  grid-template-rows: repeat(5, 57vw);
  grid-template-rows: 57vw 60vw 57vw 50vw 57vw 57vw 57vw 61vw 57vw 55vw;
}

@media screen and (min-width: 1200px) {
  .home_section_2 {
    overflow: initial;
    padding-bottom: 0;
    width: var(--gridWrapperWidth);
  }
  .home_section_2 .gridbox {
    align-items: center;
  }
  .home_section_2 .gridbox {
    margin-inline: 0;
    grid-template-areas: "t1 t1 t1 t1 i1 i1 i1 i1 .  .  .  ." ".  .  .  .  i2 i2 i2 i2 t2 t2 t2 t2" "t3 t3 t3 t3 i3 i3 i3 i3 .  .  .  ." ".  .  .  .  i4 i4 i4 i4 t4 t4 t4 t4" "t5 t5 t5 t5 i5 i5 i5 i5 .  .  .  .";
    grid-template-rows: repeat(5, 21vw);
  }
}
@media screen and (min-width: 2480px) {
  .home_section_2 .gridbox {
    grid-template-rows: repeat(5, 500px);
  }
}
/* HOMEPAGE DISABLE  */
body.home .tpl_flex_textblock.textblock.rotnachregel.ruleRowCount-1.elementid-1,
body.home .tpl_flex_textblock_pic.moeglichesbildlinks.linksBildRechtsText.textblock.elementid-2,
body.home .textblock.teaserOnGrey.elementid-3 {
  display: none;
}

body {
  --toTopW: calc((25 / 360) * 100vw);
  --toTopH: calc((16 / 360) * 100vw);
}

#footer2022 {
  --footerHeight: 20vw;
  --pFontSize: calc((9 / 360) * 100vw);
}

@media screen and (min-width: 1200px) {
  #footer2022 {
    --footerHeight: 24vw;
    --pFontSize: clamp(12px, calc((22 / 1920) * 100vw), 28px);
  }
  body {
    --toTopW: calc((25 / 1920) * 100vw);
    --toTopH: calc((16 / 1920) * 100vw);
  }
}
#footer2022 {
  width: 100%;
  position: relative;
  top: initial;
  height: var(--footerHeight);
  bottom: 0;
}
.home-2 #footer2022 {
  padding-top: calc(var(--footerHeight) * 1.4);
}
#footer2022:before {
  background-image: url(../footer/svg/footer-wave-large.svg);
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-position: 50% 100%;
  background-size: contain;
  left: 0;
  bottom: 0;
}
#footer2022 .gridwrapper {
  height: 100%;
}
#footer2022 .gridwrapper .gridbox {
  height: 100%;
}
#footer2022 .gridwrapper .gridbox p {
  color: #fff;
  text-transform: uppercase;
  font-size: var(--pFontSize);
  letter-spacing: 0.06em;
  font-weight: 700;
  text-align: left;
  grid-column: 2/13;
  align-self: flex-end;
  -webkit-padding-after: var(--pFontSize);
          padding-block-end: var(--pFontSize);
}

body .toTop {
  margin: initial;
  background-image: url(../footer/svg/totop-orange.svg);
  width: var(--toTopW);
  margin-right: calc(var(--toTopW) * 1.42);
  background-size: 100% 100%;
  background-repeat: no-repeat;
  height: var(--toTopH);
  padding: 0;
  bottom: calc(var(--toTopW) * -1);
  position: absolute;
}
body .toTop.bottom {
  bottom: 18vw !important;
}

@media screen and (min-width: 1200px) {
  body .toTop {
    background-image: url(../footer/svg/totop-white.svg);
  }
  body .toTop.active {
    bottom: 50px;
  }
  body .toTop.bottom {
    bottom: 50px;
  }
  body .toTop.active.bottom {
    bottom: 4vw !important;
  }
  #footer2022 .gridwrapper .gridbox p {
    grid-column: 2/13;
    -webkit-padding-after: calc(var(--pFontSize) * 3);
            padding-block-end: calc(var(--pFontSize) * 3);
  }
}
.wt-cli-cookie-bar-container {
  --fontsize: clamp(14px, 1vw, 22px);
}
.wt-cli-cookie-bar-container #cookie-law-info-bar .cli-wrapper .wt-cli-template {
  font-size: var(--fontsize);
}
.wt-cli-cookie-bar-container #cookie-law-info-bar .cli-wrapper .wt-cli-template * {
  font-size: var(--fontsize) !important;
}
.wt-cli-cookie-bar-container #cookie-law-info-again {
  box-shadow: none;
  background: var(--bgOrange) !important;
  padding: var(--fontsize) calc(var(--fontsize) * 0.5);
  color: rgb(68, 68, 68);
  position: fixed;
  font-family: inherit;
  width: auto;
}
@media screen and (max-width: 1199px) {
  .wt-cli-cookie-bar-container #cookie-law-info-again {
    transform: rotate(-270deg) !important;
    transform-origin: bottom right !important;
    left: initial !important;
    right: 100% !important;
    display: block;
    white-space: nowrap;
    bottom: 4em !important;
  }
}
.wt-cli-cookie-bar-container #cookie-law-info-again #cookie_hdr_showagain {
  background: none;
  padding: var(--fontsize) calc(var(--fontsize) * 0.5);
  color: #fff;
  font-size: var(--fontsize);
}
.wt-cli-cookie-bar-container .cli-modal .cli-modal-dialog .cli-modal-content {
  padding: calc(var(--fontsize) * 2.5);
}
.wt-cli-cookie-bar-container .cli-modal .cli-modal-dialog .cli-modal-content,
.wt-cli-cookie-bar-container .cli-modal .cli-modal-dialog .cli-modal-content * {
  font-size: var(--fontsize) !important;
}
.wt-cli-cookie-bar-container .cli-modal .cli-modal-dialog .cli-modal-content .cli-row {
  padding-right: 1em;
}

#map-canvas {
  background-image: url("../snippet_googlemaps/www.abtei-gerleve.de_anfahrt-2032x800.png");
  background-position: 100% 100%;
  background-size: cover;
  position: relative;
}