/*!
Theme Name: Pausnhof
Theme URI: https://www.pausnhof.de
Author: wald.pixel.werk
Author URI: https://waldpixelwerk.de/
Description: Theme für Pausnhof
Version: 1.0.0
Tested up to: 8.4
Requires PHP: 7.2
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: pausnhofgutschein-single
Tags: custom-menu, translation-ready
*/

@charset "UTF-8";


  @font-face {
  font-family: 'EKRoumald';
  src: url('./fonts/EKRoumald-Roman.woff2') format('woff2'),
       url('./fonts/EKRoumald-Roman.woff') format('woff');
  font-weight: 400;
  font-style: normal;
}

  @font-face {
  font-family: 'Studio6';
  src: url('./fonts/Studio6-Italic.woff2') format('woff2'),
       url('./fonts/Studio6-Italic.woff') format('woff');
  font-weight: 400;
  font-style: italic;
}


  @font-face {
  font-family: 'BatonNouveau';
  src: url('./fonts/BatonNouveauWeb-Regular.woff2') format('woff2'),
       url('./fonts/BatonNouveauWeb-Regular.woff') format('woff');
  font-weight: 400;
  font-style: normal;
}


  @font-face {
  font-family: 'BatonNouveau';
  src: url('./fonts/BatonNouveauWeb-Medium.woff2') format('woff2'),
       url('./fonts/BatonNouveauWeb-Medium.woff') format('woff');
  font-weight: 500;
  font-style: normal;
}





 :root{
--black:#000;
--dark:#4F4F4F;
--white:#EEEEEE;
--kaki:#939684;
--red:#481919;
--heather:#F0E8DB;
--beige:#ECE4D3;
--green:#21301F;
--lime:#EFF0DD;
--brown:#343320;
--grey:#F5F5F5;
--lineheight:1.5em;
--fonts:1.3888vw;
--h1:2.5em;
--space:1vw;
--container:80vw;
--spacesmall:3.75em;
--spacebig:7.5em;
--spaceleft:6.8em;
  }


@media(min-width:1920px){
 :root{
--fonts:26.66px;
--container:1536px;
  }
}


@media(orientation:portrait){

:root{
    --container:90vw;
    --fonts:3.5vw;
    --spaceleft:4em;
}   
}


/* Global */

body, html{
font-family: "EKRoumald", sans-serif;
font-weight: 400;
font-style: normal;
width:100vw;
text-rendering: geometricPrecision;
padding:0;margin:0;left:0;top:0;position:relative;font-size:var(--fonts);line-height:var(--line-height);font-weight:400;background-color:var(--white);color: var(--black);white-space-collapsing:discard;line-height:var(--lineheight)}

body.no-scroll {
  overflow: hidden;
  height: 100vh;      /* Safari Fix */
}

.lenis.lenis-stopped {
    height: 100%;
    overflow: hidden;
}
.lenis-stop-scroll {
    overflow: hidden !important;
    height: 100% !important;
}

.body-fixed {
    position: fixed;
    width: 100%;
    overflow: hidden;
    touch-action: none;
}


/*cookiebanner*/

.cookie-banner{width:100vw;height:100vh; -webkit-backdrop-filter: blur(0.2em);backdrop-filter:blur(0.2em);z-index:10;transition:all .3s ease-in-out;position:fixed;top:0;left:0;}
.cookie-banner-hidden{opacity:0;pointer-events:none;}
.cookie-banner a{text-decoration:underline;}
.cookie-banner a:hover{color:var(--red)}
.cookie-banner-inner{position:absolute;width:50%;top:calc(50% - 11em);left:25%;border-radius:1em;background-color:var(--heather);filter:drop-shadow(0.2em 0.2em 0.2em rgba(0,0,0,0.2));padding:3em 3em 2em 3em;text-align:center;font-size:var(--fonts);box-sizing: border-box;}
.cookie-banner-inner p{font-size:var(--fonts)}
.show-cookie{cursor:pointer;font-style:italic;}

.cookie-banner .link:before{display:none;}
.cookie-banner .link{display:inline;}
.button{text-decoration:underline;margin:0 1em;font-family:"BatonNouveau";cursor:pointer;}




.gb-news-text .container-inner{width:100%}



#supercontainer{max-width:100vw;overflow:hidden}
a, a:link, a:hover, a:active, a:visited{color:inherit;transition:color .2s ease-in-out;text-decoration-thickness: 0.05em;   /* Dünnere Linie */
  text-underline-offset: 0.1em; }

h1, h2, h3, h4, h5, h6, blockquote{
 
margin-inline-start: 0px;
margin-block-end: 0em;
margin-block-start: 0rem;
font-weight:400;

}

h3, h4, h5, h6{font-size:1.25rem;line-height:1.2em;font-family: "EKRoumald", sans-serif;}

p{
margin-inline-start: 0px;
margin-block-end: 1rem;
margin-block-start: 0rem;
}

h1{font-size:var(--h1);line-height:1.25em}
h2{font-size:var(--h1);line-height:1.25em}

.gutscheine h1, .anfragen h1{    margin-top: 0.8em;}

blockquote{font-size:var(--h1);line-height:1.25em;margin-inline-end:0}
img{max-width:100%}
.container{width:100vw;text-align: center;position: relative;display: inline-block;}
.container-inner{width:var(--container);display:inline-block;text-align:left;position:relative;}
.overlay{width:100vw;height:100vh;height:100dvh;min-height:100dvh;overflow:scroll;position:fixed;background-color:var(--heather);padding-top:10em;top:0;left:0;opacity:0;z-index:9;transition:opacity 1.2s ease, transform 1.2s ease;pointer-events:none;transform:translateY(0em)}
.overlay {
	overflow-y:scroll;
overscroll-behavior: contain; /* verhindert Weitergabe an Lenis */
  -webkit-overflow-scrolling: touch;
}
.image{display:inline-block;}
.image img{width:100%}
.text{display:inline-block;font-family:"BatonNouveau"}
.ek{font-family: "EKRoumald", sans-serif;}

