body{font-family: futura-pt, sans-serif;}
.clearfix::after {
  display: block;
  clear: both;
  content: "";
}
 /*Links und Buttons*/
 a{color:#2a3677; text-decoration: underline;}
.fc-blau{color: #2a3677!important;}
.btn-white, .btn-white:hover{color: white; text-decoration: underline; font-weight: bold;float: right;}
.btn-white:after{content: "\F285"; text-decoration:none; color: white; font-family: "bootstrap-icons";}
.btn-blau{border-radius: 0; width: 100%;background-color: #2a3677; color: white; text-decoration: none; padding: 8px 10px; font-weight: bold; text-transform: uppercase;}
.btn-blau:hover{text-decoration: underline; background-color: #2a3677; color: white;}
.btn-hellblau{border-radius: 0; width: 100%;background-color: #4477ba; color: white; text-decoration: none; padding: 8px 10px; font-weight: bold; text-transform: uppercase; text-align:left;}
.btn-hellblau:hover{text-decoration: underline; background-color: #4477ba; color: white;}
.btn-gruen{background-color: #c0ce3b; border-radius: 0px; text-transform: uppercase;}
.btn-gruen:hover{background-color: #c0ce3b; border-radius: 0px; text-transform: uppercase; text-decoration: underline;}
a.glightbox{text-decoration: none;}
a.footer-link{color: white; text-decoration: none; font-weight: bold; text-transform: uppercase;}
a.footer-link:hover{text-decoration: underline; color: white;}
.carousel-control-prev-icon, .carousel-control-next-icon {background-color:#2a3677; }
.carousel-item {
  transition: transform 1.5s ease-in-out;
}
.btn-outline-primary {border-color: #2a3677!important; color: #2a3677!important;}
.btn-outline-primary:focus, .btn-outline-primary:hover, .btn-outline-primary:active{background-color: #2a3677!important; color: white!important;}



.list-group-item-action{color: #213677; text-decoration: underline;}
.list-group-item-action:not(.active):focus, .list-group-item-action:not(.active):focus a, .list-group-item-action:not(.active):hover, .list-group-item-action:not(.active):hover a { background-color: #e9ecef; text-decoration: underline;}

.eintrag{padding-top: 8px; padding-bottom: 8px; border-bottom: 1px solid #e9ecef; padding-left: 5px;}
.eintrag:hover{background-color:#e9ecef;}

span#calendarIcon {
    background-color: #f8f9fa;
    padding: 9px;
    line-height: normal;
    height: fit-content;
}

.social-btn {
      width: min(18vw, 70px);
      height: min(18vw, 70px);
      background: white;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      border: none;
      transition: transform .2s ease;}

    .social-btn i {
      font-size: min(10vw, 32px);
      color: #4477ba; /* Icon-Farbe – kann transparent simuliert werden */
      opacity: 0.85; /* wirkt “transparenter” */
    }
.social-img { width: min(18vw, 70px); height: min(18vw, 70px); margin-top: -15px;}
.social-btn:hover, .social-img:hover {transform: scale(1.08);}


a[role="button"].btn.btn-info.more.btn-block, button.btn.btn-info.more.btn-block{ background-color: #4477ba;border: none; color: white;}
a[role="button"].btn.btn-info.more.btn-block, button.btn.btn-info.more.btn-block::after{
 content:'';
 background-image: url("data:image/svg+xml,<svg viewBox='0 0 16 16' fill='%23fff' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708' clip-rule='evenodd'/></svg>");
background-repeat: no-repeat;
         background-position: center center;
         background-size: cover;
  display: inline-flex;
         height: 20px;
         width: 20px;
float: inline-end;
         }
.buttonlink{text-decoration: none!important;}
a button.more{font-weight: bold; text-decoration: underline;}

/*Kontaktzeiten*/
  #definition_list dt, #definition_list dd{font-weight: normal; margin-bottom: 0px!important; padding-bottom: 3px; padding-top: 3px;}
  #definition_list dl:hover{background-color: #ececec;}
dl.row.opening-hours {
    margin: 0px;
    padding: 9px 0 0 0;
}


/*Hintergründe*/
.gradient-bar { width: 100%; height: 20px; background: linear-gradient(to right, #5da4dc, #bccc3a);}
.bg-hellgrau{background-color: #f8f9fa;}
.bg-hellblau{background-color: #4477ba;}
.bg-blau{background-color: #2a3677;}

.event-list p:nth-child(odd) {
    background-color: #ffffff; /* weiß */
}

.event-list p:nth-child(even) {
    background-color: #f8f9fa; /* hellgrau (Bootstrap-light-gray) */
}

.search-item {
    margin-top: 20px;
    margin-bottom: 20px;
    background-color: #f8f9fa;
    padding: 10px;
}
.card-hover:hover{background-color: #f8f9fa;}



/*Überschriften*/
h2, .h2-title{text-transform: uppercase; color:#2a3677; font-weight: bold; font-size: 18px; border-bottom: 1px solid #2a3677; overflow: hidden; display:block;}
h3{font-weight: bold; font-size: 18px;}
h4{font-size: 16px;}
h5{font-size: 16px;}
.h1{text-transform: uppercase; color: #2a3677; font-weight: bold; font-size: 25px; padding-bottom: 20px;}
.h2{text-transform: uppercase; color: white;  font-size: 18px; border-bottom: none;}
.h3{text-transform: uppercase; font-weight: bold; font-size: 18px;}
.h4{text-transform: uppercase; color: #808080; font-weight: bold;}
.h5{text-transform: uppercase; color:#2a3677; font-weight: bold; font-size: 18px;}
.h6{color:#2a3677; font-weight: bold;}
.divider{background-color: none; border-top: 1px solid #2a3677; margin-top: 5px; opacity: 1;}
.break-word {
  word-break: break-word;      /* alte, aber kompatible Variante */
  overflow-wrap: break-word;   /* moderne Variante */
}

/*NAVIGATION*/
.navbar{padding-top: 0px; padding-bottom: 0px;}
li.nav-item a.nav-link{color: #2a3677; text-transform: uppercase;  margin-right: 25px; font-weight: bold;}
li.nav-item a.nav-link:hover, li.nav-item a.nav-link.active, li.nav-item a.nav-link.show{color: #FFFFFF; text-transform: uppercase; font-weight: bold; background-color: #2a3677;}


    
/* Mega Menu Dropdown */
.dropdown-menu.mega-menu {border: none; padding: 2rem 1rem; background-color: #2a3677; color: white; border-radius: 0; overflow-y: auto;}
.dropdown-menu .headermenu{text-transform: uppercase; text-decoration: underline; margin-top: 10px;}
.dropdown-menu .dropdown-item{color: white;}
.dropdown-menu .dropdown-item:hover{background-color: #FFFFFF; color: #2a3677;}
.dropdown-menu .dropdown-item:focus{background-color: #FFFFFF; color: #2a3677;}
.mega-menu-content {max-height: 620px;}
.navbar-expand .navbar-nav .dropdown-menu {position: absolute;top: 37px;}
ul.list-circle{list-style-type: circle;}

/*Burger Menü*/
.navbar-toggler{border: none!important; color: #2a3677;}
/* Mobile Offcanvas Fullscreen */
.offcanvas-start {width: 100%;}
.offcanvas {background-color: #2a3677!important; color: white;}
.offcanvas-opacity{background-color: rgba(42, 54, 119, 0.9)!important;}
.offcanvas-body ul li{padding-bottom: 10px;}
.offcanvas-body ul li a:focus{background-color: white; color: #2a3677;}
.collapse .border-bottom{border-bottom: 1px solid white;}
.text-start{font-weight: bold; color: white;}
.text-second{font-weight: normal; color: white; padding-left:10px; margin-bottom: 10px; text-decoration: none;}
.text-tertiary{font-weight: normal; color: white; padding-left: 10px; text-decoration: none;}
.text-fourth{font-weight: normal; color: black; padding-left: 10px; text-decoration: none; text-align: start;}


/*Suche*/
.form-control{border-radius: 0;}
.btn{border-radius: 0;}

/*SIDELINKS*/
.floating-buttons {position: fixed;top: 50%;right: 0px;transform: translateY(-50%);display: flex;flex-direction: column; gap: 8px;z-index: 999;align-items: flex-end;}
.floating-buttons .btn {border: none; border-radius: 0px; height: 48px; width: 48px;padding: 10px 12px 0px 12px;color: #fff;position: relative;overflow: hidden;transition: width 0.3s ease;align-items: center;justify-content: center;box-shadow: 0 6px 18px rgba(0,0,0,0.12);background-color: #2a3677;}
.phone-btn.expanded {width: 220px; justify-content: flex-start; padding-left: 12px;}
.floating-buttons img { width: 30px; height: auto; flex-shrink: 0;}
.phone-text {margin-left: 10px;white-space: nowrap;opacity: 0;transition: opacity 0.2s ease;color: #fff; font-weight: bold; font-size: 16px;}
.phone-btn.expanded .phone-text { opacity: 1;}
.floating-buttons .btn:focus {outline: 3px solid rgba(13,110,253,0.3); outline-offset: 2px;}

/*HEADERBILD und grüne Buttons*/
.header-image-container { position: relative; display: inline-block;width: 100%; }
.header-image-container img{  height: 100px;}
.header-image-container.start img{height: 250px;}
.header-buttons, .header-buttons-start {position: absolute; display: flex; gap: 1rem; bottom: -20px;}
.header-buttons a, .header-buttons-start a{ display: flex; justify-content: center;   align-items: center;  }
.header-buttons a:focus, .header-buttons-start a:focus{background-color: #2a3677; color: white;}
.header-spacer { height: 30px;}
.header-buttons-start .dropdown-menu a, .header-buttons .dropdown-menu a{ display: block; justify-content: left; align-items: left; color: white;}

.header-image {
  width: 100%;
  height: 80vh;
  overflow: hidden;
}

.header-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}


/* CARD = Aktuelles Startseite */
.card.border-top{border-top: 20px solid #4477ba!important;}
.card{border-left: 1px solid grey; border-right: 1px solid grey; border-radius: 0px;}
.card .card-img-top{border-radius: 0px;}
.card .card-title{font-size: 18px; font-weight: bold;}
.card .card-text{font-size: 16px;}
.card .card-footer{border-radius: 0px; padding-top: 0px; padding-bottom: 0px;}

/*BIG Button = Auf einen Blick Startseite 
.big-button{border: none; width: 100%; background-color: #4477ba; padding: 30px; transition: transform .2s; color: white; text-transform: uppercase; margin: 0 0px 20px 0; font-size: 18px; font-weight: bold; text-decoration: none;}
.big-button a{text-decoration: none; color:white!important;}
.big-button:hover{background-color: #2a3677; transform: scale(1.05);  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); color: white;}
.big-button:hover a{color: white; text-decoration: none;}
.big-button img{height: 80px;}  */

/*neue Buttons*/
.big-button_2 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 100%;
  min-height: 180px;          /* Einheitliche Höhe */
  padding: 1rem;
  text-align: center;
  text-decoration: none;
  border: none;
  background-color: #4477ba;
  color: #FFFFFF;
  text-transform: uppercase;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.big-button_2 img {
  max-height: 80px;
  margin-bottom: 0.75rem;
}

.big-button_2 span {
  font-weight: 600;
}

.big-button_2:hover,
.big-button_2:focus-visible {
  background-color: #2a3677; transform: scale(1.05);  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); color: white;
}


/* Mobile */ 
@media (max-width: 576px) {
  .big-button_2 {
    min-height: 150px;
  }
}



/*Ende neue Buttons*/

/*CAROUSEL = Logos auf der Startseite*/
.carousel-control-next, .carousel-control-prev {width: 5%!important;}
.carousel-control-next i, .carousel-control-prev i{color:#2a3677;}
.logo-item {display: flex;flex-direction: column;align-items: center;justify-content: center;padding: 1rem;text-align: center;opacity: .8;}
.logo-item:hover{ opacity: 1;}
.logo-item img {max-width: 100%;object-fit: contain;margin-bottom: 0.5rem;}
.logo-caption {color: #808080;font-weight: bold;text-transform: uppercase;}
#logoCarousel .carousel-item{border: none;}

/*BREADCRUMBS*/    
li.breadcrumb-item a{font-size: 14px; text-decoration: underline;}
li.breadcrumb-item.active{font-size: 14px; text-decoration: none;}


/*Akkordeon*/
.accordion{--bs-accordion-border-radius: 0px!important;}
.accordion-item:first-of-type>.accordion-header .accordion-button{border-top-left-radius: 0px;border-top-right-radius: 0px;}
.accordion-button:not(.collapsed){background-color: #4477ba; color: white;}
.accordion strong[role=button] {display: block; border-bottom: 1px solid #2a3677; margin: 20px 10px;}
.accordion strong[role=button]:not(.collapsed)::after {}
.accordion strong[role=button]::after {content: '';
 background-image: url("data:image/svg+xml,<svg viewBox='0 0 16 16' fill='%23333' xmlns='http://www.w3.org/2000/svg'><path 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-.708' clip-rule='evenodd'/></svg>");
background-repeat: no-repeat;
         background-position: center center;
         background-size: cover;
         display: inline-flex;
         height: 20px;
         width: 20px;
float: inline-end;
}
.accordion-header {
    margin-bottom: 0;
    border-bottom: none;
}

/*Unternavigation Folgeseite */
#sidebar .navbar { background-color: #357ABD;}
#sidebar .navbar-nav .nav-link {color: #fff;}
#sidebar .navbar-nav .nav-link:hover {text-decoration: underline;}
#sidebar .submenu {list-style-type: disc;padding-left: 1.5rem;}
#sidebar .submenu li {margin-bottom: 5px; padding: 3px 0 3px 0;}
#sidebar .submenu a {color: #fff;text-decoration: none;}
#sidebar .submenu a:hover {text-decoration: underline;}

#sidebar .sub-navbar-nav {list-style-type: none; margin: 5px; padding: 0px; width: 100%;}
#sidebar .sub-nav-item{color: white; border-bottom: 1px solid white; padding: 5px 0 5px 0;}

#sidebar .collapse-toggle::after {content: "+";float: right;}
#sidebar .collapse.show + .collapse-toggle::after,
#sidebar .collapse-toggle[aria-expanded="true"]::after {content: "-";}


.sidepanel  {width: 0; position: fixed; z-index: 1060; height: 100%; top: 0; left: 0; background-color: #2a3677; overflow-x: hidden; transition: 0.5s; padding-top: 20px; color: white;}
.sidepanel a {padding: 8px; text-decoration: none; color: white; display: block; transition: 0.3s;}
.sidepanel a:hover {color: #f1f1f1;}
.sidepanel .closebtn {position: absolute; top: 0; right: 25px; font-size: 36px;}

.openbtn {font-size: 20px;cursor: pointer;background-color: #2a3677;color: white;padding: 10px 15px;border: none;}
.openbtn:hover {background-color:#444;}
a.nav-link.active, a.nav-link.collapse-toggle.active{font-weight: bold;}
#sidebar .submenu a.active{font-weight: bold;}
.sub-navbar-nav .sub-nav-item a.nav-link {display: inline-block; max-width: 90%;}
.sub-navbar-nav .sub-nav-item a.nav-link.dropdown-toggle{float: right;text-align: right; display: inline;}

/*KALENDER*/
.PageBrowser{margin-top: 50px;  border-bottom: 1px solid #2a3677;margin-bottom: 30px;overflow: hidden;    clear: both;}
/*.PageNumber{float: left;}*/
.PageNumber ul { list-style-type: none;margin: 0px;padding: 0;}
.PageNumber li {list-style-type: none; float: left; margin-right: 15px;}

.veranstaltungenNewsRoom {  margin-bottom: 20px; clear: both;}
.veranstaltungenNewsRoom a{font-weight: bold;}

/*Navigation im Content*/
.listenElement ul{padding-left: 0px;}
.listenElement li { list-style-type: none; border-bottom: #2a3677 solid 1px;}
.listenElement { margin-bottom: 30px; overflow: hidden;}
.listenElement button.btn.btn-info.more.btn-block{
background-color: #ffffff; width: 100%; text-align: left; color: #4477ba;
background-image: url("data:image/svg+xml,<svg viewBox='0 0 16 16' fill='%234477ba' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708' clip-rule='evenodd'/></svg>");
background-repeat: no-repeat;
background-position: center right;
background-size: 20px 20px;
}
.listenElement button.btn.btn-info.more.btn-block:hover{
background-color: #4477ba; width: 100%; text-align: left; color: #FFFFFF;
background-image: url("data:image/svg+xml,<svg viewBox='0 0 16 16' fill='%234477ba' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708' clip-rule='evenodd'/></svg>");
background-repeat: no-repeat;
background-position: center right;
background-size: 20px 20px;
}
.weitereangaben {
    display: none;
}
.titel {
    display: none;
}

form .form-control{margin-bottom: 10px;}
form .btn-primary {
    background-color: #4477ba;
    border-color: #4477ba;
    padding-left: 10px;
font-weight: bold;
margin-top:30px;
}

.radio-inline, .checkbox-inline {
    position: relative;
    display: inline-block;
    padding-left: 20px;
    margin-bottom: 0;
    font-weight: normal;
    vertical-align: middle;
    cursor: pointer;
}
.teaser {margin-bottom: 30px;}

.table2Columns, .table4Columns {
    margin-bottom: 30px;
    padding-bottom: 30px;
    border-bottom: 1px solid #2a3677;
}

.table2Columns table, .table4Columns table {
    width: 100%;
}

.table2Columns td {
    width: 50%;
    line-height: 1.7rem;
    vertical-align: top;
    padding-top: 0;
}

.table2Columns td a{text-decoration: none;}

.carousel{width: 100%;}
.carousel-item{border: none;}
.carousel-caption{position: static; background-color: #e2e3e5; padding: 5px; text-align: left; color:#2a3677; }


/*TABELLEN im CONTENT*/
.content-table thead th{color: #2a3677!important;}
.content-table table{min-width: 700px;   caption-side: top;}
.content-table caption {color: black; }
.content-table .w-20{width: 20%;}
.content-table .w-30{width: 30%;}

figcaption.content-caption{background-color: #e2e3e5; padding:5px; max-width: 350px;}

#content ul{overflow: hidden;}

@media (min-width: 992px) {


.carousel{width: 75%;}

  .h1{text-transform: uppercase; color: #2a3677; font-weight: bold; font-size: 32px; padding-bottom: 20px;}
  .bg-logo{background-image:url("https://www.ostalbkreis.de/sixcms/media.php/18/Logo-transparent.179349.png"); background-position: left; background-repeat: no-repeat; }



  /*NAVIGATION*/
  .dropdown-menu.mega-menu {margin-top: -1px;margin-left: 0px;left: 50%;transform: translateX(-50%);width: 100%;max-width: 1330px;}
  .mega-menu-content { display: flex;}
  .sidenav .btn{margin: 0px 0 0 20px;}
  #openBtn{ margin-bottom: 8px;}

  /*HEADERBILD und grüne Buttons*/
  .header-buttons {right: -15%;transform: translateX(-50%);}
  .header-buttons-start{right: 0; transform: translateX(-50%);}
  .header-image-container img, .header-image-container.start img { height: auto;}
  .header-buttons .btn, .header-buttons-start .btn {padding: 0.75rem 1.5rem;}
  .header-spacer { height: 60px;}


button.btn.btn-info.more.btn-block {
    display: block;
    width: 100%;
}

  /*BIG Button = Auf einen Blick Startseite 
  .big-button{width: 32%;}
  .big-button{margin: 0 20px 20px 0;}
  .big-button:nth-child(3n+3){margin-right: 0px!important;}*/
  
  /*Unternavigation Folgeseite */
  #sidebar .navbar { background-color: #357ABD;}
  #sidebar .navbar-nav .nav-link {color: #fff;}
  #sidebar .navbar-nav .nav-link:hover {text-decoration: underline;}
  #sidebar .submenu {list-style-type: disc;padding-left: 1.1rem;}
#sidebar .submenu li::before{content:"\F309"; font-family: "bootstrap-icons";
  font-style: normal; position: absolute; left: -15px; top: 3px;}  
#sidebar .submenu li {margin-bottom: 5px; padding: 3px 0 3px 0; /*display: inline-block;*/ list-style: none; position: relative; }
  #sidebar .submenu a {color: #fff;text-decoration: none;}
  #sidebar .submenu a:hover {text-decoration: underline;}
  #sidebar .submenu a:focus{background-color: white; color: #2a3677;}

  #sidebar .sub-navbar-nav {list-style-type: none; margin: 5px; padding: 0px; width: 100%;}
  #sidebar .sub-nav-item{color: white; border-bottom: 1px solid white; padding: 5px 0 5px 0;}

  ul.social-area li a img{width: 100%}
.social-img {
    margin-top:-15px;
    }

.first-td{width: 200px;}

}