html{scroll-behavior: smooth}

/* IDEM newFONTS.html : ===========================*/
.LoupeAuteur{width:5vw; height:auto; position:relative;cursor:pointer;top:2.2vw; margin-bottom:2em}
LoupeAuteur span{display:none}
LoupeAuteur:hover span{background:url(/IMAGES/parchemin3.webp)no-repeat;background-size:120%;background-position:bottom;display:inline;font-family:'Verdana';font-size:.8em;margin-left:-38vw;margin-top:7vw;animation:opac 1.3s;position:absolute;z-index:3;padding-top:4vw;padding-left:4vw;padding-right:7vw;padding-bottom:7vw}
.contents{width:8%; height:auto;position:relative;cursor:pointer;top:1vw;margin-top:-1em}
contents span{display:none}
contents:hover span{background:url(/IMAGES/parchemin3.webp)no-repeat;background-size:110% 100%;background-position:center;display:inline;width:auto;font-family:'Verdana';font-size:1.2em;text-align:left;line-height:1.5em;margin-left:-22vw;animation:opac 1.3s;position:absolute;z-index:3;margin-top:3vw;padding-left:4vw;padding-right:7vw;padding-top:3vw;padding-bottom:6vw}
.contenu{width:8%; height:auto; position:relative;cursor:pointer;top:0.5vw}
contenu div{display:none}
contenu:hover div{background:url(/IMAGES/parchemin-deroulant-large.webp)no-repeat;background-size:100%;background-position:bottom;display:inline;font-family:'Verdana';font-size:.9em;width:75%;left:10%;line-height:1.7em;text-align:left;animation:opac 1.3s;position:absolute;z-index:3;margin-top:3vw;padding:4vw;padding-bottom:7vw}
.parcheminPoints{width:5%; height:auto; position:relative; top:0.3em;position:relative;cursor:pointer}points.item span{display:none}
points.item:hover span{background:url(/IMAGES/parchemin-ariane.webp)no-repeat;background-size:100%;background-position:bottom;display:inline;line-height:1.4em;margin-left:-13em;margin-top:1.9em;animation:opac 1.3s;position:absolute;z-index:3;transition:all 2s;padding-left:2em;padding-right:2.5em;padding-bottom:5em}
#ariane{border-radius:3vw 3vw 0 0;z-index:2;font-family:'Verdana';font-size:.8rem;line-height:1.1} /* sous-menus */

cite,citew{font-family:'Verdana'; display: block; text-align: center; color:purple; font-size:.9em; line-height:1.3; font-style:italic;padding-bottom:1em}
citew{color:yellow}

