body { display: flex; flex-flow: column wrap; line-height: 1.5em; height: 100%; } main { max-width: 50em; margin: auto; flex: 1; padding: 1.5rem; } img { max-width: 100%; } code, blockquote { background: #eee; } code { font-family: monospace; } blockquote { font-style: italic; border-left: 10px solid #ccc; margin: 1.5em 10px; padding: 0.5em 10px; } head tr th { border-bottom: 1px solid var(--accent); } tr td:nth-child(1) { border-right: 1px solid var(--accent); } /* Homepage */ .intro > h1 { color: #212121; font-size: 6vh; } .intro > h2 { color: #757575; font-size: 3vmin; } /* Page content */ .content { padding-top: 20px; } /* Profile picture */ .profile { width: 10vh; height: 10vh; border-radius: 50%; } /* Colored links */ a:link, a:visited { color: var(--accent); } a.icon:hover { text-decoration: none; } a:hover { color: var(--accent) !important; } /* Copyright message */ .copyright { margin: 15px 0; } /* Paginator */ .pages { padding: 15px 0; } .pages-icon { padding: 0 15px; } /* List item for posts/projects */ .item { padding: 10px 0; } .item-tag { background-color: var(--accent); } /* Navigation */ .navbar-icon { width: 1em; height: 1em; display: inline-block !important; } .navbar-icon.email { background-image: url('/icons/email.svg'); } .navbar-icon.twitter { background-image: url('/icons/twitter.svg'); } .navbar-icon.git { background-image: url('/icons/share.svg'); } nav{ display: flex; border-bottom: var(--border-width) solid var(--accent); } nav div { flex: 1 0 33%; } nav a { flex: 1 0 33%; } footer { border-top: var(--border-width) solid var(--accent); } /* helpers */ .right { text-align: right; float: right; } .left { text-align: left; float: left; }