/* Besser die Bilder siehe Zettel bearbeiten lassen statt dem hier, dann geht auch der Edge-Wheelzoomfehler weg.
@media all and (-ms-high-contrast:none) {
     .edgedrehung {
        -webkit-transform: rotate(90deg) translateX(20%);  rotate im Uhrzeigersinn 
        transform: rotate(90deg) translateX(20%);
    }  IE10; scheinbar auch IE11 
    
     *::-ms-backdrop, .edgedrehung {
        -webkit-transform: rotate(90deg) translateX(20%);
        transform: rotate(90deg) translateX(20%);
    }  IE11 
}
*/

/*
@supports (-ms-ime-align:auto) { 
  .edgedrehung {
    -webkit-transform: rotate(90deg) translateX(20%); 
    transform: rotate(90deg) translateX(20%);
    }  Edge 12+, mit meinem 84 scheinbar jedenfalls nicht selektiert
}
*/

/*
img {
    image-orientation: from-image;
}
*/

* {
    margin: 0;
    padding: 0;
}
 
#innenwrapper {
    overflow:auto;
} 

html, body {
    height: 97%;
    overflow:auto;
}
 
#seite {
    position: relative;
    min-height: 100%;
    margin: 0 auto;
}

footer {
    position: fixed; /*absolute;*/
    bottom: 0;
    width: 100%;
    background-color: yellow;
    height: 2em;
}

#einloggbereich {
	width: 300px;
	margin-right: 1em;
	text-align: right;
	float: right;
	display: inline-block;
	font-size: 10px !important;
}

#einloggbereich p {
	margin: 0;
	padding: 0;
	line-height: 1em;
}

#inhalt {
	margin: 0 1em;
}

#inhalt h1, #inhalt p, form  {
	margin-top: 1em;
}

body {
	font-family: sans-serif; /* Schrift ohne Serifen */
}

header {
    color: white; /* Schrift weiß */
    background-color: #333;
    background: linear-gradient(to right,  hsla(210,100%,20%,1) 1%,hsla(213,100%,66%,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}

footer {
    color: white; /* Schrift weiß */
    background-color: red;
    background: linear-gradient(to right,  hsla(0,100%,20%,1) 1%,hsla(213,100%,66%,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}

/* header, footer {  folgendes für Kopf und Fuß 
	color: white;  Schrift weiß 
	background-color: #333;  Hintergrund dunkelgrau 
	background-color: ; 
	background: #003366;  Old browsers  FF3.6-15 
	background: -webkit-linear-gradient(left,  hsla(210,100%,20%,1) 1%,hsla(213,100%,66%,1) 100%);  Chrome10-25,Safari5.1-6 
	background: -webkit-linear-gradient(left, hsla(210,100%,20%,1) 1%, hsla(213,100%,66%,1) 100%);
	background: linear-gradient(to right,  hsla(110,100%,20%,1) 1%,hsla(213,100%,66%,1) 100%);  W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ 
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#003366', endColorstr='#519fff',GradientType=1 );  IE6-9
} */

header p {
	line-height: 3.4em; /* Schrifthöhe */
	padding-left: 1em; /* Schriftabstand */
	font-size: 1.5em;
}

footer p {
	line-height: 2em; /* Schrifthöhe */
	padding-left: 1em; /* Schriftabstand */
}

table {
	width: 100%; /* komplette Breite */
	margin-top: 1em; /* Abstand zu oben */
}

td {
	padding: 0.2em; /* Abstand mehr innerhalb der Tabelle */
}

th.headertext {     /* Designklasse in den th's aufzurufen für den Tabellenkopf */
    padding-left: 1.0em;
    padding-right: 1.0em;
    padding-bottom: 0.3em;
    padding-top: 0.3em;
}

th.suchetext {      /* Designklasse in den th's aufzurufen für die Suchzeile */
    padding: 0.6em;
}

th.standort {       /* Designklasse in den th's aufzurufen Standort in Linie, damit einzeilig */
    display: flex;
    align-items: center;
    justify-content: center;
    padding-left: 0.6em;
    padding-right: 0.6em;
    padding-bottom: 0.7em;
    padding-top: 0.7em;
}

input.standort {
    max-width: 1.8em;
}

input.suche {       /* Designklasse im input aufzurufen für den Suchbutton */
    background-color: darkseagreen;
    width: 100%;
}

input.breit {       /* Designklasse in den inputs aufzurufen für die Suchfelder */
    width: 100%;    
}

input.speichern {
    width: 20.0em;
}

input.anzahl {
    width: 5.0em;
}

thead tr {
    color: white; /* Tabellenkopf weiße Schrift */
	background-color: #333; /* dunkler Hintergrund */
}

tbody tr:nth-child(odd) {                       /* abwechselnder Hintergrund in Tabelle */
	background-color: #eee;
}

tbody tr:nth-child(even) {
	background-color: #ccc;
}

tr:hover {
	background-color: limegreen !important; /* Zeilen hellgrün bei Mausberührung */
}

.inlinie {
    display: inline-flex;
}

.seite_aktuell, .seite_nr, .seite_aktuell_nummer, .seite_nr_nummer {
	/*display: inline-block;*/
    margin-left: 0.2em;
    color: white;
	background-color: limegreen;
	width: 1.4em;
	height: 1.4em;
	text-align: center;
	line-height: 1.4em;
	font-size: 1.2em;
	color: white;
}

.seite_nr, .seite_nr_nummer {
	background-color: darkblue;
}

.seite_nr:hover, .seite_nr_nummer:hover {
	background-color: deepskyblue;
	background-color: orange;
}

.seite_aktuell_nummer, .seite_nr_nummer {
    width: 2.0em;
    height: 2.8em;
}

.blatt_nr {
    font-size: 1.2em;
    color: crimson;
}

.blatt_pfeil {
    font-size: 1.1em;
    color: crimson; /* muss auch, da Link */
}

.blatt_pfeil:hover {
    color: crimson;
    color: orange;
}

.flex-container {
  display: inline-flex;
  border: 1px solid black;
  border-radius: 1em;
  padding: .2em 1em;
  background-color: #ddd;
}

.flex-container > div {
  margin: 10px;
  position: relative;
  top: -0.5em;
  font-size: 20px;
}

#gallery {
  display: grid; /* Raster */
  grid-template-columns: repeat(auto-fill, minmax(24em, 1fr)); /* Rasterlemente, die zwischen x em und einem Bruchteil des verfügbaren Platzes breit sind. */
  gap: 1em; /* Abstand zwischen den Rasterelementen, aber nicht außen */
  font-family: Times New Roman;
  font-size: 1em;
  align-items: center;
  justify-items: center;
}

#gallery > figcaption {
  grid-column: 1 / -1; /* erstreckt es sich aber über die gesamte Breite von der ersten bis zur letzten (-1 = von rechts gezählt) Rasterlinie */
}

#bildergalerie {
  display: grid; /* Raster */
  grid-template-columns: repeat(auto-fill, minmax(18em, 1fr)); /* Rasterlemente, die zwischen x em und einem Bruchteil des verfügbaren Platzes breit sind. */
  gap: 1em; /* Abstand zwischen den Rasterelementen, aber nicht außen */
  font-family: Times New Roman;
  font-size: 0.7em;
  align-items: center;
  justify-items: center;
}