/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v7.0.29,
* Autoprefixer: v9.7.6
* Browsers: last 4 version
*/

.search {
    -webkit-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
    border: 1px solid #999;
    height: 42px;
}
.search form{
  margin: 0;
}
.search button,
.search input {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background: transparent;
  border: 0;
  color: inherit;
  font: inherit;
  outline: 0;
}
.search button {
  cursor: pointer;
  padding: 0 0.25em;
}
.search input {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
          letter-spacing: 0;
}
.search input::-moz-placeholder {
  color: #999;
}
.search input:-ms-input-placeholder {
  color: #999;
}
.search input::-webkit-input-placeholder {
  color: #999;
}
.search input::-ms-input-placeholder {
  color: #999;
}
.search input::placeholder {
  color: #999;
}
.search .spinner {
  -webkit-animation: spinner 1s infinite linear;
          animation: spinner 1s infinite linear;
  display: none;
  padding: 0 0.25em;
}

.search.loading button {
  display: none;
}
.search.loading .spinner {
  display: block;
}

@-webkit-keyframes spinner {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}

@keyframes spinner {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}



@media screen and (max-width: 767px) {
.search {
    margin: 0 0 30px;
}
}