.machine-park-tables
  position: relative
  z-index: 4
  padding: calc(100vw / 12) 0
  background-color: white

  +respond-to-width-beyond(1440)
    padding: 120px 0

  .grid-row

    .company-machines-wrapper
      padding-bottom: calc(100vw / 12)

      +respond-to-width-beyond(1440)
        padding-bottom: 120px

      &:last-child
        padding-bottom: 0

      + .company-machines-wrapper
        border-top: 1px solid rgba($brown, 0.5)
        padding-top: calc(100vw / 12)

        +respond-to-width-beyond(1440)
          padding-top: 120px

      .company-logo
        display: block
        margin: 0 0 80px column(1, 12)
        +respond-to-width(1500)
          margin-left: 0

      &#rols-machineonderdelen
        .company-logo
          +sprite(1px 110px, 151px, 51px)


      &#vdb-machinefabriek
        .company-logo
          +sprite(1px 55px, 131px, 50px)

      &#jansen-machining-technology
        .company-logo
          width: 250px
          height: 53px
          background-image: url("/img/full-logo_jansen.png")

      &#job-precision
        .company-logo
          width: 250px
          height: 106px
          background-image: url("/img/logo_job-precision.png")


    article
      padding: 0 column(1, 12)

      + article
        margin-top: calc(100vw / 12)

        +respond-to-width-beyond(1440)
          margin-top: 120px


      h2
        margin: 0 0 60px
        font-size: 1.6rem
        line-height: 1.4
        color: $black

      table
        width: 100%
        td, th
          font-size: 0.9rem
          line-height: 1.1
          text-align: left

        *[data-column="max-bar-capacity"]
          width: 100px

        *[data-column="units"]
          width: 70px

        thead
          th
            padding: 0 5px 45px
            color: $black
            vertical-align: bottom

            &:first-child
              padding-left: 0

            &:last-child
              padding-right: 0

        tbody
          td
            padding: 25px 5px
            border-top: 1px solid rgba($brown, 0.2)
            color: $brown
            vertical-align: top

            .type-label
              display: none

            &:first-child
              padding-left: 0

            &:last-child
              padding-right: 0

      +respond-to-width(1500)
        padding: 0

  +respond-to-width(700)
    padding: 80px 0
    .grid-row
      width: calc(100% - 40px)

      .company-machines-wrapper
        padding-bottom: 80px


        &:last-child
          padding-bottom: 0

        + .company-machines-wrapper
          padding-top: 80px

        .company-logo
          margin-bottom: 40px

      article
        + article
          margin-top: 50px

        h2
          font-size: 1.4rem
          margin-bottom: 5px

        table
          display: block

          thead
            display: none

          tbody
            display: block

            tr
              display: block
              padding: 15px 0

              + tr
                border-top: 1px solid rgba($brown, 0.2)

            td
              +flex(flex-start, flex-start)
              width: 100% !important
              border-top: none
              padding: 0

              + td
                margin-top: 8px

              .type-label
                display: inline-block
                width: 150px

              span
                width: calc(100% - 150px)

              +respond-to-width(350)
                .type-label
                  width: 125px

                span
                  width: calc(100% - 125px)