/* Keep the entire supplied photograph visible at every viewport size. */
main img { max-width: 100%; }
.pcard:hover .pcard-img img,
.mtile:hover .mtile-img img {
  transform: none;
}
.mono-av img {
  object-fit: contain;
  object-position: center;
  transform: none;
}
.how-contact-person img {
  object-fit: contain;
  flex-shrink: 0;
}
/* The caption and image both need their full height at tablet widths. */
.join-step-visual {
  height: auto;
  min-height: 360px;
}
.join-step-visual > img,
.join-step-visual > div,
.join-step-visual > span {
  flex-shrink: 0;
}
.conversation-example .example-message {
  position: static;
  order: -1;
  align-self: flex-start;
  margin: 16px 16px 0;
}
/* Intrinsic image sizing must not push the dialog controls off screen. */
.media-content { overflow: hidden; }
.media-content img { min-width: 0; min-height: 0; object-position: center; }