:root {
  --text: #1a1a1a;
  --muted: #666;
  --accent: #d50663;
  --link: #0645ad;
  --row-even: #ddf;
  --row-odd: #eee;
  --bg: #fff;
}

body {
  max-width: 50rem;
  margin: 0 auto;
  padding: 1rem;
  font: 18px/1.5 sans-serif;
  color: var(--text);
  background: var(--bg);
}

h1 { font-size: 30px; line-height: 1.25; }
h2 { font-size: 22px; margin-top: 2rem; }
h3 { font-size: 18px; }

a { color: var(--link); }
img { max-width: 100%; height: auto; }
pre { font-size: 16px; overflow-x: auto; }
code { white-space: pre-wrap; }
hr { border: 0; border-top: 1px solid #ccc; }

.timestamp { font-size: 12px; text-align: right; color: var(--muted); }

/* Timer seit dem 24.02.2022 (ttimer.js) */
.timer, .tt_text { display: flex; justify-content: left; }
.tt_text { font-size: 2rem; color: var(--accent); font-weight: 500; }
.timer__items { display: flex; font-size: 1.5rem; font-weight: 500; }
.timer__item {
  position: relative;
  min-width: 60px;
  margin: 0 10px;
  padding-bottom: 15px;
  text-align: center;
}
.timer__item::before {
  content: attr(data-title);
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  font-size: 14px;
}
.timer__item:not(:last-child)::after { content: ':'; position: absolute; right: -15px; }

.page-width { width: 100%; height: auto; }

table { padding: 10px 0; border-spacing: 5px; }
td, th { vertical-align: top; padding: 2px 6px; text-align: left; }
tr:nth-child(even) { background: var(--row-even); }
tr:nth-child(odd) { background: var(--row-odd); }

.loewe {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-size: 0.75em;
}
.loewe img { max-width: 40%; }

.otherLogos { display: flex; flex-wrap: wrap; gap: 1rem; justify-content: center; }
.otherLogos img { max-height: 80px; width: auto; }

@media (max-width: 600px) {
  body { font-size: 16px; }
  .tt_text { font-size: 1.5rem; }
  table { display: block; overflow-x: auto; }
}