/* Font declarations */ @font-face { font-family: 'Lato'; src: url('/fonts/Lato/Lato-Regular.ttf') format('truetype'); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: 'Lato'; src: url('/fonts/Lato/Lato-Bold.ttf') format('truetype'); font-weight: bold; font-style: normal; font-display: swap; } @font-face { font-family: 'Domine'; src: url('/fonts/Domine/static/Domine-Regular.ttf') format('truetype'); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: 'Domine'; src: url('/fonts/Domine/static/Domine-Bold.ttf') format('truetype'); font-weight: 700; font-style: normal; font-display: swap; } @font-face { font-family: 'Abril Fatface'; src: url('/fonts/Abril_Fatface/AbrilFatface-Regular.ttf') format('truetype'); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: 'Georgia'; src: url('/fonts/georgia/georgia.ttf') format('truetype'); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: 'Georgia'; src: url('/fonts/georgia/georgiab.ttf') format('truetype'); font-weight: bold; font-style: normal; font-display: swap; } @font-face { font-family: 'Georgia'; src: url('/fonts/georgia/georgiai.ttf') format('truetype'); font-weight: normal; font-style: italic; font-display: swap; } @font-face { font-family: 'Georgia'; src: url('/fonts/georgia/georgiaz.ttf') format('truetype'); font-weight: bold; font-style: italic; font-display: swap; } :root { --main-font-family: Georgia, "Times New Roman", serif; /* Light mode variables */ --background-color: #fff; --background-secondary: #f8f9fa; --text-color: #212529; --text-secondary: #6c757d; --border-color: #dee2e6; --shadow-color: rgba(0, 0, 0, 0.15); --primary-text: #58151c; --secondary-text: #052c65; --link-hover-color: #555; --link-hover-color-rgb: 85, 85, 85; } @media (prefers-color-scheme: dark) { :root { /* Dark mode variables */ --background-color: #212529; --background-secondary: #343a40; --text-color: #f8f9fa; --text-secondary: #adb5bd; --border-color: #495057; --shadow-color: rgba(0, 0, 0, 0.5); --primary-text: #ffddb3; --secondary-text: #c6e2ff; --link-hover-color: #ddd; --link-hover-color-rgb: 221, 221, 221; } } html, body { height: 100%; margin: 0; } body { font-family: var(--main-font-family); background-color: var(--background-color); color: var(--text-color); display: flex; flex-direction: column; min-height: 100vh; } /* Make main content grow to push footer down */ main.container { flex: 1 0 auto; } /* Dark mode overrides for Bootstrap components */ @media (prefers-color-scheme: dark) { .bg-body-secondary { background-color: var(--background-secondary) !important; } .text-body-emphasis { color: var(--text-color) !important; } .border, .border-bottom { border-color: var(--border-color) !important; } .link-secondary { color: var(--text-secondary) !important; } .shadow-sm, .shadow { box-shadow: 0 .125rem .25rem var(--shadow-color) !important; } .btn-light { background-color: var(--background-secondary); color: var(--text-color); border-color: var(--border-color); } .list-group-flush .list-group-item { background-color: transparent; color: var(--text-color); border-color: var(--border-color); } .text-muted { color: var(--text-secondary) !important; } .figure-caption { color: var(--text-secondary) !important; } } .link { font-family: 'Lato', monospace; color: var(--link-color); } .link:hover { color: var(--link-hover-color); } .blog-link { color: var(--text-color); } .blog-link:hover { color: var(--link-hover-color); } .section { margin-top: 2rem; margin-bottom: 2rem; } .paper-container { padding: .8rem; } .paper-title { font-size: calc(1.0rem + 0.1vw); font-weight: 500; } .paper-link { font-size: calc(0.7rem + 0.1vw); } .venue-name { font-size: calc(0.85rem + 0.1vw); font-weight: 500; } .author-name, .project-desc, .tldr { font-size: calc(0.7rem + 0.1vw); } .primary-text { color: var(--primary-text); } .secondary-text { color: var(--secondary-text); } .blog-title { font-family: 'Domine', serif; font-weight: 700; } blockquote { border-left: 4px solid var(--border-color); margin: 1.5em 0; padding: 0.5em 1em; background-color: var(--background-secondary); } blockquote p { margin: 0; } @media (prefers-color-scheme: dark) { blockquote { border-left-color: var(--border-color); } } footer { margin-top: 0rem; padding: 1rem 0; width: 100%; flex-shrink: 0; }