/* Grundgerüst
-----------------------------------------------------------*/

* {
	margin: 0;
	padding: 0;
}

body {
	font-family: "Lucida Grande", Lucida, Verdana, sans-serif;
	color: #222220;
	font-size: 10px;
	background: #fff;
	background-color: #e4f8f9;
	}	

#frame {
	width: 900px;
	margin: 0 auto;
	background: #eaece1 url(../_img/bgLinie.gif);
}

#header {
	height: 200px;
	background: url(../_img/headerBG.gif) no-repeat 0 0;
	position: relative;
}

#mainContent {
	background: #eaece1 url(../_img/mainContentBG.gif) no-repeat 0 0;
}

#contentBoxTrenner {
	border-right: 3px #fff solid;
	border-left: 3px #fff solid;
}

.contentBox {
	float: left;	
	padding: 0 30px;
}

.contentBoxTrenner {
	padding: 0 30px;
	float: left;	
	background: url(../_img/trennerHoch.gif) repeat-y 548px 0;
}

#footer {
	background: #e4f8f9 url(../_img/footerBG.gif) no-repeat 0 0;
	clear: left;
	height: 200px;
	position: relative;
}

#adresse {
	position: absolute;
	left: 30px;
	bottom: 1.5em;
}

.leftContent {
	float: left;
	width: 490px;
	margin: 0 30px 0 0;
}

.rightContent {
	float: left;
	width: 290px;
	padding: 0 0 0 30px;
}

#logoImg {
	float: left;
	padding: 55px 0 0 25px;
}

.titelHoch {
	padding: 35px 0 25px 30px;
}

table {
	background: url(../_img/dots.gif) repeat-x left top;
	padding: 20px 0 4px 0;
}

table {
	width: 840px;
}

.leftContent table {
	width: 490px;
}

td {
	line-height: 1.7em;
	font-size: 1.4em;
	padding: 4px 0;
	/*border-bottom: 1px solid #fff;*/
	background: url(../_img/dots.gif) repeat-x left bottom;
}

td.ar {
	text-align: right;
}

p, li {
	line-height: 1.7em;
	font-size: 1.4em;
	padding: 0 0 0 0;
}

p {
	padding: 0 0 20px 0;
}

.ganzeBreite {
	padding: 0 20px 20px 0;
}

#star20 {
	padding: 0 65px 0 0;
	background: url(../_img/star20.gif) no-repeat right top;
}

h1, h2, h3, h4, h5, h6 {
	font-size: 1.4em;
	line-height: 1.7em;
	text-transform: uppercase;
	clear: left;
	padding: 20px 0 4px 0;
}

.dots {
	background: url(../_img/dots.gif) repeat-x left bottom;
	padding: 20px 0 7px 0;
	margin-bottom: 7px;
	margin-right: 25px;
}

.first {
	padding-top: 0;
}

p a {
	text-decoration: none;
	padding: 0 0 4px 0;
	color: #df6148;
	background: url(../_img/linkBorder.gif) repeat-x left bottom;
}

p a:hover {
	color: #ff7256;
}

#footer p a {
	background: url(../_img/linkBorderBlue.gif) repeat-x left bottom;
}

a img {
	text-decoration: none;
	border: none;
	background: none;
}

.floatImg {
	float: left;
	padding: 5px 10px 5px 0;
}

.colored {
	color: #ff001b;
}

.rightContent ul, .leftContent ul, .contentBox ul {
	padding: 0 0 0 20px;
	margin: 0 0 20px 0;
}

.logo50 {
	width: 120px;
	float: left;
}

.logo50:nth-child(even) {
	width: 120px;
	float: right;
}

.logo50 img {
	display: block;
	margin: 1em 0 2em 0;

}
/* Personen
---------------------------------*/
.person {
	height: 250px;
	width: 380px;
	float: left;
	margin: 0 40px 40px 0;
}

.person img {
	width: 180px;
	float: left;
}

