:root {

    color-scheme: light;
    --noir: #333;
    --black: #000;
    --blanc: #fff;
    --gris: #999;
    --red: #d3755f;
    --red_pal: #f1d4cd;
    --red_pal2: #f9eeeb;
    --orange: var(--red);
    --orange_pal: var(--red_pal);
    --defaultColor: #3b0cb1;
    --claire: #1c99ff;
    --claire2: #50A7FF;
    --blue: var(--defaultColor);
    --mauve: var(--defaultColor);
    --blue_pal: #f0ecf9;
    --vert: #8fb77e;
    --vert2: #44be14;
    --iframeColorText: inherit;

    --bgColor: #e6e2f0;
    --bgColor_opac: #f7f6fb;
    --bgColor_opac2: #f7f5f9;
    --bgColor2: #f8f8fc;
    --bgColor3: #1e0f691a;
    --bgColor3_pal: #e5e3ee;
    --selected0: #1e0f6908;
    --selected: #1e0f691f;
    --selected_pal: #1e0f690f;
    --selected_opac: #e4e2ed;
    --selected_opac2: #f2f1f6;
    --selected2: #1e0f6955;
    --bkMauve: #3b0cb126;
    --mauveButton: #1e0f6955;
    --mauveButton_opac: #b4afcd;
    --trait: #dedfe2;
    --radius: 15px;
    --radius2: 20px;
    --radiusButton: 5px;
    --shadow: 1px 1px 7px -2px #bfbfbf;
    --shadow2: 1px 1px 6px #00000012;

    --Draft: #75b0c2;
    --Won: #87c570;
    --Closed: #999;
    --Active: var(--blue);
    --widthScrolBarre: 8px;
    --paddingWithInput: 0.75em;
    --paddingWithButton: 15px;
    --marginWithButton: 5px;

    --widtslideTransitionTime: 0.25s;
    --transition: all ease-in-out var(--widtslideTransitionTime);
    --transitionL: all ease-in-out 0.6s;
    --transitionLL: all ease-in-out 1s;
    --transitionLLL: all ease-in-out 2s;
    --compensationGap: calc((2 * var(--paddingWithInput)));
    --compensationGapWithBorder: calc(2px + (2 * var(--paddingWithInput)));
    --typeBorder: solid;
}

.move,
.grab,
.drag {
    cursor: move;
}


.nocursor {
    cursor: default !important;
}


.fixed {
    position: fixed;
}

button.shadow {
    box-shadow: 3px 3px 8px 2px #ddd;
}

button.shadow2 {
    box-shadow: 3px 3px 8px 2px #2a282f6b;
}

.defaultColor {
    color: var(--defaultColor);
}

a {
    text-decoration: none;
    color: var(--blue);
}

a:hover {
    text-decoration: underline;
    color: var(--defaultColor);
}

a:hover span.material-icons,
a:hover span.material-symbols-outlined {}

.underline {
    text-decoration: underline;
}

.pointer .underline,
.pointer.underline {
    text-decoration: none;
}

.pointer:hover .underline,
.pointer.underline:hover,
.hoverUnderline:hover {
    text-decoration: underline;
}



.backgroundBlue {
    background-color: var(--defaultColor) !important;
    color: #fff;
}

.bgColor_opac {
    background-color: var(--bgColor_opac);
}

.bgColor2 {
    background-color: var(--bgColor2);
}

.bgColor3 {
    background-color: var(--bgColor3);
}

.bgColor {
    background-color: var(--bgColor);
}

.bgMauve,
.bgColorMauve {
    background-color: var(--bkMauve);
}

.opa1 {
    opacity: 0.8;
}

.opa2 {
    opacity: 0.5;
}

.opa3 {
    opacity: 0.2;
}

.opa4 {
    opacity: 0.1;
}



.selected {
    background-color: var(--bgColor);
}

.noir {
    color: var(--noir);
}

.black {
    color: var(--black);
}

.dashed {
    --typeBorder: dashed;
}

.borderLeft {
    border-left: 1px var(--typeBorder) var(--bgColor);
}

.borderRight {
    border-right: 1px var(--typeBorder) var(--bgColor);
}

.borderBottom {
    border-bottom: 1px var(--typeBorder) var(--bgColor);
}

.borderTop {
    border-top: 1px var(--typeBorder) var(--bgColor);
}

.borderTop2 {
    border-top: 1px var(--typeBorder) var(--defaultColor);
}

.border {
    border: 1px var(--typeBorder) var(--bgColor);
}


.vert {
    color: var(--vert);
}

.vert2 {
    color: #44be14;
}



.jaune {
    color: rgb(255, 238, 0);
}

.blanc {
    color: #fff;
}

.blue_graitec,
.marine {
    color: var(--defaultColor);
}

.blue {
    color: var(--blue);
}

.blue_ {
    color: var(--blue) !important;
}

.claire,
.ciel {
    color: var(--claire);
}

