/*
Theme Name: Trauerhilfe Heimkehr
Theme URI: http://www.vonhogendorf.de/
Description: Seitengestaltung von Hogendorf
Author: Michael Neubert-Zimmer
Author URI: http://vonhogendorf.de/
Version: 1.0
Tags: 

License:
License URI:

*/


/* ######################################################################################################################### */
/* Allgemeine Angaben */
/* ######################################################################################################################### */

:root {
	--weiss: rgb(255,255,255);
	--hauptlila-rgb: 129,62,116;
    --hauptlila: rgb(var(--hauptlila-rgb));
	
}

html,
body {
	min-height: 100vh;
}

body {
	background: linear-gradient(to bottom, rgba(129,62,116, 0.0) 60%, rgba(129,62,116, 0.25) 100%);

}

a {
	text-decoration: none;
}

@font-face {
	font-family: "LibreBaskerville-Bold";
	font-weight: 700;
	font-style: normal;
	src:url("fonts/LibreBaskerville-Bold.woff2") format("woff2");
}

@font-face {
	font-family: "LibreBaskerville-Regular";
	font-weight: 400;
	font-style: normal;
	src:url("fonts/LibreBaskerville-Regular.woff2") format("woff2");
}

@font-face {
	font-family: "LibreFranklin-Black";
	font-weight: 900;
	font-style: normal;
	src:url("fonts/LibreFranklin-Black.woff2") format("woff2");
}

@font-face {
	font-family: "LibreFranklin-Bold";
	font-weight: 700;
	font-style: normal;
	src:url("fonts/LibreFranklin-Bold.woff2") format("woff2");
}

@font-face {
	font-family: "LibreFranklin-Medium";
	font-weight: 500;
	font-style: normal;
	src:url("fonts/LibreFranklin-Medium.woff2") format("woff2");
}

@font-face {
	font-family: "LibreFranklin-Regular";
	font-weight: 400;
	font-style: normal;
	src:url("fonts/LibreFranklin-Regular.woff2") format("woff2");
}

@font-face {
	font-family: "LibreFranklin-Light";
	font-weight: 300;
	font-style: normal;
	src:url("fonts/LibreFranklin-Light.woff2") format("woff2");
}

@font-face {
	font-family: "LibreFranklin-Thin";
	font-weight: 100;
	font-style: normal;
	src:url("fonts/LibreFranklin-Thin.woff2") format("woff2");
}

@font-face {
	font-family: "Ambiance-BT-Regular";
	font-weight: 400;
	font-style: normal;
	src:url("fonts/Ambiance-BT-Regular.woff2") format("woff2");
}

main {
	width: 1400px;
	height: auto;
	padding: 0;
	margin: 0 auto;
}

.glass {
	width: 100%;
	height: auto;
	margin: 0;
	padding: 0;
	background:
		linear-gradient(
			60deg,
			rgba(255, 255, 255, 0.20),
			rgba(255, 255, 255, 0.70)
		);
	box-shadow:
		0 8px 24px rgba(0, 0, 0, 0.0),
		inset 0 1px 4px rgba(255, 255, 255, 0.4);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
}

.glassrose {
	width: 100%;
	height: auto;
	margin: 0;
	padding: 0;
	background:
		linear-gradient(
			60deg,
			rgba(129,62,116, 0.10),
			rgba(129,62,116, 0.60)
		);
	box-shadow:
		0 8px 24px rgba(0, 0, 0, 0.0),
		inset 0 1px 4px rgba(255, 255, 255, 0.4);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
}

.glasssmoke {
	width: 100%;
	height: auto;
	margin: 0;
	padding: 0;
	background:
		linear-gradient(
			60deg,
			rgba(45, 8, 84, 0.20),
			rgba(45, 8, 84, 0.70)
		);
	box-shadow:
		0 8px 24px rgba(0, 0, 0, 0.0),
		inset 0 1px 4px rgba(255, 255, 255, 0.4);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
}

/* ######################################################################################################################### */
/* Navigation */
/* ######################################################################################################################### */

nav.menu-hauptnavigation-container {
	width: calc(100% - 300px);
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
}

nav.menu-hauptnavigation-container ul {
	width: 100%;
    height: auto;
    margin: 62px 0 0 0;
    padding: 0 0 0 0;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
	justify-content: flex-end;
}

nav.menu-hauptnavigation-container ul li {
	height: auto;
    margin: 0 0 0 5%;
    padding: 0 0 0 0;
    list-style-type: none;
}

nav.menu-hauptnavigation-container ul li a {
	display: block;
    box-sizing: border-box;
    width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    font: 500 0.95rem "LibreFranklin-Medium";
    color: var(--hauptlila);
    letter-spacing: 1px;
    text-align: left;
	text-shadow: -1px 1px 1px rgba(0,0,0, 0.2);
    transition: all 0.3s ease;
	
}

nav.menu-hauptnavigation-container ul li a:hover {
	font: 900 0.95rem "LibreFranklin-Black";
	text-shadow: 2px 2px 5px rgba(255,255,255, 0.9);
}

nav.menu-hauptnavigation-container ul li a:active {
	transform: scale(0.90);
}

/* ######################################################################################################################### */

nav.menu-footernavigation-container {
	width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
}

nav.menu-footernavigation-container ul {
	width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 16px;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
	justify-content:space-between;
}

nav.menu-footernavigation-container ul li {
	height: auto;
    margin: 0 0 8px 0;
    padding: 0 0 0 0;
	color: var(--weiss);
    list-style-type:square;
	opacity: 0.6;
}

nav.menu-footernavigation-container ul li a {
	display: block;
    box-sizing: border-box;
    width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    font: 300 0.85rem "LibreFranklin-Light";
    color: var(--weiss);
    letter-spacing: 0.5px;
    text-align: left;
    transition: all 0.5s ease-in-out;
}

nav.menu-footernavigation-container ul li a:hover {
	font: 700 0.9rem "LibreFranklin-Bold";
}

nav.menu-footernavigation-container ul li a:active {
	transform: scale(0.95);
}



/* ######################################################################################################################### */
/* Header */
/* ######################################################################################################################### */

.headernavigation {
	box-sizing: border-box;
	width: 100%;
    height: auto;
    margin: 0 auto;
    padding: 10px 0 10px 0;
    position: sticky;
    top: 0;
    z-index: 150;
	background: linear-gradient(185deg, rgba(255, 255, 255, 0.30), rgba(255, 255, 255, 0.80));
	backdrop-filter: blur(25px);
	-webkit-backdrop-filter: blur(25px);
	border: 1px solid rgba(255, 255, 255, 0.2);
	box-shadow: 0 8px 12px rgba(0, 0, 0, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.4);
}

.headernavigation main {
	display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
}

a.hauptlogo {
	position: relative;
    z-index: 20;
    width: 300px;
    height: 80px;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    background: url(img/hauptlogo.png) center no-repeat;
    background-size: cover;
}

header {
	width: 100%;
	height: 480px;
	margin: -100px 0 0 0;
	padding: 0 0 0 0;
	overflow: hidden;
    position: relative;
	z-index: 100;
	display: flex;
    justify-content: flex-end;
    align-items: flex-end;
	
	filter: drop-shadow(0 5px 8px rgba(0,0,0,0.5));
	
}

header.startheader {
	height: 700px;
}

/*
header.cat-leistungen {
	background: url(img/header_unterseite2.jpg) center/cover no-repeat;
	
}

header.archive-traueranzeige {
	background: url(img/header_unterseite2.jpg) center/cover no-repeat;
}

header.single-traueranzeige {
	background: url(img/header_unterseite2.jpg) center/cover no-repeat;
}

*/

header img{
	position: absolute;
	z-index: 10;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 10% 30%;
    transform: translate(-50%, -50%);

	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 100' preserveAspectRatio='none'%3E%3Cpath fill='white' d='M0 0 H1440 V92 C1120 115 360 75 0 88 Z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 100' preserveAspectRatio='none'%3E%3Cpath fill='white' d='M0 0 H1440 V92 C1120 115 360 75 0 88 Z'/%3E%3C/svg%3E");

    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;

    -webkit-mask-position: center;
    mask-position: center;

    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;

    -webkit-mask-mode: alpha;
    mask-mode: alpha;
}

header.page-nachhaltigkeit img {
	object-position: 70% 30%;
}

header.startheader img {
	object-position: 50% 50%;
}

header h1 {
	display: none;
}

header.startheader h1 {
	position: relative;
	box-sizing: border-box;
	display: block;
	z-index: 20;
	width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 50px 0;
    font: 400 4rem "LibreBaskerville-Regular";
    line-height: 1.1em;
    text-align: right;
	color: rgba(255,255,255,0.52);

	text-shadow:
		0 0 1px rgba(255,255,255,0.8),
		0 0 20px rgba(255,255,255,0.15),
		0 8px 24px rgba(0,0,0,0.2);
}


/* ######################################################################################################################### */
/* Startseite */
/* ######################################################################################################################### */

section.opener {
	display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 0rem 1.5rem;
    justify-content: space-around;
	margin: 100px 0 0 0;
	padding: 0 0 0 0;
}

section.opener h2{
	grid-column: 1 / -1;
	width: 100%;
    height: auto;
	margin: 0 0 80px 0;
	padding: 0 0 0 0;
	font: 400 4rem "LibreBaskerville-Regular";
    line-height: 1.1em;
    text-align: center;
	color: var(--hauptlila);
	text-shadow: -2px 2px 1px rgba(0, 0, 0, 0.1);
}

section.opener aside{
	grid-column: 2 / 6;
	box-sizing: border-box;
    width: 100%;
    height: auto;
	padding: 25px;
	background: linear-gradient(190deg, rgba(129, 62, 116, 0.10), rgba(129, 62, 116, 0.20));
	box-shadow: -2px 2px 4px rgba(0, 0, 0, 0.2), inset 0 1px 4px rgba(255, 255, 255, 0.0);
	border-radius: 8px;
	border: solid 0px var(--weiss);
}


section.opener aside h3,
section.hauptinhalt aside h3,
section.traueranzeigen aside h3 {
	width: 100%;
    height: auto;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	font: 700 1.6rem "LibreFranklin-Bold";
	color: rgba(var(--hauptlila-rgb) , 0.8);
}

section.opener aside div p,
section.hauptinhalt aside p,
section.traueranzeigen aside p{
	width: 100%;
    height: auto;
	margin: 10px 0 0 0;
	padding: 0 0 0 0;
	font: 400 1rem "LibreFranklin-Regular";
	color: rgba(var(--hauptlila-rgb) , 0.7);
	line-height: 1.2em;
}

@keyframes pulse {
	0%, 100% {
		transform: scale(1);
	}

	50% {
		transform: scale(1.04);
	}
}
section.opener aside div a,
section.hauptinhalt aside div a {
	animation: pulse 2.2s ease-in-out infinite;
	transform-origin: center;
}

section.opener aside div a,
section.hauptinhalt aside div a,
section.traueranzeigen .anzeigenbereich article .beitrag a,
section.finanzierung main article a,
section.kristall article a {
	display: block;
	box-sizing: border-box;
	width:fit-content;
    height: auto;
	margin: 25px 0 0 0;
	padding: 10px 20px;
	font: 700 1.1rem "LibreFranklin-Bold";
	line-height: 1rem;
	letter-spacing: 0.5px;
	text-shadow: -1px 1px 1px rgba(0, 0, 0, 0.1);
	color: var(--weiss);
	background:
		linear-gradient(
			135deg,
			rgba(255,255,255,0.22) 0%,
			rgba(255,255,255,0.06) 32%,
			rgba(129,62,116,1) 55%,
			rgba(86,36,78,1) 100%
		),
		rgb(129, 62, 116);
	box-shadow:inset 0 -3px 1px rgba(255,255,255,0.25);
	border-radius: 6px;
	opacity: 0.8;
	transition: all 0.3s ease-in-out;
	cursor: pointer;
	
}

section.opener aside div a::before,
section.hauptinhalt aside div a::before {
	display: inline-block;
    content: "\2706"; /* entspricht ✆ */
    font-size: 2em;
    margin: -1px 5px 0 0;
    vertical-align: top;
}



section.opener aside div a:hover,
section.hauptinhalt aside div a:hover,
section.traueranzeigen .anzeigenbereich article .beitrag a:hover,
section.finanzierung main article a:hover,
section.kristall article a:hover {
	opacity: 1;
	cursor: pointer;
	box-shadow:inset 0 -3px 1px rgba(255,255,255,0.25), -1px 1px 5px rgba(0, 0, 0, 0.4);
}

section.opener aside div a:active,
section.hauptinhalt aside div a:active,
section.traueranzeigen .anzeigenbereich article .beitrag a:active,
section.finanzierung main article a:active,
section.kristall article a:active {
	transform: scale(0.90);
}

section.opener article{
	grid-column: 7 / 12;
    width: 100%;
    height: auto;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
}

section.opener article p,
section.hauptinhalt article p,
section.checkliste article p,
section.finanzierung main article p {
	width: 100%;
    height: auto;
	margin: 0 0 20px 0;
	padding: 0 0 0 0;
	font: 300 1.2rem "LibreFranklin-Light";
	color: rgba(var(--hauptlila-rgb) , 1);
	line-height: 1.4em;
}
section.opener article p strong,
section.hauptinhalt article p strong,
section.checkliste article p strong {
	font: 500 1.2rem "LibreFranklin-Medium";
}

section.hauptinhalt article p a {
	font: 500 1.2rem "LibreFranklin-Medium";
	opacity: 1;
	transition: all 0.3s ease-in-out;
	cursor: pointer;
	color: rgba(var(--hauptlila-rgb) , 1);
	text-decoration: none;
}

section.hauptinhalt article p a:hover {
	opacity: 0.6;
}

