.c-quote-block {
  margin: 4.5rem auto 3rem;
  position: relative;
  text-align: left;

  @media all and (min-width: 70em) {
    padding: 0;
  }

  &::before {
    background-repeat: no-repeat;
    background-size: 100% auto;
    color: var(--color-quote-block);
    content: '';
    display: inline-block;
    height: 55px;
    left: 50%;
    position: absolute;
    top: -30px;
    transform: translateX(-50%);
    width: 55px;
    z-index: 1;
  }

  &:last-child {
    margin-bottom: 0;
  }

  .c-quote-block__content {
    margin: 0 auto;
    border-top: 1px solid #d7d7d8;
    border-bottom: 1px solid #d7d7d8;
    border-left: none;
    /* padding: 30px 2rem 75px; */
    padding: 2rem 1rem;
    width: 100%;
    text-align: center;

    @media all and (min-width: 47em) {
      display: flex;
      flex-direction: column;
      flex-wrap: wrap;
      max-width: none;
      padding: 2.25rem;
    }

    @media all and (min-width: 60em) {
      padding: 3.75rem;
    }

    .c-quote-block__quote {
      color: var(--color-neutral-gray-70);
      display: block;
      font-size: var(--font-size-med);
      font-style: italic;
      line-height: 1.4;
      margin-bottom: 15px;
      text-align: center;

      @media all and (min-width: 47em) {
        font-size: var(--font-size-med);
        margin-bottom: auto;
      }

      @media all and (min-width: 60em) {
        font-size: 20px;
      }
    }

    .c-quote-block__author {
      color: var(--color-quote-block-author);
      display: block;
      font-style: normal;
      font-weight: bold;
      margin: 50px 0 0;
      text-align: center;
      font-weight: 700;

      /* &::before {
      //   content: '- ';
      // }*/

      @media all and (min-width: 47em) {
        font-size: var(--font-size-med);
        margin-bottom: auto;
      }

      @media all and (min-width: 60em) {
        font-size: 20px;
      }
    }

    .c-quote-block__author-title {
      color: var(--color-quote-block-author-title);
      text-align: center;
      font-weight: 400;
      margin-top: -5px;

      @media all and (min-width: 60em) {
        font-size: 20px;
      }
    }
  }

  &.bg-gray {
    background: #F4F4F4;

    .c-quote-block__content {
      border-top: 0;
      border-bottom: 0;
    }
  }

  &.bg-bold {

    &::before {
      content: '';
      background-repeat: no-repeat;
      background-size: 100% auto;
      color: var(--color-quote-block-bold-before);
      display: inline-block;
      height: 55px;
      left: 45px;
      position: absolute;
      top: -30px;
      transform: translateX(-50%);
      width: 55px;
      z-index: 1;

      @media all and (min-width: 47em) {
        left: 65px;
      }

      @media all and (min-width: 60em) {
        left: 90px;
      }
    }

    .c-quote-block__content {
      border-top: 0;
      border-bottom: 0;
      text-align: left;

      .c-quote-block__quote {
        font-weight: 700;
        font-style: normal;
        border-bottom: 3px solid var(--color-quote-block-content);
        padding-bottom: 30px;
        text-align: left;
      }

      .c-quote-block__author {
        color: #6E6F72;
        text-align: left;
        margin: 30px 0 0;
      }

      .c-quote-block__author-title {
        color: #6E6F72;
        text-align: left;
      }
    }
  }
}