@media (prefers-color-scheme: dark) {
  body {
    background: hsl(0 0 10);
    color:      hsl(0 0 90);
  }
  a:link, a:visited {
    color:    hsl(180 90 60);
  }
  article section table tr:nth-child(even) {
    background: hsl(0 0 20);
  }
}

@media (prefers-color-scheme: light) {
  body {
    background: hsl(0 0 90);
    color:      hsl(0 0 10);
  }
  a:link, a:visited {
    color:    hsl(220 90 40);
  }
  article section table tr:nth-child(even) {
    background: hsl(0 0 80);
  }
}

body {
  max-width: 80em;
  margin: 0 auto;
}

header {
  border-bottom: 1px solid;
}

article {
  min-height: 1em;
}

footer {
  border-top: 1px solid;
  clear: both;
}

header hgroup, article h1 {
  text-align: center;
  font-variant: small-caps;
}

article h2 {
  text-decoration: underline;
  font-family: sans-serif;
}

header img, footer img {
  max-width: 100%;
}

a:link, a:visited {
  text-decoration: none;
}

article section {
  max-width: 42em;
  float: left;
}

article section header {
  text-align: center;
}

article section table {
  width: 100%;
}

article section ul.pricelist,
footer ul {
  list-style: none;
}

footer ul li {
  text-align: center;
  float: left;
  padding: 0 1em;
  margin: 1em;
  min-width: 25%;
  min-height: 8em;
}

footer ul li p.business_name,
footer ul li p.description {
  text-decoration: underline;
  font-weight: bold;
}

footer ul li p span.description {
  font-weight: bold;
}

footer ul li p span.tax_id,
footer ul li p.email,
footer ul li p.telephone,
footer ul li p span.bank_account {
  font-family: monospace;
}

article section ul.pricelist {
  width: 100%;
}

article section ul.pricelist li p.item {
  float: left;
  margin-bottom: 0;
}

article section ul.pricelist li p.item-info {
  clear: both;
  float: left;
  margin-top: 0;
  font-style: italic;
  padding-left: 2em;
}

article section ul.pricelist li p.price {
  font-weight: bold;
  float: right;
  padding: 0 1em;
  margin-bottom: 0;
  font-family: monospace;
}

article section ul.pricelist li,
article section p#pricelist-additional-info {
  clear: both;
  padding-top: 1em;
}

article section p#pricelist-additional-info,
article section ul.payment-terms-of-service li {
  margin-bottom: 1em;
  max-width: 32em;
  text-indent: 1em;
}

article aside {
  float: right;
  max-width: 23em;
  border-left: 1px dotted;
  margin: 1em;
  padding: 1em;
}

article ul {
  list-style-type: square;
}