

@font-face {
  font-family: 'Teachers';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/Teachers-Italic-VariableFont_wght.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/Teachers-Italic-VariableFont_wght.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/Teachers-Italic-VariableFont_wght.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/Teachers-Italic-VariableFont_wght.woff') format('woff'), /* Modern Browsers */
       url('../fonts/Teachers-Italic-VariableFont_wght.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/Teachers-Italic-VariableFont_wght.svg#Poppins') format('svg'); /* Legacy iOS */
}


@font-face {
  font-family: 'Poiret';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/PoiretOne-Regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/PoiretOne-Regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/PoiretOne-Regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/PoiretOne-Regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/PoiretOne-Regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/PoiretOne-Regular.svg#Poppins') format('svg'); /* Legacy iOS */
}


@font-face {
  font-family: 'Party';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/BigParty4Blue-0f5b.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/BigParty4Blue-0f5b.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/BigParty4Blue-0f5b.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/BigParty4Blue-0f5b.woff') format('woff'), /* Modern Browsers */
       url('../fonts/BigParty4Blue-0f5b.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/BigParty4Blue-0f5b.svg#Poppins') format('svg'); /* Legacy iOS */
} 

@font-face {
  font-family: 'Sulphur';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/SulphurPoint-Regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/SulphurPoint-Regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/SulphurPoint-Regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/SulphurPoint-Regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/SulphurPoint-Regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/SulphurPoint-Regular.svg#Poppins') format('svg'); /* Legacy iOS */
}


@font-face {
  font-family: 'Ysabeau';
  font-style: normal;

  font-weight: 400;
  src: url('../fonts/Ysabeau-Italic-VariableFont_wght.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/Ysabeau-Italic-VariableFont_wght.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/Ysabeau-Italic-VariableFont_wght.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/Ysabeau-Italic-VariableFont_wght.woff') format('woff'), /* Modern Browsers */
       url('../fonts/Ysabeau-Italic-VariableFont_wght.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/Ysabeau-Italic-VariableFont_wght.svg#Poppins') format('svg'); /* Legacy iOS */
}

/* -------------------------------------------------------------------------------------------------- */

/* Modul Impressum. Links ensprechend eingerückt */
#sp-rechliches-und-impressum {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

#sp-rechliches-und-impressum .container,
#sp-rechliches-und-impressum .container-inner,
#sp-rechliches-und-impressum .row,
#sp-rechliches-und-impressum .sp-column,
#sp-rechliches-und-impressum #sp-position8,
#sp-rechliches-und-impressum #mod-custom112 {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
}

#sp-rechliches-und-impressum #mod-custom112 {
    padding-left: 30px !important;
    padding-right: 30px !important;
}

/* Handy Modul Impressum*/
@media (max-width: 767px) {
    #sp-rechliches-und-impressum #mod-custom112 {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
}

/* -------------------------------------------------------------------------------------------------- */

/* Footer 1 (dunkelgruen) */
#sp-footer1 {
    padding-left: 45px !important;
    padding-top: 20px !important;
    padding-bottom: 20px !important;
}

/* Handy Footer 1 */
@media (max-width: 767px) {

    #sp-footer1 {
        padding-left: 25px !important;
        padding-right: 25px !important;
        padding-top: 20px !important;
        padding-bottom: 20px !important;
        box-sizing: border-box !important;
    }

    /* Kontaktblock */
    #sp-footer1 ul.sp-contact-info {
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    #sp-footer1 ul.sp-contact-info li {
        margin-left: 0 !important;
        padding-left: 0 !important;
        box-sizing: border-box !important;
    }
}

/* -------------------------------------------------------------------------------------------------- */

.sp-megamenu-parent>li a{
    font-size:18px !important;
}

/* -------------------------------------------------------------------------------------------------- */

