body{
	background-color: #282E35;
	color: white;
}


/*------------------------------------------------------------------*/
/*------------------------------ Para ------------------------------*/
/*------------------------------------------------------------------*/

.para::after {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: -1;
	transform: skew(-45deg);
	background: rgb(0,0,0);
}

.para-red::after, .para-red:hover::after {
	background: rgb(226,13,19);
	background: -webkit-linear-gradient(left, rgba(226,13,19,1) 0%, rgba(172,13,18,1) 100%);
	background: -o-linear-gradient(left, rgba(226,13,19,1) 0%, rgba(172,13,18,1) 100%);
	background: linear-gradient(to right, rgba(226,13,19,1) 0%, rgba(172,13,18,1) 100%);
}
.para-orange::after, .para-orange:hover::after {
	background: rgb(255,132,0);
	background: -webkit-linear-gradient(left, rgba(255,132,0,1) 0%, rgba(194,100,0,1) 100%);
	background: -o-linear-gradient(left, rgba(255,132,0,1) 0%, rgba(194,100,0,1) 100%);
	background: linear-gradient(to right, rgba(255,132,0,1) 0%, rgba(194,100,0,1) 100%);
}
.para-yellow::after, .para-yellow:hover::after {
	background: rgb(244,222,0);
	background: -webkit-linear-gradient(left, rgba(244,222,0,1) 0%, rgba(195,178,0,1) 100%);
	background: -o-linear-gradient(left, rgba(244,222,0,1) 0%, rgba(195,178,0,1) 100%);
	background: linear-gradient(to right, rgba(244,222,0,1) 0%, rgba(195,178,0,1) 100%);
}
.para-green::after, .para-green:hover::after {
	background: rgb(8,128,54);
	background: -webkit-linear-gradient(left, rgba(8,128,54,0.15) 0%, rgba(6,96,39,0.15) 100%);
	background: -o-linear-gradient(left, rgba(8,128,54,0.15) 0%, rgba(6,96,39,0.15) 100%);
	background: linear-gradient(to right, rgba(8,128,54,0.15) 0%, rgba(6,96,39,0.15) 100%);
}
.para-blue::after, .para-blue:hover::after {
	background: rgb(48,87,163);
	background: -webkit-linear-gradient(left, rgba(48,87,163,0.15) 0%, rgba(35,61,115,0.15) 100%);
	background: -o-linear-gradient(left, rgba(48,87,163,0.15) 0%, rgba(35,61,115,0.15) 100%);
	background: linear-gradient(to right, rgba(48,87,163,0.15) 0%, rgba(35,61,115,0.15) 100%);
}
.para-purple::after, .para-purple:hover::after {
	background: rgb(147,39,143);
	background: -webkit-linear-gradient(left, rgba(147,39,143,0.15) 0%, rgba(92,22,126,0.15) 100%);
	background: -o-linear-gradient(left, rgba(147,39,143,0.15) 0%, rgba(92,22,126,0.15) 100%);
	background: linear-gradient(to right, rgba(147,39,143,0.15) 0%, rgba(92,22,126,0.15) 100%);
}
.para-white::after {
	background: #FFFFFF;
}
.para-white {
	color: #000;
}
.para-grey::after {
	background: rgb(116,124,134);
	background: -webkit-linear-gradient(left, rgba(116,124,134,1) 0%, rgba(116,124,134,0.5) 100%);
	background: -o-linear-gradient(left, rgba(116,124,134,1) 0%, rgba(116,124,134,0.5) 100%);
	background: linear-gradient(to right, rgba(116,124,134,1) 0%, rgba(116,124,134,0.5) 100%);
}

/*
Original vor Ausblendung bis Fertigstellung
Opacity / Transparenz angepasst


.para-blue::after, .para-blue:hover::after {
	background: rgb(48,87,163);
	background: -webkit-linear-gradient(left, rgba(48,87,163,1) 0%, rgba(35,61,115,1) 100%);
	background: -o-linear-gradient(left, rgba(48,87,163,1) 0%, rgba(35,61,115,1) 100%);
	background: linear-gradient(to right, rgba(48,87,163,1) 0%, rgba(35,61,115,1) 100%);
}
.para-purple::after, .para-purple:hover::after {
	background: rgb(147,39,143);
	background: -webkit-linear-gradient(left, rgba(147,39,143,1) 0%, rgba(92,22,126,1) 100%);
	background: -o-linear-gradient(left, rgba(147,39,143,1) 0%, rgba(92,22,126,1) 100%);
	background: linear-gradient(to right, rgba(147,39,143,1) 0%, rgba(92,22,126,1) 100%);
}
*/

