.gugler_highlight {
  background-color: var(--bs-primary);
  position: relative;
  .container {
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    column-gap: 2em;
    row-gap: 1em;
    margin: 2em auto 4em;
    @media screen and (max-width: 991px) {
      margin: 2em auto;
    }
  }
  img {
    border-radius: 10em;
    width: 14em;
    height: 14em;
    aspect-ratio: 1/1;
    object-fit: cover;
    margin: -2em 0;
    &:last-child {
      width: 10em;
      height: 10em;
      object-fit: contain;
      background-color: white;
      border: 1px solid var(--bs-theme);
      @media screen and (max-width: 991px) {
        order: 2;
        margin: 2em 0 0 -4em;
        border: none;
      }
    }
  }
  a {
    &:after {
      content: "";
      display: block;
      width: 100%;
      height: 100%;
      position: absolute;
      top: 0;
      left: 0;
      z-index: 2;
    }
  }
  .content {
    text-align: center;
    max-width: 40em;
    width: calc(100% - 14em - 10em - 2em - 2em);
    @media screen and (max-width: 991px) {
      width: 100%;
      order: 3;
      margin-bottom: 1em;
    }
  }
}
