/*****************************************************************************************************
* Section CSS
******************************************************************************************************/

/*
Site Header
---------------------------------------------------------------------------------------------------- */

/* Site Header Containers
--------------------------------------------- */

.site-header {
  background: #222;
  background: var(--theme1-background-def);
  height: 60px;
  min-width: 280px;
  position: fixed;
  transition: all 200ms;
  width: 100%;
  z-index: 5;
}

.site-header .wrap {
  display: flex;
  height: 100%;
  justify-content: space-between;
    /* Positioning context for absolutely positioned header elements,
    such as the mobile menu toggle and search trigger. */
    position: relative;
}

.site-header .wrap::before,
.site-header .wrap::after {
  display: none;
}

@media screen and (min-width: 1001px/*mobileMenuMinWidth*/) {

  /* Logo row above, menu row below. The header sticks with the menu row in
   view: its negative top is the height of the logo row (.title-area), 32px
   less with the admin bar. */
  .site-header {
    border-bottom: 1px solid var(--body-background-dk2);
    height: auto;
    position: sticky;
      top: -112px;
  }

  .admin-bar .site-header {
    top: -80px;
  }

  .site-header > .wrap {
    flex-flow: row wrap;
  }

  .bub-scrolled .site-header {
    box-shadow: 0 6px 10px -8px rgba(27,26,24,.3);
  }

  /* Keep anchor targets clear of the sticky menu row. */
  * {
    scroll-margin-top: 90px;
  }
}

@media screen and (max-width: 1000px/*mobileMenuMaxWidth*/) {

  .site-header {
    position: relative;
  }

  .site-header .wrap {
    display: block;
  }

  /* Keep anchor targets clear of the floating menu toggle. */
  * {
    scroll-margin-top: 100px;
  }
}


/* Site Title / Logo
--------------------------------------------- */

.title-area,
.site-title,
.site-title a {
  height: 100%;
}

.site-title {
  margin: 0;
  line-height: 1;
}


.site-title a {
  display: flex;
  flex-flow: column nowrap;
  font-family: 'Georgia', serif;
  font-size: 1.9rem;
  justify-content: center;
  line-height: 1;
  letter-spacing: 2px;
  padding: 0 20px;
  padding-top: 2px;
  text-decoration: none;
  /* text-shadow: 1px 1px 12px rgba(255,255,255,0.25); */
  text-transform: uppercase;
}

.site-title a,
.site-title a:focus {
  color: var(--theme1-color-def);
}

.site-title img {
  width: 100%;
  height: auto;
}

@media screen and (min-width: 1001px/*mobileMenuMinWidth*/) {

  /* The logo row: 30px above the logo and 17px below it, 112px in all, which
   the header's negative top repeats. The logo is 340px wide, where the
   capitals of its claim are 8px high. */
  .title-area {
    flex: 0 0 100%;
    height: 112px;
    padding-top: 30px;
  }

  .site-title,
  .site-title a {
    height: auto;
  }

  .site-title a {
    width: 380px;
  }
}

@media screen and (max-width: 1000px/*mobileMenuMaxWidth*/) {

  .site-title a {
    /* background: url( '../media/brand/logo-mobile.svg' ) no-repeat; */
    /* background-position: 20px 10px; */
    /* background-size: 40px; */
    margin-left: -5px;
    /* top: 3px; */
    /* Narrower below 300px only: the magnifier starts 83px from the right
     edge, and the image, inside the 20px padding, ends 32px before it (user,
     2026-10-18; it shrank below 320px before the icons moved right). */
    width: 210px;
    max-width: calc(100% - 90px);
  }

  /* The wordmark without the claim: the image shows its upper part only. */
  .site-title img {
    /* display: none; */
    aspect-ratio: 638 / 72;
    object-fit: cover;
    object-position: top;
  }
}


/* Search Form
--------------------------------------------- */

