@font-face {
	font-family: 'Roboto-Light';
	src: url('font/Roboto-Light.woff2') format('woff2'),
        url('font/Roboto-Light.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Roboto-Black';
	src: url('font/Roboto-Black.woff2') format('woff2'),
        url('font/Roboto-Black.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Roboto-Bold-condensed';
	src: url('font/robotocondensed-bold-webfont.woff2') format('woff2'),
        url('font/robotocondensed-bold-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}










html {
    height: 100%;
	font-family: 'Roboto-Light';
	font-size: 14px;
	line-height: 14px;
    font-weight:normal;
    
}
body {
    min-height: 95%;
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--colortheme);
    font-family: 'Roboto-Light';
    font-size: 14px;

}

::selection {
 color: #fff;
 background: #214070;
 }
::-moz-selection {
 color: #fff;
 background: #214070;
 }

.align-left {
    text-align : left;
}
.align-right {
    text-align: right;
}
.align-center {
    text-align: center;
}
.espace30 {
    padding-top: 30px;
}
.marges20 {
    margin: 20px;
}
.margescote20 {
    margin: 0 20px ;
}
.margescote5{
    margin-right: 5px;
}
.margin_top_20{
    margin-top: 20px;
}
.margin_top_moins20 {
    margin-top:-20px;
}
.image200 {
    width: 200px;
}
.image_h_300 {
    height: 300px;
}
.espace10 {
    padding : 10px;
}
.gras {
    font-weight: bold;
}
.font20 {
    font-size: 20px;
}
.font18 {
    font-size: 18px;
}

.largeur_220 {
    width: 220px;
}

.type_lien {
    cursor: pointer;
}
.lien {
    text-decoration: none;
    color: white;
}

.fenetre_masque {
    position : absolute;
    z-index : 1000;

    display : none;
    justify-content: flex-start;
    flex-direction: column;
    align-items: flex-start;
    border : 1px solid black;
    border-radius: 8px;
    padding : 20px;

    background: linear-gradient(90deg, rgba(50,50,50,0.7) 0%,  rgba(50,50,50,0.7) 100%),
                linear-gradient(90deg, var(--colortheme) 0%,  var(--colortheme) 100%);

    font-family: 'Roboto-Light';
    font-size: 16px;

    -webkit-box-shadow: 0px 0px 600px 56px rgba(0,0,0,0.8);
    -moz-box-shadow: 0px 0px 600px 56px rgba(0,0,0,0.8);
    box-shadow: 0px 0px 98px 600px rgba(0,0,0,0.8);

}
/* ============================================================ */
/* TABLEAU STD */
.tableau_STD {
    width : 100%;
    border : 1px solid rgba(0,0,0,0.5);
    border-collapse: collapse;
}
.tableau_STD_ligne {
    border : 1px solid rgba(255,255,255,0.3);
}
.tableau_STD td {
    padding: 8px;
}
.tableau_STD_ligne:hover{
    background-color: rgba(255,255,255,0.2);
}
.tableau_STD_ligne_premiere {
    background-color: rgba(0,0,0,0.5);
    font-weight : bold;
    text-transform: uppercase;
}
.tableau_STD_coul_red {
    background-color: rgba(255,0,0,0.1);
}
.tableau_STD_coul_orange {
    background-color: rgba(255,255,0,0.1);
}
.tableau_STD_ligne_total {
    background-color: rgba(0,0,0,0.1);
    font-weight : bold;
    text-transform: uppercase;
    border : 1px solid rgba(255,255,255,0.3);
}

/* ============================================================ */
/* FILTRES */
#Ligne_Filtres {
    padding: 20px;
    background-color: rgba(0,0,0,0.15);
    border : 1px solid rgba(255,255,255,0.4);
    color : white;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}
#Ligne_Filtres a{
    margin-left : 50px;
    text-transform: uppercase;
    font-weight: bold;
    padding : 8px;
}
#Ligne_Filtres > * {
    margin-top: 5px;
    margin-bottom: 5px;

}

/* ================================================== */
/* SWITCH CHECKBOX CSS */
    /* The switch - the box around the slider */
    .switch {
        position: relative;
        display: inline-block;
        width: 60px;
        height: 34px;
    }

    /* Hide default HTML checkbox */
    .switch input {
        opacity: 0;
        width: 0;
        height: 0;
    }

    /* The slider */
    .slider {
        position: absolute;
        cursor: pointer;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background-color: rgba(0,0,0,0.5);
        -webkit-transition: .4s;
        transition: .4s;
    }

    .slider:before {
        position: absolute;
        content: "";
        height: 26px;
        width: 26px;
        left: 4px;
        bottom: 4px;
        background-color: white;
        -webkit-transition: .4s;
        transition: .4s;
    }

    input:checked + .slider {
        background-color: rgba(78,145,190,1);
    }

    input:focus + .slider {
        box-shadow: 0 0 1px rgba(78,145,190,1);
    }

    input:checked + .slider:before {
        -webkit-transform: translateX(26px);
        -ms-transform: translateX(26px);
        transform: translateX(26px);
    }

    /* Rounded sliders */
    .slider.round {
        border-radius: 34px;
    }

    .slider.round:before {
        border-radius: 50%;
    }
    .switchTxt {
        margin-left : 80px;
        line-height: 34px;
        width : 400px;
    }
    .switchTxt_small {
        margin-left : 80px;
        line-height: 34px;
        width : 150px;
    }



/* ============================================================ */
/* FENETRE PRINCIPALE */
      #fenetre_principale {    
          display: flex;
          
          flex-wrap: wrap;
          align-items: stretch;
          /*flex-direction: column;*/
          /*background: rgba(0,0,0, 0.1);*/

          /*border : 1px solid rgba(0,0,0, 0.2);*/
          width : 100%;
          min-height : calc(100vh - 120px );/*350*/
          margin-left : 200px;
          margin-top : 90px;
      }
      #fenetre_identification fieldset{
          width : 400px;
          height : 150px;
          background: rgba(0,0,0, 0.3);
          border-radius: 12px;
          border : 1px solid white;
          margin-top : -80px;
          margin-left : -200px;
      }
      #fenetre_identification legend{
        background: rgba(0,0,0, 0.8);
          padding : 8px;
          border-radius : 4px;
      }
      #fenetre_identification {
          margin : auto auto;
          color : white;
          text-align : center;
          height : 150px;
      }
      #fenetre_identification input{
          border : 1px solid rgba(255,255,255, 0.6);
          background : rgba(255,255,255, 0.4);
          padding : 5px;
          margin : 10px;
          color : white;
      	font-family: 'Roboto-Light';
      	font-size: 16px;
      }
      .erreur {
          color : red;
      }
        #fenetre_identification #version {
            margin-top : 5px;
            font-size : 9px;
            color : white;
        }
/* ============================================================ */
/* MENU */
      #menubar {
          background:rgba(0,0,0, 0.75) ;
          width: 200px;
          display: flex;
          flex-direction: column;
          align-items: center;
          position : fixed;
          top:0px;
          left:0px;
          height :100vh;
          overflow-y: auto;

      }
      #menubar #logo{
          margin-top : 30px;
      }
      #menubar #version {
          margin-top : 5px;
          font-size : 9px;
          color : white;
      }
      #menubar #version a{
          text-decoration : none;
          color : white;
      }
      #nom_etablissement {
          color : white;
          padding : 10px;
          background : rgba(255,255,255, 0.1);
          margin-top : 10px;
          border-top : 1px solid rgba(255,255,255, 0.15);
          border-bottom : 1px solid rgba(255,255,255, 0.15);
          width : calc(100% - 20px);
          text-align : center;
      }
      #menubar #menubarMenu {
          list-style: none;
          display: flex;    
          justify-content: flex-start;
          flex-direction : column;
          align-items: center;
          padding-left : 0;
      }
      
      #menubar li {
          margin : 5px 0;
          display: flex;    
          justify-content: flex-start;
          flex-direction : column;
          align-items: center;
          width : 200px;
          transition: 0.2s;

      }
        #menubar li:hover {
            background: rgba(255,255,255, 0.1);
        }
      #menubarMenu li a {
          margin : 5px;
          display: flex;
          justify-content: flex-start;
          flex-direction : row;
          align-items: center;
          width : 150px;

      }
        #menubarMenu li a img{

        }
        .menubarImageConteneur {
            width : 32px;
            height : 30px;
            overflow : hidden;
            text-align: center;
            margin-right : 10px;
        }
      #menubar #menubarMenu li a{
          padding : 10px;
          text-decoration : none;
          color: white;
          mix-blend-mode: difference;

      }
      .menuShadow a{
          filter: invert(0.6) light(50%);
      }
      /* pour les menus des pages */
      .sous_menu_large {
         display : flex;
         flex-direction: row;
         flex-wrap: wrap;
         align-items: center;
         justify-content: center;
      }

/* ============================================================  */
/* FENETRE DROITE */
      #cadre_droite {
          width : 100%;
          display: flex;
          justify-content: flex-start;
          flex-direction : column;
          align-items: center;



      }