.person .pInfo {
	width: 180px;
	float: right;
}

.person h3 {
	padding: 0;
	text-transform: none;
}

/* Galerie
---------------------------------*/
ul.imgThumb {
	width: 860px;
	padding: 0;
	margin: 0;
}

.leftContent ul.imgThumb {
	width: 430px;
	padding: 0;
	margin: 0;
}

ul.imgThumb li {
	float: left;
	list-style-type: none;
	padding: 0 35px 30px 0;
}

ul.imgThumb li a {
	display: block;
	width: 180px;
}

/* Formular
-------------------------------------------------------------------------*/
form {
	float: left;
	font: 1.2em "Lucida Grande", Lucida, Verdana, sans-serif;
	margin: 1.2em 0;
}

label {
	font-size: 1.2em;
	font-weight: bold;
	/*display: block;*/
	/*clear: left;*/
	margin: 0 0 0 0;
	width: 250px;
	display: block;
	float: left;
}

legend {
	margin: 0 0 10px 0;
	font-weight: bold;
	text-transform: uppercase;
	color: #332f2b;
	background: #eaece1;
}

input, textarea {
	margin: 0 0 10px 0;
	border: 1px solid #999;
	padding: 3px;
	font: 1.0em "Lucida Grande", Lucida, Verdana, sans-serif;
	width: 460px;
}

input[type=number] {
	width: 60px;
}

.btn {
	width: 100px;
	margin: 10px 0 10px 0;
	background: #df6148;
	color: #fff;
	border: 1px solid #984131;
}

input.radioButt {
	width: 15px;
	margin: 0 0 0 10px;
	border: none;
	float: left;
}

textarea {
	height: 180px;
}

form br {
	clear: left;
}

.formAbstand {
	margin-bottom: 1.2em;
}

.error {
	color: #df6148;
	font-weight: bold;
}

.centerBtn {
	padding: 10px; 
}


/* CTA
-------------------------------*/
.cta-freieplaetze-btn {
	position: absolute;
	bottom: 0; /* Abstand von oben - anpassen nach Wunsch */
	right: 3.5%; /* Abstand von rechts - anpassen nach Wunsch */
	z-index: 8;
	width: 120px; /* Breite des runden Buttons anpassen */
	height: 120px;
	display: flex;
	align-items: center;
	justify-content: center;
	
	/* Initialer Zustand für das Einblenden */
	opacity: 0;
	transform: scale(0.8);
	
	/* Kombinierte Animation: Einblenden (Fade-In) und danach dauerhaftes Pulsieren */
	animation: 
		fadeInButton 0.3s ease-out 0.3s forwards, 
		pulseButton 2s ease-in-out 1s infinite;
  
  /* Sanfter Übergang bei Hover */
	transition: transform 0.3s ease, filter 0.3s ease;
}

//.cta-newsletter-btn img {
//	width: 100%;
//	height: 100%;
//	object-fit: contain;
//}

/* Hover-Effekt: Button wird beim Drüberfahren leicht grösser und heller */
.cta-newsletter-btn:hover {
	//transform: scale(1.3) !important; /* Überschreibt die Puls-Animation kurzzeitig */
	//filter: drop-shadow(0 0 15px rgba(255, 255, 255, 0.6));
}

/* Animation 1: Einblenden beim Laden der Seite */
@keyframes fadeInButton {
	to {
		opacity: 1;
		transform: scale(1);
	}
}

/* Animation 2: Leichtes, elegantes Pulsieren */
@keyframes pulseButton {
	0% {
		transform: scale(1);
		//filter: drop-shadow(0 4px 10px rgba(0, 0, 0, 0.15));
	}
	50% {
		transform: scale(1.05);
		//filter: drop-shadow(0 8px 20px rgba(0, 0, 0, 0.25));
 	}
	 100% {
		transform: scale(1);
		//filter: drop-shadow(0 4px 10px rgba(0, 0, 0, 0.15));
	}
}




