/* ============================================================================
   RH_SPACING.CSS | RockSolid TAO / Contao

   Responsive Abstandsklassen für Contao-Artikel und Inhaltselemente.

   GRUNDPRINZIP
   Die Zahl einer Standardklasse bezeichnet den Desktopwert:
   pt-100 = Desktop 100px.

   Standardklassen werden automatisch responsiv reduziert:
   Desktop:    100 %
   Tablet:      ca. 75 %, auf 5px-Stufen abgestimmt
   Smartphone:  ca. 50 %, auf 5px-Stufen abgestimmt

   Horizontale Abstände sind auf Smartphones immer 0:
   ml / mr / pl / pr = 0.

   Breakpoints:
   Desktop:    ab 901 CSS-Pixel
   Tablet:     600 bis 900 CSS-Pixel
   Smartphone: bis 599 CSS-Pixel

   Verfügbare Werte:
   0, 5, 10 und 20 bis 200 in 10er-Schritten.
   ht-gap: 0, 5, 10 und 20 bis 100 in 10er-Schritten.

   Standardbeispiel im Contao-Feld CSS-Klasse:
   pt-100 pb-100
   ergibt automatisch:
   Desktop 100px / Tablet 75px / Smartphone 50px.

   Gezielte Overrides bleiben möglich:
   pt-100 pt-60-t pt-40-s

   -d = Desktop-Override
   -t = Tablet-Override
   -s = Smartphone-Override

   WICHTIG:
   Horizontale Smartphone-Klassen ml-*-s, mr-*-s, pl-*-s und pr-*-s
   werden aus Gründen der Konsistenz ebenfalls immer auf 0 gesetzt.

   Bereiche:
   mt / mb = margin oben / unten
   ml / mr = margin links / rechts
   pt / pb = padding oben / unten
   pl / pr = padding links / rechts

   Bewusstes !important:
   Explizite Backend-Klassen sollen TAO-Standardwerte übersteuern.
   ============================================================================ */

/* =============================================================================
   1. STANDARD / DESKTOPWERTE
   ========================================================================== */

/* margin-top */
.mt-0 { margin-top: 0 !important; }
.mt-5 { margin-top: 5px !important; }
.mt-10 { margin-top: 10px !important; }
.mt-20 { margin-top: 20px !important; }
.mt-30 { margin-top: 30px !important; }
.mt-40 { margin-top: 40px !important; }
.mt-50 { margin-top: 50px !important; }
.mt-60 { margin-top: 60px !important; }
.mt-70 { margin-top: 70px !important; }
.mt-80 { margin-top: 80px !important; }
.mt-90 { margin-top: 90px !important; }
.mt-100 { margin-top: 100px !important; }
.mt-110 { margin-top: 110px !important; }
.mt-120 { margin-top: 120px !important; }
.mt-130 { margin-top: 130px !important; }
.mt-140 { margin-top: 140px !important; }
.mt-150 { margin-top: 150px !important; }
.mt-160 { margin-top: 160px !important; }
.mt-170 { margin-top: 170px !important; }
.mt-180 { margin-top: 180px !important; }
.mt-190 { margin-top: 190px !important; }
.mt-200 { margin-top: 200px !important; }

/* margin-bottom */
.mb-0 { margin-bottom: 0 !important; }
.mb-5 { margin-bottom: 5px !important; }
.mb-10 { margin-bottom: 10px !important; }
.mb-20 { margin-bottom: 20px !important; }
.mb-30 { margin-bottom: 30px !important; }
.mb-40 { margin-bottom: 40px !important; }
.mb-50 { margin-bottom: 50px !important; }
.mb-60 { margin-bottom: 60px !important; }
.mb-70 { margin-bottom: 70px !important; }
.mb-80 { margin-bottom: 80px !important; }
.mb-90 { margin-bottom: 90px !important; }
.mb-100 { margin-bottom: 100px !important; }
.mb-110 { margin-bottom: 110px !important; }
.mb-120 { margin-bottom: 120px !important; }
.mb-130 { margin-bottom: 130px !important; }
.mb-140 { margin-bottom: 140px !important; }
.mb-150 { margin-bottom: 150px !important; }
.mb-160 { margin-bottom: 160px !important; }
.mb-170 { margin-bottom: 170px !important; }
.mb-180 { margin-bottom: 180px !important; }
.mb-190 { margin-bottom: 190px !important; }
.mb-200 { margin-bottom: 200px !important; }

/* padding-top */
.pt-0 { padding-top: 0 !important; }
.pt-5 { padding-top: 5px !important; }
.pt-10 { padding-top: 10px !important; }
.pt-20 { padding-top: 20px !important; }
.pt-30 { padding-top: 30px !important; }
.pt-40 { padding-top: 40px !important; }
.pt-50 { padding-top: 50px !important; }
.pt-60 { padding-top: 60px !important; }
.pt-70 { padding-top: 70px !important; }
.pt-80 { padding-top: 80px !important; }
.pt-90 { padding-top: 90px !important; }
.pt-100 { padding-top: 100px !important; }
.pt-110 { padding-top: 110px !important; }
.pt-120 { padding-top: 120px !important; }
.pt-130 { padding-top: 130px !important; }
.pt-140 { padding-top: 140px !important; }
.pt-150 { padding-top: 150px !important; }
.pt-160 { padding-top: 160px !important; }
.pt-170 { padding-top: 170px !important; }
.pt-180 { padding-top: 180px !important; }
.pt-190 { padding-top: 190px !important; }
.pt-200 { padding-top: 200px !important; }

/* padding-bottom */
.pb-0 { padding-bottom: 0 !important; }
.pb-5 { padding-bottom: 5px !important; }
.pb-10 { padding-bottom: 10px !important; }
.pb-20 { padding-bottom: 20px !important; }
.pb-30 { padding-bottom: 30px !important; }
.pb-40 { padding-bottom: 40px !important; }
.pb-50 { padding-bottom: 50px !important; }
.pb-60 { padding-bottom: 60px !important; }
.pb-70 { padding-bottom: 70px !important; }
.pb-80 { padding-bottom: 80px !important; }
.pb-90 { padding-bottom: 90px !important; }
.pb-100 { padding-bottom: 100px !important; }
.pb-110 { padding-bottom: 110px !important; }
.pb-120 { padding-bottom: 120px !important; }
.pb-130 { padding-bottom: 130px !important; }
.pb-140 { padding-bottom: 140px !important; }
.pb-150 { padding-bottom: 150px !important; }
.pb-160 { padding-bottom: 160px !important; }
.pb-170 { padding-bottom: 170px !important; }
.pb-180 { padding-bottom: 180px !important; }
.pb-190 { padding-bottom: 190px !important; }
.pb-200 { padding-bottom: 200px !important; }

/* margin-left */
.ml-0 { margin-left: 0 !important; }
.ml-5 { margin-left: 5px !important; }
.ml-10 { margin-left: 10px !important; }
.ml-20 { margin-left: 20px !important; }
.ml-30 { margin-left: 30px !important; }
.ml-40 { margin-left: 40px !important; }
.ml-50 { margin-left: 50px !important; }
.ml-60 { margin-left: 60px !important; }
.ml-70 { margin-left: 70px !important; }
.ml-80 { margin-left: 80px !important; }
.ml-90 { margin-left: 90px !important; }
.ml-100 { margin-left: 100px !important; }
.ml-110 { margin-left: 110px !important; }
.ml-120 { margin-left: 120px !important; }
.ml-130 { margin-left: 130px !important; }
.ml-140 { margin-left: 140px !important; }
.ml-150 { margin-left: 150px !important; }
.ml-160 { margin-left: 160px !important; }
.ml-170 { margin-left: 170px !important; }
.ml-180 { margin-left: 180px !important; }
.ml-190 { margin-left: 190px !important; }
.ml-200 { margin-left: 200px !important; }

/* margin-right */
.mr-0 { margin-right: 0 !important; }
.mr-5 { margin-right: 5px !important; }
.mr-10 { margin-right: 10px !important; }
.mr-20 { margin-right: 20px !important; }
.mr-30 { margin-right: 30px !important; }
.mr-40 { margin-right: 40px !important; }
.mr-50 { margin-right: 50px !important; }
.mr-60 { margin-right: 60px !important; }
.mr-70 { margin-right: 70px !important; }
.mr-80 { margin-right: 80px !important; }
.mr-90 { margin-right: 90px !important; }
.mr-100 { margin-right: 100px !important; }
.mr-110 { margin-right: 110px !important; }
.mr-120 { margin-right: 120px !important; }
.mr-130 { margin-right: 130px !important; }
.mr-140 { margin-right: 140px !important; }
.mr-150 { margin-right: 150px !important; }
.mr-160 { margin-right: 160px !important; }
.mr-170 { margin-right: 170px !important; }
.mr-180 { margin-right: 180px !important; }
.mr-190 { margin-right: 190px !important; }
.mr-200 { margin-right: 200px !important; }

