/*------------------------AKKORDEON------------------------*/
.accordion-content img:hover{transform:scale(1.05)}
.accordion-content img {
width: 30%;
  padding: 0;
  border-radius: 14px;
  margin: 10px 10px 10px 0;
	transition:0.2s ease;
}

.akkordeon-wrapper-outer.text-block1.text-block {
  margin-top: 0;
}

.accordion-item:nth-of-type(1) .accordion-header {background-image:url('/wp-content/uploads/images/akk-gruen-1.png'); background-size: 100% 100%;}
.accordion-item:nth-of-type(2) .accordion-header {background-image:url('/wp-content/uploads/images/akk-gruen-2.png'); background-size: 100% 100%;}
.accordion-item:nth-of-type(3) .accordion-header {background-image:url('/wp-content/uploads/images/akk-gruen-3.png'); background-size: 100% 100%;}
.accordion-item:nth-of-type(4) .accordion-header {background-image:url('/wp-content/uploads/images/akk-gruen-4.png'); background-size: 100% 100%;}
.accordion-item:nth-of-type(5) .accordion-header {background-image:url('/wp-content/uploads/images/akk-gruen-5.png'); background-size: 100% 100%;}

.accordion-content ul {
margin: 1.4em 0 1.3em 4%;
  font-size: 22px;
	 color: var(--wws-dunkelgruen);
	list-style: disclosure-closed;
}

.accordion-content ul a {
	width: fit-content;
 display:inline;
  font-size: 22px;
  margin:0;
  font-weight: bold;

  color: var(--wws-dunkelgruen);
}

#primary li a:first-of-type {
  display:block;
}


.accordion-content ul li {
  margin: 12px 0;
}


.accordion-header.open::after {
transform: rotate(180deg);
}

.accordion-header::after {
	transition:0.2s ease;
content: '';
  padding: 0px 19px;
  background-color: var(--wws-dunkelgruen);
  position: relative;
  color: white;
  top: -2px;
  pointer-events: none;
  background-image: url('/wp-content/uploads/images/akk-arrow-down.png');
  background-size: 100% 100%;
  left: 37px;
  height: 25px;
  display: inline-block;
}



.accordion {
    width:100%;
    margin: auto;
}

.accordion-item {
  display: inline-block;
  margin-bottom: 50px;
width: 100%;
}

.accordion-header {
width: initial;
 background-color:white;
  border: none;
    border-top-color: currentcolor;
    border-right-color: currentcolor;
    border-bottom-color: currentcolor;
    border-left-color: currentcolor;
padding: 51px 71px 31px 162px;
  text-align: left;
  cursor: pointer;
  transition: background 0.3s;
  color: var(--wws-hellgruen);
  font-family: Misrow;
  font-size: 37px;
  letter-spacing: 0.056em;
  line-height: 112%;
  transition: 0.2s ease;
  background-size: 82px;
  background-repeat: no-repeat;
  background-position: 0px 5px;
}

.accordion-header:hover {
    transform:scale(1.05);
	transform-origin: center center;
}

.accordion-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s ease-out;
	width: 100%;
}



/*------------------------INFO-BOXEN------------------------*/

.acf-gruen-boxen-wrapper {
display: flex;
  gap: 4%;
  margin: 2rem 0;
  align-items: stretch;
  padding: 20px 6%
}

.acf-gruen-box {
  flex: 1;
  padding: 1rem;
 position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
	padding: 2%;
	 transition: transform 0.2s ease;
	aspect-ratio: 46/30;
}

.acf-gruen-box h4 {
  font-family: 'Misrow', sans-serif;
  letter-spacing: 0.056em;
  font-weight: normal;
  font-size: 1.9vw;
  line-height: 103%;
  transition: transform 0.2s ease;
  padding: 17px 0px 17px 26px;
  margin: 0;
}

.acf-gruen-boxen-wrapper a {
  text-decoration: none;
  color: white;
  margin-right: 2px;
}

