/*
Theme Name: Vermessungsbüro Thomas Weiß
Theme URI: http://www.vonhogendorf.de/
Description: Seitengestaltung von Hogendorf
Author: Michael Neubert-Zimmer
Author URI: http://vonhogendorf.de/
Version: 1.4
Tags: 

License:
License URI:

*/



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

:root {
	--hauptrot: rgb(223,45,44);
	--dunkelrot: rgb(166,33,3);
	--hellrot: rgb(242,107,118);
	--lichtrot: rgb(250,197,201);
	--orange: rgb(255,165,0);
	--dunkelgrau: rgb(13,13,13);
	--hellgrau: rgb(219,219,219);
	--lichtgrau: rgb(242,242,242);
	--weiss: rgb(255,255,255);
}



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

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

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

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

@font-face {
	font-family: "Jost";
	src:url("fonts/Jost-Bold.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;
	position: sticky;
	top: 0;
	z-index: 100;
}

.headernavi .logobutton {
	position: relative;
	z-index: 20;
	width: 390px;
    height: 72px;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    background: url("img/LogoNavi.jpg") center no-repeat;
    background-size: cover;
	    box-shadow: -2px 1px 5px rgba(0, 0, 0, 0.5);
}

nav.menu-hauptnavigation-container {
	width:  calc(100% - 390px);
	height: auto;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	background: var(--hauptrot);
	    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
}

nav.menu-hauptnavigation-container ul {
	width: 100%;
	height: auto;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	gap: 0rem;
	justify-content: space-around;
	background: var(--weiss);
	
}

nav.menu-hauptnavigation-container ul li {
	display: block;
	height: auto;
	margin: 10px 0 0 0;
	padding: 0 0 0 0;
	list-style-type: none;
	border-right: solid 2px rgb(219,219,219);
}

nav.menu-hauptnavigation-container ul li:last-of-type{
	grid-column: span 2;
	border-right: solid 0px rgb(219,219,219);
}

nav.menu-hauptnavigation-container ul li a {
	display: block;
	box-sizing: border-box;
	width: 100%;
	height: auto;
	margin: 0 0 0 0;
	padding: 3px 0px 3px 0px;
	font: 100 0.8rem "Jost";
	color: var(--grau);
	text-align: center;
	transition: all 0.5s ease;
	
}

nav.menu-hauptnavigation-container ul li:last-of-type a {
	border-right: solid 0px rgb(219,219,219);
}

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

nav.menu-hauptnavigation-container ul li.current_page_item {
	color: var(--hauptrot);
}

nav.menu-hauptnavigation-container ul li:first-of-type.current_page_item {
	color: var(--grau);
}


header {
	box-sizing: border-box;
	width: 100%;
	height: 500px;
	margin: -72px 0 0 0;
	padding: 240px 0 0 0;
}

header#startseite {
	background: url("img/startseite.jpg") 70% 30% no-repeat;
	background-size: cover;
}

header#referenzseite {
	background: url("img/projekte.jpg") 20% 80% no-repeat;
	background-size: cover;
}

header#bekanntmachungen {
	background: url("img/bekanntmachungen.jpg") 30% 70% no-repeat;
	background-size: cover;
}

header#liegenschaftskarten {
	background: url("img/liegenschaftskarten.jpg") center no-repeat;
	background-size: cover;
}

header#ingenieurvermessung {
	background: url("img/ingenieurvermessung.jpg") center no-repeat;
	background-size: cover;
}

header#leistungen {
	background: url("img/leistungen.jpg") 30% 70% no-repeat;
	background-size: cover;
}

header#ueberuns {
	background: url("img/ueberuns.jpg") 20% 80% no-repeat;
	background-size: cover;
}

header#vermessung {
	background: url("img/katastervermessung.jpg") 20% 80% no-repeat;
	background-size: cover;
}

header#antrag {
	background: url("img/antrag.jpg") center no-repeat;
	background-size: cover;
}

header#engagement {
	background: url("img/engagement.jpg") 50% 50% no-repeat;
	background-size: cover;
}


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


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

.inhaltsbereich {
	position: relative;
	z-index: 1;
	width: 100%;
	height: auto;
	margin: -32px 0 0 0;
	padding: 120px 0 140px 0;
	background: var(--lichtgrau);
}


.ueberschriftcontainer {
	position: relative;
	z-index: 10;
	box-sizing: border-box;
	width:  100%;
	height: auto;
	margin: -32px 0 0 0;
	padding: 16px 16px 16px 16px;
	background: var(--weiss);
}

h1 {
	display: block;
	box-sizing: border-box;
	width: 100%;
  	height: 100%;
	margin: 0 0 0 0;
	padding: 32px 16px 16px 16px;
	font: 500 2.3rem "Jost";
	line-height: 2.5rem;
	letter-spacing: 1px;
	color: var(--weiss);
	text-align: left;
	transition: all 0.5s ease;
	
}

h1.rotertitel {
	background: var(--hauptrot);
}

h1.orangertitel {
	background: var(--orange);
}


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

.startnavi {
	width: 1200px;
	height: auto;
	margin: 0 auto;
	padding: 0;
	position: relative;
	z-index: 10;
}

nav.menu-startnavigation-container {
	box-sizing: border-box;
	width:  100%;
	height: auto;
	margin: -32px 0 0 0;
	padding: 16px 16px 16px 16px;
	background: var(--weiss);
}

nav.menu-startnavigation-container ul {
	width: 100%;
	height: auto;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1rem;
	align-items: stretch;
}

nav.menu-startnavigation-container ul li {
	width: 100%;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	list-style-type: none;
	
	display: flex;
}

nav.menu-startnavigation-container ul li a {
	box-sizing: border-box;
	display: flex;
  	flex-direction: column;
  	justify-content: flex-end;
  	width: 100%;
  	height: 100%;
	margin: 0 0 0 0;
	padding: 16px 16px 16px 16px;
	font: 500 1.7rem "Jost";
	line-height: 1.8rem;
	letter-spacing: 1px;
	color: var(--weiss);
	text-align: left;
	transition: all 0.5s ease;
	background: var(--hauptrot);
}

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


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

section.startinhalt {}

section.startinhalt aside {
	grid-column: 2 / 6;
}

section.startinhalt aside img {
    width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    overflow: hidden;
}

