/*
Theme Name: Mein Zahlenmeister
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 {
	--dunkelgrun: rgb(15,129,49);
	--mittelgrun: rgb(75,160,100);
	--hellgrun: rgb(210,231,216);
	--lichtgrun: rgb(231,242,234);
	--orange: rgb(255,147,30);
	--mittelorange: rgb(249,168,76);
	--hellorange: rgb(242,193,133);
	--beige: rgb(245,213,175);
	--weiss: rgb(255,255,255);
	--grau: rgb(245,245,245);
}



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


body {
	margin: 0 0 0 0;
	padding: 0 0 0 0;
}

a {
	text-decoration: none;
}

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


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

.headernavi {
	width: 1200px;
	height: auto;
	margin: 0 auto;
	padding: 0;
	display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
}

.headernavi .logobutton {
	position: relative;
	z-index: 20;
	width: 90px;
    height: 90px;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    background: url(img/logo_oben.png) center no-repeat;
    background-size: cover;
}



nav.menu-hauptnavigation-container {
	position: relative;
	z-index: 0;
	width:  calc(100% - 90px);
	height: auto;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
}

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

nav.menu-hauptnavigation-container ul li {
	display: block;
	height: auto;
	margin: 0 0 0 2%;
	padding: 0 0 0 0;
	list-style-type: none;
	flex: 0.13;
}

nav.menu-hauptnavigation-container ul li a {
	display: block;
	box-sizing: border-box;
	width: 100%;
	height: auto;
	margin: 0 0 0 0;
	padding: 5px 16px 5px 16px;
	border-top-right-radius: 10px;
	font: 0.9rem "Alata";
	color: var(--dunkelgrun);
	text-shadow: 0.4px 0.4px 0.2px rgba(0,0,0,0.25);
	transition: all 0.5s ease;
	background: var(--beige);
	box-shadow: 0px 1px 4px rgba(0,0,0,0.5);
}

nav.menu-hauptnavigation-container ul li a:hover {
	color: var(--weiss);
	background: var(--orange);
	
}


header {
	position: relative;
	box-sizing: border-box;
	z-index: 10;
	width: 100%;
	height: 450px;
	margin: -40px 0 0 0;
	padding: 145px 0 0 0;
	background: url("img/header_hg.jpg") center no-repeat;
	background-size: cover;
	box-shadow: 0px 0px 5px rgba(0,0,0,0.8);
}

header .logo {
	width: 720px;
	height: 160px;
	margin: 0 auto;
	padding: 0 0 0 0;
	background: url(img/logo.png) center/cover;
}

/* ######################################################################################################################### */
/* Basis */
/* ######################################################################################################################### */


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

section.basisinhalt {
	margin: 25px 0 200px 0;
}

section.basisinhalt article{
	grid-column: 1 / 6;
	margin: 25px 0 0 0;
	padding: 0 0 0 0;
}

section.basisinhalt article h2 {
    width: 100%;
    height: auto;
    margin: 0 0 20px 0;
    padding: 0 0 0 0;
    font: 3rem "Alata";
	line-height: 3.2rem;
    color: var(--dunkelgrun);
}

section.basisinhalt article h2.starth2 {
    margin: 0 0 0 0;
	text-shadow: 1px 1px 1px rgba(0,0,0,0.25);
}

section.basisinhalt article h3 {
    width: 100%;
    height: auto;
    margin: 30px 0 15px 0;
    padding: 0 0 0 0;
    font: 2rem "Alata";
	line-height: 2rem;
    color: var(--dunkelgrun);
}

section.basisinhalt article h3.starth3 {
    margin: 10px 0 35px 0;
	color: var(--orange);
	text-shadow: 1px 1px 1px rgba(0,0,0,0.15);
}

section.basisinhalt article h3.mandantenh3 {
	margin: 10px 0 5px 0;
	color: var(--orange);
	text-shadow: 1px 1px 1px rgba(0,0,0,0.15);
}

section.basisinhalt article h4 {
    width: 100%;
    height: auto;
    margin: 25px 0 5px 0;
    padding: 0 0 0 0;
    font: 1.5rem "Alata";
	line-height: 1.5rem;
    color: var(--dunkelgrun);
}

section.basisinhalt article h4.mandantenh4 {
	margin: 5px 0 35px 0;
	font: 1.1rem "Alata";
	color: var(--mittelgrun);
}

section.basisinhalt article p {
    width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    font: 0.95rem "Alata";
    color: var(--dunkelgrun);
    line-height: 1.5rem;
}

section.basisinhalt article a {
    color: var(--mittelgrun);
}

section.basisinhalt article a:hover {
    color: var(--orange);
}

section.basisinhalt article ul {
    width: 95%;
	height: auto;
	margin: 25px 0 15px 0;
	padding: 0;
}

section.basisinhalt article ul li{
    box-sizing: border-box;
	list-style-position: inside;
	width: 100%;
	height: auto;
	margin: 0 0 10px 0;
	padding: 6px 16px 5px 10px;
	font: 0.9rem "Alata";
	color: var(--dunkelgrun);
	background: var(--hellgrun);
}

section.basisinhalt aside {
	grid-column: 7 / 12;
	position: relative;
	z-index: 20;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
}

section.basisinhalt aside.mandantenbild {
	margin: 35px 0 0 0;
}

section.basisinhalt aside img {
    width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
	rotate: 10deg;
	border: solid 12px var(--hellorange);
    border-bottom-right-radius: 1rem;
    overflow: hidden;
	box-shadow: 0px 0px 5px rgba(0,0,0,0.8);
}

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

.leistungsbreich {
	width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
	background: url(img/hg_leistungen.jpg) center/cover no-repeat;
}

section.leistungen {
	padding: 25px 0 100px 0;
}

section.leistungen h2 {
	grid-column: 1 / -1;
    width: 100%;
    height: auto;
    margin: 20px 0 30px 0;
    padding: 0 0 0 0;
    font: 3rem "Alata";
	text-align: center;
    color: var(--dunkelgrun);
	text-shadow: 1px 1px 1px rgba(0,0,0,0.25);
}

section.leistungen article:nth-of-type(1) {
	grid-column: 1 / 7;
	width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
	rotate: -2deg;
}

section.leistungen article:nth-of-type(2) {
	grid-column: 8 / 13;
	width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
}

section.leistungen article:nth-of-type(3) {
	grid-column: 1 / 7;
	width: 100%;
    height: auto;
    margin: 25px 0 0 0;
    padding: 0 0 0 0;
}

section.leistungen .leistungsbild {
	grid-column: 8 / -1;
	box-sizing: border-box;
	width: 100%;
    height: 600px;
    margin: 35px 0 0 0;
    padding: 0 0 0 0;
	rotate: 5deg;
	border: solid 12px var(--weiss);
    border-bottom-right-radius: 1rem;
    overflow: hidden;
	box-shadow: 0px 0px 5px rgba(0,0,0,0.8);
	background: url(img/leistungen.jpg) center/cover no-repeat;
}

section.leistungen aside {
	grid-column: 2 / 12;
	box-sizing: border-box;
	width: 100%;
    height: auto;
    margin: 55px 0 0 0;
    padding: 6px 20px 16px 20px;
	background: rgba(255,255,255,0.3);
}

section.leistungen aside h4{
	width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
	font: 0.8rem "Alata";
	text-align: center;
    color: var(--dunkelgrun);
}