/* padding-left */
.pl-0 { padding-left: 0 !important; }
.pl-5 { padding-left: 5px !important; }
.pl-10 { padding-left: 10px !important; }
.pl-20 { padding-left: 20px !important; }
.pl-30 { padding-left: 30px !important; }
.pl-40 { padding-left: 40px !important; }
.pl-50 { padding-left: 50px !important; }
.pl-60 { padding-left: 60px !important; }
.pl-70 { padding-left: 70px !important; }
.pl-80 { padding-left: 80px !important; }
.pl-90 { padding-left: 90px !important; }
.pl-100 { padding-left: 100px !important; }
.pl-110 { padding-left: 110px !important; }
.pl-120 { padding-left: 120px !important; }
.pl-130 { padding-left: 130px !important; }
.pl-140 { padding-left: 140px !important; }
.pl-150 { padding-left: 150px !important; }
.pl-160 { padding-left: 160px !important; }
.pl-170 { padding-left: 170px !important; }
.pl-180 { padding-left: 180px !important; }
.pl-190 { padding-left: 190px !important; }
.pl-200 { padding-left: 200px !important; }

/* padding-right */
.pr-0 { padding-right: 0 !important; }
.pr-5 { padding-right: 5px !important; }
.pr-10 { padding-right: 10px !important; }
.pr-20 { padding-right: 20px !important; }
.pr-30 { padding-right: 30px !important; }
.pr-40 { padding-right: 40px !important; }
.pr-50 { padding-right: 50px !important; }
.pr-60 { padding-right: 60px !important; }
.pr-70 { padding-right: 70px !important; }
.pr-80 { padding-right: 80px !important; }
.pr-90 { padding-right: 90px !important; }
.pr-100 { padding-right: 100px !important; }
.pr-110 { padding-right: 110px !important; }
.pr-120 { padding-right: 120px !important; }
.pr-130 { padding-right: 130px !important; }
.pr-140 { padding-right: 140px !important; }
.pr-150 { padding-right: 150px !important; }
.pr-160 { padding-right: 160px !important; }
.pr-170 { padding-right: 170px !important; }
.pr-180 { padding-right: 180px !important; }
.pr-190 { padding-right: 190px !important; }
.pr-200 { padding-right: 200px !important; }

/* =============================================================================
   2. DESKTOP-OVERRIDES | ab 901px
   ========================================================================== */
@media screen and (min-width: 901px) {
    /* margin-top */
    .mt-0-d { margin-top: 0 !important; }
    .mt-5-d { margin-top: 5px !important; }
    .mt-10-d { margin-top: 10px !important; }
    .mt-20-d { margin-top: 20px !important; }
    .mt-30-d { margin-top: 30px !important; }
    .mt-40-d { margin-top: 40px !important; }
    .mt-50-d { margin-top: 50px !important; }
    .mt-60-d { margin-top: 60px !important; }
    .mt-70-d { margin-top: 70px !important; }
    .mt-80-d { margin-top: 80px !important; }
    .mt-90-d { margin-top: 90px !important; }
    .mt-100-d { margin-top: 100px !important; }
    .mt-110-d { margin-top: 110px !important; }
    .mt-120-d { margin-top: 120px !important; }
    .mt-130-d { margin-top: 130px !important; }
    .mt-140-d { margin-top: 140px !important; }
    .mt-150-d { margin-top: 150px !important; }
    .mt-160-d { margin-top: 160px !important; }
    .mt-170-d { margin-top: 170px !important; }
    .mt-180-d { margin-top: 180px !important; }
    .mt-190-d { margin-top: 190px !important; }
    .mt-200-d { margin-top: 200px !important; }

    /* margin-bottom */
    .mb-0-d { margin-bottom: 0 !important; }
    .mb-5-d { margin-bottom: 5px !important; }
    .mb-10-d { margin-bottom: 10px !important; }
    .mb-20-d { margin-bottom: 20px !important; }
    .mb-30-d { margin-bottom: 30px !important; }
    .mb-40-d { margin-bottom: 40px !important; }
    .mb-50-d { margin-bottom: 50px !important; }
    .mb-60-d { margin-bottom: 60px !important; }
    .mb-70-d { margin-bottom: 70px !important; }
    .mb-80-d { margin-bottom: 80px !important; }
    .mb-90-d { margin-bottom: 90px !important; }
    .mb-100-d { margin-bottom: 100px !important; }
    .mb-110-d { margin-bottom: 110px !important; }
    .mb-120-d { margin-bottom: 120px !important; }
    .mb-130-d { margin-bottom: 130px !important; }
    .mb-140-d { margin-bottom: 140px !important; }
    .mb-150-d { margin-bottom: 150px !important; }
    .mb-160-d { margin-bottom: 160px !important; }
    .mb-170-d { margin-bottom: 170px !important; }
    .mb-180-d { margin-bottom: 180px !important; }
    .mb-190-d { margin-bottom: 190px !important; }
    .mb-200-d { margin-bottom: 200px !important; }

    /* padding-top */
    .pt-0-d { padding-top: 0 !important; }
    .pt-5-d { padding-top: 5px !important; }
    .pt-10-d { padding-top: 10px !important; }
    .pt-20-d { padding-top: 20px !important; }
    .pt-30-d { padding-top: 30px !important; }
    .pt-40-d { padding-top: 40px !important; }
    .pt-50-d { padding-top: 50px !important; }
    .pt-60-d { padding-top: 60px !important; }
    .pt-70-d { padding-top: 70px !important; }
    .pt-80-d { padding-top: 80px !important; }
    .pt-90-d { padding-top: 90px !important; }
    .pt-100-d { padding-top: 100px !important; }
    .pt-110-d { padding-top: 110px !important; }
    .pt-120-d { padding-top: 120px !important; }
    .pt-130-d { padding-top: 130px !important; }
    .pt-140-d { padding-top: 140px !important; }
    .pt-150-d { padding-top: 150px !important; }
    .pt-160-d { padding-top: 160px !important; }
    .pt-170-d { padding-top: 170px !important; }
    .pt-180-d { padding-top: 180px !important; }
    .pt-190-d { padding-top: 190px !important; }
    .pt-200-d { padding-top: 200px !important; }

    /* padding-bottom */
    .pb-0-d { padding-bottom: 0 !important; }
    .pb-5-d { padding-bottom: 5px !important; }
    .pb-10-d { padding-bottom: 10px !important; }
    .pb-20-d { padding-bottom: 20px !important; }
    .pb-30-d { padding-bottom: 30px !important; }
    .pb-40-d { padding-bottom: 40px !important; }
    .pb-50-d { padding-bottom: 50px !important; }
    .pb-60-d { padding-bottom: 60px !important; }
    .pb-70-d { padding-bottom: 70px !important; }
    .pb-80-d { padding-bottom: 80px !important; }
    .pb-90-d { padding-bottom: 90px !important; }
    .pb-100-d { padding-bottom: 100px !important; }
    .pb-110-d { padding-bottom: 110px !important; }
    .pb-120-d { padding-bottom: 120px !important; }
    .pb-130-d { padding-bottom: 130px !important; }
    .pb-140-d { padding-bottom: 140px !important; }
    .pb-150-d { padding-bottom: 150px !important; }
    .pb-160-d { padding-bottom: 160px !important; }
    .pb-170-d { padding-bottom: 170px !important; }
    .pb-180-d { padding-bottom: 180px !important; }
    .pb-190-d { padding-bottom: 190px !important; }
    .pb-200-d { padding-bottom: 200px !important; }

    /* margin-left */
    .ml-0-d { margin-left: 0 !important; }
    .ml-5-d { margin-left: 5px !important; }
    .ml-10-d { margin-left: 10px !important; }
    .ml-20-d { margin-left: 20px !important; }
    .ml-30-d { margin-left: 30px !important; }
    .ml-40-d { margin-left: 40px !important; }
    .ml-50-d { margin-left: 50px !important; }
    .ml-60-d { margin-left: 60px !important; }
    .ml-70-d { margin-left: 70px !important; }
    .ml-80-d { margin-left: 80px !important; }
    .ml-90-d { margin-left: 90px !important; }
    .ml-100-d { margin-left: 100px !important; }
    .ml-110-d { margin-left: 110px !important; }
    .ml-120-d { margin-left: 120px !important; }
    .ml-130-d { margin-left: 130px !important; }
    .ml-140-d { margin-left: 140px !important; }
    .ml-150-d { margin-left: 150px !important; }
    .ml-160-d { margin-left: 160px !important; }
    .ml-170-d { margin-left: 170px !important; }
    .ml-180-d { margin-left: 180px !important; }
    .ml-190-d { margin-left: 190px !important; }
    .ml-200-d { margin-left: 200px !important; }

    /* margin-right */
    .mr-0-d { margin-right: 0 !important; }
    .mr-5-d { margin-right: 5px !important; }
    .mr-10-d { margin-right: 10px !important; }
    .mr-20-d { margin-right: 20px !important; }
    .mr-30-d { margin-right: 30px !important; }
    .mr-40-d { margin-right: 40px !important; }
    .mr-50-d { margin-right: 50px !important; }
    .mr-60-d { margin-right: 60px !important; }
    .mr-70-d { margin-right: 70px !important; }
    .mr-80-d { margin-right: 80px !important; }
    .mr-90-d { margin-right: 90px !important; }
    .mr-100-d { margin-right: 100px !important; }
    .mr-110-d { margin-right: 110px !important; }
    .mr-120-d { margin-right: 120px !important; }
    .mr-130-d { margin-right: 130px !important; }
    .mr-140-d { margin-right: 140px !important; }
    .mr-150-d { margin-right: 150px !important; }
    .mr-160-d { margin-right: 160px !important; }
    .mr-170-d { margin-right: 170px !important; }
    .mr-180-d { margin-right: 180px !important; }
    .mr-190-d { margin-right: 190px !important; }
    .mr-200-d { margin-right: 200px !important; }

    /* padding-left */
    .pl-0-d { padding-left: 0 !important; }
    .pl-5-d { padding-left: 5px !important; }
    .pl-10-d { padding-left: 10px !important; }
    .pl-20-d { padding-left: 20px !important; }
    .pl-30-d { padding-left: 30px !important; }
    .pl-40-d { padding-left: 40px !important; }
    .pl-50-d { padding-left: 50px !important; }
    .pl-60-d { padding-left: 60px !important; }
    .pl-70-d { padding-left: 70px !important; }
    .pl-80-d { padding-left: 80px !important; }
    .pl-90-d { padding-left: 90px !important; }
    .pl-100-d { padding-left: 100px !important; }
    .pl-110-d { padding-left: 110px !important; }
    .pl-120-d { padding-left: 120px !important; }
    .pl-130-d { padding-left: 130px !important; }
    .pl-140-d { padding-left: 140px !important; }
    .pl-150-d { padding-left: 150px !important; }
    .pl-160-d { padding-left: 160px !important; }
    .pl-170-d { padding-left: 170px !important; }
    .pl-180-d { padding-left: 180px !important; }
    .pl-190-d { padding-left: 190px !important; }
    .pl-200-d { padding-left: 200px !important; }

    /* padding-right */
    .pr-0-d { padding-right: 0 !important; }
    .pr-5-d { padding-right: 5px !important; }
    .pr-10-d { padding-right: 10px !important; }
    .pr-20-d { padding-right: 20px !important; }
    .pr-30-d { padding-right: 30px !important; }
    .pr-40-d { padding-right: 40px !important; }
    .pr-50-d { padding-right: 50px !important; }
    .pr-60-d { padding-right: 60px !important; }
    .pr-70-d { padding-right: 70px !important; }
    .pr-80-d { padding-right: 80px !important; }
    .pr-90-d { padding-right: 90px !important; }
    .pr-100-d { padding-right: 100px !important; }
    .pr-110-d { padding-right: 110px !important; }
    .pr-120-d { padding-right: 120px !important; }
    .pr-130-d { padding-right: 130px !important; }
    .pr-140-d { padding-right: 140px !important; }
    .pr-150-d { padding-right: 150px !important; }
    .pr-160-d { padding-right: 160px !important; }
    .pr-170-d { padding-right: 170px !important; }
    .pr-180-d { padding-right: 180px !important; }
    .pr-190-d { padding-right: 190px !important; }
    .pr-200-d { padding-right: 200px !important; }

}

