/* Resets */

*,:after,:before{
    box-sizing:      border-box;
    background-color:inherit;
    font-family:     inherit;
    color:           inherit;
    overflow-wrap:   break-word;
    margin:          0;
    padding:         0;
    border:          0 solid;
}

[hidden] {
 display: none
}

[hidden] + * {
 margin-top:  0!important
}

ol, ul {
    list-style-type:     circle;
    list-style-position: inside;
    margin:              initial;
}
table {
	border-collapse: collapse;
	border-spacing:  0;
}

dt {
    margin-top: 0.5rem;
    font-size: 1.3rem;
}

dd {
    margin-left: 2ch;
}

blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after,

q:before, q:after {
	content: '';
	content: none;
}

/* Main settings */
html, body {
  font-family:            MyGeorgia,  serif; 
  font-size:              16px;
  font-size:              clamp(15px, 2.2vw, 24px);
	line-height:            1.3;
	max-width:              65ch;
  font-variant-ligatures: discretionary-ligatures;

  margin:         0 auto;
  padding:        0 0.5rem;

  scroll-behavior:smooth;
}

h1,h2,h3,h4 {
  font-size:              1.414rem;
	line-height:            1.0;
  font-family:            MyTrebuchet, sans-serif;
  font-weight:            normal;
  text-wrap:              balance;
  font-variant-ligatures: no-discretionary-ligatures;
}

h1 {
  font-size:  1.999rem;
  text-align: center;
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}

/* https://github.com/system-fonts/modern-font-stacks?tab=readme-ov-file#monospace-code */
/* TODO: subset an open source one instead for consistency of display */
pre, code		{
  font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace;
  background-color: #fbfbff;
  line-height:      normal;
	overflow:         auto;
  font-size:        0.9rem;
}
pre			{
  padding: 0.5rem 0.5rem;
  border-radius: 4px;
}

/* Relationships among elements */
* + p, * + ul, * + ol, * + pre {
    margin-top:   1rem;
}

* + h2, * + h3, * + h4 {
  margin-top:     1.3rem;
}

/* Style the small signature after the main title */
address {
  text-align: center;
  font-size:  0.9rem;
  margin-bottom: 1rem;
}

/* Navigation */
nav ul {
  display: flex;
  justify-content: center;
  gap: 1em;
}

nav ul li {
  list-style-type: none;
  text-transform: uppercase;
}
nav ul li a {
  text-decoration: none;
}

/* Button in the footer */
button, input {
    border:         1px solid;
    border-radius:  4px;
    padding:        0.2rem;
    font-size:      1rem;
}
input {
  width:            15ch;
}
button {
    cursor:         pointer;
}


/* Nicer spacing for footer items */
footer, footer > div {
  display:        flex;
  flex-direction: column;
  flex-wrap:      wrap;
  gap:            0.5rem;
  margin:         1rem 1rem;
  align-content:  center;
}
footer > div {
  flex-direction:    row;
  gap:               2rem;
  justify-content:   center;
}
footer > a {
  text-align: center;
}

/* Hide some elements for the sake of giving information to blind users without others seeing them */
.vh {
    clip-path:inset(100%)!important;
    clip:rect(1px,1px,1px,1px)!important;
    height:1px!important;
    overflow:hidden!important;
    position:absolute!important;
    white-space:nowrap!important;
    width:1px!important
}

/* List of links */
.postlinks > li {
    font-size: 1.414rem;
    list-style-type: none;
    list-style-position: inside;
}
.postlinks a {
    text-decoration: none;
}
.postlinks li ul li {
    list-style-position: outside;
    margin-left:         2rem;
}

.face {
  display: flex;
  justify-content: center;
  margin-top:      2rem;
}
/* For typeset.js https://github.com/davidmerfield/Typeset */
/*
 Small Capitals
 https://en.wikipedia.org/wiki/Small_caps 
*/

.small-caps {font-variant: all-small-caps;}

/*
 Optical margin alignment for particular letters 
 https://en.wikipedia.org/wiki/Optical_margin_alignment
*/

.pull-T, .pull-V, .pull-W, .pull-Y {margin-left: -0.07em}
.push-T, .push-V, .push-W, .push-Y {margin-right: 0.07em}

.pull-O, .pull-C, .pull-o, .pull-c {margin-left: -0.04em}
.push-O, .push-C, .push-o, .push-c {margin-right: 0.04em}

.pull-A {margin-left: -0.03em}
.push-A {margin-right: 0.03em}

/* 
 Quotation mark 
 https://en.wikipedia.org/wiki/Quotation_mark
*/

/* Single quotation marks (') */
.pull-single{margin-left:-.27em}
.push-single{margin-right:.27em}

.pull-double, .push-double,
.pull-single, .push-single {display: inline-block}

/* Double quotation marks (") */
.pull-double{margin-left:-.46em}
.push-double{margin-right:.46em}

/* Font families */
@font-face {
    font-family: 'MyGeorgia';
    src: local('Georgia'),
         url('/fonts/georgiasubset.eot') format('embedded-opentype'),
         url('/fonts/georgiasubset.woff2') format('woff2'),
         url('/fonts/georgiasubset.woff') format('woff'),
         url('/fonts/georgiasubset.ttf') format('truetype'),
         url('/fonts/georgiasubset.svg#georgiasubset') format('svg');
}

@font-face {
    font-family: 'MyTrebuchet';
    src: local('Trebuchet MS'),
         url('/fonts/trebucbdsubset.eot') format('embedded-opentype'),
         url('/fonts/trebucbdsubset.woff2') format('woff2'),
         url('/fonts/trebucbdsubset.woff') format('woff'),
         url('/fonts/trebucbdsubset.ttf') format('truetype'),
         url('/fonts/trebucbdsubset.svg#trebucbdsubset') format('svg');
}