/*==========================================================================
  CTA Block with picture on do page
  ========================================================================== */

/**
  * CTA Picture block
  *
  */

.cta-picture-do-block
  position: relative

  .cta-picture-do
    +flex(center, center)
    +flex-direction(column)
    >*
      flex: none

    width: 100%
    height: 500px
    background:
      image: url('/img/structure/do/cycling.png')
      size: cover
      repeat: no-repeat
      position: center

  .cta-picture-sentence
    color: $white
    text-align: center
    font-size: 1.7rem
    font-family: "Coda Caption", sans-serif
    margin-bottom: 35px
    line-height: 2.5rem

  .cta-picture-button
    @extend .button-default
    color: $white
    border-color: $white

    &:hover
      background:
        color: $white
      color: $blue