@charset "UTF-8";
/* CSS Document */
/* Copyright © 2026 Step Two Design, Christine Kahlert und Jens Vestweber, Alle Rechte vorbehalten */
/* Stand: 12.06.2026 */
/*ANFANG Schrifteinbindung*/
/*@font-face {
    font-family: 'STD Sans';
    src: url('../fonts/STDSans-Light.woff2') format('woff2');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'STD Sans';
    src: url('../fonts/STDSans-LightItalic.woff2') format('woff2');
    font-weight: 200;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: 'STD Sans';
    src: url('../fonts/STDSans-Book.woff2') format('woff2');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'STD Sans';
    src: url('../fonts/STDSans-BookItalic.woff2') format('woff2');
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}*/
@font-face {
    font-family: 'STD Sans';
    src: url('../fonts/STDSans-Regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'STD Sans';
    src: url('../fonts/STDSans-Italic.woff2') format('woff2');
    font-weight: 400;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: 'STD Sans';
    src: url('../fonts/STDSans-SemiBold.woff2') format('woff2');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}
/*@font-face {
    font-family: 'STD Sans';
    src: url('../fonts/STDSans-SemiBold.woff2') format('woff2');
    font-weight: 600;
    font-style: italic;
    font-display: swap;
}*/
@font-face {
    font-family: 'STD Sans';
    src: url('../fonts/STDSans-Bold.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
/*Fallbacks*/
@font-face {
    font-family: 'Adjusted Tahoma Fallback';
    src: local(Tahoma);
    size-adjust: 94%;
    ascent-override: 108%;
    descent-override: 43%;
    line-gap-override: normal;
}
@font-face {
    font-family: 'Adjusted Arial Fallback';
    src: local(Arial);
    size-adjust: 94%;
    ascent-override: 107%;
    descent-override: 42%;
    line-gap-override: normal;
}
@font-face {
    font-family: 'Adjusted Segoe UI Fallback';
    src: local(Segoe UI);
    size-adjust: 94%;
    ascent-override: 108%;
    descent-override: 44%;
    line-gap-override: normal;
}
/*ENDE Schrifteinbindung*/
*, *:before, *:after {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	}
html { 
	scroll-behavior: smooth;
	font-size: 100%;
	height: 100%;
	margin: 0;
	 }
body { 
	font-family: 'STD Sans', 'Adjusted Segoe UI Fallback', 'Adjusted Tahoma Fallback', 'Adjusted Arial Fallback', sans-serif; 
	font-size: 1rem;
	font-weight: 400; 
	line-height: 1.5; 
	font-feature-settings: "liga" 1; 
	text-rendering: optimizeLegibility;
	margin: 0 auto;
	color: #1A1A1A;
	background-color: #6685a3;
	padding: 0;
	border: 0;
	max-width: 1920px;
    overflow-x: hidden;
	height: 100%;
	display: flex;
  	flex-direction: column;
}
/*p {
  hyphens: auto;
}
auskommentiert, da unschöne Worttrennungen*/
.page-wrapper {
		display: grid;
		/*height: 100%;*/ /* Wenn nicht auskommentiert, funktioniert nach-oben-Button nicht */
		width: 100%;
		flex: 1 0 auto;
		position: relative;
		background-color: #f4f4f4;
}
div#B4,div#B22,div#B30,div#B37,div#B43,div#B46,div#B52,div#B57,div#B64,div#B73 {
	grid-column: span 2; 
	grid-row: span 2;    
}
div#B2 {
	background-color: #ccd6e0;
}
div#B5 {
	background-color: #ccd6e0;
}
div#B8 {
	grid-column: span 2; 
	aspect-ratio: 2 / 1;    
}
div#B17 {
	background-color: #ccd6e0;
}
div#B18 {
	grid-column: span 3; 
	grid-row: span 2;
}
div#B22 {
	background-color: #ccd6e0;
}
div#B30 {
	background-color: #ccd6e0;
}
/*div#B31 {
	grid-column: span 1; 
	grid-row: span 2;
	overflow: visible;
}*/
div#B31 {
	grid-column: span 1; 
	aspect-ratio: 1 / 2;
	overflow: visible;
}
div#B43 {
	background-color: #8f9ab5;	
}
img {
  display: block;
  max-width: 100%;
  height: auto;
  pointer-events: none;
}
/*Hintergrundverläufe*/
.verlauf-25 {
	background: #6B8FB3;
	background: linear-gradient(165deg, 
	rgba(107, 143, 179, 0.8) 0%, 
	rgba(138, 184, 230, 0.4) 70%, 
	rgba(224, 240, 255, 1) 100%);
}
.verlauf-27 {
	background: #F4F4F4;
	background: linear-gradient(155deg, 
	rgba(255, 255, 255, 1) 0%,
	rgba(107, 143, 179, 0.09) 65%, 
	rgba(255, 255, 255, 1) 90%);
}
ul, li {
	margin: 0;
	padding: 0;
	}
