header,picture{position:absolute;height:100%}.disclaimer p,.disclaimer>img{filter:blur(.6vmin) opacity(0)}#display-sequence h1,.disclaimer p{font-size:var(--fs-3);font-weight:500;text-shadow:1vmin 1vmin 0 var(--clr-shadow)}#display-sequence p,*{margin:0}@font-face{font-family:bebas;src:url(../ttf/BebasNeue-Regular.ttf);font-display:swap}@font-face{font-family:montserrat;src:url(../ttf/Montserrat-VariableFont_wght.ttf);font-display:swap}:root{--clr-01:#000000;--clr-02:#101010;--clr-03:#465880;--clr-04:#efefef;--clr-A1:#223232;--clr-A2:#496e6e;--clr-A3:#769898;--clr-B1:hsl(220, 20%, 50%);--clr-B2:hsl(220, 20%, 60%);--clr-B3:hsl(220, 20%, 80%);--clr-B4:hsl(220, 90%, 98%);--clr-C1:#ffeebb;--clr-C2:#449977;--clr-C3:#447799;--clr-C4:#4455aa;--clr-C5:#8844aa;--clr-shadow:#1b1b1b55;--fs:calc((1vh + 1vw) * 0.32);--fs-1:calc(3 * var(--fs));--fs-2:calc(2.6 * var(--fs));--fs-3:calc(2.2 * var(--fs));--fs-4:calc(1.8 * var(--fs));--fs-5:calc(1.6 * var(--fs))}*{padding:0;box-sizing:border-box;user-select:none;-moz-user-select:none;-webkit-user-select:none}body,html{position:fixed;height:100%;width:100%}body{background-color:var(--clr-A1);font-size:var(--fs-3)}picture{width:100%;background:url(../img/twigs.webp) 0 0/600px;opacity:.1}header{width:20%;top:0;left:-20%;background:var(--clr-02) url(../svg/treble_key.svg);background-position:bottom center;background-repeat:no-repeat;background-size:contain;box-shadow:1vmin 0 0 var(--clr-shadow);text-align:center;transition:left .8s ease-in-out}header>div,header>nav{margin:5vmin 0;display:flex;flex-flow:column nowrap;gap:2vmin}header>div{font-family:bebas;font-size:var(--fs-1);padding:0 1vmin;align-items:center;color:var(--clr-03)}header>hr{position:relative;width:50%;margin:0 25%;border:none;border-top:1px solid var(--clr-B1);overflow:visible;opacity:.5}header>hr::before{position:absolute;content:"";transform:translate(-50%,calc(-50% - .5px)) rotate(45deg);height:.8vmin;width:.8vmin;border:1px solid var(--clr-B1);background:var(--clr-02)}header>div>p{transform:rotateX(90deg);opacity:0}#dots{animation:1s steps(1,end) infinite blinkDots}@keyframes blinkDots{0%,100%{opacity:0}50%{opacity:1}}.disclaimer,main{position:absolute;height:calc(100% - 3vmin);width:calc(80% - 3vmin);top:2vmin;left:calc(20% + 2vmin);padding:0 1vmin 1vmin 0;font-family:montserrat}main{overflow:hidden;color:var(--clr-04)}main>div,main>nav{position:absolute;height:calc(100% - 1vmin);width:calc(100% - 1vmin);top:0;filter:opacity(0) blur(1vmin);transform-origin:left center}#display-title,article h2{position:relative;width:fit-content}main>nav{display:flex;flex-direction:column;align-items:center;justify-content:space-evenly}main>div{transform:translateY(120%);display:grid;grid-template-rows:auto auto 1fr;gap:1vmin}.disclaimer{display:flex;flex-flow:column nowrap;justify-content:space-evenly}.disclaimer p{padding:1vmin 10%;text-align:center;color:var(--clr-B3)}.disclaimer>img{height:6vmin;width:100%;transform:translateY(5vmin)}.disclaimer p>img{display:inline;height:2.5vmin;width:2.5vmin;margin:0 1vmin}#display-title{padding:1vmin 3vmin;margin-bottom:1vmin;font-weight:500;font-size:var(--fs-3)}#display-title::after,#display-title::before{content:"";position:absolute;height:100%;width:100%;clip-path:polygon(100% 0,0 0,0 100%,100% 100%,calc(100% - 1vmin) 50%)}#display-title::before{z-index:-1;top:0;left:0;background-color:var(--clr-03)}#display-title::after{z-index:-2;top:1vmin;left:1vmin;background-color:var(--clr-shadow)}#display-sequence{--space:5vmin;display:grid;grid-template-columns:1fr 1fr;gap:var(--space);font-size:var(--fs-5)}#display-sequence>div{text-align:right}#display-sequence>div>div{margin:1vmin 0}#display-sequence h1{margin:0;padding:2vmin 0;padding-left:var(--space);border-left:.8vmin dotted var(--clr-A2);align-self:center;text-align:center;color:var(--clr-04)}#display-sequence h2,article h2,article.vocable div::before{font-variant:small-caps;font-weight:700}#display-sequence h2{color:var(--clr-A3);font-size:var(--fs-4)}#display-session{display:grid;grid-template-columns:auto 1fr;grid-template-rows:1fr;gap:0;font-size:var(--fs-4)}#display-session>div{position:relative;align-self:stretch;justify-self:stretch;padding:0 1vmin;background-color:var(--clr-04);box-shadow:1vmin 1vmin 0 var(--clr-shadow)}#display-sheet{position:absolute;height:100%;width:calc(100% - 2vmin);padding-right:1vmin;overflow-x:hidden;overflow-y:auto;scrollbar-gutter:1vmin;color:var(--clr-01)}@media screen and (max-aspect-ratio:4/3){header{height:12%;width:100%;top:-12%;left:0;box-shadow:0 1vmin 0 var(--clr-shadow);background:var(--clr-02);display:flex;flex-flow:column;justify-content:space-evenly;transition:top .8s ease-in-out}header>div,header>nav{margin:0;display:flex;flex-flow:row nowrap;justify-content:center;gap:4vmin}header>div{font-size:var(--fs-1)}header>hr:nth-of-type(2){display:none}.disclaimer,main{height:calc(86% - 2vmin);width:calc(100% - 4vmin);top:calc(12% + 2vmin);left:2vmin}#display-session{grid-template-columns:1fr;grid-template-rows:auto 1fr}}.hide{display:none!important}.invisible{visibility:hidden}article{position:relative;height:fit-content;width:100%;padding:1vmin;display:grid;gap:1vmin 0;align-content:center;justify-content:center;align-items:start;justify-items:center}article h2{padding-right:5vmin;justify-self:left;font-size:var(--fs-3);color:var(--clr-C4);text-align:center;border-bottom:1px solid var(--clr-B2)}article cite,article.vocable p{font-weight:600}article div{align-self:stretch;justify-self:stretch;border-left:1px solid var(--clr-B3);padding-left:2vmin;display:flex;flex-direction:column;justify-content:center}article cite{display:inline-block;padding-left:5vmin;font-style:italic;text-align:justify;color:var(--clr-C2)}article.vocable{justify-content:stretch}article.activity,article.annex{grid-template-columns:repeat(5,1fr)}article.corpus,article.project{grid-template-columns:1fr 1fr 3fr}article.document,article.opus{grid-template-columns:2fr 3fr}article.activity p{grid-column:1/6}article.corpus h2,article.project h2{grid-column:1/4}article.document h2,article.opus h2{grid-column:1/3}article.vocable div{padding:1vmin 2vmin;border:1px solid var(--clr-C5);border-radius:1vmin;color:var(--clr-C5)}article.vocable div::before{padding-bottom:1vmin;content:"Notions et vocabulaire"}