-* {
- margin: 0;
- padding: 0;
+h1 canvas {
+ width: 64px;
+ height: 64px;
+ display: inline-block;
+ background-color: gainsboro;
}
-body {
- background-image: url('/images/header_background.png');
- background-size: auto 300px;
- background-attachment: fixed;
- line-height: 1.45;
+ul {
+ list-style: square;
}
-header {
- background-image: url('/images/header_foreground.png');
- background-repeat: no-repeat;
- background-size: auto 300px;
- height: 300px;
-}
-
-header a {
- color: transparent;
- display: block;
- max-height: 500px;
+h1, h2, h3, h4, p, ul {
+ max-width: 30em;
}
-main {
- background-color: white;
- padding: 1.414em;
+p {
+ font-size: 1.125em;
}
-h1, h2, h3, h4 {
- margin: 1.414em 0 0.5em;
- font-weight: 400;
+img {
+ max-width: 100%;
}
-p, ul, ol, img {
- width: 100%;
- margin: 1.414em 0;
- max-width: 30em;
-}
+@media (prefers-color-scheme: dark) {
+ body {
+ color: white;
+ background-color: black;
+ }
-ul, ol { margin-left: 1.414em; }
+ a {
+ color: #5dc1fd;
+ }
-h1 { font-size: 3.998em; }
-h2 { font-size: 2.827em; }
-h3 { font-size: 1.999em; }
-h4 { font-size: 1.414em; }
-
-code {
- background-color: whitesmoke;
- padding: 0.2em 0.5em;
-}
-
-pre {
- background-color: whitesmoke;
- padding: 1em;
- max-width: 40em;
+ a:visited {
+ color: #ed6eff;
+ }
}
-footer {
- background-color: pink;
- padding: 1.414em;
-}