.text-block {
  @extend %flexbox-column;
}

.tui-text-block-two-column {
  @extend %flexbox-column;

  @include breakpoint(sm) {
    flex-direction: row;
  }
}

.percent-70,
.percent-50,
.percent-30 {
  position: relative;
  min-height: 1px;

  @include breakpoint(sm) {
    padding: 0 $margin-normal;

    &:first-child {
      padding-left: 0;
    }

    &:last-child:not(:first-child) {
      padding-right: 0;
    }
  }
}

.percent-70 {
  @include breakpoint(sm) {
    width: 70%;
  }
}

.percent-50 {
  @include breakpoint(sm) {
    width: 50%;
  }
}

.percent-30 {
  @include breakpoint(sm) {
    width: 30%;
  }
}