section.startinhalt article {
	grid-column: 7 / 12;
}

section.startinhalt article h2 {
	width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
	font: 500 1.8rem "Jost";
	line-height: 1.8rem;
	letter-spacing: 1px;
	color: var(--hauptrot);
}

section.startinhalt article h3 {
	width: 100%;
    height: auto;
    margin: 0 0 25px 0;
    padding: 0 0 0 0;
	font: 400 1.8rem "Jost";
	line-height: 1.8rem;
	letter-spacing: 1px;
	color: var(--hauptrot);
}

section.startinhalt article p {
	width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
	font: 200 1rem "Jost";
	line-height: 1.5rem;
	color: var(--grau);
}

section.startinhalt .logo {
	grid-column: 1 / -1;
	width: 100%;
	height: 150px;
	margin: 25px 0 0 0;
	padding: 0 0 0 0;
	background: var(--weiss) url("img/LogoStart.png") center/contain no-repeat;
}


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

section.startreferenzen{
	margin: 100px 0 160px 0;
    padding: 0 0 0 0;
	gap:0rem;
}

section.startreferenzen h2{
	grid-column: 1 / -1;
	width: 100%;
    height: auto;
    margin: 0 0 40px 0;
    padding: 0 0 0 0;
	font: 500 2.2rem "Jost";
	line-height: 2rem;
	letter-spacing: 1px;
	text-align: left;
	color: var(--orange);
}

section.startreferenzen ul{
	grid-column: 1 / -1;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
	width: 100%;
	height: auto;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
}

section.startreferenzen ul li{
	display:none;
}

section.startreferenzen ul li:nth-of-type(1),
section.startreferenzen ul li:nth-of-type(2),
section.startreferenzen ul li:nth-of-type(3){
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	width: 100%;
	margin: 0 0 0 0;
	padding: 0 0 0 12px;
	list-style-type: none;
	border-left: solid 6px var(--orange);
}

section.startreferenzen ul li a.image {
	display: block;
	width: 100%;
    height: 180px;
    margin: 0 0 15px 0;
    padding: 0 0 0 0;
    position: relative;
    overflow: hidden;
	opacity: 1;
	transition: all 0.5s ease;
}

section.startreferenzen ul li a.image:hover {
	opacity: 0.7;
}

section.startreferenzen ul li a.image img{
	position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: translate(-50%, -50%);
}


section.startreferenzen ul li a.title {
	display: block;
	width: 100%;
    height: auto;
    margin: 0 0 10px 0;
    padding: 0 0 0 0;
   	font: 300 1.45rem "Jost";
	line-height: 1.5rem;
	letter-spacing: 1px;
	text-align: left;
	color: var(--orange);
	transition: all 0.5s ease;
}

section.startreferenzen ul li a.title:hover {
	color: var(--hauptrot);
}

section.startreferenzen ul li div.content {}


section.startreferenzen ul li div.content p{
	width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
   	font: 100 0.9rem "Jost";
	line-height: 1.1rem;
	text-align: left;
	color: var(--grau);
}

section.startreferenzen ul li div.content p a{
	display: block;
	width: fit-content;
    height: auto;
    margin: 16px 0 0 0;
    padding: 6px 12px 6px 12px;
   	font: 200 1rem "Jost";
	color: var(--weiss);
	background: var(--orange);
	transition: all 0.5s ease;
}

section.startreferenzen ul li div.content p a:hover {
	background: var(--hauptrot);
}




/* ######################################################################################################################### */
/* Spezialseiten */
/* ######################################################################################################################### */


section.spezialinhalt {}



section.spezialinhalt aside {
	grid-column: 1 / 6;
	box-sizing: border-box;
	width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 24px 24px 32px 24px;
	background: var(--orange);
}

section.spezialinhalt aside h3 {
	width: 100%;
    height: auto;
    margin: 0 0 18px 0;
    padding: 0 0 0 0;
	font: 400 1.95rem "Jost";
	line-height: 2rem;
	letter-spacing: 1px;
	color: var(--weiss);
}

section.spezialinhalt aside .textwidget {
	width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
}

section.spezialinhalt aside .textwidget ul{
	width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 19px;
	list-style-type: square;
}

section.spezialinhalt aside .textwidget ul li{
	box-sizing: border-box;
	width: 100%;
    height: auto;
    margin: 0 0 10px 0;
    padding: 0 10px 0 0;
	font: 200 1.2rem "Jost";
	line-height: 1.4rem;
	color: var(--weiss);
}

section.spezialinhalt article {
	grid-column: 7 / 12;
}

section.spezialinhalt article h2 {
	width: 100%;
    height: auto;
    margin: 35px 0 10px 0;;
    padding: 0 0 0 0;
	font: 500 1.8rem "Jost";
	line-height: 1.8rem;
	letter-spacing: 1px;
	color: var(--hauptrot);
}

section.spezialinhalt article h3 {
	width: 100%;
    height: auto;
    margin: 35px 0 10px 0;;
    padding: 0 0 0 0;
	font: 400 1.7rem "Jost";
	line-height: 1.7rem;
	letter-spacing: 1px;
	color: var(--hauptrot);
}

section.spezialinhalt article h4 {
	width: 100%;
    height: auto;
    margin: 35px 0 10px 0;;
    padding: 0 0 0 0;
	font: 300 1.6rem "Jost";
	line-height: 1.5rem;
	letter-spacing: 1px;
	color: var(--hauptrot);
}

section.spezialinhalt article p {
	width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
	font: 200 1rem "Jost";
	line-height: 1.5rem;
	color: var(--dunkelgrau);
}

section.spezialinhalt article ul{
	width: 100%;
    height: auto;
    margin: 15px 0 25px 0;
    padding: 0 0 0 19px;
	list-style-type: square;
}

section.spezialinhalt article ul li{
	box-sizing: border-box;
	width: 100%;
    height: auto;
    margin: 0 0 10px 0;
    padding: 0 0 0 0;
	font: 200 1rem "Jost";
	line-height: 1.2rem;
	color: var(--dunkelrot);
}

section.spezialinhalt a.zurucklink {
	display: block;
	box-sizing: border-box;
	grid-column: 1 / 2;
	margin: 0 0 0 0;
    padding: 10px 16px 10px 16px;
    font: 300 1rem "Jost";
	text-decoration: none;
    color: var(--weiss);
    background: var(--hauptrot);
	transition: all 0.2s ease;
}