/* =============================================================================
   3. TABLET | 600 bis 900px
   Standardklassen werden automatisch reduziert.
   -t-Klassen überschreiben den automatischen Wert gezielt.
   ========================================================================== */
@media screen and (min-width: 600px) and (max-width: 900px) {
    /* margin-top: automatische Staffelung */
    .mt-0 { margin-top: 0 !important; }
    .mt-5 { margin-top: 5px !important; }
    .mt-10 { margin-top: 10px !important; }
    .mt-20 { margin-top: 15px !important; }
    .mt-30 { margin-top: 20px !important; }
    .mt-40 { margin-top: 30px !important; }
    .mt-50 { margin-top: 35px !important; }
    .mt-60 { margin-top: 45px !important; }
    .mt-70 { margin-top: 50px !important; }
    .mt-80 { margin-top: 60px !important; }
    .mt-90 { margin-top: 65px !important; }
    .mt-100 { margin-top: 75px !important; }
    .mt-110 { margin-top: 80px !important; }
    .mt-120 { margin-top: 90px !important; }
    .mt-130 { margin-top: 95px !important; }
    .mt-140 { margin-top: 105px !important; }
    .mt-150 { margin-top: 110px !important; }
    .mt-160 { margin-top: 120px !important; }
    .mt-170 { margin-top: 125px !important; }
    .mt-180 { margin-top: 135px !important; }
    .mt-190 { margin-top: 140px !important; }
    .mt-200 { margin-top: 150px !important; }

    /* margin-bottom: automatische Staffelung */
    .mb-0 { margin-bottom: 0 !important; }
    .mb-5 { margin-bottom: 5px !important; }
    .mb-10 { margin-bottom: 10px !important; }
    .mb-20 { margin-bottom: 15px !important; }
    .mb-30 { margin-bottom: 20px !important; }
    .mb-40 { margin-bottom: 30px !important; }
    .mb-50 { margin-bottom: 35px !important; }
    .mb-60 { margin-bottom: 45px !important; }
    .mb-70 { margin-bottom: 50px !important; }
    .mb-80 { margin-bottom: 60px !important; }
    .mb-90 { margin-bottom: 65px !important; }
    .mb-100 { margin-bottom: 75px !important; }
    .mb-110 { margin-bottom: 80px !important; }
    .mb-120 { margin-bottom: 90px !important; }
    .mb-130 { margin-bottom: 95px !important; }
    .mb-140 { margin-bottom: 105px !important; }
    .mb-150 { margin-bottom: 110px !important; }
    .mb-160 { margin-bottom: 120px !important; }
    .mb-170 { margin-bottom: 125px !important; }
    .mb-180 { margin-bottom: 135px !important; }
    .mb-190 { margin-bottom: 140px !important; }
    .mb-200 { margin-bottom: 150px !important; }

    /* padding-top: automatische Staffelung */
    .pt-0 { padding-top: 0 !important; }
    .pt-5 { padding-top: 5px !important; }
    .pt-10 { padding-top: 10px !important; }
    .pt-20 { padding-top: 15px !important; }
    .pt-30 { padding-top: 20px !important; }
    .pt-40 { padding-top: 30px !important; }
    .pt-50 { padding-top: 35px !important; }
    .pt-60 { padding-top: 45px !important; }
    .pt-70 { padding-top: 50px !important; }
    .pt-80 { padding-top: 60px !important; }
    .pt-90 { padding-top: 65px !important; }
    .pt-100 { padding-top: 75px !important; }
    .pt-110 { padding-top: 80px !important; }
    .pt-120 { padding-top: 90px !important; }
    .pt-130 { padding-top: 95px !important; }
    .pt-140 { padding-top: 105px !important; }
    .pt-150 { padding-top: 110px !important; }
    .pt-160 { padding-top: 120px !important; }
    .pt-170 { padding-top: 125px !important; }
    .pt-180 { padding-top: 135px !important; }
    .pt-190 { padding-top: 140px !important; }
    .pt-200 { padding-top: 150px !important; }

    /* padding-bottom: automatische Staffelung */
    .pb-0 { padding-bottom: 0 !important; }
    .pb-5 { padding-bottom: 5px !important; }
    .pb-10 { padding-bottom: 10px !important; }
    .pb-20 { padding-bottom: 15px !important; }
    .pb-30 { padding-bottom: 20px !important; }
    .pb-40 { padding-bottom: 30px !important; }
    .pb-50 { padding-bottom: 35px !important; }
    .pb-60 { padding-bottom: 45px !important; }
    .pb-70 { padding-bottom: 50px !important; }
    .pb-80 { padding-bottom: 60px !important; }
    .pb-90 { padding-bottom: 65px !important; }
    .pb-100 { padding-bottom: 75px !important; }
    .pb-110 { padding-bottom: 80px !important; }
    .pb-120 { padding-bottom: 90px !important; }
    .pb-130 { padding-bottom: 95px !important; }
    .pb-140 { padding-bottom: 105px !important; }
    .pb-150 { padding-bottom: 110px !important; }
    .pb-160 { padding-bottom: 120px !important; }
    .pb-170 { padding-bottom: 125px !important; }
    .pb-180 { padding-bottom: 135px !important; }
    .pb-190 { padding-bottom: 140px !important; }
    .pb-200 { padding-bottom: 150px !important; }

    /* margin-left: automatische Staffelung */
    .ml-0 { margin-left: 0 !important; }
    .ml-5 { margin-left: 5px !important; }
    .ml-10 { margin-left: 10px !important; }
    .ml-20 { margin-left: 15px !important; }
    .ml-30 { margin-left: 20px !important; }
    .ml-40 { margin-left: 30px !important; }
    .ml-50 { margin-left: 35px !important; }
    .ml-60 { margin-left: 45px !important; }
    .ml-70 { margin-left: 50px !important; }
    .ml-80 { margin-left: 60px !important; }
    .ml-90 { margin-left: 65px !important; }
    .ml-100 { margin-left: 75px !important; }
    .ml-110 { margin-left: 80px !important; }
    .ml-120 { margin-left: 90px !important; }
    .ml-130 { margin-left: 95px !important; }
    .ml-140 { margin-left: 105px !important; }
    .ml-150 { margin-left: 110px !important; }
    .ml-160 { margin-left: 120px !important; }
    .ml-170 { margin-left: 125px !important; }
    .ml-180 { margin-left: 135px !important; }
    .ml-190 { margin-left: 140px !important; }
    .ml-200 { margin-left: 150px !important; }

    /* margin-right: automatische Staffelung */
    .mr-0 { margin-right: 0 !important; }
    .mr-5 { margin-right: 5px !important; }
    .mr-10 { margin-right: 10px !important; }
    .mr-20 { margin-right: 15px !important; }
    .mr-30 { margin-right: 20px !important; }
    .mr-40 { margin-right: 30px !important; }
    .mr-50 { margin-right: 35px !important; }
    .mr-60 { margin-right: 45px !important; }
    .mr-70 { margin-right: 50px !important; }
    .mr-80 { margin-right: 60px !important; }
    .mr-90 { margin-right: 65px !important; }
    .mr-100 { margin-right: 75px !important; }
    .mr-110 { margin-right: 80px !important; }
    .mr-120 { margin-right: 90px !important; }
    .mr-130 { margin-right: 95px !important; }
    .mr-140 { margin-right: 105px !important; }
    .mr-150 { margin-right: 110px !important; }
    .mr-160 { margin-right: 120px !important; }
    .mr-170 { margin-right: 125px !important; }
    .mr-180 { margin-right: 135px !important; }
    .mr-190 { margin-right: 140px !important; }
    .mr-200 { margin-right: 150px !important; }

    /* padding-left: automatische Staffelung */
    .pl-0 { padding-left: 0 !important; }
    .pl-5 { padding-left: 5px !important; }
    .pl-10 { padding-left: 10px !important; }
    .pl-20 { padding-left: 15px !important; }
    .pl-30 { padding-left: 20px !important; }
    .pl-40 { padding-left: 30px !important; }
    .pl-50 { padding-left: 35px !important; }
    .pl-60 { padding-left: 45px !important; }
    .pl-70 { padding-left: 50px !important; }
    .pl-80 { padding-left: 60px !important; }
    .pl-90 { padding-left: 65px !important; }
    .pl-100 { padding-left: 75px !important; }
    .pl-110 { padding-left: 80px !important; }
    .pl-120 { padding-left: 90px !important; }
    .pl-130 { padding-left: 95px !important; }
    .pl-140 { padding-left: 105px !important; }
    .pl-150 { padding-left: 110px !important; }
    .pl-160 { padding-left: 120px !important; }
    .pl-170 { padding-left: 125px !important; }
    .pl-180 { padding-left: 135px !important; }
    .pl-190 { padding-left: 140px !important; }
    .pl-200 { padding-left: 150px !important; }

    /* padding-right: automatische Staffelung */
    .pr-0 { padding-right: 0 !important; }
    .pr-5 { padding-right: 5px !important; }
    .pr-10 { padding-right: 10px !important; }
    .pr-20 { padding-right: 15px !important; }
    .pr-30 { padding-right: 20px !important; }
    .pr-40 { padding-right: 30px !important; }
    .pr-50 { padding-right: 35px !important; }
    .pr-60 { padding-right: 45px !important; }
    .pr-70 { padding-right: 50px !important; }
    .pr-80 { padding-right: 60px !important; }
    .pr-90 { padding-right: 65px !important; }
    .pr-100 { padding-right: 75px !important; }
    .pr-110 { padding-right: 80px !important; }
    .pr-120 { padding-right: 90px !important; }
    .pr-130 { padding-right: 95px !important; }
    .pr-140 { padding-right: 105px !important; }
    .pr-150 { padding-right: 110px !important; }
    .pr-160 { padding-right: 120px !important; }
    .pr-170 { padding-right: 125px !important; }
    .pr-180 { padding-right: 135px !important; }
    .pr-190 { padding-right: 140px !important; }
    .pr-200 { padding-right: 150px !important; }

    /* margin-top: explizite Tablet-Overrides */
    .mt-0-t { margin-top: 0 !important; }
    .mt-5-t { margin-top: 5px !important; }
    .mt-10-t { margin-top: 10px !important; }
    .mt-20-t { margin-top: 20px !important; }
    .mt-30-t { margin-top: 30px !important; }
    .mt-40-t { margin-top: 40px !important; }
    .mt-50-t { margin-top: 50px !important; }
    .mt-60-t { margin-top: 60px !important; }
    .mt-70-t { margin-top: 70px !important; }
    .mt-80-t { margin-top: 80px !important; }
    .mt-90-t { margin-top: 90px !important; }
    .mt-100-t { margin-top: 100px !important; }
    .mt-110-t { margin-top: 110px !important; }
    .mt-120-t { margin-top: 120px !important; }
    .mt-130-t { margin-top: 130px !important; }
    .mt-140-t { margin-top: 140px !important; }
    .mt-150-t { margin-top: 150px !important; }
    .mt-160-t { margin-top: 160px !important; }
    .mt-170-t { margin-top: 170px !important; }
    .mt-180-t { margin-top: 180px !important; }
    .mt-190-t { margin-top: 190px !important; }
    .mt-200-t { margin-top: 200px !important; }

    /* margin-bottom: explizite Tablet-Overrides */
    .mb-0-t { margin-bottom: 0 !important; }
    .mb-5-t { margin-bottom: 5px !important; }
    .mb-10-t { margin-bottom: 10px !important; }
    .mb-20-t { margin-bottom: 20px !important; }
    .mb-30-t { margin-bottom: 30px !important; }
    .mb-40-t { margin-bottom: 40px !important; }
    .mb-50-t { margin-bottom: 50px !important; }
    .mb-60-t { margin-bottom: 60px !important; }
    .mb-70-t { margin-bottom: 70px !important; }
    .mb-80-t { margin-bottom: 80px !important; }
    .mb-90-t { margin-bottom: 90px !important; }
    .mb-100-t { margin-bottom: 100px !important; }
    .mb-110-t { margin-bottom: 110px !important; }
    .mb-120-t { margin-bottom: 120px !important; }
    .mb-130-t { margin-bottom: 130px !important; }
    .mb-140-t { margin-bottom: 140px !important; }
    .mb-150-t { margin-bottom: 150px !important; }
    .mb-160-t { margin-bottom: 160px !important; }
    .mb-170-t { margin-bottom: 170px !important; }
    .mb-180-t { margin-bottom: 180px !important; }
    .mb-190-t { margin-bottom: 190px !important; }
    .mb-200-t { margin-bottom: 200px !important; }

    /* padding-top: explizite Tablet-Overrides */
    .pt-0-t { padding-top: 0 !important; }
    .pt-5-t { padding-top: 5px !important; }
    .pt-10-t { padding-top: 10px !important; }
    .pt-20-t { padding-top: 20px !important; }
    .pt-30-t { padding-top: 30px !important; }
    .pt-40-t { padding-top: 40px !important; }
    .pt-50-t { padding-top: 50px !important; }
    .pt-60-t { padding-top: 60px !important; }
    .pt-70-t { padding-top: 70px !important; }
    .pt-80-t { padding-top: 80px !important; }
    .pt-90-t { padding-top: 90px !important; }
    .pt-100-t { padding-top: 100px !important; }
    .pt-110-t { padding-top: 110px !important; }
    .pt-120-t { padding-top: 120px !important; }
    .pt-130-t { padding-top: 130px !important; }
    .pt-140-t { padding-top: 140px !important; }
    .pt-150-t { padding-top: 150px !important; }
    .pt-160-t { padding-top: 160px !important; }
    .pt-170-t { padding-top: 170px !important; }
    .pt-180-t { padding-top: 180px !important; }
    .pt-190-t { padding-top: 190px !important; }
    .pt-200-t { padding-top: 200px !important; }

    /* padding-bottom: explizite Tablet-Overrides */
    .pb-0-t { padding-bottom: 0 !important; }
    .pb-5-t { padding-bottom: 5px !important; }
    .pb-10-t { padding-bottom: 10px !important; }
    .pb-20-t { padding-bottom: 20px !important; }
    .pb-30-t { padding-bottom: 30px !important; }
    .pb-40-t { padding-bottom: 40px !important; }
    .pb-50-t { padding-bottom: 50px !important; }
    .pb-60-t { padding-bottom: 60px !important; }
    .pb-70-t { padding-bottom: 70px !important; }
    .pb-80-t { padding-bottom: 80px !important; }
    .pb-90-t { padding-bottom: 90px !important; }
    .pb-100-t { padding-bottom: 100px !important; }
    .pb-110-t { padding-bottom: 110px !important; }
    .pb-120-t { padding-bottom: 120px !important; }
    .pb-130-t { padding-bottom: 130px !important; }
    .pb-140-t { padding-bottom: 140px !important; }
    .pb-150-t { padding-bottom: 150px !important; }
    .pb-160-t { padding-bottom: 160px !important; }
    .pb-170-t { padding-bottom: 170px !important; }
    .pb-180-t { padding-bottom: 180px !important; }
    .pb-190-t { padding-bottom: 190px !important; }
    .pb-200-t { padding-bottom: 200px !important; }

    /* margin-left: explizite Tablet-Overrides */
    .ml-0-t { margin-left: 0 !important; }
    .ml-5-t { margin-left: 5px !important; }
    .ml-10-t { margin-left: 10px !important; }
    .ml-20-t { margin-left: 20px !important; }
    .ml-30-t { margin-left: 30px !important; }
    .ml-40-t { margin-left: 40px !important; }
    .ml-50-t { margin-left: 50px !important; }
    .ml-60-t { margin-left: 60px !important; }
    .ml-70-t { margin-left: 70px !important; }
    .ml-80-t { margin-left: 80px !important; }
    .ml-90-t { margin-left: 90px !important; }
    .ml-100-t { margin-left: 100px !important; }
    .ml-110-t { margin-left: 110px !important; }
    .ml-120-t { margin-left: 120px !important; }
    .ml-130-t { margin-left: 130px !important; }
    .ml-140-t { margin-left: 140px !important; }
    .ml-150-t { margin-left: 150px !important; }
    .ml-160-t { margin-left: 160px !important; }
    .ml-170-t { margin-left: 170px !important; }
    .ml-180-t { margin-left: 180px !important; }
    .ml-190-t { margin-left: 190px !important; }
    .ml-200-t { margin-left: 200px !important; }

    /* margin-right: explizite Tablet-Overrides */
    .mr-0-t { margin-right: 0 !important; }
    .mr-5-t { margin-right: 5px !important; }
    .mr-10-t { margin-right: 10px !important; }
    .mr-20-t { margin-right: 20px !important; }
    .mr-30-t { margin-right: 30px !important; }
    .mr-40-t { margin-right: 40px !important; }
    .mr-50-t { margin-right: 50px !important; }
    .mr-60-t { margin-right: 60px !important; }
    .mr-70-t { margin-right: 70px !important; }
    .mr-80-t { margin-right: 80px !important; }
    .mr-90-t { margin-right: 90px !important; }
    .mr-100-t { margin-right: 100px !important; }
    .mr-110-t { margin-right: 110px !important; }
    .mr-120-t { margin-right: 120px !important; }
    .mr-130-t { margin-right: 130px !important; }
    .mr-140-t { margin-right: 140px !important; }
    .mr-150-t { margin-right: 150px !important; }
    .mr-160-t { margin-right: 160px !important; }
    .mr-170-t { margin-right: 170px !important; }
    .mr-180-t { margin-right: 180px !important; }
    .mr-190-t { margin-right: 190px !important; }
    .mr-200-t { margin-right: 200px !important; }

    /* padding-left: explizite Tablet-Overrides */
    .pl-0-t { padding-left: 0 !important; }
    .pl-5-t { padding-left: 5px !important; }
    .pl-10-t { padding-left: 10px !important; }
    .pl-20-t { padding-left: 20px !important; }
    .pl-30-t { padding-left: 30px !important; }
    .pl-40-t { padding-left: 40px !important; }
    .pl-50-t { padding-left: 50px !important; }
    .pl-60-t { padding-left: 60px !important; }
    .pl-70-t { padding-left: 70px !important; }
    .pl-80-t { padding-left: 80px !important; }
    .pl-90-t { padding-left: 90px !important; }
    .pl-100-t { padding-left: 100px !important; }
    .pl-110-t { padding-left: 110px !important; }
    .pl-120-t { padding-left: 120px !important; }
    .pl-130-t { padding-left: 130px !important; }
    .pl-140-t { padding-left: 140px !important; }
    .pl-150-t { padding-left: 150px !important; }
    .pl-160-t { padding-left: 160px !important; }
    .pl-170-t { padding-left: 170px !important; }
    .pl-180-t { padding-left: 180px !important; }
    .pl-190-t { padding-left: 190px !important; }
    .pl-200-t { padding-left: 200px !important; }

    /* padding-right: explizite Tablet-Overrides */
    .pr-0-t { padding-right: 0 !important; }
    .pr-5-t { padding-right: 5px !important; }
    .pr-10-t { padding-right: 10px !important; }
    .pr-20-t { padding-right: 20px !important; }
    .pr-30-t { padding-right: 30px !important; }
    .pr-40-t { padding-right: 40px !important; }
    .pr-50-t { padding-right: 50px !important; }
    .pr-60-t { padding-right: 60px !important; }
    .pr-70-t { padding-right: 70px !important; }
    .pr-80-t { padding-right: 80px !important; }
    .pr-90-t { padding-right: 90px !important; }
    .pr-100-t { padding-right: 100px !important; }
    .pr-110-t { padding-right: 110px !important; }
    .pr-120-t { padding-right: 120px !important; }
    .pr-130-t { padding-right: 130px !important; }
    .pr-140-t { padding-right: 140px !important; }
    .pr-150-t { padding-right: 150px !important; }
    .pr-160-t { padding-right: 160px !important; }
    .pr-170-t { padding-right: 170px !important; }
    .pr-180-t { padding-right: 180px !important; }
    .pr-190-t { padding-right: 190px !important; }
    .pr-200-t { padding-right: 200px !important; }

}

