.px-textimages {
  position: relative;
  container-type: inline-size;
  width: var(--baseWidth);
  max-width: var(--maxWidthBig);
  margin: 0 auto;
}
.px-textimages-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px 120px;
  transition: var(--baseTransition);
}
@container (width <= 1200px) {
  .px-textimages-inner {
    gap: 20px 60px;
  }
}
@container (width <= 960px) {
  .px-textimages-inner {
    flex-direction: column;
    gap: 20px;
    align-items: flex-start;
  }
}
.px-textimages-inner .col {
  width: 50%;
}
@container (width <= 960px) {
  .px-textimages-inner .col {
    width: 100%;
  }
}
.px-textimages-inner .col.text .button {
  margin-top: 20px;
}
.px-textimages-inner .col.text .wp-block-buttons:first-child {
  margin-top: 0;
}
.px-textimages-inner .col.image, .px-textimages-inner .col.person {
  position: relative;
}
@container (width <= 960px) {
  .px-textimages-inner .col.image, .px-textimages-inner .col.person {
    order: -1;
  }
}
.px-textimages-inner .col.image img, .px-textimages-inner .col.person img {
  width: 100%;
  height: 770px;
  max-width: 650px;
  object-fit: cover;
  display: block;
  border-radius: var(--bigBorderRadius);
}
@container (width <= 960px) {
  .px-textimages-inner .col.image img, .px-textimages-inner .col.person img {
    height: auto;
    max-width: 100%;
  }
}
.px-textimages-inner .col.person {
  max-width: 650px;
  overflow: hidden;
  transition: var(--baseTransition);
}
@container (width <= 960px) {
  .px-textimages-inner .col.person {
    max-width: 70%;
  }
}
@container (width <= 640px) {
  .px-textimages-inner .col.person {
    max-width: 100%;
  }
}
.px-textimages-inner .col.person .person-inner {
  background: var(--mainColor) var(--secondGradientRotate);
  border-radius: var(--bigBorderRadius);
  display: flex;
  justify-content: center;
  padding-top: 30px;
  overflow: hidden;
}
.px-textimages-inner .col.person .person-inner .cloud {
  display: block;
  width: 200%;
  height: 100%;
  overflow: hidden;
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 1;
  border-radius: var(--bigBorderRadius);
}
@container (width <=768px) {
  .px-textimages-inner .col.person .person-inner .cloud {
    width: 100%;
  }
}
.px-textimages-inner .col.person .person-inner .cloud .cloud-inner {
  display: block;
  width: 100%;
  height: 100%;
  background: url("../../../img/ansprechpartner-cloud.png") no-repeat left bottom/auto 100%;
  animation: moveClouds 20s ease-in-out infinite alternate;
}
@container (width <=768px) {
  .px-textimages-inner .col.person .person-inner .cloud .cloud-inner {
    background-image: url("../../../img/textimage-cloud-mobile.jpg");
    background-size: cover;
    animation: none;
  }
}
.px-textimages-inner .col.person img {
  position: relative;
  z-index: 3;
  height: 740px;
  width: auto;
  max-width: inherit;
}
@container (width <= 960px) {
  .px-textimages-inner .col.person img {
    height: auto;
    max-height: 500px;
  }
}
.px-textimages-inner .col.person .person-info {
  position: absolute;
  bottom: 30px;
  left: 30px;
  max-width: 50%;
  border-radius: var(--bigBorderRadius);
  background-color: rgba(var(--contrastColorInvertedRGB), 0.87);
  padding: 20px;
  z-index: 4;
  backdrop-filter: blur(3px);
}
@container (width <= 960px) {
  .px-textimages-inner .col.person .person-info {
    max-width: calc(100% - 60px);
  }
}
@container (width <= 768px) {
  .px-textimages-inner .col.person .person-info {
    font-size: 15px;
    line-height: 130%;
    padding: 15px;
  }
}
.px-textimages-inner .col.person .person-info p + p {
  margin-top: 0.5em;
}
.px-textimages-inner .col.person .person-info p.persontitle {
  font-size: 15px;
  font-weight: 400;
}
@container (width <= 768px) {
  .px-textimages-inner .col.person .person-info p.persontitle {
    font-size: 13px;
    line-height: 130%;
  }
}
.px-textimages.imagepositionvertical-top .px-textimages-inner {
  align-items: flex-start;
}

@keyframes moveClouds {
  0% {
    transform: translateX(-50%);
  }
  100% {
    transform: translateX(0);
  }
}
.lightbox-content {
  max-width: 40rem;
  max-height: 70rem;
  margin: 10px auto;
  padding: 40px;
  background: var(--contrastColorInverted);
  border-radius: var(--bigBorderRadius);
  position: relative;
  overflow-y: auto;
}
.lightbox-content .mfp-close {
  transition: var(--baseTransition);
  color: var(--contrastColorInverted) !important;
  opacity: 1;
  background-color: var(--mainColor);
  border-top-right-radius: var(--bigBorderRadius);
  border-bottom-left-radius: 10px;
}
.lightbox-content .mfp-close:hover {
  background-color: var(--secondColor);
}