<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">/*@import url('open-iconic/font/css/open-iconic-bootstrap.min.css');*/

@font-face {
    font-family: "Asap";
    src: url("../fonts/Asap-Bold.ttf");
    font-weight: bold;
}
@font-face {
    font-family: "Asap";
    src: url("../fonts/Asap-BoldItalic.ttf");
    font-weight: bold;
    font-style: italic;
}
@font-face {
    font-family: "Asap";
    src: url("../fonts/Asap-Italic.ttf");
    font-style: italic;
}
@font-face {
    font-family: "Asap";
    src: url("../fonts/Asap-Medium.ttf");
    font-weight: 500;
}
@font-face {
    font-family: "Asap";
    src: url("../fonts/Asap-MediumItalic.ttf");
    font-weight: 500;
    font-style: italic;
}
@font-face {
    font-family: "Asap";
    src: url("../fonts/Asap-Regular.ttf");
}
@font-face {
    font-family: "Asap";
    src: url("../fonts/Asap-SemiBold.ttf");
    font-weight: 600;
}
@font-face {
    font-family: "Asap";
    src: url("../fonts/Asap-SemiBoldItalic.ttf");
    font-weight: 600;
    font-style: italic;
}

html, body {
    font-family: Asap;
}
.oi {
    font-family: "Icons";
}
html, body, body &gt; form {
    height: 100%;
}
body {
    position: relative; /* Pour le placement des popover avec le zoom sur body : voir TenaClient.js */
    /*background-color: #F2F4F8;*/
    background-color: #F2F2F2;
    color: black;
    font-size: 14px;
}
.dropdown-menu {
    font-size: 14px;
}

h1 {
    font-size: 32px;
    margin-bottom: 35px;
}
h2 {
    margin-bottom: 25px;
}
h2, h2 input {
    font-size: 20px;
    font-weight: 500;
}
h3 {
    font-size: 16px;
    /*margin: 15px 0px 10px 0px;*/
    margin: 15px 0px;
}
.tableau h3 {
    margin-bottom: 10px;
}

.RGPD h1 {
    margin-bottom: 25px;
    font-size: 26px;
}
.RGPD h2 {
    margin: 10px 0px;
}
.RGPD h3 {
    margin: 5px 0px 10px 0px;
}
.RGPD input[type=checkbox]:not(:checked) + label {
    color: #FF0000;
}

input[type=text], input[type=email], input[type=number], input[type=date], input[type=password], select, textarea {
    /*padding: 2px 10px;*/
    padding: 2px 6px;
    /*border-radius: 16px;*/
    border-radius: 6px;
    border: 1px solid #DBDBDB;
}
input[type=checkbox] {
    position: relative;
    top: 2px;
}
.grille td input[type=checkbox] + label {
    vertical-align: middle
}
select {
    padding-top: 4px;
    padding-bottom: 4px;
}
.login input[type=email], .login input[type=password], #divModifePassword input[type=password] {
    padding: 5px 10px;
    /*border-radius: 18px;*/
}
input[type=date] {
    width: 130px; /* 130px pour Firefox, 125px suffit pour Chrome et Edge */
}
h2 input[type=date] {
    width: 165px; /* vérifier avec Firefox */
}
.grille input[type=text], .grille input[type=email], .grille input[type=number], .grille input[type=email], .grille textarea {
    padding: 0px 10px;
}
.grille select {
    padding: 2px 10px;
}
input[type=text][readonly=readonly], input[type=email][readonly=readonly], input[type=number][readonly=readonly], input[type=date][readonly=readonly], input[type=password][readonly=readonly], select[readonly=readonly], textarea[readonly=readonly] {
    background-color: #f8f9fa;
    border: none;
}
input[type=checkbox]:enabled, input[type=radio]:enabled {
    cursor: pointer;
}
input[type=checkbox] + label, input[type=radio] + label {
    padding-left: 5px;
}
input[type=checkbox]:enabled + label, input[type=radio]:enabled + label {
    cursor: pointer;
}
input[type=checkbox] + label, input[type=radio] + label {
    color: #696969;
}
input[type=checkbox]:checked + label, input[type=radio]:checked + label {
    /*color: inherit;*/
    color: #1D388B;
    font-weight: 500;
}
span.checkBoxRouge &gt; input[type=checkbox]:checked + label {
    color: #FF0000;
}
/*.parametrage input[type=radio]:checked + label, .parametrage input[type=checkbox]:checked + label, .recommandation input[type=radio]:checked + label, .recommandation input[type=checkbox]:checked + label {
    color: #1D388B;
    font-weight: 600;
}*/
.wrapCheckbox {
    display: flex;
    align-items: center;
}
.wrapCheckbox label {
    white-space: normal;
}
.bouton {
    padding: 8.5px 23px;
    border-radius: 20px;
    border: 1px solid #003A81;
    font-weight: 600;
    background-color: white;
    color: #1D388B;
    display: inline-block;
    box-shadow: 0px 6px 6px #003A811A;
}
.bouton.petitBouton { 
    padding: 5px 20px;
}
.boutonSecondaire {
    /*color: #696969;*/
    /*border-color: #DBDBDB;*/
}
.bouton.boutonPrimaire, .bouton.boutonPrimaire span {
    background-color: #003A81;
    color: white;
}
.bouton.boutonPrimaire:not(.encart):hover, .bouton.boutonPrimaire:hover span.oi, .bouton.boutonPrimaire:hover span.iconeBouton {
    background-color: #0056b3;
    color: white;
}
.bouton.boutonPrimaireOrange {
    background-color: #E07D0A;
    border: none;
    color: white;
}
.bouton.boutonPrimaireOrange:not(.encart):hover {
    background-color: #E07D0A;
    color: white;
}
.iconeBouton {
    display: inline-block;
    width: 13px;
    height: 13px;
    vertical-align: middle;
    background-repeat: no-repeat;
    background-position: center center;
}
.iconeBouton.boutonIcone {
    width: 24px;
    height: 24px;
}
.iconeBoutonCheckVert {
    background-image: url('../Images/icnCheckVert.svg');
}
.iconeBoutonCheckBleu {
    background-image: url('../Images/icnCheckBleu.svg');
}
.iconeBoutonEnvoyer {
    background-image: url('../Images/icnSendBouton.svg');
}
.boutonPrimaire .iconeBoutonEnvoyer {
    background-image: url('../Images/icnSendBoutonPrimaire.svg');
}
.iconeBoutonStocks {
    background-image: url('../Images/icnStocksBouton.svg');
}
.iconeBoutonStocksVert {
    background-image: url('../Images/icnStocksBoutonVert.svg');
}
.iconeBoutonStocksSecondaire {
    background-image: url('../Images/icnStocksBoutonSecondaire.svg');
}
.bouton .oi:not(.oi-chevron-right), .bouton .iconeBouton  {
    margin-right: 5px;
}
.bouton .oi.oi-chevron-right {
    margin-left: 5px;
}
.bouton .material-icons-round {
    font-size: 18px;
    margin-right: 5px;
    vertical-align: top;
}
.boutonIcone {
    border-radius: 5px;
    padding: 5px;
    color: #1D388B;
}
.boutonIcone.boutonIconeExport {
    border-radius: 15px !important;
    color: white !important;
    background-color: #E07D0A !important;
    font-size: 12px;
}
.boutonIcone.boutonIconeExport:hover {
    font-weight: bold !important;
}
.enTeteBlocAccueil .boutonIcone.boutonIconeExport {
    position: relative;
    top: 15px;
}
.boutonIcone.oi.oi-ban {
    font-size: 18px;
}
.boutonIcone.material-icons-round {
    font-size: 17px;
    vertical-align: sub;
}
.boutonRond {
    display: inline-block;
    width: 40px;
    height: 40px;
    border-radius: 20px;
    border: 1px solid #1D388B;
    /*box-shadow: 0px 6px 6px #003A811A;*/
    box-shadow: 0px 4px 4px #1D388B40;
    color: #1D388B;
    padding-top: 12px;
    text-align: center;
    font-size: 10px;
}
.boutonRond {
    font-size: 10px;
}
.boutonRondPrimaire {
    background-color: #1D388B;
    color: white;
}
.boutonRond.boutonRondPrimaire:not(.encart):hover, .boutonRond.boutonRondPrimaire:not(.encart):hover span.oi {
    background-color: #0056b3;
    color: white;
}
/*.boutonRond.petitBouton {
    width: 33px;
    height: 33px;
}*/
a {
    text-decoration: none;
    color: black;
}
a:not(.noeudSelectionne):not(.encart):hover, a:not(.noeudSelectionne):not(.bouton):not(.boutonRond):not(.lettre):not(.actualite):not(.encart):hover *:not(.texteGrisTresClair):not(.texteOrange):not(.indicateurMenuSelectionne) {
    text-decoration: none;
    color: #0056b3; /* _reboot.scss */
    background-color: #f8f9fa;
}
label {
    /*margin-bottom: 3px;*/
    margin-bottom: 0px;
}