section.opener article h3,
section.hauptinhalt article h3 {
	display: block;
	width: 100%;
    height: auto;
	margin: 30px 0 15px 0;
	padding: 0 0 0 0;
	font: 700 1.6rem "LibreFranklin-Bold";
	color: rgba(var(--hauptlila-rgb) , 1);
}

section.opener article h4,
section.hauptinhalt article h4 {
	width: 100%;
    height: auto;
	margin: 10px 0 10px 0;
	padding: 0 0 0 0;
	font: 500 1.5rem "LibreFranklin-Medium";
	color: rgba(var(--hauptlila-rgb) , 1);
}

section.opener article h4.handschrift,
section.hauptinhalt article h4.handschrift {
	width: 100%;
    height: auto;
	margin: 50px 0 10px 0;
	padding: 0 0 0 0;
	font: 400 3.2rem "Ambiance-BT-Regular";
	line-height: 2.8rem;
	color: rgba(var(--hauptlila-rgb) , 1);
	transform: rotate(-3deg);
}

section.opener article h5,
section.hauptinhalt article h5 {
	width: 100%;
    height: auto;
	margin: 10px 0 10px 0;
	padding: 0 0 0 0;
	font: 500 1.2rem "LibreFranklin-Medium";
	color: rgba(var(--hauptlila-rgb) , 1);
}

section.opener article ul,
section.hauptinhalt article ul {
	width: 100%;
    height: auto;
	margin: 0 0 30px 0;
}

section.opener article ul li,
section.hauptinhalt article ul li{
	font: 400 1.2rem "LibreFranklin-Regular";
	color: rgba(var(--hauptlila-rgb) , 0.9);
	line-height: 1.4em;
}

.startseitengruppe {
	grid-column: 3 / 11;
	width: 100%;
    height: 450px;
	margin: 100px 0 0 0;
	padding: 0 0 0 0;
	background: url(img/Gruppenbild.png) 50% 28% / cover no-repeat;
}



p img.size-full {
	box-sizing: border-box;
    
    margin: 0 0 25px 0;
    padding: 0 0 0 0;
    position: relative;
    overflow: hidden;
    box-shadow: -2px 2px 8px rgba(0, 0, 0, 0.1), inset 0 1px 4px rgba(255, 255, 255, 0.4);
    border-radius: 6px;
}

/* ######################################################################################################################### */


section.testimonials {
	width: 100%;
    height: auto;
	margin: 0 0 150px 0;
	padding: 0 0 0 0;
	background: url(img/hg_vertrauen.jpg) center/cover no-repeat;
	
}

section.testimonials main {
	display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 0rem 1.5rem;
    justify-content: space-around;
	padding: 80px 0 100px 0;
}

section.testimonials h2,
section.checkliste h2,
section.leistungen h2,
section.leistungen_allg h2,
section.team h2,
section.trauerkerzen h2,
section.highlight h2,
section.finanzierung h2,
section.team_gallerie h2 {
	grid-column: 1 / -1;
	width: 100%;
    height: auto;
	margin: 0 0 60px 0;
	padding: 0 0 0 0;
	font: 400 3.6rem "LibreBaskerville-Regular";
    line-height: 1.1em;
    text-align: center;
	color: var(--weiss);
	text-shadow: -2px 2px 1px rgba(0, 0, 0, 0.1);
	-webkit-hyphens: auto;
    hyphens: auto;
    text-wrap: pretty;
    overflow-wrap: break-word;
}

section.testimonials aside {
	grid-column: 2 / 8;
	box-sizing: border-box;
    width: 100%;
}

.testimonial_rotator_wrap {
	box-sizing: border-box;
    margin: 0 !important;
    padding: 0 40px 0 40px !important;
	height: auto !important;
    overflow: hidden;
    position: relative;
}

.testimonial_rotator.template-twopigs .testimonial_rotator_slide_inner {
	width: 100% !important; 
    float:unset !important;
    padding: 0 !important;
	margin: 0 0 25px 0;
}

.testimonial_rotator_description {
	box-sizing: border-box;
	padding: 25px 30px 30px 30px;
	background:
		linear-gradient(
			175deg,
			rgba(255, 255, 255, 0.50),
			rgba(255, 255, 255, 0.80)
		);
	box-shadow:
		0 8px 12px rgba(0, 0, 0, 0.3),
		inset 0 1px 4px rgba(255, 255, 255, 0.8);
	border-radius: 8px;
}

h2.testimonial_rotator_slide_title {
	margin: 0 0 0 0 !important;
	padding: 0 0 0 0 !important;
	font: 400 2.2rem "LibreBaskerville-Regular" !important;
	line-height: 1.2em !important;
    text-align: center;
	color: var(--hauptlila) !important;
	text-shadow: -2px 2px 1px rgba(0, 0, 0, 0.1);
}

.testimonial_rotator_quote {
	width: 100%;
    height: auto;
	margin: 25px 0 0 0 !important;
	padding: 0 0 0 0 !important;
	font: 400 1rem "LibreFranklin-Regular" !important;
	color: var(--hauptlila) !important;
	line-height: 1.4em !important;
	text-shadow: -1px 1px 1px rgba(0, 0, 0, 0.2);
}

.testimonial_rotator_author_info {
	width: 100%;
    height: auto;
	margin: 15px 0 0 0 !important;
	padding: 0 0 0 0 !important;
	font: 400 0.9rem "LibreFranklin-Regular" !important;
	color: var(--hauptlila) !important;
	line-height: 1em !important;
	text-shadow: -1px 1px 1px rgba(0, 0, 0, 0.2);
}

section.testimonials article {
	grid-column: 8 / 12;
    width: 100%;
    height: auto;
	margin: 0 0 0 20px;
	padding: 0 0 0 0;
}

section.testimonials article div {
	box-sizing: border-box;
    width: 100%;
    height: auto;
	padding: 20px;
	background:
		linear-gradient(
			60deg,
			rgba(255, 255, 255, 0.20),
			rgba(129, 62, 116, 0.70)
		);
	backdrop-filter: blur(25px) !important;
	-webkit-backdrop-filter: blur(25px);
	box-shadow:
		0 8px 12px rgba(0, 0, 0, 0.2),
		inset 0 1px 4px rgba(255, 255, 255, 0.4);
	border-radius: 12px;
}


.testimonial_rotator_prev, .testimonial_rotator_next {
	color: var(--weiss)!important;
	opacity: 0.7;
}

.testimonial_rotator_prev:hover, .testimonial_rotator_next:hover {
	opacity: 1;
}

.testimonial_rotator_prev:active, .testimonial_rotator_next:active {
	transform: scale(0.90);
}

section.testimonials article div p{
	width: 100%;
    height: auto;
	margin: 0 0 15px 0;
	padding: 0 0 0 0;
	font: 300 1.2rem "LibreFranklin-Light";
	color: var(--weiss);
	line-height: 1.2em;
}


/* ######################################################################################################################### */
/* Trauerfall */
/* ######################################################################################################################### */

section.hauptinhalt {
	width: 100%;
	height: auto;
	margin: 90px 0 200px 0;
	padding: 0 0 0 0;
}

section.hauptinhalt main{
	display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 0rem 1.5rem;
    justify-content: space-around;
	align-items: start;
}

section.hauptinhalt h2,
section.traueranzeigen h2{
	grid-column: 1 / -1;
	width: 100%;
    height: auto;
	margin: 0 0 50px 0;
	padding: 0 0 0 0;
	font: 400 4rem "LibreBaskerville-Regular";
    line-height: 1.1em;
    text-align: center;
	color: var(--hauptlila);
	text-shadow: -2px 2px 1px rgba(0, 0, 0, 0.1);
	-webkit-hyphens: auto;
    hyphens: auto;
    text-wrap: pretty;
    overflow-wrap: break-word;
}

section.hauptinhalt article {
	grid-column: 2 / 8;
    width: 100%;
    height: auto;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
}

section.hauptinhalt aside {
	grid-column: 9 / 12;
	box-sizing: border-box;
    width: 100%;
    height: auto;
	padding: 20px;
	margin: 0 0 20px 0;
	background: linear-gradient(190deg, rgba(129, 62, 116, 0.10), rgba(129, 62, 116, 0.20));
	box-shadow: -2px 2px 4px rgba(0, 0, 0, 0.2), inset 0 1px 4px rgba(255, 255, 255, 0.0);
	border-radius: 8px;
}


/* ######################################################################################################################### */

section.checkliste {
	width: 100%;
	height: auto;
	margin: 200px 0 100px 0;
	background: 
	linear-gradient(
            rgba(255,255,255,0.6),
            rgba(255,255,255,0.5)
        ),
	url(img/hg_checkliste.jpg) center/cover no-repeat;
	box-shadow: 0 5px 8px rgba(0, 0, 0, 0.1);
}

section.checkliste main{
	display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 1rem 1.5rem;
    justify-content: space-around;
	align-items: start;
	padding: 80px 0 100px 0;
}

section.checkliste article:nth-of-type(1) {
	grid-column: 2 / 7;
}

section.checkliste article:nth-of-type(2) {
	grid-column: 8 / -1;
	box-sizing: border-box;
	width: 100%;
    height: auto;
    margin: 0;
    padding: 20px;
	background: linear-gradient(175deg, rgba(255, 255, 255, 0.40), rgba(255, 255, 255, 0.80));
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1), inset 0 1px 4px rgba(255, 255, 255, 0.5);
    border-radius: 8px;
}

section.checkliste article:nth-of-type(3) {
	grid-column: 2 / 7;
	box-sizing: border-box;
	width: 100%;
    height: auto;
    margin: 0;
    padding: 20px;
	background: linear-gradient(175deg, rgba(255, 255, 255, 0.20), rgba(255, 255, 255, 0.60));
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1), inset 0 1px 4px rgba(255, 255, 255, 0.5);
    border-radius: 8px;
}

section.checkliste article h3 {
	display: block;
    width: 100%;
    height: auto;
    margin: 0 0 15px 0;
    padding: 0 0 0 0;
    font: 700 1.8rem "LibreFranklin-Bold";
    color: rgba(var(--hauptlila-rgb), 1);
	text-shadow: -1px 1px 1px rgba(0, 0, 0, 0.1);
}

section.checkliste article:nth-of-type(1) h3{
	display: none;
}

section.checkliste article ul {
	width: 100%;
    height: auto;
    margin: 0 0 20px 0;
    padding: 0 0 0 0;
}

section.checkliste article ul li {
	display: flex;
    align-items: flex-start;
    gap: 1rem;
	box-sizing: border-box;
	width: 100%;
    height: auto;
    min-height: 19px;
    margin: 0 0 1.25rem 0;
    padding: 10px 20px 10px 10px;
    color: var(--weiss);
    font: 700 1.1rem "LibreFranklin-Bold";
    line-height: 1.6;
    text-align: left;
	letter-spacing: 0.5px;
	background: linear-gradient(60deg, rgba(129, 62, 116, 0.35), rgba(129, 62, 116, 0.75));
    backdrop-filter: blur(25px) !important;
    -webkit-backdrop-filter: blur(25px);
    box-shadow: -2px 2px 8px rgba(0, 0, 0, 0.1), inset 0 1px 4px rgba(255, 255, 255, 0.4);
    border-radius: 8px;
	text-shadow: -1px 1px 1px rgba(0, 0, 0, 0.2);
}

section.checkliste article ul li .check {
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    border: 2px solid var(--weiss);
    border-radius: 4px;
    margin-top: 0.2em;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1), inset 0 1px 4px rgba(255, 255, 255, 0.4);
}

.sdm_download_link a {
	display: block;
	box-sizing: border-box;
	width:fit-content;
    height: auto;
	margin: 25px 0 0 0 !important;
	padding: 10px 20px !important;
	font: 700 1.1rem "LibreFranklin-Bold"!important;
	letter-spacing: 0.5px;
	text-shadow: -1px 1px 1px rgba(0, 0, 0, 0.1)!important;
	color: var(--weiss) !important;
	background:
		linear-gradient(
			135deg,
			rgba(255,255,255,0.22) 0%,
			rgba(255,255,255,0.06) 32%,
			rgba(129,62,116,1) 55%,
			rgba(86,36,78,1) 100%
		),
		rgb(129, 62, 116) !important;
	box-shadow:inset 0 -3px 1px rgba(255,255,255,0.25)!important;
	border-radius: 6px;
	opacity: 0.8;
	border: solid 0px var(--weiss) !important;
	transition: all 0.3s ease-in-out;
}

.sdm_download_link a:hover {
	cursor: pointer;
	opacity: 1;
	box-shadow:inset 0 -3px 1px rgba(255,255,255,0.25), -1px 1px 5px rgba(0, 0, 0, 0.4)!important;


}

.sdm_download_link a:active {
	transform: scale(0.95);
}


/* ######################################################################################################################### */
/* Leistungen */
/* ######################################################################################################################### */


section.highlight {
	width: 100%;
	height: auto;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: 50% 40%;
}

section.highlight-1 {
	margin: 200px 0 0 0;
	padding: 0 0 100px 0;
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120' preserveAspectRatio='none'%3E%3Cpath fill='white' d='M0 0 H1440 V94 C1100 108 400 82 0 90 Z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120' preserveAspectRatio='none'%3E%3Cpath fill='white' d='M0 0 H1440 V94 C1100 108 400 82 0 90 Z'/%3E%3C/svg%3E");

    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;

    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
}

section.highlight-2 {
	margin: -200px 0 100px 0;
	padding: 120px 0 0 0;
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120' preserveAspectRatio='none'%3E%3Cpath fill='white' d='M0 30 C400 22 1100 48 1440 34 L1440 120 L0 120 Z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120' preserveAspectRatio='none'%3E%3Cpath fill='white' d='M0 30 C400 22 1100 48 1440 34 L1440 120 L0 120 Z'/%3E%3C/svg%3E");

	-webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;

    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
}