.active {
	font-weight: 600;
	}	
nav.footer-links .active {
	font-weight: 600;
	letter-spacing: 0.04em;
	}
p {
	margin-top: 1.5em;
	margin-bottom: 1.5em;
	}
.bold {
	font-weight: 800;
	}
.kursiv {
	font-weight: 400;
	font-style: italic;
	}
.kein-listenpunkt {
	list-style-type: none;
	list-style-position: inside;
}		
.ausblenden {
	display: none;
	}
.clear-none {
	clear:none;
	}
.rotation {
	width: 100%;
	position: relative;
	z-index: 1005;
	mix-blend-mode: difference;
	-webkit-animation: spin 20s linear infinite;
	-moz-animation: spin 20s linear infinite;
	animation: spin 20s linear infinite;
}
@-moz-keyframes spin { 100% { -moz-transform: rotate(-360deg); } 
}
@-webkit-keyframes spin { 100% { -webkit-transform: rotate(-360deg); } 
}
@keyframes spin { 100% { transform:rotate(-360deg); } 
}	
/*ANFANG Mobil-bis-575px___1-Block__3-Spalten*/
/*ANFANG Header mit Logo und Navigation*/
.main-header {
	/*height: 12vw;*/ /*für Mobil*/
	height: 3.25rem;
	background: rgba(244,244,244,1);
	display: flex;
	justify-content: space-between;
	align-items: center;
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 10;
	box-shadow: 0 3px 6px rgba(77,112,187,0.1);
	padding-top: 0;
	padding-right: 8.2682291%;
	padding-bottom: 0;
	padding-left: 3.3%;
	max-width: 1920px;
	}
.logo {
		height: auto;
		width: 43.3%;
	}
.nav {
		font-size: 1.125rem;
	}
.nav-menu ul {
		display: flex;
		list-style: none;
	}
.nav-menu ul li a {
		text-decoration: none;
		color: #1A1A1A;
		transition: color 0.3s;
	}
.nav-menu ul li a:visited {
		color: #1A1A1A; 
	}
.nav-menu ul li a:hover {
		color: #4d70b8;
	}
.nav-menu ul li a:active {
		color: #ffcc80;
	}
/* Hamburger Menu verstecken */
.nav-toggle, .hamburger {
		display: none;
}
/*ANFANG Hamburger-Button-Nav bis-575px*/
@media (max-width: 575px) {
	.hamburger {
		display: block;
		cursor: pointer;
		width: 30px;
		height: 20px;
		position: relative;
		padding-top: 0.5rem;
		z-index: 15;
	}
	.hamburger span, .hamburger span::before, .hamburger span::after {
		content: "";
		display: block;
		background: #1a4775;
		height: 3px;
		width: 100%;
		position: absolute;
		transition: 0.3s;
	}
	.hamburger span::before { top: -8px; }
    .hamburger span::after { bottom: -8px; }
    .nav-menu {
		position: fixed;
		top: 3.25rem;
        left: -100%;
        width: 100%;
        height: auto;
		background-color: #e6ebf0;
		color: #1a1a1a;
        transition: 0.5s;
    }
    .nav-menu ul {
        flex-direction: column;
        text-align: left;
		padding-left: 33.33333%;
    }
    .nav-menu ul li {
        margin: 15px 0;
    }
    .nav-toggle:checked ~ .nav-menu {
        left: 0;
    }
}
/*ENDE Hamburger-Button-Nav bis-575px*/
/*ENDE Header mit Logo und Navigation*/

/*ANFANG Headline und Galerie und Folgeseiten*/
h1 {
	font-size: 1.25rem;
	font-weight: 400;
	color: #4d70b8;
	margin-top: 5rem;
	margin-left: 16.66666%;
	line-height: 1.375;
}
.h1-groesser {
	font-size: 2.25rem;
	line-height: 0.75;
}
h2 {
	margin: 0;
	padding: 0;
	overflow: visible;
	font-weight: 400;
}	
h3 {
	margin: 0;
	padding: 0;
	overflow: visible;
	font-weight: 600;
}
h4 {
	margin: 0;
	padding: 0;
	overflow: visible;
	font-size: 1.125rem;
	font-weight: 600;
}
.gallery {
	display: grid;
	gap: 0;
	margin-top: 50px;
	grid-template-columns: repeat(1, 1fr);
	margin-bottom: 300px;
}
.grid-block {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	aspect-ratio: 1 / 1;
	overflow: hidden;
}
.grid-block > div {
	aspect-ratio: 1 / 1;
	overflow: hidden;
	position: relative;
	}