/* =============================================================================
   4. SMARTPHONE | bis 599px
   Vertikale Standardklassen werden automatisch reduziert.
   Horizontale Abstände sind immer 0.
   ========================================================================== */
@media screen and (max-width: 599px) {
    /* margin-top: automatische Staffelung */
    .mt-0 { margin-top: 0 !important; }
    .mt-5 { margin-top: 5px !important; }
    .mt-10 { margin-top: 5px !important; }
    .mt-20 { margin-top: 10px !important; }
    .mt-30 { margin-top: 15px !important; }
    .mt-40 { margin-top: 20px !important; }
    .mt-50 { margin-top: 25px !important; }
    .mt-60 { margin-top: 30px !important; }
    .mt-70 { margin-top: 35px !important; }
    .mt-80 { margin-top: 40px !important; }
    .mt-90 { margin-top: 45px !important; }
    .mt-100 { margin-top: 50px !important; }
    .mt-110 { margin-top: 55px !important; }
    .mt-120 { margin-top: 60px !important; }
    .mt-130 { margin-top: 65px !important; }
    .mt-140 { margin-top: 70px !important; }
    .mt-150 { margin-top: 75px !important; }
    .mt-160 { margin-top: 80px !important; }
    .mt-170 { margin-top: 85px !important; }
    .mt-180 { margin-top: 90px !important; }
    .mt-190 { margin-top: 95px !important; }
    .mt-200 { margin-top: 100px !important; }

    /* margin-bottom: automatische Staffelung */
    .mb-0 { margin-bottom: 0 !important; }
    .mb-5 { margin-bottom: 5px !important; }
    .mb-10 { margin-bottom: 5px !important; }
    .mb-20 { margin-bottom: 10px !important; }
    .mb-30 { margin-bottom: 15px !important; }
    .mb-40 { margin-bottom: 20px !important; }
    .mb-50 { margin-bottom: 25px !important; }
    .mb-60 { margin-bottom: 30px !important; }
    .mb-70 { margin-bottom: 35px !important; }
    .mb-80 { margin-bottom: 40px !important; }
    .mb-90 { margin-bottom: 45px !important; }
    .mb-100 { margin-bottom: 50px !important; }
    .mb-110 { margin-bottom: 55px !important; }
    .mb-120 { margin-bottom: 60px !important; }
    .mb-130 { margin-bottom: 65px !important; }
    .mb-140 { margin-bottom: 70px !important; }
    .mb-150 { margin-bottom: 75px !important; }
    .mb-160 { margin-bottom: 80px !important; }
    .mb-170 { margin-bottom: 85px !important; }
    .mb-180 { margin-bottom: 90px !important; }
    .mb-190 { margin-bottom: 95px !important; }
    .mb-200 { margin-bottom: 100px !important; }

    /* padding-top: automatische Staffelung */
    .pt-0 { padding-top: 0 !important; }
    .pt-5 { padding-top: 5px !important; }
    .pt-10 { padding-top: 5px !important; }
    .pt-20 { padding-top: 10px !important; }
    .pt-30 { padding-top: 15px !important; }
    .pt-40 { padding-top: 20px !important; }
    .pt-50 { padding-top: 25px !important; }
    .pt-60 { padding-top: 30px !important; }
    .pt-70 { padding-top: 35px !important; }
    .pt-80 { padding-top: 40px !important; }
    .pt-90 { padding-top: 45px !important; }
    .pt-100 { padding-top: 50px !important; }
    .pt-110 { padding-top: 55px !important; }
    .pt-120 { padding-top: 60px !important; }
    .pt-130 { padding-top: 65px !important; }
    .pt-140 { padding-top: 70px !important; }
    .pt-150 { padding-top: 75px !important; }
    .pt-160 { padding-top: 80px !important; }
    .pt-170 { padding-top: 85px !important; }
    .pt-180 { padding-top: 90px !important; }
    .pt-190 { padding-top: 95px !important; }
    .pt-200 { padding-top: 100px !important; }

    /* padding-bottom: automatische Staffelung */
    .pb-0 { padding-bottom: 0 !important; }
    .pb-5 { padding-bottom: 5px !important; }
    .pb-10 { padding-bottom: 5px !important; }
    .pb-20 { padding-bottom: 10px !important; }
    .pb-30 { padding-bottom: 15px !important; }
    .pb-40 { padding-bottom: 20px !important; }
    .pb-50 { padding-bottom: 25px !important; }
    .pb-60 { padding-bottom: 30px !important; }
    .pb-70 { padding-bottom: 35px !important; }
    .pb-80 { padding-bottom: 40px !important; }
    .pb-90 { padding-bottom: 45px !important; }
    .pb-100 { padding-bottom: 50px !important; }
    .pb-110 { padding-bottom: 55px !important; }
    .pb-120 { padding-bottom: 60px !important; }
    .pb-130 { padding-bottom: 65px !important; }
    .pb-140 { padding-bottom: 70px !important; }
    .pb-150 { padding-bottom: 75px !important; }
    .pb-160 { padding-bottom: 80px !important; }
    .pb-170 { padding-bottom: 85px !important; }
    .pb-180 { padding-bottom: 90px !important; }
    .pb-190 { padding-bottom: 95px !important; }
    .pb-200 { padding-bottom: 100px !important; }

    /* margin-left: automatische Staffelung */
    .ml-0 { margin-left: 0 !important; }
    .ml-5 { margin-left: 0 !important; }
    .ml-10 { margin-left: 0 !important; }
    .ml-20 { margin-left: 0 !important; }
    .ml-30 { margin-left: 0 !important; }
    .ml-40 { margin-left: 0 !important; }
    .ml-50 { margin-left: 0 !important; }
    .ml-60 { margin-left: 0 !important; }
    .ml-70 { margin-left: 0 !important; }
    .ml-80 { margin-left: 0 !important; }
    .ml-90 { margin-left: 0 !important; }
    .ml-100 { margin-left: 0 !important; }
    .ml-110 { margin-left: 0 !important; }
    .ml-120 { margin-left: 0 !important; }
    .ml-130 { margin-left: 0 !important; }
    .ml-140 { margin-left: 0 !important; }
    .ml-150 { margin-left: 0 !important; }
    .ml-160 { margin-left: 0 !important; }
    .ml-170 { margin-left: 0 !important; }
    .ml-180 { margin-left: 0 !important; }
    .ml-190 { margin-left: 0 !important; }
    .ml-200 { margin-left: 0 !important; }

    /* margin-right: automatische Staffelung */
    .mr-0 { margin-right: 0 !important; }
    .mr-5 { margin-right: 0 !important; }
    .mr-10 { margin-right: 0 !important; }
    .mr-20 { margin-right: 0 !important; }
    .mr-30 { margin-right: 0 !important; }
    .mr-40 { margin-right: 0 !important; }
    .mr-50 { margin-right: 0 !important; }
    .mr-60 { margin-right: 0 !important; }
    .mr-70 { margin-right: 0 !important; }
    .mr-80 { margin-right: 0 !important; }
    .mr-90 { margin-right: 0 !important; }
    .mr-100 { margin-right: 0 !important; }
    .mr-110 { margin-right: 0 !important; }
    .mr-120 { margin-right: 0 !important; }
    .mr-130 { margin-right: 0 !important; }
    .mr-140 { margin-right: 0 !important; }
    .mr-150 { margin-right: 0 !important; }
    .mr-160 { margin-right: 0 !important; }
    .mr-170 { margin-right: 0 !important; }
    .mr-180 { margin-right: 0 !important; }
    .mr-190 { margin-right: 0 !important; }
    .mr-200 { margin-right: 0 !important; }

    /* padding-left: automatische Staffelung */
    .pl-0 { padding-left: 0 !important; }
    .pl-5 { padding-left: 0 !important; }
    .pl-10 { padding-left: 0 !important; }
    .pl-20 { padding-left: 0 !important; }
    .pl-30 { padding-left: 0 !important; }
    .pl-40 { padding-left: 0 !important; }
    .pl-50 { padding-left: 0 !important; }
    .pl-60 { padding-left: 0 !important; }
    .pl-70 { padding-left: 0 !important; }
    .pl-80 { padding-left: 0 !important; }
    .pl-90 { padding-left: 0 !important; }
    .pl-100 { padding-left: 0 !important; }
    .pl-110 { padding-left: 0 !important; }
    .pl-120 { padding-left: 0 !important; }
    .pl-130 { padding-left: 0 !important; }
    .pl-140 { padding-left: 0 !important; }
    .pl-150 { padding-left: 0 !important; }
    .pl-160 { padding-left: 0 !important; }
    .pl-170 { padding-left: 0 !important; }
    .pl-180 { padding-left: 0 !important; }
    .pl-190 { padding-left: 0 !important; }
    .pl-200 { padding-left: 0 !important; }

    /* padding-right: automatische Staffelung */
    .pr-0 { padding-right: 0 !important; }
    .pr-5 { padding-right: 0 !important; }
    .pr-10 { padding-right: 0 !important; }
    .pr-20 { padding-right: 0 !important; }
    .pr-30 { padding-right: 0 !important; }
    .pr-40 { padding-right: 0 !important; }
    .pr-50 { padding-right: 0 !important; }
    .pr-60 { padding-right: 0 !important; }
    .pr-70 { padding-right: 0 !important; }
    .pr-80 { padding-right: 0 !important; }
    .pr-90 { padding-right: 0 !important; }
    .pr-100 { padding-right: 0 !important; }
    .pr-110 { padding-right: 0 !important; }
    .pr-120 { padding-right: 0 !important; }
    .pr-130 { padding-right: 0 !important; }
    .pr-140 { padding-right: 0 !important; }
    .pr-150 { padding-right: 0 !important; }
    .pr-160 { padding-right: 0 !important; }
    .pr-170 { padding-right: 0 !important; }
    .pr-180 { padding-right: 0 !important; }
    .pr-190 { padding-right: 0 !important; }
    .pr-200 { padding-right: 0 !important; }

    /* margin-top: explizite Smartphone-Overrides */
    .mt-0-s { margin-top: 0 !important; }
    .mt-5-s { margin-top: 5px !important; }
    .mt-10-s { margin-top: 10px !important; }
    .mt-20-s { margin-top: 20px !important; }
    .mt-30-s { margin-top: 30px !important; }
    .mt-40-s { margin-top: 40px !important; }
    .mt-50-s { margin-top: 50px !important; }
    .mt-60-s { margin-top: 60px !important; }
    .mt-70-s { margin-top: 70px !important; }
    .mt-80-s { margin-top: 80px !important; }
    .mt-90-s { margin-top: 90px !important; }
    .mt-100-s { margin-top: 100px !important; }
    .mt-110-s { margin-top: 110px !important; }
    .mt-120-s { margin-top: 120px !important; }
    .mt-130-s { margin-top: 130px !important; }
    .mt-140-s { margin-top: 140px !important; }
    .mt-150-s { margin-top: 150px !important; }
    .mt-160-s { margin-top: 160px !important; }
    .mt-170-s { margin-top: 170px !important; }
    .mt-180-s { margin-top: 180px !important; }
    .mt-190-s { margin-top: 190px !important; }
    .mt-200-s { margin-top: 200px !important; }

    /* margin-bottom: explizite Smartphone-Overrides */
    .mb-0-s { margin-bottom: 0 !important; }
    .mb-5-s { margin-bottom: 5px !important; }
    .mb-10-s { margin-bottom: 10px !important; }
    .mb-20-s { margin-bottom: 20px !important; }
    .mb-30-s { margin-bottom: 30px !important; }
    .mb-40-s { margin-bottom: 40px !important; }
    .mb-50-s { margin-bottom: 50px !important; }
    .mb-60-s { margin-bottom: 60px !important; }
    .mb-70-s { margin-bottom: 70px !important; }
    .mb-80-s { margin-bottom: 80px !important; }
    .mb-90-s { margin-bottom: 90px !important; }
    .mb-100-s { margin-bottom: 100px !important; }
    .mb-110-s { margin-bottom: 110px !important; }
    .mb-120-s { margin-bottom: 120px !important; }
    .mb-130-s { margin-bottom: 130px !important; }
    .mb-140-s { margin-bottom: 140px !important; }
    .mb-150-s { margin-bottom: 150px !important; }
    .mb-160-s { margin-bottom: 160px !important; }
    .mb-170-s { margin-bottom: 170px !important; }
    .mb-180-s { margin-bottom: 180px !important; }
    .mb-190-s { margin-bottom: 190px !important; }
    .mb-200-s { margin-bottom: 200px !important; }

    /* padding-top: explizite Smartphone-Overrides */
    .pt-0-s { padding-top: 0 !important; }
    .pt-5-s { padding-top: 5px !important; }
    .pt-10-s { padding-top: 10px !important; }
    .pt-20-s { padding-top: 20px !important; }
    .pt-30-s { padding-top: 30px !important; }
    .pt-40-s { padding-top: 40px !important; }
    .pt-50-s { padding-top: 50px !important; }
    .pt-60-s { padding-top: 60px !important; }
    .pt-70-s { padding-top: 70px !important; }
    .pt-80-s { padding-top: 80px !important; }
    .pt-90-s { padding-top: 90px !important; }
    .pt-100-s { padding-top: 100px !important; }
    .pt-110-s { padding-top: 110px !important; }
    .pt-120-s { padding-top: 120px !important; }
    .pt-130-s { padding-top: 130px !important; }
    .pt-140-s { padding-top: 140px !important; }
    .pt-150-s { padding-top: 150px !important; }
    .pt-160-s { padding-top: 160px !important; }
    .pt-170-s { padding-top: 170px !important; }
    .pt-180-s { padding-top: 180px !important; }
    .pt-190-s { padding-top: 190px !important; }
    .pt-200-s { padding-top: 200px !important; }

    /* padding-bottom: explizite Smartphone-Overrides */
    .pb-0-s { padding-bottom: 0 !important; }
    .pb-5-s { padding-bottom: 5px !important; }
    .pb-10-s { padding-bottom: 10px !important; }
    .pb-20-s { padding-bottom: 20px !important; }
    .pb-30-s { padding-bottom: 30px !important; }
    .pb-40-s { padding-bottom: 40px !important; }
    .pb-50-s { padding-bottom: 50px !important; }
    .pb-60-s { padding-bottom: 60px !important; }
    .pb-70-s { padding-bottom: 70px !important; }
    .pb-80-s { padding-bottom: 80px !important; }
    .pb-90-s { padding-bottom: 90px !important; }
    .pb-100-s { padding-bottom: 100px !important; }
    .pb-110-s { padding-bottom: 110px !important; }
    .pb-120-s { padding-bottom: 120px !important; }
    .pb-130-s { padding-bottom: 130px !important; }
    .pb-140-s { padding-bottom: 140px !important; }
    .pb-150-s { padding-bottom: 150px !important; }
    .pb-160-s { padding-bottom: 160px !important; }
    .pb-170-s { padding-bottom: 170px !important; }
    .pb-180-s { padding-bottom: 180px !important; }
    .pb-190-s { padding-bottom: 190px !important; }
    .pb-200-s { padding-bottom: 200px !important; }

    /* margin-left: Smartphone immer 0, Klassen bleiben kompatibel */
    .ml-0-s { margin-left: 0 !important; }
    .ml-5-s { margin-left: 0 !important; }
    .ml-10-s { margin-left: 0 !important; }
    .ml-20-s { margin-left: 0 !important; }
    .ml-30-s { margin-left: 0 !important; }
    .ml-40-s { margin-left: 0 !important; }
    .ml-50-s { margin-left: 0 !important; }
    .ml-60-s { margin-left: 0 !important; }
    .ml-70-s { margin-left: 0 !important; }
    .ml-80-s { margin-left: 0 !important; }
    .ml-90-s { margin-left: 0 !important; }
    .ml-100-s { margin-left: 0 !important; }
    .ml-110-s { margin-left: 0 !important; }
    .ml-120-s { margin-left: 0 !important; }
    .ml-130-s { margin-left: 0 !important; }
    .ml-140-s { margin-left: 0 !important; }
    .ml-150-s { margin-left: 0 !important; }
    .ml-160-s { margin-left: 0 !important; }
    .ml-170-s { margin-left: 0 !important; }
    .ml-180-s { margin-left: 0 !important; }
    .ml-190-s { margin-left: 0 !important; }
    .ml-200-s { margin-left: 0 !important; }

    /* margin-right: Smartphone immer 0, Klassen bleiben kompatibel */
    .mr-0-s { margin-right: 0 !important; }
    .mr-5-s { margin-right: 0 !important; }
    .mr-10-s { margin-right: 0 !important; }
    .mr-20-s { margin-right: 0 !important; }
    .mr-30-s { margin-right: 0 !important; }
    .mr-40-s { margin-right: 0 !important; }
    .mr-50-s { margin-right: 0 !important; }
    .mr-60-s { margin-right: 0 !important; }
    .mr-70-s { margin-right: 0 !important; }
    .mr-80-s { margin-right: 0 !important; }
    .mr-90-s { margin-right: 0 !important; }
    .mr-100-s { margin-right: 0 !important; }
    .mr-110-s { margin-right: 0 !important; }
    .mr-120-s { margin-right: 0 !important; }
    .mr-130-s { margin-right: 0 !important; }
    .mr-140-s { margin-right: 0 !important; }
    .mr-150-s { margin-right: 0 !important; }
    .mr-160-s { margin-right: 0 !important; }
    .mr-170-s { margin-right: 0 !important; }
    .mr-180-s { margin-right: 0 !important; }
    .mr-190-s { margin-right: 0 !important; }
    .mr-200-s { margin-right: 0 !important; }

    /* padding-left: Smartphone immer 0, Klassen bleiben kompatibel */
    .pl-0-s { padding-left: 0 !important; }
    .pl-5-s { padding-left: 0 !important; }
    .pl-10-s { padding-left: 0 !important; }
    .pl-20-s { padding-left: 0 !important; }
    .pl-30-s { padding-left: 0 !important; }
    .pl-40-s { padding-left: 0 !important; }
    .pl-50-s { padding-left: 0 !important; }
    .pl-60-s { padding-left: 0 !important; }
    .pl-70-s { padding-left: 0 !important; }
    .pl-80-s { padding-left: 0 !important; }
    .pl-90-s { padding-left: 0 !important; }
    .pl-100-s { padding-left: 0 !important; }
    .pl-110-s { padding-left: 0 !important; }
    .pl-120-s { padding-left: 0 !important; }
    .pl-130-s { padding-left: 0 !important; }
    .pl-140-s { padding-left: 0 !important; }
    .pl-150-s { padding-left: 0 !important; }
    .pl-160-s { padding-left: 0 !important; }
    .pl-170-s { padding-left: 0 !important; }
    .pl-180-s { padding-left: 0 !important; }
    .pl-190-s { padding-left: 0 !important; }
    .pl-200-s { padding-left: 0 !important; }

    /* padding-right: Smartphone immer 0, Klassen bleiben kompatibel */
    .pr-0-s { padding-right: 0 !important; }
    .pr-5-s { padding-right: 0 !important; }
    .pr-10-s { padding-right: 0 !important; }
    .pr-20-s { padding-right: 0 !important; }
    .pr-30-s { padding-right: 0 !important; }
    .pr-40-s { padding-right: 0 !important; }
    .pr-50-s { padding-right: 0 !important; }
    .pr-60-s { padding-right: 0 !important; }
    .pr-70-s { padding-right: 0 !important; }
    .pr-80-s { padding-right: 0 !important; }
    .pr-90-s { padding-right: 0 !important; }
    .pr-100-s { padding-right: 0 !important; }
    .pr-110-s { padding-right: 0 !important; }
    .pr-120-s { padding-right: 0 !important; }
    .pr-130-s { padding-right: 0 !important; }
    .pr-140-s { padding-right: 0 !important; }
    .pr-150-s { padding-right: 0 !important; }
    .pr-160-s { padding-right: 0 !important; }
    .pr-170-s { padding-right: 0 !important; }
    .pr-180-s { padding-right: 0 !important; }
    .pr-190-s { padding-right: 0 !important; }
    .pr-200-s { padding-right: 0 !important; }

}

