/* * DO NOT EDIT THIS FILE. * See the following change record for more information, * https://www.drupal.org/node/3084859 * @preserve */ /** * @file * Site header. */ .site-header { position: relative } @media (min-width: 75rem) { .site-header { /* Necessary to keep the content from jumping up when header transitions to fixed. */ min-height: 11.25rem; border-bottom: solid 1px transparent /* Will show in Windows high contrast mode. */ } } .site-header__initial { position: relative; z-index: 102; display: flex; align-items: flex-end; -ms-grid-row-align: stretch; align-self: stretch; background-color: #2494db; } .site-header__fixable { display: flex; align-items: flex-end; transition: all 0.5s } @media (min-width: 75rem) { .site-header__fixable.js-fixed:not(.is-expanded) { pointer-events: none; } } @media (min-width: 75rem) { body:not(.is-always-mobile-nav) .site-header__fixable.js-fixed { position: fixed; z-index: 102; /* Appear above body content that is position: relative */ top: -4.5rem; max-width: 98.125rem; } body:not(.is-always-mobile-nav) { /* Toolbar is fixed, and tray is either vertical or closed and horizontal. */ } body:not(.is-always-mobile-nav).toolbar-vertical.toolbar-fixed .site-header__fixable.js-fixed, body:not(.is-always-mobile-nav).toolbar-horizontal.toolbar-fixed .site-header__fixable.js-fixed { top: -2.0625rem; } body:not(.is-always-mobile-nav) { /* Toolbar is fixed, and tray is open and horizontal. */ } body:not(.is-always-mobile-nav).toolbar-horizontal.toolbar-fixed.toolbar-tray-open .site-header__fixable.js-fixed { top: 0.4375rem; } } .site-header__inner { flex-grow: 1; width: calc(100vw - 5.625rem); background: #fff; } /* * Only apply transition styles when JS is loaded. This * works around https://bugs.chromium.org/p/chromium/issues/detail?id=332189 */ @media (min-width: 75rem) { html.js body:not(.is-always-mobile-nav) .site-header__inner { transition: opacity 0.3s, transform 0.3s, box-shadow 0.3s } } @media (min-width: 75rem) { .site-header__fixable.is-expanded .site-header__inner { box-shadow: -36px 1px 36px rgba(0, 0, 0, 0.08) /* LTR */ } } @media (min-width: 75rem) { [dir="rtl"] .site-header__fixable.is-expanded .site-header__inner { box-shadow: 36px 1px 36px rgba(0, 0, 0, 0.08) } } /* Hide the desktop nav when it's fixed and not active. */ @media (min-width: 75rem) { body:not(.is-always-mobile-nav) .site-header__fixable.js-fixed:not(.is-expanded) .site-header__inner { transform: translateX(-101%); /* LTR */ opacity: 0 } } @media (min-width: 75rem) { [dir="rtl"] body:not(.is-always-mobile-nav) .site-header__fixable.js-fixed:not(.is-expanded) .site-header__inner { transform: translateX(101%) } } .site-header__inner__container { display: flex; justify-content: space-between; }