// =============================================================================
// _SEARCHFORM-OVERLAY.SCSS
// -----------------------------------------------------------------------------
// Site styles.
// =============================================================================

// =============================================================================
// TABLE OF CONTENTS
// -----------------------------------------------------------------------------
//   01. Base Styles
// =============================================================================

// Base Styles
// =============================================================================

.x-searchform-overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: $zindexNavbar + 1000;
  background-color: rgba($baseModBackground, 0.925);
  @include transition(#{top 0.3s ease});

  &.in {
    display: table;
  }

  .form-search {
    padding-bottom: 2em;
    @include font-size(1.0);

    &:before {
      display: none;
    }

    label {
      margin-bottom: 0.85em;
      font-size: 2.1em;
      line-height: 1.4;
      color: $headingsColor;
    }

    .search-query {
      border: 0;
      padding: 0;
      height: auto;
      font-size: 9.4em;
      letter-spacing: -0.05em;
      line-height: 1;
      color: $headingsColor;
      background-color: transparent;
      border-radius: 0;
      @include box-shadow(#{none});

      &:focus,
      &:active {
        outline: 0;
      }
    }

    @include break(middle-bear) {
      @include font-size(0.8);
    }

    @include break(baby-bear) {
      @include font-size(0.6);
    }
  }
}

.x-searchform-overlay-inner {
  display: table-cell;
  vertical-align: middle;
}