.kartenbody {
  background: black;
}

img {
  position: absolute;
  top: 20px;
  left: 50%;
  transform: translateX(-50%);

  display: block;      /* Verhindert unerwünschte Abstände */

  /*
   Folgende Eigenschaften ermöglichen es, jedes beliebige Bild zu hinterlegen. Vorausgesetzt ist natürlich weiterhin
   ein geeignetes Seitenverhältnis. Schwarze Schrift ist trotz des schwarzen Hintergrundes jetzt auch möglich, dazu
   ist die convertBlackToWhite in kartenlogin.js da.
   */

  width: 100%;         /* Bild will prinzipiell die volle Breite nutzen */
  max-width: 320px;    /* ...aber stoppt bei 320px (abzüglich padding von 2x10px=300px) */
  height: auto;        /* Das Seitenverhältnis bleibt automatisch erhalten */
  padding: 0 10px;     /* Kleiner Sicherheitsabstand zum Rand auf Terminals (oben/unten 0, links/rechts 10) */
}

#Timelabel {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  //display: block;
  color: white;
  text-align: center;
  font-size: 20pt;
  font-weight: bold;
}

#loading-spinner {
  position: absolute;
  top: 50%;
  color: red;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  visibility: hidden;
}

.spinner-border {
    color: #add8e6;
    border: 8px solid #f3f3f3;
    border-top: 8px solid #add8e6;
    border-right: 8px hidden #add8e6;
    border-bottom: 8px solid #add8e6;
    border-left: 8px hidden #add8e6;
    border-radius: 50%;
    width: 60px;
    height: 60px;
}


.kartenbody input, .kartenbody input:active, .kartenbody input:focus {
  display: none;
  visibility: hidden;
  background-color: black;
  border: none;
  color: black;
  padding: 0;
  margin: 0;
  border-color: black;
  border-width: 0;
}

header, footer, h1 {
  display: none;
}

div.infomeldung {
  text-align: center;
  height: 40px;
  width: 450px;
  font-size: 19pt;
  color:#055160;
  background-color:#cff4fc;
  border-color:#b6effb;
  position: absolute;
  top: 40%;
  left: 50%;
  transform: translateX(-50%);
}

div.warnungsmeldung {
  text-align: center;
  height: 40px;
  width: 450px;
  font-size: 19pt;
  color:#842029;
  background-color:#f8d7da;
  border-color:#f5c2c7;
  position: absolute;
  top: 40%;
  left: 50%;
  transform: translateX(-50%);
}