/*
 * DO NOT EDIT THIS FILE.
 * See the following change record for more information,
 * https://www.drupal.org/node/2815083
 * @preserve
 */

/**
 * @file
 * Header Search Wide Block.
 */

/*
  Media query breakpoints.
  Processed by postcss/postcss-custom-media.
*/

/* Navigation related breakpoints */

/* Grid related breakpoints */

/* Grid shifts from 6 to 14 columns. */

/* Width of the entire grid maxes out. */

/*
  Custom CSS properties.

  These are "compiled" by postcss/postcss-custom-properties for IE11 compatibility.
*/

:root {

  /* Typography */

  /* Layout */

  /* Drupal administrative toolbar heights and width. */

  /*
    Grid helpers.

    These variables help authors apply widths and negative margins to break items out of
    the grid, while still conforming to the larger grid system.

    Note we cannot change the values of these custom properties within media queries,
    as they are processed by postcss/postcss-custom-properties (for IE11 compatibility),
    which does not support that functionality. Therefore, we need a separate custom
    property for each breakpoint. 😭
  */ /* Approximate width of a scrollbar. Doesn't have to be perfect. */

  /* Grid gap across various breakpoints. */

  /* Column counts at various breakpoints. */

  /* Count of grid-gaps at various breakpoints. */

  /* Width of the entire grid at various breakpoints. */

  /* Width of a grid column at various breakpoints */

  /* Layout helpers */ /* Black */ /* Black 1 */ /* Black 2 */ /* Black 3 */ /* Gray Dark */ /* Gray medium */ /* Gray medium 1 */ /* Gray medium 2 */ /* Black 4 */ /* Gray light */ /* Gray light 1 */ /* Gray light 2 */ /* Blue dark */ /* Blue dark 2 */ /* Blue medium */ /* Blue bright */ /* Blue bright 5 */ /* White */ /* Red */ /* Gold */ /* Green */

  /* Shadows */

  /* Radius */

  /* Outlines */

  /* Header */

  /* Width of slide out navigation */

  /* Border radius */

  /* Form */
}

/* Override contextual links so we can position against .site-header. */

.search-block-form.contextual-region {
  position: static;
}

.search-wide__wrapper {
  position: absolute;
  z-index: 1; /* Ensure left border shows above social region in IE11. */
  top: 100%;
  display: none;
  visibility: hidden;
  overflow: hidden;
  width: 100vw;
  max-width: 1570px;
  height: 144px;
  max-height: 0;
  transition: all 0.2s;
}

[dir] .search-wide__wrapper {
  margin: 0;
  padding: 0;
  background: #000;
}

[dir=ltr] .search-wide__wrapper {
  left: 0;
  border-left: solid 90px #313637;
}

[dir=rtl] .search-wide__wrapper {
  right: 0;
  border-right: solid 90px #313637;
}

.search-wide__wrapper.is-active {
    visibility: visible;
    max-height: 144px;
  }

/* Provide rudimentary access to site search if JS is disabled. */

html:not(.js) .search-block-form:focus-within .search-wide__wrapper {
    visibility: visible;
    max-height: 144px;
  }

.search-wide__wrapper form {
    display: flex;
    -ms-grid-column: 1;
    -ms-grid-column-span: 13;
    grid-column: 1 / 14;
  }

.search-wide__wrapper input[type="search"] {
    width: calc(100% + 36px);
    height: 144px;
    transition: background-size 0.4s;
    color: #fff; /* Two values are needed for IE11 support. */
    font-family: serif;
    font-size: 2rem;
    -webkit-appearance: none;
  }

