@charset "utf-8";

html {
  scroll-padding-top: 60px;
}

.page {
  min-height: 100lvh !important;
  padding-bottom: 20lvh;
}

.topbar {
  transform: none;
  position: sticky;
}


.filterbar {
  display: flex;
  flex-wrap: wrap;
  column-gap: 0.5em;
  row-gap: 0.5em;
}

.filterbar:not(.filterbar_main) {
  font-size: 0.75em;
}

.filterbt {
  background: var(--color);
  color: white;
  margin: 0;
}

.filterbt:before {
  content: " ";
  position: relative;
  display: block;
  width: 1em;
  height: 1em;
  margin-top: auto;
  margin-bottom: auto;
  margin-right: 0.5em;
  background: var(--ci-color);
  background: white;
  mask-repeat: no-repeat;
  mask-size: var(--svgicon-size);
  mask-position: var(--svgicon-position);
  mask-image: var(--svgicon-url);
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: var(--svgicon-size);
  -webkit-mask-position: var(--svgicon-position);
  -webkit-mask-image: var(--svgicon-url);
}

*:not(.filterbar_main)>.filterbt:not(:first-child):before {
  content: none;
}

.filterbar_main .filterbt[filter-value="gastronomy"] {
  --svgicon-url: var(--gp-gastronomy);
}

.filterbar_main .filterbt[filter-value="services"] {
  --svgicon-url: var(--gp-services);
}

.filterbar_main .filterbt[filter-value="retail"] {
  --svgicon-url: var(--gp-retail);
}


.filterbt[filter-value="all"] {
  --svgicon-url: var(--gp-nofilter);
}


.filterbt[filter-is-active] {
  background: var(--ci-color);
}

body[is-fe] .headerbox,
body[is-fe] .headerbox .mediafootage {
  height: 400px !important;
  max-height: calc(100vw / (16/9));
  min-height: calc(100vw / (10/2.2));
}


body[is-fe] .headerbox .headeroverlay .media {
  display: none;
}

.googlemapssec {
  max-width: 100%;
  width: 100%;
  padding: 0;
  row-gap: 0;
  column-gap: 0;
  margin: 0;
  height: 70svh;
  filter: none;
}

.cards {
  display: flex;
  flex-wrap: wrap;
  column-gap: 0.5em;
  row-gap: 0.5em;
  width: 100%;
  padding: 1em;
}


.cards>[is-hidden-by-filter] {
  display: none;
}

.filterbar_main~.filterbar {
  display: none;
}

.filterbar_main[current-filter-value="all"]~.filterbar_all,
.filterbar_main:not([current-filter-value])~.filterbar_all {
  display: flex;
}

.filterbar_main[current-filter-value="retail"]~.filterbar_retail {
  display: flex;
}

.filterbar_main[current-filter-value="gastronomy"]~.filterbar_gastronomy {
  display: flex;
}

.filterbar_main[current-filter-value="services"]~.filterbar_services {
  display: flex;
}

/* searchbar*/
.searchbar {
  display: flex;
  flex-wrap: wrap;
  column-gap: 0.5em;
  row-gap: 0.5em;
}

.searchbar input {
  width: 11em;
  border: 0;
  outline: 0;
  padding: 0.25em 0.5em;
  line-height: 1em;
  background: white;
  border: solid 2px var(--ci-color);
  box-shadow: inset 0 0 4px #00000024;
  border-radius: var(--border-radius);
  font-family: inherit;
}

.searchbar input:focus-visible {
  outline: 4px solid black;
}

/* brands expand */
.richtextfield.brands {
  display: flex;
  flex-direction: row;
  column-gap: 0.5em;
  row-gap: 0.5em;
  justify-content: left;
  justify-items: left;
  overflow: hidden;
  max-width: 100%;
}

.iconinfotexts .brands:before {
  top: 1.25em;
}

.brandlinks:empty {
  display: none;
}

.brandlinks {
  display: flex;
  flex-wrap: wrap;
  max-height: none;
  row-gap: 0.25em;
  column-gap: 0.25em;
  max-width: 100%;
  overflow: hidden;
}

.brandlinks>* {
  flex-shrink: 0;
  color: black;
  background: #e3e3e3;
  padding: 0.125em 0.5em;
  border-radius: 4px;
  font-size: 0.85em;

}

.brandlinks:not([show-full]) {
  flex-wrap: nowrap;
}

