html {
width: 35rem;
margin: 0 auto;
padding: 2rem;
font-size: 1em;
color: #e1e2ee;
font-family: Palatino, "Palatino Linotype", serif;
}
hr {
margin: 2rem 1.5rem;
border: 0;
border-top: 1px solid #eee;
text-align: center;
line-height: 1px;
}
h1, h2, h3, h4, h5, h6 {
font-style: italic;
line-height: 1.1;
}
.more {
font-style: italic;
}
h2 {
font-weight: 500;
margin-top: 2rem;
}
h3, h4, h5, h6 {
font-weight: 500;
margin-top: 1.5rem;
}
header {
flex-wrap: wrap;
display: flex;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}
h1 {
font-size: 150%;
}
h2 {
font-size: 117%;
}
h3 {
font-size: 100%;
}
h4 {
font-size: 83%;
}
h5 {
font-size: 67%;
}
a {
color: #337ab7;
text-decoration: none;
}
a:hover {
color: #23527c;
text-decoration: underline;
}
video:focus {
outline: none;
box-shadow: 0 0 0 4px lightgrey;
}
pre, code {
border-radius: 4px;
font-family: Menlo, monospace;
font-size: 0.9em;
}
pre {
background-color: #060e1a;
}
p code, li code {
background-color: lightgrey;
}
pre {
display: block;
padding: 9.5px;
margin: 0 0 10px;
color: #333;
word-break: break-all;
word-wrap: break-word;
border: 1px solid #ccc;
}
blockquote {
font-style: italic;
}
article img {
width: 100%;
border-radius: 8px;
}
article audio {
width: 100%;
}
article video {
border-radius: 8px;
width: 100%;
}
iframe {
border: 0px;
}
.title {
font-variant: small-caps;
}
.center {
text-align: center;
}
.tags, .tag-list {
font-variant: small-caps;
font-style: italic;
font-size: 1.5em;
}
.tags {
margin-left: auto;
font-size: 0.9em;
}
.tag-list {
text-align: center;
}
.tag-list > a {
display: block;
}
.links {
font-variant: small-caps;
margin: 0 -0.25em;
}
.links > a, .links > span {
margin: 0 0.25em;
}
.links > span {
margin-right: auto;
}
@media only screen and (max-width: 40rem) {
html {
width: calc(100vw - 5rem);
font-size: 1em;
}
.spacer {
width: 100%;
}
}
@media only screen and (max-width: 320px) {
html {
width: calc(320px - 5rem);
}
}