/* One lesson is one explanation, including its question, answer and sources. */
.lesson > .explanation-unit { margin-bottom: 0; }
.lesson-part { display: flow-root; margin-bottom: 3mm; }
.lesson-part > :last-child { margin-bottom: 0; }
.asks { border-left: 0; }

@media screen and (max-width: 1480px) {
  html { background: #f1f2f3; }
  #pages { width: auto; margin: 0; }
  .page { width: auto; height: auto; padding: 28px 24px 24px 32px; margin: 12px; }
  .page-content { width: auto; height: auto; }
  .page-header { position: static; margin-bottom: 16px; overflow-wrap: anywhere; }
  .page-footer, .footer-left { position: static; margin-top: 18px; }
  .footer-left { display: block; }
  .page-footer { text-align: right; }
  .page-nav-rail { position: static; width: auto; margin: 12px; }
  .page-nav { position: static; max-height: 40vh; padding: 14px; background: white; }
  h1 { font-size: 25px; } h2 { font-size: 22px; } h3 { font-size: 18px; }
  .book-title { font-size: 27px; }
  .explanation-unit::before { left: -15px; width: 3px; }
  table { display: block; overflow-x: auto; }
  .diagram svg { max-width: 100%; height: auto; }
  .metrics { grid-template-columns: 1fr; }
  .flow-grid { overflow-x: auto; }
  .flow-cell { flex: 1 0 100px; }
}