/* open-sans-regular - latin */
@font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 400;
	src: url('/_fileadmin/fonts/open-sans-v35-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* open-sans-italic - latin */
@font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Open Sans';
	font-style: italic;
	font-weight: 400;
	src: url('/_fileadmin/fonts/open-sans-v35-latin-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* open-sans-600 - latin */
@font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 600;
	src: url('/_fileadmin/fonts/open-sans-v35-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* open-sans-700 - latin */
@font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 700;
	src: url('/_fileadmin/fonts/open-sans-v35-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}




/* source-sans-3-regular - latin */
@font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Source Sans 3';
	font-style: normal;
	font-weight: 400;
	src: url('/_fileadmin/fonts/source-sans-3-v9-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* source-sans-3-700 - latin */
@font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Source Sans 3';
	font-style: normal;
	font-weight: 700;
	src: url('/_fileadmin/fonts/source-sans-3-v9-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* source-sans-3-800 - latin */
@font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Source Sans 3';
	font-style: normal;
	font-weight: 800;
	src: url('/_fileadmin/fonts/source-sans-3-v9-latin-800.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}


h4,.h4,h3,.h3{color:#fff!important}

body {
	position: relative;
}


body {
	/*background: no-repeat url("/_fileadmin/img/bg-konzert.jpg");
	background-size: contain;*/
background: #f20c0c;
background: linear-gradient(351deg,rgba(242, 12, 12, 1) 0%, rgba(173, 29, 29, 1) 50%, rgba(162, 22, 35, 1) 100%);
}


/* Swiper-Container in Bootstrap */
.swiper-container {
	width: 100%;
	overflow: hidden; /* Verhindert das Anzeigen von überflüssigen Bereichen */
}

.swiper-slide {
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 18px;
	background: #f7f7f7;
	border: 1px solid #ddd;
	box-sizing: border-box; /* Verhindert Überlauf und sorgt dafür, dass Slides innerhalb des Containers bleiben */
}


article img {max-width: 100%;
	height: auto;}


/* Transition for smooth effects */
#subNav {
	transition: opacity 0.5s ease, transform 0.5s ease;
}

/* Standard für große Bildschirme */

.navbar-brand{position:absolute}
.navbar-brand img {
	position: relative;
	height: 80px; /* Startgröße */
	transition: height 0.3s ease, top 0.3s ease;
}

/* Verhalten für kleine Bildschirme unter 992px */
@media (max-width: 991px) {
	.navbar-brand{position:relative}
	.navbar-brand img {

		height: 90px;   /* Feste Größe */
		top: 0px;         /* Kein zusätzlicher Abstand */
		transition: none; /* Keine Animationen */
	}
}

.navbar-brand img.shrink {
	transform: scale(0.45); /* Adjust to reduce size proportionally */
}

.hidden {
	opacity: 0;
	transform: translateY(-100%);
}

#mainNav {
	transition: padding 0.3s ease;
}

#mainNav.shrink {
	padding: 5px 0;
}




/* Masonry Grid Referenzen */

.grid {
	margin-left: -15px;
	margin-right: -15px;
}

.grid-item {
	padding: 15px;
	position: relative; /* Wichtiger für das Positionieren der Caption */
}

.grid-item img {
	width: 100%;
	height: auto; /* Passt die Höhe entsprechend der Breite an */
	object-fit: cover; /* Füllt den Container aus, ohne das Verhältnis zu verlieren */
	display: block;
}

.grid-sizer, .grid-item {
	width: 25%; /* Oder eine andere Prozentzahl für verschiedene Layouts */
}


.grid-sizer, .grid-item {
	width: 50%;
}
@media (min-width: 992px) {
	.grid-sizer, .grid-item {
		width: 25%;
	}
}

.grid-item .caption {
	position: absolute;
	top: 15px;
	left: 15px;
	right: 15px;
	bottom: 15px;
	background: rgba(0, 0, 0, 0.5);
	color: white;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	transition: opacity 0.3s;
}
.grid-item:hover .caption {
	opacity: 1;
}
.caption h4 {
	margin-bottom: 0;
	position:absolute;
	top:30px;
	left:30px;

}
.caption h5 {
	margin-bottom: 0;
	position:absolute;
	top:48px;
	left:30px;

}


/* Ende Masonry Grid Referenzen */


.custom-audio {
	width: 100%; /* Breite des Audio-Players */
	height: 50px; /* Höhe des Players (falls relevant für das Styling des Players) */
	background-color: #f5f5f5; /* Hintergrundfarbe ändern */
	border-radius: 10px; /* Abgerundete Ecken */
	border: 1px solid #2C2077; /* Rahmenfarbe und -stärke */
}

/* Beispiel: Ändern des Rahmens, wenn der Player im Fokus ist */
.custom-audio:focus {
	outline: none;
	border-color: #ff6600;
}





.form-select {
	display: block;
	width: 100%;
	height: calc(1.5em + 0.75rem + 2px);
	padding: 5px 0.75rem;
	font-size: 1.125rem;
	font-weight: 400;
	line-height: 1.5;
	color: #ced4da;
	background-color: #fff;
	background-clip: padding-box;
	border: 1px solid #ced4da;
	border-radius: 0;
	box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
	transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}



body {margin-top:96px}

.container-fluid {
	width: 100%;
	margin-right: auto;
	margin-left: auto;
	max-width:2230px;
	padding-left:15px;
	padding-right: 15px;
}
@media only screen and (min-width: 1400px) {

	.container-fluid {
		padding-left: 10rem;
		padding-right: 10rem;
	}
}

.container-fluid .container-fluid {
	padding-left: 0rem;
	padding-right: 0rem;
}


p:last-child {margin-bottom:0!important}
.no-deco{text-decoration:none!important; /* For IE8 and earlier */
}
.no-deco:hover{text-decoration:none!important; opacity: 0.8;
	filter: alpha(opacity=100); /* For IE8 and earlier */
}
/*
.brand-logo,.navbar-brand {-webkit-transition: 0.6s ease;transition: 0.6s ease;background:#fff;}
@media (max-width: 991.98px) { 
.navbar-brand {top: 15px!important;padding-left:0px!important;padding-right:0px!important;transform: scale(1) !important;}
.brand-logo{width:120px!important;padding:2px 5px}
}
@media (min-width: 992px) {
.navbar-brand {top: -35px;}
}
*/
.broder-radius-no{border-radius:0px!Important;}
.navbar-toggler{border-radius:0px;border: #fff solid 2px!important;}
#mainNav {
	-webkit-transition: 0.6s ease;
	transition: 0.6s ease;
	box-shadow: 0px 3px 6px #00000029;
}


.btn.focus, .btn:focus {
	outline: 0;
	box-shadow: 0 0 0 .2rem rgba(251,0,21,.0)!important;
	text-decoration:none!important;
}

.dropdown-menu {

	font-size: .85rem;
	color: #DB3614!important;
	text-align: left;
	list-style: none;
	background-color: #FFF;
	background-clip: padding-box;
	border: 1px solid rgba(20,18,21,.15);
	border-radius: 0rem;
	font-weight:normal;
	padding:10px;
}

.dropdown-item {
	color: #DB3614!important;
}

.dropdown-item:hover {
	background:#2C2077;
}




.btn {text-decoration:none;font-weight:bold}



.btn-circle {
	width: 30px;
	height: 30px;
	padding: 6px 0px;
	/*border-radius: 15px;*/
	text-align: center;
	font-size: 12px;
	line-height: 1.42857;
}

.btn-circle.active {
	background-color:#FD7E14!important;
	border-color:#FD7E14!important;
	color:#FFF!important;
}

.page-item:last-child .page-link {
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
}
.page-item:first-child .page-link {
	margin-left: 0;
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}




.shadow {
	box-shadow: 0 0.1rem 0.5rem rgba(0, 0, 0, 0.3) !important;
}

.bg-C4DAEA{background:#C4DAEA}
/*.bg-yellow{background-color: #FFCA00; background: linear-gradient(225deg, transparent 50%, #FFCA00 0) top right;}*/
.margin-item {
	margin-right: 5px;
}

.bg-body {
	background-color:#2A2A2A
}

.bg-black{background-color:#141215}
.btn-black {
	color: #FFF;
	background-color: #141215;
	border-color: #141215;
}

.bg-grau{background-color:#464648}

.btn-black:hover {
	color: #fff;
	background-color: #000;
	border-color: #000;
}

.text-black{color:#141215!important}

.display-unset{display:unset}

.bg-nummer {
	background: no-repeat url("/_fileadmin/img/bg-weiss.svg");
	background-size: 100%;
	width: 80px;
	height: 65px;
}




.btn.btn-rounded {
	border-radius: 50%;
}
a .btn{border-radius: 15px!important;}
.radius-15-top{border-radius:15px 15px 0 0}
.radius-15-bottom{border-radius:0 0 15px 15px}
.radius-15{border-radius:15px}
.radius-15-img {border-radius:15px!important;}
.border-header{border-bottom: 5px solid;border-image-source: linear-gradient(45deg, rgb(199, 223, 243),rgb(44, 127, 194)); border-image-slice: 1;}




.teaser-caption{margin-top:-50px}
.teaser-caption h3{
	text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
}

.border-line-secondary{border: 4px solid #FD7E14}



.square:before{content: "";display: block;padding-top: 100%; 	/* initial ratio of 1:1*/}
.box-square {padding-bottom: 100%;}

/* no-gutters Class Rules */
.row.no-gutters {
	margin-right: 0;
	margin-left: 0;
}
.row.no-gutters > [class^="col-"],
.row.no-gutters > [class*=" col-"] {
	padding-right: 0;
	padding-left: 0;
}
/* Form */
.custom-select{border-radius:0!important;}
.col-form-label{color:#333333}
/* Form Ende */

/* Tabs */
.nav-pills .nav-link {
	border-radius: 0rem;
	font-weight:bold;
	font-size:calc(18px + (21 - 18) * ((100vw - 360px) / (1920 - 360)))!important
}
.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
	color: #2A2A2A;
	background-color: #FD7E14;

}
.nav-pills .nav-link, .nav-pills .nav-link {
	color: #FFF;
	background-color: #141215;
	transition: 0.4s;
}

.nav-pills .nav-link:hover, .nav-pills .nav-link:hover {
	color: #2A2A2A;
	background-color:  #FD7E14;
}

/* Tab Ende */



/* Overlay News 3col*/




.overlay {
	position: absolute; 
	bottom: 0; 
	background: rgb(251, 0, 21);
	background: rgba(251, 0, 21, 0.5); /* Black see-through */
	color: #f1f1f1; 
	width: 100%;
	height:100%;
	transition: .5s ease;
	opacity:0;
	color: white;
	padding: 20px;
	text-align: center;
}


.hover-overlay:hover .overlay {
	opacity: 1;
}
/* Overlay News Col3 Ende */

/* Flip */

.flipcard.card {
	background-color: transparent;
	border: 0px solid rgba(0, 0, 0, 0.125)!important;
}


.front,
.back {
	padding: 10px;
}

.front{position:relative!important
}
.back{position:absolute!important
}

.card-img {max-width:60%}


/* Flip Ende */

.span-cat{
	position: absolute;
	margin-top: 20px;
	left: 0;
	bottom: -10px;
}

.list-arrow ul,
.list-arrow li {
	padding: 0;
	margin: 0;
	list-style: none;
}

.list-arrow ul {
	margin: 2em 0;
}

.list-arrow li {
	margin: 1em;
	margin-left: 1.5em;
}

.list-arrow li:before {
	content: '\f30b';
	font-family: 'Font Awesome\ 5 Free';
	font-weight: 900;
	float: left;
	margin-left: -1.5em;
	color: #0070BC;
}

.list-arrow a:before {
	content: '\f055';
	font-family: 'Font Awesome\ 5 Free';
	font-weight: 900;
	margin-right: 15px;
	font-size:calc(16px + (18 - 16) * ((100vw - 360px) / (1920 - 360)))!important
}
.list-arrow a{
	text-decoration:none;
	font-weight:bold;
	margin-left:1.5em
}

.arrow-headline{position:absolute;right:50px}


footer svg{margin-top:-90px}

p:last-child {margin-bottom:0!important}
#wrapper-1440 { max-width: 1470px;width: 100%;margin: 0 auto;}
@media (min-width: 768px) { .mt-minus-90{margin-top:-125px}}
.mt-minus-80{margin-top:-50px}
@media (min-width: 768px) {.mt-minus-80{margin-top:-60px}}

.square:before{content: "";display: block;padding-top: 100%; 	/* initial ratio of 1:1*/}
/*.box{max-width:250px; width:100%}*/
.box{background-color: rgba(31, 149, 180, 0.8);	-webkit-transition:all .4s ease-in-out;transition:all .4s ease-in-out}
.box:hover{background-color: rgba(31, 149, 180, 1);}
.catidtitle {margin-top: -26px;text-decoration: none;position: absolute;line-height: 26px;}






.content-box  ul {
	list-style: none;
	padding: 0;
}
.content-box  li {
	padding-left: 1.3em;
	margin-bottom:10px;
	/*font-weight:700;*/
}
.content-box  li:before {
	content: "\f111"; /* FontAwesome Unicode */
	font-family: 'Font Awesome 5 Free';
	display: inline-block;
	margin-left: -1.6em; /* same as padding-left set on li */
	width: 1.6em; /* same as padding-left set on li */
	color: #1E73BE;
}


.bg-secondary h2{color:#fff}
.bg-secondary hr {
	border-top: 3px solid #fff;
}

.bg-secondary h2,.bg-primary h2,.bg-primary .h1,.bg-primary h1{color:#fff!important;}
.bg-secondary hr,.bg-primary hr {
	border-top: 3px solid #fff; text-decoration-style: wavy;
}

.bg-primary a{color:#fff}



footer a {color:#fff!important}


.card {border: 0px solid rgba(0, 0, 0, 0.125);border-radius: 0;}







.navisubContainer {padding: 0 0 30px 0;font-weight:bold}
.navisubContainer ul{list-style-type: none;padding:0;margin:0;}
ul.subnav li span.dir {display:block;padding: 0 20px;margin: 0;color:#FD7E14;background:#fff;text-decoration: none;line-height:40px;text-align:center;font-weight:600;text-transform:uppercase}
ul.subnav ul {margin: 7px 0 0 0;}

ul.subnav li a{
	display: block;
	padding: 0px 10px 0px 10px;
	color: #333333;
	background: #F1F1F1;	
	text-decoration: none;
	line-height:40px;
	font-size:0.875rem;
	border:transparent 0;
}

ul.subnav li{
	margin-bottom:8px;
}

ul.subnav ul li a.current,ul.subnav ul li a:hover{
	text-decoration: none;
	color: #2A2A2A;
	background: #FD7E14;
	border:0px solid #FD7E14
}

ul.subnav ul li a {
	text-decoration: none;
	color: #333333;
	background: #F1F1F1;
	border:0px solid #f0f4f8;
}

ul.subnav ul {
	margin-top:0px
}


* html ul.subnavi li a{
	display:inline-block;
	height:30px;
	cursor:pointer;
}

ul.subnav li a:hover{
	text-decoration:none;color:#FFF!important;background:#FD7E14
}


ul.subnav li a.current,ul.subnav li a:hover{
	text-decoration:none;
	color:#FFF;
	background:#FD7E14;
}

.current .dir {
	text-decoration:none;color:#FFF;background:#333333;
}




#owl-slider.owl-theme .owl-next,
#owl-slider.owl-theme .owl-prev {
	width: 22px;
	margin-top: -20px;
	position: absolute;
	top: 45%;
	color: rgba(255,255,255,0.8);
	font-size:36px;
}

#owl-slider.owl-theme .owl-next:hover,
#owl-slider.owl-theme .owl-prev:hover {
	color: rgba(255,255,255,1);
}

#owl-slider.owl-theme .owl-prev {
	left: 10px;
}
#owl-slider.owl-theme .owl-next {right: 10px;}
.owl-theme .owl-nav {margin-top: 0px;}

#sec_1 .owl-dots{display:none}
.carousel-caption {background: rgba(255, 255, 255, 0.8);bottom:0;left:0;right:0;text-align:left;}
#sec_1 .carousel-caption h3{font-size:1.5rem;color:#fff;text-align:left;line-height:101%;margin:0 auto;letter-spacing:normal!important}

.filter {
	-webkit-filter: brightness(0) invert();
	filter: brightness(0) invert();
}

.form-control {
	display: block;
	width: 100%;
	height: calc(1.5em + 0.75rem + 2px);
	padding: 0.375rem 0.75rem;
	font-size: 1.125rem;
	font-weight: 400;
	line-height: 1.5;
	color: #495057;
	background-color: #fff;
	background-clip: padding-box;
	border: 1px solid #ced4da;
	border-radius: 0;
	box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
	transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}


@media (min-width: 768px) {.fancybox-slide--iframe .fancybox-content {
	width  : 800px;
	height : 600px;
	max-width  : 80%;
	max-height : 80%;
	margin: 0;
	}}

.fancybox-caption__body {
	background: #fff;
	color: #000;
	padding: 15px;
	max-width: 960px;
	margin: 0 auto 50px;
	font-size:1rem
}



.content-box .bg-primary .text-body{
	color:#FFF!important
}

.content-box .bg-secondary .text-body{
	color:#FFF!important
}

.content-box .bg-primary hr ,.content-box .bg-secondary hr {
	border-top: 3px solid rgba(255, 255, 255, 1);
}

hr {
	border-top: 1px solid #1E73BE;;
}





.map-container{
	overflow:hidden;
	padding-bottom:56.25%;
	position:relative;
	height:0;
}
.map-container iframe{
	left:0;
	top:0;
	height:100%;
	width:100%;
	position:absolute;
}


.uc-embedding-wrapper {
	color: #000!important;
}

.modal-content {
	border-radius: 0!important;
}

.modal-header {
	border-bottom: 0px solid #dee2e6!important;
	border-top-left-radius: 0rem!important;
	border-top-right-radius: 0rem!important;
}

.modal-footer {
	border-top: 0px solid #dee2e6!important;
	border-bottom-right-radius: 0rem!important;
	border-bottom-left-radius: 0rem!important;
}

.owl-theme .owl-dots, .owl-theme .owl-nav {

	display: none;
}

.defaultfont{display:none}

.form-control::-webkit-input-placeholder {
	color: #bec6cc!important;
}
.form-control:-moz-placeholder {
	color: #bec6cc!important;
}
.form-control::-moz-placeholder {
	color: #bec6cc!important;
}
.form-control::placeholder {
	color: #bec6cc!important;
}
.form-control:-ms-input-placeholder {
	color: #bec6cc!important;
}


.form-signin {
	width: 100%;
	max-width: 330px;
	padding: 15px;
	margin: 0 auto;
}
.form-signin .checkbox {
	font-weight: 400;
}
.form-signin .form-control {
	position: relative;
	box-sizing: border-box;
	height: auto;
	padding: 10px;
	font-size: 16px;
}
.form-signin .form-control:focus {
	z-index: 2;
}
.form-signin input[type="email"] {
	margin-bottom: -1px;
	border-bottom-right-radius: 0;
	border-bottom-left-radius: 0;
}
.form-signin input[type="password"] {
	margin-bottom: 10px;
	border-top-left-radius: 0;
	border-top-right-radius: 0;
}

textarea.form-control{height:100px}


/* The flip card container - set the width and height to whatever you want. We have added the border property to demonstrate that the flip itself goes out of the box on hover (remove perspective if you don't want the 3D effect */
.flip-card {
	perspective: 1000px; /* Remove this if you don't want the 3D effect */
}

/* This container is needed to position the front and back side */
.flip-card-inner {
	position: relative;
	width: 100%;
	height: 100%;
	text-align: center;
	transition: transform 0.8s;
	transform-style: preserve-3d;
}

/* Do an horizontal flip when you move the mouse over the flip box container */
.flip-card:hover .flip-card-inner {
	transform: rotateY(180deg);
}

/* Position the front and back side */
.flip-card-back {
	position: absolute;
	width: 100%;
	height: 100%;
	-webkit-backface-visibility: hidden; /* Safari */
	backface-visibility: hidden;
	top:0;
	left:0
}

.flip-card-front {
	-webkit-backface-visibility: hidden; /* Safari */
	backface-visibility: hidden;
}


/* Style the front side (fallback if image is missing) */
.flip-card-front {
}

/* Style the back side */
.flip-card-back {
	color: white;
	transform: rotateY(180deg);
}



/* Floating Social Media Bar Style Starts Here */
.social-float nav{
	position: fixed;
	width: 60px;
	margin-top: 25%;
	transition: all 0.3s linear;
	box-shadow: 2px 2px 8px 0px rgba(0,0,0,.4);
	z-index:10000
}

.social-float nav ul {
	margin-top: 0;
	margin-bottom: 0rem;
	padding-left:0px;
}
.social-float nav li{
	height: 45px;
	position:relative;
}
.social-float nav li a{
	color: #fff !important;
	display: block;
	height: 100%;
	width: 100%;
	line-height: 45px;
	padding-left:25%;
	border-bottom: 1px solid rgba(0,0,0,.4);
	transition: all .3s linear;
	text-decoration: none !important;
}
.social-float nav li:nth-child(1) a{
	background: #000;
}
.social-float nav li:nth-child(2) a{
	background: #000;
}
.social-float nav li:nth-child(3) a{
	background: #000;
}
.social-float nav li:nth-child(4) a{
	background: #000;
}

.social-float nav li a i{
	position: absolute;
	top: 14px;
	left: 24px;
	font-size: 15px;
}
.social-float ul li a span{
	display: none;
	font-weight: bold;
	letter-spacing: 1px;
	text-transform: uppercase;
}
.social-float a:hover {
	z-index:1;
	width: 200px;
	border-bottom: 1px solid rgba(0,0,0,.5);
	box-shadow: 0 0 1px 1px rgba(0,0,0,.3);
}
.social-float ul li:hover a span{
	padding-left: 30%;
	display: block;
	font-size: 15px;
}

video {
	max-width: 100%;
	height: auto;
}


/* Floating Social Media Bar Style Ends Here */
/*
.footer-brand img {
filter: brightness(0) invert(1);
}

/*

/* Parallax Hintergrund */
.parallax-background {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh; /* Hintergrund über die ganze Höhe */
	/*background: no-repeat url("/_fileadmin/img/bg.svg");*/
	background-attachment: fixed;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	z-index: -1; /* Damit es hinter dem Content liegt */

}

/* Sicherstellen, dass der Content über dem Parallax-Bild liegt */
.content {
	position: relative;
	z-index: 1;
}


.icon-circle {
	width: 60px;
	height: 60px;
	color: white;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	font-size: 28px;
	text-align: center;
	border:2px solid #FFF;
}

.icon-circle i {
	line-height: 1; /* Entfernt unerwünschte Abstände */
	font-size: 28px;
}
.parallax-section {
	background-image: url("/media/img/auto-ddr.jpg");
	background-size: cover;
	background-position: center;
	background-attachment: fixed;
	height: 500px;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	opacity:0.95;
			text-shadow: 3px 3px #c50000!Important;
}

.flower-logo {
	border-radius: 80px 40px 100px 50px;
	border: 4px solid rgba(255,255,255,1);
	padding: 0px;
	box-shadow: 10px 10px #231429; 
	transition: transform 1s cubic-bezier(0.25, 1, 0.5, 1), filter 1s ease-in-out;
}


.flower-logo:hover {
	transform: rotate(10deg) scale(1.1);
	filter: brightness(1.2);
}

.parallax-video-section {
	position: relative;
	height: 100vh;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
}

.video-bg {
	position: absolute;
	top: 50%;
	left: 50%;
	min-width: 100%;
	min-height: 100%;
	width: auto;
	height: auto;
	transform: translate(-50%, -50%);
	z-index: 1;
	object-fit: cover;
	will-change: transform;
}

.overlay {
	background: rgba(0, 0, 0, 0.4); /* optional für bessere Lesbarkeit */
	z-index: 2;
}

.content {
	z-index: 3;
	padding: 2rem;
}

#sec_1 .container-fluid {padding-left:15px;padding-right:15px}


 .countdown-container {
      display: flex;
      justify-content: center;
      align-items: center;
      font-size: 1rem;
      font-weight: bold;
      color: #CE0883;
      opacity: 0;
      animation: fadeIn 1.5s ease-in forwards; /* Sanftere Fade-In Animation */
    }

    .countdown-item {
      margin: 0 5px;
      padding: 7px;
      text-align: center;
      background-color: #f8f9fa;
      border-radius: 5px;
      box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
      transition: transform 0.5s ease-in-out;
      min-width: 65px;
      min-height: 65px;
      opacity: 0; /* Start mit unsichtbaren Elementen */
      animation: fadeItem 1s ease-in forwards; /* Fade für jedes Item */
    }

    .countdown-item span {
      display: block;
      font-size: 0.70rem;
      color: #CE0883;
    }

    .countdown-item:hover {
      transform: scale(1.1);
    }

    .countdown-label {
      color: #6c757d;
      font-size: 1rem;
    }

@media (min-width: 768px) {

.countdown-container {
      display: flex;
      justify-content: center;
      align-items: center;
      font-size: 3rem;
      font-weight: bold;
      color: #CE0883;
      opacity: 0;
      animation: fadeIn 1.5s ease-in forwards; /* Sanftere Fade-In Animation */
    }

    .countdown-item {
      margin: 0 15px;
      padding: 20px;
      text-align: center;
      background-color: #f8f9fa;
      border-radius: 5px;
      box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
      transition: transform 0.5s ease-in-out;
      min-width: 90px;
      min-height: 90px;
      opacity: 0; /* Start mit unsichtbaren Elementen */
      animation: fadeItem 1s ease-in forwards; /* Fade für jedes Item */
    }

    .countdown-item span {
      display: block;
      font-size: 1.5rem;
      color: #CE0883;
    }

}



    @keyframes fadeIn {
      from {
        opacity: 0;
      }
      to {
        opacity: 1;
      }
    }

    @keyframes fadeItem {
      0% {
        opacity: 0;
      }
      100% {
        opacity: 1;
      }
    }

    /* Verzögert das Einblenden der einzelnen Elemente */
    .countdown-item:nth-child(1) {
      animation-delay: 0.5s; /* Verzögerung für Tage */
    }

    .countdown-item:nth-child(2) {
      animation-delay: 1s; /* Verzögerung für Stunden */
    }

    .countdown-item:nth-child(3) {
      animation-delay: 1.5s; /* Verzögerung für Minuten */
    }

    .countdown-item:nth-child(4) {
      animation-delay: 2s; /* Verzögerung für Sekunden */
    }


.shopify-buy__btn-wrapper {
    display: none!important;
}

.col-detail a{color:#fff}
.accordion-body a {color:#E5006C}
.sp-logo{width:140px;position:absolute;left:120px;top:60px}
@media (min-width: 996px) {
.sp-logo{width:140px;position:relative;left:100px;top:25px}
	}

.sp-logo-fo{width:142px;position:relative;left:100px;top:0px}
@media (min-width: 996px) {
.sp-logo-fo{width:140px;position:relative;left:100px;top:0px}
	}

.retro-wrapper {
  -webkit-mask-image: url('data:image/svg+xml;utf8,
    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
      <defs>
        <pattern id="zigzag" patternUnits="userSpaceOnUse" width="10" height="10">
          <path d="M0,5 L5,0 L10,5 L5,10 Z" fill="white" />
        </pattern>
      </defs>
      <rect width="100%" height="100%" fill="url(#zigzag)" />
    </svg>');
  mask-size: cover;
  display: inline-block;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.4);
}