.para-button {
	width: 90%;    
	margin: 10px 5%;
	align-content: center;
	display: block;
	position: relative;
	float: none;
	height: 40px;
	line-height: 40px;
	text-align: center;
	font-size: 1.5em;
	padding: 0px 0px;
	text-decoration: none;
	color: white;
	transition: all .2s ease-in-out;
	z-index: 2;
}
.para-button:hover {
	color: black;
	transform: scale(1.02);
}

.para-head {
	width: 100%;    /*!!!!!!!!!!!!!!!!!!!!!!!!! normal: 10%; für untereinander: flex */
	margin-top: 10px;
	align-content: center;
	display: block;
	position: relative;
	float: none;
	height: 40px;
	margin-left: 0px;
	line-height: 40px;
	text-align: center;
	font-size: 1.5em;
	padding: 0px 0px;
	text-decoration: none;
	color: white;
	transition: all .2s ease-in-out;
	z-index: 2;
}

	
	
/*------------------------------------------------------------------*/
/*------------------------------ Color -----------------------------*/
/*------------------------------------------------------------------*/		
	
	
	
.rainbow-red {
	background: rgb(226,13,19);
	background: -webkit-linear-gradient(45deg, rgba(226,13,19,1) 0%, rgba(172,13,18,1) 100%);
	background: -o-linear-gradient(45deg, rgba(226,13,19,1) 0%, rgba(172,13,18,1) 100%);
	background: linear-gradient(45deg, rgba(226,13,19,1) 0%, rgba(172,13,18,1) 100%);
}
.rainbow-orange {
	background: rgb(255,132,0);
	background: -webkit-linear-gradient(45deg, rgba(255,132,0,1) 0%, rgba(194,100,0,1) 100%);
	background: -o-linear-gradient(45deg, rgba(255,132,0,1) 0%, rgba(194,100,0,1) 100%);
	background: linear-gradient(45deg, rgba(255,132,0,1) 0%, rgba(194,100,0,1) 100%);
}
.rainbow-yellow {
	background: rgb(244,222,0);
	background: -webkit-linear-gradient(45deg, rgba(244,222,0,1) 0%, rgba(195,178,0,1) 100%);
	background: -o-linear-gradient(45deg, rgba(244,222,0,1) 0%, rgba(195,178,0,1) 100%);
	background: linear-gradient(45deg, rgba(244,222,0,1) 0%, rgba(195,178,0,1) 100%);
}
.rainbow-green {
	background: rgb(8,128,54);
	background: -webkit-linear-gradient(45deg, rgba(8,128,54,1) 0%, rgba(6,96,39,1) 100%);
	background: -o-linear-gradient(45deg, rgba(8,128,54,1) 0%, rgba(6,96,39,1) 100%);
	background: linear-gradient(45deg, rgba(8,128,54,1) 0%, rgba(6,96,39,1) 100%);
}
.rainbow-blue {
	background: rgb(48,87,163);
	background: -webkit-linear-gradient(45deg, rgba(48,87,163,1) 0%, rgba(35,61,115,1) 100%);
	background: -o-linear-gradient(45deg, rgba(48,87,163,1) 0%, rgba(35,61,115,1) 100%);
	background: linear-gradient(45deg, rgba(48,87,163,1) 0%, rgba(35,61,115,1) 100%);
}
.rainbow-purple {
	background: rgb(147,39,143);
	background: -webkit-linear-gradient(45deg, rgba(147,39,143,1) 0%, rgba(92,22,126,1) 100%);
	background: -o-linear-gradient(45deg, rgba(147,39,143,1) 0%, rgba(92,22,126,1) 100%);
	background: linear-gradient(45deg, rgba(147,39,143,1) 0%, rgba(92,22,126,1) 100%);
}
.rainbow-white {
	background: rgb(255,255,255);
	background: linear-gradient(45deg, rgba(255,255,255,1) 0%, rgba(188,191,200,1) 100%);
	color: #000 !important;
}
.rainbow-grey {
	background: rgb(42,43,46);
	background: linear-gradient(45deg, rgba(42,43,46,1) 0%, rgba(52,53,57,1) 100%);
}
.rainbow-black {
	background: rgb(10,10,10);
	background: linear-gradient(45deg, rgba(10,10,10,1) 0%, rgba(27,27,29,1) 100%);
}