/*****************************COLOR*****************************************/
.moins {
    color: #777;
}

.grise {
    color: #999;
}

.grise2 {
    color: #bbb;
}

.grisé {
    background: transparent url('../img/off.png') 0 0 repeat;
}

.prune {
    color: #FF7F55;
}

.violet {
    color: #6D4BEA;
}

.blanc {
    color: #fff;
}

.orange {
    color: var(--orange)
}


.fonce {

    color: #535b69;
}

.bordeau {
    color: #701415;
}

.bronze {
    color: #963b16;
}

.red,
.rouge {
    color: var(--red);
}

.rose {
    color: #FF77B0;
}

.mauve {
    color: #9585dc;
}

.jaune {
    color: #c7a424;
}

.jaune2 {
    color: #efd103;
}



.maron {
    color: #8f6d32;
}


.border-shadow,
.borderShadow {
    box-shadow: 0 0 0px 7px #3b3b3b20;
}

.border-shadow2,
.borderShadow2 {
    box-shadow: 0 0 0px 7px #3b3b3b0b;
}

.border-shadow3,
.borderShadow3 {
    box-shadow: 0 0 0px 5px #3b3b3b09;
}

.border-shadow_declage,
.borderShadowDecalage {
    box-shadow: 5px 4px 0px 0px #3b3b3b17;
}

.border-shadowBleu,
.borderShadowBleu {
    box-shadow: 0 0 0px 7px #c1c1c15c;
}

.border-shadowBlanc,
.borderShadowBlanc {
    box-shadow: 0 0 0px 7px #ffffff5c;
}


.flex.important {
    display: flex !important;
}


