@charset "UTF-8";


html{line-height:1.15}

:root{
--couleur-fond:white;
--couleur-texte:black;
--couleur-bord:rgba(0, 0, 0, 0.2);
--couleur-shadow:rgba(0,0,0, 0.5);
--couleur-quote-fond:rgba(116, 45, 228,0.5);
--couleur-quote-texte:black;
--quote-opacity:0.6;
--color-lighter-gray:rgba(0,0,0,.05);
--color-light-gray:#e6e6e6;
--color-mid-gray:#ccc;
--color-dark-gray:#444;
--color-darker-gray:#15171a;
--color-black:#000;
--color-primary-text:var(--color-darker-gray);
--color-secondary-text:rgba(0,0,0,.55);
--color-border:rgba(0,0,0,.08);
--color-dark-border:rgba(0,0,0,.55)
}

@media screen and (prefers-color-scheme: dark){
:root{
--couleur-fond:black;
--couleur-texte:white;
--couleur-bord:rgba(256,256,256, 0.5);
--couleur-shadow:rgba(256,256,256, 0.5);
--couleur-quote-fond:rgb(152,251,152);
--couleur-quote-texte:black;
--quote-opacity:0.7;
}}

h1{font-size:2em;margin:.67em 0}a{background-color:transparent}
abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}
b,strong{font-weight:bolder}
code{font-family:monospace,monospace;font-size:1em}
small{font-size:80%}
img{border-style:none}


blockquote,body,dd,dl,figcaption,figure,h1,h2,h3,h4,h5,h6,li,ol,p,ul{margin:0}a{color:inherit}
button,input,select,textarea{font:inherit}
button{background-color:black;border-width:0;color:inherit;padding:0}
h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}

cite{font-style:normal}
fieldset{border-width:0;margin:0;padding:0}
*{box-sizing:border-box}:root{font-feature-settings:"pwid";font-family:var(--custom-font-family-base,Helvetica,Arial,sans-serif);font-size:18px;line-height:1.6666666667;color:var(--couleur-texte);
   background:var(--couleur-fond);}

