.Formulaire{display: grid;grid-template-columns: repeat(auto-fit,minmax(0,250px));grid-gap: 10px;grid-row-gap:15px;padding-left: 0;padding-right: 0;width: fit-content;min-width: 225px;margin: 0 auto}
.Formulaire .Cellule{display:grid;grid-template-columns:1fr;position:relative}
.Formulaire .Cellule label{position:absolute;top:10px;left:6px;background:white;color:grey;cursor:text;transition:top .5s}
.Formulaire .Cellule input:not(:placeholder-shown) + label{top:-12px;color:black;background:lightgrey}
.Formulaire .Cellule input:not(:placeholder-shown) + label font{display:none}
.Formulaire .Cellule label font{display:inline;color:red}
.Formulaire .Cellule input{padding:10px;border:solid grey 1px}
.Formulaire .Cellule input:focus-visible{outline:none}
.Formulaire .Cellule input:focus + label{top:-12px;color:black;background:lightgrey}
.Formulaire .Cellule input:focus + label font{display:none}
.Formulaire .Cellule textarea:not(:placeholder-shown) + label{top:-12px;color:black;background:lightgrey}
.Formulaire .Cellule textarea:not(:placeholder-shown) + label font{display:none}
.Formulaire .Cellule textarea{padding:5px;border:solid grey 1px;resize:none;width:100%;height:100px}
.Formulaire .Cellule textarea:focus-visible{outline:none}
.Formulaire .Cellule textarea:focus + label{top:-12px;color:black}
.Formulaire .Cellule textarea:focus + label font{display:none}
.Formulaire .picture,.picture{background-color:white;border-radius:25px;box-shadow:0 0 15px rgba(0,0,0,.1);background-image:url('/images/productImage.png');background-size:100% 100%;border:solid lightgrey 1px;grid-row:1/4;width:100px;height:100px;padding-top:15px}
.Formulaire .Footer{display:grid;grid-column:1/-1;grid-template-columns:auto 1fr auto;grid-gap:0;border:none;border-top:solid lightgrey 1px;padding:7px}
.Formulaire .Footer button{cursor:pointer;width:100px;border:none}
.Formulaire .Rejector{color:#fb1d1d;background:transparent;grid-column:2}
.Formulaire .Resolver{background:green;color:white;grid-column:3}
.Formulaire .Resolver:hover{background:darkgreen}
.Formulaire select{max-width:250px;width:250px}
.Formulaire input,.Formulaire select,.Formulaire button{padding:10px;max-width:250px;background:white}
.inputer{
        display:grid;
        grid-template-columns:auto auto;
}
.prodName{
    width:110px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.verticaList{list-style-type:none;padding:0;margin:0}
.verticaList > li{display:inline;vertical-align:middle}
.picture{border:solid lightgrey 1px;cursor:pointer;}
.jsql_btn,.jsql_btn *{cursor:pointer}
.jsql_btn *{display:inline-block;vertical-align:middle}
.jsql_btn img,.jsql_btn svg{width:20px;height:20px;margin-right:5px}
.jsql_btn:hover{filter:brightness(.75)}
.jsql_btn:active,.activBtn{filter:brightness(1.75)}
.ClientGrid{display:grid;grid-template-columns:repeat(auto-fit, minmax(250px, 300px));grid-gap:20px;padding:5px}
.ClientGrid > div{background:white;padding:0;margin:0;box-shadow:0 0 5px black;cursor:pointer;transition:background .5s}
.ClientGrid > div:hover{background:darkcyan}
.ClientGrid > div:active{box-shadow:0 0 0 black}
.link{color:blue;cursor:pointer;text-align:center;vertical-align:bottom}
.link:hover{text-decoration:underline;color:cyan}
.EntityHead{background:#024242;color:lightblue;vertical-align:middle}
.EntityHead input[type="image"]{float:right}
.vmenu{width:0px;vertical-align:top;overflow-x:hidden;transition:width 2s}
span b{float:right}
.monnaie{float:right;width:fit-content}
.vmenu button{width:300px;height:50px;text-align:left}
input[type='image']{width:25px;height:25px}
figure>img{border-radius:50%;width:100px;height:100px;box-shadow:5px 5px 10px black}
#Image_Content td{vertical-align:top}
.AlbumImage{margin:0}
.AlbumImage>img{border-radius:0;width:120px;height:120px}
.EvalContent{background:linear-gradient(to bottom,rgba(255,255,255,.5),transparent);box-shadow:5px 5px 15px black;border:solid white 1px;margin-left:5%;width:900px;text-indent:15px;text-align:justify;margin-top:5px}
.etiquette{background:linear-gradient(to bottom,darkblue,cyan);box-shadow:5px 5px 10px black;border-radius:10px;padding:10px;width:fit-content}
.Footer:not(.Formulaire .Footer){text-align:right;position:sticky;bottom:0;padding:5px;background:linear-gradient(to top,#00AAAA,#4082e6)}
.Header{text-align:center;color:white;position:sticky;top:0;padding:5px;background:linear-gradient(to bottom,#00AAAA,#4082e6)}
.multiprops td{vertical-align:top}
.Output{width:100%;height:440px;overflow-y:auto}
.Integraler{vertical-align:top;margin-top:-2px}
.Integraler th{position:sticky;background:linear-gradient(to left,#00AAAA,#4082e6);padding:15px;border:none;border-radius:0 0 15px 15px;font-size:15px;color:lightblue;top:0}
.Container{background:rgba(27,187,104,.5);box-shadow:2px 2px 5px rgb(0,0,0);width:100%;height:100%}
.alertPanel{position:absolute;padding:5px;border-radius:5px;box-shadow:2px 2px 5px rgb(0,0,0);background:lightgrey;padding:0}
.alertPanel p{width:95%;margin:0;text-indent:20px;line-height:20px;text-align:justify;padding:10px}
.alertPanel option{color:black;font-family:ui-system}
.alertPanel optgroup{color:#4082e6;font-family:ui-system}
.alertPanel input[type=tel]:not(.Formulaire input),
.alertPanel input[type=text]:not(.Formulaire input,span input),
.alertPanel input[type=email]:not(.Formulaire input),
.alertPanel select:not(.Formulaire select),
.alertPanel input[type="date"]:not(.Formulaire input),
.alertPanel input[type="number"]:not(.Formulaire input){width:100%;border:solid #024242 1px;color:#024242;padding:5px 0 5px 0;background:transparent;text-align:center}
.alertPanel input[type="date"]{margin-left:5px;width:194px}
.alertPanel input:disabled{border:solid red 1px;color:red}
.alertPanel table[class='Integraler']{border-collapse:collapse;width:100%}
.alertPanel th,.alertPanel tfoot td{text-align: center;border: none;padding: 5px;font-size: 18px;border-bottom: solid lightgrey 1px;}
.alertPanel tfoot td{
  border:none;
}
.alertPanel input[type=button],
.alertPanel button[name<>"isiButton"]{color:white;background:linear-gradient(to bottom,rgba(255,255,255,.5),transparent);border:solid white 1px;padding:5px}
input[type="password"],span input{
  padding:7px;
  font-size: 18px;
}
.alertPanel input[type=button],
.alertPanel button[name<>"isiButton"]{color:white;background:linear-gradient(to bottom,rgba(255,255,255,.5),transparent);border:solid white 1px;padding:5px}
.alertPanel fieldset legend:not(.resolved legend,.rejected legend){color:#4082e6;border:solid #4082e6 1px;border-radius:5px;padding:5px;}
#marcs{display:grid;grid-template-columns:repeat(2,auto);grid-gap:5px;width:fit-content}
.remarque{background:white;padding:15px;box-shadow:0 0 5px black;display:grid;grid-template-rows:1fr auto}
    .remarque p{
    	text-indent:15px;
        text-align:justify;
        font-family:"Times new Romman";
        margin-top:5px;
        margin-bottom:5px;

    }
    .remarque span{
        text-align:right;
        border-top:solid #4082e6 1px;
    }
.relContent{
	width:100%;
}
.relContent th{
	border:solid white 1px;
	color:white;
}
.relContent tbody tr:nth-child(odd){
	background:darkblue;
	box-shadow: 2px 2px 5px black;
}
.relContent thead tr{
	background:none;
}
fieldset{
	border:solid #4082e6 1px;
}
#Publication_Content fieldset{
    margin:0;
    padding:0;
    margin-bottom:-2px;
    border:none;
}
#Publication_Content {
    height:100%;
}
#Publication_Content table{
    height:100%;
}
.pub{
    display:grid;
    grid-template-columns:1fr;
    grid-gap:5px;
    margin-left:25px;
}
.pub *{
    width:100%;
}
#imgsVideos{
    display:grid;
    grid-template-columns:repeat(3,auto);
    grid-gap:5px;
    width:100%;
}
#imgsVideos *{
    width:100%;
}
fieldset legend{
	border:none;
}
.ISInput {
	margin-right:0px;
	margin-bottom:-4px;
	margin-left:-1px;
}
.ISIList{
	background:white;
	box-shadow:0px 0px 5px black;
    overflow-y:auto;
    position:absolute;
	height:150px;
	transition-duration:.5s;
	transition-property:height;
	z-index:10;
}
.ISIList button,.List button{
	width:100%;
	background:transparent;
	border: solid transparent 1px;
	color:black;
	font-family:ui-system;
	text-align:left;
}
.ISIList button:hover,.List button:hover{
	background:lightgreen;
    color:black;
}
.SearchButton{
	color:white;
	background:linear-gradient(to bottom,rgba(255,255,255,.5),transparent);
	border:solid white 1px;
	padding:5px;
}
.alertPanel table{border-collapse:collapse;}
.alertPanel input[type=button],
.alertPanel button[name<>"isiButton"]{color:white;background:linear-gradient(to bottom,rgba(255,255,255,.5),transparent);border:solid white 1px;padding:5px}
#Container button[name<>"isiButton"],
.disactivedItem{padding:15px;border:solid white 1px;color:white;border-radius:0px 15px 15px 0px;margin-bottom:5px;transition-property:background;transition-duration:.5s}
.vm{padding:0;margin:0;list-style-type:none}
.vm li{vertical-align:middle;display:inline-block}
.activedItem,.disactivedItem:hover{padding:15px;margin-bottom:5px;border-radius:0px 15px 15px 0px;color:black;border:solid white 1px;background:linear-gradient(to bottom,white,transparent)}
.content thead{position:sticky;top:0}
.content tr[name="BRLine"]:hover td{
  color:darkcyan;
  cursor:pointer;
}
.content img{width:150px;height:150px;border-radius:50%;box-shadow:0px 0px 10px black}
.content th{width:fit-content;padding:7px;text-align:center;vertical-align:middle;border:none;border-bottom:solid lightgrey 1px;border-top:solid lightgrey 1px}
.content tfoot td{border-top:solid lightgrey 1px;position:sticky;bottom:0;text-align:left;background:linear-gradient(to bottom,#00AAAA,#4082e6)}
.content{width:100%;border-collapse:collapse}
.content td{padding:5px;text-align:left;vertical-align:middle;color:black;border-bottom:solid lightgrey 1px;font-family:system-ui}
.content ul,.content ol{margin:inherit}
.content li{text-align:left}
.content thead{position:sticky;top:-1px;background:white}
.List{position:absolute;background:linear-gradient(to left,#00AAAA,#4082e6);box-shadow:2px 2px 5px rgb(0,0,0);width:150px;height:200px;overflow-y:auto;z-index:4}
.List:hover{z-index:5}
body > table{width:100%;height:100%;bottom:0;border-collapse:collapse}
.itemActive{background:#4082e6;color:lightblue;padding:8px;border-bottom:solid lightblue 2px}
.menu{text-align:center;background:linear-gradient(to left,#00AAAA,#4082e6)}
.smc{height:0px;transition:.5s;background:darkcyan;box-shadow:2px 2px 5px rgb(0,0,0);overflow-y:hidden;z-index:10;overflow:hidden}
.smc input[type="button"],.menu input[type="button"]{background:none;border:none;padding:10px;transition-property:color;transition-duration:.5s}
.smc input[type="button"]:hover,.menu input[type="button"]:hover{padding:8px;color:lightblue;border-bottom:solid lightblue 2px}
.smc input[type = "button"]{background:rgba(0,0,0,.5)}
.menu input[type = "button"]{font-weight:bold}
#FsL{display:grid;grid-template-columns:repeat(4,auto);grid-gap:5px;width:fit-content}
#FsL > div{display:grid;grid-template-columns:1fr;grid-template-rows: auto 1fr;padding:10px;background:white;box-shadow:0 0 5px black;width:fit-content;text-align:left}
#FsL nav{padding:10px;background:#4082e6;margin:-10px;margin-bottom:0}
._optionPanel{display:grid;grid-template-columns:1fr auto 1fr;width:160px;padding:5px;background:white;overflow-y:hidden;transition:height 1s}
._optionPanel input,._optionPanel button{padding:10px}
.TransferForm{display:grid;grid-template-columns:repeat(2,auto);grid-column-gap:10px;grid-row-gap:5px;padding:10px;width:fit-content;background:white;color:blue}
.TransferForm input,.TransferForm button{padding:5px}
.TransferForm button{cursor:pointer}
.InBtn,.OutBtn{background:transparent;border:none;width:100px;cursor:pointer}
.OutBtn{border-radius:0 7px 7px 0;color:#fb1d1d}
.OutBtn:hover,.OutBtnActive{background:#fb1d1d;color:white}
.InBtn{border-radius:7px 0 0 7px;color:#247024}
.InBtn:hover,.InBtnActive{background:#247024;color:white}
.ConfirmBtn{background:#4082e6;color:white;border:solid #4082e6 1px}
.ConfirmBtn:hover{background:#3f51b5;border:solid #3f51b5 1px}
.stopBtn{background:transparent;color:black;border:solid transparent 1px}
.delBtn{background:#fb1d1d;color:yellow;padding:2px;border-radius:50%}
.horizontalGrid{display:grid;grid-template-columns:1fr;grid-gap:5px;width:fit-content}
.FormContent{display:grid;grid-template-columns:repeat(2,1fr);grid-gap:5px;}.FormHeader,.FormFooter{grid-column-start:1;grid-column-end:3}.FormHeader{grid-row-start:1}.FormFooter{grid-row-start:6}.FormContent button{float:right}.FormContent label{color:#4082e6}.FormContent input{width:192px}.FormContent select{width:202px}.FormContent div{padding:5px;transition:background .5s,box-shadow .5s}
.EtatStock{width:100%;border-collapse: collapse}.EtatStock th{background:#525a65;color:white;font-weight: bold;position:sticky;top:0}
.EtatStock .headSummary{position:sticky;top:21px}
.EtatStock summary{background:#f8f9fc;color:#4e73df;border:solid #e3e6f0 1px}
.varsList{display:grid;grid-template-columns:repeat(2,1fr);grid-gap:5px;padding:5px}
.varsList > div{display:grid;grid-template-rows:auto 1fr;grid-template-columns:auto 1fr;grid-gap:5px;padding:5px;width:calc(100% - 10px);transition:background 1s,box-shadow 1s;cursor:pointer}
.varsList > div:hover{background:lightgrey;box-shadow:0 0 5px black}
.varsList > div:active{transition:box-shadow 0s;box-shadow:0 0 0 black}
.prodLister{
        width:100%;
        border-collapse:collapse;
      }
      .prodLister th,.prodLister td{
        text-align:center;
        padding:5px;
      }
      .prodLister tr *:nth-child(1){
        text-align:left;
      }
      .prodLister tr *:nth-last-child(1){
        text-align:right;
      }
      .prodLister tr{
        border-bottom:solid grey 1px
      }
      .PaiementInfo tr th:nth-child(1){
        text-align:left;
        width:130px;
      }
      .PaiementInfo tr td:nth-last-child(1){
        text-align:right;
        min-width:200px;
      }
.clickedCell{
    cursor:pointer;
}
.clickedCell:hover{
    color:darkcyan;
}
.CategorieForm{
  display:grid;
  grid-template-columns:auto 1fr;
  grid-gap:10px;
  padding:10px;
}
#imgE{
  display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 1fr auto;
    width: 200px;
    height: 200px;
}
.CategorieForm #info{
  display:grid;
  grid-template-columns: 1fr;
  grid-gap:10px;
}
.CategorieForm .diver{
  box-shadow:0 0 5px black;
}
.grider{
  display:grid;
  grid-template-columns:auto 1fr;
  grid-template-rows:auto 1fr auto;
  grid-gap:5px;
  padding:5px;
}
.profiler{
  display:grid;
  grid-template-columns:1fr auto 1fr auto;
  grid-gap:5px;
  padding:5px
}
.profiler > h4,.profiler2 > h4{
  grid-column:1/-1;
  margin-bottom:5px;
  margin-top:5px
}
.profiler2{
  grid-column:1/-1;
  width:calc(100% - 10px);
  border-top:solid lightgrey 1px;
  display:grid;
  grid-template-columns:1fr auto 1fr auto;
  grid-gap:5px;
  padding:5px
}
.profiler .editorLauncher,.profiler2 .editorLauncher{}
.profiler .hpoints,.profiler .labels,.profiler2 .hpoints,.profiler2 .labels{
  padding-top:5px;
  text-align:left;
}
.profiler #setPassword{
  grid-column:3/-1;
  padding-top:5px
}
.hoverShow {position: relative;border: solid black 1px;margin: 50px;z-index: 1;background: darkcyan;color: white;border-radius: 7px;box-shadow: 0 0 5px black;display: inline-flex;flex-direction: column;}
.hoverShow::before {content: '';position: absolute;top: 20px;left: -15px;z-index: 2;border: solid black 1px;width: 25px;height: 25px;transform: rotateZ(45deg);background: inherit;border-top: none;border-right: none;border-radius: 0 0 0 10px;box-shadow: 0 0 5px black;}
.hoverShow > div {background: inherit;z-index: 3;padding: 7px;padding-left: 17px;border-radius: inherit;width: fit-content;height: fit-content;box-sizing: border-box;}
@media (max-width:414px){
  .profiler .labels,.profiler2 .labels{
    grid-column:1/-1;
  }
  .profiler .hpoints,.profiler2 .hpoints,.profiler #setPasswordLabel{
    display: none
  }
  .profiler .editorLauncher,.profiler2 .editorLauncher{
    grid-column:-2/-1
  }
  .profiler #setPassword{
    grid-column:1/-1;
  }
}