section.leistungen aside p{
	width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
	font: 0.6rem "Alata";
	line-height: 1rem;
	text-align: center;
    color: var(--dunkelgrun);
}


section.leistungen article h3 {
	box-sizing: border-box;
	display: inline-block;
	position: relative;
	z-index: 10;
	width: auto;
    height: auto;
    margin: 0 0 0 16px;
	padding: 7px 16px 6px 10px;
	border-top-right-radius: 10px;
	font: 1.5rem "Alata";
	color: var(--weiss);
	text-shadow: 0.4px 0.4px 0.2px rgba(0,0,0,0.25);
	background: var(--dunkelgrun);
	box-shadow: 4px 5px 6px rgba(0,0,0,0.5);
}

section.leistungen article:nth-of-type(3) h3 {
	background: var(--orange);
}

section.leistungen article .textwidget {
	box-sizing: border-box;
	position: relative;
	z-index: 20;
	width: 100%;
    height: auto;
    margin: 0 0 0 0;
	padding: 16px 16px 32px 16px;
	border-bottom-right-radius: 10px;
	box-shadow: 4px 5px 6px rgba(0,0,0,0.5);
}

section.leistungen article:nth-of-type(1) .textwidget, section.leistungen article:nth-of-type(2) .textwidget {
	background: var(--mittelgrun);
}

section.leistungen article:nth-of-type(3) .textwidget {
	background: var(--hellorange);
}

section.leistungen article .textwidget ul {
	width: 95%;
	height: auto;
	margin: 0 0 0 0;
	padding: 0;
}

section.leistungen article .textwidget ul li{
	box-sizing: border-box;
	list-style-position: inside;
	width: 100%;
	height: auto;
	margin: 0 0 10px 0;
	padding: 6px 16px 5px 10px;
	font: 1.1rem "Alata";
	text-shadow: 1px 1px 0.6px rgba(0,0,0,0.1);
}

section.leistungen article:nth-of-type(1) .textwidget ul li, section.leistungen article:nth-of-type(2) .textwidget ul li{
	color: var(--dunkelgrun);
	background: var(--hellgrun);
}

section.leistungen article:nth-of-type(3) .textwidget ul li{
	color: var(--weiss);
	background: var(--mittelorange);
}


/* ######################################################################################################################### */
/* Unterseiten */
/* ######################################################################################################################### */

section.nurinhalt {
	margin: 25px 0 200px 0;
}

section.nurinhalt article{
	grid-column: 1 / 9;
	margin: 25px 0 0 0;
	padding: 0 0 0 0;
}

section.nurinhalt article h2 {
    width: 100%;
    height: auto;
    margin: 0 0 20px 0;
    padding: 0 0 0 0;
    font: 3rem "Alata";
	line-height: 3.2rem;
    color: var(--dunkelgrun);
}

section.nurinhalt article h3 {
    width: 100%;
    height: auto;
    margin: 30px 0 15px 0;
    padding: 0 0 0 0;
    font: 2rem "Alata";
	line-height: 2rem;
    color: var(--dunkelgrun);
}

section.nurinhalt article h4 {
    width: 100%;
    height: auto;
    margin: 25px 0 5px 0;
    padding: 0 0 0 0;
    font: 1.5rem "Alata";
	line-height: 1.5rem;
    color: var(--dunkelgrun);
}

section.nurinhalt article p {
    width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    font: 0.9rem "Alata";
    color: var(--dunkelgrun);
    line-height: 1.3rem;
}

section.nurinhalt article a {
    color: var(--mittelgrun);
}

section.nurinhalt article a:hover {
    color: var(--orange);
}

section.nurinhalt article ul {
    width: 95%;
	height: auto;
	margin: 25px 0 15px 0;
	padding: 0;
}

section.nurinhalt article ul li{
    box-sizing: border-box;
	list-style-position: inside;
	width: 100%;
	height: auto;
	margin: 0 0 10px 0;
	padding: 6px 16px 5px 10px;
	font: 0.9rem "Alata";
	color: var(--dunkelgrun);
	background: var(--hellgrun);
}



/* ######################################################################################################################### */
/* AGB Bereich */
/* ######################################################################################################################### */

.agbbereich {
	width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
	background: url(img/hg_leistungen.jpg) center/cover no-repeat;
}

section.agbsection {
	display: grid;
	grid-template-columns: repeat(13, 1fr);
	gap: 0rem 1rem;
	justify-content: space-around;
	padding: 25px 0 100px 0;
	
}

section.agbsection h2 {
	grid-column: 1 / -1;
    width: 100%;
    height: auto;
    margin: 20px 0 0 0;
    padding: 0 0 0 0;
    font: 3rem "Alata";
	text-align: center;
    color: var(--dunkelgrun);
	text-shadow: 1px 1px 1px rgba(0,0,0,0.25);
}

section.agbsection h4 {
	grid-column: 1 / -1;
    width: 100%;
    height: auto;
    margin: 0 0 45px 0;
    padding: 0 0 0 0;
    font: 1rem "Alata";
	text-align: center;
    color: var(--mittelgrun);
	text-shadow: 1px 1px 1px rgba(0,0,0,0.25);
}

section.agbsection h4:nth-of-type(2){
	margin: 35px 0 0 0;
}

section.agbsection article:nth-of-type(1) {
	grid-column: 1 / 7;
	width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
}

section.agbsection article:nth-of-type(2) {
	grid-column: 8 / -1;
	width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
}

.agb dt {
	position: relative;
    z-index: 20;
	width: 100%;
	height: auto;
	margin: 25px 0 0 0;
	padding: 0 0 0 0;
	
}

.agb a.agb_titel {
	box-sizing: border-box;
    display: inline-block;
    position: relative;
    z-index: 10;
    width: auto;
    height: auto;
    margin: 0 0 0 16px;
    padding: 7px 16px 6px 10px;
    border-top-right-radius: 10px;
    font: 1.5rem "Alata";
    color: var(--weiss);
    text-shadow: 0.4px 0.4px 0.2px rgba(0, 0, 0, 0.25);
    background: var(--dunkelgrun);
    box-shadow: 4px 0px 4px rgba(0, 0, 0, 0.5);
}

.agb a.agb_titel:hover {
	background: var(--orange);
}

.agb dd {
	box-sizing: border-box;
	position: relative;
    z-index: 20;
	width: 100%;
	height: auto;
	margin: 0 0 0 0;
	padding: 16px 32px 32px 16px;
	font: 1rem "Alata";
	line-height: 1.3em;
	color: var(--weiss);
	background: var(--mittelgrun);
	box-shadow: 4px 4px 5px rgba(0, 0, 0, 0.5);
	border-bottom-right-radius: 10px;
}

.agb dd ul {
	width: 100%;
	height: auto;
	margin: 10px 0 15px 0;
	padding: 0;
}

.agb dd ul li {
	box-sizing: border-box;
    width: 100%;
    height: auto;
    margin: 0 0 5px 0;
    padding: 6px 16px 7px 16px;
    font: 1rem "Alata";
    line-height: 1.5em;
    text-align: left;
    color: var(--weiss);
	background: rgba(210,231,216,0.3);
	list-style-type: square;
	list-style: inside;
}



/* ######################################################################################################################### */
/* Mandantenbereich */
/* ######################################################################################################################### */

.mandantennavi {
	width: 1200px;
	height: auto;
	margin: 0 auto;
	padding: 0;
	display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
}

