/*
Datei:   css/g-kopf-fuss.css
Zweck:   Kopf- und Fusszeile aus dem Theme Builder.
Warum eigene Datei: Divi bindet style.css mit der Theme-Version ein
         (?ver=5.11.1), nicht mit filemtime — Aenderungen daran erreichen
         den Browser also erst nach einer Versionserhoehung. Diese Datei
         wird ueber functions.php mit filemtime geladen und ist deshalb
         sofort wirksam.
*/

/* ============================================================
   4 · Kopf- und Fußzeile (Theme Builder, global)
   ============================================================ */

/* ---------- Kopfzeile ---------- */
.quint-kopf.et_pb_section{background:rgba(250,243,227,.94) !important;
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(30,75,68,.10);position:relative;z-index:60}
.quint-kopf .et_pb_row{width:92%;max-width:1240px;display:flex;align-items:center}
.quint-kopf .et_pb_column{margin-bottom:0 !important}
.quint-marke{display:inline-block;line-height:0;
  transition:opacity .18s ease,transform .18s ease}
.quint-marke:hover,.quint-marke:focus-visible{opacity:.82}
.quint-marke img{height:clamp(46px,5vw,64px);width:auto;display:block}

.quint-menue.et_pb_menu{background:transparent !important}
.quint-menue .et_pb_menu__wrap{display:flex;align-items:center;justify-content:flex-end}
.quint-menue ul.et-menu{display:flex;align-items:center;justify-content:flex-end;
  flex-wrap:wrap;list-style:none !important;margin:0;padding:0 !important}
