#search-form {
  position: relative;
  margin-left: 100px;
}

#search-form::before {
  content: "";
  width: 23px;
  height: 23px;
  display: block;
  background-image: url(data:image/png;base64,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);
  background-position: 50% 50%;
  opacity: 0.3;
  position: absolute;
  background-size: cover;
  right: 21px;
  z-index: 10;
  top: 7px;
}

#search {
  border-radius: 2rem;
  width: 172px;
  transition: all .2s;
  opacity: 0.6;
  padding-right: 38px;
}

#search:focus {
  width: 250px;
  transition: all .2s;
  opacity: 1;
  border-color: #877eb2;
}
