@import url('https://fonts.googleapis.com/css?family=Karma');
@import url('https://fonts.googleapis.com/css?family=Abril+Fatface');
@import url('https://fonts.googleapis.com/css?family=Cinzel:400,700,900');

/*************************************/
/*                                   */
/*    Partie: Pages Connexion        */
/*                                   */
/*************************************/
/* Elements generaux */
/* Couleur du background des pages de connexions */
.screen-height {
  /*height: 100vh; /* a deplacer */
  background-color: #ffffff;
  height: 100%;
}

/* ADD 3.2.1_RC5 */
.login-container-idpwd {
  visibility: visible;
}

.login-container-idpwd2 {
  visibility: visible;
}

/* Definition du cadre des formulaires des pages de connexion */
.login-container, .login-container-idpwd, .login-container-idpwd2 {
  border: 4px solid #DB812E; /* Definition du trait du cadre du formulaire au milieu de la page login */
  background-color: #ffffff; /* Couleur du background du cadre de formulaire des pages de connexions */
}

/* Elements de la Page de selection */
/* Couleur du titre du formulaire */
.login-container .policeColor {
  color: #292b2c;
}

/* Couleurs des Elements du bouton selection */
/*.login-container .bouttonColor {*/
/*background-color: var(--bouton-background-color); !* Couleur du background du bouton *!*/
/*color: var(--bouton-title-color); !* Couleur de la police du texte du bouton *!*/
/*border-color: var(--bouton-border-color); !* Couleur de la bordure du bouton *!*/
/*}*/
/* Elements commun des pages de connexion par certificats et par identifiant/mot de passe */
/* Couleur de la police des elements du formulaire */
.login-container, .login-container-idpwd, .login-container-idpwd2 .PoliceLogin {
  color: #292b2c;
}
/* Couleur du titre du formulaire */
.login-container, .login-container-idpwd, .login-container-idpwd2 .titleLogin {
  color: #292b2c;
}

/* Definition des boutons */
/* Bouton Annulation*/
/*.login-container .cancelBoutton {*/
/*background-color: #fff; !* Couleur du background *!*/
/*color: #292b2c; !*Couleur de la police *!*/
/*border-color: #eceeef; !*couleur de la bordure *!*/
/*}*/
/* Bouton Connexion Activée */
/*.login-container .connexionBoutton {*/
/*background-color: #386caa; !* Couleur du background *!*/
/*color: white; !* Couleur de la police *!*/
/*border-color: #386caa; !* Couleur de la bordure *!*/
/*}*/

/* Element de la page de connexion Identifiant/Mot de passe */

/* Couleur du lien hypertexte pour le mot de passe perdu */
.login-container, .login-container-idpwd, .login-container-idpwd2 .passwordlost {
  color: #386caa;
}

/* Elements du formulaire Mot de passe perdu */
/* Couleur de la police des elements du formulaire */
.PoliceIdentifiant {
  color: #292b2c;
}
/* Couleur du texte explicatif */
.labelPasswordLost {
  color: #292b2c;
}

/* Elements page connexion par certificat */
/* Couleur d'affichage du certificat */
.span-color {
  color: #4885CD;
}

/*************************************/
/*                                   */
/* Partie: Elements commun pour      */
/* toutes les pages de l'application */
/*                                   */
/*************************************/
/* couleur du background + couleur des Polices par défaut */
/* Toutes les couleurs doivent être identiques */
html, body, cw-safe-list-page {
  background-color: #ffffff !important; /* couleur du background */
  color: #000000; /*couleur par defaut de la police pour l'application*/
}
.main-body {
  background-color: #ffffff !important; /*couleur du background pour la safe page*/
}
.action-icons {
  background-color: #ffffff !important; /*couleur du background pour la barre des bouttons d'actions*/
}
.navbar {
  background-color: #ffffff !important; /*couleur du background pour la barre de recherche*/
}
.navbar .input-group > div, .navbar .input-group > input {
  background-color: #ffffff !important; /*couleur des input de la barre de recherche*/
  color: #292b2c; /*couleur de la police des inputs de la barre de recherche*/
}
.search-icon{
  color: #000000; /*couleur de l'icone de recherche dans la barre de recherche*/
}

