/* Farbe des Textes bei Bildunterschriften in der Übersicht: */
.BildKommentareUebersicht {
  color: white;
  margin-top: 0.1em;
}
.BildKommentareBildFlaeche {
		color: white;
		margin-bottom:0;
}
.BildZeitpunktBildFlaeche { 
	color: white;
	margin-right: auto;
}

/*unterste Zeile mit Datum/Zeit, EXIF-Infos...*/ 
div.BildInfosUnten {
	display: flex;
	gap: 0.8em;
	font-size: 0.8em;
	color: #dadada;
	text-align: left;
}

div.BildFlaechen {
    /* box-shadow: 20px 20px 128px 10px #111111; */
    box-shadow:  0px 0px 50px 20px #111111;
}
div.BildFlaechen {							
  position: fixed;
  z-index: 1;
  visibility: hidden;
  left: 7vw;
  top: 50px;
  max-width: 91vw;
  }
div.BildFlaechen img.Bild {
		max-width: 91vw; /* weil nicht ganz links positioniert */
		height: auto;
		width: auto;
		max-height: 76vh;
	  }
	  
	  
/* die BildflaechenThumbnail: */

div#ThumbsArea img {
    box-shadow: 2px 2px 10px -3px #111111; /* OffsetLink OffsetRunter Blur GroessenZuwachs Farbe*/ 
}
div#ThumbsArea img:hover {
    box-shadow: 2px 2px 10px -3px transparent; /* OffsetLink OffsetRunter Blur GroessenZuwachs Farbe*/ 
}

.BildFlaecheBG { 
	background-color: #666666;
}
.BildFlaecheBG img {
    box-shadow: 2px 2px 10px 0px #000; /* OffsetLink OffsetRunter Blur GroessenZuwachs Farbe*/ 
}

.BildFlaechen div {
	color:white !important;
}

/* neu ab class.bilder7.inc: */
.BildNr {
	color: #D9D9D9;
	}
.BildVon {
	font-size: inherit;
	color: #BEBEBE;
	}
.HeaderZeileFont {
	}
	
/* Ende neu ab class.bilder7.inc */
	


.BildFlaechen	a:visited {  color: #ffda00; text-decoration: none}
.BildFlaechen	a:link {   color: #ffda00; text-decoration: none}
.BildFlaechen	a:hover {
		color: #ffffff;
		border-color: #e1c000;
		border-width: 0px 0px 1px 0px;
		border-style: dotted !important;
		text-decoration: none !important;
		background-color: transparent !important;
	}

	
.content img {
	border-style: solid;
	border-width: 1px;
	border-color:  #eeeeee  #888888 #777777 #e0e0e0;
}

/* Video-Player (BG-Flaeche) */

div#playerContainer object, div#playerContainer video {
    background-color: transparent;
    box-shadow: -4px 6px 28px -4px #111111;
    margin: 5px 0px 12px 0px;
}
/* Ende Video Player */

/* --------------------------------
		Bild-Link: {{{*/

	.BildLink a:link {
		border-width: 0px;
	}

	.BildLink a:hover {
		border-width: 0px;
	}

	.BildLink a:visited {
		border-width: 0px;
	}

	.BildLink a:link img {
		border-color: #ffda00 #b2973a #b2973a #ffda00;
		border-width: 1px 2px 2px 1px;
		border-style: solid;
	}

	.BildLink a:visited img {
		border-color: #ffda00 #a78100 #a78100 #ffda00;
		border-width: 1px 2px 2px 1px;
		border-style: solid;
	}

	.BildLink a:hover img {
		border-color: #a78100 #ffc500 #ffc500 #a78100  ;
		border-width: 2px 1px 1px 2px;
		border-style: solid;
	}

	/* Rahmen bei eingeblendetem Bild: */
	.BildLink .aktiv {
		border-color: red !important;
	}



/* }}} */


/* tabbilder {{{*/
.tabbilder  {
	/* font-size: 9px; /* hier falsch */
	empty-cells: show;
	/* border-color: #ffda00 #b2973a #b2973a #ffda00; */
	/* border-width: 2px 4px 4px 2px;*/ 
	border-width: 0px 0px 0px 0px !important;
	border-style: solid;
	/* padding:100px;   bringt hier nix */
	border-spacing:0px;
	/* border-collapse:collapse;    zieht alle Zellen aufeinander, egal was als border-spacing angegeben ist!  */
	/* margin:10;   macht einen leeren Rahmen um die ganze Tabelle...  */
}

.tabbilder  div {
	/* font-size: 9px; */
	/* Rahmen um jede Zelle */

		border-style: solid;
		border-width: 0px;
		vertical-align: top;
		text-align: left;
		padding:10px;  /* das hier bringt Abstand zum Rand */
}

.tabbilder  th {
	color: #666666;
	/* untere Linie etwas dunkler */
	font-weight: bold !important;
	border-color: rgb(222, 222, 222) rgb(222,222, 222) rgb(152, 152, 152) rgb(222, 222, 222);
}

/* Zelle mit Bild zentrieren: */
.tabbilder div.BildZelle {
	text-align: center;
}
/* }}}*/



@media screen and (max-width:900px) {

	/* wenn breit, dann Menü sticky: 
	...nein, lieber doch nicht...
	*/
	/*.menuoben {
					position: sticky;
					top: 0.2em;
					z-index: 10;  sonst schiebt sich das Plakat drüber 
					}*/

	div.videorechts.w800 {
		float: none;
		width: 100%;
		margin: 0;
	}

	div.BildFlaechen {							
	  left: 0;;
	  top: 0;
	  max-width: 100%;
	  min-width: 100%;
	  }

	div.BildFlaechen img.Bild {
		 max-width: 100%; /* hier ist die Fläche ganz links, daher kann das Bild breiter sein */
		 max-height: 70vh;
	}
}