nota,.nota{font-style:normal; font-weight: 100; font-variant: normal; letter-spacing: normal; width:3vw}
nota:hover{animation:opac 1s}
nota span{display:none;border-radius:8px;text-align:justify}
nota:hover span{color:black;text-shadow:none;display:inline;position:absolute;line-height:1.5em;border:1px solid #8c8c8c;background:#f4f4f4;z-index:7}
nota>span{font-family: Arial, sans-serif; font-size:1.2em;padding:1.8em;left:5vw;right:5vw;margin-top:1.5vw;box-shadow:0px 3px 6px brown;opacity:1;line-height:1}

a.auteurW,a.auteurB{font-style:italic;text-decoration:underline;font-family:'Verdana';font-size:1em;line-height:1.5; display:inline-block; margin-bottom:1em} 
a.auteurW{color:yellow;text-shadow:0 0 2px black,0 0 3px black}
a.auteurB{color:green;text-shadow:0 0 2px white,0 0 3px white}
a.auteurW:hover{color:white;font-size:1.2em}
a.auteurB:hover{color:blue;font-size:1.2em} 

/*lora{font-family:'Lora';font-style:italic; font-size:1em}
.lora{font-family:'Lora';x-style:italic;font-weight: 500; font-size:1.5em;font-variant: small-caps; letter-spacing: 2px}*/

/*blockquote[class^="verd"] {  class qui COMMENCE par...
    display: inline !important; 
    margin: 0;
    padding: 0;
}  sinon <nota> va à la ligne! 
si je laisse verd : "note" déconne
blockquote[class^="imm"], 
blockquote[class^="serif"], 
blockquote[class^="maxime"]
*/

div[class*="Fond_Chap_"]{font-size:80%;text-align:justify;padding:8vw;border-radius:0 0 3vw 3vw;box-shadow:2vw 2vw 2vw #614423;
background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.5' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)' opacity='0.1'/%3E%3C/svg%3E")}
hr {margin: 0.1em 0; border: 0; border-top: 1px solid white}
/* Fond clair (papier parchemin / papier vélin) */
.Fond_Chap_beige { background-color: #F7F5ED}
.Fond_Chap_ocre { background-color: #FCF8E6}
.Fond_Chap_vert { background-color: #EBF7F5}
.Fond_Chap_bleu { background-color: #E8F4FA}
.Fond_Chap_bleu2 { background-color: #CDE5F7}
.Fond_Chap_mauve { background-color: #EBE9F5}
.Fond_Chap_gris { background-color: #E3E8E7}
.chap_bleue{background:url("/IMAGES/foretbleue.webp"); background-repeat: no-repeat; background-size: cover}
.chap_verte{background:url("/IMAGES/foretverte.webp"); background-repeat: no-repeat; background-size: cover}

/* sombres: */
.Fond_Chap_sombre { background-color: #3F3F8C} /*804F45, 753A2E, 59251A */
.Fond_Chap_sombre_gris { background-color: #515666}
.Fond_Chap_rouge_purple { background-color: #59251A} /*804F45, 753A2E, 59251A */
.Fond_Chap_bleu_purple { background-color: #3F3F8C}  /* 4F4F6B, 3F3F8C */
.Fond_Chap_sombre_vert { background-color: #18473D}  /* 265248, 18473D  */

.intro{background:url(IMAGES/Germe.webp); background-repeat: no-repeat; background-size: cover; border-radius:2vw;box-shadow:1.5vw 1.5vw 1.5vw #614423;}

@font-face{font-family:'immortal';font-display:auto;src:local('immortal'),url('POLICES/immortal-webfont.woff')}
@font-face {
  font-display: swap; 
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 400;
  src: url("/POLICES/cormorant-garamond-v21-latin-regular.woff2") format('woff2')
}
@font-face {
  font-display: swap; 
  font-family: 'Lora'; 
  src: url("/POLICES/lora-v37-latin-regular.woff2") format('woff2') 
}
@font-face {
  font-display: swap; 
  font-family: 'Oleo'; 
  src: url("/POLICES/oleo-script-v15-latin-regular.woff2") format('woff2') 
}
@font-face {
  font-display: swap; 
  font-family: 'Antonio'; 
  src: url("/POLICES/antonio-v22-latin-regular.woff2") format('woff2') 
}
@font-face {
  font-display: swap; 
  font-family: 'ComicN'; 
  src: url("/POLICES/comic-neue-v9-latin-regular.woff2") format('woff2') 
}
@font-face {
  font-display: swap; 
  font-family: 'ComicI'; 
  src: url("/POLICES/comic-neue-v9-latin-italic.woff2") format('woff2') 
}
@font-face {
  font-display: swap; 
  font-family: 'Titres1'; 
  src: url("/POLICES/acme-v29-latin-regular.woff2") format('woff2');
}


/* cas verd */
verd, blockquote.verd {
  display: block;
  position: relative;
         /* TOP   right   bottom  left   bloc texte et décor*/
  margin: 0.4em 0.3em  0.4em  .3em; 
  padding: 0; /* TOP/right/bottom/left dans bloc texte */
  font-family: 'Garamond', serif; font-size: 1.4em; line-height: 1.5
}
verd.verdw, blockquote.verd.verdw {color: white}
/* => <blockquote class="verd verdw"> */
verdw,.verdw{font-family:'Garamond';line-height:1.4em;font-size:1.6em; color:white;text-shadow:0 0 .1px white,0 0 1px black,0 0 1px black,0 0 1px black,0 0 2px black,0 0 2px black}

/* cas curve */
@font-face{font-family:'Curves';font-display:auto;src:local('Curves'),url('/POLICES/parisienne-webfont.woff2')}
curveP,curvem,curveW,curveB{display: inline; font-family:'Curves'; line-height:1.2em; font-size:1.3em; font-weight: 700; color: #266899; font-style:normal; font-variant: normal; letter-spacing: 0px}
curveP{font-size:1.2em} curvem{font-size:1.3em}
curveW{font-size:1.4em; color:yellow;text-shadow:0 0 .05vw white,0 0 2px black,0 0 3px black,0 0 3px black}
curveB{color:black;text-shadow:0 0 .1vw black,0 0 2px white,0 0 2px white,0 0 2px white,0 0 2px white,0 0 3px white,0 0 3px white,0 0 3px white}

curve, blockquote.curve {
  display: inline; /* Reste sur la même ligne que l'intro */
  margin: 0;       /* Supprime les gros retours à la ligne */
  padding: 0;      /* Supprime les 4em d'espace interne */
  font-family:'Curves'; 
  font-size: 1.6em; font-weight: 700; line-height: 1.5;
  color: #266899; letter-spacing: 0px; font-variant: normal
}

/* cas curve2 */
curve2, blockquote.curve2 {
  display: block;     /* Conserve le saut de ligne avant et après */
  position: relative; letter-spacing: 0px; font-variant: normal;
  /* Marges ext TOP  right bottom left du bloc texte */
  margin:     0.3em 1em  0.1em 1.5em; /* 0.1 = espace texte qui suit*/
  padding: 0;                 /* Supprime tout padding invalide */
  font-family: 'ComicI', sans-serif;
  font-size: 1.2em; font-weight: 700; line-height: 1.7; color: blue;
  font-style:normal; font-variant: normal; letter-spacing: normal;
}
/* Le navigateur applique exactement le même style, qu'il s'agisse d'un <blockquote class="curve2"> ou d'un simple <curve2> :
 <curve2 class="curve2w">xxxx</curve2>*/
blockquote.curve2::before,
curve2::before {
  content: "“ ";
  position: static !important;
  vertical-align: -0.3em;    /* Ajustement de la hauteur */
  font-size: 2em;
  line-height: 0;   /* Empêche le guillemet de pousser la hauteur de ligne */
  font-family: 'Georgia', serif; color: #527977
}
curve2.curve2w, blockquote.curve2.curve2w {color: white}
/*=> 
class="curve2w"> 
-> 
class="curve2 curve2w"> 
et 
<curve2w>
->
<curve2 class="curve2w">

curve2W,curve2i{font-family:'ComicI';line-height:1.5em;font-size:1.3em}
curve2i{font-style:italic}
curve2W{color:white;text-shadow:1px 1px 2px black}*/

/* cas entité parle */
entite, blockquote.entite {
  display: block;     /* Conserve le saut de ligne avant et après */
  position: relative; letter-spacing: 0px; font-variant: normal;
  /* Marges ext TOP  right bottom left du bloc texte */
  margin:     0.3em 1em  0.1em 1.5em; /* 0.1 = espace texte qui suit*/
  padding: 0;                 /* Supprime tout padding invalide */
  font-family: 'Lora'; font-size: 1em; line-height: 1.5; color: #4E5559; letter-spacing: 1px; font-variant: small-caps; color: blue; font-style:italic
}
/* Le navigateur applique exactement le même style, qu'il s'agisse d'un <blockquote class="entite"> ou d'un simple <entite> :
 <entite class="entitew">xxxx</entite>*/
blockquote.entite::before,
entite::before {
  content: "“ ";
  position: static !important;
  vertical-align: -0.3em;    /* Ajustement de la hauteur */
  font-size: 2em;
  line-height: 0;   /* Empêche le guillemet de pousser la hauteur de ligne */
  font-family: 'Georgia', serif; color: #527977
}

/* cas serif, maximev */
serif, blockquote.serif, 
maximev, blockquote.maximev {
  display: block; position: relative;
  /* Marges ext TOP   right    bottom left du bloc texte */
  margin:      0.4em  -1em   0.4em 2.5em;
  padding:     0        0      0      2em;
  left: -2em;   /* de l'ENSEMBLE */
  font-family: 'Lora'; font-size: 1.2em; font-weight: 700; 
  line-height: 1.5; color: #4E5559; letter-spacing: 1px; font-variant: small-caps;
}
blockquote.serif::before,
serif::before,
blockquote.maximev::before,
maximev::before {
  content: "✧";
  position: absolute;
  left: -.2em; top: -.3em;
  font-family: 'Georgia', serif; 
  font-size: 1.5em; color: indigo;
}
blockquote.maximev::before,
maximev::before {
  content: "❀";
}
/*S'applique à <serif class="serif serifw"> ET à <blockquote class="serif serifw">*/
serif.serifw, blockquote.serif.serifw {color: white}
serif.serifb, blockquote.serif.serifb {font-weight:700; color: black}
/*=> 
class="serif serifw"> -> class="serif serifw">
class="serifb"> -> class="serif serifb">
*/

source-ancienne, blockquote.source-ancienne {
  display: block; position: relative;
  /*       TOP  right  bottom  left du bloc texte */
  margin: 0.5em  1em  0.5em  3em;
  padding: 1em   0    1em    3.5em;
  left: -2.2em; /* de l'ENSEMBLE */
  font-family: 'Lora';font-weight:700; font-size: .8em;
  color: #2B2D42; letter-spacing: 2px; font-variant: small-caps;
  border-left:2px solid #D4A373; /* Fine ligne dorée discrète */
}
blockquote.source-ancienne::before,
source-ancienne::before {
  content: "📖";
  position: absolute; left: .6em; top: 1em;
  font-size: 1.7em; line-height: 1;
  color: #D4A373; /* Teinte chaude / or doux */
}

/* cas imm */
imm, blockquote.imm {
  display: block; position: relative;
  /* Marges ext TOP right bottom  left  du bloc texte */
  margin:    0.4em -3.5em  0.4em 2.5em; 
  padding:   0       1em    0      3.5em;
  left: -4em;          /* position bloc texte et décor */
  font-family: 'Garamond'; fxont-weight: 700; font-size: 1.2em;
  line-height: 1.5; letter-spacing: 2px; font-variant: small-caps;
  border-right: 2px solid #D4A373; /* Fine ligne dorée discrète */
}
blockquote.imm::before,
imm::before {
  content: "✦";
  position: absolute;
  left: 1em; top: -.4em; /* + -> descend */
  font-family: 'Georgia', serif; font-size: 2em; color: #7553AC;
}
/* S'applique à <imm class="immw"> ET à <blockquote class="imm immw"> */
imm.immw, 
blockquote.imm.immw {
  color: white;
}

blockqute.avec-image::before {
    content: ""; /* ou ✨ (emoji) */
	/* petit piège avec les emojis : leur affichage dépend du système.
	le plus fiable est d'utiliser une petite image
	ou plus simple: un symbole Unicode beaucoup mieux supporté: ✧❀☼◈ */
    position: absolute;
    left: -1.2em; top: -.9em; width: 32px; height: 32px;
    background: url("/IMAGES/bouee.png") center / contain no-repeat;
}
/* fin IDEM newFONTS.html ============================*/

/* menu au TOP : */
div[class*="index"]{background-position:bottom;background-size:20em;margin-top:-.4em;margin-bottom:-5em;padding-bottom:6.5em;margin-left:8em;font-size:1rem;font-family:"Comic Sans MS";text-align:center;position:relative;z-index:3}
/* .index{background:url(/IMAGES/parchemin-deroulant.png)no-repeat;padding-right:1.5em;left:-4em;line-height:1.1em} */

.index {
  background: url(/IMAGES/parchemin-deroulant.webp) no-repeat;
  background-size: 157px 559px;
  padding-right: 1.5em;
  left: -4em;
  line-height: 1.1em;
}

[id*="Id"]{scroll-margin-top:25vw} /*ancres de recherche decalees vers le bas*/
@charset "utf-8";

pp{margin-bottom:3vw}
W{color:white;text-shadow:0 0 .1vw white,0 0 2px black,0 0 3px black,0 0 3px black}
N{color:black;text-shadow:0 0 .1vw black,0 0 2px white,0 0 2px white,0 0 2px white,0 0 2px white,0 0 3px white,0 0 3px white,0 0 3px white}
OB{text-shadow:0 0 .1vw black,0 0 2px white,0 0 2px white,0 0 3px white,0 0 3px white,0 0 3px white,.2em .2em .15em black}
OW{text-shadow:0 0 .1vw white,0 0 2px black,0 0 2px black,0 0 3px black,0 0 3px black,0 0 3px black,.2em .2em .15em black}
.action,.reaction{position: absolute;font-weight:700;font-family:'verdana';color:maroon;text-shadow: 0 0 1px white,0 0 2px white,0 0 3px white,0 0 3px white, 0 0 4px #4B2700, 0 0 4px #4B2700, 0 0 5px #4B2700, 0 0 6px #4B2700}
.reaction{color:black}
ul{margin-left: 1%}
body{background-color:#8EB9DE;font-size:1.2em;line-height:2em}
@media screen and (max-width: 1080px) {body{font-size:.9em;line-height:2em}}
@media screen and (max-width: 800px) {body{font-size:.7em;line-height:1.2em}}
@media screen and (max-width: 500px) {body{font-size:.55em;line-height:1em}}
@keyframes opac{from{opacity:0}to{opacity:1}}
[id*="suite"]{margin:0;display:none;animation:opac 1.3s}
.flotte{float:left}.tampon{width:13vw;left:4em;top:1em;animation:opac 5s}
label{cursor: pointer}
.CloseWindow{width:8vw;position:fixed;z-index:4;right:1em;top:3.5vw}
.PetitBody{width:10vw; height:auto;position:fixed;z-index:4;top:4vw;left:0vw}
.GrosBody{width:11vw; height:auto;position:fixed;z-index:4;top:10vw;left:-1.4vw;padding-top:.6em}.photo{width:25%}
.cadreFreeFind{font-size:1em;height:1.8em;width:12em}.loupeFreeFind{width:2.5em;padding-top:1em}
.ClassLoupeI,.ClassLoupeR,.ClassRappel{width:0;position:fixed;z-index:4;right:0;overflow-y:hidden;overflow-x:hidden;transition:1s}
.ClassLoupeI{width:14%; height:auto}
/* #TOP{float:right} */
.ClassPORTE{position: fixed;top:2vw;right:1vw;width:7vw; height:auto}
.ClassLoupeI{position: fixed;top:10vw;right:-1.5vw;width:8.5vw; height:auto}
.ClassECHANGES{position: fixed;top:17vw;right:-.7vw;width:9vw; height:auto}
#menuFlottant {position: fixed; right: 1vw; top: 24vw; z-index: 1000}
.Drapeau{position: fixed;top:22vw;left:0vw;width:5vw;cursor:pointer}
.ClassWAIT{position: fixed;top:10vw;right:14vw;width:20vw;display: block;z-index: 999} 
#LoupeI{cursor:pointer}
#icone{position: fixed;display:block;cursor:pointer}
.alignText,.alignExit{position: absolute;top: 0;left: 0;margin-left: -2px;z-index: 9;width:10%;height: auto}
/* .alignText{width:2vw} */
/* .alignPorte{position: absolute;top:12vw;left:28vw;width:8vw} */
#PorteSortie{position: absolute;top:10vw;left:25vw;width:9vw}
.ClassLoupeR{background:url(/IMAGES/loupe-rect1.webp)no-repeat}
@media(min-width:700px){.ClassLoupeR{background:url(/IMAGES/loupe-rect2.webp)no-repeat}}
.ClassRappel{font-size:1.5vw;text-align:center;line-height:2em;background:url(/IMAGES/blocG0.webp)no-repeat;background-size:75vw;z-index:8}
@media (max-width: 700px) {.ClassRappel{font-size:1.2vw}}
.surligne {background: yellow}
.surligne.actif {background: orange;outline: 2px solid red}
#CadreLoupeO{right:-35vw}
.loupeO{position:fixed;z-index:4;top:12vw;height:40vw;transition:1s;padding-left:0vw;right:0em;overflow-x:hidden}
.alignRemonte{width:10%; height:auto; position:absolute;top:16vw;left:5.1vw;cursor:pointer}
/* .alignLoupeO{position:relative;top:21vw;left:1.1vw;width:20vw} */
.alignLoupeO{position:relative;top:21vw;left:1.1vw;width:35%; height:auto}
.alignClose{width:10%; height:auto; position:absolute;top:24.5vw;left:14vw;cursor:pointer}
.alignTXT{position:absolute;top:26vw;left:3.5vw}
.alignDescend{width:10%; height:auto; position:absolute;top:33.7vw;left:5.3vw;cursor:pointer}
#TXT2,#TXT{font-family:'Verdana';font-size:3vw;font-weight:700;color:black;text-shadow:1px 1px 1px white}
#TXT2{font-size:3vw} #TXT{color:red}
#cadre{background-repeat: no-repeat; background-size: cover;border-radius:2vw;font-size:107%;padding:5vw;width:88%;box-shadow:2vw 2vw 2vw #614423}#exit{padding-left:10em}

.TableMat{background:url(/IMAGES/TableMat.webp)no-repeat;font-size:1.5em;line-height:1.5em;top:-1.8vw;padding-right:5em;position:relative;z-index:3}
div[class*="NIV"]{position:relative;font-family:'Verdana';font-size:.8em;margin:1em;transform-origin:0 0;transform:rotate(-90deg)}.NIV1{color:brown;font-weight:700;top:-3em;left:10px;text-shadow:0 0 1vw white}.NIV2{color:grey;bottom:17em;left:1em}.NIV3{color:green;bottom:30em;left:1.9em}.NIV4{color:white;bottom:39em;left:1.9em}.NIV5{color:blue;font-weight:700;top:-31em;left:0em}
div[class*="head_"]{border-radius:3vw;box-shadow:3vw 3vw 3vw #614423;padding:4vw;text-align:justify; background-repeat: no-repeat; background-size: cover}
.head_banc_souffrance{background:url(/IMAGES/banc-souffrance.webp);background-position:top}
.head_amour{background:url(/IMAGES/head-amour.webp);text-align:right;color:#0c0080}.head_animaux{background:url(/IMAGES/animaux.webp);color:#d73d7a}
.head_banc_vide{background:url(/IMAGES/banc-vide.webp);text-align:right;color:white}.head_cercueil{background:url(/IMAGES/cercueil.webp);}.head_catafalque{background:url(/IMAGES/catafalque-2.webp);background-position:top}.head_catafalque2{background:url(/IMAGES/catafalque-4.webp);background-position:top}.head_chemin1{background:url(/IMAGES/chemin1.webp);background-position:bottom center;text-align:left}.head_chemin2{background:url(/IMAGES/chemin2.webp);background-position:bottom center;text-align:center;color:white}.head_chaumiere{background:url(/IMAGES/chaumiere.webp);text-align:left}.head_ciel2{background:url(/IMAGES/ciel2.webp)}.head_ciel3{background:url(/IMAGES/ciel3.webp)}.head_ciel4{background:url(/IMAGES/ciel4.webp);background-position:bottom center;text-align:right;color:#d73d7a}.head_colere{background:url(/IMAGES/colere.webp);background-position:bottom center;color:#d73d7a}.head_BasAstral{background:url(/IMAGES/BasAstral.webp);background-position:bottom;text-align:left;color:white}.head_desert{background:url(/IMAGES/head_desert.webp);}
.head_desert-anime{background:url(/IMAGES/desert-anime.gif)}
.head_desespoir{background-image:url("/IMAGES/desespoir1.webp")}
.head_desespoir_2{background:url(/IMAGES/image-desespoir2.webp)}
.head_eveil{background:url(/IMAGES/astral-2.webp);color:#d73d7a}.head_etoiles{background:url(/IMAGES/etoiles.webp);color:#F5EEBC}.head_famille{background:url(/IMAGES/famille.webp);text-align:center;color:#d7007a}.head_fleurs{background:url(/IMAGES/2roses.webp);text-align:center;color:#d73d7a}.head_fleurs2{background:url(/IMAGES/fleurs2.webp);text-align:right;color:#d73d7a}.head_fleur_soleil{background:url("/IMAGES/fleur-soleil.webp");text-align:center;color:#d7774a}
.chap_galaxie4{background-image:url("/IMAGES/galaxie4-1.webp")}
.head_galaxie{background-image:url("/IMAGES/galaxie.webp")}
.head_grenier{background:url(/IMAGES/grenier.webp);text-align:center;color:#ca0072}.head_grippe{background:url(/IMAGES/grippe.webp);text-align:right;color:#0c0080}.head_haine{background:url(/IMAGES/haine2.webp);text-align:center;color:#61531e}.head_lune{background:url(/IMAGES/lune.webp);text-align:right;color:#0c0080}.head_mal{background:url("/IMAGES/TROIS-1.webp");text-align:right;color:#d73d7a}.head_maladie{background:url(/IMAGES/maladie.webp);background-position:0% 65%;color:#0c0080}.head_main{background:url(/IMAGES/contacts.webp);color:#d73d7a}.head_montagne{background:url(/IMAGES/contacts.webp)}.head_moutons{background:url(/IMAGES/moutons.webp);text-align:center;color:white}.head_papier{background:url("/IMAGES/feuille-de-papier.webp");font-family:"Comic Sans MS"}.head_prairie_0{background:url(/IMAGES/prairie0.webp);}.head_pharmacie{background:url(/IMAGES/pharma.webp);background-position:top}.head_quotidien{background:url(/IMAGES/ville.webp);background-position:bottom;color:#FF0}.head_reincarnation{background:url(/IMAGES/astral-2.webp);text-align:center;color:#0c0080}.head_relations{background:url(/IMAGES/smileys.webp);text-align:center;color:#F0F080}.head_reves-2{background:url(/IMAGES/reves-2.webp)no-repeat}.head_relations_1{background:url(/IMAGES/smileys-1.webp)}
.head_rencontre-2{background-image:url("/IMAGES/rencontre-2.webp");background-position:bottom;text-align:center;color:#0c0080}.head_sante{background:url(/IMAGES/arbre.webp);text-align:center;color:white}.head_science{background:url(/IMAGES/science.webp);text-align:center;color:white}.head_separation{background:url(/IMAGES/separation.webp);background-position:bottom;text-align:center;color:#0c0080}
.head_solitude1{background:url(/IMAGES/ville-solitude1.webp);background-position:top}
.head_solitude2{background:url(/IMAGES/ville-solitude2.webp)}
.head_singes{background:url(/IMAGES/trois_singes.webp);background-position:bottom}.head_soleil{background:url(/IMAGES/soleil-4.webp);color:white}.head_soir{background:url(/IMAGES/soir2.webp);background-position:center;background-size:100%;text-align:right;color:#ff8b5f}.head_temple{background:url(/IMAGES/messe.webp);color:white}.head_tristesse{background:url(/IMAGES/tristesse.webp);text-align:left;color:#0c0080}.head_vaches{background:url(/IMAGES/vaches.webp);text-align:left;color:#d73d7a}
.head_dents{background-image:url("/IMAGES/dent1.webp");background-size:20% 10%}
.head_village_hiver{background-image:url("/IMAGES/village-hiver.webp")}
.head_viol{background:url(/IMAGES/viol-2.webp);text-align:left;color:#0c0080}.head_suicide{background:url(/IMAGES/trou.webp);text-align:left;color:#0c0080}

.chap_ariane{background-color:#F7EFD2}
.chap_ciel2{background:url(/IMAGES/ciel2.webp);margin-bottom:1px}
.chap_ciel3{background:url(/IMAGES/ciel3.webp)}
.chap_manoir_1{background:url(/IMAGES/manoir1.webp)}
.chap_manoir_2{background:url(/IMAGES/manoir2.webp)}

.chap_soleil{background:url(/IMAGES/soleil-4.webp);}

/*
.Fond_Chap_sombre_gris { background-color: #515666}
.Fond_Chap_rouge_purple { background-color: #59251A} 804F45, 753A2E, 59251A 
.Fond_Chap_bleu_purple { background-color: #3F3F8C}   4F4F6B, 3F3F8C 
.Fond_Chap_sombre_vert { background-color: #18473D}   265248, 18473D 

div[class*="chap_"]{font-size:80%;text-align:justify;padding:8vw;border-radius:0 0 3vw 3vw;box-shadow:2vw 2vw 2vw #614423;font-family:"Comic Sans MS";z-index:1; background-repeat: no-repeat; background-size: cover}
/* @media(min-width:700px){div[class*="chap_"]{font-size:2.2vw}} 
si fait ça +- marchent plus
.chap_uni{background-color:#ACCEFC;margin-right:1vw}
.chap_ado{background:url(/IMAGES/fond-ado.webp);background-position:top}
.chap_allee_1{background:url(/IMAGES/allee-1.webp)}.chap_allee_bois{background:url(/IMAGES/allee-bois.webp)}.chap_bas_astral{background:url("/IMAGES/fond-astral.webp")}.chap_bois{background:url(/IMAGES/bois.webp)}
.chap_bois_chemin{background:url(/IMAGES/bois-chemin.webp)}
.chap_bois_chemin2{background:url(/IMAGES/bois-chemin2.webp)}
.chap_Chemin{background:url(/IMAGES/chemin.webp)}
.chap_trouee_ciel{background:url(/IMAGES/trouee_ciel.webp)}
.chap_couloir-hop{background:url(/IMAGES/couloir-hop.webp)}
.chap_germe{background:url(/IMAGES/Germe.webp);background-size:100%}
.chap_fond_ciel_3{background:url(/IMAGES/fond_ciel_3.webp)}
background-position:center;text-align:normal}.chap_ceil-soleil{background:url(/IMAGES/fond_ciel_2.webp)}.chap_fond-desert{background:url(/IMAGES/fond_desert.webp);background-position:top}.chap_desert{background:url(/IMAGES/fond_desert-2.webp);background-position:top}.chap_desert_3{background:url(/IMAGES/desert-3.webp)}.chap_fleur{background:url(/IMAGES/fleurs2.webp)}.Fond_Chap_bleu2{background:url("/IMAGES/foretbleue.webp")}
.chap_galaxie{background:url(/IMAGES/galaxie-1.webp)}
.chap_galaxie0{background-image:url("/IMAGES/galaxie0.webp")}
.chap_homme{background:url(/IMAGES/UNH.webp);background-size:100%}
.chap_hiane{background:url(/IMAGES/haine.webp)}
.chap_hiane2{background:url(/IMAGES/haine2.webp)}.Fond_Chap_bleu_purple{background:url(/IMAGES/haine3.webp)}.chap_intro{background:url(/IMAGES/Germe.webp)}.chap_introduction{background:url(/IMAGES/main_Dieu_Adam.webp);margin-bottom:1px}.chap_montagne{background:url(/IMAGES/fond_montagne.webp)}
.Fond_Chap_beige{background:url("/IMAGES/feuille-de-papier.webp")}
*/ 
.chap_sol1{background:url("/IMAGES/sol1.webp");background-position:top}
.chap_sol2{background:url("/IMAGES/sol2.webp");background-position:top}
.chap_sol3{background:url("/IMAGES/sol3.webp");background-position:top}
.chap_sol4{background:url("/IMAGES/sol4.webp");background-position:top}
.chap_sol5{background:url("/IMAGES/sol5.webp");background-position:top}
.chap_sol6{background:url("/IMAGES/sol6.webp");background-position:top}
.chapi_parchemin{background:url(/IMAGES/parchemin-deroulant-large.webp)no-repeat;background-size:100%;background-size: cover;margin-left:0em;margin-top:-2em;padding-left:3em;padding-right:3em;padding-top:2em;padding-bottom:10px}
.chap_reve{background-image:url("/IMAGES/reve.webp")} 
.chap_simon{background:url("/IMAGES/banc-simon-2.webp");}.chap_verdure{background:url(/IMAGES/verdure.webp)}.chap_voilier{background:url(/IMAGES/fond_voilier.webp)}.chap_ville{background:url(/IMAGES/ville1.webp)}#chapitre_ado{background:url("/IMAGES/feuille-de-papier.webp");background-size:100%;border-radius:0;box-shadow:2vw 2vw 2vw #614423;padding:1.5em}#chapitre_souffrance{background:url(/IMAGES/soleil.webp);background-size:100%}
ul ul{display:none;position:absolute;background-color:#C2DFFF}li li li{transition:all 2.5s}li{opacity:.8;transition:opacity 2.6s ease-in;list-style-type:none;position:relative;width:32em;transition:all 2.5s}
/*;border:3px solid blue*/
li:hover{opacity:1;transition:opacity 0s ease-out;background-color:transparent;padding-top:0em;padding-bottom:0em}/*;border:3px solid blue*/
li:hover ul.niveau2,li li:hover ul.niveau3,li li li:hover ul.niveau4,li li li li:hover ul.niveau5{display:block;padding:.3em;padding-bottom:.3em;padding-top:.3em;border-radius:3vw;box-shadow:6px 4px 4px #728FCE}
ul.niveau1{margin-left:1em;padding-left:1em}
ul.niveau2{display:none;background-color:#FAEBD7;left:0em;top:-1.2em;width:27em;z-index:3}
ul.niveau3{left:7em;top:-1.2em;background-color:#FAEBD7;z-index:3}
ul.niveau4{left:7em;top:-1.2em;background-color:#FFFFF8;z-index:3}
ul.niveau5{left:7em;top:-1.2em;background-color:#FFF0F8;z-index:3}
#noLI{background-color:transparent;border:0;width:100%}a{text-decoration:none;color:blue}a:hover{color:green;text-shadow:1px 1px 2px white}
/*
a.item{color:green;font-family:'Verdana';text-shadow:0;font-size:1.1em;line-height:1.7em;transition:1s}a.item:hover{color:black}
a.item span{display:none;border-radius:8px}a.item:hover span{display:inline;position:absolute;line-height:1em;border:1px solid #8c8c8c;background:#f4f4f4;z-index:3}a.item>span{font-size:.9em;width:70%;padding:1em;box-shadow:6px 4px 4px brown}a.item:hover>span{opacity:1;line-height:1.5em;margin-top:1.5em;padding-left:2em;left:3em;z-index:5}
a.item2{color:white;text-shadow:1px 1px 1px black,2px 2px 2px black;font-weight:700;font-family:'Verdana';font-size:1.2em}a.item2:hover{color:yellow}
*/

h1,h2,h5,h6{text-align:center}
h1{font-family: 'Georgia', serif; text-shadow:1px 1px 2px black,0 0 2px white,0 0px 4px white,0 0px 6px white;font-size:2.5rem;line-height:1.2em;color:purple}
h2{font-family: 'Titres1', serif; text-shadow:1px 1px 2px black,0 0 2px white,0 0px 4px white,0 0px 6px white;font-size:2rem;line-height:1.2em;color:#5388F5}
h3{font-family: 'Titres1', serif; text-shadow:1px 1px 2px black; font-size:1.2rem; line-height:1.2; color:orange; text-align:normal}
h4,h4p{font-family:'Titres1'; text-align:center; text-shadow:0 0 2px white,0 0 2px white,0 0 2px white,0 0 3px white,0 0 3px white;color:green; font-size:1rem; line-height:1.3; margin-bottom:0.5em}
h4p{font-family:'arial';font-size:1.1rem}
h5{color:yellow;text-shadow:0 0 1px black,0 0 2px black,0 0 2px black;font-size:2.4vw}
h6{text-shadow:2px 2px 11px black;text-align:center!important;width: 100%}

.b1{color:green;font-family:Curves;font-size:1.7em;margin-top:0;font-weight:700}.b2{text-shadow:1px 1px 2px black;font-size:2.4vw;color:orange}.b3,.b4,.b5,.b6,.b7{font-family:'Curves';text-shadow:1px 1px 2px black;font-weight:700}.b3{font-size:4vw}.b4{font-size:5vw}.b5{font-size:8vw}.b6{font-size:10vw}.b7{font-size:12vw}
b{text-shadow:0 0 .01px black}
petit{font-size:80%}moyen{font-size:85%}Pgros{font-size:115%;font-weight:700}gros{font-size:120%}Tgros{font-size:140%}
button,input[class*="btn"]{cursor:pointer;white-space:pre-wrap;width:25vw;height:9vw;transition:all 1s;font-family:'Arial';font-size:2.5vw}
.btnBeige{background-color:#FFEBCD;color:#600}.btnBeige:hover{background-color:#FFF8C6}.btnClair{background-color:white;color:#600}.btnVert{background-color:#b1d694;color:#600}.btnVert:hover{background-color:#7eff00}.btnVertClair{background-color:#7eff0f;color:#600}.btnVertClair:hover{background-color:#8effff}.btnOr{background-color:#F4D72B;color:#600}.btnOr:hover{background-color:#f99000;color:white}.btnChap{background-color:#f9d921;color:#600}.btnChap:hover{background-color:#f99000;color:white}.btnTransparent{background-color:transparent;color:white}.btnTransparent:hover{background-color:transparent;color:yellow;text-shadow:1px 1px 8px white}.btnSombre{background-color:#6D7B8D;color:#black;}.btnSombre:hover{background-color:#8B99AB}.bouton{cursor:pointer;white-space:pre-wrap;width:6em;height:3em;transition:all 1s;font-family:'Arial';font-size:.7em;background-color:#DAA520;color:#E8E838}
.livre{background:url(/IMAGES/livre.webp)no-repeat;border:0px;font-size:2em;font-family:'immortal';font-weight:700;background-size:100% 100%;width:9em;line-height:1em}
.p04{margin-bottom:-1.9em}.p03{margin-bottom:-1.6em}.p02{margin-bottom:-1.3em}.p01{margin-bottom:-1em}.p0{margin-bottom:-0.6em}.pI{margin-bottom:-0.2em}.pII{margin-bottom:.4em}.pIII{margin-bottom:1.4em}.pIV{margin-bottom:3em}.pV{margin-bottom:5em}.pVI{margin-bottom:7em}.marge_droite{margin-right:40%}.marge_gauche{margin-top:0em;margin-left:3%}
@media(max-width:668px){
	div[class*="chap_"]{font-size:100%; padding: 2vw}
	div[class*="Fond_Chap_"]{font-size:100%; padding: 2vw;}
    #TOP {
        position: fixed; bottom: -10px; height:12%; width: 100%;
        display: flex; gap: 18px; 
        justify-content: space-around; background: rgba(255,255,255,0.85);
        align-items: center; /* opacity:.8; */
        z-index:999; box-shadow:0 -3px 10px rgba(0,0,0,0.15);
    }
    #TOP .GrosBody,
    #TOP .ClassECHANGES,
    #TOP .ClassPORTE,
    #TOP .ClassLoupeI,
    #TOP #menuFlottant { 
		position:static; top:auto; right:auto
	}
    #TOP .ClassPORTE,
    #TOP .ClassLoupeI,
    #TOP .ClassECHANGES,
    #TOP input,
    #TOP img {position:static; width:40px}
    .GrosBody {margin-top:-3px; margin-left:-55px}
    .ClassECHANGES {margin-top:-3px}
    .ClassPORTE {width:35px}
    body {padding-bottom:80px}
}
/* ==================================================
   MENU DES CHAPITRES FLOTTANT
   ================================================== */
#menuFlottant > img {
    width: 45px; height: auto; cursor: pointer;
}
#chapitresFlottants {
    position: fixed; top: 0; right: 0; width: 360px; max-height: 90vh;
    background: url("/IMAGES/parchemin-ariane.png") no-repeat top right; background-size: 100% 100%;
	/*       TOP  right  bottom  left */
    padding: 10px 45px   40px    45px; box-sizing: border-box;
    overflow-y: auto;
    font-family: Verdana; font-size: .7rem; line-height: 1.5; text-align: left;
    z-index: 1001;
    visibility: hidden; opacity: 0; transform: translateY(-100%);
    transition:
        transform .9s ease,
        opacity .3s ease,
        visibility 0s linear .6s;
}
#menuFlottant:hover #chapitresFlottants {
    visibility: visible; opacity: 1; transform: translateY(0);
    transition:
        transform .9s ease,
        opacity .3s ease;
}
#chapitresFlottants a {
    display: block; color: inherit; text-decoration: none; padding: 3px 0;
}
#chapitresFlottants .chapitreCourant {
    font-size:1.2em; font-weight: bold; color: purple;
}
/* 
  Repli du parchemin après sélection d'un chapitre 
*/
#chapitresFlottants.repli {
    animation: replieParchemin .8s ease-in forwards;
    transform-origin: top center;
}

@keyframes replieParchemin {
    0% {
        transform: scaleY(1);
        opacity: 1;
    }
    100% {
        transform: scaleY(0);
        opacity: 0;
    }
}