/* Hauptnavigation
-------------------------------------------------------------------------*/
ul#mainNav {
	list-style: none;
	/*position: relative;*/
	}

ul#mainNav li {
	position: absolute;
	}

ul#mainNav li a {
	display: block;
	text-indent: -99999px;
	height: 30px;
	}

ul#mainNav li a:hover {
	background: none;
	}

#bodyStartseite #btnStartseite { background: none; }
#bodyKontakt #btnKontakt { background: none; }
#bodyAngebot #btnAngebot { background: none; }
#bodyTarife #btnTarife { background: none; }
#bodyUeberuns #btnUeberuns { background: none; }
#bodyTraegerverein #btnTraegerverein { background: none; }
#bodyOeffnungszeiten #btnOeffnungszeiten { background: none; }
#bodyRahmenkonzept #btnRahmenkonzept { background: none; }
#bodyGalerie #btnGalerie { background: none; }
#bodyKonzepte #btnKonzepte { background: none; }
#bodyAktuell #btnAktuell { background: none; }


/* Liste
--------------------*/
#liStartseite { background: url(../_img/btn_startseiteO.gif) no-repeat 0 0; width: 95px; left: 200px; top: 95px;}
#liAngebot { background: url(../_img/btn_angebotO.gif) no-repeat 0 0; width: 88px; left: 240px; top: 135px; }
#liKontakt { background: url(../_img/btn_kontaktO.gif) no-repeat 0 0; width: 85px; left: 505px; top: 65px; }
#liTarife { background: url(../_img/btn_tarifeO.gif) no-repeat 0 0; width: 72px; left: 345px; top: 115px; }
#liUeberuns { background: url(../_img/btn_ueberunsO.gif) no-repeat 0 0; width: 85px; left: 435px; top: 105px; }
#liTraegerverein { background: url(../_img/btn_traegervereinO.gif) no-repeat 0 0; width: 120px; left: 590px; top: 105px; }
#liOeffnungszeiten { background: url(../_img/btn_oeffnungszeitenO.gif) no-repeat 0 0; width: 145px; left: 305px; top: 65px; }
#liRahmenkonzept { background: url(../_img/btn_rahmenkonzeptO.gif) no-repeat 0 0; width: 140px; left: 590px; top: 105px; }
#liGalerie { background: url(../_img/btn_galerieO.gif) no-repeat 0 0; width: 75px; left: 535px; top: 145px; }
#liKonzepte { background: url(../_img/btn_konzepteO.gif) no-repeat 0 0; width: 100px; left: 590px; top: 105px; }
#liAktuell { background: url(../_img/btn_aktuellO.gif) no-repeat 0 0; width: 90px; left: 415px; top: 155px; }


/* Btn
--------------------*/
#btnStartseite { background: url(../_img/btn_startseite.gif) no-repeat 0 0; }
#btnAngebot { background: url(../_img/btn_angebot.gif) no-repeat 0 0; }
#btnKontakt { background: url(../_img/btn_kontakt.gif) no-repeat 0 0; }
#btnTarife { background: url(../_img/btn_tarife.gif) no-repeat 0 0; }
#btnUeberuns { background: url(../_img/btn_ueberuns.gif) no-repeat 0 0; }
#btnTraegerverein { background: url(../_img/btn_traegerverein.gif) no-repeat 0 0; }
#btnOeffnungszeiten { background: url(../_img/btn_oeffnungszeiten.gif) no-repeat 0 0; height: 30px;}
#btnRahmenkonzept { background: url(../_img/btn_rahmenkonzept.gif) no-repeat 0 0; }
#btnGalerie { background: url(../_img/btn_galerie.gif) no-repeat 0 0; }
#btnKonzepte { background: url(../_img/btn_konzepte.gif) no-repeat 0 0; }
#btnAktuell { background: url(../_img/btn_aktuell.gif) no-repeat 0 0; }


/* Clearfix
-----------------------------------------------------------*/
.group:after, .zwischenInfo:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}