/* IE ne supporte pas space-evenly */ 
.conteneurBoutons {
    display: flex;
    justify-content: space-around;
    align-items: flex-start;
}
.conteneurBoutonsVertical {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    padding: 0px 20px;
}
@supports not (-ms-ime-align: auto) {
    .conteneurBoutons {
        justify-content: space-evenly;
    }
}
.conteneurBoutons &gt; *:not(:first-child) {
    margin-left: 20px;
}
.conteneurBoutons &gt; .outil:not(:first-child), .conteneurBoutons &gt; .outil + a.encart {
    margin-left: 30px;
}
.conteneurBoutonsVertical &gt; .outil:not(:first-child) {
    margin-top: 1.5rem;
}
.rectangle .conteneurBoutons {
    padding-top: 25px;
}
.tableau {
    white-space: nowrap;
    align-self: start;
}
.tableau &gt; tbody &gt; tr &gt; td {
    padding: 3px 5px;
}
.tdCategorie {
    border-radius: 0px !important;
    font-weight: 600;
    background-color: #F2F2F2;
    border-top: 3px solid white;
    border-bottom: 3px solid white
}

.tableau &gt; tbody &gt; tr:first-child &gt; td:not(.analyseAbsorption) {
    padding-top: 0px;
}
.tableau &gt; tbody &gt; tr:last-child &gt; td:not(.analyseAbsorption) {
    padding-bottom: 0px;
}
.tableau &gt; tbody &gt; tr &gt; td:first-child:not(.analyseAbsorption) {
    padding-left: 0px;
}
.tableau &gt; tbody &gt; tr &gt; td:last-child:not(.analyseAbsorption) {
    padding-right: 0px;
}
.tableau:not(.recommandation) &gt; tbody &gt; tr &gt; td:nth-child(odd):not(.text-left):not(.text-center) {
    text-align: right;
}
.tableau:not(.parametrage):not(.recommandation) &gt; tbody &gt; tr &gt; td:nth-child(odd):not(.text-left):not(.text-center):not(.texteBleu):not(.texteTurquoise):not(.texteOrange):not(.texteNoir):not(.texteRouge):not(.analyseAbsorption) {
    color: #696969;
}
.tableau &gt; tbody &gt; tr:first-child &gt; td h3, .rectangle &gt; h3:first-child, .rectangle &gt; div:first-child &gt; h3, .rectangleGris &gt; h3:first-child, .tab-pane &gt; h3:first-child {
    margin-top: 0px;
}
.colonneGauche { /* Utilisé lorsqu'on ne peut utiliser de table, qui ne supporte pas flex-grow: 1 (ni un div avec display: table) : voir Distribution.aspx, Commandes/UCNouvelle.ascx.cs */
    display: inline-block;
    text-align: right;
    padding-right: 10px;
    color: #696969;
}
.grille th, .grille td {
    padding: 2px 5px;
}
.grille th {
    height: 35px;
}
.grille td {
    height: 33px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    max-width: 500px;
}
.grille.grilleFormationsEtablissementsDates td {
    vertical-align: top;
    height: 25px;
}
.grille td input[type=checkbox] + label {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    max-width: 470px;
}
.grille {
    max-width: 100%;
}
.grille th {
    font-weight: normal;
    background-color: white;
    color: #696969;
    position: sticky;
    z-index: 1;
    top: -0.1px; /* Pour l'écran BenQ */
    /*height: 48px;*/
}
.grille th:not(.texteBleu):not(.texteTurquoise):not(.texteOrange):not(.texteNoir) a:not(:hover):not(.boutonIcone):not(.texteBleu) {
    color: #696969;
}
.grille &gt; tbody &gt; tr:not(.legende):nth-child(even) {
    background-color: #f8f9fa;
}
.grille:not(.grilleRatios):not(.grilleRatiosProjection):not(.commandeEchantillons):not(.conditionsRevendeurs):not(.detailsCARevendeurs):not(.grilleFormationsEtablissementsDates) tr:nth-child(even) td:first-child {
    border-top-left-radius: 15px;
    border-bottom-left-radius: 15px;
}
.grille:not(.grilleRatios):not(.grilleRatiosProjection):not(.commandeEchantillons):not(.conditionsRevendeurs):not(.detailsCARevendeurs):not(.grilleFormationsEtablissementsDates) tr:nth-child(even) td:last-child {
    border-top-right-radius: 15px;
    border-bottom-right-radius: 15px;
}
.grille tr.total td {
    background-color: white;
    padding-top: 15px;
    font-weight: 600;
    position: sticky;
    /*bottom: 0px;*/
    bottom: -0.3px; /* Pour l'écran BenQ : voir la grille Code Article de la page d'accueil */
}
div.total {
    position: sticky;
}
.grille tr.enTeteGrille td {
    background-color: white;
    font-weight: 600;
}
.grille *[data-href] {
    cursor: pointer;
}
.grille *[data-href]:hover, .grille *[data-href]:hover .texteNoir, .grille *[data-href]:hover .texteBleu, .grille tr[data-bs-toggle]:hover, .grille tr[data-bs-toggle]:hover .texteNoir
    , .grille tr[role=button]:hover, .grille td[data-bs-toggle]:hover {
    color: #0056b3;
}
.grilleRatios tr {
    background-color: #f8f9fa;
}
.grille .bordureGauche {
    border-left: 2px solid #00ABBD;
}
.grille.grilleFormationsEtablissementsDates .bordureGauche {
    border-left: 1px solid #d5d5d5;
}
.grille.grilleFormationsEtablissementsDates .bordureDroite {
    border-right: 1px solid #d5d5d5;
}
.grille .bordureTop {
    border-top: 2px solid #00ABBD;
}
.grille .bordureBottom {
    border-bottom: 2px solid #00ABBD;
}
.grilleEngagementsBudgetaires {
    margin-left: auto;
    margin-right: auto;
}
.grilleRatiosProjection td, .grilleRatiosProjection th {
    border: 1px solid #d5d5d5;
    border-radius: 0px !important;
    text-align: center;
}
.grilleRatiosProjection tr:nth-child(2) th {
    width: 80px;
}
.grilleRatiosProjection .bordureGauche {
    border-left: 2px solid #d5d5d5;
}
.grille.grilleFormationsHorairesParticipants td {
    max-width: 700px;
}
.legende {
    font-size: 12px;
    color: #696969;
}
.grille tr.legende td {
    vertical-align: top;
    padding-top: 15px;
}
.grille tr.legende .couleurProduit {
    margin-right: 5px;
}

.texte12 {
    font-size: 12px;
}
.texte15 {
    font-size: 15px;
}
.texte16, .encart.texte16 {
    font-size: 16px;
}
.texte18 {
    font-size: 18px;
}
.rectangle {
    flex-shrink: 0; /* Pour IE */
    position: relative;
    /*display: inline-flex;*/
    display: flex; /* Pas vu à quoi sert inline-flex ? Ne résout pas les problèmes avec IE */
    flex-direction: column;
    text-align: left;
    background-color: white;
    /*padding: 30px;*/
    padding: 20px;
    border-radius: 20px;
    /*border: 1px solid #DBDBDB;*/
    box-shadow: 0px 6px 8px #0000000F;
}
.rectangle.rectangleFiltre {
    padding: 1rem;
    background-color: rgba(70, 128, 198, 0.12);
    align-items: center;
}
.modal-content {
    border: none;
    min-width: 500px;
    /*min-height: 250px;*/
    min-height: 150px;
}
.tab-content.rectangle {
    border-radius: 0px 20px 20px 20px;
}
.rectangle div, .rectangle table {
    flex-shrink: 0; /* Pour IE */
}
.iconeRectangle {
    position: absolute;
    top: 20px;
    right: 15px;
}
.rectangleGris {
    padding: 20px;
    background-color: #f8f9fa;
    border-radius: 20px;
}
.encart {
    align-self: center;
    display: inline-block; /* Si pas dans un conteneur Flex */
    text-align: left;
    padding: 10px 15px 10px 60px;
    border-radius: 15px;
    max-width: 1000px;
    border: 1px solid #E07D0A;
    color: #E07D0A;
    /*background: #E07D0A1A no-repeat url("../Images/icnEncartAlerte.svg") left 15px top 5px;*/ /* Marche pas avec IE */
    background: #fbf2e5 no-repeat url("../Images/icnEncartAlerte.svg") left 15px top 5px; /* Marche pas avec IE */
}
.encart.encartErreur {
    color: #FF0000;
    border-color: #FF0000;
    /*background: #FF00001A no-repeat url("../Images/icnError.svg") left 15px top 5px;*/ /* Marche pas avec IE */
    background: #fee5e5 no-repeat url("../Images/icnError.svg") left 15px top 5px; /* Marche pas avec IE */
}
.encart.encartOk {
    color: #749517;
    border-color: #91B91D;
    /*background: #91B91D1A no-repeat url("../Images/icnEncartOk.svg") left 15px top 5px;*/ /* Marche pas avec IE */
    background: #f4f8e5 no-repeat url("../Images/icnEncartOk.svg") left 15px top 5px; /* Marche pas avec IE */
}
.encart.encartInfos {
    color: #00abbd;
    border-color: #00abbd;
    background: #e8f8fa no-repeat url("../Images/icnEncartInfos.svg") left 15px top 5px;
}
.encart.encartClignote {
    animation: encartBlinker 0.2s linear infinite;
}
@keyframes encartBlinker {
  50% {
    background-image: url("../Images/icnEncartVide.svg"); /* Si on met none il n'y a pas de fondu */
  }
}
/*.clignote {
    font-weight: bold;
    animation: blinker 0.7s linear infinite;
}
@keyframes blinker {
  50% {
    font-weight: normal;
  }
}*/
.pasDeDonnee {
    font-style: italic;
    color: #696969;
}

