/* === Allgemein === */
.underconst{
	height: 100vw;
	width: 100vw;
	background-color: rgba(51,51,51,1);
	position: absolute;
	top: 0px;
}

body{
	position: relative;
	background-color: rgb(10, 10, 10);
	overflow: ;

}

img{-webkit-user-drag: none;}

/* === Schriften === */
body,
p {
    font-family: 'Arial';
	font-weight: 300;
}

h1,
h2,
h3,
h4,
h5,
h6,


/* === Button === */
.btn-round {
	border-radius: 30px;
}

/* === Navbar === */
.navbar {
	position: relative;
	z-index: 1;
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	background-color: rgb(0, 0, 0);
	opacity: .9;
	padding: 0px;
	margin: -10px;
}


/*
@media only screen and (max-width: 575px) {
	.navbar {
	  opacity: 0;
	}
  }
*/



#KLlogo {
/*	transform: translateX(33vh);  */
position: fixed;
right: 5px;
top: 5px;
width:20px;
}

#Logo{
	color: rgba(255, 0, 0, 0.575);



}

#contacts{
	color: rgb(205, 255, 0);
	position: fixed;
	left: 5px;
	font-size: 13px;
	top: 10px;
}


@media only screen and (max-width: 575px) {
	#contacts {
	  font-size: 10px;
	}
  }


#email {
	position: relative;
	left: 20px;
	color: rgb(205, 255, 0);
	font-weight: 700;
}

#phone {
	font-weight: 700;
}

/* ===  Section === */
section{
	padding: 0px 0px;

}

/* === Galerie === */
.galerie {
	position: relative;
	padding-top: 30px;
	position: relative;
}

#galerie img {
	position: relative;
	filter: grayscale(100%);
	-webkit-transition: filter 0.3s;
	-o-transition: filter 0.3s;
	transition: filter 0.3s;	
}

@media only screen and (max-width: 420px) {
	#galerie img {
		filter: grayscale(0%);
	}
  }


#galerie img:hover {
	filter: none;
}

/* === Galerie InfoBox === */

.iconInfo { 
	position: relative;
	visibility: hidden; 
	/*
	bottom: 40px;
	*/
	left:  10px;
	color: rgb(255, 255, 255);
	font-size: 20px;
}
@media only screen and (max-width: 575px) {
	.iconInfo {
	  font-size: 30px;
	}
  }


.info-container {
	position: absolute;
	bottom: 10px;
	left:  10px;
	color: rgb(255, 255, 255);
	font-size: 20px;

}

.endbar {
	text-align: center;
	width: 100%;
    padding: 30px;
	z-index: 100;
}

#Logo-Galerie {
}





/* ----------------------------------------------
 * Generated by Animista on 2021-1-7 12:0:46
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */
 .tracking-in-expand {
	-webkit-animation: tracking-in-expand 0.7s cubic-bezier(0.215, 0.610, 0.355, 1.000) both;
	        animation: tracking-in-expand 0.7s cubic-bezier(0.215, 0.610, 0.355, 1.000) both;
}
/**
 * ----------------------------------------
 * animation tracking-in-expand
 * ----------------------------------------
 */
 @-webkit-keyframes tracking-in-expand {
	0% {
	  letter-spacing: -0.5em;
	  opacity: 0;
	}
	40% {
	  opacity: 0.6;
	}
	100% {
	  opacity: 1;
	}
  }
  @keyframes tracking-in-expand {
	0% {
	  letter-spacing: -0.5em;
	  opacity: 0;
	}
	40% {
	  opacity: 0.6;
	}
	100% {
	  opacity: 1;
	}
  }
  


/* === Navigation ===*/


/* === Carousel ===*/

#BGBlack {
 position: fixed;
 top: 0px;
 background-color: rgb(0, 0, 0);
 height: 300%;
 width: 100%;
}

.card-columns {
	-webkit-column-gap: 0;
	-moz-column-gap: 0;
	-o-column-gap: 0;
	column-gap: 0;
	
}

.card-columns .card{
	margin-bottom: -1px;
	border: 0;
	padding: 0px;
}