/* ============================================================ */
/* USERBAR */
      #userbar {
          background: rgba(0,0,0, 0.75);
          -webkit-box-shadow: inset 7px 0px 10px 0px rgba(0,0,0,1);
          -moz-box-shadow: inset 7px 0px 10px 0px rgba(0,0,0,1);
          box-shadow: inset 7px 0px 10px 0px rgba(0,0,0,1);

          width: calc(100% - 200px) ;/*on enleve la largeur de la menubar */
          height : 90px;
          border-bottom: 1px solid rgba(255,255,255,0.2);
          display: flex;
          justify-content: space-between;
          flex-direction : row;
          align-items: center;
          color : white;
          position : fixed;
          top:0px;
          left:0px;
          margin-left: 200px;
          overflow-y: auto;
          z-index : 50000;
      }
      
      #userInfo {
          display: flex;
          justify-content: flex-end;
          flex-direction : row;
          align-items: center;
          margin-right : 30px;
      }
      #userPhoto {
          overflow:hidden;
          -webkit-border-radius:50px;
          -moz-border-radius:50px;
          border-radius:50px;
          width:65px;
          height:65px;
          border : 1px solid rgba(255,255,255,0.6);
          z-index : 100;
      }
        #userPhoto_prev {
            overflow:hidden;
            -webkit-border-radius:50px;
            -moz-border-radius:50px;
            border-radius:50px;
            width:65px;
            height:65px;
            border : 1px solid rgba(255,255,255,0.6);
            z-index : 100;
        }

      #userNotification_and_message {
          width : 240px;
          height : 40px;
          margin-left : -20px;
          background: rgba(255,255,255,0.1);
          display: flex;
          justify-content: flex-end;
          align-items: center;
          color : white;
          -webkit-border-radius:10px;
          -moz-border-radius:10px;
          border-radius:10px;    
          z-index : 90;    
      }
      #userNotification_and_message #userNotification {
          width : 60px;
          text-align : center;  
          display: flex;
          justify-content: center;
          align-items: center;
          
      }
      #userNotification_and_message #userNotification img{
          margin-right : 5px;        
      }
      
      #userNotification_and_message #userMessage span{
          width : 60px;
          text-align : center;
          margin-right : 10px;
          display: flex;
          justify-content: center;
          align-items: center;
          cursor : pointer;
      }
      #userNotification_and_message #userNotification span{
            width : 60px;
            text-align : center;
            margin-right : 10px;
            display: flex;
            justify-content: center;
            align-items: center;
            cursor : pointer;
      }

      #userNotification_and_message #userMessage img{
          margin-right : 5px;        
      }
        #userNotification_and_message #userOptions {
            width : 25px;
            text-align : center;
            margin-right : 20px;
            display: flex;
            justify-content: center;
            align-items: center;
            cursor: pointer;
        }
      
      
      #userStatusbar {
          margin-left : 33px;
      }


    #userDeconnection {
        margin-right : 20px;
      }
      #userDeconnection INPUT{
          padding : 0;
          background : none;
          border : none;
          font-size : 11px;    
          color : rgba(255,255,255,0.6);    
      }


      #userPanneauOptions {
          display: none;
          position : absolute;
          float : right;
          padding : 5px;
          border-radius : 10px;
          top:60px;
          right : 90px;
          border : 1px solid rgba(255,255,255,0.1);
          background: rgba(40,40,40,0.9);
          color : white;
          width : 155px;
          min-height : 155px;
          z-index : 50020;
          cursor : auto;
          font-size : 12px;
      }
/* ============================================================ */
/* FENETRE ENFANT */                 
      #fenetre_enfant {
          color : white; 
          padding: 10px;
          width : calc(100% - 20px); /*on enleve le padding */
          height: 100%;
      }
      .userPhoto_forlist {
          overflow:hidden;
          -webkit-border-radius:50px;
          -moz-border-radius:50px;
          border-radius:50px;
          width:30px;
          height:30px;
          border : 1px solid rgba(255,255,255,0.6);
          z-index : 100;
      }
      .message_alerte {
          color : red;
      }
      #notification_zone{
          width : 1px;
          height:1px;
          margin : 0 auto;
      }

/* ============================================================ */
/* FORMULAIRES */
        .Formulaire INPUT{
            border : 1px solid rgba(255,255,255, 0.1);
            background : rgba(0,0,0, 0.5);
            padding : 5px;
            color : white;
            font-family: 'Roboto-Light';
            font-size: 16px;
            border-radius: 4px;
            -webkit-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
            -moz-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
            box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
        }

        .Formulaire INPUT:disabled {
            color : rgba(255,255,255,0.4);
        }

        .Formulaire TEXTAREA{
            border : 1px solid rgba(255,255,255, 0.1);
            background : rgba(0,0,0, 0.5);
            padding : 5px;
            color : white;
            font-family: 'Roboto-Light';
            font-size: 14px;
            border-radius: 4px;
            -webkit-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
            -moz-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
            box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
        }
        .Formulaire SELECT{
            border : 1px solid rgba(255,255,255, 0.1);
            background : rgba(0,0,0, 0.5);
            padding : 5px;
            color : white;
            font-family: 'Roboto-Light';
            font-size: 16px;
            min-width : 120px;
            border-radius: 4px;
            -webkit-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
            -moz-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
            box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
        }

        .Formulaire select option {
            background : rgba(0,0,0, 0.5);
            padding : 5px;
            color : white;
            font-family: 'Roboto-Light';
            font-size: 16px;

        }
        .Formulaire_titre_cadre {
            text-transform: uppercase;
            font-weight: bold;
            margin-bottom: 10px;
        }
        .FormulaireInput100p {
            width:100%;
        }
        .Zone_100p {
            width: calc(100% - 40px);
            margin-left : 40px;
        }

/* ============================================================ */
/* EN LIGNES - COLONNES */
        .en_lignes {
            display : flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
        }
        .en_colonne {
            display : flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
        }
        .sp_between, #Preferences_Formulaire_en_ligne_sp_between {
            justify-content: space-between;
        }
        .sp_around{
            justify-content: space-around;
        }
        .justy_left{
            justify-content: flex-start;
        }
        .justy_right{
            justify-content: flex-end;
        }
        .stretch {
            align-items: stretch;
        }
        #flex_align_top {
            align-items: flex-start;
        }

/* ============================================================ */
/* SPIN */
.loader {
    margin-left: 5px;
    width: 18px;
    aspect-ratio: 1;
    border-radius: 50%;
    border: 2px solid #fff;
    animation:
            l20-1 0.8s infinite linear alternate,
            l20-2 1.6s infinite linear;
}
@keyframes l20-1{
    0%    {clip-path: polygon(50% 50%,0       0,  50%   0%,  50%    0%, 50%    0%, 50%    0%, 50%    0% )}
    12.5% {clip-path: polygon(50% 50%,0       0,  50%   0%,  100%   0%, 100%   0%, 100%   0%, 100%   0% )}
    25%   {clip-path: polygon(50% 50%,0       0,  50%   0%,  100%   0%, 100% 100%, 100% 100%, 100% 100% )}
    50%   {clip-path: polygon(50% 50%,0       0,  50%   0%,  100%   0%, 100% 100%, 50%  100%, 0%   100% )}
    62.5% {clip-path: polygon(50% 50%,100%    0, 100%   0%,  100%   0%, 100% 100%, 50%  100%, 0%   100% )}
    75%   {clip-path: polygon(50% 50%,100% 100%, 100% 100%,  100% 100%, 100% 100%, 50%  100%, 0%   100% )}
    100%  {clip-path: polygon(50% 50%,50%  100%,  50% 100%,   50% 100%,  50% 100%, 50%  100%, 0%   100% )}
}
@keyframes l20-2{
    0%    {transform:scaleY(1)  rotate(0deg)}
    49.99%{transform:scaleY(1)  rotate(135deg)}
    50%   {transform:scaleY(-1) rotate(0deg)}
    100%  {transform:scaleY(-1) rotate(-135deg)}
}

/* ============================================================ */
/* ============================================================ */
/* Accueil */
    #Tableau_accueil {
        display: flex;
        width : 100%;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: stretch;
        justify-content: space-around;
    }
    .Accueil_cadre {
        padding : 20px;
        background : rgba(0,0,0, 0.2);
        font-family: 'Roboto-Light';
        margin : 5px;
        color : white;
    }
    .Accueil_cadre_titre {
        font-family: 'Roboto-Bold-condensed';
        font-size: 16px;
        width: 100%;
        padding-bottom : 5px;
        border-bottom: 1px solid white;
        margin-bottom: 10px;
    }
    .Accueil_ligne_info {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        margin-top: 2px;
    }
    .Accueil_ligne_space {
        height: 10px;
    }
    .Accueil_liste {
        margin-left : 10px;
    }
    #Accueil_RDV {
        width : 330px;
    }
    #Accueil_Chiffres_Ventes {
        width : 350px;
    }
    #Accueil_Chiffres_Equipe {
        width : 820px;
    }
    #Accueil_Chiffres_Equipe_tableau_overflow, #Accueil_Chiffres_client_tableau_overflow {
        height : 250px;
        overflow-y : scroll;
    }
    #Accueil_Chiffres_Objectifs{
        width : 340px;
    }
    #Accueil_Chiffres_stock{
        width : 400px;
    }
    #Accueil_Chiffres_bon_cadeau {
        width : 1200px;
    }
    #Accueil_Chiffres_bon_cadeau_tableau {
        width : 1200px;
    }
    #Accueil_Chiffres_mode_paiement {
        width : 350px;
    }
    #Accueil_Chiffres_clients {
        width : calc(100% - 60px);
    }
    #blocNote {
        text-align: center;
        margin-top : 20px;
    }

