/*==========================================================================
  Contact page
  ========================================================================== */
.search
  .search-header
    width: 100%
    position: relative

    h1
      color: #2D323C
      font-size: 26px
      font-weight: 600
      line-height: 41px
      margin-top: 15px
      margin-bottom: 30px
      width: 80%
      display: inline-block

    a.button
      display: inline-block
      position: absolute
      right: 0
      margin-top: 15px

  .search-content
    width: 100%
    background-color: white
    box-shadow: 2px 2px 15px 5px rgba(22, 57, 95, 0.05)
    padding: 30px

    > .grid-row
      width: 100%
      > .grid-col
        width: 100%

        .type
          width: 100%

          h2
            color: #3C414B
            font-size: 20px
            font-weight: 600
            line-height: 32px
            margin-top: 0

          hr
            display: block
            height: 1px
            border: 0
            border-top: 1px solid #E0E1E3
            margin-top: 15px
            padding: 0

          h3
            color: #696E78
            font-size: 15px
            font-weight: 600
            line-height: 24px
            text-transform: uppercase

          ul
            margin: 0
            margin-bottom: 45px
            padding: 0

            li
              color: #696E78
              font-size: 16px
              line-height: 24px
              width: 100%
              +flex(space-between, flex-start)
              border-bottom: 1px solid #E0E1E3

              a.button
                width: 100%
                padding: 7.5px 0
                border-radius: 0
                border-bottom: none

                h2
                  margin: 0

                &:hover
                  background-color: darken(white, 5%)
                  box-shadow: none
                  transform: none
                  border: none
                  border-bottom: 1px solid #E0E1E3
                  cursor: pointer

                  &:after
                    background-image: url("/img/svg/arrow/arrow_dark.svg")

              &.category
                padding: 15px 0
                .content
                  width: 80%
                  display: inline-block
                  vertical-align: top

                  a.button
                    color: #696E78
                    text-decoration: none
                    border: none
                    width: auto
                    padding: 10px 40px 10px 0px

                .imageholder
                  display: inline-block
                  width: 180px
                  height: 0
                  padding-bottom: 180px
                  position: relative

                  figure
                    position: absolute
                    z-index: 5
                    top: 0
                    left: 0
                    width: 180px
                    height: 100%
                    background: white
                    background-color: white

                    span
                      position: absolute
                      top: 0
                      left: 0
                      width: 100%
                      height: 100%
                      background: white
                      background-color: white
                      background-size: contain
                      background-position: center
                      background-repeat: no-repeat


+respond-to-width(950)
  .search
    .search-header
      h1
        width: calc(100% - 172px)
        display: inline-block
        margin-bottom: 0

        +respond-to-width(540)
          width: auto
          margin-right: 30px

      a.button
        position: relative
        margin-bottom: 30px


    .search-content
      margin-bottom: 60px

+respond-to-width(425)
  .search
    .search-header
      padding: 0 20px

    .search-content
      padding: 20px
      margin-bottom: 0