nav.menu-mandantennavigation-container {
	position: relative;
	z-index: 0;
	box-sizing: border-box;
	width:  100%;
	height: auto;
	margin: 0 0 0 90px;
	padding: 0 0 0 0;
}

nav.menu-mandantennavigation-container ul {
	width: 100%;
	height: auto;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
}

nav.menu-mandantennavigation-container ul li {
	display: block;
	height: auto;
	margin: 0 0 0 2%;
	padding: 0 0 0 0;
	list-style-type: none;
	flex: 0.13;
}

nav.menu-mandantennavigation-container ul li a {
	display: block;
	box-sizing: border-box;
	width: 100%;
	height: auto;
	margin: 0 0 0 0;
	padding: 5px 16px 5px 16px;
	border-bottom-right-radius: 10px;
	font: 0.9rem "Alata";
	color: var(--dunkelgrun);
	text-shadow: 0.4px 0.4px 0.2px rgba(0,0,0,0.25);
	transition: all 0.5s ease;
	background: var(--beige);
	box-shadow: 0px 1px 4px rgba(0,0,0,0.5);
}

nav.menu-mandantennavigation-container ul li a:hover {
	color: var(--weiss);
	background: var(--orange);
	
}


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


.ncore_form_label label {
	box-sizing: border-box;
	width: 100%;
    height: auto;
	margin: 0 0 0 0;
    padding: 2px 0 0 0;
    color: var(--dunkelgrun)!important;
	font: 1rem "Alata";
}

.ncore_form_input input[type="text"], .ncore_form_input input[type="password"] {
	box-sizing: border-box;
	width: 100%!important;
    height: 35px!important;
    margin: 0 0 15px 0!important;
    padding: 0 0 0 6px!important;
    color: var(--dunkelgrun)!important;
    font: 0.9rem "Alata"!important;
	border: solid 1px var(--mittelgrun)!important;
	background: var(--lichtgrun)!important;
}

.ncore_form_input input[type="checkbox"] {
	box-sizing: border-box;
	width: 30px;
    height: auto;
	min-height: 30px;
    margin: 5px 15px 0 0;
    padding: 0 0 0 16px;
    color: rgba(255,255,255,1.0)!important;
    font: 1rem "Alata";
    background: var(--mittelgrun)!important;
	border: 0px rgb(0,0,0) solid;
}

.ncore_input_checkbox label {
	font: 0.9rem "Alata" !important;
	color: var(--dunkelgrun)!important;
	display: flex;
    align-items: center;
}

.ncore_input_checkbox label[for="ncore_remember0"] {
	display: none;
}

form.ncore_user_form.ncore_form_narrow div.ncore_new_password_link {
	font: 0.9rem "Alata" !important;
}

form.ncore_user_form.ncore_form_narrow .ncore_form_buttons {
	text-align: left !important;
	margin: 25px 0 15px 0!important;
}

.ncore input[type="submit"] {
	height: auto;
    margin: 25px 0 10px 0 !important;
    padding: 10px 16px 10px 16px !important;
   	font: 1rem "Alata" !important;
    color: var(--mittelgrun) !important;
    background: var(--hellgrun)!important;
    box-shadow: 3px 3px 2px rgba(0, 0, 0, 0.2) !important;
    transition: all 0.3s ease;
	border: solid 0px var(--weiss);
	border-radius: 0px !important;
    cursor: pointer;
}

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

section.faelligkeiten {
	padding: 25px 0 100px 0;
}

section.faelligkeiten h2 {
	grid-column: 1 / -1;
    width: 100%;
    height: auto;
    margin: 20px 0 30px 0;
    padding: 0 0 0 0;
    font: 3rem "Alata";
	text-align: center;
    color: var(--dunkelgrun);
}

section.faelligkeiten article {
	grid-column: 1 / -1;
	box-sizing: border-box;
	width: 100%;
	height: auto;
	margin: 0 0 0 0;
	padding: 16px 16px 32px 16px;
	background: var(--lichtgrun);
	border-bottom-right-radius: 1rem;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.8);
	rotate: -1deg;
}

section.faelligkeiten article table {
	width: 100%;
	height: auto;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	table-layout: fixed;
	border-collapse: collapse;
}

section.faelligkeiten article table thead{
	width: 100%;
	height: auto;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
}

section.faelligkeiten article table thead tr{
	width: 100%;
	height: auto;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	background: var(--mittelgrun);
}

section.faelligkeiten article table thead tr th:nth-of-type(1) {
	box-sizing: border-box;
	width: 15%;
	text-align: left;
	padding: 0 0 0 10px;
}

section.faelligkeiten article table thead tr th {
	box-sizing: border-box;
	width: 30%;
	height: auto;
	margin: 0 0 0 0;
	padding: 10px 0 10px 0;
	font: 1.3rem "Alata";
	color: var(--weiss);
	border-bottom: solid 3px var(--dunkelgrun);
	border-right: solid 2px var(--dunkelgrun);
}

section.faelligkeiten article table thead tr th:last-of-type{
	border-right: solid 0px var(--weiss);
}

section.faelligkeiten article table tbody{
	width: 100%;
	height: auto;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
}

section.faelligkeiten article table tbody tr{
	width: 100%;
	height: auto;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
}

section.faelligkeiten article table tbody tr:nth-of-type(even) {
	background: var(--hellgrun);
}

section.faelligkeiten article table tbody tr:last-of-type{
	border-bottom: solid 3px var(--dunkelgrun);
}

section.faelligkeiten article table tbody tr td:nth-of-type(1){
	text-align: left;
	padding: 6px 0 6px 10px;
}

section.faelligkeiten article table tbody tr td {
	box-sizing: border-box;
	margin: 0 0 0 0;
	padding: 6px 0 6px 0;
	font: 1.1rem "Alata";
	color: var(--dunkelgrun);
	text-align: center;
	border-bottom: dotted 2px var(--dunkelgrun);
	border-right: solid 2px var(--dunkelgrun);
}

section.faelligkeiten article table tbody tr td:last-of-type{
	border-right: solid 0px var(--weiss);
}


section.faelligkeiten article table tfoot{
	width: 100%;
	height: auto;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
}

section.faelligkeiten article table tfoot tr{
	width: 100%;
	height: auto;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
}

section.faelligkeiten article table tfoot tr td:nth-of-type(1){
	text-align: left;
	padding: 12px 6px 18px 6px;
	font: 1rem "Alata";
}

section.faelligkeiten article table tfoot tr td {
	box-sizing: border-box;
	margin: 0 0 0 0;
	padding: 12px 6px 18px 6px;
	font: 0.8rem "Alata";
	line-height: 1rem;
	color: var(--mittelgrun);
	text-align: center;
	border-bottom: dotted 0px var(--dunkelgrun);
	border-right: solid 2px var(--dunkelgrun);
}

section.faelligkeiten article table tfoot tr td:last-of-type{
	border-right: solid 0px var(--weiss);
}


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

.downloadbereich {
	box-sizing: border-box;
	width: 100%;
	height: auto;
	margin: 0 0 100px 0;
	padding: 35px 2% 100px 2%;
	background: url(img/hg_pattern3.jpg) repeat;
}

.downloadbereich h2{
	width: 100%;
    height: auto;
    margin: 20px 0 0 0;
    padding: 0 0 0 0;
    font: 3rem "Alata";
	text-align: center;
    color: var(--dunkelgrun);
	text-shadow: 1px 1px 1px rgba(0,0,0,0.25);
}