/* ============================================================ */
/* CALENDRIER */                 
      #calendrier_today_filtres {
          display: flex;
          justify-content: space-around;
          flex-direction : row;
          align-items: center;    
          width : 100%;
          height : 40px;
          padding : 10px 0;
          /*background-color : rgba(255,255,255,0.3);*/
          /*border : 1px solid rgba(255,255,255, 0.5);*/
          margin-bottom : 20px;  
      }
      #calendrier_today_filtres_jour {
          display: flex;
          justify-content: space-around;
          flex-direction : row;
          align-items: center;
      }
      #calendrier_today_filtres_jour div{
          border : 1px solid rgba(255,255,255, 0.1);
          background-color : rgba(0,0,0,0.75);
          padding : 10px;
      }
      #calendrier_today_filtres_jour img {
          margin : -5px 5px -2px 0;
          cursor : pointer;
      }
      .calendrier_vues a{
          border : 1px solid rgba(255,255,255, 0.1);
          background-color : rgba(0,0,0,0.75);
          padding : 10px;
          text-decoration: none;
          color: white;
      }
      #calendrier_vues_selected {
          background : rgba(78,145,190,1);
      }
     .ui-datepicker{z-index: 45000 !important}

      .Calendrier_horaire_ferme {
          background : rgba(100,0,0, 0.4);
      }

        #calendrier_staff_filtre_user{
            width : 200px;
        }
      #calendrier_staff_ou_cabine{
          width : 300px;
      }
      #calendrier_vue_globale_label {
          color: white;
          mix-blend-mode: difference;
          width : 100px;
      }
        #calendrier_info_divers{
            width : 500px;
        }
      .Calendrier_user_abscent {
          background-image: url("data:image/svg+xml,%3Csvg width='5' height='5' viewBox='0 0 6 6' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23700000' fill-opacity='0.9' fill-rule='evenodd'%3E%3Cpath d='M5 0h1L0 6V5zM6 5v1H5z'/%3E%3C/g%3E%3C/svg%3E");
          /* background-image: url("data:image/svg+xml,%3Csvg width='2' height='2' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23340303' fill-opacity='0.9' fill-rule='evenodd'%3E%3Ccircle cx='3' cy='3' r='3'/%3E%3Ccircle cx='13' cy='13' r='3'/%3E%3C/g%3E%3C/svg%3E"); */
          /*background-image: url("data:image/svg+xml,%3Csvg width='5' height='5' viewBox='0 0 6 6' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23000000' fill-opacity='0.9' fill-rule='evenodd'%3E%3Cpath d='M5 0h1L0 6V5zM6 5v1H5z'/%3E%3C/g%3E%3C/svg%3E");*/
          color : #214070;

      }
        .Calendrier_user_hors_contrat {


            background-image: url("data:image/svg+xml,%3Csvg width='10' height='10' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23270003' fill-opacity='0.4' fill-rule='evenodd'%3E%3Ccircle cx='3' cy='3' r='3'/%3E%3Ccircle cx='13' cy='13' r='3'/%3E%3C/g%3E%3C/svg%3E");


        }
        .calendrier_user_options {
            display:none;
            position : relative;
            margin-top: -120px;
            background : rgba(0,0,0,0.8);
            width: 250px;
            height: 120px;
            border-radius: 10px;
        }
        .calendrier_user_options input {
            border : 1px solid rgba(255,255,255,0.3);
        }
        .calendrier_user_options_bouton_fermer {
            width : 50px;
            line-height: 15px;
            color : white;
            border : 1px solid black;
            border-radius : 5px;
            background : rgba(0, 0, 0, 0.8);
            text-align : center;
            float : right;
            padding : 2px;
            cursor : pointer;
        }
    .calendrier_horaire_utilisateur_titre {
        line-height: 22px;
        padding :5px;
    }
      #calendrier_info_jour_ferme, #calendrier_info_client_selectionne_span {
          mix-blend-mode: difference;
      }

      .calendrier_scroll {
          position : relative;
          height : calc( 100vh - 260px );
          overflow-y : auto;
          overflow-x: hidden;
          border-bottom : 1px solid black;
      }
        #heure_en_cours {
            margin-left : -200px;
        }

      #calendrier_today_user_Calendrier_table, #calendrier_today_user_Calendrier_table_userlist {
          width : 100%;
          /*border : 1px solid white;*/
          border-collapse: collapse;
          table-layout: fixed;
      }
      .calendrier_today_user_Calendrier_user_nom{
          mix-blend-mode: difference;
      }
      #calendrier_today_user_Calendrier_table tr {
          height : 20px;
      }
      
      #calendrier_today_user_Calendrier_table td {
          /*border : 1px solid rgba(255,255,255, 0.5);*/
          transition: 0.15s;
      }
      .calendrier_today_user_Calendrier_ligne_normale{
          background: rgba(0,0,0,0.1);
      }
      .creneauHoraire {
          border : 1px solid rgba(255,255,255, 0.4);
          text-align : center;
      }
      #calendrier_today_user_Calendrier_table td:hover{
           background-color: rgba(255,255,255, 0.1);

      }
      .calendrier_today_user_Calendrier_table_td_hover{
           background-color: rgba(255,255,255, 0.3);
      }
      
      #calendrier_today_user_Calendrier_ligneTete {
          /*background-color : rgba(255,255,255,0.1);*/
          line-height : 50px;
      }
        #calendrier_today_user_Calendrier_ligneTete td{
         border : none;
        }
      #calendrier_today_user_Calendrier_ligneTete img {
          overflow:hidden;
          -webkit-border-radius:50px;
          -moz-border-radius:50px;
          border-radius:50px;
          width:40px;
          height:40px;
          border : 1px solid rgba(255,255,255,0.6);
          z-index : 100;
          vertical-align:middle;    
          margin-right : 10px;
      }
      .calendrier_today_user_Calendrier_colonne_heure{
          width : 50px;
          text-align : center;
          vertical-align : middle;
            background : var(--colortheme);
      }
      .calendrier_today_user_Calendrier__heure {
          mix-blend-mode: difference;
      }

      .rendezvous {
          width:calc(100% - 14px); /*on enleve la bordure gauche et le padding <!> Penser a aussi modifier dans le jquery */
          padding: 5px;
          line-height : 16px;
          overflow : hidden;
          border-radius: 6px;
      }
      
      .rendezvous_cols {
          display: flex;
          justify-content: flex-end;
          flex-direction : row;
          align-items: center;    
      }
      .handle_deplacer {
          cursor: grab;
      }
      .rendezvous_col_deplacer {    
          width : 20px;  
          padding-top : 0px;
          margin-top : -20px; 
         padding-right : 5px;   
      }
      .rendezvous_col_droite {    
          width : 20px;   
          padding-top : 0px;
          margin-top : -25px; 
          line-height : 10px;    
          font-family:Roboto-Black;
          cursor : auto;        
      }
      .rendezvous_col_droite span{
          cursor : pointer;
      }
      .rendezvous_col_gauche {    
          width : 100%;    
          cursor : auto;
          font-size : 12px;
      }
      .rendezvous_horaire {
          font-size : 9px;
      }
      .rendezvous_detail {    
          display : none;   
          position : relative;         
          float : right;
          padding : 5px;
          border-radius : 10px;
          margin-left : 160px;
          margin-top : -10px;
          border : 1px solid rgba(255,255,255,0.75);
          min-width : 155px;
          /*height : 160px;*/
          z-index : 6000;    
          cursor : auto;
          font-size : 12px;
          font-family:Roboto-Bold-condensed;
      } 
      .rendezvous_detail_accesSPA {
      	font-family: 'Roboto-Bold-condensed';
          color : white;
          background : rgba(0,0,0, 0.3);
          border : 1px solid rgba(0,0,0, 0.7);    
          border-radius : 3px;
          padding : 5px;
          margin : 5px;
      }
      .rendezvous_detail p{
          font-family:Roboto-Light;
          margin-top : 0px;
          height : 55px;
          overflow-y: auto;
      }
      .rendezvous_detail_bouton_fermer {
          width : 50px;
          border : 1px solid black;
          border-radius : 5px;
          background : rgba(0, 0, 0, 0.8);
          text-align : center;
          float : right;
          padding : 2px;    
          cursor : pointer;
      }
      .rendezvous_detail_bas_cadre {
          display: flex;
          justify-content: space-around; 
          flex-direction: row;    
          align-items: center;
          margin-top : 10px;
      }
      .rendezvous_detail_bouton_modifier {
          width : 50px;
          border : 1px solid black;
          border-radius : 5px;
          text-align : center;
          float : right;
          padding : 2px;    
          cursor : pointer;
      
      	-moz-box-shadow:inset 0px 1px 0px 0px #f9eca0;
      	-webkit-box-shadow:inset 0px 1px 0px 0px #f9eca0;
      	box-shadow:inset 0px 1px 0px 0px #f9eca0;
      	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f0c911), color-stop(1, #f2ab1e));
      	background:-moz-linear-gradient(top, #f0c911 5%, #f2ab1e 100%);
      	background:-webkit-linear-gradient(top, #f0c911 5%, #f2ab1e 100%);
      	background:-o-linear-gradient(top, #f0c911 5%, #f2ab1e 100%);
      	background:-ms-linear-gradient(top, #f0c911 5%, #f2ab1e 100%);
      	background:linear-gradient(to bottom, #f0c911 5%, #f2ab1e 100%);
      	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f0c911', endColorstr='#f2ab1e',GradientType=0);
      	background-color:#f0c911;
      	-moz-border-radius:5px;
      	-webkit-border-radius:5px;
      	border-radius:5px;
      	border:1px solid #e65f44;
      	color:#c92200;
      	text-decoration:none;
      	text-shadow:0px 1px 0px #ded17c;
      }
      .rendezvous_detail_maj_etat{    
          padding : 2px;
      	font-family: 'Roboto-Light';
      	font-size: 12px;
      }
      .rendezvousDRAG {
          width : 200px;
      }
      #CalendrierListeRendezVous {
          height : 1px;
          overflow:hidden;
      }
      #CalendrierListeEnCoursDeSaisie {
          height : 1px;
          overflow:hidden;
      }
      
      #CalendrierCreerRendezVous {
          display : none;
        
      }
      #heure_en_cours {
          height : 1px;
          background : rgba(255,0,0,0.8);
      }
      #heure_en_cours span {
        color:  rgba(255,0,0,0.8);
        font-size : 10px;

      }
      .Bouton_gris {
        background : rgba(0,0,0,0.9);
      	-moz-border-radius:6px;
      	-webkit-border-radius:6px;
      	border-radius:6px;
      	border:1px solid rgba(255,255,255,0.1);
      	display:inline-block;
      	cursor:pointer;
      	color:white;
      	font-size:12px;
      	font-family:Roboto;
      	padding:5px 15px;
      	text-decoration:none;

      }
      .Bouton_gris:hover {
          background : rgba(50,50,50,0.9);
      }
      .Bouton_gris:active {
      	position:relative;
      	top:1px;
      }
      
      .Bouton_vert {
      	-moz-box-shadow:inset 0px 1px 0px 0px #caefab;
      	-webkit-box-shadow:inset 0px 1px 0px 0px #caefab;
      	box-shadow:inset 0px 1px 0px 0px #caefab;
      	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #77d42a), color-stop(1, #5cb811));
      	background:-moz-linear-gradient(top, #77d42a 5%, #5cb811 100%);
      	background:-webkit-linear-gradient(top, #77d42a 5%, #5cb811 100%);
      	background:-o-linear-gradient(top, #77d42a 5%, #5cb811 100%);
      	background:-ms-linear-gradient(top, #77d42a 5%, #5cb811 100%);
      	background:linear-gradient(to bottom, #77d42a 5%, #5cb811 100%);
      	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#77d42a', endColorstr='#5cb811',GradientType=0);
      	background-color:#77d42a;
      	-moz-border-radius:6px;
      	-webkit-border-radius:6px;
      	border-radius:6px;
      	border:1px solid #268a16;
      	display:inline-block;
      	cursor:pointer;
      	color:#306108;
      	font-size:14px;
      	font-family:Roboto-Black;
      	padding:10px 30px;
      	text-decoration:none;
      	text-shadow:0px 1px 0px #aade7c;
          height : 50px;
          line-height : 50px;
          margin-left : 30px;
      }
      .Bouton_vert:hover {
      	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #5cb811), color-stop(1, #77d42a));
      	background:-moz-linear-gradient(top, #5cb811 5%, #77d42a 100%);
      	background:-webkit-linear-gradient(top, #5cb811 5%, #77d42a 100%);
      	background:-o-linear-gradient(top, #5cb811 5%, #77d42a 100%);
      	background:-ms-linear-gradient(top, #5cb811 5%, #77d42a 100%);
      	background:linear-gradient(to bottom, #5cb811 5%, #77d42a 100%);
      	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#5cb811', endColorstr='#77d42a',GradientType=0);
      	background-color:#5cb811;
      }
      .Bouton_vert:active {
      	position:relative;
      	top:1px;
      }
      .Bouton_orange {
      	-moz-box-shadow:inset 0px 1px 0px 0px #f9eca0;
      	-webkit-box-shadow:inset 0px 1px 0px 0px #f9eca0;
      	box-shadow:inset 0px 1px 0px 0px #f9eca0;
      	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f0c911), color-stop(1, #f2ab1e));
      	background:-moz-linear-gradient(top, #f0c911 5%, #f2ab1e 100%);
      	background:-webkit-linear-gradient(top, #f0c911 5%, #f2ab1e 100%);
      	background:-o-linear-gradient(top, #f0c911 5%, #f2ab1e 100%);
      	background:-ms-linear-gradient(top, #f0c911 5%, #f2ab1e 100%);
      	background:linear-gradient(to bottom, #f0c911 5%, #f2ab1e 100%);
      	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f0c911', endColorstr='#f2ab1e',GradientType=0);
      	background-color:#f0c911;
      	-moz-border-radius:6px;
      	-webkit-border-radius:6px;
      	border-radius:6px;
      	border:1px solid #e65f44;
      	display:inline-block;
      	cursor:pointer;
      	color:#c92200;
      	font-size:14px;
      	font-family:Roboto-Black;
      	padding:10px 30px;
      	text-decoration:none;
      	padding:6px 24px;
      	text-decoration:none;
      	text-shadow:0px 1px 0px #ded17c;
          height : 50px;
          line-height : 50px;
          margin-left : 30px;
          
      }
      .Bouton_orange:hover {
      	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f2ab1e), color-stop(1, #f0c911));
      	background:-moz-linear-gradient(top, #f2ab1e 5%, #f0c911 100%);
      	background:-webkit-linear-gradient(top, #f2ab1e 5%, #f0c911 100%);
      	background:-o-linear-gradient(top, #f2ab1e 5%, #f0c911 100%);
      	background:-ms-linear-gradient(top, #f2ab1e 5%, #f0c911 100%);
      	background:linear-gradient(to bottom, #f2ab1e 5%, #f0c911 100%);
      	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f2ab1e', endColorstr='#f0c911',GradientType=0);
      	background-color:#f2ab1e;
      }
      .Bouton_orange:active {
      	position:relative;
      	top:1px;
      }

    
    .Bouton_formulaire_annuler {
        background : rgba(180,180,180,1);
        border-radius:2px;
        border:1px solid rgba(0,0,0,0.25);
        cursor:pointer;
        color:white;
        font-size:14px;
        font-family:Roboto;
        padding:8px 20px;
        text-decoration:none;
        text-transform: uppercase;
    }
    .Bouton_formulaire_annuler:hover {
        background : rgba(50,50,50,0.8);
    }
    .Bouton_formulaire_annuler:active {
        position:relative;
        top:1px;
    }


    .Bouton_formulaire_valider {
        background : rgba(78,145,190,1);
        border-radius:2px;
        border:1px solid rgba(255,255,255,0.1);
        cursor:pointer;
        color:white;
        font-size:14px;
        font-family:Roboto;
        padding:8px 20px;
        text-decoration:none;
        text-transform: uppercase;
    }
    .Bouton_formulaire_valider:hover {
        background : rgba(31,62,83,0.8);
    }
    .Bouton_formulaire_valider:active {
        position:relative;
        top:1px;
    }
    .Bouton_formulaire_delete {
        background : rgba(148,0,0,1);
        border-radius:2px;
        border:1px solid rgba(255,255,255,0.1);
        cursor:pointer;
        color:white;
        font-size:14px;
        font-family:Roboto;
        padding:8px 20px;
        text-decoration:none;
        text-transform: uppercase;
    }
    .Bouton_formulaire_delete:hover {
        background : rgba(100,0,0,0.8);
    }
    .Bouton_formulaire_delete:active {
        position:relative;
        top:1px;
    }
    #Calendrier_prestation_recherche {
        width : 290px;
        margin-bottom: 5px;
    }

#CalendrierCreerRendezVousDiv {
        width : 100%;

    }
    #CalendrierCreerRendezVous_titre {
        font-family: 'Roboto-Light';

        text-align: center;
        font-size: 30px;
        padding: 20px 0;
        background-color: rgba(0,0,0,0.15);
        border : 1px solid rgba(255,255,255,0.4);
        color : white;

    }

      #CalendrierCreerRendezVous_Date {
          text-align: left;
          font-size: 20px;
          padding: 20px;
          background-color: rgba(0,0,0,0.15);
          border : 1px solid rgba(255,255,255,0.4);
          color : white;
      }
      
      #CalendrierCreerRendezVous_Heure {
      	font-size: 14px;
          text-align : left;
          padding-top : 15px;
      }
      
      #CalendrierCreerRendezVous_Parties {
          display: flex;
          justify-content: center;
          align-items: center;    
          flex-direction : row;
      }
      
      #CalendrierCreerRendezVous_PartieService {
          border : 1px solid rgba(255,255,255, 0.1);
          padding : 20px;
          background : rgba(0,0,0, 0.2);
      	font-family: 'Roboto-Light';
      	font-size: 16px;
          height : 700px;
          overflow-y : auto;
      }
      #CalendrierCreerRendezVous_PartieOptions {
          border : 1px solid rgba(255,255,255, 0.1);
          margin : 10px;
          padding : 20px;
          background : rgba(0,0,0, 0.2);
          font-family: 'Roboto-Light';
          font-size: 16px;
          height : 700px;
          overflow-y : auto;
      }
      #CalendrierCreerRendezVous_PartieClient {
          border : 1px solid rgba(255,255,255, 0.1);
          padding : 20px;
          background : rgba(0,0,0, 0.2);
      	font-family: 'Roboto-Light';
      	font-size: 16px;
          height : 700px;
          overflow-y : auto;
      }
      
      .CalendrierCreerRendezVous_Formulaire_Ligne {
          margin-top : 15px;
      }
      #CalendrierCreerRendezVous_Notes, #CalendrierCreerRendezVous_texte_mail {
          width : calc(100% - 10px);
      }
      #CalendrierCreerRendezVous_Liste_services {
          width : calc( 100% - 20px );
          background : rgba(0,0,0, 0.3);
          padding : 10px;
          display : flex;
          flex-direction: column;
          align-items: left;
          height : 650px;
          overflow-y : scroll;
      }
        #CalendrierCreerRendezVous_Liste_staff {
            width : calc( 100% - 20px );
            background : rgba(0,0,0, 0.3);
            padding : 10px;
            display : flex;
            flex-direction: column;
            align-items: left;
            height : 60px;
            overflow-y : scroll;
            width: 500px;
        }
      .CalendrierCreerRendezVous_famille {
          background : rgba(0,0,0,0.2);
          padding : 5px 0;
          border-bottom: 1px solid white;
          width : 100%;
      }

      .CalendrierCreerRendezVous_prestation_case, .CalendrierCreerRendezVous_staff_case {
          display: flex;
          flex-direction: row;
          justify-content: space-between;;
          align-items: right;
          padding : 6px 0px;
          min-height : 25px;
      }

        .CalendrierCreerRendezVous_prestation_case:hover,
        .CalendrierCreerRendezVous_staff_case:hover{
            background : rgba(255,255,255, 0.1);
        }
      .CalendrierCreerRendezVous_prestation_designation, .CalendrierCreerRendezVous_staff_designation {
          font-size : 14px;
          line-height: 14px;
      }
      .CalendrierCreerRendezVous_prestation_duree, .Client_tableau_vente_sousTexte {
          font-size : 10px;
          line-height: 10px;
          color : silver;
      }
      .panier_description {
          font-size : 10px;
          line-height: 10px;
      }
      .CalendrierCreerRendezVous_prestation_prix, .CalendrierCreerRendezVous_staff_photo {
          font-size : 14px;
      }


      .CalendrierCreerRendezVous_Client_autocompleteListe {
          background : red;
          color : green;
      	font-family: 'Roboto-Light';
      	font-size: 16px;
          
      }


      .CalendrierCreerRendezVous_ligneAvec_Image {
          display: flex;
          align-items: center;    
          flex-direction : row;    
      }
      .CalendrierCreerRendezVous_ligneAvec_Image img{
          margin : 0px 20px;
      }
      .CalendrierCreerRendezVous_tempsPreparation_affichage {
          padding : 20px 0;
          color : white;
          display: flex;
          align-items: center;    
          flex-direction : row;

      }
      .CalendrierCreerRendezVous_tempsPreparation_affichage img {
          padding-left : 15px;
      }
      #CalendrierCreerRendezVous_cabine {
          width : 500px;
      }
      #CalendrierCreerRendezVous_SPA {
          width : 100px;
      }
      #CalendrierCreerRendezVous_LigneClient{
          display: flex;    
          justify-content: flex-start;
          flex-direction : row;  
           align-items: center;
      }
      #CalendrierCreerRendezVous_LigneClient img {
          margin-left : 20px;
      }
      #CalendrierCreerRendezVous_LigneClient INPUT {
          width : 480px;
      }
      #CalendrierCreerRendezVous_Client_modifier {
          display : none;
      }
      #CalendrierCreerRendezVous_Client_infos, #Panier_detail_client {
          margin-top : 10px;
          padding : 10px;
      	font-family: 'Roboto-Light';
      	font-size: 12px;
          height : 420px;
      }
      .CalendrierCreerRendezVous_note_client {
          color : white;
      }
      .CalendrierCreerRendezVous_note_client_scroll {
          height: 60px;
          overflow-y: scroll;
          border : 1px solid rgba(255,255,255, 0.4);
      }
        .CalendrierCreerRendezVous_Formulaire_boutons {
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: flex-end;
            width : 100%;
            margin-left: 10px;
        }
        .CalendrierCreerRendezVous_Formulaire_boutons a {
            margin: 0px 10px;
        }

      #CalendrierCreerRendezVous_formulaire_bouton_modifier {
          display : none;
      }
      #CalendrierCreerRendezVous_formulaire_bouton_creer {
          display : block;
      }
      #CalendrierCreerRendezVous_formulaire_bouton_creer_meme_client {
          display : block;
       }
      .CalendrierCreerRendezVous_options {
          font-size: 12px;
          display: flex;
          flex-direction: row;
          align-items: center;
          justify-content: space-between;
          width: 100%;
          margin-bottom: 20px;
      }
        .CalendrierCreerRendezVous_options .switchTxt{
            width: 180px;
        }
        .CalendrierCreerRendezVous_options select{
            font-size : 12px;
        }
        #Calendrier_Listing {
            overflow-y: auto;
        }
        .calendrier_listing_date {
            margin-top : 15px;
            padding : 15px;
            width : clac(100% - 20px);
            background: rgba(0,0,0,0.7);
            font-weight : bold;
        }
        .calendrier_listing_date_aujourdhui {
            background: rgba(78,145,190,1);
        }
        .calendrier_listing_ligne_rendezvous{
            padding : 5px;
        }
        .calendrier_listing_temps_preparation {
            font-weight: bold;
        }