.brandlinks[has-overflow]:not([show-full]):after {
  content: "...mehr";
  position: absolute;
  top: 0;
  right: 0em;
  text-align: right;
  padding-right: 1.75em;
  font-size: 0.9em;
  width: 8em;
  height: 100%;
  font-weight: 600;
  text-align: right;
  background: linear-gradient(to left, #ffffff, #ffffff 60%, transparent);
  z-index: 2;

}

.brandlinks:before {
  content: '';

  right: 0em;
  width: 1.5em;
  height: 1.5em;
  flex-shrink: 0;
  flex-grow: 0;
  margin-top: 0.175em;
  --svgicon-url: var(--gp-brands);
  margin-right: 0.215em;
  mask-repeat: no-repeat;
  mask-size: var(--svgicon-size);
  mask-position: var(--svgicon-position);
  mask-image: var(--svgicon-url);
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: var(--svgicon-size);
  -webkit-mask-position: var(--svgicon-position);
  -webkit-mask-image: var(--svgicon-url);
  background: var(--ci-color);
  ;
  z-index: 3;
}

/* filtermenus */
.filtermenus {
  display: flex;
  flex-wrap: wrap;
  padding: 1em 1em 0.5em 1em;
  column-gap: 0.5em;
  row-gap: 0.5em;
  justify-content: space-between;
}

.filtersec {
  width: min(100%, 600px);
  flex-grow: 999;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  row-gap: 0.5em;
}

.searchbrandsec {
  display: flex;
  flex-direction: column;
  row-gap: 0.5em;
  align-items: flex-end;
}

/* brands dropdown*/
div[input-type][input-name="brands"] {
  width: 10.25em;
  margin-top: 1px;
  margin-right: 0.125em;
  --input-border-radius: var(--border-radius);
  --input-border: solid 2px;
  --input-padding-left: 0.5em;
  --input-height: 1.75em;
  --input-border-active: solid 2px;
}

div[input-name="brands"][input-type="dropdown"][is-expanded] .dropdownarrow {
  display: none;
}

div[input-type][input-name="brands"] .currentvalue,
div[input-type][input-name="brands"] .dropdownitem[set-value=""] {
  display: flex;
  font-weight: 600;
  width: 150px;
  overflow: hidden;
}

div[input-type][input-name="brands"] .resetbutton {
  mask-image: var(--icon-close-2);
  width: 1.15em;
  height: 1.15em;
  right: 0.5em;
}

div[input-type][input-name="brands"] .currentvalue:before,
div[input-type][input-name="brands"] .dropdownitem[set-value=""]:before {
  content: '';
  width: 1em;
  height: 1em;
  flex-shrink: 0;
  flex-grow: 0;
  margin-top: 0.175em;
  --svgicon-url: var(--gp-brands);
  margin-right: 0.215em;
  mask-repeat: no-repeat;
  mask-size: var(--svgicon-size);
  mask-position: var(--svgicon-position);
  mask-image: var(--svgicon-url);
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: var(--svgicon-size);
  -webkit-mask-position: var(--svgicon-position);
  -webkit-mask-image: var(--svgicon-url);
  background: var(--svgicon-color);
}

div[input-type="dropdown"][input-name="brands"][input-value=""] .currentvalue {
  opacity: 1;
}

/* fotostripe */
.fotostripe_innercont {
  display: flex;
  width: fit-content;
  width: -moz-fit-content;
  flex-direction: row;
  flex-wrap: nowrap;
  animation: fotostripe_move 600s linear infinite;
  overflow: visible;
  padding-top: 44px;
}

.fotostripe .fotostripel .media {
  margin-right: 1em;
  height: 200px;
  transition: transform 0.3s;
}

.fotostripe .mediafootage {
  height: 100%;
  width: auto;
  border-radius: var(--border-radius);
}

.fotostripe {
  width: 100%;
  overflow-x: hidden;
  overflow-y: visible;
  cursor: pointer;
  margin-top: -28px;
}

@keyframes fotostripe_move {
  0% {
    transform: translateX(calc(0px));
  }

  50% {
    transform: translateX(calc(-100% + 100vw));
  }

  100% {
    transform: translateX(calc(0px));
  }
}

body:after {

  display: none;
}

.cards>* {
  /*
  transform: scale3d(1, 1, 1.0001);*/
  background: #d9d9d9;
  border-radius: var(--border-radius);
}

.boxsystemwrapper .box.localshoppingpagebox {
  margin-top: 0;
}

.iconlink {
  transform: none !important;
}


.box.localshoppingpagebox .entry {
  will-change: visibility;
}