:root {
    --color-orange:#ffa500;
    --color-indigo:#4b0082;
    --color-parme:#cfa0e9;
    --color-aubergine:#370028;
    --color-lavande:#e6e6fa;
    --color-ivoire:#fffff0;
    --color-ecru:#fefee0;
    --color-beige:#f5f5dc;
    --color-whitesmoke:#f5f5f5;
    --color-gainsboro:#dcdcdc;
    --color-champagne:#fbf2b7;
    --color-rose:#ffc0cb;
    --color-rose2:#ccaaaa;
    --color-soviet-red:#cc0000;
    --color-soviet-yellow:#ffd700;
    --color-ro-blue:#002b7f;
    --color-ro-yellow:#fcd116;
    --color-ro-red:#ce1126;
	--color-purple-light:rgb(145, 71, 255);
	--color-purple-dark:rgb(69, 16, 147);
    --color-brown-darker:#210;
    --color-brown-dark:#321;
    --color-brown-light:#432;
    --background-soviet:linear-gradient(90deg, var(--color-soviet-red) -200%, var(--color-soviet-yellow) 200%), linear-gradient(0deg, var(--color-soviet-red) -33%, var(--color-soviet-yellow) 133%);
    --background-gradiant-browns:
    	linear-gradient(135deg, rgba(34,17,0,0.5) 0, rgba(0,0,0,0.5) 100%),
    	linear-gradient(0deg, rgba(34,17,0,0.5) 0, rgba(0,0,0,0.5) 100%),
    	linear-gradient(90deg, rgba(34,17,0,1) 0, rgba(0,0,0,1) 100%)
		;
    --background-gradiant-brown-light:
    	linear-gradient(135deg, #7b300f 0%, #944723 100%)
		;
    --color-bds-fg:#663; /* bds */
    --color-bds-bg:#110; /* bds */
    --color-bd-fg:#fef; /* bd */
    --color-bd-bg:#101; /* bd */
	--lc-blue:#0080ff;
	--lc-blue:#00f;
	--lc-yellow:#ffff80;
	--lc-orange:#ff8041;

    
    --color:var(--color-orange-, #cca);
    -color:var(--color-orange-, #000);
    --color-background:var(--color-brown-dark, var(--color-bds-bg, #f5f5f5));
    --page-color:var(--color-, #000);
    --page-background:var(--background-gradiant-brown-light, var(--color-background, #ffe));
    -_-header-color:inherit;
    --header-color:#ffe;
    --header-color-background:var(--color-purple-dark-, #000);
    --header-height:40px;
    --footer-height:32px;
    --main-color:var(--color-orange-, inherit);
    --main-background:var(--color-brown-darker-, none);
    --main-max-width:1000px;
    --sidebar-width:240px;
    
    /*--fg-color:#ff6600;    --bg-color:#110500;*/
    --carre-size:64px; /* bd */
    --icon-size:48px; /* bd */
    --navbar-height:40px; /* bd */
    --header-bg-color:inherit; /* bd */
    --navbar-dropdown:256px; /* bd */
}
html {box-sizing:border-box;}
*, *:before, *:after {box-sizing:inherit;}
html, body {margin:0;padding:0;color:var(--page-color);background:var(--page-background);}
html {font-size:62.5%;} 
body {font-size:1.6rem;}

html.bdqq body {
    margin-top:calc(var(--header-height) + 16px);
    margin-bottom:calc(var(--carre-size) + 10px);
    text-align:center;
}
	html.bds, html.bds body {background:var(--color-bds-bg);color:var(--color-bds-fg);}
	html.bd, html.bd body {background:var(--color-bd-bg);color:var(--color-bd-fg);}



header.page-header {
	position:fixed;left:0;top:0;width:100%;height:var(--header-height, 48px);overflow:hidden;z-index:10;
	color:var(--header-color);--background:var(--header-color-background--,#fef);
	--background-color:var(--fg-color);/*var(--header-bg-color);*/
	font-size:2.4rem;font-weight:bold;
	--padding:4px;
	border-bottom:solid 1px;
}
header.page-header h1 {font-size:1em;}
header.page-header a {text-decoration:none}


footer.page-footer {
    position:fixed;left:0;bottom:0;width:100%;height:var(--footer-height);overflow:hidden;z-index:110;
    display:flex;justify-content:space-between;
    --background:none;
    --background-color:inherit;color:#eee;opacity:1;
    --border-top:solid 1px;
    font-size:small;
		line-height:var(--footer-height);
}
footer.page-footer > div:nth-of-type(2) {flex-shrink:4;flex-grow:4;}
footer.page-footer > div:nth-of-type(3) {text-align:right;}

}
html.bds footer p, html.bds footer p a {display:inline-block;height:100%;}

@media screen and (max-width: 640px) {
}



main {
	margin:var(--header-height) auto var(--footer-height) auto;
	padding:4px;
	max-width:var(--main-max-width);min-height:768px;
	/*color:var(--main-color);background:var(--main-background);*/
}




nav.navbar {/*max-width:1024px;margin:auto;*/height:var(--navbar-height);overflow:hidden;display:flex;justify-content:space-between;background-color:#101;}
nav.navbar a {color:inherit;text-decoration:none;}
nav.navbar a.navbar-button {display:inline-block;width:var(--navbar-height);height:var(--navbar-height);overflow:hidden;}
nav.navbar svg {width:100%;var(--navbar-height);height:100%;var(--navbar-height);}
nav.navbar > div {display:flex;}
nav.navbar > div:first-of-type {-text-align:left;}
nav.navbar > div:nth-of-type(2) {flex-grow:1;}
nav.navbar > div:nth-of-type(2) svg {width:auto;height:auto;border:solid 2px;}
nav.navbar > div:nth-of-type(2) a {display:inline-block;width:100%;height:100%;}
nav.navbar > div:last-of-type {}
nav.navbar ul, nav.navbar li {list-style:none;display:inline-block;margin:0;padding:0;}
nav.navbar .navbar-dropdown {display:none;position:fixed;right:0;top:var(--navbar-height);width:100%;bottom:0;overflow:hidden;background-color:var(--color-background);color:var(--color);text-align:left;font-size:16px;overflow:auto;border-left:solid 1px;}
nav.navbar .navbar-dropdown.open {display:block;}
nav.navbar .navbar-dropdown li {display:block;height:var(--navbar-height);line-height:var(--navbar-height);padding-left:8px;}
nav.navbar .navbar-dropdown li:hover {background-color:var(--color);color:var(--color-background);}
nav.navbar .navbar-dropdown li a {text-decoration:none;display:inline-block;width:100%;height:100%;}
nav.navbar .navbar-dropdown li a svg {margin-right:8px;width:auto;height:auto;}
@media screen and (min-width:800px) {
    nav.navbar .navbar-dropdown {width:var(--navbar-dropdown);}
}


div.cmds {
	/*
	color:#000;
	
	--width:100%;height:16px;overflow:hidden;white-space:collapse nowrap;
	margin:0;padding:0;
	*/
	font-size:16px;line-height:16px;
	font-family:monospace;
}
span#kk {display:none;}


a {color:inherit;}
section {margin-top:64px;}




/*******************************************************************************
 * section c/c annuaire, bd, bds
 ******************************************************************************/

ol.annuaire {-padding-left:32px;text-align:left;display:flex;flex-wrap:wrap;}
ol.annuaire li {width:100%;height:64px;overflow:hidden;    border:dotted 1px;}
ol.annuaire li {display:inline-block;vertical-align:top;width:64px;height:64px;    border:dotted 1px;}
ol.annuaire li a {display:inline-block;width:100%;height:100%;text-decoration:none;}
ol.annuaire li a span {display:none;}

/*canvas {display:none;}*/
.boite {height:240px;}


.icon {
    margin:0;width:var(--icon-size);height:var(--icon-size);
}
.links {display:flex;flex-wrap:wrap;}
.carre {
    display:inline-block;margin:0;width:var(--carre-size);height:var(--carre-size);overflow:hidden;
    --border:solid 1px red;
}
.carre img {margin:0;width:100%;height:100%;max-width:100%;max-height:100%;}
.carre a {text-decoration:none;display:inline-block;width:100%;height:100%;}


.classement {
    position:fixed;left:0;top:var(--carre-size);width:128px;bottom:0;;overflow:hidden;z-index:1000;
    text-align:left;
}
.classement ul, .classement li {list-style:none;margin:0;padding:0;}
.classement li {width:100%;height:64px;border:solid 1px yellow;}
.classement a {color:inherit;}


.a {display:inline-block;background:navy;min-height:1px; 
    ransform:rotate(90deg);}
.a0 {width:841px;height:1189px;}
.a1 {width:594px;height:841px;}
.a2 {width:420px;height:594px;}
.a3 {width:297px;height:420px;}
.a4 {width:210px;height:297px;}
.a5 {width:148px;height:210px;}
.a6 {width:105px;height:148px;}
.a7 {width:74px;height:105px;}
.a8 {width:52px;height:74px;}
.a9 {width:37px;height:52px;}
.a10 {width:26px;height:37px;}



/*******************************************************************************
 * sprotcheries :
 ******************************************************************************/

.ide {
	background:var(--background-brun--, navy);
	font-family:tp,monospace;
}
a {color:inherit;}

header h1 {margin:0;}
hr {margin:0;width:100%;height:32px;background:var(--background-soviet);}

/*h1, h2, h3, h4, h5, h6, article, p {color:var(--color);background:var(--color-brown-darker);}*/


.books {text-align:center;}
.book {
	display:inline-block;width:200px;height:320px;overflow:hidden;vertical-align:top;
	position:relative;
	background:var(--background-gradiant-browns);
	border:outset 1px #575757;
}
.book h2 {text-align:center;text-transform:capitalize;font-size:1.6em;}
.book h3 {text-align:center;text-transform:capitalize;font-size:1em;
	position:absolute;left:0;top:75%;width:100%;
}

.chantier {/*font-size:1.6em;*/}
article {
	margin:8px;
	-color:#eee;background:var(--background-gradiant-browns);
	opacity:1;
	-background:var(--background-soviet);
}


.animation {margin:5px;width:64px;height:40px;background:#321;}


ul.links, ol.links {list-style:none;margin:16px auto;padding:0;max-width:360px;text-align:center;}
li.link {
	list-style:none;
	display:inline-block;
	width:100%;height:64px;
	border:outset 1px;
	color:var(--color);background:var(--color-background);
}
li.link a {
	display:inline-block;width:100%;height:100%;overflow:hidden;text-decoration:none;

}
iframe {max-width:100%;}
section {text-align:center;}

ul.profil-liens {list-style:none;margin:auto;}
a.profil-lien {display:block;min-width:80px;min-height:40px;line-height:40px;margin:25px;border:solid 1px;border-radius:10px;text-decoration:none;}


/*******************************************************************************
 * sprotcheries 2025-12 :
 ******************************************************************************/
.vieux-liens {
	text-align:left;
	margin:16px;
	--columns:4;
}
.sidebar {
	display:none;
	position:fixed;top:var(--header-height);width:var(--sidebar-width);bottom:var(--footer-height);overflow:auto;
}
.sidebar-left {
	left:0;
}
.sidebar-right {
	right:0;
}
@media screen and (min-width: 640px) {
	.sidebar {display:block;}
}



a.gros-bouton {display:inline-block;width:160px;height:40px;border:outset 1px;border-radius:5px;line-height:40px;}
a.gros-bouton:hover {text-decoration:none;}



.sprotchable {display:inline-block;width:256px;height:256px;overflow:hidden;margin:8px;vertical-align:top;text-align:center;border:dotted 1px #444;border-radius:8px;
  color:#000;background:#fff;
}
.sprotchable > div {height:64px;overflow:hidden;margin:0;padding:20px;}
.sprotchable pre {height:128px;overflow:hidden;font-size:11px;margin:0;text-align:center;color:#000;-background:#ddd;}