/*-------------------------------------------------------------------------------*/
/*Colors-------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------*/
.content-box h1, .content-box h2, .content-box h3 {color:#e5a12c;}
h1, h2, h3 {color:#e5a12c;}
.content-box, section  { background-color:#FFF;}
.clRot{ color:#FF0000;}

/*-------------------------------------------------------------------------------*/
/*Fonts--------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------*/
h1{font-weight: 600;font-size: 36px;}
h2{font-weight: 600;font-size: 24px;}
h3{font-weight: 400;font-size: 20px;line-height: 26px;}
p{font-weight: 400;font-size: 16px;line-height: 19px;}/*Für Texte, die keine Überschriften sind*/

/*-------------------------------------------------------------------------------*/
/*Positios-----------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------*/
.content-box h1{ margin-bottom:60px;}
.content-box h2{ margin-top:50px;}
.content-box h3{ margin-top:30px;}

.content-box { /*Aus neu*/
position:relative;
width:100%;
max-width:1400px;
margin-left:auto;
margin-right:auto; 
box-sizing: border-box;
overflow: hidden;
}

.content-box, section {		
height: auto;
min-height: 350px;
padding-top: 30px;
padding-bottom: 40px;
/*padding-left: calc(100% / 5);*//*id=12*/
/*padding-right:calc(100% / 5);*//*id=12*/
padding-left: 120px;/*id=12*/
padding-right: 120px;/*id=12*/
}
/*id=12*/
/*
#blog{	
padding-left: 200px;
padding-right:200px;
}
*/

@media only screen and (max-width: 800px) {/*mobil*/
	.content-box, section{		
	padding-left: 10px;
	padding-right:10px;
	}
}

/*-----------------------------------------------------------------------------------------------------------*/
/*Blog-------------------------------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------------------*/
#blog-wrapper{
display: flex;
flex-direction: row;
flex-wrap: wrap;
gap:10px;
justify-content: center;
align-items: center;
align-content: center;
}




/*Seite Menü-------------------------------------------------------------------------------------------------*/
.blogLnk{
display: inline-block;
position: relative;
width: 250px;
height: 250px;
margin: 0px;
margin-top: 0px;
margin-left: 0px;
margin-top: 1px;
margin-left: 1px;
color:#333333;
}

.blogText { 
position: absolute;	
order:2;
overflow:hidden;
width: 100%; 
padding-top:40%;
top:0px;
padding-left:5px;	
word-wrap: break-word;
line-height:100%; 
text-align:center;
font-weight:600;
font-size:20px;
color:#666; 
}

.blogImg { 
position: absolute; 
opacity: 1; 
transition: opacity 0.5s;     
}

.blogImg:hover {
opacity: 0.25; 
transition: opacity 0.5s;
}

/*Seite Thema------------------------------------------------------------------------------------------------*/
.blogH1Flex{
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-around;
align-items: flex-start;
align-content: center;
padding-top:30px;	 

}

/*.blogH1Flex div{ width:calc(100% - 450px);}*/
.blogH1Flex div{ width:400px;}
.blogH1Flex img{ margin-bottom:30px; }





/*-----------------------------------------------------------------------------------------------------------*/
/*FAQ--------------------------------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------------------*/
@media only screen and (min-width: 800px) {/*Desk*/
	.accordion_flex{
	display: flex;	
	flex-wrap: nowrap;
	gap:20px;/*id=12 eingefügt*/
	justify-content: space-between;
	align-items: start;
	align-content: stretch;
	width:inherit;
	}
	
	.accordion_flex div{max-width:400px}/*id=12 vorher ohne max*/
}


@media only screen and (max-width: 800px) {/*mobil*/
	.accordion_flex{display:block;}
	.accordion_flex div{width:inherit}
}


.accordion__item {
	margin: 10px auto;
}
.accordion__item .accordion__title {
	position: relative;
	display: block;
	padding: 8px 13px 8px 13px;
	margin-bottom: 2px;
	color: #202020;
	font-size:16px;
	text-decoration: none;
	background-color: #eaeaea;
	border-radius: 3px;
	/*-webkit-transition: background-color 0.2s;*/
	transition: background-color 0.2s;
  cursor: pointer;
}
.accordion__item .accordion__title:hover {
	background-color: #e5e4e4;
	transition: all 0.4s ease-out;
}
.accordion__item .accordion-active {
	background-color: #e5e4e4;
}

.accordion__item .accordion__content {
	padding: 20px 13px 20px 13px;
	margin-bottom:40px;
	font-size: 14px;
	font-style:italic;
	display: none;
	background-color: #f3f3f3;
}


/*map-----------------------------------------------------------------------------------------------------*/
#tipps form { text-align:center; margin-bottom:20px; }
#contMap{
position:relative;
height:auto;
max-width:579px;
width:100%;
margin-left:auto; 
margin-right:auto;
background-color:#999; 
}

#contMap img{
position:relative;
width:100%;
height:auto;
}

.point1{
position:absolute;
width:8px;
height:8px;
border-radius: 4px;
}

.box{
/*margin-left:7px; */
z-index:100; 
position:absolute; 
background-color:transparent; 
color:#FFFFFF; 
border:none; 
cursor:pointer; 
font-size:13px;
padding:6px;
}

/* Tooltip nur für Desktop (ab 1047px) */
@media screen and (min-width: 1047px) {
	#jqueryTooltip {
	position:absolute; 
	display:none; 
	min-width:150px;
	max-width:400px;
	background:#fff;
	color:#666;
	border:1px solid #ccc;	
	padding:10px 20px 10px 20px;
	border-radius:5px;
	box-shadow: -2px -2px 4px silver;
	z-index:100;
	}
}




