/*** css Styles für die Seiten der Strömungsgrafiken ***/


html{
  font-family:sans-serif;
  height:100%;
}


.body {
  background-color:#ffffff;
  overflow:auto;
  min-height:100vh;
}

.info {
	width:auto;
	text-align:justify;
	padding:5px; 
}

.textklein {
	font-size:14px;
	font-family:Arial;
	font-weight:bold;
}


/** Übersichtsbilder **/

/* alle Bilder in eine flex-box */
.flex-container {
  display: flex;
  flex-direction: column;
  background-color:#ffffff;
  justify-content: center; 
  align-items: center;
  width: auto; 
  padding:5px;
}


/* Drei Boxen innerhalb des Flex-Containers */
/* oben: 2 Bilder (DB und WO), Mitte: 2 Bilder (NS/OS), unten: Elbe */
*.flex-container > div {
	text-align: center;
	padding: 5px; 
	margin: 5px;
}


/** Bilder auf Auswahl.html **/


/* Auswahlliste, Buttons und Bild in einem Container */
.flex-container-auswahl {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap-reverse;
  background-color:#ffffff;
  justify-content: left;  
  align-content:flex-start;
  padding:5px;
}

/* Liste mit Datum und Uhrzeit */
.form_auswahl {
  padding-top:120px;
  text-align: center;
  }

#auswahlliste {
  width:130px;
  padding:5px;
}

/* Die Buttons und das Bild in einem div */
.rechts {
  width:50%;
  text-align: center;
}

/* Die Buttons auf Auswahl.html */ 
.controls {
  margin: auto;
  text-align: center;
  padding: 10px;
}


/* Das Bild */
#image {
  margin: left;
  text-align: center;
  align-items: center; 
  max-width:700px;
  height:80%;
}


/* Radiobuttons und Kalender auf Tagesmittel.html in einem Container*/
.flex-container-tagesmittel {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items:center;
  overflow: auto;
/*  background-color: #f1f1f1; */
}

#form_tagesmittel {
  display: flex;
}


#form_tagesmittel > div {
  line-height:1.5; 
  padding-left: 10px;
  padding-right: 10px;
  margin-left: 10px;
  margin-right: 10px;
  background-color: #f1f1f1;
}