@font-face { font-family: 'Noto Sans'; font-style: normal; font-weight: 400; src: local('Noto Sans'), local('NotoSans'), url('../fonts/NotoSans.ttf') format('truetype'); } @font-face { font-family: 'Noto Sans'; font-style: normal; font-weight: 700; src: local('Noto Sans Bold'), local('NotoSans-Bold'), url('../fonts/NotoSansBold.ttf') format('truetype'); } @font-face { font-family: 'Noto Sans'; font-style: italic; font-weight: 400; src: local('Noto Sans Italic'), local('NotoSans-Italic'), url('../fonts/NotoSansItalic.ttf') format('truetype'); } html { font-family: 'Noto Sans', 'DejaVu Sans', sans-serif; font-size: 12pt; color: @color-text; background-color: @color-footer; } p { margin-bottom: 0.5rem; } h1, h2, h3 { font-weight: normal; margin-bottom: 1em; } h1 { color: @color-main; } a, a:link, a:visited, a:hover, a:active { color: crimson; text-decoration: none; transition: all 0.25s ease-in; } a:hover { color: #900000; text-decoration: underline; } main a:visited, footer a:visited { color: #a40000; } section { max-width: 975px; max-width: 60rem; margin: 0 auto; padding: 1rem 3rem; vertical-align: top; } header, main { background-color: @color-bg; } dl { width: 100%; } dl::after { content: ""; display: block; clear: both; } dt, dd { float: left; margin-bottom: 1em; } dt { font-weight: bold; color: @color-main; width: 30%; margin-right: 5%; } dd { width: 65%; } /** * Footnotes */ sup { position: relative; font-size: 80%; top: -0.5em; } /** * Main text */ main, footer { line-height: 1.75; } main { h1, h2, h3, h4, h5, h6 { color: @color-main; margin-top: 0.25em; margin-bottom: 0.25em; } h1 { font-size: 200%; } h2 { font-size: 150%; } h3 { font-size: 125%; } h4, h5, h6 { font-weight: bold; } }