@charset "UTF-8";
/**
 * Block "Zeitstrahl" - block styles.
 *
 * Declared as "style" in block.json, so WordPress loads it on the front end and
 * inside the editor canvas iframe. Compiled to style.css by the SCSS watcher.
 * The steps (nuevo/timeline-step) are styled here as well: every selector
 * starts at the section of this block anyway.
 *
 * Two things differ from the legacy markup:
 *
 * 1. The steps stand in their own container .timeline-items. Line and marker
 *    have to stay siblings of that container, and useInnerBlocksProps() fills
 *    exactly one element - so :nth-child() can count the steps only when
 *    nothing else stands between them.
 * 2. The legacy block wrote text-image / image-text into every single row. A
 *    step cannot know its own position, so the container carries the starting
 *    side (start-text-image / start-image-text) and the alternation is derived
 *    from odd and even below. Same result, same geometry.
 *
 * @package nuevo
 * @subpackage blocks
 */
/**
 * nuevo Wordpress Theme
 *
 * @abstract
 * @author 	Bastian Schröder <bastian@creative-feat.com>
 * @author 	Marvin Landau <marvin@creative-feat.com>
 * @copyright Copyright (c) 2024, creative feat GmbH
 * @package cf-wp-theme-template
 * @version 2024-04-18
 */
/* Der Seitenrand des Content-Containers - die einzige Stelle, an der die Zahl
   steht. %container setzt ihn, und wer bis an die Fensterkante laufen will,
   nimmt ihn mit @include nuevo-bleed wieder zurück. */
/**
 * nuevo Wordpress Theme - breakpoints for the front end and the editor canvas.
 *
 * Since WordPress 7.0 the editor renders inside an iframe, so a media query in
 * the canvas measures that iframe: the browser window minus the admin menu and
 * the editor sidebar. On the very same screen a block therefore reaches a
 * breakpoint in the canvas that the front end never reaches, and the editor
 * shows a narrower layout than the visitor will get - two columns where the
 * page has four, stacked fields where the form has a row.
 *
 * These mixins write the rule twice: once for the front end at the real
 * breakpoint, once for the canvas at the shifted one. The body class is the
 * switch - only the iframe body carries .editor-styles-wrapper - so neither
 * branch can reach the other side, and both carry the same specificity.
 *
 * Use them for every top level breakpoint of a block stylesheet:
 *
 *     @include nuevo-bp-max( $std_middle_large_width ) { ... }
 *     @include nuevo-bp-min( $std_small_width )        { ... }
 *
 * css/editor-blocks.scss takes the other route. It is loaded in the canvas
 * only, so it shifts the breakpoint variables themselves and sets the chrome to
 * zero afterwards - that covers the theme wide grid classes without writing a
 * second set of rules.
 *
 * @package nuevo
 */
/* Was neben dem Canvas steht, und zwar je nach Fensterbreite verschieden:
   WordPress klappt das Adminmenü unterhalb von 960 px selbst auf 36 px ein und
   blendet es unterhalb von 782 px ganz aus. Die Editor-Seitenleiste ist 280 px
   breit.

   Eine einzige Zahl kann deshalb nicht stimmen. Vorher stand hier 280 - nur die
   Seitenleiste, ohne das Menü -, und in der voreingestellten Ansicht (Menü
   ausgeklappt, Seitenleiste offen) schaltete der Canvas 160 px zu früh um: er
   zeigte zwei Spalten, wo die Seite noch vier hat. Genau das war im Backend zu
   sehen.

   Jetzt bekommt jeder Breakpoint das Chrom, das bei seiner Fensterbreite
   wirklich daneben steht. */
/* Floor for the shifted value. Without it the smallest breakpoint would land
   near 200 px and WordPress' own mobile preview (360 px) would no longer reach
   it - the canvas would show the tablet layout on a phone. */
