@font-face {
   font-family: "Digitek";
   src: url("fonts/digitek.TTF") format("truetype");
 }

 @font-face {
  font-family: "Liberation";
  src: url("fonts/LiberationSans-Regular.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "Liberation";
  src: url("fonts/LiberationSans-Italic.ttf") format("truetype");
  font-weight: normal;
  font-style: italic;
}

@font-face {
  font-family: "Liberation";
  src: url("fonts/LiberationSans-Bold.ttf") format("truetype");
  font-weight: bold;
  font-style: normal;
}

@font-face {
  font-family: "Liberation";
  src: url("fonts/LiberationSans-BoldItalic.ttf") format("truetype");
  font-weight: bold;
  font-style: italic;
}

body {
	font-family: 'Liberation';
	margin: 0;
	background: #e1e1e1;
  overflow: hidden;
  font-size: 20px;
height: 100vh;
height: 100dvh;
}



::-webkit-scrollbar {
  display: none;
}


.border {
  width: 200vw;
    content: "Reinventerlapedagogie des opprimeexs";
    display: block;
  background: white;
  font-family: 'Digitek';
  height: 30px;
  overflow: hidden;
  font-size: 200px;
  line-height: 60%;
  color: lightgreen;
  transition: transform 1s;
  -webkit-text-stroke-color: transparent;
 -webkit-print-color-adjust: exact !important;   /* Chrome, Safari 6 – 15.3, Edge */
    color-adjust: exact !important;                 /* Firefox 48 – 96 */
    print-color-adjust: exact !important; 
}

h1.titre {
  color: black;
  margin: 0 20px;
  padding-top: 20px;
    font-size: clamp(50px, 7.5vw, 100px);
  font-weight: bold;
  text-transform: uppercase;
}

h1.titre + div {
  font-size: 20px;
  color: black;
  font-weight: bold;
  padding: 0 20px;
    padding-bottom: 50px;

}

.all {
  display: block;
  flex-direction: column;
  height: calc(100vh - var(--menu));

  height: calc(calc(var(--vh, 1vh) * 100) - var(--menu) );
  overflow-y: auto;
  overflow-x: hidden;
   -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
max-width: 100vw;
}

.content {
  overflow-y: auto;
  padding: 20px;
  flex: 1;
  padding-top: 0;
  background: #e1e1e1;
  overflow-x: hidden;
  padding-bottom: 60px;
max-width: 100vw;

}

h2 {
  font-size:  40px;
  color: black; 
}

h3 {
    font-size:  20px;
    color: black;
    text-decoration: underline;
    text-underline-offset: 4px;
    text-decoration-color: black;
}

.block-type-text, .block-type-list {
  max-width: 980px;
  line-height: 130%;
}

.block-type-list ul {
      list-style-type: '○';
            padding-right: 10px;

}

.block-type-list li::marker {
      font-size: 25;
}

.block-type-list li {
    padding-left: 15px;
}



blockquote {
font-size: clamp(20px, 2vw, 35px);
  text-align: center;
  margin: 2em auto;
  padding: 0px 4em;

max-width: 780px;
}

blockquote u {
  text-decoration-color: black;
      text-underline-offset: 6px;
      text-decoration-thickness: 3px;
      line-height: 120%;
}

sup.footnote {
font-size: 8px;
}


blockquote footer, figcaption {
  margin: 0 auto;
  font-size: 20px;
  color: #f3f3f3;
  background: black;
  padding: 5px 10px;
  max-width: max-content;
}

.audio-info figcaption {
margin: 0 !important;
}

p:empty {
  display: table;
}

blockquote footer {
  margin-top: 1.5vw;
}

.block-type-video iframe {
  width: 100%;
  border: none;
  height: 42vw;
  min-height: 62vh;

}

.block-type-video figure, .block-type-image figure {
  margin: 0;
  padding: 0;
}

.block-type-image img {
  object-fit: contain;
  max-height: 60vh;
  max-width: 60vw;
  flex: 1;
}

.block-type-image img.small { 
  max-height: 300px;
}

.block-type-image img.big { 
    /*max-height: calc(100vh - var(--menu) - 50px);
    max-height: calc(100dvh - var(--menu) - 50px);
    max-width: 90vw;
    width: auto;
    height: 87vh;*/:
}

.block-type-image, .block-type-video {
  text-align: center;
  margin: 3em 0px;

}

.block-type-image {
      max-width: min-content;
}

.block-type-image figure 
{
flex-direction: column;
  display: flex;
width: min-content;
  text-align: left;
}

.block-type-image figcaption {
  margin: 0;
    width: calc(100% - 20px);
    height: fit-content;
}

.block-type-image {
      max-width: fit-content;
}


#backtop {
  display: none;
  position: fixed;
  top: var(--menu);
  right: 0;
  z-index: 1;
  font-size: 18px;
  border: none;
  outline: none;
  color: black;
  cursor: pointer;
  padding: 8px 10px;
    column-gap: 10px;
  background: #a3a3a3;

}