.menuDeroulant {
    padding: 20px;
    background: no-repeat url("../Images/icnArrowBlue.svg") center center;
    border-radius: 10px;
}
.dropdown .menuDeroulant {
    padding: 5px 30px 5px 10px;
    background-position: right 10px center;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
}


ul.dropdown-menu li {
    white-space: nowrap;
}

.dropdownArborescence &gt; .texteOrange &gt; .material-icons-round {
    color: #E07D0A !important;
    margin-left: 5px;
    vertical-align: text-bottom;
}

.loginContainer {
    background: url("../Images/fondBleuFonce.png") repeat;
}
.loginContainer .logoTENA {
    width: 300px;
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
}
.loginContainer .logoEssity {
    width: 600px;
}
.loginContainer a:not(.bouton) {
    text-decoration: underline !important;
}
.loginContainer a:not(.bouton):hover {
    background-color: unset !important;
}

.enTete {
    z-index: 3;
    display: flex;
    justify-content:space-between;
    background: url("../Images/fondBleuFonce.png") repeat;
}
.enTete .logoTENA {
    height: 70px;
    padding: 10px 67px;
}
.enTete .logoEssity {
    height: 70px; /* On spécifie la hauteur plutôt que la largeur pour menuHover */
    padding: 5px;
}
.enTete h2 {
    margin: 0px;
    flex-grow: 1;
    display: flex;
}
.enTete .dropdownArborescence {
    display: flex;
    align-items: center;
    padding: 0px 10px;
}
.enTete h2 *, .enTete .cheminEntite *:not(.oi-media-play), .enTete &gt; div &gt; a, .enTete &gt; div &gt; a:not(#aChatbot) *, .enTete .dropdown &gt; a {
    color: white !important;
}
.enTete a:hover, .enTete a:hover * {
    background-color: unset !important;
}
.enTete .dropdownArborescence &gt; .material-icons-round {
    color: #E07D0A !important;
    font-size: 32px;
}
.enTete .cheminEntite {
    display: flex;
    align-items: center;
    /*border-bottom: 1px solid #DBDBDB;*/
}
.enTete .cheminEntite &gt; a, .cheminEntite &gt; span {
    font-style: italic;
    font-weight: 500;
    margin-left: 10px;
    color: #1D388B;
}
.enTete .nomEntite {
    font-size:20px;
    font-weight: 600;
    color: #1D388B;
}
.enTete .dropdownArborescence .cliquezPourOuvrir {
    color: #749517 !important;
    font-size: 16px;
    font-style: italic;
    margin-left: 25px;
    font-weight: 500;
}
.enTete .dropdownArborescence .cliquezPourOuvrir .material-icons-round {
    color: #749517 !important;
}
.enTete #aChatbot * {
    color: #749517;
}

