/*
    Created on : 16.06.2026, 10:23:49
    Author     : websm
*/
body.rootpage #Headerouter #Overmenu .onavi-item:first-child a {
  background-color: #fff;
  color: #5a5a5a;
  border-radius: 5px 5px 0 0;
}
#Headerouter {
  font-weight: 700;
  border-top: 10px solid #5a5a5a;
  background: none;
  background-color: #fff;
  /* NEU: gemeinsame graue Leiste fuer Tools + Overmenu.
       inline-flex => die Leiste ist nur so breit wie ihr Inhalt
       und sitzt links, genau wie im Screenshot. */
}
#Headerouter #Toolsbar {
  display: inline-flex;
  align-items: center;
  background: #5a5a5a;
  border-radius: 0 0 5px 5px;
  padding: 0 10px 0 7px;
  /*width: 476px;*/
}
#Headerouter #Tools {
  padding: 5px;
  padding: 0px 5px 5px 5px;
  position: relative;
  /* Hintergrund, eigenes Padding und border-radius entfernt
           -> liegen jetzt auf #Toolsbar */
}
#Headerouter #Tools .icon {
  margin-left: 5px;
  text-decoration: none;
}
#Headerouter #Tools .icon:first-child {
  margin-left: 0px;
}
#Headerouter #Tools #Search {
  width: 21px;
  min-width: 21px;
  background: url(../images/lupe_white.svg) no-repeat center center;
  background-size: 12px;
  padding: 0px;
  height: 20px;
}
#Headerouter #Tools #Search:hover,
#Headerouter #Tools #Search:focus {
  background: url(../images/lupe.svg) no-repeat center center #fff;
  background-size: 12px;
}
#Headerouter #Overmenu {
  margin-left: 10px;
  display: flex;
  align-items: center;
}
#Headerouter #Overmenu .onavi-item {
  margin-right: 10px;
}
#Headerouter #Overmenu .onavi-item:last-child {
  margin-right: 50px;
}
#Headerouter #Overmenu .onavi-item a {
  /*line-height: 35px;*/
  line-height: 25px;
  display: block;
  font-size: 16px;
  color: white;
  /* war @brightgrey - jetzt hell genug fuer den grauen Hintergrund */
  text-decoration: none;
  text-transform: uppercase;
  padding: 5px !important;
  border-radius: 5px 5px 0 0;
  /*border-bottom: 2px solid @grey;*/
}
#Headerouter #Overmenu .onavi-item.active a {
  background-color: #fff;
  color: #5a5a5a;
  /*color: #fff;*/
  border-radius: 5px 5px 0 0;
  /*                    border-top: 2px solid #fff;
                    border-left: 2px solid #fff;
                    border-right: 2px solid #fff;
                    border-bottom: unset;*/
}
#Headerouter #Overmenu .onavi-item.active a:hover {
  /*border-bottom: unset;*/
}
#Headerouter #Overmenu .onavi-item:hover a {
  background-color: #fff;
  color: #5a5a5a;
  /*border-bottom: 2px solid #fff;*/
}
#Headerouter #Header #Logo a {
  width: 211px;
  height: 85px;
}
#Headerouter #Header #Menuouter #Menuinner #Menu #desktopNavi .navi_item .navi-item-inner a {
  text-transform: uppercase;
  line-height: 35px;
}
#Contentouter #Content .startheight {
  height: 10px;
}
#Contentouter #Content #MapWidgetOuter {
  height: 285px;
}
/*
    Social-Media-Sidebar
    Created on : 16.06.2026
*/
/* ============================================================
   DESKTOP: fixe, vertikale Leiste am rechten Bildschirmrand
   ============================================================ */
