.dealers
  .dealers-row
    padding: 80px 0
    background-color: $agrimacDarkBlue

    h1
      color: white
      font-size: 2rem
      line-height: 1.4

    .overview
      padding: 60px 0 0

      +flex(space-between, flex-start)
      +flex-rows

      article
        margin: 0 15px 60px
        background-color: white
        padding: 25px 20px
        border-bottom: 10px solid $agrimacBlue

        &:first-of-type
          background-color: $agrimacBlue
          border-bottom-color: $agrimacGreen
          .content
            h3, p
              color: white

        .ie &
          width: 30%

          +respond-to-width(1150)
            width: 45%

          +respond-to-width(700)
            width: 100%
            max-width: 400px

        +flex(flex-start, flex-start)

        .icon
          width: 28px

          img
            width: 100%
            max-width: 38px

        .content
          display: block
          width: 100%
          padding: 0 20px

          h3
            margin: 0
            font-size: 0.8rem
            line-height: 1.4
            font-weight: bold

          p
            margin: 0
            font-size: 0.8rem
            line-height: 1.4

        +respond-to-width(480)
          margin: 0 0 30px

      @supports (display: flex)
        display: grid
        grid-template-columns: 1fr 1fr 1fr
        grid-gap: 60px 60px
        margin-bottom: 60px

        article
          margin: 0
          height: 100%


        +respond-to-width(1700)
          grid-gap: 30px 30px

        +respond-to-width(1500)
          grid-gap: 60px 60px
          grid-template-columns: 1fr 1fr

        +respond-to-width(950)
          grid-gap: 30px 30px

        +respond-to-width(840)
          display: block
          max-width: 520px
          margin-left: auto
          margin-right: auto
          article
            margin-bottom: 30px