.backtothetop{display:none;font-size:200%}.fa-layers .fa-circle{color:#fff}

header{background:var(--custom-background-color,#000);color:var(--custom-font-color,#fff);padding:.5rem 1.6666666667rem}
header h1{display:inline-block;font-size:140%}
header .version{font-size:80%;margin-left:.4rem}

.content-footer{margin-bottom:10px;text-align:center;}


body{background-color:transparent;margin:0;
color:var(--color-primary-text);}
h1,h2,h3,h4,h5,h6{font-family:var(--custom-font-family-headings,Helvetica,Arial,sans-serif);font-weight:700;line-height:1.6666666667}
h1>small,h2>small,h3>small,h4>small,h5>small,h6>small{font-size:75%;font-weight:400}
h1{font-size:240%;line-height:1.3125;text-align:center;margin-bottom:42px}
h2{font-size:200%;line-height:1.375;margin-top: 42px;margin-bottom: 10px}
h3{font-size:160%;line-height:1.46875;margin-top: 21px;margin-bottom: 5px}
h4{font-size:125%;line-height:1.6;margin-top: 21px;margin-bottom: 5px}
h5{font-size:100%;line-height:1.75;margin-top: 10px;margin-bottom: 2px}
h6{font-size:80%;line-height:1.9375;margin-top: 21px;margin-bottom: 5px;text-align:center}

.soustitre{font-size: 150%; margin-top: -20px; margin-bottom: 42px; font-family: var(--custom-font-family-headings, Helvetica, Arial, sans-serif);font-weight: 700; text-align: center;}


a{color: rgb(116, 45, 228);text-decoration:none}
a:active,a:focus,a:hover{opacity:.8;text-decoration:underline}


img{display:inline-block;line-height:0}
img,video{height:auto;max-width:100%}


blockquote{color:var(--couleur-quote-texte);background-color:var(--couleur-quote-fond);opacity:var(--quote-opacity);border-left:4px solid var(--couleur-quote-texte);border-radius:.2rem;padding:1.6666666667rem}

code{font-family:Menlo,Monaco,Courier New,monospace}
code{border-radius:.2rem;padding:.2rem}
code{color:var(--couleur-quote-texte);
   background:var(--couleur-quote-fond);}



body,html{height:100%}
.container{height:100%;margin:auto;width:100%}
.container,.content-container{box-sizing:border-box}
.content-container{justify-content:center}




.content-container p{margin-top: 5px;margin-bottom :10px; font-size:18px; text-indent : 0px}


main{max-width: 100em;justify-content:center}
main,main:only-child{box-sizing:content-box}
main:only-child{max-width:100%;margin: 0px 5%}

@media screen and (max-width:750px){main:only-child{max-width:100%;margin: 0px 2%}}


@media screen and (max-width:480px){.content-container{box-sizing:border-box;display:block} 
main{min-width:60%}


.sidebar,main{box-sizing:border-box}}
.sidebar{max-width:100%;margin: 20px 42px; display:flex;justify-content:left;}

main{padding:2rem}
@media screen and (max-width:480px){main{padding:1rem}}




.sidebar .slide-menu .has-sub-menu>a span.mark{border-left:1px solid var(--couleur-bord);color:var(--couleur-shadow);display:inline-block;line-height:2;position:absolute;right:0;text-align:center;top:0}


.sidebar .hamb-menu .has-sub-menu>a span.mark{border-left:1px solid var(--couleur-bord);color:var(--couleur-shadow);display:inline-block;line-height:2;position:absolute;right:0;text-align:center;top:0}


.sub-menu {z-index: 10 ; flex-direction: column}



nav menuitem {
   display:block;
   opacity:0;
   cursor:pointer;
   
}

nav menuitem > menu {
   position: absolute;
   pointer-events:none;
}

#main-menu  menu {display:flex;flex-wrap: wrap}

#main-menu menu{padding-inline-start:0;   margin-block-start:0;}

nav > menu > menuitem { pointer-events: all;opacity:1}

#main-menu menu menuitem a {white-space:nowrap; display:block; font-size:80%;}

   
menuitem:hover > menu {
   pointer-events:initial;
   
}

menuitem:hover > menu > menuitem,
menu:hover > menuitem{
   opacity:1;
}

#main-menu menu > menuitem menuitem menu {
   transform:translateX(100%);
   top:0; right:0;

}





#main-menu  { 
   color:var(--couleur-texte);
   background:var(--couleur-fond);
   margin-top: 0px;
   margin-left:0px;
}

#main-menu  a {
   font-size:60%;
   color:var(--couleur-texte);
   background:var(--couleur-fond);
   border: 0px solid var(--couleur-shadow);
   min-width:60px;
   transition: background 0.5s, color 0.5s, transform 0.5s;
   margin:0px 6px 6px 0px;
   padding:5px 10px;
   box-sizing:border-box;
   border-radius:0px;
   box-shadow: 0px 0px 0px var(--couleur-shadow);
   position:relative;
}

#main-menu  a:hover:before {
   content: '';
   top:0;left:0;
   position:absolute;
   background:RGBA(240, 255, 240, 0.2);
   width:100%;
   height:100%;
}

#main-menu  menu > menuitem > a + menu:after{
   content: '';
   position:absolute;
   cursor:none;
   left:12px;
   top: -40px;    
}

#main-menu  menuitem > menu > menuitem > a + menu:after{ 
   content: '';
   position:absolute;
   top: 20px;
   left:-180px;
   transition: opacity 0.6, transform 0s;
}

#main-menu  menu > menuitem > menu > menuitem{
   transition: transform 0.6s, opacity 0.6;
   transform:translateY(150%);
   opacity:0;
}

#main-menu  menu > menuitem:hover > menu > menuitem,
#main-menu  menu > menuitem.hover > menu > menuitem{
   transform:translateY(0%);
   opacity: 1;
}

#main-menu menuitem > menu > menuitem > menu > menuitem{
   transition: transform 0.6s, opacity 0.6;
   transform:translateX(195px) translateY(0%);
   opacity: 0;
} 
 
#main-menu menuitem > menu > menuitem.hover > menu > menuitem{  
   transform:translateX(0) translateY(0%);
   opacity: 1;
}


#hamburger-menu {
    font-size:70%;
    position: fixed;
    top: 30px;
    left: 20px;
    width: 30px;
    height: 30px;
    display: block;
    border: none;
    background: linear-gradient(
      to bottom, 
      var(--couleur-texte), #F0FFF0 20%, 
      var(--couleur-fond) 20%, var(--couleur-fond) 40%, 
      var(--couleur-texte) 40%, #F0FFF0 60%, 
      var(--couleur-fond) 60%, var(--couleur-fond) 80%, 
      var(--couleur-texte) 80%, #F0FFF0 100%
    );
}


#hamburger-menu menu menuitem a {display:block; font-size:80%}

#hamburger-menu > menu{
   /*opacity: 0;*/
   /*display:none;*/
   height: 0;
   overflow: hidden;
} 

