/* =========================================================================
   Custom overrides — loaded after main.css.
   LessWrong-style serif typography + a wider main content column.
   The top navigation bar is intentionally left in its original font.
   ========================================================================= */

/* ET Book — the serif LessWrong uses for headings */
@font-face {
  font-family: 'ETBook';
  src: url('https://cdn.jsdelivr.net/gh/edwardtufte/et-book/et-book/et-book-roman-line-figures/et-book-roman-line-figures.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

/* --- Fonts: everything except the top navigation -------------------------- */

/* Body / running text: Palatino-style serif (LessWrong body font) */
body {
  font-family: Palatino, "Palatino Linotype", "Palatino LT STD",
               "Book Antiqua", Georgia, serif;
}

/* Headings: ET Book serif (LessWrong heading font) */
h1, h2, h3, h4, h5, h6 {
  font-family: 'ETBook', Palatino, "Palatino Linotype",
               "Book Antiqua", Georgia, serif;
  font-weight: 400;
}

/* Figure captions and table-of-contents follow the serif body
   instead of the condensed sans-serif */
figcaption,
.toc li {
  font-family: inherit;
}

/* The top navigation keeps its original condensed sans-serif */
.navigation-wrapper,
.navigation-wrapper * {
  font-family: 'PT Sans Narrow', sans-serif !important;
}

/* --- Centered main content column ----------------------------------------
   The content column is taken out of the float layout and horizontally
   centered with auto margins, so it always sits in the middle of the page
   regardless of viewport width. The author-bio is positioned absolutely in
   the left margin and no longer pushes the content sideways. */

#main {
  position: relative;
}

@media only screen and (min-width: 37.5em) {
  #main article,
  #index {
    display: block;
    float: none;
    width: 60%;
    margin-left: auto;
    margin-right: auto;
  }
  .article-author-top {
    position: absolute;
    top: 0;
    left: 2%;
    width: 17%;
    margin: 0;
  }
}

@media only screen and (min-width: 86.375em) {
  #main article,
  #index {
    width: 52%;
  }
  .article-author-top {
    left: 6%;
    width: 13%;
  }
  /* Centre the top navigation so it shares the page's centre line with the
     content (its content block is 79.17% wide, hence the 10.417% margin). */
  .site-name {
    margin-left: 10.417%;
  }
}