/* The field at the end of the menu row on desktop, from
   bubdev_add_header_search_form() in core/includes/section.php. It takes the
   place of the menu's search trigger there. Phones keep that trigger, which
   opens the search modal. */

.bub-header-search {
  display: none;
}

@media screen and (min-width: 1001px/*mobileMenuMinWidth*/) {

  .bub-header-search {
    align-items: center;
    display: flex;
    flex: 0 0 340px;
    height: 56px;
    padding: 0 20px;
  }

  .nav-primary .bub-desktop-search-trigger {
    display: none;
  }

  .bub-header-search .search-form {
    overflow: visible;
    position: relative;
    width: 100%;
  }

  .bub-header-search input[type="search"] {
    background: transparent;
    border: none;
    border-bottom: 1px solid var(--body-color-def);
    border-radius: 0;
    box-shadow: none;
    color: var(--body-color-def);
    font-size: 15px;
    padding: 6px 30px 6px 0;
    width: 100%;
  }

  .bub-header-search input[type="submit"] {
    background: url('../media/icons/ic-magnifier-slim-dark.svg') no-repeat center;
    background-size: 15px;
    border: none;
    cursor: pointer;
    height: 30px;
    overflow: hidden;
    padding: 0;
    position: absolute;
      top: 50%;
      right: 0;
    text-indent: -99999px;
    transform: translateY(-50%);
    width: 30px;
  }

  /* The live search results under the field, as in the search modal
   (plugin.css): the plugin sets left and top from the field's offset on
   the page. */
  .bub-header-search .relevanssi-live-search-results {
    left: 0 !important;
    top: calc(100% + 5px) !important;
  }
}

/* Narrower up to 1200px, so the menu row keeps clear of it
   (menus-desktop.css). */

@media screen and (min-width: 1001px/*mobileMenuMinWidth*/) and (max-width: 1200px) {

  .bub-header-search {
    flex-basis: 260px;
  }
}


/* Site Description
--------------------------------------------- */


/*
Content Area: Default Content
---------------------------------------------------------------------------------------------------- */

/* Entry
--------------------------------------------- */

.entry {
}


/* Entry Header
--------------------------------------------- */

.entry-header {
  margin: 0 0 15px;
}


/* Entry Meta
--------------------------------------------- */

.entry-meta {
  font-size: 13px;
}

.entry-header .entry-meta {
  display: table;
  font-size: 13px;
  margin-bottom: 15px;
}


/* Entry Content
--------------------------------------------- */

.archive .content .entry,
.home .content .entry,
.page-template-page_blog-php .content .entry {
  /*border-bottom: 10px solid transparent;*/
}

.entry-content .attachment a,
.entry-content .gallery a {
  border: none;
}

.entry-content ol,
.entry-content p,
.entry-content ul,
.quote-caption {
  margin-bottom: 0.75em;
}

.entry-content p img {
  margin-bottom: 0;
}

.entry-content ol,
.entry-content ul {
  margin-left: 1px;
  margin-top: 0;
}

.entry-content ol > li {
  list-style-type: decimal;
}

.entry-content ul > li {
  /* list-style-type: square; */
}

.entry-content ol ol,
.entry-content ul ul {
  margin-bottom: 0;
}


/* Entry Comments
--------------------------------------------- */

.entry-comments-link::before {
  content: "\2014";
  margin: 0 6px 0 2px;
}

.entry-categories,
.entry-tags {
  display: block;
}

@media screen and (max-width: 500px) {

  .entry-content p {
  -webkit-columns: auto auto;
          columns: auto auto;
    min-width: 0;
  }
}


/* After Entry
--------------------------------------------- */

.after-entry {
  border-bottom: 1px solid #222;
  border-top: 2px solid #222;
  margin-top: 40px;
  padding: 30px 0;
}

.after-entry p:last-child {
  margin-bottom: 0;
}

.after-entry .widget {
  margin-bottom: 30px;
}

