/*
	Thumbnail �bersicht & Bilder anzeige

	https://css-tricks.com/text-blocks-over-image/
 
*/
.thumbbox 
{
	display: inline-block;
	position: relative;
	width: 320px; 
	margin-bottom: 20px;
}
.thumbbox img
{
/*	opacity: 0.9;
	-web-kit-transition:  opacity 0.5s ease;
	-moz-transition:  opacity 0.5s ease;
	-o-transition:    opacity 0.5s ease;
	transition:   opacity 0.5s ease;
*/
}
.thumbbox img:hover
{
  	filter: drop-shadow(4px 4px 8px #444);
	-webkit-filter: drop-shadow(4px 4px 8px #444);
	-moz-filter: drop-shadow(4px 4px 8px #444);
	-o-filter: drop-shadow(4px 4px 8px #444);
	-ms-filter: drop-shadow(4px 4px 8px #444);
}
.thumbbox h4  
{
	width: 285px;;
	position: absolute; 
	bottom: 0px; 
	left: 0; 
	color: #ccc;
	background: rgba(0, 0, 0, 0.6);
	font-weight: normal;
	font-size: 14px;
	background: rgb(0, 0, 0); /* fallback color */
	background: rgba(20, 20, 20, 0.8);
/*	background: rgba(118, 184, 55, 0.8); */
	padding: 5px 5px 5px 10px;
}

/*
		Picture Box
*/
figure.picbox
{
	width: 100%;
	display: inline-block;
	position: relative;
	text-align: center;
}
figure.picbox img.portrait
{
	width: 100%;
	max-width: 420px;
	height: auto;
}
figure.picbox img.landscape
{
	width: 100%;
	max-width: 960px;
	height: auto;
}


figure.picbox figcaption
{
/*	display: none;		*//* nur f�r google */
/*	position: absolute;
	bottom: 0px; */
	color: #333;
/*   text-shadow: 0px 0px 15px rgb(119, 119, 119); */
/*    background-color: rgba(0, 0, 0, .8); */
    width: 100%;
    padding: 5px 0px 5px 0px;
    text-align: left;
}
.nav label {
    position: absolute;
    width: 15%;
    height: 100%;
	top: 0px;
	opacity: 0;
    z-index: 9;
    cursor: pointer;
    transition: opacity .5s;

    color: #ccc;
    font-size: 64px;
/*    text-align: center;
    line-height: 800px;
    background-color: rgba(255, 255, 255, .3); */
    background-color: rgba(255, 255, 255, 0);
    text-shadow: 0px 0px 15px rgb(119, 119, 119);
    text-shadow: 0px 0px 15px rgb(50, 50, 50);
 
    display: flex;
    align-items: center;
    justify-content: center;

}
.slide 
{
	border: 1px solid green;
	display: block;
}

/* figure.picbox:hover .nav label { opacity: 0.5; } */

.nav label:hover { opacity: 1; }

.nav .next { right: 0; }

/*
.slide {
    top: 0;
    opacity: 0;
    width: 609px;
    height: 420px;
    display: block;
    position: absolute;

    transform: scale(0);
    transition: all .7s ease-in-out;
}

.slide img {
    width: 100%;
    height: 100%;
}

*/
#picboxthumbslider 
{
	width: 320px;				/* muss fixed sein wegen scroll berechnung */
	background-color: #eee;
}

.picboxthumb.lazy
{
	width: 89px;
	height: 89px;
	background: #e8e8e8;
	display: inline-block;
	vertical-align: top;
}

.picboxthumb 
{
	margin: 0px 0px 1px 1px;
	filter: grayscale(0.6);
	-webkit-filter: grayscale(0.6);
	-moz-filter: grayscale(0.6);
	-o-filter: grayscale(0.6);
	-ms-filter: grayscale(0.6);
}
.picboxthumb:hover
{
  outline: 4px solid #76b837;
  outline-offset: -4px;
  cursor: pointer;
    	filter: grayscale(0);
	-webkit-filter: grayscale(0);
	-moz-filter: grayscale(0);
	-o-filter: grayscale(0);
	-ms-filter: grayscale(0);
}
.select 
{
  outline: 4px solid #76b837;
  outline-offset: -4px;
  	filter: grayscale(0);
	-webkit-filter: grayscale(0);
	-moz-filter: grayscale(0);
	-o-filter: grayscale(0);
	-ms-filter: grayscale(0);
}

#scroll 
{
	padding-left: 20px;
	height: 630px;
	overflow-y: auto;
	font-size: 0px;
}

/*
.scroll 
{
	height: 600px;
	overflow: auto;
}
*/

/*
	Picbox Information Top
*/
/*
#picboxtopL 
{
	display: inline-block;
	width: 70%;
}
#picboxtopR
{
	width: 30%;
	display: inline-block;
	text-align: right;
}
*/

/* Thumbs auf VAInfo seite rechts */

.tbi 
{
	display: inline-block;
	position: relative;
	width: 180px; 
	margin-bottom: 20px;
}
.tbi img
{
/*	opacity: 0.9;
	-web-kit-transition:  opacity 0.5s ease;
	-moz-transition:  opacity 0.5s ease;
	-o-transition:    opacity 0.5s ease;
	transition:   opacity 0.5s ease;
*/
	filter: grayscale(0.6);
	-webkit-filter: grayscale(0.6);
	-moz-filter: grayscale(0.6);
	-o-filter: grayscale(0.6);
	-ms-filter: grayscale(0.6);
}
.tbi img:hover
{
  	filter: drop-shadow(4px 4px 8px #444) grayscale(0);
	-webkit-filter: drop-shadow(4px 4px 8px #444) grayscale(0);
	-moz-filter: drop-shadow(4px 4px 8px #444) grayscale(0);
	-o-filter: drop-shadow(4px 4px 8px #444) grayscale(0);
	-ms-filter: drop-shadow(4px 4px 8px #444) grayscale(0);
	

}
.tbi h4  
{
	width: 165px;;
	position: absolute; 
	bottom: 0px; 
	left: 0; 
	color: #ccc;
	background: rgba(0, 0, 0, 0.6);
	font-weight: normal;
	font-size: 14px;
	background: rgb(0, 0, 0); /* fallback color */
	background: rgba(20, 20, 20, 0.8);
/*	background: rgba(118, 184, 55, 0.8); */
	padding: 5px 5px 5px 10px;
}

/* Galerie-Übersicht: volle Breite */
.gallery-overview.b75 {
	width: 100%;
}