.specifications
  position: relative
  padding: 120px 0
  background-color: $offsetWhite
  overflow: hidden

  &:before
    content: ''
    position: absolute
    z-index: 1
    left: 0
    top: 0
    width: 100%
    height: 300px
    background-color: $agrimacBlue

    +respond-to-width(750)
      height: 225px
    +respond-to-width(400)
      height: 150px


  .specs-rows
    position: relative
    z-index: 3

    .spec-list
      width: column(4, 12)
      margin-left: column(1, 12)
      background-color: white
      box-shadow: 0 0 40px 0px rgba(3,54,60,0.2)

      h2
        padding: 30px 40px
        color: $agrimacGreen
        font-size: 1.2rem
        line-height: 1.2
        font-weight: bold()

      .table
        position: relative

        &:after
          content: ''
          position: absolute
          left: 199px
          top: 0
          width: 2px
          height: 100%
          background-color: #e3e6e2

      .row
        +flex(flex-start, flex-start)

        &:nth-child(odd)
          background-color: $offsetWhite

        span, p
          padding: 15px 10px 15px 40px
          font-size: 0.7rem
          line-height: 1.2
          color: $agrimacDarkBlue

        span
          display: block
          width: 200px
          font-weight: semi-bold()

        p
          margin: 0
          width: calc(100% - 200px)

    figure
      position: absolute
      right: column(-1, 12)
      top: 0
      width: column(7, 12)
      height: 100%

      span
        position: absolute
        display: block
        width: 100%
        height: 100%
        background:
          size: cover
          position: center

        &.medium
          display: none

      img
        display: none
        width: 100%

  .blueprint-form
    margin-top: 120px
    +flex(flex-start, flex-start)

    .blueprint
      margin-left: column(1, 12)
      width: column(6.5, 12)


      img
        width: 100%

        &.medium
          display: none


        +respond-to-width(600)
          &.large
            display: none

          &.medium
            display: block

    .small-offer-form
      margin-left: column(1, 12)
      width: column(3.5, 12)
      background-color: white
      padding: 40px

      h3
        margin: 0 0 15px
        font-size: 0.9rem
        line-height: 1.2
        color: $agrimacDarkBlue

      >p
        font-size: 0.7rem
        line-height: 1.4
        color: $agrimacBlue

      .form
        padding: 20px 0 0

      .submit
        text-align: right

        .button
          background-color: $agrimacGreen
          color: white
          border-radius: 5px
          font-size: 0.7rem
          font-weight: semi-bold()
          text-transform: uppercase

          &:after
            border-radius: 5px

  +respond-to-width(1600)
    .specs-rows
      .spec-list
        margin-left: 0
        width: column(5, 12)

    .blueprint-form
      .blueprint
        margin-left: 0
        width: column(7.5, 12)

  +respond-to-width(1300)
    .specs-rows
      .spec-list
        margin-left: column(2, 12)
        width: column(8, 12)

      figure
        position: relative
        right: 0
        margin-top: 80px
        width: column(10, 12)
        margin-left: column(1, 12)

        span
          display: none

        img
          &.large
            display: block

          +respond-to-width(600)
            &.large
              display: none

            &.medium
              display: block

    .blueprint-form
      display: block
      margin-top: 80px

      .blueprint
        width: column(10, 12)
        margin-left: column(1, 12)

      .small-offer-form
        margin-top: 80px
        margin-left: column(2, 12)
        width: column(8, 12)

  +respond-to-width(1000)
    .specs-rows
      .spec-list
        margin-left: 0
        width: 100%

      figure
        width: 100%
        margin-left: 0

    .blueprint-form
      .blueprint
        width: 100%
        margin-left: 0

  +respond-to-width(650)
    .blueprint-form
      .small-offer-form
        margin-top: 80px
        margin-left: 0
        width: 100%