/* default.css */
/* --- undo --- */
html, body, div, span, a, h1, h2, h3, h4, h5, h6, p, blockquote, img,
ol, ul, li, form, input, textarea, label, select, table, tbody, thead, tfoot, tr, th,
td, footer, header, menu, nav, section, video { padding: 0; margin: 0; box-sizing: border-box; }

img, a img, :link img, :visited img, fieldset, button { border: none; outline: none; }
a:visited { text-decoration: none; }
img { vertical-align: bottom; }
table, tr, th, td { border: none; border-spacing: 0; }
th, td { vertical-align: top; }
hr { clear: both; }
address { font-style: normal; }

ul, ol { list-style-image: none; margin: 0 0 1.25rem 0; padding: 0 0 0 1.25rem; list-style-position: outside; }
ol { padding: 0 0 0 1.875rem; }
ul li, ol li { margin: 0 0 0.625rem 0; padding: 0; }
ul, ul li { list-style-type: disc; }
ol, ol li { list-style-type: decimal; }
li > ul, li > ol { margin: 0.625rem 0; }
li > ul > li { list-style-type: circle; }
li > ol > li { list-style-type: decimal; }

html, body {
    height: 100%; /* Vertikalen Scrollbalken immer einblenden */
    word-wrap:break-word; /* Woerter in die naechste Zeile umbrechen, wenn sie das umschliessende Element verlassen */
    min-width: 300px;
}
html { overflow: scroll; overflow-x: auto; }

/* fuer responsive Webseiten */
img, object, iframe { max-width: 100%; height: auto; }

/*  Clearfix, um das Floating innerhalb der Container aufzuheben */
.clearfix:after { content: ""; display: block; height: 0; clear: both; visibility: hidden; }

/* CSS-Formatierungen interne Module */
.flLeft, .float_left { float: left; }
.flRight, .float_right { float: right; }
.flClear, .float_clear { clear: both; }
.center { text-align: center; }
.small { font-size: small; }
.bold { font-weight: 700; }
.hide { display: none; }
.text_left { text-align: left; }
.text_center { text-align: center; }
.text_right { text-align: right; }

/* Flex-Ausrichtung innerhalb der Section - display:flex kommt direkt von der
   Breiten-Klasse (.section_full/.section_1200/... in main<datum>.css), nicht
   mehr von einer eigenen .section_flex-Klasse (bis 02.09.2026 - war ein
   Kaskade-Bug: die Breiten-Klasse lud NACH dieser Datei und ueberschrieb
   display:flex mit ihrem eigenen display:block). */
.justify_content_flex_start    { justify-content: flex-start; }
.justify_content_center        { justify-content: center; }
.justify_content_flex_end      { justify-content: flex-end; }
.justify_content_space_between { justify-content: space-between; }
.justify_content_space_around  { justify-content: space-around; }
.justify_content_space_evenly  { justify-content: space-evenly; }
.align_items_stretch    { align-items: stretch; }
.align_items_flex_start { align-items: flex-start; }
.align_items_center     { align-items: center; }
.align_items_flex_end   { align-items: flex-end; }
.align_items_baseline   { align-items: baseline; }

/* Erzwungener Zeilenumbruch in einer Flex-Section (z. B. 003_absaetze mit
   leerem Value als Umbruch zwischen zwei Box-Reihen): clear:both wirkt bei
   Flex-Items nicht mehr, flex-basis: 100% erzwingt stattdessen die volle
   Zeilenbreite und damit den Umbruch. Eigene Klasse statt .flClear, da die
   Bedeutung eine andere ist (Zeilenumbruch statt Float aufheben) - .flClear
   bleibt unveraendert fuer echte clear:both-Faelle (z. B. BwYFormHelper). */
.flex_break { flex-basis: 100%; width: 100%; }


/* main20261025.css */
@import url('https://fonts.googleapis.com/css?family=Open+Sans|Open+Sans+Condensed:300|Ubuntu');

/* Import von weiteren CSS-Dateien
@import url("redaxo_responsive_menu.css");
*/