/**
 * Das Abstract eines Blocks - ein Absatz hinter der Überschrift.
 *
 * Nur ein Mixin, keine Ausgabe: die Datei wird von den Stylesheets der neun
 * Blöcke eingebunden, die ein Abstract tragen können, und jedes von ihnen
 * landet in einer eigenen style.css.
 *
 * Der Absatz sieht aus wie Fließtext überall sonst im Theme - hier steht nur,
 * wo er steht: zwischen Überschrift und Inhalt des Blocks, über die volle
 * Inhaltsbreite. Im Canvas zeichnet der Editor dasselbe Element an derselben
 * Stelle, eine eigene Regel für die Bearbeitung braucht es deshalb nicht.
 *
 * @package nuevo
 * @subpackage css
 */
/* Aufzurufen im Inhaltscontainer des Blocks. $slug ist der Blockname, wie ihn
   der Customizer für seinen Rasterabstand führt (--block_<slug>__gridSpace). */
/**
 * Die Ausrichtung der Abschnittsüberschrift - und des Abstracts darunter.
 *
 * Nur ein Mixin, keine Ausgabe: die Datei wird von den Stylesheets der Blöcke
 * eingebunden, die eine Überschrift mit Ausrichtung tragen, und jedes von ihnen
 * landet in einer eigenen style.css.
 *
 * Warum die Überschriften unmittelbar angesprochen werden: css/parts/_block.scss
 * zentriert jedes .block_headline, und der Customizer schreibt sein eigenes
 * "body h2 { text-align: … }" in den Kopf der Seite - eine Angabe an der
 * Überschrift selbst, die kein geerbter Wert schlägt. Deshalb h1-h6 mit
 * !important, so wie es der Bannerblock schon immer tat.
 *
 * Der Absatz darunter braucht das nicht: an ihn schreibt der Customizer nichts
 * Eigenes, der geerbte Wert genügt.
 *
 * Die Regeln standen wortgleich in zehn Blöcken; ein elfter (Buttons) schrieb
 * die Klasse, hatte aber gar keine Regel dazu - dort blieb die Einstellung ohne
 * Wirkung.
 *
 * @package nuevo
 * @subpackage css
 */
/* Aufzurufen im Abschnitt des Blocks. */
/**
 * Die Breite eines Abschnitts - und die Breite, auf die sie sich bezieht.
 *
 * Zwei Dinge stecken hier drin:
 *
 * 1. --nuevo-content-max: die Breite des Contentbereichs. Auf der Seite sind
 *    das die $std_extra_large_width des Themes; im Canvas des Editors ist der
 *    Contentbereich schmaler, weil Adminmenü und Seitenleiste danebenstehen -
 *    dort gilt der verschobene Wert, derselbe, den auch %container und die
 *    Breakpoints im Canvas benutzen (siehe css/parts/_breakpoints.scss).
 *
 *    Gesetzt wird sie je einmal pro Welt: in css/default.scss für die Seite, in
 *    css/editor-blocks.scss für den Canvas. Ein Blockstylesheet wird nur einmal
 *    kompiliert und in beiden Welten geladen; es kann den Unterschied deshalb
 *    nicht selbst kennen und liest ihn hier ab.
 *
 *    Ohne diese Variable rechnete jeder Block im Canvas gegen die 1598 px der
 *    Seite, während der Container daneben schon bei 1158 px endete: eine Breite
 *    von 70 % sah dort aus wie 97 %, und ab einem gewissen Fenster gar nicht
 *    mehr. Genau das war im Backend zu sehen.
 *
 * 2. --nuevo-content-width: der Anteil, den der Regler "Breite (%)" schreibt -
 *    siehe nuevo_content_width_style() in src/functions/helpers.php und
 *    contentWidthStyle() in js/nuevo-block-editor.js. Nicht gesetzt heißt volle
 *    Breite.
 *
 * @package nuevo
 */
/* Die Breite des Contentbereichs, wie sie in dieser Welt gilt. Der zweite Wert
   ist der Rückfall für den Fall, dass keine der beiden Dateien geladen ist. */
/**
 * Die max-width eines Abschnitts.
 *
 * @param {Number} $fallback Anteil ohne eigene Wahl - 1, außer wo ein Block
 *                           von Haus aus schmaler ist (ein einzelnes Video).
 */
