/* Page size */

article {
  margin-left: auto;
  margin-right: auto;

  width: 45em;
}

@media screen and (max-width: 50em) {
  article {
    width: 90%;
  }
}

/* Header */

header {
  text-align: center;
  margin-bottom: 3em;
}

header h1 {
  font-size: 4em;
}

header h1.article-smaller {
  font-size: 3em;
}

header h2.article-smaller {
  margin-top: 0.5em;
  margin-bottom: 1em;
  font-size: 1.75em;
  font-style: italic;
}

header img {
  margin: 1em;
  max-width: 80%;
}

/* Code */

code {
  font-family: 'Source Code Pro', monospace;
  font-size: 0.9em;
}

.highlight {
  margin: 1em;
  padding: 0.25em;

  background-color: #f5f3f0;

  overflow-x: auto;
}

/* Table */

table {
  width: 90%;

  margin-top: 2em;
  margin-bottom: 2em;

  margin-left: 5%;
  margin-left: 5%;

  border-radius: 5px;
  background-color: #f2f0ed;
}

table caption {
  padding-bottom: 1em;
  font-style: italic;
}

th, td {
  padding: 1em;
}

/* Image */

img {
  margin-top: 2em;
  margin-bottom: 2em;
  max-width: 100%;
}

p.center-image {
  text-align: center;
}

figure {
  text-align: center;
}

figcaption {
  font-size: 75%;
  font-weight: bold;
  font-style: italic;
  padding-top: -0.25em;
  padding-bottom: 0.25em;
}