section.highlight h2 {
	/* Oben bei den anderen */
	margin: 0 0 0 0;
	text-shadow: -2px 2px 3px rgba(0, 0, 0, 0.5)
}

section.highlight-2 h2{
	display: none;
}



section.highlight main {
	display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 2.5rem 1.5rem;
    justify-content: space-around;
	padding: 60px 0 100px 0;
}

section.highlight article {
	grid-column: 7 / -1;
	box-sizing: border-box;
	width: 100%;
    height: auto;
    margin: 0;
    padding: 30px 20px 30px 20px;
	background: linear-gradient(175deg, rgba(41, 59, 32, 0.60), rgba(41, 59, 32, 0.80));
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1), inset 0 1px 4px rgba(255, 255, 255, 0.5);
	backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-radius: 8px;
	transition: all 0.5s ease-in-out;
}

section.highlight-2 article {
	grid-column: 1 / 7;
}

section.highlight article .beitrag {
	box-sizing: border-box;
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0 0 0 20px;
    border-left: solid 3px var(--weiss);
}

section.highlight article .beitrag h3 {
	width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    font: 700 2.1rem "LibreFranklin-Bold";
	line-height: 2.2rem;
    color: var(--weiss);
	letter-spacing: 0.5px;
	text-shadow: -2px 2px 1px rgba(0, 0, 0, 0.1);
	opacity: 0.9;
}

section.highlight article .beitrag p{
	width: 100%;
    height: auto;
    margin: 10px 0 0 0;
    padding: 0 0 0 0;
    font: 400 0.9rem "LibreFranklin-Regular";
    color: var(--weiss);
    line-height: 1.4em;
	opacity: 0.7;
}

section.highlight article .beitrag p small{
	font: 300 0.8rem "LibreFranklin-Light";
	opacity: 0.7;
}

section.highlight article .beitrag .beitragsmeta{}

section.highlight article .beitrag .beitragsmeta h4{
	width: 100%;
    height: auto;
    margin: 30px 0 0 0;
    padding: 0 0 0 0;
    font: 700 1.2rem "LibreFranklin-Bold";
    color: var(--weiss);
	letter-spacing: 0.5px;
	text-shadow: -2px 2px 1px rgba(0, 0, 0, .1);
	opacity: 0.9;
}

/* ######################################################################################################################### */

section.leistungen {
	width: 100%;
	height: auto;
	margin: 0 0 100px 0;
}

section.leistungen main{
	display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 2rem 1.5rem;
    justify-content: space-around;
	padding: 0;
}

section.leistungen h2{
	/* Oben bei den anderen */
	color: var(--hauptlila);
}

section.leistungen article{
	grid-column: span 6;
	box-sizing: border-box;
	width: 100%;
    height: auto;
    margin: 0;
    padding: 20px;
	background: linear-gradient(200deg, rgba(129, 62, 116, 0.45), rgba(129, 62, 116, 0.60));
    box-shadow: -2px 2px 4px rgba(0, 0, 0, 0.2), inset 0 1px 2px rgba(255, 255, 255, 0.4);
    border-radius: 8px;
	transition: all 1s ease-in-out;
}

section.leistungen article:hover {
	transform: scale(1.05);
}

@property --accent {
    syntax: "<color>";
    inherits: false;
    initial-value: rgba(129, 62, 116, 0.6);
}

section.leistungen article:nth-of-type(1) {
	--accent: rgba(129, 62, 116, 0.6);
	background: linear-gradient(200deg, var(--accent), rgba(129, 62, 116, 0.75));
    box-shadow: -2px 2px 4px rgba(0, 0, 0, 0.4), inset 0 1px 2px rgba(255, 255, 255, 0.5);
	margin: 0 0 50px 0;
	animation: glow 4s ease-in-out infinite;
  	transition: all 1s ease;
}

section.leistungen article:nth-of-type(2) {
	--accent: rgba(129, 62, 116, 0.6);
	background: linear-gradient(200deg, var(--accent), rgba(129, 62, 116, 0.75));
    box-shadow: -2px 2px 4px rgba(0, 0, 0, 0.4), inset 0 1px 2px rgba(255, 255, 255, 0.5);
	margin: 0 0 50px 0;
	animation: glow 4s ease-in-out infinite;
	animation-delay: 2s;
  	transition: all 1s ease;
}

@keyframes glow {
    50% {
        --accent: rgba(129,62,116,.3);
		box-shadow: -2px 2px 6px rgba(0, 0, 0, 0.8), inset 0 1px 2px rgba(255, 255, 255, 0.5);
    }
}

section.leistungen article .beitrag {
	box-sizing: border-box;
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0 0 0 20px;
    border-left: solid 3px var(--weiss);
}

section.leistungen article .beitrag h3{
	width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    font: 700 2rem "LibreFranklin-Bold";
	line-height: 2.2rem;
    color: var(--weiss);
	letter-spacing: 0.5px;
	text-shadow: -2px 2px 1px rgba(0, 0, 0, 0.1);
	opacity: 1;
}
section.leistungen article:nth-of-type(1) .beitrag h3,
section.leistungen article:nth-of-type(2) .beitrag h3 {
	font: 700 2.2rem "LibreFranklin-Bold";
	line-height: 2.4rem;
}

section.leistungen article .beitrag p{
	width: 100%;
    height: auto;
    margin: 10px 0 0 0;
    padding: 0 0 0 0;
    font: 400 0.9rem "LibreFranklin-Regular";
    color: var(--weiss);
    line-height: 1.3em;
	opacity: 0.8;
}

section.leistungen article .beitrag p small{
	font: 300 0.8rem "LibreFranklin-Light";
	opacity: 0.7;
}

section.leistungen article .beitrag .beitragsmeta{}

section.leistungen article .beitrag .beitragsmeta h4{
	width: 100%;
    height: auto;
    margin: 30px 0 0 0;
    padding: 0 0 0 0;
    font: 700 1.2rem "LibreFranklin-Bold";
    color: var(--weiss);
	letter-spacing: 0.5px;
	text-shadow: -2px 2px 1px rgba(0, 0, 0, 0.1);
	opacity: 0.9;
}


/* ######################################################################################################################### */

section.finanzierung {
	width: 100%;
    height: auto;
    margin: 0 0 0 0;
    background: linear-gradient(rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0.5)), url(img/hg_checkliste.jpg) center / cover no-repeat;
    box-shadow: 0 5px 8px rgba(0, 0, 0, 0.1);
}

section.finanzierung main {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 1rem 1.5rem;
    justify-content: space-around;
    align-items: start;
    padding: 60px 0 80px 0;
}

section.finanzierung h2 {
	/* Siehe oben */
	margin: 0 0 20px 0;
}

section.finanzierung main article {
	grid-column: 4 / 10;
    box-sizing: border-box;
    width: 100%;
    height: auto;
    margin: 0;
    padding: 20px;
    background: linear-gradient(175deg, rgba(255, 255, 255, 0.40), rgba(255, 255, 255, 0.80));
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1), inset 0 1px 4px rgba(255, 255, 255, 0.5);
    border-radius: 8px;
}

section.finanzierung main article p {}


/* ######################################################################################################################### */


section.leistungen_allg {
	width: 100%;
	height: auto;
	margin: 100px 0 100px 0;
}

section.leistungen_allg main{
	display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 2rem 1.5rem;
    justify-content: space-around;
	
	padding: 80px 0 100px 0;
}

section.leistungen_allg h2{
	color: var(--hauptlila);
}

section.leistungen_allg aside {
	grid-column: span 6;
}

section.leistungen_allg aside h3{
	width: 100%;
    height: auto;
    margin: 0 0 25px 0;
    padding: 0 0 0 0;
    font: 700 1.6rem "LibreFranklin-Bold";
    color: var(--hauptlila);
	text-shadow: -1px 1px 1px rgba(0, 0, 0, 0.2);
}

section.leistungen_allg aside div{}

section.leistungen_allg aside div ul{
	width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
}

section.leistungen_allg aside div ul li{
	box-sizing: border-box;
    width: 100%;
    height: auto;
    min-height: 19px;
    margin: 0 0 1.25rem 0;
    padding: 10px 20px 10px 10px;
    color: var(--weiss);
    font: 500 1.1rem "LibreFranklin-Medium";
    line-height: 1.6;
    text-align: left;
    letter-spacing: 0.5px;
	list-style: square inside;
    background: linear-gradient(200deg, rgba(129, 62, 116, 0.50), rgba(129, 62, 116, 0.65));
	box-shadow: -2px 2px 4px rgba(0, 0, 0, 0.2), inset 0 1px 2px rgba(255, 255, 255, 0.4);
    border-radius: 8px;
    text-shadow: -1px 1px 1px rgba(0, 0, 0, 0.2);
}

/* ######################################################################################################################### */

section.kristall {
	width: 100%;
	height: auto;
	margin: 100px 0 100px 0;
}

section.kristall main{
	display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 2rem 1.5rem;
    justify-content: space-around;
}

section.kristall main aside{
	grid-column: 2 / 7;
}

section.kristall main aside .kristallbild {
	width: 100%;
	height: 300px;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    position: relative;
    overflow: hidden;
    box-shadow: -2px 2px 8px rgba(0, 0, 0, 0.1), inset 0 1px 4px rgba(255, 255, 255, 0.4);
    border-radius: 6px;
	background: url(img/kristallbild.png) center/cover no-repeat;
}

section.kristall article{
	grid-column: 7 / 12;
	box-sizing: border-box;
    width: 100%;
    height: auto;
    margin: 0;
    padding: 20px 40px 20px 20px;
    background: linear-gradient(200deg, rgba(0,0,0, 0.15), rgba(0,0,0, 0.40));
    box-shadow: -2px 2px 4px rgba(0, 0, 0, 0.2), inset 0 1px 2px rgba(255, 255, 255, 0.4);
    border-radius: 8px;
}

section.kristall article h3 {
    width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    font: 700 1.8rem "LibreFranklin-Bold";
    line-height: 2.5rem;
    color: var(--weiss);
    letter-spacing: 0.5px;
    text-shadow: -2px 2px 1px rgba(0, 0, 0, 0.1);
    opacity: 1;
}

section.kristall article h2 {
    width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    font: 700 2.3rem "LibreFranklin-Bold";
    line-height: 2.5rem;
    color: var(--weiss);
    letter-spacing: 0.5px;
    text-shadow: -2px 2px 1px rgba(0, 0, 0, 0.1);
    opacity: 1;
}

section.kristall article p {
    width: 100%;
    height: auto;
    margin: 10px 0 0 0;
    padding: 0 0 0 0;
    font: 400 1rem "LibreFranklin-Regular";
    color: var(--weiss);
    line-height: 1.4em;
    opacity: 0.8;
}

/* ######################################################################################################################### */
/* Galleriebereich der Leistungsseite */

section.leistungen_allg aside:nth-of-type(3) {
	grid-column: 1 / -1;
	margin: 100px 0 0 0;
}

section.leistungen_allg aside:nth-of-type(3) h3 {
	
}
section.leistungen_allg aside:nth-of-type(3) div.gallery {
	display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 2rem 1.5rem;
    justify-content: space-around;
}

section.leistungen_allg aside:nth-of-type(3) div.gallery br {
	display: none;
}

section.leistungen_allg aside:nth-of-type(3) div.gallery dl.gallery-item {
	width: 100% !important;
    height: auto !important;
    margin: 0 0 0 0 !important;
    padding: 0 0 0 0 !important;
}

.gallery .gallery-item .gallery-icon {
    box-sizing: border-box;
    width: 100%;
    height: 200px;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    position: relative;
    overflow: hidden;
    box-shadow: -2px 2px 8px rgba(0, 0, 0, 0.2), inset 0 1px 4px rgba(255, 255, 255, 0.6);
    border-radius: 6px;
	transition: all 0.5s ease-in-out;
}

.gallery .gallery-item .gallery-icon::after {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(129, 62, 116, 0.2);
    mix-blend-mode: color;
    pointer-events: none;
}

.gallery .gallery-item .gallery-icon:hover {
	cursor: pointer;
	transform: scale(1.05);
}

.gallery .gallery-item .gallery-icon:active {
	transform: scale(0.95);
}

.gallery .gallery-item .gallery-icon a img {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: translate(-50%, -50%);
	filter: grayscale(30%);
}




/* ######################################################################################################################### */
/* Über uns Seite */
/* ######################################################################################################################### */

.urkunde {
	width: 100%;
    height: 450px;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	background: url(img/urkunde.jpg) center/cover no-repeat;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1), inset 0 1px 4px rgba(255, 255, 255, 0.5);
	border-radius: 8px;
}

section.team {
	width: 100%;
	height: auto;
	margin: 200px 0 100px 0;
	background: 
	linear-gradient(
            rgba(0,0,0,0.6),
            rgba(0,0,0,0.5)
        ),
	url(img/hg_checkliste.jpg) center/cover no-repeat;
	box-shadow: 0 5px 8px rgba(0, 0, 0, 0.1);
}

section.team main{
	display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 0 1.5rem;
    justify-content: space-around;
	padding: 60px 0 100px 0;
}

section.team h2{
	/* Oben bei den anderen */
	margin: 0 0 0 0;
}

section.team h3 {
	grid-column: 1 / -1;
	width: 100%;
    height: auto;
	margin: 0 0 60px 0;
	padding: 0 0 0 0;
	font: 400 2rem "LibreBaskerville-Regular";
    line-height: 1.1em;
    text-align: center;
	color: var(--weiss);
	opacity: 0.8;
	text-shadow: -2px 2px 1px rgba(0, 0, 0, 0.1);
}

section.team .gruppenfoto {
	grid-column: 1 / -1;
	width: 100%;
    height: 450px;
	margin: 25px 0 100px 0;
	padding: 0 0 0 0;
	background: url(img/GruppenBild.jpg) center/cover no-repeat;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1), inset 0 1px 4px rgba(255, 255, 255, 0.5);
	border-radius: 8px;
}

