.search-overlay {
  width: 100%;
  height: 100%;
  position: absolute;
  background-color: #000000;
  top: 0;
  z-index: 9999999;
  opacity: 0.9;
  display: none;
}
.search-overlay .search-container {
  position: relative;
  height: 200px;
  margin: 30px;
}
.search-overlay .search-container .search-input-wrapper {
  position: absolute;
  top: 115px;
  height: 56px;
  width: 100%;
}
.search-overlay .search-container .search-input-wrapper .search-input-container {
  position: relative;
  width: 100%;
  height: 100%;
}
.search-overlay .search-container .search-input-wrapper .search-input-container .search-button {
  position: absolute;
  font-size: 45px;
  background: #000000;
  border: none;
  color: #696969;
  left: 0;
  bottom: -11px;
  padding-left: 0;
  z-index: 1;
}
.search-overlay .search-container .search-input-wrapper .search-input-container .search-button.search-input-has-text {
  color: #5DC4FC;
}
.search-overlay .search-container .search-input-wrapper .search-input-container .search-button.search-input-empty {
  color: #696969;
}
.search-overlay .search-container .search-input-wrapper .search-input-container .search-input {
  position: absolute;
  background: transparent;
  border: none;
  -webkit-box-shadow: none;
  box-shadow: none;
  width: 100%;
  font-size: 36px;
  color: #FFFFFF;
  border-bottom: 2px solid #696969;
  font-family: 'Open Sans Hebrew', sans-serif;
  top: 19px;
  padding-bottom: 21px;
}
.search-overlay .search-container .search-input-wrapper .search-input-container .search-input-underline {
  height: 2px;
  position: absolute;
  bottom: -28px;
  background-color: #5DC4FC;
  width: 8px;
  z-index: 9;
  transition: all 0.3s;
}
.search-overlay .search-container .search-close {
  position: absolute;
  top: 0;
}
.search-overlay .search-container .search-close .fa-times {
  font-size: 36px;
  color: #5DC4FC;
  vertical-align: text-top;
}
body.dir_ltr .search-overlay .search-container .search-input-wrapper .search-input-container .search-button {
  right: 0;
  left: initial;
}