/* HEADER */
.header_einfach { width: 100%; overflow: hidden; border: 0px solid red; position: relative; margin-top: 125px; margin-bottom: 50px;}
.header_einfach .grid {display: grid; grid-template-columns: 183px 183px 183px 183px 740px 300px 183px 183px 183px 4000px; column-gap: 30px; justify-content: center; transition: 2s; opacity: 0;}
.header_einfach .grid.visible {grid-template-columns: 183px 183px 183px 183px 740px 300px 183px 183px 183px 183px; opacity: 1;}
.header_einfach .grid .quadrat {width: 183px; height: 183px; grid-row: 1; border-radius: 10px; box-sizing: border-box;}
.header_einfach .grid .quadrat.item1 {grid-column: 1; border: 4px solid rgba(var(--grey10)); box-sizing: border-box;}
.header_einfach .grid .quadrat.item2 {grid-column: 2;}
.header_einfach .grid .quadrat.item3 {grid-column: 3; }
.header_einfach .grid .quadrat.item4 {grid-column: 4; border: 4px solid rgba(var(--grey10)); box-sizing: border-box; }
.header_einfach .grid .bild {grid-row: 1; grid-column: 6; border-radius: 10px; line-height: 0px; height: 183px; overflow: hidden;}
.header_einfach .grid .bild_ersatz {grid-row: 1; grid-column: 6; width: 300px; border-radius: 10px; border: 4px solid rgba(var(--grey10)); box-sizing: border-box;}
.header_einfach .grid .bild img {border-radius: 10px; max-width: 100%; height: auto;}
.header_einfach .grid .headline {grid-row: 1; grid-column: 5; display: grid; grid-template-rows: 1fr auto; width: 740px; border-radius: 10px;}
.header_einfach .grid .headline p {grid-column: 1; grid-row: 1; align-self: end; margin-bottom: 0px; padding-left: 30px; padding-right: 30px; }
.header_einfach .grid .headline p.datum:first-letter {text-transform: uppercase;} 
.header_einfach .grid .headline h1 {margin-bottom: 0px; grid-column: 1; grid-row: 2; align-self: end; font-size: 32px; line-height: 40px; padding-bottom: 15px; padding-left: 30px; padding-right: 30px;}
.header_einfach .grid .quadrat.item5 {grid-column: 7;}
.header_einfach .grid .quadrat.item6 {grid-column: 8;}
.header_einfach .grid .quadrat.item7 {grid-column: 9;}
.header_einfach .grid .quadrat.item8 {grid-column: 10;}
.header_einfach .grid .quadrat.item9 {grid-column: 11;}

@media only screen and (min-width: 1024px) and (max-width: 1400px) {
	.header_einfach .grid {display: grid; grid-template-columns: 133px 133px 133px 133px 700px 220px 133px 133px 133px 5000px; column-gap: 20px; }
	.header_einfach .grid .quadrat {width: 133px; height: 133px;}
	.header_einfach .grid .headline { width: 700px; }
	.header_einfach .grid .headline h1 {font-size: 26px; line-height: 40px;}
	.header_einfach .grid .bild_ersatz {width: 220px;}
	.header_einfach .grid.visible {grid-template-columns: 133px 133px 133px 133px 700px 220px 133px 133px 133px 133px;}
	.header_einfach .grid .bild { height: 133px;}
}

@media only screen and (min-width: 768px) and (max-width: 1023px) {
	.header_einfach .grid {grid-template-columns: 135px 135px 135px 135px 460px 220px 135px 135px 135px 2000px; column-gap: 20px;}
	.header_einfach .grid .quadrat {width: 135px; height: 135px;}
	.header_einfach .grid .headline { width: 460px; }
	.header_einfach .grid .headline h1 {font-size: 20px; line-height: 28px; }
	.header_einfach .grid .bild_ersatz { width: 220px;}
	.header_einfach .grid.visible {grid-template-columns: 135px 135px 135px 135px 460px 220px 135px 135px 135px 135px;}
	.header_einfach .grid .bild { height: 135px;}
}

@media only screen and (max-width: 767px) {
	.header_einfach {margin-bottom: 0px; margin-top: 100px;}
	.header_einfach .grid {grid-template-columns: 0 0 0 4% 92% 0% 4% 0 0 0; grid-template-rows: fit-content(500%) 70px auto; column-gap: 0px; row-gap: 0px;}
	.header_einfach .grid .quadrat {width: 0px; height: 0px;}
	.header_einfach .grid .headline { width: auto; border-bottom-right-radius: 0px; border-bottom-left-radius: 0px;}
	.header_einfach .grid .headline h1 {font-size: 20px; line-height: 28px; padding-left: 20px; padding-right: 20px; }
	.header_einfach .grid .headline p.datum {padding-top: 20px;padding-left: 20px; }
	.header_einfach .grid .quadrat.item1 {grid-row: 2; grid-column: 5; border: 0px; border-top-left-radius: 0; border-top-right-radius: 0; background-color: rgba(var(--pColor)); height: 100%; width: 100%}
	.header_einfach .grid .bild {grid-row: 2/4; grid-column: 5; position: relative; z-index: 2; margin-left: 20px; margin-bottom: 20px; border-radius: 15px;  overflow: hidden; border: 2px solid #FFF; width: 204px; height: 126px; box-sizing: border-box;}
	.header_einfach .grid .bild_ersatz { width: 100%; grid-row: 2; grid-column: 5; position: relative; z-index: 2; padding-left: 20px; background-color: rgba(var(--pColor)); padding-bottom: 20px; border-top-right-radius: 0px; border-top-left-radius: 0px; border: 1px solid rgba(var(--pColor));}
	.header_einfach .grid.visible {grid-template-columns: 0 0 0 4% 92% 0% 4% 0 0 0; column-gap: 0px; row-gap: 0px;}
	.header_einfach:has(.bild_ersatz) {margin-bottom: 20px;}
}