/* * Replaces Mooshuns_v2.styles.css (the Razor scoped stylesheet). * * Every selector in that file was keyed to a `b-t6fevo8kpo` attribute stamped * onto layout elements by the old build. Those attributes do not exist in this * rebuild, so the whole file was dead CSS. Only the rules that had a visible * effect are carried over here, written against real selectors. */ /* Was: a[b-t6fevo8kpo] { color: #0077cc } On the live site that rule reaches the layout's links. Nav links override it to white via `#navbarSupportedContent a`, so in practice what it colours is the footer social icons. */ .icon-bar a { /* Anchors keep the user-agent underline. Each wraps an SVG with whitespace either side, and at the bar's 35px font-size that whitespace renders as a short underscore beside every icon. The parent's `text-decoration: none` does not fix it - that property does not inherit onto links. Spacing between links is unaffected: it comes from margin-right in site.css. */ text-decoration: none; color: #0077cc; } .icon-bar a:hover { color: #005fa3; } /* * Icon sizing. * * The old site used Font Awesome, so its icons were glyphs that scaled with * `font-size`: the footer bar sets `.container-fluid.icon-bar { font-size: 35px }` * and the nav button inherits 1rem. Replacing them with fixed-pixel SVGs broke * that link, which is why the icons came out too small. * * Sizing in `em` restores the original behaviour — the SVG now scales from the * inherited font-size exactly as the glyph did, including at the 768px * breakpoint where site.css moves html from 14px to 16px. */ .icon-bar a svg { height: 1em; width: auto; vertical-align: middle; } .navbar .btn svg { height: 1em; width: auto; vertical-align: -0.125em; } /* * Space between the menu and the page content. * * On the old site this gap was accidental: the malformed views left whitespace * text nodes inside
(the debris around the nested ), and those * formed an anonymous line box one line-height tall — 21px at the 14px root * size, 24px at 16px. Migration cleaned the whitespace away and the gap went * with it. Reinstated deliberately as 1.5rem so it tracks the root font size * the same way the accident did. */ main[role="main"] { padding-top: 1.5rem; } /* The old markup rendered three dots for five slides and never highlighted the current one (its `.active` rule was commented out). Dots now match the slide count, so give the current slide an indicator. */ .dot-active { background-color: #612E8B; }