/*------------------------------------------------------------------*/
/*---------------------------- Headline ----------------------------*/
/*------------------------------------------------------------------*/	



.para-headline {
	display: block;
	position: relative;
	float: left;
	height: 60px;
	line-height: 60px;
	width: 80%;
 

	margin: 15px 10%;

	text-align: center;
}	

	

	
/*------------------------------------------------------------------*/
/*------------------------------ NavBar ----------------------------*/
/*------------------------------------------------------------------*/	
	
	
nav {
	background: rgb(30,30,46);
	background: -webkit-linear-gradient(left, rgba(30,30,46,1) 0%, rgba(36,36,55,1) 100%);
	background: -o-linear-gradient(left, rgba(30,30,46,1) 0%, rgba(36,36,55,1) 100%);
	background: linear-gradient(to right, rgba(30,30,46,1) 0%, rgba(36,36,55,1) 100%);
	padding: 15px;
	width: 100%;
	text-align: center;
	z-index: 0;	
	
	position: relative;
}

nav ul {
	margin: 0px;
	padding-left: 0px;
}

nav li {
	display:inline-block; /* li nebeneinander anzeigen */ /*!!!!!!!!!!!!!!!!!!!!!!!!! normal: inline; für untereinander: display:inline-block */
	list-style-type: none; /* ohne Aufzählungspunkte */
	margin: 0px;
	width: 50%;
}
.nav-brand-li {
	width: 100%;
	/*max-width: 400px;*/
}

nav a, .nav-preview {
	width: flex;    /*!!!!!!!!!!!!!!!!!!!!!!!!! normal: 10%; für untereinander: flex */
	margin-top: 10px;
	align-content: center;
	display: block;
	position: relative;
	float: none;
	height: 40px;
	margin-left: 0px;
	line-height: 40px;
	text-align: center;
	font-size: 1.5em;
	padding: 0px 0px;
	text-decoration: none;
	color: white;
	transition: all .2s ease-in-out;
}

nav a:hover {
	color: black;
	transform: scale(1.1);
}

.nav-active  {
	color: black;
}

.nav-brand {
	width: 70%;
	height: auto;
	line-height: 0px;
	display: block;
	position: relative;
	float: left;
	margin-left: 0;
	margin-right: 0;
	text-align: center;
	padding: 0px 0px;
}
.collapse-icon {
	width: 16%;
	height: auto;
	line-height: 0px;
	display: block;
	position: relative;
	float: left;
	margin-left: 0px;
	margin-top: 15px;
	margin-left: -2%;
	text-align: center;
	padding: 0px 0px;
}

.nav-left-icon {
	width: 17%;
	height: auto;
	line-height: 0px;
	display: block;
	position: relative;
	float: left;
	margin-left: 0px;
	margin-top: 15px;
	margin-right: -2%;
	text-align: center;
	padding: 0px 0px;
}
	
	
@media (min-width: 992px) { 
/*lg*/
	nav li {
		display:inline; /* li nebeneinander anzeigen */ /*!!!!!!!!!!!!!!!!!!!!!!!!! normal: inline; für untereinander: display:inline-block */
		margin: none;
		width: 100%;
		max-width: none;
	}
	
	nav a {
		width: 10%;    /*!!!!!!!!!!!!!!!!!!!!!!!!! normal: 10%; für untereinander: flex */
		float: left;
		margin-left: 10px;
		margin-top: 0px;
	}
	.nav-preview {
		width: 5%;    /*!!!!!!!!!!!!!!!!!!!!!!!!! normal: 5%; für untereinander: flex */
		float: left;
		margin-left: 10px;
		margin-top: 0px;
	}
	.nav-brand {
		width: 260px;
		height: auto;
		line-height: 0px;
		display: block;
		position: relative;
		float: left;
		margin-left: 0px;
		text-align: center;
		padding: 0px 0px;
	}
}
@media (min-width: 1200px) {
  /*xl*/
	nav ul {
		margin-left: 5%;
	}
}
@media (min-width: 1400px) {
  /*xxl*/
	nav ul {
		margin-left: 10%;
	}
}



