:root {
  --body-bg: #fafafa;
  --body-color: #555;
  --link-color: #222;
  --link-color-hover: #000;
}
@media (prefers-color-scheme: dark) {
  :root {
    --body-bg: #212529;
    --body-color: #6c757d;
    --link-color: #dee2e6;
    --link-color-hover: #fff;
  }
}


.dark-mode {
  background-color: #262626;
  color: white;
}

.kantina-mode {
  background-color: #002d6e;
  color: white;
}

body {
  font-family: sans-serif;
  -webkit-user-select: none;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
}

h1,h2,h3,h4,h5,h6 {
    font-family: sans-serif;
}
p {
    font-family: sans-serif;
}

.chart-text {
  font: 16px/1.4em "Montserrat", Arial, sans-serif;
  fill: #000;
  -moz-transform: translateY(0.25em);
  -ms-transform: translateY(0.25em);
  -webkit-transform: translateY(0.25em);
  transform: translateY(0.25em);
}

.chart-number {
  font-size: 0.45em;
  line-height: 1;
  text-anchor: middle;
  -moz-transform: translateY(-0.25em);
  -ms-transform: translateY(-0.25em);
  -webkit-transform: translateY(-0.25em);
  transform: translateY(-0.4em);
}

.chart-label {
  font-size: 0.2em;
  text-transform: uppercase;
  text-anchor: middle;
  -moz-transform: translateY(0.7em);
  -ms-transform: translateY(0.7em);
  -webkit-transform: translateY(0.7em);
  transform: translateY(0.4em);
}

.bg-ackwarn {
	background-color: #FF9999!important;
}

.bg-elegant {
	background-color: #2E2E2E!important;
}

.bg-dark-down {
	background-color: #400000!important;
}
.bg-dark-downack {
	background-color: #400000!important;
}
.bg-dark-warning {
	background-color: #404000!important;
}