/* mod_oui_search: live search box. Class names are BEM-ish (.oui-search__*); colours are plain defaults the template overrides. */
.oui-search { position: static; }
.oui-search *, .oui-search *::before, .oui-search *::after { box-sizing: border-box; }
.oui-search__form { margin: 0; }
.oui-search__toolbar { display: flex; flex-wrap: wrap; justify-content: flex-start; width: 100%; }

.oui-search input.oui-search__input {
  width: 100%;
  height: 36px;
  margin-left: 10px;
  padding: 8px 18px;
  border: 1px solid #cecece;
  border-radius: 4px;
  color: #2a3467;
  background: #fff url(data:image/gif;base64,R0lGODlhBwAHAIAAAP///5KSkiH5BAAAAAAALAAAAAAHAAcAAAIMTICmsGrIXnLxuDMLADs=) no-repeat right -10px center;
  transition: background 0.4s;
}
.oui-search input.oui-search__input::placeholder { color: inherit; opacity: 1; }
.oui-search input.oui-search__input:focus::placeholder { color: transparent; }
/* the "x" shown at the right edge once something is typed; clicking it clears the field */
.oui-search input.oui-search__input.x { background: #fff url(data:image/gif;base64,R0lGODlhBwAHAIAAAP///5KSkiH5BAAAAAAALAAAAAAHAAcAAAIMTICmsGrIXnLxuDMLADs=) no-repeat 99% 50%; background-size: auto; cursor: pointer; position: relative; }
.oui-search input.oui-search__input.onX { cursor: pointer; }
.oui-search input.oui-search__input::-ms-clear { display: none; width: 0; height: 0; }
.oui-search input.oui-search__input.is-loading { background: transparent url(../images/spinner.gif) no-repeat scroll 98% 50%; }

.oui-search__panel { position: relative; }
.oui-search__results { position: absolute; z-index: 1000; margin-left: 1%; font-size: 12px; text-decoration: none; }
.oui-search__results[hidden] { display: none; }
.oui-search__wrap {
  width: 20rem;
  max-width: 100vw;
  max-height: 500px;
  margin: 10px 0;
  overflow: auto;
  border: 1px solid #e5e5e5;
  border-radius: 4px;
  background: #fff;
  color: rgba(0, 0, 0, 0.31);
  box-shadow: 0 0 20px 5px;
}
.oui-search__pager { float: right; width: auto; margin: 8px 10px; font-size: 12px; text-align: center; }
.oui-search__pager:empty { display: none; }
.oui-search__page { padding: 0 3px; text-decoration: none; }
.oui-search__none { margin: 0; padding: 10px; }
.oui-search__list { margin: 0; padding: 0; list-style: none; }

.oui-search__box:hover, .oui-search__box.is-active { background-color: #f3eded9e; }
.oui-search__item { display: block; width: 100%; padding: 10px; overflow: hidden; border-top: 1px solid #e5e5e5; border-bottom: 1px solid #f1ecec; text-decoration: none; }
.oui-search__item:hover { text-decoration: none; }
.oui-search__item span { display: block; float: left; width: 100%; margin: 5px 12px 0 5px; padding-right: 5px; font-size: 12px; line-height: 14px; text-align: left; text-transform: none; text-shadow: none; text-decoration: none; cursor: pointer; color: #4e6170; }
.oui-search__img { display: inline-block; float: left; width: 25%; }
.oui-search__img img { display: block; float: left; width: 100%; height: auto; margin: 5px; padding-right: 10px; border: 0; }
.oui-search__content { display: inline-block; width: 100%; }
.oui-search__item--img .oui-search__content { width: 75%; }
.oui-search__title { font-size: 14px !important; font-weight: 600; }
.oui-search .oui-search__item .oui-search__cat { margin-bottom: 10px; }
.oui-search .oui-search__item .oui-search__desc { float: left; width: 100%; margin: 0 0 0 5px; font-size: 14px; line-height: 16px; vertical-align: bottom; }
.oui-search__clear { clear: both; }
.oui-search mark { padding: 0; }