.downloadbereich h4 {
    box-sizing: border-box;
    width: 100%;
    height: auto;
    margin: 0 0 35px 0;
    padding: 0 0 0 0;
    text-align: center;
    font: 0.9rem "Alata";
    color: var(--mittelgrun);
}

.downloadbereich .downloads {
	width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 30px 0 0 0;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
}

.downloadbereich .downloads aside {
	margin: 0 16px 0 0;
}

.downloadbereich .downloads aside:nth-of-type(even) {
	background: var(--lichtgrun);
	rotate: 1deg;
}

.downloadbereich .downloads aside:nth-of-type(odd) {
	background: var(--hellgrun);
	rotate: -1deg;
}


.downloadbereich .downloads aside .sdm_download_item {
	display: block;
	box-sizing: border-box;
	margin: 0 0 0 0;
	padding: 16px 16px 32px 16px;
    border: 0px solid #E7E9EB;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.8);
	
	border-bottom-right-radius: 12px;
}

.downloadbereich .downloads aside .sdm_download_item .sdm_download_item_top {
	
}

.downloadbereich .downloads aside .sdm_download_item .sdm_download_item_top .sdm_download_thumbnail {
	display: none;
}

.downloadbereich .downloads aside .sdm_download_item .sdm_download_item_top .sdm_download_title {
	width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
	font: 2rem "Alata";
    color: var(--dunkelgrun);
}

.downloadbereich .downloads aside .sdm_download_item .sdm_download_description {
	width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
	border-bottom: 0px solid #EEEEEE;
}

.downloadbereich .downloads aside .sdm_download_item .sdm_download_description p {
	width: 100%;
    height: auto;
    margin: 6px 0 32px 0;
    padding: 0 0 0 0;
	font: 1rem "Alata";
    color: var(--mittelgrun);
}

.downloadbereich .downloads aside .sdm_download_item .sdm_download_link {}

.downloadbereich .downloads aside .sdm_download_item .sdm_download_link .sdm_download_button {}

.downloadbereich .downloads aside .sdm_download_item .sdm_download_link .sdm_download_button a{
	height: auto;
    margin: 0 0 0 0 !important;
    padding: 10px 16px 10px 16px !important;
    font: 1rem "Alata";
    color: var(--weiss) !important;
    background: var(--mittelgrun) !important;
    box-shadow: 3px 3px 2px rgba(0, 0, 0, 0.2) !important;
	border-radius: 0px;
    transition: all 0.3s ease;
    border: solid 0px var(--weiss);
	text-shadow: 1px 1px 1px rgba(0,0,0,0.0);
    cursor: pointer;
}

.downloadbereich .downloads aside .sdm_download_item .sdm_download_link .sdm_download_button a:hover{
	cursor: pointer;
	background: var(--orange) !important;
}


/* ######################################################################################################################### */
/* Formularbereich */
/* ######################################################################################################################### */

section.formulare {}


.formularbereich {
	box-sizing: border-box;
	width: 100%;
	height: auto;
	margin: 0 0 100px 0;
	padding: 35px 2% 100px 2%;
	background: url(img/hg_pattern3.jpg) repeat;
}

.formularbereich h2{
	width: 100%;
    height: auto;
    margin: 20px 0 0 0;
    padding: 0 0 0 0;
    font: 3rem "Alata";
	text-align: center;
    color: var(--dunkelgrun);
	text-shadow: 1px 1px 1px rgba(0,0,0,0.25);
}

.formularbereich .nf-form-title {
    display: none;
}

.formularbereich form {
	width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
}

.formularbereich form div .nf-form-fields-required {
    box-sizing: border-box;
    width: 100%;
    height: auto;
    margin: 0 0 35px 0;
    padding: 0 0 0 0;
    text-align: center;
    font: 0.9rem "Alata";
    color: var(--mittelgrun);
}

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

.formularbereich form div nf-fields-wrap nf-field:nth-of-type(2){
    /* margin: 0 0 25px 0;*/
}

.formularbereich form div nf-fields-wrap #nf-field-15-wrap,
.formularbereich form div nf-fields-wrap #nf-field-20-wrap,
.formularbereich form div nf-fields-wrap #nf-field-22-wrap{
	display: grid;
    grid-template-columns: repeat(8, 1fr);
    gap: 1rem;
}

.formularbereich form div nf-fields-wrap nf-field div#nf-field-15-wrap .nf-field-label, 
.formularbereich form div nf-fields-wrap nf-field div#nf-field-20-wrap .nf-field-label {
	grid-column: 1 / 2;
	box-sizing: border-box;
	width: 100%;
    height: auto;
	margin: 0 0 0 0;
    padding: 2px 0 0 16px;
    color: var(--dunkelgrun)!important;
	font: 1rem "Alata";
	background: var(--hellgrun);
}

.formularbereich form div nf-fields-wrap nf-field div#nf-field-22-wrap .nf-field-label{
	grid-column: 1 / 3;
	box-sizing: border-box;
	width: 100%;
    height: auto;
	margin: 0 0 0 0;
    padding: 2px 0 0 16px;
    color: var(--dunkelgrun)!important;
	font: 1rem "Alata";
	background: var(--hellgrun);
}

.formularbereich form div nf-fields-wrap nf-field div#nf-field-15-wrap .nf-field-element,
.formularbereich form div nf-fields-wrap nf-field div#nf-field-20-wrap .nf-field-element {
	grid-column: 2 / 3;
}

.formularbereich form div nf-fields-wrap nf-field div#nf-field-22-wrap .nf-field-element{
	grid-column: 3 / 4;
}

.formularbereich form div nf-fields-wrap nf-field div#nf-field-15-wrap .nf-field-element input:not([type=button]),
.formularbereich form div nf-fields-wrap nf-field div#nf-field-20-wrap .nf-field-element input:not([type=button]),
.formularbereich form div nf-fields-wrap nf-field div#nf-field-22-wrap .nf-field-element input:not([type=button]) {
	box-sizing: border-box;
	width: 100%;
    height: 30px;
    margin: 0 0 0 0;
    padding: 0 0 0 6px;
    color: var(--dunkelgrun)!important;
    font: 0.9rem "Alata";
	border: solid 1px var(--mittelgrun);
	background: var(--lichtgrun)!important;
}

.formularbereich .nf-repeater-fieldset nf-fields-wrap {
	display: grid;
    grid-template-columns: repeat(8, 1fr);
    gap: 1rem;
}

.formularbereich .nf-repeater-fieldset nf-fields-wrap nf-field:nth-of-type(1){
	grid-column: 1 / 3;
}

.formularbereich .nf-repeater-fieldset nf-fields-wrap nf-field:nth-of-type(21){
	grid-column: span 2;
}

.formularbereich .nf-repeater-fieldset nf-fields-wrap nf-field .nf-field-label {
	box-sizing: border-box;
	width: 100%;
    height: auto;
	margin: 0 0 0 0;
    padding: 0 0 0 0;
    color: var(--dunkelgrun);
	font: 0.9rem "Alata";
}

.formularbereich .nf-repeater-fieldset nf-fields-wrap nf-field .nf-field-element input:not([type=button]),
.formularbereich .nf-repeater-fieldset nf-fields-wrap nf-field .nf-field-element select{
	box-sizing: border-box;
	width: 100%;
    height: 30px;
    margin: 0 0 0 0;
    padding: 0 0 0 6px;
    color: var(--dunkelgrun)!important;
    font: 0.9rem "Alata";
    background: var(--weiss)!important;
	border: solid 1px var(--mittelgrun);
}


