/* home */

:root
{	
	--show-back:RGBA(0,55,110,1);
	--show-page:RGBA(0,60,120,1);
	--show-glass:transparent;
	--show-glass:RGBA(0,0,0,.03);
	--show-high:#FF4; /* MENU */
}

/* test & debug */

article.portfolio>div { flex-basis:30%; }


task.hosted main>menu { background-color:transparent; }

/* Reconfig */

task.backsic { scrollbar-color:RGBA(255,255,255,.25) transparent !important ; }

/* task.backsic section { flex-grow:0; } */

task.backsic main>footer { padding:.5em; }

/* backsic APP */

task.backsic
{	backdrop-filter:none;
	font-size:1rem;	
}

task.backsic main
{	font-size:100%; 
}

/*
task.backsic header>notify
{	top:0;
}
*/

task.backsic main>header a
{ 	padding:0 1em 0 1em;
	padding:1em;
	
}

task.backsic page
{ 	background-color:var(--show-back);
	color:#CDE;	
}

task.backsic banner
{	background-color:var(--black);
}

task.backsic article s, task.backsic article u { font-weight:bold; }

/* APP */

/*section#menu_side { flex-grow:0; flex-basis:10em; }*/
/*section#menu_side*/
menu#menu_side
{ 	flex-grow:0; /*border-right:1px solid var(--line);*/ /* largeur */
	flex-basis:13em;
	display:flex; flex-direction:column; /* pour 2x NAV */
	padding:.5em; 
}

menu#menu_side>nav { margin:0em; padding:0; flex-grow:1; flex-basis:0; }
menu#menu_side>nav>a { flex-basis:100%; display:block; text-align:left; border:none; margin:0; }
menu#menu_side>nav>a>icon { font-size:1.75rem; display:inline-block; margin-right:.5em; }

menu a.selected>icon { background-color:#000 !important; }

nav.second { font-size:var(--small); }

section#page_side { flex-grow:3; background-color:var(--show-page); }
section#page_side { display:flex; }

section#a_side
{ 	flex-grow:2; border-left:1px solid var(--line); 
	display:flex; flex-direction:column;
	flex-wrap:nowrap; /* surtout */
	/* overflow:hidden; pas possible */
}

section#a_side>article
{ 	width:100%; flex-grow:0; padding:0;
	transition:opacity .5s ease,flex-grow .5s ease-out,max-height .5s ease-out;
}

section#a_side>article#xside { padding:1em; }


task.aside article.off
{ 	flex-grow:0 !important; flex-basis:0; overflow:hidden; 
	max-height:0; opacity:0; /* opacity car padding 1 */
}

task.aside article.on
{ 	flex-grow:1; opacity:1;
	max-height:100vh;
}


/* MAP */

index { display:block; font-size:var(--small); padding:0 .5em 0 .5em; }
index a { display:block; padding:.3em 0 .3em 0; transition:none; }
index a:hover { background-color:var(--hover); border-color:var(--line); color:var(--search); }



/* CM */

/*
.CodeMirror
{	background-color:var(--show-source);	
}
*/

.CodeMirror-gutters
{	background-color:var(--show-back); /* important : passer par dessus le code */
	border-right:1px solid var(--line);
}