@import '~bootstrap-sass/assets/stylesheets/bootstrap/variables';
@import '../../themes/common-variables.scss';
@import '../../themes/media-queries.scss';
@import '../../themes/font-mixins.scss';

@include mq($min-width: $screen-sm-min) {
}

@include mq($max-width: $screen-xs-max) {
}

$red: $harley-davidson-orange;
.block-quotation-container {
  background-color: $white;
  padding: rem(24px) rem(24px) rem(24px) rem(24px);

  .block-quotation {
    font-size: rem(24px);
    line-height: 1.5;
    font-weight: $font-weight-normal;
    white-space: pre-wrap;
  }

  .block-quotation-by {
    margin-top: rem(50px);
    font-size: rem(15px);
    line-height: 1.5;
    position: relative;

    &::before {
      content: "";
      color: $red;
      width: rem(24px);
      margin: auto;
      left: 0;
      right: 0;
      top: rem(-24px);
      border-top: 1px solid;
      position: absolute;
    }
  }
}


.blockquote {
  font-style: italic;
  padding-left: rem($font-size-base);
  border-left: 2px solid $blockquote-gray;
  line-height: 1.85;
  font-size: $font-size-base;
  font-weight: $font-weight-normal;
  white-space: normal;
  color: $gray-50;
}