section.spezialinhalt a.zurucklink:hover {
	background: var(--orange);
}


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

section.basisinhalt {}



section.basisinhalt aside {
	grid-column: 8 / 12;
	box-sizing: border-box;
	width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
}

section.basisinhalt aside img {
    width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    overflow: hidden;
}

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

section.basisinhalt article h2 {
	width: 100%;
    height: auto;
    margin: 35px 0 10px 0;
    padding: 0 0 0 0;
	font: 500 1.8rem "Jost";
	line-height: 1.8rem;
	letter-spacing: 1px;
	color: var(--hauptrot);
}

section.basisinhalt article h2.oben {
	margin: 0 0 10px 0;
	font: 500 2.2rem "Jost";
	line-height: 2.5rem;
}

section.basisinhalt article h3 {
	width: 100%;
    height: auto;
    margin: 35px 0 10px 0;;
    padding: 0 0 0 0;
	font: 400 1.7rem "Jost";
	line-height: 1.7rem;
	letter-spacing: 1px;
	color: var(--hauptrot);
}

section.basisinhalt article h3.oben3 {
	margin: -5px 0 25px 0;
}

section.basisinhalt article h4 {
	width: 100%;
    height: auto;
    margin: 35px 0 10px 0;;
    padding: 0 0 0 0;
	font: 300 1.6rem "Jost";
	line-height: 1.5rem;
	letter-spacing: 1px;
	color: var(--hauptrot);
}

section.basisinhalt article p {
	width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
	font: 200 1rem "Jost";
	line-height: 1.5rem;
	color: var(--dunkelgrau);
}

section.basisinhalt article a {
	font: 400 1rem "Jost";
	color: var(--dunkelrot);
}

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

section.basisinhalt article ul{
	width: 100%;
    height: auto;
    margin: 15px 0 25px 0;
    padding: 0 0 0 19px;
	list-style-type: square;
}

section.basisinhalt article ul li{
	box-sizing: border-box;
	width: 100%;
    height: auto;
    margin: 0 0 10px 0;
    padding: 0 0 0 0;
	font: 200 1rem "Jost";
	line-height: 1.2rem;
	color: var(--dunkelrot);
}

section.basisinhalt article ol{
	width: 100%;
    height: auto;
    margin: 15px 0 25px 0;
    padding: 0 0 0 19px;
}

section.basisinhalt article ol li{
	box-sizing: border-box;
	width: 100%;
    height: auto;
    margin: 0 0 10px 0;
    padding: 0 0 0 0;
	font: 200 1rem "Jost";
	line-height: 1.5rem;
	color: var(--dunkelgrau);
}

section.basisinhalt article ol li::marker {
	font-weight: 400;
}

section.basisinhalt article table {
	width: 100%;
    height: auto;
    margin: 15px 0 25px 0;
    padding: 0 0 0 0;
	border-spacing: 5px 10px;
}

section.basisinhalt article table tr{
	padding: 0 0 0 0;
}

section.basisinhalt article table tr td{
	box-sizing: border-box;
	padding: 5px;
	font: 200 1rem "Jost";
	line-height: 1.4rem;
	color: var(--dunkelgrau);
	background: rgba(33, 33, 33,0.1);
}

section.basisinhalt a.zurucklink {
	display: block;
	box-sizing: border-box;
	grid-column: 2 / 3;
	margin: 33px 0 0 0;
    padding: 10px 16px 10px 16px;
    font: 300 1rem "Jost";
	text-decoration: none;
    color: var(--weiss);
    background: var(--hauptrot);
	transition: all 0.2s ease;
}

section.basisinhalt a.zurucklink:hover {
	background: var(--orange);
}


/* ######################################################################################################################### */
/* Gallerien */

.gallery {
	width: 100%;
	height: auto;
	margin: 35px 0 45px 0!important;
	padding: 0 0 0 0;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1rem;
}

.gallery br {
	display: none;
}

.gallery .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 {
	width: 100%;
	height: 210px;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	position: relative; /* Macht das div zum Bezugspunkt */
    overflow: hidden; /* Schneidet überstehende Bildteile ab */
	border-left: solid 6px var(--orange);
}

.gallery .gallery-item .gallery-icon a {}

.gallery .gallery-item .gallery-icon a img {
	position: absolute;
    top: 50%;
    left: 50%;
    width: 100%; /* Füllt das div horizontal */
    height: 100%; /* Füllt das div vertikal */
    object-fit: cover; /* Schneidet das Bild passend zu */
    transform: translate(-50%, -50%); /* Zentriert das Bild perfekt */
}



/* ######################################################################################################################### */
/* Referenzen */
/* ######################################################################################################################### */

section.referenzinhalt {}

section.referenzinhalt article{
	grid-column: span 4;
	box-sizing: border-box;
    width: 100%;
    margin: 0 0 0 0;
    padding: 0 0 0 12px;
    border-left: solid 6px var(--orange);
}

section.referenzinhalt article:first-of-type {
	grid-column: 1 / -1;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1rem;
	margin: 0 0 100px 0;
}

section.referenzinhalt article .beitragsbild {
	
}

section.referenzinhalt article:first-of-type .beitragsbild {
	grid-column: 1 / 2;
}

section.referenzinhalt article .beitragsbild a {
	display: block;
    width: 100%;
    height: 180px;
    margin: 0 0 15px 0;
    padding: 0 0 0 0;
    position: relative;
    overflow: hidden;
    opacity: 1;
    transition: all 0.5s ease;
}

section.referenzinhalt article:first-of-type .beitragsbild a {
	height: 350px;
	margin: 0 0 0 0;
}

section.referenzinhalt article .beitragsbild a:hover {
	opacity: 0.7;
}

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


section.referenzinhalt article .beitrag {}

section.referenzinhalt article:first-of-type .beitrag {
	grid-column: 2 / -1;
}

section.referenzinhalt article .beitrag h2{
	width: 100%;
    height: auto;
	margin: 0 0 0 0;
    padding: 0 0 0 0;
}

section.referenzinhalt article .beitrag h2 a{
	display: block;
    width: 100%;
    height: auto;
    margin: 0 0 10px 0;
    padding: 0 0 0 0;
    font: 300 1.45rem "Jost";
    line-height: 1.5rem;
    letter-spacing: 1px;
    text-align: left;
    color: var(--orange);
    transition: all 0.5s ease;
}

