.search-dialog
  position: fixed
  top: 5rem
  left: 50%
  z-index: 1001
  display: none
  margin-left: -15rem
  padding: 1rem
  width: 30rem
  border-radius: 8px
  background: var(--search-bg)
  animation: titlescale .5s

  +maxWidth768()
    top: 0
    left: 0
    margin: 0
    width: 100%
    height: 100%
    border-radius: 0

  hr
    margin: 1rem auto

  span.search-close-button
    position: absolute
    top: .8rem
    right: 1rem
    color: $grey
    font-size: 1.4em
    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: 1.4em
    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)