/* ========================================== ACADEMIA AETERNUM — MASTER STYLESHEET Converted to Editorial Warm-Paper Theme Design tokens (from chapter theme): --ink: #1a1612 body text --paper: #181612 page background --warm-mid: #f0ebe0 mid-tone surface --accent: #c0392b crimson accent --gold: #b8860b gold --gold-light: #f5e9c4 pale gold tint --rule: #d4c9b0 border / hr colour --muted: #6b6258 muted text --tag-bg: #2c2420 dark parchment (headers, nav) --card-bg: #ffffff card surface --border-soft: #e4ddd0 subtle card border Fonts in use: - 'Playfair Display' — display headings - 'Source Serif 4' — body copy - 'JetBrains Mono' — labels, meta, code Import in your before this file: ========================================== */ /* ========================================== 0. ROOT TOKENS ========================================== */ :root { --ink: #f8f9fa; /* Light text */ --paper: #1e293b; /* Dark blue paper */ --warm-mid: #cbd5e1; --accent: #3b82f6; --gold: #60a5fa; --gold-light: #bfdbfe; --rule: #475569; --muted: #94a3b8; --tag-bg: #334155; --card-bg: #0f172a; /* Deep dark blue for cards */ --border-soft: #334155; } /* ========================================== 1. BASE RESET & BODY ========================================== */ *, *::before, *::after { box-sizing: border-box; } body { background: var(--paper); color: var(--ink); font-family: 'Source Serif 4', Georgia, serif; font-size: 1.05rem; line-height: 1.85; } /* Scrollbar */ ::-webkit-scrollbar { width: 6px; height: 6px; } ::-webkit-scrollbar-track { background: var(--warm-mid); } ::-webkit-scrollbar-thumb { background: var(--gold); border-radius: 3px; } /* ========================================== 2. UTILITY CLASSES ========================================== */ /* Replaced blueviolet with editorial gold accent */ .head-para { color: var(--gold); font-family: 'Playfair Display', serif; font-weight: 600; } .footer-margin-top { margin-top: 50px; } .marginttopminus { margin-top: 10rem; } .margin-top { margin-top: 17rem; } @media (max-width: 967px) { .margin-top { margin-top: 5rem; } } .margintop2 { margin-top: 3rem; } .margin-top-1rem { margin-top: 1rem; } .roman { list-style-type: lower-roman; } /* Replaced hardcoded negative margins + orangered with editorial heading style */ .mainheading { font-family: 'Playfair Display', serif; font-size: clamp(1.8rem, 4vw, 2.8rem); font-weight: 800; color: var(--accent); margin-top: 2rem; margin-bottom: 1.5rem; line-height: 1.2; } .maincontainer { margin-top: 2rem; } /* Replaced hardcoded red + negative margin with editorial mono label */ .mathsHead { font-family: 'JetBrains Mono', monospace; font-size: 0.72rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--gold); margin-top: 1.5rem; margin-bottom: 1rem; } .aboutus { margin-top: 2rem; } /* Replaced blueviolet with Playfair Display heading */ .aboutusp { font-family: 'Playfair Display', serif; font-size: 2rem; text-align: center; font-weight: 800; color: var(--ink); line-height: 1.25; } .blogHead { margin-top: 4rem; } /* ========================================== 3. CONTAINER & LAYOUT ========================================== */ /* Replaced cursive + fixed height with editorial body font */ .postContainer { padding: 1.2rem; font-family: 'Source Serif 4', Georgia, serif; max-height: 625px; overflow-y: scroll; background: var(--card-bg); border: 1px solid var(--border-soft); border-radius: 6px; } .image-container { display: flex; justify-content: center; align-items: center; height: 200px; } .content-form { min-height: 350px; max-height: 600px; overflow-y: auto; } .mathjax-container { overflow-x: auto; white-space: normal; max-width: 100%; color: var(--ink); } /* ========================================== 4. TYPOGRAPHY & TEXT EFFECTS ========================================== */ /* Replaced tomato italic with editorial accent */ .highlight { color: var(--accent); font-weight: 600; font-style: italic; font-family: 'Source Serif 4', serif; } /* Replaced aqua links with warm gold */ .anchortag { color: var(--gold); text-decoration: none; border-bottom: 1px solid rgba(184,134,11,.3); transition: color .2s, border-color .2s; } .anchortag:hover { color: var(--accent); border-color: var(--accent); } /* Replaced aqua/blue with theme-aware warm tones */ .unlocking { color: var(--gold); font-family: 'Source Serif 4', serif; } @media only screen and (max-width: 992px) { .unlocking { color: var(--accent); } } /* Replaced neon pink gradient with editorial warm gradient */ .text-gradient { background: linear-gradient(45deg, var(--accent), var(--gold)); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; } /* ========================================== 5. CARDS (MAIN EDITORIAL STYLE) ========================================== */ .card { background: var(--card-bg); border: 1px solid var(--border-soft) !important; border-radius: 6px !important; box-shadow: 0 2px 12px rgba(26,22,18,.06); transition: box-shadow .25s, border-color .25s; } .card:hover { box-shadow: 0 4px 24px rgba(26,22,18,.1); border-color: var(--rule) !important; } /* Card header base */ .card-header { padding: 1.1rem 1.6rem; border-bottom: 1px solid var(--border-soft); } .card-header h4 { font-family: 'Playfair Display', serif; font-size: 1.25rem; font-weight: 800; margin: 0; line-height: 1.2; letter-spacing: 0; /* removed neon letter-spacing */ text-shadow: none; /* removed neon glow */ } /* Card header colour variants — editorial dark tones */ .card-header.bg-primary, .card-header.ch-hdr-primary { background: var(--tag-bg) !important; } .card-header.bg-primary h4, .card-header.ch-hdr-primary h4 { color: #faf7f2; } .card-header.bg-secondary, .card-header.ch-hdr-secondary { background: #2e2820 !important; } .card-header.bg-secondary h4, .card-header.ch-hdr-secondary h4 { color: #faf7f2; } .card-header.bg-success, .card-header.ch-hdr-success { background: #1c3a1c !important; } .card-header.bg-success h4, .card-header.ch-hdr-success h4 { color: #c8e6c8; } .card-header.bg-info, .card-header.ch-hdr-info { background: #1a2e3a !important; } .card-header.bg-info h4, .card-header.ch-hdr-info h4 { color: #b8d8e8; } .card-header.bg-warning, .card-header.ch-hdr-warning { background: #3a2800 !important; } .card-header.bg-warning h4, .card-header.ch-hdr-warning h4 { color: var(--gold-light); } .card-header.bg-danger, .card-header.ch-hdr-danger { background: #3a1010 !important; } .card-header.bg-danger h4, .card-header.ch-hdr-danger h4 { color: #f5c8c8; } .card-header.bg-dark, .card-header.ch-hdr-dark { background: #111010 !important; } .card-header.bg-dark h4, .card-header.ch-hdr-dark h4 { color: #e8e0d5; } .card-header.bg-light { background: var(--warm-mid) !important; } .card-header.bg-light h4 { color: var(--ink); } /* Remove all neon text-shadow from card headers */ .card-header.bg-primary *, .card-header.bg-secondary *, .card-header.bg-success *, .card-header.bg-info *, .card-header.bg-warning *, .card-header.bg-danger *, .card-header.bg-dark *, .card-header.bg-light * { text-shadow: none; } /* Card body */ .card-body { padding: 2rem; color: var(--ink); text-shadow: none; background: var(--card-bg); /* Now deep dark blue */ display: block; } .card-text.excerpt { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; min-height: 3em; color: var(--muted); } /* ========================================== 6. NEON TEXT — converted to editorial ========================================== */ /* .neon-text becomes a warm bold callout */ .neon-text { color: var(--accent); font-weight: 700; font-family: 'Source Serif 4', serif; text-shadow: none; background: transparent; letter-spacing: 0.02em; } /* .neon-title becomes Playfair editorial subheading */ .neon-title { font-family: 'Playfair Display', serif; font-size: 1.1rem; font-weight: 700; color: var(--ink); background: none; -webkit-text-fill-color: var(--ink); text-shadow: none; margin: 1.8rem 0 0.7rem; padding-bottom: 0.3rem; border-bottom: 2px solid var(--gold-light); display: inline-block; } .neon-type { color: var(--gold); font-family: 'JetBrains Mono', monospace; font-weight: 600; letter-spacing: 0.06em; font-size: 0.9rem; } .neon-meta { color: var(--muted); font-family: 'JetBrains Mono', monospace; font-size: 0.85rem; } .neon-desc { color: var(--ink); font-family: 'Source Serif 4', serif; font-size: 1rem; font-weight: 400; line-height: 1.85; } /* ========================================== 7. NEON CARDS — converted to editorial cards ========================================== */ .neon-card { background: var(--card-bg); border: 1px solid var(--border-soft); border-radius: 6px; box-shadow: 0 2px 12px rgba(26,22,18,.06); color: var(--ink); margin-bottom: 2rem; transition: box-shadow .25s, border-color .25s; } .neon-card:hover { box-shadow: 0 4px 20px rgba(26,22,18,.1); border-color: var(--rule); } /* Image inside neon-card */ .neon-img { border-radius: 4px; box-shadow: 0 1px 8px rgba(26,22,18,.12); width: 96px; height: 96px; object-fit: cover; background: var(--warm-mid); margin-right: 1.5rem; border: 1px solid var(--rule); } /* Links — replaced aqua glow with gold editorial link */ .neon-link { text-decoration: none; color: var(--gold) !important; border-bottom: 1px solid rgba(184,134,11,.3); transition: color .2s, border-color .2s; display: inline; } .neon-link:hover { color: var(--accent) !important; border-color: var(--accent); text-decoration: none; text-shadow: none; box-shadow: none; } /* ========================================== 8. SECTION & HOVER CARDS ========================================== */ /* Replaced dark radial bg with warm parchment */ .neon-section { background: var(--paper); border: 1px solid var(--border-soft); border-radius: 6px; padding: 2rem 1.5rem; margin: 2rem auto; max-width: 1200px; } /* Replaced glass/blur with clean editorial card */ .hover-card { background: var(--card-bg); border: 1px solid var(--border-soft); border-radius: 6px; transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; color: var(--ink); } .hover-card:hover { transform: translateY(-4px); border-color: var(--rule); box-shadow: 0 6px 20px rgba(26,22,18,.1); } .hover-card h3, .hover-card p, .hover-card strong { color: var(--ink); } .hover-card .text-muted { color: var(--muted) !important; } .row.neon-row { row-gap: 2rem; } .card.h-100 { flex: 1; } .blog-card:hover { transform: translateY(-4px); transition: all .25s ease; } /* ========================================== 9. BUTTONS ========================================== */ /* Replaced neon cyan glow with warm editorial button */ .neon-btn { color: var(--paper); background: var(--tag-bg); border: 1px solid var(--gold); box-shadow: none; text-shadow: none; transition: background .25s, color .25s, border-color .25s, box-shadow .25s; font-family: 'JetBrains Mono', monospace; font-weight: 600; border-radius: 3px; padding: 0.45em 1.6em; letter-spacing: 0.08em; text-transform: uppercase; font-size: 0.78rem; } .neon-btn:hover, .neon-btn:focus { background: var(--gold); color: var(--tag-bg) !important; border-color: var(--gold); box-shadow: 0 2px 10px rgba(184,134,11,.25); transform: translateY(-1px); } .btn-bottom-rounded { border-top-left-radius: 0; border-top-right-radius: 0; border-bottom-left-radius: 3px !important; border-bottom-right-radius: 3px !important; } /* ========================================== 10. FOOTER ========================================== */ /* Replaced cyan neon glow with editorial dark footer */ .neon-footer { background: var(--tag-bg) !important; color: #e8e0d5; border-top: 1px solid rgba(184,134,11,.2); box-shadow: none; } /* ========================================== 11. FAQ SECTION ========================================== */ .faq-section { max-width: 900px; margin: auto; background: var(--card-bg); border: 1px solid var(--border-soft); border-top: 3px solid var(--gold); border-radius: 6px; box-shadow: 0 2px 16px rgba(26,22,18,.07); color: var(--ink); padding: 2rem; } .faq-title { font-family: 'Playfair Display', serif; font-size: 1.7rem; font-weight: 800; text-align: center; color: var(--ink); background: none; -webkit-text-fill-color: var(--ink); margin-bottom: 2rem; letter-spacing: 0; } .accordion-header { border-radius: 4px; } .accordion-item { background: var(--paper); border: 1px solid var(--border-soft) !important; border-radius: 4px !important; margin-bottom: 0.5rem; box-shadow: none; } .accordion-button { background: var(--warm-mid); color: var(--ink); font-family: 'Source Serif 4', serif; font-weight: 600; font-size: 1rem; border: none; border-radius: 4px 4px 0 0; box-shadow: none; transition: background .2s, color .2s; text-shadow: none; } .accordion-button:hover, .accordion-button:focus { background: var(--gold-light); color: var(--ink); font-size: 1rem; /* removed size jump */ font-weight: 700; text-shadow: none; box-shadow: none; border-radius: 4px; outline: 1.5px solid var(--gold); outline-offset: 0; transition: background .2s, color .15s, outline .15s; } .accordion-button:not(.collapsed) { background: var(--tag-bg); color: var(--gold-light); text-shadow: none; } .accordion-body { background: var(--card-bg); color: var(--ink); border-radius: 0 0 4px 4px; font-size: 1rem; border-top: 1px solid var(--border-soft); box-shadow: none; } .faq-question { display: flex; align-items: center; gap: 0.7rem; font-size: 1rem; font-family: 'Source Serif 4', serif; } .faq-text:hover, .faq-question:hover .faq-text { color: var(--accent); background: rgba(192,57,43,.05); font-size: 1rem; /* removed size jump */ font-weight: 700; text-shadow: none; box-shadow: none; border-radius: 3px; outline: 1px solid rgba(192,57,43,.25); outline-offset: 2px; letter-spacing: 0; padding: 0.15em 0.5em; transition: color .15s, background .15s, outline .12s, font-weight .1s; } .faq-number { background: var(--gold); color: var(--tag-bg); border-radius: 50%; padding: 0.3rem 0.75rem; font-family: 'JetBrains Mono', monospace; font-weight: 700; font-size: 0.78rem; box-shadow: none; margin-right: 0.7rem; } /* FAQ scrollbar */ .faq-section ::-webkit-scrollbar { width: 6px; } .faq-section ::-webkit-scrollbar-thumb { background: var(--gold); border-radius: 3px; } .faq-section ::-webkit-scrollbar-track { background: var(--warm-mid); } /* ========================================== 12. LISTS & LIST GROUPS ========================================== */ /* Replaced neon glowing list groups with editorial style */ ol.list-group, ul.list-group { background: var(--card-bg); border-radius: 6px; padding: 0.5rem; box-shadow: none; border: 1px solid var(--border-soft); position: relative; } /* Remove the pseudo-element glow blur */ ol.list-group::before, ul.list-group::before { display: none; } li.list-group-item { background: var(--paper); color: var(--ink); border-radius: 4px; margin-bottom: 4px; border: 1px solid var(--border-soft); box-shadow: none; text-shadow: none; font-family: 'Source Serif 4', serif; font-weight: 400; font-size: 0.97rem; line-height: 1.7; padding: 0.55rem 1rem; } li.list-group-item::after { display: none; /* remove shimmer overlay */ } /* ========================================== 13. TABLES ========================================== */ /* Replaced neon glow table with warm editorial table */ .neon-table-wrapper { background: var(--card-bg); border: 1px solid var(--border-soft); border-radius: 6px; box-shadow: 0 2px 12px rgba(26,22,18,.06); padding: 1.5rem; margin: 2rem auto; max-width: 860px; overflow-x: auto; } /* Remove glow shimmer pseudo-element */ .neon-table-wrapper::after { display: none; } .neon-table { width: 100%; border-collapse: collapse; background: var(--card-bg); color: var(--ink); font-family: 'Source Serif 4', serif; font-size: 0.97rem; } .neon-table thead th { background: var(--tag-bg); color: var(--gold-light); font-family: 'JetBrains Mono', monospace; font-size: 0.72rem; letter-spacing: 0.1em; text-transform: uppercase; text-shadow: none; padding: 0.85rem 0.75rem; border-bottom: 2px solid var(--gold); } .neon-table tbody tr { transition: background .2s; } .neon-table tbody tr:hover { background: var(--warm-mid); } .neon-table td { padding: 0.75rem; border-bottom: 1px solid var(--border-soft); text-shadow: none; background: transparent; color: brown; color: var(--ink); } .neon-table tbody tr:last-child td { border-bottom: none; } .neon-table th, .neon-table td { border-right: 1px solid var(--border-soft); } .neon-table th:last-child, .neon-table td:last-child { border-right: none; } /* ========================================== 14. IMAGES & MEDIA ========================================== */ /* Replaced cyan glow with clean editorial treatment */ .neon-glossy-img { position: relative; display: inline-block; filter: none; border-radius: 4px; border: 1px solid var(--rule); box-shadow: 0 1px 8px rgba(26,22,18,.1); } .neon-glossy-img::after { display: none; /* remove gloss overlay */ } .card-img-top { height: 200px; object-fit: cover; } @media (max-width: 576px) { .card-img-top { height: 150px; } } .object-fit-cover { object-fit: cover; border-top-right-radius: 4px; border-bottom-right-radius: 4px; } @media (max-width: 767px) { .object-fit-cover { border-radius: 0 0 4px 4px; } } .zoom:hover { transform: scale(1.03); transition: transform .25s ease; } /* ========================================== 15. VIDEO CONTAINER ========================================== */ .video-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; background: var(--tag-bg); border-radius: 6px; border: 1px solid var(--border-soft); } .video-container iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } /* ========================================== 16. FORMS & INPUTS ========================================== */ .labelClass { margin-right: 2rem; } .chkClass { margin-right: 0.6rem; } .form-check-input[type="radio"] { width: 1.1em; height: 1.1em; border-radius: 50%; border: 2px solid var(--rule); background: var(--card-bg); appearance: none; position: relative; transition: border-color .2s; margin-right: 0.25em; } .form-check-input[type="radio"]:checked { border-color: var(--gold) !important; background: var(--gold-light) !important; } .form-check-input[type="radio"]:checked::after { content: ''; display: block; width: 0.6em; height: 0.6em; border-radius: 50%; background: var(--gold); position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); } .form-check-input { accent-color: var(--gold); border-width: 2px; background: var(--card-bg); box-shadow: none; } .form-check-label { color: var(--ink) !important; font-family: 'Source Serif 4', serif; font-size: 1rem; } /* ========================================== 17. QUIZ & RESULT STYLES ========================================== */ .correct-answer { background: #1c3a1c; color: #c8e6c8; font-weight: 600; padding: 2px 8px; border-radius: 3px; font-family: 'JetBrains Mono', monospace; font-size: 0.85rem; } .question { margin-bottom: 1.5rem; padding: 1rem 1.2rem; border: 1px solid var(--border-soft); border-radius: 4px; background: var(--card-bg); } .correct { color: #1a6020; font-weight: 700; } .incorrect { color: var(--accent); font-weight: 700; } .unattempted { color: #7a4800; font-weight: 700; } .score { font-family: 'JetBrains Mono', monospace; font-size: 0.97rem; margin-top: 1.5rem; padding: 1rem 1.2rem; background: var(--warm-mid); border: 1px solid var(--rule); border-radius: 4px; color: var(--ink); } /* ========================================== 18. HORIZONTAL RULES ========================================== */ hr.dotted { border-color: var(--rule); border-width: 2px; border-style: dotted; } hr.border-secondary { border-top: 1px solid var(--rule); opacity: 1; } /* Full-width editorial rule (from chapter theme) */ .full-rule { border: none; border-top: 1px solid var(--rule); margin: 2.5rem 0; } /* ========================================== 19. ANIMATIONS ========================================== */ @keyframes blink { 0% { opacity: 1; } 50% { opacity: 0; } 100% { opacity: 1; } } .blinking-text { animation: blink 1s infinite; } /* Editorial fade-up (from chapter theme) */ @keyframes fadeUp { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: translateY(0); } } .fade-up { animation: fadeUp .6s ease both; } /* ========================================== 20. BLOG STYLES ========================================== */ .blog-header-logo { font-family: 'Playfair Display', Georgia, serif; font-size: 2rem; font-weight: 800; color: var(--ink); text-decoration: none; } .blog-header-logo:hover { text-decoration: none; color: var(--accent); } .flex-auto { flex: 0 0 auto; } .h-250 { height: 250px; } @media (min-width: 768px) { .h-md-250 { height: 250px; } } .blog-pagination { margin-bottom: 4rem; } .blog-post { margin-bottom: 4rem; } .blog-post-meta { margin-bottom: 1.25rem; color: var(--muted); } /* ========================================== 21. BREADCRUMB ========================================== */ .breadcrumb-nav { background: transparent; } .breadcrumb-link { color: var(--muted); text-decoration: none; font-family: 'JetBrains Mono', monospace; font-size: 0.78rem; letter-spacing: 0.05em; transition: color .2s; } .breadcrumb-link:hover { color: var(--ink); } .breadcrumb-separator { color: var(--rule); font-weight: 500; margin: 0 0.3rem; } .breadcrumb-current { color: var(--ink); font-family: 'JetBrains Mono', monospace; font-size: 0.78rem; font-weight: 600; letter-spacing: 0.05em; } /* ========================================== 22. STICKY IMAGES ========================================== */ .always-sticky { position: -webkit-sticky; position: sticky; top: 0; z-index: 11; } @media (max-width: 767.98px) { .always-sticky { background: var(--tag-bg); padding-top: 0.5rem; padding-bottom: 0.5rem; } } /* ========================================== 23. CONTACT FORM ========================================== */ /* Replaced glass/blur dark card with warm editorial card */ .contact-card { background: var(--card-bg); border: 1px solid var(--border-soft); border-top: 3px solid var(--gold); border-radius: 6px; box-shadow: 0 2px 16px rgba(26,22,18,.08); animation: fadeUp .8s ease forwards; transition: box-shadow .3s; } .contact-card:hover { box-shadow: 0 4px 24px rgba(26,22,18,.12); } .contact-title { font-family: 'Playfair Display', serif; font-size: 1.6rem; font-weight: 800; color: var(--ink); text-shadow: none; } .contact-subtitle { color: var(--muted); font-size: 0.95rem; font-family: 'Source Serif 4', serif; } /* Inputs — replaced glass/cyan glow with warm editorial */ .contact-input { background: var(--paper); border: 1px solid var(--rule); color: var(--ink); border-radius: 4px; font-family: 'Source Serif 4', serif; transition: border-color .2s, box-shadow .2s; } .contact-input:focus { border-color: var(--gold); box-shadow: 0 0 0 3px rgba(184,134,11,.15); background: var(--card-bg); color: var(--ink); outline: none; } .form-floating > label { color: var(--muted); font-family: 'JetBrains Mono', monospace; font-size: 0.8rem; letter-spacing: 0.05em; } /* Submit button — editorial dark */ .contact-btn { background: var(--tag-bg); border: 1px solid var(--gold); border-radius: 3px; font-family: 'JetBrains Mono', monospace; font-weight: 600; font-size: 0.78rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--gold-light); box-shadow: none; transition: background .25s, color .25s, box-shadow .25s; } .contact-btn:hover { background: var(--gold); color: var(--tag-bg); transform: translateY(-1px); box-shadow: 0 3px 10px rgba(184,134,11,.25); } /* ========================================== 24. MATHJAX & EQUATION BOXES ========================================== */ /* Replaced dark gradient with warm parchment */ mjx-container[jax="CHTML"], .MathJax, mjx-container { color: var(--ink) !important; } .math-dark { color: var(--ink) !important; } .equation-box-soft { background: #fdf8f0; border: 1px solid #e0d4b8; border-left: 4px solid var(--gold); border-radius: 4px; padding: 1rem 1.4rem; margin: 1.2rem 0; overflow-x: auto; color: var(--ink); box-shadow: none; } /* Alert MathJax — ensure readable */ .alert mjx-container, .alert .MathJax, .alert mjx-math { color: inherit !important; } .alert-info { background: #f0f6fa; border: 1px solid #b8d0dc; color: #1a3040; border-radius: 4px; } /* Note box — replaced dark bg with warm parchment */ .note-box { border-left: 4px solid var(--gold); padding: 0.9rem 1.1rem; background: var(--warm-mid); color: var(--ink); font-family: 'Source Serif 4', serif; font-size: 1rem; font-weight: 400; border-radius: 4px; } /* ========================================== 25. BOOTSTRAP UTILITY OVERRIDES ========================================== */ .bd-placeholder-img { font-size: 1.125rem; text-anchor: middle; user-select: none; } @media (min-width: 768px) { .bd-placeholder-img-lg { font-size: 3.5rem; } } .b-example-divider { width: 100%; height: 3rem; background: rgba(0,0,0,.04); border: solid rgba(0,0,0,.08); border-width: 1px 0; box-shadow: inset 0 .5em 1.5em rgba(0,0,0,.05); } .b-example-vr { flex-shrink: 0; width: 1.5rem; height: 100vh; } .bi { vertical-align: -0.125em; fill: currentColor; } .nav-scroller { position: relative; z-index: 2; height: 2.75rem; overflow-y: hidden; } .nav-scroller .nav { display: flex; flex-wrap: nowrap; padding-bottom: 1rem; margin-top: -1px; overflow-x: auto; text-align: center; white-space: nowrap; -webkit-overflow-scrolling: touch; } /*=================================================*/ /*MathJax*/ /*=================================================*/ mjx-container, mjx-math, mjx-mi, mjx-mo, mjx-mn { color: #ffffff !important; /*background: transparent !important;*/ } /* ========================================== END OF STYLESHEET ========================================== */