.after-entry .widget:last-child {
  margin-bottom: 0;
}


/*
Content Area: Special Content
---------------------------------------------------------------------------------------------------- */

/* No-Posts Content
--------------------------------------------- */

/* Note:
Applies to 404, search-no-results and empty archives. */

/* Page Titles */

.error404 .entry-title,
.search-no-results .archive-title {
  text-align: center;
}

/* General: Content */

.bub-noresult__content {
  margin: 0 auto;
  max-width: 40em;
  text-align: center;
}

/* Search Page: Content */

.search .bub-noresult {
  font-size: .9rem;
  margin: 0 auto;
  max-width: 640px;
}

.search .bub-noresult__content {
  background: var(--theme1-background-def);
  color: var(--theme1-color-def);
  padding: 22px;
}

.search .bub-noresult__message p {
  margin-left: 3px;
}

.search .bub-noresult__search-form input {
  background: #fff;
}

.search .bub-noresult__search-form input[type="submit"] {
  display: none;
}

.search .bub-noresult__menu ul {
  display: flex;
  flex-flow: row wrap;
  margin: 5px -5px -5px -5px;
  padding: 0 !important;
}

.search .bub-noresult__menu li {
  background: var(--theme1-background-def);
  flex: 1 0 auto;
  list-style-type: none;
  margin: 5px;
  white-space: nowrap;
}

.search .bub-noresult__menu .menu-overview a {
  color: var(--theme1-color-def);
  display: flex;
  padding: 11px 40px 10px 20px;
  text-decoration: none;
}

.search .bub-noresult__menu .menu-overview a:hover {
  filter: brightness(125%);
}

@media screen and (max-width: 500px) {

  .search .bub-noresult__content {
    padding: 10px;
  }
}

/* FacetWP Template: Content */

.facetwp-template .bub-noresult {
  padding: 30px 20px 0;
}

.facetwp-template .entry.bub-noresult__spacer {
  /* Empty 'entry' element prevents masonry container
  height zero and allows for bottom spacing. */
  display: block !important;
  height: 30px !important;
  position: static !important;
  visibility: hidden;
  width: 100% !important;
}


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

/* Before/After Sidebar Widget Areas
--------------------------------------------- */

/* Custom Post/Archive Banners and Images (Field) */

.bub-custom-banner-item {
  margin-bottom: 10px;
}


/*
Bottom Section
---------------------------------------------------------------------------------------------------- */

/* Containers */

.bub-bottom-section {
  background: var(--body-background-lt1);
  background: var(--body-background-dk1);
  border-top: 1px solid var(--body-background-dk2);
  margin: 40px auto 0;
  padding: 60px 0 60px;
  position: relative;
  width: 100%;
}

.page-section .bub-bottom-section {
  margin-top: 0;
}

.bub-bottom-section > .wrap {
  /*position: relative;*/
}

.bub-bottom-section__content {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  /*margin: -30px;*/
}

/* Areas: Common  */

.bub-bottom-section__area,
.bub-bottom-section__separator {
  /*margin: 30px;*/
}

.bub-bottom-section__area {
  flex: 1 1 auto;
  max-width: 350px;
}

.bub-bottom-section__area p:last-child {
  margin-bottom: 0;
}

.bub-bottom-section__area a[href*="/maps/"] {
  border: 1px solid #444;
  display: table;
  font-size: 12px;
  font-style: italic;
  line-height: 1;
  margin: 10px 0 -5px 0;
  padding: 6px 9px;
  text-decoration: none;
}

.bub-bottom-section__area a[href*="/maps/"]:hover {
  border-color: currentColor;
  color: #666;
}

/* Text Areas */

.bub-bottom-section__area-1,
.bub-bottom-section__area-2 {
  font-size: 0.95rem;
  margin-right: 30px;
}

.bub-bottom-section__area-2 a {
  text-decoration: underline;
}

/* The wordmark above the first text area: the logo cropped to its upper
   part, as on phones in the header. */