.aActualites {
    padding: 10px;
    border-radius: 10px;
    white-space: nowrap;
}
.dropdown-menuActualites, .dropdown-menuOptions {
    max-height: calc(100vh - 80px); /* 100vh marche pas avec le zoom sur body */
    overflow: auto;
}
.dropdown-menuActualites {
    padding: 10px;
}
.dropdown-menuActualites h6.dropdown-header {
    font-size: 20px;
    color: #1D388B;
}
.dropdown-menuActualites .dropdown-item-text {
    padding: 10px;
}
.dropdown-menuActualites .dropdown-divider {
    margin-top: 15px;
}
a.actualite {
    flex-grow: 1;
    display: flex;
    align-items: center;
    padding: 15px;
    background: linear-gradient(#e2f1f8, #f5fafd);
    border: 1px solid #e9ecef;
    border-radius: 5px;
    box-shadow: 0px 6px 8px #0000000F;
}
a.actualite &gt; img {
    max-width: 100px;
    max-height: 100px;
    margin-right: 15px;
}
.dropdown-menuActualites .dropdown-item-text.pasDeDonnee {
    padding: 15px;
}
a.actualite * {
    white-space: nowrap;
}
.dropdown-item-text.actualiteLue {
    /*padding-right: 40px;*/
}
.dropdown-item-text.actualiteLue a.actualite {
    /*background: #f8f9fa;*/
    background: linear-gradient(#f8f9fa, white);
}
/*a.actualite:hover .titreActualite {
    color: black;
}*/
.titreActualite {
    font-weight: 600;
}
.lienActualite {
    font-weight: normal;
    margin-top: 5px;
    font-style: italic;
    color: #749517;
}
.sousTitreActualite {
    margin-top: 5px;
}
/*.dropdown-item-text.actualiteLue .titreActualite, .dropdown-item-text.actualiteLue .sousTitreActualite {
    color: black;
    font-weight: normal;
}*/
.dropdown-item-text.actualiteMasquee .titreActualite, .dropdown-item-text.actualiteMasquee .sousTitreActualite {
    color: #696969;
}
.dropdown-menuActualites .dropdown-item {
    padding: 5px 15px; /* Liens pour basculer entre les actualités masquées / non masquées */
    font-weight: 500;
}
.dropdown-menuOptions .dropdown-item {
/*    font-size: 15px;
    padding-top: 2px;
    padding-bottom: 2px;*/
}

.texteGris, .texteGris a {
    color: #696969;
}
.bouton.texteGris {
    border-color: #696969;
    box-shadow: none;
}
.texteGrisTresClair {
    color: #D3D3D3;
}
.texteBleu, .nav-tabs .nav-link.texteBleu {
    color: #1D388B;
}
select.texteBleu option {
    color: black;
}
.texteBleuLienSouligne {
    color: #003A81;
    text-decoration: underline !important;
    padding: 5px 0px;
}
.texteTurquoise, th.texteTurquoise, th.texteTurquoise a:not(:hover), .tableau &gt; tbody &gt; tr &gt; td.texteTurquoise:nth-child(odd):not(.text-left):not(.text-center) {
    color: #00ABBD;
    font-weight: 600;
}
.texteOrange, th.texteOrange, th.texteOrange a:not(:hover), .tableau &gt; tbody &gt; tr &gt; td.texteOrange:nth-child(odd):not(.text-left):not(.text-center) {
    color: #E07D0A !important;
    font-weight: 600;
}
.texteNoir, th.texteNoir, th.texteNoir a:not(:hover), .tableau &gt; tbody &gt; tr &gt; td.texteNoir:nth-child(odd):not(.text-left):not(.text-center) {
    color: black;
}
.texteNoir, th.texteNoir {
    font-weight: 600;
}
.texteRouge { /* Pour les validateurs mettre display: block ne sert à rien car les validateurs mettent display: inline. Si on met !important le texte s'affiche en permanence -&gt; intégrer le contrôle et le validateur dans un div flex column */
    color: #FF0000;
}
.texteVert, .texteVert a {
    color: #749517;
}
.texteOrange {
    color: #E07D0A;
}
.texteRose {
    color: #F50082;
}
.fondGris {
    background-color: #f8f9fa;
}
.filtre, .menuDeroulant.filtre {
    color: #1D388B;
    font-weight: 500;
}
.filtre.filtreRenseigne {
    background-color: lightgoldenrodyellow;
}
/*.filtre:not([value=""]) {
    background-color: lightgoldenrodyellow;
}*/
.text-decoration-underline {
    text-decoration: underline;
}

.margeSuperieure5 {
    margin-top: 5px;
}
.margeSuperieure10 {
    margin-top: 10px;
}
.margeSuperieure15 {
    margin-top: 15px;
}
.margeSuperieure20 {
    margin-top: 20px;
}
.margeSuperieure25 {
    margin-top: 25px;
}
.margeSuperieure30 {
    margin-top: 30px;
}
.margeSuperieure35 {
    margin-top: 35px;
}
.margeGauche5 {
    margin-left: 5px;
}
.margeGauche10 {
    margin-left: 10px;
}
.margeGauche15 {
    margin-left: 15px;
}
.margeGauche25 {
    margin-left: 25px;
}
.margeDroite10 {
    margin-right: 10px;
}

.aide {
    display: inline-block;
    width: 13px;
    height: 13px;
    background: no-repeat url("../Images/icnAide.svg") center center;
    background-size: 13px;
    margin-left: 5px;
}
.aideTitre {
    width: 18px;
    height: 18px;
    background: no-repeat url("../Images/icnAideTitre.svg") center center;
    background-size: 18px;
}
.info {
    color: #696969;
    font-size: 13px;
}

.menu {
    flex-shrink: 999;
    width: 251px;
    min-width: 50px;
    left: 0px;
    z-index: 2;
    height: 100%;
    display: flex;
    flex-direction: column;
    background-color: white;
    /*border-right: 1px solid #DBDBDB;*/
    border-right: 1px solid #CACACA;
}
.menuPlaceHolder {
    flex-shrink: 999;
    width: 251px;
    min-width: 50px;
    display: none;
}
.menu.menuHover {
    position: absolute;
    top: 0px;
    /*padding-top: 77px;*/ /* 71 + 6 */
}
.divMaster.arborescenceAncree .conteneurMenuEtSplitter .menu:not(.menuHover), .divMaster.arborescenceAncree .conteneurMenuEtSplitter .menuPlaceHolder {
    width: 0px; /* Dans ce cas c'est min-width qui s'applique */
}
.menu a {
    position: relative;
    display: flex;
    align-items: center;
    /*flex-wrap: wrap;
    align-content: center;*/
    overflow: hidden;
    font-size: 18px;
    color: #696969;
    /*height: 80px;*/
    height: 70px;
    outline: none;
}
.menu.menuPharma a {
    height: 90px;
}
.menu a img, .menu a .material-icons-round {
    /*padding: 0px 0px 5px 15px;*/
    padding: 0px 0px 5px 16px;
    opacity: 0.6;
}
.menu a .lienMenuTexte {
    /*width: 130px;*/ /* Largeur du texte "Commandes" en gras + 15px */
    width: 155px; /* Largeur pour "Tableau de bord" en gras + environ 10 */
    padding-left: 15px;
}
.fonduMenu {
    position: absolute;
    z-index: 2;
    right: 0px;
    height: 100%;
    width: 15px;
    background: linear-gradient(to left, white, transparent);
}
.menu a.lienMenuSelectionne .fonduMenu, .menu a:hover .fonduMenu, .menu a[aria-describedby] .fonduMenu {
    display: none;
}
.menu a.lienMenuSelectionne {
    background-color: #F2F2F2;
    font-weight: bold;
    color: #1D388B;
}
.menu a.lienMenuSelectionne img, .menu a.lienMenuSelectionne .material-icons-round {
    opacity: 1;
}
.paddingMenuHorizontal {
    flex-grow: 1;
}
.paddingMenuVertical {
    height: 20px;
}
.indicateurMenuSelectionne {
    display: none;
    position: absolute;
    left: 0px;
    width: 6px;
    /*height: 40px;*/
    height: 100%;
    border-radius: 3px;
    background-color: #1D388B;
}
a.lienMenuSelectionne &gt; .indicateurMenuSelectionne {
    display: inherit;
}

.conteneurOnglets {
    display: flex;
    background-color: white;
    flex-grow: 0.055;
    /*max-height: 70px;*/
    max-height: 60px;
    position: relative; /* Pour la liste des groupement en absolute */
}
.onglet {
    display: flex;
    align-items: center;
    /*padding: 2px 30px;*/ /* Spécifier la hauteur à la place du padding ne fonctionne pas pour réduire la hauteur si besoin, alors que ça marche pour la largeur du menu */
    padding: 2px 25px; /* Spécifier la hauteur à la place du padding ne fonctionne pas pour réduire la hauteur si besoin, alors que ça marche pour la largeur du menu */
    color: #696969;
    text-align:center;
}
.conteneurOngletsMemento .onglet {
    font-size: 13px;
    padding-left: 20px;
    padding-right: 20px;
}
.ongletSelectionne {
    color: #003A81;
    font-weight: bold;
}
.onglet.ongletSelectionne {
    background-color: #F2F2F2;
}
.onglet.ongletReveilDesSens {
    background-color: #e77703 !important;
    color: white !important;
}
.onglet.ongletBienEtre {
    background-color: #f50082 !important;
    color: white !important;
}
.separateurOnglet {
    /*background-color: white;*/
    width: .8px; /* 0.75px pas visible dans la partie Commandes des revendeurs */
    flex-shrink: 0;
    background: linear-gradient(white, 20%, #DBDBDB, 20%, #DBDBDB 80%, white 80%);
}
.onglet.ongletBienEtre + .separateurOnglet {
    background: linear-gradient(#f50082, 20%, #DBDBDB, 20%, #DBDBDB 80%, #f50082 80%);
}
 .onglet.ongletSelectionne + .separateurOnglet {
    display: none;
}

.divMaster {
    display: flex;
    flex-direction: column;
    height: 100%;
}
.conteneurMaster {
    flex-basis: 0;
    flex-grow: 1;
    overflow: auto;
    display: flex;
    flex-direction: column;
    padding: 20px;
}
.contenuCentre {
    display: flex; /* Pour que les éléments aient la même largeur, utile pour les onglets et le contenu en-dessous par exemple */
    flex-direction: column;
    margin: auto; /* auto pour faire fonctionner le scroll du parent (voir forums) */
    align-self: center; /* Pour IE */
}
.contenuHauteur {
    flex-grow: 1;
    margin: auto; /* auto pour faire fonctionner le scroll du parent (voir forums) */
    align-self: center; /* Pour IE */
    max-width: 100%; /* Pour le scroll horizontal avec conteneurScroll */
}
.modalHauteur .modal-content, .modal-content.modalHauteur { /* A faire : remplacer .modalHauteur .modal-content par modal-content.modalHauteur */
    align-self: stretch; /* Pour IE ne pas mettre .modal-dialog à flex-direction: column et .modal-content à flex-grow: 1 */
}
.conteneurScroll {
    flex-basis: 0;
    flex-grow: 1;
    overflow: auto;
    align-self: flex-start;
    max-width: 100%; /* Pour le scroll horizontal avec contenuHauteur */
    display: flex;
    flex-direction: column;
}

.outil {
    padding: 10px 30px;
    border-radius: 20px;
    font-size: 12px;
    box-shadow: 0px 6px 8px #0000000F;
    background: no-repeat url("../Images/icnArrowRight_2x.png") left 10px center;
    background-size: 6px;
    background-color: white;
    display: flex;
    align-items: center;
}
.conteneurBoutons &gt; .outil + a.encart {
    font-size: 13px;
    font-weight: 600;
    padding: 10px 15px 10px 50px;
    background-position-x: 10px;
}
.outil.outilSelectionne, a.outil.outilSelectionne:hover {
    background-color: #003A81;
    color: white;
}
.conteneurLettres {
    display: flex;
    flex-wrap: wrap;
    margin: -30px;
}
.lettre {
    display: flex;
    white-space: nowrap;
    margin: 30px;
    padding: 20px;
    border-radius: 20px;
    box-shadow: 0px 12px 16px #0000001F;
    background-color: #003A81;
    color: white;
}
a.lettre:hover {
    background-color: #0056b3;
    color: white;
}
.lettre.techniqueDePose {
    background-color: #00ABBD;
}
a.lettre.techniqueDePose:hover {
    background-color: #008398;
}
.lettre h3 {
    margin-top: 0px;
}
.lettre span.oi.oi-data-transfer-download {
    margin-left: 20px;
}

.conteneurMenuEtSplitter {
    position: relative; /* Pour menuHover */
    flex-grow: 1;
    display: flex;
    overflow: hidden;
    height: 100%; /* Pour Safari sur MAC (pas besoin pour iPad) */
}
.splitter_panel {
    flex-grow: 1;
    overflow: hidden;
    display: flex;
    height: 100%;
}
.splitter_panel &gt; div:first-child, #divPopupArborescence .modal-content &gt; div { /* updatePanelArborescence x2 */
    flex-grow: 1;
    display: flex;
}
.splitter_panel &gt; div:first-child { /* updatePanelArborescence */
    background-color: white;
}
.splitter_panel .vsplitter {
    background-color: #DBDBDB;
    width: 5px;
}
.conteneurArborescence &gt; a.boutonIcone {
    position: absolute;
    top: 20px;
    right: 20px;
}
#divPopupArborescence .conteneurArborescence &gt; a.boutonIcone {
    top: 3rem;
    right: .25rem;
}
.splitter_panel .conteneurArborescence &gt; a.boutonIcone {
    top: .25rem;
    right: .25rem;
}
.divMaster:not(.arborescenceAncree) .splitter_panel &gt; div:first-child /* updatePanelArborescence */, .divMaster.arborescenceAncree .cliquezPourOuvrir
    , .divMaster.arborescenceAncree #divPopupArborescence .conteneurArborescence &gt; a.boutonIcone:first-child {
    display: none;
}
.conteneurArborescence {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    max-width: 100%;
}
.tableau.tableauFiltresArborescence &gt; tbody &gt; tr &gt; td {
    padding: 1px 5px;
}
.tableau.tableauFiltresArborescence {
    align-self: stretch;
}
.tableau.tableauFiltresArborescence td:first-child {
    width: 1px;
}
.tableau.tableauFiltresArborescence select {
    width: 100%;
}
.tableau.tableauFiltresArborescence &gt; tbody &gt; tr &gt; td:last-child {
    padding-right: 2.5rem;
}
.conteneurMenuEtSplitter .conteneurArborescence .separateur {
    margin: 10px 5px 5px 5px;
}
.conteneurMenuEtSplitter .conteneurArborescence .tableauFiltresArborescence {
    margin: 10px 5px 0px 5px;
}
.conteneurArborescence .conteneurScroll {
    align-self: stretch;
}
#divPopupArborescence .conteneurArborescence .conteneurScroll {
    min-width: 500px;
}
.arborescence td {
    padding: 5px; /* Si on utilise border-collapse: inherit; border-spacing: 5px; alors décallage quand on expand un noeud qui n'a pas d'enfant et que le + disparaît */
}
.arborescence td a {
    margin: -5px;
    padding: 5px;
}
.arborescence td a:not(.noeudSelectionne) {
    border-radius: 5px;
}
a.noeudSelectionne, a.noeudSelectionne .texteGris, a.noeudSelectionne:hover {
    background-color: #0056b3;
    color: white;
}
.noeudSelectionneAutreVision {
    background-color: #f8f9fa;
}