/* Schriftart, Farbe, Größe festlegen */
body, p, h4, a {font-family: 'Sulphur'; font-size: 18px; color: #013408}

#sp-main-body h1,
h1 {font-family: 'Poiret' !important; font-size: 50px !important; color: #013408 !important; font-weight: normal !important; line-height: 1.2 !important; margin-top: 0 !important;}
h2 {font-family: 'Sulphur'; font-size: 18px; color: #013408; font-weight: bold; }
h3 {font-family: 'Sulphur'; font-size: 18px; color: #013408; text-decoration: underline;}




/* -------------------------------------------------------------------------------------------------- */

/* Links unterstreichen */
.article-details a {
    color: #013408;
    text-decoration: underline;
}

/* -------------------------------------------------------------------------------------------------- */

/* Burger wird direkt neben Logo auf Handyansicht angezeigt */

@media (max-width: 767px) {
    #sp-header .row {
        flex-wrap: nowrap !important;
        align-items: center;
    }

    #sp-logo {
        flex: 1 1 auto;
        min-width: 0;
    }

    #sp-menu {
        flex: 0 0 auto !important;
        width: auto !important;
    }
}

/* -------------------------------------------------------------------------------------------------- */

/* Headerhöhe wird auf Handy verkleinert */


@media (max-width: 576px) {

    #sp-header {
        height: 80px !important;
        min-height: 80px !important;
        padding: 0 !important;
    }

    #sp-header .container,
    #sp-header .container-inner,
    #sp-header .row,
    #sp-logo,
    #sp-logo .sp-column,
    #sp-menu {
        height: 80px !important;
        min-height: 80px !important;
    }

    .logo-image,
    .logo-image-phone {
        height: 60px !important;
        width: auto !important;
    }

}


/* -------------------------------------------------------------------------------------------------- */

.offcanvas-menu .logo img {
    width: auto !important;
    height: auto !important;
    max-width: 100%;
}

/* -------------------------------------------------------------------------------------------------- */

/* Nur Textbox */
.text-box {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 30px !important;
    padding-right: 30px !important;
    box-sizing: border-box !important;
}

/* Nur Textbox Handy */
@media (max-width: 767px) {
    .text-box {
        padding-left: 5px !important;
        padding-right: 5px !important;
    }
}

/* -------------------------------------------------------------------------------------------------- */

/* Bild + Text im Artikel */
.bild-text {
    display: flex !important;
    flex-direction: row !important;
    gap: 40px !important;
    align-items: flex-start !important;
    max-width: 100%;
    box-sizing: border-box;
}

/* Bild */
.bild-text .bild {
    flex: 0 0 calc(40% - 20px) !important;
    width: auto !important;
    box-sizing: border-box;
}

/* Text */
.bild-text .text {
    flex: 1 1 0 !important;
    width: auto !important;
    min-width: 0 !important;
    box-sizing: border-box;
    overflow-wrap: break-word;
}

/* Zweiter Block:
   Text links – Bild rechts */
.bild-text.umgekehrt .bild {
    order: 2 !important;
}

.bild-text.umgekehrt .text {
    order: 1 !important;
	padding-left: 30px !important;
        padding-right: 30px !important;
        box-sizing: border-box !important;
}

/* Handy:
   immer Bild zuerst, Text darunter */
@media (max-width: 767px) {

    .bild-text,
    .bild-text.umgekehrt {
        flex-direction: column !important;
        gap: 20px !important;
    }

    .bild-text .bild,
    .bild-text .text,
    .bild-text.umgekehrt .bild,
    .bild-text.umgekehrt .text {
        width: 100% !important;
        flex: none !important;
        min-width: 0 !important;
    }

    .bild-text .bild,
    .bild-text.umgekehrt .bild {
        order: 1 !important;
    }

    .bild-text .text,
    .bild-text.umgekehrt .text {
        order: 2 !important;
    }


/* Text darunter, leicht eingerückt */
    .bild-text .text,
    .bild-text.umgekehrt .text {
        order: 2 !important;
        padding-left: 5px !important;
        padding-right: 5px !important;
        box-sizing: border-box !important;
    }


}

/* -------------------------------------------------------------------------------------------------- */


/* ========================================
   MASONRY GALERIE – IMPRESSIONEN
   ======================================== */

.masonry-galerie {
    column-count: 4 !important;
    column-gap: 15px !important;
    width: 70% !important;
    max-width: 900px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
}

.masonry-bild {
    display: inline-block !important;
    width: 100% !important;
    margin: 0 0 15px 0 !important;
    padding: 0 !important;
    break-inside: avoid !important;
    -webkit-column-break-inside: avoid !important;
    overflow: hidden !important;
}

.masonry-bild img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    border-radius: 4px !important;
}

/* Bildunterschrift */

.masonry-bild .bildunterschrift {
    font-family: 'Sulphur', sans-serif !important;
    font-size: 14px !important;
    color: #013408 !important;
    text-align: center !important;
    padding: 5px 3px 2px 3px !important;
    line-height: 1.2 !important;
    box-sizing: border-box !important;
}


/* ========================================
   HANDY Mansonry Galerie
   ======================================== */

