body { max-width: 800px; margin: auto; padding: 2em 1.5em; line-height: 1.55; color: #18181b; background: #f9f8f5; } a { color: #166534; } a:hover { color: #14532d; } /* nav */ nav { margin-bottom: 2.5em; } nav a, .menu a { font-family: Georgia, "Times New Roman", serif; font-size: 0.75em; text-decoration: none; letter-spacing: 0.08em; text-transform: uppercase; color: #71717a; margin-right: 1.2em; } nav a:hover, .menu a:hover { color: #18181b; } .menu { display: inline; list-style: none; padding: 0; margin: 0; } .menu li { display: inline; } /* article meta */ .article-meta { margin-bottom: 1.5em; } .article-meta h1, .article-meta h2 { font-family: Georgia, "Times New Roman", serif; font-size: 1.5em; font-weight: 700; line-height: 1.2; margin: 0 0 0.25em; color: #111; } .date { font-family: Georgia, "Times New Roman", serif; font-size: 0.78em; color: #71717a; } /* footer */ footer { margin-top: 3em; text-align: center; font-family: Georgia, "Times New Roman", serif; font-size: 0.78em; color: #a1a1aa; } footer a { text-decoration: none; color: #71717a; } hr { border: none; border-top: 1px solid #e4e4e7; margin: 2em 0; } /* main */ .main { margin-top: 0; } /* headings */ h1, h2, h3, h4 { font-family: Georgia, "Times New Roman", serif; font-weight: 600; line-height: 1.25; margin-top: 1.7em; margin-bottom: 0.3em; color: #111; } h1 { font-size: 1.4em; } h2 { font-size: 1.15em; border-top: 1px solid #d4d4d8; padding-top: 0.75em; margin-top: 1.5em; } h3 { font-size: 1em; } /* paragraphs */ p { margin: 0.65em 0; } /* lists */ ul, ol { padding-left: 1.4em; margin: 0.2em 0; } li { margin: 0.1em 0; } /* code */ pre { background: #dedad3; border-left: 3px solid #c0bdb5; padding: 0.85em 1em; overflow-x: auto; margin: 0.75em 0; } code { background: #dedad3; padding: 0.12em 0.3em; border-radius: 3px; font-size: 88%; } pre code { background: none; padding: 0; border-radius: 0; font-size: inherit; } /* blockquote */ blockquote { border-left: 3px solid #d4d4d8; padding: 0 0.9em; color: #52525b; margin: 0.75em 0; } /* table */ table { width: 100%; border-collapse: collapse; font-size: 0.9em; margin: 0.75em 0; } thead th { border-bottom: 2px solid #d4d4d8; text-align: left; padding: 0.3em 0.6em; font-family: Georgia, "Times New Roman", serif; font-size: 0.82em; letter-spacing: 0.05em; text-transform: uppercase; color: #71717a; } td { padding: 0.28em 0.6em; border-bottom: 1px solid #ebebea; } tr:last-child td { border-bottom: none; } /* misc */ img, iframe, video { max-width: 100%; } main { hyphens: auto; }