.two-text-columns
  padding: 0 0 45px
  .content-container
    position: relative
    z-index: 10
    +flex(center, flex-start)
    .left-content, .right-content
      background: white
      width: calc(50% - 20px)
      padding: 0
      h1, h2
        text-align: left
        +font-bold(20px, 28px)
        font-size: 18px
        line-height: 24px
        color: $orange
      p, em, span
        +font-light(18px, 24px)
        font-size: 16px
        line-height: 22px
        color: $lightBlue
        a 
          +font-light(18px, 24px)
          font-size: 16px
          line-height: 22px
          color: $orange
        strong
          +font-default(18px, 24px)
          font-size: 16px
          line-height: 21px
          color: $darkBlue
        a
          text-decoration: underline
      ul
        list-style: none
        padding-left: 20px
        margin-top: 20px
        margin-bottom: 0
        li
          position: relative
          color: $orange
          +font-default(18px, 24px)
          font-size: 16px
          line-height: 24px
          margin-bottom: 5px
          &:before
            content: ''
            +sprite(-443px 0, 16px, 12px)
            display: inline-block
            position: absolute
            left: -23px
            top: 6px
    .left-content
      margin-right: 19px
      &.content66
        width: calc(100% / 3 * 2 - 20px)

      &.content50
        width: calc(100% / 2 - 20px)

      &.content33
        width: calc(100% / 3 - 20px)
    .right-content
      margin-left: 19px
      &.content66
        width: calc(100% / 3 - 20px)

      &.content50
        width: calc(100% / 2 - 20px)

      &.content33
        width: calc(100% / 3 * 2 - 20px)


+media-query(650px)
  .two-text-columns
    .content-container
      display: block
      .left-content, .right-content
        width: 100% !important
        margin: 0

      .left-content
        margin-bottom: 40px