/* ============================================================ */
/* CLIENT / ARTICLES */
        .fenetre_form_client, .fenetre_form_articles {
            justify-content: flex-start;
            flex-direction: column;
            align-items: flex-start;
            border : 1px solid rgba(255,255,255,0.4);
            border-radius: 8px;
            padding : 20px;
            margin : 0 auto;
            background: rgba(0,0,0,0.15);

            font-family: 'Roboto-Light';
            font-size: 16px;
        }
        .fenetre_fiche_client{
            border-radius: 8px;
            padding : 20px;
            background-color: rgba(0,0,0,0.15);
            border : 1px solid rgba(255,255,255,0.4);
        }
        .fenetre_fiche_client_contenu {
            display: flex;
            flex-direction: row;
            align-items: flex-start;
            justify-content: center;
        }
        .fenetre_fiche_client_contenu_gauche {
            margin-right : 20px;
            margin-top : -10px;
        }
        .fenetre_fiche_client_contenu_droit {
            margin-left : 20px;
            padding : 20px;
            width : 100%;
        }
        .fenetre_fiche_client_partie_coordonnees {
            justify-content: flex-start;
            flex-direction: column;
            align-items: flex-start;
            padding : 20px;
            font-family: 'Roboto-Light';
            font-size: 16px;
        }
        .Client_fiche_dates {
            padding : 10px 0px;
            display : flex;
            justify-content: space-around;
            flex-direction: row;
            align-items: center;

        }
      #Client_CreerClient_Formulaire {
          width : 550px;
          height : 600px;
          top : calc(50% - 315px ) ;
          left : calc(50% - 260px);
      }
      .fenetre_form_articles {
          width : 850px;
          height : 600px;
          top : calc(50% - 315px ) ;
          left : calc(50% - 410px);
      }
      .fenetre_form_articles_edition {
          height : 530px;
      }
        .fenetre_form_articles_small_height {
            height : 230px;
        }
        .fenetre_form_articles_smalmedium_height {
            height : 420px;
        }
        .fenetre_form_articles_medium_height {
            height : 450px;
        }
      #Client_CreerClient_Formulaire_centered_content, #Article_Formulaire_centered_content{
          margin : 0 auto;
      }
      #Client_formulaire_bouton_modifier {
          display:none;
      }
      #Client_CreerClient_Formulaire_title, #Article_Formulaire_title {
          margin-bottom : 20px;
          width : calc(100% - 20px);
          text-align: center;
          font-size: 24px;
          font-family: 'Roboto-Light';
          padding : 10px;
          border-bottom: 1px solid white;

      }
      .Client_CreerClient_Formulaire_ligne, .articles_Formulaire_ligne, .Preferences_Formulaire_ligne_noBG {
          padding : 10px 0px;
          display : flex;
          justify-content: center;
          flex-direction: row;
          align-items: center;

      }
      .articles_Formulaire_ligne_justify_left {
          justify-content: left;
      }
        .articles_Formulaire_ligne_justify_right {
            justify-content: flex-end;
        }

      .articles_Formulaire_ligne_taxes {
          width : 360px;
          height: 80px;
          overflow-y : scroll;
          display : flex;
          flex-direction : column;
          align-self: flex-start;
          border : 1px solid rgba(0,0,0, 0.75);
          border-radius: 3px;
          background-color: rgba(0,0,0, 0.5);
          padding : 0px 20px;
      }

      .fenetre_articles_tableau_mouvements {
          width : 850px;
          height : 200px;
          background : rgba(0,0,0,0.4);
          padding : 20px;
          border-radius: 10px;
      }
      #fenetre_articles_tableau_mouvements_tableau{
            height : 150px;
          overflow-y: scroll;
      }
        .Client_CreerClient_Formulaire_inputL0 {
            width: 340px;
            margin-right : 20px;
        }
      .Client_CreerClient_Formulaire_inputL1 {
          width: 200px;
          margin-right : 20px;
      }
      .Client_CreerClient_Formulaire_inputL2 {
          width: 110px;
          margin-right : 20px;
      }
      .Client_CreerClient_Formulaire_inputL3 {
          width: 200px;
          margin-right : 10px;
      }
        .Client_CreerClient_Formulaire_inputL4 {
            width: 510px;
        }
      .Client_CreerClient_Formulaire_inputL5 {
          width: 155px;
          margin-right : 10px;
      }
      .Client_CreerClient_Formulaire_inputL5_nomargin {
          width: 155px;
      }
        .Client_CreerClient_Formulaire_inputL6 {
            width: 150px;
        }
        .Client_CreerClient_Formulaire_inputL7 {
            width: 165px;
            margin-right : 10px;
        }
        .Client_CreerClient_Formulaire_inputL7_nomargin {
            width: 165px;
        }
        .Client_CreerClient_Formulaire_boutons {
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: flex-end;
            width : 100%;
            margin-left: 14px;
        }
        .Client_CreerClient_Formulaire_boutons a {
            margin: 0px 10px;
        }
        .article_Formulaire_longueur_large, .preferences_Formulaire_longueur_large {
            width : 390px;
        }
        .select_Formulaire_longueur_large {
            width : 402px;
        }
        .article_Formulaire_longueur_demi, .Preferences_Formulaire_longueur_demi {
            width : 180px;
        }
        .select_Formulaire_longueur_demi {
            width : 191px;
        }
        .article_Formulaire_longueur_demi_aveccal{
            width : 160px;
        }
        .article_Formulaire_longueur_demi_avecsSigne, .Preferences_Formulaire_longueur_demi_avecsSigne {
            width : 165px;
        }
        .Preferences_Formulaire_longueur_tier_avecSigne {
            width : 90px;
        }
        .Preferences_Formulaire_longueur_titre_tier_avecSigne {
            font-size: 9px;
        }
        .Preferences_Formulaire_longueur_espace_tier {
            padding-right : 10px;
        }

        .article_formulaire_espace_demi, .Preferences_formulaire_espace_demi {
            padding-right : 20px;
        }
        #valider_client_creer_client_btn{
            background : rgba(78,145,190,1);
            border-radius:2px;
            border:1px solid rgba(255,255,255,0.1);
            cursor:pointer;
            color:white;
            font-size:14px;
            font-family:Roboto;
            padding:8px 20px;
            margin-right : 25px;
        }

        #client_reset,
        .Bouton_delete,
        #valider_preference_supprimer_jour_ferme,
        #valider_preference_supprimer_tva,
        #valider_preference_supprimer_taxe,
        #valider_preference_supprimer_mode_reglement,
        .article_famille_Supprimer_famille,
        #valider_preference_supprimer_remise,
        #valider_preference_supprimer_type_client,
        #article_famille_Supprimer_famille,
        #forfaits_Bouton_delete,
        .boncadeau_Bouton_delete,
        #valider_preference_supprimer_cabines {
            background : rgba(148,0,0,1);
            border-radius:2px;
            border:1px solid rgba(255,255,255,0.1);
            cursor:pointer;
            color:white;
            font-size:14px;
            font-family:Roboto;
            padding:8px 20px;
            margin-right : 25px;
        }

        #valider_articles_creer_article_btn, #valider_preference_creer_marque, #valider_preference_fournisseur {
            background : rgba(78,145,190,1);
            border-radius:2px;
            border:1px solid rgba(255,255,255,0.1);
            cursor:pointer;
            color:white;
            font-size:14px;
            font-family:Roboto;
            padding:8px 20px;
            text-transform: uppercase;

        }
    .align_right {
          text-align : right;
      }


    #clients_liste_client, #Articles_articles_tableau_liste_article, #Articles_marques_tableau_liste, #Articles_fournisseurs_tableau_liste, #Factures_tableau_liste_factures , #Preferences_gestion_utilisateurs, #Boncadeau_tableau_liste {
        border : 1px solid rgba(255,255,255, 0.1);
        padding : 20px;
        background : rgba(0,0,0, 0.2);
        font-family: 'Roboto-Light';
        margin-top : 10px;
        width : calc(100% - 40px);
        color : white;
    }
    #clients_barre_recherche_filtres, #articles_barre_recherche_filtres, #clients_barre_filtres {
        padding: 20px;
        background-color: rgba(0,0,0,0.15);
        border : 1px solid rgba(255,255,255,0.4);
        color : white;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }
    #clients_barre_recherche_filtres a, #articles_barre_recherche_filtres a{
        margin-left : 50px;
        text-transform: uppercase;
        font-weight: bold;
        padding : 8px;

    }
    .filtre_actif {
        background : rgba(78,145,190,1)  !important;
    }