/*---------------------------------------------------------------------------------*/
/*LandingpagesGutschein------------------------------------------------------------*/
/*---------------------------------------------------------------------------------*/
#gutschein-lp .clStatJq {color: #f9b030;}
#gutschein-lp input, #gutschein-lp select, #podcast-lp input, #podcast-lp textarea{
  background-color: #FFF;
  color: #333;
  border-color: #f9b030; font-size:16px;
}

#gutschein-lp .btnSubm , section#danke .btnSubm, #podcast-lp .btnSubm {
	margin-top: 20px;
	margin-bottom: 10px;
	padding:4px 12px 4px 12px;
	border-radius: 7px;
	border-color: #0044cc;
	background-color: #0044cc;
	color: #FFFFFF;
	font-size:18px;
}

#gutschein-lp .clStatJq, #podcast-lp .clStatJq {
width: 20px;
text-align: right;
font-weight: bold;
font-size: 20px;
}

#gutschein-lp .guInp input, #gutschein-lp .guInp select, #podcast-lp .guInp input, #podcast-lp .guInp textarea{
width:100%; 
padding-left:8px;
padding-bottom:8px;
padding-top:8px;
padding-right:8px;
box-sizing: border-box;
overflow: hidden;

border-width: 1px;
border-style: solid;
}

#gutschein-lp .guForm{
display: flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: space-between;
align-content: stretch;
align-items: flex-start;
margin-top:20px;
}

.guInp{
display: flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: flex-start;
gap:8px;
align-items: center;
align-content: center;
margin-bottom:10px; 
}

#gutschein-lp #betraege { margin-top:40px; margin-bottom:40px;}
#gutschein-lp #betraege div {padding-bottom: 4px;}
#gutschein-lp #betraege div:nth-child(2n+1) {float: left;  width: 150px;}
#gutschein-lp #betraege div:nth-child(2n) {width: 120px;  margin-left: 150px;  text-align: right;}
#gutschein-lp #lbl_ges, #gutschein-lp #val_ges {border-top: 2px solid #CCC;  border-bottom: 2px solid #CCCF;}
.guBest , .guVers{width:45%;}
.clDatenschutz{margin-bottom:30px}
section#gutschein-lp .clStatJq, #podcast-lp .clStatJq {color:#f9b030;}