.quint-menue ul.et-menu>li{margin:0 0 0 28px;padding:0;list-style:none !important}
.quint-menue ul.et-menu>li::marker{content:""}
.quint-menue ul.et-menu>li>a{font-family:"Nunito Sans",sans-serif;font-weight:700;
  font-size:.95rem;color:#22404C;padding:8px 0;opacity:1}
.quint-menue ul.et-menu>li>a:hover{color:#3F6529;opacity:1}
/* Letzter Eintrag ist der Handlungsaufruf */
.quint-menue ul.et-menu>li:last-child>a{
  background:linear-gradient(150deg,#EDBB5E,#D9A441);color:#33240A;
  border-radius:999px;padding:10px 22px;font-family:"Baloo 2",sans-serif;
  box-shadow:0 8px 18px -10px rgba(160,110,20,.9);
  transition:transform .18s ease,box-shadow .18s ease}
.quint-menue ul.et-menu>li:last-child>a:hover{transform:translateY(-2px);color:#33240A}
.quint-menue .et_mobile_nav_menu .mobile_menu_bar::before{color:#22404C}
.quint-menue .et_mobile_menu{background:#FAF3E3;border-top-color:#D9A441}
.quint-menue .et_mobile_menu li a{color:#22404C;font-family:"Nunito Sans",sans-serif;font-weight:600}

/* ---------- Fußzeile ---------- */
.quint-fuss.et_pb_section{background:#16323F !important;--fuss-luecke:14px}
.quint-fuss .et_pb_row{width:92%;max-width:1240px}
.quint-fuss,.quint-fuss p,.quint-fuss li,.quint-fuss span{color:#B7C9C2;font-size:.93rem;line-height:1.65}
.quint-fuss h4{color:#fff;font-family:"Baloo 2",sans-serif;font-weight:700;
  font-size:1.02rem;margin-bottom:12px;padding-bottom:0}
.quint-fuss b{color:#EAF3EC}
/* Bildlink der Marke: die allgemeine Linkregel darunter wuerde ihm einen
   Unterstrich ueber die volle Spaltenbreite geben. */
.quint-fuss a.quint-fussmarke{display:inline-block;line-height:0;margin-bottom:16px;
  width:max-content;max-width:100%;border-bottom:0}
.quint-fussmarke img{width:220px;max-width:100%;height:auto;display:block}
.quint-fuss a{color:#B7C9C2;text-decoration:none;
  border-bottom:1px solid rgba(183,201,194,.28);transition:color .16s ease,border-color .16s ease}
.quint-fuss a:hover{color:#EDBB5E;border-color:#EDBB5E}

.quint-fussmenue.et_pb_menu{background:transparent !important}
.quint-fussmenue .et_pb_menu__wrap{display:block}
/* Divi macht aus der Liste einen flex-Container mit wrap. Ein display:block
   auf den <li> hilft dagegen nichts — bei schmaler Spalte rutschen dann
   mehrere Punkte in eine Zeile („VerschenkenQuints Teich"). Also die
   Richtung des Containers umstellen und jedem Punkt die volle Breite geben. */
.quint-fussmenue ul.et-menu{display:flex !important;flex-direction:column;
  align-items:flex-start;flex-wrap:nowrap;
  list-style:none !important;margin:0;padding:0 !important}
.quint-fussmenue ul.et-menu>li{margin:0 0 var(--fuss-luecke) 0;padding:0;display:block;
  flex:0 0 auto;width:100%;list-style:none !important}
.quint-fussmenue ul.et-menu>li:last-child{margin-bottom:0}
.quint-fussmenue ul.et-menu>li::marker{content:""}
.quint-fussmenue ul.et-menu>li>a{font-family:"Nunito Sans",sans-serif;font-weight:400;
  font-size:.93rem;line-height:1.45;color:#B7C9C2;padding:0;opacity:1;
  display:inline-block;border-bottom:1px solid transparent}
.quint-fussmenue ul.et-menu>li>a:hover{color:#EDBB5E;opacity:1}
.quint-fussmenue .et_mobile_nav_menu{display:none}
.quint-fussmenue .et_pb_menu__menu{display:block !important}

.quint-kontakt{margin:0 0 var(--fuss-luecke) 0}
.quint-kontakt a{display:inline-block;line-height:1.45}
.quint-anschrift{margin:0;font-style:normal}
.quint-anschrift span{display:block;line-height:1.45;color:#8FA69E;font-size:.93rem}
.quint-anschrift span + span{margin-top:var(--fuss-luecke)}
.quint-anschrift a{color:#B7C9C2}

.quint-copyright{margin:0;padding-top:22px;border-top:1px solid rgba(183,201,194,.18);
  text-align:center;color:#8FA69E;font-size:.85rem}

@media(max-width:980px){
  .quint-kopf .et_pb_row{flex-wrap:wrap}
  .quint-marke img{height:44px}
}


/* ---------- Kopfzeile auf schmalen Schirmen ----------
   Zwei Dinge stimmten hier nicht: Meine Desktop-Regel erzwang display:flex
   auf ul.et-menu und hebelte damit Divis Umschalten aus (vier Eintraege ueber
   zwei Zeilen, Hero nach unten geschoben). Und Divi 5.11 baut aus dem
   Platzhalter .et_mobile_nav_menu gar kein Mobilmenue mehr — kein
   .et_mobile_menu im DOM, das Icon-::before bleibt leer. Deshalb ein eigener
   Knopf (js/quint-kopf.js) und dieselbe Liste als aufklappendes Feld. */
@media(max-width:980px){
  /* Ohne Innenabstand steht das Logo auf derselben Kante wie der Inhalt
     der Seite (beide 92 % Breite) — sonst laege die Kopfzeile 23 px innen. */
  /* Divi deckelt die Reihe der Kopfzeile mit max-width:80 % und setzt sich
     dabei gegen die Klassenregel durch. Mit 92 % steht das Logo auf
     derselben Kante wie der Inhalt der Seite. */
  .quint-kopf .et_pb_row{width:92% !important;max-width:92% !important;
    padding-left:0;padding-right:0;flex-wrap:nowrap;position:relative;
    justify-content:space-between;align-items:center}
  .quint-kopf .et_pb_column{width:auto !important;flex:0 0 auto}
  .quint-kopf .et_pb_column:first-child{flex:1 1 auto;min-width:0}
  .quint-marke img{height:40px}

  /* Das Aufklappfeld soll die Breite der Kopfzeile bekommen, nicht die des
     Menuemoduls: alle Zwischenebenen aus dem Positionskontext nehmen, damit
     position:absolute an der Reihe haengt. */
  .quint-kopf .et_pb_column,.quint-menue,
  .quint-menue .et_pb_menu_inner_container,
  .quint-menue .et_pb_menu__wrap,
  .quint-menue nav.et-menu-nav{position:static}
  .quint-menue .et_pb_menu_inner_container,
  .quint-menue .et_pb_menu__wrap{display:block}
  .quint-menue .et_mobile_nav_menu{display:none !important}

  .quint-burger{display:flex;flex-direction:column;justify-content:center;gap:5px;
    width:44px;height:44px;padding:0 8px;margin:0 -8px 0 0;border:0;
    background:transparent;cursor:pointer;-webkit-appearance:none;appearance:none}
  .quint-burger span{display:block;height:2.5px;border-radius:2px;background:#22404C;
    transition:transform .22s ease,opacity .16s ease}
  .quint-burger:focus-visible{outline:2px solid #3F6529;outline-offset:3px;border-radius:8px}
  body.quint-menue-offen .quint-burger span:nth-child(1){transform:translateY(7.5px) rotate(45deg)}
  body.quint-menue-offen .quint-burger span:nth-child(2){opacity:0}
  body.quint-menue-offen .quint-burger span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}

  .quint-menue .et_pb_menu__menu{display:none}
  body.quint-menue-offen .quint-menue .et_pb_menu__menu{display:block;
    position:absolute;top:calc(100% + 14px);left:0;right:0;z-index:70;
    background:#FAF3E3;border:1px solid rgba(30,75,68,.12);border-radius:20px;
    box-shadow:0 24px 46px -24px rgba(22,50,63,.5);padding:10px}
  .quint-menue nav.et-menu-nav{width:100%}
  body.quint-menue-offen .quint-menue ul.et-menu{display:block;width:100%}
  body.quint-menue-offen .quint-menue ul.et-menu>li{margin:0;display:block}
  body.quint-menue-offen .quint-menue ul.et-menu>li>a{display:block;padding:13px 14px;
    font-size:1rem;border-radius:12px}
  body.quint-menue-offen .quint-menue ul.et-menu>li>a:hover{background:rgba(63,101,41,.08)}
  body.quint-menue-offen .quint-menue ul.et-menu>li:last-child>a{margin-top:6px;
    padding:14px 18px;text-align:center}
}
@media(min-width:981px){.quint-burger{display:none}}

@media(max-width:767px){
  /* Auf dem Handy nimmt die Marke sonst fast die ganze Spaltenbreite ein. */
  .quint-fussmarke img{width:190px}
}
/* Zwischen 768 und 980 px steht der Seiteninhalt in Divis 80 %-Reihe. Die
   Kopfzeile muss dieselbe Kante treffen, sonst haengt das Logo weiter aussen
   als alles darunter. Unter 768 px gelten die 92 % aus der Regel oben. */
@media(min-width:768px) and (max-width:980px){
  .quint-kopf .et_pb_row{width:80% !important;max-width:80% !important}
}
/* Ab 981 px steht der Inhalt in Divis Reihe (80 %, hoechstens 1080 px). Die
   Kopfzeile lag mit 92 %/1240 px daneben — Logo und Menue standen weiter
   aussen als alles darunter. Gleiche Kante, gleiche Ruhe. */
@media(min-width:981px){
  .quint-kopf .et_pb_row,
  .quint-fuss .et_pb_row{width:80% !important;max-width:1080px !important}
}
/* ---------- Abstand der Menuepunkte ------------------------------------
   Divi 5.11 setzt .et_pb_menu .et_pb_menu__menu > nav > ul > li{margin:0}.
   Diese Regel ist spezifischer als .quint-menue ul.et-menu > li und hat den
   Abstand zwischen den Eintraegen geschluckt — die Punkte klebten aneinander
   („Die GeschichteBlick ins BuchStimmen"). Gleiche Bauart, ein Wort mehr. */
.quint-menue .et_pb_menu__menu > nav > ul.et-menu > li{margin:0 0 0 28px}
.quint-menue .et_pb_menu__menu > nav > ul.et-menu > li:first-child{margin-left:0}
.quint-fussmenue .et_pb_menu__menu > nav > ul.et-menu > li{margin:0;padding:3px 0}

@media(max-width:980px){
  /* Im aufgeklappten Feld stehen die Eintraege untereinander. */
  .quint-menue .et_pb_menu__menu > nav > ul.et-menu > li{margin:0}
}
/* Rechtsspalte in der Fußzeile — dieselbe Anmutung wie das Entdecken-Menü. */
.quint-fuss ul.quint-rechtsliste{list-style:none;margin:0;padding:0}
.quint-fuss ul.quint-rechtsliste li{margin:0 0 var(--fuss-luecke) 0;padding:0}
.quint-fuss ul.quint-rechtsliste li:last-child{margin-bottom:0}
.quint-fuss ul.quint-rechtsliste a{font-size:.93rem;line-height:1.45;
  display:inline-block;border-bottom:1px solid transparent}
.quint-fuss ul.quint-rechtsliste a:hover{border-bottom-color:#EDBB5E}
@media(max-width:767px){
  .quint-fuss ul.quint-rechtsliste a:not(.quint-widerruf){display:inline-block;padding:6px 0;min-height:24px}
}

/* ---------- Gesetzlicher Widerrufsbutton -------------------------------
   Muss dauerhaft verfuegbar und leicht zugaenglich sein. Germanized haengt
   ihn sonst als einzelnen Knopf unter die Fusszeile, wo er ohne Bezug im
   Raum steht. Hier steht er als letzter Eintrag der Rechtliches-Spalte —
   dort, wo ohnehin nach rechtlichen Wegen gesucht wird, und mit einem
   feinen Rahmen, damit er sich von den Textlinks abhebt. */
.quint-fuss li.quint-widerruf-zeile{margin-top:30px}
.quint-fuss a.quint-widerruf{display:inline-flex;align-items:center;white-space:nowrap;
  background:linear-gradient(150deg,var(--f-gruen-tief,#5B7F3F),#4A6A33);
  border:1px solid rgba(255,255,255,.28);border-radius:999px;
  padding:11px 26px;font-family:"Baloo 2","Nunito Sans",sans-serif;font-weight:700;
  font-size:.86rem;line-height:1.3;color:#fff;
  box-shadow:0 12px 24px -16px rgba(30,75,68,.95);
  transition:background .18s ease,transform .18s ease,box-shadow .18s ease}
.quint-fuss a.quint-widerruf:hover,.quint-fuss a.quint-widerruf:focus-visible{
  background:linear-gradient(150deg,#6A9149,#3F5C2C);color:#fff;
  transform:translateY(-1px);box-shadow:0 16px 28px -14px rgba(30,75,68,1)}

/* Falls Germanized den Knopf doch einmal selbst ausgibt (etwa nach einem
   Update), soll er wenigstens nicht als Fremdkoerper unter der Fusszeile
   liegen. */
.eu-owb-order-withdraw-from-contract-button{background:#16323F;margin:0;
  padding:0 0 clamp(24px,3.4vw,36px);text-align:center}
body .eu-owb-order-withdraw-from-contract-button a{display:inline-block;
  background:linear-gradient(150deg,#5B7F3F,#4A6A33) !important;
  border:1px solid rgba(255,255,255,.28) !important;
  color:#fff !important;font-family:"Baloo 2","Nunito Sans",sans-serif;font-weight:700;
  font-size:.86rem;padding:10px 20px !important;border-radius:999px !important;
  box-shadow:0 12px 24px -16px rgba(30,75,68,.95) !important}
body .eu-owb-order-withdraw-from-contract-button a::after,
body .eu-owb-order-withdraw-from-contract-button a::before{content:none !important}/* ---------- Warenkorb in der Kopfzeile ---------------------------------
   Sitzt rechts neben dem Menü. Die Zahl kommt über WooCommerce-Fragmente,
   ändert sich also ohne Neuladen. Leer bleibt sie unsichtbar — ein Symbol
   mit einer stolzen Null ist keine gute Einladung. */
.quint-kopf .et_pb_column:last-child{display:flex;align-items:center;
  justify-content:flex-end;gap:clamp(14px,1.6vw,26px)}
.quint-korb-modul{flex:none;margin-bottom:0 !important}
a.quint-korb{position:relative;display:inline-flex;align-items:center;justify-content:center;
  width:44px;height:44px;border-radius:999px;color:#22404C;
  transition:background .16s ease,color .16s ease}
a.quint-korb:hover{background:rgba(30,75,68,.08);color:#3F6529}
a.quint-korb svg{width:23px;height:23px;fill:none;stroke:currentColor;
  stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
a.quint-korb .zahl{position:absolute;top:3px;right:1px;min-width:19px;height:19px;
  padding:0 5px;border-radius:999px;background:var(--f-gruen-tief,#5B7F3F);color:#fff;
  font-family:"Nunito Sans",sans-serif;font-weight:700;font-size:.7rem;line-height:19px;
  text-align:center;box-shadow:0 0 0 2px rgba(250,243,227,.94);opacity:0;transform:scale(.6);
  transition:opacity .18s ease,transform .18s cubic-bezier(.34,1.56,.64,1)}
a.quint-korb.voll .zahl{opacity:1;transform:scale(1)}

@media(max-width:980px){
  /* Zwischen Marke und Hamburger — der Knopf bleibt ganz rechts. */
  .quint-kopf .et_pb_column:last-child{gap:2px}
  a.quint-korb{width:40px;height:40px}
  a.quint-korb svg{width:21px;height:21px}
}
/* Divi gibt jedem Modul unten 28 px Aussenabstand. Seit die rechte Spalte
   ein Flex-Container ist (Menue + Warenkorb nebeneinander), zentriert sie
   den Rahmen einschliesslich dieses Abstands — das Menue sass dadurch neun
   Pixel hoeher als Logo und Warenkorb. */
.quint-kopf .et_pb_module{margin-bottom:0 !important;margin-top:0 !important}
.quint-kopf .et_pb_column:last-child > .et_pb_module{align-self:center}/* Die linke Spalte ebenso ausrichten, sonst haengt die Wortmarke vier Pixel
   ueber der Mittellinie von Menue und Warenkorb. Die Marke sitzt in einem
   Code-Modul; ausgerichtet werden muss deshalb dessen Innencontainer. */
.quint-kopf .et_pb_column:first-child{display:flex;align-items:center}
.quint-kopf .et_pb_column:first-child > .et_pb_module{margin:0 !important;
  align-self:stretch;display:flex;align-items:center}
.quint-kopf .et_pb_column:first-child .et_pb_code_inner{display:flex;
  align-items:center;width:100%;line-height:0}

/* Externe Ziele in der Fußzeile: sie öffnen im neuen Tab, das soll man
   sehen — ein kleiner Pfeil reicht, ein Icon-Font wäre Overkill. */
.quint-fuss a.quint-extern::after{content:"↗";display:inline-block;
  margin-left:.22em;font-size:.75em;opacity:.7}
.quint-fuss a.quint-extern:hover::after{opacity:1}

/* =====================================================================
   Fußzeile: ein Takt für alle drei Spalten (01.09.2026)
   ---------------------------------------------------------------------
   Vorher liefen die Spalten auseinander: die Menüpunkte unter „Entdecken"
   waren 37 px hoch, die Rechtsliste 39 px, weil Divi dem Menülink noch
   8 px padding-bottom mitgibt und die Zeilenhöhen sich unterschieden.
   Hier steht der Takt einmal und für alle: Abstand über --fuss-luecke,
   Zeilenhöhe 1,45, kein Zusatzabstand an den Links.

   Die Regel in Zeile 179 ist bewusst genauso spezifisch — sie steht nur
   weiter oben und musste Divi schlagen. Diese hier gewinnt, weil sie
   später kommt.
   ===================================================================== */
.quint-fuss ul.quint-rechtsliste li,
.quint-fussmenue .et_pb_menu__menu > nav > ul.et-menu > li,
.quint-fussmenue ul.et-menu > li{
  margin:0 0 var(--fuss-luecke) 0;padding:0;line-height:1.45}
.quint-fuss ul.quint-rechtsliste li:last-child,
.quint-fussmenue .et_pb_menu__menu > nav > ul.et-menu > li:last-child,
.quint-fussmenue ul.et-menu > li:last-child{margin-bottom:0}

/* inline, nicht inline-block: als Block-Kasten zaehlt die 1-px-Unterkante
   des Hover-Strichs zur Zeilenhoehe und die Linkspalten waeren einen Pixel
   hoeher als die Anschrift daneben. */
.quint-fuss ul.quint-rechtsliste a:not(.quint-widerruf),
.quint-fussmenue .et_pb_menu__menu > nav > ul.et-menu > li > a,
.quint-fussmenue ul.et-menu > li > a{
  display:inline;line-height:1.45;padding:0}

/* Der Widerrufsknopf braucht Luft nach oben. Die Sammelregel oben setzt
   margin als Kurzform und wuerde ein margin-top wieder auf 0 ziehen —
   deshalb hier mit derselben Kettenlaenge dagegenhalten. */
.quint-fuss ul.quint-rechtsliste li.quint-widerruf-zeile{margin-top:30px}

.quint-fuss .quint-kontakt{margin:0 0 var(--fuss-luecke) 0;line-height:1.45}
.quint-fuss .quint-kontakt a{display:inline-block;line-height:1.45}
.quint-fuss .quint-anschrift span{line-height:1.45}
.quint-fuss .quint-anschrift span + span{margin-top:var(--fuss-luecke)}

/* Divi macht aus dem Menülink im Fuß einen Block und lässt sich davon auch
   nicht abbringen. Der 1-px-Strich, den alle Fußzeilen-Links für den Hover
   bereithalten, zählt dort also zur Zeilenhöhe — die Spalte „Entdecken"
   stand dadurch einen Pixel weiter auseinander als „Rechtliches" und die
   Anschrift. Ein box-shadow nimmt keinen Platz und sieht gleich aus. */
.quint-fussmenue .et_pb_menu__menu > nav > ul.et-menu > li > a,
.quint-fussmenue ul.et-menu > li > a{border-bottom:0}
.quint-fussmenue .et_pb_menu__menu > nav > ul.et-menu > li > a:hover,
.quint-fussmenue ul.et-menu > li > a:hover{box-shadow:0 1px 0 0 #EDBB5E}

/* Auf schmalen Schirmen muss der Link selbst antippbar sein, nicht nur
   seine 22 px Textzeile. Der Abstand wandert dafür vom Aussenrand des
   Punktes in den Innenabstand des Links: gleicher Rhythmus wie am Desktop
   (36 px), aber die ganze Fläche reagiert auf den Finger. */
@media(max-width:980px){
  .quint-fuss ul.quint-rechtsliste li,
  .quint-fussmenue .et_pb_menu__menu > nav > ul.et-menu > li,
  .quint-fussmenue ul.et-menu > li{margin-bottom:0}
  /* Der Widerrufsknopf ist ein Knopf, kein Listenlink — er darf die
     Blockdarstellung und den Innenabstand nicht abbekommen, sonst fällt
     er auf schmalen Schirmen auf 2 px zusammen. */
  .quint-fuss ul.quint-rechtsliste a:not(.quint-widerruf),
  .quint-fussmenue .et_pb_menu__menu > nav > ul.et-menu > li > a,
  .quint-fussmenue ul.et-menu > li > a{
    display:block;padding:7px 0;min-height:0;border-bottom:0}
  /* Als Block zaehlt der Hover-Strich zur Hoehe — deshalb auch hier
     ueber box-shadow, sonst stuende die Rechtsliste einen Pixel weiter. */
  .quint-fuss ul.quint-rechtsliste a:not(.quint-widerruf):hover{box-shadow:0 1px 0 0 #EDBB5E}
  .quint-fuss ul.quint-rechtsliste li.quint-widerruf-zeile{margin-top:23px}
}

/* Der Widerrufsknopf muss sich gegen jede Listenregel behaupten — deshalb
   hier mit der vollen Kette. Er ist ein Knopf, kein Aufzählungslink. */
.quint-fuss ul.quint-rechtsliste li.quint-widerruf-zeile a.quint-widerruf{
  display:inline-flex;padding:11px 26px;min-height:0;line-height:1.3}

/* ---------- Fusszeile auf dem Tablet -----------------------------------
   Divi stellt Spalten unterhalb von 981 px untereinander. Die vier
   Fussspalten (Vorstellung, Entdecken, Rechtliches, Kontakt) ergaben so
   auf einem 834 px breiten Tablet 1.249 px Hoehe — man scrollt ewig.
   Zwischen 768 und 980 px ist Platz fuer zwei nebeneinander.
   -------------------------------------------------------------------- */
@media(min-width:768px) and (max-width:980px){
  .quint-fuss .et_pb_row:first-of-type{
    display:grid;grid-template-columns:1fr 1fr;
    column-gap:clamp(28px,5vw,56px);row-gap:clamp(26px,4vw,42px);
    align-items:start}
  .quint-fuss .et_pb_row:first-of-type>.et_pb_column{
    width:auto !important;max-width:none !important;
    margin:0 !important;float:none !important}
}