.Client_form_Formulaire_ligne {
    padding : 20px;
    margin-top : 10px;
}


#Client_synthese_rendez_vous, #Client_Tableau_ventes_contenu, #Client_Tableau_ventes_contenu250 {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-around;
    background : rgba(0,0,0,0.5);
    color : white;
    width: 100%;

    border : 1px solid rgba(255,255,255, 0.1);
    border-radius: 4px;
    -webkit-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
    -moz-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
    box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);


}
#Client_synthese_rendez_vous div{
    text-align: center;
    padding: 15px;
    font-size: 20px;
    font-weight: bold;
}
.Client_synthese_rendez_vous_ssTitre {
    font-size : 12px;
    font-weight: normal;
}
#Client_Tableau_ventes_entete {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-around;
    color : white;
    width: 100%;
}
#Client_Tableau_ventes_entete span {
    padding : 10px;
    cursor: pointer;
}

#Client_Tableau_ventes_contenu {
    height : 140px;
    overflow-y : scroll;
    font-size : 14px;
}
#Client_Tableau_ventes_contenu250 {
    height : 250px;
    overflow-y : scroll;
    font-size : 14px;
}
.Client_tableau_vente_sousTexte {
    font-size : 12px;
    font-weight: normal;
}
#Client_Tableau_ventes_RDV, #Client_Tableau_ventes_Produits, #Client_Tableau_ventes_factures, #Client_Tableau_ventes_Forfait, #Client_Tableau_ventes_boncadeau {
    width : 100%;
    align-self: flex-start;

}
#Client_Tableau_ventes_Produits, #Client_Tableau_ventes_factures, #Client_Tableau_ventes_Forfait, #Client_Tableau_ventes_boncadeau {
    display : none;
    align-self: flex-start;
}
.Client_Tableau_ventes_entete_surlign {
    border-bottom: 3px solid rgba(255,255,255, 0.8);
}