/**
 * Was mit einem Wort geschieht, das nicht in seine Zeile passt.
 *
 * Zwei verschiedene Dinge, die oft verwechselt werden:
 *
 * "overflow-wrap: break-word" ist die Notbremse. Sie greift erst, wenn ein Wort
 * für seine Zeile zu lang ist, und bricht es dann irgendwo - ohne Trennstrich,
 * ohne Rücksicht auf Silben. Solange nichts überläuft, ist sie nicht zu sehen;
 * deshalb steht sie theme-weit in der Basistypografie
 * (css/parts/_typography.scss). Die Eigenschaft wird vererbt, eine Deklaration
 * genügt.
 *
 * "hyphens: auto" ist die Worttrennung. Der Browser trennt nach dem Wörterbuch
 * der Dokumentsprache - <html lang="de"> in src/partials/html-header.php -, mit
 * Trennstrich und an erlaubten Stellen, und zwar auch dort, wo nichts
 * überliefe. Das ist eine typografische Entscheidung: in einem schmalen Kasten
 * hält sie den Flattersatz zusammen, über die volle Contentbreite sähe sie nach
 * Zeitungssatz aus. Sie gilt deshalb nur dort, wo eine Spalte schmal ist -
 * Boxen, Teaser, Textspalten, FAQ, CTA, Bannerebene, Kacheln.
 *
 * @package nuevo
 */
/**
 * Der Zug eines Rasters nach aussen.
 *
 * Die Datei gibt selbst nichts aus - sie wird in mehrere Blockstylesheets
 * eingebunden und würde sonst ihre Regeln in jedes davon schreiben.
 *
 * @package nuevo
 */
/*
 * Der Zug eines Rasters nach aussen - gedeckelt auf den Container.
 *
 * Ein mehrspaltiges Raster gibt jeder Spalte den halben Rasterabstand als
 * Innenabstand und zieht den Wrapper um denselben Betrag nach aussen. So endet
 * der Inhalt der äusseren Spalten bündig mit dem Container, und dazwischen
 * steht der volle Abstand.
 *
 * Bis zu 40 px Rasterabstand geht das auf: der Zug bleibt bei höchstens 20 px,
 * und so viel Innenabstand hat %container (css/parts/_placeholders.scss). Ab
 * 45 px zieht das Raster **aus dem Container heraus** - und weil rechts vom
 * Dokument kein Rand ist, lässt sich die ganze Seite seitlich schieben.
 * Gemessen an einem Boxenblock mit 80 px: 20 px Überhang je Seite, auf dem
 * Schirm wie auf dem Handy.
 *
 * max() deckelt den waagerechten Zug deshalb bei -20 px. Unter 40 px
 * Rasterabstand ändert sich dadurch nichts; darüber rücken die äusseren
 * Spalten um die Differenz nach innen, statt überzustehen. Senkrecht bleibt
 * der Zug ungedeckelt - nach oben und unten begrenzt kein Container.
 *
 * @param $x Rasterabstand waagerecht.
 * @param $y Rasterabstand senkrecht, sonst derselbe.
 */
/*
 * The two groups of steps, addressed from .timelineSteps.
 *
 * Every rule that decides an order has to use one of these three selectors:
 * they all carry the same specificity, so a media query further down wins over
 * the rule above it - the way it did when the class stood on the step itself.
 */
/*
 * Der Abstand zur Linie in der Mitte.
 *
 * Er gehört an die Seite, die man sieht, nicht an die Reihenfolge im Markup:
 * die Spalten tauschen ihre Plätze über "order", das Markup bleibt Bild, dann
 * Text. Hing der Abstand an :first-child/:last-child, saß er im gespiegelten
 * Schritt außen - der Text stand dort 50 px vom Rand statt 20, während er zur
 * Linie hin klebte.
 */