.animate{transition:all 1.5s ease;opacity:0}
.animate-bottom{transform:translateY(2em);}
.animate-done{opacity:1;transform:translateX(0) translateY(0)}

.overlay.active{opacity:1;pointer-events:auto;transform:translateY(-10em);z-index:10}

ul {
list-style:none; 
    margin-block-start: 1em;
    margin-block-end: 0em;
    padding-inline-start: 0.5em;

}

li::before {
  content: "•";          /* eigener Punkt */
  font-size: 0.6em;      /* kleinerer Punkt */
  display: inline-block;
  line-height:1.2rem;
  width: 1.5em;
  transform: translateY(0.2em);
	position:absolute;left:-0.5em;
}
li{width:calc(100% - 0.5em);padding-left:0.5em;position:relative}

/*header*/
.menu-burger{position:absolute;right:0;top:2em;width:3em;height:2em;cursor:pointer}
.mobile-menu-line{width:100%;height:1px;background-color:var(--black)}
.mobile-menu-line-2{transform:translateY(0.6em)}
.header{position:fixed;color:var(--black);z-index:9}
.header-menu{top:0;left:0;opacity:0;transition:opacity 1.2s ease, transform 1.2s ease;pointer-events:none;background-color:var(--heather);position:absolute;width:100vw;height:100dvh;overflow:scroll;position:fixed;z-index:10;transform:translateY(0);padding-top:10em}
.header a{color:var(--black)}

.header .link:before{display:none;}
.header.active .header-menu{opacity:1;pointer-events:auto;transform:translateY(-10em)}
.menu-close{cursor:pointer;width:3em;height:3em;position:absolute;left:3em;top:1.5em;transform:rotate(45deg)}
.menu-close:before{background-color:var(--dark);height:1px;width:100%;position:absolute;top:calc(50% - 0.5px);content:""}
.menu-close:after{background-color:var(--dark);height:100%;width:1px;position:absolute;left:calc(50% - 0.5px);content:""}
.header-top-text{margin-top:1.4em;margin-left:10em;display:inline-block;width:40em}
.header-top-text-head{font-size:1.2em;line-height:1.2em}
.header-top-text-sub{font-family:"BatonNouveau"}
.header-logo{width:4.5em;margin-left:2em;margin-top:11vh;display:inline-block;float:left}
.menu-container{display:inline-block;width:47.6em;margin-top:calc(11vh + 2.8em);float:right;padding-bottom:2em;}
.menu-container a{text-decoration:none}
.header-menu-main{width:50%;display: inline-block;font-size:2.4em;line-height:1.75em;float:left;}
.header-menu-main a{width:100%;display: inline-block;}
.header-menu-sec{width:50%;display:inline-block;font-size:1.5em;line-height:2.06em;font-family:"BatonNouveau";vertical-align: top;float:right;margin-top:0.6em}
.header-menu-sec a{width:100%;display: inline-block}
.header-menu-third{width:50%;margin-top:5em;line-height:1.85em;font-family:"BatonNouveau";float:right}
.header-menu-third-half{width:50%;float:left;display:inline-block}
.header-menu-third-half a{width:100%;line-height:1.85em;display:inline-block}

/*body*/

.pausnhof{background-color:var(--kaki);color:var(--white)}
.pausnhof-head{padding-top:2em;}
.pausnhof-logo{margin-top:30vh;margin-left:calc(100% - 9em);width:4.5em;}
.pausnhof-logo img{width:100%}
.pausnhof-natur{margin-top:-2em;width:100%;text-align:center}
.pausnhof-image-1{width:100%;margin-top:1em}
.pausnhof-image-1 img{width:100%}

.rain-image {
    position: relative;
    overflow: hidden;
}

.rain-image img {
    display: block;
    width: 100%;
    height: auto;
}

.rain-image-overlay {
    position: absolute;
    inset: 0;
    pointer-events: none;
    overflow: hidden;
    perspective: 40em;
}

/* Regentropfen */
.rain-drop {
    position: absolute;
    top: -20%;
    width: 0.1em;
    height: 4em;
    background: linear-gradient(
        to bottom,
        rgba(255,255,255,0),
        rgba(255,255,255,0.6)
    );
    transform: rotate(-12deg);
    animation-name: rain-fall;
    animation-timing-function: linear;
     animation-iteration-count: 1;
}

/* Animation */
@keyframes rain-fall {
    from {
        transform: translateY(-20vh) rotate(6deg);
    }
    to {
        transform: translateY(120vh) rotate(4deg);
    }
}

/* Tiefenebenen */
.rain-near {
    height: 9em;
    opacity: 0.35;
    filter: blur(1em);
}

.rain-mid {
    height: 5.5em;
    opacity: 0.5;
    filter: blur(0.05em);
}

.rain-far {
    height: 3em;
    opacity: 0.7;
    filter: blur(0.03em);
}



.pausnhof-text-1{margin-top:var(--spacesmall);margin-left:var(--spaceleft);width:calc(100% - 2 * (var(--spaceleft)))}
.pausnhof-image-2{margin-top:var(--spacebig);margin-left:var(--spaceleft);width:22.35em;float:left;}
.pausnhof-image-3{margin-top:calc(var(--spacebig) + var(--spacesmall));margin-left:5.2em;width:16.4em;float:left;}
.pausnhof-image-4{width:46em;margin-left:18em;margin-top:var(--spacebig)}
.pausnhof-image-5{width:34.15em;margin-left:calc(50% - 17.075em);margin-top:var(--spacebig)}
.pausnhof-quote{width:100%;text-align:center;margin-top:var(--spacesmall)}
cite{font-style:normal;margin-top:1em;display:inline-block;font-size:0.85em;line-height:1.2em}
.pausnhof-text-2{margin-top:var(--spacebig);margin-left:40%;width:60%}
.pausnhof-image-6{width:39.6em;margin-top:var(--spacesmall)}
.pausnhof-text-3{margin-top:var(--spacesmall);margin-left:40%;width:60%;margin-bottom:var(--spacebig)}