.grid-block img {
	max-width: 100%;
	height: auto;
	object-fit: cover;
	/*transition: transform 0.3s ease;*/
}
/*.grid-block img:hover {
	transform: scale(1.1);
}*/
.bereiche-text {
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	padding-left: 6px; /* Wenn es Blitzer verursacht, Abstand mit Haarspatium ( ) lösen */
	padding-top: 0;
	line-height: 1;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: clip;
	container-type: inline-size; /* Voraussetzung für Verwendung von cqw und cqh für font-size */
}
.bereiche-text h2 {
	font-size: 54cqw;
	white-space: nowrap;
	transition: transform 0.3s ease;
}
.bereiche-text h2 a {
	text-decoration: none;
	color: #1a1a1a;
}
.bereiche-text h2 a:visited {
	color: #1a1a1a;
}
.bereiche-text h2 a:hover {
	color: #4d70b8;
}
.bereiche-text h2:hover {
	overflow: visible;
	text-overflow: clip;
	transform: scale(1.1);
}
.bereiche-text h2 a:active {
	color: #ffcc80;
}

/*ANFANG Bereich „Leistungen“ – Mobile*/
.grid-container-leistungen {
    display: grid;
    grid-template-columns: 100%;
    gap: 0;
    margin-top: 50px;
	margin-bottom: 14rem;
}
.grid-item-leistungen {
	font-size: 1.6em;
}
.grid-item-leistungen ul {
	margin-left: 16.66666%;
	list-style-type: none;
}
.grid-item-leistungen ul li h2 {
	font-size: 1em;
	font-style: normal;
    font-weight: 600;
	margin-bottom: 0.5em;
	}
.grid-item-leistungen ul li img {
	width: 60%;
	height: auto;
	padding-top: 1rem;
	padding-bottom: 5rem;
}
/*ANFANG Verlinkung Leistungen*/
.grid-item-leistungen ul li a {
	text-decoration: none;
	color: #1A1A1A;
	transition: color 0.3s;
}
.grid-item-leistungen ul li a:visited {
	color: #1A1A1A; 
}
.grid-item-leistungen ul li a:hover {
	color: #4d70b8;
}
.grid-item-leistungen ul li a:active {
	color: #ffcc80;
}
/*ENDE Verlinkung Leistungen*/
/*ENDE Bereich „Leistungen“ – Mobile*/

/*ANFANG Bereich „Kontakt|Impressum“ – Mobile*/
.grid-container-kontakt-impressum {
    display: grid;
    grid-template-columns: 100%;
    gap: 0;
	padding-bottom: 6rem;
}
.grid-item-kontakt-impressum {
	grid-column: span 3;
	padding-left: 3.3%;
	margin-left: 3.3%;
	margin-right: 3.3%;
}
/*ENDE Bereich „Kontakt|Impressum“ – Mobile*/

/*ANFANG Bereich „Datenschutz“ – Mobile*/
grid-container-datenschutz {
	display: grid;
	grid-template-columns: 100%;
	gap: 0;
}
#DatSch {
	padding-left: 3.3%;
	padding-right: 3.3%;
	padding-bottom: 20rem;
}
/*Damit die Sprungziele nicht unter dem Header verschwinden*/	 
#I, #II, #III, #IV, #V, #VI {
	scroll-margin-top: 78px;  /*Höhe des Headers + etwas Puffer*/
}
p.p1 {margin: 0; font-size: 1.375rem;}
p.p2 {
	margin: 0;
	font-size: 1rem;
	font-weight: 400;
}
p.p2.bold {
	font-weight: 600;
}
p.p3 {margin: 0; font-size: 1rem; min-height: 1.16666rem;}
p.p4 {margin: 0; font-size: 1.16666rem; min-height: 1.375rem;}
p.p5 {
	margin: 0;
	font-size: 1.16666rem;
	font-weight: 600;
}
p.p5.linkblue a {
	text-decoration:none;
	color: #1a4775;
}
li.li2 {margin: 0; font-size: 1rem;}
.padding-top3px {padding-top: 0.25rem;}
span.A-tab-span {white-space:pre;}
ul.ul1 {
	list-style-type: square;
	list-style-position: inside;
}
.linkblue {
	color: #1a4775;
	text-decoration: none;
	}
/*ENDE Bereich „Datenschutz“ – Mobile*/

