
@media all {
  img {
    max-width: 100%; }
  .image {
    margin-bottom: 1rem; } }
  @media all and (min-width: 768px) {
    .image {
      margin-bottom: 1.5rem; } }

@media all {
    .image--full-width img {
      width: 100%; }
    .image__caption {
      display: block;
      font-family: "Poppins", sans-serif;
      font-size: 0.88889rem;
      background-color: #e3eff6;
      line-height: 1.4;
      color: #3e3e3e;
      padding: 0.8em 1em; }
      .image__caption p {
        line-height: 1.4; }
        .image__caption p:last-child {
          margin-bottom: 0; }
    .image--float-right, .image--float-left, .image--float-center {
      display: table; } }
    @media all and (min-width: 576px) {
      .image--float-right, .image--float-left, .image--float-center {
        margin-bottom: 0; } }
    @media all and (min-width: 576px) {
      .image--float-right, .image--float-left, .image--float-center {
        margin-bottom: 2em; } }

@media all {
      .image--float-right .image__caption, .image--float-left .image__caption, .image--float-center .image__caption {
        display: table-caption;
        caption-side: bottom;
        margin-top: -1px; } }
  @media all and (min-width: 576px) {
    .image--float-right {
      max-width: 45%;
      float: right;
      margin-left: 2em; } }
  @media all and (min-width: 576px) {
    .image--float-left {
      max-width: 45%;
      float: left;
      margin-right: 2em; } }
  @media all and (min-width: 576px) {
    .image--float-center {
      max-width: 45%;
      margin-left: auto;
      margin-right: auto;
      clear: both; } }

@media all {
  figure.image {
    display: table; } }