.restaurant{background-color:var(--red);color:var(--white)}
.restaurant-head{margin-top:var(--spacesmall);text-align:center;}
.restaurant-image-1{width:100%;margin-top:var(--spacesmall)}
.restaurant-quote{text-align:center;margin-top:var(--spacesmall)}
.restaurant-container{position:relative;margin-top:var(--spacesmall)}
.restaurant-image-2{margin-left: 23.8em;width:28.3em}
.restaurant-links{position:absolute;left:1em;top:50%;transform:translateY(-100%)}
.link{width:100%;display:inline-block;marign:.3em 0;line-height:2rem;cursor:pointer;font-family:"BatonNouveau"}
.link:before{border:solid 2px;border-radius:50%;margin-right:0.5em;content:"+";width:1rem;line-height:1rem;display:inline-block;padding:0em;text-align:center}
.link-open{text-decoration:underline;cursor:pointer;}
.restaurant-links .link{border-color:var(--white)}
.restaurant-image-3{width:16.55em;margin-top:calc(var(--spacesmall) * (-1));vertical-align: top;}
.restaurant-text-1{margin-top:var(--spacesmall);margin-left:var(--spaceleft);width:34em;}
.restaurant-image-4{margin-top:var(--spacebig);width:34.25em;margin-left:calc(50% - 17.125em)}
.restaurant-image-5{margin-top:var(--spacebig);width:28.3em;margin-left:var(--spaceleft);margin-right:10em}
.restaurant-image-container{width:calc(var(--spaceleft) * 2 + 100%);margin-left:calc(var(--spaceleft) * (-1))}
.restaurant-image-6{margin-top:calc(var(--spacebig) + var(--spacesmall));width:22.4em;margin-left:1em;vertical-align: top;}
.restaurant-image-7{margin-top:calc(var(--spacebig) + var(--spacebig) + var(--spacesmall));width:22.4em;margin-left:1em;vertical-align: top;}
.restaurant-image-8{margin-top:calc(var(--spacebig));width:22.4em;margin-left:1em;vertical-align: top;}
.restaurant-image-9{width:40em;margin-top:var(--spacebig);margin-left:var(--spaceleft)}
.restaurant-image-10{width:29.3em;margin-left:calc(100% - 29.3em);margin-top:1em;margin-bottom:var(--spacebig)}

.hotel{background-color:var(--beige);color:var(--dark)}
.hotel-head{margin-top:var(--spacesmall);text-align:center}
.hotel-image-1{margin-top:var(--spacesmall)}
.hotel-text-1{width:35.5em;margin-left:calc(50% - 17.125em);margin-top:var(--spacesmall)}
.hotel-container{position:relative;margin-top:var(--spacesmall)}
.hotel-image-2{margin-left: 23.8em;width:28.3em}
.hotel-links{position:absolute;left:1em;top:50%;transform:translateY(-100%)}
.hotel-image-3{width:46em;margin-top:var(--spacebig)}
.hotel-image-4{width:22.4em;margin-top:calc(var(--spacebig) + var(--spacebig) + var(--spacesmall));margin-left:var(--spaceleft)}
.hotel-image-5{width:22.4em;margin-top:var(--spacebig);float:right}
.hotel-image-6{margin-top:var(--spacebig)}
.hotel-image-7{margin-top:var(--spacebig);margin-left:var(--spaceleft);width:22.4em;}
.hotel-image-8{margin-top:var(--spacebig);margin-left:1em;width:22.4em;}
.restaurant-quote{text-align:center;margin-top:var(--spacebig)}
.hotel-image-9{margin-top:1em;width:17.75em;margin-left:calc(50% - 8.875em)}
.hotel-text-2{width:35.5em;margin-left:calc(50% - 17.125em);margin-top:var(--spacesmall)}
.restaurant-quote-2{text-align:center;margin-bottom:var(--spacebig);margin-top:var(--spacesmall)}

.wald{background-color:var(--green);color:var(--white)}
.wald-head{text-align:center;margin-top:var(--spacesmall)}
.wald-image-1{width:100%;margin-top:var(--spacesmall)}
.wald-quote{margin-top:var(--spacebig);width:80%;}
.wald-container{position:relative;margin-top:var(--spacesmall)}
.wald-image-2{margin-left: calc(100% -  22.4em);width:22.4em}
.wald-links{position:absolute;left:1em;top:50%;transform:translateY(-100%)}
.wald-image-3{width:28.25em;margin-top:calc(var(--spacesmall) * (-1));vertical-align: top;}
.wald-image-4{width:40em;margin-top:calc(var(--spacebig));margin-left:calc(100% - 40em)}
.wald-text-1{width:33.85em;margin-top:calc(var(--spacesmall));}
.wald-text-2{width:33em;margin-top:calc(var(--spacesmall));margin-left:calc(100% - 33em);margin-bottom:var(--spacebig)}