#SocialSidebar {
  position: fixed;
  top: 25%;
  left: 0;
  transform: translateY(-50%);
  z-index: 1000;
  /* ueber dem Inhalt, ggf. an dein z-index-Schema anpassen */
  background: #5a5a5a;
  border-radius: 0 5px 5px 0;
  /* nur rechts abgerundet, da am linken Rand klebend */
  padding: 5px;
  /* ----------------------------------------------------------
       Pro Icon: Normal-Bild + Hover-/Fokus-Bild austauschen.
       Pfade durch deine eigenen Icons ersetzen.
       ---------------------------------------------------------- */
}
#SocialSidebar ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0px;
}
#SocialSidebar li {
  margin: 0;
  padding: 0;
}
#SocialSidebar a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  /* min. 44x44px Touch-/Klickflaeche (WCAG 2.5.5) */
  height: 30px;
  border-radius: 4px;
  text-decoration: none;
  /* gemeinsame Eigenschaften fuer das Icon-Hintergrundbild;
           das konkrete Bild kommt je Link aus den Regeln weiter unten */
  background-repeat: no-repeat;
  background-position: center;
  background-size: 24px 24px;
  /* nur background-color animieren, NICHT das Bild */
  transition: background-color 0.2s ease;
  /* sichtbarer Fokusrahmen fuer Tastatur-Navigation */
}
#SocialSidebar a:hover {
  background-color: #5a5a5a;
  /* dezent aufhellen beim Hover */
}
#SocialSidebar a:focus-visible {
  background-color: #5a5a5a;
  outline: 2px solid #fff;
  outline-offset: 2px;
}
#SocialSidebar a.social-instagram {
  background-image: url(../images/icons/icon-instagram.svg);
}
#SocialSidebar a.social-instagram:hover,
#SocialSidebar a.social-instagram:focus-visible {
  background-image: url(../images/icons/icon-instagram_invert.svg);
}
#SocialSidebar a.social-facebook {
  background-image: url(../images/icons/icon-facebook.svg);
}
#SocialSidebar a.social-facebook:hover,
#SocialSidebar a.social-facebook:focus-visible {
  background-image: url(../images/icons/icon-facebook_invert.svg);
}
#SocialSidebar a.social-linkedin {
  background-image: url(../images/icons/icon-linkedin.svg);
}
#SocialSidebar a.social-linkedin:hover,
#SocialSidebar a.social-linkedin:focus-visible {
  background-image: url(../images/icons/icon-linkedin_invert.svg);
}
#SocialSidebar a.social-youtube {
  background-image: url(../images/icons/icon-youtube.svg);
}
#SocialSidebar a.social-youtube:hover,
#SocialSidebar a.social-youtube:focus-visible {
  background-image: url(../images/icons/icon-youtube_invert.svg);
}
/* Hilfsklasse: nur fuer Screenreader sichtbar.
   Falls in deinem Projekt schon vorhanden, diesen Block entfernen. */
.visuallyhidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}
/* ============================================================
   MOBILE: statt fix rechts -> horizontale Reihe im Footer
   Breakpoint bitte an deinen Projekt-Breakpoint anpassen.
   ============================================================ */
