/*--------------------------------------------------------------
# General

# Grün: #12773C
# Grün hell: #D0E4D8
# Grün hell2: #D0E4D8
# Blau hell: #d6e6f1
# Orange: #d08a47
# Schrift: #3e3e3e
--------------------------------------------------------------*/

:target:before {
    content: "";
    display: block;
    height: 100px;
    margin: -100px 0 0;
}

#header {
display:block;
  width: 100%;
  min-height: 150px;
  background-color: rgba(216,233,225,1.0);
  background: url('../../media/header_lsv_528.png');
  background-size: 90%;
  background-position: bottom center;
  padding: 0;
  background-repeat:no-repeat;
}
#header.header-scrolled, #header.header-inner-pages {
  background-color: rgba(216, 233, 225, 1.0);
  padding: 0px 0;
}
img.bildupper, img.bildinner, .box img, .box a {border-radius: .25rem;}
img { max-width: 100%; }
#inhalt img, #sidebar img, section.inhalt img { border: 1px solid rgba(0,0,0,.125); }
.card img, section.bg-blau img, footer section img { border: none !important; }
a:hover {color: #a77240;text-decoration: none;}
b, strong, a {font-weight: 600;}
#main ul {list-style: none; margin-top: 0; margin-bottom: 0.5rem;margin-left: 0;
padding-left: 1.8em;
text-indent: -1.3em;}
#inhalt ul li, .inhalt ul li {margin: 4px 0;}
#inhalt ul li:before, 
.inhalt ul li:before {font-family: 'remixicon';content: "\eb04";padding-right: 5px;color:rgba(3, 108, 26, 0.7);}
#inhalt > div { margin-bottom:20px; }
.modal-backdrop { opacity:0.1 !important; }
.ml-5 { margin-left: 2.5em; }
.info { margin-top:20px; display:block;font-size:1.2em;font-style:italic;color:#d08a47;}


/*--------------------------------------------------------------
Formular
--------------------------------------------------------------*/
.onerow {
display: flex; 
align-items: center !important;
justify-content: flex-start !important;
}
.onerow span { padding-top:5px; }
.onerow span em { font-size:80% }
#kontaktform .form-group { margin-right:2%; }
#kontaktform h2 { display:block;clear:left;margin-bottom:15px; }
#kontaktform .form-control { padding: .75rem 1.1rem .75rem .9rem; margin-bottom: 16px; margin-top: 4px;}
#yform-kontaktform-betrag { width: 20%; float:left; margin: 0 2%;}
/* Formular */
@media (min-width: 576px) {
#yform-kontaktform-vorname,
#yform-kontaktform-nachname,
#yform-kontaktform-strasse,
#yform-kontaktform-email,
#yform-kontaktform-telefon,
#yform-kontaktform-name { width:48%; float:left; }
#yform-kontaktform-plz { width: 14%; float:left;}
#yform-kontaktform-ort { width: 32%; float:left;}
.onerow { width: 48%; margin-right:2%; }
#yform-kontaktform-mitteilung { margin-top:10px;}
}


#table-alle_yform_tables .form-group { margin-bottom:20px; }
#yform-table-alle_yform_tables-datum { display:none; }
#yform-table-alle_yform_tables-schutzhonig label { opacity:0; }
input[name="schutzhonig"] {
opacity: 0;
position: absolute;
top: 0;
left: 0;
height: 0;
width: 0;
z-index: -1;
}


section.lsv-section {
padding: 40px 0 40px 0;
overflow: visible;
}
section#stellungnahmen, section#stellungnahmen .lsv-section {
padding: 0px 0 0px 0;
overflow: hidden;
}
section.bg-blau {background-color:#d6e6f1;}



@media (max-width: 1366px) {
.navbar .dropdown .dropdown ul {
left: 90%;
}
.navbar .dropdown .dropdown:hover > ul {
left: 90%; 
}
}
@media (min-width: 992px) {
.col-md-6 {margin-top: 1rem;}
}

/*--------------------------------------------------------------
LSV-Box
--------------------------------------------------------------*/


section#lsv-infos .lsv-box p { border-bottom: 1px solid #BBB;
padding: 2px 0 3px 0; }