/*ANFANG Bereich „Über uns“ – Mobile*/
.grid-container-ueberuns {
	display: grid;
	grid-template-columns: repeat(1, 1fr);
	padding-bottom: 20rem; /*Damit Inhalt nicht unter Footer verschwindet*/
	font-size: 1.125rem;
	margin-top: 50px;
}
.grid-item-ueberuns-links {
	padding-right: 3.3%;
}
#Visual25Jahre_2 {
	margin-right: 18px;
}
.grid-item-ueberuns-content1 {
	grid-column: span 3;
	padding-left: 3.3%;
	padding-right: 3.3%;
}
.grid-item-ueberuns-content2 {
	grid-column: span 2;
}
.grid-item-ueberuns-content2 figcaption ul li {
	list-style-type: square;
	list-style-position: inside;
}
.grid-item-ueberuns-content2 img {
	margin: 5rem 0 1rem 0;
	width: 100%;
	object-fit: cover;
}
.grid-item-ueberuns-leer {
	grid-column: span 1;
}
.grid-item-ueberuns-content2 figcaption { 
	padding-left: 3.3%;
	padding-right: 3.3%;
}
/*ANFANG 25-Jahre-Vignette wird von Text umflossen*/
#Visual25Jahre_2 {
	display: flow-root; /*float am Ende des Blocks beenden*/
}
.circled {
	shape-outside: circle();
	clip-path: circle();
	float: left;
	width: 160px;
	height: 160px;
	margin: 5px;
}
/*ENDE 25-Jahre-Vignette wird von Text umflossen*/
/*ENDE Bereich „Über uns“ – Mobile*/
.grid-item-kontakt-impressum-content {
		padding-left: 3.3%;
		padding-right: 3.3%;
	}
/*ENDE Headline und Galerie und Folgeseiten*/

/*ANFANG Footer*/
/* Grundlayout */
.footer {
	background-color: rgba(26,71,117,0.96);
	color: #fff;
	padding: 1.75rem 0;
	margin-top: auto;
	line-height: 1rem;
	letter-spacing: 0.02em;
	/*position: fixed;*/ /*Für Cat im Footer*/
	bottom: 0; /* Für Cat im Footer*/
	width: 100%;
}
.footer-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	margin: 0 auto;
	row-gap: 2rem;
}
.footer-links {
	grid-column: 1 / -1; /*über alle 3 Spalten*/
	display: flex;
	flex-direction: column-reverse;
	align-items: left;
	padding-left: 33.33333%;
	gap: 1.5rem;
}
/*Link-Zustände – in dieser Reihenfolge lassen*/
.footer-links a:link {
	color: #f4f4f4;
	text-decoration: none;
	transition: color 0.3s;
}
.footer-links a:visited {
	color: #f4f4f4;
}
.footer-links a:hover {
	color: #4d70b8;
}
.footer-links a:active {
	color: #ffcc80;
}
/*Copyright-Zeile*/
.footer-copy {
	grid-column: 1 / -1;
	font-size: 0.875rem;
	color: #b3c2d1;
	text-align: left;
	padding-left: 3.3%;
	line-height: 1rem;
}
/*ENDE Footer*/

/*ANFANG nach oben-Button mobil*/
a#backToTop.nach-oben {
	display: none; /* Initial versteckt */ /*für Version ohne Javascript, nur dies löschen und das js */
    position: fixed;
	bottom: 2rem;
	right: 3.3%;
	background-color: #b3c1e2;
	width: 38px;
	height: 38px;
	text-align: center;
	line-height: 38px;
	border-radius: 23%;
    text-decoration: none;
	z-index: 1000;
    transition: background-color 0.3s, opacity 0.5s, visibility 0.5s;
    opacity: 0.45;
}
.nach-oben:hover {
    opacity: 0.85;
}
/*ENDE nach oben-Button mobil*/
/*ENDE Mobil-bis-479px___1-Block__3-Spalten ***********************************/

/****** ANFANG Mobil-ab-480px___1-Block__3-Spalten*/
@media (min-width: 480px) {
	.logo {
		height: auto;
		width: 32%;
	}
	h1 {
		font-size: 1.5rem;
	}
	.h1-groesser {
		font-size: 2.5rem;
		margin-top: 4.75rem;
	}
}
/*ENDE Mobil-bis-575px___1-Block__3-Spalten*/

