$linkColor: royalblue; $linkColorVisited: darkorchid; $metaColor: dimgray; $metaColorLight: lightgray;
/* CSS Reset */
-
{ margin: 0; padding: 0; box-sizing: border-box; }
a { text-decoration: none; } img { border: 0; }
/* HTML Elements */ body {
margin: 2rem 1rem;
} @media all and (max-width: 480px){
body { margin: 1.4rem 0.5rem; }
}
h1 {
margin-bottom: 1rem; font-size: 1.1rem;
} h2, h3, h4, h5, h6 {
font-size: 1rem;
} h2 {
margin-top: 2.5em; margin-bottom: 1em;
} h3, h4, h5, h6 {
margin-top: 2em; margin-bottom: 1em;
} h2:before, h3:before, h4:before, h5:before, h6:before {
font-size: 0.8em; font-style: italic; color: $metaColorLight; margin-left: -1.4rem; margin-right: 0.4rem;
} h2:before {
content: "H2";
}
h3:before {
content: "H3"; margin-right: 0.8rem;
}
h4:before {
content: "H4"; margin-right: 0.8rem;
}
h5:before {
content: "H5"; margin-right: 1.2rem;
}
h6:before {
content: "H6"; margin-right: 1.2rem;
}
ul, ol {
margin-bottom: 1rem; li { margin-left: 1.5rem; }
}
a {
text-decoration: underline; color: $linkColor;
}
a:visited {
color: $linkColorVisited;
}
p, span, a, li {
line-height: 1.8; word-break: keep-all; vertical-align: baseline;
}
p {
margin-bottom: 1rem;
}
blockquote {
margin-top: 1.25rem; margin-bottom: 1.25rem; padding: 1rem; background-color: ghostwhite; border-left: 8px solid; p { margin-bottom: 1rem; &:last-child { margin-bottom: 0; } }
}
pre {
margin-top: 1.25rem; margin-bottom: 1.25rem; padding: 1rem; background-color: ghostwhite; white-space: pre-wrap;
}
hr {
margin-top: 2rem; margin-bottom: 1.5rem;
}
code {
word-break: break-all; overflow: auto;
}