.search
  .page-impression
    .link-block
      +flex(center, center)
      height: 180px
      width: column(6, 8)
      text-decoration: none
      color: white
      font-weight: bold()
      font-size: 1.2rem
      line-height: 1.4
      text-align: center
      transition: background-color 0.3s

      p
        margin: 0

      span
        font-size: 0.9rem
        font-weight: regular()
        opacity: 0.7

        &:after
          content: ''
          +arrowWhite
          +translate3d(0,0,0)
          margin-left: 15px
          transition: transform 0.3s
      &:hover
        span:after
          +translate3d(5px,0,0)


    .faq-block
      background-color: $yellowOrange
      margin-bottom: 60px
      &:hover
        background-color: lighten($yellowOrange, 10%)

    .sitemap-block
      background-color: $pink
      &:hover
        background-color: darken($pink, 5%)

  .main
    .content
      h1
        margin: 60px 0 10px

      #inline-search-form
        position: relative
        width: 100%
        height: 50px
        margin-top: 20px
        margin-bottom: 20px
        background-color: transparent
        transition: background-color 0.5s, width 0.5s

        input
          position: relative
          width: 100%
          padding-left: 20px
          padding-right: 120px
          height: 60px
          font-size: 1rem
          color: $darkBlue
          +appearance(none)
          background-color: $lighterGray
          border: none
          border-radius: 30px

          &:focus
            outline: none

          &:-webkit-autofill, &:-webkit-autofill:hover, &:-webkit-autofill:focus, &:-webkit-autofill:active
            transition: 9999s background-color
            -webkit-text-fill-color: $darkBlue
            transition-delay: 9999s

          +placeholder
            color: $darkBlue

          &[type=submit]
            display: none

        .submit-button
          position: absolute
          right: 0
          top: 0
          +flex(center, center)
          width: 120px
          height: 60px
          cursor: pointer
          color: white
          border-radius: 0 30px 30px 0
          font-weight: bold()
          transition: opacity 0.3s, background-color 0.3s

          &:after
            content: ''
            +arrowWhite
            margin-left: 20px
            +translate3d(0,0,0)
            transition: transform 0.3s

          background-color: $blue

          &:hover
            background-color: darken($blue, 10%)

            &:after
              +translate3d(5px,0,0)

      p
        margin: 0
        font-size: 1.05rem
        color: $blue

        span
          font-weight: bold()

          &.amount
            font-size: 1.2rem
            font-weight: regular()

      .search-results
        margin-top: 75px

        h2
          color: $darkBlue
          font-size: 1.05rem
          font-weight: bold()
          margin-bottom: 45px

        ul
          padding-left: 0
          li
            position: relative
            padding: 0
            background-color: darken(white, 5%)
            transition: background-color 0.3s

            &:before
              display: none

            &:after
              content: ''
              display: inline-block
              position: absolute
              top: 24px
              right: 20px
              +arrowDarkBlue
              +translate3d(0, 0, 0)
              transition: transform 0.3s

            a
              display: block
              padding: 15px 20px
              border-bottom: none

              span
                font-size: 0.65rem 
                font-weight: bold

            &:hover
              background-color: darken(white, 7.5%)
              &:after
                +translate3d(5px, 0, 0)

            &:nth-child(even)
              background-color: transparent

              &:hover
                background-color: darken(white, 2.5%)

      .cantFindSitemap
        margin: 80px 0 160px
        h4
          color: $darkBlue
          font-size: 0.9rem
          font-weight: semi-bold()

        p
          font-size: 0.9rem
          color: $darkGray

        .button
          margin-top: 15px

  &[class^="vso"]
    .main
      .content
        #inline-search-form
          input
            color: $darkTurquoise
            +placeholder
              color: $darkTurquoise

          .submit-button
            background-color: $brightTurquoise
            &:hover
              background-color: darken($brightTurquoise, 12%)
        .search-results
          h2
            color: $darkTurquoise

        .cantFindSitemap
          h4
            color: $darkTurquoise