/*ANFANG Tablet-576px-bis-1023px___2-Blöcke__6-Spalten*/
@media (min-width: 576px) {
	.main-header {
		height: 3rem;
	}
	.logo {
		height: auto;
		width: 24%;
		padding-top: 0.25rem;
	}
	.nav {
		font-size: 0.875rem; /* 14px */
	}
	.nav-menu ul li a {
		color: #1A1A1A;
		margin-left: 1.5rem;
	}
	h1 {
		font-size: 1.6875rem;
	}
	.h1-groesser {
		font-size: 2.9375rem;
	}
	.gallery {
		grid-template-columns: repeat(2, 1fr);
	}
	#DatSch {
		padding-left: 0;
		padding-right: 0;
	}
	.grid-container-datenschutz { 
		display: grid;
		grid-template-columns: repeat(12, 1fr);
		padding-left: 0;
		padding-bottom: 10rem;
		margin-top: 50px;
	}
	.grid-item-datenschutz-links {
		grid-column: span 2;
	}
  	.grid-item-datenschutz-content {
		grid-column: span 8;
	}
	.grid-item-datenschutz-rechts {
		grid-column: span 2;
	}
	ul.ul1 {
		list-style-position: outside; 
	}
	.grid-container-kontakt-impressum {
		display: grid;
		grid-template-columns: repeat(12, 1fr);
		padding-left: 0;
		padding-bottom: 10rem;
	}
	.grid-item-kontakt-impressum-links {
		grid-column: span 2;
	}
  	.grid-item-kontakt-impressum-content {
		grid-column: span 4;
		padding-left: 0;
		margin-top: 50px;
	}
	.grid-item-kontakt-impressum-rechts {
		grid-column: span 6;
	}
	.grid-container-leistungen {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		margin-bottom: 10rem;
	}	
	.grid-container-ueberuns {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		padding-left: 3.3%;
		padding-right: 3.3%;
		padding-bottom: 10rem; /*Damit Inhalt nicht unter Footer verschwindet*/
		font-size: 1.25rem;
		column-gap: 3.3%;
	}
	.grid-item-ueberuns-links img {
		display: none;
	}
	.grid-item-ueberuns-content1 {
		grid-column: span 2;
	}
	.grid-item-ueberuns-content2 {
		grid-column: span 1;
		padding:0;
	}
	.grid-item-ueberuns-content2 img {
		padding-left: 0;
		padding-right: 0;
	}
	.grid-item-ueberuns-content2 figcaption { 
		padding-left: 0;
		padding-right: 0;
	}
	.grid-item-ueberuns-leer {
		display: none;
	}
	.footer {
		/*position: fixed;*/
		bottom: 0;
		width: 100%;
		max-width: 1920px;
		height: auto;
	}
	.footer-grid {
		grid-template-columns: repeat(6, 1fr);
	}
	.footer-links {
		flex-direction: row;
		justify-content: center;
		padding-left: 0;
		gap: 7rem;
	}
	.footer-copy {
		grid-column: 1 / -1;
	}
}
/*ENDE Tablet-576px-bis-1023px___2-Blöcke__6-Spalten*/

@media (min-width: 957px) {
	.footer {
		position: fixed;
		bottom: 0;
		width: 100%;
		max-width: 1920px;
		height: auto;
	}
}

/*ANFANG Laptop-1024px-bis-1200px___3-Blöcke__9-Spalten*/
@media (min-width: 1024px) {
	.main-header {
		height: 2.8125rem;
	}
	.logo {
		height: auto;
		width: 20.5%;
		padding-top: 0.75rem;
		padding-bottom: 0.25rem;
	}
	.nav {
		font-size: 1.125rem; /* 18px */
	}
	h1 {
		font-size: 2.25rem;
	}
	.h1-groesser {
		font-size: 3.9375rem;
		margin-top: 2.5rem;
	}
	.gallery {
		grid-template-columns: repeat(3, 1fr);
		margin-bottom: 10rem;
	}
	.grid-item-datenschutz-links {
		grid-column: span 2;
	}
	.grid-item-datenschutz-content {
		grid-column: span 8;
	}
	.grid-item-datenschutz-rechts {
		grid-column: span 2;
	}
	.grid-container-leistungen {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
	}
}
/*ENDE Laptop-1024px-bis-1200px___3-Blöcke__9-Spalten*/