/*------------------------------------------------------------------*/
/*------------------------- Titledescription -----------------------*/
/*------------------------------------------------------------------*/	
	
	
.titledescription {
	padding-top: 100px;
	padding: 120px 5% 50px;
	margin-bottom: 20px;
	background: rgba(116,124,134,0.5);
	width: 100%;
	text-align: center;
}
.titledescription a {
	color:white;
	text-decoration: none;
	font-weight: 600;
}
.titledescription a:hover {
	font-weight: 900;
}
.titledescription img {
	width: 65%;
}
.titledescription-none {
	/*padding-top: 100px; inzwischen von JS übersteuert*/ 
}

/*------------------------------------------------------------------*/
/*--------------------------- Bottom-Bar ---------------------------*/
/*------------------------------------------------------------------*/	
	
.bottomtile {
	text-align: center;
	padding: 50px 0px;

	text-decoration: none;
	color:white;
	transition: all .2s ease-in-out;
}
	
.bottomtile:hover {
	filter: brightness(115%);
	text-decoration: none;
	color:inherit;
}

.bottomtile-sm {
	padding: 5px 0px;
}










/*
@media screen and (max-width: 1024px) {
    .bottomtile-sm {
        display: none !important;
    }
	.bottomtile-sm-show {
        display: block !important;
    }
}*/


	
	
/*------------------------------------------------------------------*/
/*---------------------------- Listings ----------------------------*/
/*------------------------------------------------------------------*/		

.listing-date {
	margin: 40px 0px 120px 0px;
}

.listing-date-day {
	display: block;
	position: relative;
	float: left;
	height: 60px;
	margin-left: 50px;
	line-height: 60px;
	text-align: center;
	font-size: 1.5em;
}		

.listing-date-else {
	display: block;
	position: relative;
	float: left;
	height: 60px;
	margin: 0px;
	padding: 0px 40px;
	/*width: 50%;*/
	/*font-size: 0.5em;*/
}

.listing-date-else p {
	height: 60px;
	display: table-cell;
	vertical-align: middle;
	text-align: center;
	font-size: .7em;
}

.listing-element {
	float: left;
	position: relative;
	display: block;	
	/*background-color: #1D2023;*/
	background: rgb(39,43,47);
	background: -webkit-linear-gradient(bottom left, rgba(39,43,47,1) 0%, rgba(29,32,35,1) 100%);
	background: -o-linear-gradient(bottom left, rgba(39,43,47,1) 0%, rgba(29,32,35,1) 100%);
	background: linear-gradient(to top right, rgba(39,43,47,1) 0%, rgba(29,32,35,1) 100%);
	border-radius: 3px;
	padding: 15px;
	box-shadow: 4px 4px 4px 2px rgba(0, 0, 0, 0.5);
	transition: all .2s ease-in-out;
	/*transition: all .2s ease-in-out;*/
	text-decoration: none;
	color:white;

}





.listing-element:hover {
	/*background: rgb(60,66,71);*/
	background: -webkit-linear-gradient(bottom left, rgba(60,66,71,1) 0%, rgba(28,33,40,1) 100%);
	background: -o-linear-gradient(bottom left, rgba(60,66,71,1) 0%, rgba(28,33,40,1) 100%);
	background: linear-gradient(to top right, rgba(60,66,71,1) 0%, rgba(28,33,40,1) 100%);
	transform: scale(1.01);
	box-shadow: 4px 4px 12px 8px rgba(0, 0, 0, 0.5);
	text-decoration: none;
	color:inherit;
}

.listing-element p {
	float: left;
}

.listing-element img {
	float: left;
	border-radius: 3px;
}

.listing-text {
	float: left;
	text-align: justify;

}	
.listing-text p {
	display: inline-block;
	margin: 0px;

}	

/*------------------------------------------------------------------*/
/*--------------------------- Pics-Listing -------------------------*/
/*------------------------------------------------------------------*/	


.pics-listing {
}