section.team article {
	box-sizing: border-box;
	grid-column: span 4;
	width: 100%;
    height: auto;
    margin: 0;
    padding: 20px 20px 35px 20px;
    background: linear-gradient(175deg, rgba(255, 255, 255, 0.40), rgba(255, 255, 255, 0.80));
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1), inset 0 1px 4px rgba(255, 255, 255, 0.5);
    border-radius: 8px;
}

section.team article .mitarbeiter .mitarbeiterfoto {
	box-sizing: border-box;
    width: 100%;
    height: 300px;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    position: relative;
	border-radius: 6px;
	overflow: hidden;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1), inset 0 1px 4px rgba(255, 255, 255, 0.5);
}

section.team article .mitarbeiter .mitarbeiterfoto img{
	position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: translate(-50%, -50%);
}

section.team article .mitarbeiter h3 {
	width: 100%;
    height: auto;
    margin: 15px 0 0 0;
    padding: 0 0 0 0;
    font: 700 1.9rem "LibreFranklin-Bold";
    line-height: 2.2rem;
    color: var(--hauptlila);
    letter-spacing: 0.5px;
	text-align: left;
    text-shadow: -2px 2px 1px rgba(0, 0, 0, 0.1);
    opacity: 0.9;
}

section.team article .mitarbeiter p {
	width: 100%;
    height: auto;
    margin: 8px 0 0 0;
    padding: 0 0 0 0;
    font: 400 0.9rem "LibreFranklin-Regular";
    color: var(--hauptlila);
    line-height: 1.2em;
    opacity: 0.9;
	text-shadow: -1px 1px 1px rgba(0, 0, 0, 0.1);
}

section.team aside {
	margin: 60px 0 0 0;
}

section.team aside:first-of-type {
	grid-column: 2 / 7;
}

section.team aside:last-of-type {
	grid-column: 7 / 12;
	padding: 20px;
	background: linear-gradient(60deg, rgba(129, 62, 116, 0.35), rgba(129, 62, 116, 0.75));
    backdrop-filter: blur(25px) !important;
    -webkit-backdrop-filter: blur(25px);
    box-shadow: -2px 2px 8px rgba(0, 0, 0, 0.1), inset 0 1px 4px rgba(255, 255, 255, 0.4);
    border-radius: 8px;
}

section.team aside p {
	width: 100%;
    height: auto;
    margin: 0 0 15px 0;
    padding: 0 0 0 0;
    font: 300 1.1rem "LibreFranklin-Light";
    color: var(--weiss);
    line-height: 1.2em;
}

section.team aside iframe {
	width: 100%;
    height: 300px;
	border-radius: 8px;
    overflow: hidden;
	box-shadow: -2px 2px 8px rgba(0, 0, 0, 0.1), inset 0 1px 4px rgba(255, 255, 255, 0.4);
}

section.team_gallerie {
	width: 100%;
    height: auto;
    margin: 0 0 200px 0;
}

section.team_gallerie h2{
	color: var(--hauptlila);
}


section.team_gallerie aside h3 {
	display: none;
}

section.team_gallerie aside div.gallery {
	display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 2rem 1.5rem;
    justify-content: space-around;
}

section.team_gallerie aside div.gallery br {
	display: none;
}

section.team_gallerie aside div.gallery dl.gallery-item {
	width: 100% !important;
    height: auto !important;
    margin: 0 0 0 0 !important;
    padding: 0 0 0 0 !important;
}


/* ######################################################################################################################### */
/* Traueranzeigen */
/* ######################################################################################################################### */

section.traueranzeigen {
	width: 100%;
    height: auto;
    margin: 90px 0 200px 0;
    padding: 0 0 0 0;
}

section.traueranzeigen main{
	display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 0 1.5rem;
    justify-content: space-around;
	align-items: start;
}

section.traueranzeigen .zentralerinnerung {
	grid-column: 4 / 10;
	box-sizing: border-box;
    width: 100%;
    height: auto;
	padding: 0;
	margin: 0 0 100px 0;
}

section.traueranzeigen .zentralerinnerung p {
	width: 100%;
    height: auto;
    margin: 0 0 20px 0;
    padding: 0 0 0 0;
    font: 300 1.2rem "LibreFranklin-Light";
    color: rgba(var(--hauptlila-rgb), 1);
    line-height: 1.4em;
	text-align: center;
}

section.traueranzeigen .anzeigenbereich {
	grid-column: 1 / -1;
	width: 100%;
    height: auto;
	margin: 0 0 0 0;
    padding: 0;
	display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 2rem 1.5rem;
    justify-content: space-around;
	/* align-items:flex-start; */
}

section.traueranzeigen .anzeigenbereich article {
	display: grid;
	box-sizing: border-box;
	width: 100%;
	height: auto;
    grid-template-columns: repeat(2, 1fr);
    gap: 0 1.5rem;
    justify-content: space-around;
	align-items: start;
	padding: 20px 20px 20px 20px;
    background: linear-gradient(200deg, rgba(129, 62, 116, 0.15), rgba(129, 62, 116, 0.35));
    box-shadow: -2px 2px 4px rgba(0, 0, 0, 0.2), inset 0 1px 2px rgba(255, 255, 255, 0.4);
    border-radius: 8px;
}

section.traueranzeigen .anzeigenbereich article .beitragsbild {
	position: relative;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    grid-column: span 1;
    width: 100%;
    min-width: 0;
    /* aspect-ratio: 4 / 5;*/
	height: auto;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    border-radius: 6px;
    overflow: hidden;
    transition: all 0.3s ease-in-out;
}

section.traueranzeigen .anzeigenbereich article .beitragsbild:hover {
	cursor: pointer;
	transform: scale(1.05);
}

section.traueranzeigen .anzeigenbereich article .beitragsbild:active {
	transform: scale(0.90);
}

section.traueranzeigen .anzeigenbereich article .beitragsbild::after {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(129,62,116,0.2);
    mix-blend-mode: color;
    pointer-events: none;
}

section.traueranzeigen .anzeigenbereich article .beitragsbild a {
	display: flex;
    align-items: flex-start;
    justify-content: center;
    width: 100%;
    height: 100%;
}

section.traueranzeigen .anzeigenbereich article .beitragsbild a img {
	display: block;
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
    filter: grayscale(100%);
	background: rgba(255, 255, 255, 0.25);
    box-shadow:
        -2px 2px 12px rgba(0, 0, 0, 0.2),
        inset 0 1px 4px rgba(255, 255, 255, 0.8);
}

section.traueranzeigen .anzeigenbereich article .beitrag {
	grid-column: span 1;
	width: 100%;
    height: auto;
	margin: 35px 0 0 0;
    padding: 0;
}

section.traueranzeigen .anzeigenbereich article .beitrag h2 {
	width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    font: 400 2.4rem "LibreBaskerville-Regular";
    line-height: 2.4rem;
    color: var(--hauptlila);
    letter-spacing: 0.5px;
    text-align: left;
    text-shadow: -2px 2px 1px rgba(0, 0, 0, 0.1);
    opacity: 0.9;
	-webkit-hyphens: auto;
    hyphens: auto;
    text-wrap: pretty;
    overflow-wrap: break-word;
}

section.traueranzeigen .anzeigenbereich article .beitrag h3 {
	width: 100%;
    height: auto;
    margin: 0 0 20px 0;
    padding: 0 0 0 0;
    font: 500 1rem "LibreFranklin-Medium";
    line-height: 2rem;
    color: var(--hauptlila);
    letter-spacing: 0.5px;
    text-align: left;
    text-shadow: -2px 2px 1px rgba(0, 0, 0, 0.1);
    opacity: 0.8;
}

section.traueranzeigen .anzeigenbereich article .beitrag p {
	width: 100%;
    height: auto;
    margin: 10px 0 0 0;
    padding: 0 0 0 0;
    font: 400 1rem "LibreFranklin-Regular";
    color: rgba(var(--hauptlila-rgb), 0.8);
    line-height: 1.2em;
}

section.traueranzeigen .anzeigenbereich article .beitrag p span {
	padding: 0 10px 0 0;
}

section.traueranzeigen .anzeigenbereich article .beitrag a {
	margin: 45px 0 0 0;
}


/* ######################################################################################################################### */

section.traueranzeige {}

section.traueranzeige h2 {
	margin: 0 0 0 0;
}

section.traueranzeige h4.geburtsname {
	grid-column: 1 / -1;
    width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    font: 400 2rem "LibreBaskerville-Regular";
    line-height: 1.1em;
    text-align: center;
    color: var(--hauptlila);
    text-shadow: -2px 2px 1px rgba(0, 0, 0, 0.1);
	opacity: 0.7;
}

section.traueranzeige p.lebensdaten {
	grid-column: 1 / -1;
    width: 100%;
    height: auto;
    margin: 25px 0 0 0;
    padding: 0 0 0 0;
    font: 500 1.2rem "LibreFranklin-Medium";
    line-height: 1.1em;
    text-align: center;
    color: var(--hauptlila);
    text-shadow: -2px 2px 1px rgba(0, 0, 0, 0.1);
}

section.traueranzeige p.lebensdaten span:first-of-type {
	
	margin: 0 20px 0 0;
}

section.traueranzeige article {
    grid-column: 4 / 10;
    width: 100%;
    height: auto;
    margin: 50px 0 0 0;
    padding: 0 0 0 0;
}

section.traueranzeige article div.anzeigenbild {
	width: 100%;
    height: auto;
	margin: 0 0 0 0;
    padding: 0;
	border-radius: 6px;
    overflow: hidden;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1), inset 0 1px 4px rgba(255, 255, 255, 0.5);
}

section.traueranzeige article div.anzeigenbild img{
	display: block;
    width: 100%;
    height: auto;
}
section.zuruck {
	width: 100%;
    height: 50px;
	margin: 0 0 100px 0;
    padding: 0;
}

.back-button {
    box-sizing: border-box;
    width: fit-content;
    height: auto;
    margin: 25px 0 0 0;
    padding: 10px 20px;
    font: 700 1.1rem "LibreFranklin-Bold";
    letter-spacing: 0.5px;
    text-shadow: -1px 1px 1px rgba(0, 0, 0, 0.1);
    color: var(--weiss);
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.22) 0%, rgba(255, 255, 255, 0.06) 32%, rgba(129, 62, 116, 1) 55%, rgba(86, 36, 78, 1) 100%), rgb(129, 62, 116);
    box-shadow: inset 0 -3px 1px rgba(255, 255, 255, 0.25);
    border-radius: 6px;
	border: solid 0px var(--weiss);
    opacity: 0.8;
    transition: all 0.3s ease-in-out;
    cursor: pointer;
}

.back-button:hover {
	opacity: 1;
	cursor: pointer;
	box-shadow:inset 0 -3px 1px rgba(255,255,255,0.25), -1px 1px 5px rgba(0, 0, 0, 0.4);
}

.back-button:active {
	transform: scale(0.90);
}

/* ######################################################################################################################### */

section.trauerkerzen {
	width: 100%;
	height: auto;
	margin: 200px 0 25px 0;
	background: 
	linear-gradient(
            rgba(0,0,0,0.6),
            rgba(0,0,0,0.5)
        ),
	url(img/hg_kerzen.jpg) center/cover no-repeat;
	box-shadow: 0 5px 8px rgba(0, 0, 0, 0.1);
}

section.trauerkerzen main{
	display: grid;
	grid-template-columns: repeat(12, 1fr);
	gap: 0 1.5rem;
	justify-content: space-around;
	align-items: start;
	padding: 80px 0 100px 0;
}

section.trauerkerzen h2 {}

.kerzenliste {
	grid-column: 1 / -1;
	display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 2rem;
}

.kerzenliste article.kerze {
	width: 100%;
	height: auto;
	margin: 0;
	padding: 15px 15px 20px 15px;
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 0 1.5rem;
	justify-content: space-around;
	align-items:center;
	flex: 0 0 calc((100% - 2 * 1.5rem) / 2);
    max-width: calc((100% - 2 * 1.5rem) / 2);
    box-sizing: border-box;
	background: linear-gradient(175deg, rgba(255, 255, 255, 0.20), rgba(255, 255, 255, 0.60));
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1), inset 0 1px 4px rgba(255, 255, 255, 0.5);
	border-radius: 8px;
}

.kerzenliste article.kerze h3.leer {
	grid-column: 1 /-1;
	width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    font: 400 1.2rem "LibreFranklin-Regular";
    line-height: 1.5rem;
	text-align: center;
    color: var(--weiss);
    letter-spacing: 0.5px;
    
    opacity: 0.7;
}

.kerzenliste article.kerze .kerzenbild {
	grid-column: span 1;
	width: 100px;
	height: 100px;
	margin: 0;
	padding: 0;
	background: url(img/Kerze_3.gif) center/cover no-repeat;
	border-radius: 6px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1), inset 0 1px 4px rgba(255, 255, 255, 0.5);
}

.kerzenliste article.kerze .kerzeninhalt {
	grid-column: span 4;
	width: 100%;
	height: auto;
	margin: 0;
	padding: 0;
}

.kerzenliste article.kerze .kerzeninhalt h3 {
	width: 100%;
    height: auto;
    margin: 0 0 10px 0;
    padding: 0 0 0 0;
    font: 700 1.9rem "LibreFranklin-Bold";
    line-height: 2.0rem;
    color: var(--weiss);
    letter-spacing: 0.5px;
    text-shadow: -2px 2px 1px rgba(0, 0, 0, .1);
    opacity: 0.9;
}

.kerzenliste article.kerze .kerzeninhalt h5 {
	width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    font: 300 0.8rem "LibreFranklin-Light";
    line-height: 1.0rem;
    color: var(--weiss);
    letter-spacing: 0.5px;
    text-shadow: -2px 2px 1px rgba(0, 0, 0, .1);
    opacity: 0.7;
}