.card-img {
 /*border-radius: 0px !important;*/
	border-radius: 0px;
	
}



.carouselContainer {
	position: fixed;
	top: 30px;
	height: 100%;
	width: 100%;
	visibility: hidden;
}



.carousel-inner > .carousel-item > img {
	position: relative;
	height: auto;
	width: auto;
	top: 30px;
	max-width: 80% !important;  
    max-height: 80vh !important;
	padding: 20px;
}

.carousel-inner > .carousel-item > img:hover {
	filter: grayscale(50%);
}



@media only screen and (max-width: 1000px) {
	.carousel-inner > .carousel-item > img {
	  top: -20px;
	}
  }


  #IconFullScreen{
	position: fixed;
	left: 10px;
	top: 50px;
	font-size: 25px;
	background-color: transparent;
	border: none;
	z-index: 2;
	color:  rgb(205, 255, 0);
}
/*
@media only screen and (min-width: 1000px) {
	#IconFullScreen {
	  display: none;
	}
  }
*/


/* change bootstrap button colors */

.carousel-control-prev-icon,
.carousel-control-next-icon {
 
  width: 100px;
  outline: none;
  background-size: 100%, 100%;
  border-radius: 50%;
  border: 0px solid black;
  background-image: none;
}

.carousel-control-next-icon:after
{
	content:url(../img/logos/svg/chevron-right.svg);
}

.carousel-control-prev-icon:after {
  content:url(../img/logos/svg/chevron-left.svg);
  margin-top: 50px; 
  top: 50px;
}

/* end change bootstrap button colors */


#CloseSubPic {
	position: fixed;
	right: 10px;
	top: 50px;
	font-size: 20px;
	background-color: transparent;
	border: none;
	z-index: 2;
	color:  rgb(205, 255, 0);
}

#CloseSubPic:hover {
	filter: brightness(.5);
}

.carousel-indicators {
    bottom: -40px;
}
@media only screen and (max-width: 575px) {
	.carousel-indicators {
		bottom: -5px;
	}
  }

.carousel-indicators li{
	position: relative;
}

#infoTextCarousel{
	position: fixed;
	padding: 30px;
	right: 5%;
	text-align: left;
	font-weight: 50px;
	font-size: 10px;
	line-height: 0px;
	color: rgb(255, 255, 255);
}

h5 {
	color:  rgb(205, 255, 0);
}




/* === Kontakt === */
#kontakt {
	padding: 100px;
}


.input-group-lg>.form-control{
	border-radius: 30px;
}
.input-group-lg .input-group-prepend .input-group-text{
	border-top-left-radius: 30px;
	border-bottom-left-radius: 30px;
}

.email{
	color: white;
	padding: 200px;
}


h1 {
	font-weight: bold;
	font-size: larger;
	letter-spacing:  6px;
	color: rgb(51, 51, 51);
}
h2, h3, h4 {
	color: rgb(255, 255, 255);
}

#emailBtn{
	font-size: 12px;
	color: rgb(73, 73, 73);

}

#social-green{
	margin: 15px;

}

.logos-svg{
	margin: 3px;
}


/* === Footer === */
.bg-black {
	background-color: rgb(15, 15, 15);
}
#footer{
	font-size: 9px;
	line-height: 10%;
	color:rgb(177, 177, 177);
}
a {
	color:rgb(177, 177, 177);
 
}
a:hover 
{
     color:rgb(205, 255, 0); 
     text-decoration:none; 
     cursor:pointer;  
}


/* === Back to top butoon === */
#back-to-top-button{
    display: none;
	position: fixed;
	right: 40px;
	bottom: 40px;
	padding: 5px 13px;
	color:  rgb(205, 255, 0);
	border: 1px;
	border-style: solid;  
	border-radius: 100px;
}

#back-to-top-button:hover {
	background-color:rgb(205, 255, 0);
}


@media only screen and (min-width: 575px) {
	.toTopButton{
	  display: none;
	}
  }


  .DSGVO {
	  background-color: black;
	  body{
	position: relative;
	background-color: rgb(10, 10, 10);
	overflow: ;
}
  }