.badehaus{background-color:var(--lime);color:#666C4A;}
.badehaus-head{text-align:center;margin-top:var(--spacesmall)}
.badehaus-image-1{width:100%;margin-top:var(--spacesmall)}
.badehaus-text-1{width:28.5em;margin-top:var(--spacesmall)}
.badehaus-container{position:relative;margin-top:calc(var(--spacebig) * (-1))}
.badehaus-image-2{margin-left: 35.6em;width:28.2em}
.badehaus-links{position:absolute;left:1em;top:50%;transform:translateY(0%)}
.badehaus-image-3{margin-left: -5.5em;width:28.3em;margin-top:calc(var(--spacesmall) * (-1))}
.badehaus-text-2{margin-left: var(--spaceleft);width:27.5em;margin-top:calc(var(--spacesmall))}
.badehaus-image-4{margin-left: calc(50% - 23em);width:46em;margin-top:calc(var(--spacebig))}
.badehaus-image-5{margin-left: calc(50% - 23em);width:34em;margin-top:calc(var(--spacebig));float:right}
.badehaus-image-6{width:40em;margin-top:calc(var(--spacesmall))}
.badehaus-text-3{margin-left: calc(100% - 29em);width:29em;margin-top:calc(var(--spacesmall))}
.badehaus-container-2 {
    position: relative;
    margin-top: calc(var(--spacebig));
    display: inline-block;
    width: 100%;
}
.badehaus-image-7 {
    margin-left: 0;
    width: 29em;
    float: right;
}
.badehaus-text-4{width: calc(100% - 30em);position:absolute;top:50%;transform:translateY(-50%)}
.badehaus-image-8{width:34.35em;/*margin-top:calc(var(--spacebig));*/margin-bottom:calc(var(--spacebig))}


.hof{background-color:var(--brown);color:var(--white)}
.hof-head{text-align:center;margin-top:var(--spacesmall)}
.hof-image-1{width:100%;margin-top:var(--spacesmall)}
.hof-container{width:100%;display:inline-block;margin-top:calc(var(--spacebig))}
.hof-quote{margin-left:var(--spaceleft);width:15em;display:inline-block}
.hof-image-2{float:right;margin-top:var(--spacesmall);width:34.2em}
.image-sub{display:inline-block;width:100%;text-align:center;margin-top:0.5em;font-family: "EKRoumald", sans-serif;}
.hof-image-2 .image-sub{width:65%;margin-left:17.5%}
.hof-text-1{margin-left:var(--spaceleft);margin-top:var(--spacebig);width:46em}
.hof-image-3{width:22.4em;margin-top:calc(var(--spacebig) * 2 + var(--spacesmall));float:left}
.hof-image-4{width:22.4em;margin-top:var(--spacebig);float:right}
.hof-text-2{width:28.3em;margin-top:var(--spacebig);float:right}
.hof-image-5{margin-left:var(--spaceleft);width:40.5em;margin-top:var(--spacebig)}
.hof-image-6{width:36.4em;margin-top:var(--spacebig);float:right}
.hof-image-7{width:28.3em;margin-top:var(--spacebig);margin-bottom:var(--spacesmall)}
.hof-image-7 .image-sub{width:80%;margin-left:10%}


/*overlays*/
.overlay .container-inner{padding-bottom:var(--spacesmall);}
.overlay-close{cursor:pointer;width:2.3em;height:2.3em;position:absolute;right:0;top:1.5em;transform:rotate(45deg)}
.overlay-close:before{background-color:var(--dark);height:1px;width:100%;position:absolute;top:calc(50% - 0.5px);content:""}
.overlay-close:after{background-color:var(--dark);height:100%;width:1px;position:absolute;left:calc(50% - 0.5px);content:""}
.overlay-head{margin-top:1.5em;}
.overlay-restaurant-times-text{margin-top:5em;margin-left:24em;display:inline-block}
.overlay-reaturant-times-image{margin-left:10em;width:calc(100% - 10em);margin-top:var(--spacebig)}
.overlay-restaurant-times{background-color:var(--red);color:var(--white)}
.overlay-restaurant-times .overlay-close:before, .overlay-restaurant-times .overlay-close:after{background-color:var(--white);}
.overlay-restaurant-wissen{background-color:var(--red);color:var(--white)}
.overlay-restaurant-wissen .overlay-close:before, .overlay-restaurant-wissen .overlay-close:after{background-color:var(--white);}
.overlay-restaurant-wissen-table{display:inline-block;margin-top:5em;width:100%}
.overlay-restaurant-wissen-line{display:inline-block;width:100%;margin-bottom:1em}
.overlay-restaurant-wissen-row-1{width:40%;float:left;display:inline-block}
.overlay-restaurant-wissen-row-2{width:55%;float:right;display:inline-block}
.overlay-restaurant-wissen-image{margin-top:10em;width:45%;}
.overlay-hotel-preise{background-color: var(--beige);
    color: var(--dark);}
.overlay-hotel-preise-text{margin-top:var(--spacebig)}
.overlay-hotel-preise-preise-head{margin-top:var(--spacesmall)}
.overlay-hotel-preise-preise-table{margin-top:1em;}
.overlay-hotel-preise-preise-table, .overlay-hotel-preise-preise-table table{width:100%}
.overlay-hotel-preise-preise-table table tr:nth-child(1) td{padding-bottom:1em}
.overlay-hotel-preise-kinder{margin-top:var(--spacesmall);width:50%;float:left}
.overlay-hotel-preise-kinder h3{margin-bottom:1em}
.overlay-hotel-preise-zuschlag{margin-top:var(--spacesmall);width:45%;float:right}
.overlay-hotel-preise-zuschlag h3{margin-bottom:1em}
.overlay-hotel-preise-zuschlag table{width:80%}
.overlay-hotel-preise-inklusiv{margin-top:var(--spacesmall)}
.overlay-hotel-preise-verpflegung{margin-top:var(--spacesmall)}
.overlay-hotel-preise-verpflegung h3{margin-bottom:1em}
.overlay-hotel-preise-angebote-head{margin-top: var(--spacebig);}
.overlay-hotel-preise-angebote{ display: grid;
  grid-template-columns: repeat(2, 1fr);
  column-gap: 5em;
  row-gap: var(--spacesmall);
  margin-top:var(--spacesmall);
}

/*.overlay-hotel-preise-angebote .text:nth-child(2){opacity:0}*/
.overlay-hotel-preise-angebote-preis{display:inline-block;width:100%;}
.overlay-hotel-preise-angebote-preis div:nth-child(1){width:80%;float:left;display:inline-block}
.overlay-hotel-preise-angebote-preis div:nth-child(2){width:20%;float:right;display:inline-block;font-family: "EKRoumald", sans-serif;font-size:1.2em;line-height:1.5rem}
.overlay-hotel-preise-angebote ul{margin-bottom:1em;}
.overlay-hotel-preise-angebote-preis-break{height:1px;width:100%;background-color:var(--dark);margin:0.5em 0}
.overlay-hotel-wissen{background-color: var(--beige);
    color: var(--dark);}
.overlay-hotel-wissen-grid{margin-top:var(--spacebig);display:grid;grid-template-columns: 40% 55%;
  column-gap: 5%;
row-gap:1em}

.overlay-wald{background-color: var(--green);
    color: var(--white);}
    .overlay-wald .overlay-wald-architektur-grid{margin-top:var(--spacebig);display:grid;grid-template-columns: 40% 55%;
  column-gap: 5%;
row-gap:var(--spacesmall)}
.overlay-wald .overlay-close:before, .overlay-wald .overlay-close:after{background-color:var(--white);}
.wald-overlay.image{margin-top:0.8em;}
.text a{text-decoration:underline;}
.overlay-badehaus{color:#666C4A;background-color:var(--lime)}
.overlay-badehaus-zeiten-text{margin-top:var(--spacebig);margin-left:5%;width:52%;display:inline-block;}
.overlay-badehaus-zeiten-image{margin-top:var(--spacebig);width:21.05em;display:inline-block;}
.overlay-badehaus-wissen-text{margin-top:var(--spacebig);margin-left:5%;width:52%;display:inline-block;}
.overlay-badehaus-wissen-image{margin-top:var(--spacebig);width:21.05em;float:left;display:inline-block;}

.overlay-badehaus-anwendungen-image{margin-top:var(--spacesmall);width:46em;}
.overlay-badehaus-anwendungen-table{display:inline-block;width:100%;margin-top:var(--spacesmall)}
.overlay-badehaus-anwendungen-table-left{display:inline-block;float:left;width:calc(45% - 0.5em);}
.overlay-badehaus-anwendungen-table-right{display:inline-block;float:right;width:calc(45% - 0.5em);}
.overlay-badehaus-anwendungen-table-head h2{font-family: "EKRoumald", sans-serif;font-size:2.4em;line-height:1.1em}
.overlay-badehaus-anwendungen-table-subhead{margin-bottom:3.5em;}
.overlay-badehaus-anwendungen-table-row{margin-bottom:1em;padding-bottom:1em;border-bottom:1px solid var(--green);display: inline-block;
    width: 100%;}
.overlay-badehaus-anwendungen-table-row-head{font-weight:500;width:100%;display:inline-block}
.overlay-badehaus-anwendungen-table-row-text{width:80%;float:left;display: inline-block}
.overlay-badehaus-anwendungen-table-row-price{width:20%;float:right;text-align:right}
.overlay-badehaus-anwendungen-table-after{margin-top:1em;display:inline-block;}

.overlay-page{background-color: var(--heather);color:var(--black)}
.overlay-page .overlay-wald-architektur-grid{margin-top:var(--spacebig);display:grid;grid-template-columns: 40% 55%;
  column-gap: 5%;
row-gap:var(--spacesmall)}




/* Anfrage + Gutscheine */


.gutschein-single .link:before{display:none;}
.gutschein-single .link{display:inline;}
.gutschein-single{padding-bottom:5em}
.gutschein{background-color: var(--heather);}
.gutschein-kategorie{margin:5em 0;}
.gutschein-kategorie h3{margin-bottom:1em}
.gutschein-grid{
	display:grid; grid-template-columns:32% 32% 32%; gap:2%
}
.gutschein-item img{width:100%;height:12em;object-fit:cover}
.gutschein-item{text-decoration:none;text-align:left;}
.gutschein-item-title{margin-top:1em;margin-bottom:2em}

.gutscheine-single-image{width:35%;display:inline-block;float:left;margin-top:6em}

.gutscheine-single-text{width:60%;display:inline-block;float:right;margin-top:6em;margin-bottom:6em;}
.preview-gutschein-container{height:0;padding-top:1em;overflow:hidden;transition:height .5s ease}
.preview-gutschein{width:20em;text-align:center;margin-top:1em;position: relative;}
.preview-gutschein-bg{width:100%;}
.preview-gutschein-image{position:absolute;top:5em;left:0}
.preview-gutschein-image img{width:70%;}

.preview-gutschein-wert {
    position: absolute;
    top: 25rem;
    width: 100%;
    font-weight: 500;
    font-family: "BatonNouveau", sans-serif;
    font-size: 0.22em;
    left: 0;
}
.preview-gutschein-text{position:absolute;top:14rem;width:80%;left:10%;}
.preview-gutschein-headline{width:100%;font-family:"EKRoumald", sans-serif;font-size:1.1em;left:0;margin-bottom:1.2em;line-height:1.2em;}
.von-von, .for-for{font-size:0.5em;font-family:"BatonNouveau", sans-serif;font-weight: 500;line-height:1.2em;}
.von-name, .for-name{font-size:0.6em;font-family:"EKRoumald", sans-serif;margin-bottom:1.5em;line-height:1.2em;}
.im-wert{font-weight: 500;font-size:0.5em;line-height:1.2em;margin-top:0.5em}
.im-wert-zahl, .title-title{font-size:0.7em;font-family:"EKRoumald", sans-serif;line-height:1.2em;}
.title-title{margin-top:0.5em;}
.preview-gutschein-foot {
    position: absolute;
    top: 26rem;
    width: 100%;
    font-family:"BatonNouveau", sans-serif;
    font-size: 0.35em;
	line-height:1.8em;
	 font-weight: 500;
    left: 0;
}

/* Basis-Reset für Formulare */
input,
select,
textarea,
button {
    background-color: var(--heather);
    font-family: 'BatonNouveau', sans-serif;
    font-size: 1em;
    padding: 0.5em 0.4em;
    width:100%;
    border: 2px solid var(--dark);
    border-radius: 0;
    box-sizing: border-box;
    color: var(--dark);
    outline: none;
	margin-bottom:0.5em;
}
input[type="checkbox"],
input[type="radio"] {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;

    width: 1.4em;
    height: 1.4em;

    background-color: var(--heather);
    border: 2px solid var(--dark);
    box-sizing: border-box;
    align-items: center;
    justify-content: center;

    cursor: pointer;
    margin-right: 0.5em;
    position: relative;
}

/* Checkbox: eckig */
input[type="checkbox"] {
    border-radius: 0;
	position:relative;
	    transform: translateY(0.8em);
}

/* Radio: rund */
input[type="radio"] {
    border-radius: 50%;
}

/* Checked-Zustand */
input[type="checkbox"]:checked::after {
    content: '';
    width: 100%;
    height: 100%;
	position:absolute;top:0;left:0;
    background-color: var(--dark);
}

input[type="radio"]:checked::after {
    content: '';
    width: 0.6em;
    height: 0.6em;
    background-color: var(--dark);
    border-radius: 50%;
}

/* Fokus */
input[type="checkbox"]:focus,
input[type="radio"]:focus {
    outline: none;
    box-shadow: 0 0 0 2px rgba(0,0,0,0.25);
}

/* Textfelder volle Breite optional */
input[type="text"],
input[type="email"],
input[type="number"],
input[type="date"],
textarea,
select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
}
textarea{height:12em}
/* Fokus-Zustand */
input:focus,
select:focus,
textarea:focus {
    outline: 2px solid rgba(0,0,0,0.2);
}

/* Placeholder */
::placeholder {
    color: rgba(0,0,0,0.6);
}

/* Checkbox & Radio etwas angleichen */
input[type="radio"] {
    width: auto;
    padding: 0;
    margin-right: 0.5em;
}

/* Button */
button,
input[type="submit"] {
    cursor: pointer;
	width:unset;
	text-align:center;
    transition: background-color 0.2s ease, color 0.2s ease;
}

button:hover,
input[type="submit"]:hover {

}



.gutschein-danke{background-color:var(--heather)}
.gutschein-danke-text{margin-top:6em;width:60%;margin-bottom:12em}

.anfragen{background-color:var(--heather)}
.anfrage-text{margin-top:var(--spacebig)}
.anfrage-form{margin:6em 0;display:grid;grid-template-columns: 40% 55%;
  column-gap: 5%;
row-gap:2em }
.anfrage-form ul {
    list-style: none;
    margin-block-start: 1em;
    margin-block-end: 1em;
    padding-inline-start: 0.5em;
}

.anfragen-form select{margin-left:0;height:12em}


/* Container für alle Bilder */
.gutschein-image-choice {
    display: inline-block;
    margin-right: 0.5em;
    cursor: pointer;
}

/* Radio unsichtbar machen */
.gutschein-image-choice input[type="radio"] {
    display: none;
}

/* Bild-Styling */
.gutschein-image-choice img {
    width: 9em;
    height: 5em;
    object-fit: cover;

    border: 2px solid transparent;
    transition: border 0.2s ease, box-shadow 0.2s ease;
}

/* Auswahl sichtbar machen */
.gutschein-image-choice input[type="radio"]:checked + img {
    border: 2px solid var(--dark);
    box-shadow: 0 0 0 2px rgba(0,0,0,1);
}

/* Hover */
.gutschein-image-choice:hover img {
    border-color: rgba(0,0,0,1);
}


select {
    font-family: "BatonNouveau", sans-serif;
    font-size: 1em;
    padding: 0.3em 2em 0.3em 0.5em;

    background-color: var(--heather);
    color: var(--dark);
width:100%;
	
    border: 2px solid var(--dark);
    border-radius: 0;

    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;

    background-image: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'>\
<polyline points='6 9 12 15 18 9' />\
</svg>");
    background-repeat: no-repeat;
    background-position: right 0.5em center;
    background-size: 1em;
}


input[type="submit"],
button[type="submit"] {
    font-family: "BatonNouveau", sans-serif;
padding:0.7em 0.6em;
    transition: background-color 0.2s ease, color 0.2s ease;
}

input[type="submit"]:hover,
button[type="submit"]:hover {
    background-color: var(--dark);
    color: var(--heather);
}


/*footer*/
.footer{font-family:"BatonNouveau"}
.footer a{text-decoration:unset}
.footer-logo{margin-top:var(--spacesmall);width:calc(18%);margin-right:89.5%;}
.footer-logo img{width:100%;cursor:pointer;}
.footer-bottom{margin-top:var(--spacesmall);margin-bottom:var(--spacesmall);display:inline-block;width:100%}
.footer-row{display:inline-block;float:left;width:20%;line-height:1.85em}
.footer-row-5 a{width:100%;display:inline-block}
.footer-row-1{width:23%}
.footer-row-2{width:28%}
.footer-row-3{width:10%}
.footer-row-3 img{width:70%}
.footer-row-4{width:28%}
.footer-row-5{width:7%}


.gedicht-anzeigen{text-decoration:underline;cursor:pointer;}
.gedicht-content{height:0;transition:height 1s ease;overflow:hidden;}



@media(orientation:portrait){
	
	.cookie-banner-inner {
    position: absolute;
    width: 80%;
    top: calc(50% - 14em);
    left: 10%;
    border-radius: 1em;
    background-color: var(--heather);
    filter: drop-shadow(0.2em 0.2em 0.2em rgba(0, 0, 0, 0.2));
    padding: 1em;
    text-align: center;
    font-size: var(--fonts);
    box-sizing: border-box;
}
	
	
	.menu-container{width:100%;margin-top:4em}
	.header-logo{display:none}

.pausnhof-head {
    margin-top: 1em;
}


.pausnhof-logo {
    margin-top: 20vh;
    margin-left: calc(100% - 7em);
    width: 4.5em;
}

.pausnhof-natur {
    margin-top: -1em;}


    .pausnhof-text-1 {
    margin-top: var(--spacesmall);
    margin-left: var(--spaceleft);
    width: calc(100% - (var(--spaceleft)));
}

.pausnhof-image-2{
    width: calc(100% - (var(--spaceleft)));
    margin-left:0;
}

.pausnhof-image-3{margin-top:var(--spacebig);width:calc(100% -  2 * (var(--spaceleft)));margin-left:calc(2 * (var(--spaceleft)))}

.pausnhof-image-4 {
    width: 100%;
    margin-left: 0;
    margin-top: var(--spacebig);
}

.pausnhof-image-5 {
    width:calc(100% - var(--spaceleft));margin-left:0;
}


.pausnhof-text-2 {margin-top:var(--spacebig);width:calc(100% - var(--spaceleft));margin-left:var(--spaceleft)}


.pausnhof-image-6 {
    width: 100%;
    margin-left:0;
}

.pausnhof-text-3 {
    margin-top: var(--spacesmall);
    margin-left: 30%;
    width: 70%;
    margin-bottom: var(--spacebig);
}

.links{position:relative;margin-top:var(--spacesmall);margin-bottom:var(--spacesmall);display:inline-block;transform:unset;margin-left:10%;margin-top: 1.5em;
        margin-bottom: 2em;}

.restaurant-image-2 {
     margin-top: var(--spacesmall);
     margin-left: var(--spaceleft);
    width: calc(100% - (var(--spaceleft)));
}

.restaurant-image-3 {
width: calc(100% - (var(--spaceleft)));
    margin-top: calc(var(--spacesmall));
    vertical-align: top;
}

.restaurant-text-1 {
    margin-top: var(--spacesmall);
    margin-left: var(--spaceleft);
width: calc(100% - (var(--spaceleft)));
}

.restaurant-image-4 {
    margin-top: var(--spacebig);
    width: 100%;
    margin-left: 0;
}

.restaurant-image-5 {
width: calc(100% - (var(--spaceleft)));
    margin-left: var(--spaceleft);

}


.restaurant-image-6 {
    margin-top: calc(var(--spacesmall));
  width:calc(100% -  2 * (var(--spaceleft)));
  margin-left:0;
}

.restaurant-image-container{width:100%;margin-left:0}


.restaurant-image-7 {
width: calc(100% - (var(--spaceleft)));
    margin-left: var(--spaceleft);
}


.restaurant-image-8 {
    margin-top: calc(var(--spacebig));
  width: calc(100% - (var(--spaceleft)));
    margin-left: 0;
    vertical-align: top;
}


.restaurant-image-9 {margin-top:var(--spacesmall);width:calc(100% -  2 * (var(--spaceleft)));margin-left:calc(2 * (var(--spaceleft)))}

.restaurant-image-10 {
    width: 100%;
    margin-left: 0;
    margin-top:var(--spacesmall);
    margin-bottom: var(--spacebig);
}


.hotel-text-1, .hotel-text-2 {
    width: 100%;
    margin-left: 0;
    margin-top: var(--spacesmall);
}

.hotel-image-2 {
    margin-top: var(--spacesmall);
    width: calc(100% - (var(--spaceleft)));
    margin-left:var(--spaceleft);
}

.hotel-image-3 {
    width: 100%;
}

.hotel-image-4 {
 
    margin-top: calc(var(--spacesmall));
   width: calc(100% - (var(--spaceleft)));
    margin-left:0;
}

.hotel-image-5 {
 
    margin-top: calc(2 * var(--spacesmall));
   width: calc(100% - 2 * (var(--spaceleft)));
    margin-left:var(--spaceleft);
}


.hotel-image-8 {
    margin-top: var(--spacebig);
    margin-left: 0;
}

.wald-quote {
    margin-top: var(--spacebig);
    width: 100%;
}

.wald-links{transform: unset;}


.wald-image-2 {
     margin-top: calc(var(--spacesmall));
   width: calc(100% - (var(--spaceleft)));
    margin-left:var(--spaceleft);
}


.wald-image-3 {
     margin-top: var(--spacesmall);
    width: 100%;
}

.wald-image-4 {
   margin-top: calc(var(--spacesmall));
   width: calc(100% - 2 * (var(--spaceleft)));
    margin-left:var(--spaceleft);
}

.wald-text-1 {
    width: 100%;
    margin-top: calc(var(--spacesmall));
}


.wald-text-2 {
  width: calc(100% - (var(--spaceleft)));
    margin-left:var(--spaceleft);
}


.badehaus-text-1 {
    width: 100%;
    margin-top: calc(var(--spacesmall));
	margin-bottom: 0;
}

.badehaus-container {
    position: relative;
    margin-top: calc(var(--spacesmall));
}

.badehaus-image-2 {
 width: calc(100% - (var(--spaceleft)));
    margin-left:var(--spaceleft);
    margin-top: calc(var(--spacesmall));
}


.badehaus-image-3 {
    margin-left: 0;
    width: calc(100% - (var(--spaceleft)));
   margin-top: calc(var(--spacesmall));
}

.badehaus-text-2 {
    margin-left: var(--spaceleft);
    width: calc(100% - (var(--spaceleft)));
    margin-top: calc(var(--spacesmall));
}


.badehaus-image-4 {
    margin-left: 0;
    width: 100%;
    margin-top: calc(var(--spacebig));
}


.badehaus-image-5 {
     width: calc(100% - 2 * (var(--spaceleft)));
    margin-top: calc(var(--spacebig));
    float: right;
}


.badehaus-image-6 {
  width: calc(100% - (var(--spaceleft)));
    margin-top: calc(var(--spacesmall));
}

.badehaus-text-3 {
    margin-left: 0;
    width: 100%;
    margin-top: calc(var(--spacesmall));
}

.badehaus-text-4 {
    margin-left: var(--spaceleft);
    width: calc(100% - (var(--spaceleft)));
    position: relative;
    top: 0;
    transform: unset;
}

.badehaus-image-7 {
    margin-top: calc(var(--spacesmall));
    margin-left:0;
    width: 100%;
}

.badehaus-image-8 {
    margin-top: calc(var(--spacesmall));
    width: calc(100% - (var(--spaceleft)));
}

.hof-quote {
    margin-left: var(--spaceleft);
   width: calc(100% - (var(--spaceleft)));
    display: inline-block;
}

.hof-image-2 {
    float: left;
    margin-top: var(--spacesmall);
    width: calc(100% - (var(--spaceleft)));
}
.hof-image-2 .image-sub {
    width: 100%;
    margin-left: 0;
}

.hof-text-1 {
   margin-left: var(--spaceleft);
   width: calc(100% - (var(--spaceleft)));
}

.hof-image-3 {
   width: calc(100% - (var(--spaceleft)));
    margin-top: calc(var(--spacesmall));
    float: left;
}


.hof-image-4 {
    width: calc(100% - (var(--spaceleft)));
    margin-top: var(--spacebig);
    float: right;
}

.hof-text-2 {
    width: 100%;
    margin-top: var(--spacebig);
    float: right;
}

.hof-image-5 {
    margin-left: var(--spaceleft);
    width: calc(100% - (var(--spaceleft)));
    margin-top: var(--spacebig);
}

.hof-image-6 {
    width: 100%;
    margin-top: var(--spacebig);
    float: right;
}

.hof-image-7 {
  width: calc(100% - (var(--spaceleft)));
    margin-top: var(--spacebig);
    margin-bottom: var(--spacesmall);
}


.footer-row{width:100%;}
.footer-left{float:left;width:50%;}
.footer-right{float:right;width:50%;text-align:right}
.footer-row-2{margin-top:1em}
.footer-row-4{margin:1em 0}
.container{max-width:100vw;overlfow:hidden}
.header-top-text {
    margin-top: 1.4em;
    margin-left: 6em;
    display: inline-block;
    width: calc(100% - 8em);
}

.menu-close{left:1em}

.overlay-restaurant-times-text {
    margin-top: 5em;
    margin-left: 0;
    display: inline-block;
}



.overlay-hotel-preise-kinder {
    margin-top: var(--spacesmall);
    width: 100%;
    float: left;
}

.overlay-hotel-preise-zuschlag {
    margin-top: var(--spacesmall);
    width: 100%;
    float: right;
}

.overlay-hotel-preise-angebote {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    column-gap: 1em;
    row-gap: var(--spacesmall);
    margin-top: var(--spacesmall);
}

.overlay-badehaus-zeiten-text {
    margin-top: var(--spacesmall);
    margin-left: 0;
    width: 100%;
}



.overlay-badehaus-anwendungen-image {
    margin-top: var(--spacesmall);
    width: 100%;
}

.overlay-badehaus-anwendungen-table-left {
    display: inline-block;
    float: left;
    width: 100%;
}

.overlay-badehaus-anwendungen-table-right {
    display: inline-block;
    float: right;
    width: 100%;
    margin-top: 4em;
}

.menu{width:100%;}
.header{max-width:100vw;}
.header-menu-main{width:100%;}

.header-menu-sec{width:100%;}
.header-menu-third{float:left;width:100%}
	.anfrage-form{display:inline-block;}
	.gutschein-grid{
	display:grid; grid-template-columns:49% 49%; gap:2%;
}
	.gutschein-item img{width:100%;height:8em;object-fit:cover}
	
	
	    .text {
        margin-left:0;
        width:100%;
     
    }
	
	.image {
    margin-top: calc(var(--spacesmall));
}
	
	.menu-burger {top:1.3em}
	
	.overlay-close {
    top: 2.1em;
}
	
	
	
	.wald-overlay.image {
    margin-top: 0.8em;
    width: 100%;
  
}
	
		.overlay-wald .overlay-wald-architektur-grid {
    margin-top: var(--spacebig);
    display: inline-block;
}
	
	.overlay-wald-architektur-grid div{
		margin-bottom: 1em;}
	
	.overlay-wald-architektur-grid div:nth-child(even){
		margin-bottom: 4em;}
	
	
	.overlay-badehaus-wissen-text {
    margin-top: var(--spacesmall);
    margin-left: 0;
    width: 100%;
    display: inline-block;
}
	
	
	    .badehaus-image-7 {
        margin-bottom: calc(var(--spacesmall));
        margin-top: 0;
    }
	
	blockquote {
		font-size: 2em;}
	
	.hotel-container {
    position: relative;
 
}
	.gedicht-content{margin-bottom:0em !important}
	
	.footer-row-3 img {
    width: 80%;
}
	
	.overlay{  inset: 0;              
		width:unset;height:unset;
  z-index: 9999;
		padding-top:0;
transform:translateY(10em)  translateZ(0);

  will-change: transform;}
	
	.overlay.active{transform:translateY(0)  translateZ(0)}
	
	.footer-logo {
    margin-top: var(--spacesmall);
    width: calc(33%);
    margin-right: 89.5%;
}
	
	.hotel-image-7 {
    margin-top: var(--spacesmall);
    margin-left: 0;
    width: 22.4em;
    float: right;
}
	
	
	.hof-container
 {
    width: 100%;
    display: inline-block;
    margin-top: calc(var(--spacesmall));
}
	
	
	.gutschein h1, .anfragen h1{margin-top: 1.25rem;}
}