.kerzenformular {
	grid-column: 4 / 10;
	display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0rem 2rem;
	width: 100%;
    height: auto;
    margin: 100px 0 0 0;
    padding: 0 0 0 0;
}

.kerzenformular h2 {
	width: 100%;
    height: auto;
    margin: 0 0 0 0 !important;
    padding: 0 0 0 0 !important;
    font: 700 2.2rem "LibreFranklin-Bold" !important;
    line-height: 2em;
    text-align: center;
    color: var(--weiss);
    text-shadow: -2px 2px 1px rgba(0, 0, 0, 0.1);
}

.dtk-notice-success {
	width: 100%;
    height: auto;
    margin: 0 0 60px 0;
    padding: 15px;
	font: 700 1rem "LibreFranklin-Bold";
    line-height: 2em;
    text-align: center;
    color: var(--weiss);
    background: linear-gradient(60deg, rgba(129, 62, 116, 0.35), rgba(129, 62, 116, 0.75));
    backdrop-filter: blur(25px) !important;
    -webkit-backdrop-filter: blur(25px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1), inset 0 1px 4px rgba(255, 255, 255, 0.5);
	border-radius: 8px;
}
.dtk-notice {
	width: 100%;
    height: auto;
    margin: 0 0 60px 0;
    padding: 15px;
	font: 700 1rem "LibreFranklin-Bold";
    line-height: 2em;
    text-align: center;
    color: var(--weiss);
    background: linear-gradient(60deg, rgba(129, 62, 116, 0.35), rgba(129, 62, 116, 0.75));
    backdrop-filter: blur(25px) !important;
    -webkit-backdrop-filter: blur(25px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1), inset 0 1px 4px rgba(255, 255, 255, 0.5);
	border-radius: 8px;
}

p.dtk-field label {
    font: 400 1rem "LibreFranklin-Regular";
    color: var(--weiss);
    line-height: 1.4rem;
}

p.dtk-field input {
box-sizing: border-box;
    width: 100%;
    height: auto;
    min-height: 50px;
    margin: 0 0 0 0;
    padding: 0 0 0 10px;
    font: 400 1rem "LibreFranklin-Regular";
    color: rgba(var(--hauptlila-rgb), 1);
    background: linear-gradient(60deg, rgba(255, 255, 255, 0.25), rgba(255, 255, 255, 0.75)) !important;
    border: solid 1px var(--weiss) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.0), inset 0 1px 4px rgba(255, 255, 255, 0.4);
    border-radius: 4px;
}

p.dtk-privacy label {
    font: 400 0.8rem "LibreFranklin-Regular";
    color: var(--weiss);
    line-height: 1.2rem;
	opacity: 0.7;
}

button.dtk-submit {
	box-sizing: border-box;
    width: fit-content;
    height: auto;
    margin: 25px 0 0 0;
    padding: 10px 20px;
    font: 700 1.1rem "LibreFranklin-Bold";
    letter-spacing: 0.5px;
    text-shadow: -1px 1px 1px rgba(0, 0, 0, 0.1);
    color: var(--weiss);
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.22) 0%, rgba(255, 255, 255, 0.06) 32%, rgba(129, 62, 116, 1) 55%, rgba(86, 36, 78, 1) 100%), rgb(129, 62, 116);
    box-shadow: inset 0 -3px 1px rgba(255, 255, 255, 0.25);
    border-radius: 6px;
	border: solid 0px var(--weiss);
    opacity: 0.8;
    transition: all 0.3s ease-in-out;
    cursor: pointer;
}

button.dtk-submit:hover {
	opacity: 1;
	cursor: pointer;
	box-shadow:inset 0 -3px 1px rgba(255,255,255,0.25), -1px 1px 5px rgba(0, 0, 0, 0.4);
}

button.dtk-submit:active {
	transform: scale(0.90);
}


/* ######################################################################################################################### */
/* Ratgeber */
/* ######################################################################################################################### */

section.ratgeberinhalt article {
    grid-column: 1 / 9;
}

section.ratgeberinhalt aside {
    grid-column: 10 / -1;
}


.faq-ratgeber-wrapper {
    width: 100%;
}

.faq-ratgeber-search {
    margin: 0 0 80px 0;
}

.faq-ratgeber-search input {
    box-sizing: border-box;
    width: 100%;
    height: auto;
    min-height: 50px;
    color: var(--hauptlila);
    margin: 0px;
    padding: 0px 0px 0px 10px;
    font:400 1rem "LibreFranklin-Regular";
    background: linear-gradient(200deg, rgba(129, 62, 116, 0.1), rgba(129, 62, 116, 0.2)) !important;
    border: solid 1px var(--weiss) !important;
    box-shadow: -1px 2px 4px rgba(0, 0, 0, 0.2), inset 0 1px 4px rgba(255, 255, 255, 0.4);
    border-radius: 4px;
}
.faq-ratgeber-search input::placeholder {
    font:400 1rem "LibreFranklin-Regular";
    color: var(--hauptlila);
}

.faq-ratgeber-list {
    display: grid;
    gap: 1rem 0rem;
}

.faq-ratgeber-item {
    background: linear-gradient(200deg, rgba(129, 62, 116, 0.45), rgba(129, 62, 116, 0.60));
    box-shadow: -2px 2px 4px rgba(0, 0, 0, 0.2), inset 0 1px 2px rgba(255, 255, 255, 0.4);
    border-radius: 8px;
    overflow:hidden;
    transition: all 0.3s ease-in-out;
}

.faq-ratgeber-item:hover{
    box-shadow:inset 0 -3px 1px rgba(255,255,255,0.25), -1px 1px 5px rgba(0, 0, 0, 0.4);
}

.faq-ratgeber-question{
    width:100%;
    padding:15px;
    background:transparent;
    border:0;
    display:flex;
    justify-content:space-between;
    align-items:center;
    cursor:pointer;
    color:var(--weiss);
    font:700 1.4rem "LibreFranklin-Bold";
    line-height:1.6;
    letter-spacing:.5px;
    text-align:left;
}

.faq-ratgeber-question:focus-visible{
    outline:2px solid rgba(255,255,255,.7);
    outline-offset:-2px;

}

.faq-ratgeber-icon{
    color:var(--weiss);
    font-size:2rem;
    font-weight:300;
    transition:.35s ease;
}

.faq-ratgeber-item.is-open .faq-ratgeber-icon{
    transform:rotate(45deg);
}

.faq-ratgeber-content{
    max-height:0;
    overflow:hidden;
    transition:max-height .35s ease;
    color:var(--weiss);
    padding:0 15px;

}

.faq-ratgeber-content p{
    color:var(--weiss) !important;
    font:400 1rem "LibreFranklin-Regular";
    line-height:1.8;
}

.faq-ratgeber-content>*:last-child{
    margin-bottom:24px;
}







/* ######################################################################################################################### */
/* Kontakt */
/* ######################################################################################################################### */

section#karte {
	margin: 0 0 0 0;
	box-shadow: 0 5px 8px rgba(0, 0, 0, 0.1);
}

section#karte .karte{
	width: 100%;
	height: 200px;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
}

section#karte .karte iframe {
	width: 100%!important;
	height: 200px!important;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	background-position: center;
    text-align: center;
    overflow: hidden !important;
}

/* ######################################################################################################################### */

section.kontakt {
	width: 100%;
	height: auto;
	margin: 0 0 0 0;
	padding: 80px 0 100px 0;
	
}

section.kontakt main{
	display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 0rem 1.5rem;
    justify-content: space-around;
}

section.kontakt h2 {
    grid-column: 1 / -1;
    width: 100%;
    height: auto;
    margin: 0 0 50px 0;
    padding: 0 0 0 0;
    font: 400 3rem "LibreBaskerville-Regular";
    line-height: 1.1em;
    text-align: left;
    color: var(--hauptlila);
    text-shadow: -2px 2px 1px rgba(0, 0, 0, 0.1);
}

section.kontakt aside {
	grid-column: 1 / 5;
   box-sizing: border-box;
    width: 100%;
    height: auto;
    padding: 25px;
    background: linear-gradient(190deg, rgba(129, 62, 116, 0.10), rgba(129, 62, 116, 0.20));
	box-shadow: -2px 2px 4px rgba(0, 0, 0, 0.2), inset 0 1px 4px rgba(255, 255, 255, 0.0);
	border-radius: 8px;
}

section.kontakt aside p {
	width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    font: 400 1.1rem "LibreFranklin-Regular";
    color: rgba(var(--hauptlila-rgb), 0.9);
    line-height: 1.4em;
}

section.kontakt aside p strong{
	font: 700 1.1rem "LibreFranklin-Bold";
}

section.kontakt aside div.trusted {
	margin: 35px 0 0 0;
}

section.kontakt aside div.trusted iframe {
	width: 100%;
    height: auto;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
}

section.kontakt article {
	grid-column: 6 / -1;
    width: 100%;
    height: auto;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
}

section.kontakt article .nf-form-title h3{
	display: none;
}

form div nf-fields-wrap {
	display: grid;
	grid-template-columns: repeat(2,1fr);
	gap: 1rem;
}

.nf-field-label {
	font: 400 1rem "LibreFranklin-Regular";
    color: rgba(var(--hauptlila-rgb), 0.9);
	line-height: 1.4rem;
}

form div nf-fields-wrap nf-field:nth-of-type(5),
form div nf-fields-wrap nf-field:nth-of-type(6){
	grid-column: 1 / -1;
}


#ninja_forms_required_items, .nf-field-container {
	clear: both;
    position: relative;
    margin-bottom: 0 !important;
}

.nf-form-fields-required {
	box-sizing: border-box;
	width: 100%;
	height: auto;
	margin: 0 0 40px 0;
	padding: 0 0 0 0;
	text-align: left;
	font: 400 0.9rem "LibreFranklin-Regular";
    color: rgba(var(--hauptlila-rgb), 0.9);
	line-height: 1rem;
}

.nf-form-fields-required span.ninja-forms-req-symbol {
	font: 400 1rem "LibreFranklin-Regular";
}

.nf-form-content .list-select-wrap .nf-field-element>div, .nf-form-content input:not([type=button]), .nf-form-content textarea {
	box-sizing: border-box;
	width: 100%;
    height: auto;
	min-height: 50px;
    margin: 0 0 0 0;
    padding: 0 0 0 10px;
    font: 400 1rem "LibreFranklin-Regular";
    color: rgba(var(--hauptlila-rgb), 1);
    background: linear-gradient(200deg, rgba(129, 62, 116, 0.1), rgba(129, 62, 116, 0.2))!important;
	border: solid 1px var(--weiss)!important;
    box-shadow: -1px 2px 4px rgba(0, 0, 0, 0.2), inset 0 1px 4px rgba(255, 255, 255, 0.4);
	border-radius: 4px;
}

.nf-form-content textarea {
	box-sizing: border-box;
	padding: 10px 0 0 10px;
}


.nf-form-content .list-select-wrap .nf-field-element>div::-webkit-input-placeholder,
.nf-form-content input:not([type=button])::-webkit-input-placeholder,
.nf-form-content textarea::-webkit-input-placeholder {
}

.nf-form-content .listselect-wrap .nf-field-element div, .nf-form-content input.ninja-forms-field, .nf-form-content select.ninja-forms-field:not([multiple]) {
	font: 400 1.1rem "LibreFranklin-Regular";
    color: rgba(var(--hauptlila-rgb), 0.9);
	line-height: 1.2rem;
}

.nf-form-content textarea.ninja-forms-field {
	font: 400 1.1rem "LibreFranklin-Regular";
    color: rgba(var(--hauptlila-rgb), 0.9);
	line-height: 1.2rem;
}

.checkbox-container.label-right .field-wrap {
	display: flex;
	justify-content:flex-start;
	flex-wrap:wrap;
}

nf-field:nth-of-type(7) .nf-field-label {
	font: 700 1.1rem "LibreFranklin-Bold";
    color: rgba(var(--hauptlila-rgb), 0.9);
    line-height: 1.3rem;
}

.label-right .nf-field-label {
	width: 88% !important;
}

input#nf-field-10 {
	box-shadow: 0px 0px 0px rgb(0,0,0,0.0);
}

.label-right .nf-field-description {
	width: 100%;
    margin: 5px 0 0 0 !important;
	font: 300 0.9rem "LibreFranklin-Light";
    color: rgba(var(--hauptlila-rgb), 0.9);
	line-height: 1.2rem;
}

.label-right .nf-field-description p {
}

.label-right .nf-field-description a{
	margin: 0 0 0 0 !important;
	font: 300 0.9rem "LibreFranklin-Light";
    color: rgba(var(--hauptlila-rgb), 0.9) !important;
}

.label-right .nf-field-description a:hover{
	font: 700 0.9rem "LibreFranklin-Bold";
    color: rgba(var(--hauptlila-rgb), 0.9)!important;
    margin: 0 0 0 0 !important;
}

.nf-error-msg, .ninja-forms-req-symbol {
	color: var(--hauptlila-rgb)!important;
	font-size: 1.4rem;
}

.nf-error .nf-error-msg {
	font: 400 0.9rem "Raleway-Regular";
    line-height: 1.5rem;
    color: var(--gold) !important;
	border-radius: 4px !important;
}

.nf-error-field-errors {
	font: 400 0.9rem "Raleway-Regular" !important;
    line-height: 1.5rem;
    color: var(--gold) !important;
}

