/* CSS Document */
/*
 Theme Name:   twentytwentythree-child
 Description:  twentytwentythree
 Author:       frankfurtwest
 Author URI:   www.frankfurtwest.com
 Template:     twentytwentythree
 Version:      1.0
 Text Domain:  twentytwentythree-child
*/
/* SEEBRUECKE FFM */
@font-face {
  font-family: "iconfont";
  src: url("fonts/iconfont.eot");
  src: url("fonts/iconfont.eot#iefix") format("embedded-opentype"), url("fonts/iconfont.woff2") format("woff2"), url("fonts/iconfont.woff") format("woff"), url("fonts/iconfont.ttf") format("truetype"), url("fonts/iconfont.svg#iconfont") format("svg");
  font-weight: normal;
  font-style: normal;
}
body {
  /* Silbentrennung */
  -ms-word-break: break-all;
  word-break: break-all;
  /* Non standard for WebKit */
  word-break: break-word;
  -webkit-hyphens: auto;
  hyphens: auto;
}

:active,
:focus {
  outline: none !important;
}

::-moz-selection {
  background: #f90;
  color: #fff;
}

::selection,
::-moz-selection {
  background: #f90;
  color: #fff;
}

header {
  position: relative;
  z-index: 100 !important;
}

.wp-block-query .wp-block-post {
  transition: all 0.3s ease-in-out;
}
.wp-block-query .wp-block-post:hover {
  background-color: var(--wp--preset--color--tertiary);
}
.wp-block-query .wp-block-post:hover figure img {
  transform: scale(1.05);
  transform-origin: center center;
}
.wp-block-query .wp-block-post figure img {
  transition: all 0.3s ease-in-out;
}
.wp-block-query .wp-block-post .wp-block-columns {
  padding: 0 !important;
  position: relative;
  overflow: hidden;
}

/*.loop-card */
.loop-card li {
  display: flex;
  -webkit-display: flex;
  flex-wrap: wrap;
  align-items: stretch;
}
.loop-card li .card {
  position: relative;
  overflow: hidden;
  border: 1px solid #ddd;
}
.loop-card li .card .card-body {
  padding: 0.6rem;
  margin-top: 0.6rem !important;
  line-height: 1.25;
}
.loop-card li .card .card-body .wp-block-post-excerpt p:first-child {
  margin-top: 0.6rem;
}
.loop-card li .card .card-body .wp-block-post-excerpt strong {
  font-weight: 300 !important;
}

/**/
.wp-block-post-excerpt__more-text {
  /*  display: none;*/
}

.wp-block-post-excerpt__more-link {
  text-decoration: none;
  /*  color: var(--wp--preset--color--primary);*/
  color: #999;
  font-size: 0.8em;
}
.wp-block-post-excerpt__more-link:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.wp-block-group.wp-block-group-is-layout-constrained.card-body {
  position: static !important;
}

.wp-block-query .wp-block-post .wp-block-columns,
.x {
  margin: 24px 0 !important;
  border-bottom-color: #ccc;
}

@media (min-width: 780px) {
  .wp-block-query .wp-block-post .wp-block-columns h2,
  .x {
    margin-top: 24px !important;
  }
}
@media (max-width: 779px) {
  .wp-block-query .wp-block-post .wp-block-columns h2,
  .wp-block-query .wp-block-post .wp-block-columns p,
  .x {
    padding: 0 0.6rem;
  }
}
.breadcrumb {
  font-weight: 700;
  font-size: 2rem;
}
.breadcrumb a {
  text-decoration: none;
}
.breadcrumb a:hover {
  text-decoration: underline;
}
.breadcrumb a::before {
  content: "\e81c";
  display: inline-block;
  margin-right: 0.25em;
  font-family: iconfont;
  font-size: 0.8em !important;
}

/* hscroller */
.hscroller ul, .hscroller #vsel {
  --_spacer: .25rem;
  display: grid;
  grid-auto-flow: column !important;
  grid-auto-columns: 28% !important;
  grid-template-columns: none !important;
  /** /
  grid-template-rows: 100%;
  /**/
  gap: calc(6px + 2%) !important;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scroll-snap-type: inline mandatory;
  scroll-padding-inline: var(--_spacer, 0.4rem);
  padding-bottom: 1rem;
  /** /
  @media (max-width: 575px) {
      grid-auto-columns: 100% !important;
      grid-auto-flow: row !important;
      scroll-padding-inline: 50em !important;
      gap: calc(var(--_spacer) * 2) !important;
  }
  /**/
}
@media (max-width: 1099px) {
  .hscroller ul, .hscroller #vsel {
    grid-auto-columns: 30% !important;
  }
}
@media (max-width: 991px) {
  .hscroller ul, .hscroller #vsel {
    grid-auto-columns: 36% !important;
  }
}
@media (max-width: 767px) {
  .hscroller ul, .hscroller #vsel {
    grid-auto-columns: 46% !important;
  }
}
@media (max-width: 575px) {
  .hscroller ul, .hscroller #vsel {
    grid-auto-columns: 72% !important;
  }
}
.hscroller ul li, .hscroller ul .vsel-content, .hscroller #vsel li, .hscroller #vsel .vsel-content {
  scroll-snap-align: start;
  inline-size: 100%;
  position: relative;
  margin-top: 0;
}
.hscroller ul li img, .hscroller ul .vsel-content img, .hscroller #vsel li img, .hscroller #vsel .vsel-content img {
  -o-object-fit: cover;
  object-fit: cover;
}
.hscroller ul li::marker, .hscroller ul .vsel-content::marker, .hscroller #vsel li::marker, .hscroller #vsel .vsel-content::marker {
  content: "";
  display: none;
}

