/* Global Styles */

/* Bis Zeile 1413 ein-zeilig bei nur einer Regel pro Klasse  */

/* Table of contents 
Global Styles: 1 - 3916
Media query max 1200px: Zeile 3919 
Media query max 991px:  Zeile 4064 
Media query max 767px:  Zeile 4570
Media query max 576px:  Zeile 5067
Media query max 400px:  Zeile 5385
Basis-Divider           Zeile 5767
Tailwind                Zeile 5860
*/


/* *************************************************************
*  Beachte: Seit der CSS-Datei praxis-hybrid-v1006.css wird    *
*  ein Reset für die h-tags und p-tags vorgenommen!            *
*  - Bereinigun g der Klassen h3-under-photo,                  *
*    h3-under-photo-center und like-h3-under-photo             *
****************************************************************/

/* neue Klasse: .bewertungen-footer
/* alle Klassen google-Bwertungen gelöscht */

:root {
    /* Basis */
    --space-0: 0;
    --space-px: 1px;
    --space-0_5: 0.125rem;
    /* 2px */

    /* Kleine Abstände */
    --space-1: 0.25rem;
    /* 4px */
    --space-1_5: 0.375rem;
    /* 6px */
    --space-2: 0.5rem;
    /* 8px */
    --space-2_5: 0.625rem;
    /* 10px */
    --space-3: 0.75rem;
    /* 12px */
    --space-3_5: 0.875rem;
    /* 14px */
    --space-4: 1rem;
    /* 16px */

    /* Mittlere Abstände */
    --space-5: 1.25rem;
    /* 20px */
    --space-6: 1.5rem;
    /* 24px */
    --space-7: 1.75rem;
    /* 28px */
    --space-8: 2rem;
    /* 32px */
    --space-9: 2.25rem;
    /* 36px */
    --space-10: 2.5rem;
    /* 40px */
    --space-11: 2.75rem;
    /* 44px */
    --space-12: 3rem;
    /* 48px */

    /* Große Abstände */
    --space-14: 3.5rem;
    /* 56px */
    --space-16: 4rem;
    /* 64px */
    --space-20: 5rem;
    /* 80px */
    --space-24: 6rem;
    /* 96px */
    --space-28: 7rem;
    /* 112px */
    --space-32: 8rem;
    /* 128px */
    --space-36: 9rem;
    /* 144px */
    --space-40: 10rem;
    /* 160px */
}

body {
    background-color: #FFFFFF;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 16px;
    font-weight: normal;
    margin: 0px;
}

/* ==========================================================================
    GLOBAL STYLES & RESETS
   ========================================================================== 
   Aufhebung der Verschiebung der Sprungadressen, die durch das fixierte 
   Menü entstehen */

[id] {
    scroll-margin-top: 60px;
}

/* ✅ HIER: Typografie-Reset */
h1,
h2,
h3,
h4,
h5,
h6,
p {
    margin: 0;
    padding: 0;
}

/* ========================================================================== */

/* 2. Hero */
.hero {
    position: relative;
    width: 100%;
    max-height: 480px;
    /* Desktop Hero-Bild */
    overflow: hidden;
}

.hero-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.hero-background {
    width: 100%;
    max-width: 1920px;
    border-top: 1px solid rgba(153, 0, 0, 0.2);
    background: linear-gradient(to right,
            rgba(255, 255, 255, 1) 0%,
            rgba(153, 0, 0, 0.4) 100%);
}

/* ------------ Pop-Up ------------------- */

/* nur für Screenreader sichtbar, ist für eine Section, damit diese ein H-Tag bekommt
sonst bringt W3C einen Fehler: */

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

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

.popup {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 2000;
}

.popup:target {
    display: flex;
    justify-content: center;
    align-items: center;
}

.popup-overlay {
    position: absolute;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.6);
    z-index: 1;
}

.popup-box {
    position: relative;
    z-index: 2;
    background: #fff;
    padding: 30px 25px;
    border-radius: 8px;
    max-width: 500px;
    width: 90%;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.4);
    animation: popupFadeIn 0.4s ease;
    text-align: left;
}

.popup-text {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.1875rem;
    line-height: 1.7;
}

/* Schlie�en */
.popup-close {
    position: absolute;
    top: 10px;
    right: 15px;
    font-size: 1.8rem;
    text-decoration: none;
    color: #000;
    line-height: 1;
}

.popup-close:hover {
    color: #600;
}

/* Animation */
@keyframes popupFadeIn {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ===== Link ===== */
.popup-link {
    display: block;
    /* Link wie Block, damit Zentrierung funktioniert */
    width: fit-content;
    /* nur so breit wie der Text */
    margin: 0 auto;
    /* horizontal zentrieren */
    color: #600;
    /* urspr�ngliche Farbe beibehalten */
    text-decoration: underline;
    cursor: pointer;
    padding-top: 8px;
    padding-bottom: 8px
}

.popup-link:hover,
.popup-link:focus {
    color: #800;
    text-decoration: none;
}

/* ------------ Ende Pop-Up -------------- */

/* ------------ carousel Jameda ------------------- */

.carousel input[type="radio"] {
    display: none;
}

.carousel-items {
    position: relative;
    min-height: 150px;
}

.carousel-item {
    display: none;
    transition: opacity 0.3s ease;
}

#item1:checked~.carousel-items .carousel-item:nth-child(1),
#item2:checked~.carousel-items .carousel-item:nth-child(2),
#item3:checked~.carousel-items .carousel-item:nth-child(3),
#item4:checked~.carousel-items .carousel-item:nth-child(4) {
    display: block;
}

/* 09.10.2025 ausgeblendet
.carousel blockquote {
  background: #ffffff;
  border-left: 4px solid #0072c6;
  padding: 1em 1.5em;
  margin: 0 auto 1em auto;
  text-align: left;
  font-style: normal;
  color: #333;
}       */

/* 08.10.2025 21:34 Uhr
.carousel blockquote {
  background: #ffffff;
  border-left: 4px solid #ccc;
  padding: 1em 1.5em;
  margin: 1em auto;
  text-align: left;
  font-style: normal;
  color: #333;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
  max-width: 700px;
  width: 100%;
  box-sizing: border-box;
}  */

.margin-carousel {
    margin-top: clamp(36px, 5vw, 80px);
    margin-bottom: clamp(36px, 5vw, 80px);
}

.carousel {
    max-width: 100%;
    padding: 0 1em;
    margin: 0 auto;
    /* vorher 3em auto */
    text-align: center;
    font-family: inherit;
}

.carousel blockquote {
    background: #ffffff;
    border-left: 4px solid #0072c6;
    padding: 0.5em 1.5em 1rem 1.5rem;
    /* vorher 1em 1.5rem */
    margin: 1em auto;
    text-align: left;
    font-style: normal;
    color: #333;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
    max-width: 700px;
    width: 100%;
    box-sizing: border-box;
}

.carousel cite {
    display: block;
    margin-top: 0.5em;
    font-size: 0.9em;
    color: #666;
}

.carousel-nav {
    margin: 1em 0;
}

.carousel-nav label {
    display: inline-block;
    width: 12px;
    height: 12px;
    margin: 0 5px;
    background-color: #ccc;
    border-radius: 50%;
    cursor: pointer;
}

input#item1:checked~.carousel-nav label[for="item1"],
input#item2:checked~.carousel-nav label[for="item2"],
input#item3:checked~.carousel-nav label[for="item3"],
input#item4:checked~.carousel-nav label[for="item4"] {
    background-color: #333;
}

/* ----- ende Karussell --------------*/

.jameda-link {
    margin-top: 1em;
    font-size: 0.95em;
}

.jameda-link a {
    color: #0072c6;
    /* vorher  #0073aa  */
    text-decoration: underline;
}

/* ------------ Ende Karussell Bewertungen Jameda -------------- */


/* ------------------------- FAQ ------------------------------ */

/* -- Seite /psychotherapie-paderborn.html -- */
.faq-block {
    margin-bottom: 2em;
    border: 1px solid #ddd;
    padding: 1em;
    border-radius: 5px;
}

.faq-topic-title {
    font-weight: bold;
    font-size: 1rem;
    /* vorher 1.2em */
    cursor: pointer;
    padding-bottom: 0.5em;
}

.faq-entry {
    margin-top: 1em;
}

.faq-question {
    font-weight: 600;
    margin-bottom: 0.3em;
}

.faq-answer {
    margin-bottom: 1em;
    color: #444;
}

/* ---Ende /psychotherapie-paderborn.html --- */

.quotation-marks {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.5rem;
}

details {
    margin-bottom: clamp(0px, 5vw, 7px);
    font: 1.1875rem/1.3 Arial, Helvetica, sans-serif;
    text-align: left;
    letter-spacing: 0.03rem;
    padding-bottom: 5px;
}

/* Nur das Dreieck (Arrow) in #900 */
summary::marker {
    color: #900;
}

/* Der Fragetext selbst in #666 */
summary {
    color: #666;
    cursor: pointer;
    /* optional: zeigt Handcursor an */
}

/* Zeige Marker wieder an, wenn Klasse .with-marker vorhanden ist, da bei dem accordion ausgeblendet*/
summary.with-marker {
    list-style: revert;
    /* setzt den Standardwert wieder */
}

summary.with-marker::-webkit-details-marker {
    display: inline;
    /* oder "initial" � beides funktioniert */
}

/* Antwort-Abs�tze */
.p-faq {
    margin-top: 8px;
    line-height: 1.5;
}

.p-faq-last-p-answer {
    margin-top: 8px;
    margin-bottom: 20px;
    line-height: 1.5;
}

/* ----details als Button Version ------*/
/* Details-Container */
.details-accordion {
    border: 1px solid #900;
    /* vorher #007bff */
    border-radius: 8px;
    padding: 1rem;
    margin: 1.5rem 0;
    background: #f8f9fa;
}

/* Summary als Button */
/*.details-accordion summary {
  background: #900;    /* vorher #007bff */
/*  color: white;
  padding: 0.75rem 1.5rem;
  border-radius: 4px;
  cursor: pointer;
  display: inline-block;
  font-weight: normal;  /* vorher bold */
/*  list-style: none;
}
*/
.details-accordion summary {
    background: #900;
    color: white;
    padding: 0.75rem 1.5rem;
    border-radius: 4px;
    cursor: pointer;
    display: block;
    /* Statt inline-block! */
    width: 100%;
    /* Volle Breite */
    box-sizing: border-box;
    /* Padding einrechnen */
    font-weight: normal;
    list-style: none;
}

details summary {
    list-style: none;
}

/* entfernt den Standard-Pfeil in manchen Browsern */

details summary::-webkit-details-marker {
    display: none;
}

/* entfernt den Pfeil in WebKit-Browsern (Chrome, Safari) */


/* Entfernt Standard-Pfeil in Webkit-Browsern (Chrome, Safari) */
.details-accordion summary::-webkit-details-marker {
    display: none;
}

/* Hover-Effekt */
.details-accordion summary:hover {
    background: #5f4741;
}

/* vorher #0056b3; oder #7D2525 */

/* Optionaler Pfeil-Indikator */
.details-accordion summary::before {
    display: inline-block;
    transition: transform 0.2s;
    margin-right: 0.5rem;
}

/* Pfeil dreht sich bei ge�ffnetem Zustand */
.details-accordion[open] summary::before {
    transform: rotate(90deg);
}

/* Styling f�r den aufgeklappten Inhalt */
.details-accordion[open] {
    padding-bottom: 1.5rem;
}

/* Abstand zwischen Summary und Content */
.details-accordion summary+* {
    margin-top: 1rem;
}

/* ------------------------- Ende FAQ ------------------------- */

.headline-glossar {
    font-size: 24px;
    line-height: 70px;
    color: #fff;
    letter-spacing: 0.05em;
    margin-top: 7px !important;
    background-color: #900;
    padding-left: 10px;
}

.line-top-without-margin {
    border-top: 1px solid #CCCCCC;
    background-color: #FFFFFF;
    box-sizing: border-box;
}

.line-bottom-without-margin {
    border-bottom: 1px solid #CCCCCC;
    background-color: #FFFFFF;
    box-sizing: border-box;
}

.div-glossar-table {
    background-color: #FFFFFF;
    max-width: 600px;
    margin-right: auto;
    margin-left: auto;
    padding-left: 30px;
    padding-right: 30px;
    box-sizing: border-box;
}

.div-glossar {
    background-color: #FFFFFF;
    max-width: 540px;
    margin-right: auto;
    margin-left: auto;
    padding-left: 30px;
    padding-right: 30px;
    box-sizing: border-box;
}

details[close] {
    margin-bottom: 7px;
    font: 1.1875rem/1.7 Arial, Helvetica, sans-serif;
    color: #900;
    text-align: left;
    letter-spacing: 0.03rem;
}

.details-close-faq {
    margin-bottom: 7px;
    font: 1.1875rem/1.7 Arial, Helvetica, sans-serif;
    color: #900;
    text-align: left;
    letter-spacing: 0.03rem;
    line-height: 1.3;
    padding-bottom: 5px;
}

summary::marker {
    cursor: pointer;
}

.p-glossar-last-p {
    margin-top: 0;
    margin-bottom: 20px;
    line-height: 1.5;
}

.p-glossar {
    margin-top: 0;
    line-height: 1.5;
}

/* --- end glossar and faq ---*/

.div-container {
    width: 100%;
    height: 100%;
    box-sizing: border-box;
}

.div-page {
    width: 100%;
    box-sizing: border-box;
}

/***********************************************************************************************************************/
/* ---Beachte: Durch diese Klasse wird der zus�tzliche Rand nach unten, der automatisch erzeugt wird, verhindert! -----*/
/***********************************************************************************************************************/
.div-page-without-edge {
    width: 100%;
    box-sizing: border-box;
    padding-top: 80px;
    padding-bottom: 70px;
    overflow: hidden;
}

.divider--section-top-100-div-page-edge {
    margin-top: clamp(0px, 5vw, 50px);
    /* responsive Aufstockung */
}

/* ------------------------------------------------------------------------------------------------------------------- */
.div-100 {
    background-color: #FFFFFF;
    max-width: 1170px;
    margin-right: auto;
    margin-left: auto;
    box-sizing: border-box;
}

/* Achtung hier war ein Fehler im Namen alt:  div-100-background-#900 - neu: div-100-background-#900    */
.div-100-background-900 {
    background-color: #900;
    max-width: 1170px;
    margin-right: auto;
    margin-left: auto;
    box-sizing: border-box;
}

.div-active {
    background-color: #FFFFFF;
    max-width: 1200px;
    margin-right: auto;
    margin-left: auto;
    padding-left: 30px;
    padding-right: 30px;
    box-sizing: border-box;
}

.div-1140 {
    background-color: #FFFFFF;
    max-width: 1140px;
    margin-right: auto;
    margin-left: auto;
    box-sizing: border-box;
}

.div-old-width {
    background-color: #FFFFFF;
    max-width: 675px;
    margin-right: auto;
    margin-left: auto;
    box-sizing: border-box;
}

.div-active-menu {
    background-color: #FFFFFF;
    max-width: 1200px;
    margin-right: auto;
    margin-left: auto;
    padding-left: 20px;
    padding-right: 30px;
    box-sizing: border-box;
}

.div-text {
    background-color: #FFFFFF;
    max-width: 840px;
    margin-left: 383px;
    margin-right: 697px;
    box-sizing: border-box;
}

/*  ---- faq-container ----*/
.faq-container {
    max-width: 834px;
    padding: 0 17px;
    margin: 0 auto;
    box-sizing: border-box;
}

/* --- ende faq-container ---*/

/*  ---- Studie ----*/

.faq-container-studie {
    max-width: 834px;
    padding: 20px 17px;
    margin: 40px auto;
    background-color: #f9f9f9;
    border-left: 4px solid #8aacc8;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
    box-sizing: border-box;
}

.faq-headline {
    margin-top: 0;
    font-size: 1.4em;
}

/* .study-highlight {
  border: 1px solid #e2e2e2;
  background-color: #f9f9f9;
  padding: 20px;
  display: flex;
  align-items: flex-start;
  gap: 15px;
  margin: 40px auto;
}

.study-icon img {
  width: 50px; 
  height: auto;
}

.study-content h2 {
  margin-top: 0;
  font-size: 1.4em;
  color: #333;
}

.study-content p {
  line-height: 1.6;
  margin: 0 0 15px 0;
  color: #555;
}

.study-content .study-source {
  font-size: 0.9em;
  color: #777;
  margin-top: 10px;
}
/*  ---- Ende Studie ----*/

.div-flexbox-zentrieren {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 360px;
    margin-bottom: 60px;
    box-sizing: border-box;
}