/*ANFANG Desktop-1200px-bis-1980px___4-Blöcke__12-Spalten*/
@media (min-width: 1200px) {
	.main-header {
		height: 3.5625rem;
	}
	.logo {
		height: auto;
		width: 18%;
		max-width:252px;
		padding-top: 0.75rem;
		padding-bottom: 0.5rem;
	}		
	.nav {
		font-size: 1.25rem;
	}
	.nav-menu ul li a {
		color: #1A1A1A;
		margin-left: 40px;
	}
	h1 {
		font-size: 2.5625rem;
		margin-top: 5.5625rem;
	}
	.h1-groesser {
		font-size: 4.5rem;
		line-height: 1;
	}
	.gallery {
		grid-template-columns: repeat(4, 1fr);
	}
	.footer {
		position: fixed;
	}
	.footer-grid {
		grid-template-columns: repeat(12, 1fr);
	}
	.footer-links {
		grid-column: 1 / -1;
		font-size: 1.25rem;
	}
	.footer-copy {
		grid-column: 1 / -1;
		font-size: 1rem;
	}
		.grid-container-datenschutz {
		padding-bottom: 10rem;
	}
	.grid-item-datenschutz-links {
		grid-column: span 2;
	}
  	.grid-item-datenschutz-content {
		grid-column: span 5;
	}
	.grid-item-datenschutz-rechts {
		grid-column: span 5;
	}
	.grid-container-leistungen {
		display: grid;
		grid-template-columns: repeat(4, 1fr);
	}
	.grid-container-ueberuns {
		display: grid;
		grid-template-columns: repeat(12, 1fr);
		column-gap: 0;
		padding-left: 0;
		padding-right: 0;
		padding-bottom: 10rem; /* Damit Inhalt nicht unter Footer verschwindet */
		font-size: 1.0625rem;
	}
   .grid-item-ueberuns-links {
		grid-column: span 2;
		padding-left: 16.66666%;
		padding-right: 0;
	}
	#Visual25Jahre_1 {
		display: block;
		grid-column: span 2;
		width: 90%;
		object-fit: cover;
		margin-top: 22.5rem;
		}
	#Visual25Jahre_2 {
		display: none;
	}
  	.grid-item-ueberuns-content1 {
		grid-column: span 3;
		padding-left: 0;
		padding-right: 0;
	}
	.grid-item-ueberuns-content2 {
		grid-column: span 2;
	}
	.grid-item-ueberuns-content2 img {
		margin: 0 0 1rem 0;
	}
	.grid-item-ueberuns-leer {
		grid-column: span 1;
		display: block;
	}
	/*.grid-item-ueberuns-content2 img {
		grid-column: span 2; 
		width: 100%;        
		object-fit: cover;
	}*/	
}
/*ENDE Desktop-1200px-bis-1980px___4-Blöcke__12-Spalten*/

@media (min-width: 1600px) {
	h1 {
		font-size: 3.8125rem;
		margin-top: 5.5625rem;
	}
	.h1-groesser {
		font-size: 6.5625rem;
		line-height: 1;
	}
	.grid-item-kontakt-impressum {
		padding-left: 16.66666%;		
	}
	.grid-container-ueberuns {
		font-size: 1.125rem;
		overflow-wrap: normal;
	}
}
@media (min-width: 1800px) {
	.grid-container-leistungen {
		display: grid;
		grid-template-columns: repeat(6, 1fr);
	}	
}
.page-wrapper#KontaktWrapper {
	min-height: 100%; /* Für Cat im Footer*/
	padding-bottom: 450px;
}
.footer-image {
    position: absolute;
    top: 0; 
    left: 62%;
    transform: translate(-18%, -93.4%); 
    width: 29.5%;
    height: auto;
    z-index: 20;
}
.hervorhebung {
	font-weight: 600;
}

/*ANFANG Responsive Anpassung Kontakt und Impressum „Katze“*/
@media (max-width: 1600px) {
    .footer-image {
        width: 22%; /* Bildgröße Mobil */
        top: 0; /* Position anpassen */
		left: 60%;
    }
}
@media (max-width: 1200px) {
    .footer-image {
        width: 25%; /* Bildgröße Mobil */
        top: 0; /* Position anpassen */
		left: 57%;
    }
}
@media (max-width: 1024px) {
    .footer-image {
        width: 33%; /* Bildgröße Mobil */
        top: 0; /* Position anpassen */
		left: 55%;
    }
}
@media (max-width: 768px) {
    .footer-image {
        width: 46.5%; /* Bildgröße Mobil */
        top: 0; /* Position anpassen */
		left: 57%;
    }
}
/*@media (max-width: 575px) {*/
@media (max-width: 956px) {
    .footer-image {
		display: none;
        /*width: 85%;*/ /* Bildgröße Mobil */
        /*top: 0;*/ /* Position anpassen */
		/*left: 25%;*/
    }
}
/*ENDE Responsive Anpassung Kontakt und Impressum „Katze“*/

/*ANFANG Bereich Einblicke mit 12 Unterseiten*/
.grid-container-einblicke {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  padding-left: 0;
  padding-right: 0;
  max-width: 1920px;
  margin-top: 65px;
  padding-bottom: 12rem;
}
.box {
  margin-bottom: 2em;
  margin-right: 0;
  }
div.box.einblicke-nav-box {
	margin-right: 0;
	background-color: #ffe0b3;
	align-self: start;
	list-style-type: square;
	list-style-position: inside;
	font-size: 1.125rem;
	color: #000000;
	}