.acf-gruen-box p {
  font-size: 1.3vw;
  font-weight: 600;
  color: var(--wws-dunkelgruen);
  padding: 0px 8%;
  line-height: 121%;
  margin: -3% 0 6% 0;
}

.acf-gruen-boxen-wrapper strong {
  font-family: Misrow;
  font-weight: normal;
 padding: 0px 6px;
  font-size: 1.5vw;
  letter-spacing: 1.7px;
	background-color:white;
}


.box1 {	background-image:url('/wp-content/uploads/images/gruen-box1.png');background-size:100% 100%;transition: 0.3s ease;}
.box2 {	background-image:url('/wp-content/uploads/images/gruen-box2.png');background-size:100% 100%;transition: 0.3s ease;}

.box1 h4 {
  background-image: url('/wp-content/uploads/images/gruen-box-h4-1.png');
  background-size: 100% 100%;
  color: var(--wws-violett);
  width: 49%;
  position: relative;
  top: 27%;
  left: 4%;
}

.box2 h4 {
  background-image: url('/wp-content/uploads/images/gruen-box-h4-2.png');
  background-size: 100% 100%;
  color: white;
  width: 39%;
  position: relative;
  top: 23%;
  left: 45%;
}

.box1 p {  color: white;  letter-spacing: 1px;}
.box2 p{color:white;}
.box1 strong{color: var(--wws-tuerkis);}
.box2 strong{color:var(--wws-tuerkis);}

.acf-gruen-boxen-wrapper strong:hover {transform:scale(1.2);}


.acf-gruen-box:hover {transform:scale(1.01);}
.acf-gruen-box:hover  h4{transform:scale(1.06);}






@media (max-width: 767px) {
  .acf-gruen-boxen-wrapper {
    flex-direction: column;
  }
}


/*------------------------PAGE HEADER------------------------*/
#page-header {

  background-size: 100% 100%;
  background-color: var(--wws-hellgruen);
height: 200px;
  margin-top: 458px;
position:relative;
	margin-bottom: 68px;
 	
}

.page-header-text {
  
  position: relative;

  width: 552px;
  padding: 8px 3px 11px 45px;
  z-index: 15;
  margin-left: 46.4%;
  top: -46px;
  height: 198px;
}

.page-header-text h1 {
  font-size: 86px;
  line-height: 100%;
  color: white;
  margin: 0;
	background-color: var(--wws-dunkelgruen);
  display: inline;
  padding: 0% 5%;
}

.page-header-text h2 {
font-size: 64px;
  letter-spacing: 1px;
  color: white;
  margin: 1px;
  line-height: 100%;
}
/*-----------------------------BILD-GALLERIE----------------------*/

.acf-gruen-bild {
  position: relative;
  width: 75%;
  padding: 3% 3%;
  max-width: 1363px;
  margin-top: 0px;
  text-align: left;
  margin-top: 0;
  margin-left: 3%;
	margin-bottom: 3%;
}




/*-----------------------------COLLAGE----------------------*/
.collage-wrapper2 {
position: absolute;
  width: 444px;
  overflow: hidden;
  top: 743px;
  right: -130px;
  aspect-ratio: 432/514;
}
.collage-wrapper {
  position: absolute;
  width: 578px;
  overflow: hidden;
  top: -58%;
  left: 23%;
  aspect-ratio: 528/339;
}

.collage-wrapper2 img.layer,
.collage-wrapper img.layer {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  transition: transform 0.2s ease;
  pointer-events: none;
	padding: 20px;
}


/*-----------------------------TEXT-BLÖCKE---------------------*/
.text-block1 {
position: relative;
  width: 75%;
  padding: 2% 5%;
  max-width: 1363px;
  text-align: left;
  margin-top:0;
  margin-left: 3%;

}

.text-block2 {
  width: 100%;
  padding: 3% 3% 1.5% 3%;
  max-width: 1410px;
  margin: 0 auto;
  text-align: center;
}