.formularbereich .nf-repeater-fieldset nf-fields-wrap nf-field:nth-of-type(21) .nf-field-element {
	
}

.files_uploaded nf-section {
	width: auto;
    height: auto;
    margin: 0 0 0 0 !important;
    padding: 0 0 0 0;
}

.files_uploaded nf-section p {
	width: auto;
    height: auto;
    margin: 4px 0 0 0;
    padding: 0 0 0 0;
	font: 0.9rem "Alata";
    color: var(--mittelgrun);
}

.files_uploaded nf-section p a {
	color: var(--dunkelgrun);
	transition: all 0.2s ease;
    cursor: pointer;
}

.files_uploaded nf-section p a:hover {
	color: var(--orange);
}

.formularbereich nf-field #nf-field-29-container .nf-field {
	box-sizing: border-box;
	width: 35%;
    height: auto;
    margin: 25px 0 0 0;
    padding: 16px 16px 32px 16px;
	background: var(--lichtgrun);
	box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.2)!important;
	border-bottom-right-radius: 10px;
}

.formularbereich nf-field #nf-field-29-container .nf-field #nf-field-29-wrap .nf-field-element {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
}

.formularbereich nf-field #nf-field-29-container .nf-field #nf-field-29-wrap .nf-field-label label#nf-label-field-29 {
	width: auto;
    height: auto;
    margin: 0 0 15px 0;
    padding: 0 0 0 0;
	font: 1.2rem "Alata";
    color: var(--dunkelgrun);
	margin: 5px 0 0 0;
}


.formularbereich nf-field #nf-field-29-container .nf-field #nf-field-29-wrap .nf-field-element button.nf-fu-fileinput-button {
	float:none!important;
    box-sizing: border-box;
	grid-column: 1 / 2;
	width: auto;
    height: auto;
    margin: 0 0 0 0 !important;
    padding: 5px 11px 6px 11px !important;
   	font: 1rem "Alata";
    color: var(--mittelgrun) !important;
    background: var(--hellgrun)!important;
    box-shadow: 3px 3px 3px rgba(0, 0, 0, 0)!important;
	border: solid 0px var(--weiss);
	border-bottom-right-radius: 0px;
    transition: all 0.3s ease;
    cursor: pointer;
}

.formularbereich nf-field #nf-field-29-container .nf-field #nf-field-29-wrap .nf-field-element button.nf-fu-fileinput-button:hover {
	cursor: pointer;
	background: var(--orange)!important;
	color:var(--weiss)!important;
}

.formularbereich nf-field #nf-field-29-container .nf-field #nf-field-29-wrap .nf-field-element button.nf-fu-button-cancel {
    display: none !important;
}

.formularbereich nf-field #nf-field-29-container .nf-field #nf-field-29-wrap .nf-field-element input#nf-field-29{
	display: none!important;
}

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


.nf-fu-progress {
	grid-column: 2 / -1;
	height: 33px!important;
	margin: 0 0 0 0 !important;
	border: solid 1px var(--mittelgrun)!important;
	border-radius: 0px!important;
	background: none!important;
	box-shadow: 3px 3px 3px rgba(0, 0, 0, 0)!important;
}



.nf-response-msg {
	width: auto;
    height: auto;
    margin: 4px 0 0 0;
    padding: 0 0 0 0;
	font: 1.2rem "Alata";
	text-align: center;
    color: var(--dunkelgrun);
}

.formularbereich div.nf-field div button.nf-add-fieldset {
	box-sizing: border-box;
	width: auto;
    height: auto;
    margin: 0 0 0 0 !important;
    padding: 10px 16px 10px 16px !important;
   	font: 1rem "Alata";
    color: var(--mittelgrun) !important;
    background: var(--hellgrun)!important;
    box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.2)!important;
	border: solid 0px var(--weiss);
	border-bottom-right-radius: 14px;
    transition: all 0.2s ease;
    cursor: pointer;
}

.formularbereich div.nf-field div button.nf-add-fieldset:hover {
	cursor: pointer;
	background: var(--orange)!important;
	color: var(--weiss)!important;
}


.formularbereich div.nf-field div button.nf-remove-fieldset {
    float:none!important;
    box-sizing: border-box;
	display: flex;
	justify-self: flex-end;
	width: auto;
    height: auto;
    margin: 0 0 0 0 !important;
    padding: 5px 11px 6px 11px !important;
   	font: 1rem "Alata";
    color: var(--weiss) !important;
    background: var(--mittelgrun)!important;
    box-shadow: 3px 3px 3px rgba(0, 0, 0, 0)!important;
	border: solid 0px var(--weiss);
	border-bottom-right-radius: 0px;
    transition: all 0.2s ease;
    cursor: pointer;
}

.formularbereich div.nf-field div button.nf-remove-fieldset:hover {
	cursor: pointer;
	background: var(--orange)!important;
}

fieldset {
	box-sizing: border-box;
	width: 100%;
	height: auto;
	margin: 0 0 0 0 !important;
	padding: 16px 16px 16px 16px;
	border: solid 0px rgb(0,0,0);
	box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.2);
}

fieldset legend {
	display: none;
}

fieldset:nth-of-type(odd) {
	background: var(--hellgrun);
}

fieldset:nth-of-type(even) {
	background: var(--lichtgrun);
}

.formularbereich form div nf-fields-wrap nf-field div.checkbox-container {
	
}

.formularbereich form div nf-fields-wrap nf-field div.checkbox-container div div.checkbox-wrap {
	display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
}

.formularbereich form div nf-fields-wrap nf-field div.checkbox-container div div.checkbox-wrap .nf-field-label {
	margin: 0 0 0 0;
	padding: 4px 0 0 16px;
	font: 1rem "Alata";
    color: var(--dunkelgrun);
	align-items: normal;
}

.formularbereich .nf-form-content .list-select-wrap .nf-field-element>div, 
.formularbereich .nf-form-content input[type="checkbox"] {
    box-sizing: border-box;
	width: 100%;
    height: auto;
	min-height: 30px;
    margin: 0 0 0 0;
    padding: 0 0 0 16px;
    color: rgba(255,255,255,1.0)!important;
    font: 1rem "Alata";
    background: var(--mittelgrun)!important;
	border: 0px rgb(0,0,0) solid;
}

.formularbereich .label-right .nf-field-description {
	font: 0.8rem "Alata";
    margin: 0 25% 0 0 !important;
	color: var(--mittelgrun);
}

.formularbereich .label-right .nf-field-description a {
    font: 0.8rem "Alata";
    color: var(--dunkelgrun);
	cursor: pointer;
	transition: all 0.2s ease;
}

.formularbereich .label-right .nf-field-description a:hover {
    color: var(--orange);
	cursor: pointer;
}


.formularbereich .nf-form-content button, 
.formularbereich .nf-form-content input[type=button]{} 

.formularbereich .nf-form-content input[type=submit] {
    height: auto;
    margin: 25px 0 10px 0 !important;
    padding: 10px 16px 10px 16px !important;
   	font: 1rem "Alata";
    color: var(--mittelgrun) !important;
    background: var(--hellgrun)!important;
    box-shadow: 3px 3px 2px rgba(0, 0, 0, 0.2) !important;
    transition: all 0.3s ease;
	border: solid 0px var(--weiss);
    cursor: pointer;
}

