.custom-content-with-media {
  width: 100%;
  max-width: 100%;
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-auto-flow: dense;
  align-items: stretch;
  border-top: 0.1rem solid var(--color-gray);
  border-bottom: 0.1rem solid var(--color-gray);
}

.custom-content-with-media + .custom-content-with-media {
  border-top: none;
}

.custom-content-with-media-media-wrapper {
  padding: var(--block-margin) var(--page-padding) var(--row-gap);
  border-bottom: 0.1rem solid var(--color-gray);
  display: flex;
  flex-direction: column;
  row-gap: var(--row-gap);
  max-width: min(100%, calc(var(--width-limit) / 2));
  grid-column: 1;
  grid-row: 1;
  z-index: 1;
  width: 100%;
  height: 100%;
}

.custom-content-with-media[data-media-style="background"]
  .custom-content-with-media-media-wrapper {
  --text-color: var(--dark-background-text-color);
  --link-color: var(--dark-background-link-color);
  --hover-link-color: var(--dark-background-hover-link-color);
  color: var(--text-color);
  pointer-events: none;
}

.custom-content-with-media[data-media-style="background"]
  .custom-content-with-media-media-wrapper::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  border: 0.1rem solid;
  border-radius: var(--element-border-radius);
}

.custom-content-with-media-media {
  border-radius: var(--element-border-radius);
  box-shadow: var(--element-box-shadow);
  overflow: hidden;
  display: flex;
  position: relative;
}

.custom-content-with-media[data-media-style="background"]
  .custom-content-with-media-media {
  min-height: 100%;
}

.custom-content-with-media[data-media-style="background"]
  .custom-content-with-media-media {
  grid-column: 1;
  grid-row: 1;
  border-radius: 0;
  box-shadow: none;
}

.custom-content-with-media-media.animate__animated {
  animation-name: fadeIn;
}

.custom-content-with-media-image,
.custom-content-with-media-image img {
  width: 100%;
}

.custom-content-with-media[data-media-style="background"]
  .custom-content-with-media-image
  img {
  min-height: 100%;
  object-fit: cover;
}

.custom-content-with-media-video-player {
  position: relative;
  width: 100%;
}

.custom-content-with-media[data-media-style="background"]
  .custom-content-with-media-video-player {
  background: var(--color-black);
}

.custom-content-with-media[data-media-style="background"]
  .custom-content-with-media-video-player-button {
  height: 100%;
  min-width: 100%;
}

.custom-content-with-media-video-player-button > div {
  height: 100%;
}

.custom-content-with-media-video-player iframe {
  width: 100%;
  aspect-ratio: 16 / 9;
  border: none;
  display: block;
}

.custom-content-with-media[data-media-style="background"]
  .custom-content-with-media-video-player
  iframe {
  width: auto;
  min-width: 100%;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
}

.custom-content-with-media-video-player video {
  width: 100%;
  aspect-ratio: 16 / 9;
}

.custom-content-with-media-video-player img {
  width: 100%;
}

.custom-content-with-media[data-media-style="background"]
  .custom-content-with-media-video-player
  :is(img, iframe, video) {
  min-height: 100%;
  object-fit: cover;
}

.custom-content-with-media-video-player svg {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.custom-content-with-media-video-player svg rect {
  fill: var(--color-green-fresh);
  stroke: var(--color-black);
  transition: all 0.3s ease;
}

.custom-content-with-media-video-player svg path {
  fill: var(--color-black);
}

.custom-content-with-media-video-player-button:is(:hover, :focus, :active)
  svg
  rect {
  fill: var(--color-green-vibrant);
}

.custom-content-with-media-lottie {
  width: 100%;
  height: 100%;
}

.custom-content-with-media-content {
  display: flex;
  flex-direction: column;
  row-gap: var(--row-gap);
}

.custom-content-with-media-content.animate__animated {
  animation-name: fadeInUp;
}

.custom-content-with-media-content > * {
  margin-bottom: 0;
}

.custom-content-with-media-media-wrapper p {
  font: var(--font-body-xsmall);
  font-style: italic;
  margin-bottom: 0;
  max-width: 46rem;
  pointer-events: all;
}

.custom-content-with-media-content-wrapper {
  padding: var(--row-gap) var(--page-padding) var(--block-margin);
  max-width: min(100%, calc(var(--width-limit) / 2));
}

.custom-content-with-media-title strong {
  font-weight: 400;
  color: var(--accent-color);
}

.custom-content-with-media-buttons {
  display: flex;
  flex-wrap: wrap;
  column-gap: var(--item-column-gap);
  row-gap: var(--item-row-gap);
  align-items: center;
}

.custom-content-with-media-content-wrapper .gform_wrapper {
  margin-top: 0px !important;
}

@media (min-width: 992px) {
  .custom-content-with-media {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .custom-content-with-media-media-wrapper {
    padding: var(--block-margin) var(--page-padding);
    border-bottom: none;
  }

  .custom-content-with-media[data-media-position="left"]
    .custom-content-with-media-media-wrapper {
    justify-self: end;
  }

  .custom-content-with-media[data-media-style="background"][data-media-position="right"]
    .custom-content-with-media-media {
    grid-column: 2;
  }

  .custom-content-with-media[data-media-position="right"]
    .custom-content-with-media-media-wrapper {
    border-left: 0.1rem solid var(--color-gray);
    grid-column: 2;
    grid-row: 1;
  }

  .custom-content-with-media-content-wrapper {
    padding: var(--block-margin) var(--page-padding);
  }

  .custom-content-with-media[data-media-position="left"]
    .custom-content-with-media-content-wrapper {
    border-left: 0.1rem solid var(--color-gray);
  }

  .custom-content-with-media[data-media-position="right"]
    .custom-content-with-media-content-wrapper {
    justify-self: end;
    width: 100%;
  }
}