.text-block p, .text-block a{
  font-size: 28px;
  font-family: Source Sans Pro;
  font-weight: 600;
  letter-spacing: 0.020em;
  line-height: 143%;
 text-decoration: none;
  color: var(--wws-dunkelgruen);
	transition:0.1s;
}

.text-block a:hover{
color: var(--wws-dunkelrot);
}


.text-block strong {
  margin-left: -2%;	
  font-family: Misrow;
  font-weight: normal;
  font-size: 36px;
  letter-spacing: 1.7px;
}

/*-----------------------------TEXT-BLÖCKE2---------------------*/
.text-block h4 {
font-size: 36px;
  margin-top: 19px;
margin-left: -4%;
  letter-spacing: 3px;
  font-weight: normal;
  margin-bottom: 16px;
  display: inline-block;
  background-color: var(--wws-dunkelgruen);
padding: 17px 19px;

  color: white;
clip-path: polygon( 0.6% 13%, 4.7% 13%, 4.7% 0%, 58.8% 0%, 58.8% 13%, 98.8% 13%, 98.8% 95%, 59% 95%, 59% 102%, 5.5% 102%, 5.5% 90%,0.6% 90%);
}

.text-block h4 + p {
margin-top: 13px;
  margin-bottom: 0px
}

/*------------------------CTA 1------------------------*/


/*------------------------CTA Fortbildung------------------------*/
a.cta {text-decoration: none;}

.termine-wrapper {
position: absolute;
  width: 22%;
  right: 1%;
  height: auto;
	top: 26%;
}

.cta.cta-fortbildung {
width: 100%;
  position: relative;

}

.cta-fortbildung img {
width: 50%;  
  margin-left: 44%;
  margin-bottom: -8%;
  z-index: 9;
position: relative;
}

.cta-fortbildung .termine {
color: var(--wws-dunkelrot);
  font-size: 27px;
  background-color: var(--wws-gelb);
padding: 5% 4% 5% 4%;
  line-height: 111%;
  margin: 0;
  font-weight: normal;
  z-index: 8;
  font-family: misrow;
  text-align: right;
  clip-path:polygon(-0.22% 22.29%, 21.46% 22.98%, 20.54% 0.15%, 100% 0%, 100% 100%, 22.51% 100.31%, 20.4% 66.61%, 0.86% 64.34%);
  letter-spacing: 0.04em;
  position: relative;
  display: block;
}

.cta-fortbildung .termine strong {
font-size: 1.9vw;
  display: inline-block;
  margin: 15px 0;
  line-height: 100%;
}

.cta-fortbildung .termine p {
  margin: 8px 0;
	line-height: 105%;
	font-size: 1.4vw;


}

.cta-fortbildung h4.mehrinfos {
color: white;
  font-size: 1.5vw;
  background-color: var(--wws-dunkelrot);
  padding: 9px 13px 8px 20px;
  line-height: 106%;
  font-weight: normal;
  z-index: 19;
  text-align: right;
  display: inline-block;
  position: relative;
margin-left: 45%;
  margin-top: -10%;
}



@keyframes wobble-cta {
  0%   { transform: translateX(0); }
  15%  { transform: translateX(-4px) rotate(-1deg); }
  30%  { transform: translateX(3px) rotate(1deg); }
  45%  { transform: translateX(-2px) rotate(-0.5deg); }
  60%  { transform: translateX(1px) rotate(0.5deg); }
  75%  { transform: translateX(-1px); }
  100% { transform: translateX(0) rotate(0); }
}

.cta {
  display: inline-block; 
  transition: transform 0.3s ease;
}

.cta:hover {
  animation: wobble-cta 0.6s ease;
}








/*----------Responsiv----------*/