.div-flexbox-photo {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.div-box {
    width: 25%;
}

.bubble {
    position: relative;
    width: 100%;
    background: #900;
    border-radius: 30px;
}

.bubble-bottom-left:before {
    content: "";
    width: 0px;
    height: 0px;
    position: absolute;
    border-left: 20px solid #900;
    border-right: 12px solid transparent;
    border-top: 12px solid #900;
    border-bottom: 20px solid transparent;
    left: 50px;
    bottom: -30px;
}

.kinder-leiden-am-meisten {
    background-image: url("/images/leistungen/therapieangebote/eheberatung-paderborn/kinder-leiden-am-meisten-1140.jpg");
    left: 0px;
    top: 0px;
    height: 620px;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.videosprechstunde-paartherapie {
    background-image: url("/images/leistungen/therapieangebote/videosprechstunde-paartherapie-570.jpg");
    height: 321px;
    max-width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.essstoerung-hilfe-online {
    background-image: url("/images/leistungen/therapieangebote/essstoerung-hilfe-online-570.jpg");
    height: 348px;
    max-width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.eheberatung-paderborn {
    background-image: url("/images/leistungen/therapieangebote/eheberatung-paderborn/eheberatung-paderborn-570.jpg");
    height: 347px;
    max-width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.paartherapie-online {
    background-image: url("/images/leistungen/therapieangebote/paartherapie-online-570.jpg");
    height: 347px;
    max-width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.div-text-photo {
    background-color: #FFFFFF !important;
    max-width: 82.46%;
    margin-top: -200px;
    margin-left: auto;
    margin-right: auto;
    padding: 10px 8.77% 0px 8.77%;
    box-sizing: border-box;
}

/* ----- divider ---------------------*/

.hr-footer {
    border: 1px;
    border-style: solid;
    color: #FFF;
    margin-left: 335px;
    margin-right: 335px;
}

.hr-footer-divider {
    height: 1px;
    background-color: #fff;
    border: none;
    transform: scaleY(0.5);
}

.line-without-margin {
    border-bottom: 1px solid #CCCCCC;
    background-color: #FFFFFF;
    box-sizing: border-box;
}

.line-top {
    border-top: 1px solid #CCCCCC;
    background-color: #FFFFFF;
    margin-top: 25px;
    margin-bottom: 60px;
    box-sizing: border-box;
}

.line {
    border-bottom: 1px solid #CCCCCC;
    background-color: #FFFFFF;
    margin-top: 25px;
    margin-bottom: 60px;
    box-sizing: border-box;
}

/* --- alt bis 02.11.2025 ----
.line-bold  {
    border-bottom: 3px solid #000;
    background-color: #FFFFFF;
    margin-bottom: 30px;
    box-sizing: border-box; 
}
---- */

.line-bold {
    border-bottom: 3px solid #000;
    background-color: #FFFFFF;
    margin-bottom: 30px;
    box-sizing: border-box;
    overflow: hidden;
    /* verhindert Margin-Collapsing */
}

.line-breadcrumb {
    border-bottom: 1px solid #CCCCCC;
    max-width: 1140px;
    width: 100%;
    margin-right: auto;
    margin-left: auto;
    padding-bottom: 16px;
    box-sizing: border-box;
}

/* --------- end divider -------------*/
.div-logo {
    float: left;
    margin-top: 30px;
    margin-bottom: 17px;
    width: 32%;
}

.div-logo-mobile {
    display: none;
}

.div-logo-left {
    float: left;
    box-sizing: border-box;
}

.div-logo-right {
    float: right;
    margin-top: 23px !important;
}

.div-display-none-inline {
    display: none;
}

.div-display-inline-none {
    display: inline;
}

/* ---- table first row website ---- */
.div-flex-first-row {
    border-collapse: collapse;
    display: flex;
    flex-wrap: wrap;
    box-sizing: border-box;
}

.div-flex-wrap {
    border-collapse: collapse;
    display: flex;
    flex-wrap: wrap;
}

.border-radius-20px {
    border-radius: 20px;
}

.border-collapse-collapse {
    border-collapse: collapse;
}

.photo-top {
    position: absolute;
    clip: rect(0px 1920px 540px 0px);
    overflow: hidden;
    box-sizing: border-box;
}

#photo-top-size {
    width: 1920px;
    height: 540px;
    box-sizing: border-box;
}

.photo-top-1 {
    margin-bottom: -4px;
}

.photo-top-2 {
    display: none;
}

/* ---- icons ---- */
.whatsapp-icon-center {
    background: url(images/icons/whatsapp.png) no-repeat center center;
    display: flex;
}

.mail-icon-center {
    background: url(images/icons/mail.png) no-repeat center center;
    display: flex;
}

.height-160 {
    height: 160px;
}

#logo {
    margin-top: 25px;
    margin-bottom: 25px;
}

.div-info-red-neues {
    position: relative;
    background-color: #900;
    padding: 60px 60px 61px 60px;
    text-align: center;
    margin-bottom: 70px;
}

.div-info-white-neues {
    position: relative;
    background-color: #FFF;
    padding: 25px;
    text-align: center;
    margin-bottom: 70px;
}

.div-info-red {
    position: relative;
    background-color: #900;
    padding: 50px;
    text-align: center;
    margin: 70px 50px 70px 50px;
}

.div-info-white {
    position: relative;
    background-color: #FFF;
    padding: 50px;
    text-align: center;
    margin: 70px 50px 70px 50px;
}

.div-clear {
    clear: both;
}

.div-photo-1 {
    width: 29.06%;
    vertical-align: top;
    float: left;
    margin-bottom: 60px;
}

.div-photo-2 {
    width: 29.06%;
    vertical-align: top;
    float: left;
    margin-left: 30px;
}

.div-photo-3 {
    width: 29.06%;
    vertical-align: top;
    float: left;
    margin-left: 30px;
}

.div-photo-4 {
    width: 29.06%;
    vertical-align: top;
    float: left;
}

.div-foto-li-blog {
    width: 30.43%;
    vertical-align: top;
    float: left;
}

.div-text-re-blog {
    width: 63.87%;
    vertical-align: top;
    float: right;
}

.div-flexcontainer-center {
    display: flex;
    justify-content: center;
}

.div-flexcontainer {
    display: flex;
    flex-wrap: wrap;
}

.div-flexcontainer-modern {
    display: flex;
    flex-wrap: wrap;

    /* Abstand zwischen Zeilen (wenn Boxen umbrechen) */
    row-gap: clamp(2.5rem, 6vw, 3.75rem);
    /* Mobile 40px → Desktop 60px */

    /* Abstand zwischen Boxen nebeneinander */
    column-gap: 1.875rem;
    /* 30px */
}

.div-flex-left-40 {
    width: 40%;
    float: left;
    box-sizing: border-box;
}

.div-flex-right-60 {
    width: 60%;
    float: right;
    padding-bottom: 30px;
    border: 1px solid #990000;
    box-sizing: border-box;
}

.div-flex-left {
    width: 50%;
    float: left;
    box-sizing: border-box;
}

.div-flex-right {
    width: 50%;
    float: right;
    border: 1px solid #990000;
    box-sizing: border-box;
}

.div-photo-le-blog {
    width: 48.69%;
    float: left;
}

.div-text-ri-blog {
    width: 48.69%;
    float: right;
}

.div-photo-le-blog-long-text {
    width: 48.69%;
    float: left;
}

.div-text-long-ri-blog {
    width: 48.69%;
    float: right;
}

.div-text-ri-blog-51 {
    width: 51.31%;
    float: right;
}

.div-flex-1-colum-center {
    width: 360px;
    box-sizing: border-box;
}

.div-flex-2-colums {
    width: 555px;
    float: left;
    margin-bottom: 30px;
    box-sizing: border-box;
}

.div-flex-3-colums {
    width: 360px;
    float: left;
    margin-bottom: clamp(2.5rem, 6vw, 3.75rem);
    /* 40px → 60px vertikal */
    box-sizing: border-box;
}

.div-flex-3-colums-modern {
    width: 360px;
    box-sizing: border-box;
}

.div-flex-3-colums.last {
    margin-bottom: 0;
}

.div-2-colums-gap {
    width: 30px;
    float: left;
    box-sizing: border-box;
}

.div-3-colums-gap {
    width: 30px;
    float: left;
}

.div-flex-center {
    width: 370px;
    margin-bottom: 60px;
    box-sizing: border-box;
}

.div-nav-left {
    float: left;
    box-sizing: border-box;
}

.div-nav-right {
    float: right;
    box-sizing: border-box;
}

.div-float-left-48-69-percent-991-one-colomn {
    width: 48.68%;
    float: left;
    box-sizing: border-box;
}

.div-float-left-50-percent-991-one-colomn {
    width: 50%;
    float: left;
    box-sizing: border-box;
}

.div-column-left {
    width: 50%;
    vertical-align: top;
    float: left;
    padding-bottom: 10px;
    box-sizing: border-box;
}

.div-column-left-single-column-708px {
    display: none;
}

.div-column-left-single-column-517px {
    display: none;
}

.div-column-left-single-column-366px {
    display: none;
}

.div-column-right {
    width: 50%;
    vertical-align: top;
    float: right;
    padding-bottom: 30px;
    border: 1px solid #990000;
    box-sizing: border-box;
}

/* ---- Separetors ---- */
.separator-1 {
    background-image: url("/images/blog/seelische-gesundheit-paderborn/blog-seelische-gesundheit-small.jpg");
}

/* ---- End Separetors ---- */

/* ---- First Row ---- */
.div-box-offer-1 {
    width: 25%;
    background-color: #7D2525;
}

.div-box-offer-2 {
    width: 25%;
    background-color: #990000;
}

.div-box-offer-3 {
    width: 25%;
    background-color: #C00000;
}

.div-box-offer-4 {
    width: 25%;
    background-color: #E01919;
}

/* alt 09.10.2025      
.foto {
	width: 100% !important;
    height: auto !important;
    box-sizing: border-box; 
}  */

.foto {
    width: 100% !important;
    height: auto !important;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: none;
    display: block;
    vertical-align: middle;
}

.foto-logo {
    width: 100%;
    height: auto;
    box-sizing: border-box;
}

.foto-verlinken {
    border: none;
}

.foto-top2 {
    width: 100%;
    height: 56.21%;
    box-sizing: border-box;
}

/* html5 */
.photo-container {
    margin: 0;
    padding: 0;
    display: inline-block;
    max-width: 100%;
    text-align: left;
    /*  margin-bottom: 2rem;   */
}

.photo {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 0;
    padding: 0;
    border: none;
}

.subtitle {
    font-family: Arial, Helvetica, sans-serif;
    letter-spacing: 0.03rem;
    background-color: #F5F5F5;
    color: #444;
    padding: 0.75rem 1rem;
    font-size: 0.875rem;
    line-height: 1.5;
    margin-top: 0;
}

.subtitle-background-white {
    background-color: #FFF !important;
    border-right: 1px solid #E0E0E0;
    border-bottom: 1px solid #E0E0E0;
    border-left: 1px solid #E0E0E0;
}

/* -------------- end photo ---------------------*/

.div-seminar-sp-li {
    width: 12%;
    float: left;
}

.div-seminar-sp-re {
    width: 88%;
    float: left;
}

/* Zum Seitenanfang */

.info-offer span {
    font: 16px Arial, Helvetica, sans-serif;
    font-weight: normal;
    line-height: 30px;
    color: #FFFFFF;
    position: relative;
    text-decoration: none;
    bottom: 30px;
    left: 45px;
    display: block;
    float: left;
    padding-bottom: 26px;
}

.info-offer a {
    font: 14px Arial, Helvetica, sans-serif;
    font-weight: bold;
    line-height: 30px;
    color: #990000;
    background-color: #FFFFFF;
    position: relative;
    text-decoration: none;
    height: 30px;
    width: 30px;
    bottom: 10px;
    left: 35px;
    /*  opacity: 0.6; */
    display: block;
    text-align: center;
    border-radius: 50px;
    float: left;
}

.info-offer a:hover {
    color: #FFF;
    background-color: #3D3824;
}

.zum-seitenanfang a {
    font: 16px Arial, Helvetica, sans-serif;
    font-weight: bold;
    line-height: 50px;
    color: #FFFFFF;
    background-color: #666F7C;
    position: fixed;
    text-decoration: none;
    height: 50px;
    width: 50px;
    bottom: 35px;
    right: 35px;
    opacity: 0.6;
    display: block;
    text-align: center;
    border: 1px solid #666F7C;
    border-radius: 50px;
}

.zum-seitenanfang a:hover {
    font: 16px Arial, Helvetica, sans-serif;
    font-weight: bold;
    line-height: 50px;
    color: #00AA00;
    background-color: #FFFFFF;
    border: 1px solid #666F7C;
}

.fixiert-zum-seitenanfang {
    position: sticky;
    left: 1027px;
    top: 600px;
    height: 50px;
    width: 5.5928%;
    z-index: 999;
    opacity: 0.5;
    display: block;
    text-align: center;
    border: 1px solid #009900;
    border-radius: 4px;
    text-decoration: none;
    font: 16px Arial, Helvetica, sans-serif;
    color: #FFFFFF;
    background-color: #009900;
}

/* Zum Seitenanfang */

/* ---- End page layout ---- */

/**  Navigation  **/

/**  Navigation wird als einfarbiger, horizontaler Balken dargestellt  **/
nav {
    font-family: Arial, Helvetica, sans-serif;
    display: block;
    /*	text-align: center;
    padding: 20px;  */
    padding: 20px 0px;
    background: #FFFFFF;
}

nav ul {
    padding: 0px;
    margin: 0px;
    width: 100%;
}

nav ul li {
    display: inline;
    /*    padding-left: 22px;    
    padding-right: 15px;   */
    padding-right: 20px;
    background: #FFF;
}

.li-link {
    /*    font-family: Arial, Helvetica, sans-serif;  */
    font: 15px Arial, Helvetica, sans-serif;
    text-transform: uppercase;
    color: #666F7C !important;
    letter-spacing: 0.0625em;
    text-decoration: none;
    padding: 17px 10px;
}

.li-link:hover {
    color: #FFFFFF !important;
    background-color: #990000;
}

.li-link-termin {
    display: none;
}

/** Label wird ausgeblendet **/
label.open-menu-label {
    display: none;
}

/** Anpassungen Checkbox+Label (Button) **/

input#open-menu {
    display: none;
}

.fixiert_menue {
    position: sticky;
    top: 0px;
    /*   height: 60px;  */
    width: 100%;
    z-index: 999;
    box-sizing: border-box;
}

.fixiert_menue_desktop {
    position: sticky;
    top: 0px;
    /*   height: 60px;  */
    width: 100%;
    z-index: 999;
    background-color: #FFF;
    box-sizing: border-box;
}

.fixiert_menue_mobile {
    display: none;
}

/**  End navigation  **/

.block {
    display: block;
}

/* ---- Ende ID and styles breadcrumb ---- */


/* ---- padding and margin ---- */
.padding-h1-index {
    padding-left: 120px;
}

.padding-h3-red-box {
    padding: 10px 40px 5px 40px;
}

.padding-p-red-box {
    padding: 2px 40px 3px 40px;
}

.padding-button-left-red-box {
    padding: 6px 40px 18px 40px;
}

.padding-top-text {
    padding-top: 2.8%;
}

.padding-16-9 {
    padding-top: 56.25%;
}

.padding-top-1-2em {
    padding-top: 1.2em;
}

.padding-top-2-5-proz {
    padding-top: 3.3%;
}

.padding-left-right-0 {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.padding-top-1 {
    padding-top: 1px;
}

/* mit diesem padding-top wird das beeinflussen von padding und margin verhindert wird */

.padding-top-7 {
    padding-top: 7px;
}

.padding-top-10 {
    display: block;
    padding-top: 10px !important;
}

.padding-top-15 {
    display: block;
    padding-top: 15px !important;
}

.padding-top-20 {
    padding-top: 20px;
}

.padding-top-30 {
    padding-top: 30px;
}

.padding-top-35px {
    padding-top: 35px;
}

.padding-top-40 {
    padding-top: 3.5%;
}

.padding-top-40px {
    padding-top: 40px;
}

.padding-top-50px {
    padding-top: 50px !important;
}

.padding-top-60 {
    padding-top: 60px !important;
}

.padding-top-80 {
    padding-top: 80px;
}

.padding-top-bottom-80px {
    padding-top: 80px;
    padding-bottom: 80px;
}

.padding-top-105px {
    padding-top: 105px;
}

.padding-bottom-2-15-proz {
    padding-bottom: 3.1%;
}

.padding-bottom-text {
    padding-bottom: 2.8%;
}

.padding-bottom-1px {
    padding-bottom: 1px;
}

.padding-bottom-10 {
    padding-bottom: 10px;
}

.padding-bottom-15px {
    padding-bottom: 12px;
}

.padding-bottom-20 {
    padding-bottom: 20px;
}

.padding-bottom-23px {
    padding-bottom: 23px;
}

.padding-bottom-26 {
    padding-bottom: 26px;
    display: block;
}

.padding-bottom-30 {
    padding-bottom: 30px;
}

.padding-bottom-40px {
    padding-bottom: 40px;
}

.padding-bottom-45px {
    padding-bottom: 45px !important;
}

.padding-bottom-50px {
    padding-bottom: 50px;
}

.padding-bottom-60 {
    padding-bottom: 60px;
}

.padding-bottom-70px {
    padding-bottom: 70px;
}

.padding-bottom-80px {
    padding-bottom: 80px;
}

.padding-30 {
    padding: 0 30px 0 30px;
}

.padding-50 {
    padding: 0 50px 0 50px;
}

.padding-180 {
    padding: 0 180px 0 180px;
}

.padding-200 {
    padding: 0 200px 0 200px;
}

.margin-link-footer {
    margin: 6px 0 6px 0;
    display: inline-block;
}

.margin-link-footer-first {
    margin: 7px 0 6px 0;
    display: inline-block;
}

.margin-link-footer-photo-proof {
    margin: 35px 0 5px 0;
    display: inline-block;
}

.margin-link-footer-second-in-a-row {
    margin: 0 0 5px 0;
    display: inline-block;
}

.margin-top-vertrauen {
    margin-top: -25px !important;
}

.margin-top-over-photo {
    margin-top: 70px !important;
}

.margin-bottom-under-photo {
    margin-bottom: 60px !important;
}

.margin-top-min-4px {
    margin-top: -4px;
}

.margin-top-min-7px {
    margin-top: -7px;
}

.margin-top-min-12px {
    margin-top: -12px;
}

.margin-top-min-25px {
    margin-top: -25px;
}

.margin-top-min-50px {
    margin-top: -50px;
}

.margin-top-5-proz {
    margin-top: 5% !important;
}

.margin-top-2-5-rem {
    margin-top: 2.5rem;
}

.margin-top-4-5-rem {
    margin-top: 4.5rem;
}

.margin-top-10px {
    margin-top: 10px;
}

/* für footer notwenig - nicht löschen! */

.margin-top-20px {
    margin-top: 20px;
}

.margin-top-21px {
    margin-top: 21px;
}

.margin-top-25px {
    margin-top: 25px;
}

.margin-top-30 {
    margin-top: 30px;
}

.margin-top-30px {
    margin-top: 30px;
}

.margin-top-37px {
    margin-top: 37px !important;
}

/* für footer notwenig - nicht löschen! */

.margin-top-40 {
    margin-top: 40px;
}

.margin-top-40px {
    margin-top: 40px;
}

.margin-top-50px {
    margin-top: 50px !important;
}

.margin-top-50 {
    margin-top: 5.59%;
}

.margin-top-60 {
    margin-top: 60px;
}

.margin-top-60px {
    margin-top: 60px;
}

.margin-top-70px {
    margin-top: 70px;
}

.margin-top-80px {
    margin-top: 80px !important;
}

.margin-top-90 {
    margin-top: 10.07%;
}

.margin-top-100px {
    margin-top: 100px !important;
}

.margin-photo-blogpost {
    margin-bottom: 12px !important;
}

.margin-bottom-box {
    margin-bottom: 12px !important;
}

.margin-bottom-box-two {
    margin-bottom: 42px !important;
}

.margin-bottom-box-several-colums-two-one {
    margin-bottom: 20px !important;
}

.margin-bottom-0 {
    margin-bottom: 0px !important;
}

.margin-bottom-min-4px {
    margin-bottom: -4px !important;
}

.margin-bottom-min-10px {
    margin-bottom: -10px !important;
}

.margin-bottom-min-20px {
    margin-bottom: -20px !important;
}

.margin-bottom-min-30px {
    margin-bottom: -30px !important;
}

.margin-bottom-min-50px {
    margin-bottom: -50px !important;
}

.margin-bottom-20px {
    margin-bottom: 20px;
}

.margin-bottom-30px {
    margin-bottom: 30px;
}

.margin-bottom-37px {
    margin-bottom: 37px;
}

.margin-bottom-40px {
    margin-bottom: 40px;
}

.margin-bottom-50px {
    margin-bottom: 50px;
}

.margin-bottom-60px {
    margin-bottom: 60px;
}

.margin-bottom-70px {
    margin-bottom: 70px;
}

.margin-bottom-75px {
    margin-bottom: 75px;
}

.margin-bottom-80px {
    margin-bottom: 80px;
}

.margin-bottom-90px {
    margin-bottom: 90px;
}

.margin-bottom-90 {
    margin-bottom: 10.07%;
}

.margin-bottom-100px {
    margin-bottom: 100px;
}

.margin-bottom-120px {
    margin-bottom: 120px;
}

.margin-logo {
    margin-top: 24px;
    margin-bottom: 14px;
}

.margin-footer {
    margin-bottom: 50px;
}

/* ---- End padding and margin ---- */

/* ---- line height ---- */
.line-height-1 {
    line-height: 1 !important;
}

.line-height-1-2 {
    line-height: 1.2 !important;
}

.line-height-1-3 {
    line-height: 1.3 !important;
}

.line-height-1-4 {
    line-height: 1.4 !important;
}

.line-height-1-5 {
    line-height: 1.5 !important;
}

.line-height-1-6 {
    line-height: 1.6 !important;
}

.line-height-1-7 {
    line-height: 1.7 !important;
}

.line-height-2-0 {
    line-height: 2.0 !important;
}

/* ---- end line height ---- */

/* ---- Styles colors ---- */
.color-004c99 {
    color: #004c99 !important;
}

.color-FFF {
    color: #FFF !important;
}

.color-000 {
    color: #000 !important;
}

.color-000C0F {
    color: #000C0F !important;
}

.font-color-1662c6 {
    color: #1662c6 !important;
}

.font-color-1b2734 {
    color: #1b2734 !important;
}

.color-131313 {
    color: #131313 !important;
}

.color-666F7C {
    color: #666F7C !important;
}

.color-F00 {
    color: #F00;
}

.color-444 {
    color: #444 !important;
}

.color-E30B0B {
    color: #E30B0B !important;
}

.color-600 {
    color: #660000 !important;
}

.color-666 {
    color: #666 !important;
}

.color-900 {
    color: #990000 !important;
}

.font-color-900 {
    color: #900 !important;
}

.font-size-1 {
    font-size: 1rem !important;
}

.font-size-1-25 {
    font-size: 1.25rem !important;
    /* =20px für Icon IHV */
}

.size-1-7-5 {
    font-size: 1.75rem !important;
}

.div-background-mobile-menu {
    display: none;
}

.background-color-F5F4B3 {
    background-color: #FFF9D1 !important;
}

.background-color-E8E8E8 {
    background-color: #E8E8E8 !important;
}

.background-color-F0F0F0 {
    background-color: #F0F0F0 !important;
}

.background-color-F5F5F5 {
    background-color: #F5F5F5 !important;
}

.background-color-F7F7F7 {
    background-color: #F7F7F7 !important;
}

.background-color-FFF {
    background-color: #FFFFFF;
}

.background-color-600 {
    background-color: #600;
}

.background-color-900 {
    background-color: #900 !important;
}

.background-color-990000 {
    background-color: #990000 !important;
}

.background-color-7D2525 {
    background-color: #7D2525 !important;
}

.background-color-C00000 {
    background-color: #C00000 !important;
}

.background-color-B4BBC5 {
    background-color: #B4BBC5;
}

.background-color-FFAAB1 {
    background-color: #FFAAB1;
}

.background-white {
    background-color: #FFFFFF;
}

/* Ende styles colors */

/* ---- Styles headlines ---- */
h1 {
    font-family: Arial, Helvetica, sans-serif;
    color: #990000;
    font-size: 2.625rem;
    font-weight: normal;
    line-height: 1.2;
    letter-spacing: 0.01rem;
}

.h1 {
    font-family: Arial, Helvetica, sans-serif;
    color: #990000;
    font-size: 2.625rem;
    font-weight: normal;
    line-height: 1.2;
    letter-spacing: 0.01rem;
}

.h1-head {
    color: #131313;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1rem;
    font-weight: normal;
    line-height: 1.2;
    letter-spacing: 0.05rem;
    float: left;
    padding-top: 15px;
    /*  zus�tzlich von h1-head und h1 einzeln steuern zu k�nnen */
    display: block;
    margin-bottom: 0.1em;
    /* verringert Abstand zur n�chsten Zeile */
    width: 100%;
}

/*
.h1-head {
  display: block;
  font-size: 1.5em;
  font-weight: bold;
  margin-bottom: 0.1em; /* verringert Abstand zur n�chsten Zeile */
/*} */
.h1-sub {
    display: block;
    font-size: 1em;
    font-weight: normal;
    width: 100%;
}

.h1-index {
    font-size: 1.875rem;
}

/* alt 2.625rem */

.long-h1 {
    font-size: clamp(1.75rem, 5vw, 2.625rem);
    line-height: 1.2;
    /* optional, kompakter auf Mobile */
}

.h1-leistungen {
    font-size: 2.125rem;
    margin-top: 22px;
    text-align: center;
}

.h1-kontakte {
    font-size: 2.125rem;
}

.style-h1 {
    margin-top: 3.125rem;
    padding-left: 126px;
    padding-right: 126px;
}

h2 {
    color: #131313;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.875rem;
    font-weight: normal;
    line-height: 1.3;
    letter-spacing: 0.005rem;
}

.heading-style-h2 {
    color: #131313;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.875rem;
    font-weight: normal;
    line-height: 1.3;
    letter-spacing: 0.005rem;
}

.h2 {
    color: #131313;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.875rem;
    font-weight: normal;
    line-height: 1.3;
    letter-spacing: 0.005rem;
}

.h2-leistungen {
    text-align: center;
    margin-top: 40px;
    margin-bottom: -5px;
}

.h2-over-photos {
    text-align: center;
    padding-top: 15px;
    margin-bottom: 55px;
}

.h2-leistungen-bild {
    text-align: center;
    margin-bottom: 33px;
}

.h2-blog-li {
    margin-bottom: 32px;
}

.h2-ohne-h1 {
    margin-top: 0rem;
}

.h2-ohne-h3 {
    margin-bottom: -3px;
}

.h2-ohne-foto-oben {
    font-size: 1.188rem;
    font-weight: normal;
    margin-top: -0.938rem !important;
    margin-bottom: 1.188rem;
}

h2.tabelle {
    color: #990000;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1rem;
    font-weight: bold;
    letter-spacing: .0005rem;
    padding-top: 0rem !important;
}

h2.normal {
    color: #990000;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1rem;
    font-weight: bold;
    letter-spacing: .0005rem;
    padding-top: 0.438rem;
}

.h2-blog {
    text-transform: none;
    font: 3.125rem Arial, Helvetica, sans-serif !important;
    font-weight: normal;
    line-height: 3.25rem !important;
    color: #FFFFFF !important;
    margin-top: 0rem !important;
}

.h2-blog-unter-foto {
    font: 2.0rem Arial, Helvetica, sans-serif !important;
    color: #900;
}

.h2-index {
    font-size: 1.25rem;
    line-height: 24px;
    color: #444444;
    letter-spacing: 0.005em;
    margin-top: 35px !important;
    margin-bottom: 23px !important;
    text-align: center;
}

.h2-linkbox {
    font-size: 24px;
    line-height: 28px;
    color: #444444;
    letter-spacing: 0.005em;
    margin-top: 35px !important;
    margin-bottom: 35px !important;
    text-align: center;
}

.h2-interessante-inhalte {
    font: 1.579rem Arial, Helvetica, sans-serif !important;
    font-weight: bold !important;
    margin-bottom: 25px !important;
}

h3 {
    color: #990000;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.5rem;
    font-weight: normal;
    line-height: 1.3;
    letter-spacing: 0;
    display: block;
}

.heading-style-h3 {
    color: #990000;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.5rem;
    font-weight: normal;
    line-height: 1.3;
    letter-spacing: 0;
    display: block;
}

/* ---- Diese Regel gilt f�r alle ul-atgs, die nach einem h3-tag kommen ---- */
/* h3 + ul {margin-top: -8px !important;}
/* ---- Ende Regel gilt f�r alle ul-atgs, die nach einem h3-tag kommen ---- */

.faq-drop-down-menu {
    margin-top: -30px;
    padding-left: 25px
}

.h3-in-text {
    color: #990000;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.5rem;
    font-weight: normal;
    line-height: 1.3;
    letter-spacing: 0;
    display: block;
}

.h3-text {
    margin-top: 2.5rem;
}

.h3-presse {
    font-size: 1.411rem;
    text-align: center;
    margin-top: -3px !important;
    margin-bottom: 0px !important;
}

.h3-linkbox {
    text-transform: uppercase;
    font-size: 1.25rem;
    line-height: 2rem;
    color: #444444;
    letter-spacing: 0.005em;
    text-align: center;
    font-weight: normal;
    padding-left: 10px;
    padding-right: 10px;
    margin-top: 60px !important;
    margin-bottom: 40px !important;
}

.h3-neben-foto {
    text-align: left;
    margin-top: -6px !important;
    margin-bottom: -8px !important;
    font-size: 24px;
    font-weight: normal;
}

.h3-neben-foto-termine {
    text-align: left;
    margin-top: -12px !important;
    margin-bottom: -8px !important;
    font-size: 24px;
    font-weight: normal;
}

.h3-next-to-photo-without-margin-top {
    font-size: 1.5rem;
    line-height: 1.3;
    font-weight: normal;
    text-align: left;
    margin-top: -7px !important;
    margin-bottom: -2px !important;
}

.h3-next-to-photo {
    font-size: 1.5rem;
    line-height: 1.3;
    font-weight: normal;
    text-align: left;
    margin-top: -7px !important;
    margin-bottom: -2px !important;
}

/* ================================
   H3 UNTER FOTOS - BASIS (Desktop)
   ================================ */

/* Für echte <h3> Tags unter Fotos (linksbündig) */
.h3-under-photo {
    font-size: 1.5rem;
    font-weight: normal;
    line-height: 1.3;
    padding-left: 5px;
    padding-right: 5px;
}

/* Für echte <h3> Tags unter Fotos (ZENTRIERT) */
/* DEPRECATED: .h3-under-photo-center (wird ersetzt durch neue Struktur) */
.h3-under-photo-center {
    font-size: 1.5rem;
    font-weight: normal;
    line-height: 1.3;
    text-align: center;
    padding-left: 5px;
    padding-right: 5px;
}

/* Für <p> Tags die wie H3 aussehen (linksbündig, rot, unter Foto) */
/* DEPRECATED: p.h3-under-photo → Nutze .p-under-photo-left */
p.h3-under-photo,
.p-under-photo-left {
    color: #990000;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.5rem;
    font-weight: normal;
    line-height: 1.3;
    letter-spacing: 0;
    padding-left: 5px;
    padding-right: 5px;
}

/* Für <p> Tags wie H3 (zentriert, rot, mit Margin, unter Foto) */
/* DEPRECATED: .like-h3-under-photo → Nutze .p-under-photo-center */
.like-h3-under-photo,
.p-under-photo-center {
    color: #990000;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.5rem;
    font-weight: normal;
    line-height: 1.3;
    text-align: center;
    margin-top: 1.72rem;
    margin-bottom: -5px;
}

/************* alt ***************/
/*
.h3-under-photo {
	font-size: 1.5rem;
    line-height: 1.3;  
    font-weight: normal;
	text-align:left;
    padding-left: 5px;
    padding-right: 5px;
}

.h3-under-photo-center {
	font-size: 1.5rem;
    line-height: 1.3;  
    font-weight: normal;
	text-align: center;
    padding: 0 0.938rem 0 0.938rem;
    padding-left: 5px;
    padding-right: 5px;
}
.h3-under-photo {
	color:#990000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1.5rem;
	font-weight: normal;
	line-height: 1.3;
	letter-spacing: 0;
	display: block;
}
.like-h3-under-photo {
	font-size: 1.5rem;
    color: #990000;
    line-height: 1.3;  
    font-weight: normal;
	text-align: center;
    margin-top: 1.72rem !important;
    margin-bottom: -5px;
} */
/*********************************/

.h3-unter-h2 {
    margin-top: 0.005rem !important;
}

.h3-20 {
    margin-top: -2px !important;
    margin-bottom: 5px !important;
}

.h3-blog {
    font-size: 24px;
    font-weight: normal;
    line-height: 1.5;
    color: #444444;
    letter-spacing: 0.005em;
    margin-top: 35px !important;
    text-align: center;
}

.font-size-1-375rem {
    font-size: 1.375rem;
}

h4 {
    color: #131313;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.25rem;
    font-weight: normal;
    line-height: 1.4;
    letter-spacing: 0;
    display: block;
    margin-bottom: -5px !important;
}

.heading-style-h4 {
    color: #131313;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.25rem;
    font-weight: normal;
    line-height: 1.4;
    letter-spacing: 0;
    display: block;
    margin-bottom: -5px !important;
}

.h4-neben-foto {
    text-align: left;
    margin-top: -8px !important;
    font-size: 24px;
}

.h4-unter-foto {
    font-size: 24px;
    line-height: 1.3;
    text-align: left;
    margin-top: 0.9375rem !important;
}

.h4-seminare {
    padding-bottom: 5px;
}

.separation {
    font-size: 1.875rem;
    text-align: center;
    padding-top: 60px;
    padding-bottom: 60px;
}

/* ---- Ende Styles headlines ---- */

/* ---- Styles text ---- */
.normalcase {
    text-transform: none !important;
}

.uppercase {
    text-transform: uppercase;
}

.kursiv {
    font-style: italic;
}

.bold {
    font-weight: bold !important;
}

.aktuelle-seite {
    font-weight: normal;
}

.center {
    text-align: center;
}

.text-align-left {
    text-align: left !important;
}

.justify {
    text-align: justify;
}

.vert-align-m {
    vertical-align: middle;
}


/* Stil f�r die Aktuelles-Box in der Datei Aktuelles (termine.html) */
.div-photo-le-termine {
    width: 48.69%;
    float: left;
}

.div-photo-ri-termine {
    width: 48.69%;
    float: right;
}

.div-text-le-termine {
    width: 48.69%;
    float: left;
}

.div-text-ri-termine {
    width: 48.69%;
    float: right;
}

/* ---- Section f�r die Seite Aktuelles, damit der Text unter dem Foto schmaler als das Foto ist -------*/
.aktuelles-section {
    max-width: 800px;
    /* oder was dir gef�llt */
    margin: 0 auto 60px auto;
    padding: 0 15px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 0.938rem;
    line-height: 1.2;
    color: #333;
}

section h2 {
    /*  font-size: 1.5rem;         */
    margin-bottom: 30px;
}

ul.checkliste {
    list-style: none;
    padding-left: 0;
    margin-top: 12px;
    margin-bottom: 20px;
}

ul.checkliste li {
    position: relative;
    padding-left: 28px;
    margin-bottom: 8px;
}

ul.checkliste li::before {
    content: "\2714";
    /* Unicode f�r Haken ? */
    position: absolute;
    left: 0;
    top: 0;
    color: #900;
    /* dein Bordeauxrot */
    font-weight: bold;
    font-size: 1rem;
}

.index-qualitaet-arbeit {
    max-width: 679px;
    padding: 0 15px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1rem;
    line-height: 1.7;
    letter-spacing: 0.03em;
    color: #666;
    margin-top: 0px;
}

ul.checkliste-index {
    list-style: none;
    padding-left: 0;
    margin-top: 12px;
    margin-bottom: 20px;
}

ul.checkliste-index li {
    position: relative;
    padding-left: 28px;
    margin-bottom: 8px;
}

/* ul.checkliste li::before {
  content: "\2714"; /* Unicode f�r Haken ? */
/*  position: absolute;
  left: 0;
  top: 0;
  color: #900;       /* dein Bordeauxrot */
/*  font-weight: bold;
  font-size: 1rem;
}      */

/*
ul.checkliste-index li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.15em;
  width: 16px;
  height: 16px;
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='%23900' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6.00033 10.8L3.20033 8L2.26699 8.93333L6.00033 12.6667L14.0003 4.66667L13.067 3.73333L6.00033 10.8Z'/%3E%3C/svg%3E");
  background-size: contain;
  background-repeat: no-repeat;
}      */

ul.checkliste-index li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.15em;
    width: 16px;
    height: 16px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='%23900'%3E%3Cpath d='M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
}

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

ol.standard {
    font-family: Arial, Helvetica, sans-serif;
    list-style-type: decimal;
    font-size: 1.1875rem;
    line-height: 1.9;
    color: #666;
    font-weight: normal;
    letter-spacing: 0.063em;
    /*    padding: 0px 60px 0px 78px;   */
}

ol.einruecken {
    list-style-type: decimal;
    margin: 0px 40px 0px 40px !important;
    font-size: 44px;
    line-height: 1.7;
    color: #333333;
    font-weight: normal;
    letter-spacing: 0.063em;
}

ul.style-ul,
.hentry ul {
    margin-top: 19px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.1875rem;
    list-style-type: disc;
    line-height: 1.7;
    color: #666;
    font-weight: normal;
    letter-spacing: 0.01em;
    padding-left: 1.6rem;
}

h3+ul.style-ul {
    margin-top: -0.6rem !important;
}

ul.style-toc,
.hentry ul {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.1875rem;
    list-style-type: disc;
    line-height: 1.6;
    color: #666;
    font-weight: normal;
    letter-spacing: 0.05em;
}

/* ----- ul in einer Box ----- */
ul.style-ul-box {
    margin-top: 19px !important;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1rem;
    list-style-type: disc;
    line-height: 1.5;
    color: #666;
    font-weight: normal;
    letter-spacing: 0.01em;
    padding-left: 1.6rem;
}

ul li {
    margin-bottom: 0.5rem;
    /* z. B. 8px Abstand zwischen den Listeneintr�gen */
}

ul li:last-child {
    margin-bottom: 0;
}

/* ----- ul in einer Box ----- */
ul2 {
    font-size: 1.063rem;
    line-height: 1.7;
    color: #666;
    font-weight: normal;
    letter-spacing: 0.063em;
    list-style-type: disc;
    margin-left: 40px;
    margin-right: 40px;
}

.style-einruecken-ueber-foto {
    padding-left: 0px;
    padding-right: 0px;
}

.vortrag-depression {
    text-align: justify;
    padding-left: 33.557%;
    padding-right: 33.557%;
}

.einruecken-logo {
    padding-left: 19.53%;
    padding-right: 19.53%;
}

.einruecken {
    padding-left: 24.58% !important;
    padding-right: 24.58% !important;
}

.einruecken-jameda {
    padding-left: 60px;
    padding-right: 60px;
    padding-bottom: 20px;
}

.einruecken-125 {
    padding-left: 125px;
    padding-right: 125px;
}

.einruecken-210 {
    display: block;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 210px;
    padding-right: 210px;
}

.padding-250 {
    display: block;
    padding: 0px 250px 0px 250px;
}

.einruecken-l-50 {
    padding-left: 8.865%;
}

.quote {
    font: 1.25rem Arial, Helvetica, sans-serif;
    color: #759DA1;
    line-height: 30px;
}

.logo-wartezeit {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1rem;
    line-height: 1.7;
    color: #333;
    font-weight: normal;
    letter-spacing: 0.063em;
}

p {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.063rem;
    line-height: 1.7;
    color: #666;
    font-weight: normal;
    letter-spacing: 0.01rem;
    /* vorher 0.04 */
}

span.inline-block {
    display: inline-block;
}

span.with-12 {
    width: 12px;
}

.font-24px {
    font-size: 1.5rem !important;
    line-height: 1.3 !important;
}

.font-30px {
    font-size: 1.875rem;
}

.font-36px {
    font-size: 2.25rem;
}

.font-30px-1-4 {
    font-size: 1.875rem;
    line-height: 1.4 !important;
}

.cont-text {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.1875rem;
    line-height: 1.7;
}

p.end-of-box {
    margin-bottom: 0;
}

/* ---- Wartezeit und Aktuelles Info-Boxen Index-Datei! ----*/
.div-wartezeit-left {
    width: 48.69%;
    float: left;
    border: 1px solid #990000;
}

.div-aktuelles-right {
    width: 48.69%;
    float: right;
    border: 1px solid #990000;
}

p.headline-wartezeit-aktuelles {
    font-size: 1.275rem;
    line-height: 1.2;
    font-weight: normal;
    letter-spacing: 0.01em;
    text-align: center;
    /*    padding: 8px 10px 0 10px;  */
    margin-bottom: 10px
}

p.wartezeit-aktuelles {
    line-height: 1.4;
    font-size: 0.938rem;
}

/*
.botton-wartezeit-aktuelles a {
    line-height: 44px !important;
  	width: 220px !important;
    max-width: 95% !important;  
    margin-bottom: -40px !important;
}
Bis 06.01.2025 
*/
.botton-wartezeit-aktuelles a {
    line-height: 44px !important;
    width: 200px !important;
    max-width: 95% !important;
    margin-top: 10px !important;
    margin-bottom: 10px !important;
}

/* ------------- Box aktuelle Wartezeit und Aktuelles in der index-Seite   ----------------*/
/* Basisboxen */
.highlight-boxes {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-bottom: 60px;
}

/* Container mit Flexbox */
.flex-section {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    /* gleiche H�he */
    gap: 2.62%;
    /* Abstand zwischen den Boxen */
    flex-wrap: wrap;
    margin: 40px 0;
}

.box {
    flex: 1 1 45%;
    padding: 30px 20px;
    border-radius: 6px;
    color: #FFF;
    /* Default Textfarbe, wird in .box--aktuelles �berschrieben */
}

.box-info {
    width: 48.69%;
    background-color: #fafafa;
    padding: 16px 30px 30px 30px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    border: 1px solid #111;
    margin: 0;
}

.left-box {
    text-align: center;
}

.right-box {
    text-align: left;
}

/* Box-spezifische Varianten */
.box--wartezeit {
    background-color: #900;
}

.box--aktuelles {
    background-color: #F7F7F7;
    color: #111;
    /* dunkler Text auf hellem Hintergrund */
}

/* �berschriften in Boxen */
.box h2 {
    font-size: 28px;
    margin-bottom: 15px;
    text-align: center;
}

/* Stand-Datum */
.box__stand {
    font-size: 14px;
    margin-top: 10px;
    text-align: center;
}

/* Button / Link innerhalb Box */
.btn {
    display: inline-block;
    margin-top: 20px;
    padding: 10px 20px;
    background-color: #FFF;
    color: #900;
    border: none;
    border-radius: 4px;
    text-decoration: none;
    font-weight: bold;
    text-align: center;
    cursor: pointer;
    transition: background-color .3s ease;
}

.btn:hover {
    background-color: #f0f0f0;
}


/******************************************************/

p.jameda-bewertungen {
    border-left: 3px solid #0072c6;
    background-color: #FFF;
    font-size: 1.063rem;
    color: #111;
    padding: 27px 10px 27px 10px;
    margin: 0;
}

p.jameda-footer {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1rem;
    line-height: 1.5;
}

/* author-box  */
.author-box {
    max-width: 800px;
    margin: 3em auto 3.1em auto;
    padding-top: 1.5em;
    border-top: 1px solid #ddd;
    font-family: Arial, Helvetica, sans-serif;
    color: #333;
}

.author-box h3 {
    font-size: 1.1875rem;
    margin-bottom: 1em !important;
    color: #900;
}

.author-box h4 {
    font-size: 1.1875rem;
    margin-bottom: 1em !important;
    color: #900;
}

.author-content {
    display: flex;
    align-items: flex-start;
    gap: 1em;
}

.author-image {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    object-fit: cover;
    border: 1px solid #900;
    box-sizing: border-box;
}

.author-text {
    font-size: 0.9375rem;
    /* 15px */
    line-height: 1.5;
    margin: 0;
    color: #666 !important
}

/* end author-box*/

.note {
    font-size: 0.9375rem;
    /* 15px */
    line-height: 1.5;
}

p.under-photo-box {
    font-size: 0.75rem !important;
    color: #900 !important;
    margin-top: 30px;
    margin-bottom: -15px;
    text-transform: uppercase;
}

p.under-photo-box-000 {
    font-size: 0.75rem !important;
    color: #555 !important;
    margin-top: 18px;
    margin-bottom: -9px;
    text-transform: uppercase;
    letter-spacing: 0.01em !important;
    padding-left: 5px;
    padding-right: 5px;
}

p.under-photo {
    font-size: 1rem;
    line-height: 1.7;
    padding: 3px 5px 0px 5px;
}

p.under-photo-center {
    padding-bottom: 35px;
}

p.under-photo-red-background {
    background-color: #900;
    font-size: 0.9375rem !important;
    line-height: 1.5;
    color: #FFF;
    padding: 37px 18px 18px 18px;
    margin-top: -22px;
    margin-bottom: 35px;
}

p.under-photo-white-background {
    border: 1px solid #555;
    background-color: #FFF;
    font-size: 1.063rem;
    color: #666;
    padding: 66px 165px 47px 165px;
    margin-top: -22px;
    margin-bottom: 35px;
}

p.quote-patient {
    color: #FFF;
    padding: 40px 20px;
    margin-top: 50px;
    margin-bottom: 50px;
}

p.quote-under-photo {
    border-left: 3px solid #555;
    background-color: #FFF;
    font-size: 1.063rem;
    color: #111;
    padding: 27px 264px 27px 66px;
    margin-top: -22px;
    margin-bottom: 35px;
}

.p-presse {
    color: #990000;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.176rem;
    font-weight: normal;
    line-height: 1.3;
    letter-spacing: 0.01rem;
    text-align: center;
    display: block;
    margin-top: 1.5rem;
}

.p-text {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.063rem;
    line-height: 1.7;
    color: #666;
    font-weight: normal;
    letter-spacing: 0.01em;
}

.p1 {
    font-size: 1.063rem;
    line-height: 1.7;
    color: #666;
    font-weight: normal;
    letter-spacing: 0.01em;
    display: block;
    vertical-align: middle;
    margin-left: 70px !important;
    margin-right: 70px !important;
}

.index-header {
    background-color: #333;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.063rem;
    line-height: 1.2;
    color: #FFF;
    font-weight: bold;
    letter-spacing: 0.063em;
    padding: 25px 0px 25px 36px !important;
    margin-bottom: 0px !important;
}

.index {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.063rem;
    line-height: 1.7;
    color: #333333;
    font-weight: normal;
    letter-spacing: 0.063em;
    padding-left: 36px !important;
}

.offer {
    font-size: 1.2rem;
    color: #FFFFFF;
    padding-left: 17px;
}

.offer:hover {
    color: #FFF;
}

.style-link {
    text-transform: uppercase;
    font: 15px Arial, Helvetica, sans-serif;
    letter-spacing: 0.1em;
    line-height: 1 !important;
}

.style-kontakt {
    font-size: 1.063rem;
    line-height: 1.7;
    color: #333333;
    font-weight: normal;
    letter-spacing: 0.063em;
}

.style-linkbox {
    font-size: 1.063rem;
    line-height: 1.4;
    font-weight: normal;
    display: block;
    margin-top: -4px;
    padding-left: 25px;
    padding-right: 25px;
    padding-bottom: 16px;
}

/* ---- End styles text ---- */
.termin {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.411rem;
    line-height: 1.4;
    color: #333333;
    font-weight: bold;
    letter-spacing: 0.063em;
}

.termine {
    color: #990000 !important;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.063rem;
    font-weight: normal;
    line-height: 30px;
    letter-spacing: 0.03em;
    display: block;
    padding-top: 6px !important;
    margin-bottom: -5px !important;
}

.abfrage-link-zweizeilig-1 {
    font-size: 24px;
    line-height: 1.5;
    color: #FFFFFF;
    letter-spacing: 0.05em;
    text-align: center;
}

.abfrage-link-zweizeilig-2 {
    font-size: 1.063rem;
    font-weight: bold;
    line-height: 1.5;
    color: #FFFFFF;
    letter-spacing: 0.05em;
    text-align: center;
}

.height-30 {
    height: 30px;
}

.anfahrt {
    margin-top: 20px;
    margin-right: 10px;
    line-height: 1.4;
}

.style-einruecken-biete-hilfe {
    padding-left: 0px;
    padding-right: 0px;
    display: block;
}

.text-decoration-underline {
    text-decoration: underline !important;
}

.text-decoration-none {
    text-decoration: none !important;
}

a {
    font-family: Arial, Helvetica, sans-serif;
    color: #900;
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

/* ----------- ID Navigation ---------------- */
#navigation td {
    border-bottom: 2px solid #FFFFFF;
}

#navigation a {
    font: 14px Arial, Helvetica, sans-serif;
    color: #990000;
    line-height: 16px;
    letter-spacing: 0.02em;
    text-decoration: none;
    padding: 8px 0px 8px 0px;
    display: block;
    background-color: #FFFFFF;
    border-radius: 8px;
    border: 1px solid #990000;
    text-align: center;
}

#navigation a:hover {
    color: #FFFFFF;
    background-color: #990000;
}

/* ID Styles Navigation oben Spalte */
.breadcrumb {
    font-family: Arial, Helvetica, sans-serif;
    background-color: #FFFFFF;
    width: 100%;
    padding-top: 62px;
    font-size: 12px;
    line-height: 16px;
}

.breadcrumb a,
.breadcrumb span {
    font-weight: normal;
}

.breadcrumb a:hover,
.breadcrumb a:focus {
    color: #600;
    /* Dunkleres, kr�ftigeres Rot */
}

/* am 17.09.2025 eingef�gt Abst�nde zwischen den Links der Breadcrumb */
.breadcrumb .breadcrumb-divider {
    margin: 0 4px;
    /* oder padding: 0 8px; � je nach Geschmack */
    color: #666F7C;
}

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

.border-bottom {
    border-bottom: 1px solid #CCC;
    box-sizing: border-box;
}

.border-bottom-900 {
    border-bottom: 1px solid #900 !important;
}

.border-c9b399-beige {
    border: 1px solid #c9b399;
}

.border-none {
    border: none;
}

.border-photo-white {
    border: 15px solid #FFF;
}

.border-top-nav {
    border-bottom: 1px solid #ECEFF1;
    box-sizing: border-box;
    margin-top: -9px;
}

.border-bottom-nav {
    border-bottom: 1px solid #ECEFF1;
    box-sizing: border-box;
}

.border-jameda {
    border: 1px solid #990000;
    margin: 50px 185px 20px 185px;
    background-color: #FFFFFF;
}

.border-toc {
    border: 1px solid #CCC;
    margin: 50px 0px 50px 0px;
    padding-left: 30px;
    padding-bottom: 30px;
    background-color: #FFFFFF;
}

.border-900 {
    border: 1px solid #990000;
}

.border-666F7C {
    border: 1px solid #666F7C;
}

.border-CCC {
    border: 1px solid #CCC;
}

.border-none {
    border-style: none;
}

.border-top {
    border-top: 1px solid #666F7C;
    box-sizing: border-box;
}

.border-toc-l {
    border-bottom: 1px solid #E8E8E8;
    border-left: 1px solid #E8E8E8;
    box-sizing: border-box;
}

.border-toc-r {
    border-bottom: 1px solid #E8E8E8;
    border-right: 1px solid #E8E8E8;
    box-sizing: border-box;
}

.border-toc-l-bottom {
    border-bottom: 1px solid #E8E8E8;
    border-left: 1px solid #E8E8E8;
    box-sizing: border-box;
}

.border-toc-r-bottom {
    border-bottom: 1px solid #E8E8E8;
    border-right: 1px solid #E8E8E8;
    box-sizing: border-box;
}

.border-toc {
    border-bottom: 1px solid #E8E8E8;
    box-sizing: border-box;
}

.abstand-profitieren {
    font-size: 25px;
    line-height: 25px;
}

/* ------------- Ende ID Styles Navigation oben ------------------- */


/* Stelle sicher, dass f�r dein Inhaltsverzeichnis Bullets erlaubt sind */
/* ================================
   NAVIGATION – GLOBAL (bleibt wie es ist)
   ================================ */
nav {
    font-family: Arial, Helvetica, sans-serif;
    display: block;
    padding: 20px 0px;
    background: #FFFFFF;
}

/* =====================================
   INHALTSVERZEICHNIS (überschreibt nav)
   ===================================== */

/* TOC-Navigation resetten */
nav.style-toc {
    padding: 0 !important;
    /* Kein padding wie bei Hauptnav */
    background: transparent !important;
    /* Kein weißer Hintergrund */
    display: block !important;
}

#tocTitle {
    padding-bottom: 0;
    margin-bottom: 0.3rem;
    /* Etwas Abstand zur Liste */
    font-size: 1.375rem;
    color: #333;
    font-weight: 600;
    /* Fetter für Überschrift */
}

