/* 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.aside section#pop { background-color:var(--black); }

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 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:14em;
	display:flex; flex-direction:column; /* pour 2x NAV */
	padding:.5em; 
}

section#menu-side>menu { flex-grow:1; flex-basis:0; width:100%; }


menu a.selected>icon { background-color:#000 ; }
menu bu>a.selected>icon { background-color:transparent ; /* discard */ }

menu a.selecting { animation:selecting .3s forwards !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);
}