/* Menu Deconexion/profil */
.toggle-btn {
  background-color: transparent; /* Couleur du background */
}
.toggle-btn .name {
  color: #292b2c; /* Couleur de la police du menu */
}
*
/* Cercle des avatars Client */
.avatar {
  background-color: #386caa; /* Couleur du background */
  color: #ffffff; /* couleur de la police */
}

/*************************************/
/*                                   */
/*     Partie: Salle des Coffres     */
/*                                   */
/*************************************/

/* Definition des bordures et background des coffres */
/* Epaisseur + couleur + background*/
.safe {
  border: 1px solid #eceeef;
  background-color: #ffffff;
}

/* Couleur de la police du nom du coffre */
.safe .header {
  color: #292b2c;
}

/* Couleur de l'icone de coffre */
.safe-icon {
  stroke: #386caa;
  fill:white;
}

.safe-svg {
  stroke: #386caa;
  fill:white;
}
/*************************************/
/*                                   */
/*       Partie: Menu à gauche       */
/*                                   */
/*************************************/
/*Important !!!!! pour modifier la couleur du background du menu a gauche */
/* il faut modifier les paramatres 'background-color des trois classes suivantes: */
/* .leftcol le .scrollable et le .fixed */
.leftcol {
  background-color: #FFFFFF; /*#cde2ff; LOGO STARTPEOPLE : DB812E*/
}
.scrollable {
  background-color: #FFFFFF; /*#cde2ff;*/
  color: #000000 !important; /* Couleur des polices du menu a gauche*/
  height: 70%;
}
@media (max-height: 620px) {
  .scrollable {
    height: 63%;
  }
}

.fixed {
  background-color: #FFFFFF; /*#cde2ff;*/
}


/* Couleur des differents composant de l'arborescence du menu à gauche */
/* Couleur de l'indicateur permettant de savoir si un dossier est ouvert ou non */
.tree-row .open-indicator {
  color: #9a9a9a;
}

/* Couleur de l'indicateur permettant de savoir si un dossier est ouvert ou non quand on passe dessus*/
.tree-row .open-indicator:hover {
  color: #386caa;
}

/* Definition de la bordure du menu à gauche quand un dossier est selectionné */
.tree-row.selected::before {
  border-left: 0.3rem solid #386caa;
}

/* Couleur d'un dossier quand il est non selectionné */
.tree-row .folderActive svg path {
  fill: #9a9a9a !important;
}

/* Couleur d'un dossier quand il est sélectionné */
.tree-row.selected .folderActive svg path {
  fill: #386caa !important; /*la couleur du dossier sélectionné*/
}

/* Couleur de la police pour un dossier sélectionné */
.tree-row.selected .name {
  color: #386caa;
}

/* Couleur de la police pour un dossier non sélectionné */
.tree-row .name {
  color: #000000; /*la couleur des polices du dossier lorsqu'il n'est pas sélectionné*/
}

/* Couleur du texte "Salle des coffres" */
.safe-list-link {
  color: #1b1b1b;
}

.safe-list-link.selected .name {
  color: #386caa;
}

.safe-list-link.selected::before {
  border-left: 0.3rem solid #386caa;
}

/* Couleur de l'icone du coffre */
.icon svg {
  fill: #ccc; /* Couleur du fond de l'icone */
  stroke: #7c7c7c;/* Couleur du tour de l'icone */
}

/* Couleur du sceau du journal */
.sceauColor {
  fill: #e17676;
}

/* Boutton Ajouter , Connexion , Selection , upload ... tous les boutons de l'IHM*/
.btn-primary {
  color: #ffffff; /* Couleur de la police de ce bouton *!*/
  background-color: #386caa !important; /* Coulour du background de ce bouton *!*/
  border-color: #386caa; /* Definition de la bordure du bouton : Couleur *!*/
}
/* En boutton Hover */
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open>.dropdown-toggle.btn-primary {
  color: #ffffff; /* Couleur de la police de ce bouton *!*/
  background-color: #2b5484 !important;/* Coulour du background de ce bouton *!*/
  border-color: #294f7c ; /* Definition de la bordure du bouton : Couleur *!*/
}
/*/*//*/*//*/***//***/

