1/*@font-face {
  2  font-family: 'Inter';
  3  src: url('/static/fonts/Inter-V.otf') format('opentype');
  4}*/
  5
  6@supports (font-variation-settings: normal) {
  7  html { 
  8    font-family: 'Charter', sans-serif; 
  9    font-feature-settings: 'ss01' 1, 'kern' 1, 'liga' 1, 'zero' 1, 
 10    'cv03' 1, 'cv02' 1, 'cv04' 1, 'tnum' 1; 
 11  }
 12}
 13
 14@font-face {
 15  font-family: 'Charter';
 16  src: url('/static/fonts/charter_italic.woff') format('woff');
 17  font-style: italic;
 18}
 19
 20
 21@font-face {
 22  font-family: 'Charter';
 23  src: url('/static/fonts/charter_bold.woff') format('woff');
 24}
 25
 26@font-face {
 27  font-family: 'Charter';
 28  src: url('/static/fonts/charter_regular.woff') format('woff');
 29}
 30
 31
 32:root {
 33  --bg: #fff;
 34  --cyan: #1e9191;
 35  --light-gray: #eee;
 36  --gray: gray;
 37  --code: #666;
 38  --dark: #444;
 39}
 40
 41body {
 42  text-align: center;
 43}
 44
 45html {
 46  background: var(--bg);
 47  font-size: 21px;
 48  line-height: 1.5;
 49}
 50
 51.content > article, p, blockquote, ul {
 52  line-height: 1.5;
 53  font-family: 'Charter';
 54  font-feature-settings: normal;
 55}
 56
 57.pull-right > p {
 58  font-family:  'Charter';
 59}
 60
 61/*.content > h1, h2, h3, h4 {
 62  font-family: 'Inter';
 63}*/
 64
 65a {
 66  color: var(--gray);
 67  text-decoration: none;
 68}
 69
 70a:hover {
 71  background: #eee;
 72  color: var(--dark);
 73}
 74
 75
 76article a, a:hover {
 77  color: inherit;
 78  background: 0;
 79  text-decoration: underline;
 80  outline: 0;
 81}
 82
 83.navbar {
 84  margin: 2px 0;
 85}
 86
 87.sidebar-link {
 88  font-size: 15px;
 89  color: var(--dark);
 90}
 91
 92.container {
 93  display: grid;
 94  grid-template-columns: repeat(12, minmax(0, 1fr));
 95  min-width: 0;
 96  margin-bottom: 20px;
 97}
 98
 99.pull-right {
100  padding-top: 20%;
101  text-align: left;
102  grid-column: 1 / 13;
103  grid-row: 2;
104}
105
106.pull-right > p:not(:last-child) {
107  padding: 0px;
108  margin: 0px;
109  padding-top: 2%;
110  padding-left: 3%;
111  padding-bottom: 1%;
112}
113
114.pull-right > h3 {
115  color: var(--dark);
116  padding: 0px;
117  margin: 0px;
118  padding-top: 7%;
119  padding-left: 3%;
120}
121
122.pull-left {
123  grid-column: 1 / 13;
124  grid-row: 1;
125}
126
127.openring {
128  display: inline-block;
129}
130
131.openring-feed > p {
132  padding: 4px 8px 4px;
133  font-family: 'Charter';
134}
135
136.sep {
137  display: visible;
138}
139
140.content {
141  text-align: left;
142}
143
144pre {
145  overflow-x: auto;
146  overflow-y: hidden;
147  padding: 10px;
148  min-width: 0;
149}
150
151
152code {
153  color: var(--cyan);
154  border-bottom: unset;
155}
156
157pre > code {
158  color: var(--code);
159}
160
161pre {
162  background: var(--bg)
163}
164
165@media only screen and (min-width: 800px) {
166  .pull-right {
167    text-align: left;
168    max-width: 100%;
169    grid-column: 9 / 13;
170    grid-row: 1;
171  }
172
173  .sep {
174    display: hidden;
175  }
176
177  .pull-left {
178    grid-column: 2 / 9;
179    grid-row: 1;
180  }
181  .content {
182    margin: 0 auto;
183  }
184  
185  
186  .openring {
187    display: grid;
188    grid-template-columns: repeat(3, minmax(0, 1fr));
189    min-width: 0;
190  }
191  
192  .openring-feed {
193    grid-row: 1;
194    font-size: 16px;
195    padding: 4px 8px 4px;
196  }
197
198}
199
200@media only screen and (min-width: 1200px) {
201  .pull-right {
202    max-width: 100%;
203    text-align: left;
204    grid-column: 8 / 10;
205    padding-left: 10%;
206    grid-row: 1;
207  }
208
209  .sep {
210    display: hidden;
211  }
212  .pull-left {
213    grid-column: 4 / 8;
214    grid-row: 1;
215  }
216  .content {
217    margin: 0 auto;
218  }
219
220  html {
221    font-size: 21px;
222  }
223
224  .openring {
225    display: grid;
226    grid-template-columns: repeat(3, minmax(0, 1fr));
227    min-width: 0;
228  }
229  
230  .openring-feed {
231    grid-row: 1;
232    font-size: 16px;
233    padding: 4px 8px 4px;
234  }
235}
236
237
238.logo {
239  width: 180px;
240  margin-bottom: 20px;
241}
242
243footer {
244  color: var(--gray);
245  bottom: 20px;
246  width: 100%;
247  text-align: center;
248  margin-bottom: 20px;
249}
250
251header {
252  top: 30px;
253  display: inline-block;
254  width: 100%;
255  text-align: left;
256  padding-bottom: 2%;
257}
258
259header a {
260  margin-right: 20px;
261}
262
263header a:last-child {
264  margin-right: 0
265}
266
267.muted {
268  color: var(--gray);
269  font-family: 'Charter';
270  font-size: 18px;
271}
272
273.muted a {
274  color: var(--cyan);
275  border-bottom: unset;
276}
277
278table {
279  width: 100%;
280}
281
282td {
283  white-space: nowrap;
284}
285
286
287
288td:first-child {
289  width: 100%;
290  max-width: 1px;
291  white-space: nowrap;
292  text-overflow: ellipsis;
293  overflow: hidden;
294}
295
296img {
297  max-width: 100%;
298  margin: 0 auto;
299  display: block;
300  border: 0px solid transparent;
301  border-radius: 5px;
302}
303
304
305.icons a {
306  color: unset;
307  background: unset;
308  border-bottom: unset;
309}
310
311.icons a:hover {
312  color: unset;
313  background: unset;
314  border-bottom: unset;
315}
316
317.subtitle {
318  font-style: italic;
319  font-weight: normal;
320  font-variant: unset;
321  color: var(--dark);
322  padding-bottom: 30px;
323}
324
325h2, h3, h4 {
326  font-variant: all-small-caps;
327}
328
329h2 { 
330  color: var(--dark);
331}
332
333h3 {
334  color: black;
335}
336
337p {
338  bottom: 2em;
339}
340
341blockquote {
342  border-left: 0.25rem solid var(--gray);
343  color: var(--gray);
344  font-style: italic;
345  margin: .8rem 0;
346  padding: .5rem 1rem
347}
348hr {
349  width: 20%;
350}
351
352::selection {
353  background-color: var(--dark);
354  color: white;
355}
356
357.icons img {
358  all: initial;
359}
360
361.icons img {
362  padding-left: 3%;
363  padding-top: 10px;
364  max-height: 2rem;
365  display: inline-block;
366  vertical-align: text-top;
367  image-orientation: from-image;
368  max-width: 100%;
369  padding-bottom: 5px;
370  cursor: pointer;
371}