section.referenzinhalt article:first-of-type .beitrag h2 a {
	font: 300 2rem "Jost";
    line-height: 2rem;
	margin: 0 0 25px 0;
}

section.referenzinhalt article .beitrag h2 a:hover {
	color: var(--hauptrot);
}

section.referenzinhalt article .beitrag p{
	width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    font: 100 0.9rem "Jost";
    line-height: 1.1rem;
    text-align: left;
    color: var(--dunkelgrau);
}

section.referenzinhalt article:first-of-type .beitrag p {
	font: 100 1.1rem "Jost";
    line-height: 1.4rem;
}

section.referenzinhalt article .beitrag p a{
	display: block;
    width: fit-content;
    height: auto;
    margin: 16px 0 0 0;
    padding: 6px 12px 6px 12px;
    font: 200 1rem "Jost";
    color: var(--weiss);
    background: var(--orange);
    transition: all 0.5s ease;
}

section.referenzinhalt article .beitrag p a:hover {
	background: var(--hauptrot);
}

.beitragsnavi {
	width: 100%;
	height: auto;
	margin: 100px 0 0 0;
    padding: 0 0 0 0;
}

.beitragsnavi ul {
	width: 100%;
	height: auto;
	margin: 0 0 0 0;
    padding: 0 0 0 0;
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
}

.beitragsnavi ul li{
	display: flex;
	height: auto;
	margin: 0 0 0 1%;
    padding: 5px 2% 7px 2%;
	list-style: none;
	text-align: center;
	font: 200 0.9rem "Jost";
	background: var(--hellgrau);
	color: var(--weiss);
	transition: all 0.5s ease;
}

.beitragsnavi ul li:nth-of-type(1) {
	margin: 0 0 0 0;
	background: var(--hauptrot);
	color: var(--weiss);
}

.beitragsnavi ul li:hover{
	background: var(--orange);
	color: var(--weiss)!important;
}

.beitragsnavi ul li:hover a{
	color: var(--weiss)!important;
}


.beitragsnavi ul li span.current{
	font: 400 0.9rem "Jost";
}

.beitragsnavi ul li a{
	display: flex;
    flex-direction: column;
    justify-content: center;
	width: 100%;
	height: auto;
	color: var(--weiss);
	transition: all 0.5s ease;
}

.beitragsnavi ul li a:hover{}


/* ######################################################################################################################### */
/* Engagement */
/* ######################################################################################################################### */

section.engagementinhalt {}

section.engagementinhalt article{
	grid-column: span 4;
	box-sizing: border-box;
    width: 100%;
    margin: 0 0 0 0;
    padding: 0 0 0 12px;
    border-left: solid 6px var(--hauptrot);
}

section.engagementinhalt article:first-of-type {
	grid-column: 1 / -1;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1rem;
	margin: 0 0 100px 0;
}


section.engagementinhalt article:first-of-type .beitragsbild {
	grid-column: 1 / 2;
}

section.engagementinhalt article .beitragsbild {
	display: block;
    width: 100%;
    height: 180px;
    margin: 0 0 15px 0;
    padding: 0 0 0 0;
    position: relative;
    overflow: hidden;
    opacity: 1;
    transition: all 0.5s ease;
}

section.engagementinhalt article:first-of-type .beitragsbild {
	height: 350px;
	margin: 0 0 0 0;
}


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


section.engagementinhalt article .beitrag {}

section.engagementinhalt article:first-of-type .beitrag {
	grid-column: 2 / -1;
}

section.engagementinhalt article .beitrag h2{
	width: 100%;
    height: auto;
    margin: 0 0 10px 0;
    padding: 0 0 0 0;
    font: 300 1.45rem "Jost";
    line-height: 1.5rem;
    letter-spacing: 1px;
    text-align: left;
    color: var(--hauptrot);
}

section.engagementinhalt article:first-of-type .beitrag h2{
	font: 300 2rem "Jost";
    line-height: 2rem;
	margin: 0 0 25px 0;
}

section.engagementinhalt article .beitrag p{
	width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    font: 100 0.9rem "Jost";
    line-height: 1.1rem;
    text-align: left;
    color: var(--dunkelgrau);
}

section.engagementinhalt article:first-of-type .beitrag p {
	font: 100 1.1rem "Jost";
    line-height: 1.4rem;
}




/* ######################################################################################################################### */
/* Teamseite */
/* ######################################################################################################################### */


section.teambereich {
	margin: 100px 0 160px 0;
}


section.teambereich h2 {
	grid-column: 1 / -1;
	width: 100%;
	height: auto;
	margin: 0 0 0 0;
    padding: 0 0 0 0;
    font: 500 2.2rem "Jost";
    line-height: 2rem;
    letter-spacing: 1px;
    text-align: left;
    color: var(--hauptrot);
}

section.teambereich aside {
	grid-column: span 4;
	box-sizing: border-box;
    width: 100%;
    margin: 0 0 50px 0;
    padding: 0 32px 0 12px;
    border-left: solid 6px var(--hauptrot);
}

section.teambereich aside h3.teamtitle{
	display: none;
}

section.teambereich aside div.wp-caption {
	width: 100% !important;
	height: auto;
	margin: 0 0 0 0;
    padding: 0 0 0 0;
}

section.teambereich aside div.wp-caption img{
	width: 100% !important;
    height: auto !important;
    background-position: center;
    text-align: center;
    overflow: hidden !important;
    border: solid 0pt rgba(135, 11, 13, 1.00);
}

section.teambereich aside div.wp-caption p{
	display: none;
}

section.teambereich aside div.wp-caption h2{
	width: 100%;
	height: auto;
	margin: 12px 0 5px 0;
    padding: 0 0 0 0;
	font: 400 1.6rem "Jost";
    line-height: 1.7rem;
    letter-spacing: 1px;
    text-align: left;
    color: var(--hauptrot);
}

section.teambereich aside div.wp-caption h3{
	width: 100%;
	height: auto;
	margin: 0 0 25px 0;
    padding: 0 0 0 0;
	font: 300 1.2rem "Jost";
    line-height: 1.2rem;
    letter-spacing: 1px;
    text-align: left;
    color: var(--hellrot);
}