.couleurProduit {
    display: inline-block;
    width: 16px;
    height: 16px;
    border-radius: 8px;
    vertical-align: text-bottom;
}

.separateur {
    align-self: stretch;
    flex-shrink: 0;
    background-color: #00ABBD;
    /*height: 4px;*/ /* Utilisé dans UCArborescence, Protocoles.apsx */
    /*margin: 25px 0px;*/
    height: 3px;
    margin: 15px 0px;
}
.restaureScrollModifierPatientsEnMasse .separateur, .etapeAssistant + .separateur {
    height: 1.75px;
}
.separateurBottom {
    box-shadow: rgb(0 0 0 / 20%) 0 6px 6px -6px;
    border-bottom: 1px solid rgba(60, 60, 60, 0.25);
    padding-bottom: 20px;
    margin-bottom: 20px;
}
.updateProgress {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 10; /* Au-dessus des th (1), et en-dessous des modal (1050) et popover (1002) */
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    background-color:rgba(255, 255, 255, 0.8);
    border-radius: 20px;
    color: #7ebc00;
    animation: changementCouleur 1.5s infinite;
}
@keyframes changementCouleur {
  0% {
    color: #7ebc00;
  }
  33% {
    color: #33b2ea;
  }
  66% {
    color: #00428f;
  }
  100% {
    color: #7ebc00;
  }
}

.plusMoins {
    position: absolute;
    margin-left: 15px;
    /*display: inline-block;*/
    /*vertical-align: middle;*/
    width: 23px;
    height: 23px;
    background: no-repeat url("../Images/btnMoins.svg");
    background-size: cover;
}
.plusMoins.collapsed {
    background: no-repeat url("../Images/btnPlus.svg");
}

.rectangle.etapesAssistant {
    padding: 10px 10px 5px 10px;
    flex-direction: row;
}
.rectangle.etapesAssistant.etapesAssistantVertical {
    flex-direction: column;
    align-self: flex-start;
}
.etapeAssistant {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    color: #696969;
    height: 85px;
    border-radius: 5px;
}
.etapesAssistant.etapesAssistantVertical .etapeAssistant {
    margin: 10px 0px;
    justify-content: center;
    text-align: center;
}
.etapeAssistant.etapeAssistantComplete:not(:hover), .etapeAssistant.etapeAssistantComplete:not(:hover) .imageEtapeAssistant.oi {
    color: #00ABBD;
}
.imageEtapeAssistant {
    width: 20px;
    height: 20px;
}
.etapesAssistant.etapesAssistantVertical .imageEtapeAssistant {
    font-size: 20px;
}
.etapeAssistant.etapeAssistantComplete .imageEtapeAssistant.etapeProtocoles {
    background: no-repeat url("../Images/Assistant/icnProtocolActiv.svg") center bottom;
}
.etapeAssistant .imageEtapeAssistant.etapeStock {
    background: no-repeat url("../Images/Assistant/icnStock.svg") center bottom;
}
.etapeAssistant.etapeAssistantComplete .imageEtapeAssistant.etapeStock {
    background: no-repeat url("../Images/Assistant/icnStockActiv.svg") center bottom;
}
.etapeAssistant .imageEtapeAssistant.etapeBat {
    background: no-repeat url("../Images/Assistant/icnBat.svg") center bottom;
}
.etapeAssistant.etapeAssistantComplete .imageEtapeAssistant.etapeBat {
    background: no-repeat url("../Images/Assistant/icnBatActiv.svg") center bottom;
}
.etapeAssistant .imageEtapeAssistant.etapeQuantites {
    background: no-repeat url("../Images/Assistant/icnQuantites.svg") center bottom;
}
.etapeAssistant.etapeAssistantComplete .imageEtapeAssistant.etapeQuantites {
    background: no-repeat url("../Images/Assistant/icnQuantitesActiv.svg") center bottom;
}
.etapeAssistant .imageEtapeAssistant.etapeValide {
    background: no-repeat url("../Images/Assistant/icnValid.svg") center bottom;
}
.etapeAssistant.etapeAssistantComplete .imageEtapeAssistant.etapeValide {
    background: no-repeat url("../Images/Assistant/icnValidActiv.svg") center bottom;
}
.etapeAssistant .imageEtapeAssistant.etapeEnvoi {
    background: no-repeat url("../Images/Assistant/icnSend.svg") center bottom;
}
.etapeAssistant.etapeAssistantComplete .imageEtapeAssistant.etapeEnvoi {
    background: no-repeat url("../Images/Assistant/icnSendActiv.svg") center bottom;
}
.imageEtapeAssistant.oi {
    padding-top: 6px;
    padding-left: 2px;
    color:#e0e0e0;
}
.imageEtapeAssistant.oi.oi-clipboard {
    padding-left: 4px;
}
.etapeAssistant .numeroEtapeAssistant {
    width: 30px;
    height: 30px;
    text-align: center;
    border-radius: 15px;
    font-weight: bold;
    padding-top: 5px;
    background-color: #DBDBDB;
    border: 1px solid white;
    margin-top: 10px;
}
.etapeAssistant.etapeAssistantComplete .numeroEtapeAssistant {
    background-color: #00ABBD;
    color: white;
}
.etapesAssistant:not(.etapesAssistantVertical) .titreEtapeAssistant {
    position: absolute;
    white-space: nowrap;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0px;
}
.etapesAssistant.etapesAssistantVertical .titreEtapeAssistant {
    margin-top: 15px;
    text-align: center;
}
.etapesAssistant.etapesAssistantVertical .etapeAssistantComplete, .etapesAssistant.etapesAssistantVertical .etapeAssistant.etapeAssistantComplete:not(:hover) .imageEtapeAssistant.oi {
    font-weight: bold;
    color: #E07D0A;
}
.separateurEtapeAssistant {
    flex-grow: 1;
    border-top: 6px solid #DBDBDB;
    margin: 42px -15px 0px -15px;
}
.separateurEtapeAssistant.separateurEtapeAssistantComplete {
    border-color: #00ABBD;
}
#divPopupArborescence .etapeAssistant {
    height: 50px;
    margin: 5px 0px;
}

