.swagger-col {
  width: 100%;
  flex-basis: 100%;
  font-weight: 300;
  box-sizing: border-box;
  padding: 2*$p-base--vertical;

  &--left {
    padding: 2*$p-base--vertical 0;

    @include respond-to('medium') {
      padding: 4*$p-base--vertical;
    }
  }

  &--right {
    color: $fsc-swagger_contrast;
    background-color: $bgc-swagger_contrast;
  }

  @include respond-to('medium') {
    flex-basis: 50%;
    flex-shrink: 1;
    width: 50%;
    padding: 4*$p-base--vertical;
  }
}