section.teambereich aside div.wp-caption h4{
	width: 100%;
	height: auto;
	margin: 0 0 0 0;
    padding: 0 0 0 0;
	font: 200 1rem "Jost";
    line-height: 1.2rem;
    letter-spacing: 1px;
    text-align: left;
    color: var(--hellrot);
}


/* ######################################################################################################################### */
/* Downloads */
/* ######################################################################################################################### */

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

section.basisinhalt aside div.downloadbereich div.download{
	width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
}


section.basisinhalt aside div#antraege div.download:last-of-type{
	display: none;
}

section.basisinhalt aside div#bekanntmachungen div.download:first-of-type{
	display: none;
}

section.basisinhalt aside div.downloadbereich div.download h3{
	display: none;
}

section.basisinhalt aside div.downloadbereich div.download div.textwidget{
	width: 100%;
    height: auto;
    margin: 35px 0 0 0;
    padding: 0 0 0 0;
}


section.basisinhalt aside div.downloadbereich div.download div.textwidget .sdm_download_item {
	display: block;
	box-sizing: border-box;
	margin: 0 0 16px 0;
	padding: 16px 16px 32px 16px;
    border: 0px solid #E7E9EB;
	background: var(--orange);
	box-shadow: 3px 3px 2px rgba(0, 0, 0, 0.0) !important;
}

section.basisinhalt aside div.downloadbereich div.download div.textwidget .sdm_download_item .sdm_download_item_top {
	
}

section.basisinhalt aside div.downloadbereich div.download div.textwidget .sdm_download_item .sdm_download_item_top .sdm_download_thumbnail {
	display: none;
}

section.basisinhalt aside div.downloadbereich div.download div.textwidget .sdm_download_item .sdm_download_item_top .sdm_download_title {
	width: 100%;
    height: auto;
    margin: 0 0 25px 0;
    padding: 0 0 0 0;
	font: 300 1.6rem "Jost";
	line-height: 1.8rem;
    color: var(--weiss);
}

section.basisinhalt aside div.downloadbereich div.download div.textwidget .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;
}

section.basisinhalt aside div.downloadbereich div.download div.textwidget .sdm_download_item .sdm_download_description p {
	width: 100%;
    height: auto;
    margin: 6px 0 32px 0;
    padding: 0 0 0 0;
	font: 200 1rem "Jost";
    color: var(--hauptrot);
}

section.basisinhalt aside div.downloadbereich div.download div.textwidget .sdm_download_item .sdm_download_link {}

section.basisinhalt aside div.downloadbereich div.download div.textwidget .sdm_download_item .sdm_download_link .sdm_download_button {}

section.basisinhalt aside div.downloadbereich div.download div.textwidget .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: 300 1rem "Jost";
    color: var(--weiss) !important;
    background: var(--hauptrot) !important;
    box-shadow: 3px 3px 2px rgba(0, 0, 0, 0.0) !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;
}

section.basisinhalt aside div.downloadbereich div.download div.textwidget .sdm_download_item .sdm_download_link .sdm_download_button a:hover{
	cursor: pointer;
	background: var(--orange) !important;
}


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

section.karte {
	grid-template-columns: repeat(1, 1fr);
    gap: 0rem;
	width: 100%;
    height: 160px;
    margin: 75px 0 100px 0;
    padding: 0 0 0 0;
}

section.karte iframe {
    grid-column: 1 / -1;
    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 {
	margin: 0 0 200px 0;
}

section.kontakt h2{
	grid-column: 2 / -1;
	font: 500 2.2rem "Jost";
	line-height: 2rem;
	letter-spacing: 1px;
	text-align: left;
	color: var(--hauptrot);
}

section.kontakt aside{
	grid-column: 2/ 5;
}

section.kontakt aside h3{
	margin: 0 0 15px 0;
    padding: 0 0 0 0;
	font: 400 1.4rem "Jost";
	color: var(--dunkelgrau);
}

section.kontakt aside p{
	margin: 0 0 0 0;
    padding: 0 0 0 0;
	font: 200 1.1rem "Jost";
	color: var(--dunkelgrau);
}

section.kontakt article{
	grid-column: 6 / 12;
}

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

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

.nf-field-label {
	display: none;
}

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

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

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

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

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

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

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

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

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

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

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


.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: 100 1rem "Jost";
	color: var(--hellrot);
	
}

.nf-form-content .list-select-wrap .nf-field-element>div, .nf-form-content input:not([type=button]), .nf-form-content textarea {
    width: 100%;
    height: auto;
	min-height: 50px;
    margin: 0 0 0 0;
    padding: 0 0 0 2%;
    color: var(--dunkelgrau)!important;
    font: 100 1rem "Jost";
    background: var(--hellgrau)!important;
	border: 0px rgb(0,0,0) solid;
    border-top-left-radius: 0px !important;
	border-top-right-radius: 0px !important;
	border-bottom-left-radius: 0px !important;
	border-bottom-right-radius: 0 !important;
}

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


.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 {
	color: var(--weiss);
    font: 100 1rem "Jost";
}

.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]) {
	color: var(--weiss);
    font: 200 1rem "Jost";
}


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

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

label#nf-label-field-10 {
    font: 500 1rem "Jost";
    color: var(--dunkelgrau);
}

label#nf-label-field-10 a {
    font: 500 1rem "Jost";
    color: var(--hauptrot);
}

label#nf-label-field-10 a:hover {
    color: var(--orange);
}

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

.checkbox-container.label-right .field-wrap>div {
	font: 300 1rem "Jost";
    color: var(--dunkelgrau);
}

.label-right .nf-field-description p {
	font: 100 1rem "Jost";
}

.label-right .nf-field-description a{
    margin: 0 0 0 0 !important;
	font: 500 1rem "Jost";
    color: var(--hauptrot)!important;
}

.label-right .nf-field-description a:hover{
	font: 500 1rem "Jost";
    margin: 0 0 0 0 !important;
	color: var(--orange)!important;
}

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