html, body {
font-family: 'Ubuntu', 'Open Sans', Verdana, Geneva, sans-serif; 
font-size: 16px; line-height: 24px;
color: #000;
/* Woerter in die naechste Zeile umbrechen, wenn sie ansonsten das umschliessende Element verlassen wuerden. */
word-wrap:break-word;
height: 100%;
}
html { overflow: scroll; overflow-x: auto; background-color: #FFF; }


/* ----------------------------------------------------------------------------------
   Schriften + Generelle CSS-Anpassungen fuer diese Webseite
---------------------------------------------------------------------------------- */ 
/* Farben: 
schwarz #666 
dunkelblau #6299b4
hellblau #e1eaee
*/
a { text-decoration: none; color: #6299b4; }
a:hover { text-decoration: none; color: #e1eaee; }
a:active, a:focus { outline: 0; }
a:hover img { opacity: 0.8; }

li { list-style-type: none; margin: 0 0 10px 0; padding: 0 0 0 17px; }

h1, h2, h3, h4, h5, h6,
.like_h1, .like_h2, .like_h3, .like_h4, .like_h5, .like_h6 { font-family: 'Open Sans', Verdana, Geneva, sans-serif; font-weight: normal; font-style: normal; font-size: 16px; line-height: 24px; margin: 0 0 10px 0; color: #6299b4; }
h1, .like_h1 { font-size: 32px; line-height: 42px; text-transform: uppercase; }
h2, .like_h2 { font-size: 26px; line-height: 36px; text-transform: uppercase; }
h3, .like_h3 { font-size: 20px; line-height: 30px; font-weight: 300; text-transform: uppercase; } 
h4, .like_h4 { font-size: 16px;  } 
h5, .like_h5 { font-size: 14px; } 
h6, .like_h6 { font-size: 12px; } 

h1 strong, h2 strong, h3 strong, h4 strong, h5 strong, h6 strong,
.like_h1 strong, .like_h2 strong, .like_h3 strong, .like_h4 strong, .like_h5 strong, .like_h6 strong { color: #666; font-weight: normal; }

p { margin: 0 0 20px 0; padding: 0; }
th, td { padding: 0 8px 6px 0; vertical-align: top; text-align: left; }

hr { clear: both; height: 1px; width: 100%; margin: 0 0 20px 0; border: none; background-color: #b0b0b0; } 
.small  { display: block; font-size: 13px; line-height: 16px; color: #333; font-style: italic; padding-top: 5px; } /* Bildunterschriften */


/* ----------------------------------------------------------------------------------
   CSS-Einstellungen fuer das Addon Modulhelper (bzw. bw_modulhelper)
---------------------------------------------------------------------------------- */ 
/* ------------ Outer Box ------------ */
/* Ausgangswerte: (Seitenbreite: 1460px | Abstand: 30px) */
.outer_box { clear: both; display: block; float: left; width: 95.89%; margin: 0 0 20px 2.05%; padding: 0; }

.box_width_full { width: 100%; margin: 0 0 20px 0; }
.box_width_1_2 { clear: none; width: 46.92%; }
.box_width_1_3 { clear: none; width: 30.59%; }
.box_width_2_3 { clear: none; width: 63.23%; }
.box_width_1_4 { clear: none; width: 22.43%; }

.box_bg_white { box-sizing: border-box; background-color: #FFF; padding: 15px 15px 0 15px; }

.section_trennlinie { clear: both; display: block; width: 100%; height: 1px; margin: 0; padding: 0; background-color: #AAA; }
.section_trennlinie.white { background-color: #FFF; }

.section_full,
.section_1500,
.section_1200,
.section_980 { clear: both; display: block; width: 100%; height: auto; margin: 0; padding: 0; }
.section_full,
.section_1500 { width: 1460px; margin: 0 auto; }
.section_1200 { width: 1200px; margin: 0 auto; }
.section_980 { width: 980px; margin: 0 auto; }


@media all and (max-width:1460px) { .section_full, .section_1500 { width: auto; margin: 0; } }
@media all and (max-width:1200px) { .section_1200 { width: auto; margin: 0; } }
@media all and (max-width:980px) { .section_980 { width: auto; margin: 0; } }


.section_bg_none,
.section_bg_blue_light,
.section_bg_gray { clear: both; display: block; width: 100%; height: auto; margin: 0; padding: 30px 0 10px 0; background-color: #FFF; }

.section_bg_none { background-color: transparent; }
.section_bg_blue_light { background-color: #e1eaee; }
.section_bg_gray { background-color: #dfdfdf; }

.no_padding_bottom { padding: 30px 0 0 0; }

/*
.section_bg_darkgray, .section_bg_darkgray p, .section_bg_darkgray a, .section_bg_darkgray h1, .section_bg_darkgray h2, .section_bg_darkgray h3, .section_bg_darkgray h4, .section_bg_darkgray h5, .section_bg_darkgray h6 { color: #FFF; }
*/

.section_abstand_1, .section_abstand_2 { clear: both; display: block; width: 100%; height: 20px; margin: 0; padding: 0; }
.section_abstand_2 { height: 40px; }

.section_bg_image,
.section_bg_paroller { display: block; position: static; width: 100%; min-height: 300px; margin: 0; padding: 30px 0 10px 0; z-index: 1; 
background-color: #fff; background-position: center center; background-attachment: scroll; background-repeat: no-repeat; background-size: cover; }

#content_full ul li,
#content ul li,
#footer ul li { list-style-type: none; margin: 0 0 10px 0; padding: 0 0 0 17px; background-image: url(listpoint.png); background-position: top left; background-repeat: no-repeat; }



/* ----------------------------------------------------------------------------------
 Clearfix, um das Floating innerhalb der Container aufzuheben fuer Firefox, IE8, Opera, Safari, etc.
---------------------------------------------------------------------------------- */ 
.zweispalter:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }


.outer_box .image { margin: 0 0 15px 0; text-align: center; }
.outer_box .image a { text-decoration: none !important; }
.outer_box .image a:hover { opacity: 0.8; }


/* ------------ Textausrichtung (alte Klassennamen) ------------ */
.textLeft { text-align: left; }
.textCenter { text-align: center; }
.textRight { text-align: right; }

/* ------------ Moduleinstellungen ------------ */
.text_bild .flLeft { float: left; display: block; width: auto; max-width: 63.89%; margin: 0 15px 0 0; overflow: hidden; }
.text_bild .flRight { float: right; display: block; width: auto; max-width: 63.89%; margin: 0 0 0 15px; overflow: hidden; }
.text_bild .image span.small { display: block; }



.zweispalter { background-image: url(bg_zweispalter.png); background-repeat: repeat-y; background-position: center top;  }
.zweispalter .flLeft { float: left; display: block; width: 47.69%; margin: 0; overflow: hidden; }
.zweispalter .flRight { float: right; display: block; width: 47.69%; margin: 0; overflow: hidden; }

/* ----------------------------------------------------------------------------------
   Ausrichtung der Seite und der <div>-Container (Reihenfolge von oben nach unten)
---------------------------------------------------------------------------------- */ 
#page_bg { position: relative; top: 0; left: 0; width: 1920px; height: auto; margin: 0 auto; padding: 0; z-index: 1; overflow: hidden; 
background-color: #FFF; /* falls parallax muss hier transparent rein */ box-shadow: 0 0 10px 0 #999; }

/* Relative Bloecke innerhalb von "page" */
#page, #header_bg, #header, #logo, #header_image_bg, #header_image, #navigation_not_responsive, #wrapper_full, #content_full, #wrapper, #content, #footer_bg, #footer, #footer_bottom_bg, #footer_bottom {
display: block; position: relative; top: 0; left: 0; width: 100%; height: auto; margin: 0; padding: 0; z-index: 1; }

#navigation_not_responsive { margin: 0 0 20px 0; z-index: 50; }

#header_bg { z-index: 50; }
#header { padding: 10px 0; }

#logo { text-align: center; }


#header_image_bg { z-index: 10; }
#header_image { z-index: 10;}

#wrapper, #footer, #footer_bottom { width: 1460px; margin: 0 auto; }

#content_full { }

#sidebar { float: left; width: 18.85%; margin: 0 0 0 2.05%; padding: 30px 0 10px 0; }
#content { float: right; width: 75.00%; margin: 0 2.05% 0 0; }
#content .section_full,
#content .section_1500,
#content .section_1200 { width: 100%; margin: 0; }




#footer_bg { clear: both; padding: 0; background-color: #e1eaee; }
#footer { padding: 30px 0; color: #666; font-size: 15px; line-height: 24px; }
#footer a { color: #666; text-decoration: none; }
#footer a:hover { color: #2d5081; text-decoration: none; }

#footer .footer_box { float:left; display: block; width: 22.43%; margin: 0 0 0 2.05%; padding: 0; }

#footer .footer_image { float:left; display: block; width: 30.33%; margin: 0 3% 3% 0; padding: 0; }




#footer_bottom_bg { clear: both; padding: 0; background-color: #6299b4; }
#footer_bottom { padding: 15px 0; color: #FFF; font-size: 14px; line-height: 18px; text-align: center; }
#footer_bottom a { color: #FFF; text-decoration: none; }
#footer_bottom a:hover { color: #438bb9; text-decoration: none; }
#footer_bottom_left { float: left; display: block; width: 63.23%; margin: 0 0 0 2.05%; padding: 0; text-align: left; }
#footer_bottom_right { float: right; display: block; width: 30.59%; margin: 0 2.05% 0 0; padding: 0; text-align: right; }



/* ----------------------------------------------------------------------------------
   Module
---------------------------------------------------------------------------------- */ 
#auswahlfelder { clear: both; display: block; width: auto; margin: 0 2.05% 20px 2.05%; padding: 10px 0; background-color: #6299b4; color: #FFF; }
.auswahlfelder_box { display: inline-block; margin: 0 0 0 2.05%; }
#auswahlfelder button { display: none; }

.anzeige_box_inner, .teaser_anzeige_box_inner { display: block; position: relative; top: 0; left: 0; width: auto; height: auto; margin: 0 0 20px 0; padding: 0; z-index: 1; overflow: hidden; border: 1px solid #cacaca; }

.anzeige_neu, .teaser_anzeige_neu { display: block; position: absolute; top: -1px; right: -1px; width: 122px; height: 122px; margin: 0; padding: 0; z-index: 1; background-image: url(icon_neu.png); background-position: right top; background-repeat: no-repeat;}

.anzeige_text, .teaser_anzeige_text  { display: block; padding: 20px 90px 5px 20px; }
.teaser_anzeige_text  { display: block; padding: 20px 20px 5px 20px; }

.anzeige_headline, .anzeige_regionen, .anzeige_fachgebiet,
.teaser_anzeige_headline, .teaser_anzeige_regionen, .teaser_anzeige_fachgebiet { display: block; margin: 0; font-size: 22px; line-height: 30px; font-family: 'Open Sans', Verdana, Geneva, sans-serif; }

.anzeige_regionen, .teaser_anzeige_regionen { color: #666; font-size: 16px; line-height: 24px; font-weight: 300; }
.anzeige_fachgebiet, .teaser_anzeige_fachgebiet { color: #333; font-size: 16px; line-height: 24px; }
.anzeige_headline, .teaser_anzeige_headline { color: #6299b4; text-transform: uppercase; margin: 0 0 10px 0; }

@media all and (max-width:768px) {
.anzeige_text { display: block; padding: 20px 20px 5px 20px; }
}




.link_button { display: block; margin: 0 0 20px 0; text-align: center; }
a.link_button { display: inline-block; width: auto; height: auto; padding: 5px 10px; background-color: #6299b4; color: #FFF; font-size: 15px; line-height: 20px; text-decoration: none; }
a.link_button:hover { color: #151515; text-decoration: none; }

.teaser_region { display: block; margin: 0 0 10px 0; color: #666; font-weight: 300; }


.modul_101_box, .teaser_box { display: block; float: left; position: relative; top: 0; left: 0; width: 30.59%; height: auto; margin: 0 0 20px 2.05%; padding: 0; z-index: 1; }
.modul_101_box_bg, .teaser_box_bg { display: block; margin: 0; padding: 20px 0; z-index: 10; background-color: #FFF; border: 1px solid #e8e8e8; }
.modul_101_image, .teaser_image { display: block; padding: 0 25px 20px 25px; }
.modul_101_box_text, .teaser_text { display: block; padding: 0 25px 1px 25px; }
.modul_101_box_text h3 { font-size: 22px; line-height: 32px; text-transform: uppercase; }
.modul_101_box_text .image { margin: 0; padding: 0; }
.modul_101_box a.link, a.teaser_link { display: block; position: relative; top: 0; left: 0; width: 120px; height: auto; padding: 5px 5px 5px 20px; background-color: transparent; color: #FFF; font-size: 15px; line-height: 20px; background-color: #6299b4; text-decoration: none; }
.modul_101_box a.link:hover, a.teaser_link:hover { color: #151515; text-decoration: none; }
.modul_101_box a.link::before, a.teaser_link::before { content: ''; position: absolute; display: block; top: 0; left: -7px; width: 7px; height: 40px; margin: 0; padding: 0; background-image: url(modul_101_link.png); background-repeat: repeat; background-position: left top; text-align: center; background-color: transparent; text-decoration: none; }

.modul_101_box a.link, a.teaser_link.button_news { width: 120px; }
.button_news_spacer { display: block; width: 100%; height: 30px; }

.teaser_title { display: block; margin: 0 0 5px 0; font-size: 18px; line-height: 24px; font-weight: bold; }
.teaser_subline { display: block; margin: 0 0 10px 0; font-weight: bold; }

@media all and (max-width:768px) {
.modul_101_box, .teaser_box { float: none; width: 95.89%; }
}





/* ----------------------------------------------------------------------------------
   Responsive Webdesign
---------------------------------------------------------------------------------- */
@media all and (min-width:1px) {
#page_bg { width: 100%; max-width: 1920px; min-width: 300px; overflow: hidden; }
}

@media all and (max-width:1460px) {
/* mit dem Setzen der Breite auf geht das reponsive Webdesign erst richtig los */
#page_bg { width: 100%; max-width: 1920px; min-width: 300px; overflow: hidden; }
#page { width: 100%; }

#wrapper, #footer, #footer_bottom  { width: 100%; margin: 0; }

h1, .like_h1, 
h2, .like_h2 { font-size: 36px; line-height: 46px; }
h3, .like_h3 { font-size: 24px; line-height: 34px; } 

}

@media all and (max-width:1200px) {
h1, .like_h1, 
h2, .like_h2 { font-size: 32px; line-height: 42px; }
h3, .like_h3 { font-size: 21px; line-height: 30px; } 

}

@media all and (max-width:980px) {
/* 1/4 auf 1/2 umstellen */
.box_width_1_4 { width: 46.92%; margin: 0 0 20px 2.05%; }
.box_width_1_4_breakpoint { clear: both; }

#footer { padding: 30px 0 10px 0; } 
#footer .footer_box { width: 46.92%; margin: 0 0 20px 2.05%; }
#footer #footer_box_3 { clear: both; }

}

@media all and (max-width:768px) {
.outer_box { clear: both; float: none; width: 95.89%; margin: 0 0 20px 2.05%; }
.box_width_full { width: 100%; margin: 0 0 20px 0; }

#navigation_not_responsive { display: none; }

#sprachschalter,
#header_nav { float: none; width: 100%; }

#sidebar { display: none; }
#content { clear: both; float: none; width: 100.00%; margin: 0; }


#footer_bottom_left,
#footer_bottom_right { float: none; width: auto; margin: 0 10px 15px 10px; text-align: center; }
#footer_bottom_right { margin-bottom: 0; }

#footer_bottom span.not_mobile { display: block; width: 100%; height: 1px; overflow: hidden; }

}



@media all and (max-width:480px) {
.outer_box { float: none !important; width: auto !important; margin: 0 10px 15px 10px !important; }

.text_bild .flLeft,
.text_bild .flRight { float: none; width: auto; max-width: none; margin: 0 0 15px 0; }

.zweispalter { background-image: none; }
.zweispalter .flLeft { float: none; width: auto; margin: 0 0 15px 0; }
.zweispalter .flRight { float: none; width: auto; margin: 0; }

h1, .like_h1 { font-size: 22px; line-height: 30px; } 
h2, .like_h2 { font-size: 18px; line-height: 26px; } 
h3, .like_h3 { font-size: 16px; line-height: 24px; } 

#footer { padding: 20px 0 5px 0; }
#footer .footer_box { clear: both; float: none; width: auto; margin: 0 10px 15px 10px; }
#footer #footer_box_kontakt { width: auto; margin: 0 10px 15px 10px; }
#footer .footer_box_headline { margin: 0 0 5px 0; }


}



/* redaxo_responsive_menu.css */
#navigation_button { display: none; position: absolute; top: 5px; right: 5px; width: 53px; height: 53px; text-decoration: none; padding: 0; color: #FFF; background-image: url(mobile_menue.png); background-repeat: no-repeat; background-position: center center; z-index: 999; overflow: hidden; text-indent: -99999px; }
#navigation_button:hover { opacity: 0.8; }

#navigation { position: relative; top: 0; left: 0; width: 100%; height: auto; margin: 0; padding: 0; z-index: 1000; text-align: center; }

/* erste Ebene */
#navigation ul { list-style: none; display: block; margin: 0; padding: 0; }
#navigation li { list-style-type: none; display: inline-block; position: relative; top: 0; left: 0; width: auto; height: auto; margin: 0; padding: 0; z-index: 1; border-left: 1px solid #6299b4; }

#navigation li:first-child { border-left: none; }

#navigation ul li a { font-family: 'Open Sans', Verdana, Geneva, sans-serif; font-weight: 400; display: block; width: auto; height: auto; margin: 0; padding: 5px 40px; font-size: 24px; line-height: 30px; color: #666; text-decoration: none; text-transform: uppercase; white-space: nowrap; 
}

#navigation ul li a:hover,
#navigation ul li a.rex-current,
#navigation ul li a.rex-active { text-decoration: none; color: #6299b4; }





/* Der eigentliche Dropdown Effekt */
#navigation li:hover ul, #navigation li.over ul { display: block; }
#navigation li > ul { left: 0; top: 0; }

/* zweite Ebene */
#navigation ul.rex-navi2 { 
    display: none;
	position: absolute;
	top: 40px; left: 0;
	width: auto; min-width: 100%; height: auto;
	margin: 0; padding: 20px 0 0 0;
	z-index: 100;
}
#navigation ul.rex-navi2 li { display:block; float:none; width: 100%; height: auto; margin: 0; padding: 0; border-left: none; }
#navigation ul.rex-navi2 li a { display:block; float: none; width: auto; min-width: 150px; margin: 0; padding: 5px 20px; color: #2d2d2d; font-size: 18px; line-height: 30px; white-space: nowrap; text-transform: none; text-align: left; background-color: #fafafa; background-color: rgba(250,250,250,0.9); background-image: none !important; border: none; border-top: 1px solid #FFF;
}
#navigation ul.rex-navi2 li a:hover, 
#navigation ul.rex-navi2 li a.rex-current,
#navigation ul.rex-navi2 li a.rex-active { color: #6299b4; }

#navigation ul.rex-navi2 li:first-child a { }

/* dritte Ebene */
#navigation ul.rex-navi3 { display: none !important; }


/* CSS Animationen */
#navigation a { 
	-webkit-transition: all 0.125s ease-in;
	-moz-transition: all 0.125s ease-in;
	-o-transition: all 0.125s ease-in;
    transition: all 0.125s ease-in;
}
#navigation a:hover {
	-webkit-transition: all 0.125s ease-out;
	-moz-transition: all 0.125s ease-out;
	-o-transition: all 0.125s ease-out;
	transition: all 0.125s ease-out;
}




#subnav { display: block; position: relative; top: 0; left: 0; width: 100%; height: auto; margin: 0; padding: 0; z-index: 1; } 
#subnav { width: 100%; margin: 0; }

/* erste Ebene */
#subnav ul { list-style: none; margin: 0; padding: 0; }
#subnav ul li { list-style-type: none; display: block; margin: 0 0 10px 0; padding: 0; }

#subnav ul li a { display: block; width: auto; height: auto; margin: 0; padding: 5px 5px 5px 15px; text-align: left; text-decoration: none; 
font-family: 'Open Sans', Verdana, Geneva, sans-serif; font-weight: 400; 
font-size: 20px; line-height: 30px; color: #666; background-color: #e1eaee; }
#subnav ul li a:hover { text-decoration: none; color: #6299b4; }
#subnav ul li a.rex-current,
#subnav ul li a.rex-active { color: #6299b4; }

#subnav ul li:first-child { padding: 0; }


/* ----------------------------------------------------------------------------------
   Responsive Webdesign
---------------------------------------------------------------------------------- */ 
/* wird nur ab Mobil benoetigt, deswegen generell erstmal ausblenden */
#navigation li a span { display: none; } 



@media all and (max-width:1460px) { #navigation ul li a { padding: 5px 25px; font-size: 22px; line-height: 30px; } }
@media all and (max-width:1200px) { #navigation ul li a { padding: 5px 15px; font-size: 20px; line-height: 30px; } }
@media all and (max-width: 980px) { #navigation ul li a { padding: 5px 8px; font-size: 16px; line-height: 30px; } }

@media all and (max-width:1460px) { #subnav ul li a { font-size: 16px; line-height: 30px; hyphens: auto; } }
@media all and (max-width:1200px) { #subnav ul li a { font-size: 16px; line-height: 30px; } }
@media all and (max-width: 980px) { #subnav ul li a { font-size: 14px; line-height: 30px; } }

@media all and (max-width: 768px) {  
#navigation_button { display: block; }

	
#navigation { clear: both; position: relative; top: 0; left: 0; width: 100%; height: auto; margin: 0; max-height: 0; overflow: hidden; background-color: #f4f4f4; }
#navigation > ul ul { overflow: hidden; max-height: 0; }

#navigation.active, #navigation > ul ul.active { max-height: 99999em; } 
#navigation ul { display: block; }
#navigation ul li { display: block; float: none; height: auto; margin: 0; padding: 0; border-left: none; }
#navigation ul li a { display: block; float: none; width: auto; margin: 0; padding: 10px 10px 10px 10px;  font-size: 18px; line-height: 18px; border-bottom: 1px solid #808080; color: #000; background-color: transparent; background-image: none; text-align: left; }
#navigation ul li a:hover { background-color: #AAA; color: #000 !important; }
#navigation ul li a.rex-current,
#navigation ul li a.rex-active { background-color: #DDD; color: #000; padding: 10px 10px 10px 10px; color: #000; text-align: left; }


/* Zweite Ebene */
#navigation ul.rex-navi2 { display: inherit; position: relative; top:auto; left: auto; padding: 0; box-shadow: none; border-top: none; }
#navigation ul.rex-navi2 li a { padding: 10px 10px 10px 20px; font-size: 15px; line-height: 18px; color: #000; background-color: #f4f4f4; border-top: none; border-bottom: 1px solid #808080; }
#navigation ul.rex-navi2 li a:hover { background-color: #AAA; color: #000 !important; }
#navigation ul.rex-navi2 li a.rex-current,
#navigation ul.rex-navi2 li a.rex-active { background-color: #DDD; color: #000; }

#navigation ul.rex-navi2 li:last-child a { padding-bottom: 10px; }

/* 1.) Zum Anklicken bei Menuepunkten mit Submenue
#navigation li.has-submenu > a:after { content: '+'; position: absolute; top: 0; right: 0; display: block; font-size: 1.5em; padding: 10px 10px; }
#navigation li.has-submenu > a.active:after { content: "-"; }
*/

/* 2.) Alternative mit Hauptpunkten anklickbar lassen (1. dann auskommentieren) */
#navigation li a span { display: none; } 
#navigation li.has-submenu a span  { content: ''; display: block; position: absolute; top: 4px; right: 4px; width: 32px; height: 32px; margin: 0; padding: 0; z-index: 10; 
background-color: #FFF; text-indent: -9999px; overflow: hidden; background-image: url(mobile_menue_arrow_down.png); background-position: center center; background-repeat: no-repeat; }
#navigation li.has-submenu a span:hover  { background-color: #b3b2b2; }
#navigation li.has-submenu a.active span { background-image: url(mobile_menue_arrow_up.png); } 

/* zweite Ebene */
#navigation li.has-submenu ul.rex-navi2 li a span { display: none; } 
#navigation li.has-submenu ul.rex-navi2 li.has-submenu a span { display: block; } 

/* dritte und letzte Ebene */
#navigation li.has-submenu ul.rex-navi3 li a span { display: none !important; } 
 
 
}

/* 005_download.css */
.m005_download .download_item { display: block; position: relative; width: auto; margin: 0 0 1.0rem 0; padding: 0; border: 1px solid #e0e0e0; border-radius: 4px; transition: all 0.25s ease-in-out; }
.m005_download .download_link { text-decoration: none; display: block; padding: 12px; color: inherit; outline: none; background-color: #f9f9f9; border-radius: 3px; transition: all 0.25s ease-in-out; }
.m005_download .download_link:hover { text-decoration: none; }
.m005_download .download_item:hover { background-color: #e5effa; border-color: #3d87cf; box-shadow: 0 2px 6px rgba(61, 135, 207, 0.15); }
.m005_download .download_item:hover .download_title { color: #1a6cbf; }
.m005_download .download_item:hover .download_info { text-decoration: underline; }
.m005_download .download_item:active { background-color: #d8e7f7; box-shadow: inset 0 1px 3px rgba(0,0,0,0.05); transition-duration: 0.1s; }
.m005_download .download_link:focus, .m005_download .download_link:focus-visible { outline: none; }
.m005_download .download_item:focus-within .download_title { color: #1a6cbf; }
.m005_download .download_item:focus-within .download_info { text-decoration: underline; }
.m005_download .download_item:focus-within { border-color: #1a6cbf; box-shadow: 0 0 0 3px rgba(61, 135, 207, 0.5); background-color: #e5effa; }
.m005_download .download_item:focus-within::after { content: ''; position: absolute; top: -2px; left: -2px; right: -2px; bottom: -2px; border-radius: 6px; box-shadow: 0 0 0 1px #1a6cbf; pointer-events: none; }
.m005_download .download_content { display: flex; align-items: center; }
.m005_download .download_icon { flex: 0 0 auto; margin-right: 15px; display: flex; align-items: center; justify-content: center; transition: transform 0.2s ease; }
.m005_download .download_item:hover .download_icon { transform: scale(1.1); }
.m005_download .download_item:focus-within .download_icon { transform: scale(1.1); }
.m005_download .download_text { flex: 1; display: flex; flex-direction: column; }
.m005_download .download_title { font-size: 1rem; font-weight: bold; margin-bottom: 0.3rem; color: #333; transition: color 0.2s ease-in-out; }
.m005_download .download_info { font-size: 0.85rem; display: block; margin-bottom: 0.2rem; color: #555; }
.m005_download .download_description { color: #777; margin: 0; font-size: 0.7rem; display: block; }

@media (prefers-reduced-motion: reduce) {
.m005_download .download_item,
.m005_download .download_link,
.m005_download .download_title,
.m005_download .download_icon { transition: none; }
.m005_download .download_item:hover .download_icon,
.m005_download .download_item:focus-within .download_icon { transform: none; }
}

/* extras_011_formular_yform_flex.css */
/* ==========================================================================
   ACHTUNG: CSS von extras_010_formular_yform und extras_011_formular_yform_flex IMMER exakt GLEICH halten !!!
   (Wichtig: Im Template daher nur eine der beiden CSS einbinden.)
   ========================================================================== */

.yform form { display: flex; flex-wrap: wrap; column-gap: 4%; margin: 0 0 20px 0; padding: 0; }
.yform form > * { flex-basis: 100%; }

/* .form-group ist ein Flex-Item, kollabiert sein margin-bottom deshalb nicht
   mit dem der Kinder - eigenes margin-bottom hier wuerde sich zum
   margin-bottom von .form-control (unten) addieren (40px statt 20px). */
.yform .form-group { margin-bottom: 0; }

/* Label-Styling für bessere Barrierefreiheit */
.yform label { display: block; margin-bottom: 6px; font-weight: 500; color: #333; }

/* Hervorhebung von Pflichtfeldern im Label */
.yform label .required { color: #a94442; margin-left: 3px; }

.yform .form-control { box-sizing: border-box; display: block; width: 100%; height: auto; margin: 0 0 20px 0; padding: 8px 10px; font-family: inherit; font-size: 0.8rem; color: #001f40; background-color: #fff; border: solid 1px #dfe6e7; border-radius: 5px; box-shadow: none; outline: none; transition: border-color 0.2s, box-shadow 0.2s; }
.yform select.form-control { height: 36px; }
.yform .form-control:hover { border-color: #a8aeb5; }
.yform .form-control:focus, .yform .form-control:focus-visible { border-color: #37434f; outline: none; box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.25); }

.yform textarea.form-control { height: 284px; }

.yform .form-check-group { clear: both; margin: 0 0 20px 0; }
.yform .form-check-group .control-label { clear: both; display: block; margin: 0 0 10px 0; }

/* Generelle Formatierung für Checkboxen und Radiobuttons */
.yform .checkbox,
.yform .radio { clear: both; position: relative; margin-bottom: 10px; }

.yform .checkbox label,
.yform .radio label { position: relative; cursor: pointer; margin-left: 0; padding: 0 0 0 30px; }

.yform .checkbox label input,
.yform .radio label input { position: absolute; top: 0; left: 0; width: 20px; height: 20px; margin: 0; padding: 0; }

.yform .checkbox input:focus,
.yform .checkbox input:focus-visible,
.yform .radio input:focus,
.yform .radio input:focus-visible { outline: 2px solid #0078d7; outline-offset: 2px; }

.yform .radio i.form-helper,
.yform .checkbox i.form-helper { display: none; }


/* Hilfetext-Stil */
.yform .help-text { display: block; font-size: 0.85rem; color: #666; margin-top: -15px; margin-bottom: 15px; }

/* Verbesserter Button für Barrierefreiheit */
.yform .btn-primary { clear: both; display: block; flex-basis: auto; width: fit-content; min-width: 40px; height: auto; margin: 0 0 10px 0; padding: 10px; border: none; border-radius: 5px; text-align: center; font-weight: bold; background-color: #58698d; color: #FFF; cursor: pointer; transition: background-color 0.2s, transform 0.1s; }
.yform .btn-primary:hover { background-color: #001f40; color: #FFF; }
.yform .btn-primary:focus, .yform .btn-primary:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.5); background-color: #001f40; }
.yform .btn-primary:active { transform: translateY(1px); }

/* Besser sichtbare Pflichtfeld-Markierung */
.yform .pflichtfelder { font-size: 0.9rem; margin-top: 15px; margin-bottom: 20px; color: #555; }

/* Fehlerhinweisbox, überm Formular */
.yform div.alert { padding: 15px 20px 5px 20px; margin-bottom: 20px; border-radius: 4px; }
.yform div.alert span { margin-right: 15px; }
.yform div.alert-danger { border: 2px solid #a94442; background-color: #FBF6F6; color: #a94442; }
.yform .alert ul { list-style-type: none; margin: 0; padding: 0; }
.yform .alert li { list-style-type: none; margin: 0 0 10px 0; padding: 0; color: #a94442; }

/* Grundlegende Fehlermarkierung für alle Formularelemente */
.yform .has-error { margin-bottom: 20px; }
.yform .has-error .control-label { color: #a94442; font-weight: 500; }
.yform .has-error label { color: #a94442; }
.yform .has-error .form-control { border-color: #a94442; box-shadow: 0 0 0 2px rgba(169, 68, 66, 0.25); }

/* Fehlermarkierung für reguläre Eingabefelder */
.yform .has-error .form-control { border-color: #a94442; box-shadow: 0 0 0 1px #EAD0D0; background-color: #FBF6F6; }
/* Spezielle Fehlermarkierung für die Checkbox */
.yform .formcheckbox.has-error label { color: #a94442; }
.yform .formcheckbox.has-error .form-helper { border-color: #a94442; box-shadow: 0 0 0 1px #EAD0D0; }

/* Optionale visuelle Verstärkung für die Checkbox */
.yform .formcheckbox.has-error { padding: 10px; border-radius: 4px; background-color: #FBF6F6; }

/* Fokus-Zustand für fehlerhafte Checkboxen verstärken */
.yform .formcheckbox.has-error input[type="checkbox"]:focus + .form-helper,
.yform .formcheckbox.has-error input[type="checkbox"]:focus-visible + .form-helper { border-color: #a94442; box-shadow: 0 0 0 3px rgba(169, 68, 66, 0.3); }

/* Verbesserte Fokusdarstellung für Tastaturbedienung */
.yform a:focus, .yform a:focus-visible { outline: 2px solid #0078d7; outline-offset: 2px; }

/* High-contrast mode Unterstützung */
@media (forced-colors: active) {
.yform .form-control:focus { outline: 2px solid CanvasText; }
.yform .btn-primary { border: 1px solid CanvasText; }
}


/* Honeypot gegen SPAM */
.yform .honeypot_box div.form-group { display: block; width: 1px; height: 1px; margin: 0; padding: 0; overflow: hidden; opacity: 0.1; }
/* Wird sichtbar, wenn das Feld den Fokus bekommt oder .has-error hat*/
.yform .honeypot_box div.form-group:focus-within,
.yform .honeypot_box div.form-group.has-error { display: block; width: auto; height: auto; margin: 0 0 20px 0; padding: 15px 20px 5px 20px; overflow: visible; opacity: 1; background-color: #f8f8f8; border: 1px solid #ddd; border-radius: 4px; box-shadow: 0 0 5px rgba(0,0,0,0.1); }
.yform .honeypot_box div.form-group.has-error { border-color: #a94442; }


/* Datenschutz Hinweis */
.yform .privacy_box { clear: both; position: relative; margin-bottom: 25px; padding: 5px 0; }
.yform .privacy_box a { color: #58698d; text-decoration: underline; font-weight: 500; }
.yform .privacy_box a:hover { color: #001f40; }
.yform .privacy_box a:focus, .yform .privacy_box a:focus-visible { outline: 2px solid #0078d7; outline-offset: 2px; }
/* Fehlerzustand für die Checkbox */
.yform .privacy_box.has-error label { color: #a94442; }
.yform .privacy_box.has-error .form-helper { border-color: #a94442; box-shadow: 0 0 0 1px rgba(169, 68, 66, 0.25); }
.yform .privacy_box.has-error { background-color: rgba(169, 68, 66, 0.05); padding: 10px; border-radius: 4px; }

/* hier ohne .yForm !!! */
.hinweis_email_erfolgreich_versendet { display: block; margin: 20px 0; padding: 20px; background-color: #5bb585; color: #fff; font-size: 1.5rem; text-align: center; }

/* ALTCHA-Widget (bw_altcha_captcha). Kommt als <altcha-widget> ins Formular. */
.yform altcha-widget { display: block; margin: 0 0 20px 0; }

/* Formular mit 2 Spalten: 48% + 4% column-gap (am form) + 48% = 100% */
.yform .form_left, .yform .form_right { flex-basis: 48%; min-width: 250px; margin: 0 0 20px 0; }
.yform .form_clear { flex-basis: 100%; }

@media all and (max-width:768px) {
.yform .form_left, .yform .form_right { flex-basis: 100%; }
}

/* Upload-Felder als Drop-Zone (Markup: yForm 5 value.upload.tpl.php). Natives
   <input type="file"> liegt unsichtbar über der ganzen Box - Klick und
   Drag-and-drop funktionieren dadurch ohne JS. styles_js.inc ergänzt nur
   Komfort (Dateiname, Dragover-Optik, Entfernen-Button); .has_file/.is_dragover
   kommen von dort. */
.yform .upload_felder { flex-basis: 100%; margin: 0 0 20px 0; }

/* Optionale Überschrift über den Upload-Boxen (im Formular-Code als html-Feld) */
.yform .upload_felder .upload_titel { display: block; margin: 0 0 10px 0; font-weight: 600; font-size: 1.1rem; color: #333; }

/* Box */
.yform .upload_felder .form-group { position: relative; display: block; margin: 0 0 15px 0; padding: 20px 56px 20px 64px; min-height: 72px; border: 2px dashed #b9c2cc; border-radius: 6px; background-color: #f7f9fb; transition: border-color 0.2s, background-color 0.2s; }
.yform .upload_felder .form-group:hover,
.yform .upload_felder .form-group.is_dragover { border-color: #37434f; background-color: #eef3f8; }
.yform .upload_felder .form-group:focus-within { outline: 2px solid #0078d7; outline-offset: 2px; }
.yform .upload_felder .form-group.is_dragover { border-style: solid; }

/* Upload-Icon (Pfeil nach oben), Farbe im Projekt-CSS über fill anpassen */
.yform .upload_felder .form-group::before { content: ""; position: absolute; top: 50%; left: 22px; width: 24px; height: 24px; transform: translateY(-50%); background-repeat: no-repeat; background-size: contain; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231d4ed8' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'><path d='M12 19V6'/><path d='M6 12l6-6 6 6'/><path d='M5 21h14'/></svg>"); pointer-events: none; }

/* Label = sichtbarer Text der Box; Hinweis in Klammern über .upload_hint */
.yform .upload_felder .control-label { display: block; margin: 0; font-weight: 600; color: #333; cursor: pointer; }
.yform .upload_felder .upload_hint { display: block; margin: 4px 0 0 0; font-weight: 400; font-size: 0.85rem; color: #666; }

/* Natives Input unsichtbar über die ganze Box legen (klick- und drop-fähig) */
.yform .upload_felder .input-group { display: block; position: static; }
.yform .upload_felder .input-group input[type="file"] { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; margin: 0; padding: 0; border: 0; opacity: 0; cursor: pointer; z-index: 1; }

/* Ausgewählte Datei (wird vom JS gefüllt) */
.yform .upload_felder .upload_filename { display: none; margin: 6px 0 0 0; font-size: 0.85rem; color: #333; word-break: break-all; }
.yform .upload_felder .form-group.has_file .upload_filename { display: block; }

/* Entfernen-Button (×) aus dem yForm-Template: nur mit Datei sichtbar, über dem Input */
.yform .upload_felder .input-group-btn { display: none; position: absolute; top: 10px; right: 10px; z-index: 2; }
.yform .upload_felder .form-group.has_file .input-group-btn { display: block; }
.yform .upload_felder .input-group-btn .btn-default { width: 32px; height: 32px; margin: 0; padding: 0; border: 1px solid #b9c2cc; border-radius: 50%; background-color: #fff; color: #333; font-size: 1.2rem; line-height: 1; cursor: pointer; }
.yform .upload_felder .input-group-btn .btn-default:hover { background-color: #a94442; border-color: #a94442; color: #fff; }
.yform .upload_felder .input-group-btn .btn-default:focus-visible { outline: 2px solid #0078d7; outline-offset: 2px; }

/* Hinweis-/Fehlertext unter dem Label (liegt unter dem transparenten Input, ist nur lesbar) */
.yform .upload_felder .help-block { position: relative; margin: 6px 0 0 0; font-size: 0.85rem; color: #666; }
.yform .upload_felder .help-block .text-warning { color: #a94442; }

/* Fehlerzustand */
.yform .upload_felder .form-group.has-error { border-color: #a94442; background-color: #FBF6F6; }
.yform .upload_felder .form-group.has-error .control-label { color: #a94442; }

/* Bereits hochgeladene Datei (nach fehlgeschlagener Validierung): yForm zeigt eine
   Checkbox "Häkchen setzen um die Datei zu entfernen" - normale Checkbox-Optik */
.yform .upload_felder .checkbox { margin: -5px 0 15px 0; }

@media (forced-colors: active) {
.yform .upload_felder .form-group { border-color: CanvasText; }
}

@media (prefers-reduced-motion: reduce) {
.yform .form-control,
.yform .btn-primary,
.yform .upload_felder .form-group { transition: none; }
}


/* module20261025.css */
/* --- yForm: nur Abweichungen vom Modul-Skelett (extras_010_formular_yform/styles_css.inc) --- */
.yform form { margin: 0 0 40px 0; }
.yform form.hide-label label { display: none; }

.yform label { float: left; width: 130px; margin: 0 0 10px 0; padding: 5px 0; font-size: 0.81rem; }
.yform .checkbox label,
.yform .radio label { float: none; width: auto; padding: 0 0 0 30px; }
.yform .form-group { clear: both; }

.yform .form-control { max-width: 400px; padding: 5px 1%; font-size: 0.88rem; color: #000; border-color: #CCC; }
.yform textarea.form-control { height: 160px; }

.yform .btn-primary { width: 140px; margin-left: 130px; padding: 5px; background-color: #565656; }
.yform .btn-primary:hover,
.yform .btn-primary:focus-visible { background-color: #565656; opacity: 0.6; }

.yform .formcheckbox { padding: 0 0 0 130px; }

@media all and (max-width:480px) {
.yform label { float: none; width: auto; margin: 0 0 5px 0; padding: 0; }
.yform .formcheckbox { padding: 0; }
.yform .btn-primary { margin-left: 0; }
}


/* --- yForm: im Skelett nicht vorhanden --- */
.yform hr { height: 0; margin-top: 30px; margin-bottom: 30px; border-top: 1px solid #b8c3cd; box-sizing: content-box; }
.yform .formcom_auth_form_info { list-style-type: none; padding-left: 0; margin-bottom: 50px; }
.yform .alert > p { margin-top: 10px; margin-bottom: 10px; }

.yform .captcha_headline { display: block; margin: 0 0 10px 0; }
.yform .form-captcha img { float: left; display: block; margin: 5px 10px 20px 0; }
.yform .form-captcha input { float: left; display: block; width: 60px; margin: 5px 10px 20px 0; }
.yform .form-captcha .input-group-btn a { display: block; width: 40px; height: 40px; margin: 0; padding: 0; background-image: url(yform_captcha_reload.png); background-position: center center; background-repeat: no-repeat; text-indent: -999999px; overflow: hidden; }


/* Sonderfaelle */
.form_left, .form_right { display: block; float: left; width: 49%; margin: 0; padding: 0; }
.form_right { float: right; }
.form_clear { clear: both; }


/* Sonderfaelle */
.formular_box_outer_1_2 { display: block; float: left; width: 49%; margin: 0 1% 0 0; padding: 0; }
.formular_box_outer_1_2.left { float: left; }
.formular_box_outer_1_2.right { float: right; margin: 0 0 0 1%; }
.formular_box { clear: both; display: block; background-color: #E9E9E9; padding: 20px 20px 10px 20px; margin: 0 0 20px 0; }
/* Clearfix, um das Floating innerhalb der Container aufzuheben  */ 
.formular_box:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }

.formular_box_headline { clear: both; display: block; margin: 0 0 10px 0; padding: 5px 0; line-height: 20px; color: #3d454c; font-weight: bold; }
.formular_box_input_label { clear: both; display: block; float: left; width: 150px; margin: 0 0 10px 0; padding: 5px 0; font-size: 13px; line-height: 20px; }
.formular_box_input { display: block; width: auto; margin: 0; padding: 0 0 0 150px; }
.formular_box_input .form-control { width: 100px; max-width: none; margin: 0 0 10px 0; }
.formular_box .text_small { font-size: 11px; line-height: 20px; }


.yform .formular_box_outer_1_2 .form-control { width: 60%; min-width: 200px; max-width: 400px; }

.yform .formular_box_text_no_label label { display: none !important; }

.formular_box .formcheckbox { display: inline-block; margin: 0 10px 0 5px; padding: 5px 0; }


.jquery_input_box { clear: both; display: block; background-color: #F3F3F3; padding: 20px 10px 5px 10px; margin: 0 0 20px 0; }


.yform .formular_box_outer_1_2 .form-inline { display: block; margin: 0 0 20px 120px; }
.yform .formular_box_outer_1_2 .form-inline select { display: inline-block; width: 80px; min-width: 10px; max-width: 80px; margin: 0 10px 0 0; text-align: center; }