@charset "UTF-8";
/* CSS Document */
/* CSS-Anpassung upgrade-ev.de (c) 2024 Ulf Jenninger Grafikdesign */

html, body {margin: 0; padding: 0; height: 100%;}
body {flex-direction: column; min-height: 100vh;}
body, * {font-family: 'Ubuntu', sans-serif;}
nav, footer {display: block;}

/* Text */
body, p {font-size: 1em; line-height: 1.5;}
h1, h2, h3 {font-family: 'Ubuntu'; font-weight: 700;}
.titelhead {letter-spacing: -0.01em;}

@media screen and (max-width: 39.5em) { /* Small */
	h1 {font-weight: 700; font-size: 1.8em; text-transform: uppercase; letter-spacing: 0.01em; line-height: 115%;}
    h1.titelhead {font-size: 2.2em;}
	h2, h3 {font-weight: 700; font-size: 1.4em; margin-bottom: 0.5em;}
	h4 {font-weight: 700; font-size: 1em; margin-bottom: 0.3em;}
}
@media screen and (min-width: 40em) { /* >= Medium */
	h1 {font-weight: 700; font-size: 2.5em; text-transform: uppercase; letter-spacing: 0.01em; line-height: 115%; margin-bottom: 2.5rem;}
	h2, h3 {font-weight: 700; font-size: 1.5em; margin-bottom: 0.5em;}
	h4 {font-weight: 700; font-size: 1.25em; margin-bottom: 0.3em;}
}

/* Links */
nav a, footer a { color: #C9E0FF;}
nav a:hover, footer a:hover {color: #fff;}
.klapp a {color: #194786;}
.klapp a:hover {color: #306FC1;}
a.anchor { display: block; height: 1px; overflow: hidden; position: relative; top: -80px; visibility: hidden; }
.blau a{color: #ccccff;}

/* Hintergrund- und Textfarben */
.blau {background: #194786; color: #fff;}
.hellblau {background: #356DB7;}
.weiss {background: #fff;}
.rot {background: #92001A; color: #fff;}
.linkrot{color: #92001A;}
.gruen {background: #90B226; color: #000;}
.gruen a {color: #194786;}
.gruen a:hover {color: #356DB7;}
.gruen h1, .gruen h2 {color: #fff;}
.grautext {color: #666;}
.rot a {color: #91BDF6;}
footer, footer a {color: #666;}
footer a:hover {color: #194786;}
footer {background-color: #fff;}
.greenmessage {background-color: #00ff00; color: #003300; text-align: center; font-weight: bold; font-size: 1.3em;}
.redmessage {background-color: #990000; color: #ffffff; text-align: center; font-weight: bold; font-size: 1.3em;}

/* Abstände */
.linkbox{padding: 1.5em;}
.titelbild, .kopfabst {margin-top: 60px;}
.contabst {padding: 30px 0;}
.bildabst {padding: 8px 0 16px 0;}
.toppad{padding-top: 20px;}
footer{padding: 1em 0 3em 0; border-top: 2px solid #194786}
@media screen and (max-width: 39.5em) { /* Small */
	.contabst {padding: 8px 0;}
	.ctopabst {padding: 8px 0 4px 0;}
	.cbtnabst {padding: 4px 0 8px 0;}
}
@media screen and (min-width: 40em) { /* >= Medium */
	.contabst {padding: 30px 0;}
	.ctopabst {padding: 30px 0 5px 0;}
	.cbtnabst {padding: 5px 0 30px 0;}
}

.responsive-image {
    max-width: 500px; /* Maximale Breite des Bildes */
    width: 100%; /* Passt die Breite des Bildes an den umgebenden Container an */
    height: auto; /* Skalierung der Höhe proportional zur Breite */
    float: right; /* Bild wird rechts ausgerichtet */
    margin-left: 10px; /* Optional: Abstand zum Text auf der linken Seite */
}

/* Navi */
nav {width: 100%; height: 60px; position: fixed; top: 0px; z-index: 99; font-size: 1em; overflow: visible;}
.hauptnavi {width: 100%; height: 60px; font-size: 1em;}
@media screen and (max-width: 63.99em) {
	.desknav {display: none;}
	.mobilnav {display: block;}
}
@media screen and (min-width: 64em) {
	.desknav {display: block;}
	.mobilnav {display: none;}
}
.menu > li > a{font-weight: bold; padding-top:1.3em; color: #fff;}
.menu a {padding: .7rem .7rem;}
.desknav li {display: inline-block; padding: 15px 0 0 20px !important; margin: 0 !important;}
.subnavi {display: none; width: 70%; padding: 15px; border-bottom-right-radius: 15px; border-right: 2px solid #fff; border-bottom: 2px solid #fff; font-size: 1.5em;}
.subnavi ul {list-style-type: none;}
.subnavi li { padding: 8px 0; border-top: 1px solid #fff;}
.subnavi li:first-child {border-top: none;}
.menubtn {cursor: pointer;}
.dropdown.menu > li.is-dropdown-submenu-parent > a::after {
	border-width: 8px;
    border-color: #fff transparent transparent;
	right: 2px;
}

/* Titelseite */
.titelbild {width: 100%; max-height: 400px; overflow: hidden; vertical-align: bottom;}
.logobox {margin-top: 5em;}
.pfeilbox {padding: 2em 0 1em 0;}
.bigtext {font-size: 1.2em; margin-bottom: 0.6em;}
@media screen and (max-width: 39.5em) {
	.titelbild img {height: 100%; width: auto;}
}
@media screen and (min-width: 40em) {
	.titelbild img {width: 100%; height: auto;}
}

/* Textseiten */
.columns li {margin-left: 2em; padding-left: 0.4em;}
.bild_verein {margin-top: 40px;}
.grline {border-top: 2px solid #90B226;}
.grline:first-child {border-top: none;}

/* Formular */
label {color: #333; font-style: italic;}
.labelred {background: #ff0000;}
.button {background: #194786;}

/* Cookiebanner */
.cookie-banner {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #333;
    color: white;
    padding: 20px;
    text-align: center;
    z-index: 1000;
    display: none;
}

.cookie-banner p {
    margin: 0;
    padding: 0 10px;
    display: inline-block;
}

.cookie-banner a {
    color: #999;
    text-decoration: underline;
}

.cookie-button {
    border: none;
    color: #333;
    padding: 10px 20px;
    margin: 10px;
    cursor: pointer;
    font-size: 14px;
    border-radius: 5px;
}

.cookie-button:hover {
    background-color: #e1b40e;
}


