.search-dialog
  position: fixed
  top: 5rem
  left: 50%
  z-index: 1001
  display: none
  margin-left: -15rem
  padding: 1rem
  width: 30rem
  background: $search-bg

  hr
    margin: 1rem auto

  span.search-close-button
    position: absolute
    top: .8rem
    right: 1rem
    color: $grey
    font-size: 1rem
    line-height: 1
    cursor: pointer
    transition: color .2s ease-in-out

    &:hover
      color: $search-color

  &__title
    padding: 0 0 .7rem
    color: $search-color
    font-size: 1rem
    line-height: 1

.search-mask
  position: fixed
  top: 0
  right: 0
  bottom: 0
  left: 0
  z-index: 1000
  display: none
  background: rgba($dark-black, .6)

@media screen and (max-width: $sm)
  .search-dialog
    top: 0
    left: 0
    margin: 0
    width: 100%
    height: 100%

  .search-result-list
    max-height: 75vh !important
    padding-bottom: 2rem