/* Bouton annuler secondary bouton*/
.btn-secondary{
  color: #292b2c;  /* Couleur de la police de ce bouton *!*/
  background-color: #ffffff !important; /* Coulour du background de ce bouton *!*/
  border-color: #eceeef; /* Definition de la bordure du bouton : Couleur *!*/
}
.btn-secondary:hover, .btn-secondary:focus, .btn-secondary:active, .btn-secondary.active, .open>.dropdown-toggle.btn-secondary {
  color: #000000; /* Couleur de la police de ce bouton *!*/
  background-color: #e6e5e5 !important;/* Coulour du background de ce bouton *!*/
  border-color: #cbd0d3 ; /* Definition de la bordure du bouton : Couleur *!*/
}

/* focus sur le champs de recherche dans la salle des coffres */
.form-control:focus{
  border-color: #292b2c !important;
}
/* couleur du texte membres dans la salle des coffres */
.details {
  color: #292b2c;
}
/* couleur du boutons d'actions dans le coffre */
.action-bouton{
  stroke: #386caa;
}
.actions-icon-search-page {
  stroke: #386caa;
}

/* PDF Preview */
#node-preview{
  background-color: rgba(0,32,69,0.7); /* couleur du fond lors de PDF Aperçue*/
}
.preview-actions{
  background-color: rgba(0,32,69,0.7); /* couleur du fond de la bare des boutons d'actions lors de PDF Aperçue*/
}
.actions-icon-preview {
  stroke: #ffffff;
}
.background-arrow{
  background-color: rgba(0,32,69,0.7); /* couleur du fond des 2 fléches en pdf preview*/
}

/* Modal header */
.modal-header{
  background-color: #DB812E !important;  /*couleur du fond dans le modal header #386CAA */
  color: #ffffff !important; /* couleur du texte dans le modal header */
}
.close{
  color: #ffffff !important;  /* couleur du bouton close dans le modal header */
}

/* couleur de la ligne selectionnée dans un tableau */
tr.selected > td{
  background-color: #7ba5df !important;  /* couleur d'une ligne selectionnée dans un tableau*/
}
/* couleur du path d'un dossier avec les fleches */
.path-police-color{
  color: #386CAA;
}

.name-safe-icon-color
{
  fill: #386caa;
}

input[type=radio]:checked + label > i{
  border-bottom: 0px solid #fff;
  box-shadow: 0 0 5px 5px #386caa;
  margin-bottom: 10px;
  padding-top: 22px;
}

.safe-view-icon {
  cursor: pointer;
}
.attribute-style{
  background-color: #386caa;
  color: white;
}

/* Menu documents non lus/documents échus */
/* Couleur du background de l'icone cloche */
.cloche-circle{
  fill: #C9CDD1;
}

/* Couleur de l'icone cloche */
.cloche-icon{
  fill:white;
}

/* couleur de l'icone qui nous redirige vers la salle des coffres dans le menu a gauche */
.safeIcon{
  stroke:#4A4A4A
}

/*couleur du texte nombre d'utilisateur */
.userNumber{
  color:  black !important;
}

/**
  Logo conf
 */

/*
  connect page logo conf
 */
.connect-page-logo svg:not(:root) {
  width: 30rem !important;
  height: 8rem !important;
}
.connect-page-logo svg:not(:root) .st0 {
  fill: #2D589A !important;
}
.connect-page-logo svg:not(:root) .st1 {
  fill: #2D589A !important;
}

/* safe main page logo conf */
.safe-page-logo svg:not(:root) {
  width: 18rem !important;
  height: 6rem !important;
}
.safe-page-logo svg:not(:root) .st0 {
  fill: #2D589A !important;
}
.safe-page-logo svg:not(:root) .st1 {
  fill: #2D589A !important;
}

/* safe list page logo conf */
.safe-list-logo svg:not(:root) {
  width: 18rem !important;
  height: 6rem !important;
}
.safe-list-logo svg:not(:root) .st0 {
  fill: #2D589A !important;
}
.safe-list-logo svg:not(:root) .st1 {
  fill: #2D589A !important;
}