@media (max-width: 575.98px) {
	footer {  margin-top: 68px;}
		#primary {  margin-top: 100px;}
	#page-header { height: 125px;margin-top: 67vh;margin-bottom: 20px;}
		.page-header-text {width:60vw;    height: 27vw;    padding: 2.4% 0px 0 4%;    margin-left: auto;    top: 3vw;}
	.page-header-text h2 { font-size: 8vw;}
	.page-header-text h1 {    font-size: 36px;    padding: 3px;   padding: 3% 5%;    line-height: 124%;}
	.collage-wrapper { width: 335px;    margin-left: -180px;    top: -79%;}
	
	.text-block p, .text-block a, .text-block strong { font-size: 24px;}
		.text-block h4 {font-size: 26px;padding: 34px 19px;}
		.text-block2 {margin-top: 125px;}
	.text-block {width:100%;margin: 5% 0;margin-bottom: 1%;}
	
	.cta.cta-mail-m{display:flex;}
	.cta.cta-mail{display:none}
	.collage-wrapper2 {display:none;}
		
	.termine-wrapper {  width: 62%;  top: 17vh;}
	.cta-fortbildung .termine strong {  font-size: 5.4vw;margin: 7px 0;}
	.cta-fortbildung .termine p {  font-size: 4vw;margin: 7px 0px;}
	.cta-fortbildung h4.mehrinfos  {  font-size: 4vw;margin-left: 45%;}
	.cta-fortbildung .termine {  padding: 3% 4% 3% 4%;}
	.cta-fortbildung img {   margin-bottom: -4%;}

	
	.acf-gruen-box {  flex: 1 0 100%;  margin-bottom: 8%;}
	.acf-gruen-boxen-wrapper{flex-wrap: nowrap;    width: 100%;    padding: 0 8%;    margin-left: 0%;}
		.box1 h4 { font-size: 4vw;    padding: 3% 4% 4% 4%;    width: 53%;    top: 7%;}
	.box2 h4 { font-size: 4.5vw;    padding: 3% 4% 4% 4%;    width: 42%;    top: 8%;    left: 50%;}
	.acf-gruen-box p {  font-size: 4vw;	margin: -8% 0 9% 0;}
	.acf-gruen-box strong {  font-size: 4.5vw;	}
	.box2 img,.box1 img {  width: 33%;  right: 9%;  top: 9%;}
	.box1  {margin-bottom: 8%;}
	
	
		.cta.cta-mail-m h4{font-size:3.5vw;}
	
	.accordion-header.open::after {
transform:none;
background-image: url('/wp-content/uploads/images/akk-arrow-up.png');
}		 
		.accordion-header{font-size: 6vw;  padding: 3% 4% 3% 21%;  width: 100%;background-size: contain !important;    background-color: var(--wws-dunkelgruen);display: flex;background-position: 0 0;}
	.accordion-header::after {  			transition:none;			padding: 0px 12px;   			height: 15px;   			background-size: contain;  left: 10px;  height: 25px;  display: inline-block;  width: 80%;  background-repeat: no-repeat;  background-position: 100%;}
		
	
	
	
	
	.akkordeon-wrapper-outer{padding: 3% 2%;}
	.accordion-item {  margin-bottom: 30px;}
	
.accordion-item:nth-of-type(1) .accordion-header {background-image:url('/wp-content/uploads/images/akk-gruen-1-m.png'); background-size: 100% 100%;}
.accordion-item:nth-of-type(2) .accordion-header {background-image:url('/wp-content/uploads/images/akk-gruen-2-m.png'); background-size: 100% 100%;}
.accordion-item:nth-of-type(3) .accordion-header {background-image:url('/wp-content/uploads/images/akk-gruen-3-m.png'); background-size: 100% 100%;}
.accordion-item:nth-of-type(4) .accordion-header {background-image:url('/wp-content/uploads/images/akk-gruen-4-m.png'); background-size: 100% 100%;}
.accordion-item:nth-of-type(5) .accordion-header {background-image:url('/wp-content/uploads/images/akk-gruen-5-m.png'); background-size: 100% 100%;}
	
	.collage-wrapper img:nth-child(2) {  display: none;}
	
}