/* =============================================================================
   5. ABSTAND ELEMENT-ÜBERSCHRIFT → FEATURE-BOX-TEXT

   Verfügbare Werte:
   0, 5, 10 und 20 bis 100 in 10er-Schritten.

   Anwendung:
   ht-gap-80

   Automatische Staffelung wie bei vertikalen Abständen:
   Desktop 80px / Tablet 60px / Smartphone 40px.

   Gezielte Overrides bleiben möglich:
   ht-gap-80 ht-gap-50-t ht-gap-30-s

   Die Klasse wird auf das Feature-Box-Inhaltselement gesetzt.
   Verändert wird nur der untere Abstand der ersten Überschrift innerhalb
   von .feature-box-text.
   ========================================================================== */

.ce_rsce_tao_feature_box[class*="ht-gap-"]
> .feature-box-text
> :is(h1, h2, h3, h4, h5, h6):first-child {
    margin-bottom: var(--rh-ht-gap) !important;
}

/* Standard / Desktopwerte */
.ht-gap-0 { --rh-ht-gap: 0; }
.ht-gap-5 { --rh-ht-gap: 5px; }
.ht-gap-10 { --rh-ht-gap: 10px; }
.ht-gap-20 { --rh-ht-gap: 20px; }
.ht-gap-30 { --rh-ht-gap: 30px; }
.ht-gap-40 { --rh-ht-gap: 40px; }
.ht-gap-50 { --rh-ht-gap: 50px; }
.ht-gap-60 { --rh-ht-gap: 60px; }
.ht-gap-70 { --rh-ht-gap: 70px; }
.ht-gap-80 { --rh-ht-gap: 80px; }
.ht-gap-90 { --rh-ht-gap: 90px; }
.ht-gap-100 { --rh-ht-gap: 100px; }