.labelRatio {
    background-color: white;
    border-radius: 5px;
    padding: 3px;
}

/*------------------------------------------- Accueil ---------------------------------------------------------*/
.conteneurAccueil {
    display: flex;
    align-items: flex-start;
}
.conteneurAccueil &gt; div &gt; .dropdown {
    margin: 15px;
}
.rectangleAccueilHauteur {
    align-self: stretch;
}
.conteneurAccueil .rectangle {
    margin: 15px;
}
.conteneurAccueil .rectangle:not(.rectangleAccueilPatients) {
    min-width: 500px;
}
.enTeteBlocAccueil {
    display: flex;
    align-items: center;
}
.conteneurAccueil .enTeteBlocAccueil {
    padding-right: 40px;
}
.enTeteBlocAccueil .iconeRectangle, .rectangleAccueilMiseEnPlace .iconeRectangle {
    position: inherit;
    margin-right: 15px;
}
.enTeteBlocAccueil h2, .enTeteBlocAccueil h3 {
    margin: 0px 0px 0px 0px;
}
.enTeteBlocAccueil h3, .rectangleAccueilMiseEnPlace h3 {
    font-size: 18px;
}
.conteneurAccueil .dropdown-item {
    padding: 10px 20px;
}
.conteneurAccueil .dropdown-item &gt; div {
    display: inline-block;
    width: 35px;
    text-align: center;
    margin-right: 10px;
}
.conteneurAccueil .dropdown-item .iconeRectangle {
    margin-right: 10px;
}
.conteneurAccueil .oi.oi-x, .rectangleErreur .oi.oi-x {
    position: absolute;
    top: 15px;
    right: 15px;
    color: #696969;
}
.conteneurAccueil .conteneurBoutonsVertical {
    /*padding: 0px 0px 10px 0px;*/
    padding: 0;
}
.conteneurAccueil .rectangleAccueilOutils .conteneurBoutonsVertical &gt; .outil, .conteneurAccueil .rectangleAccueilMiseEnPlace .conteneurBoutonsVertical &gt; .outil {
    margin-top: 15px;
    font-size: 14px;
    font-weight: 500;
    border: 1px solid lightgray;
}
.conteneurAccueil .rectangleAccueilPatients .conteneurBoutonsVertical &gt; .bouton {
    margin-top: 15px;
}
.grille.grilleAnalyseAccueil th, .grille.grilleAnalyseAccueil td {
    max-width: inherit;
}
.graphiqueAccueil {
    display: flex;
    width: 250px;
    height: 30px;
}
.rectangleAccueilAnalyseCommandes .graphiqueAccueil {
    width: 350px;
}
.graphiqueAccueil div {
    display: flex;
    flex-direction: column;
    border-left: 1px solid white;
    border-radius: 2px;
}
.graphiqueAccueil div &gt; span:first-child {
    flex-grow: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    /*text-overflow: ellipsis;*/
    font-size: 11px;
    font-weight: 500;
}
.graphiqueAccueil div &gt; span:first-child + span {
    height: 5px;
    border-radius: 2px;
}

/*------------------------------------------- Protocoles ---------------------------------------------------------*/
.nomPatientHomme {
    padding-left: 20px;
    background: no-repeat url("../Images/icnMale.svg") left center;
}
.nomPatientFemme {
    padding-left: 20px;
    background: no-repeat url("../Images/icnFemale.svg") left center;
}
.tableauProtocoles {
    margin-top: 3px;
}
.tableauProtocoles td {
    padding: 3px;
}
.tableauProtocoles &gt; tbody &gt; tr:last-child &gt; td {
    padding-bottom: 0px;
}
.tableauProtocoles &gt; tbody &gt; tr &gt; td:first-child {
    padding-left: 0px;
}
.tableauProtocoles &gt; tbody &gt; tr &gt; td:last-child {
    padding-right: 0px;
}
.tableauProtocoles th, .tableauProtocoles td {
    font-size: 12px;
}
.tableauProtocoles th {
    text-align: center;
    font-weight: normal;
}
.infosPatient {
    display: block;
    background-color: #f8f9fa;
    border-top: 2px solid #00ABBD;
}
.vignettePopover {
    width: 102px;
    height: 72px; /* Il faut définir la largeur et la hauteur pour que le placement de la popover soit idéal dès le 1er chargement */
}
.vignette {
    width: 68px;
    height: 48px;
    background-color: white;
}
/*.restaureScrollProtocolesListeProduits .vignette, div[id^=divRecommandation] .vignette {
    touch-action: none;*/ /* Active les glisser-déposer, mais désactive le scroll */
/*}*/
.vignette {
    touch-action: pan-y; /* Active le glisser-déposer horizontal et le scroll vertical */
}
.conteneurBoutons .vignette.vignettePoubelle {
    touch-action: none; /* Active le glisser-déposer, pas de scroll */
}
span.vignette {
    display: flex; /* inline-block crée des problèmes, block OK, mais flex est utilisé pour vignetteTexte */
}
.vignette.vignetteTexte {
    /*border: 1px solid #DBDBDB;*/
    border: 1px solid #003A81;
    border-radius: 5px;
    font-weight: bold;
    line-height: 16px;
    /*color: #696969;*/
    color: #1D388B;
    font-size: 12px;
    align-items: center;
    justify-content: center;
    text-align: center;
    overflow: hidden;
}
.vignette.vignetteTexte.vignettePoubelle {
    font-size: 26px;
    border: none;
    outline: dashed 2px blue;
    background-color: #E07D0A;
    color: white;
}
.popover.poubelle .vignette.vignetteTexte.vignettePoubelle {
    font-size: 18px;
    cursor: pointer;
    width: 51px;
    height: 36px;
}
.vignette.vignetteActive {
    box-shadow: 0px 6px 8px #353535;
}
.vignetteInactive {
    opacity: 0.3;
}
span.vignette.vignetteVide {
    background-color: #f8f9fa;
}
.restaureScrollProtocolesListeProduits .vignette {
    margin-top: 3px;
    margin-left: 3px;
}
.denominationProduits {
    font-size: 18px;
    font-weight: 600;
    padding-top: .5rem;
}
#divProduits2 .denominationProduits {
    text-align: center;
    font-size: 15px;
}
#divProduits2 &gt; div {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    max-width: 470px;
}
#divProduits2 &gt; div &gt; div {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 110px;
    max-width: 100%;
}
.restaureScrollProtocolesListeProduits #divProduits2 .vignette {
    margin: 0;
}
.conteneurOptionsImpressionProtocoles {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    max-width: 580px;
}
.conteneurOptionsImpressionProtocoles input[type=checkbox] + label:not(:last-child) {
    width: 83px;
}

.imgPopupOutilsEchantillons {
    /*height: 500px;*/  /* height permet à la popover de bien se positionner */
    max-width: 500px;
    max-height: 500px;
    object-fit: contain;
}
/*.divPopoverOutilsEchantillons div {
    max-width: 500px;
}*/

/*------------------------------------------- Dispositifs médicaux ---------------------------------------------------------*/
.md {
    position: fixed;
    z-index: 1;
    right: 0px;
    bottom: 0px;
    background-color: white;
    font-size: 13px;
    padding-left: 10px;
    display: flex;
    align-items: center;
}
.md img {
    height: 20px;
}
.dispositifsMedicaux {
    width: 988px;
    height: 62px; /* Il faut définir la largeur et le hauteur pour que le placement de la popover soit correct dès le 1er chargement */
}

/*------------------------------------------- Stats ---------------------------------------------------------*/
.grilleStats td, .grilleStats th {
    border: 1px solid #d5d5d5;
    border-radius: 0px !important;
}
.grilleStats th.enTeteStats {
    /*border-top: 6px solid #1D388B;*/
    background-color: #1D388B;
    color: white;
}
.grilleStats td:first-child {
    color: #696969;
}