@media (min-width: 576px) and (max-width: 767.98px) {
	footer {  margin-top: 68px;}
		#primary {  margin-top: 100px;}
	#page-header { height: 120px; margin-top: 78%;margin-bottom: 20px;}
		.page-header-text {  width: 50vw;    height: 20vw;    padding: 1.4% 0px 0 3%;top: -25px;}
	.page-header-text h2 { font-size: 5vw;}
	.page-header-text h1 { font-size: 7vw;}
	.collage-wrapper {width: 345px;    left: 4%;    top: -85%;}
	
	
	.text-block p, .text-block a, .text-block strong { font-size: 24px;}
	.text-block h4 {font-size: 26px;padding: 34px 19px;}
	.text-block {width: 93%;margin: 5% 3%;margin-bottom: 1%;}
	
	.cta.cta-mail-m{display:flex;}
	.cta.cta-mail{display:none}
	.collage-wrapper2 {display:none;}
	
	.termine-wrapper { width: 36%;   top: 4%;}
	.cta-fortbildung .termine strong {  font-size: 3.1vw;margin: 7px 0;}
	.cta-fortbildung .termine p {  font-size: 2.6vw;}
	.cta-fortbildung h4.mehrinfos  {  font-size: 2.6vw;margin-left: 40%;}
	.cta-fortbildung .termine {  padding: 3% 4% 3% 4%;}
	
	.acf-sus-bild {  width: 90%;   margin-left: 5%;   margin-right: 5%; }
	
	.acf-gruen-box {  flex: 1 0 100%;  margin-bottom: 3%;}
	.acf-gruen-boxen-wrapper{flex-wrap: nowrap;    width: 100%;    padding: 0 8%;    margin-left: 0%;}
	.box1 h4 { font-size: 4vw;    padding: 3% 4% 4% 4%;    width: 53%;    top: 7%;}
	.box2 h4 { font-size: 4.5vw;    padding: 3% 4% 4% 4%;    width: 42%;    top: 8%;    left: 50%;}
	.acf-gruen-box p {  font-size: 3.4vw;	margin: -8% 0 9% 0;}
	.acf-gruen-box strong {  font-size: 4vw;	}
	.box2 img,.box1 img {  width: 33%;  right: 9%;  top: 9%;}
	.box1  {margin-bottom: 8%;}
	
	.cta.cta-mail-m h4{font-size:3.5vw;}
		 
		.accordion-header{font-size: 3.9vw;    padding: 39px 58px 19px 17%;}
	.accordion-header::after {  padding: 0px 15px;height: 22px;}
	.akkordeon-wrapper-outer{padding: 3% 2%;}
	.accordion-item {  margin-bottom: 30px;}
	
	
	

	
}


