/* The site's nav bar on top of the relayed Student Portal. Every rule is
   scoped to .etkbar so nothing reaches the portal's own styles. */
@import url("https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@700;800&display=swap");
/* Pinned to the top of the page, out of the portal's own layout: some portal
   pages make <body> a centering flexbox, which would otherwise put the bar
   beside the content. The body is pushed down by the bar's height instead, and
   the portal's own sticky header still sticks once the bar scrolls away. */
:root { --etkbar-h: calc(62px + env(safe-area-inset-top, 0px)); }
body { padding-top: var(--etkbar-h) !important; box-sizing: border-box; }
.etkbar { box-sizing: border-box; position: absolute; top: 0; left: 0; right: 0; height: var(--etkbar-h); z-index: 1000; display: flex; align-items: center; gap: 1.2rem; padding: 0 max(1rem, calc((100% - 76rem) / 2 + 1.25rem)); padding-top: env(safe-area-inset-top, 0px); background: #101012; color: #fff; border-bottom: 3px solid #d71932; font: 500 15px/1.3 Inter, Arial, sans-serif; }
.etkbar *, .etkbar *::before, .etkbar *::after { box-sizing: border-box; }
.etkbar a { color: inherit; text-decoration: none; }
.etkbar-brand { display: flex; align-items: center; gap: .6rem; margin-right: auto; min-width: 0; }
.etkbar-brand img { width: 40px; height: 40px; flex: none; }
.etkbar-brand span { display: grid; line-height: 1; min-width: 0; }
.etkbar-brand strong { font: 800 1.35rem "Barlow Condensed", Impact, "Arial Narrow", sans-serif; letter-spacing: .02em; white-space: nowrap; }
.etkbar-brand small { font: 700 .72rem "Barlow Condensed", Impact, "Arial Narrow", sans-serif; letter-spacing: .3em; color: #e8a202; margin-top: .25rem; white-space: nowrap; }
.etkbar-links { display: flex; gap: 1.4rem; }
.etkbar-links a { color: #c6c6c6; padding-block: .3rem; }
.etkbar-links a:hover { color: #fff; }
.etkbar-cta { background: #d71932; border-radius: 6px; padding: .5rem 1rem; font: 800 1rem "Barlow Condensed", Impact, sans-serif; letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; }
.etkbar-cta:hover { background: #b80f27; }
.etkbar-menu { display: none; position: relative; }
.etkbar-menu summary { list-style: none; cursor: pointer; min-width: 44px; min-height: 44px; display: grid; place-items: center; border: 1px solid #303034; border-radius: 6px; font-size: 1.3rem; }
.etkbar-menu summary::-webkit-details-marker { display: none; }
.etkbar-menu > div { position: absolute; right: 0; top: calc(100% + .5rem); min-width: 12rem; background: #19191c; border: 1px solid #303034; border-radius: 8px; padding: .3rem 0; box-shadow: 0 16px 32px rgba(0,0,0,.4); }
.etkbar-menu > div a { display: block; padding: .8rem 1rem; color: #fff; }
.etkbar-menu > div a:hover { background: #242427; }
.etkbar :focus-visible { outline: 3px solid #e8a202; outline-offset: 2px; border-radius: 4px; }
@media (max-width: 860px) {
  .etkbar-links, .etkbar-cta { display: none; }
  .etkbar-menu { display: block; }
}
@media (max-width: 420px) { .etkbar-brand strong { font-size: 1.12rem; } }