@use '../../sass/abstracts' as *;

#{$component-prefix}quote {
  @include headline-small;
  @include flexbox;
  overflow: auto;
  margin: 0;

  &__icon {
    display: block;
    background-color: grey;
    background: url(../../images/quote.svg) center center no-repeat;
    background-size: 100%;
    width: 40px;
    flex-basis: 40px;
    flex-grow: 0;
    flex-shrink: 0;
    height: 35px;
    margin-right: 1.5rem;
    margin-top: 5px;
  }

  &__image {
    float: left;
    width: 10%;
    margin-right: 2rem;
    margin-top: 0.25rem;
    width: 140px;
    align-self: center;

    &--round {
      @include border-radius(50%);
      img {
        @include border-radius(50%);
      }
    }

    img {
      width: 140px;
      height: 140px;
      min-width: 140px;
      object-fit: cover;
    }

    @include media-breakpoint-down(lg) {
      width: 100px;
      margin-right: 1rem;

      img {
        width: 100px;
        height: 100px;
        min-width: 100px;
        object-fit: cover;
      }
    }
  }

  &__text {
    @include headline-small;
    white-space: pre-line;
  }

  &__information,
  &__information cite a {
    @include headline-small;
    font-style: normal;
    color: $sodra-black-75;
    margin-top: 1rem;
  }

  &__information cite a {
    text-decoration: underline;
  }
}