.nf-error .nf-error-msg {
	font: 200 1rem "Jost";
    color: var(--hauptrot) !important;
	border-top-right-radius: 20px !important;
	border-bottom-right-radius: 20px !important;
}
.nf-form-content button, .nf-form-content input[type=button], .nf-form-content input[type=submit] {
    width: 100% !important;
    height: auto;
    margin: 25px 0 10px 0 !important;
    padding: 10px 0 10px 0 !important;
   	font: 300 1rem "Jost";
    color: var(--weiss) !important;
    background: var(--hauptrot)!important;
    box-shadow: 5px 5px 5px rgba(0,0,0,0.0)!important;
    transition: all 0.2s ease;
    cursor: pointer;
}

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


.tax_term_description{
	font: 500 1rem "Jost";
}

.nf-response-msg p {
	font: 500 1rem "Jost";
	color:  var(--hauptrot);
}


    

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

footer {
	width: 100%;
	height: auto;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
}

footer .roterteil {
	width: 100%;
	height: auto;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	background: var(--dunkelrot);
}


footer .grauerteil {
	width: 100%;
	height: auto;
	margin: 0 0 0 0;
	padding: 50px 0 150px 0;
	background: linear-gradient(rgba(13,13,13,0.8), rgba(13,13,13,1.0));
}


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

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

nav.menu-footernavigation-container ul li {
	display: block;
    height: auto;
    margin: 1.5rem 15px 1.6rem 0;
    padding: 0 0 0 0;
    list-style-type: none;
}


nav.menu-footernavigation-container ul li a {
	display: block;
    box-sizing: border-box;
    width: 100%;
    height: auto;
    margin: 0 0 0 0;
    padding: 0;
    font: 100 0.9rem "Jost";
    color: var(--lichtrot);
    text-align: left;
    transition: all 0.5s ease;
}

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

section.footerangaben {
	margin: 0 0 0 0;
	padding: 50px 0 100px 0;
	grid-template-columns: repeat(3, 1fr);
	gap: 0rem 2rem;
}

section.footerangaben article{
	grid-column: span 1;
}


section.footerangaben article h3{
	width: 100%;
	height: auto;
	margin: 0 0 15px 0;
	padding: 0 0 0 0;
	font: 300 1.1rem "Jost";
	letter-spacing: 0.5px;
	color:rgba(255,255,255,0.6);
	border-bottom: solid 2pt rgba(255,255,255,0.3);
}

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

section.footerangaben article table {
	
	margin: 0 0 5px 0;
	padding: 0 0 0 0;
	font: 100 0.8rem "Jost";
	color:rgba(255,255,255,0.6);
	text-align: left;
}

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

section.footerangaben article table tr td{
	margin: 0 0 0 0;
	padding: 0 10px 0 0;
}

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






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



@media only screen and (max-width: 1200px) {
	
	main{
		width: 90%;
		margin: 0 5% 0 5%;
	}
	
	.headernavi {
		width: 95%;
		margin: 0 2.5% 0 2.5%;
	}
	
	.startnavi{
		width: 90%;
		margin: 0 5% 0 5%;
	}
}

/* ################################################################################################################### 1080 */

@media only screen and (max-width: 1080px) {
	
	
	
	nav.menu-footernavigation-container ul {
    	
	}
	
	section.footerangaben article{
		grid-column: span 4;
	}
	
	h1 {
    	font: 500 2.1rem "Jost"
	}
	
	section.spezialinhalt article {
		grid-column: 7 / -1;
	}
	
	section.spezialinhalt article p,
	section.basisinhalt article p{
    	font: 200 0.95rem "Jost";
    	line-height: 1.4rem;
	}
	
	section.spezialinhalt aside h3 {
    	font: 400 1.75rem "Jost";
    	line-height: 1.9rem;
	}
	
	section.spezialinhalt aside .textwidget ul li {
    	font: 200 1.14rem "Jost";
    	line-height: 1.4rem;
	}
	
	section.basisinhalt article table tr td {
		font: 200 0.95rem "Jost";
    	line-height: 1.4rem;
	}
	
	.gallery .gallery-item .gallery-icon {
    	height: 150px;
	}
}

/* ################################################################################################################### 900 */

@media only screen and (max-width: 900px) {
	
	
	.headernavi {
		flex-wrap: wrap;
		background: var(--hauptrot);
		box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
		padding: 0 0 10px 0;
	}
	
	.headernavi .logobutton {
		width: 100%;
		background: var(--weiss) url(img/LogoNavi.jpg) center no-repeat;
		background-size: contain;
		box-shadow: -2px 1px 5px rgba(0, 0, 0, 0.0);
	}
	
	nav.menu-hauptnavigation-container {
    	width: 100%;
		height: auto;
		box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.0);
	}
	
	header {
		height: 500px;
        margin: -110px 0 0 0;
        padding: 233px 0 0 0;
	}
	header .logo {
		width: 100%;
		height: 100px;
		margin: 0 0 0 0;
		padding: 0 0 0 0;
		background: url(img/LogoStart.png) center / contain no-repeat;
	}
	
	nav.menu-startnavigation-container ul li a {
		font: 500 1.5rem "Jost";
	}
	
	section.startinhalt aside {
		grid-column: 1 / 6;
	}
	
	section.startinhalt article {
		grid-column: 7 / -1;
	}
	
	section.startinhalt article h2 {
    	font: 500 1.7rem "Jost";
	}
	
	section.startinhalt article h3 {
    	font: 400 1.7rem "Jost";
	}
	
	section.startinhalt article p {
		font: 200 0.9rem "Jost";
		line-height: 1.4rem;
	}
	
	section.startreferenzen ul {
		grid-template-columns: repeat(2, 1fr);
		gap: 3rem 1.5rem;
	}
	
	section.kontakt aside{
		grid-column: 1/ 5;
	}

	section.kontakt article{
		grid-column: 6 / -1;
	}
	
	section.kontakt h2 {
    	grid-column: 1 / -1;
	}
	
	h1 {
    	font: 500 2rem "Jost";
    	line-height: 2.2rem;
	}
	
	section.spezialinhalt aside {
    	grid-column: 2 / 12;
	}
	
	section.spezialinhalt article,
	section.basisinhalt article{
        grid-column: 2 / 12;
    }
	
	section.spezialinhalt a.zurucklink {
		grid-column: 2 / 4;
	}
	
	section.basisinhalt {
		grid-template-areas:
        'bild bild bild bild bild bild bild bild bild bild bild bild'
        'text text text text text text text text text text text text';
	}
	
	section.basisinhalt aside {
		grid-area: bild;
	}
	
	section.referenzinhalt article, section.engagementinhalt article{
		grid-column: span 6;
	}
	
	section.teambereich aside {
    	grid-column: span 6;
	}
	
	section.basisinhalt aside div.downloadbereich div.download div.textwidget {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 1rem;
	}
	
	section.basisinhalt aside div.downloadbereich div.download div.textwidget .sdm_clear_float {
		display: none;
	}
	
	section.basisinhalt aside div.downloadbereich div.download div.textwidget .sdm_download_item .sdm_download_item_top .sdm_download_title {
    	font: 300 1.5rem "Jost";
	}
}


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