/*--------------------------------------------------------------
Accordion
--------------------------------------------------------------*/
.accordion h2 { margin-top:0; margin-bottom: 0; }
.accordion-item { margin-bottom:2rem; }
.accordion-button {background-color:#EBEBEB;font-size: 1.7rem;}
.accordion-button:not(.collapsed)::after {background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e"); }
.accordion-button:not(.collapsed) {
background-color:#12773C;color:#FFF;
box-shadow: inset 0 -1px 0 rgba(0,0,0,.125);
}
.accordion-button:focus {
  z-index: 3;
  border-color: #12773C;
  outline: 0;
box-shadow: inset 0 -1px 0 rgba(0,0,0,.125);
}


/*--------------------------------------------------------------
Headings
--------------------------------------------------------------*/


h1 { margin-bottom:1rem; color:#12773C;clear:left; }
h2, .top h2 { font-size: 1.7rem; color:#d08a47; margin-top:0.3rem;}
h2.untertitel { font-size: 1.5rem; color:#444; margin-top:0.3rem;margin-bottom:20px;}
.top2 h2,.top3 h2,.top4 h2,.top5 h2,.top6 h2 { margin-top:2rem;}

/*--------------------------------------------------------------
Bilder
--------------------------------------------------------------*/


img.bildupper { margin-bottom:0rem; }
img.bildinner { margin-top:8px; }
figure { display:inline-block; margin: 0 0 .5rem;padding-bottom:10px; }
figure.float-end { padding-left:20px; }
figure.float-start { padding-right:20px; }
figure .beschreibung { font-size:0.7rem; font-weight:300; color:#888; float:left; padding-top:3px; }
figure .authorcopy { font-size:0.7rem; font-weight:300; color:#888; float:right;}
.card figure .authorcopy, .card figure .beschreibung { margin: 0 5px; }
.galerie img.bildupper, .galerie img.bildupper, #sidebar .lsv-box img.bildupper { margin-bottom:0; }
.galerie.col-md-3 .show, .galerie.col-md-5 .show { display:inline-block; margin-bottom:1rem; }


/*--------------------------------------------------------------
Gallery, Tabellen
--------------------------------------------------------------*/

#main ul.box-container {list-style: none; padding-left:0; }
#main ul li.box:before {font-family: 'remixicon';content: "";padding-right: 0px; }
.box .inner {
    padding: 10px;
    position: relative;
}
.gslide-description.description-left, .gslide-description.description-right {
    max-width: 200px !important;
}
.heimatlexikon { margin:2rem 0;  }
.heimatlexikon table thead { background-color:#12773C;color:#FFF; }
#stellungnahmen { margin:2rem 0;  }
#stellungnahmen table thead { background-color:#12773C;color:#FFF; }
table tr.trennlinie { border-top:2px solid #12773C; }
table.vereine td { border-bottom:1px solid white; text-align:left; padding:10px 0; }
table.vereine td img { float:left; max-height:120px; }

.tabelle-hellgruen table { background-color:#d1ded2;border-spacing: 30px; width:100%; }
.tabelle-hellgruen table tr { border-bottom: 1px solid #FFF; }
.tabelle-hellgruen table tr > td { padding:10px 20px; vertical-align:top; }
.tabelle-hellgruen table tr > td:first-of-type { min-width:25%; }


/*--------------------------------------------------------------
Wanderkarte
--------------------------------------------------------------*/

.wanderungen { display:block; }
#wanderkarte { 
background: url('../../media/karte_bornheim_1.png') top left;
background-repeat:no-repeat;
background-size:contain; }

#wanderkarte img#layer_obstblueten { width:100%; height:auto; opacity:0; }

.wanderungen #buttonrow { display:inline-block; width:100%; min-height:60px;margin-top:10px;  }
.wanderungen #buttonrow .btn { float:left; padding: .2rem .3rem .275rem .3rem; margin-right:6px; }
.wanderungen #buttonrow .btn-primary {background-color: #12773C; border-color: transparent; }
.wanderungen #buttonrow button#obstblueten {background-color: #cc6699; }
.wanderungen #buttonrow button#rundweg {background-color: #000000; }
.wanderungen #buttonrow button#hasental {background-color: #666699; }
.wanderungen #buttonrow button#talblick {background-color: #cc3333; }
.wanderungen #buttonrow button#villarustica {background-color: #3399cc; }
.wanderungen #buttonrow button#schlossweg {background-color: #006633; }
.wanderungen #buttonrow button#alteburg {background-color: #99cc33; }
.wanderungen #buttonrow button#leer {background-color: #eee; color:#3e3e3e; }
.wanderungen #buttonrow button#leer.btn { margin-right:0; }

#legende .boxhg { width:100%; padding:10px 0;}
#legende .liste { width:60%; float:left;}
#legende .boxhg p { font-size:12px; line-height:1.2rem; color:#444;float:left;margin:0 8px 0 0;}
#legende .boxhg p span { font-size:12px; font-weight:bold;padding:4px; }
#legende .boxhg h6 { float:right;font-size:14px; line-height:14px; font-weight:bold;clear:right;}
#legende .erkl h6 { margin-bottom:.7rem; }
#legende .erkl h6 a { background:#12773C; color:#FFF; padding:1px 5px; border-radius:3px;}
#legende .erkl h6 a:hover { background-color: #d08a47;border-color: #d08a47;}

/*--------------------------------------------------------------
Cards
--------------------------------------------------------------*/

h3.card-vers, h3.dachzeile {
    font-family: "Open Sans", sans-serif;
    font-size: 12px;
    color: #444;
    font-weight: normal;
    line-height: 130%;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin: 0px 0 6px 0;
}
h2.card-title {
    font-family: "Sura", serif;
    font-size: 1.5rem;
    color: #12773C;
    margin-top:0rem;
}
.card-icon {
    text-align: center;
    margin-top: -32px;
    margin-bottom: 10px;
}
.card-icon i {
    font-size: 28px;
    color: #fff;
    width: 50px;
    height: 50px;
    padding-top: 2px;
    text-align: center;
    background-color: #d08a47;
    border-radius: 2px;
    text-align: center;
    border: 2px solid #fff;
    transition: 0.3s;
    display: inline-block;
}
.card:hover .card-icon i {
    background: #fff;
    color: #12773C;
}

/*--------------------------------------------------------------
Buttons
--------------------------------------------------------------*/

.btn-primary {
    color: #fff;
    background-color:#12773C;
    border-color: #12773C;
}
.btn-primary:hover,.btn-check:active + .btn-primary, .btn-check:checked + .btn-primary, .btn-primary.active, .btn-primary:active, .show > .btn-primary.dropdown-toggle,.btn-check:focus + .btn-primary, .btn-primary:focus {
    color: #fff;
    background-color: #d08a47;
    border-color: #d08a47;
}
.btn { padding: .2rem .5rem .275rem .5rem; float:right; margin:0.4rem 0 0.2rem;font-size:0.9rem; }
figure .btn { float:left; }

/*--------------------------------------------------------------
Sidebar
--------------------------------------------------------------*/

#sidebar .subnav { margin-bottom: 2.5rem; }
#sidebar ul {list-style: none; margin-top: 0;margin-left: 0;padding-left: 0em;text-indent: 0em;}
#sidebar ul li { border-bottom:0px solid #BBB; padding:2px 0 3px 0; }
#sidebar ul.navbar-nav {padding-right: calc(var(--bs-gutter-x)/ 2);}
#sidebar ul.navbar-nav li { border-top:1px solid orange;  }
#sidebar ul.navbar-nav li:last-child { border-bottom:1px solid orange;  }
#sidebar h2, #sidebar h4 { font-size: 1.30rem; }
#sidebar .mehr { padding-bottom: 10px; }
#sidebar .freielinks { display:block;background-color:#D0E4D8;padding:10px;font-size:0.9rem;border-radius: .25rem; }
.card-body { font-size:0.9rem; display: inline-block; padding: 0 1rem 1rem 1rem; }

/*--------------------------------------------------------------
Search
--------------------------------------------------------------*/
ul#searchnavi { position:relative; display:inline-block; margin-left:40px; margin-top:-20px; }
.navbar > ul#searchnavi > li { padding: 0; }
#suchlupe {
position: absolute;
float:right;
}

#suchlupe.on {
  -webkit-animation-name: in-out;
  animation-name: in-out;
  -webkit-animation-duration: 0.7s;
  animation-duration: 0.7s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
}

#such-input.search {
  box-sizing: border-box;
  width: 16px;
  height: 16px;
  border: 2px solid #12773C;
  border-radius: 50%;
  background: none;
  color: #FFF;
  font-size: 10px;
  font-weight: 400;
  outline: 0;
  -webkit-transition: width 0.4s ease-in-out, border-radius 0.8s ease-in-out,
    padding 0.2s;
  transition: width 0.4s ease-in-out, border-radius 0.8s ease-in-out,
    padding 0.2s;
  -webkit-transition-delay: 0.4s;
  transition-delay: 0.4s;
  -webkit-transform: translate(-100%, -50%);
  -ms-transform: translate(-100%, -50%);
  transform: translate(-100%, -50%);
}


.such {
  background: none;
  position: absolute;
  top: 0px;
  left: 0;
  height: 16px;
  width: 16px;
  padding: 0;
  border-radius: 100%;
  outline: 0;
  border: 0;
  color: inherit;
  cursor: pointer;
  -webkit-transition: 0.2s ease-in-out;
  transition: 0.2s ease-in-out;
  -webkit-transform: translate(-100%, -50%);
  -ms-transform: translate(-100%, -50%);
  transform: translate(-100%, -50%);
}

.such:before {
  content: "";
  position: absolute;
  width: 12px;
  height: 2px;
  background-color: #12773C;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
  margin-top: 15px;
  margin-left: 4px;
  -webkit-transition: 0.2s ease-in-out;
  transition: 0.2s ease-in-out;
}

.close {
  -webkit-transition: 0.4s ease-in-out;
  transition: 0.4s ease-in-out;
  -webkit-transition-delay: 0.4s;
  transition-delay: 0.4s;
  display:block;
  width:auto;height:40px; cursor:pointer;
}

.close:before {
  content: "";
  position: absolute;
  width: 16px;
  height: 2px;
  margin-top: 9px;
  margin-left: -23px;
  background-color: #12773C;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
  -webkit-transition: 0.2s ease-in-out;
  transition: 0.2s ease-in-out;
}

.close:after {
  content: "";
  position: absolute;
  width: 16px;
  height: 2px;
  background-color: #12773C;
  margin-top: 9px;
  margin-left: -23px;
  cursor: pointer;
  -webkit-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

#such-input.search.square {
  box-sizing: border-box;
  padding: 0 40px 0 10px;
margin-top:10px;
  width: 240px;
  height: 40px;
  border: 2px solid #12773C;
  border-radius: 0;
  background: #D0E4D8;
  color: #3e3e3e;
  font-size: 14px;
  font-weight: 400;
  outline: 0;
  -webkit-transition: width 0.4s ease-in-out, border-radius 0.4s ease-in-out,
    padding 0.2s;
  transition: width 0.4s ease-in-out, border-radius 0.4s ease-in-out,
    padding 0.2s;
  -webkit-transition-delay: 0.4s, 0s, 0.4s;
  transition-delay: 0.4s, 0s, 0.4s;
  -webkit-transform: translate(-100%, -50%);
  -ms-transform: translate(-100%, -50%);
  transform: translate(-100%, -50%);
border-radius:4px;
}

/* *******************************************************
Suchergebnisse
******************************************************** */

.pagination {
  display: inline-block;
}

.pagination a {
  color: black;
  float: left;
  padding: 8px 16px;
  text-decoration: none;
}

.pagination a.active {
  background-color: #12773C;
  color: white;
  border-radius: 5px;
}

.pagination a:hover:not(.active) {
  background-color: #ddd;
  border-radius: 5px;
}


#main ul.search_it-results {
  list-style: none;
  margin: 0;
  padding: 0 0 0 0px;
text-indent:0;
}

ul.search_it-results li::before { content:""; display:none; }
#inhalt ul.search_it-results { margin:30px 0; }
#inhalt ul.search_it-results li { margin:10px 0; }
#inhalt ul.search_it-results li p { margin:0 0; }

@media (min-width: 576px) { 

#header.header-scrolled, #header.header-inner-pages {
  background-color: rgba(208, 228, 216, 1.0);
  padding: 0px 0;
}

#header {
  width: 100%;
  min-height: 120px;
  background-color: rgba(208,228,216,1.0);
  background: url('../../media/header_lsv.jpg') bottom left;
  background-size: 100%;
  position: relative;
  padding: 0;
  background-repeat:no-repeat;
}

 }

/*  Medium devices (tablets, 768px and up)  */
@media (min-width: 768px) { 

#header {
  width: 100%;
  min-height: 150px;
  background-color: rgba(208,228,216,1.0);
  background: url('../../media/header_lsv.jpg') bottom left;
  background-size: 100%;
  position: relative;
  padding: 0;
  background-repeat:no-repeat;
}

 }

/*  Large devices (desktops, 992px and up)  */
@media (min-width: 992px) { 

#header {
  width: 100%;
  min-height: 220px;
  background-color: rgba(208,228,216,1.0);
  background: url('../../media/header_lsv.jpg') bottom left;
  background-size: 100%;
  position: relative;
  padding: 0;
  background-repeat:no-repeat;
}
#table-alle_yform_tables { width:98%; }

 }

/*  X-Large devices (large desktops, 1200px and up)  */
@media (min-width: 1200px) { 
.h4, h4 { font-size: 1.4rem; }
}

/*  XX-Large devices (larger desktops, 1400px and up)  */
@media (min-width: 1400px) { 

#header {
display:block;
  width: 100%;
  min-height: 260px;
  background-color: rgba(208,228,216,1.0);
  background: url('../../media/header_lsv.jpg') bottom left;
  background-size: 100%;
  position: relative;
  padding: 0;
  background-repeat:no-repeat;
} 

}


/*  XX-Large devices (larger desktops, 1600px and up)  */
@media (min-width: 1600px) { 

#header {
display:block;
  width: 100%;
  min-height: 300px;
  background-color: rgba(208,228,216,1.0);
  background: url('../../media/header_lsv.jpg') bottom left;
  background-size: 100%;
  position: relative;
  padding: 0;
  background-repeat:no-repeat;
} 

}

@media (max-width: 576px) { 

#footer .list-group-horizontal { flex-direction: column; }
.dropdown:hover .dropdown-menu {
display: block;
visibility:visible;
}
.dropdown-menu {
    margin-top: 0px;
}
.navbar .dropdown .dropdown ul {
    top: 0;
    left: calc(100% - 30px);
    visibility: visible;
}
.navbar-mobile .dropdown ul {
position: static;
    display: none;
    margin: 0 0 0 10px;
    padding: 0;
    box-shadow: none;
border:none;
border-radius:0;
}
.navbar a:focus {
font-size: 15px;
padding: 10px 0px;
    color: #3e3e3e;
    transition: 0s;
}
#navbar { padding-top:5px; }
ul#searchnavi { 
position:absolute; 
display:block; 
margin-left:40px; 
margin-top:-16px; 
right:10px; }
.square {
background: #FFF;
}
.navbar-mobile ul#searchnavi { 
position:relative;
}

}