.flex {
    gap: 3px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.flex.inline {
    display: inline-flex !important;
}

.flex.between {
    justify-content: space-between !important;
}

.flex.break {
    flex-wrap: wrap;
}


.flex.inline {
    display: inline-flex;
}



.flex.left {
    justify-content: flex-start;
    /* align-items: flex-start; */
}



.flex.vertical > * {
    width: 100%;
}


.flex.middle {
    align-items: center;
    justify-content: center;
}


.flex.top {
    align-items: start;
}


.flex.bottom {
    align-items: end;
}

.flex.vertical.top {
    justify-content: flex-start;
}

.flex.vertical.bottom {
    justify-content: flex-end;
    align-items: inherit;
}


.flex.right {
    justify-content: flex-end;
}

.flex.right.all {
    align-items: end;
}

.flex.end {
    display: flex;
    justify-content: flex-end;
}

.flex.start {
    display: flex;
    justify-content: flex-start;
}

.flex1 {
    flex: 1;
}

.flex.center > * {
    gap: 4px;
}

.flex.center.proche > * {
    gap: 2px;
}

.flex.vertical {
    flex-direction: column;
}

.flex.gap0 {
    gap: 0px !important;
}

.flex.gap2 {
    gap: 2.5px !important;
}

.flex.gap5 {
    gap: 5px !important;
}

.flex.gap10 {
    gap: 10px !important;
}


.flex.gap15 {
    gap: 15px !important;
}

.flex.gap20 {
    gap: 20px !important;
}

.flex.gap30 {
    gap: 30px !important;
}

.flex.gap40 {
    gap: 40px !important;
}

.flex.gap50 {
    gap: 50px !important;
}

.flex.gap60 {
    gap: 60px !important;
}

.flex.gap70 {
    gap: 70px !important;
}

.flex.gap80 {
    gap: 80px !important;
}

.flex.gap90 {
    gap: 90px !important;
}

.flex.gap100 {
    gap: 100px !important;
}


.flex.vertical.right {
    flex-direction: column;
    align-items: end !important;
}

.flex.etire {
    height: 100%;
    display: flex !important;
    align-items: stretch !important;
}

.flex.vertical.etire {
    justify-content: space-between !important;
}

.flex.vertical.left {
    align-items: flex-start;
}

.flex.vertical.reverse,
.flex.vertical.inverse {

    flex-direction: column-reverse;
}

.none {
    display: none !important;
}

.center {
    text-align: center;
    justify-content: center;
    margin: 0 auto;
}

.right {
    text-align: right !important;
    justify-content: right;
}

.right0 {
    text-align: right !important;
    justify-content: right;
    padding-right: 0 !important;
}


.auto {
    margin-right: auto;
    margin-left: auto;
}



.float_right {
    float: right;
}



.left {
    text-align: left !important;
    justify-content: flex-start;
}


.min {
    text-transform: lowercase;
}

.maj {
    text-transform: uppercase;
}

.radius {
    border-radius: var(--radius);
}

.radiusTop {
    border-top-left-radius: var(--radius);
    border-top-right-radius: var(--radius);
}

.radiusBottom {
    border-bottom-left-radius: var(--radius);
    border-bottom-right-radius: var(--radius);
}

.radiusButton {
    border-radius: var(--radiusButton) !important;
}

.radiusButtonTop {
    border-top-left-radius: var(--radiusButton);
    border-top-right-radius: var(--radiusButton);
}

.radiusButtonBottom {
    border-bottom-left-radius: var(--radiusButton);
    border-bottom-right-radius: var(--radiusButton);
}



.first {
    text-transform: capitalize;
}


.xxsmall {
    font-size: 0.45em !important;
}

.xsmall {
    font-size: 0.6em !important;
}

.small {
    font-size: 0.75em !important;
}

.xxnormal {
    font-size: 0.789em !important;
}

.xnormal {
    font-size: 0.82em !important;
}

.normal {
    font-size: 0.9em !important;
}

.snormal {
    font-size: 1em !important;
}

.sbig {
    font-size: 1.2em !important;
}

.big {
    font-size: 1.5em !important;
}

.xbig {
    font-size: 2em !important;
}

.xxbig {
    font-size: 3em !important;
}

.xxsbig {
    font-size: 4.25em !important;
}

.xxxbig {
    font-size: 5em !important;
}




.gras {
    font-weight: 600 !important;
}

.sgras {
    font-weight: 700 !important;
}

.xgras,
.grasbig {
    font-weight: 900 !important;
}

.nogras,
.nobold {
    font-weight: 300 !important;
}

.italic {
    font-style: italic;
}


.transitionL {
    -webkit-transition: all ease-in-out 0.6s;
    -moz-transition: all ease-in-out 0.6s;
    -ms-transition: all ease-in-out 0.6s;
    -o-transition: all ease-in-out 0.6s;
    transition: all ease-in-out 0.6s;
}


.transition {
    -webkit-transition: all ease-in-out 0.4s;
    -moz-transition: all ease-in-out 0.4s;
    -ms-transition: all ease-in-out 0.4s;
    -o-transition: all ease-in-out 0.4s;
    transition: all ease-in-out 0.4s;
}


.transitionS {
    -webkit-transition: all ease-in-out 0.22s;
    -moz-transition: all ease-in-out 0.22s;
    -ms-transition: all ease-in-out 0.22s;
    -o-transition: all ease-in-out 0.22s;
    transition: all ease-in-out 0.22s;
}

.transitionSo {
    -webkit-transition: all ease-out 0.22s;
    -moz-transition: all ease-out 0.22s;
    -ms-transition: all ease-out 0.22s;
    -o-transition: all ease-out 0.22s;
    transition: all ease-out 0.22s;
}




.margin0 {
    margin: 0px !important
}

.margin5 {
    margin: 5px
}

.margin10 {
    margin: 10px
}

.margin20 {
    margin: 20px
}

.margin30 {
    margin: 30px
}

.margin40 {
    margin: 40px
}

.margin50 {
    margin: 50px
}

.margin60 {
    margin: 60px
}


.marginTop0 {
    margin-top: 0px !important
}

.marginTop5 {
    margin-top: 5px
}

.marginTop10 {
    margin-top: 10px
}

.marginTop20 {
    margin-top: 20px
}

.marginTop30 {
    margin-top: 30px
}

.marginTop40 {
    margin-top: 40px
}

.marginTop50 {
    margin-top: 50px
}

.marginTop60 {
    margin-top: 60px
}

.marginBottom0 {
    margin-bottom: 0px !important
}

.marginBottom5 {
    margin-bottom: 5px
}

.marginBottom10 {
    margin-bottom: 10px
}

.marginBottom20 {
    margin-bottom: 20px
}

.marginBottom30 {
    margin-bottom: 30px
}

.marginBottom40 {
    margin-bottom: 40px
}

.marginBottom50 {
    margin-bottom: 50px
}

.marginBottom60 {
    margin-bottom: 60px
}

.marginRight0 {
    margin-Right: 0px !important
}

.marginRight5 {
    margin-Right: 5px
}

.marginRight10 {
    margin-Right: 10px
}

.marginRight20 {
    margin-Right: 20px
}

.marginRight30 {
    margin-Right: 30px
}

.marginRight40 {
    margin-Right: 40px
}

.marginRight50 {
    margin-Right: 50px
}

.marginRight60 {
    margin-Right: 60px
}


.marginLeft0 {
    margin-Left: 0px !important
}

.marginLeft5 {
    margin-Left: 5px
}

.marginLeft10 {
    margin-Left: 10px
}

.marginLeft20 {
    margin-Left: 20px
}

.marginLeft30 {
    margin-Left: 30px
}

.marginLeft40 {
    margin-Left: 40px
}

.marginLeft50 {
    margin-Left: 50px
}

.marginLeft60 {
    margin-Left: 60px
}





.marginWidth0 {
    margin-right: 0px !important;
    margin-left: 0px !important
}

.marginWidth5 {
    margin-right: 5px;
    margin-left: 5px;
}

.marginWidth10 {
    margin-right: 10px;
    margin-left: 10px;
}

.marginWidth20 {
    margin-right: 20px;
    margin-left: 20px;
}

.marginWidth30 {
    margin-right: 30px;
    margin-left: 30px;
}

.marginWidth40 {
    margin-right: 40px;
    margin-left: 40px;
}

.marginWidth50 {
    margin-right: 50px;
    margin-left: 50px;
}

.marginWidth60 {
    margin-right: 60px;
    margin-left: 60px;
}


.marginHeight0 {
    margin-bottom: 0px !important;
    margin-bottom: 0px !important;
}

.marginHeight5 {
    margin-bottom: 5px;
    margin-top: 5px;
}

.marginHeight10 {
    margin-bottom: 10px;
    margin-top: 10px;
}

.marginHeight20 {
    margin-bottom: 20px;
    margin-top: 20px;
}

.marginHeight30 {
    margin-bottom: 30px;
    margin-top: 30px;
}

.marginHeight40 {
    margin-bottom: 40px;
    margin-top: 40px;
}

.marginHeight50 {
    margin-bottom: 50px;
    margin-top: 50px;
}

.marginHeight60 {
    margin-bottom: 60px;
    margin-top: 60px;
}










.padding0 {
    padding: 0px !important;
}

.padding5 {
    padding: 5px
}

.padding10 {
    padding: 10px
}

.padding20 {
    padding: 20px
}

.padding30 {
    padding: 30px
}

.padding40 {
    padding: 40px
}


.paddingTop0 {
    padding-top: 0px !important;
}

.paddingTop5 {
    padding-top: 5px
}

.paddingTop10 {
    padding-top: 10px
}

.paddingTop20 {
    padding-top: 20px
}

.paddingTop30 {
    padding-top: 30px
}

.paddingTop40 {
    padding-top: 40px
}

.paddingTop50 {
    padding-top: 50px
}



.paddingBottom0 {
    padding-bottom: 0px !important;
}

.paddingBottom5 {
    padding-bottom: 5px
}

.paddingBottom10 {
    padding-bottom: 10px
}

.paddingBottom20 {
    padding-bottom: 20px
}

.paddingBottom30 {
    padding-bottom: 30px
}

.paddingBottom40 {
    padding-bottom: 40px
}

.paddingBottom50 {
    padding-bottom: 50px
}


.paddingRight0 {
    padding-right: 0px !important;
}

.paddingRight5 {
    padding-right: 5px
}

.paddingRight10 {
    padding-right: 10px
}

.paddingRight20 {
    padding-right: 20px
}

.paddingRight30 {
    padding-right: 30px
}

.paddingRight40 {
    padding-right: 40px
}

.paddingRight50 {
    padding-right: 50px
}

.paddingRight0 {
    padding-right: 0px !important;
}

.paddingRight5 {
    padding-right: 5px
}

.paddingRight10 {
    padding-right: 10px
}

.paddingRight20 {
    padding-right: 20px
}

.paddingRight30 {
    padding-right: 30px
}

.paddingRight40 {
    padding-right: 40px
}

.paddingRight50 {
    padding-right: 50px
}


.paddingWidth0 {
    padding-right: 0px !important;
    padding-left: 0px !important;
}

.paddingWidth5 {
    padding-right: 5px !important;
    padding-left: 5px !important;
}

.paddingWidth10 {
    padding-right: 10px !important;
    padding-left: 10px !important;
}

.paddingWidth20 {
    padding-right: 20px !important;
    padding-left: 20px !important;
}

.paddingWidth30 {
    padding-right: 30px !important;
    padding-left: 30px !important;
}

.paddingWidth40 {
    padding-right: 40px !important;
    padding-left: 40px !important;
}

.paddingWidth50 {
    padding-right: 50px !important;
    padding-left: 50px !important;
}



.paddingHeight0 {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}

.paddingHeight5 {
    padding-top: 5px;
    padding-bottom: 5px;
}

.paddingHeight10 {
    padding-top: 10px;
    padding-bottom: 10px;
}

.paddingHeight20 {
    padding-top: 20px;
    padding-bottom: 20px;
}

.paddingHeight30 {
    padding-top: 30px;
    padding-bottom: 30px;
}

.paddingHeight40 {
    padding-top: 40px;
    padding-bottom: 40px;
}

.paddingHeight50 {
    padding-top: 50px;
    padding-bottom: 50px;
}





img.opa,
.opa {
    opacity: 0.7;
}

img.opa2,
.opa2 {
    opacity: 0.5;
}

img.opa3,
.opa3 {
    opacity: 0.3;
}

img.opa4,
.opa4 {
    opacity: 0.1;
}


.overhide:hover .opa,
.overhide:hover .opa1,
.overhide:hover .opa2,
.overhide:hover .opa3,
.overhide:hover .opa4,
table tr.overhide:hover .hidden,
.overhide:hover .hidden,
table tr.overhide:hover .hidden {
    visibility: visible;
    opacity: 1;
}

button.hidden,
.button.hidden {
    -webkit-transition: unset;
    transition: unset;
}

.hidden {
    visibility: hidden;
}

.pointer {
    cursor: pointer;
}

.formfiledrjs:not(.color) {
    background-color: var(--bgColor2) !important;
}



.barre,
.bare {
    text-decoration: line-through;
}

.souligne {
    text-decoration: underline;
}

.childfull > *,
.full {
    width: 100%;
}

.width10 {
    width: 10%;
}

.width20 {
    width: 20%;
}

.width25 {
    width: 25%;
}

.width30 {
    width: 30%;
}

.width33 {
    width: 33%;
}

.width40 {
    width: 40%;
}

.width50 {
    width: 50%;
}

.width60 {
    width: 60%;
}

.width70 {
    width: 70%;
}

.width80 {
    width: 80%;
}

.width90 {
    width: 90%;
}

.width100 {
    width: 100%;
}


.width10i {
    width: 10% !important;
}

.width20i {
    width: 20% !important;
}

.width25i {
    width: 25% !important;
}

.width30i {
    width: 30% !important;
}

.width3i3 {
    width: 33% !important;
}

.width40i {
    width: 40% !important;
}

.width50i {
    width: 50% !important;
}

.width60 {
    width: 60% !important;
}

.width70i {
    width: 70% !important;
}

.width80i {
    width: 80% !important;
}

.width90i {
    width: 90% !important;
}

.width100i {
    width: 100% !important;
}



.height10 {
    height: 10%;
}

.height20 {
    height: 20%;
}

.height30 {
    height: 30%;
}

.height40 {
    height: 40%;
}

.height50 {
    height: 50%;
}

.height60 {
    height: 60%;
}

.height70 {
    height: 70%;
}

.height80 {
    height: 80%;
}

.height90 {
    height: 90%;
}

.height100 {
    height: 100%;
}


.height10i {
    height: 10% !important;
}

.height20i {
    height: 20% !important;
}

.height30i {
    height: 30% !important;
}

.height40i {
    height: 40% !important;
}

.height50i {
    height: 50% !important;
}

.height60i {
    height: 60% !important;
}

.height70i {
    height: 70% !important;
}

.height80i {
    height: 80% !important;
}

.height90i {
    height: 90% !important;
}

.height100i {
    height: 100% !important;
}


input,
select,
textarea,
button {

    font-family: "Lato", sans-serif;
    font-weight: 400;
    font-style: normal;
}


textarea.fu {
    width: calc(60% - var(--compensationGapWithBorder));
}

input.fu,
textarea.fu,
a.button.fu,
select.fu {
    width: calc(60% - var(--compensationGapWithBorder));
}

button.fu {
    width: calc(60% - (2 * var(--marginWithButton)));
}

input.ful,
textarea.ful,
a.button.ful {
    width: calc(90% - var(--compensationGapWithBorder));
}

textarea.ful {
    width: calc(95% - var(--compensationGapWithBorder));
}

select.fu {
    width: 60%;
}

select.ful {
    width: 90%;
}

button.ful {
    width: calc(90% - (2 * var(--marginWithButton)));
}



input.full,
textarea.full,
a.button.full {
    width: calc(100% - var(--compensationGapWithBorder));
}



input.fulll,
textarea.fulll,
a.button.fulll {
    width: calc(100% - var(--compensationGapWithBorder));
}

select.full select.fulll {
    width: 100%;
}

button.fulll,
button.full {
    width: calc(100% - (2 * var(--marginWithButton)));
    width: 100%;
}

textarea.fig {
    resize: none;
}

textarea.fig:focus {
    -webkit-transition: none;
    -moz-transition: none;
    -ms-transition: none;
    -o-transition: none;
    transition: none;
    box-shadow: none;
}



select.grand {
    min-height: 55px;
}

input.grand {
    min-height: 55px !important;
}


button.grand {
    height: 65px;
    max-height: 65px;
}



input:not(input[type="radio"], input[type="checkbox"], input[type="range"]),
select,
button {
    height: 20px;
    max-height: 20px;
    min-height: 20px;
}

input:not(input[type="radio"], input[type="checkbox"], input[type="range"]) {
    width: -webkit-fill-available;
    width: calc(100% - var(--compensationGapWithBorder));
    display: block;

}



select {
    height: 32px;
    max-height: 32px;
    min-height: 32px;
}

textarea.requis,
input.requis,
select.requis,
button.requis,
textarea.requismail,
input.requismail,
select.requismail,
button.requismail {
    border-right: 1px solid #ffb395 !important;
}

input:not(input[type="radio"], input[type="checkbox"], input[type="range"]),
select,
button {
    /* height: 35px;
    max-height: 35px; */
}

input:not(input[type="radio"], input[type="checkbox"], input[type="range"]).moyen {
    height: 35px;
    max-height: 35px;
    font-size: 1.1em;
}

button.moyen {
    height: 47px;
    max-height: 47px;
}

select.moyen {
    height: 47px;
    max-height: 47px;
    font-size: 1.1em;
}


textarea.moyen {
    min-height: 60px;
    font-size: 1.1em;
}

input,
select,
textarea {
    padding: 5px var(--paddingWithInput);
}


textarea.petit,
button.petit {
    padding: 5px var(--paddingWithInput);
}

textarea.moyen,
textarea.grand {
    padding: var(--paddingWithInput);
}

input.petit {
    max-height: 19px;
    padding: 2px var(--paddingWithInput);
}

textarea,
textarea.petit {
    min-height: 20px;
    height: 20px;
}

textarea.grand {
    height: 300px;
}

textarea.tresgrand {
    height: 500px;
}

.ck-editor .ck-editor__editable {
    resize: vertical;
    max-height: 50vh;
}

.ck-editor .ck-editor__editable.figEditor {
    max-height: 50;
}

textarea.petit + .ck-editor .ck-editor__editable {
    max-height: 80vh;
}

textarea.moyen + .ck-editor .ck-editor__editable {
    min-height: 200px;
}

textarea.grand + .ck-editor .ck-editor__editable {
    min-height: 300px;
}

textarea.tresgrand + .ck-editor .ck-editor__editable {
    min-height: 500px;
}


.transparent {
    background: transparent !important;
    background-color: transparent !important;
}

textarea.transparent {
    background: transparent !important;
    background-color: transparent !important;
}




.likeButton,
button,
.button {
    background: var(--blue);
    color: white;
    border-radius: var(--radiusButton);
    letter-spacing: .025em;
    text-decoration: none;
    -webkit-transition: all .15s ease;
    transition: all .15s ease;
    border: 0px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px var(--paddingWithButton);
    height: 32px;
    max-height: 32px;
    gap: 5px;
}


button.hidden,
.button.hidden {
    -webkit-transition: unset;
    transition: unset;
}


select optgroup {
    color: #aaa;
    font-style: italic;
    font-weight: normal;
}

select option {
    color: var(--blue);
    font-style: normal;
}


select,
textarea,
input:not(input[type="radio"], input[type="checkbox"], input[type="range"]),
.uneditable-input {
    margin: 0;
    font-size: 1em;
    border-width: 1px;
    border-style: solid;
    color: var(--blue);
    margin-right: 0px;
    vertical-align: middle;
    outline-style: none;
    accent-color: var(--defaultColor);
    background: #fff;
    border-color: var(--trait);
    border-radius: var(--radiusButton);
}

input[type="range"] {
    font-size: 1em;
    height: unset;
    max-height: unset;
    border-width: unset !important;
    border-style: unset !important;
    border-radius: unset !important;
    color: unset !important;
    margin-right: 0px !important;
    background: var(--bgColor3) !important;
    border-color: unset !important;
    padding: 0 !important;
}



select:hover,
input:hover,
textarea:hover {
    border-color: var(--defaultColor) !important;
    border-style: dashed;
}

select:focus,
select:focus-visible,
textarea:focus,
textarea:focus-visible,
input:focus,
input:focus-visible {

    border-style: solid;
    border-color: var(--defaultColor) !important;
}

input[type="radio"],
input[type="checkbox"],
.uneditable-input {
    color: var(--blue);
    accent-color: var(--blue);
}

input:not(input[type="radio"], input[type="checkbox"], input[type="range"]):hover {
    box-shadow: 0 0 5px 3px #3b3b3b15;
}

button:hover,
.button:hover {
    cursor: pointer;
    box-shadow: 0 0 0px 7px #3b3b3b20;
}

button:hover:after,
.button:hover:after {}

.likeButton:hover {
    cursor: default !important;
    box-shadow: unset !important;
}

.likeButton:hover,
button.blanc,
.button.blanc {
    background: #fff;
    color: var(--defaultColor);
    border: 1px solid var(--bgColor);
}

button.blanc.contour,
.button.blanc.contour {
    border: 1px solid #fff;
    box-shadow: unset;
    color: white;
}

button.blanc:hover,
.button.blanc:hover {
    color: #000;
}

button.blanc.contour:hover,
.button.blanc.contour:hover {
    color: white;
    border: 1px solid #fff;
}

button.blanc.ici {
    background: var(--defaultColor);
    color: white;
}



button.gris {
    background: #efeef4;
    border: 1px solid #e7e7e7;
    color: var(--noir);
}

button.gris:hover {
    background: #fff;
}

button.gris.ici {
    background: var(--defaultColor);
    color: white;
}



button.mauve,
.button.mauve {
    background: var(--mauveButton);
    color: var(--defaultColor);
}

button.mauve:hover,
.button.mauve:hover {
    background: var(--defaultColor);
    color: var(--blanc);
}


button.blue,
.button.blue {
    background: var(--blue);
    color: var(--blanc);
}

button.blue:hover,
.button.blue:hover {
    background: var(--blanc);
    color: var(--blue);
}


button.claire,
.button.claire {
    background: var(--claire);
    color: var(--blanc);
}

button.claire:hover,
.button.claire:hover {
    background: var(--blanc);
    color: var(--claire);
}



button.orange,
.button.orange {
    background: var(--orange);
    color: var(--blanc);
}

button.orange:hover,
.button.orange:hover {
    color: var(--blanc);
}

button.black,
.button.black {
    background: #424242;
    color: var(--blanc);
}

button.black:hover,
.button.black:hover {
    background: var(--blanc);
    color: var(--noir);
}



button.orange2,
.button.orange2 {

    box-shadow: 0 0 6px #000;
    background: linear-gradient(-1deg, var(--orange) -7%, #bd7300 18%, var(--orange) 64%);
    color: var(--blanc);
}

.vgrise button.orange2,
.vgrise .button.orange2 {
    box-shadow: 0 0 6px #0000005b;
}

button.orange2:hover,
.button.orange2:hover {
    background: var(--blanc);
    color: var(--blue);
}



button.transparent,
.button.transparent {
    background: transparent;
    border-width: 1px;
    border-style: solid;
    color: var(--defaultColor);
    border-color: transparent;
    box-shadow: unset;
}

button.transparent:hover,
.button.transparent:hover {
    border-color: var(--defaultColor);
}



button.contour,
.button.contour {
    background: transparent;
    border-width: 1px;
    border-style: solid;
    color: var(--defaultColor);
    border-color: var(--defaultColor);
    /* box-shadow: unset; */
}

.contour {
    background: transparent;
    border-radius: var(--radiusButton);
    padding: 8px 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-color: var(--trait);
}


button.red:hover,
.button.red:hover,
button.contour:hover,
.button.contour:hover {
    color: unset;
}

button.red,
.button.red,
button.orange.contour,
.button.orange.contour {
    border-color: var(--orange);
    color: var(--orange);
    background: #fff;
    border: 1px solid;
}


button.blue2:hover,
.button.blue2:hover {
    color: unset;
}

button.blue2,
.button.blue2 {
    border-color: var(--blue);
    color: var(--blue);
    background: #fff;
    border: 1px solid;
}








/*********switchToggle***************/

.switchToggle {
    position: relative;
    display: inline-block;
    --switchToggleZOOM: 20px;
    width: calc((var(--switchToggleZOOM)) * 2);
    height: var(--switchToggleZOOM);
}

.switchToggle.smoyen,
.switchToggle.moyen {
    --switchToggleZOOM: 25px;
}

.switchToggle.grand {
    --switchToggleZOOM: 40px;
}


.switchToggle input {
    opacity: 0;
    width: 0;
    height: 0;
    display: none;
}

.sliderToggle {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
}

.redInactif .sliderToggle {
    background-color: var(--orange);
}

.sliderToggle:before {
    position: absolute;
    content: "";
    --sliderToggleHeight: calc(var(--switchToggleZOOM));
    --sliderToggleMove: calc(var(--switchToggleZOOM));

    --equiteDistance: 6px;
    /* --equiteLeft: calc(var(--equiteDistance) - 2px); */
    --equiteLeft: 4px;
    --equiteBottom: calc(var(--equiteDistance) / 2);
    height: calc(var(--sliderToggleHeight) - var(--equiteDistance));
    width: calc(var(--sliderToggleHeight) - var(--equiteDistance));
    left: var(--equiteLeft);
    bottom: var(--equiteBottom);
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
}

input:checked + .sliderToggle {
    background-color: var(--defaultColor);
}

input:focus + .sliderToggle {
    box-shadow: 0 0 1px #2196F3;
}

input:checked + .sliderToggle:before {
    -webkit-transform: translateX(calc(var(--sliderToggleMove) - var(--equiteLeft)));
    -ms-transform: translateX(calc(var(--sliderToggleMove) - var(--equiteLeft)));
    transform: translateX(calc(var(--sliderToggleMove) - var(--equiteLeft)));
}

/* Rounded sliders */
.sliderToggle.round {
    border-radius: 34px;
}

.sliderToggle.round:before {
    border-radius: 50%;
}

/*********switchToggle***************/


.jrstyle div.div_bak div.div_table div.topmenu {
    font-size: 1.5rem;
    flex: unset;
    color: #999;
}

.jrstyle div.div_bak div.div_table div.topmenu.ici {
    color: var(--orange);
}

.justify {
    text-align: justify;
}

.parcourIcone {
    padding: 10px;
    min-height: 200px;
    width: 85%;
    margin-top: -20px;
}

.parcourIcone .icne {
    padding: 9px;
    border-radius: 50%;
    background: var(--defaultColor);
    color: #fff;
    font-size: 1.2em;
    display: flex;
    margin: 10px;
}

.parcourIcone .pointier {
    width: 100%;
    padding: 0px;
    border-bottom: 2px dotted var(--defaultColor);
}

.parcourIcone .details {
    position: absolute;
    margin-top: 43px;
    margin-left: -37px;
    width: 100px;
    font-size: 0.5em;
    color: var(--defaultColor);
    text-align: center;
}

.parcourIcone .details .gras {
    color: var(--defaultColor);
}


.overflow {
    overflow: auto;
    max-height: 300px
}

.overflow200 {
    overflow: auto;
    max-height: 200px
}

.overflow250 {
    overflow: auto;
    max-height: 250px
}

.overflow300 {
    overflow: auto;
    max-height: 300px
}

.overflow350 {
    overflow: auto;
    max-height: 350px
}

.overflow400 {
    overflow: auto;
    max-height: 400px
}

.overflow450 {
    overflow: auto;
    max-height: 450px
}

.overflow500 {
    overflow: auto;
    max-height: 500px
}

.nobreakline3,
.nobreakline2,
.nobreakline {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: hidden;
    line-height: initial;
}

.nobreakline2 {
    -webkit-line-clamp: 2;
}

.nobreakline3 {
    -webkit-line-clamp: 3;
}


.wordbreak {
    word-break: break-all;
}


.textblockok .texticonok,
.textblocknok .texticonnok {
    font-family: 'Material Symbols Outlined';
    font-weight: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
}

.textblockok .texticonok:before {
    content: 'done_outline';
    color: #75f36a;
    font-size: 20px;
}

.textblocknok .texticonnok:before {
    content: 'warning';
    color: var(--red);
    font-size: 20px;
}

.separeTraitTop {
    border-top: 1px solid var(--trait);
}

.separeTraitBottom {
    border-bottom: 1px solid var(--trait);
}

material-symbols-outlined,
button,
.unselect,
.unselected,
.unselectable {
    -webkit-user-select: none;
    -webkit-touch-callout: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}


.echoreult {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    gap: 10px;
}

.echoreult .material-symbols-outlined {
    font-size: 2em;
}

.bull {
    gap: 3px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    justify-content: center;
    background-color: var(--bgColor3);
    border-radius: var(--radiusButton);
    padding: 5px;
    width: fit-content;
}

.bull.wide {
    gap: 3px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: var(--bgColor3);
    border-radius: var(--radiusButton);
    padding: 5px 15px;
    width: fit-content;
}

.bullUser {
    border-radius: 50%;
    background-color: var(--defaultColor);
    color: #fff;
    height: 20px;
    width: 20px;
    font-size: 1em;
    font-weight: bolder;
    text-transform: uppercase;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-content: center;
    overflow: hidden;
    border: 0px;
}

.bullNum {
    border-radius: 50%;
    background: var(--gris);
    color: #fff;
    height: 25px;
    width: 25px;
    font-size: 1em;
    font-weight: 600;
    text-transform: uppercase;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-content: center;
    overflow: hidden;
    border: 0px;
}

.bullNum.red {
    background: var(--red);
    color: #fff;
}

.bullNum.blue {
    background: var(--blue);
    color: #fff;
}

.bullNum.float {
    position: absolute;
}

.bull.space,
.bull_grise2.space,
.bull_grise.space {
    margin: 1px;
}

.bull.block,
.bull_grise2.block,
.bull_grise.block {
    display: block;
    margin: 2px;
}

.bull.red,
.bull.rouge {
    background-color: var(--red);
    color: #fff;
}

.bull.bleu,
.bull.blue {
    background-color: var(--defaultColor);
    color: #fff;
}

.bull.claire,
.bull.claire {
    background-color: var(--claire);
    color: #fff;
}

.bull.orange {
    background-color: #FFA64C;
    color: #fff;
}

.bull.jaune {
    background-color: #FFEBB0;
    color: #000;
}

.bull.noir {
    background-color: #444444;
    color: #fff;
}

.bull.blanc {
    background-color: #fff;
    color: #535b69;
}

.bull.maron {
    background-color: #b6865a;
    color: #fffff2;
}

.bull.violet {
    background-color: #e4caff;
    color: #535b69;
}

.bull.prune {
    background-color: #c2c7e0;
    color: #5e6bac;
}

.bull.grise2,
.bull.grise,
.bull.gris {
    background-color: #dddcdc;
    color: #444444;
}

.bull.mauve {
    background-color: #43018b;
    color: #fff;
}

.bull.vert {
    background-color: #bdd779;
    color: #fff;
}

.bull.ciel {
    background-color: #d3eeff;
}

.bull.jaune1 {
    background-color: #F3C483;
    color: #000;
}

.bull.jaune2 {
    background-color: #DABD49;
    color: #000;
}

.bull.jaune3 {
    background-color: #C1AE62;
    color: #000;
}

.bull.vert {
    background-color: #59B300;
    color: #fff;
}




label.spntgg {
    opacity: 0.2;
}

label.spntgg.ici {
    opacity: 1;
}

.img {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}

.img.contain {
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center center;
}