.list-row
  background: $blue
  position: relative
  padding: 80px 0 100px

  .icon-background
    position: absolute
    height: 100%
    width: 100%
    top: 0
    background: url("/images/structure/backgroundBlue.svg") 0 0 no-repeat
    background-size: 100% 120%
    background-position: 50% 50%

  .list-block
    width: $contentGrid*3

    .first-block
      background: white
      width: calc(100% - 110px)
      padding: 45px 45px 45px 65px
      margin-top: -245px
      position: relative

      h2
        +font-light(28px, 28px)
        color: $blue
        margin-bottom: 30px

      p
        color: $orange
        +font-bold(16px, 22px)
        width: 80%
        margin: 0 0 22px 0

      hr
        border-top: 1px solid #E6E6E6
        border-left: none
        border-right: none
        border-bottom: none

      ul
        margin: 25px 0 5px 0
        padding: 0
        list-style: none

        &.scroll-animation
          li
            +transform(translate3d(20px, 0, 0))
            opacity: 0

        li
          color: $gray
          +font-default(16px, 22px)
          margin-bottom: 20px
          position: relative
          +transform(translate3d(0, 0, 0))
          opacity: 1
          +transition(all 0.5s)

          &:nth-of-type(2)
            +transition-delay(0.1s)
          &:nth-of-type(3)
            +transition-delay(0.2s)
          &:nth-of-type(4)
            +transition-delay(0.3s)
          &:nth-of-type(5)
            +transition-delay(0.4s)

          &:before
            position: absolute
            content: ''
            +check
            left: -25px
            top: 7px


    .second-block
      background: white
      position: relative
      top: 20px
      width: 100%

      &:hover
        a
          .icon-circle
            background: $blue

            span
              background-position: -180px 0

      &:before
        content: ''
        width: 0
        height: 0
        border-left: 12px solid transparent
        border-right: 12px solid transparent
        border-bottom: 12px solid white
        position: absolute
        top: -12px
        left: calc( 50% - 6px)

      a
        margin-left: auto
        margin-right: auto
        width: 100%

      a, p
        +font-bold(20px, 24px)
        color: $blue
        +flex(center, center)
        cursor: pointer


        .icon-circle
          border-radius: 9999px
          border: 2px solid $blue
          +flex(center, center)
          width: 32px
          height: 32px
          margin-right: 10px
          +transition(background 0.3s)

          span
            +phoneBlue
            +transition(background-position 0.3s)

    .shadow
      position: absolute
      width: 100%
      height: 45px
      background: url("/images/structure/dropshadow.png")
      background-size: contain
      background-repeat: no-repeat
      bottom: -45px
      left: 0
      pointer-events: none

.continue
  position: absolute
  width: 40px
  left: calc(50% - 20px)
  bottom: -20px
  z-index: 10

  a
    +flex(center, center)
    width: 40px
    height: 40px
    border-radius: 9999px
    background: $orange

    box-shadow: 0 2px 5px rgba( 0,0,0, 0.2)


  span
    +downArrow
    margin-top: 3px

+media-query-height(700px)
  .list-row
    .information.grid3
      width: $contentGrid*8

    .list-block
      margin-top: 40px
      margin-left: $contentGrid*3
      width: $contentGrid*8

      .first-block
        margin-top: 0

+media-query(1100px)
  .list-row
    .information.grid3
      width: $contentGrid*8

    .list-block
      margin-top: 40px
      margin-left: $contentGrid*3
      width: $contentGrid*8

      .first-block
        margin-top: 0

+media-query(550px)
  .list-row
    .information.grid3
      margin-left: $contentGrid*2
      width: $contentGrid*10

    .list-block
      margin-left: $contentGrid
      width: $contentGrid*12

      .second-block
        p
          line-height: 40px

+media-query(515px)
  .list-row
    .list-block
      .first-block
        h2
          +font-light(34px, 34px)

        p
          +font-bold(21px, 28px)

        ul
          li
            +font-default(18px, 24px)