.autocomplete {
  /*the container must be positioned relative:*/
  position: relative;
  display: inline-block;
  margin-top: 3rem;
  margin-bottom: 3rem;
}
.autocomplete-items {
  position: absolute;
  /*border: none; by default border-top: none; */
  z-index: 99;
  /*position the autocomplete items to be the same width as the container:*/
  top: 100%;
  left: -.75rem;
  right: -.75rem;
  background-color: white;
  padding: .25rem .75rem .5rem .75rem;
  /*to match the card-panel shadow*/
  box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14),0 3px 1px -2px rgba(0,0,0,0.12),0 1px 5px 0 rgba(0,0,0,0.2);
}
.autocomplete-items div {
  padding: 10px;
  cursor: pointer;
}
#algolia-logo {
  padding-top: 10px;
  cursor: pointer;
}
#search-message {
  padding-top: 10px;
  font-style: italic;
}
.autocomplete-items div:hover {
  /*when hovering an item:*/
  background-color: #e9e9e9;
}
.autocomplete-active {
  /*when navigating through the items using the arrow keys:*/
  background-color: blue !important;
}