#Articles_menu_ligne, #Ventes_menu_ligne, #Analyses_menu_ligne {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-around;
    width: 100%;
    padding : 25px 0;
    background-color: rgba(0,0,0,0.15);
    border : 1px solid rgba(255,255,255,0.4);
}
#Articles_menu_ligne a, #Ventes_menu_ligne a, #Analyses_menu_ligne a{
    font-family: 'Roboto';
    font-size: 18px;
    text-decoration: none;
    padding : 15px;
    margin-bottom: 2px;
    text-transform: uppercase;
    color : white;
}
#Articles_menu_ligne a:hover, #Ventes_menu_ligne a:hover, #Analyses_menu_ligne a:hover {
    color : rgba(78,145,190,1);
}
.Articles_menu_ligne_selected, .Ventes_menu_ligne_selected, .analyses_menu_ligne_selected {
    border-bottom: 3px solid rgba(78,145,190,1);
}
.Bon_cadeau_etat {
    width : 80px;
    height : 20px;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    color : white;
}
.Bon_cadeau_etat_utilisable {
    background : rgba(78,145,190,1);
    padding : 3px;
}
.Bon_cadeau_etat_utilise {
    background : rgba(190,132,78,1);
    padding : 3px;
}
.Bon_cadeau_etat_perime {
    background : rgba(0,0,0,8);
    padding : 3px;
}
.Bon_cadeau_etat_supprime {
    background : rgba(148,0,0,1);
    padding : 3px;
    text-decoration: none;
    color : white;

}

/* ============================================================ */
/* FORFAITS */
    .forfait_article_divListe {
        display : none;
        margin-bottom: 20px;
    }
    .forfait_article_boutonPlus {
        display : none;
    }


/* ============================================================ */
/* PREFERENCES */
        .Preferences_cadres {
            display : flex;
            flex-direction: row;
            flex-wrap: wrap;
            align-items: flex-start;
            justify-content: flex-start;
            width: 100%;
        }
      .Preferences_cadre {
          border : 1px solid rgba(255,255,255, 0.1);
          padding : 20px;
          background : rgba(0,0,0, 0.2);
          font-family: 'Roboto-Light';
          margin : 20px;
          color : white;
          width : 460px;
          display: flex;
          flex-direction: column;
          justify-content: flex-start;
      }
        .Preferences_taxes {
            border : 1px solid rgba(255,255,255, 0.1);

            background : rgba(0,0,0, 0.2);
            font-family: 'Roboto-Light';
            color : white;
            display: flex;
            flex-direction: column;
            justify-content: flex-start;
        }
      .preferences_field {
          padding : 40px;
          margin : 10px;
      }
      .preferences_bouton {
            color : white;
            padding : 5px;
            margin : 5px;
            text-decoration : none;           
      }
      #Preferences_titre {
         width : 1100px;
          margin : 0 auto;
      	font-family: 'Roboto-Light';
      	font-size: 30px;
          text-align: center;
          padding: 20px 0;
          background-color: rgba(0,0,0,0.2);
          border : 1px solid rgba(255,255,255,0.4);
          color : white;

      }
        #Fenetre_titre {
            width : 100%;
            margin : 0 auto;
            font-family: 'Roboto-Light';
            font-size: 30px;
            text-align: center;
            padding: 20px 0;
            background-color: rgba(0,0,0,0.2);
            border : 1px solid rgba(255,255,255,0.4);
            color : white;

        }

        #Preferences_titre_panier {
            width : calc(100% - 40px);
            margin : 0 auto;
            font-family: 'Roboto-Light';
            font-size: 30px;
            text-align: center;
            padding: 20px 0;
            background-color: rgba(0,0,0,0.2);
            border : 1px solid rgba(255,255,255,0.4);
            color : white;

        }
      #Preferences_titre_100 {
          width : 100%;
          margin : 0 auto;
          font-family: 'Roboto-Light';
          font-size: 30px;
          text-align: center;
          padding: 20px 0;
          background-color: rgba(0,0,0,0.2);
          border : 1px solid rgba(255,255,255,0.4);
          color : white;
      }
      #Preferences_contenu {
          width : 1100px;
          margin : 0 auto;

      }
        #Preferences_contenu_large {
            width : 100%;
            margin : 0 auto;

        }
        #valider_preference_modifier_nom_etablissement,
        #valider_preference_modifier_adresse,
        #valider_preference_modifier_condition,
        #valider_preference_modifier_logo_facture,
        #valider_preference_modifier_logo_ticket,
        #valider_preference_modifier_temps_preparation,
        #valider_preference_modifier_decoupage_heures,
        #valider_preference_modifier_encadrement_heures,
        #Horaire_ouverture_fermeture,
        #Preference_jour_fermes_creer,
        #valider_preference_modifier_langue,
        #valider_preference_modifier_tva_button,
        #valider_preference_creer_tva,
        #valider_preference_creer_taxe,
        #valider_preference_modifier_taxe,
        #valider_preference_modifier_monnaie,
        #valider_preference_creer_mode_reglement,
        #article_famille_creer_famille,
        #article_famille_modifier_famille,
        #valider_preference_creer_remise,
        #valider_preference_creer_type_client,
        #valider_preference_modifier_type_client,
        #valider_forfait_creer_forfait_btn,
        #valider_preference_creer_utilisateur_btn,
        #valider_cree_bon,
        #valider_preference_modifier_bon_cadeau,
        #valider_preference_modifier_trame_bon_cadeau,
        #valider_preference_creer_cabines,
        #valider_preference_modifier_cabines,
        #Objectif_mois,
        #valider_envoi_notification,
        #Enregistrer_mouvement_stock,
        #Analyse_Voir,
        #valider_Preference_message_sms,
        #valider_Preference_sms_expediteurs,
        #Preference_user_heure_valider_copier,
        #valider_Preference_mail_expediteurs,
        #valider_Preference_message_mail,
        #Valider_Accueil_blocNote
        {
            background : rgba(78,145,190,1);
        }

        .Preferences_taxes_colone {
            padding:10px;
            margin : 10px;
        }
        .Preferences_taxes_colone INPUT[type=text]{
            width:45px;
        }
        #Preferences_utilisateurs_limite {
            color : white;
            font-style: italic;
        }

        .Preference_horaire_user_heure {
            width : 70px;
            margin : 1px;
        }
        .Preference_horaire_user_heure_date {
            font-size : 10px;
        }

        #article_Sous_Famille, #article_sous_famille_modifier, #article_Sous_Famille_supprimer {
            width : 400px;
        }

        .userPhoto {
            overflow:hidden;
            -webkit-border-radius:20px;
            -moz-border-radius:20px;
            border-radius:20px;
            width:20px;
            height:20px;
            border : 1px solid rgba(255,255,255,0.6);
            z-index : 100;
        }

        .userPhoto_plusgrand {
            overflow:hidden;
            -webkit-border-radius:50px;
            -moz-border-radius:50px;
            border-radius:50px;
            width:50px;
            height:50px;
            border : 1px solid rgba(255,255,255,0.6);
            z-index : 100;
        }
        .tableau_user {
            width : 100%;
            border : 1px solid rgba(255,255,255,0.1);
            padding : 2px;
            font-size : 11px;
            border-collapse: collapse;
        }
        .tableau_user_ligne:hover{
            background-color: rgba(255,255,255,0.1);
        }
        .tableau_user_premiere_ligne {
            background-color: rgba(0,0,0,0.2);
            font-weight : bold;
        }
        .tableau_user td{
            border : 1px solid rgba(255,255,255,0.1);
        }

        .Preferences_Formulaire_ligne {
            padding : 20px;
            background : rgba(0,0,0, 0.2);
            font-family: 'Roboto-Light';
            margin : 2px;
            color : white;
        }
        .Preferences_Formulaire_ligne_photo {
            width : 100%;
            display : flex;
            align-items: center;
            justify-content: center;
        }
        .Preferences_Formulaire_ligne_photo_label {
            cursor: pointer;
            color: white;
            font-weight: bold;
            margin : 0 20px;
        }
        .Preferences_Formulaire_ligne_photo_label:hover {
            color: white;
        }
        .Preferences_Formulaire_ligne_dates {
            width : calc(100% - 40px);
            margin : 20px;
        }
        .Preferences_Formulaire_ligne_switchs {
            width : 100%;
            text-align: left;
        }
        .Preferences_Formulaire_ligne_switchs div{
            margin-bottom : 20px;
        }
        .Preferences_Formulaire_ligne_photo_input {
            display: none;
        }
        .Preferences_Remises_tableau, .Preferences_mode_reglements_tableau, .Preferences_type_clients_tableau, .Preferences_jour_ferme_tableau{
            color : white;
            width : 50%;
        }
        .Preferences_Remises_tableau td , .Preferences_mode_reglements_tableau td, .Preferences_type_clients_tableau td, .Preferences_jour_ferme_tableau td{
            padding : 5px;
        }
        .preferences_ligne_taxe {
            padding : 10px 0;
        }
        .preferences_taxes_intitule{
            display: inline-block;
            width : 150px;
        }
        #Preference_taxes_nom_creer {
            width: 100px;
        }
        .preferences_taxes_sw {
            margin-bottom: -15px;
            width: 100px;
        }
        .Preferences_tableau_famille {
            border : none;
            width : 615px;
        }
        .Preferences_tableau_famille_couleur {
            padding : 5px 11px;
            border : 1px solid rgba(255,255,255,0.15);
        }

        .Preferences_tableau_famille tbody{
            display: block;
            height: 580px;
            overflow-y:scroll;
            overflow-x:hidden;
            border-top : 1px solid rgba(255,255,255,0.15);
            border-bottom : 1px solid rgba(255,255,255,0.15);

        }
        .Preferences_tableau_famille thead, .Preferences_tableau_famille tbody tr {
            display:table;
            width : calc(100% - 1px);
            table-layout:fixed;
        }

        .Preferences_tableau_famille_ligne {
            line-height: 30px;
        }
        .Preferences_tableau_famille_colBouton{
            width : 110px;
        }
        .Preferences_Formulaire_user {
            width : 100%;
        }