@media only screen and (min-width: 800px) {/*Desk*/
  .titleMob {display: none;}
  #gutschein-lp input#CodeRa, #gutschein-lp  #FonGu, #podcast-lp #Company, #podcast-lp #Fon, #podcast-lp #Ort {width: calc(100% - 28px);}
}

@media only screen and (max-width: 800px) {	
	#gutschein-lp .guForm {  flex-direction: column;  flex-wrap: nowrap;  gap:50px; }	
	.guBest, .guVers {width: 100%;}	
	.guInp{flex-wrap: wrap; max-width:400px;  }	
	#gutschein-lp .guInp input, #gutschein-lp .guInp select{ width:70%  }
	#gutschein-lp .guInp span{ width:10%}
	#gutschein-lp .guInp .titleMob { width: 100%; /* Nimmt die volle Breite ein */	}	
	
	.titleMob {
	color: #666;
	height: auto;
	width: inherit;
	font-size: 12px;
	padding: 0px 0px 20px 0px;	
	}
}

/*---------------------------------------------------------------------------------*/
/*Songauswahl----------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------*/
.songs th{ text-align:left}

/*---------------------------------------------------------------------------------*/
/*Podcast--------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------*/
#podcast-lp .guInp{ max-width:400px;}
#podcast-lp textarea{ max-width:370px;}
#podcast-lp .btnSubm{ margin-bottom:50px; }
/*#podcast-lp #kont > div{ margin-bottom:20px}*/

#pc-frame1 img{
max-width: 400px;
height:auto;
} 

#pc-frame1{
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: space-between;
	gap:50px;
	align-items: center;
	align-content: center;
	max-width:100%;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:120px;
}

#pc-frame2{
	max-width:800px;
	margin-left:auto;
	margin-right:auto;
}


@media only screen and (max-width:980px) {/*mobil*/
	#pc-frame1{	display: block;}
	#pc-frame1 img{width:100%;} 
}


/*---------------------------------------------------------------------------------*/
/*Gutschein------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------*/
#gutschein-lp img{
position:relative;
width:100%;
max-width:640px;
height:auto;
}

#lpGuliSer, #lpGuliAnl {padding-left:16px;}
#lpGuliSer li, #lpGuliAnl li {padding-left:10px; list-style: square}
@media only screen and (max-width:980px) {/*mobil*/
	#lpGuliSer li, #lpGuliAnl li {padding-bottom:10px;}
}
/*tipps-------------------------------------------------------------------*/

/*---------------------------------------------------------------------------------*/
/*Tipps----------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------*/
section#tipps{
max-width:1400px;
}

section#tipps .tippsTxt{
margin-top:0px;
margin-bottom:0px;
}

section#tipps .tippFlex{
display:flex;
justify-content:space-around;
gap:30px;
align-items: center;
flex-wrap:wrap;
width:inherit;
margin-top:100px;
}

section#tipps .tippFlex div div{
max-width:500px;
}

section#tipps .tippFlex  .itmImg{
width:250px;
display: flex;
flex-direction: column;
flex-wrap: nowrap;
gap:20px;
justify-content: flex-start;
align-items: flex-end;
}

section#tipps .tippFlex  img{
max-width:350px;
height:auto;
}

section#tipps .tippFlex:nth-child(4) div:nth-child(1), section#tipps .tippFlex:nth-child(6) div:nth-child(1){
order:2;
}

section#tipps .tippFlex:nth-child(4) div:nth-child(2), section#tipps .tippFlex:nth-child(6) div:nth-child(2){
order:1;
}

@media only screen and (max-width:980px) {/*mobil*/
	section#tipps .tippFlex{
		flex-direction:column;
		gap:20px;
		justify-content:start;
		margin-top:80px;
	}
	
	section#tipps .tippFlex:nth-child(4) div:nth-child(1), section#tipps .tippFlex:nth-child(6) div:nth-child(1){
		order:1;
	}
}