#hamburger-menu:hover > menu,
#hamburger-menu:focus-within > menu{
   /*display:block;*/
   height: initial;
   overflow: initial;
}

#hamburger-menu  a:hover:before {
   content: '';
   top:0;left:0;
   position:absolute;
   background:RGBA(240, 255, 240, 0.2);
   width:100%;
   height:100%;
}

#hamburger-menu menu:hover {
   opacity: 1;
} 


#hamburger-menu menu menuitem menu {
 transform:translateX(50%);
   opacity: 1;
} 

#hamburger-menu menu menuitem menu menuitem menu{
   opacity: 1;
} 



#hamburger-menu  a {
left:-40px;
top:20px;
   color:var(--couleur-texte);
   background:var(--couleur-fond);
   border: 0.5px solid var(--couleur-shadow);
   width:180px;
   transition: background 0.5s, color 0.5s, transform 0.5s;
   margin:0px 0px 0px 0px;
   padding:5px 10px;
   box-sizing:border-box;
   border-radius:3px;
   box-shadow: 0px 2px 4px var(--couleur-shadow);
   position:relative;
}





@media screen and (max-width: 750px) {
  #main-menu {
    display: none;
  }
  #hamburger-menu {
    display: inline;
  }
}

@media screen and (min-width: 750px) {
  #hamburger-menu {
    display: none;
  }
  #main-menu {
    display: inline;
  }
}



#search-form {
		display: flex;
		position: fixed;
		top: -5px;
		left: 0;
		margin:0;
		padding: 0;
		min-width: var(--icon-size, 1.2rem);
		max-width: 15rem;
		max-height: 100vh;
		z-index: 1000;
}


#search-form.search--display, #search-form[data-focus='false'] .search--display {
		display: none;
}

#search-form[data-focus='true'] .search--display {
		display: block;
}

#search-form .search-bar {
		display: flex;
		height: 1.4rem;
		align-items: center;
}

#search-form .search-bar {
		background: var(--couleur-quote-fond);
		color: var(--couleur-texte, '3,3,3');
}

#search-form[data-focus='true'] .search-bar {
		border: 2.5px solid var(--couleur-texte);
}

#search-form[data-focus='true'] .search-bar:not(:focus-within) {
		background: var(--couleur-texte);
		color: var(--couleur-fond);
		border-color: var(--couleur-fond);
}

#search-input {
		display: block;
		padding: 0.3rem;
		width: 15rem;
		max-width: 100vw;
		height: 100%;
		background: inherit;
		border: none;
		color: inherit;
		outline: none;
		text-align: left;
		font-size: var(--s-2, 0.8rem);
}

#search-submit {
		display: block;
		margin: 0 var(--icon-pad, 0.1rem) 0 0;
		padding: 0;
		width:       var(--icon-size, 1.2rem);
		height:      var(--icon-size, 1.2rem);
		line-height: var(--icon-size, 1.2rem);
		background: inherit;
		color: inherit;
}

#search-submit:hover,#search-submit:focus {
		color: var(--couleur-quote-fond);
}

#search-results {
		display: block;
		flex-grow: 2;
		margin: 0.5px 0 0 0;
		padding: 0;
		max-height: calc(100vh - 1.4rem - 0.5px);
		width: 100%;
		overflow-x: hidden;
		overflow-y: auto;
		backdrop-filter: blur(var(--couleur-shadow), 2px);
		border: 2.5px solid;
		background:white;
		color: var(--couleur-texte);
		font-size: var(--s-2, 0.8rem);
		scrollbar-color: var(--couleur-texte) var(--couleur-fond) !important;
		scrollbar-width: thin !important;
}

#search-results:empty {
		display: none;
		opacity: 0;
}

#search-results li {
		margin: 0;
		width: 100%;

		background-color: var(--couleur-fond);
		border-top: 0.5px dashed;
		list-style: none;
}
#search-results li:first-child {
			border: none;
}

#search-results a {
		display: block;
		padding: 0.3rem;
		display: block;

		text-decoration: none;
}

#search-results a:hover,
#search-results a:focus {
		background: var(--couleur-texte);
		color: var(--couleur-fond);
		outline: 0;
}

#search-results a:active {
		background: var(--couleur-quote-fond);
		color: var(--couleur-fond);
}

#search-results li span:empty {
		display: none;
}

#search-results li span:not(:last-child)::after {
		content: ' – ';
}

#search-results li .title {
		display: block;
		margin-bottom: calc(var(--line-height, 1.4em)/3);
}

#search-results li .title::after {
		display: none;
}

