1/* main */
  2body {
  3    background-color: #000;
  4    margin: 0;
  5}
  6
  7article {
  8    background-color: #fffff0;
  9}
 10
 11nav, main, footer div {
 12    max-width: 720px;
 13    margin: 0 auto;
 14}
 15
 16main {
 17    padding: 10px 20px;
 18    border-radius: 4px;
 19    background-color: #fffff7;
 20    box-shadow: 0 0 10px #eee;
 21}
 22
 23/* navigation */
 24nav.sections {
 25    padding-top: 20px;
 26    display: flex;
 27    justify-content: space-between;
 28}
 29
 30nav.sections ul {
 31    list-style-type: none;
 32    margin: 0;
 33    padding: 0;
 34    margin-bottom: 8px;
 35}
 36
 37nav.sections li {
 38    font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
 39    display: inline;
 40    margin: 0 -2px;
 41    font-size: 1.3em;
 42}
 43
 44nav.sections .left a {
 45    color: #787878;
 46    border-bottom: solid 2px #A8A8A8;
 47    padding: 0 16px;
 48}
 49
 50nav.sections .left a.selected, nav.sections .left a:hover {
 51    color: #000000;
 52    border-bottom: solid 2px #444444;
 53}
 54
 55nav.sections img {
 56    margin: 0 4px;
 57}
 58
 59.left {
 60    justify-self: flex-start;
 61}
 62
 63.right {
 64    justify-self: flex-end;
 65}
 66
 67/* footer */
 68footer {
 69    margin-top: 32px;
 70    min-height: 64px;
 71    background: linear-gradient(#fffff0, #ccccc0);
 72}
 73
 74footer p {
 75    font-style: italic;
 76    color: #666;
 77    font-family: serif;
 78}
 79
 80footer img {
 81    display: inline-block;
 82    vertical-align: middle;
 83}
 84
 85.abyss {
 86    text-align: center;
 87}
 88
 89/* headers */
 90h1, h2 {
 91    font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
 92    font-size: 200%;
 93    font-weight: lighter;
 94    text-transform: capitalize;
 95    padding-bottom: 10px;
 96    border-bottom: 1px solid #000;
 97    text-align: center;
 98}
 99
100h1.title {
101    text-align: center;
102    font-family: serif;
103    font-size: 2.5em;
104    font-weight: lighter;
105    font-variant-caps: small-caps;
106    border-bottom: 4px double #000;
107}
108
109h3 {
110    font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
111    font-size: larger;
112    font-weight: lighter;
113    text-decoration: underline;
114}
115
116h1:not(.title):hover .anchor, h2:hover .anchor, h3:hover .anchor, h4:hover .anchor, h5:hover .anchor, h6:hover .anchor {
117    opacity: 1;
118}
119
120.anchor {
121    float: left;
122    padding-right: 0.4ch;
123    margin-left: -1.3ch;
124    opacity: 0;
125    transition: opacity 150ms;
126}
127
128/* body */
129p, li, dl, summary {
130    font-family: Tahoma, Geneva, sans-serif;
131    font-size: 1.1em;
132    line-height: 1.5;
133}
134
135img {
136    max-width: 100%;
137}
138
139.dim {
140    color: #999;
141    font-size: smaller;
142}
143
144a {
145    text-decoration: none;
146    color: #f74c00;
147    border-bottom: 0 dashed rgba(0, 0, 0, 0);
148    transition: color 300ms, border-bottom 300ms;
149}
150
151a:hover {
152    color: #e33b26;
153    border-bottom: 1px solid #e33b26;
154}
155
156blockquote {
157    border-left: 4px solid #000;
158    padding-left: 8px;
159    font-style: italic;
160    color: #444;
161}
162
163.footnote-definition:target {
164    background-color: rgba(255, 255, 0, 0.2);
165}
166
167dl img {
168    margin-bottom: -0.4em;
169    margin-right: 0.6em;
170}
171
172dd {
173    margin-bottom: 1em;
174}
175
176div.time {
177    text-align: right;
178    font-style: italic;
179    color: #777;
180    font-size: 0.9em;
181}
182
183div.time p {
184    line-height: 0.5;
185}
186
187hr {
188    border: 0;
189    border-bottom: 2px dashed #aaa;
190}
191
192/* code */
193code {
194    font-weight: bold;
195    font-size: large;
196    background-color: #f7f7f0;
197}
198
199pre code {
200    font-weight: normal;
201    font-size: 1em;
202    background: none;
203}
204
205pre {
206    background-color: #eee;
207    padding: 4px;
208    overflow: auto;
209    max-height: 480px;
210}
211
212kbd {
213    padding: 3px 5px;
214    font: 0.9em monospace;
215    color: #333;
216    background-color: #fafafa;
217    border: 1px solid #ddd;
218    border-radius: 4px;
219    box-shadow: 0 2px 0 #ddd;
220}
221
222/* tables */
223table {
224    border-collapse: collapse;
225}
226
227th {
228    background-color: #f7f7e8;
229}
230
231th, td {
232    padding: 0.5em;
233    border: 1px solid #aaa;
234}
235
236tr:nth-child(even) {
237    background-color: #f7f7e8;
238}
239
240/* graphs post */
241div.matrix table {
242    border-width: 0 2pt 0 2pt;
243    border-style: solid;
244    border-color: #000;
245}
246
247/* poor man's matrix */
248div.matrix tr:first-child td:first-child, div.matrix tr:first-child td:last-child {
249    border-top: 2pt solid #000;
250}
251
252div.matrix tr:last-child td:first-child, div.matrix tr:last-child td:last-child {
253    border-bottom: 2pt solid #000;
254}
255
256div.matrix td {
257    border: none;
258}
259
260em.math {
261    font-family: 'Times New Roman', Times, serif;
262    font-size: larger;
263}
264
265/* special */
266::-moz-selection {
267    background-color: #FFAA00;
268    color: #000000;
269}
270
271::selection {
272    background-color: #FFAA00;
273    color: #000000;
274}