#download {
  position: fixed;
  bottom: 0px;
  right: 0px;
  z-index: 1;
  font-size: 18px;
  border: none;
  outline: none;
  color: black;
  cursor: pointer;
  padding: 8px 10px;
  display: none;
  column-gap: 10px;
  background: #a3a3a3;
}

body[download='true'] #download {
  display: flex;
}

button i + div, .cookies button {
  font-size: 15px;
}


#backtop:hover, #download:hover, .cookies button:hover {
  background-color: white !important;
}

 .linkurl {
  display: none;
  color: black;
  text-align: center;
   text-underline-offset: 4px;
    text-decoration-color: black;
}

.audio-info {
    width: 100%;
    display: flex;
    flex-direction: column;
    }


.plyr--audio {
  width: 50vw;
  align-self: start;
  min-width: 700px;
}

.plyr--audio figcaption {
margin: 0;
}

body.article .plyr--audio .plyr__controls {
}

body.film .block-type-video {
  margin: 0;
}

.audio-wrapper {
  display: flex;
}

.audio-wrapper img {
  width: 100%;
}
.audio-poster {
  width: 12rem;
}

.audio-subtitle {
  font-size: 1rem;
  -webkit-text-stroke: 1px transparent;
  color: black;
}
.audio-element {
  margin-top: 2rem;
  height: 2rem;
}

.plyr__time {
  font-family: 'Liberation';
  font-size: 15px;
}

.plyr--audio .plyr__control:focus-visible, .plyr--audio .plyr__control:hover, .plyr--audio .plyr__control[aria-expanded=true] {
  background: white;
  color: black;
  border-radius: 0px;
}


:root {
  --plyr-range-track-height: 15px;
  --plyr-range-thumb-height: 15px;
  --plyr-range-thumb-background: black;
  --plyr-tooltip-radius: 0px;
  --plyr-menu-radius : 0px;
  --plyr-control-radius : 0px;
  --plyr-badge-border-radius: 0px;
  --plyr-font-family: 'Liberation';
  --plyr-range-fill-background: #e1e1e1;
}



.plyr--full-ui input[type=range] {
  color: #ffffffc2 !important;
  border-radius:0px !important;
  border: none;
    cursor: pointer;

}

.plyr--audio .plyr__controls {
    color:black;
    background: #a3a3a3;
      padding: var(--plyr-control-spacing,15px);


}

[data-plyr="settings"] {
  display: none;
}


.categorie .line {
  text-align: left;
}

 .categorie .line:nth-child(2n+1) {
    transform: translateX(-250px);
}

.categorie .line:nth-child(2n){
    transform: translateX(0px);
}

.titlepage {
 overflow: hidden;
 height: fit-content;
}


.allblock {
  position: relative;
}

.allblock .cookies {
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: #000000d4;
  color: white;
  left: 0;
      display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

body[cookies='true'] .cookies {
  display: none;
}

.cookies div {
  min-width: 250px;
  width: clamp(250px, 75vw, 950px);
}

.cookies button {
  margin-top: 25px;
  border: none;
  padding: 8px;
  font-family: 'Liberation';
  cursor: pointer;
}


.titlepage .fond {
  position: absolute;
  z-index: -1;
}

.content a {
  color: black;
  text-decoration-color: white;
}


@media print {

  .plyr {
    display: none !important;
  }

 .all {
  height: fit-content;
  background: white;
   -webkit-text-stroke-color: transparent;
/* -webkit-print-color-adjust: exact !important;   

    print-color-adjust: exact !important; 
*/
 }

 .content {
  overflow: hidden;
 }

 #download, #backTop {
  display: none !important;
 }

 blockquote footer, figcaption, .titlepage .fond .line {
      -webkit-text-stroke-color: transparent;
 -webkit-print-color-adjust: exact !important;   /* Chrome, Safari 6 – 15.3, Edge */
    color-adjust: exact !important;                 /* Firefox 48 – 96 */
    print-color-adjust: exact !important; 
 }

.titlepage .fond .line {
color: white;
}

 iframe, .cookies {
  display: none;
 }

 .linkurl {
  display: block;

}

.text-container .footnote a {
font-size: 10px;
}

.titlepage .fond {
  z-index: -1;
}

.titlepage h1, .titlepage div:not(.fond), .titlepage {
z-index: 0;
position: relative;
}

}

@page {
    size:A4 portrait;
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 0px;
    margin-bottom: 0px;
    margin: 0;
}

video {
width: 100%;
}


@media screen and (max-width: 980px) {

  h1.titre {
    font-size: clamp(30px, 7.5vw, 100px);
  }

  h1.titre + div, body {
    font-size: 15px;
  }

  blockquote footer, figcaption {
    font-size: 15px;
  }

.plyr--audio {
  width: 100vw;
  min-width: unset;
 }

 blockquote u, h3 { 
  text-underline-offset: 2.5px;
  text-decoration-thickness: 2px;
 }

 .block-type-video iframe {
  min-height: unset;
  height: auto;
 }

 .cookies div {
  font-size: 11px;
 }

}