.formularbereich .nf-form-content button:hover, 
.formularbereich .nf-form-content input[type=button]:hover, 
.formularbereich .nf-form-content input[type=submit]:hover {
    color: rgba(255,255,255,0.9)!important;
    background: var(--dunkelgrun)!important;
    box-shadow: 3px 3px 2px rgba(0, 0, 0, 0.2) !important;
    cursor: pointer;
}

.formularbereich  .nf-error-msg, .ninja-forms-req-symbol {
    margin: 0 0 20px 0;
    color: rgba(201, 1, 48, 1.0) !important;
    font: 1rem "Alata";
}

.formularbereich form div nf-fields-wrap nf-field div#nf-field-25-wrap .nf-field-element {
	font: 1.5rem "Alata";
    color: var(--dunkelgrun) !important;
}

div.ncore_affiliate_footer, #ncore_footer_placeholder {
	display: none;
}

.nf-help {
	opacity: 0.5;
	cursor: help;
}

span.nf-sr-only {
	color: var(--mittelgrun) !important;
	font: 1rem "Alata";
}



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

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

section.kontakt h2{
	grid-column: 1 / -1;
    width: 100%;
    height: auto;
    margin: 0 0 20px 0;
    padding: 0 0 0 0;
    font: 3rem "Alata";
	text-align: center;
    color: var(--dunkelgrun);
	text-shadow: 1px 1px 1px rgba(0,0,0,0.25);
}


section.kontakt article{
	grid-column: 4 / 10;
}

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

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

section.kontakt .nf-field-label {
	/* display: none; */
}

section.kontakt form div nf-fields-wrap nf-field:nth-of-type(1){
	grid-column: 1 / 2;
}

section.kontakt form div nf-fields-wrap nf-field:nth-of-type(2){
	grid-column: 2 / -1;
}

section.kontakt form div nf-fields-wrap nf-field:nth-of-type(3){
	grid-column: 1 / 2;
}

section.kontakt form div nf-fields-wrap nf-field:nth-of-type(4){
	grid-column: 2 / -2;
}

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

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

section.kontakt form div nf-fields-wrap nf-field:nth-of-type(7){
	grid-column: 1 / -1;
}

section.kontakt form div nf-fields-wrap nf-field:nth-of-type(8){
	grid-column: 1 / -1;
}

section.kontakt form div nf-fields-wrap nf-field:nth-of-type(9){
	grid-column: 1 / 2;
}

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

section.kontakt .nf-field-label label#nf-label-field-5, 
section.kontakt .nf-field-label label#nf-label-field-6, 
section.kontakt .nf-field-label label#nf-label-field-7, 
section.kontakt .nf-field-label label#nf-label-field-1, 
section.kontakt .nf-field-label label#nf-label-field-2, 
section.kontakt .nf-field-label label#nf-label-field-3 {
	display: none;
}


section.kontakt .nf-form-fields-required {
	box-sizing: border-box;
	width: 100%;
	height: auto;
	margin: 0 0 10px 0;
	padding: 0 0 0 0;
	text-align: left;
	font: 1rem "Alata";
	color: var(--mittelgrun);
	
}

section.kontakt .nf-form-content .list-select-wrap .nf-field-element>div, 
section.kontakt .nf-form-content input:not([type=button]), 
section.kontakt .nf-form-content textarea {
    box-sizing: border-box;
	width: 100%;
    height: auto;
	min-height: 50px;
    margin: 0 0 0 0;
    padding: 0 0 0 16px;
    color: var(--dunkelgrun) !important;
    font: 1rem "Alata";
    background: var(--lichtgrun)!important;
	border: solid 1px var(--mittelgrun);
}

section.kontakt .nf-form-content select {
    box-sizing: border-box;
	width: 100%;
    height: auto;
	min-height: 50px;
    margin: 0 0 0 0;
    padding: 0 0 0 16px;
    color: var(--mittelgrun) !important;
    font: 1rem "Alata";
    background: var(--lichtgrun)!important;
}

section.kontakt .nf-form-content textarea {
	padding: 10px 0 0 2%;
	height: 200px;
}


section.kontakt .nf-form-content .list-select-wrap .nf-field-element>div::-webkit-input-placeholder,
section.kontakt .nf-form-content input:not([type=button])::-webkit-input-placeholder,
section.kontakt .nf-form-content textarea::-webkit-input-placeholder {
	font: 1rem "Alata";
	color: var(--mittelgrun);
}

section.kontakt .nf-form-content .listselect-wrap .nf-field-element div, 
section.kontakt .nf-form-content input.ninja-forms-field, 
section.kontakt .nf-form-content select.ninja-forms-field:not([multiple]) {
	font: 1rem "Alata";
	color: rgba(201,1,48,1.0);
}


section.kontakt .nf-form-content textarea.ninja-forms-field {
    width: 100%;
	font: 1rem "Alata";
}

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

section.kontakt label#nf-label-field-9 {
    font: 1rem "Alata";
    color: var(--dunkelgrun);
}

section.kontakt label#nf-label-field-9 a {
    font: 1rem "Alata";
    color: var(--dunkelgrun);
}

section.kontakt label#nf-label-field-9 a:hover {
    color: var(--dunkelgrunnavi);
}

section.kontakt .label-right .nf-field-description {
	font: 1rem "Alata";
    margin: 5px 0 0 0 !important;
	color: rgba(0,0,0,0.8);
}

section.kontakt .checkbox-container.label-right .field-wrap>div {
	color: var(--mittelgrun);
	font: 1rem "Alata";
}

section.kontakt .label-right .nf-field-description p {
	font: 0.8rem "Alata";
	color: var(--mittelgrun);
}

section.kontakt .label-right .nf-field-description a{
    margin: 0 0 0 0 !important;
	font: 0.8rem "Alata";
    color: var(--dunkelgrun)!important;
}

section.kontakt .label-right .nf-field-description a:hover{
	font: 0.8rem "Alata";
    margin: 0 0 0 0 !important;
	color: var(--orange)!important;
}

section.kontakt .nf-error-msg, .ninja-forms-req-symbol {
	margin: 0 0 20px 0;
    color: rgba(201,1,48,1.0) !important;
	font: 1rem "Alata";
}

section.kontakt .nf-error .nf-error-msg {
	font: 1rem "Alata";
    color: rgba(201,1,48,1.0) !important;
	border-top-right-radius: 20px !important;
	border-bottom-right-radius: 20px !important;
}

section.kontakt .nf-form-content button, 
section.kontakt .nf-form-content input[type=button], 
section.kontakt .nf-form-content input[type=submit] {
    width: 100% !important;
    height: auto;
    margin: 25px 0 10px 0 !important;
    padding: 10px 0 10px 0 !important;
   	font: 1rem "Alata";
    color: var(--mittelgrun) !important;
    background: var(--hellgrun)!important;
    box-shadow: 3px 3px 2px rgba(0, 0, 0, 0.2) !important;
    transition: all 0.2s ease;
	border: solid 0px var(--weiss);
    cursor: pointer;
}

section.kontakt .nf-form-content button:hover, 
section.kontakt .nf-form-content input[type=button]:hover, 
section.kontakt .nf-form-content input[type=submit]:hover {
    color: var(--weiss)!important;
    background: var(--orange)!important;
    box-shadow: 3px 3px 2px rgba(0, 0, 0, 0.4) !important;
    cursor: pointer;
}

    

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