@media (max-width: 767px) {

    .masonry-galerie {
        column-count: 2 !important;
        width: 100% !important;
        max-width: none !important;
        padding-left: 5px !important;
        padding-right: 5px !important;
        column-gap: 8px !important;
        box-sizing: border-box !important;
    }

    .masonry-bild {
        margin-bottom: 8px !important;
    }

    .masonry-bild .bildunterschrift {
        font-size: 13px !important;
        padding: 4px 2px 2px 2px !important;
    }
}


/* -------------------------------------------------------------------------------------------------- */


/* Platz zw. Header und Body = kein Platz*/
#sp-main-body {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* -------------------------------------------------------------------------------------------------- */


/* Menü wird früher ein Hamburger, wenn das Fenster im Desktop kleiner gezogen wird */

@media screen and (max-width: 500px) {

    /* Desktop-Menü ausblenden */
    .sp-megamenu-parent {
        display: none !important;
    }

    /* Hamburger anzeigen */
    #sp-header #offcanvas-toggler.mega,
    #sp-header #offcanvas-toggler.offcanvas {
        display: flex !important;
    }
} */




/* -------------------------------------------------------------------------------------------------- */



/*

body.sticky-header
#sp-header .header-sticky{top: 0;
}

body.sticky-header #sp-main-body,
body.sticky-header .body-innerwrapper {
padding-top: 130px !important;
}

*/


/* -------------------------------------------------------------------------------------------------- */

/* Cookie Info */

.cookie-info-popup {
  position: fixed;
  left: 50%;
  bottom: 30px;
  transform: translateX(-50%);

  width: 440px;
  max-width: calc(100% - 30px);

  padding: 24px 28px 22px;

  background: #fff;
  color: #333;

  border-radius: 10px;

  box-shadow: 0 8px 35px rgba(0, 0, 0, 0.18);

  z-index: 999999;

  font-size: 14px;
  line-height: 1.6;
}

.cookie-info-title {
  margin-bottom: 8px;

  font-size: 18px;
  font-weight: 600;
}

.cookie-info-text {
  margin-bottom: 18px;
}

.cookie-info-button {
  display: block;
  width: 100%;

  padding: 9px 18px;

  border: 0;
  border-radius: 5px;

  background: #333;
  color: #fff;

  font-size: 14px;
  cursor: pointer;
}

.cookie-info-button:hover {
  opacity: 0.85;
}

.cookie-info-close {
  position: absolute;
  top: 8px;
  right: 10px;

  width: 28px;
  height: 28px;

  padding: 0;

  border: 0;
  background: transparent;

  color: #777;

  font-size: 22px;
  line-height: 28px;

  cursor: pointer;
}

.cookie-info-close:hover {
  color: #333;
}

@media (max-width: 600px) {
  .cookie-info-popup {
    bottom: 15px;
    width: auto;
    padding: 20px 22px 18px;
  }

  .cookie-info-title {
    font-size: 17px;
  }
}





/* -------------------------------------------------------------------------------------------------- */



/* ========================================
   Digitale Visitenkarte
   ======================================== */

/* Unterer Bereich der digitalen Visitenkarte */

.wesslinger-social {
    margin-top: 100px;
}

.wesslinger-social h2 {
    font-size: 30px;
    font-weight: 400;
    margin: 0 0 35px;
}

.wesslinger-instagram {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 10px 0 25px;
    color: #222;
    text-decoration: none;
}

.wesslinger-instagram-icon {
    width: 75px;
    height: 75px;
    object-fit: contain;
    flex-shrink: 0;
}

.wesslinger-instagram span:nth-child(2) {
    display: flex;
    flex-direction: column;
    gap: 5px;
    min-width: 0;
}

.wesslinger-instagram strong {
    font-size: 22px;
    font-weight: 400;
}

.wesslinger-instagram small {
    color: #999;
    font-size: 16px;
}

.wesslinger-pfeil {
    margin-left: auto;
    font-size: 35px;
    color: #888;
}

.wesslinger-speichern {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
    width: 100%;
    min-height: 85px;
    margin-top: 65px;
    padding: 20px;
    background: #a9c5a6;
    color: #111;
    text-decoration: none;
    text-align: center;
    font-size: 23px;
    border-radius: 3px;
}

.wesslinger-speichern:hover {
    background: #94b894;
}

.wesslinger-speichern span {
    font-size: 30px;
}

@media (max-width: 480px) {
    .wesslinger-social {
        margin-top: 85px;
    }

    .wesslinger-social h2 {
        font-size: 28px;
    }

    .wesslinger-instagram-icon {
        width: 65px;
        height: 65px;
    }

    .wesslinger-instagram strong {
        font-size: 20px;
    }

    .wesslinger-speichern {
        font-size: 21px;
        min-height: 75px;
        margin-top: 55px;
    }
}