#search-panel {
  display            : block;
  position           : fixed;
  top                : 0;
  left               : 0;
  right              : 0;
  bottom             : 0;
  z-index            : 99999;
  background-color   : rgba(0, 0, 0, 0.8);
  opacity            : 0;
  overflow-x         : unset;
  overflow-y         : scroll;
  pointer-events     : none;
  -webkit-transition : opacity .3s ease-in-out;
  -moz-transition    : opacity .3s ease-in-out;
  -ms-transition     : opacity .3s ease-in-out;
  -o-transition      : opacity .3s ease-in-out;
  transition         : opacity .3s ease-in-out
}

#search-panel.show {
  pointer-events     : all;
  opacity            : 1;
  -webkit-transition : opacity .3s ease-in-out;
  -moz-transition    : opacity .3s ease-in-out;
  -ms-transition     : opacity .3s ease-in-out;
  -o-transition      : opacity .3s ease-in-out;
  transition         : opacity .3s ease-in-out
}

.search-bar-wrap.search-bar-front {
  max-width : 600px;
  /*position  : relative;*/
  /*left      : 0;*/
  /*top       : 0;*/
  /*transform : translate(0, -60%);*/
  /*margin    : 0 auto -50px auto;*/
  /*z-index   : 9*/
}

.search-bar-wrap.search-bar-front p {
  color       : white;
  padding     : 0;
  font-family : 'CeraBielefeld-Web-Bold', sans-serif;
  font-size   : 24px
}

.search-bar-wrap.search-bar-abc {
  max-width : 991px
}

.search-bar-wrap.search-bar-abc p {
  color       : white;
  padding     : 0;
  font-family : 'CeraBielefeld-Web-Bold', sans-serif;
  font-size   : 24px
}

.search-bar-wrap #search {
  padding : 9px 12px 9px 12px;
  border: 1px solid var(--hellgrau);
  outline: none;
}
.search-bar-wrap #search:focus {
  border: 1px solid var(--grau);
}

.search-bar-wrap .container {
  /*padding : 25px 45px*/
}

.search-bar-wrap input {
  padding   : 10px;
  font-size : 15px;
  display   : block;
  width     : 100%
}


@media (max-width : 710px) {
  .search-bar-wrap input {
    flex      : 0 0 100%;
    max-width : 100% !important;
    width     : 100% !important
  }

  .search-bar-wrap .btn {
    display : none
  }
}

.search-result-image {
  max-height: 120px;
}
@media (max-width : 575px) {
  .search-result-image {
    margin-top : -50px;
    /*max-height : 160px;*/
    min-height : 100px
  }
}

.checklist {
}

.checklist h2 {
  margin-top    : 0;
  margin-bottom : 0;
  font-size     : 1.25rem
}

.checklist .amount-remembered {
  font-size  : 1.25rem;
  font-style : italic
}

.checklist .amount-remembered span {
  font-style  : normal;
  font-weight : 700
}

.checklist .remembered {
  margin-top : 20px;
  list-style : none;
  position   : relative
}

.checklist .remembered li {
  position : relative
}

.checklist .remembered li:before {
  content     : "▸";
  position    : absolute;
  margin-left : -20px
}

.checklist .remembered li a {
  text-decoration : none;
  border-bottom   : none !important;
  color           : white !important;
  max-width       : 90%;
  display         : block
}

.checklist .remembered li a:hover {
  color : black !important
}

.checklist .remove-item {
  top      : -5px;
  float    : right;
  display  : block;
  position : absolute;
  right    : 0;
  cursor   : pointer;
  padding  : 5px
}

.checklist .remove-item:hover {
  color : black;
}

.send-checklist, .clear-checklist {
  text-decoration : none;
  font-style      : italic;
  color           : white
}

.send-checklist:hover, .clear-checklist:hover {
  color           : black;
  text-decoration : none;
}