.discover-row
  position: relative
  padding: 70px 0 120px
  overflow: hidden

  .streamer
    color: $agrimacGreen
    font-size: 0.65rem
    font-weight: semi-bold()
    text-transform: uppercase
    margin: 0 0 35px

  .links
    position: relative
    z-index: 2
    +flex(center, flex-start)
    overflow: visible
    box-shadow: 0px 0px 40px 0px rgba(0,0,0,0.2)
    background-color: $agrimacBlue

    article
      position: relative
      //width: 25%
      width: calc(100% / 3)

      a
        text-decoration: none

      picture
        width: 100%
        img
          width: 100%


      .overlay
        position: absolute
        top: 0
        left: 0
        width: 100%
        height: 100%

        h4
          position: absolute
          left: calc(100% - 25px)
          bottom: 30px
          width: 100%
          max-width: 300px
          font-size: 2.5rem
          line-height: 1.2
          color: white
          font-weight: bold()

          transform-origin: 0 100%
          transform: rotate(270deg)

          +respond-to-width(800)
            font-size: 2rem

          +respond-to-width(450)
            font-size: 1.5rem
            max-width: 230px

        .arrow-placeholder
          position: absolute
          top: 0
          left: 0
          width: 100%
          height: 100%
          background: $agrimacGreen
          +flex(center, center)
          opacity: 0
          transition: opacity 0.4s

          span
            display: block
            width: 45px

            svg
              width: 100%
              transform-origin: center
              transform: rotate(270deg)

              &.arrow-icon
                .st0
                  fill: white

      &:hover
        .overlay
          .arrow-placeholder
            opacity: 1


    +respond-to-width(1000)
      +flex-rows

      article
        width: 50%

      &:after
        content: ''
        display: block
        width: 50%
        height: 10px



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

      &:after
        display: none

      article
        width: 100%

        .overlay
          h4
            transform: rotate(0deg)
            left: 30px
            bottom: 25px