.image-with-alignment {
  margin-bottom: 1.25rem; }
  .image-with-alignment:before, .image-with-alignment:after {
    content: " ";
    display: table; }
  .image-with-alignment:after {
    clear: both; }
  @media (min-width: 37.5em) {
    .image-with-alignment {
      margin-left: -7.69231%;
      width: 115.38462%; } }
  @media (min-width: 62em) {
    .image-with-alignment {
      margin-left: -8.69565%;
      width: 117.3913%; } }
  .image-with-alignment__caption {
    font-size: 0.7rem;
    color: #777277;
    line-height: 1.25; }
    @media (min-width: 37.5em) {
      .image-with-alignment__caption {
        font-size: 0.75rem; } }
    @media (min-width: 62em) {
      .image-with-alignment__caption {
        font-size: 0.8rem; } }
  @media (min-width: 37.5em) {
    .image-with-alignment.left {
      float: left;
      margin-bottom: 0.625rem;
      margin-left: -7.69231%;
      margin-right: 7.69231%;
      max-width: 50%; } }
  @media (min-width: 62em) {
    .image-with-alignment.left {
      margin-left: -8.69565%;
      margin-right: 8.69565%; } }