html { font-size: 0.6em; font-family: -apple-system, verdana, sans-serif; } body { font-size: 1.6rem; color: #333; } header { margin: 1rem 0; } nav { text-align: left; } nav a { color: inherit; font-size: 1.8rem; font-weight: bold; text-decoration: none; margin: 0 0 0 1.2rem; display: inline; } .logo { margin: 0; text-align: left; } .logo a { float: left; font-size: 1.8rem; } pre { overflow-x: scroll; } footer { margin-top: 3rem; padding: 1.2rem 0; font-size: 1.2rem; color: #555; text-align: right; } h1 { font-size: 2.4rem; } h2 { font-size: 2rem; } article .header { font-size: 1.4rem; font-style: italic; color: #555; } article img { max-width: 100%; } .logo a { font-weight: bold; color: #000; text-decoration: none; } /* on mobile prevent stupidly long inline code snippets */ p code { word-break: break-word; } @media (max-width: 319px) { body { width: 90%; margin: 0; padding: 0 5%; } } @media (min-width: 320px) { body { width: 90%; margin: 0; padding: 0 5%; } } @media (min-width: 640px) { body { width: 60rem; margin: 0 auto; padding: 0; } }