// Place all the styles related to the search controller here.
// They will automatically be included in application.css.
// You can use Sass (SCSS) here: http://sass-lang.com/

.search-form {
  margin-bottom: 2em;

}

.search-type-nav {
  margin-bottom: 20px;
}

.search-results {
  .list-group-item em {
    font-style: normal;
    background-color: rgba(255,255,140,0.5);
  }

  .alert {
    margin-top: 0;
  }
}

.list-filters {
  @media (min-width: $screen-md-min) {
    float: right;
  }

  h2 {
    margin: 0 0 $padding-large-vertical;
    font-weight: normal;
  }

  .btn-group {
    margin: 0 0 20px;

    @media (min-width: 18em) {
      display: flex;
    }

    @media (min-width: $screen-md-min) {
      display: inline-block;
    }
  }

  a {
    font-size: $font-size-small;

    @media (min-width: 18em) {
      flex-grow: 1;
    }

    @media (min-width: $screen-md-min) {
      padding: 5px 15px;
    }
  }
}

// Place all the styles related to the search controller here.
// They will automatically be included in application.css.
// You can use Sass (SCSS) here: http://sass-lang.com/

.search-form {
  margin-bottom: 2em;

}

.search-type-nav {
  margin-bottom: 20px;
}

.search-results {
  .list-group-item em {
    font-style: normal;
    background-color: rgba(255,255,140,0.5);
  }

  .alert {
    margin-top: 0;
  }
}

.list-filters {
  @media (min-width: $screen-md-min) {
    float: right;
  }

  h2 {
    margin: 0;
    font-weight: normal;
    overflow: hidden;
    height: 0;

    @media (min-width: $screen-md-min) {
      margin: 0 0 $padding-large-vertical;
      overflow: auto;
      height: auto;
    }
  }

  .btn-group {
    margin: 0 0 20px;

    @media (min-width: 18em) {
      display: flex;
    }

    @media (min-width: $screen-md-min) {
      display: inline-block;
    }
  }

  a {
    font-size: $font-size-small;

    @media (min-width: 18em) {
      flex-grow: 1;
    }

    @media (min-width: $screen-md-min) {
      padding: 5px 15px;
    }
  }
}

Hide filter heading on small screens
Hide filter heading on small screens

On small screens the filters sit above the scrapers and so the
association is much clearer and the heading is unnecessary.
