&.content-block
  position: relative
  +flex(space-between, flex-start)

  .image

    .image-placeholder
      position: relative
      width: 100%
      height: 0
      padding-bottom: 66.67%

      span
        position: absolute
        width: 100%
        height: 100%
        background-position: center
        background-size: cover
        display: none

  &[data-size-type='66']
    .image
      width: column(13, 22)

      .image-placeholder
        span
          &.medium
            display: block

        +respond-to-width(1200)
          span
            &.medium
              display: none
            &.small
              display: block

    .content
      width: column(8, 22)

    +respond-to-width(900)
      display: block

      .image
        margin-top: 40px
        +order(2)
        width: 100%

        .image-placeholder
          span
            &.medium
              display: block
            &.small
              display: none

          +respond-to-width(450)
            span
              &.medium
                display: none
              &.small
                display: block

      .content
        +order(1)
        width: 100%

  &[data-size-type='50']

    .image
      width: column(21, 44)

      .image-placeholder
        span
          &.medium
            display: block

        +respond-to-width(1200)
          span
            &.medium
              display: none
            &.small
              display: block

    .content
      width: column(21, 44)

    +respond-to-width(900)
      display: block

      .image
        margin-top: 40px
        +order(2)
        width: 100%

        .image-placeholder
          span
            &.medium
              display: block
            &.small
              display: none

          +respond-to-width(450)
            span
              &.medium
                display: none
              &.small
                display: block

      .content
        +order(1)
        width: 100%


  &[data-size-type='33']
    .image
      width: column(8, 22)

      .image-placeholder
        span
          &.medium
            display: block

        +respond-to-width(1500)
          span
            &.medium
              display: none
            &.small
              display: block

    .content
      width: column(13, 22)

    +respond-to-width(900)
      display: block

      .image
        margin-top: 40px
        +order(2)
        width: 100%

        .image-placeholder
          span
            &.medium
              display: block
            &.small
              display: none

          +respond-to-width(450)
            span
              &.medium
                display: none
              &.small
                display: block

      .content
        +order(1)
        width: 100%


  &[data-image-location='left']
    .image
      +order(1)

    .content
      +order(2)