@media (min-width: 768px) {
	/*ab md und größer*/
	.pics-listing-pic-banner-resize {
		/*feste Position in der rechten unteren Ecke. Aber nur, wenn in zwei Spalten. Notfalls überlagert es Text. Wenn es zu klein und damit nur eine Spalte hat, überlagert es definitiv Text und könnte auch Titel überlagern. Daher soll es bei einer Spalte nicht greifen, sondern erst darüber.*/
		position: absolute;
		bottom: 1em;
		right: 0em;
	}
}

.pics-listing-pic-banner {
	float:left;
	padding-top: 1em;
}

.pics-listing-pic-banner img{
	margin:0px;
	padding:0px;
}


/*------------------------------------------------------------------*/
/*--------------------------- Pics-Gallery -------------------------*/
/*------------------------------------------------------------------*/	


.pics-gallery {
	padding: 0px;
	margin:0px;
	padding-left: 0px;
	padding-right: 0px;
}


.pics-gallery-image {
	padding:0px;
	position: relative;
	text-align: center;
	color: white;
	float:left;
	transition: all .2s ease-in-out;
}
.pics-gallery-image:hover {
	color: inherit;
	transform: scale(1.02);
	z-index: 100;
}

.bottom-left {
	position: absolute;
	bottom: 0.5em;
	left: 0.5em;
	font-size: 1em;
	text-shadow: 0px 0px 2px #000000, 0px 0px 8px #000000;

	text-align: left;
}

.bottom-left p {
	margin: 0px;
	padding: 0px;
	display: inline-block;
}

.pics-gallery-image img {
	padding: 1px;
	border-radius: 5px;
}



/*------------------------------------------------------------------*/
/*-------------------------- Event-Listing -------------------------*/
/*------------------------------------------------------------------*/	


.event-listing {
}

.event-listing img {
	/*box-shadow: 0 0 1em #000000;
	/*transform: rotate(-2deg) scale(1.1);*/
	transition: all .2s ease-in-out;


}

.event-listing img:hover{
	transform:  scale(1.02);
}





/*------------------------------------------------------------------*/
/*--------------------------- Event-Detail -------------------------*/
/*------------------------------------------------------------------*/	

.event-detail {
	float: left;
	position: relative;
	display: block;
	/*background-color: #1D2023;*/
	background: rgb(39,43,47);
	background: -webkit-linear-gradient(bottom left, rgba(60,66,71,1) 0%, rgba(28,33,40,1) 100%);
	background: -o-linear-gradient(bottom left, rgba(60,66,71,1) 0%, rgba(28,33,40,1) 100%);
	background: linear-gradient(to top right, rgba(60,66,71,1) 0%, rgba(28,33,40,1) 100%);
	border-radius: 3px;
	padding: 15px;
	margin-top: 20px;
	box-shadow: 4px 4px 12px 8px rgba(0, 0, 0, 0.5);
	text-decoration: none;
	color:white;

}


.event-detail:hover {
	/*background: rgb(60,66,71);*/
	text-decoration: none;
	color:inherit;
}

.event-detail img {
	float: left;
	border-radius: 3px;
	box-shadow: 0 0 1em #110070;
	/*transform: rotate(-2deg) scale(1.1);*/
	transition: all .2s ease-in-out;
}

.event-detail p {
	float: left;
}




/*------------------------------------------------------------------*/
/*------------------------- Event-Allgemein ------------------------*/
/*------------------------------------------------------------------*/		