.nf-form-content button, .nf-form-content input[type=button], .nf-form-content input[type=submit] {
	display: block;
	box-sizing: border-box;
	width:fit-content;
    height: auto;
	margin: 25px 0 0 0 !important;
	padding: 10px 20px !important;
	font: 700 1.1rem "LibreFranklin-Bold";
	letter-spacing: 0.5px;
	text-shadow: -1px 1px 1px rgba(0, 0, 0, 0.1);
	color: var(--weiss);
	background:
		linear-gradient(
			135deg,
			rgba(255,255,255,0.22) 0%,
			rgba(255,255,255,0.06) 32%,
			rgba(129,62,116,1) 55%,
			rgba(86,36,78,1) 100%
		),
		rgb(129, 62, 116) !important;
	box-shadow:inset 0 -3px 1px rgba(255,255,255,0.25);
	border-radius: 6px;
	opacity: 0.8;
	border: solid 0px var(--weiss) !important;
	transition: all 0.3s ease-in-out;
}

.nf-form-content button:hover, .nf-form-content input[type=button]:hover, .nf-form-content input[type=submit]:hover {
	cursor: pointer;
	opacity: 1;
	box-shadow:inset 0 -3px 1px rgba(255,255,255,0.25), -1px 1px 5px rgba(0, 0, 0, 0.4);


}

.nf-form-content button:active, .nf-form-content input[type=button]:active, .nf-form-content input[type=submit]:active {
	transform: scale(0.95);
}

label#nf-label-field-11{
	display: none;
}

div.nf-response-msg p {
	width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    font: 400 1.2rem "LibreFranklin-Regular";
    color: rgba(var(--hauptlila-rgb), 1);
    line-height: 1.5em;
}



/* ######################################################################################################################### */
/* Footer */
/* ######################################################################################################################### */

footer {
	width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 50px 0 100px 0;
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.22) 0%, rgba(255, 255, 255, 0.06) 32%, rgba(129, 62, 116, 1) 55%, rgba(86, 36, 78, 1) 100%), rgb(129, 62, 116);

	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120' preserveAspectRatio='none'%3E%3Cpath fill='white' d='M0 16 C360 28 1080 6 1440 18 L1440 120 L0 120 Z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120' preserveAspectRatio='none'%3E%3Cpath fill='white' d='M0 16 C360 28 1080 6 1440 18 L1440 120 L0 120 Z'/%3E%3C/svg%3E");

    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;

    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
}

footer main {
	display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 0rem 1.5rem;
    justify-content: space-around;
	padding: 100px 0 0 0;
}

footer .navplan {
	grid-column: 2 / 4;
}

footer .navplan h2 {
	width: 100%;
    height: auto;
    margin: 0 0 20px 0;
    padding: 0 0 5px 0;
    font: 500 1rem "LibreFranklin-Medium";
    color: var(--weiss);
    line-height: 1.2rem;
	opacity: 0.7;
	border-bottom: solid 1px rgba(255,255,255,0.5);
}

footer .geschaeftsangaben {
	grid-column: 5 / -1;
	display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0rem 1.5rem;
    justify-content: space-around;
	align-items: start;
	align-self: self-start;
}

footer .geschaeftsangaben h2 {
	grid-column: 1 / -1;
	width: 100%;
    height: auto;
    margin: 0 0 20px 0;
    padding: 0 0 5px 0;
    font: 500 1rem "LibreFranklin-Medium";
    color: var(--weiss);
    line-height: 1.2rem;
	opacity: 0.7;
	border-bottom: solid 1px rgba(255,255,255,0.5);
}

footer .geschaeftsangaben aside {
	opacity: 0.6;
}

footer .geschaeftsangaben aside h3{
	width: 100%;
    height: auto;
    margin: 0 0 5px 0;
    padding: 0 0 0 0;
    font: 700 0.8rem "LibreFranklin-Bold";
    color: var(--weiss);
    line-height: 1rem;
	letter-spacing: 0.3px;
}

footer .geschaeftsangaben aside div {}

footer .geschaeftsangaben aside div p{
	width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    font: 300 0.75rem "LibreFranklin-Light";
    color: var(--weiss);
    line-height: 1.1rem;
	letter-spacing: 0.3px;
}

footer .geschaeftsangaben aside div p span.icons {
	display: flex;
}


footer .geschaeftsangaben aside div p a {
    display: block;
    width: 30px;
    height: 30px;
	font: 300 0rem "LibreFranklin-Light";
	margin: 15px 10px 0 0;
	opacity: 0.8;
	transition: all 0.3s ease-in-out;
}

footer .geschaeftsangaben aside div p a:hover {
	opacity: 1;
}

footer .geschaeftsangaben aside div p a:active {
	transform: scale(0.90);
}

footer .geschaeftsangaben aside div p a.insta {
    background: url(img/Instagram_Glyph_White.png) center/cover no-repeat;
}

footer .geschaeftsangaben aside div p a.facebook {
    background: url(img/Facebook_Logo_Secondary.png) center/cover no-repeat;
}

footer .footerlogo {
	grid-column: 1 / -1;
	width: 100%;
    height: 80px;
    margin: 50px 0 0 0;
    padding: 0 0 0 0;
    background: url(img/footerlogo.png) center / contain no-repeat;
	opacity: 0.6;
}

/* ######################################################################################################################### */

.soforthilfe-call-button {
    display: inline-block;
    box-sizing: border-box;
	width:fit-content;
    height: auto;
	margin: 25px 0 0 0;
	padding: 10px 20px;
	font: 700 1.1rem "LibreFranklin-Bold";
	letter-spacing: 0.5px;
	text-shadow: -1px 1px 1px rgba(0, 0, 0, 0.1);
	color: var(--weiss);
	background:
		linear-gradient(
			135deg,
			rgba(255,255,255,0.22) 0%,
			rgba(255,255,255,0.06) 32%,
			rgba(129,62,116,1) 55%,
			rgba(86,36,78,1) 100%
		),
		rgb(129, 62, 116);
	box-shadow:inset 0 -3px 1px rgba(255,255,255,0.25);
	border-radius: 6px;
	opacity: 0.8;
	transition: all 0.3s ease-in-out;
}

.soforthilfe-modal {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.55);
    z-index: 9999;
    align-items: center;
    justify-content: center;
}

.soforthilfe-modal.active {
    display: flex;
}

.soforthilfe-modal-content {
	position: relative;
	box-sizing: border-box;
    width: min(90%, 480px);
    padding: 30px;
	background:
		linear-gradient(
			175deg,
			rgba(255, 255, 255, 0.80),
			rgba(255, 255, 255, 0.50)
		);
	box-shadow:
		0 8px 24px rgba(0, 0, 0, 0.1),
		inset 0 1px 4px rgba(255, 255, 255, 0.4);
	backdrop-filter: blur(25px) !important;
	-webkit-backdrop-filter: blur(25px);
    border-radius: 12px;
}

.soforthilfe-close {
    position: absolute;
    top: 12px;
    right: 16px;
    border: none;
    background: none;
    font-size: 28px;
    cursor: pointer;
	color: var(--weiss);
	transition: all 0.3s ease-in-out;
}

.soforthilfe-close:hover {
	color: var(--hauptlila);
	text-shadow: -2px 2px 1px rgba(0, 0, 0, 0.1);
}

.soforthilfe-close:active {
	transform: scale(0.95);
}

.soforthilfe-modal h3 {
	text-shadow: -1px 1px 1px rgba(0, 0, 0, 0.1);
}

.soforthilfe-modal p {
	text-shadow: -1px 1px 1px rgba(0, 0, 0, 0.1);
}

.soforthilfe-modal form {
	box-sizing: border-box;
	width: 100%;
	height: auto;
	margin: 15px 0 0 0;
	padding: 0 0 0 0;
}

.soforthilfe-modal input,
.soforthilfe-modal textarea {
    box-sizing: border-box;
	width: 100%;
    height: auto;
	min-height: 50px;
    margin: 0 0 10px 0;
    padding: 0 0 0 10px;
    font: 400 1rem "LibreFranklin-Regular";
    color: var(--hauptlila);
    background: linear-gradient(60deg, rgba(255, 255, 255, 0.25), rgba(255, 255, 255, 0.75))!important;
	border: solid 1px var(--weiss)!important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.0), inset 0 1px 4px rgba(255, 255, 255, 0.4);
	border-radius: 4px;
}

.soforthilfe-modal input::-webkit-input-placeholder {
	font: 400 1rem "LibreFranklin-Regular";
    color: rgba(var(--hauptlila-rgb), 1);
}

.soforthilfe-modal input:nth-of-type(2) {
	margin: 0 0 20px 0;
}

.soforthilfe-datenschutz {
	font: 300 0.8rem "LibreFranklin-Light";
    color: var(--hauptlila);
}

.soforthilfe-datenschutz a {
	display:inline-flex !important;
	margin: 0 !important;
	padding: 0 !important;
	background: none !important;
	font: 700 0.8rem "LibreFranklin-Bold" !important;
    color: var(--hauptlila) !important;
	box-shadow: none !important;
	animation: none !important;
}

.soforthilfe-datenschutz a::before {
	display: none !important;
}

.soforthilfe-datenschutz input {
    width: auto;
    margin-top: 4px;
}

.soforthilfe-datenschutz input[type="checkbox"] {
	height: auto !important;
	min-height: auto !important;
}

.soforthilfe-modal button[type="submit"] {
    display: block;
	box-sizing: border-box;
	width:fit-content;
    height: auto;
	margin: 25px 0 0 0 !important;
	padding: 10px 20px !important;
	font: 700 1.1rem "LibreFranklin-Bold";
	letter-spacing: 0.5px;
	text-shadow: -1px 1px 1px rgba(0, 0, 0, 0.1);
	color: var(--weiss);
	background:
		linear-gradient(
			135deg,
			rgba(255,255,255,0.22) 0%,
			rgba(255,255,255,0.06) 32%,
			rgba(129,62,116,1) 55%,
			rgba(86,36,78,1) 100%
		),
		rgb(129, 62, 116) !important;
	box-shadow:inset 0 -3px 1px rgba(255,255,255,0.25);
	border-radius: 6px;
	opacity: 0.8;
	border: solid 0px var(--weiss) !important;
	transition: all 0.3s ease-in-out;
    cursor: pointer;
	animation: pulse 2.2s ease-in-out infinite;
	transform-origin: center;
}

.soforthilfe-modal button[type="submit"]:hover {
	cursor: pointer;
	opacity: 1;
	box-shadow:inset 0 -3px 1px rgba(255,255,255,0.25), -1px 1px 5px rgba(0, 0, 0, 0.4);
}

.soforthilfe-modal button[type="submit"]:active {
	transform: scale(0.95);
}


/* ######################################################################################################################### */
/* Media */
/* ######################################################################################################################### */




@media only screen and (max-width: 1600px) {
	
}


/* ###################################################################################################################### 1400 */

@media only screen and (max-width: 1400px) {
	main {
		width: 96%;
		margin: 0 2% 0 2%;
	}
}


/* ###################################################################################################################### 1200 */

@media only screen and (max-width: 1200px) {
	
	.headernavigation main {
		flex-wrap: wrap;
	}

	a.hauptlogo {
		width: 300px;
		height: 80px;
		margin: 0 auto;
	}

	nav.menu-hauptnavigation-container {
		width: 100%;
	}

	nav.menu-hauptnavigation-container ul {
		width: 100%;
		height: auto;
		margin: 10px 0 0 0;
		padding: 0 0 0 0;
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		justify-content:space-between;
	}

	nav.menu-hauptnavigation-container ul li {
		height: auto;
		margin: 0 1% 0 1%;
		padding: 0 0 0 0;
		list-style-type: none;
	}

	section.opener aside {
		grid-column: 1 / 6;
	}

	section.opener article {
		grid-column: 7 / -1;
	}

	section.testimonials aside {
		grid-column: 1 / 8;
	}

	section.testimonials article {
		grid-column: 8 / -1;
		margin: 0;
	}

	section.checkliste article:nth-of-type(2) {
		grid-column: 7 / 12;
	}

	section.traueranzeigen .anzeigenbereich article .beitrag p {
		display: block;
	}
	section.traueranzeigen .anzeigenbereich article .beitrag p span {
		display: block;
		width: 100%;
		margin: 0 0 0 0;
	}

	section.traueranzeigen .anzeigenbereich article .beitragsbild {
		/*height: 280px;*/
	}

	section.team aside:first-of-type {
		grid-column: 2 / 7;
	}
	
	section.team aside:last-of-type {
		grid-column: 7 / 12;
	}

	.urkunde {
		width: 100%;
		height: 325px;
	}

	footer .navplan {
		grid-column: 1 / 3;
	}

	footer .geschaeftsangaben {
		grid-column: 4 / -1;
	}
}


/* ###################################################################################################################### 1000 */

