.image-with-lines {
  position: relative;
}

.image-with-lines::before, .image-with-lines::after {
  content: '';
  display: block;
  height: 130px;
  z-index: 10;
  width: 8px;
  position: absolute;
  background-color: #F9BA5B;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  bottom: 0;
  margin-bottom: 16px;
  -webkit-margin-after: 16px;
          margin-block-end: 16px;
}

.image-with-lines::before {
  left: -4px;
}

.image-with-lines::after {
  transform: rotate(90deg) translateZ(0);
  transform-origin: bottom;
  bottom: -16px;
  left: 11px;
}

.image-with-lines img {
  border-radius: 16px;
}

.image-with-lines .image--line {
  height: 40px;
  width: 40px;
  position: absolute;
  fill: none;
  stroke: #F9BA5B;
  stroke-width: 8px;
  bottom: -8px;
  left: -8px;
  z-index: 10;
}

@media screen and (min-width: 64rem) {
  .image-with-lines::before, .image-with-lines::after {
    height: 140px;
  }
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.25), only screen and (min-device-pixel-ratio: 1.25), only screen and (-webkit-min-device-pixel-ratio: 2.0833333333333335), only screen and (min-resolution: 200dpi), only screen and (min-resolution: 1.25dppx) {
  .image-with-lines::before, .image-with-lines::after {
    max-height: 33%;
    height: 200px;
    /* Resolution-specific CSS & images */
  }
}

/*# sourceMappingURL=field-media.css.map */
