@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,400i,600,600i);
@import url(https://fonts.googleapis.com/css?family=Roboto+Mono:400,700);

html { font: 16px / 20px "Source Sans Pro", sans-serif; color: #333; }
body { margin: 0; }
body > nav { display: flex; border-bottom: 1px solid #ddd; }
body > nav > * { flex: none; padding: 20px 0px 20px 20px; }
body > nav > :first-child { flex: auto; padding-left: 40px; }
body > nav > :first-child > span { white-space: nowrap; }
body > nav::after { background: no-repeat 20px center / 50px 20px url(earthtag.svg); width: 110px; height: 20px; display: inline-block; content: ""; padding: 20px 0px; }
body > nav a.top:link, body > nav a.top:visited { color: #333; }
main { font-size: 14px; margin: 100px 40px 160px 40px; }
article h1 { font-size: 30px; line-height: 40px; margin: 20px auto; }
article > .date { font-weight: 600; }
article > * { max-width: 680px; margin-left: auto; margin-right: auto; }
b { font-weight: 600; color: #444; }
a:link, a:visited { color: #7E78B9; text-decoration: none; font-weight: 600; }
article h1 a:link, article h1 a:visited { color: #333; }
pre, code { font: 12px / 20px "Roboto Mono", monospace; }
pre { margin: 20px auto; padding: 20px; background-color: #f4f4f4; overflow-x: auto; box-sizing: border-box; }
pre em { font-style: normal; background-color: #ffed00; }
dl.archives > dt { font-weight: 600; float: left; width: 16ch; text-align: right; }
dl.archives > dd { margin-left: 18ch; }
article h2 { font-size: 18px; line-height: 20px; }
article.previously h1 { font-size: 18px; line-height: 20px; margin-top: 80px; }
figure { margin: 40px auto; }
figcaption { margin: 0 auto; font-weight: 600; }