
/* =========================================
   Farben - DarkCyan Variante
   ========================================= */

:root {
  --bg: #005f5f;
  --bg-shadow: #004848;
  --bg-sub: #007070;
  --hover: #009999;
  --focus: #33cccc;
  --bg-trans: rgba(0, 95, 95, 0.95);
}


/* =========================================
   Hero-Bereich
   ========================================= */

.hero {
  background-image: url('../images/buch/bg_buch.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;

  height: 300px;
  height: 45vh;

  width: 100%;
  margin-top: 0;
}


/* =========================================
   Common überschreiben
   ========================================= */

main > header {
  text-align: left;
}


/* =========================================
   Buchvorstellungen
   ========================================= */


/* Einzelne Buchrezension */

article {
  border: 1px solid #bbb;
  border-radius: 6px;

  padding: 1.5rem;

  /* Ersatz für margin-block */
  margin-top: 0;
  margin-bottom: 2rem;
}


/* =========================================
   Titel im oberen Bereich
   ========================================= */

article h2 {
  font-size: 1.5rem;
  line-height: 1.3;

  margin: 0 0 1.25rem;

  padding-bottom: 0.75rem;

  border-bottom: 2px solid #555;
}


/* =========================================
   Buchcover
   ========================================= */

article figure {
  margin: 0 0 1.25rem;
}

article img {
  display: block;

  width: 300px;
  max-width: 100%;
  height: auto;
}


/* =========================================
   Lesbarer Fließtext
   ========================================= */

article p {
  line-height: 1.7;
}


/* =========================================
   Abschluss der Rezension
   ========================================= */

article footer {
  margin-top: 1.5rem;
  padding-top: 0.75rem;

  border-top: 1px solid #ddd;
}

article footer p {
  margin: 0;

  color: #666;
  font-size: 0.9rem;
  line-height: 1.5;
}

article footer time {
  color: inherit;
}