.event-time:before {
	float: left;
	padding-left: 5px;
	padding-right: 5px;
	content: "\f017";
	font-family: var(--fa-style-family, "Font Awesome 6 Free");
	font-weight: var(--fa-style, 900); 
}
.event-location:before {
	float: left;
	padding-left: 5px;
	padding-right: 5px;
	content: "\f276";
	font-family: var(--fa-style-family, "Font Awesome 6 Free");
	font-weight: var(--fa-style, 900); 
}
.event-area:before {
	float: left;
	padding-left: 5px;
	padding-right: 5px;
	content: "\f64f";
	font-family: var(--fa-style-family, "Font Awesome 6 Free");
	font-weight: var(--fa-style, 900); 
}
.text-symbol-camera:before {
	float: left;
	padding-left: 5px;
	padding-right: 5px;
	content: "\f030";
	font-family: var(--fa-style-family, "Font Awesome 6 Free");
	font-weight: var(--fa-style, 900); 
}
.text-symbol-images:before {
	float: left;
	padding-left: 5px;
	padding-right: 5px;
	content: "\f302";
	font-family: var(--fa-style-family, "Font Awesome 6 Free");
	font-weight: var(--fa-style, 900); 
}
.text-symbol-download:before {
	float: left;
	padding-left: 5px;
	padding-right: 5px;
	content: "\f019";
	font-family: var(--fa-style-family, "Font Awesome 6 Free");
	font-weight: var(--fa-style, 900); 
}
.text-symbol-eye:before {
	float: left;
	padding-left: 5px;
	padding-right: 5px;
	content: "\f06e";
	font-family: var(--fa-style-family, "Font Awesome 6 Free");
	font-weight: var(--fa-style, 900); 
}
.text-symbol-link:before {
	float: left;
	padding-left: 5px;
	padding-right: 5px;
	content: "\f0c1";
	font-family: var(--fa-style-family, "Font Awesome 6 Free");
	font-weight: var(--fa-style, 900); 
}

/*------------------------------------------------------------------*/
/*------------------------------ Places ----------------------------*/
/*------------------------------------------------------------------*/	

.places-logo {
	display: block;
	margin-left: auto;
	margin-right: auto;
	width: 500px;
	max-width: 80%;
}


.places-sidebar-adress {
	color:white;
	text-decoration: none;
	font-weight: 600;
}

.places-sidebar-adress:before {
	float: left;
	padding-left: 5px;
	padding-right: 15px;
	content: "\f5a0";
	font-family: var(--fa-style-family, "Font Awesome 6 Free");
	font-weight: var(--fa-style, 900); 
	font-size: 2em;
}



.whitelink-normal {
	color:white;
	text-decoration: none;
}
.contact-phone:before {
	float: left;
	padding-left: 5px;
	padding-right: 5px;
	content: "\f095";
	font-family: var(--fa-style-family, "Font Awesome 6 Free");
	font-weight: var(--fa-style, 900); 
}
.contact-mail:before {
	float: left;
	padding-left: 5px;
	padding-right: 5px;
	content: "\f0e0";
	font-family: var(--fa-style-family, "Font Awesome 6 Free");
	font-weight: var(--fa-style, 900); 
}
.contact-web:before {
	float: left;
	padding-left: 5px;
	padding-right: 5px;
	content: "\f0ac";
	font-family: var(--fa-style-family, "Font Awesome 6 Free");
	font-weight: var(--fa-style, 900); 
}















.places-imagestripe {
	width: 100%;
	height: 35vh;
	overflow-x: scroll;
	overflow-y: hidden;
	white-space: nowrap;
}  
.places-imagestripe::-webkit-scrollbar {
	display: none;
}
.places-imagestripe-img {
	height: 100%;
	display: inline-block;
   /* width: 300px;
	margin-right: 10px;
	position: relative;
	transition: all 0.5s ease;
	transform-origin: center center;*/
}
.places-imagestripe-img img {
	/*width: 100%;*/
	height: 100%;
}



/*------------------------------------------------------------------*/
/*-------------------------- Artist-Listing ------------------------*/
/*------------------------------------------------------------------*/	




.artist-listing-pic-banner {
	float:left;
	padding-top: 0em;
}

.artist-listing-pic-banner img{
	margin:0px;
	padding:0px;
}









/*------------------------------------------------------------------*/
/*---------------------------- Sonstiges ---------------------------*/
/*------------------------------------------------------------------*/		


	
.text-frame {
	float: left;
	position: relative;
	display: block;
	/*background-color: #1D2023;*/
	background: rgb(39,43,47);
	background: -webkit-linear-gradient(bottom left, rgba(60,66,71,1) 0%, rgba(28,33,40,1) 100%);
	background: -o-linear-gradient(bottom left, rgba(60,66,71,1) 0%, rgba(28,33,40,1) 100%);
	background: linear-gradient(to top right, rgba(60,66,71,1) 0%, rgba(28,33,40,1) 100%);
	border-radius: 3px;
	padding: 15px;
	margin-top: 20px;
	box-shadow: 4px 4px 12px 8px rgba(0, 0, 0, 0.5);
	text-decoration: none;
	color:white;
}