/* ============================================================ */
/* PANIERS + FACTURES */
        #userPanier {
            margin-left : 33px;
            width : 900px;
            height : 70px;
            border : 1px solid rgba(0,0,0,0.9);
            background : var(--colortheme);
            color : white;
            border-radius: 5px;

            -webkit-box-shadow: inset 0px -5px 15px 0px rgba(0,0,0,0.2);
            -moz-box-shadow: inset 0px -5px 15px 0px rgba(0,0,0,0.2);
            box-shadow: inset 0px -5px 15px 0px rgba(0,0,0,0.2);
        }
        #Panier_liste_conteneur{
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: left;
            width : 900px;
            height : 70px;
        }
        #Panier_liste{
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: left;
            flex-basis: 130px;
            text-align:center;
            height : 60px;
            min-width: 900px;
        }

        .panier_liste_numero {
            flex-shrink: 0;
            margin : 5px;
            min-width: 50px;
            max-width: 130px; /* changer aussi flex-basis au dessus */
            border : 1px solid rgba(255,255,255,0.05);
            border-radius : 6px;
            background : rgba(0,0,0,0.75);
            color : white;
            text-decoration : none;
            padding: 8px 4px;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }
        .panier_numero_panier  {
            font-weight: bold;
            color: white;
        }
        .panier_liste_user {
            font-size:10px;
            color : rgba(255,255,255,0.75);
        }
        #Panier_page, #facture_page {
            display: flex;
            flex-direction: row;
            align-items: flex-start;
            justify-content: center;
            margin-top : 10px;
            color : white;

        }
        #Panier_detail, #facture_detail {
            width : 65%;
            margin : 5px;
            padding : 20px;
            background-color: rgba(0,0,0,0.15);
            border : 1px solid rgba(255,255,255,0.4);

        }
        #Panier_detail_voletDroit, #facture_detail_voletDroit {
            width : 35%;
        }
        #panier_detail_client_selectionner {
            width : 300px;
        }
        .Panier_detail_selection_client_ligne form {
            display: flex;
            align-items: center;
            flex-direction: row;
        }
        .Panier_detail_selection_client_ligne input {
            margin-right : 10px;
        }
        .panier_detail_ligne_avec_image {
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: flex-start;
            margin : 0;
        }
        .panier_detail_ligne_avec_image img{
            margin-right : 20px;
        }
        .panier_detail_info_forfait {
            padding : 5px;
        }
        #Panier_detail_client, #Panier_detail_Paiement, #Panier_detail_selection_client, #Panier_detail_transfert_document,
        #facture_detail_client, #facture_detail_Paiement, #facture_actions {
            background-color: rgba(0,0,0,0.15);
            border : 1px solid rgba(255,255,255,0.4);
            margin : 5px;
            padding : 20px;

        }
        .panier_detail_client_case {
            color : white;
            margin : 10px;
            font-size: 16px;
        }
        .panier_detail_client_styleA {
            font-size : 22px;
            font-weight : bold;
            padding : 2px;
        }
        .panier_detail_client_styleB {
            font-size : 14px;
            padding : 2px;
        }
        .panier_detail_client_styleC {
            font-size : 18px;
            padding : 2px;
        }
        #panier_detail_client_case_IconClient {
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: flex-start;
        }
        #Panier_detail_selection_client{
            padding : 20px;
        }
        .panier_detail_reglement_case {
            color : white;
            margin-bottom : 15px;
            font-size: 15px;

        }
        #panier_detail_reglement_case_saisie {
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: space-between;
        }
        #panier_detail_reglement_selectionner_mode, #panier_detail_reglement_montant {
            width : 170px;
        }
        #Panier_detail_liste_reglements {
            color : white;
        }
        .panier_detail_reglement_Reste {
            background : rgba(0,0,0, 0.3);
            padding: 10px;
            border-radius: 4px;
            font-size: 16px;
            border : 1px solid rgba(255,255,255, 0.4);
        }
        .panier_detail_reglement_ligne {
            margin : 5px;
        }
        .panier_detail_reglement_case INPUT{
            border : 1px solid rgba(255,255,255, 0.4);
            background : rgba(255,255,255, 0.05);
            padding : 5px;
            margin-left : 10px;
            color : white;
            font-family: 'Roboto-Light';
            font-size: 16px;
        }

        #Panier_detail_ajouter_article {
            margin-left : 10px;
            color : white;
        }

        #Fenetre_ajout_article, #Fenetre_ajout_forfait {
            width : 1000px;
            height ; 300px;
            top : calc(50% - 300px );
            left : calc(50% - 500px);
        }
        #Panier_articles_tableau_liste_article {
            height : 300px;
            overflow : auto;
        }

        .panier_tableau_article {
            width : 100%;
            border : 1px solid rgba(255,255,255,0.1);
            padding : 2px;
            font-size : 11px;
            border-collapse: collapse;
            margin-top : 20px;
        }
        .panier_tableau_article_ligne:hover{
            background-color: rgba(255,255,255,0.1);
        }
        .panier_tableau_article_premiere_ligne {
            background-color: rgba(0,0,0,0.2);
            font-weight : bold;
        }
        .panier_tableau_article_ligne td, .panier_tableau_article_premiere_ligne td{
            border : 1px solid rgba(255,255,255,0.1);
        }
        .panier_tableau_article_ligne img{
            margin : 3px;
            padding : 1px;
        }
        .panier_detail_ligne {
            display: flex;
            flex-direction: row;
            align-items: flex-start;
            justify-content: space-between;

            font-family: 'Roboto-Light';
            font-size : 18px;
            width : calc(100% - 50px );
            border : 1px solid rgba(255,255,255,0.1);
            padding : 10px;
            margin : 10px;
            background : rgba(0,0,0, 0.3);
        }
        .panier_detail_ligne img{
            margin-top : -1px;
        }
        .panier_detail_ligne_col {
            margin : 0 10px;
        }
        .panier_ligne_form {
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: flex-start;
        }
        .panier_ligne_form div {
            margin : 0 10px;
        }
        .panier_ligne_form INPUT {
            text-align: right;
            margin-left : 0;
        }
        .panier_ligne_form TEXTAREA {
            font-size: 12px;
        }
        .panier_ligne_liste_remises_select SELECT{
            width: 150px;
            margin-bottom : 10px;
            margin-left : 0;
        }
        .panier_ligne_liste_remises_select SELECT OPTION{
            font-size : 13px;
            font-family: 'Roboto-Light';
        }
        .panier_ligne_remises_nom {
            font-size : 11px;
            font-family: 'Roboto-Light';
        }
        .panier_detail_ligne_col_grow0 {
            flex-grow: 0;
        }
        .panier_detail_ligne_col_grow2 {
            flex-grow: 2;
        }
        .panier_ligne_form_table {
            padding : 5px;
        }
        .panier_ligne_form_table input{
            margin-top : 5px;
        }
        #Panier_detail_totaux, #facture_detail_totaux {
            width : 100%;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: flex-end;

        }
        #Panier_detail_totaux table , #facture_detail_totaux table {
            padding : 10px;
            border : 1px solid rgba(255,255,255,0.1);
            font-size : 16px;
            border : 1px solid rgba(255,255,255,0.1);
            background : rgba(0,0,0, 0.3);
            margin-right : 18px;
            margin-bottom : 20px;
         }
        #Panier_detail_totaux td , #facture_detail_totaux td{
            padding : 10px;
        }
        #Panier_detail_reste_a_regler {
            padding : 10px;
        }
        .Panier_detail_delete_icon {
            width : 16px;
            height : 16px;
            margin-top : 2px;
        }
        #Panier_icon_client_fiche {
            margin-left : 10px;
        }
        #Panier_fiche_client {
            display : none;
            position : absolute;
            margin-top : 300px;
            width : 400px;
            height : 450px;
            overflow-y:auto;
            background-color: rgba(0,0,10,0.95);
            border : 1px solid rgba(255,255,255,0.45);
            padding : 10px;
        }
        .Panier_fiche_client_bouton, .Panier_fiche_article_bouton {
            margin-top : -10px;
        }
        .Panier_fiche_article {
            display : none;
            position : absolute;
            margin-top : 0px;
            width : 400px;
            height : 400px;
            overflow-y:auto;
            background-color: rgba(0,0,10,0.95);
            border : 1px solid rgba(255,255,255,0.45);
            border-radius: 10px;
            color : white;
            padding : 10px;
            -webkit-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
            -moz-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
            box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);

        }
        .Panier_fiche_article div{
            margin-top : 10px;
        }
        .Panier_supprimer_rendezvous_div {
            display : none;
            position : absolute;
            margin-left : 20px;
            width : 450px;
            height : 60px;
            padding : 20px;
            border : 1px solid #5f3f3f;
            border-radius : 10px;
            background-color: rgba(20,0,0,0.85);
            text-align : center;
        }
        .panier_bouton {
            background-color : rgba(255,200,200, 0.3);
            border : 1px solid rgba(255,150,150,0.8);
            border-radius : 10px;
            color : white;
            padding : 5px;
            margin : 5px;
            text-decoration : none;
            font-size: 10px;
        }
        .panier_supprimer_rendezvous_boutons{
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            margin-top : 10px;
        }
        #Panier_detail_transfert_document {
            padding : 10px;
        }
        #Panier_fiche_client_factures_client, #Panier_fiche_client_rdv_client {
            display : none;
        }
        .Panier_fiche_client_bouton_detailsInfos {
            margin-right : 15px;
        }
        #panier_detail_client_boutons {
            margin-bottom : 15px;
            text-align: center;
        }
        #panier_pourboire_user {
            width : 200px;
        }
        #panier_pourboire_user SELECT OPTION{
            font-size : 13px;
            font-family: 'Roboto-Light';
        }
        .panier_recommande_user SELECT{
            width : 210px;
            margin-top : 5px;
        }
        .panier_recommande_user SELECT OPTION{
            font-size : 13px;
            font-family: 'Roboto-Light';
        }
        .panier_recommande_user TEXTAREA{
            width : 210px;
            margin-top : -5px;
        }
        #Panier_detail_monnaie_a_rendre {
            color : #c92200;
        }
        #panier_detail_reglement_bouton {
            background : rgba(78,145,190,1);
        }
        .panier_forfait_fait_partie {
            font-size : 12px;
            font-style: italic;
        }
        #Panier_transfert_en_facture_pass_button{
            background : rgba(78,145,190,1);
            margin-left : 10px;
        }
        #pas_de_staff{
            color : darkred;
            font-weight : bold;
            padding : 5px;

        }
        .factures_liste_colDesignation {
            max-width : 400px;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            color : silver;
        }
        #facture_actions {
            padding : 10px 0;
        }
        #facture_actions a, #facture_actions span{
            margin : 5px 10px;
        }
        #facture_liste_paniers{
            display:none;
            width : 530px;
            padding : 10px;
            position : absolute;
            margin-left : 12px;
            margin-top : 20px;
            background-color : rgba(255,255,255, 0.3);
            border : 1px solid rgba(255,255,255,0.2);
            color : black;
        }
        #facture_liste_paniers select, #boncadeau_liste_paniers select{
            width : 200px;
        }

        #factures_filtre_date input{
            margin-left : 30px;
            margin-right : 8px;
            width : 100px;
        }
        .facture_detail_ligne {
            text-align: center;
            font-size: 16px;
            line-height: 18px;
        }
        .facture_detail_description{
            font-size : 12px;
            padding: 5px;
            color : rgba(255,255,255,0.5);
        }
