$input-size: 40px;

@include govuk-media-query($media-type: screen) {

.page-title + .search {
  margin-top: govuk-spacing(6);
}

}

@include govuk-media-query($media-type: print) {

.search {
  display: none;
}

}

.js .search__label {

@extend .govuk-visually-hidden;

}

.search__form {

position: relative;

}

.search__input {

width: 230px;
width: calc(100% - #{$input-size});

}

.search__button {

position: absolute;
bottom: 0;
right: 0;
border: 0;
background-color: govuk-colour('blue');
color: #fff;
cursor: pointer;
padding: 0;
width: $input-size;
height: 100%;
background-image: url('/images/search-button.png');
background-repeat: no-repeat;
background-position: 2px 50%;
text-indent: -5000px;
overflow: hidden;
&:focus {
  outline: $govuk-focus-width solid $govuk-focus-colour;
  outline-offset: 0;
  box-shadow: inset 0 0 0 $govuk-border-width-form-element * 2 govuk-colour("black");

  @include govuk-if-ie8 {
    border-width: $govuk-border-width-form-element * 2;
  }
}

}

html.has-search-results-open {

overflow: hidden;
.app-pane__content {
  overflow: hidden;
}

.toc__close{
  display: none;
}

} .search-results {

display: none;
&.is-open {
  display: block;
}

}

.search-results {

  position: absolute;
  top: 60px;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 600;
  overflow-x: scroll;
  -webkit-overflow-scrolling: touch;
  -ms-overflow-style: none;
  @include govuk-media-query(tablet) {
    padding: govuk-spacing(6);
    top: 0;
    // The width of the sidebar
    left: 330px;
    min-height: auto;
  }

  a {
    @include govuk-link-common;
    @include govuk-link-style-no-visited-state;
  }
}

.search-results__inner {

position: relative;
background: govuk-colour("white");
border-top: 1px solid govuk-colour("mid-grey");
max-width: 40rem;
padding: 15px;
@include govuk-media-query(tablet) {
  padding: 15px 200px 50px 40px;
  border: 1px solid govuk-colour("mid-grey");
  &::after {
    content: '';
    position: absolute;
    top: 10px;
    left: -9px;
    width: 10px;
    height: 20px;
    background: no-repeat url('/images/search-result-caret.svg') center right;
    background-size: contain;
  }
}

} .search-results__title {

@include govuk-font($size: 27, $weight: bold);
margin-bottom: govuk-spacing(6);

} .search-results__close {

@include govuk-font($size: 16);
position: absolute;
top: 18px;
right: 20px;
appearance: none;
-webkit-appearance: none;
background: none;
border: 0;
padding: 0;
cursor: pointer;

&:focus {
  @include govuk-focused-text;
}

&::after {
  content: '';
  display: inline-block;
  vertical-align: middle;
  padding-left: 8px;
  height: 18px;
  width: 18px;
  background: no-repeat url('/images/govuk-icn-close.png') center right;
  @include govuk-device-pixel-ratio {
    background-image: url('/images/govuk-icn-close@2x.png');
  }
  background-size: contain;
}

} .search-results__close-label {

position: absolute;
left: -9999em;
top: auto;
width: 1px;
height: 1px;
overflow: hidden;

} .search-result {

margin-bottom: govuk-spacing(6);

} .search-result mark {

background-color: transparent;
color: inherit;
font-weight: bold;

}