nav.style-toc ul {
    list-style-type: disc !important;
    list-style-position: outside !important;
    padding-left: 1.5rem !important;
    /* Mehr Platz für Bullets */
    margin: 0 !important;
    background-color: transparent !important;
    line-height: 1.6;
    display: block !important;
    /* Nicht flex/grid */
}

nav.style-toc ul li {
    display: list-item !important;
    margin-left: -0.6rem;
    margin-bottom: 0.5rem;
    color: #900;
}

/* Links im TOC */
nav.style-toc a {
    color: #900;
    text-decoration: none;
    transition: color 0.2s;
}

nav.style-toc a:hover {
    color: #C00;
    text-decoration: underline;
}

/* ========================================== */

.infozeile-unten {
    font: 1.063rem Arial, Helvetica, sans-serif;
    font-weight: normal;
    line-height: 47px;
    color: #FFFFFF;
    background-color: #990000;
    position: fixed;
    text-decoration: none;
    height: 47px;
    width: 29.0828%;
    bottom: 50px;
    display: block;
    margin: 0 auto;
    text-align: center;
    border: 1px solid #990000;
    border-radius: 5px;
}

#kontakt-ueber-infozeile-unten a {
    font: 1.063rem Arial, Helvetica, sans-serif;
    font-weight: normal;
    line-height: 47px;
    color: #FFFFFF;
    background-color: #990000;
    position: fixed;
    text-decoration: none;
    height: 47px;
    width: 39.1499%;
    bottom: 50px;
    display: block;
    text-align: center;
    border: 1px solid #990000;
    border-radius: 30px;
}