/* Desktop-Overrides */
@media screen and (min-width: 901px) {
    .ht-gap-0-d { --rh-ht-gap: 0; }
    .ht-gap-5-d { --rh-ht-gap: 5px; }
    .ht-gap-10-d { --rh-ht-gap: 10px; }
    .ht-gap-20-d { --rh-ht-gap: 20px; }
    .ht-gap-30-d { --rh-ht-gap: 30px; }
    .ht-gap-40-d { --rh-ht-gap: 40px; }
    .ht-gap-50-d { --rh-ht-gap: 50px; }
    .ht-gap-60-d { --rh-ht-gap: 60px; }
    .ht-gap-70-d { --rh-ht-gap: 70px; }
    .ht-gap-80-d { --rh-ht-gap: 80px; }
    .ht-gap-90-d { --rh-ht-gap: 90px; }
    .ht-gap-100-d { --rh-ht-gap: 100px; }
}

/* Tablet: automatische Staffelung + Override */
@media screen and (min-width: 600px) and (max-width: 900px) {
    .ht-gap-0 { --rh-ht-gap: 0; }
    .ht-gap-5 { --rh-ht-gap: 5px; }
    .ht-gap-10 { --rh-ht-gap: 10px; }
    .ht-gap-20 { --rh-ht-gap: 15px; }
    .ht-gap-30 { --rh-ht-gap: 20px; }
    .ht-gap-40 { --rh-ht-gap: 30px; }
    .ht-gap-50 { --rh-ht-gap: 35px; }
    .ht-gap-60 { --rh-ht-gap: 45px; }
    .ht-gap-70 { --rh-ht-gap: 50px; }
    .ht-gap-80 { --rh-ht-gap: 60px; }
    .ht-gap-90 { --rh-ht-gap: 65px; }
    .ht-gap-100 { --rh-ht-gap: 75px; }

    .ht-gap-0-t { --rh-ht-gap: 0; }
    .ht-gap-5-t { --rh-ht-gap: 5px; }
    .ht-gap-10-t { --rh-ht-gap: 10px; }
    .ht-gap-20-t { --rh-ht-gap: 20px; }
    .ht-gap-30-t { --rh-ht-gap: 30px; }
    .ht-gap-40-t { --rh-ht-gap: 40px; }
    .ht-gap-50-t { --rh-ht-gap: 50px; }
    .ht-gap-60-t { --rh-ht-gap: 60px; }
    .ht-gap-70-t { --rh-ht-gap: 70px; }
    .ht-gap-80-t { --rh-ht-gap: 80px; }
    .ht-gap-90-t { --rh-ht-gap: 90px; }
    .ht-gap-100-t { --rh-ht-gap: 100px; }
}