@media only screen and (max-width: 700px) {
	
	nav.menu-startnavigation-container ul {
		grid-template-columns: repeat(1, 1fr);
	}
	
	nav.menu-startnavigation-container ul li a {
		font: 500 1.4rem "Jost";
		line-height: 1.5rem;
	}
	
	section.startinhalt aside {
		grid-column: 1 / -1;
	}
	
	section.startinhalt article {
		grid-column: 1 / -1;
	}
	
	section.startinhalt article h2 {
    	font: 500 1.6rem "Jost";
	}
	
	section.startinhalt article h3 {
    	font: 400 1.6rem "Jost";
	}
	
	section.startinhalt article p {
		font: 200 0.85rem "Jost";
		line-height: 1.4rem;
	}
	
	section.startreferenzen ul {
		grid-template-columns: repeat(1, 1fr);
		gap: 3rem 1.5rem;
	}
	
	section.startreferenzen h2,
	section.kontakt h2,
	section.teambereich h2{
    	font: 500 2rem "Jost";
		text-align: center;
	}
	
	section.kontakt {
		display: grid;
        grid-template-columns: repeat(6, 1fr);
        gap: 3rem 1rem;
	}
	
	section.kontakt aside{
		grid-column: 2/ 6;
	}

	section.kontakt article{
		grid-column: 2 / 6;
	}
	
	section.kontakt aside h3 {
		font: 400 1.3rem "Jost";
	}
	
	section.kontakt aside p {
		font: 200 1rem "Jost";
	}
	
	section.footerangaben article{
		grid-column: span 6;
	}
	
	h1 {
    	font: 500 1.8rem "Jost";
    	line-height: 2rem
	}
	
	section.spezialinhalt aside {
    	grid-column: 1 / -1;
	}
	
	section.spezialinhalt aside h3 {
        font: 400 1.6rem "Jost";
        line-height: 1.7rem;
    }
	
	section.spezialinhalt aside .textwidget ul li {
        font: 200 1rem "Jost";
        line-height: 1.4rem;
		padding: 0 5px 0 0;
    }
	
	section.referenzinhalt article,
	section.referenzinhalt article:first-of-type,
	section.engagementinhalt article,
	section.engagementinhalt article:first-of-type{
		grid-column: 2 / 12;
		gap: 0rem;
		margin: 0 0 0 0;
	}
	
	section.referenzinhalt article:first-of-type .beitragsbild,
	section.referenzinhalt article:first-of-type .beitrag,
	section.engagementinhalt article:first-of-type .beitragsbild,
	section.engagementinhalt article:first-of-type .beitrag{
		grid-column: 1 / -1;
	}
	
	section.referenzinhalt article:first-of-type .beitragsbild a,
	section.engagementinhalt article:first-of-type .beitragsbild{
		height: 180px;
		margin: 0 0 15px 0;
	}

	section.referenzinhalt article:first-of-type .beitrag h2 a,
	section.referenzinhalt article .beitrag h2 a,
	section.engagementinhalt article:first-of-type .beitrag h2,
	section.engagementinhalt article .beitrag h2{
		font: 300 1.45rem "Jost";
		line-height: 1.5rem;
		margin: 0 0 10px 0;
	}

	section.referenzinhalt article:first-of-type .beitrag p,
	section.referenzinhalt article .beitrag p,
	section.startreferenzen ul li div.content p,
	section.engagementinhalt article:first-of-type .beitrag p,
	section.engagementinhalt article .beitrag p{
		font: 100 0.9rem "Jost";
		line-height: 1.2rem;
	}
	
	section.teambereich aside div.wp-caption h2 {
    	font: 400 1.5rem "Jost";
	}
	
	section.teambereich aside div.wp-caption h3 {
    	margin: 0 0 20px 0;
    	font: 300 1.1rem "Jost";
	}
	
	section.teambereich aside div.wp-caption h4 {
		font: 200 0.95rem "Jost";
	}
	
}

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