/* Termine Tool */
#vsel {
  padding: 1.4rem 0.4rem 1rem 2rem !important;
  color: var(--wp--preset--color--base);
  background-color: var(--wp--preset--color--primary);
  position: relative;
  z-index: 1;
}

#vsel::after {
  content: "";
  position: absolute;
  display: inline-block;
  top: 32px;
  left: 0;
  min-height: 0px;
  padding: 0;
  border: 12px solid transparent;
  border-left: 12px solid #fff !important;
  z-index: 2;
}

#vsel a {
  color: var(--wp--preset--color--base) !important;
}

#vsel ::-moz-selection {
  color: var(--wp--preset--color--primary) !important;
  background-color: var(--wp--preset--color--base) !important;
}

#vsel ::selection,
#vsel ::-moz-selection {
  color: var(--wp--preset--color--primary) !important;
  background-color: var(--wp--preset--color--base) !important;
}

h3.vsel-meta-title {
  font-size: 1.33rem !important;
}

.vsel-content {
  border: 0 !important;
  font-size: 1.2rem;
  margin-bottom: 0.2rem !important;
  padding-bottom: 0.2rem !important;
}

.vsel-meta div {
  margin-bottom: 0 !important;
  line-height: 1.1;
}

.vsel-meta-time,
.vsel-meta-date,
.x {
  font-weight: 700;
}

.vsel-shortcode:has(.vsel-no-events) {
  display: none !important;
}

/*Modal Navigation */
.is-menu-open.has-modal-open {
  background-color: rgba(255, 153, 0, 0.9) !important;
}

.is-menu-open.has-modal-open .wp-block-navigation__container {
  width: 40rem;
  max-width: 100%;
  margin: 10% auto !important;
}

.is-menu-open.has-modal-open .wp-block-navigation-item,
.is-menu-open.has-modal-open .wp-block-navigation-item .wp-block-navigation-item__content {
  width: 100% !important;
}

.is-menu-open.has-modal-open .wp-block-navigation-item__content {
  font-size: 2rem;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.9) !important;
  border-bottom: 2px solid transparent;
}

.is-menu-open.has-modal-open .wp-block-navigation-item__content:hover {
  text-decoration: none !important;
  color: #fff !important;
  border-bottom-color: #fff;
}

.wp-block-navigation__responsive-container-close {
  /*  margin-top: 10%;  */
  padding: 30px calc(30px - 4%);
}

.wp-block-navigation__responsive-container-close path {
  fill: #fff !important;
}

.wp-block-navigation__responsive-container-open svg {
  transform: scale(1.2);
}

.wp-block-navigation__responsive-container .wp-block-navigation__responsive-container-content {
  font-family: "Rubik", sans-serif;
}

.wp-block-navigation .has-primary-color a:hover {
  color: var(--wp--preset--color--secondary);
}

.wp-social-link-mastodon svg,
.wp-social-link-tiktok svg,
.x {
  transform: scale(0.8);
}

.nav-content .current-menu-item {
  display: none;
}

/*Buttons */
.wp-block-button.is-style-outline a:hover, .wp-block-button.is-style-outline a :focus, .wp-block-button.is-style-outline a :active {
  color: #fff !important;
  background-color: #000 !important;
  border-color: transparent !important;
}
.wp-block-button a.has-contrast-background-color:hover,
.wp-block-button a.has-contrast-background-color:focus,
.wp-block-button a.has-contrast-background-color:active,
.wp-block-button .x {
  color: var(--wp--preset--color--base) !important;
}

/* 

.has-contrast-background-color + .wp-block-cover__inner-container .wp-block-button a:hover,
.has-contrast-background-color + .wp-block-cover__inner-container .wp-block-button a:focus,
.has-contrast-background-color + .wp-block-cover__inner-container .wp-block-button a:active,
.x {
    color: #000 !important;
    background-color: #fff !important;
} 
*/
/**/
[background-color="var(--wp--preset--color--primary)"] a {
  color: var(--wp--preset--color--base) !important;
}

