/* Feature Image Content */
.image-copy {
  display: flex;
  flex-flow: column;
  justify-content: flex-start;
  align-items: stretch;
  row-gap: 2rem;
  column-gap: 4.33rem;
}

.image-copy .text-area {
  flex: 0 45%;
}

.image-copy .text-area .feat-btn {
  margin-top: 1.5rem;
}

.image-copy .hero-image {
  margin-left: calc(-1 * 1.22rem);
  margin-left: calc(-1 * var(--border-margin));
  width: calc(100% + (1.22rem * 2));
  width: calc(100% + (var(--border-margin) * 2));
  flex: 1 55%;
  position: relative;
  overflow: hidden;
}

.image-copy .hero-image::before {
  content: "";
  float: left;
  padding-top: 75%;
}

.image-copy .hero-image::after {
  content: "";
  clear: both;
  position: block;
}

.image-copy .hero-image img {
  width: 100%;
  height: 100%;
  position: absolute;
  -o-object-position: center;
  object-position: center;
  -o-object-fit: cover;
  object-fit: cover;
}

.image-copy .hero-image.no-crop img {
  height: inherit;
}

.image-copy .title {
  color: #9c3587;
  color: var(--purple-brite);
  margin-bottom: 1.8rem;
}

.image-copy p {
  line-height: 1.5;
  margin-bottom: 1.5rem;
}

.image-copy .closing {
  color: #3f1651;
  color: var(--purple-dark);
}

@media only screen and (min-width: 576px) {
  .image-copy .hero-image {
    margin: 0;
    width: auto;
  }
}

@media only screen and (min-width: 768px) {
  .image-copy {
    flex-flow: row;
  }
  .image-copy.image-right {
    flex-direction: row-reverse;
  }
}

@media only screen and (min-width: 1200px) {
  .image-copy .hero-image {
    max-height: 27rem;
  }
}