@media (max-width: 1130px) {
  #SocialSidebar {
    position: static;
    transform: none;
    top: auto;
    right: auto;
    display: block;
    width: fit-content;
    margin: 20px auto 0;
    /* zentriert im Footer */
    border-radius: 5px;
    /* rundum abgerundet, da nicht mehr am Rand */
    padding: 8px;
  }
  #SocialSidebar ul {
    flex-direction: row;
    justify-content: center;
    gap: 10px;
  }
}
/* Bewegungsreduzierung respektieren */
@media (prefers-reduced-motion: reduce) {
  #SocialSidebar a {
    transition: none;
  }
}
.newslist .bx-wrapper .bx-viewport {
  border-radius: 10px;
}
.newslist .bx-wrapper .newslist-item {
  border-radius: 10px;
  /*border-radius: unset;*/
}
.newslist .bx-wrapper .newslist-item .newslist-bg .newslist-content {
  padding: 16px;
  border-top: 4px solid #fff;
  background: #5a5a5a;
  min-height: 63px;
}
.newslist .bx-wrapper .newslist-item .newslist-bg .newslist-content h3,
.newslist .bx-wrapper .newslist-item .newslist-bg .newslist-content .newslist-subtitle {
  color: #fff;
}
.newslist .bx-wrapper .newslist-item .newslist-bg .newslist-content h3 {
  font-size: 18px;
}
.newslist .bx-wrapper .bx-controls {
  display: block;
}
.newslist .bx-wrapper .bx-controls .bx-controls-direction {
  display: none;
}
.newslist .bx-wrapper .bx-controls .bx-controls-direction .bx-next {
  background: url(../images/faderight_grey.svg) no-repeat 12px center rgba(255, 255, 255, 0.6);
  background-size: 18px;
}
.newslist .bx-wrapper .bx-controls .bx-controls-direction .bx-prev {
  background: url(../images/fadeleft_grey.svg) no-repeat 9px center rgba(255, 255, 255, 0.6);
  background-size: 18px;
}
.newslist .bx-wrapper .bx-controls .bx-pager {
  left: unset;
  right: 10px;
  background-color: rgba(255, 255, 255, 0.6);
  border-radius: 5px;
  top: 10px;
  bottom: unset;
  padding: 12px 6px 0 6px;
}
.newslist .bx-wrapper .bx-controls .bx-pager .bx-pager-item a {
  width: 8px;
  height: 8px;
  border-radius: 5px;
  border: 2px solid #5a5a5a;
  box-shadow: none;
  background: #5a5a5a;
  transition: width 0.25s ease;
}
.newslist .bx-wrapper .bx-controls .bx-pager .bx-pager-item a.active {
  background-color: #5a5a5a;
  width: 25px;
}
.newslist .bx-wrapper:hover .bx-controls-direction {
  display: block;
}
#Contentouter #Content #MapWidgetOuter {
  border-radius: 10px;
}
/*.ce-cols2-col {
    width: 49%;
    margin-left: 2%;
    min-height: 1px;
    position: relative;
    &:first-child {
        margin-left: 0;
    }
}*/
.bx-wrapper img {
  width: 100%;
}
#Header #Menuouter #Menu {
  padding-left: 10px;
}
#Header #Menuouter #Menu .navi_item {
  text-transform: uppercase;
  margin-right: 0;
  border-top: 1px solid #fff;
  border-left: 1px solid #fff;
  border-right: 1px solid #fff;
}
#Header #Menuouter #Menu .navi_item .gap {
  width: 230px;
  position: absolute;
  left: 0;
  z-index: 10000;
  border-right: 1px solid #fff;
  height: 10px;
  display: none;
}
#Header #Menuouter #Menu .navi_item:hover {
  box-shadow: none;
  border-top: 1px solid #b9b9b9;
  border-left: 1px solid #b9b9b9;
  border-right: 1px solid #b9b9b9;
  /*background-color: #b9b9b9;*/
}
#Header #Menuouter #Menu .navi_item:hover .navi-item-inner a {
  /*color:#fff;*/
}
#Header #Menuouter #Menu .navi_item:hover .navi-item-inner a:after {
  height: 0px !important;
}
#Header #Menuouter #Menu .navi_item:hover .snavi_item:first-child:active a {
  background: #A0072D !important;
  color: #fff !important;
}
#Header #Menuouter #Menu .navi_item:hover .snavi_block {
  box-shadow: none;
  border: 1px solid #b9b9b9;
  /*                border-bottom: 1px solid #b9b9b9; 
                border-left: 1px solid #b9b9b9; 
                border-right: 1px solid #b9b9b9;*/
  border-top: unset;
  margin-left: -1px;
  /*margin-top: -1px;*/
}
#Header #Menuouter #Menu .navi_item:hover .snavi_block .snavi_item.active a {
  background: #A0072D !important;
  color: #fff !important;
}
#Header #Menuouter #Menu .navi_item:hover .gap {
  display: block;
}
#Header #Menuouter #Menu .navi_item a {
  font-size: 16px;
  padding: 0 10px;
}
#Header #Menuouter #Menu .navi_item #navi_item-inner-15 a {
  height: 35px;
  color: #5a5a5a;
  font-size: 16px;
  background: none;
  width: auto;
}
#Header #Menuouter #Menu .navi_item.active {
  border-radius: 5px 5px 0 0;
  box-sizing: border-box;
  background: #A0072D;
  /*box-shadow: 0 0px 3px #939598;*/
  box-shadow: none;
}
#Header #Menuouter #Menu .navi_item.active .navi-item-inner a {
  color: #fff;
}
#Header #Menuouter #Menu .navi_item.active .snavi_block .snavi_item.active a {
  background: #A0072D;
  color: #fff !important;
}
#Header #Menuouter #Menu .navi_item.active #navi_item-inner-15 a {
  color: #fff;
}
#Header #Menuouter #Menu .navi_item.active:hover {
  background: #fff;
}
#Header #Menuouter #Menu .navi_item.active:hover a {
  color: #5a5a5a !important;
}
#Header #Menuouter #Menu .navi_item .snavi_block .snavi_item {
  text-transform: none;
}
#Header #Menuouter #Menu .navi_item .snavi_block .snavi_item:active {
  /*border-top: unset;*/
  /*margin-top: 10px;*/
}
#Header #Menuouter #Menu .navi_item .snavi_block .snavi_item:active:first-child a {
  background: #A0072D !important;
  color: #fff !important;
}
#Header #Menuouter #Menu .navi_item .snavi_block .snavi_item a {
  font-weight: 600;
}
#Header #Menuouter #Menu .navi_item .snavi_block .snavi_item.active {
  background: #A0072D;
}
#Header #Menuouter #Menu .navi_item:first-child a {
  /*padding-left: 20px;*/
}
.ce-cols2-col {
  width: 49%;
  margin-left: 2%;
}
@media (max-width: 768px) {
  #Headerouter {
    border: none;
  }
  #Headerouter #Top {
    top: 0;
  }
  #Headerouter #Top #Toolsbar #Overmenu {
    display: none;
  }
  #Headerouter #Top #Toolsbar #Overmenu .onavi-item a {
    font-size: 13px;
  }
  #Headerouter #Top #Toolsbar #Tools .icon {
    color: #fff;
    border-color: #fff;
  }
  #Headerouter #Top #Toolsbar #Tools #Search {
    background-image: url(../images/lupe-weiss.svg);
  }
  #Headerouter #Header #Logo a {
    width: 100px;
    height: 50px;
  }
  .newslist .bx-wrapper .newslist-item .newslist-bg .newslist-content {
    min-height: 24px;
  }
  .newslist .bx-wrapper .bx-controls .bx-pager {
    /*background-color: rgba(255, 255, 255, 0.2);*/
    display: none;
  }
  .newslist .bx-wrapper .bx-controls .bx-controls-direction {
    display: block;
  }
  .newslist .bx-wrapper .bx-controls .bx-controls-direction .bx-prev {
    left: 0px;
    background-position: center center;
    background-size: 12px;
    border-radius: 0px 5px 5px 0;
    /*background-color: rgba(255, 255, 255, 0.2);*/
  }
  .newslist .bx-wrapper .bx-controls .bx-controls-direction .bx-next {
    right: 0px;
    background-position: center center;
    background-size: 12px;
    border-radius: 5px 0px 0px 5px;
    /*background-color: rgba(255, 255, 255, 0.2);*/
  }
  #Contentouter #Content .startheight {
    height: 37px;
  }
  .ce-cols2-col {
    width: 100%;
    margin-left: 0;
  }
  #Header #Menuouter #Menu {
    padding-left: 0px;
  }
  #Header #Menuouter #Menu .navi_item .navi-item-inner > a {
    padding: 0 10px 0 15px !important;
  }
  #Header #Menuouter #Menu .navi_item .snavi_block .snavi_item > a {
    padding-left: 25px !important;
  }
  #Header #Menuouter #Menu .navi_item .snavi_block .snavi_item.hassub:before {
    left: 13px !important;
  }
}