.search-box {
    @apply w-full h-24 flex items-center z-50 shadow;
    transition: all 0.2s;
    margin-top: 4.25rem;

  input {
      @apply border-none mb-0 h-full w-full text-center outline-none;
      font-size: 2rem;
      text-transform: uppercase;
      background: #f4f5f7;
      transition: all 0.2s;

      &:focus {
        @apply bg-white;
      }
  }

  .algolia-autocomplete {
    @apply w-full h-full shadow-lg;
  }
}

.internal-autocomplete-result {
  @apply shadow-lg bg-white;
  min-width: 300px;
  max-height: 400px;
  position: absolute;
  top: 7rem;
  right: 10px;
  border-radius: 10px;
  transition: all 0.2s;
  z-index: 100;
  overflow: scroll;

  ul {
    list-style: none;
    margin-left: -20px !important;
    margin-right: 20px !important;

    li {
      width: 100%;
      margin-top: 20px;

      .page-title {
        @apply text-grey-darker font-bold;
      }

      hr {
        @apply bg-grey-lighter w-full border-t border-grey-light my-2;
      }

      .heading {
        @apply w-full mb-0 text-grey;
        padding: 5px 10px;
        cursor: pointer;

        &:hover {
          @apply font-bold;
        }
      }
    }
  }
}