/* leftcol page logo conf */
.leftcol-logo svg:not(:root) {
  width: 18rem !important;
  height: 6rem !important;
}
.leftcol-logo svg:not(:root) .st0 {
  fill: #2D589A !important;
}
.leftcol-logo svg:not(:root) .st1 {
  fill: #2D589A !important;
}

/**
  Pictos de filtrage des coffres svg Conf
 */

/*safe name partition svg conf */
.safe_name_partition-svg svg:not(:root) {
  width: 26pt !important;
  height: 23pt !important;
}
.safe_name_partition-svg svg:not(:root) .stpnpartition14{display:none !important;}
.safe_name_partition-svg svg:not(:root) .stpnpartition1{fill:#4794D1 !important;}
.safe_name_partition-svg svg:not(:root) .stpnpartition2{fill:#FFFFFF !important;}
.safe_name_partition-svg svg:not(:root) .stpnpartition3{fill:none !important;stroke:#000000 !important;stroke-width:0.5 !important;stroke-miterlimit:10 !important;}
.safe_name_partition-svg svg:not(:root) .stpnpartition4{fill:#4794D1 !important;stroke:#000000 !important;stroke-width:0.5 !important;stroke-miterlimit:10 !important;}
.safe_name_partition-svg svg:not(:root) .stpnpartition5{display:inline !important;fill:none !important;stroke:#4794D1 !important;stroke-width:20 !important;stroke-miterlimit:10 !important;}
.safe_name_partition-svg svg:not(:root) .stpnpartition6{display:inline !important;fill:#4794D1 !important;}
.safe_name_partition-svg svg:not(:root) .stpnpartition7{display:inline !important;}
.safe_name_partition-svg svg:not(:root) .stpnpartition8{fill:none !important;stroke:#4794D1 !important;stroke-width:2 !important;stroke-miterlimit:10 !important;}
.safe_name_partition-svg svg:not(:root) .stpnpartition9{display:inline !important;fill:none !important;stroke:#4794D1 !important;stroke-width:3 !important;stroke-miterlimit:10 !important;}
.safe_name_partition-svg svg:not(:root) .stpnpartition10{fill:#1C236B !important;}
.safe_name_partition-svg svg:not(:root) .stpnpartition11{display:inline !important;fill:#4696D8 !important;}
.safe_name_partition-svg svg:not(:root) .stpnpartition12{display:inline !important;fill:#4696D7 !important;}
.safe_name_partition-svg svg:not(:root) .stpnpartition13{display:inline !important;fill:#1C236B !important;}

/* safe name svg conf */
.safe_name-svg svg:not(:root){
  width: 26pt !important;
  height: 23pt !important;
}
.safe_name-svg svg:not(:root) .stpname14{display:none !important;}
.safe_name-svg svg:not(:root) .stpname1{display:inline !important;}
.safe_name-svg svg:not(:root) .stpname2{fill:#4794D1 !important;}
.safe_name-svg svg:not(:root) .stpname3{fill:#FFFFFF !important;}
.safe_name-svg svg:not(:root) .stpname4{fill:none !important;stroke:#000000 !important;stroke-width:0.5 !important;stroke-miterlimit:10 !important;}
.safe_name-svg svg:not(:root) .stpname5{display:inline !important;fill:#4794D1 !important;stroke:#000000 !important;stroke-width:0.5 !important;stroke-miterlimit:10 !important;}
.safe_name-svg svg:not(:root) .stpname6{fill:none !important;stroke:#4794D1 !important;stroke-width:20 !important;stroke-miterlimit:10 !important;}
.safe_name-svg svg:not(:root) .stpname7{fill:none !important;stroke:#4794D1 !important;stroke-width:2 !important;stroke-miterlimit:10 !important;}
.safe_name-svg svg:not(:root) .stpname8{fill:none !important;stroke:#4794D1 !important;stroke-width:3 !important;stroke-miterlimit:10 !important;}
.safe_name-svg svg:not(:root) .stpname9{fill:#1C236B !important;}
.safe_name-svg svg:not(:root) .stpname10{display:inline !important;fill:#4696D8 !important;}
.safe_name-svg svg:not(:root) .stpname11{display:inline !important;fill:#4696D7 !important;}
.safe_name-svg svg:not(:root) .stpname12{display:inline !important;fill:#1C236B !important;}

/*Safe partition svg conf */
.safe_partition-svg svg:not(:root) {
  width: 26pt !important;
  height: 23pt !important;
}
.safe_partition-svg svg:not(:root) .stppartition14{display:none !important;}
.safe_partition-svg svg:not(:root) .stppartition1{display:inline !important;}
.safe_partition-svg svg:not(:root) .stppartition2{fill:#4794D1 !important;}
.safe_partition-svg svg:not(:root) .stppartition3{fill:#FFFFFF !important;}
.safe_partition-svg svg:not(:root) .stppartition4{fill:none !important;stroke:#000000 !important;stroke-width:0.5 !important;stroke-miterlimit:10 !important;}
.safe_partition-svg svg:not(:root) .stppartition5{display:inline !important;fill:#4794D1 !important;stroke:#000000 !important;stroke-width:0.5 !important;stroke-miterlimit:10 !important;}
.safe_partition-svg svg:not(:root) .stppartition6{display:inline !important;fill:none !important;stroke:#4794D1 !important;stroke-width:20 !important;stroke-miterlimit:10 !important;}
.safe_partition-svg svg:not(:root) .stppartition7{display:inline !important;fill:#4794D1 !important;}
.safe_partition-svg svg:not(:root) .stppartition8{fill:none !important;stroke:#4794D1 !important;stroke-width:2 !important;stroke-miterlimit:10 !important;}
.safe_partition-svg svg:not(:root) .stppartition9{display:inline !important;fill:none !important;stroke:#4794D1 !important;stroke-width:3 !important;stroke-miterlimit:10 !important;}
.safe_partition-svg svg:not(:root) .stppartition10{display:none !important;fill:#1C236B !important;}
.safe_partition-svg svg:not(:root) .stppartition11{fill:#4696D8 !important;}
.safe_partition-svg svg:not(:root) .stppartition12{display:inline !important;fill:#4696D7 !important;}
.safe_partition-svg svg:not(:root) .stppartition13{display:inline !important;fill:#1C236B !important;}

/*Safe save svg conf */
.safe_save-svg svg:not(:root) {
  width: 26pt !important;
  height: 23pt !important;
}
.safe_save-svg svg:not(:root) .stpsave14{display:none !important;}
.safe_save-svg svg:not(:root) .stpsave1{display:inline !important;}
.safe_save-svg svg:not(:root) .stpsave2{fill:#4794D1 !important;}
.safe_save-svg svg:not(:root) .stpsave3{fill:#FFFFFF !important;}
.safe_save-svg svg:not(:root) .stpsave4{fill:none !important;stroke:#000000 !important;stroke-width:0.5 !important;stroke-miterlimit:10 !important;}
.safe_save-svg svg:not(:root) .stpsave5{display:inline !important;fill:#4794D1 !important;stroke:#000000 !important;stroke-width:0.5 !important;stroke-miterlimit:10 !important;}
.safe_save-svg svg:not(:root) .stpsave6{display:inline !important;fill:none !important;stroke:#4794D1 !important;stroke-width:20 !important;stroke-miterlimit:10 !important;}
.safe_save-svg svg:not(:root) .stpsave7{display:inline !important;fill:#4794D1 !important;}
.safe_save-svg svg:not(:root) .stpsave8{fill:none !important;stroke:#4794D1 !important;stroke-width:2 !important;stroke-miterlimit:10 !important;}
.safe_save-svg svg:not(:root) .stpsave9{display:inline !important;fill:none !important;stroke:#4794D1 !important;stroke-width:3 !important;stroke-miterlimit:10 !important;}
.safe_save-svg svg:not(:root) .stpsave10{fill:#1C236B !important;}
.safe_save-svg svg:not(:root) .stpsave11{display:inline !important;fill:#4696D8 !important;}
.safe_save-svg svg:not(:root) .stpsave12{fill:#4696D7 !important;}