/* $Id: style.css,v 1.1.2.11 2009/03/13 00:58:30 psynaptic Exp $ */

/* Add your custom CSS here */
.feed-icon {
display:none;
}
.teaser-title {
display:none;
}
.breadcrumb {
display:none;
}

/* Webfont ------------------------------------------------------------ */

/* Syne (SIL Open Font License), self-hosted so no request reaches Google. */
@font-face {
  font-family: 'Syne';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url(fonts/syne-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Syne';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url(fonts/syne-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* Header ------------------------------------------------------------ */

#header {
  padding: 2.5em 0 1.5em;
  margin-bottom: 2.5em;
}

#site-name {
  font-family: 'Syne', Arial, sans-serif;
  font-size: 2.8em;
  font-weight: 600;
  letter-spacing: 0.04em;
  line-height: 1.1;
}

#site-name:hover {
  text-decoration: none;
  color: #6E1831;
}

/* Headings ----------------------------------------------------------- */

.page-title {
  font-size: 1.6em;
  color: #932041;
  letter-spacing: 0.02em;
  margin: 0 0 1.1em;
}

.node .content h2 {
  font-size: 1.15em;
  color: #932041;
  margin-top: 2em;
}

.node .content h2:first-child {
  margin-top: 0;
}

.node .content h3 {
  font-size: 1em;
  font-weight: bold;
  margin-top: 1.6em;
}

/* Content ------------------------------------------------------------ */

#centre {
  line-height: 1.6;
}

.lead {
  font-size: 1.15em;
  line-height: 1.6;
}

.portrait {
  float: left;
  margin: 0.3em 25px 15px 0;
}

/* Sidebar navigation ------------------------------------------------- */

ul.menu {
  font-size: 1em;
  line-height: 1.6;
  margin-left: 0;
}

#left ul.menu li a {
  display: block;
  padding: 0.55em 0;
}

#left ul.menu li a:hover {
  text-decoration: none;
  color: #6E1831;
}

#left ul.menu li a.active {
  font-weight: bold;
}

/* Mobile ------------------------------------------------------------- */

/* Everything below is inside media queries, so the desktop layout at the
   original 910px width is untouched. */

@media (max-width: 940px) {

  #page {
    width: auto;
    padding: 0 18px;
  }

  #header {
    padding: 1.8em 0 1.2em;
    margin-bottom: 1.5em;
  }

  #site-name {
    font-size: 2.1em;
  }

  /* Unstack the two floated columns: menu first, then content. */
  .sidebar,
  #left,
  #centre,
  .sidebar-left #centre,
  .sidebar-right #centre,
  .two-sidebars #centre {
    float: none;
    width: auto;
    margin-left: 0;
    margin-right: 0;
    padding-right: 0;
  }

  #left {
    margin-bottom: 1.8em;
  }

  /* The menu becomes a wrapping row instead of a tall column. */
  #left ul.menu {
    text-align: center;
    padding-left: 0;
  }

  #left ul.menu li {
    display: inline-block;
    margin: 0 0.5em;
  }

  #left ul.menu li a {
    display: inline-block;
    padding: 0.4em 0;
  }

  .page-title {
    font-size: 1.4em;
  }

  /* Images must never exceed the screen width. */
  #centre img {
    max-width: 100%;
    height: auto;
  }

  .portrait {
    float: none;
    display: block;
    margin: 0 0 1.2em;
  }

  .lead {
    font-size: 1.05em;
  }

  /* Keep the lightbox inside the viewport on small screens. */
  #outerImageContainer,
  #imageDataContainer,
  #imageContainer {
    max-width: 100% !important;
  }

  #lightboxImage {
    max-width: 100% !important;
    height: auto !important;
  }
}

@media (max-width: 480px) {

  #page {
    padding: 0 14px;
  }

  #site-name {
    font-size: 1.7em;
    letter-spacing: 0.02em;
  }

  .page-title {
    font-size: 1.25em;
  }
}