/*------------------------------------------- Plans d'activation ---------------------------------------------------------*/
.planActivation {
    width: 1260px;
}
.planActivation .cycles, .planActivation .enTeteMois {
    padding-left: 200px;
    font-size: 13px;
    display: table; /* Pas réussi à faire fonctionner correctement avec flex et flex-grow */
    width: 100%;
}
.planActivation .cycles div:not(:first-child) {
    border-left: 2px solid white;
}
.planActivation .cycles div:not(:last-child) {
    border-right: 2px solid white;
}
.planActivation .cycles div {
    background-color: #f2f2f2;
    color: black;
    padding: .25rem 0;
    text-align: center;
    font-weight: 600;
    display: table-cell;
}
.planActivation .enTeteMois &gt; div {
    display: table-cell;
    /*background-color: #f2f2f2;*/
}
.planActivation .enTeteMois .mois {
    padding: .25rem 0;
    text-align: center;
    color: #696969;
    /*font-weight: 600;*/
}
/*.planActivation .enTeteMois &gt; div:not(:first-child) .mois {
    border-left: 2px solid white;
}
.planActivation .enTeteMois &gt; div:not(:last-child) .mois {
    border-right: 2px solid white;
}*/
.planActivation .enTeteMois .separateurMois {
    position: absolute;
    height: calc(100% - 150px);
}
.planActivation .enTeteMois &gt; div:not(:first-child) .separateurMois {
    border-left: 1px dashed #DBDBDB;
}
.planActivation .aire {
    display: flex;
}
.planActivation .enTeteAire {
    width: 200px;
    display: flex;
    justify-content: space-between;
    padding: 5px 10px 5px 0px;
}
.planActivation .enTeteAire3 {
    padding-bottom: 0px;
}
.planActivation .enTeteAire &gt; div {
    min-height: 125px;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    align-items: start;
    padding: 10px;
}
.planActivation .enTeteAire.enTeteAire0 &gt; div, .planActivation .activation.activation0, .planActivation .activation.activation0 .titreActivation {
    background-color: #eaf0f8 !important;
}
.planActivation .enTeteAire.enTeteAire1 &gt; div, .planActivation .activation.activation1, .planActivation .activation.activation1 .titreActivation {
    background-color: #f0f3e7 !important;
}
.planActivation .enTeteAire.enTeteAire2 &gt; div, .planActivation .activation.activation2, .planActivation .activation.activation2 .titreActivation {
    background-color: #ebf6f8 !important;
}
.planActivation .enTeteAire.enTeteAire3 &gt; div, .planActivation .activation.activation3, .planActivation .activation.activation3 .titreActivation {
    background-color: #fbf2e9 !important;
}
.planActivation .enTeteAire &gt; .boutonRond {
    align-self: center;
    margin-left: 10px;
    border-color: #003A81;
    background-color: #003A81;
    color: white;
}
.planActivation .enTeteAire.enTeteAire1 &gt; .boutonRond {
    border-color: #749517;
    background-color: #749517;
}
.planActivation .enTeteAire.enTeteAire2 &gt; .boutonRond {
    border-color: #00ABBD;
    background-color: #00ABBD;
}
.planActivation .enTeteAire.enTeteAire3 &gt; .boutonRond {
    border-color: #E07D0A;
    background-color: #E07D0A;
}
.planActivation .enTeteAire h3 {
    font-size: 18px;
    font-weight: 600;
    margin-top: 0;
    margin-bottom: 5px;
}
.planActivation .enTeteAire.enTeteAire0 h3 {
    color: #003A81;
}
.planActivation .enTeteAire.enTeteAire1 h3 {
    color: #749517;
}
.planActivation .enTeteAire.enTeteAire2 h3 {
    color: #00ABBD;
}
.planActivation .enTeteAire.enTeteAire3 h3 {
    color: #E07D0A;
}
.planActivation .enTeteAire &gt; div img {
    max-height: 20px;
    margin-top: 5px;
}
.planActivation .conteneurActivations {
    flex-grow: 1;
    flex-shrink: 1; /* Vu sur MOUYSSET MEDICAL ORTHOPEDIE 83 */
    display: flex;
    flex-direction: column;
    row-gap: 10px;
    padding: 10px 0;
}
.planActivation .aire:not(:last-child) .conteneurActivations {
    border-bottom: 2px solid #DBDBDB;
}
.planActivation .conteneurActivations &gt; div {
    display: flex;
    align-items: start;
}
.planActivation .activation {
    border-radius: 5px;
    padding: 10px 5px 5px 5px;
    box-shadow: 0px 4px 4px #1D388B40;
    font-size: 12px;
    text-align:center;
    position: relative;
    margin-top: 10px;
}
.planActivation .bordureActivation {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    border-radius: 10px;
    height: 5px;
}
.planActivation .activation0 .bordureActivation {
    background-color: #003A81 !important;
}
.planActivation .activation1 .bordureActivation {
    background-color: #749517 !important;
}
.planActivation .activation2 .bordureActivation {
    background-color: #00ABBD !important;
}
.planActivation .activation3 .bordureActivation {
    background-color: #E07D0A !important;
}
.planActivation .titreActivation {
    font-weight: 600;
}
.planActivation .descriptionActivation {
    max-height: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
}
.planActivation .dateActivation {
    position: absolute;
    font-size: 10px;
    color: #696969;
    top: -15px;
    background-color: white !important;
}


/*------------------------------------------- Conditions revendeurs ---------------------------------------------------------*/
.conditionsRevendeurs &gt; tbody &gt; tr:first-child th:not(.enTeteConditionsRevendeurs) {
    height: 32px;
    font-size: 16px;
    text-align: center;
    font-weight: 600;
}
.conditionsRevendeurs .enTeteConditionsRevendeurs {
    border-top: 1px solid #DBDBDB;
    vertical-align: top;
}
.conditionsRevendeurs th.enTeteConditionsRevendeurs {
    color: #696969;
    font-size: 16px;
}
.conditionsRevendeurs td.enTeteConditionsRevendeurs {
    font-weight: 600;
}
.conditionsRevendeurs tr:first-child th.incontinence {
    border-top: 6px solid #4680c6;
}
.conditionsRevendeurs tr:first-child th.incontinence, .conditionsRevendeurs tr:first-child th.incontinence a {
    color: #4680c6 !important;
}
.conditionsRevendeurs tr:first-child th.medical {
    border-top: 6px solid #749517;
}
.conditionsRevendeurs tr:first-child th.medical, .conditionsRevendeurs tr:first-child th.medical a {
    color: #749517 !important;
}
.conditionsRevendeurs:not(.detailsCARevendeurs) th {
    position: inherit;
}
.conditionsRevendeurs.detailsCARevendeurs tr:first-child th {
    position: inherit;
}
.conditionsRevendeurs td {
    vertical-align: top;
    padding: 10px 15px;
}
.conditionsRevendeurs.detailsCARevendeurs td {
    padding: 5px 15px;
}
.conditionsRevendeurs tr:nth-child(even) {
    background-color: #F2F2F2;
}
.conditionsRevendeurs .bordureGauche {
    border-left: 1px solid #DBDBDB;
}
.conditionsRevendeurs td.incontinence {
    background-color: rgba(70, 128, 198, 0.12);
}
.conditionsRevendeurs td.medical {
    background-color: rgba(116, 149, 23, 0.11);
}
.conditionsRevendeurs .nMoinsUn {
    padding-top: 10px;
    font-weight: normal;
}
.conditionsRevendeurs tr.totalConditions td {
    font-weight: 600;
    border-bottom: 2px solid #DBDBDB;
}
.conditionsRevendeurs .material-icons-round {
    vertical-align: text-top;
}
.conditionsRevendeurs .plusMoins {
    position: inherit;
    margin-left: inherit;
    display: inline-block;
    width: 100%;
    padding-bottom: 50px;
    background-position-y: calc(100% - 0.5px);
    background-size: 23px 23px;
}
.conditionsRevendeurs tr.categorie .plusMoins {
    text-decoration: underline !important;
}
.conditionsRevendeurs tr.categorie {
    font-weight: 600;
    position: relative;
}
.conditionsRevendeurs tr.categorie.categorieEven {
    background-color: #F2F2F2;
}
.conditionsRevendeurs tr.denomination &gt; td &gt; span {
    margin-left: 30px;
}
tr.separateurconditionsRevendeurs &gt; td {
    height: 45px;
}
.conditionsRevendeurs td.remisesRevendeurs {
    padding: 0px !important;
}
.conditionsRevendeurs tr:nth-child(even).conditions, .conditionsRevendeurs tr:nth-child(even).separateurConditionsRevendeurs {
    background-color: #FFFFFF !important;
}
td.remisesRevendeurs {
    border-top: 6px solid #4680c6 !important;
}
td.remisesRevendeurs + td.remisesRevendeurs {
    border-top: 6px solid #749517 !important;
}
td.remisesRevendeurs table, td.remisesRevendeurs table td:last-child {
    width: 100%;
}
td.remisesRevendeurs table td {
    padding-top: 5px !important;
    padding-bottom: 5px !important;
}
.conditionsRevendeurs .remise {
    display: inline-block;
    min-width: 40px;
    padding-right: 10px;
}
.listeRemises div {
    font-weight: 400;
}
.listeRemises div:not(:first-child) {
    margin-top: 10px;
}
.detailsCARevendeurs tr:not(.categorie) td:first-child a {
    display: none
}
.detailsCARevendeurs tr.categorie td:first-child span {
    display: none;
}

