@charset "UTF-8";

.ui-loader {
	display: none;
}

.galCard {
	cursor: pointer;
}

.galCamera {
	background-image: url( ../images/camera.png);
	background-repeat: no-repeat;
	background-position: 0px 3px;
}

.galCard img {
	max-width: 100%;
	height: auto;
	border-radius: 10px;
}

/* Text für Filter */
.galEvent {
	color: black;
	display: none;
}

.galBilder {
	display: none;
}

#slideContainer {
	display: none;
	background: black;
	/*	opacity: 0.8; */
	width: 100%;
	height: 100%;
	position: fixed;
	z-index: 5000;
	top: 0;
	left: 0;
}

/*  Untertitel Bild  */
#slideText {
	position: absolute;
	color: white;
	text-align: center;
	bottom: 15px;
	width: 100%;
	font-size: 1.8rem;
	text-shadow: 10px 2px 15px black, -10px -2px 15px black;
	z-index: 1300;
}

#slideTitle {
	position: absolute;
	color: white;
	text-align: center;
	top: 30%;
	width: 100%;
	font-size: 5em;
	font-weight: bold;
	text-shadow: 10px 2px 15px black, -10px -2px 15px black;
	z-index: 1300;
}

#slideTitle2 {
	position: absolute;
	color: white;
	text-align: center;
	top: 60%;
	width: 100%;
	font-size: 3em;
	text-shadow: 10px 2px 15px black, -10px -2px 15px black;
	z-index: 1300;
}

#slideArea {
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: center;  
	align-items: center;
	margin: 0 auto;
}

#slideImage {
	max-width: 100%;
	max-height: 100%;
	position: absolute;
	z-index: 1200;
	display: none;
}

/* Next & slidePrevious buttons */
#slidePrev, #slideNext, #slideClose {
	cursor: pointer;
	position: fixed;
	color: white;
	/* font-weight: bold; */
	font-size: 2em;
	z-index: 1300;
	align-items: center;
	display: block;
	text-shadow: 0 0 5px black;
	padding: 20px;
}

/* Position the "next button" to the right */
#slideNext {
	right: 20px;
	font-weight: bold;
	text-shadow: 10px 2px 15px black, -10px -2px 15px black;
}

#slidePrev {
	left: 20px;
	font-weight: bold;
	text-shadow: 10px 2px 15px black, -10px -2px 15px black;
}

#slideClose {
	top: 10px;
	right: 10px;
	font-weight: bold;
	text-shadow: 10px 2px 15px black, -10px -2px 15px black;
}


#slideSpinner {
  border: 16px solid #f3f3f3;
  border-radius: 50%;
  border-top: 16px solid #3498db;
  width: 80px;
  height: 80px;
  -webkit-animation: spin 2s linear infinite; 
  animation: spin 2s linear infinite;
}

@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}


/** --------------------- ist in style.css enthalten ---------------  **/

/*

@media only screen and (min-width: 900px) {
	.galCamera::after {
		content: url( ../images/camera.png);
		position: relative;
		float: right;
	}
}

@media only screen and (max-width: 900px) {
	.galCamera {
		float: right;
	}
	.galCamera::before {
		content: url( ../images/camera.png);
		position: relative;
		float: left;
	}
} */