.fixiert-kontakt-ueber-infozeile-unten {
    position: sticky;
    top: 600px;
    bottom: 50px;
    width: 39.1499%;
    z-index: 999;
    display: block;
    margin: 0 auto;
    text-align: center;
    border: 1px solid #990000;
    border-radius: 30px;
    text-decoration: none;
    font: 1.063rem Arial, Helvetica, sans-serif;
    color: #FFFFFF;
    background-color: #990000;
}

.jameda-siegel {
    position: fixed;
    top: 40.1vh;
    right: 0px;
    z-index: 999;
    display: block;
    transform: translateX(60%);
    transition: transform .4s;
}

.jameda-siegel:hover {
    position: fixed;
    top: 40.1vh;
    right: 0px;
    z-index: 999;
    display: block;
    transform: translateX(0%);
    transition: transform .4s;
}

/* ------------ styles Schrift auf Foto ---------------*/
.opacity-flex-3-colums-FFF-rel {
    position: relative;
    top: -119px;
    height: 100px;
    max-width: 543px;
    background-color: #FFF;
}

.opacity-flex-3-colums-900-rel {
    position: relative;
    margin-top: -122px;
    height: 103px;
    max-width: 543px;
    background-color: rgba(238, 0, 0, 0.6);
}

.opacity-flex-3-colums-FFF {
    margin-top: 200px;
    height: 100px;
    width: 360px;
    background-color: rgba(255, 255, 255, 0.6);
}

.opacity-flex-3-colums-header-900 {
    padding: 12px 15px 0px 15px;
    font: 0.9375rem/0.875 Arial, Helvetica, sans-serif;
    letter-spacing: normal;
    text-transform: uppercase;
    color: #900;
}

p.under-opacity-flex-3-colums-000C0F {
    margin-top: -3px;
    padding-left: 15px;
    padding-right: 15px;
    font: 1.375rem Arial, Helvetica, sans-serif;
    line-height: 1.3;
    color: #000C0F;
    letter-spacing: normal;
}

.opacity-flex-3-colums-900 {
    margin-top: 200px;
    height: 100px;
    max-width: 543px;
    background-color: #E00;
    opacity: 0.6;
}

.opacity-flex-3-colums-header {
    padding: 12px 15px 0px 15px;
    font: 0.9375rem/1.0 Arial, Helvetica, sans-serif;
    letter-spacing: normal;
    text-transform: uppercase;
    color: #FFF;
}

p.under-opacity-flex-3-colums {
    margin-top: -3px;
    padding-left: 15px;
    padding-right: 15px;
    font: 1.375rem/1.3 Arial, Helvetica, sans-serif;
    letter-spacing: normal;
    color: #FFF;
}

