@font-face { font-family: "MaruMinya"; src: url("maruminya.woff2") format("woff2"); font-display: swap; } :root { --color-primary: #f5f0e8; --color-secondary: #8b1a1a; --color-accent: #c44040; --bg-primary: #2a0505; --bg-secondary: #5c0a0a; --text-primary: #f5f0e8; --text-secondary: #8a8070; --text-accent: #c44040; --header-primary: #c44040; --header-secondary: #8b1a1a; --header-tertiary: #e8e0d0; --header-other: #f5f0e8; --link-color: #c44040; --link-hover: #f5f0e8; --border-primary: #5c0a0a; --border-secondary: #2a0505; --border-image: #5c0a0a; --header-bg: #e8e0d0; --header-text: #1a1a1a; --font-headers: MaruMinya, monospace; --font-body: MaruMinya, monospace; --na-outline: 1px 0 0 #5c0a0a, -1px 0 0 #5c0a0a, 0 1px 0 #5c0a0a, 0 -1px 0 #5c0a0a; } body { background: #2a0505; } .na-banner { image-rendering: pixelated; } header h1 .headerLink, article h1, article h2 { font-family: MaruMinya, monospace; } article { text-align: center; line-height: 1.8; } .na-banner { margin: 0 -1vw 2em; padding: 2.5em 1em 2em; background: radial-gradient(ellipse 55% 38% at 50% 70%, rgba(42, 5, 5, .8) 0%, rgba(42, 5, 5, .55) 45%, rgba(42, 5, 5, 0) 100%), url("header-dither.png") center / 960px 320px no-repeat, #2a0505; border-bottom: 1px solid #5c0a0a; } .na-banner .sigil { display: block; margin-bottom: 1.2em; font-size: 2rem; color: #f5f0e8; text-shadow: var(--na-outline), 2px 2px 0 #5c0a0a; } .na-banner h1 { margin: 0; font-size: 1.6rem; font-weight: normal; letter-spacing: .3em; text-transform: uppercase; color: #f5f0e8; text-shadow: var(--na-outline), 2px 2px 0 #5c0a0a; } .na-banner .subtitle { font-size: .8rem; letter-spacing: .15em; color: #e8e0d0; text-shadow: var(--na-outline), 1px 1px 0 #5c0a0a; } .star-quote { font-style: italic; color: #c44040; } .star-quote::before, .star-quote::after { content: " \2022 "; color: #8b1a1a; }