@media only screen and (max-width: 1000px) {

	header.startheader {
		height: 600px;
	}

	header.startheader h1 {
		font: 400 3.5rem "LibreBaskerville-Regular";
	}

	aside.hotline p:first-of-type {
		font: 700 2rem "LibreFranklin-Bold";
	}

	aside.hotline p:last-of-type {
		font: 900 2rem "LibreFranklin-Black";
	}

	section.opener h2,
	section.hauptinhalt h2, 
	section.traueranzeigen h2  {
		font: 400 3.6rem "LibreBaskerville-Regular";
	}

	section.opener aside h3, 
	section.hauptinhalt aside h3, 
	section.traueranzeigen aside h3 {
		font: 700 1.5rem "LibreFranklin-Bold";
	}

	section.opener article p, 
	section.hauptinhalt article p, 
	section.checkliste article p,
	section.traueranzeigen .zentralerinnerung p,
	section.finanzierung main article p {
		font: 300 1.1rem "LibreFranklin-Light";
		line-height: 1.4rem;
	}

	section.opener article p strong, 
	section.hauptinhalt article p strong, 
	section.checkliste article p strong {
   	 	font: 500 1.1rem "LibreFranklin-Medium";
	}

	section.testimonials h2,
	section.checkliste h2,
	section.leistungen h2,
	section.leistungen_allg h2,
	section.team h2,
	section.trauerkerzen h2,
	section.highlight h2,
	section.finanzierung h2,
	section.team_gallerie h2 {
		font: 400 3.4rem "LibreBaskerville-Regular";
	}	

	section.hauptinhalt aside {
		grid-column: 8 / 12;
	}

	.startseitengruppe {
		grid-column: 2 / 12;
	}

	h2.testimonial_rotator_slide_title {
		font: 400 2.1rem "LibreBaskerville-Regular" !important;
	}

	section.testimonials article div p {
		font: 300 1.1rem "LibreFranklin-Light";
	}
	section.team .gruppenfoto {
		height: 350px;
	}

	section.team h3 {
		font: 400 1.8rem "LibreBaskerville-Regular";
	}

	section.team article .mitarbeiter h3 {
		font: 700 1.8rem "LibreFranklin-Bold";
	}

	section.team article .mitarbeiter p {
		font: 400 0.8rem "LibreFranklin-Regular";
	}

	.urkunde {
		width: 100%;
		height: 365px;
	}

	section.team aside {
        grid-column: 3 / 11;
	}

	section.team aside p {
		font: 300 1rem "LibreFranklin-Light";
	}

	section.highlight-1 article {
		grid-column: 6 / -1;
	}

	section.highlight-2 article {
		grid-column: 1 / 8;
	}

	section.kristall main aside {
		grid-column: 1 / 7;
	}

	section.kristall article {
		grid-column: 7 / -1;
	}

	section.leistungen article .beitrag h3,
	section.leistungen article:nth-of-type(1) .beitrag h3,
	section.leistungen article:nth-of-type(2) .beitrag h3,
	section.highlight article .beitrag h3 {
		font: 700 1.9rem "LibreFranklin-Bold";
		line-height: 2.1rem;
	}

	section.kristall article h3 {
		font: 700 1.2rem "LibreFranklin-Bold";
		line-height: 1.5rem;
	}
	
	section.kristall article h2 {
		font: 700 1.9rem "LibreFranklin-Bold";
		line-height: 2.1rem;
	}

	section.leistungen article .beitrag .beitragsmeta h4,
	section.highlight article .beitrag .beitragsmeta {
		font: 700 1.4rem "LibreFranklin-Bold";
	}

	section.traueranzeigen .zentralerinnerung {
		grid-column: 3 / 11;
	}

	section.traueranzeigen .anzeigenbereich article .beitragsbild {
		grid-column: span 2;
	}

	section.traueranzeigen .anzeigenbereich article .beitrag {
		grid-column: span 2;
		margin: 25px 0 0 0;
	}

	section.traueranzeigen .anzeigenbereich article .beitrag h2 {
		font: 400 2.2rem "LibreBaskerville-Regular";
		line-height: 2.2rem;
		text-align: center;
	}

	section.traueranzeigen .anzeigenbereich article .beitrag h3 {
		font: 500 1.1rem "LibreFranklin-Medium";
		text-align: center;
		line-height: 2rem;
	}

	section.traueranzeigen .anzeigenbereich article .beitrag p {
		font: 400 0.9rem "LibreFranklin-Regular";
		text-align: center;
		line-height: 1.1em;
		margin: 0 0 35px 0;
	}

	section.traueranzeigen .anzeigenbereich article .beitrag p span {
        margin: 0 0 8px 0;
    }

	section.traueranzeigen .anzeigenbereich article .beitrag a {
		margin: 0 auto;
	}

	section.kontakt h2 {
		font: 400 2.8rem "LibreBaskerville-Regular";
	}

	section.leistungen_allg aside h3 {
		font: 700 1.5rem "LibreFranklin-Bold";
	}

	section.leistungen_allg aside div ul li {
		font: 500 1rem "LibreFranklin-Medium";
		line-height: 1.5rem;
	}

	section.checkliste article ul li {
		font: 700 1rem "LibreFranklin-Bold";
		line-height: 1.5;
	}

	section.checkliste article h3 {
		font: 700 1.65rem "LibreFranklin-Bold";
	}

	section.traueranzeige h4.geburtsname {
		font: 400 1.8rem "LibreBaskerville-Regular";
	}

	section.traueranzeige p.lebensdaten {
		font: 500 1.1rem "LibreFranklin-Medium";
	}

	.kerzenliste article.kerze .kerzeninhalt h3 {
		font: 700 1.7rem "LibreFranklin-Bold";
		line-height: 2.0rem;
	}

	section.ratgeberinhalt article {
		grid-column: 2 / 12;
	}

	section.ratgeberinhalt aside {
        grid-column: 4 / 10;
		margin: 60px 0 0 0;
    }

	section.kontakt article {
		grid-column: 5 / -1;
	}

	footer main {
		gap: 1.5rem 1.5rem;
	}

}

/* ###################################################################################################################### 800 */

@media only screen and (max-width: 800px) {

	header.startheader {
		height: 500px;
	}

	header.startheader h1 {
		font: 400 3rem "LibreBaskerville-Regular";
	}

	aside.hotline p:first-of-type {
		font: 700 1.5rem "LibreFranklin-Bold";
	}

	aside.hotline p:last-of-type {
		font: 900 1.5rem "LibreFranklin-Black";
	}

	section.opener h2,
	section.hauptinhalt h2,
	section.traueranzeigen h2  {
		font: 400 3.2rem "LibreBaskerville-Regular";
	}

	section.opener aside h3, 
	section.hauptinhalt aside h3, 
	section.traueranzeigen aside h3 {
		font: 700 1.23rem "LibreFranklin-Bold";
	}

	section.opener aside div p,
	section.hauptinhalt aside p,
	section.traueranzeigen aside p {
		width: 100%;
		height: auto;
		margin: 10px 0 0 0;
		padding: 0 0 0 0;
		font: 400 0.95rem "LibreFranklin-Regular";
		color: rgba(var(--hauptlila-rgb), 0.7);
		line-height: 1.2em;
	}

	section.opener aside div a,
	section.hauptinhalt aside div a,
	section.traueranzeigen .anzeigenbereich article .beitrag a,
	section.finanzierung main article a,
	section.kristall article a{
		font: 700 1rem "LibreFranklin-Bold";
		line-height: 1rem;
	}

	.sdm_download_link a {
		font: 700 1rem "LibreFranklin-Bold" !important;
	}

	.nf-form-content button, .nf-form-content input[type=button], .nf-form-content input[type=submit] {
		font: 700 1rem "LibreFranklin-Bold" !important;
	}

	section.opener article p, 
	section.hauptinhalt article p, 
	section.checkliste article p,
	section.traueranzeigen .zentralerinnerung p,
	section.finanzierung main article p {
		font: 300 1rem "LibreFranklin-Light";
		line-height: 1.2rem;
	}

	section.opener article p strong, 
	section.hauptinhalt article p strong, 
	section.checkliste article p strong {
        font: 500 1rem "LibreFranklin-Medium";
		line-height: 1.2rem;
    }

	section.testimonials h2, 
	section.checkliste h2, 
	section.leistungen h2, 
	section.leistungen_allg h2, 
	section.team h2, 
	section.trauerkerzen h2,
	section.highlight h2,
	section.finanzierung h2,
	section.team_gallerie h2 {
		font: 400 3rem "LibreBaskerville-Regular";
	}

	section.opener article h4,
	section.hauptinhalt article h4 {
		margin: 10px 0 10px 0;
		font: 500 1.3rem "LibreFranklin-Medium";
	}

	section.opener article h4.handschrift,
	section.hauptinhalt article h4.handschrift {
		margin: 40px 0 10px 0;
		font: 400 2.8rem "Ambiance-BT-Regular";
		line-height: 2.2rem;
	}

	section.opener article h5,
	section.hauptinhalt article h5 {
		font: 500 1.05rem "LibreFranklin-Medium";
		color: rgba(var(--hauptlila-rgb) , 1);
	}

	.kerzenformular h2 {
		font: 700 2.1rem "LibreFranklin-Bold" !important;
		line-height: 2em;
	}

	.startseitengruppe {
		grid-column: 1 / -1;
	}

	h2.testimonial_rotator_slide_title {
		font: 400 1.9rem "LibreBaskerville-Regular" !important;
	}

	section.testimonials article div p {
		font: 300 1rem "LibreFranklin-Light";
	}

	section.team .gruppenfoto {
		margin: 25px 0 60px 0;
	}

	section.team h3 {
		font: 400 1.6rem "LibreBaskerville-Regular";
		margin: 0 0 25px 0;
	}

	section.team article .mitarbeiter h3 {
        font: 700 1.6rem "LibreFranklin-Bold";
    }

	section.team aside:first-of-type {
		grid-column: 1 / 7;
	}
	
	section.team aside:last-of-type {
		grid-column: 7 / -1;
	}


	section.team article {
		grid-column: 3 / 11;
		margin: 0 0 2rem 0;
	}

	.urkunde {
		width: 100%;
		height: 280px;
	}

	section.highlight-1 {
		background-position: 40% 40%;
		margin: 80px 0 0 0;
	}

	section.highlight-2 {
		background-position: 52% 40%;
		margin: -250px 0 100px 0;
	}

	section.leistungen article .beitrag h3,
	section.leistungen article:nth-of-type(1) .beitrag h3,
	section.leistungen article:nth-of-type(2) .beitrag h3,
	section.highlight article .beitrag h3 {
        font: 700 1.8rem "LibreFranklin-Bold";
        line-height: 2.0rem;
    }

	section.kristall article h3 {
		font: 700 1.1rem "LibreFranklin-Bold";
		line-height: 1.4rem;
	}
	
	section.kristall article h2 {
		font: 700 1.8rem "LibreFranklin-Bold";
		line-height: 2rem;
	}

	section.leistungen article .beitrag p,
	section.highlight article .beitrag p,
	section.kristall article p {
		font: 400 0.9rem "LibreFranklin-Regular";
		line-height: 1.2em;
	}

	section.leistungen article .beitrag .beitragsmeta h4,
	section.highlight article .beitrag .beitragsmeta h4 {
        font: 700 1.2rem "LibreFranklin-Bold";
    }

	section.finanzierung main article {
		grid-column: 3 / 11;
	}

	section.leistungen_allg {
		width: 100%;
		height: auto;
		margin: 100px 0 50px 0;
	}

	section.leistungen_allg main {
		padding: 40px 0 60px 0;
	}

	section.leistungen_allg aside h3 {
        font: 700 1.3rem LibreFranklin-Bold;
    }

	section.leistungen_allg aside:nth-of-type(3) div.gallery,
	section.team_gallerie aside div.gallery {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: 2rem 1.5rem;
		justify-content: space-around;
	}


	section.checkliste article:nth-of-type(1),
	section.checkliste article:nth-of-type(3)  {
		grid-column: 1 / 7;
	}

	section.checkliste article:nth-of-type(2) {
        grid-column: 7 / -1;
    }

	section.checkliste article h3 {
        font: 700 1.5rem "LibreFranklin-Bold";
    }

	section.checkliste article ul li .check {
		width: 12px;
		height: 12px;
		margin-top: 0em;
	}

	section.checkliste article ul li {
        font: 700 0.9rem "LibreFranklin-Bold";
        line-height: 1.2;
    }

	section.traueranzeigen .anzeigenbereich {
        grid-column: 1 / -1;
		margin: 0 0 50px 0;
    }

	section.traueranzeigen aside {
		grid-column: 2 / 12;
	}

	section.traueranzeige h4.geburtsname {
		font: 400 1.6rem "LibreBaskerville-Regular";
	}

	section.traueranzeige p.lebensdaten {
		font: 500 1rem "LibreFranklin-Medium";
		margin: 25px 0 50px 0;
	}

	.kerzenliste article.kerze {
		flex: 0 0 calc((100% - 2 * 1.5rem) / 1);
		max-width: calc((100% - 2 * 1.5rem) / 1);
	}

	.kerzenformular {
		grid-column: 2 / 12;
	}

	.faq-ratgeber-question {
		font: 700 1.3rem "LibreFranklin-Bold";
		line-height: 1.4rem;
	}

	section.kontakt h2 {
		font: 400 2.4rem "LibreBaskerville-Regular";
		grid-row: 1;
	}

	section.kontakt aside {
		grid-column: 2 / 12;
		grid-row: 3;
	}

	section.kontakt aside p {
		display: none;
	}

	section.kontakt aside div.trusted {
		margin: 0 0 0 0;
	}

	section.kontakt article {
        grid-column: 2 / 12;
		grid-row: 2;
		margin: 0 0 50px 0;
    }

	.nf-field-label {
		font: 400 0.9rem "LibreFranklin-Regular";
	}

	section.opener {
		margin: 70px 0 0 0;
	}

	section.testimonials main {
		padding: 60px 0 80px 0;
	}
	
	section.testimonials aside {
        grid-column: 1 / -1;
    }

	section.testimonials article {
        grid-column: 1 / -1;
		margin: 1.5rem 0 0 0;
	}
}

/* ###################################################################################################################### 700 */

@media only screen and (max-width: 700px) {

	footer .navplan {
		display: none;
	}

	footer .geschaeftsangaben {
        grid-column: 1 / -1;
	}

	footer .geschaeftsangaben h2{
		display: none;
	}

}



/* ###################################################################################################################### 600 */