.zu-mir {
    background-image: url("/images/index/warum-zu-mir-praxis-holger-neumann-1170.jpg");
    /*background-color: #F2F2F2;*/
    left: 0px;
    top: 0px;
    height: 599px;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.zu-mir-info-flex {
    display: flex;
    justify-content: center;
    align-items: center;
}

.zu-mir-opacity {
    height: 500px;
    width: 52.5727%;
    background-color: #FFFFFF;
    opacity: 0.8;
}

.zu-mir span {
    font: 1.063rem Arial, Helvetica, sans-serif;
    font-weight: normal;
    line-height: 23px;
    color: #333333;
}

.zu-mir-ueberschrift {
    display: block !important;
    margin-top: 46px !important;
    margin-bottom: -18px;
    font: 24px Arial, Helvetica, sans-serif !important;
    line-height: 24px;
    text-transform: uppercase;
    color: #990000 !important;
}

.zu-mir-info-bold {
    /*	font-size: 1.063rem !important; */
    line-height: 30px !important;
    font-weight: bold;
    color: #990000 !important;
}

.text-im-foto-seelische-gesundheit {
    background-image: url("/images/blog/blog-seelische-gesundheit.jpg");
    height: 445px;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.text-im-foto-blog-eheberatung-und-paartherapie {
    background-image: url("/images/blog/eheberatung-paartherapie/blog-eheberatung-paartherapie-894.jpg");
    left: 0px;
    top: 0px;
    /*  	height: 445px;   */
    padding-top: 19.02%;
    padding-bottom: 21.25%;
    min-height: 1px;
    width: 100%;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: inherit;
}

/* Styles Button Termin vereinbaren DIV */
.ueber-mich a {
    font: 1.063rem Arial, Helvetica, sans-serif;
    font-weight: normal;
    line-height: 47px;
    color: #990000;
    background-color: #FFFFFF;
    text-decoration: none;
    height: 47px;
    width: 22.3713%;
    display: block;
    margin: 0 auto;
    text-align: center;
    border: 1px solid #990000;
    border-radius: 50px;
}

.abstand-unter-ueber-mich {
    display: block;
    padding-top: 30px !important;
}

.termin-vereinbaren a {
    font: 0.975rem Arial, Helvetica, sans-serif;
    font-weight: normal;
    line-height: 58px;
    color: #990000;
    background-color: #FFFFFF;
    text-decoration: none;
    width: 285px;
    display: block;
    margin: 0 auto;
    text-align: center;
    border: 1px solid #E2E2D8;
    border-radius: 50px;
    margin-top: 26px;
    /*  margin-bottom: 66px; Beachte stattdessen diivider: divider--section-bottom-60-button */
}

/* Hover-Effekt f�r Desktop */
.termin-vereinbaren a:hover,
.termin-vereinbaren a:focus {
    background-color: #f5f5f5;
    border-color: #cccccc;
    color: #660000;
    outline: none;
    /* Fokus-Umriss kann man individuell anpassen */
}

/* Aktiver Zustand f�r Touch-Ger�te beim Tippen */
.termin-vereinbaren a:active {
    background-color: #e6e6e6;
    border-color: #999999;
    color: #550000;
}

.nav-two-buttons-red a {
    text-transform: uppercase;
    font: 0.975rem Arial, Helvetica, sans-serif;
    letter-spacing: 0.1em;
    font-weight: normal;
    line-height: 58px;
    color: #FFF;
    background-color: #990000;
    text-decoration: none;
    max-width: 555px;
    display: block;
    margin: 0 auto;
    text-align: center;
    border: 1px solid #E2E2D8;
    border-radius: 10px;
    margin-bottom: 25px;
}

.nav-two-buttons-bright a {
    background-color: #600;
}

.index-therapien a {
    font: 0.975rem Arial, Helvetica, sans-serif;
    font-weight: normal;
    line-height: 58px;
    color: #990000;
    background-color: #FFFFFF;
    text-decoration: none;
    width: 285px;
    display: block;
    margin: 0 auto;
    text-align: center;
    border-radius: 50px;
    margin-top: 10px;
    margin-bottom: 20px;
}

.info-telefon {
    background-image: url("/images/leistungen/behandlungsschwerpunkte/info-telefon-555.jpg");
    height: 288px;
}

.info-abende-essstoerungen {
    background-image: url("/images/leistungen/behandlungsschwerpunkte/info-abende-essstoerungen-555.jpg");
    height: 288px;
}

.therapy-button-left-grew a {
    text-transform: uppercase;
    font: 0.9375rem Arial, Helvetica, sans-serif;
    font-weight: normal;
    line-height: 56px;
    color: #900;
    background-color: #FFF;
    text-decoration: none;
    width: 270px;
    max-width: 95%;
    display: block;
    text-align: center;
    border: 1px solid #BCC3CB;
    border-radius: 10px;
    margin-top: 26px;
    margin-bottom: -20px;
    letter-spacing: 1px !important;
}

.therapy-button-left a {
    text-transform: uppercase;
    font: 0.9375rem Arial, Helvetica, sans-serif;
    font-weight: normal;
    line-height: 48px;
    color: #FFF;
    background-color: #900;
    text-decoration: none;
    width: 270px;
    max-width: 95%;
    display: block;
    text-align: center;
    border: 1px solid #FFF;
    border-radius: 10px;
    letter-spacing: 1px !important;
}

.therapien a {
    text-transform: uppercase;
    font: 0.9375rem Arial, Helvetica, sans-serif;
    font-weight: normal;
    line-height: 56px;
    color: #990000;
    background-color: #FFFFFF;
    text-decoration: none;
    width: 270px;
    max-width: 95%;
    display: block;
    margin: 0 auto;
    text-align: center;
    border: 1px solid #E2E2D8;
    border-radius: 50px;
    margin-top: 26px;
    margin-bottom: -20px;
}

/*.therapien a {
  display: block;
  width: 270px;
  max-width: 95%;
  margin: 26px auto -20px auto;  /* zentriert + individuelle Abst�nde */

/*  padding: 16px 24px;                    /* ggf. erg�nzen, um H�he zu kontrollieren */
/*  line-height: normal;
  text-align: center;
  
  font: 0.9375rem Arial, Helvetica, sans-serif; 
  font-weight: normal;
  text-transform: uppercase;
  text-decoration: none;
  
  color: #990000;
  background-color: #FFFFFF;
  border: 1px solid #E2E2D8;
  border-radius: 50px;
} */

.therapien a:hover {
    color: #FFFFFF;
    background-color: #990000;
    border: 1px solid #990000;
    text-decoration: none;
}

.border-none {
    border-style: none !important;
}

.text-u-bottom {
    font: 1.063rem Arial, Helvetica, sans-serif;
    line-height: 1.4;
    letter-spacing: 0.063em;
    text-align: center;
    padding-top: 5px;
}

.text-between-lines {
    font-size: 1.1875rem;
    line-height: 1.9;
    letter-spacing: 0.063em;
    text-align: center;
}

.alle-blog-eintraege a {
    text-transform: uppercase;
    font: 0.9375rem Arial, Helvetica, sans-serif;
    font-weight: normal;
    line-height: 56px;
    color: #990000;
    background-color: #FFFFFF;
    text-decoration: none;
    width: 260px;
    max-width: 95%;
    display: block;
    margin: 0 auto;
    text-align: center;
    border: 1px solid #E2E2D8;
    border-radius: 50px;
}

.alle-blog-eintraege a:hover {
    color: #FFFFFF;
    letter-spacing: 0.063em;
    background-color: #990000;
    border: 1px solid #990000;
    text-decoration: none;
}

.terminvereinbarung a {
    font: 0.875rem Arial, Helvetica, sans-serif;
    font-weight: normal;
    color: #FFF;
    line-height: 42px;
    background-color: #900;
    text-decoration: none;
    width: 180px;
    display: block;
    text-align: center;
    /*  	border: 1px solid #FFF;  */
    border-radius: 5px;
    letter-spacing: 1px;
    margin-top: 8px;
}

.terminvereinbarung a:hover {
    color: #900;
    background-color: #FFF;
    border: 1px solid #900;
}

/* Ende Styles Button Termin vereinbaren DIV */

.warum-zu-mir a {
    font: 1.063rem Arial, Helvetica, sans-serif;
    font-weight: normal;
    line-height: 47px;
    color: #990000;
    position: relative;
    text-decoration: none;
    left: 200px;
    top: 100px;
    display: block;
}

/* ID Styles Navigation Button Termin vereinbaren */
.button-termin-rot {
    margin-left: 334px !important;
    margin-right: 334px !important;
}

.button-therapien-li-re {
    margin-left: 0px !important;
    margin-right: 30px !important;
}

.button-therapien-mitte {
    margin-left: 1.25rem !important;
    margin-right: 1.25rem !important;
}

.border-botton-therapien {
    border: 1px solid #E2E2D8;
}

.rahmen-button-termin-gruen {
    border: 1px solid #E5E5E5;
}

/* Class Styles */
.navigation-linkbox a {
    font: 1.063rem Arial, Helvetica, sans-serif;
    color: #990000;
    letter-spacing: 0.02em;
    text-decoration: none;
    padding: 18px 0px 18px 0px;
    display: block;
    background-color: #FFFFFF;
    text-align: center;
    vertical-align: bottom;
}

.navigation-linkbox a:hover {
    font: 1.063rem Arial, Helvetica, sans-serif;
    /*   padding: 18px 0px 18px 0px; */
    color: #FFFFFF;
    font-weight: normal;
    letter-spacing: 0.02em;
    border: none;
    display: block;
    background-color: #990000;
    text-align: center;
    vertical-align: bottom;
}

.navigation-unter-foto a {
    font: 1.063rem Arial, Helvetica, sans-serif;
    color: #990000;
    letter-spacing: 0.02em;
    text-decoration: none;
    display: block;
    background-color: #FFFFFF;
    vertical-align: bottom;
}

.navigation-unter-foto a:hover {
    font: 1.063rem Arial, Helvetica, sans-serif;
    color: #FFFFFF;
    font-weight: normal;
    letter-spacing: 0.02em;
    border: none;
    display: block;
    background-color: #990000;
    vertical-align: bottom;
}

.naviagation-button a {
    font: 14px Arial, Helvetica, sans-serif;
    color: #FFFFFF;
    line-height: 16px;
    letter-spacing: 0.02em;
    text-decoration: none;
    padding: 8px 0px 8px 0px;
    display: block;
    background-color: #F4C133;
    border-radius: 4px;
    border: 1px solid #E3A30D;
    text-align: center;
}

.naviagation-button a:hover {
    color: #FFFFFF;
    background-color: #F3960A;
}

.navigation-button-therapien a {
    font: 1.063rem Arial, Helvetica, sans-serif;
    color: #990000;
    letter-spacing: 0.02em;
    text-decoration: none;
    padding: 16px 0px 16px 0px;
    display: block;
    background-color: #FFFFFF;
    border: 1px solid #990000;
    border-radius: 30px;
    text-align: center;
}

.navigation-button-therapien a:hover {
    color: #FFFFFF;
    letter-spacing: 0.02em;
    background-color: #990000;
    border: 1px solid #990000;
    text-decoration: none;
}

.navigation-button-therapien-li a {
    font: 1.063rem Arial, Helvetica, sans-serif;
    color: #990000;
    letter-spacing: 0.02em;
    text-decoration: none;
    padding: 20px 0px 20px 0px;
    display: block;
    background-color: #FFFFFF;
    border: 1px solid #990000;
    border-radius: 30px;
    text-align: center;
    margin-left: 25px !important;
    margin-right: 29px !important;
}

.navigation-button-therapien-li a:hover {
    color: #FFFFFF;
    letter-spacing: 0.02em;
    background-color: #990000;
    border: 1px solid #990000;
    text-decoration: none;
}

.navigation-button-therapien-mi a {
    font: 1.063rem Arial, Helvetica, sans-serif;
    color: #990000;
    letter-spacing: 0.02em;
    text-decoration: none;
    padding: 20px 0px 20px 0px;
    display: block;
    background-color: #FFFFFF;
    border: 1px solid #990000;
    border-radius: 30px;
    text-align: center;
    margin-left: 27px !important;
    margin-right: 27px !important;
}

.navigation-button-therapien-mi a:hover {
    color: #FFFFFF;
    letter-spacing: 0.02em;
    background-color: #990000;
    border: 1px solid #990000;
    text-decoration: none;
}

.navigation-button-therapien-re a {
    font: 1.063rem Arial, Helvetica, sans-serif;
    color: #990000;
    letter-spacing: 0.02em;
    text-decoration: none;
    padding: 20px 0px 20px 0px;
    display: block;
    background-color: #FFFFFF;
    border: 1px solid #990000;
    border-radius: 30px;
    text-align: center;
    margin-left: 29px !important;
    margin-right: 25px !important;
}

.navigation-button-therapien-re a:hover {
    color: #FFFFFF;
    letter-spacing: 0.02em;
    background-color: #990000;
    border: 1px solid #990000;
    text-decoration: none;
}

.navigation-schwerpunkte a {
    text-transform: uppercase;
    font: 1.063rem Arial, Helvetica, sans-serif;
    color: #990000;
    letter-spacing: 0.063em;
    text-decoration: none;
    padding: 16px 0px 16px 0px;
    display: block;
    background-color: #FFFFFF;
    border: 1px solid #990000;
    border-radius: 30px;
    text-align: center;
}

.navigation-schwerpunkte a:hover {
    color: #FFFFFF;
    letter-spacing: 0.063em;
    background-color: #990000;
    border: 1px solid #990000;
    text-decoration: none;
}

.navigation-therapien a {
    text-transform: uppercase;
    font: 0.9375rem Arial, Helvetica, sans-serif;
    font-weight: normal;
    line-height: 56px;
    color: #990000;
    background-color: #FFFFFF;
    text-decoration: none;
    width: 360px;
    max-width: 95%;
    display: block;
    margin: 0 auto;
    text-align: center;
    border: 1px solid #E2E2D8;
    border-radius: 50px;
    margin-top: 36px;
    margin-bottom: -20px;
}

.navigation-therapien a:hover {
    color: #FFFFFF;
    letter-spacing: 0.063em;
    background-color: #990000;
    border: 1px solid #990000;
    text-decoration: none;
}

.navigation-blog a {
    text-transform: uppercase;
    font: 0.9375rem Arial, Helvetica, sans-serif;
    color: #990000;
    letter-spacing: 0.063em;
    text-decoration: none;
    padding: 10px 0px 10px 0px;
    display: block;
    background-color: #FFFFFF;
    border: 1px solid #E2E2D6;
    border-radius: 40px;
    text-align: center;
    width: 270px;
    max-width: 95%;
    margin: 0 auto;
    margin-top: 36px;
    margin-bottom: -20px;
}

.navigation-blog a:hover {
    color: #FFFFFF;
    letter-spacing: 0.063em;
    background-color: #990000;
    border: 1px solid #990000;
    text-decoration: none;
}

/* Abstand Text zum Botton Linkbox */
.herzlich-willkommen-ueberschrift {
    color: #990000;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 2.25rem !important;
    font-weight: normal;
    line-height: 38px;
    text-align: center;
}

.herzlich-willkommen {
    color: #333;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.063rem;
    font-weight: normal;
    line-height: 2.0;
    text-align: center;
}

.praxisinfos-aktuelles-rot-ueberschrift {
    color: #333333;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.25rem;
    font-weight: normal;
    line-height: 34px;
    text-align: center;
    vertical-align: top !important;
    margin-top: 28px !important;
}

.text-ausrichtung-oben {
    display: block;
    margin-top: 0px !important;
}

.tabelle {
    border: none;
    border-collapse: collapse;
    border-spacing: 0;
    padding: 0;
}

.table-def {
    border: none;
    border-collapse: collapse;
    border-spacing: 0;
    padding: 0;
}

.foto-verlinken {
    border: none;
}

/* Ende*/

/* ---------- Fotos ---------- */
.photo-link-543 {
    width: 543px;
    height: 352px;
}

.photo-link-543 img {
    position: absolute;
    clip: rect(20px 543px 372px 0px);
    overflow: hidden;
}

.paartherapie-beziehungsstress-schafft-probleme-background-360 {
    background-image: url("/images/presse/paartherapie-beziehungsstress-schafft-probleme-background-360.jpg");
    height: 301px;
    width: 360px;
    display: flex;
    object-fit: cover;
}

.paartherapie-paderborn-background-360 {
    background-image: url("/images/leistungen/therapieangebote/paartherapie-paderborn/paartherapie-paderborn-background-543.jpg");
    display: flex;
    background-size: cover;
}

.eheberatung-paderborn-background-360 {
    background-image: url("/images/leistungen/therapieangebote/eheberatung-paderborn/eheberatung-paderborn-background-360.jpg");
    height: 300px;
    width: 360px;
    display: flex;
}

.depression-wolkenverhangener-himmel {
    background-image: url(images/schwerpunkte/depression/depression.jpg);
}

.foto-oben {
    background-image: url("/images/schwerpunkte/beziehung-retten/pink.png");
    height: 210px;
    width: 47.2036%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.foto-oben span {
    font: 1.25rem Arial, Helvetica, sans-serif;
    font-weight: normal;
    display: block;
    text-align: center;
    color: #000000;
}

/* ------------ Ende Fotos---------------- */

/* ---------- Footer ---------- */
/* Jameda und Google-Bewertungen */
.bewertungen-footer {
        max-width: 769px;
        margin-right: auto;
        margin-left: auto;
    }
.jameda-bewertungen-footer {
    border-left: 4px solid #004c99;
    border-bottom: 4px solid #34A853;    
    background-color: #fff;
    color: #111;
    /* Das macht den FIX */
    padding: 8px 30px 22px 30px;
    margin: 0 auto;
    /* max-width: 1140px; */
    /* volle Content-Breite */
    box-sizing: border-box;
    /* verhindert, dass die 30px das Layout verschieben */
}

.jameda-bewertungen {
    border-left: 4px solid #004c99;
    background-color: #fff;
    color: #111;
    padding: 22px 30px 20px 30px;
    margin: 0;
    font-size: 0.75rem;
    text-align: left;
    box-sizing: border-box;
}

.jameda-bewertungen p {
    margin: 0 0 20px 0;
}

.button-wrapper a {
    font: 0.75rem Arial, Helvetica, sans-serif;
    color: #fff;
    display: inline-block;
    padding: 6px 14px;
    text-decoration: none;
    border-radius: 4px;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

.button-wrapper {
    text-align: center;
}

/* Jameda */
.button-wrapper a.jameda {
    background-color: #004c99;
}

.button-wrapper a.jameda:hover {
    background-color: #003f99;
}
/* Google */
.button-wrapper a.google {
    background-color: #34A853;
}

.button-wrapper a.google:hover {
    background-color: #2D9249;
}
/* Ende Jameda und Google-Bewertungen */


.headline-footer {
    text-align: center;
    text-transform: uppercase;
    font: 1.6rem Arial, Helvetica, sans-serif;
    color: #FFFFFF;
    letter-spacing: 0.1em;
    line-height: 2.2rem;
    padding: 70px 30px 0px 30px;
    margin-top: -22px;
}

.div-flexbox-footer {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
}

.div-box-kontakt-ueber-mich {
    width: 22% !important;
}

.underline-footer-headlines {
    border-bottom: 2px solid #c1112f;
    max-width: 50px;
    margin: 0px;
    box-sizing: border-box;
    display: block;
}

.line-footer-headline-kontakt {
    border-bottom: 2px solid #600;
    margin-top: 10px;
    max-width: 40px;
    margin-left: 14px;
    box-sizing: border-box;
    display: block;
}

.div-box-hn {
    width: 10.4% !important;
}

.line-footer-headline-hn {
    border-bottom: 2px solid #600;
    margin-top: 10px;
    max-width: 50px;
    margin-left: 18px;
    box-sizing: border-box;
    display: block;
}

.div-box-oeffnung {
    width: 27% !important;
}

.line-footer-headline-oeffnung {
    border-bottom: 2px solid #600;
    margin-top: 10px;
    max-width: 75px;
    margin-left: 28px;
    box-sizing: border-box;
    display: block;
}

/* --- CSS f�r die Service-Liste (Spalte 3) --- */

/* 1. Entfernt die Listeneinr�ckung und die Punkte */
.service-list {
    list-style: none;
    /* Entfernt die Listenpunkte (Bullets) */
    padding-left: 0;
    /* Entfernt die standardm��ige Einr�ckung der UL/OL */
    margin-top: 5px;
    /* Kleiner Abstand nach der �berschrift */
}

/* 2. Formatiert die einzelnen Listeneintr�ge */
.service-list li {
    line-height: 2.3;
    /* Nutzt die hohe LH, die Sie f�r die �ffnungszeiten definiert haben */
    margin-bottom: 0;
    /* Stellt sicher, dass die Abst�nde durch die line-height kommen */
    padding: 0;
}

/* 3. Optimiert die Icons */
/*.service-list i {   */
/*    color: #FFF;             /* Bel�sst die Icons in Wei� (wie besprochen auf dem dunklen #900 Hintergrund) */
/*    vertical-align: middle;  /* Zentriert das Icon vertikal zur Textzeile */
/*    margin-right: 10px;      /* Schafft einen klaren Abstand zwischen Icon und Text */
/*}     */

/* 3. Optimiert die Icons */
.service-list i {
    color: #FFF;
    /* Bel�sst die Icons in Wei� (wie besprochen auf dem dunklen #900 Hintergrund) */
    vertical-align: middle;
    /* Zentriert das Icon vertikal zur Textzeile */
    margin-right: 10px;
    /* Schafft einen klaren Abstand zwischen Icon und Text */
}

.div-box-rechtliches {
    width: 14% !important;
}

.line-footer-headline-rechtliches {
    border-bottom: 2px solid #600;
    margin-top: 10px;
    max-width: 60px;
    margin-left: 20px;
    box-sizing: border-box;
    display: block;
}

.padding-bottom-footer {
    padding-bottom: 100px;
}

.link-footer {
    color: #FFF !important;
    text-decoration: none;
}

.link-footer:hover {
    text-decoration: underline;
}

.headlines-footer {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1rem !important;
    color: #FFF;
    text-transform: uppercase;
    font-weight: normal;
    letter-spacing: 0.035rem;
    margin: 0;
}

.headlines-footer--secondary {
    margin-top: 48px;
}

.text-footer {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 0.938rem !important;
    color: #FFFFFF !important;
    line-height: 2.3;
    letter-spacing: 0.02rem;
}

/* Alle Tage auf inline-block setzen, damit wir Breite einstellen k�nnen */
.text-footer .day {
    display: inline-block;
}

/* Individuelle Breite f�r jeden Tag */
.text-footer .mo {
    width: 176px;
}

.text-footer .di {
    width: 33px;
}

.text-footer .mi {
    width: 33px;
}

.text-footer .do {
    width: 33px;
}

.text-footer .fr {
    width: 33px;
}

.text-footer .sa {
    width: 33px;
}

/* Stunden bleiben normal */
.text-footer .hours {
    display: inline-block;
}

.text-footer .kontakt {
    display: inline-block;
}

/* Individuelle Breite Kontakt im Footer */
.text-footer .tel {
    width: 12px;
}

.link-text-footer {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px !important;
    color: #FFFFFF !important;
    line-height: 1.5;
}

.link-nav-footer {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 0.938rem !important;
    color: #FFFFFF !important;
    line-height: 1.5;
    letter-spacing: 0.02rem;
}

.times {
    white-space: nowrap;
}

.and {
    margin: 0 0.5rem;
    display: inline-block;
}

.copyright {
    text-align: center;
    padding-top: 22px;
    padding-bottom: 21px;
    background-color: #660000;
}

.div-photo-footer-last-post {
    width: 21.5%;
    vertical-align: top;
    float: left;
}

.div-text-footer-last-post {
    width: 64.4%;
    vertical-align: top;
    float: right;
}

.grid-container {
    display: grid;
    grid-template-columns: 70px 19px 1fr;
    grid-template-rows: 1fr;
    gap: 0px 0px;
    grid-template-areas:
        "div-grid-photo-footer-last-post div-grid-gap-footer-last-post div-grid-text-footer-last-post";
}

.div-grid-photo-footer-last-post {
    grid-area: div-grid-photo-footer-last-post;
}

.div-grid-gap-footer-last-post {
    grid-area: div-grid-gap-footer-last-post;
}

.div-grid-text-footer-last-post {
    grid-area: div-grid-text-footer-last-post;
}

/* ---------- End footer ---------- */


/* ---------- media query max 1200px ---------- */
@media screen and (max-width: 1200px) {
    .div-active-menu {
        max-width: 992px;
        padding-left: 20px;
        padding-right: 30px;
    }

    .jameda-bewertungen-footer {
        padding: 6px 30px 22px 30px;
        /* max-width: 952px; */
        /* volle Content-Breite */
    }

    .div-active {
        max-width: 960px;
        padding-left: 0px;
        padding-right: 0px;
    }

    .faq-container {
        max-width: 720px;
    }

    .breadcrumb {
        padding-top: 48px;
    }

    .line-breadcrumb {
        padding-bottom: 12px;
    }

    .div-box-offer-1 {
        width: 50%;
    }

    .div-box-offer-2 {
        width: 50%;
    }

    .div-box-offer-3 {
        width: 50%;
    }

    .div-box-offer-4 {
        width: 50%;
    }

    .div-info-red-neues {
        padding: 60px;
        text-align: center;
        margin-bottom: 70px;
    }

    .padding-h1-index {
        padding-left: 50px;
    }

    /*
.h1-index {font-size: 2.125rem;}
*/
    p.under-photo-white-background {
        padding: 66px 69px 47px 69px;
    }

    p.quote-under-photo {
        padding: 27px 69px 27px 69px;
    }

    .padding-button-left-red-box {
        padding: 6px 40px 15px 40px;
    }

    .div-flex-2-colums {
        width: 450px;
    }

    .div-flex-3-colums {
        width: 300px;
        box-sizing: border-box;
    }

    .div-flex-2-colums-gap {
        width: 32px;
        float: left;
    }

    .div-flex-1-colum-center {
        width: 300px;
    }

    .div-flex-3-colums-gap {
        width: 31px;
        float: left;
    }

    /* Klassen float */
    .div-float-left-48-69-percent-991-one-colomn {
        width: 48.39%;
        float: left;
        box-sizing: border-box;
    }

    /* alt 
.div-photo-le-blog-long-text {
    width: 100%;
    max-width: 480px;
    float: none;
}
*/

    .div-photo-le-blog-long-text {
        width: 480px;
        /* fix, zuverlässig */
        float: none;
        /* Block-Element */
        margin: 0;
        /* linksbündig */
    }

    .div-text-long-ri-blog {
        width: 100%;
        float: none;
    }

    /* ------------- */
    .div-photo-1 {
        width: 46.15%;
    }

    .div-photo-2 {
        width: 46.15%;
    }

    .div-photo-3 {
        width: 46.15%;
    }

    .div-photo-4 {
        width: 46.15%;
        margin-left: 30px;
    }

    .essstoerung-hilfe-online {
        background-image: url("/images/leistungen/therapieangebote/essstoerung-hilfe-online-466.jpg");
        height: 368px;
    }

    .eheberatung-paderborn {
        background-image: url("images/leistungen/therapieangebote/eheberatung-paderborn/eheberatung-paderborn-570.jpg");
        height: 368px;
    }

    .paartherapie-online {
        background-image: url("images/leistungen/therapieangebote/paartherapie-online-480.jpg");
        height: 376px;
    }

    .videosprechstunde-paartherapie {
        background-image: url("/images/leistungen/therapieangebote/videosprechstunde-paartherapie-480.jpg");
        height: 342px;
    }

    .border-jameda {
        margin: 50px 70px 20px 70px;
    }

    /* ---- link in the photo */
    p.under-opacity-flex-3-colums {
        font: 1.25rem/1.3 Arial, Helvetica, sans-serif;
    }

    /* ---- Footer ---- */
    .div-box-kontakt-ueber-mich {
        width: 40% !important;
    }

    .div-box-hn {
        width: 40% !important;
    }

    .div-box-oeffnung {
        width: 41% !important;
    }

    .div-box-rechtliches {
        width: 40% !important;
    }

    .padding-bottom-footer {
        padding-bottom: 80px;
    }

    .div-text-footer-last-post {
        width: 68.5%;
        vertical-align: top;
        float: right;
    }

    /* ---- End footer ---- */
}

/* ---------- media query max 991px ---------- */

@media screen and (max-width: 991px) {
    .div-background-mobile-menu {
        display: block;
        width: 100%;
        background-color: #F5F5F5 !important;
        box-sizing: border-box;
    }

    .div-active {
        max-width: 735px;
    }

    /* ==========================================================================
   Global Styles
   ========================================================================== 
   Aufhebung der Verschiebung der Sprungadressen, die durch das fixierte 
   Menü entstehen 
   Diese Klasse ist nur notwendig, wenn das Menü, ab 991px nur noch eine Höhe von 50px bekommt! */
    body {}

    [id] {
        scroll-margin-top: 50px;
    }

    /* ========================================================================== */

    .herzlich-willkommen-ueberschrift {
        font-size: 1.875rem !important;
        line-height: 38px;
        text-align: center;
    }

    /* --- Index-Seite 4 Button unter Hero --- */
    .offer {
        font-size: 1rem;
        padding-left: 17px;
    }

    .info-offer span {
        font-size: 0.875rem;
        line-height: 40px;
        bottom: 30px;
        left: 32px;
        padding-bottom: 26px;
    }

    .info-offer a {
        font: 0.75rem Arial, Helvetica, sans-serif;
        line-height: 20px;
        height: 20px;
        width: 20px;
        bottom: 10px;
        left: 35px;
    }

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

    .jameda-bewertungen-footer {
        padding: 6px 30px 22px 30px;
        /* max-width: 735px; */
        /* volle Content-Breite */
    }

    p.jameda-footer {
        text-align: left;
    }

    .faq-container {
        max-width: 620px;
    }

    .div-active-menu {
        padding-left: 0px;
        padding-right: 0px;
    }

    .info-telefon {
        background-image: url("/images/leistungen/behandlungsschwerpunkte/info-telefon-344.jpg");
        height: 326px;
    }

    .essstoerung-hilfe-online {
        background-image: url("/images/leistungen/therapieangebote/essstoerung-hilfe-online-708.jpg");
        height: 320px;
    }

    .eheberatung-paderborn {
        background-image: url("images/leistungen/therapieangebote/eheberatung-paderborn/eheberatung-paderborn-736.jpg");
        height: 320px;
    }

    .paartherapie-online {
        background-image: url("images/leistungen/therapieangebote/paartherapie-online-736.jpg");
        height: 320px;
    }

    .info-abende-essstoerungen {
        background-image: url("/images/leistungen/behandlungsschwerpunkte/info-abende-essstoerungen-344.jpg");
        height: 326px;
    }

    .videosprechstunde-paartherapie {
        background-image: url("/images/leistungen/therapieangebote/videosprechstunde-paartherapie-736.jpg");
        height: 290px;
    }

    .kinder-leiden-am-meisten {
        background-image: url("/images/leistungen/therapieangebote/eheberatung-paderborn/kinder-leiden-am-meisten-991.jpg");
        left: 0px;
        top: 0px;
        height: 480px;
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .margin-logo {
        margin-top: 22px;
        margin-bottom: 27px;
    }

    .div-logo-left {
        float: left;
    }

    .div-nav-left {
        float: none;
    }

    .div-nav-right {
        display: none;
    }

    .div-seminar-sp-li {
        width: 18%;
        float: left;
    }

    .div-seminar-sp-re {
        width: 82%;
        float: left;
    }

    .photo-top {
        position: absolute;
        clip: rect(0px 1456px 540px 0px);
        overflow: hidden;
        box-sizing: border-box;
    }

    #photo-top-size {
        width: 991px;
        height: 540px;
        box-sizing: border-box;
    }

    .photo-top-1 {
        display: none;
    }

    .photo-top-2 {
        display: block;
        margin-bottom: -5px;
        width: 100%;
        height: 56.21%;
    }

    .div-float-left-48-69-percent-991-one-colomn {
        width: 100%;
    }

    .div-float-left-50-percent-991-one-colomn {
        width: 100%;
    }

    .padding-h1-index {
        padding-left: 50px;
        padding-right: 50px;
    }

    /** ------------- Navigation -------------------**/
    .fixiert_menue_desktop {
        position: sticky;
        top: 0px;
        /*  height: 100px;   */
        width: 100%;
        z-index: 999;
        box-sizing: border-box;
    }

    .fixiert_menue_mobile {
        position: sticky;
        top: 0px;
        /*  height: 60px;  */
        width: 100%;
        z-index: 999;
        box-sizing: border-box;
    }

    nav {
        display: none;
        font-family: Arial, Helvetica, sans-serif;
        padding: 0px 21px;
    }

    nav ul {
        padding: 0px;
        margin: 0px;
        width: 100%;
    }

    nav ul li {
        text-align: left;
        display: block;
        list-style: none;
        padding: 15px 10px;
        border-bottom: 1px solid white;
        background: #F2F2F2;
    }

    .li-link,
    .li-link-termin {
        display: block;
        text-transform: uppercase;
        color: #990000 !important;
        letter-spacing: 0.0625em;
        text-decoration: none;
        padding: 21px 10px;
    }

    /** Anpassungen Checkbox+Label (Button) **/

    input#open-menu {
        display: none;
    }

    input[type=checkbox]:checked~nav {
        display: block;
    }

    label.open-menu-label {
        font-family: Arial, Helvetica, sans-serif;
        text-transform: uppercase;
        background: #F2F2F2;
        padding: 20px 20px;
        border-bottom: 1px solid white;
        display: block;
    }

    /** End navigation **/

    /** Navigation **/
    .fixiert_menue_desktop {
        position: sticky;
        top: 0px;
        /*  height: 100px;   */
        width: 100%;
        z-index: 999;
        box-sizing: border-box;
    }

    /*.fixiert_menue_mobile {
    position: sticky;
    top: 10px;
/*  height: 60px;   
    width: 100%;
    z-index:999;
    box-sizing: border-box;  
} */

    nav {
        display: none;
        font-family: Arial, Helvetica, sans-serif;
        padding: 0px 21px;
        background: #F2F2F2;
    }

    nav ul {
        padding: 0px;
        margin: 0px;
        width: 100%;
    }

    nav ul li {
        text-align: left;
        display: block;
        list-style: none;
        padding: 15px 10px;
        border-bottom: 1px solid white;
        background: #F2F2F2;
    }

    .li-link,
    .li-link-termin {
        font: 15px Arial, Helvetica, sans-serif;
        display: inline;
        text-transform: uppercase;
        color: #990000 !important;
        letter-spacing: 0.0625em;
        text-decoration: none;
        padding: 21px 10px;
    }

    /** Anpassungen Checkbox+Label (Button) **/

    input#open-menu {
        display: none;
    }

    input[type=checkbox]:checked~nav {
        display: block;
    }

    label.open-menu-label {
        font-family: Arial, Helvetica, sans-serif;
        text-transform: uppercase;
        text-align: center;
        background: #F2F2F2;
        padding: 14px 14px;
        border-bottom: 1px solid white;
        display: block;
    }

    /** End navigation **/


    /* �berschreiben der allgemeinen "nav ul li { list-style: none; }" Regel */
    #tocTitle {
        padding-bottom: 0;
        list-style: none;
        cursor: default;
    }

    nav.style-toc ul li,
    #tocNav ul li {
        list-style-type: disc !important;
        list-style-position: outside !important;
        background-color: transparent !important;
        margin-bottom: 0.25rem !important;
        /* nach Wunsch anpassen */
        margin-left: 0.85em;
        padding: 0 !important;
        /* sicherstellen, dass kein Padding oben/unten extra da ist */
        color: #900 !important;
    }

    nav.style-toc,
    #tocNav {
        background-color: transparent !important;
        display: block !important;
    }

    nav.style-toc ul,
    #tocNav ul {
        padding-left: 0 !important;
        margin-left: 0 !important;
        margin-top: 0 !important
    }

    /* Falls der <a> oder Link selbst grau hinterlegt ist */
    nav.style-toc ul li a,
    #tocNav ul li a {
        background-color: transparent !important;
        color: #900 !important;
    }

    .div-column-left {
        display: none;
    }

    .div-column-left-single-column-708px {
        display: block;
        width: 100%;
        vertical-align: top;
        float: left;
    }

    .div-column-right {
        width: 100%;
    }

    .div-box {
        width: 33.33%;
    }

    /* ---- Wartezeit und Aktuelles Info-Boxen Index-Datei! ----*/
    .flex-section {
        flex-direction: column;
        gap: 40px;
        /* vertikaler Abstand auf Mobile */
    }

    .box-info {
        width: 100%;
    }

    .div-wartezeit-left {
        width: 100%;
    }

    .div-aktuelles-right {
        width: 100%;
    }

    /*----------- ende ------------------------------------------*/

    .margin-top-vertrauen {
        margin-top: 30px !important;
    }

    .margin-bottom-box-several-colums-two-one {
        margin-bottom: 0px !important;
    }

    .einruecken-125 {
        padding-left: 90px;
        padding-right: 90px;
    }

    .einruecken-210 {
        display: block;
        padding: 10px 170px 10px 170px;
    }

    .padding-250 {
        display: block;
        padding: 0px 180px 0px 180px;
    }

    .hr-footer {
        margin-left: 280px;
        margin-right: 280px;
    }

    .abfrage {
        font-size: 2rem;
    }

    .div-logo-right {
        display: none;
    }

    .div-box-photo {
        width: 48.68%;
    }

    .div-photo-1 {
        width: 30.31%;
        padding-bottom: 30px;
        margin-left: 18.75%;
    }

    .div-photo-2 {
        width: 30.31%;
        padding-bottom: 30px;
        margin-left: 36px;
    }

    .div-photo-3 {
        width: 30.31%;
        padding-bottom: 30px;
        margin-left: 18.75%;
    }

    .div-photo-4 {
        width: 30.31%;
        padding-bottom: 30px;
        margin-left: 36px;
    }

    .div-flex-2-colums {
        width: 339px;
    }

    .div-flex-3-colums {
        width: 100%;
    }

    .div-flex-2-colums-gap {
        width: 30px;
        float: left;
        box-sizing: border-box;
    }

    .div-flex-3-colums-gap {
        width: 30px;
        float: left;
    }

    .div-flex-1-colum-center {
        width: 100%;
    }

    .einruecken-jameda {
        padding-left: 20px;
        padding-right: 20px;
    }

    .border-jameda {
        margin: 50px 20px 20px 20px;
    }

    .h3-next-to-photo {
        margin-top: -7px !important;
    }

    .h3-under-photo,
    .h3-under-photo-center,
    p.h3-under-photo,
    .p-under-photo-left {
        padding-left: 16px;
        padding-right: 16px;
    }

    p.under-photo-white-background {
        padding: 66px 66px 47px 66px;
    }

    p.quote-under-photo {
        padding: 15px 69px 15px 69px;
    }

    p.under-photo-center {
        padding-left: 16px;
        padding-right: 16px;
    }

    p.under-photo-box-000 {
        padding-left: 16px;
        padding-right: 16px;
    }

    p.under-photo {
        padding-left: 16px;
        padding-right: 16px;
    }

    .index-header {
        padding: 25px 0px 25px 18px !important;
    }

    .index {
        padding-left: 18px !important;
    }

    /* ---------- zu mir ---------- */
    .zu-mir-opacity {
        height: 490px;
        width: 60%;
    }

    /* ---------- End ---------- */
    /* ---- link in the photo */

    .opacity-flex-3-colums-900-rel {
        margin-top: -120px;
    }

    .opacity-flex-3-colums-header {
        font: 0.875rem/1.125 Arial, Helvetica, sans-serif;
    }

    p.under-opacity-flex-3-colums {
        font: 1.0625rem/1.3 Arial, Helvetica, sans-serif;
    }
    /* footer */
    .bewertungen-footer {
        max-width: 580px;
    }
    /* Ende footer */
}

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

    /*  pop-up */
    .popup-text {
        font-size: 0.9375rem;
        line-height: 1.5;
    }

    .popup-link {
        font-size: 1rem;
    }

    /* gr��erer Link f�r Touchscreen */


    /* ------ FAQ ------ */

    details {
        font: 1.063rem/1.3 Arial, Helvetica, sans-serif;
    }

    /*
summary {
    margin-top: 12px !important;
    margin-bottom: -2px !important;
}
/* ------ End FAQ ------ */
    /*
summary {
    margin-top: 30px !important;
    margin-bottom: -2px !important;
}
 */
    .div-display-none-inline {
        display: inline;
    }

    .div-display-inline-none {
        display: none;
    }

    .div-active {
        max-width: 543px;
    }

    /* --- Jameda  ---- */
    .jameda-bewertungen-footer {
        padding: 8px 30px 22px 30px;
        /* max-width: 543px; */
        /* volle Content-Breite */
    }

    .faq-container {
        max-width: 480px;
    }

    .info-telefon {
        background-image: url("/images/leistungen/behandlungsschwerpunkte/info-telefon-740.jpg");
        height: 280px;
    }

    .info-abende-essstoerungen {
        background-image: url("/images/leistungen/behandlungsschwerpunkte/info-abende-essstoerungen-740.jpg");
        height: 280px;
    }

    .videosprechstunde-paartherapie {
        background-image: url("/images/leistungen/therapieangebote/videosprechstunde-paartherapie-570.jpg");
        height: 290px;
    }

    .kinder-leiden-am-meisten {
        background-image: url("/images/leistungen/therapieangebote/eheberatung-paderborn/kinder-leiden-am-meisten-767.jpg");
        left: 0px;
        top: 0px;
        height: 400px;
    }

    .div-text-photo {
        margin-top: -125px;
    }

    .div-text {
        max-width: 517px;
        margin-left: auto;
        margin-right: auto;
    }

    div.table {
        display: none;
    }

    /* Aktuelles */
    .div-photo-le-termine {
        width: 100%;
        float: left;
    }

    .div-photo-ri-termine {
        width: 100%;
        float: right;
    }

    .div-text-le-termine {
        width: 100%;
        float: left;
    }

    .div-text-ri-termine {
        width: 100%;
        float: right;
    }

    /*-------- Klassen float ---------*/
    .div-photo-le-blog {
        width: 100%;
        max-width: 100%;
        float: none;
    }

    .div-text-ri-blog {
        width: 100%;
        float: none;
    }

    .div-box {
        width: 50%;
    }

    .zum-seitenanfang a {
        display: none;
    }

    p.quote-patient {
        padding: 30px 20px;
    }

    /** Navigation **/
    .fixiert_menue_desktop {
        position: sticky;
        top: 0px;
        /*  height: 100px;   */
        width: 100%;
        z-index: 900;
        box-sizing: border-box;
    }

    .fixiert_menue_mobile {
        position: sticky;
        top: 0px;
        /*  height: 60px;  */
        width: 100%;
        z-index: 900;
        box-sizing: border-box;
    }

    nav {
        display: none;
        font-family: Arial, Helvetica, sans-serif;
        padding: 0px 21px;
    }

    nav ul {
        padding: 0px;
        margin: 0px;
        width: 100%;
    }

    nav ul li {
        text-align: left;
        display: block;
        list-style: none;
        padding: 15px 10px;
        border-bottom: 1px solid white;
        background: #F2F2F2;
    }

    .li-link {
        text-transform: uppercase;
        color: #990000 !important;
        letter-spacing: 0.0625em;
        text-decoration: none;
        padding: 21px 10px;
    }

    /** Anpassungen Checkbox+Label (Button) **/

    input#open-menu {
        display: none;
    }

    input[type=checkbox]:checked~nav {
        display: block;
    }

    label.open-menu-label {
        font-family: Arial, Helvetica, sans-serif;
        text-transform: uppercase;
        background: #F2F2F2;
        padding: 20px 20px;
        border-bottom: 1px solid white;
        display: block;
    }

    /** End navigation **/

    .einruecken-125 {
        padding-left: 70px;
        padding-right: 70px;
    }

    .padding-250 {
        display: block;
        padding: 0px 120px 0px 120px;
    }

    .abfrage {
        font-size: 1.8rem;
    }


    /** --------------- Navigation ----------------**/

    .fixiert_menue_desktop {
        position: sticky;
        top: 0px;
        /*  height: 100px;   */
        width: 100%;
        z-index: 900;
        box-sizing: border-box;
    }

    .fixiert_menue_mobile {
        position: sticky;
        top: 0px;
        /*  height: 60px;  */
        width: 100%;
        z-index: 900;
        box-sizing: border-box;
    }

    nav {
        display: none;
        font-family: Arial, Helvetica, sans-serif;
        padding: 0px 21px;
    }

    nav ul {
        padding: 0px;
        margin: 0px;
        width: 100%;
    }

    nav ul li {
        text-align: left;
        display: block;
        list-style: none;
        padding: 15px 10px;
        border-bottom: 1px solid white;
        background: #F2F2F2;
    }

    .li-link {
        text-transform: uppercase;
        color: #990000 !important;
        letter-spacing: 0.0625em;
        text-decoration: none;
        padding: 21px 10px;
    }

    /** Anpassungen Checkbox+Label (Button) **/

    input#open-menu {
        display: none;
    }

    input[type=checkbox]:checked~nav {
        display: block;
    }

    label.open-menu-label {
        font-family: Arial, Helvetica, sans-serif;
        text-transform: uppercase;
        background: #F2F2F2;
        padding: 14px 14px;
        border-bottom: 1px solid white;
        display: block;
    }

    /** End navigation **/

    nav.style-toc ul li,
    #tocNav ul li {
        /*  line-height: 1.6 !important;  /* am 25.01.2026 diese Klasse eingefügt */
        ;
    }

    .div-column-left-single-column-708px {
        display: none;
    }

    .div-column-left-single-column-517px {
        display: block;
        width: 100%;
        vertical-align: top;
        float: left;
    }

    .div-column-right {
        width: 100%;
        vertical-align: top;
        float: right;
        padding-bottom: 30px;
    }

    p.under-photo-white-background {
        padding: 53px 42px 34px 42px;
    }

    p.quote-under-photo {
        padding: 10px 10px 10px 32px;
    }

    p.under-photo-red-background {
        font-size: 0.875rem;
    }

    .index-header {
        padding: 25px 0px 25px 15px !important;
    }

    .index {
        padding-left: 15px !important;
    }

    /* ---------- zu mir ---------- */

    .jameda-siegel {
        top: 25vh !important;
    }

    .info-offer a {
        left: 30px;
    }

    .zu-mir-opacity {
        height: 466px;
        width: 80%;
    }

    .zu-mir-ueberschrift {
        margin-top: 34px !important;
        margin-bottom: -8px;
    }

    /* ---------- End ---------- */

    .div-flex-2-colums {
        width: 100%;
    }

    .div-flex-2-colums-gap {
        width: 0px;
        float: left;
    }

    .div-flex-3-colums-gap {
        width: 0px;
        float: left;
    }

    .div-info-red {
        padding: 40px;
        margin: 50px 40px 50px 40px;
    }

    .div-info-white {
        padding: 40px;
        margin: 50px 40px 50px 40px;
    }

    .div-flex-left-40 {
        width: 100%;
    }

    .div-flex-right-60 {
        width: 100%;
    }

    .div-flex-left {
        width: 100%;
    }

    .div-flex-right {
        width: 100%;
    }

    .div-column-right {
        width: 100%;
        vertical-align: top;
        float: right;
        padding-bottom: 30px;
    }

    .margin-photo-blogpost {
        margin-bottom: 0px !important;
    }

    .margin-top-vertrauen {
        margin-top: 25px !important;
    }

    .einruecken {
        padding-left: 20px;
        padding-right: 20px;
    }

    .einruecken-jameda {
        padding-left: 20px;
        padding-right: 20px;
    }

    .border-jameda {
        margin: 50px 20px 20px 20px;
    }

    .border-toc {
        margin: 0px 0px 0px 0px;
    }

    .einruecken-210 {
        display: block;
        padding: 10px 120px 10px 120px;
    }

    .hr-footer {
        margin-left: 180px;
        margin-right: 180px;
    }

    .offer a {
        padding-left: 14px;
    }

    h1 {
        font-size: 2.105rem;
    }

    .h1 {
        font-size: 2.105rem;
    }

    .h1-head {
        font-size: 0.875rem;
    }

    h2 {
        font-size: 1.579rem;
    }

    .heading-style-h2 {
        font-size: 1.579rem;
    }

    .h2-over-photos {
        text-align: center;
        padding-top: 15px;
        margin-bottom: 55px;
    }

    .separation {
        font-size: 1.579rem;
        padding-top: 45px;
        padding-bottom: 45px;
    }

    h3 {
        font-size: 1.375rem;
    }

    .h3-next-to-photo-without-margin-top {
        margin-top: 30px !important;
        margin-bottom: -2px !important;
    }

    .h3-under-photo,
    .h3-under-photo-center,
    p.h3-under-photo,
    .p-under-photo-left {
        font-size: 1.375rem;
    }

    .h3-under-photo,
    p.h3-under-photo,
    .p-under-photo-left {
        line-height: 1.4;
    }

    p {
        font-size: 0.9375rem;
    }

    .cont-text {
        font-size: 1rem;
        line-height: 1.7;
    }

    p.under-photo {
        font-size: 0.9375rem;
        /* vorher 1 rem  */
        line-height: 1.7;
    }

    p.under-photo-center {
        font-size: 0.9375rem;
    }

    .author-text {
        font-size: 0.875rem;
        ;
        /* 14px */
    }

    .note {
        font-size: 0.875rem;
        /* 15px */
    }

    ul.style-ul,
    .hentry ul {
        font-size: 1rem;
        line-height: 1.7;
    }

    ul.style-toc,
    .hentry ul {
        font-size: 0.875rem;
        line-height: 1.5;
        padding: 0px 0px 0px 10px;
    }

    .style162 {
        margin: 50px 20px 50px 20px;
    }

    ol.standard {
        font-size: 1rem;
        line-height: 1.7;
        padding: 0px 39px 0px 39px;
    }

    .photo-link-543 img {
        position: absolute;
        clip: rect(20px 543px 372px 0px);
        overflow: hidden;
    }

    /* ---- link in the photo --- */
    .opacity-flex-3-colums-900-rel {
        margin-top: -98px;
        height: 80px;
    }

    .opacity-flex-3-colums-header {
        font: 0.9375rem Arial, Helvetica, sans-serif;
    }

    p.under-opacity-flex-3-colums {
        font: 1.5rem/1.3 Arial, Helvetica, sans-serif;
        margin-top: -6px;
    }

    /* ---- Footer ---- */
    p.jameda-footer {
    font-size: 0.938rem;
}
    .div-box-kontakt-ueber-mich {
        width: 95% !important;
    }

    .div-box-hn {
        width: 95% !important;
    }

    .div-box-oeffnung {
        width: 95% !important;
    }

    .div-box-rechtliches {
        width: 95% !important;
    }

    .headlines-footer--secondary {
        margin-top: 35px;
    }

    .padding-bottom-footer {
        padding-bottom: 10px;
    }

    .copyright {
        padding-top: 15px;
        padding-bottom: 14px;
    }

    /* ---- End footer ---- */
}