nav.menu-footernavigation-container {
	position: relative;
	z-index: 1;
	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 auto;
	padding: 0 0 0 0;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-around;
}

nav.menu-footernavigation-container ul li {
	display: block;
	height: auto;
	margin: 0 2% 0 0;
	padding: 0 0 0 0;
	list-style-type: none;
	flex: 1;
}

nav.menu-footernavigation-container ul li a {
	display: block;
	box-sizing: border-box;
	width: 100%;
	height: auto;
	margin: 0 0 0 0;
	padding: 5px 16px 5px 16px;
	border-top-right-radius: 10px;
	font: 0.9rem "Alata";
	color: var(--dunkelgrun);
	text-shadow: 0.4px 0.4px 0.2px rgba(0,0,0,0.25);
	transition: all 0.5s ease;
	background: var(--beige);
	box-shadow: 0px 1px 4px rgba(0,0,0,0.5);
}

nav.menu-footernavigation-container ul li a:hover {
	color: var(--weiss);
	background: var(--orange);
	
}

footer {
	position: relative;
	z-index: 10;
	width: 100%;
	height: auto;
	margin: 0 0 0 0;
	padding: 0 0 100px 0;
	background: var(--dunkelgrun);
	box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.8);
}

section.footerangaben {
	margin: 0 0 0 0;
	padding: 50px 0 70px 0;
	gap: 0rem 1rem;
}

section.footerangaben h2{
	grid-column: 1 / -1;
	width: 100%;
	height: auto;
	margin: 0 0 25px 0;
	padding: 0 0 0 0;
	font: 1.2rem "Alata";
	color:rgba(255,255,255,0.6);
	text-align: center;
}

section.footerangaben h4{
	grid-column: 1 / -1;
	width: 100%;
	height: auto;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	font: 0.6rem "Alata";
	color:rgba(255,255,255,0.6);
	text-align: center;
}

section.footerangaben article:nth-of-type(1){
	grid-column: 1 / 5;
}

section.footerangaben article:nth-of-type(2){
	grid-column: 5 / 9;
}

section.footerangaben article:nth-of-type(3){
	grid-column: 9 / -1;
}

section.footerangaben article h2{
	display: none;
}

section.footerangaben article p{
	width: 100%;
	height: auto;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	font: 0.7rem "Alata";
	color:rgba(255,255,255,0.6);
	text-align: left;
}

.footerlogo {
	width: auto;
	height: 75px;
	margin: 0 auto;
	padding: 0 0 0 0;
	background: url("img/logo.png") center/contain no-repeat;
	opacity: 0.8;
}


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



@media only screen and (max-width: 1200px) {
	
	main, .headernavi, .mandantennavi{
		width: 90%;
		margin: 0 5% 0 5%;
	}
	
	nav.menu-mandantennavigation-container ul li {
		flex: 0.18;
	}
	
	section.faelligkeiten article {
		rotate: 0deg;
	}
	
	.formularbereich nf-field #nf-field-29-container .nf-field {
		width: 100%;
	}
}

@media only screen and (max-width: 1080px) {
	header {
		height: 350px;
		margin: -40px 0 0 0;
		padding: 115px 0 0 0;
		background: url(img/header_hg.jpg) 17% 50% / cover no-repeat;
	}

	header .logo {
		width: auto;
		height: 130px;
		margin: 0 auto;
		padding: 0 0 0 0;
		background: url(img/logo.png) center/contain no-repeat;
	}
	
	nav.menu-mandantennavigation-container ul li {
		flex: 0.2;
	}
	
	section.basisinhalt article {
		grid-column: 1 / 7;
		margin: 25px 0 0 0;
		padding: 0 0 0 0;
	}
	
	section.basisinhalt article h2 {
		width: 100%;
		height: auto;
		margin: 0 0 15px 0;
		padding: 0 0 0 0;
		font: 2.5rem "Alata";
		color: var(--dunkelgrun);
	}
	
	section.kontakt article {
		grid-column: 3 / 11;
	}
	
	.formularbereich .nf-repeater-fieldset nf-fields-wrap {
		display: grid;
		grid-template-columns: repeat(4, 1fr);
		gap: 1rem;
	}
	
	.formularbereich form div nf-fields-wrap nf-field div#nf-field-15-wrap .nf-field-label,
	.formularbereich form div nf-fields-wrap nf-field div#nf-field-20-wrap .nf-field-label,
	.formularbereich form div nf-fields-wrap nf-field div#nf-field-22-wrap .nf-field-label{
    	grid-column: 1 / 3;
	}
	
	.formularbereich form div nf-fields-wrap nf-field div#nf-field-15-wrap .nf-field-element,
	.formularbereich form div nf-fields-wrap nf-field div#nf-field-20-wrap .nf-field-element,
	.formularbereich form div nf-fields-wrap nf-field div#nf-field-22-wrap .nf-field-element{
		grid-column: 3 / 5;
	}
	
}

@media only screen and (max-width: 850px) {
	
	nav.menu-mandantennavigation-container ul li {
		flex: 0.3;
	}
	
	section.basisinhalt article {
		grid-column: 2 / 12;
		margin: 25px 0 0 0;
		padding: 0 0 0 0;
	}
	
	section.leistungen article:nth-of-type(1) {
		grid-column: 2 / 12;
		width: 100%;
		height: auto;
		margin: 0 0 0 0;
		padding: 0 0 0 0;
		rotate: -1deg;
	}

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

	section.leistungen article:nth-of-type(3) {
		grid-column: 2 / 12;
		margin: 25px 0 0 0;
		rotate: 1deg;
	}

	section.leistungen .leistungsbild {
		display: none;
	}
	
	
	section.leistungen h2, 
	section.kontakt h2, 
	section.agbsection h2, 
	.formularbereich h2, 
	section.faelligkeiten h2,
	.downloadbereich h2 {
		font: 2.8rem "Alata";
	}
	
	section.leistungen article h3 {
    	font: 1.4rem "Alata";
	}
	
	section.leistungen article .textwidget ul li {
    	font: 1rem "Alata";
	}
	
	section.nurinhalt article{
		grid-column: 1 / -1;
	}
	
	section.agbsection article:nth-of-type(1) {
		grid-column: 1 / -1;
	}

	section.agbsection article:nth-of-type(2) {
		grid-column: 1 / -1;
	}
	
	section.faelligkeiten article table thead tr th:nth-of-type(1) {
		width: 25%;
	}

	section.faelligkeiten article table thead tr th {
		width: 25%;
		font: 1.2rem "Alata";
	}
	
	section.faelligkeiten article table tbody tr td {
		font: 1rem "Alata";
	}
	section.faelligkeiten article table tfoot tr td:nth-of-type(1) {
		font: 0.9rem "Alata";
	}
	
	section.faelligkeiten article table tfoot tr td {
		font: 0.7rem "Alata"
	}
	
	.formularbereich form div nf-fields-wrap nf-field div#nf-field-25-wrap .nf-field-element {
		font: 1.3rem "Alata";
	}
	
	.formularbereich .nf-repeater-fieldset nf-fields-wrap {
        grid-template-columns: repeat(3, 1fr);
    }
}