@media only screen and (max-width: 600px) {

	header.startheader {
        height: 400px;
    }

	header {
        height: 400px;
    }

	header.startheader h1 {
        font: 400 2.4rem "LibreBaskerville-Regular";
		line-height: 2.6rem;
    }

	aside.hotline p:first-of-type,
	aside.hotline p:last-of-type {
        width: 100%;
        text-align: center;
    }

	section.opener h2,
	section.hauptinhalt h2,
	section.traueranzeigen h2 {
        font: 400 2.7rem "LibreBaskerville-Regular";
		grid-row: 1;
		margin: 0 0 40px 0;
    }

	section.opener aside {
        grid-column: 2 / 12;
		grid-row: 3;
    }

	section.opener article {
        grid-column: 2 / 12;
		grid-row: 2;
		text-align: center;
		margin: 0 0 50px 0;
    }
	
	.soforthilfe-wrapper {
		margin: 25px 0 0 0;
	}

	section.opener aside div a, 
	section.hauptinhalt aside div a, 
	section.traueranzeigen .anzeigenbereich article .beitrag a,
	section.finanzierung main article a,
	section.kristall article a {
		margin: 0 auto;
	}

	section.testimonials h2, 
	section.checkliste h2, 
	section.leistungen h2, 
	section.leistungen_allg h2, 
	section.trauerkerzen h2 {
        font: 400 2.4rem "LibreBaskerville-Regular";
		margin: 0 0 40px 0;
    }

	section.highlight h2,
	section.finanzierung h2 {
        font: 400 2.4rem "LibreBaskerville-Regular";
		margin: 0 0 0 0;
    }

	section.team h2,
	section.team_gallerie h2 {
        font: 400 2.4rem "LibreBaskerville-Regular";
    }

	.kerzenformular h2 {
		font: 700 1.9rem "LibreFranklin-Bold" !important;
		line-height: 2em;
	}

	section.opener article h4,
	section.hauptinhalt article h4 {
		margin: 10px 0 10px 0;
		font: 500 1.2rem "LibreFranklin-Medium";
	}

	section.opener article h4.handschrift,
	section.hauptinhalt article h4.handschrift {
		margin: 40px 0 10px 0;
		font: 400 2.7rem "Ambiance-BT-Regular";
		line-height: 2.0rem;
	}

	section.opener article h5,
	section.hauptinhalt article h5 {
		font: 500 1rem "LibreFranklin-Medium";
	}

	section.hauptinhalt {
		width: 100%;
		height: auto;
		margin: 60px 0 80px 0;
		padding: 0 0 0 0;
	}

	section.hauptinhalt article {
		grid-column: 2 / 12;
		margin: 0 0 40px 0;
	}

	section.hauptinhalt aside {
        grid-column: 2 / 12;
    }

	.startseitengruppe {
		height: 350px;
		margin: 50px 0 0 0;
	}

	h2.testimonial_rotator_slide_title {
        font: 400 1.6rem "LibreBaskerville-Regular" !important;
    }

	.testimonial_rotator_quote {
		margin: 20px 0 0 0 !important;
		font: 400 0.9rem "LibreFranklin-Regular" !important;
		line-height: 1.4em !important;
	}

	.testimonial_rotator_author_info {
		margin: 10px 0 0 0 !important;
		font: 400 0.75rem "LibreFranklin-Regular" !important;
		line-height: 1em !important;
	}

	section.team .gruppenfoto {
		height: 250px;
	}

	section.testimonials article {
        grid-column: 2 / 12;
        margin: 1.5rem 0 0 0;
    }

	section.team h3 {
		font: 400 1.4rem "LibreBaskerville-Regular";
		margin: 0 0 50px 0;
	}

	section.team article {
		grid-column: 2 / 12;
		margin: 0 0 35px 0;
	}

	section.team aside:first-of-type,
	section.team aside:last-of-type {
        grid-column: 2 / 12;
		margin: 25px 0 5px 0;
    }

	.urkunde {
		width: 100%;
		height: 345px;
	}

	section.highlight main,
	section.finanzierung main {
		padding: 40px 0 60px 0;
	}

	section.kristall main aside {
		grid-column: 2 / 12;
	}

	section.kristall article {
		grid-column: 2 / 12;
	}

	section.leistungen article{
		grid-column: 2 / 12;
	}
	section.leistungen article:nth-of-type(1),
	section.leistungen article:nth-of-type(2)  {
		margin: 0 0 0 0;
	}

	section.highlight article {
		grid-column: 2 / 12;
	}

	section.finanzierung main article {
		grid-column: 2 / 12;
	}

	section.highlight-2 {
        margin: -210px 0 80px 0;
    }
	
	section.leistungen article .beitrag h3,
	section.leistungen article:nth-of-type(1) .beitrag h3,
	section.leistungen article:nth-of-type(2) .beitrag h3,
	section.highlight article .beitrag h3  {
		margin: 0 0 0 0;
        font: 700 1.6rem "LibreFranklin-Bold";
        line-height: 1.8rem;
    }

	section.kristall article h3 {
		font: 700 1rem "LibreFranklin-Bold";
		line-height: 1.1rem;
	}
	
	section.kristall article h2 {
		font: 700 1.6rem "LibreFranklin-Bold";
		line-height: 1.8rem;
	}

	section.leistungen article .beitrag p,
	section.highlight article .beitrag p,
	section.kristall article p {
        font: 400 0.8rem "LibreFranklin-Regular";
        line-height: 1.2em;
    }

	section.kristall article p {
		margin: 10px 0 25px 0;
	}

	section.leistungen article .beitrag .beitragsmeta h4,
	section.highlight article .beitrag .beitragsmeta h4 {
        font: 700 1rem "LibreFranklin-Bold";
    }

	section.leistungen_allg {
        margin: 80px 0 50px 0;
    }

	section.leistungen_allg aside {
		grid-column: 2 / 12;
	}

	section.leistungen_allg aside:nth-of-type(3) div.gallery,
	section.team_gallerie aside div.gallery {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 2rem 1.5rem;
		justify-content: space-around;
	}

	section.leistungen_allg aside h3 {
        font: 700 1.15rem LibreFranklin-Bold;
    }

	section.leistungen_allg aside div ul li {
        font: 500 0.9rem "LibreFranklin-Medium";
        line-height: 1.2rem;
		margin: 0 0 1rem 0;
    }

	.gallery .gallery-item .gallery-icon {
		height: 150px;
	}

	section.checkliste,
	section.team,
	section.leistungen,
	section.trauerkerzen {
		margin: 0 0 80px 0;
	}

	section.traueranzeigen  {
		margin: 60px 0 100px 0;
	}

	section.traueranzeigen .zentralerinnerung {
		grid-column: 2 / 12;
	}

	section.checkliste h2 {
		grid-row: 1;
	}

	section.checkliste article h3 {
        font: 700 1.3rem "LibreFranklin-Bold";
		text-align: center;
    }

	section.checkliste article:nth-of-type(1) {
		grid-column: 2 / 12;
		grid-row: 3;
	}

	section.checkliste article:nth-of-type(2) {
        grid-column: 2 / 12;
		grid-row: 2;
		margin: 0 0 50px 0;
    }

	section.checkliste article:nth-of-type(3)  {
		grid-column: 2 / 12;
		grid-row: 4;
	}

	.sdm_download_link a {
		margin: 0 auto !important;
	}

	section.traueranzeigen .anzeigenbereich {
        grid-template-columns: repeat(1, 1fr);
    	gap: 2rem 1.5rem;
    }

	section.traueranzeigen .anzeigenbereich article {
	
	}

	section.traueranzeigen .anzeigenbereich article .beitrag h2 {
        font: 400 2rem "LibreBaskerville-Regular";
        line-height: 2.2rem;
		text-align: center;
    }

	section.traueranzeigen .anzeigenbereich article .beitrag h3 {
        font: 500 1rem "LibreFranklin-Medium";
        line-height: 1.2rem;
		text-align: center;
    }

	section.traueranzeigen .anzeigenbereich article .beitrag p {
        font: 400 0.85rem "LibreFranklin-Regular";
        line-height: 1em;
		text-align: center;
		margin: 10px 0 30px 0;
    }

	section.traueranzeigen aside {
        grid-column: 1 / -1;
    }

	.kerzenliste article.kerze .kerzeninhalt h3 {
        font: 700 1.4rem "LibreFranklin-Bold";
        line-height: 1.8rem;
    }

	.kerzenliste article.kerze .kerzeninhalt h5 {
		font: 300 0.7rem "LibreFranklin-Light";
		line-height: 0.9rem;
	}

	button.dtk-submit {
		display: block;
		margin: 0 auto;
	}

	.dtk-privacy {
		margin: 15px 0 25px 0;
	}

	.dtk-notice {
		margin: 10px 0 30px 0
	}

	.back-button {
		display: block;
		margin: 0 auto;
	}

	.faq-ratgeber-question {
        font: 700 1.25rem "LibreFranklin-Bold";
        line-height: 1.4rem;
    }

	article .faq-ratgeber-item {
		margin: 0 0 0 0 !important;
	}

	section.kontakt h2 {
		text-align: center;
	}

	form div nf-fields-wrap {
		display: grid;
		grid-template-columns: repeat(1, 1fr);
		gap: 1rem;
	}

	.nf-form-content button, .nf-form-content input[type=button], .nf-form-content input[type=submit] {
		margin: 0 auto !important;
	}

	

	
}

/* ###################################################################################################################### 500 */

@media only screen and (max-width: 500px) {

	footer main {
		padding: 150px 0 0 0;
	}
	
	footer .geschaeftsangaben {
		grid-column: 2 / 12;
        grid-template-columns: repeat(1, 1fr);
        gap: 2.5rem 1rem;
    }


	footer .geschaeftsangaben aside div p,
	footer .geschaeftsangaben aside h3 {
		text-align: center;
	}

	footer .geschaeftsangaben aside div p span.icons{
		display: flex;
		justify-content: center; /* horizontal zentrieren */
		align-items: center;     /* vertikal zentrieren */
		gap: 10px;
		margin: 15px 0 0 0;
	}

	footer .geschaeftsangaben aside div p span.icons a {
		margin:  0 0 0 0;
	}
}


/* ###################################################################################################################### 400 */

@media only screen and (max-width: 400px) {
	
	a.hauptlogo {
        width: 226px;
        height: 60px;
        margin: 0 auto;
    }

	section.hauptinhalt {
		width: 100%;
		height: auto;
		margin: 60px 0 100px 0;
		padding: 0 0 0 0;
	}

	section.opener h2,
	section.hauptinhalt h2,
	section.traueranzeigen h2  {
        font: 400 2.3rem "LibreBaskerville-Regular";
	}

	section.testimonials h2, 
	section.checkliste h2, 
	section.leistungen h2, 
	section.leistungen_allg h2, 
	section.team h2, 
	section.trauerkerzen h2,
	section.highlight h2,
	section.finanzierung h2,
	section.team_gallerie h2 {
        font: 400 2.2rem "LibreBaskerville-Regular";
		margin: 0 0 40px 0;
    }

	section.hauptinhalt aside {
        grid-column: 2 / 12;
    }

	section.testimonials article {
		display: none;
	}
	section.team .gruppenfoto {
		margin: 0 0 40px 0;
	}

	section.team aside p {
        font: 300 0.9rem "LibreFranklin-Light";
    }

	section.leistungen article:nth-of-type(1) {
		margin: 0 0 0 0;
		background: linear-gradient(175deg, rgba(129, 62, 116, 0.20), rgba(129, 62, 116, 0.60));
		box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1), inset 0 1px 4px rgba(255, 255, 255, 0.5);
	}
	
	section.leistungen article:nth-of-type(2),
	section.leistungen article:nth-of-type(3) {
		margin: 0 0 0 0;
		background: linear-gradient(175deg, rgba(129, 62, 116, 0.20), rgba(129, 62, 116, 0.60));
		box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1), inset 0 1px 4px rgba(255, 255, 255, 0.5);
	}
	
	
	section.leistungen article:nth-of-type(1) .beitragsbild{
		display: none;
	}
	
	section.leistungen article:nth-of-type(n+2) .beitragsbild {
		display: none;
	}
	
	section.leistungen article .beitrag h3,
	section.leistungen article:nth-of-type(1) .beitrag h3,
	section.leistungen article:nth-of-type(2) .beitrag h3,
	section.highlight article .beitrag h3  {
        font: 700 1.5rem "LibreFranklin-Bold";
        line-height: 1.9rem;
    }

	section.kristall article h3 {
		font: 700 0.9rem "LibreFranklin-Bold";
		line-height: 1rem;
	}
	
	section.kristall article h2 {
		font: 700 1.5rem "LibreFranklin-Bold";
		line-height: 1.9rem;
	}

	section.leistungen article .beitrag p,
	section.highlight article .beitrag p,
	section.kristall article p {
        font: 400 0.8rem "LibreFranklin-Regular";
        line-height: 1.2em;
    }

	section.leistungen article .beitrag .beitragsmeta h4,
	section.highlight article .beitrag .beitragsmeta h4 {
        font: 700 1rem "LibreFranklin-Bold";
    }

	section.opener aside div a,
	section.hauptinhalt aside div a,
	section.traueranzeigen .anzeigenbereich article .beitrag a,
	section.finanzierung main article a,
	section.kristall article a {
		font: 700 0.9rem "LibreFranklin-Bold";
		line-height: 1rem;
	}

	.sdm_download_link a {
		font: 700 0.9rem "LibreFranklin-Bold" !important;
	}

	section.traueranzeigen .anzeigenbereich article .beitrag h2 {
        font: 400 1.9rem "LibreBaskerville-Regular";
        line-height: 2rem;
		text-align: center;
    }

	section.traueranzeigen .anzeigenbereich article .beitrag h3 {
        font: 500 0.9rem "LibreFranklin-Medium";
        line-height: 1rem;
		text-align: center;
    }

	section.traueranzeigen .anzeigenbereich article .beitrag p {
        font: 400 0.8rem "LibreFranklin-Regular";
        line-height: 1em;
		text-align: center;
		margin: 10px 0 20px 0;
    }

	.faq-ratgeber-question {
        font: 700 1.1rem "LibreFranklin-Bold";
        line-height: 1.2rem;
    }

	.urkunde {
		width: 100%;
		height: 400px;
	}

	.nf-form-content button, .nf-form-content input[type=button], .nf-form-content input[type=submit] {
		font: 700 0.9rem "LibreFranklin-Bold" !important;
	}

	footer .footerlogo {
		height: 60px;
	}

}