@media only screen and (max-width: 600px) {
	
	section.teambereich aside {
    	grid-column: span 12;
	}
	
	section.basisinhalt aside div.downloadbereich div.download div.textwidget {
		display: grid;
		grid-template-columns: repeat(1, 1fr);
		gap: 1rem;
	}
	
	section.basisinhalt aside div.downloadbereich div.download div.textwidget .sdm_download_item .sdm_download_item_top .sdm_download_title {
    	font: 300 1.4rem "Jost";
	}
	
	section.basisinhalt aside div.downloadbereich div.download div.textwidget .sdm_download_item .sdm_download_link .sdm_download_button a {
    	font: 300 0.9rem "Jost"
	}
	
	
	.menu-hauptnavigation-container {
		display: none;
	}
	
	
	.headernavi .logobutton {
        width: 100%;
		height: 70px;
        background: var(--weiss) url(img/LogoNavi.jpg) left/contain no-repeat ;
	}
	
	.headernavi {
        width: 100%;
        margin: 0 0 0 0;
		height: 70px;
		padding: 5px 0 5px 0;
		background: var(--weiss);
		border-bottom: solid 5px var(--hauptrot);
    }
	
	.rmp-container, .rmp-container, .rmp-slide-left, .rmp-menu-open {
		background: rgb(96,96,96) !important;
	}
	
	ul.rmp-menu {}
	
	ul.rmp-menu li .rmp-menu-item-link {
        height: auto !important;
        line-height: 1.5rem !important;
        font: 200 1rem "Jost" !important;
        border-bottom: 0px solid #1d4354;
        
        color: var(--dunkelgrau);
        text-align: left;
        background-color: inherit;
 
        letter-spacing: 0px;
        display: block;
        box-sizing: border-box;
        width: 100%;
        text-decoration: none;
        position: relative;
        overflow: hidden;
        transition: background-color 0.5s, border-color 0.5s, 0.5s;
        padding: 10px 0 10px 20px!important;
    }
	
	.rmp-menu-current-item .rmp-menu-item-link {
		background: var(--hauptrot)!important;
		color: var(--weiss)!important;
	}
	
	.rmp-menu-current-item .rmp-menu-item-link a {
		
	}
	
	.rmp-menu-additional-content {
		width: 100%;
		box-sizing: border-box;
		height: auto;
		padding: 0 0 10px 20px!important;
		margin: 30px 0 0 0!important;
		
	}
	
	.rmp-menu-additional-content h3 {
		font: 400 1.1rem "Jost" !important;
		color: var(--lichtgrau)!important;
	}
	
	.rmp-menu-additional-content p {
		font: 100 1rem "Jost" !important;
		color: var(--lichtgrau)!important;
	}
	
	header {
        height: 350px;
        margin: 0 0 0 0;
	}
	
	header#startseite {
		background: url("img/startseite.jpg") 65% 35% no-repeat;
		background-size: cover;
	}

	header#referenzseite {
		background: url("img/projekte.jpg") 5% 95% no-repeat;
		background-size: cover;
	}

	header#bekanntmachungen {
		background: url("img/bekanntmachungen.jpg") 18% 82% no-repeat;
		background-size: cover;
	}

	header#liegenschaftskarten {
		background: url("img/liegenschaftskarten.jpg") center no-repeat;
		background-size: cover;
	}

	header#ingenieurvermessung {
		background: url("img/ingenieurvermessung.jpg") center no-repeat;
		background-size: cover;
	}

	header#leistungen {
		background: url("img/leistungen.jpg") 30% 70% no-repeat;
		background-size: cover;
	}

	header#ueberuns {
		background: url("img/ueberuns.jpg") 20% 80% no-repeat;
		background-size: cover;
	}

	header#vermessung {
		background: url("img/katastervermessung.jpg") 20% 80% no-repeat;
		background-size: cover;
	}
	
	header#engagement {
		background: url("img/engagement.jpg") 50% 50% no-repeat;
		background-size: cover;
	}

	section.spezialinhalt a.zurucklink {
		grid-column: 2 / 5;
	}

}


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

@media only screen and (max-width: 500px) {
	
	nav.menu-hauptnavigation-container ul li a {
		padding: 4px 0px 3px 0px;
		font: 100 0.8rem "Jost";
	}
	
	header {
        height: 350px;
        padding: 117px 0 0 0;
    }
	
	nav.menu-startnavigation-container ul li a {
        font: 500 1.3rem "Jost";
        line-height: 1.4rem;
    }
	
	section.kontakt aside{
		grid-column: 1/ -1;
	}

	section.kontakt article{
		grid-column: 1 / -1;
	}
	
	h1 {
		font: 500 1.6rem "Jost";
		line-height: 1.8rem;
	}
	
	section.spezialinhalt article,
	section.basisinhalt article {
        grid-column: 1 / -1;
    }
	
	section.spezialinhalt article p
	section.basisinhalt article p {
		font: 200 0.85rem "Jost";
        line-height: 1.4rem;
    }
	
	section.spezialinhalt article h2,
	section.basisinhalt article h2 {
		margin: 20px 0 8px 0;
		font: 500 1.6rem "Jost";
		line-height: 1.7rem;
	}
	
	section.basisinhalt article h2.oben {
		margin: 0 0 8px 0;
		font: 500 1.8rem "Jost";
		line-height: 2rem;
	}
	
	section.spezialinhalt article h3,
	section.basisinhalt article h3 {
		margin: 20px 0 8px 0;
		font: 400 1.55rem "Jost";
		line-height: 1.6rem;
	}
	
	section.spezialinhalt article h4,
	section.basisinhalt article h4 {
		margin: 20px 0 8px 0;
		font: 300 1.45rem "Jost";
		line-height: 1.5rem;
	}
	
	section.spezialinhalt article ul,
	section.basisinhalt article ul,
	section.basisinhalt article ol{
    	width: 100%;
    	height: auto;
    	margin: 10px 0 20px 0;
	}
	
	section.spezialinhalt a.zurucklink, section.basisinhalt a.zurucklink {
		grid-column: 1 / 6;
		font: 300 0.9rem "Jost";
	}
	
	section.spezialinhalt article ul li,
	section.basisinhalt article ul li{
		margin: 0 0 5px 0;
		font: 200 0.85rem "Jost";
		line-height: 1rem;
	}
	
	section.basisinhalt article ol li{
		margin: 0 0 5px 0;
		font: 200 0.85rem "Jost";
		line-height: 1.3rem;
	}
	
	section.referenzinhalt article,
	section.referenzinhalt article:first-of-type,
	section.engagementinhalt article,
	section.engagementinhalt article:first-of-type{
		grid-column: 1 / -1;
	}
	
	section.referenzinhalt article:first-of-type .beitrag h2 a,
	section.referenzinhalt article .beitrag h2 a,
	section.startreferenzen ul li a.title,
	section.engagementinhalt article:first-of-type .beitrag h2,
	section.engagementinhalt article .beitrag h2{
		font: 300 1.35rem "Jost";
		line-height: 1.4rem;
		margin: 0 0 10px 0;
	}

	section.referenzinhalt article:first-of-type .beitrag p,
	section.referenzinhalt article .beitrag p,
	section.startreferenzen ul li div.content p,
	section.engagementinhalt article:first-of-type .beitrag p,
	section.engagementinhalt article .beitrag p{
		font: 100 0.8rem "Jost";
		line-height: 1rem;
	}
	
	section.teambereich aside div.wp-caption h2 {
    	font: 400 1.35rem "Jost";
	}
	
	section.teambereich aside div.wp-caption h3 {
    	margin: 0 0 15px 0;
    	font: 300 1rem "Jost";
	}
	
	section.teambereich aside div.wp-caption h4 {
		font: 200 0.85rem "Jost";
	}
	
	
	
}

@media only screen and (max-width: 450px) {
	
	.headernavi .logobutton {
        width: 100%;
		height: 55px;
	}
	
	.headernavi {
        width: 100%;
        margin: 0 0 0 0;
		height: 60px;
		padding: 10px 0 5px 0;
    }
}