.bub-bottom-section__area-1::before {
  background: url('../media/brand/logo-default.svg') no-repeat top left;
  background-size: 220px auto;
  content: '';
  display: block;
  height: 25px;
  margin-bottom: 22px;
  width: 220px;
}

/* Menu Area: Link Columns */

/* A top-level item with children heads a column, such as "Programm", and
   its children are the links; a top-level item without children is a link
   of its own. */

.bub-bottom-section__area-3 {
  max-width: none;
}

.bub-bottom-section .nav-bottom {
  margin: 0px 0 0 auto;
}

.bub-bottom-section .menu-bottom {
  display: flex;
  flex-flow: row wrap;
  gap: 20px 70px;
  margin: 0;
  padding: 0;
}

.bub-bottom-section .menu-bottom .menu-item {
  list-style-type: none;
}

.bub-bottom-section .menu-bottom .sub-menu {
  margin: 0;
  padding: 0;
}

.bub-bottom-section .menu-item a {
  display: block;
  font-size: 1rem;
  padding: 4px 0;
  text-decoration: none;
  transition: all 200ms;
}

.bub-bottom-section .menu-bottom > .menu-item-has-children > a {
  color: var(--body-color-acc);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.2em;
  margin-bottom: 10px;
  text-transform: uppercase;
}

.bub-bottom-section .menu-item.bub a {
  /* background: linear-gradient( to right, rgba(var(--brandBub-color-def),0.5), rgba(var(--brandBub-color-def),1) ); */
}

.bub-bottom-section .menu-item.newsletter a {
  /* background: linear-gradient( to right, rgba(var(--brandNewsletter-color-def),0.5), rgba(var(--brandNewsletter-color-def),1) ); */
}

.bub-bottom-section .menu-item.rss a {
  /* background: linear-gradient( to right, rgba(var(--brandRss-color-def),0.5), rgba(var(--brandRss-color-def),1) ); */
}

.bub-bottom-section .menu-item a:hover {
  color: inherit;
  text-decoration: underline;
}

/* Separators */

.bub-bottom-section .bub-bottom-section__separator {
  flex: 0 0 auto;
  /*height: 235px;*/
  min-height: 100%;
  opacity: 0.5;
  width: 1px;
}

@media screen and (max-width: 920px) {
  
  .bub-bottom-section__content {
    display: block;
  }

  .bub-bottom-section__area {
    margin: 20px auto;
    max-width: 400px;
    text-align: center;
  }

  .bub-bottom-section__area a[href*="/maps/"] {
    margin: 15px auto 0;
  }

  .bub-bottom-section .menu-item a {
    margin-bottom: 5px;
  }

  .bub-bottom-section__area:last-child {
    margin-bottom: 25px;
  }

  .bub-bottom-section__area-1::before {
    margin-left: auto;
    margin-right: auto;
  }

  .bub-bottom-section .nav-bottom {
    margin: 0 auto;
  }

  .bub-bottom-section .menu-bottom {
    justify-content: center;
    text-align: center;
  }
}


/*
Site Footer
---------------------------------------------------------------------------------------------------- */

.site-footer {
  background: #222;
  background: var(--body-background-dk1);
  border-top: 1px solid var(--body-background-dk2);
  font-size: 14px;
  margin-top: 40px;
  min-width: 290px;
}

.bub-togglebox + .entry-footer {
  margin-top: 30px;
}

body.has-bottom-section .site-footer {
  margin-top: 0;
}

.site-footer a {
  color: var(--theme1-color-def);
}

.site-footer .wrap {
  align-items: center;
  display: flex;
  height: 100%;
  justify-content: space-between;
  min-width: 0;
  overflow: hidden;
}

.site-footer .wrap::before,
.site-footer .wrap::after {
  display: none;
}

@media screen and (max-width: 500px) {
  
  .site-footer .wrap {
    justify-content: center;
  }
}