div.einblicke-nav-box h4 {
	padding-top: 1rem;
	margin-bottom: 0.5em;
	font-size: 1.25rem;
	line-height: 1.375;
}
.einblicke-nav-box ul {
	padding-bottom: 1rem;
	list-style-type: square;
	list-style-position: inside;
	line-height: 2;	
}
.einblicke-nav-box ul li a {
	text-decoration: none;
	color: #000000;
	transition: color 0.3s;
}
.einblicke-nav-box ul li a:visited {
		color: #000000;
	}
.einblicke-nav-box ul li a:hover {
		color: #4d70b8;
	}
.einblicke-nav-box ul li a.active {
		color: #4d70b8;
		font-weight: 600;
		font-size: 1.1875rem;
	}
.box img {
  margin: 0 auto;
  width: 100%;	
} 
.box h3 {
	color: #4d70b8;
}
.box p, .box h3, .box h5, .box figcaption, .einblicke-nav-box ul {
	 padding-left: 3.3%;
	 padding-right: 3.3%;
  }
.box.einblicke-einleitbild img {
	width: 100%; 
	} 
.box figcaption {
	margin-top: 0.5625rem;
	margin-bottom: 2rem;
	font-size: 1rem;
	font-weight: 600;
	}
.box.einblicke-statement img {
  width: 50%;
  max-width: 100%;
  position: relative;
  left: 0;
  right: 0;
  padding: 0;
  margin: 0;
}
.box.einblicke-statement p {
	font-size: 1.125rem;
	font-style: italic;
	font-weight: 400;
	margin-top: -0.25em;
	}
.box.einblicke-einleittext p {
	margin-top: -0.25em;
	font-size: 1.125rem;
	}
.box.einblicke-arbeitsbeispiel-text1 h3, 
.box.einblicke-arbeitsbeispiel-text2 h3,
.box.einblicke-arbeitsbeispiel-text3 h3,
.box.einblicke-arbeitsbeispiel-text4 h3,
.box.einblicke-arbeitsbeispiel-text5 h3 {
	margin-top: 3rem;
	margin-bottom: -0.5rem;
	}	
div.logotext p {
	 margin-top: 0.5625rem;
	 font-size: 1.125rem;
	}	
div.logotext h5 {
	 margin: 0;
	 font-size: 1.125rem;
	 font-weight: 600;
	}