/* ---------- media query max 576px ---------- */
@media screen and (max-width: 576px) {
    figcaption {
        font-size: 0.875rem;
    }

    /* ---- Page layout ---- */
    .zum-seitenanfang a {
        display: none;
    }

    .div-active {
        max-width: 576px;
        padding-left: 17px;
        padding-right: 17px;
    }

    .jameda-bewertungen-footer {
        padding: 6px 30px 22px 30px;
        /* max-width: 576px; */
        /* volle Content-Breite */
        margin-left: 17px;
        margin-right: 17px;
    }

    .info-telefon {
        background-image: url("/images/leistungen/behandlungsschwerpunkte/info-telefon-740.jpg");
        height: 310px;
    }

    .info-abende-essstoerungen {
        background-image: url("/images/leistungen/behandlungsschwerpunkte/info-abende-essstoerungen-740.jpg");
        height: 310px;
    }

    .paartherapie-online {
        background-image: url("images/leistungen/therapieangebote/paartherapie-online-543.jpg");
        height: 320px;
    }

    .videosprechstunde-paartherapie {
        background-image: url("/images/leistungen/therapieangebote/videosprechstunde-paartherapie-545.jpg");
        height: 313px;
    }

    .kinder-leiden-am-meisten {
        background-image: url("/images/leistungen/therapieangebote/eheberatung-paderborn/kinder-leiden-am-meisten-576.jpg");
        left: 0px;
        top: 0px;
        height: 340px;
    }

    .margin-link-footer {
        margin: 6px 0 6px 0;
    }

    .margin-link-footer-second-in-a-row {
        margin: 6px 0 5px 0;
        display: inline-block;
    }

    .margin-link-footer-photo-proof {
        margin: 35px 0 5px 0;
        display: inline-block;
    }

    .margin-top-over-photo {
        margin-top: 50px !important;
    }

    .margin-bottom-under-photo {
        margin-bottom: 44px !important;
    }

    .margin-top-under-photo {
        margin-top: 44px !important;
    }

    .div-text-photo {
        padding: 10px 5% 0px 5%;
        box-sizing: border-box;
    }

    .div-text {
        max-width: 547px;
        margin-left: 15px;
        margin-right: 15px;
        box-sizing: border-box;
    }

    .div-logo-left {
        display: none;
    }

    .div-logo-mobile {
        display: inline;
        float: left;
        margin-top: 6px;
        margin-bottom: 5px;
    }

    .div-box-offer-1 {
        width: 100%;
    }

    .div-box-offer-2 {
        width: 100%;
    }

    .div-box-offer-3 {
        width: 100%;
    }

    .div-box-offer-4 {
        width: 100%;
    }

    .div-flexbox {
        justify-content: center;
    }

    .div-photo-1 {
        width: 100%;
        padding-bottom: 30px;
        margin: 0 auto;
    }

    .div-photo-2 {
        width: 30.31%;
    }

    .div-photo-3 {
        width: 30.31%;
    }

    .div-photo-4 {
        width: 30.31%;
    }

    .div-logo {
        width: 92%
    }

    #logo {
        background-image: url(images/index/hn.png);
        margin-top: 20px;
        margin-bottom: 35px;
        background-size: 100% auto;
        float: left;
        box-sizing: border-box;
    }

    .div-box-photo {
        width: 100%;
    }

    .einruecken-125 {
        padding-left: 50px;
        padding-right: 50px;
    }

    .padding-200 {
        padding: 0 50px 0 50px;
    }

    .padding-250 {
        display: block;
        padding: 0px 40px 0px 40px;
    }

    .hr-footer {
        margin-left: 160px;
        margin-right: 160px;
    }

    /* ---------- zu mir ---------- */
    .zu-mir-ueberschrift {
        font: 22px Arial, Helvetica, sans-serif !important;
        line-height: 24px;
        margin-top: 28px !important;
        margin-bottom: -24px;
    }

    .zu-mir span {
        font: 0.875rem Arial, Helvetica, sans-serif;
        line-height: 23px;
    }

    .zu-mir-opacity {
        height: 460px;
        width: 80%;
    }

    /* ---------- End ---------- */
    .div-info-red {
        padding: 30px;
        margin: 40px 30px 40px 30px;
    }

    .div-info-white {
        padding: 30px;
        margin: 40px 30px 40px 30px;
    }

    .div-photo-le-blog-long-text {
        width: 100%;
        max-width: 100%;
        float: none;
    }

    .div-foto-links {
        width: 100%;
        vertical-align: top;
        float: left;
        padding-bottom: 15px !important;
    }

    .div-foto-rechts {
        width: 100%;
        vertical-align: top;
        float: right;
        background-color: #FFFFFF;
        padding-bottom: 15px;
    }

    .div-foto-li-blog {
        width: 100%;
        vertical-align: top;
        float: left;
        padding-bottom: 10px;
    }

    .div-text-re-blog {
        width: 100%;
        margin-bottom: -15px;
    }

    .div-foto-links-flex {
        width: 100%;
        vertical-align: top;
        float: left;
    }

    .div-seminar-sp-li {
        width: 22%;
    }

    .div-seminar-sp-re {
        width: 78%;
    }

    /* ---- End page layout ---- */

    /** Navigation **/
    .fixiert_menue_desktop {
        position: sticky;
        top: 0px;
        /*  height: 100px;   */
        width: 100%;
        z-index: 900;
        box-sizing: border-box;
    }

    .fixiert_menue_mobile {
        position: sticky;
        top: 0px;
        /*  height: 60px;  */
        width: 100%;
        z-index: 900;
        box-sizing: border-box;
    }

    nav {
        display: none;
        font-family: Arial, Helvetica, sans-serif;
        padding: 0px 21px;
    }

    nav ul {
        padding: 0px;
        margin: 0px;
        width: 100%;
    }

    nav ul li {
        text-align: left;
        display: block;
        list-style: none;
        padding: 20px 10px;
        border-bottom: 1px solid white;
        background: #F2F2F2;
    }

    .li-link {
        text-transform: uppercase;
        color: #990000 !important;
        letter-spacing: 0.0625em;
        text-decoration: none;
        padding: 21px 10px;
    }

    /** Anpassungen Checkbox+Label (Button) **/

    input#open-menu {
        display: none;
    }

    input[type=checkbox]:checked~nav {
        display: block;
    }

    label.open-menu-label {
        font-family: Arial, Helvetica, sans-serif;
        text-transform: uppercase;
        background: #F2F2F2;
        padding: 14px 14px;
        border-bottom: 1px solid white;
        display: block;
    }

    /** End navigation **/

    .einruecken {
        padding-left: 15px;
        padding-right: 15px;
    }

    .einruecken-jameda {
        padding-left: 10px;
        padding-right: 10px;
    }

    .border-jameda {
        margin: 50px 12px 20px 12px;
    }

    .einruecken-210 {
        display: block;
        padding: 10px 60px 10px 60px;
    }

    .h3-neben-foto {
        margin-top: 5px !important;
    }

    .abfrage {
        font-size: 1.2rem;
    }

    .h4-neben-foto {
        margin-top: 6px !important;
    }

    .style162 {
        margin: 50px 12px 50px 12px;
    }

    ol.standard {
        padding: 0px 31px 0px 31px;
    }

    /* ------ photo --------------------------*/
    .subtitle {
        font-size: 0.75rem;
        line-height: 1.5;
    }

    .foto-oben {
        padding: 9.17% 0%;
    }

    /*-------------end photo ---------*/
    /* ---- link in the photo ----*/
    .opacity-flex-3-colums-header {
        font: 0.875rem Arial, Helvetica, sans-serif;
    }

    p.under-opacity-flex-3-colums {
        font: 1.0625rem/1.3 Arial, Helvetica, sans-serif;
    }
        /* footer */
    .bewertungen-footer {
        max-width: 441px;
    }
    /* Ende footer */
}

/* ---------- media query max 400px ---------- */

