:root
{	--line:RGBA(0,0,0,.05);
	--theme:#48A;
	--hover:#6AC;

	--light:#F4F8FA; /* hover */
	--focus:#E8F8FA; /* input:focus besoin de + de contraste */
	--white:#F8F8F8; 
	--black:#222;
	--grey:#999;
	--off:#CCC;
}

/* latin-ext */
@font-face {
	font-family: 'Varela Round';
	font-style: normal;
	font-weight: 400;
	font-display: block;
	src: url(fontes/valera_latin_ext.woff2) format('woff2');
	unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
	font-family: 'Varela Round';
	font-style: normal;
	font-weight: 400;
	font-display: block;
	src: url(fontes/valera_latin.woff2) format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


main { animation:open-up .2s ease; }

@keyframes open-up
{	0%		{ opacity:0.2; translate:0 -2em; }
	100%	{ opacity:1.0; translate: 0 0; }
}

html
{	height:100%;
	background-size:cover;
	background-position:50% 50%;
	background-attachment:fixed;
	/*
	background-image:url("/img/pex_dc.jpg");
	background-image:url("/img/cralfa_1.jpg");
	background-image:url("/img/pex_a.jpg");
	background-image:url("/img/alsace_2.jpg");
	background-image:url("/img/bresse.jpg");
	background-image:url("/img/pex_aerial.jpg");
	background-image:url("/img/serveur_1.jpg");
	*/
	background-color:#DDD;
	scroll-behavior: smooth;
}

body
{	color:#333;
	min-height:100%;
	font-size:0.85vw;
	overflow-y:scroll;
	/* font-family: 'Nunito', arial, sans-serif;*/
	font-family: 'Varela Round', arial, sans-serif;
	margin:0px;
	display:flex;
	flex-direction:column;
	justify-content:space-beween;
	/* font-size:1vw; */
	background-attachment:fixed;
	background-color:#FFF;
}

a,input,i
{
	transition-property: background-color,opacity,border-color,background;
	transition-duration: .25s;
}


/* --- style général --------------------- */

table,
div.articles a,
article.offline
{
    border:1px solid var(--line);
    border-radius:1em;
    box-shadow:0px 0px .5em var(--line);
    background-color: RGBA(255,255,255,.9);   
}

header
{
	background:transparent;
	color:var(--theme);
	padding:1em 5% 1em 5%;
	flex-grow:0;	
	font-weight:normal;
	position: sticky;
	top: 0px;
	background-color: #F8F8F8;
	border-bottom:4px solid var(--hover);
	/* box-shadow:0px 0em 1em RGBA(0,0,0,.5); */
	display:flex;
	align-items:center;
}

	header>div
	{	flex-grow:0;
		text-align:center;
	}

	header>nav
	{	flex-grow:1;
	}

	header h1 { font-size:100%; margin-top:.5em; }
	header>div>span { display:flex; margin:0; flex-direction:column;}
	header>div>span>h2 { font-size:120%; }


header>nav
{	padding:0px;
	font-size:115%;	
	/* flex-grow:1; */
	text-align:center;
	box-sizing:border-box;
	color:RGBA(32,64,96,.5);
	z-index:2;	
}

	nav div
	{	margin-bottom:.5em;
		padding:0px;		
		display:flex; 
		justify-content:center;
	}

	nav a
	{	color:inherit;
		padding:.1em .5em .1em .5em;
		text-decoration:none;
		line-height:100%;
		border-bottom:2px solid transparent;
		display:inline-block;
	}

	nav a.sel { color:var(--theme); }
	nav a.sel, nav a:hover { text-decoration:none; }
	nav a:hover { color:var(--theme); }

	/* admin */
	nav div.admin a
	{	font-size:100%;
	}

	nav div.admin a:hover, nav div.admin a.sel
	{	color:#D32;
		border-bottom:2px solid #D32;
	}

footer
{	margin-top:2em;
	padding:2em 5% 2em 5%;
	color:RGBA(0,0,0,.65);
	flex-grow:0;
	font-size:85%;
	line-height:125%;
	border-top:1px solid var(--line);
	display:flex;
}

	footer img { display:inline-block; width:9em; height:7em; }
	footer div { display:block; flex-grow:1; }
	footer div.epelfi { flex-grow:0; }

main
{
	width:100%;
	margin:0em auto 0em auto;
	padding:2em 3% 0em 3%;
	box-sizing:border-box;
	display:flex;
	flex-grow:1;
	flex-basis:0;
}

section
{	
	display:flex;
	flex-grow:3;
	flex-basis:0;
	flex-wrap:wrap;
	margin-right:2em;
}

article
{	min-width:45%;
	flex-grow:1;
	flex-basis:0;
	margin:1em;
    box-sizing:border-box;
	padding:1em;
}

article.bloc
{
	margin:1em;
}

aside
{
    flex-basis:0;
	flex-grow:1.25;
    /*background:linear-gradient(RGBA(0,25,60,.1),RGBA(0,20,80,0));
	background:linear-gradient(RGBA(255,255,255,1),RGBA(255,255,255,0));*/
	margin:1em 0 1em 0em;
    padding:1em 0 1em 0em;
    box-sizing:border-box;
}

/* --- */

H1,H2,H3,H4,H5,H6
{	font-weight:normal;
	margin:0px;
}

u,s
{	padding:.2em 2em .2em 2em;
	text-decoration:none;
	font-weight:bold;
}

u
{	color:#48C;
	background-color:#DEF;
}

s
{	color:#C22;
	background-color:#FED;
}

A U { color:#8D4; font-weight:normal; background-color:transparent; }
A S { color:#F80; font-weight:normal; background-color:transparent; }

i { font-style:normal; color:#E92; font-weight:bold; }

a i { border-radius:100%; padding:.5em; margin-right:.25em; color:inherit; background-color:transparent; }
nav a.sel i { color:#FFF; background-color:var(--theme); }


sub
{	display:block;
}

hr
{	border:none;
	margin:1em 0px 1em 0px;
}


/* --- TRIX --- */

trix-toolbar .trix-button--icon-attach { display: none; }
trix-toolbar .trix-button-group { border-radius:0px !important; border-bottom:0px !important; }
trix-editor { background-color:#FFF; border-radius: 0px !important; }