.px-teaser {
  position: relative;
  container-type: inline-size;
}
.px-teaser-inner {
  display: grid;
  gap: 20px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.px-teaser.twoColumns .px-teaser-inner {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.px-teaser.fourColumns .px-teaser-inner {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.px-teaser.sixColumns .px-teaser-inner {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}
.px-teaser.sixColumns .item {
  gap: 12px;
  --item-pad-x: 15px;
  --item-pad-y: 15px;
  min-height: 140px;
  align-items: center;
  text-align: center;
}
.px-teaser.sixColumns .item .media.icon {
  width: 50px;
  height: 50px;
}
.px-teaser.sixColumns .item .media.icon img {
  width: 32px;
  height: 32px;
}
.px-teaser.sixColumns .item .media.image.framed,
.px-teaser.sixColumns .item .media.image.bordered {
  width: 100px;
  height: 100px;
}
.px-teaser.sixColumns .item .content {
  font-family: var(--headline);
  font-size: 16px;
  line-height: 20px;
  align-items: center;
}
.px-teaser.sixColumns .item .content p {
  color: var(--main-color);
}
@container (width <=960px) {
  .px-teaser.fourColumns .px-teaser-inner {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .px-teaser.sixColumns .px-teaser-inner {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@container (width <=860px) {
  .px-teaser.threeColumns .px-teaser-inner {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@container (width <=560px) {
  .px-teaser.twoColumns .px-teaser-inner, .px-teaser.threeColumns .px-teaser-inner, .px-teaser.fourColumns .px-teaser-inner {
    grid-template-columns: minmax(0, 1fr);
  }
  .px-teaser.sixColumns .px-teaser-inner {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
.px-teaser .teaser-single {
  display: flex;
  min-width: 0;
}
.px-teaser .px-teaser-inner.animate-parent > .col:nth-child(1) {
  animation-delay: 150ms;
}
.px-teaser .px-teaser-inner.animate-parent > .col:nth-child(2) {
  animation-delay: 300ms;
}
.px-teaser .px-teaser-inner.animate-parent > .col:nth-child(3) {
  animation-delay: 450ms;
}
.px-teaser .px-teaser-inner.animate-parent > .col:nth-child(4) {
  animation-delay: 600ms;
}
.px-teaser .px-teaser-inner.animate-parent > .col:nth-child(5) {
  animation-delay: 750ms;
}
.px-teaser .px-teaser-inner.animate-parent > .col:nth-child(6) {
  animation-delay: 900ms;
}
.px-teaser .px-teaser-inner.animate-parent > .col:nth-child(7) {
  animation-delay: 1050ms;
}
.px-teaser .px-teaser-inner.animate-parent > .col:nth-child(8) {
  animation-delay: 1200ms;
}
.px-teaser .px-teaser-inner.animate-parent > .col:nth-child(9) {
  animation-delay: 1350ms;
}
.px-teaser .px-teaser-inner.animate-parent > .col:nth-child(10) {
  animation-delay: 1500ms;
}
.px-teaser .px-teaser-inner.animate-parent > .col:nth-child(11) {
  animation-delay: 1650ms;
}
.px-teaser .px-teaser-inner.animate-parent > .col:nth-child(12) {
  animation-delay: 1800ms;
}
.px-teaser .px-teaser-inner.animate-parent > .col:nth-child(13) {
  animation-delay: 1950ms;
}
.px-teaser .px-teaser-inner.animate-parent > .col:nth-child(14) {
  animation-delay: 2100ms;
}
.px-teaser .px-teaser-inner.animate-parent > .col:nth-child(15) {
  animation-delay: 2250ms;
}
.px-teaser .px-teaser-inner.animate-parent > .col:nth-child(16) {
  animation-delay: 2400ms;
}
.px-teaser .px-teaser-inner.animate-parent > .col:nth-child(17) {
  animation-delay: 2550ms;
}
.px-teaser .px-teaser-inner.animate-parent > .col:nth-child(18) {
  animation-delay: 2700ms;
}
.px-teaser .px-teaser-inner.animate-parent > .col:nth-child(19) {
  animation-delay: 2850ms;
}
.px-teaser .px-teaser-inner.animate-parent > .col:nth-child(20) {
  animation-delay: 3000ms;
}
.px-teaser .px-teaser-inner.animate-parent > .col:nth-child(21) {
  animation-delay: 3150ms;
}
.px-teaser .px-teaser-inner.animate-parent > .col:nth-child(22) {
  animation-delay: 3300ms;
}
.px-teaser .px-teaser-inner.animate-parent > .col:nth-child(23) {
  animation-delay: 3450ms;
}
.px-teaser .px-teaser-inner.animate-parent > .col:nth-child(24) {
  animation-delay: 3600ms;
}
.px-teaser .px-teaser-inner.animate-parent > .col:nth-child(25) {
  animation-delay: 3750ms;
}
.px-teaser .px-teaser-inner.animate-parent > .col:nth-child(26) {
  animation-delay: 3900ms;
}
.px-teaser .px-teaser-inner.animate-parent > .col:nth-child(27) {
  animation-delay: 4050ms;
}
.px-teaser .px-teaser-inner.animate-parent > .col:nth-child(28) {
  animation-delay: 4200ms;
}
.px-teaser .px-teaser-inner.animate-parent > .col:nth-child(29) {
  animation-delay: 4350ms;
}
.px-teaser .px-teaser-inner.animate-parent > .col:nth-child(30) {
  animation-delay: 4500ms;
}
.px-teaser .item {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  gap: 20px;
  width: 100%;
  min-width: 0;
  --item-pad-x: 20px;
  --item-pad-y: 20px;
  padding: var(--item-pad-y) var(--item-pad-x);
  background: var(--backgroundColor);
  border: 1px solid var(--formBorderColor);
  border-radius: 2px;
  color: var(--fontColor);
}
.px-teaser .media {
  flex: 0 0 auto;
}
.px-teaser .media.icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 75px;
  height: 75px;
  background: var(--main-color);
}
.px-teaser .media.icon img {
  display: block;
  width: 48px;
  height: 48px;
  object-fit: contain;
  filter: brightness(0) invert(1);
}
.px-teaser .media.icon.plain {
  width: 35px;
  height: auto;
  background: none;
}
.px-teaser .media.icon.plain img {
  width: 35px;
  height: auto;
  filter: none;
}
.px-teaser .media.image {
  max-width: 100%;
}
.px-teaser .media.image img {
  display: block;
  max-width: 100%;
  height: auto;
}
.px-teaser .media.image.framed, .px-teaser .media.image.bordered {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 140px;
  height: 140px;
  padding: 8px;
  background: var(--backgroundColor);
  border: 1px solid var(--main-color);
}
.px-teaser .media.image.framed img, .px-teaser .media.image.bordered img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.px-teaser .media.image.bordered {
  padding: 0;
}
.px-teaser .media.image.bordered img {
  object-fit: cover;
}
.px-teaser .teaser-heading {
  margin: 0;
  color: var(--main-color);
}
.px-teaser .teaser-heading.with-check::before {
  content: "";
  display: block;
  width: 25px;
  height: 25px;
  margin-bottom: 12px;
  background-color: var(--main-color);
  -webkit-mask: var(--teaser-check) no-repeat center/contain;
  mask: var(--teaser-check) no-repeat center/contain;
}
.px-teaser .content {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-width: 0;
}
.px-teaser .content > :first-child {
  margin-top: 0;
}
.px-teaser .content > :last-child {
  margin-bottom: 0;
}
.px-teaser .content p.is-style-uppercase {
  font-size: var(--baseFontSize);
}
.px-teaser .content h2:not(.has-text-color),
.px-teaser .content h3:not(.has-text-color),
.px-teaser .content h4:not(.has-text-color),
.px-teaser .content h5:not(.has-text-color),
.px-teaser .content h6:not(.has-text-color) {
  color: var(--main-color);
}
.px-teaser.media-top .media.image:not(.framed):not(.bordered) {
  width: 200px;
}
.px-teaser.media-top .media.image.full:not(.framed):not(.bordered) {
  width: auto;
  max-width: none;
  margin: calc(var(--item-pad-y) * -1) calc(var(--item-pad-x) * -1) 0;
  border-radius: 2px 2px 0 0;
  overflow: hidden;
}
.px-teaser.media-top .media.image.full:not(.framed):not(.bordered) img {
  width: 100%;
  height: auto;
  aspect-ratio: 550/400;
  object-fit: cover;
}
.px-teaser.media-top.align-center .item {
  align-items: center;
  --item-pad-y: 30px;
  text-align: center;
}
.px-teaser.media-top.align-center .item .content {
  align-items: center;
}
.px-teaser.media-left .item {
  display: grid;
  grid-template-columns: 140px minmax(0, 1fr);
  column-gap: 20px;
  align-items: start;
  --item-pad-x: 15px;
  --item-pad-y: 15px;
}
.px-teaser.media-left .item.type-icon {
  grid-template-columns: 75px minmax(0, 1fr);
  --item-pad-x: 20px;
  --item-pad-y: 20px;
}
.px-teaser.media-left .item.icon-plain {
  grid-template-columns: 35px minmax(0, 1fr);
  --item-pad-x: 15px;
  --item-pad-y: 15px;
}
.px-teaser.media-left .item.no-media {
  grid-template-columns: minmax(0, 1fr);
  --item-pad-x: 20px;
  --item-pad-y: 20px;
}
.px-teaser.media-left .item .media {
  grid-column: 1;
  grid-row: 1;
}
.px-teaser.media-left .item .content {
  grid-column: 2;
  grid-row: 1;
  align-self: stretch;
  padding: 10px 0;
}
.px-teaser.media-left .item.no-media .content {
  grid-column: 1;
}
.px-teaser.media-heading .item {
  display: grid;
  grid-template-columns: 75px minmax(0, 1fr);
  grid-template-rows: auto minmax(0, 1fr);
  column-gap: 20px;
  row-gap: 20px;
  align-items: start;
}
.px-teaser.media-heading .item.type-image {
  grid-template-columns: 140px minmax(0, 1fr);
}
.px-teaser.media-heading .item.icon-plain {
  grid-template-columns: 35px minmax(0, 1fr);
}
.px-teaser.media-heading .item.no-media {
  grid-template-columns: minmax(0, 1fr);
}
.px-teaser.media-heading .item .media {
  grid-column: 1;
  grid-row: 1;
}
.px-teaser.media-heading .item .teaser-heading {
  grid-column: 2;
  grid-row: 1;
  align-self: start;
}
.px-teaser.media-heading .item.no-media .teaser-heading {
  grid-column: 1;
}
.px-teaser.media-heading .item .content {
  grid-column: 1/-1;
  grid-row: 2;
  align-self: stretch;
}
.px-teaser.media-heading .item.no-content {
  grid-template-rows: auto;
}
@container (width <=560px) {
  .px-teaser.media-left .item, .px-teaser.media-left .item.type-icon, .px-teaser.media-left .item.icon-plain, .px-teaser.media-heading .item, .px-teaser.media-heading .item.type-image, .px-teaser.media-heading .item.icon-plain {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto;
    row-gap: 20px;
    --item-pad-x: 20px;
    --item-pad-y: 20px;
  }
  .px-teaser.media-left .item .media,
  .px-teaser.media-left .item .teaser-heading,
  .px-teaser.media-left .item .content, .px-teaser.media-left .item.type-icon .media,
  .px-teaser.media-left .item.type-icon .teaser-heading,
  .px-teaser.media-left .item.type-icon .content, .px-teaser.media-left .item.icon-plain .media,
  .px-teaser.media-left .item.icon-plain .teaser-heading,
  .px-teaser.media-left .item.icon-plain .content, .px-teaser.media-heading .item .media,
  .px-teaser.media-heading .item .teaser-heading,
  .px-teaser.media-heading .item .content, .px-teaser.media-heading .item.type-image .media,
  .px-teaser.media-heading .item.type-image .teaser-heading,
  .px-teaser.media-heading .item.type-image .content, .px-teaser.media-heading .item.icon-plain .media,
  .px-teaser.media-heading .item.icon-plain .teaser-heading,
  .px-teaser.media-heading .item.icon-plain .content {
    grid-column: 1;
    grid-row: auto;
  }
}
.fl[data-frame=cibgbox] .px-teaser .item, .fl[data-frame=blackbgbox] .px-teaser .item, .fl[data-background-media=true] .px-teaser .item {
  border-color: transparent;
  color: var(--fontColor);
}
.fl[data-frame=cibgbox] .px-teaser .item p,
.fl[data-frame=cibgbox] .px-teaser .item li,
.fl[data-frame=cibgbox] .px-teaser .item .content h2:not(.has-text-color),
.fl[data-frame=cibgbox] .px-teaser .item .content h3:not(.has-text-color),
.fl[data-frame=cibgbox] .px-teaser .item .content h4:not(.has-text-color),
.fl[data-frame=cibgbox] .px-teaser .item .content h5:not(.has-text-color),
.fl[data-frame=cibgbox] .px-teaser .item .content h6:not(.has-text-color),
.fl[data-frame=cibgbox] .px-teaser .item .teaser-heading, .fl[data-frame=blackbgbox] .px-teaser .item p,
.fl[data-frame=blackbgbox] .px-teaser .item li,
.fl[data-frame=blackbgbox] .px-teaser .item .content h2:not(.has-text-color),
.fl[data-frame=blackbgbox] .px-teaser .item .content h3:not(.has-text-color),
.fl[data-frame=blackbgbox] .px-teaser .item .content h4:not(.has-text-color),
.fl[data-frame=blackbgbox] .px-teaser .item .content h5:not(.has-text-color),
.fl[data-frame=blackbgbox] .px-teaser .item .content h6:not(.has-text-color),
.fl[data-frame=blackbgbox] .px-teaser .item .teaser-heading, .fl[data-background-media=true] .px-teaser .item p,
.fl[data-background-media=true] .px-teaser .item li,
.fl[data-background-media=true] .px-teaser .item .content h2:not(.has-text-color),
.fl[data-background-media=true] .px-teaser .item .content h3:not(.has-text-color),
.fl[data-background-media=true] .px-teaser .item .content h4:not(.has-text-color),
.fl[data-background-media=true] .px-teaser .item .content h5:not(.has-text-color),
.fl[data-background-media=true] .px-teaser .item .content h6:not(.has-text-color),
.fl[data-background-media=true] .px-teaser .item .teaser-heading {
  color: var(--fontColor);
}
.fl[data-frame=cibgbox] .px-teaser .item .content h2:not(.has-text-color),
.fl[data-frame=cibgbox] .px-teaser .item .content h3:not(.has-text-color),
.fl[data-frame=cibgbox] .px-teaser .item .content h4:not(.has-text-color),
.fl[data-frame=cibgbox] .px-teaser .item .content h5:not(.has-text-color),
.fl[data-frame=cibgbox] .px-teaser .item .content h6:not(.has-text-color),
.fl[data-frame=cibgbox] .px-teaser .item .teaser-heading, .fl[data-frame=blackbgbox] .px-teaser .item .content h2:not(.has-text-color),
.fl[data-frame=blackbgbox] .px-teaser .item .content h3:not(.has-text-color),
.fl[data-frame=blackbgbox] .px-teaser .item .content h4:not(.has-text-color),
.fl[data-frame=blackbgbox] .px-teaser .item .content h5:not(.has-text-color),
.fl[data-frame=blackbgbox] .px-teaser .item .content h6:not(.has-text-color),
.fl[data-frame=blackbgbox] .px-teaser .item .teaser-heading, .fl[data-background-media=true] .px-teaser .item .content h2:not(.has-text-color),
.fl[data-background-media=true] .px-teaser .item .content h3:not(.has-text-color),
.fl[data-background-media=true] .px-teaser .item .content h4:not(.has-text-color),
.fl[data-background-media=true] .px-teaser .item .content h5:not(.has-text-color),
.fl[data-background-media=true] .px-teaser .item .content h6:not(.has-text-color),
.fl[data-background-media=true] .px-teaser .item .teaser-heading {
  color: var(--main-color);
}
.fl[data-frame=cibgbox] .px-teaser.sixColumns .item .content p:not(.has-text-color), .fl[data-frame=blackbgbox] .px-teaser.sixColumns .item .content p:not(.has-text-color), .fl[data-background-media=true] .px-teaser.sixColumns .item .content p:not(.has-text-color) {
  color: var(--main-color);
}