.cta-row
  position: relative

  .background
    position: absolute
    width: 100%
    height: 100%
    top: 0
    left: 0
    background-color: white

    &:after
      content: ''
      position: absolute
      width: 50%
      height: 100%
      top: 0
      right: 0
      background: $broosDarkBlue

  .grid-row
    position: relative
    z-index: 2
    +flex(center, center)
    height: 380px

  .cta-trigger, .contact-info
    h3
      color: $broosDarkBlue
      font-size: 2rem
      margin: 0 0 10px

    p
      color: $broosDarkBlue
      font-size: 0.65rem
      text-transform: uppercase
      margin: 0

    .button
      margin-top: 60px
      padding: 18px 25px

  .cta-trigger
    padding: 10px 0
    width: 50%
    height: 100%
    display: flex
    align-items: center

    .placeholder
      width: column(4, 6)
      margin-left: column(2, 6)
      text-align: left

      +respond-to-width(1500)
        margin-left: column(1, 6)
        width: column(5, 6)

      +respond-to-width(1250)
        margin-left: 0
        width: 100%

  .contact-info
    width: 50%
    padding-left: column(0.9, 12)
    +flex(flex-start, center)

    h3
      color: white
      font-family: secondFont()
      font-size: 1.3rem

    p
      color: white
      text-transform: none
      font-weight: semi-bold()
      font-size: 1rem
      a
        color: $broosYellow
        text-decoration: none

    .button
      background-color: $agrimacGreen

    .person
      margin-right: column(0.5, 12)
      .image-placeholder
        figure
          width: 150px
          height: 150px
          border-radius: 50%
          background-image: url("/img/contact-person.jpg")
          background-size: cover
          background-position: top center



  +respond-to-width(950)
    .background
      display: none

    .grid-row
      height: auto
      display: block
      width: 100%

    .cta-trigger
      z-index: 3
      width: 100%
      padding: 50px column(1, 12)
      background-color: $broosBlue

    .contact-info
      z-index: 3
      width: 100%
      padding: 50px column(1, 12)
      background-color: $broosDarkBlue

  +respond-to-width(625)
    .person
      width: 100%
      figure
        width: 280px
        margin-left: auto
        margin-right: auto