.exportHCTI {
    display: none !important;
}

.masqueBoutonChatbot {
    position: absolute !important;
    top: -37px !important;
    right: 15px !important;
    font-size: 24px !important;
    color: black !important;
    opacity: 0.5 !important;
}

/*----------------------------------------------------------- AjaxControlToolkit ------------------------------------------------------*/
.modalBackground {
	background-color: gray;
	filter: alpha(opacity=50);
	opacity: 0.5;
}
td.ajax__combobox_buttoncontainer button {
    background-color: unset;
    border: none;
    background-image: url("../Images/icnArrowBlue.svg");
}
.ajax__fileupload_dropzone {
    color: #696969;
}

/*----------------------------------------------------------- Bootstrap ------------------------------------------------------*/
.modal {
    text-align: center;
}
.modal-open  .modal {
    overflow-x: auto;
}
.modal-dialog {
    max-width: 100%;
    margin-left: 0px; /* Remplacement des margin par des padding pour faire fonctionner max-width: 100% */
    margin-right: 0px;
    padding-left: 28px; 
    padding-right: 28px;
    display: inline-flex;
}
.modal-backdrop {
    width: 100%; /* Pour faire fonctionner le zoom */
    height: 100%; /* Pour faire fonctionner le zoom */
}
.btn-close {
    position: absolute;
    z-index: 1;
    right: 10px;
    top: 10px;
/*    height: 24px;
    width: 24px;*/
}
.popover {
    max-width: none;
    font-family: Asap;
    z-index: 10002; /* Pour les popover dans des AjaxControlToolkit ModalPopup */
    --bs-popover-body-padding-y: .5rem;
}
.popover-body, .popover-body *:not(.texteGris) {
    font-weight: 500;
}
.popover-body .tableau &gt; tbody &gt; tr &gt; td:nth-child(odd):not(.text-left):not(.text-center) {
    font-weight: normal;
}
.popover.sousMenu {
    border-left: 1px solid #DBDBDB;
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
    overflow: hidden;
}
.popover.sousOnglet {
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
    overflow: hidden;
}
.popover.sousMenu .popover-body, .popover.sousOnglet .popover-body {
    display: flex;
    flex-direction: column;
    padding: 0px;
    color: #696969;
}
.popover.sousMenu a, .popover.sousOnglet a {
    padding: 15px 20px;
    font-weight: normal;
}
.menu a[aria-describedby], .onglet[aria-describedby] {
    background-color: #f8f9fa;
    color: #0056b3;
}
.popover.sousMenu .sousMenuSelectionne, .popover.sousOnglet .sousOngletSelectionne {
    color: #1D388B;
    font-weight: 600;
}
.popover.poubelle {
    border: none;
}
.dropdown-item:hover:not(:active) {
    color: #0056b3;
}
nav {
    padding-right: 20px; /* Pour que le rectangle en-dessous dépasse */
}
.nav-tabs {
    border-bottom: none;
    flex-wrap: nowrap;
}
.nav-tabs .nav-link {
    color: #696969;
    text-align: center;
    border-radius: 0px;
    border: none;
    padding: 10px 20px;
    border-top: 6px solid #F2F2F2;
}
.nav-tabs .nav-link:hover {
    border-top: 6px solid #f8f9fa;
    background-color: #f8f9fa;
    color: #0056b3;
}
.nav-tabs .nav-link.active:not(:hover) {
    color: #003A81;
}
.nav-tabs .nav-link.active  {
    background-color: white;
    font-weight: bold;
    border-top-color: #1D388B;
}

.nav-tabs .nav-link.scenario1 {
    border-color: rgba(70, 128, 198, 0.25);
}
.nav-tabs .nav-link.active.scenario1 {
    border-color: #4680c6;
    color: #4680c6;
}
.separateur.scenario1 {
    background-color: #4680c6;
}
.rectangleGris.scenario1, .grilleRatios.scenario1 tr, .grilleRatios td.scenario1, .grille.scenario1 tr:nth-child(even) {
    background-color: rgba(70, 128, 198, 0.12);
}
.nav-tabs .nav-link.scenario2 {
    border-color: rgba(116, 149, 23, 0.25);
}
.nav-tabs .nav-link.active.scenario2 {
    border-color: #749517;
    color: #749517;
}
.separateur.scenario2 {
    background-color: #749517;
}
.rectangleGris.scenario2, .grilleRatios.scenario2 tr, .grilleRatios td.scenario2, .grille.scenario2 tr:nth-child(even) {
    background-color: rgba(116, 149, 23, 0.11);
}
.nav-tabs .nav-link.scenario3 {
    border-color: rgba(224, 125, 10, 0.25);
}
.nav-tabs .nav-link.active.scenario3 {
    border-color: #E07D0A;
    color: #E07D0A;
}
.separateur.scenario3 {
    background-color: #E07D0A;
}
.rectangleGris.scenario3, .grilleRatios.scenario3 tr, .grilleRatios td.scenario3, .grille.scenario3 tr:nth-child(even) {
    background-color: rgba(224, 125, 10, 0.1);
}
.nav-tabs .nav-link.scenario4 {
    border-color: rgba(0, 171, 189, 0.25);
}
.nav-tabs .nav-link.active.scenario4 {
    border-color: #00ABBD;
    color: #00ABBD;
}
.separateur.scenario4 {
    background-color: #00ABBD;
}
.rectangleGris.scenario4, .grilleRatios.scenario4 tr, .grilleRatios td.scenario4, .grille.scenario4 tr:nth-child(even) {
    background-color: rgba(0, 171, 189, 0.1);
}
.tab-content &gt; .active { /* Pour IE */
    display: flex;
    flex-direction: column;
}

.modal-content img {
    max-width: 100%;
    /*max-height: 100%;*/
    max-height: calc(100vh - 4rem);
    object-fit: contain;
}
/*.carousel:not(.carouselSansControle) {
    padding-bottom: 50px;
}
.carousel-control-prev, .carousel-control-next {
    height: 50px;
    top: inherit;
    bottom: 0px;
    color: black;
}
.carousel-control-prev-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%2300ABBD' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath d='M5.25 0l-4 4 4 4 1.5-1.5L4.25 4l2.5-2.5L5.25 0z'/%3e%3c/svg%3e");
}
.carousel-control-next-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%2300ABBD' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath d='M2.75 0l-1.5 1.5L3.75 4l-2.5 2.5L2.75 8l4-4-4-4z'/%3e%3c/svg%3e");
}
.carousel-indicators li {
    background-color: #00ABBD;
}*/
.carousel-inner {
    width: inherit; /* fonctionne en enlevant la class slide du carousel */
}
.carousel-control-next, .carousel-control-prev {
    width: 2rem;
}
.carousel-indicators {
    margin-bottom: 0;
}
.carousel-indicators [data-bs-target] {
    border-bottom: none;
}

/*----------------------------------------------------------- Report Viewer ------------------------------------------------------*/
/*.MSRS-RVC,.MSRS-RVC div,.MSRS-RVC dl,.MSRS-RVC dt,.MSRS-RVC dd,.MSRS-RVC ul,.MSRS-RVC ol,.MSRS-RVC li,.MSRS-RVC h1,.MSRS-RVC h2
    ,.MSRS-RVC h3,.MSRS-RVC h4,.MSRS-RVC h5,.MSRS-RVC h6,.MSRS-RVC pre,.MSRS-RVC code,.MSRS-RVC form,.MSRS-RVC fieldset
    ,.MSRS-RVC legend,.MSRS-RVC input,.MSRS-RVC textarea,.MSRS-RVC select,.MSRS-RVC p,.MSRS-RVC blockquote,.MSRS-RVC th,.MSRS-RVC td
    ,.MSRS-RVC a,.MSRS-RVC a:visited,.MSRS-RVC span,.MSRS-RVC img {
    font-size:inherit;
    font-family:inherit;
}
.MSRS-RVC a:hover,.MSRS-RVC a:active {
    text-decoration: none !important;
}*/
.MSRS-RVC, .MSRS-RVC &gt; table { /* Code qui marche avec SizeToReportContent="true" */
    min-width: 754px; /* Min Suivi des achats portrait */
    min-height: 200px;
}
.MSRS-RVC * {
    line-height: normal;
}
/*img[title$='GraphiqueReportViewer'] {
    height:auto !important;
    width:auto !important;
    min-width:0 !important;
}*/
/*.msrs-printdialog-overlay {
    display: none !important;
}*/</pre></body></html>