/* Grid-areas für Einblicke Startseite */
@media (min-width: 1024px) {
	.grid-container-einblicke {
		grid-template-columns: repeat(12, 1fr);
		grid-template-areas: 
		"A A B B B B B C C C D D";
	}
	.einblicke-statement { grid-area: A; }
	.einblicke-einleittext { grid-area: B; }
	.einblicke-einleitbild { grid-area: C; }
	.einblicke-nav-box { grid-area: D; }
  
	.box {
		margin-bottom: 2em;
		margin-right: 3.8vw;
	}
	.einblicke-nav-box {
		position: sticky; 
		top: 65px;
		margin-right: 0; 
	}
	div.box.einblicke-nav-box {
		font-size: 1rem;
	}
	div.box.einblicke-nav-box ul {
		font-size: 1rem;
		line-height: 1.5;
	}
	div.logotext {
		margin: 0;
	}
	.box p, .box h3, .box h5, .box figcaption {
		padding-left: 0;
		padding-right: 0;
	}	
	div.box.einblicke-nav-box h4 {
		padding-top: 0.5rem;
		font-size: 1.125rem;
		line-height: 1.25;
	}
	.einblicke-nav-box ul li a.active {
		font-size: 1.0625rem;  
	}
	.box.einblicke-statement img {
		width: 100%;
		max-width: 100%;
		position: relative;
		left: 0;
		right: 0;
		padding: 0;
		margin: 0;
	}
	.box.einblicke-statement p {
		font-size: 1.0625rem;
		font-style: italic;
		font-weight: 400;
		padding-left: 25%;
		padding-right: 0;
	}
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
	.box.einblicke-statement p {
		font-size: 1.125rem;
	}
	.box.einblicke-einleittext p, 
	.box.einblicke-arbeitsbeispiel-text1 p,
	.box.einblicke-arbeitsbeispiel-text2 p,
	.box.einblicke-arbeitsbeispiel-text3 p, 
	.box.einblicke-arbeitsbeispiel-text4 p,
	.box.einblicke-arbeitsbeispiel-text5 p {
		font-size: 1.1875rem;
	}
	.box.einblicke-arbeitsbeispiel-text1 h3,
	.box.einblicke-arbeitsbeispiel-text2 h3,
	.box.einblicke-arbeitsbeispiel-text3 h3, 
	.box.einblicke-arbeitsbeispiel-text4 h3,
	.box.einblicke-arbeitsbeispiel-text5 h3 {
		font-size: 1.375rem;
	}	
	div.box.einblicke-nav-box ul {
		font-size: 1.1875rem;
	}	
	div.box.einblicke-nav-box h4 {
		font-size: 1.375rem;
	}
	.einblicke-nav-box ul li a.active {
		font-size: 1.25rem;  
	}
}
@media (min-width: 1024px) {
	.box.einblicke-statement p {
		font-size: 1rem;
	}
	.box.einblicke-einleittext p,
	.box.einblicke-arbeitsbeispiel-text1 p,
	.box.einblicke-arbeitsbeispiel-text2 p,
	.box.einblicke-arbeitsbeispiel-text3 p, 
	.box.einblicke-arbeitsbeispiel-text4 p,
	.box.einblicke-arbeitsbeispiel-text5 p {
		font-size: 1.125rem;
	}
	.box.einblicke-arbeitsbeispiel-text1 h3,
	.box.einblicke-arbeitsbeispiel-text2 h3,
	.box.einblicke-arbeitsbeispiel-text3 h3, 
	.box.einblicke-arbeitsbeispiel-text4 h3,
	.box.einblicke-arbeitsbeispiel-text5 h3 {
		font-size: 1.3125rem;
		padding-left: 0;
		padding-right: 0;
	}
	div.box.einblicke-nav-box {
		font-size: 1rem;
	}
	div.box.einblicke-nav-box ul {
		font-size: 1rem;
	}
}
@media (min-width: 1200px) {
	.box.einblicke-statement p {
		font-size: 1.125rem;
	}	
	.box.einblicke-einleittext p, 
	.box.einblicke-arbeitsbeispiel-text1 p,
	.box.einblicke-arbeitsbeispiel-text2 p,
	.box.einblicke-arbeitsbeispiel-text3 p, 
	.box.einblicke-arbeitsbeispiel-text4 p,
	.box.einblicke-arbeitsbeispiel-text5 p {
		font-size: 1.3125rem;
	}
	.box.einblicke-arbeitsbeispiel-text1 h3,
	.box.einblicke-arbeitsbeispiel-text2 h3,
	.box.einblicke-arbeitsbeispiel-text3 h3, 
	.box.einblicke-arbeitsbeispiel-text4 h3,
	.box.einblicke-arbeitsbeispiel-text5 h3 {
		font-size: 1.5rem;
	}
	div.box.einblicke-nav-box {
		font-size: 1.125rem;
	}
	div.box.einblicke-nav-box ul {
		font-size: 1.125rem;
	}	
	div.box.einblicke-nav-box h4 {
		font-size: 1.1875rem;
	}
	.einblicke-nav-box ul li a.active {
		font-size: 1.1875rem;  
	}
}
@media (min-width: 1600px) {
	.box.einblicke-statement p {
		font-size: 1.125rem;
	}
	.box.einblicke-einleittext p, 
	.box.einblicke-arbeitsbeispiel-text1 p,
	.box.einblicke-arbeitsbeispiel-text2 p,
	.box.einblicke-arbeitsbeispiel-text3 p, 
	.box.einblicke-arbeitsbeispiel-text4 p,
	.box.einblicke-arbeitsbeispiel-text5 p {
		font-size: 1.375rem;
	}
	.box.einblicke-arbeitsbeispiel-text1 h3,
	.box.einblicke-arbeitsbeispiel-text2 h3,
	.box.einblicke-arbeitsbeispiel-text3 h3, 
	.box.einblicke-arbeitsbeispiel-text4 h3,
	.box.einblicke-arbeitsbeispiel-text5 h3 {
		font-size: 1.625rem;
	}
	div.box.einblicke-nav-box {
		font-size: 1.125rem;
	}
	div.box.einblicke-nav-box ul {
		font-size: 1.125rem;
	}
}

@media (min-width: 1800px) {
	.box.einblicke-einleittext p, 
	.box.einblicke-arbeitsbeispiel-text1 p,
	.box.einblicke-arbeitsbeispiel-text2 p,
	.box.einblicke-arbeitsbeispiel-text3 p, 
	.box.einblicke-arbeitsbeispiel-text4 p,
	.box.einblicke-arbeitsbeispiel-text5 p {
		font-size: 1.625rem;
	}
	.box.einblicke-arbeitsbeispiel-text1 h3,
	.box.einblicke-arbeitsbeispiel-text2 h3,
	.box.einblicke-arbeitsbeispiel-text3 h3, 
	.box.einblicke-arbeitsbeispiel-text4 h3,
	.box.einblicke-arbeitsbeispiel-text5 h3 {
		font-size: 1.875rem;
	}
	div.box.einblicke-nav-box {
		font-size: 1.125rem;
	}
	div.box.einblicke-nav-box ul {
		font-size: 1.125rem;
	}
}
/*ENDE Bereich Einblicke mit 12 Unterseiten*/