.image-block {
  position: relative;
  margin: 50px 0;
  padding: 0 $gutter;

  @include sm {
    margin: 30px 0;
    padding: 0;
  }

  &--full {
    padding: 0;
  }

  &__container {
    max-width: $text-width-medium;
    margin: auto;

    .image-block--small & {
      max-width: $text-width-small;
    }

    .image-block--large & {
      max-width: $text-width-large;
    }

    .image-block--full & {
      max-width: 100%;
    }
  }

  .simple-image__image {
    display: flex;
    justify-content: center;

    .image-block--full & {

    }
  }

  img {
    display: block;
    max-height: 768px;
    object-fit: contain;
  }

  &.image-block--full {
    .simple-image__image {
      width: 100%;
    }

    img {
      width: 100%;
      object-fit: cover;
    }
  }

  &__caption {
    margin: 16px 0 24px;
    padding: 0 6%;
    text-align: center;
    color: $primary-color;

    p {
      margin: 0;
      font-size: 1.4rem;
      line-height: 2rem;
    }
  }
}