/* Image left, text right - the layout the legacy class .text-image produced. */
/* Image right, text left - the layout the legacy class .image-text produced. */
section.block.nuevo--native.nuevo--block-timeline {
  /* The marker turns position: fixed while it runs along the line. A section
     that clips its content would cut it off - some child themes set
     overflow: hidden on every block. */
  overflow: unset;
  /* Die Ausrichtung der Überschrift - siehe css/parts/_headline-align.scss. */
}
section.block.nuevo--native.nuevo--block-timeline .block_headline.align-left {
  text-align: left;
}
section.block.nuevo--native.nuevo--block-timeline .block_headline.align-left h1, section.block.nuevo--native.nuevo--block-timeline .block_headline.align-left h2, section.block.nuevo--native.nuevo--block-timeline .block_headline.align-left h3, section.block.nuevo--native.nuevo--block-timeline .block_headline.align-left h4, section.block.nuevo--native.nuevo--block-timeline .block_headline.align-left h5, section.block.nuevo--native.nuevo--block-timeline .block_headline.align-left h6 {
  text-align: left !important;
}
section.block.nuevo--native.nuevo--block-timeline .block_headline.align-center {
  text-align: center;
}
section.block.nuevo--native.nuevo--block-timeline .block_headline.align-center h1, section.block.nuevo--native.nuevo--block-timeline .block_headline.align-center h2, section.block.nuevo--native.nuevo--block-timeline .block_headline.align-center h3, section.block.nuevo--native.nuevo--block-timeline .block_headline.align-center h4, section.block.nuevo--native.nuevo--block-timeline .block_headline.align-center h5, section.block.nuevo--native.nuevo--block-timeline .block_headline.align-center h6 {
  text-align: center !important;
}
section.block.nuevo--native.nuevo--block-timeline .block_headline.align-right {
  text-align: right;
}
section.block.nuevo--native.nuevo--block-timeline .block_headline.align-right h1, section.block.nuevo--native.nuevo--block-timeline .block_headline.align-right h2, section.block.nuevo--native.nuevo--block-timeline .block_headline.align-right h3, section.block.nuevo--native.nuevo--block-timeline .block_headline.align-right h4, section.block.nuevo--native.nuevo--block-timeline .block_headline.align-right h5, section.block.nuevo--native.nuevo--block-timeline .block_headline.align-right h6 {
  text-align: right !important;
}
section.block.nuevo--native.nuevo--block-timeline > .content-container {
  /* Die Breite des Abschnitts - siehe css/parts/_content-width.scss. */
  max-width: calc(var(--nuevo-content-max, 1598px) * var(--nuevo-content-width, 1));
}
section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps {
  position: relative;
  z-index: 0;
}
section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps .scroll-line {
  position: absolute;
  left: 50%;
  transform: translateX(-4px);
  width: 2px;
  height: 100%;
  border-right: 2px solid var(--colorscheme__highlight, var(--defaultcolor__highlight, currentColor));
}
section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps .scroller {
  display: block;
  width: 60px;
  height: 60px;
  text-align: center;
  z-index: 1;
  border-radius: 50%;
  background-color: var(--colorscheme__background, var(--defaultcolor__background, #ffffff));
  /* A dot by default. A theme that wants its own marker - a logo, say -
     overrides the one property:
     --nuevo-timeline-marker: url(…/logo.svg); */
  background-image: var(--nuevo-timeline-marker, radial-gradient(circle at center, var(--colorscheme__highlight, var(--defaultcolor__highlight, currentColor)) 0 6px, transparent 6px));
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 0;
  left: 50%;
  /* Ein Symbol aus der mitgelieferten Sammlung.

     Die Maske liegt auf einer eigenen Ebene, nicht auf dem Element:
     eine Maske beschneidet alles, was das Element malt - auch die
     Scheibe, die die Linie verdeckt. Die bliebe sonst weg, und die Linie
     liefe mitten durch die Zeichnung.

     Die Scheibe behält also ihre Hintergrundfarbe (oben), nur der Punkt
     entfällt; die Zeichnung darüber trägt die Akzentfarbe. Die Adresse
     der Zeichnung schreibt render.php als Custom Property an das
     Element. */
}
section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps .scroller.has-marker-icon {
  background-image: none;
}
section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps .scroller.has-marker-icon:after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: var(--colorscheme__highlight, var(--defaultcolor__highlight, currentColor));
  -webkit-mask-image: var(--nuevo-timeline-marker-icon);
  mask-image: var(--nuevo-timeline-marker-icon);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  /* Die Zeichnung füllt ihre Fläche fast ganz aus; etwas Luft zum
     Rand lässt die Scheibe darunter noch als Kreis erkennen. */
  -webkit-mask-size: 60%;
  mask-size: 60%;
}
section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps .scroller.is-fixed {
  position: fixed;
  top: 50vh; /* the Y offset is corrected in js/nuevo-blocks.js */
  transform: translateY(-50%); /* hit the centre exactly */
  z-index: 10;
}
section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps > .timeline-items > .timelineStep {
  /* Ein Schritt hat eine halbe Spalte: hier wird getrennt - siehe
     css/parts/_text-wrap.scss. */
  /* Der Abstand zwischen zwei Schritten. Am Anfang und am Ende steht er
     nicht mehr: dort entscheidet der Abstand des Abschnitts allein, wie
     in jedem anderen Block. Vorher kamen beide zusammen, und die Timeline
     hatte oben und unten sichtbar mehr Luft als ihre Nachbarn. */
  margin: 60px 0;
}
section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps > .timeline-items > .timelineStep .text-content {
  /* Safari braucht das Präfix bis heute. */
  -webkit-hyphens: auto;
  hyphens: auto;
  /* Und die Notbremse dazu: nicht jedes lange Wort hat eine Trennstelle, die
     passt - eine URL zum Beispiel hat gar keine. */
  overflow-wrap: break-word;
  /*
   * Damit beides überhaupt zum Zug kommt.
   *
   * Ein Element in einem Raster oder in einer Flexzeile ist von Haus aus
   * mindestens so breit wie sein breitester Inhalt ("min-width: auto"). Ein
   * langes Wort machte damit die Spalte breiter, statt selbst umzubrechen -
   * die Regel darüber stand da und tat nichts. Genau so war es im Videoblock
   * zu sehen. Wo das Element kein Raster- und kein Flexelement ist, ändert die
   * Zeile nichts.
   */
  min-width: 0;
}
section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps > .timeline-items > .timelineStep:first-child {
  margin-top: 0;
}
section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps > .timeline-items > .timelineStep:last-child {
  margin-bottom: 0;
}
section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps > .timeline-items > .timelineStep > .gridWrapper {
  /* css/parts/_typography.scss hangs the gutter of every grid on
     --blocks__gridSpace, so the padding slider would move it too. The
     block reads its own variable and falls back to the same value, so
     the default geometry is unchanged and both sliders stay
     independent. */
  margin: calc(var(--block_timeline__gridSpace, var(--blocks__gridSpace, 30px)) / -2) max(var(--block_timeline__gridSpace, var(--blocks__gridSpace, 30px)) / -2, -20px);
}
section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps > .timeline-items > .timelineStep > .gridWrapper > .grid {
  padding: calc(var(--block_timeline__gridSpace, var(--blocks__gridSpace, 30px)) / 2);
  display: flex;
  flex-flow: column;
  justify-content: center;
}
section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps > .timeline-items > .timelineStep > .gridWrapper > .grid > .grid-content {
  /* Der Abstand zur Linie steht bei den beiden Reihenfolgen weiter
     oben (timeline-image-first / -last) - er hängt an der Seite,
     die man sieht, nicht an der Reihenfolge im Markup. */
}
section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps > .timeline-items > .timelineStep > .gridWrapper > .grid > .grid-content .img-description {
  display: block;
  margin-top: 5px;
  font-style: italic;
  font-size: 14px;
}
section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps > .timeline-items > .timelineStep > .gridWrapper > .grid > .grid-content .timeline-description > .title {
  display: block;
}
section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps > .timeline-items > .timelineStep > .gridWrapper > .grid.text-content > .grid-content {
  display: flex;
  align-items: center;
  gap: var(--block_timeline__gridSpace, var(--blocks__gridSpace, 30px));
}
section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-text-image > .timeline-items > .timelineStep:nth-child(odd) .image-content, section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-image-text > .timeline-items > .timelineStep:nth-child(even) .image-content {
  order: 1;
}
section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-text-image > .timeline-items > .timelineStep:nth-child(odd) .image-content > .grid-content, section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-image-text > .timeline-items > .timelineStep:nth-child(even) .image-content > .grid-content {
  padding-left: 0;
  padding-right: var(--block_timeline__gridSpace, var(--blocks__gridSpace, 30px));
}
section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-text-image > .timeline-items > .timelineStep:nth-child(odd) .text-content, section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-image-text > .timeline-items > .timelineStep:nth-child(even) .text-content {
  order: 2;
}
section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-text-image > .timeline-items > .timelineStep:nth-child(odd) .text-content > .grid-content, section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-image-text > .timeline-items > .timelineStep:nth-child(even) .text-content > .grid-content {
  padding-left: var(--block_timeline__gridSpace, var(--blocks__gridSpace, 30px));
  padding-right: 0;
}
section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-text-image > .timeline-items > .timelineStep:nth-child(odd) .text-content > .grid-content .timeline-year, section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-image-text > .timeline-items > .timelineStep:nth-child(even) .text-content > .grid-content .timeline-year {
  order: 1;
}
section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-text-image > .timeline-items > .timelineStep:nth-child(odd) .text-content > .grid-content .timeline-description, section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-image-text > .timeline-items > .timelineStep:nth-child(even) .text-content > .grid-content .timeline-description {
  order: 2;
}
section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-text-image > .timeline-items > .timelineStep:nth-child(even) .image-content, section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-image-text > .timeline-items > .timelineStep:nth-child(odd) .image-content {
  order: 2;
}
section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-text-image > .timeline-items > .timelineStep:nth-child(even) .image-content > .grid-content, section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-image-text > .timeline-items > .timelineStep:nth-child(odd) .image-content > .grid-content {
  padding-left: var(--block_timeline__gridSpace, var(--blocks__gridSpace, 30px));
  padding-right: 0;
}
section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-text-image > .timeline-items > .timelineStep:nth-child(even) .text-content, section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-image-text > .timeline-items > .timelineStep:nth-child(odd) .text-content {
  order: 1;
}
section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-text-image > .timeline-items > .timelineStep:nth-child(even) .text-content > .grid-content, section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-image-text > .timeline-items > .timelineStep:nth-child(odd) .text-content > .grid-content {
  padding-left: 0;
  padding-right: var(--block_timeline__gridSpace, var(--blocks__gridSpace, 30px));
}
section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-text-image > .timeline-items > .timelineStep:nth-child(even) .text-content > .grid-content .timeline-year, section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-image-text > .timeline-items > .timelineStep:nth-child(odd) .text-content > .grid-content .timeline-year {
  order: 2;
}
section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-text-image > .timeline-items > .timelineStep:nth-child(even) .text-content > .grid-content .timeline-description, section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-image-text > .timeline-items > .timelineStep:nth-child(odd) .text-content > .grid-content .timeline-description {
  order: 1;
}

/* --------------------------------- std_extra_large_width [xl] --------------------------------- */
/* ------------------------------------ std_large_width [lg] ------------------------------------ */
/* --------------------------------- std_middle_large_width [md] -------------------------------- */
@media screen and (max-width: 900px) {
  body:not(.editor-styles-wrapper) section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps {
    /* From here on the year always stands above the text, on both sides. */
  }
  body:not(.editor-styles-wrapper) section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps .scroll-line {
    left: 15px;
  }
  body:not(.editor-styles-wrapper) section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps .scroller {
    left: 36px;
  }
  body:not(.editor-styles-wrapper) section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps > .timeline-items > .timelineStep {
    padding-left: 60px;
  }
  body:not(.editor-styles-wrapper) section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps > .timeline-items > .timelineStep > .gridWrapper > .grid > .grid-content:first-child {
    padding-right: 0;
  }
  body:not(.editor-styles-wrapper) section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps > .timeline-items > .timelineStep > .gridWrapper > .grid > .grid-content:last-child {
    padding-left: 0;
  }
  body:not(.editor-styles-wrapper) section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-text-image > .timeline-items > .timelineStep:nth-child(odd) .text-content > .grid-content .timeline-year, body:not(.editor-styles-wrapper) section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-image-text > .timeline-items > .timelineStep:nth-child(even) .text-content > .grid-content .timeline-year, body:not(.editor-styles-wrapper) section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-text-image > .timeline-items > .timelineStep:nth-child(even) .text-content > .grid-content .timeline-year, body:not(.editor-styles-wrapper) section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-image-text > .timeline-items > .timelineStep:nth-child(odd) .text-content > .grid-content .timeline-year {
    order: 1;
  }
  body:not(.editor-styles-wrapper) section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-text-image > .timeline-items > .timelineStep:nth-child(odd) .text-content > .grid-content .timeline-description, body:not(.editor-styles-wrapper) section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-image-text > .timeline-items > .timelineStep:nth-child(even) .text-content > .grid-content .timeline-description, body:not(.editor-styles-wrapper) section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-text-image > .timeline-items > .timelineStep:nth-child(even) .text-content > .grid-content .timeline-description, body:not(.editor-styles-wrapper) section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-image-text > .timeline-items > .timelineStep:nth-child(odd) .text-content > .grid-content .timeline-description {
    order: 2;
  }
}
@media screen and (max-width: 584px) {
  body.editor-styles-wrapper section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps {
    /* From here on the year always stands above the text, on both sides. */
  }
  body.editor-styles-wrapper section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps .scroll-line {
    left: 15px;
  }
  body.editor-styles-wrapper section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps .scroller {
    left: 36px;
  }
  body.editor-styles-wrapper section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps > .timeline-items > .timelineStep {
    padding-left: 60px;
  }
  body.editor-styles-wrapper section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps > .timeline-items > .timelineStep > .gridWrapper > .grid > .grid-content:first-child {
    padding-right: 0;
  }
  body.editor-styles-wrapper section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps > .timeline-items > .timelineStep > .gridWrapper > .grid > .grid-content:last-child {
    padding-left: 0;
  }
  body.editor-styles-wrapper section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-text-image > .timeline-items > .timelineStep:nth-child(odd) .text-content > .grid-content .timeline-year, body.editor-styles-wrapper section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-image-text > .timeline-items > .timelineStep:nth-child(even) .text-content > .grid-content .timeline-year, body.editor-styles-wrapper section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-text-image > .timeline-items > .timelineStep:nth-child(even) .text-content > .grid-content .timeline-year, body.editor-styles-wrapper section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-image-text > .timeline-items > .timelineStep:nth-child(odd) .text-content > .grid-content .timeline-year {
    order: 1;
  }
  body.editor-styles-wrapper section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-text-image > .timeline-items > .timelineStep:nth-child(odd) .text-content > .grid-content .timeline-description, body.editor-styles-wrapper section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-image-text > .timeline-items > .timelineStep:nth-child(even) .text-content > .grid-content .timeline-description, body.editor-styles-wrapper section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-text-image > .timeline-items > .timelineStep:nth-child(even) .text-content > .grid-content .timeline-description, body.editor-styles-wrapper section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-image-text > .timeline-items > .timelineStep:nth-child(odd) .text-content > .grid-content .timeline-description {
    order: 2;
  }
}
/* --------------------------------- std_middle_small_width [ms] -------------------------------- */
@media screen and (max-width: 786px) {
  body:not(.editor-styles-wrapper) section.block.nuevo--native.nuevo--block-timeline {
    overflow: unset;
  }
  body:not(.editor-styles-wrapper) section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps {
    /* One column: the image goes below the text, whatever side was chosen. */
  }
  body:not(.editor-styles-wrapper) section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-text-image > .timeline-items > .timelineStep:nth-child(odd) .image-content, body:not(.editor-styles-wrapper) section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-image-text > .timeline-items > .timelineStep:nth-child(even) .image-content, body:not(.editor-styles-wrapper) section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-text-image > .timeline-items > .timelineStep:nth-child(even) .image-content, body:not(.editor-styles-wrapper) section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-image-text > .timeline-items > .timelineStep:nth-child(odd) .image-content {
    order: 2;
  }
  body:not(.editor-styles-wrapper) section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-text-image > .timeline-items > .timelineStep:nth-child(odd) .text-content, body:not(.editor-styles-wrapper) section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-image-text > .timeline-items > .timelineStep:nth-child(even) .text-content, body:not(.editor-styles-wrapper) section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-text-image > .timeline-items > .timelineStep:nth-child(even) .text-content, body:not(.editor-styles-wrapper) section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-image-text > .timeline-items > .timelineStep:nth-child(odd) .text-content {
    order: 1;
  }
}
@media screen and (max-width: 470px) {
  body.editor-styles-wrapper section.block.nuevo--native.nuevo--block-timeline {
    overflow: unset;
  }
  body.editor-styles-wrapper section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps {
    /* One column: the image goes below the text, whatever side was chosen. */
  }
  body.editor-styles-wrapper section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-text-image > .timeline-items > .timelineStep:nth-child(odd) .image-content, body.editor-styles-wrapper section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-image-text > .timeline-items > .timelineStep:nth-child(even) .image-content, body.editor-styles-wrapper section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-text-image > .timeline-items > .timelineStep:nth-child(even) .image-content, body.editor-styles-wrapper section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-image-text > .timeline-items > .timelineStep:nth-child(odd) .image-content {
    order: 2;
  }
  body.editor-styles-wrapper section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-text-image > .timeline-items > .timelineStep:nth-child(odd) .text-content, body.editor-styles-wrapper section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-image-text > .timeline-items > .timelineStep:nth-child(even) .text-content, body.editor-styles-wrapper section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-text-image > .timeline-items > .timelineStep:nth-child(even) .text-content, body.editor-styles-wrapper section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps.start-image-text > .timeline-items > .timelineStep:nth-child(odd) .text-content {
    order: 1;
  }
}
/* ------------------------------------ std_small_width [sm] ------------------------------------ */
@media screen and (max-width: 480px) {
  body:not(.editor-styles-wrapper) section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps > .timeline-items > .timelineStep > .gridWrapper > .grid.text-content > .grid-content {
    flex-flow: column;
    align-items: flex-start;
    gap: 0;
  }
}
@media screen and (max-width: 400px) {
  body.editor-styles-wrapper section.block.nuevo--native.nuevo--block-timeline > .content-container > .timelineSteps > .timeline-items > .timelineStep > .gridWrapper > .grid.text-content > .grid-content {
    flex-flow: column;
    align-items: flex-start;
    gap: 0;
  }
}
/* ---------------------------------------- Abstract -------------------------------------------- */
/* Ein Absatz hinter der Überschrift, aus dem Attribut nuevo_abstract. Er steht im
   Frontend und im Canvas an derselben Stelle im selben Element - deshalb
   genügt eine Regel für beide Welten. */
section.block.nuevo--native.nuevo--block-timeline .content-container > .block_abstract {
  margin-top: 0;
  /*
   * Der Abstand nach unten folgt dem Rasterabstand des Blocks - aber nicht
   * bis auf null.
   *
   * Eine Galerie ohne Abstand zwischen den Bildern ist eine gültige Wahl;
   * ein Vorspann, der die Bilder darunter berührt, ist keine. Der
   * Rasterabstand meint den Abstand der Kacheln zueinander, nicht den des
   * Textes zum Bildblock, und teilte sich hier nur die Variable. Deshalb ein
   * Mindestmaß.
   */
  margin-bottom: max(20px, var(--block_timeline__gridSpace, var(--blocks__gridSpace, 30px)));
  /*
   * Die Ausrichtung folgt der Überschrift: derselbe Wert, dieselbe Klasse.
   * Der Absatz gehört zur Überschrift, und eine linksbündige Überschrift über
   * einem mittigen Vorspann sieht nach Versehen aus.
   *
   * Nur eine ausdrückliche Wahl schreibt die Klasse - siehe
   * nuevo_abstract_paragraph() in src/functions/helpers.php. Ohne sie bleibt
   * es bei der Ausrichtung des Fließtexts aus dem Customizer, denn welche das
   * für die Überschrift ist, weiss hier niemand.
   */
}
section.block.nuevo--native.nuevo--block-timeline .content-container > .block_abstract.align-left {
  text-align: left;
}
section.block.nuevo--native.nuevo--block-timeline .content-container > .block_abstract.align-center {
  text-align: center;
}
section.block.nuevo--native.nuevo--block-timeline .content-container > .block_abstract.align-right {
  text-align: right;
}

/*# sourceMappingURL=style.css.map */