// Main styles and centering body { margin: 3rem auto; max-width: 55rem; line-height: 1.3; font-size: 1.2rem; padding: 0 2rem; background-color: #252422; color: #DCE1DE; font-family: arial; } // more compact margins h1, h2, h3, h4 { margin-bottom: 0.3rem; } ul { margin-top: 0.3rem; } a { color: #8B95C9; } h1 a { text-decoration: none; } // Blog titles .header-title { margin: 0; font-size: 2.5rem; } .subtitle { margin: 0.5rem auto; } .blog-header { display: flex; justify-content: space-between; } .blog-header-left { padding-right: 1rem; flex: 1 1 auto; max-width: 60%; } .blog-header-right { flex: 0 0 auto; white-space: nowrap; text-align: right; } // Blog element styling pre { padding : 0.5rem; border-radius: 0.3rem; overflow: auto; tab-size: 4; font-family: monospace; } blockquote { background: #171615; border-left: 0.7rem solid #F3E9DC; border-radius: 0.5rem; margin: 1.5em 10px; padding: 0.5em 10px; } blockquote p { margin-top: 0.2rem; margin-bottom: 0.2rem; } p code { background: #171615; padding-left: 0.5rem; padding-right: 0.5rem; font-family: monospace; } img { width: 40rem; display: block; margin: 0 auto; } .footer-text { text-align: center; } .footer-text a { text-decoration: none; }