@media (min-width: 768px) and (max-width: 991.98px) {
	#primary {  margin-top: 100px;}
	#page-header{margin-top:57%;height: 100px;margin-bottom: 20px;}
	.page-header-text {width: 41vw;    height: 14vw;    padding: 1.4% 0px 0 3.6%;}
	.page-header-text h2 { font-size: 4.4vw;}
	.page-header-text h1 { font-size: 6vw;}
	.collage-wrapper {   left: 5%;    top: -115%;    width: 50%;}
	
	  .text-block p, .text-block a, .text-block strong { font-size: 28px;}
	  .text-block h4 {font-size: 36px;padding: 34px 19px;}
	.text-block {width: 93%;margin: 10% 3%;margin-bottom: 1%;}
	
	.cta.cta-mail-m{display:flex;}
	.cta.cta-mail{display:none}
	.collage-wrapper2 {display:none;}
	
	.termine-wrapper {  width: 32%;  top: 4%;}
	.cta-fortbildung .termine strong {  font-size: 2.6vw;}
	.cta-fortbildung .termine p {  font-size: 2.3vw;}
	.cta-fortbildung h4.mehrinfos  {  font-size: 2.3vw;margin-left: 45%;}
	
	.acf-sus-bild {  width: 90%;   margin-left: 5%;   margin-right: 5%; }
	
	.acf-gruen-box {  flex: 1 0 44%;  margin-bottom: 3%;}
	.acf-gruen-boxen-wrapper{flex-wrap: wrap;    width: 100%;    padding: 0 5%;    margin-left: 0%;}
	.box1 h4 { font-size: 2.4vw;    width: 70%;    margin: 1% 0% 16% 1%;    padding: 5px 25px;    left: -2%;    top: 40%; }
	.box2 h4 {  font-size: 2.4vw;    width: 49%;    margin: 1% 0% 7% 0%;    padding: 8px 25px;    left: 42%;    top: 10%;}
	.acf-gruen-box p { font-size: 1.8vw;    margin-top: 18%;}
	.acf-gruen-box strong {  font-size: 2.2vw;	}

	.box2 img { width: 40%;    top: 114px;    left: 29%;}
	.box1 img { width: 40%;    top: 82px;    left: 39%;}
	.cta.cta-mail-m h4{font-size:2.5vw;}
	
	.accordion-header{font-size: 30px;font-size: 3.7vw;       padding: 51px 58px 31px 133px;}
	.accordion-header::after {  padding: 0px 15px;height: 22px;}
	.akkordeon-wrapper-outer{padding: 3% 4%;}
	.accordion-item {  margin-bottom: 30px;}
	
	
	
}


@media (min-width: 992px) and (max-width: 1199.98px) {
	#page-header{height: 148px;margin-top:47%}
	.page-header-text {width: 41vw;    height: 14vw;    padding: 1.4% 0px 0 3.6%;}
	.page-header-text h2 { font-size: 4.4vw;}
	.page-header-text h1 { font-size: 6vw;}
	.collage-wrapper { left: 7%;    top: -110%;}
  .text-block p, .text-block a, .text-block strong { font-size: 28px;}
	  .text-block h4 {font-size: 30px;}
	
		.collage-wrapper2 {  width: 40%;}

.acf-lehr-box {  flex: 1 0 44%;  margin-bottom: 3%;}
	.acf-gruen-boxen-wrapper{flex-wrap: wrap;    width: 100%;    padding: 14px 5%;    margin-left: 0%;    margin-right: 0%;}
	.acf-gruen-box h4 {  font-size: 2vw;    padding: 14px 0px 20px 16px;}
	.acf-gruen-box p {  font-size: 1.8vw;	}
	.acf-gruen-box strong {  font-size: 2.2vw;	}
	.acf-gruen-box:nth-child(3) { flex: 0 0 50%; margin: 2% auto 0 auto;}
	
	.accordion-header{font-size: 28px;    padding: 51px 58px 31px 133px;}
	.accordion-header::after {  padding: 0px 15px;height: 22px;}
	
	.termine-wrapper {width: 24%; top: 27%;}
	.cta-fortbildung .termine p {    font-size: 1.7vw;}
	.cta-fortbildung .termine strong {  font-size: 2vw;  margin: 4px 0;}
	
}


@media (min-width: 1200px) and (max-width: 1399.98px) {

	.collage-wrapper {   left: 18%;}
	.collage-wrapper2 {  width: 35%;}
	.page-header-text {width: 500px;    padding: 17px 3px 11px 34px;    height: 191px;}
		.page-header-text h2 { font-size: 54px;}
	.page-header-text h1 { font-size: 76px;}
	
	
	.accordion-header {font-size: 30px}
	
	}

@media (min-width: 1400px)  {
	.collage-wrapper {   left: 23%;}
}


@media  (pointer: coarse) and (max-width: 991px) {
	.box1,.box2,.text-block-alternativ * { transform: none !important;}
	.box2:hover,.box1:hover {  background-size: 100% 100%;}
	.accordion-header:hover { transform: none !important;}


}

/* Korrekturen */
.startseite-content {  overflow: hidden;position: relative;}
#primary{margin-top:0px}
.text-block em {font-size: 0.8em;  line-height: 100%;}