@media screen and (max-width: 400px) {
    .div-active {
        max-width: 400px
    }

    .jameda-bewertungen-footer {
        padding: 8px 30px 22px 30px;
        /* max-width: 400px; */
        /* volle Content-Breite */
    }

    /* --- glossar and faq ---*/
    .headline-glossar {
        font-size: 20px;
        line-height: 66px;
    }

    .p-glossar {
        margin-top: 10px;
        line-height: 1.5;
    }

    /* --- end glossar and faq ---*/
    .kinder-leiden-am-meisten {
        background-image: url("/images/leistungen/therapieangebote/eheberatung-paderborn/kinder-leiden-am-meisten-400.jpg");
        left: 0px;
        top: 0px;
        height: 235px;
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .div-text-photo {
        background-color: #FFFFFF !important;
        max-width: 92.16%;
        margin-top: -80px;
        margin-left: auto;
        margin-right: auto;
        padding: 1px 14px 0px 14px;
        box-sizing: border-box;
    }

    .jameda-siegel {
        top: 25vh !important;
    }

    .border-kontakt {
        border-top: 1px solid #E8E8E8;
        box-sizing: border-box;
    }

    .div-test {
        margin-left: 17px;
        margin-right: 17px;
        box-sizing: border-box;
    }

    .div-517-logo {
        display: none;
    }

    .essstoerung-hilfe-online {
        background-image: url("/images/leistungen/therapieangebote/essstoerung-hilfe-online-400.jpg");
        height: 350px;
    }

    .eheberatung-paderborn {
        background-image: url("/images/leistungen/therapieangebote/eheberatung-paderborn/eheberatung-paderborn-400.jpg");
        height: 350px;
    }

    .paartherapie-online {
        background-image: url("/images/leistungen/therapieangebote/paartherapie-online-400.jpg");
        height: 350px;
    }

    .info-telefon {
        background-image: url("/images/leistungen/behandlungsschwerpunkte/info-telefon-400.jpg");
        height: 350px;
    }

    .videosprechstunde-paartherapie {
        background-image: url("/images/leistungen/therapieangebote/videosprechstunde-paartherapie-366.jpg");
        height: 282px;
    }

    .info-abende-essstoerungen {
        background-image: url("/images/leistungen/behandlungsschwerpunkte/info-abende-essstoerungen-400.jpg");
        height: 350px;
    }

    .text-im-foto-seelische-gesundheit {
        height: 300px;
    }

    .text-im-foto-blog-eheberatung-und-paartherapie {
        height: 300px;
    }

    .text-between-lines {
        font-size: 0.9375rem;
        line-height: 1.6;
    }

    .zum-seitenanfang a {
        display: none;
    }

    /** ---------------- Navigation ----------------- **/
    .fixiert_menue_desktop {
        position: sticky;
        top: 0px;
        /*   line-height: 100px; */
        width: 100%;
        z-index: 900;
        box-sizing: border-box;
    }

    .fixiert_menue_mobile {
        position: sticky;
        top: 0px;
        /*   line-height: 60px;  */
        width: 100%;
        z-index: 900;
        box-sizing: border-box;
    }

    nav {
        display: none;
        font-family: Arial, Helvetica, sans-serif;
        padding: 0px 21px;
    }

    nav ul {
        padding: 0px;
        margin: 0px;
        width: 100%;
    }

    nav ul li {
        text-align: left;
        display: block;
        list-style: none;
        padding: 14px 10px;
        border-bottom: 1px solid white;
        background: #F2F2F2;
    }

    .li-link {
        text-transform: uppercase;
        font-size: 15px;
        color: #990000 !important;
        letter-spacing: 0.0625em;
        text-decoration: none !important;
        padding: 14px 10px;
    }

    /** Anpassungen Checkbox+Label (Button) **/
    input#open-menu {
        display: none;
    }

    input[type=checkbox]:checked~nav {
        display: block;
    }

    label.open-menu-label {
        font-family: Arial, Helvetica, sans-serif;
        font-size: 0.9375rem;
        text-transform: uppercase;
        background: #F2F2F2;
        padding-top: 14px;
        padding-bottom: 14px;
        border-bottom: 1px solid white;
        display: block;
    }

    /** End navigation **/

    /* ---- Page layout ---- */
    div.table {
        display: none;
    }

    .div-logo {
        display: none;
    }

    .div-box {
        width: 100%;
    }

    #logo-mobile {
        float: left;
        box-sizing: border-box;
    }

    .einruecken-125 {
        padding-left: 30px;
        padding-right: 30px;
    }

    .padding-200 {
        padding: 0 20px 0 20px;
    }

    .padding-250 {
        display: block;
        padding: 0px 15px 0px 15px;
    }

    .therapien a {
        width: 260px;
    }

    .div-column-left-single-column-517px {
        display: none;
    }

    .div-column-left-single-column-366px {
        display: block;
        width: 100%;
        vertical-align: top;
        float: left;
    }

    /* ---------- zu mir ---------- */
    .zu-mir-opacity {
        height: 460px;
        width: 88%;
    }

    .zu-mir-ueberschrift {
        margin-top: 28px !important;
        margin-bottom: -22px;
        font: 22px Arial, Helvetica, sans-serif !important;
        line-height: 22px;
    }

    .zu-mir span {
        font: 0.75rem Arial, Helvetica, sans-serif;
        line-height: 23px;
    }

    /* ---------- End ---------- */

    .div-info-red {
        padding: 30px;
        margin: 40px 20px 40px 20px;
    }

    .div-info-white {
        padding: 30px;
        margin: 40px 20px 40px 20px;
    }

    .div-foto-links {
        width: 100%;
        vertical-align: top;
        float: left;
    }

    .div-foto-rechts {
        width: 100%;
        vertical-align: top;
        float: right;
        background-color: #FFFFFF;
    }

    .div-photo-left-grew-background {
        width: 100%;
        padding-bottom: 30px;
        padding-left: 20px;
    }

    .div-photo-right-grew-background {
        width: 100%;
        padding-right: 20px;
    }

    .div-foto-li-blog {
        width: 100%;
        vertical-align: top;
        float: left;
        padding-bottom: 20px;
    }

    .div-text-re-blog {
        width: 100%;
        margin-bottom: -15px;
    }

    .div-foto-links-flex {
        width: 100%;
        vertical-align: top;
        float: left;
    }

    .navigation-therapien a {
        font: 0.875rem Arial, Helvetica, sans-serif;
        line-height: 56px;
    }

    nav.style-toc {
        display: block !important;
    }

    .div-seminar-sp-li {
        width: 27%;
    }

    .div-seminar-sp-re {
        width: 73%;
    }

    /* ---- End page layout ---- */

    .einruecken-jameda {
        padding-left: 10px;
        padding-right: 10px;
        padding-bottom: 0px;
    }

    .border-jameda {
        border: none;
        margin: 0px 0px 0px 0px;
        text-align: center;
        background-color: #FFFFFF;
    }

    .einruecken {
        padding-left: 15px;
        padding-right: 15px;
    }

    .einruecken-210 {
        display: block;
        padding: 10px 60px 10px 60px;
    }

    .padding-h3-red-box {
        padding: 10px 30px 5px 30px;
    }

    .padding-p-red-box {
        padding: 2px 30px 3px 30px;
    }

    .padding-button-left-red-box {
        padding: 6px 30px 18px 30px;
    }

    .padding-h1-index {
        padding-left: 10px;
        padding-right: 10px;
    }

    .h3-under-photo,
    .h3-under-photo-center,
    p.h3-under-photo,
    .p-under-photo-left {
        padding-left: 0;
        padding-right: 0;
    }

    .h3-neben-foto {
        margin-top: 5px !important;
    }

    .h4-neben-foto {
        margin-top: 6px !important;
    }

    p {
        color: #444;
    }

    p.quote-patient {
        font-size: 1rem;
        line-height: 1.6;
        padding: 25px 15px;
    }

    p.under-photo-center {
        padding-left: 0px;
        padding-right: 0px;
    }

    p.under-photo {
        padding-left: 0px;
        padding-right: 0px;
    }

    p.under-photo-box-000 {
        padding-left: 0px;
        padding-right: 0px;
    }

    .style162 {
        border: none;
        margin: 50px 0px 50px 0px;
    }

    ol.standard {
        padding: 0px 31px 0px 31px;
    }

    .foto-oben {
        padding: 9.17% 0%;
    }

    .hr-footer {
        margin-left: 120px;
        margin-right: 120px;
    }

    .style11 {
        color: #FFFFFF;
        font-size: 0.9375rem;
    }

    .termin-vereinbaren a {
        width: 260px;
    }

    .index-therapien a {
        width: 260px;
        margin-top: 10px;
        margin-bottom: 20px;
    }

    /* ---- link in the photo --- */
    .opacity-flex-3-colums-900-rel {
        margin-top: -105px;
        height: 88px;
    }

    .opacity-flex-3-colums-header {
        font: 0.875rem Arial, Helvetica, sans-serif;
    }

    p.under-opacity-flex-3-colums {
        font: 1.0rem/1.3 Arial, Helvetica, sans-serif;
        margin-top: -6px;
    }

    /* ---- Footer ---- */
    .headline-footer {
        padding: 30px 40px 12px 25px;
    }
    .bewertungen-footer {max-width: 330px;}

    /* ---- End footer ---- */
}

/* ----------------- Basis-HR-Divider -----------------*/

.divider {
    border: none;
    height: 1px;
    background-color: #ccc;
    max-width: 1140px;
    width: 100%;
    margin: 0 auto;
}

/* H1 margin-top */
.divider--margin-top-32-48 {
    margin-top: clamp(16px, 3.5vw, 28px);
}

/* H1 -> P */
.divider--margin-top-40-52 {
    margin-top: clamp(25px, 3.5vw, 28px);
}

/* P -> H2*/
.divider--margin-top-h2-40-52 {
    margin-top: clamp(25px, 3.5vw, 34px);
}

/* Abstand oben Foto oder mobile P-Tag zum Divider und nach unten symmetrisch 40-64 auf Seite blog-eheberatung-paartherapie */
.divider--margin-top-40-64 {
    margin-top: clamp(32px, 5vw, 64px);
    margin-bottom: clamp(40px, 5vw, 64px);
}


/* Abstand H2 -> Trennlinie und Trennlinie zu Foto symmetrisch 40-64 */
.divider--section-h2-divider-40-64-40-64 {
    margin-top: clamp(32px, 5vw, 55px);
    margin-bottom: clamp(40px, 5vw, 64px);
}

/* Abstand oben Foto oder mobile P-Tag zum Divider und nach unten */
.divider--section-40-64-50-80 {
    margin-top: clamp(32px, 5vw, 64px);
    margin-bottom: clamp(50px, 5vw, 80px);
}

/* Variante: gleiche Abschnitte oben und unten, responsiv */
.divider--section-80-80 {
    margin-top: clamp(40px, 5vw, 80px);
    margin-bottom: clamp(40px, 5vw, 80px);
}

/* Variante: wenn nach unten eine H2 folgt, responsiv */
.divider--section-80-100 {
    margin-top: clamp(36px, 5vw, 80px);
    margin-bottom: clamp(45px, 5vw, 100px);
}

.divider--section-top-32 {
    margin-top: clamp(05px, 2vw, 32px);
}

/* Zum Beispiel P -> H2 bzw. über H2 + Linie breadcrumb zu H1*/
.divider--margin-top-40-48 {
    margin-top: clamp(25px, 5vw, 30px);
    /* Visuell ~40px → 48px */
}

.divider--margin-top-40-60 {
    margin-top: clamp(40px, 5vw, 60px);
}

.divider--section-top-60 {
    margin-top: clamp(2.5rem, 6vw, 3.75rem);
    /* 40px → 60px */
}

/* Abstand über footer zum Text einer offenen Box 40-80 */
.divider--margin-top-40-80 {
    margin-top: clamp(30px, 5vw, 65px);
}

/* ============ Abstände von H / P-Tags / Divider ============== */
/* Abstand H2 margin-top section Hintergrundfarbe weiß */
.divider--margin-top-60-84 {
    margin-top: clamp(52px, 6vw, 76px);
    /* Visuell: 60px → 84px  */
}

/* Am P-Tag nach oben zu H2 */
.divider--after-h2 {
    margin-top: clamp(20px, 2.5vw, 25px);
    /* Visuell ~34-42px */
}

/* Am P-Tag nach oben zu H3 */
.divider--after-h3 {
    margin-top: clamp(13px, 1.5vw, 18px);
    /* Visuell ~26-34px */
}

/* Am Divider nach oben zum Foto (Desktop) / P-Tag (Mobile) */
.divider--after-photo {
    margin-top: clamp(32px, 5vw, 59px);
    /* Visuell 40 - 60px */
}

/* Am Divider nach oben zu P last Box */
.divider--line-to-p-last-photo {
    margin-top: clamp(22px, 5vw, 46px);
    /* Visuell 40 - 60px */
}

/* Am Foto nach oben zum Divider */
.divider--after-divider {
    margin-top: clamp(40px, 5vw, 60px);
    /* Visuell 40 - 60px */
}

/* P → Inhaltsverzeichnis */
.divider--p-to-toc {
    margin-top: clamp(22px, 5vw, 41px);
    /* Visuell 40 - 60px */
}

/* Inhaltsverzeichnis → H2 */
.divider--toc-to-h2 {
    margin-top: clamp(34px, 6vw, 58px);
    /* Visuell 48 - 72px */
}

/* P → H2 */
.divider--p-to-h2 {
    margin-top: clamp(25px, 5vw, 30px);
    /* Visuell 40 - 48px */
}

/* P → H3 */
.divider--p-to-h3 {
    margin-top: clamp(18px, 4vw, 24px);
    /* Visuell 32 - 40px */
}

/* p → p */
.divider--p-to-p {
    margin-top: clamp(15px, 2vw, 19px);
    /* Visuell 30 - 37px */
}


/* ------------------------------------------------------ */
.divider--section-top-100 {
    margin-top: clamp(40px, 6vw, 100px);
}

.divider--section-bottom-50 {
    margin-bottom: clamp(36px, 5vw, 50px);
}

.divider--section-bottom-60-button {
    margin-bottom: clamp(50px, 4vw, 60px);
}

/* für Button am Ende einer Section */

.divider--section-bottom-80 {
    margin-bottom: clamp(36px, 5vw, 80px);
}

.divider--margin-bottom-40-80 {
    margin-bottom: clamp(40px, 5vw, 80px);
}

.divider--section-padding-top-50 {
    padding-top: clamp(36px, 5vw, 50px);
}

.divider--section-padding-bottom-60-button {
    padding-bottom: clamp(50px, 4vw, 60px);
}

/* für Button am Ende einer Section */

.divider--section-padding-top-70 {
    padding-top: clamp(36px, 5vw, 70px);
}

/* Abstand H2 padding-top section Hintergrundfarbe */
.divider--padding-top-60-84 {
    padding-top: clamp(53px, 6vw, 77px);
    /* visuell: 60px → 84px  */
}

.divider--section-padding-top-100 {
    padding-top: clamp(40px, 6vw, 100px);
}

.divider--section-padding-bottom-50 {
    padding-bottom: clamp(36px, 5vw, 50px);
}

.divider--section-padding-bottom-60 {
    padding-bottom: clamp(36px, 5vw, 60px);
}

.divider--section-padding-bottom-70 {
    padding-bottom: clamp(36px, 5vw, 70px);
}

.divider--section-padding-bottom-80 {
    padding-bottom: clamp(36px, 5vw, 80px);
}

.divider--narrow {
    max-width: 600px;
}

.divider--light-bg {
    border-color: #eee;
}

/* Abstand nach unten Intro-Text H2/p zu Content Section */
.divider--margin-bottom-40-56 {
    margin-bottom: clamp(34px, 4vw, 46px);
    /* visuell: 40px → 56px */
}

/* --------------------- Ende Basis-HR-Divider --------------------- */

/* ========================================
   TAILWIND SPACING SYSTEM - KOMPLETT
   Margin & Padding Klassen
   ======================================== */

/* ==========================================
   MARGIN - ALL SIDES (m-)
   ========================================== */
.m-0 {
    margin: var(--space-0);
}

.m-px {
    margin: var(--space-px);
}

.m-0_5 {
    margin: var(--space-0_5);
}

.m-1 {
    margin: var(--space-1);
}

.m-1_5 {
    margin: var(--space-1_5);
}

.m-2 {
    margin: var(--space-2);
}

.m-2_5 {
    margin: var(--space-2_5);
}

.m-3 {
    margin: var(--space-3);
}

.m-3_5 {
    margin: var(--space-3_5);
}

.m-4 {
    margin: var(--space-4);
}

.m-5 {
    margin: var(--space-5);
}

.m-6 {
    margin: var(--space-6);
}

.m-7 {
    margin: var(--space-7);
}

.m-8 {
    margin: var(--space-8);
}

.m-9 {
    margin: var(--space-9);
}

.m-10 {
    margin: var(--space-10);
}

.m-11 {
    margin: var(--space-11);
}

.m-12 {
    margin: var(--space-12);
}

.m-14 {
    margin: var(--space-14);
}

.m-16 {
    margin: var(--space-16);
}

.m-20 {
    margin: var(--space-20);
}

.m-24 {
    margin: var(--space-24);
}

.m-28 {
    margin: var(--space-28);
}

.m-32 {
    margin: var(--space-32);
}

.m-36 {
    margin: var(--space-36);
}

.m-40 {
    margin: var(--space-40);
}


/* ==========================================
   MARGIN TOP (mt-)
   ========================================== */
.mt-0 {
    margin-top: var(--space-0);
}

.mt-px {
    margin-top: var(--space-px);
}

.mt-0_5 {
    margin-top: var(--space-0_5);
}

.mt-1 {
    margin-top: var(--space-1);
}

.mt-1_5 {
    margin-top: var(--space-1_5);
}

.mt-2 {
    margin-top: var(--space-2);
}

.mt-2_5 {
    margin-top: var(--space-2_5);
}

.mt-3 {
    margin-top: var(--space-3);
}

.mt-3_5 {
    margin-top: var(--space-3_5);
}

.mt-4 {
    margin-top: var(--space-4);
}

.mt-5 {
    margin-top: var(--space-5);
}

.mt-6 {
    margin-top: var(--space-6);
}

.mt-7 {
    margin-top: var(--space-7);
}

.mt-8 {
    margin-top: var(--space-8);
}

.mt-9 {
    margin-top: var(--space-9);
}

.mt-10 {
    margin-top: var(--space-10);
}

.mt-11 {
    margin-top: var(--space-11);
}

.mt-12 {
    margin-top: var(--space-12);
}

.mt-14 {
    margin-top: var(--space-14);
}

.mt-16 {
    margin-top: var(--space-16);
}

.mt-20 {
    margin-top: var(--space-20);
}

.mt-24 {
    margin-top: var(--space-24);
}

.mt-28 {
    margin-top: var(--space-28);
}

.mt-32 {
    margin-top: var(--space-32);
}

.mt-36 {
    margin-top: var(--space-36);
}

.mt-40 {
    margin-top: var(--space-40);
}


/* ==========================================
   MARGIN BOTTOM (mb-)
   ========================================== */
.mb-0 {
    margin-bottom: var(--space-0);
}

.mb-px {
    margin-bottom: var(--space-px);
}

.mb-0_5 {
    margin-bottom: var(--space-0_5);
}

.mb-1 {
    margin-bottom: var(--space-1);
}

.mb-1_5 {
    margin-bottom: var(--space-1_5);
}

.mb-2 {
    margin-bottom: var(--space-2);
}

.mb-2_5 {
    margin-bottom: var(--space-2_5);
}

.mb-3 {
    margin-bottom: var(--space-3);
}

.mb-3_5 {
    margin-bottom: var(--space-3_5);
}

.mb-4 {
    margin-bottom: var(--space-4);
}

.mb-5 {
    margin-bottom: var(--space-5);
}

.mb-6 {
    margin-bottom: var(--space-6);
}

.mb-7 {
    margin-bottom: var(--space-7);
}

.mb-8 {
    margin-bottom: var(--space-8);
}

.mb-9 {
    margin-bottom: var(--space-9);
}

.mb-10 {
    margin-bottom: var(--space-10);
}

.mb-11 {
    margin-bottom: var(--space-11);
}

.mb-12 {
    margin-bottom: var(--space-12);
}

.mb-14 {
    margin-bottom: var(--space-14);
}

.mb-16 {
    margin-bottom: var(--space-16);
}

.mb-20 {
    margin-bottom: var(--space-20);
}

.mb-24 {
    margin-bottom: var(--space-24);
}

.mb-28 {
    margin-bottom: var(--space-28);
}

.mb-32 {
    margin-bottom: var(--space-32);
}

.mb-36 {
    margin-bottom: var(--space-36);
}

.mb-40 {
    margin-bottom: var(--space-40);
}


/* ==========================================
   MARGIN LEFT (ml-)
   ========================================== */
.ml-0 {
    margin-left: var(--space-0);
}

.ml-px {
    margin-left: var(--space-px);
}

.ml-0_5 {
    margin-left: var(--space-0_5);
}

.ml-1 {
    margin-left: var(--space-1);
}

.ml-1_5 {
    margin-left: var(--space-1_5);
}

.ml-2 {
    margin-left: var(--space-2);
}

.ml-2_5 {
    margin-left: var(--space-2_5);
}

.ml-3 {
    margin-left: var(--space-3);
}

.ml-3_5 {
    margin-left: var(--space-3_5);
}

.ml-4 {
    margin-left: var(--space-4);
}

.ml-5 {
    margin-left: var(--space-5);
}

.ml-6 {
    margin-left: var(--space-6);
}

.ml-7 {
    margin-left: var(--space-7);
}

.ml-8 {
    margin-left: var(--space-8);
}

.ml-9 {
    margin-left: var(--space-9);
}

.ml-10 {
    margin-left: var(--space-10);
}

.ml-11 {
    margin-left: var(--space-11);
}

.ml-12 {
    margin-left: var(--space-12);
}

.ml-14 {
    margin-left: var(--space-14);
}

.ml-16 {
    margin-left: var(--space-16);
}

.ml-20 {
    margin-left: var(--space-20);
}

.ml-24 {
    margin-left: var(--space-24);
}

.ml-28 {
    margin-left: var(--space-28);
}

.ml-32 {
    margin-left: var(--space-32);
}

.ml-36 {
    margin-left: var(--space-36);
}

.ml-40 {
    margin-left: var(--space-40);
}


/* ==========================================
   MARGIN RIGHT (mr-)
   ========================================== */
.mr-0 {
    margin-right: var(--space-0);
}

.mr-px {
    margin-right: var(--space-px);
}

.mr-0_5 {
    margin-right: var(--space-0_5);
}

.mr-1 {
    margin-right: var(--space-1);
}

.mr-1_5 {
    margin-right: var(--space-1_5);
}

.mr-2 {
    margin-right: var(--space-2);
}

.mr-2_5 {
    margin-right: var(--space-2_5);
}

.mr-3 {
    margin-right: var(--space-3);
}

.mr-3_5 {
    margin-right: var(--space-3_5);
}

.mr-4 {
    margin-right: var(--space-4);
}

.mr-5 {
    margin-right: var(--space-5);
}

.mr-6 {
    margin-right: var(--space-6);
}

.mr-7 {
    margin-right: var(--space-7);
}

.mr-8 {
    margin-right: var(--space-8);
}

.mr-9 {
    margin-right: var(--space-9);
}

.mr-10 {
    margin-right: var(--space-10);
}

.mr-11 {
    margin-right: var(--space-11);
}