/**/
/*columns reset */
/*grid */
:where(body .is-layout-grid) {
  -moz-column-gap: calc(1.6% + 5px) !important;
  column-gap: calc(1.6% + 5px) !important;
  row-gap: 1rem !important;
}

@media (min-width: 576px) {
  .wp-block-post-template.columns-2,
  .wp-block-post-template.columns-3,
  .wp-block-post-template.columns-4,
  .x {
    grid-template-columns: 1fr 1fr !important;
  }
}
/* */
@media (min-width: 768px) {
  .wp-block-post-template.columns-3,
  .wp-block-post-template.columns-4 {
    grid-template-columns: 1fr 1fr 1fr !important;
  }
}
/* */
@media (min-width: 992px) {
  .wp-block-post-template.columns-4 {
    grid-template-columns: 1fr 1fr 1fr 1fr !important;
  }
}
/* posts-navigation */
.posts-navigation {
  position: fixed;
  top: 66%;
  left: 1%;
  height: 0.1px;
  width: 98%;
  margin-top: 0 !important;
  z-index: 2222;
}
.posts-navigation > div {
  height: 0.1px;
}
.posts-navigation .wp-block-post-navigation-link {
  position: relative;
  color: var(--wp--preset--color--base) !important;
}
.posts-navigation .wp-block-post-navigation-link a {
  display: flex;
  --mywh: calc(2vw + 2rem);
  border-radius: 1111px;
  width: var(--mywh);
  height: var(--mywh);
  background: rgb(238, 127, 0);
  /**/
  /**/
  /**/
}
.posts-navigation .wp-block-post-navigation-link a::before {
  width: var(--mywh);
  height: var(--mywh);
  content: url("data:image/svg+xml,%3Csvg%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2086%2086%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20xml%3Aspace%3D%22preserve%22%20xmlns%3Aserif%3D%22http%3A%2F%2Fwww.serif.com%2F%22%20style%3D%22fill-rule%3Aevenodd%3Bclip-rule%3Aevenodd%3Bstroke-linejoin%3Around%3Bstroke-miterlimit%3A2%3B%22%3E%0A%20%20%20%20%3Cg%20transform%3D%22matrix%281%2C0%2C0%2C1%2C-1493.07%2C-205.04%29%22%3E%0A%20%20%20%20%20%20%20%20%3Cg%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%20transform%3D%22matrix%281%2C0%2C0%2C1%2C-28.0007%2C19.9264%29%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M1561.08%2C255.813L1586.48%2C230.513C1587.15%2C229.78%201587.48%2C228.947%201587.48%2C228.013C1587.48%2C227.08%201587.15%2C226.247%201586.48%2C225.513L1561.08%2C200.113C1560.42%2C199.447%201559.58%2C199.113%201558.58%2C199.113C1557.58%2C199.113%201556.75%2C199.447%201556.08%2C200.113L1550.38%2C205.813C1549.65%2C206.547%201549.28%2C207.413%201549.28%2C208.413C1549.28%2C209.413%201549.65%2C210.247%201550.38%2C210.913L1567.48%2C228.013L1550.38%2C245.113C1549.65%2C245.847%201549.28%2C246.68%201549.28%2C247.613C1549.28%2C248.547%201549.65%2C249.38%201550.38%2C250.113L1556.08%2C255.813C1556.82%2C256.547%201557.65%2C256.913%201558.58%2C256.913C1559.52%2C256.913%201560.35%2C256.547%201561.08%2C255.813Z%22%20style%3D%22fill%3Awhite%3Bfill-rule%3Anonzero%3B%22%2F%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%0A%20%20%20%20%20%20%20%20%3C%2Fg%3E%0A%20%20%20%20%3C%2Fg%3E%0A%3C%2Fsvg%3E");
}
.posts-navigation .wp-block-post-navigation-link a[rel=prev] {
  transform: scaleX(-1);
}
.posts-navigation .wp-block-post-navigation-link a:hover, .posts-navigation .wp-block-post-navigation-link a:focus, .posts-navigation .wp-block-post-navigation-link a:active {
  background: rgb(235, 106, 58);
  background: #000;
}

/* posts-navigation alt * /

.posts-navigation {
    position: fixed;
    bottom: 0;
    width: 100%;
    margin-top: 0 !important;
    z-index: 2222;
    background-color: var(--wp--preset--color--contrast);
    a {
        font-size: .9em;
        text-decoration: none;
        text-transform: uppercase;
        color:  var(--wp--preset--color--base) !important;
    }

}

.nav-content .wp-block-navigation-item__label::before {
    content: "\f105";
    font-family: iconfont;
    font-size: .8em;
    margin-right: .4em;
    margin-top: -1em;
} 


.wp-block-post-navigation-link:not(:empty) {
    position: relative;
    color:  var(--wp--preset--color--base) !important;
    background-color: var(--wp--preset--color--contrast);
    padding: .2rem .6rem;
    &:hover {
        background-color: var(--wp--preset--color--primary);
    }
} 
/**/