/*
iftrue.fr
mode: doc
version 0.2022.12.28
*/

::-webkit-scrollbar{background-color:#222;width:6px}
::-webkit-scrollbar-thumb{background-color:#000;box-shadow:0 0 0 1px #020 inset;}
textarea:focus-visible{outline:none;}/*input contour*/
input:focus-visible{outline:none;}/*input contour*/

/*
Mobile first
Light first
*/


/* global element p1/5 */

body{margin:0;font:1rem sans-serif;background:#fff;color:#444}

body.darkmode{background-color:#111;color:#aaa}

body.darkmode header ul li{border:2px solid #444;}/*todo optionnel*/

a,.fakelink{color:#0bf;text-decoration:none;cursor:pointer}
a:hover:not(.disabled),.fakelink:hover:not(.disabled){color:#6ef}
.fakelink.white{color:#ddd;}
.fakelink.white:hover:not(.disabled){color:#6ef;}

div,header,main,footer{position:relative}

main .glob_article{padding:.5rem 0;border:2px solid #555;margin:1rem;display:table;border-radius:5px;height:max-content}

img{max-width:100%}
.iftrue img{max-width:calc(100% - 1em)}

h1{font-size:2rem}
h2{font-size:1rem}

textarea{min-height:12rem}

input[type="text"],input[type="password"],textarea{background:#eee;color:#222;border:2px solid #ddd;padding:.25rem .5rem;border-radius:5px}

.darkmode input[type="text"],.darkmode input[type="password"],.darkmode textarea{background:#222;color:#bbb;border:2px solid #333}



/* add-on 2/5 */


@keyframes spin{
from{-webkit-transform:rotate(0deg);transform:rotate(0deg)}
to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}
}

.loading{
	border:2px solid rgba(0,170,240,.2);
	border-right:2px solid #0af;
	border-radius:50%;
	width:2.4rem;
	height:2.4rem;
	animation:spin 1.6s linear infinite;
}



@keyframes progress-bar-stripes{
from{background-position:0 0}
to{background-position:1rem 0}
}

.progress{
	height:1rem;
	border-radius:3px;
	background:#00acf1 linear-gradient(45deg,hsla(0,0%,100%,.4) 25%,transparent 0,transparent 50%,hsla(0,0%,100%,.4) 0,hsla(0,0%,100%,.4) 75%,transparent 0,transparent)repeat-x center center / 1rem 1rem;
	animation:progress-bar-stripes 1s linear infinite
}



/* lite or media p3/5 */

@media screen and (prefers-reduced-motion:reduce){
	.progress{transition:none}
	.collapsing{transition:none}
}



@media (min-width:540px){
	/* (mode large) */

.navbar_expand_md .container{
	justify-content:normal;
}

.navbar_expand_md .navbar_toggler{
	display:none
}

.navbar_expand_md .collapse{
	flex-basis:calc(100% - 80px);
	height:auto;
	overflow:auto;
	justify-content:start;
	padding-left:8px;
}

.collapse_show .collapse{
	box-shadow:none;
}

.navbar_expand_md .navbar_liste{
	flex-flow:unset;
	justify-content:space-evenly;
}

.navbar_expand_md .navbar_liste li{
	margin:0 .4rem;
}

.carde_mini{
	margin:1rem;
}

.zone{
	margin:.5rem 1rem;
}

/* sd */

.sd_m_l10{margin-left:1rem}
.sd_m_r10{margin-right:1rem}

.sd_pd_5{padding:.5rem}

.sd_fs_40{font-size:4rem}
.sd_fs_15{font-size:1.5rem}

}



@media (min-width:820px){

/* md */

.md_fs_60{font-size:6rem}
.md_fs_20{font-size:2rem}

}



/* global specitif p4/5 */


.navbar{
	position:fixed;
	left:0;
	top:0;
	width:100%;
	padding:.25rem 1rem;
	background:#eee;
	color:#222;
	box-sizing:border-box;
	z-index:8;
}

.navbar a{line-height:0}

.darkmode .navbar{
	background:#333;
	color:#bbb;
	box-shadow:0 2px 8px 4px #021;
}

.navbar .container{
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
	align-items:center;
}

.collapse{
	display:flex;
	height:0;
	overflow:hidden;
	transition:height .35s ease;
	flex-basis:100%;
}

.navbar.collapse_show{
	box-shadow:0px 0px 0px 1px hsl(200,0%,80%) inset;
}

.darkmode .navbar.collapse_show{
	box-shadow:0px 0px 0px 1px hsl(200,0%,25%) inset;
}

.collapse_show .collapse{
	box-shadow:0px 0px 0px 1px hsl(200,60%,80%) inset;
	height:auto!important;
	max-height:calc(100vh - 80px);
	overflow:auto;
}

.darkmode .collapse_show .collapse{
	box-shadow:0px 0px 0px 1px hsl(200,60%,14%) inset;
}

.uldecimal{list-style:decimal}

.navbar_liste{
	display:flex;
	width:100%;
	padding:0;
	list-style:none;
	align-items:center;
	flex-flow:row wrap;
}

.navbar_liste li{
	margin:2rem;
}

.footer{
	padding:1rem;
	background:#eee;
	color:#222;
}

.darkmode .footer{
	background:#333;
	color:#bbb;
}

.container{width:100%;max-width:1200px;margin:auto}

.navbar_toggler{
	display:inline-block;
	width:3rem;
	height:3rem;
	background:url("data:image/svg+xml,%3Csvg xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' viewBox%3D'0 0 30 30'%3E%3Cpath stroke%3D'%2300acf1' stroke-width%3D'4' stroke-linecap%3D'round' d%3D'M4 6h22M4 15h22M4 24h22'%3E%3C/path%3E%3C/svg%3E") no-repeat 50% 50% / contain;
	background-color:none;
	border:0;
}
.navbar_toggler:focus,.navbar_toggler:hover{background-color:rgba(255,255,255,0.25)}
.navbar_toggler:not(:disabled):not(.disabled){cursor:pointer}

.darkmode_toggler{
	display:inline-block;
	width:2.4rem;
	height:2.4rem;
	background:url("data:image/svg+xml,%3Csvg xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' viewBox%3D'0 0 360 360'%3E%3Cdefs%3E%3Crect id%3D'ray' x%3D'170' y%3D'0' rx%3D'6' ry%3D'6' width%3D'12' height%3D'50'%2F%3E%3C%2Fdefs%3E%3Cg fill%3D'%23eecc88'%3E%3Ccircle cx%3D'180' cy%3D'180' r%3D'95'%2F%3E%3Cuse href%3D'%23ray'%2F%3E%3Cuse href%3D'%23ray' transform%3D'rotate(45, 180, 180)'%2F%3E%3Cuse href%3D'%23ray' transform%3D'rotate(90, 180, 180)'%2F%3E%3Cuse href%3D'%23ray' transform%3D'rotate(135, 180, 180)'%2F%3E%3Cuse href%3D'%23ray' transform%3D'rotate(180, 180, 180)'%2F%3E%3Cuse href%3D'%23ray' transform%3D'rotate(225, 180, 180)'%2F%3E%3Cuse href%3D'%23ray' transform%3D'rotate(270, 180, 180)'%2F%3E%3Cuse href%3D'%23ray' transform%3D'rotate(315, 180, 180)'%2F%3E%3C%2Fg%3E%3Cpath d%3D'M127 101c-66 47 -47 128 0 158L127 259c42 30 117 21 143 -48L270 211c-20 40 -100 20 -123 0L147 211c-40 -30 -40 -90 -20 -110z' fill%3D'%23000'%2F%3E%3C%2Fsvg%3E") no-repeat 50% 50% / contain;
	background-color:none;
	border:0;
}

.carde{
	border-radius:5px;
	background:#f3f3f3;
	padding:.5rem 1rem;
	margin:.5rem 0;
}

.darkmode .carde{
	background:#222;
}

.zone{
	background:#f3f3f3;
}

.zone_discret_info{
	border-radius:3px;
	padding:.25rem .5rem;
  border-bottom:1px solid #999;
	color:#999;
}

.darkmode .zone_discret_info{
  border-bottom:1px solid #999;
	color:#666;
}

.darkmode .zone{
	background:#222;
}

.carde_mini{
	display:table;
	box-shadow:0px 0px 0px 1px hsl(0deg,0%,82%) inset;
	border-radius:5px;
	margin:.5rem;
}

.carde_title{
	background:#ddd;
	padding:.5rem 1rem;
	border-top-left-radius:5px;
	border-top-right-radius:5px;
}

.darkmode .carde_mini{
	box-shadow:0px 0px 0px 1px hsl(200,0%,20%) inset;
}

.darkmode .carde_title{
	background:#333;
}

.carde_content{
	padding:.5rem 1rem;
}

.carde_tarif{
	padding-top:0.5rem;
}

.btn{
	color:hsl(200,40%,80%);
	background:hsl(200,60%,20%);
	display:inline-block;
	border:0;
	padding:.4rem .75rem;
	border-radius:.25rem;
	transition:background .08s ease;
	user-select:none;
	cursor:pointer;
}

.btn:hover:not(.disabled){
	color:hsl(200,100%,100%);
	background:hsl(200,75%,30%);
}

.btn_outline_primary{
	color:hsl(200,100%,40%);
	box-shadow:0px 0px 0px 2px hsl(200,40%,40%) inset;
	background:transparent;
	transition:box-shadow .1s ease;
	cursor:pointer;
}

.btn_outline_primary:hover:not(.disabled){
	color:hsl(200,100%,60%);
	box-shadow:0px 0px 0px 2px hsl(200,60%,50%) inset;
	background:transparent;
}

.btn.back_orange{
	color:hsl(20,40%,80%);
	background:hsl(20,60%,20%);
}

.btn.back_orange:hover:not(.disabled){
	color:hsl(20,100%,100%);
	background:hsl(20,75%,30%);
}

.btn.back_green{
	color:hsl(130,40%,80%);
	background:hsl(130,60%,20%);
}

.btn.back_green:hover:not(.disabled){
	color:hsl(130,100%,100%);
	background:hsl(130,75%,30%);
}

.btn.mini{
	padding:.1rem .5rem;
}



.png_shadow{filter:drop-shadow( 0px 0px 2px #ddd )}

.nextlabel_cadre+label{
	border-radius:5px;
	border:2px dashed #666;
	padding:.25rem .5rem;
	margin:.32rem .5rem;
	cursor:pointer
}

.nextlabel_cadre+label:hover{border:2px dashed #494}

.nextlabel_cadre:checked+label{border:2px solid #2a2}

.spacer100{
	height:100px;
	width:100%;
}

.spacer200{
	height:200px;
	width:100%;
}

.spacer400{
	height:400px;
	width:100%;
}

.spacer60{
	height:60px;
	width:100%;
}

.spacer80{
	height:80px;
	width:100%;
}



/* global evident p5/5 */

.bsbb{box-sizing:border-box}

.w33p{width:33.33%}
.w50p{width:50%}
.w100p{width:100%}
.w100p-20{width:calc(100% - 2em)}

.ma{margin:auto}
.m0{margin:0}
.mini_m{margin:.32rem .5rem}

.m_b4{margin-bottom:.4em}
.m_t10{margin-top:1em}
.m_b10{margin-bottom:1em}
.m_t20{margin-top:2em}
.m_b20{margin-bottom:2em}
.m_t25p{margin-top:25%}
.ml4{margin-left:.4em}

.pd_10{padding:1rem}
.pd_1{padding:.1rem}

.pd_t5{padding-top:.5rem}

.pd_t10{padding-top:1rem}
.pd_l10{padding-left:1rem}
.pd_b10{padding-bottom:1rem}

.pd_t20{padding-top:2rem}
.pd_b20{padding-bottom:2rem}

.pd_t30{padding-top:3rem}
.pd_b30{padding-bottom:3rem}

.pd_t40{padding-top:4rem}

.pd_t60{padding-top:6rem}

.zindex2{z-index:2}

.abs100{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}

.before_abscontent:before {
	content:'';
	position:absolute;
	top:0;
	bottom:0;
	right:0;
	left:0;
}

.after_abscontent:after {
	content:'';
	position:absolute;
	top:0;
	bottom:0;
	right:0;
	left:0;
}

.tac,
.navbar_liste li,
.carde_title,
.carde_tarif{text-align:center}

.hidden{display:none}

.opa025{opacity:0.25}

.flex{display:flex}

.flex_center{display:flex;justify-content:center}

.flex_y_center{display:flex;align-items:center}

.flex_between{display:flex;justify-content:space-between}

.flex_spaced{display:flex;justify-content:space-evenly}

.flex_around{display:flex;justify-content:space-around}

.flex_rowwrap{display:flex;flex-flow:row wrap}

.flex_wrap{display:flex;flex-wrap:wrap}



.back_sombre{background:rgba(24,24,24,0.92)}

.bold{font-weight:bold}
.shado_000{text-shadow:1px 1px 8px #000}
.shado_820{text-shadow:1px 1px 4px #820}
.shado_000_more{text-shadow:1px 1px 6px #000,1px 1px 6px #000}
.fs_40{font-size:4rem}
.cf00, .darkmode input[type="text"].cf00{color:#f00}
.darkmode .btn.wred{color:hsl(0,100%,65%);}
.darkmode .btn.wred:hover{color:hsl(0,100%,80%);}
/*box-shadow: inset 0px 0px 4px 1px #f20;*/
.back_vert_sombre{ background:hsla(115,100%,50%,15%); }
.back_bleu_sombre{ background:hsla(195,100%,50%,14%); }
.back_orange_sombre{ background:hsla(25,100%,50%,17%); }



.white{color:#fff}
.darkmode .white{color:#ddd}

.trans_lum_75{filter:brightness(0.75)}

.hover_lum_100:hover img.hover_lum_100{filter:brightness(1)}

.hover_cur{cursor:pointer}

.abs_bottom{position:absolute; bottom:0}

.br2{border-radius:2px}



.div_maintenance{background-color:#904000;display:table;margin:auto;padding:1rem 2rem 3rem;border-radius:4px;}
.div_maintenance:before, .div_maintenance:after{content:'';z-index:-1;position:absolute;left:8px;bottom:12px;width:60%;height:60%;
box-shadow:0 1rem 12px #0008;transform:skew(-12deg) rotate(-6deg);}
.div_maintenance:after{left:auto;right:8px;transform:skew(12deg) rotate(6deg);}































/* style2.css */

/*elems*/
body.darkmode header ul li{border:2px solid #444;}

header{margin-bottom:2rem}
header ul{margin:0;padding:0} 
header ul li{list-style-type:none;border:2px solid #aaa;padding:.8rem 1.5rem;border-radius:7px;cursor:pointer}

header.navbar ul{list-style:none}
header.navbar a{line-height:normal}
header.navbar h1{font-size:1rem}

h1,h2,h3,h4,h5,h6{ margin:0 }

main{max-width:1800px;margin:4rem auto 0 auto}
main input[type='text'],main input[type='number'],main input[type='password']{
	background:#333;color:#ddd;padding:.2rem .25rem;margin-bottom:.1rem;border:0;text-align:center;
    min-width:360px;width:calc(100% - 2rem);max-width:800px}
main code{word-break:break-all}
main textarea{background:#121;color:#bbb}
main button{background:#444;color:#ddd;padding:.4rem .8rem;border:1px solid #888;border-radius:3px;margin:0 1rem 0 0}
main.zone_all aside{padding:.5rem 0 .5rem 1rem}
body.header_mini .sys_form_co{margin-top:4em;}

footer{margin-top:3rem}

input[type='text'],input[type='number'],input[type='password']{background:#444;color:#ddd;padding:.2rem .25rem}
input[type='submit'],input[type='button']{filter:invert(1);}
input[type='submit']:focus,input[type='button']:focus{box-shadow:0 0 4px 2px #f8f;}


#bandeau{display:none;position:fixed;left:0;top:0;width:100%;min-height:20px;background:#f90;z-index:9;border-radius:8px;color:#000;}
#bandeau_message{padding:8px 0 9px 12px;border:4px solid #000;border-radius:5px;text-shadow:0 0 1px #000;}
.bandeau_fermer{z-index:9;color:#f00;position:absolute;right:12px;top:6px;cursor:pointer;}


/*class*/
.flex_wrap{display:flex;flex-wrap:wrap;}
.justif_y_center{align-items:center;}
.mb6{margin-bottom:.6rem;}
.mt-80{margin-top:8rem;}
.h3{margin:0;font-size:1rem;}
.mh30{min-height:3em;}
.w100-100{width:calc(100% - 10em);}

.clipboard_success:before{position:absolute;left:0;top:0;content:"copié";color:#fff;background:#080;padding:0 .12rem;opacity:0.6}

.conteneur{margin:1rem}

.firstinput, input.firstinput{background:#555;margin-bottom:.4rem}

.back_vert, input.back_vert{background:#151}
.back_orange{background:#d70}
.back_rouge{background:#d11}
.back_noir{background:#222}

.c_orange{color:#d70}
.c_rouge{color:#d11}

.histos_depliabl{max-height:200px;overflow:auto}

/*id*/
#txt1{padding:0 1rem}
#ico_error{width:9rem;line-height:2rem;color:#ddd;text-align:center}