[dir] .search-wide__wrapper input[type="search"] {
    border: solid 1px transparent;
    background-color: transparent;
    background-image: linear-gradient(#2494db, #2494db);
    background-repeat: no-repeat;
    background-size: 0% 10px;
    box-shadow: none;
  }

[dir=ltr] .search-wide__wrapper input[type="search"] {
  padding: 0 0 0 216px;
  background-position: bottom left;
  }

[dir=rtl] .search-wide__wrapper input[type="search"] {
    padding: 0 216px 0 0;
    background-position: bottom right;
  }

.search-wide__wrapper input[type="search"]::-ms-clear {
      width: 40px;
      opacity: 0.5;
    }

.search-wide__wrapper input[type="search"]:focus {
      outline: 0;
    }

[dir] .search-wide__wrapper input[type="search"]:focus {
      background-size: 100% 9px;
    }

/*
        We normally indicate focus by animating background-image width. This isn't
        available in IE11 when in Windows high contrast mode.
      */

@media screen and (-ms-high-contrast: active) {

[dir] .search-wide__wrapper input[type="search"]:focus {
        border-bottom-width: 9px
    }
      }

.search-wide__wrapper .form-item-keys {
    flex-grow: 1;
  }

[dir] .search-wide__wrapper .form-item-keys {
    margin: 0;
  }

.search-wide__wrapper .form-actions {
    display: flex;
  }

[dir] .search-wide__wrapper .form-actions {
    margin: 0;
  }

.search-wide__wrapper .search-form__submit {
    position: relative;
    overflow: hidden;
    -ms-grid-row-align: stretch;
    align-self: stretch;
    width: 100px;
    height: auto;
  }

[dir] .search-wide__wrapper .search-form__submit {
    margin: 0;
    padding: 0;
    cursor: pointer;
    border-color: transparent;
    background-color: transparent;
  }

/*
      When in Windows high contrast mode, FF will will not output either background
      images or SVGs that are nested directly within a <button> element, so we add a <span>.
    */

.search-wide__wrapper .search-form__submit .icon--search {
      position: absolute;
      top: 0;
      display: block;
      width: 24px; /* Width of the SVG background image. */
      height: 100%;
      pointer-events: none;
    }

[dir] .search-wide__wrapper .search-form__submit .icon--search {
      background-image: url("../../images/search--white.svg");
      background-repeat: no-repeat;
      background-position: center;
      background-size: contain;
    }

[dir=ltr] .search-wide__wrapper .search-form__submit .icon--search {
  right: 0;
    }

[dir=rtl] .search-wide__wrapper .search-form__submit .icon--search {
      left: 0;
    }

.search-wide__wrapper .search-form__submit .icon--search:after {
        position: absolute;
        bottom: 0;
        width: 100%;
        height: 0;
        content: "";
        transition: transform 0.2s;
      }

[dir] .search-wide__wrapper .search-form__submit .icon--search:after {
        transform: scaleX(0);
        border-top: solid 9px #2494db;
      }

[dir=ltr] .search-wide__wrapper .search-form__submit .icon--search:after {
  left: 0;
  transform-origin: left;
      }

[dir=rtl] .search-wide__wrapper .search-form__submit .icon--search:after {
        right: 0;
        transform-origin: right;
      }

.search-wide__wrapper .search-form__submit:focus {
      outline: 0;
    }

[dir] .search-wide__wrapper .search-form__submit:focus {
      box-shadow: none;
    }

[dir] .search-wide__wrapper .search-form__submit:focus span:after {
        transform: scaleX(1);
      }

@media screen and (-ms-high-contrast: active) {

[dir] .search-wide__wrapper .search-form__submit:focus {
        border-bottom-width: 9px
    }

        .search-wide__wrapper .search-form__submit:focus span:after {
          content: none;
        }
      }

@media screen and (-ms-high-contrast: active) {

.search-wide__wrapper .search-form__submit {
      /* IE11's high contrast show will not show the background image, so we show the text. */

      /* Edge's high contrast does show the background image, so we hide it. */
  }
      .search-wide__wrapper .search-form__submit .visually-hidden {
        position: static;
        overflow: visible;
        clip: auto;
        width: auto;
        height: auto;
      }
      [dir] .search-wide__wrapper .search-form__submit .visually-hidden {
        text-align: center;
      }
      .search-wide__wrapper .search-form__submit .icon--search {
        display: none;
      }
    }

@media (min-width: 1200px) {
    body:not(.is-always-mobile-nav) .search-wide__wrapper {
      display: block;
    }
  }

.search-wide__container {
  max-width: 1350px;
}

[dir=ltr] .search-wide__container {
  padding-right: 36px;
}

[dir=rtl] .search-wide__container {
  padding-left: 36px;
}

/* Override specificity from container-inline.module.css */

.container-inline .search-wide__container {
    display: block;
  }

.search-wide__grid {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (1fr)[14];
  grid-template-columns: repeat(14, 1fr);
  grid-column-gap: 36px;
}

/* Override specificity from container-inline.module.css */

.container-inline .search-wide__grid {
    display: -ms-grid;
    display: grid;
  }

.header-nav__search-button {
  position: relative;
  display: none;
  width: 54px;
  height: 108px;
  -webkit-appearance: none;
}

[dir] .header-nav__search-button {
  cursor: pointer;
  border: 0;
  background: transparent;
}

.header-nav__search-button:focus {
    outline: 0;
  }

[dir] .header-nav__search-button:focus:after {
      transform: scaleX(0.5);
    }

.header-nav__search-button:after {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 0;
    content: "";
    transition: transform 0.2s;
  }

[dir] .header-nav__search-button:after {
    transform: scaleX(0);
    border-top: solid 9px #2494db;
  }

[dir=ltr] .header-nav__search-button:after {
  left: 0;
  }

[dir=rtl] .header-nav__search-button:after {
    right: 0;
  }

[dir] .header-nav__search-button[aria-expanded="true"] {
    background: #000;
  }

.header-nav__search-button[aria-expanded="true"] .header-nav__search-button__close:before,
      .header-nav__search-button[aria-expanded="true"] .header-nav__search-button__close:after {
        position: absolute;
        top: 50%;
        width: 27px;
        height: 0;
        content: "";
      }

[dir] .header-nav__search-button[aria-expanded="true"] .header-nav__search-button__close:before, [dir] .header-nav__search-button[aria-expanded="true"] .header-nav__search-button__close:after {
        border-top: solid 2px #fff;
      }

[dir=ltr] .header-nav__search-button[aria-expanded="true"] .header-nav__search-button__close:before, [dir=ltr] .header-nav__search-button[aria-expanded="true"] .header-nav__search-button__close:after {
  left: 50%;
      }

[dir=rtl] .header-nav__search-button[aria-expanded="true"] .header-nav__search-button__close:before, [dir=rtl] .header-nav__search-button[aria-expanded="true"] .header-nav__search-button__close:after {
        right: 50%;
      }

[dir=ltr] .header-nav__search-button[aria-expanded="true"] .header-nav__search-button__close:before {
  transform: translate(-50%, -50%) rotate(-45deg);
      }

[dir=rtl] .header-nav__search-button[aria-expanded="true"] .header-nav__search-button__close:before {
        transform: translate(50%, -50%) rotate(45deg);
      }

[dir=ltr] .header-nav__search-button[aria-expanded="true"] .header-nav__search-button__close:after {
  transform: translate(-50%, -50%) rotate(45deg);
      }

[dir=rtl] .header-nav__search-button[aria-expanded="true"] .header-nav__search-button__close:after {
        transform: translate(50%, -50%) rotate(-45deg);
      }

.header-nav__search-button[aria-expanded="true"] svg {
      display: none;
    }

[dir] .header-nav__search-button svg {
    margin: 0 auto;
  }

@media (min-width: 1200px) {
    body:not(.is-always-mobile-nav) .header-nav__search-button {
      display: block;
    }
  }