@media only screen and (max-width: 600px) {
	
	.headernavi .logobutton {
		display: none;
	}
	
	nav.menu-hauptnavigation-container {
		width: 100%;
	}
	
	nav.menu-mandantennavigation-container  {
		margin: 0 0 0 0;
	}
	
	nav.menu-hauptnavigation-container ul li {
		margin: 0 2% 0 0;
		flex: 1;
	}
	
	nav.menu-mandantennavigation-container ul li {
		margin: 0 2% 0 0;
		flex: 1;
	}
	
	nav.menu-hauptnavigation-container ul li a, 
	nav.menu-footernavigation-container ul li a, 
	nav.menu-mandantennavigation-container ul li a {
		font: 0.85rem "Alata";
		text-shadow: 0.4px 0.4px 0.2px rgba(0, 0, 0, 0);
	}
	
	header {
		height: 250px;
		margin: 0 0 0 0;
		padding: 73px 0 0 0;
		background: url(img/header_hg.jpg) 17% 50% / cover no-repeat;
	}

	header .logo {
		width: auto;
		height: 100px;
		margin: 0 auto;
		padding: 0 0 0 0;
		background: url(img/logo.png) center/contain no-repeat;
	}
	
	section.basisinhalt article h2, 
	section.nurinhalt article h2 {
        font: 2rem "Alata";
		line-height: 2.2rem;
    }
	
	section.basisinhalt article h3, 
	section.nurinhalt article h3 {
		margin: 20px 0 10px 0;
		font: 1.5rem "Alata";
		line-height: 1.5rem;
	}

	section.basisinhalt article h4, 
	section.nurinhalt article h4 {
		margin: 20px 0 5px 0;
		font: 1.2rem "Alata";
		line-height: 1.2rem;
	}

	section.basisinhalt article p, 
	section.nurinhalt article p {
		font: 0.8rem "Alata";
		line-height: 1.2rem;
	}
	
	section.basisinhalt article ul li, 
	section.nurinhalt article ul li{
		margin: 0 0 8px 0;
		padding: 5px 14px 4px 8px;
		font: 0.8rem "Alata";
	}
	
	section.basisinhalt aside {
		display: none;
	}
	
	section.leistungen h2, 
	section.kontakt h2, 
	section.agbsection h2, 
	.formularbereich h2,
	section.faelligkeiten h2,
	.downloadbereich h2 {
		font: 2rem "Alata";
		margin: 0 0 0 0;
	}
	
	section.leistungen {
		padding: 25px 0 50px 0;
	}
	
	
	section.leistungen article:nth-of-type(2) {
        margin: 10px 0 0 0;
    }
	
	section.leistungen article:nth-of-type(3) {
        margin: 10px 0 0 0;
    }
	
	section.leistungen aside {
    	grid-column: 1 / -1;
	}
	
	section.leistungen article h3 {
    	font: 1.2rem "Alata";
	}
	
	section.leistungen article .textwidget ul li {
    	font: 0.9rem "Alata";
	}
	
	section.leistungen aside h4 {
		font: 0.7rem "Alata";
	}
	
	section.leistungen aside p {
		line-height: 0.9rem;
	}
	
	section.agbsection h4 {
		margin: 0 0 0 0;
		font: 0.9rem "Alata";

	}
	
	.agb a.agb_titel {
    	font: 1.2rem "Alata";
	}
	
	.agb dd {
		font: 0.9rem "Alata";
		line-height: 1.3em;
	}
	
	section.kontakt article {
		grid-column: 1 / -1;
	}
	
	.nf-form-fields-required {
		font: 0.8rem "Alata";
	}
	
	.nf-form-content .list-select-wrap .nf-field-element>div, 
	.nf-form-content input:not([type=button]), 
	.nf-form-content textarea, .nf-form-content select {
    	font: 0.8rem "Alata";
	}
	
	.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 {
		font: 0.8rem "Alata";
		color: rgba(255,255,255,0.7);
	}
	
	.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: 0.8rem "Alata";
	}
	
	label#nf-label-field-9 {
		font: 0.9rem "Alata";
	}
	
	.checkbox-container.label-right .field-wrap>div {
		color: var(--mittelgrun);
		font: 0.8rem "Alata";
	}

	.label-right .nf-field-description p {
		font: 0.6rem "Alata";
	}

	.label-right .nf-field-description a{
		margin: 0 0 0 0 !important;
		font: 0.6rem "Alata";
		color: var(--dunkelgrun)!important;
	}
	
	section.kontakt form div nf-fields-wrap nf-field:nth-of-type(9){
		grid-column: 1 / -1;
	}
	
	section.footerangaben article:nth-of-type(1) {
		grid-column: 1 / 7;
	}
	
	section.footerangaben article:nth-of-type(2) {
		grid-column: 7 / -1;
	}
	
	section.footerangaben article:nth-of-type(3) {
		margin: 25px 0 0 0;
		grid-column: 4 / 10;
	}
	
	section.footerangaben article p {
		text-align: center;
	}
	
	.formularbereich form div nf-fields-wrap nf-field div#nf-field-25-wrap .nf-field-element {
		font: 1.1rem "Alata";
	}
	
	.formularbereich form div nf-fields-wrap nf-field div#nf-field-15-wrap .nf-field-label,
	.formularbereich form div nf-fields-wrap nf-field div#nf-field-20-wrap .nf-field-label,
	.formularbereich form div nf-fields-wrap nf-field div#nf-field-22-wrap .nf-field-label{
    	grid-column: 1 / 5;
	}
	
	.formularbereich form div nf-fields-wrap nf-field div#nf-field-15-wrap .nf-field-element,
	.formularbereich form div nf-fields-wrap nf-field div#nf-field-20-wrap .nf-field-element,
	.formularbereich form div nf-fields-wrap nf-field div#nf-field-22-wrap .nf-field-element{
		grid-column: 5 / -1;
	}
	
	section.faelligkeiten article table thead tr th {
        font: 1.1rem "Alata";
    }
	
	section.faelligkeiten article table tbody tr td {
        font: 0.9rem "Alata";
    }
	
	section.faelligkeiten article table tfoot tr td:nth-of-type(1) {
        font: 0.8rem "Alata";
    }
	
	section.faelligkeiten article table tfoot tr td {
        font: 0.6rem "Alata";
    }
	
	.downloadbereich .downloads aside .sdm_download_item .sdm_download_item_top .sdm_download_title {
    	font: 1.3em "Alata"
	}
	
	.downloadbereich .downloads aside .sdm_download_item .sdm_download_description p {
		font: 0.9rem "Alata";
	}
	
	.downloadbereich .downloads aside .sdm_download_item .sdm_download_link .sdm_download_button a {
		font: 0.9rem "Alata";
	}
	
	.formularbereich .nf-repeater-fieldset nf-fields-wrap {
        grid-template-columns: repeat(2, 1fr);
    }
	
	.formularbereich .nf-repeater-fieldset nf-fields-wrap nf-field .nf-field-label {
		font: 0.8rem "Alata";
	}
	
	.formularbereich div.nf-field div button.nf-add-fieldset {
		font: 0.9rem "Alata";
	}
	
	.formularbereich nf-field #nf-field-29-container .nf-field #nf-field-29-wrap .nf-field-label label#nf-label-field-29 {
    	font: 1.1rem "Alata";
	}
	
	.formularbereich nf-field #nf-field-29-container .nf-field #nf-field-29-wrap .nf-field-element button.nf-fu-fileinput-button {
		font: 0.9rem "Alata";
	}
}