/* Font einbinden */
@font-face {
    font-family: 'Nunito Sans';
    src: url('fonts/NunitoSans-Italic-VariableFont_YTLC,opsz,wdth,wght.ttf')
         format('truetype');
    font-style: italic;
    font-weight: 200 1000;
    font-display: swap;
}
@font-face {
    font-family: 'Nunito Sans';
    src: url('../fonts/NunitoSans-VariableFont_YTLC,opsz,wdth,wght.ttf')
         format('truetype');
    font-style: normal;
    font-weight: 200 1000;
    font-display: swap;
}


/* Definitionen Body */
body {
    font-family: 'Nunito Sans', sans-serif;
	background-color: #F4F3EF;
	padding-top: 1em;
}


/* Definitionen Schriften Typografie A9B8A3 ; */
h1, h2, h3 {
    font-family: 'Nunito Sans', sans-serif;
	color: #81876B;
}
h1 {
    font-weight: 400;
	font-size: 2em;
}
h2 {
    font-weight: 400;
}
h3 {
    font-weight: 600;
	font-size: 1.5em;
}
p {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 400;
	color: #000000; 
}
.karte-mit-logo h3 {
    min-height: 4rem;
}
.marke {
    font-size: 0.6em;
    vertical-align: 0.2em;
    line-height: 0;
}

/* Navigation und Buttons */
.navi_nonron {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 400;
    color: #81876B;
    display: inline-block;
    padding-bottom: 0.3rem;
    border-bottom: 2px solid transparent;
    transition: border-color 0.2s ease;
}
/* Aktive Seite */
.menu > li.active .navi_nonron {
    border-bottom: 2px solid #81876B;
}
.menu .active > a {
    background: none;
}
/* Hover */
.menu > li > a:hover .navi_nonron,
.menu > li > a:focus .navi_nonron {
    border-bottom: 2px solid #81876B;
}
a.navi_nonron {
	border-bottom: 2px solid transparent;
}

a.navi_nonron:hover {
	color: #81876B;
    border-bottom: 2px solid #81876B;
}
/* Abstand Navi links und rechts */
.menu > li > a {
    padding-left: 1rem;
    padding-right: 1rem;
}
.button_aktiv, .button_aktiv:hover, .button_aktiv:focus  {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 400;
	color: #FFFFFF; 
	background-color: #81876B; 
	border: solid 2px #81876B;
	padding: 0.5em;	
}
.button_passiv {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 400;
	color: #81876B; 
	border: solid 2px #81876B;
	padding: 0.5em;
}
.button_passiv:hover, .button_passiv:focus {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 400;
	color: #FFFFFF; 
	background-color: #81876B; 
	border: solid 2px #81876B;
	padding: 0.5em;
}
.link-anzeigen {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 400;
    color: #81876B;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    border-bottom: 2px solid transparent;
}

.link-anzeigen:hover,
.link-anzeigen:focus {
    color: #81876B;
	border-bottom: 2px solid #81876B;
}


/* Abstände und Grössen */

.abstandoben1em {
    padding-top: 1em;
}
.abstandoben2em {
    padding-top: 2em;
}
.abstandoben3em {
    padding-top: 3em;
}
.abstandoben4em {
    padding-top: 4em;
}
.abstandunten1em {
    padding-bottom: 1em;
}
.abstandunten2em {
    padding-bottom: 2em;
}
.breite20em {
    max-width: 20em;
}
.logo-nonron {
    width: 80%;
    max-width: 800px;
    height: auto;
}
.karte-mit-logo img {
    display: block;
    width: 50%;
    height: auto;
    margin: -25% auto 1rem auto;
}
.karte-mit-logo {
    position: relative;
    margin-top: 4rem;
    display: flex;
    flex-direction: column;
}
.karte-mit-logo .button-bereich {
    margin-top: auto;
}


/* Ränder */

.borderunten {
    position: relative;
}
.borderunten::after {
    content: "";
    position: absolute;
    left: 0;          /* links beginnen */
    bottom: 0;        /* unten */
    width: 85%;       /* 50 % Breite */
    height: 2px;      /* Linienhöhe */
    background-color: #81876B;
}
.borderrechts::after {
    content: "";
    position: absolute;
    top: 20px;
    bottom: 20px;
    right: 0;
    width: 2px;
    background-color: #81876B;
}
.borderrechts {
    position: relative;
}
@media screen and (max-width: 640px) {
    .borderrechts::after {
        content: "";
        position: absolute;
        top: auto;
        bottom: 0;
        left: 20px;
        right: 20px;
        width: auto;
        height: 2px;
        background-color: #81876B;
    }
}
.borderuntendurchgehend {
	border-bottom: solid 2px #81876B;
}

.abgerundet {
    border-radius: 20px;
}


/* Block unten */

.hintergrundmittel {
    background-color: #E7E7DF;
}
.textimblock {
	padding-top: 2em;
	padding-bottom: 2em;
    text-align: center;
}


/* Ausrichtung Bilder rechte Spalte unten bündig  */

.hero-row {
    align-items: stretch;
}
.bildspalte {
    display: flex;
    align-items: flex-end;
}














/*   RESTERAMPE   */


/* 



.bildspalte img {
    width: 100%;
    display: block;
}



.titelbild {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

*/