.mr-12 {
    margin-right: var(--space-12);
}

.mr-14 {
    margin-right: var(--space-14);
}

.mr-16 {
    margin-right: var(--space-16);
}

.mr-20 {
    margin-right: var(--space-20);
}

.mr-24 {
    margin-right: var(--space-24);
}

.mr-28 {
    margin-right: var(--space-28);
}

.mr-32 {
    margin-right: var(--space-32);
}

.mr-36 {
    margin-right: var(--space-36);
}

.mr-40 {
    margin-right: var(--space-40);
}


/* ==========================================
   MARGIN HORIZONTAL (mx- = left + right)
   ========================================== */
.mx-0 {
    margin-left: var(--space-0);
    margin-right: var(--space-0);
}

.mx-px {
    margin-left: var(--space-px);
    margin-right: var(--space-px);
}

.mx-0_5 {
    margin-left: var(--space-0_5);
    margin-right: var(--space-0_5);
}

.mx-1 {
    margin-left: var(--space-1);
    margin-right: var(--space-1);
}

.mx-1_5 {
    margin-left: var(--space-1_5);
    margin-right: var(--space-1_5);
}

.mx-2 {
    margin-left: var(--space-2);
    margin-right: var(--space-2);
}

.mx-2_5 {
    margin-left: var(--space-2_5);
    margin-right: var(--space-2_5);
}

.mx-3 {
    margin-left: var(--space-3);
    margin-right: var(--space-3);
}

.mx-3_5 {
    margin-left: var(--space-3_5);
    margin-right: var(--space-3_5);
}

.mx-4 {
    margin-left: var(--space-4);
    margin-right: var(--space-4);
}

.mx-5 {
    margin-left: var(--space-5);
    margin-right: var(--space-5);
}

.mx-6 {
    margin-left: var(--space-6);
    margin-right: var(--space-6);
}

.mx-7 {
    margin-left: var(--space-7);
    margin-right: var(--space-7);
}

.mx-8 {
    margin-left: var(--space-8);
    margin-right: var(--space-8);
}

.mx-9 {
    margin-left: var(--space-9);
    margin-right: var(--space-9);
}

.mx-10 {
    margin-left: var(--space-10);
    margin-right: var(--space-10);
}

.mx-11 {
    margin-left: var(--space-11);
    margin-right: var(--space-11);
}

.mx-12 {
    margin-left: var(--space-12);
    margin-right: var(--space-12);
}

.mx-14 {
    margin-left: var(--space-14);
    margin-right: var(--space-14);
}

.mx-16 {
    margin-left: var(--space-16);
    margin-right: var(--space-16);
}

.mx-20 {
    margin-left: var(--space-20);
    margin-right: var(--space-20);
}

.mx-24 {
    margin-left: var(--space-24);
    margin-right: var(--space-24);
}

.mx-28 {
    margin-left: var(--space-28);
    margin-right: var(--space-28);
}

.mx-32 {
    margin-left: var(--space-32);
    margin-right: var(--space-32);
}

.mx-36 {
    margin-left: var(--space-36);
    margin-right: var(--space-36);
}

.mx-40 {
    margin-left: var(--space-40);
    margin-right: var(--space-40);
}

/* mx-auto für Zentrierung */
.mx-auto {
    margin-left: auto;
    margin-right: auto;
}


/* ==========================================
   MARGIN VERTICAL (my- = top + bottom)
   ========================================== */
.my-0 {
    margin-top: var(--space-0);
    margin-bottom: var(--space-0);
}

.my-px {
    margin-top: var(--space-px);
    margin-bottom: var(--space-px);
}

.my-0_5 {
    margin-top: var(--space-0_5);
    margin-bottom: var(--space-0_5);
}

.my-1 {
    margin-top: var(--space-1);
    margin-bottom: var(--space-1);
}

.my-1_5 {
    margin-top: var(--space-1_5);
    margin-bottom: var(--space-1_5);
}

.my-2 {
    margin-top: var(--space-2);
    margin-bottom: var(--space-2);
}

.my-2_5 {
    margin-top: var(--space-2_5);
    margin-bottom: var(--space-2_5);
}

.my-3 {
    margin-top: var(--space-3);
    margin-bottom: var(--space-3);
}

.my-3_5 {
    margin-top: var(--space-3_5);
    margin-bottom: var(--space-3_5);
}

.my-4 {
    margin-top: var(--space-4);
    margin-bottom: var(--space-4);
}

.my-5 {
    margin-top: var(--space-5);
    margin-bottom: var(--space-5);
}

.my-6 {
    margin-top: var(--space-6);
    margin-bottom: var(--space-6);
}

.my-7 {
    margin-top: var(--space-7);
    margin-bottom: var(--space-7);
}

.my-8 {
    margin-top: var(--space-8);
    margin-bottom: var(--space-8);
}

.my-9 {
    margin-top: var(--space-9);
    margin-bottom: var(--space-9);
}

.my-10 {
    margin-top: var(--space-10);
    margin-bottom: var(--space-10);
}

.my-11 {
    margin-top: var(--space-11);
    margin-bottom: var(--space-11);
}

.my-12 {
    margin-top: var(--space-12);
    margin-bottom: var(--space-12);
}

.my-14 {
    margin-top: var(--space-14);
    margin-bottom: var(--space-14);
}

.my-16 {
    margin-top: var(--space-16);
    margin-bottom: var(--space-16);
}

.my-20 {
    margin-top: var(--space-20);
    margin-bottom: var(--space-20);
}

.my-24 {
    margin-top: var(--space-24);
    margin-bottom: var(--space-24);
}

.my-28 {
    margin-top: var(--space-28);
    margin-bottom: var(--space-28);
}

.my-32 {
    margin-top: var(--space-32);
    margin-bottom: var(--space-32);
}

.my-36 {
    margin-top: var(--space-36);
    margin-bottom: var(--space-36);
}

.my-40 {
    margin-top: var(--space-40);
    margin-bottom: var(--space-40);
}


/* ==========================================
   PADDING - ALL SIDES (p-)
   ========================================== */
.p-0 {
    padding: var(--space-0);
}

.p-px {
    padding: var(--space-px);
}

.p-0_5 {
    padding: var(--space-0_5);
}

.p-1 {
    padding: var(--space-1);
}

.p-1_5 {
    padding: var(--space-1_5);
}

.p-2 {
    padding: var(--space-2);
}

.p-2_5 {
    padding: var(--space-2_5);
}

.p-3 {
    padding: var(--space-3);
}

.p-3_5 {
    padding: var(--space-3_5);
}

.p-4 {
    padding: var(--space-4);
}

.p-5 {
    padding: var(--space-5);
}

.p-6 {
    padding: var(--space-6);
}

.p-7 {
    padding: var(--space-7);
}

.p-8 {
    padding: var(--space-8);
}

.p-9 {
    padding: var(--space-9);
}

.p-10 {
    padding: var(--space-10);
}

.p-11 {
    padding: var(--space-11);
}

.p-12 {
    padding: var(--space-12);
}

.p-14 {
    padding: var(--space-14);
}

.p-16 {
    padding: var(--space-16);
}

.p-20 {
    padding: var(--space-20);
}

.p-24 {
    padding: var(--space-24);
}

.p-28 {
    padding: var(--space-28);
}

.p-32 {
    padding: var(--space-32);
}

.p-36 {
    padding: var(--space-36);
}

.p-40 {
    padding: var(--space-40);
}


/* ==========================================
   PADDING TOP (pt-)
   ========================================== */
.pt-0 {
    padding-top: var(--space-0);
}

.pt-px {
    padding-top: var(--space-px);
}

.pt-0_5 {
    padding-top: var(--space-0_5);
}

.pt-1 {
    padding-top: var(--space-1);
}

.pt-1_5 {
    padding-top: var(--space-1_5);
}

.pt-2 {
    padding-top: var(--space-2);
}

.pt-2_5 {
    padding-top: var(--space-2_5);
}

.pt-3 {
    padding-top: var(--space-3);
}

.pt-3_5 {
    padding-top: var(--space-3_5);
}

.pt-4 {
    padding-top: var(--space-4);
}

.pt-5 {
    padding-top: var(--space-5);
}

.pt-6 {
    padding-top: var(--space-6);
}

.pt-7 {
    padding-top: var(--space-7);
}

.pt-8 {
    padding-top: var(--space-8);
}

.pt-9 {
    padding-top: var(--space-9);
}

.pt-10 {
    padding-top: var(--space-10);
}

.pt-11 {
    padding-top: var(--space-11);
}

.pt-12 {
    padding-top: var(--space-12);
}

.pt-14 {
    padding-top: var(--space-14);
}

.pt-16 {
    padding-top: var(--space-16);
}

.pt-20 {
    padding-top: var(--space-20);
}

.pt-24 {
    padding-top: var(--space-24);
}

.pt-28 {
    padding-top: var(--space-28);
}

.pt-32 {
    padding-top: var(--space-32);
}

.pt-36 {
    padding-top: var(--space-36);
}

.pt-40 {
    padding-top: var(--space-40);
}


/* ==========================================
   PADDING BOTTOM (pb-)
   ========================================== */
.pb-0 {
    padding-bottom: var(--space-0);
}

.pb-px {
    padding-bottom: var(--space-px);
}

.pb-0_5 {
    padding-bottom: var(--space-0_5);
}

.pb-1 {
    padding-bottom: var(--space-1);
}

.pb-1_5 {
    padding-bottom: var(--space-1_5);
}

.pb-2 {
    padding-bottom: var(--space-2);
}

.pb-2_5 {
    padding-bottom: var(--space-2_5);
}

.pb-3 {
    padding-bottom: var(--space-3);
}

.pb-3_5 {
    padding-bottom: var(--space-3_5);
}

.pb-4 {
    padding-bottom: var(--space-4);
}

.pb-5 {
    padding-bottom: var(--space-5);
}

.pb-6 {
    padding-bottom: var(--space-6);
}

.pb-7 {
    padding-bottom: var(--space-7);
}

.pb-8 {
    padding-bottom: var(--space-8);
}

.pb-9 {
    padding-bottom: var(--space-9);
}

.pb-10 {
    padding-bottom: var(--space-10);
}

.pb-11 {
    padding-bottom: var(--space-11);
}

.pb-12 {
    padding-bottom: var(--space-12);
}

.pb-14 {
    padding-bottom: var(--space-14);
}

.pb-16 {
    padding-bottom: var(--space-16);
}

.pb-20 {
    padding-bottom: var(--space-20);
}

.pb-24 {
    padding-bottom: var(--space-24);
}

.pb-28 {
    padding-bottom: var(--space-28);
}

.pb-32 {
    padding-bottom: var(--space-32);
}

.pb-36 {
    padding-bottom: var(--space-36);
}

.pb-40 {
    padding-bottom: var(--space-40);
}


/* ==========================================
   PADDING LEFT (pl-)
   ========================================== */
.pl-0 {
    padding-left: var(--space-0);
}

.pl-px {
    padding-left: var(--space-px);
}

.pl-0_5 {
    padding-left: var(--space-0_5);
}

.pl-1 {
    padding-left: var(--space-1);
}

.pl-1_5 {
    padding-left: var(--space-1_5);
}

.pl-2 {
    padding-left: var(--space-2);
}

.pl-2_5 {
    padding-left: var(--space-2_5);
}

.pl-3 {
    padding-left: var(--space-3);
}

.pl-3_5 {
    padding-left: var(--space-3_5);
}

.pl-4 {
    padding-left: var(--space-4);
}

.pl-5 {
    padding-left: var(--space-5);
}

.pl-6 {
    padding-left: var(--space-6);
}

.pl-7 {
    padding-left: var(--space-7);
}

.pl-8 {
    padding-left: var(--space-8);
}

.pl-9 {
    padding-left: var(--space-9);
}

.pl-10 {
    padding-left: var(--space-10);
}

.pl-11 {
    padding-left: var(--space-11);
}

.pl-12 {
    padding-left: var(--space-12);
}

.pl-14 {
    padding-left: var(--space-14);
}

.pl-16 {
    padding-left: var(--space-16);
}

.pl-20 {
    padding-left: var(--space-20);
}

.pl-24 {
    padding-left: var(--space-24);
}

.pl-28 {
    padding-left: var(--space-28);
}

.pl-32 {
    padding-left: var(--space-32);
}

.pl-36 {
    padding-left: var(--space-36);
}

.pl-40 {
    padding-left: var(--space-40);
}


/* ==========================================
   PADDING RIGHT (pr-)
   ========================================== */
.pr-0 {
    padding-right: var(--space-0);
}

.pr-px {
    padding-right: var(--space-px);
}

.pr-0_5 {
    padding-right: var(--space-0_5);
}

.pr-1 {
    padding-right: var(--space-1);
}

.pr-1_5 {
    padding-right: var(--space-1_5);
}

.pr-2 {
    padding-right: var(--space-2);
}

.pr-2_5 {
    padding-right: var(--space-2_5);
}

.pr-3 {
    padding-right: var(--space-3);
}

.pr-3_5 {
    padding-right: var(--space-3_5);
}

.pr-4 {
    padding-right: var(--space-4);
}

.pr-5 {
    padding-right: var(--space-5);
}

.pr-6 {
    padding-right: var(--space-6);
}

.pr-7 {
    padding-right: var(--space-7);
}

.pr-8 {
    padding-right: var(--space-8);
}

.pr-9 {
    padding-right: var(--space-9);
}

.pr-10 {
    padding-right: var(--space-10);
}

.pr-11 {
    padding-right: var(--space-11);
}

.pr-12 {
    padding-right: var(--space-12);
}

.pr-14 {
    padding-right: var(--space-14);
}

.pr-16 {
    padding-right: var(--space-16);
}

.pr-20 {
    padding-right: var(--space-20);
}

.pr-24 {
    padding-right: var(--space-24);
}

.pr-28 {
    padding-right: var(--space-28);
}

.pr-32 {
    padding-right: var(--space-32);
}

.pr-36 {
    padding-right: var(--space-36);
}

.pr-40 {
    padding-right: var(--space-40);
}


/* ==========================================
   PADDING HORIZONTAL (px- = left + right)
   FORTSETZUNG
   ========================================== */
.px-0 {
    padding-left: var(--space-0);
    padding-right: var(--space-0);
}

.px-px {
    padding-left: var(--space-px);
    padding-right: var(--space-px);
}

.px-0_5 {
    padding-left: var(--space-0_5);
    padding-right: var(--space-0_5);
}

.px-1 {
    padding-left: var(--space-1);
    padding-right: var(--space-1);
}

.px-1_5 {
    padding-left: var(--space-1_5);
    padding-right: var(--space-1_5);
}

.px-2 {
    padding-left: var(--space-2);
    padding-right: var(--space-2);
}

.px-2_5 {
    padding-left: var(--space-2_5);
    padding-right: var(--space-2_5);
}

.px-3 {
    padding-left: var(--space-3);
    padding-right: var(--space-3);
}

.px-3_5 {
    padding-left: var(--space-3_5);
    padding-right: var(--space-3_5);
}

.px-4 {
    padding-left: var(--space-4);
    padding-right: var(--space-4);
}

.px-5 {
    padding-left: var(--space-5);
    padding-right: var(--space-5);
}

.px-6 {
    padding-left: var(--space-6);
    padding-right: var(--space-6);
}

.px-7 {
    padding-left: var(--space-7);
    padding-right: var(--space-7);
}

.px-8 {
    padding-left: var(--space-8);
    padding-right: var(--space-8);
}

.px-9 {
    padding-left: var(--space-9);
    padding-right: var(--space-9);
}

.px-10 {
    padding-left: var(--space-10);
    padding-right: var(--space-10);
}

.px-11 {
    padding-left: var(--space-11);
    padding-right: var(--space-11);
}

.px-12 {
    padding-left: var(--space-12);
    padding-right: var(--space-12);
}

.px-14 {
    padding-left: var(--space-14);
    padding-right: var(--space-14);
}

.px-16 {
    padding-left: var(--space-16);
    padding-right: var(--space-16);
}

.px-20 {
    padding-left: var(--space-20);
    padding-right: var(--space-20);
}

.px-24 {
    padding-left: var(--space-24);
    padding-right: var(--space-24);
}

.px-28 {
    padding-left: var(--space-28);
    padding-right: var(--space-28);
}

.px-32 {
    padding-left: var(--space-32);
    padding-right: var(--space-32);
}

.px-36 {
    padding-left: var(--space-36);
    padding-right: var(--space-36);
}

.px-40 {
    padding-left: var(--space-40);
    padding-right: var(--space-40);
}


/* ==========================================
   PADDING VERTICAL (py- = top + bottom)
   ========================================== */
.py-0 {
    padding-top: var(--space-0);
    padding-bottom: var(--space-0);
}

.py-px {
    padding-top: var(--space-px);
    padding-bottom: var(--space-px);
}

.py-0_5 {
    padding-top: var(--space-0_5);
    padding-bottom: var(--space-0_5);
}

.py-1 {
    padding-top: var(--space-1);
    padding-bottom: var(--space-1);
}

.py-1_5 {
    padding-top: var(--space-1_5);
    padding-bottom: var(--space-1_5);
}

.py-2 {
    padding-top: var(--space-2);
    padding-bottom: var(--space-2);
}

.py-2_5 {
    padding-top: var(--space-2_5);
    padding-bottom: var(--space-2_5);
}

.py-3 {
    padding-top: var(--space-3);
    padding-bottom: var(--space-3);
}

.py-3_5 {
    padding-top: var(--space-3_5);
    padding-bottom: var(--space-3_5);
}

.py-4 {
    padding-top: var(--space-4);
    padding-bottom: var(--space-4);
}

.py-5 {
    padding-top: var(--space-5);
    padding-bottom: var(--space-5);
}

.py-6 {
    padding-top: var(--space-6);
    padding-bottom: var(--space-6);
}

.py-7 {
    padding-top: var(--space-7);
    padding-bottom: var(--space-7);
}

.py-8 {
    padding-top: var(--space-8);
    padding-bottom: var(--space-8);
}

.py-9 {
    padding-top: var(--space-9);
    padding-bottom: var(--space-9);
}

.py-10 {
    padding-top: var(--space-10);
    padding-bottom: var(--space-10);
}

.py-11 {
    padding-top: var(--space-11);
    padding-bottom: var(--space-11);
}

.py-12 {
    padding-top: var(--space-12);
    padding-bottom: var(--space-12);
}

.py-14 {
    padding-top: var(--space-14);
    padding-bottom: var(--space-14);
}

.py-16 {
    padding-top: var(--space-16);
    padding-bottom: var(--space-16);
}

.py-20 {
    padding-top: var(--space-20);
    padding-bottom: var(--space-20);
}

.py-24 {
    padding-top: var(--space-24);
    padding-bottom: var(--space-24);
}

.py-28 {
    padding-top: var(--space-28);
    padding-bottom: var(--space-28);
}

.py-32 {
    padding-top: var(--space-32);
    padding-bottom: var(--space-32);
}

.py-36 {
    padding-top: var(--space-36);
    padding-bottom: var(--space-36);
}

.py-40 {
    padding-top: var(--space-40);
    padding-bottom: var(--space-40);
}


/* ==========================================
   NEGATIVE MARGINS (optional, falls benötigt)
   ========================================== */
/* Negative Margin Top */
.-mt-1 {
    margin-top: calc(var(--space-1) * -1);
}

.-mt-2 {
    margin-top: calc(var(--space-2) * -1);
}

.-mt-3 {
    margin-top: calc(var(--space-3) * -1);
}

.-mt-4 {
    margin-top: calc(var(--space-4) * -1);
}

.-mt-6 {
    margin-top: calc(var(--space-6) * -1);
}

.-mt-8 {
    margin-top: calc(var(--space-8) * -1);
}

.-mt-12 {
    margin-top: calc(var(--space-12) * -1);
}

.-mt-16 {
    margin-top: calc(var(--space-16) * -1);
}

/* Negative Margin Bottom */
.-mb-1 {
    margin-bottom: calc(var(--space-1) * -1);
}

.-mb-2 {
    margin-bottom: calc(var(--space-2) * -1);
}

.-mb-3 {
    margin-bottom: calc(var(--space-3) * -1);
}

.-mb-4 {
    margin-bottom: calc(var(--space-4) * -1);
}

.-mb-6 {
    margin-bottom: calc(var(--space-6) * -1);
}

.-mb-8 {
    margin-bottom: calc(var(--space-8) * -1);
}

.-mb-12 {
    margin-bottom: calc(var(--space-12) * -1);
}

.-mb-16 {
    margin-bottom: calc(var(--space-16) * -1);
}

/* Negative Margin Left */
.-ml-1 {
    margin-left: calc(var(--space-1) * -1);
}

.-ml-2 {
    margin-left: calc(var(--space-2) * -1);
}

.-ml-3 {
    margin-left: calc(var(--space-3) * -1);
}

.-ml-4 {
    margin-left: calc(var(--space-4) * -1);
}

.-ml-6 {
    margin-left: calc(var(--space-6) * -1);
}

.-ml-8 {
    margin-left: calc(var(--space-8) * -1);
}

.-ml-12 {
    margin-left: calc(var(--space-12) * -1);
}

.-ml-16 {
    margin-left: calc(var(--space-16) * -1);
}

/* Negative Margin Right */
.-mr-1 {
    margin-right: calc(var(--space-1) * -1);
}

.-mr-2 {
    margin-right: calc(var(--space-2) * -1);
}

.-mr-3 {
    margin-right: calc(var(--space-3) * -1);
}

.-mr-4 {
    margin-right: calc(var(--space-4) * -1);
}

.-mr-6 {
    margin-right: calc(var(--space-6) * -1);
}

.-mr-8 {
    margin-right: calc(var(--space-8) * -1);
}

.-mr-12 {
    margin-right: calc(var(--space-12) * -1);
}

.-mr-16 {
    margin-right: calc(var(--space-16) * -1);
}


/* ==========================================
   UTILITY KLASSEN
   ========================================== */
/* Margin Auto für Zentrierung */
.m-auto {
    margin: auto;
}

.mt-auto {
    margin-top: auto;
}

.mb-auto {
    margin-bottom: auto;
}

.ml-auto {
    margin-left: auto;
}

.mr-auto {
    margin-right: auto;
}

.mx-auto {
    margin-left: auto;
    margin-right: auto;
}

.my-auto {
    margin-top: auto;
    margin-bottom: auto;
}


/* ==========================================
   ENDE - Tailwind Spacing System komplett
   ========================================== */