/* ============================================================ */
/* Messagerie */
#tableau_messagerie {
    display: flex;
    width : 100%;
    height: 100%;
    flex-direction: row;
    align-items: stretch;
    justify-content: center;
}
#Messagerie_colonne_liste_messages, #Messagerie_colonne_contenu_messages {
    padding : 20px;
    background : rgba(0,0,0, 0.2);
    font-family: 'Roboto-Light';
    margin : 5px;
    color : white;
}
#Messagerie_colonne_contenu_messages {
    flex-grow: 2;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.Messagerie_liste_messages_titre {
    font-family: 'Roboto-Bold-condensed';
    font-size: 16px;
    width: 100%;
    padding-bottom : 5px;
    border-bottom: 1px solid white;
    margin-bottom: 10px;
}
.Messagerie_liste_messages_ligne {
    margin-top: 2px;
    padding : 5px;
    background : rgba(0,0,0, 0.60);
    cursor: pointer;
}
.Notification_liste_noApp {
    margin-top: 2px;
    padding : 5px;
    background : rgba(100,100,100, 0.60);
    cursor: pointer;
}
.Messagerie_liste_messages_ligne_expediteur {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}
.Messagerie_liste_messages_expediteur {
    font-family: 'Roboto-Bold-condensed';
    font-size: 16px;
    line-height: 22px;
}
.Messagerie_liste_messages_ligne_expediteur div{
    padding-right : 20px;
}
.Messagerie_liste_messages_non_lu {
    color : rgba(78,145,190,1);
}
.Messagerie_liste_messages_discussion_sel {
    background: rgba(78,145,190,1);
    color : black;
}
.Messagerie_liste_messages_expediteur_date {
    min-width : 150px;
    text-align: center;
}
.Messagerie_liste_messages_expediteur {
    min-width : 150px;
    text-align: left;
}
#Messagerie_discussion_conteneur {
    height: 0px;
    margin-top: 2px;
    padding : 5px;
    overflow-y: scroll;
    flex : 1 1 auto;
}

#Messagerie_redaction {
    width : calc(100% - 10px);
    height : 50px;
    margin-top: 2px;
    padding : 5px;
    background : rgba(0,0,0, 0.60);
    display: flex;
    flex-direction: row;
    align-items: center;
}
#Messagerie_envoyer_message_rediger, #Notification_envoyer_message_rediger {
    height : 30px;
    padding : 10px;
    margin-right: 10px;
    flex-grow: 2;
}

.Messagerie_discussion_message_left{
    width: 100%;
    display: flex;
    justify-content: flex-start;
}
.Messagerie_discussion_message_right{
    width: 100%;
    display: flex;
    justify-content: flex-end;
}
.Messagerie_discussion_messages {
    width : calc(60% - 80px);
    padding : 20px;
    margin : 20px;
    color : white;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: left;
}

.Messagerie_discussion_message_forme_expediteur {
    background: rgba(78,145,190,1);
}
.Messagerie_discussion_message_forme_destinataire {
    background : rgba(0,0,0, 0.60);
}
.Messagerie_discussion_message_photo {
    margin-right : 10px;
}
.Messagerie_discussion_message_photo img{
    overflow:hidden;
    -webkit-border-radius:30px;
    -moz-border-radius:30px;
    border-radius:20px;
    width:30px;
    height:30px;
    border : 1px solid rgba(255,255,255,0.6);

}
.Messagerie_discussion_message_texte {
    flex-grow: 1;
}
.Messagerie_discussion_message_date {
    font-style: italic;
    font-size: 10px;
    width : 100%;
    text-align: left;
}

/* ============================================================ */
/* ANALYSES */
.Analyse_contenu {
    padding : 20px;
    background : rgba(0,0,0, 0.15);
    font-family: 'Roboto-Light';
    margin-top : 5px;
    color : white;
}
.Analyse_titre {
    font-family: 'Roboto-Light';
    font-size: 30px;
    color : white;
    line-height: 30px;
    margin-top : 20px;
    margin-bottom : 20px;

}
.Analyse_petit_tableau{
    width : 400px;
}
/* ================================================= */
/* RESPONSIVE */

@media (max-width: 1700px) {
    #fenetre_principale {
        width: calc( 100% - 80px ) ;
        margin-left : 75px;
    }
    #logo {
        width: 75px;
    }
    #menubar {
        width: 75px;
        overflow-x : hidden;
    }
    #menubar li {
        width: 75px;
    }
    #menubarMenu li a {
        width: 40px;
    }
    #menubarMenu li a span:not(.menubarImageConteneur){
        display : none;
    }
    #userbar {
        margin-left : 75px;
        width : 100%;
    }
    #userPanier {
        width : calc( 100% - 500px );
        max-width: 900px;
        margin-left : -15px;
    }
    #Panier_liste_conteneur {
        width : 100%;
    }
    #userInfo {
        width : 290px;
        margin-right : 100px;
    }
    #notification_iframe {
        border : 0;
        margin:0;
        padding:0;

    }
    #userNotificationNonLu {
        color : white;
    }
    #fenetre_enfant {
        width: 100%;
    }
    .calendrier_scroll {
        width: 100%;
    }
    #calendrier_today_user_Calendrier_table_userlist {
        width: 100%;
    }
    #calendrier_today_filtres_jour_datecomplete{
        min-width : 200px;
    }
    #calendrier_today_filtres_jour{
        height : 40px;
    }
    #calendrier_today_filtres_jour_precedent, #calendrier_today_filtres_jour_suivant {
        height : 14px;
        padding : 0;
    }
    #calendrier_today_filtres_jour_precedent img{
        height : 14px;
        padding : 0;
        margin: 0;
    }
    #calendrier_today_filtres_jour_suivant img{
        height : 14px;
        padding : 0;
        margin: -15px 0px;
    }
    #CalendrierCreerRendezVousDiv {
        width : 100%;
        margin : 0;
     }
    #CalendrierCreerRendezVous_Parties {
        flex-direction : column;
    }
    #CalendrierCreerRendezVous_PartieService, #CalendrierCreerRendezVous_PartieOptions, #CalendrierCreerRendezVous_PartieClient{
        width: 90%;
    }
    #CalendrierCreerRendezVous_cabine {
        width : 100%;
    }
    #Panier_page, #facture_page {
        flex-direction: column-reverse;
        width : 100%;
    }
    #Panier_detail, #facture_detail, #Panier_detail_voletDroit, #facture_detail_voletDroit {
        width : calc( 100% - 45px );
    }
    .fenetre_fiche_client_contenu {
        flex-direction: column;
    }
}

@media (max-width: 950px) {

    .en_lignes {
        flex-direction: column;
    }

    .fenetre_form_articles {
        width: calc(100% - 40px);
        height: 100%;
    }

    #Preferences_contenu {
        width: 100%;
    }

    #Accueil_Chiffres_bon_cadeau {
        width: 100%;
    }

    #Accueil_Chiffres_bon_cadeau_tableau {
        width: 100%;
    }

    #Accueil_Chiffres_clients {
        width: calc(100% - 50px)
    }

    .Accueil_cadre {
        width: calc(100% - 50px);
    }
    #Boncadeau_tableau_liste {
        overflow-x : auto;
    }


}