/* -<< STYLE DES BLOGS >>- */

.wrapper {
  max-inline-size: 1300px;
  margin-inline: auto;
}

.trenner {
  display: flex;
  /* grid-template-columns: 1fr 1fr; */
}

article {
  padding-block-start: 10px; /* Article haben automatisch tonnenweise Padding drauf, was die obere Lücke etwas komisch aussehen hat lassen - deswegen die Änderung */
}

/* {Für Bilder} */
.bilder-rand p {
  margin: 0;
  padding: 5px;
}

.bild-in-text {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 20px;
  margin: 0;
}

.bild-zentriert {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-self: center; /* Sorgt dafür, dass der weiße Hintergrund von Bildern nicht bis zum Ende ihrer zugewiesenen Box gestretched wird, sondern am unteren Ende des Bildes aufhören - der Platz darunter ist zwar immernoch frei, aber immerhin ist dort kein hässlicher weißer Balken */
}

.bild-unterschrift {
  margin-inline-start: 5px;
  text-align: center;
}

/* {Navigation} */
.primary-navigation { /* Dieser Befehl sorgt dafür, dass die nav bar nicht so lang ist wie der wrapper */
  max-inline-size: 850px; /* kinda willkürlich, aber sieht gut so aus :3 */
  margin-inline: auto;

  display: grid;
  grid-template-columns: 0.01fr 1fr 1fr 1fr 1fr 0.01fr;
}

.primary-navigation a {
  text-align: center;
  padding-block-start: 7px;
  padding-block-end: 5px; /* Ich muss das Padding unterschiedlich definieren, da die Font, die ich benutze, nich den kompletten zugeteilten Raum ausfüllt und stattdessen an der oberen Kante der Zeile klebt */
}