.category-row
  .placeholder
    position: relative
    background-color: $flatOrange


  .list
    width: 50%
    padding: 50px 0 86px

    .return-to-overview
      +flex(flex-start, center)
      padding: 0 20px 0 45px
      margin-bottom: 80px
      color: white
      text-decoration: none
      opacity: 0.6
      line-height: 1
      transition: opacity 0.3s

      +respond-to-width(1050)
        font-size: 0.9rem

      span
        +flex(center, center)
        margin-right: 10px
        width: 22px
        height: 22px
        border-radius: 5px
        border: 1px solid white

        &:before
          content: ''
          display: inline-block
          +sprite(-33px -75px, 12px, 12px)

      &:hover
        opacity: 1

    p
      font-weight: semi-bold()
      font-size: 1.1rem
      line-height: 1.2
      color: white
      padding: 0 30px 0 45px

    ul
      padding: 0 18px
      list-style: none

      li
        border-bottom: 1px solid rgba(white, 0.4)
        padding-left: 27px
        line-height: 1

        a
          +flex(space-between, center)
          padding: 14px 36px 14px 0
          padding-right: 36px
          text-decoration: none
          color: white
          opacity: 0.75
          transition: opacity 0.3s

          span
            position: relative
            bottom: -2px
            display: inline-block
            margin-left: 15px
            +sprite(-33px -90px, 5px, 8px)
            transition: transform 0.3s
            +translate3d(0,0,0)

          &:hover
            opacity: 1

            span
              +translate3d(8px, 0, 0)


  figure
    position: absolute
    width: 50%
    height: 100%
    top: 0
    right: 0
    background:
      size: cover
      repeat: no-repeat
      position: center
      image: url("/img/grafkerk.jpg")

    span
      position: absolute
      display: block
      width: 100%
      height: 100%
      top: 0
      left: 0
      background:
        size: cover
        repeat: no-repeat
        position: center
        image: url("/img/grafkerk.jpg")

  +respond-to-width(860)
    .list
      width: 100%
      padding: 50px 0 30px

      .return-to-overview
        margin-bottom: 60px

    figure
      display: none
      position: relative
      width: 100%
      height: 0
      padding-bottom: 66.667%

      span
        display: block

  +respond-to-width(450)
    .list
      .return-to-overview
        margin-bottom: 30px