@charset "utf-8";
/* CSS Document */

/* lightboxbefehle */

/*Diese Anweisung gilt für alle Listenelemente ungeordneter Listen der Klasse lightbox: 
Alles, was innerhalb von Listenpunkten der Klasse lightbox steht, 
wird mit diesem Befehl auf 0 gesetzt;*/

ul.lightbox li {    
	overflow: hidden;   	
	position: absolute; 	
	width: 0;    		
	height: 0;   		 
	left: 0;     		
	top: 0;     		
	opacity: 0;		
}


/* Durch die Pseudoklasse "target" (:target) am Listenpunkt li wird definiert, was passiert, wenn 
man auf den Bereich klickt, der von dem Listenpunkt umschlossen wird. Klickt man noch mal darauf, kommt diese Einstellung
nicht mehr zur Anwendung. */

ul.lightbox li:target {
	width: 100%;
	height: 100%;
	opacity: 1;
	background: rgba(0, 0, 0, 0.75);	
	-moz-transition: opacity 1s;    	 
	-o-transition: opacity 1s;    		
	-webkit-transition: opacity 1s;  
}

/* so wird das Bild angezeigt */
ul.lightbox li:target a {
	position: absolute;
	top: 50%; 							
	left: 50%;
	margin: -21% 0 0 -34.5%;
	border: 0px solid #fff;	
	-moz-box-shadow:0 1px 8px #000000;	/* Mozilla Firefox */
	-o-box-shadow:0 1px 8px #000000;	/* Opera */
	-webkit-box-shadow:0 1px 8px #000000; 	/* Google */
	box-shadow:0 1px 8px #000000;
	}

/*schaltet den Listenpunkt aus bei allen Elementen der Klasse "lightboxliste" */
.lightboxliste  {
	list-style:none;
	margin: 0px;
	padding: 0px;
	} 

/* gestaltet einen Button close */
ul.lightbox li a.close{ 
	color:#000;
	border:1px solid #fff;
	text-decoration:none;
	padding:0 3px;
	margin:0;
	background-color:#fff;
	font-family: Arial, Helvetica, sans-serif;
	font-weight:bold;
	box-shadow: 3px 3px 6px 0px #333;
	border-radius: 5px;
	position:absolute;
	top: 50%;
	left: 50%;
	margin: -20% 0 0 -40%;

}

/* ///////////////////////////////////////// */
.zoom_icon{
	height: 30px;
	width: 30px;
	margin: 0px;
	margin-left: 5px;
	margin-top: -55px;
	padding: 0px;
	/*float: left;*/
}

.zoom_icon_s{
	height: 30px;
	width: 30px;
	margin: 0px;
	margin-left: 5px;
	margin-top: -35px;
	padding: 0px;
	/*float: left;*/
}

.pic_u_zoom{
	height: 100%;
	width: 100%;
	margin: 0px;
	padding: 0px;
	/*float: left;*/
	overflow: visible;
}