@font-face {
  font-family: 'Liffey H';
  src: url("/fonts/Liffey-Heavy.woff") format("opentype");
}
@font-face {
  font-family: 'Liffey';
  src: url("/fonts/Liffey-Regular.otf") format("opentype");
}
@font-face {
  font-family: 'Clean Marker';
  src: url("/fonts/clean/CleanMarker-Black.otf") format("opentype");
}
@font-face {
  font-family: 'Clean Marker BI';
  src: url("/fonts/clean/CleanMarker-BlackItalic.otf") format("opentype");
}
@font-face {
  font-family: 'Clean Marker MC';
  src: url("/fonts/clean/CleanMarker-Medium-Condensed.otf") format("opentype");
}
@font-face {
  font-family: 'Clean Marker M';
  src: url("/fonts/clean/CleanMarker-Medium.otf") format("opentype");
}
@font-face {
  font-family: 'Clean Marker L';
  src: url("/fonts/clean/CleanMarker-Light-Condensed.otf") format("opentype");
}
@font-face {
  font-family: 'Clean Marker LI';
  src: url("/fonts/clean/CleanMarker-Light-Condensed-Italic.otf") format("opentype");
}
@font-face {
  font-family: 'Edlinger';
  src: url("/fonts/Edlinger.otf") format("opentype");
}
@font-face {
  font-family: 'Euskamini';
  src: url("/fonts/Erabili-Micro.otf") format("opentype");
}
@font-face {
  font-family: 'Sablier';
  src: url("/fonts/sablier-5.otf") format("opentype");
}
@font-face {
  font-family: 'Librex';
  src: url("/fonts/LibrexAAE-Regular.otf") format("opentype");
}
.euskamini {
  font-family: 'Euskamini';
  font-weight: normal;
  letter-spacing: -.05em;
}
.librex {
  font-family: 'Librex';
  font-weight: normal;
}
.sablier {
  font-family: 'Sablier';
  font-weight: normal;
}
.clean {
  font-family: 'Clean Marker';
  font-weight: normal;
}
.edlinger {
  font-family: 'Edlinger', sans-serif;
  line-height: 1em;
  font-weight: normal;
}
.liffey {
  font-family: 'Liffey H';
  font-weight: normal;
}
h3 .liffey {
  font-weight: normal;
}

.ss01 {
  font-feature-settings: "ss01" 1;
}
.ss02 {
  font-feature-settings: "ss02" 1;
}
.ss03 {
  font-feature-settings: "ss03" 1;
}

.case {
  font-feature-settings: "case" 1;
}


html {
  font-size: 1rem;
}

html, body {
  min-height: 98vh;
}
body {
  display:flex;
  flex-direction: column;
  margin:calc();
}
footer {
  color: black;
}
.content {
  flex: 1; /* prend toute la place disponible */
}


* {
  font-family: 'Infini', sans-serif;
  text-rendering: optimizeLegibility;
  font-feature-settings: "liga" 1, "dlig" 1;
}

p, h3 {
  margin: 1rem auto;
  padding: 0 1rem;
  line-height: 1.5em;
  max-width: 30rem;
}

p {
  font-size: 1rem;
}

.p {
  font-size: 1rem;
  font-weight: normal;
}


a {
  color: black;
  text-decoration: none;
}
a:hover{
  color: grey;
}
.grey {
  color: grey;
}

.link {
  text-decoration: underline;
}

h3 {
  font-size: 1.2rem;
  font-weight: bold;
  line-height: 1.2em;
}

h1 {
  font-size: 2.5rem;
  margin: .5em 1rem;
}

.metadata p, metadata a, metadata a h1 {
  margin: 1rem;
  padding: 0;
  max-width: none;
}

.img {
  display: flex;
  justify-content: center;
}

.big img {
  max-height: 15rem
}

.img img {
  max-width: 90vw;
}

.ptb0 {
  margin-top: 0;
  margin-bottom: 1em;
}

.ptb1 {

  margin-bottom: 1em;

}

.massive {
  font-size: 5rem;
  padding: 0 inherit;
  margin: 0 inherit;
}
.huge {
  font-size: 3.5rem;
}
.m-huge {
  font-size: 3rem;
}
.big {
  font-size: 2.5rem;
  line-height: 1.1em;
}
.medium {
  font-size: 1.5rem;
}
.small {
  font-size: 1rem;
}
.tiny {
  font-size: .8rem;
}

.left {
  text-align: left;
}
.center {
  text-align: center;
}
.right {
  text-align: right;
}

.menu {
  display: flex;                    /* arrange items horizontally */
  justify-content: space-between;
}

.spaceline {
  height: 2rem;
}
.update {
  line-height: 1.3em;
}



.tooltip:hover span {
  display: none;
}
.tooltip:hover:before {
  content: "Learn more";
}
.tooltipend:hover span {
  display: none;
}
.tooltipend:hover:before {
  content: "Learn less";
}

@media (max-width: 399px) {
  html p, h3 {
    padding: 0 1rem;
  }
}

@media (min-width: 400px) {
  html p, h3 {
    padding: 0 3rem;
  }
}

@media (max-width: 450px) {
  html .img {
    display: block;
  }
  html .img img {
    display: block;
    margin: auto;
  }
}

@media (min-width: 700px) {
  html p, h3 {
    padding: 0 1rem;
  }
}