/* Smartphone: automatische Staffelung + Override */
@media screen and (max-width: 599px) {
    .ht-gap-0 { --rh-ht-gap: 0; }
    .ht-gap-5 { --rh-ht-gap: 5px; }
    .ht-gap-10 { --rh-ht-gap: 5px; }
    .ht-gap-20 { --rh-ht-gap: 10px; }
    .ht-gap-30 { --rh-ht-gap: 15px; }
    .ht-gap-40 { --rh-ht-gap: 20px; }
    .ht-gap-50 { --rh-ht-gap: 25px; }
    .ht-gap-60 { --rh-ht-gap: 30px; }
    .ht-gap-70 { --rh-ht-gap: 35px; }
    .ht-gap-80 { --rh-ht-gap: 40px; }
    .ht-gap-90 { --rh-ht-gap: 45px; }
    .ht-gap-100 { --rh-ht-gap: 50px; }

    .ht-gap-0-s { --rh-ht-gap: 0; }
    .ht-gap-5-s { --rh-ht-gap: 5px; }
    .ht-gap-10-s { --rh-ht-gap: 10px; }
    .ht-gap-20-s { --rh-ht-gap: 20px; }
    .ht-gap-30-s { --rh-ht-gap: 30px; }
    .ht-gap-40-s { --rh-ht-gap: 40px; }
    .ht-gap-50-s { --rh-ht-gap: 50px; }
    .ht-gap-60-s { --rh-ht-gap: 60px; }
    .ht-gap-70-s { --rh-ht-gap: 70px; }
    .ht-gap-80-s { --rh-ht-gap: 80px; }
    .ht-gap-90-s { --rh-ht-gap: 90px; }
    .ht-gap-100-s { --rh-ht-gap: 100px; }
}

/* =============================================================================
   6. ABSATZ DIREKT VOR EINER AUFZÄHLUNG

   Gilt für normale Contao Text-Elemente und TAO Feature-Boxen.
   Nur direkte Kombinationen p + ul bzw. p + ol werden angepasst.
   ========================================================================== */

.main-content
:is(
    .content-text .rte,
    .feature-box-text
)
> p:has(+ :is(ul, ol)) {
    margin-bottom: 0.35em;
}

.main-content
:is(
    .content-text .rte,
    .feature-box-text
)
> p
+ :is(ul, ol) {
    margin-top: 0;
}
