.cta-bg-colored
  background:
    color: $purple

.call-to-action-block
  padding: 50px 0
  +flex(center, center)

  .call-to-action-content
    padding: $paddingSmallTextBlock
    //border-right: 2px solid $primaryColor
    h3
      margin: 0
      color: $white
    p
      margin: 0
      color: $white

  .call-to-action-button
    +flex(center, center)
    +font-semi-bold(18px, 22px)
    width: 100%
    max-width: 250px
    height: 50px
    transition: background 0.4s, color 0.2s, transform 0.5s
    background:
      color: $white
    color: $purple
    transform-origin: left
    transform: scale(1)
    +border-bottom-radius(50px)
    +border-top-radius(50px)

    &:hover
      cursor: pointer
      background:
        color: $secondaryColor
      color: $white
      transform: scale(1.04, 1.04)

  +respond-to-width(700)
    flex-direction: column

    .call-to-action-content
      border: 0
      padding: $paddingSmallTextBlock / 2