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

html, body {
font-family: sans-serif, serif, fantasy,monospace, arial, sans, Tahoma;;
font-size: 16px; line-height: 25px;
color: #FFF;
/* 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: #4e4e4d; }



/* ----------------------------------------------------------------------------------
   Schriften + Generelle CSS-Anpassungen fuer diese Webseite
---------------------------------------------------------------------------------- */ 

a { text-decoration: none; color: #cb6800; }
a:hover, a:focus { text-decoration: none; color: #FFF; }
a:active, a:focus { outline: 0; }

/* Waehlt nur Links aus, die ein Bild enthalten, damit der focus um das Bild liegt und nicht nur der line-height */
a:has(img) { display: inline-block; }

a:hover img, a:focus img { opacity: 0.8; }

a:focus-visible { outline: 2px solid blue; outline-offset: 3px; }

ul { margin: 0 0 20px 0; }
ul li { list-style-type: disc; margin: 0 0 5px 17px; padding: 0; }

h1, h2, h3, h4, h5, h6,
.like_h1, .like_h2, .like_h3, .like_h4, .like_h5, .like_h6 { font-weight: bold; font-style: normal; font-size: 14px; line-height: 20px; margin: 0 0 15px 0; color: #FFF; }
h1, .like_h1 { font-size: 24px; line-height: 30px; }
h2, .like_h2 { font-size: 20px; line-height: 26px; }
h3, .like_h3 { font-size: 16px; line-height: 22px; } 
h4, .like_h4 { font-size: 14px; } 
h5, .like_h5 { font-size: 12px; } 
h6, .like_h6 { font-size: 10px; } 

.headline_bg_orange h1, .headline_bg_orange h2, .headline_bg_orange h3 { display: block; margin: 0 0 20px 0; padding: 5px 10px; color: #FFF; background-color: #cb6800; }


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

hr { clear: both; display: block; width: 92.77%; height: 3px; margin: 0 0 20px 3.61%; border: none; background-color: #f6e1cc; } 
.small  { display: block; font-size: 13px; line-height: 20px; color: #FFF; padding-top: 5px; } /* Bildunterschriften */

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

.box_width_full { width: 100%; margin: 0 0 20px 0; }
.box_width_1_2 { clear: none; width: 44.58%; }
.box_width_1_3 { clear: none; width: 28.51%; }
.box_width_2_3 { clear: none; width: 60.63%; }
.box_width_1_4 { clear: none; width: 20.48%; }

.box_gray { background-color: #efefee; color: #000; } .box_gray * { color: #000; }

.outer_box_inner { display: block; padding: 20px 20px 1px 20px; }
.outer_box_inner .image { margin: 0 !important; }

.headline_box { margin-bottom: 0 !important; }
#sidebar .outer_box { float: none !important; width: 100% !important; margin: 0 0 20px 0 !important; }


/* ----------------------------------------------------------------------------------
 Clearfix, um das Floating innerhalb der Container aufzuheben fuer Firefox, IE8, Opera, Safari, etc.
---------------------------------------------------------------------------------- */ 
.outer_box_inner:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
* + html .outer_box_inner { display: inline-block; } /* fuer IE7 */
* html .outer_box_inner { height: 1%; } /* fuer IE6 */


.outer_box .image { margin: 0 0 5px 0; }
.outer_box .image a { text-decoration: none !important; }
.outer_box .image a:hover, .outer_box .image a:focus { opacity: 0.8; }


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

.zweispalter { }
.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: 100%; height: auto; min-height: 100%; margin: 0; padding: 0; z-index: 1; }

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

#page { width: 995px; margin: 0 auto; background-color: #3a3a3a; }

#header { width: auto; margin: 0; padding: 20px 0 0 0; }

#logo { position: absolute; top: 0; left: auto; right: 0; width: 260px; height: 64px; z-index: 10; }

#navigation_not_responsive { }


#wrapper_bg { }
#wrapper { padding: 40px 0 20px 0; }

#content { float: left; width: 685px; margin: 0; padding: 0; }
#sidebar { float: right; width: 280px; margin: 0 25px 0 0; }

#footer_bg { clear: both; width: auto; margin: 0; padding: 10px 0; background-color: #cb6800; }
#footer { text-align: center; }

#footer a { display: inline-block; margin: 0 15px; color: #FFF; text-decoration: none; }
#footer a:hover, #footer a:focus { color: #FFF; text-decoration: underline; }


/* ---  Cookie-Hinweis ohne OK-Button - Datenschutzinfo --- */ 
#datenschutzinfo { clear: both; display: block; width: auto; height: auto; margin: 0; padding: 15px 10px; background-color: #333; font-size: 12px; line-height: 20px; color: #fff; text-align: center; }
#datenschutzinfo a { color: #fff; text-decoration: underline; border-bottom: none; }
#datenschutzinfo a:hover, #datenschutzinfo a:focus { color: #fff; text-decoration: none; }


/* ----------------------------------------------------------------------------------
   Module
---------------------------------------------------------------------------------- */ 
/*
#google_map_iframe iframe { width: 100% !important; border: none !important; }

.video { clear: both; display: block; position: relative; top: 0; left: 0; width: 100%; height: 0; margin: 0 0 20px 0; padding: 30px 0 56.25% 0; overflow: hidden; }
.video iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: none !important; }
*/

.download_icon { display: block; float: left; width: 45px; height: auto; margin: 0 0 10px 0; }
.download_text { display: block; width: auto; height: auto; margin: 0 0 10px 60px; }


#subnav_bg { display: block; width: 100%; margin: 0 0 20px 0; background-color: #f6e1cc; }
#subnav_headline { display: block; margin: 0; padding: 6px 12px 3px 12px; color: #FFF; background-color: #ca6900; font-size: 16px; line-height: 25px; font-weight: bold; }

#subnav { display: block; margin: 0; padding: 15px 10px 5px 15px; }
#subnav ul { display: block; margin: 0; padding: 0; }
#subnav ul li { display: block; margin: 0; padding: 0; list-style-type: none; }
#subnav ul li a { display: block; margin: 0 0 15px 0; padding: 0 0 0 20px; color: #454442; text-decoration: none; font-size: 16px; line-height: 25px; background-image: url(icon_subnav.png); background-position: left top; background-repeat: no-repeat; }
#subnav ul li a:hover,
#subnav ul li a:focus,
#subnav ul li a.rex-current,
#subnav ul li a.rex-acrtive { color: #cb6800; text-decoration: none; }

#subnav ul.rex-navi2 { display: none; }

.tour_box { clear: both; display: block; margin: 0; padding: 10px; background-color: #4e4e4e; }
.tour_schwierigkeit { display: block; float: left; width: 59px; height: 33px; }
.tour_datum { display: block; margin: 0 0 0 70px; font-size: 13px; line-height: 15px; }
.tour_text { clear: both; display: block; padding: 10px 0 0 0; }


table, tr, th, td { text-align: left; vertical-align: top; border: none; }

table { width:100%; margin: 0 0 20px 0; padding: 0; background-color: #CA6900; }
th { padding: 5px 5px 5px 10px; background-color: #CA6900; font-weight: bold; border-bottom: 1px solid #e0a566; }
td { padding: 5px 10px 5px 5px; border-bottom: 1px solid #e0a566; }

tr:nth-child(even) { background-color: #CA6900; }
tr:nth-child(odd) { background-color: #CA6900; }

#article_nav { clear: both; display: block; padding: 40px 0 20px 0; text-align: center; }
#article_nav a { display: block; padding: 5px 0; border-radius: 5px; text-decoration: none; color: #FFF; background-color: #ca6900; white-space: nowrap; font-size: 16px; line-height: 20px; }
#article_nav a:hover, #article_nav a:focus { text-decoration: none; color: #4b4b4b; background-color: #f6e1cc; }
#article_nav_back { display: block; float: left; width: 90px; margin: 0 0 0 2.88%; }
#article_nav_next { display: block; float: right; width: 90px; margin: 0 2.88% 0 0; }
#article_nav_home { display: block; width: 90px; margin: 0 auto; }


.bildergalerie { clear: both; display: block; }
.bildergalerie a { display: block; float: left; width: 20.48%; margin: 0 0 3.61% 3.61%; padding: 0; }
.bildergalerie a img { display: block; width: 95%; padding: 2%; border: 1px solid #aaa; }
.bildergalerie a:hover img, .bildergalerie a:focus img { background-color: #BBB; border: 1px solid #BBB; }

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

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

#content { width: 66.94%; margin: 0; }
#sidebar { width: 30.64%; margin: 0 2.42% 0 0; }

#logo { left: 20px; }
#navigation_not_responsive { width: auto; padding: 0 2.42%; }
}

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

.team_vorstand_box,
.team_stadtrat_box,
.team_wahl_box { float: left; width: 46.37%; margin: 0 0 2.42% 2.42%; padding: 0; }

#navigation_not_responsive { display: none; }
#subnav_bg { display: none; }

#header { padding: 0; }

#logo { position: relative; top: 0; left: 0; width: 150px; height: auto; padding: 10px 0; }

#wrapper { padding: 20px 0 5px 0; }

#content { clear: both; float: none; width: 100%; margin: 0 0 30px 0; padding: 0 0 10px 0; }
#sidebar { clear: both; float: none; width: auto; margin: 0 2.42%; padding: 0; }


#footer_bg { width: 100%; margin: 0; }


}


@media all and (max-width:480px) {
.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; }

}