@import url("https://fonts.googleapis.com/css?family=Nunito:300,400,600,700,800");

/*---------STYLE GÉNERAL ------------------*/
.faspin:before {
  font-family: "FontAwesome";
  content: "\f2f1";
  display: inline-block;
  animation-name: spin;
  font-weight: 100;
  animation-duration: 2000ms;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}

@keyframes spin {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}

html {
  height: 100%;
}

body {
  font-family: "Nunito", sans-serif !important;
  padding: 0px;
}

pre {
  white-space: pre-wrap;
}

.contenu {
  background-image: url(../img/bg_fond_beige.gif);
  background-repeat: repeat-x;
  min-height: 600px;
  padding-top: 15px;
}

.oublie li a {
  margin-right: 0;
  border-radius: 4px;
  color: white;
  border-bottom: 0px solid rgba(255, 255, 255, 0) !important;
}

.oublie li a:hover {
  background-color: transparent !important;
  color: white !important;
  text-decoration: underline !important;
}

.oublie > li > a {
  margin-right: 2px;
  line-height: 1.42857143;
  font-size: 16px;
  padding: 15px 20px;
  color: white !important;
  border-radius: 4px 4px 0 0;
}

.oublie > li > a:hover {
  border-color: transparent;
}

.btn-trie {
  color: #868582;
  background-color: #f5eee2;
  border-color: #eae4d8;
  padding: 8px 20px;
}

/*    PAGE LOGIN    */

.bg_contenu {
  min-height: 100%;
  background-color: #27cd7c;
}

.connexion .nav-tabs {
  border-bottom: 0px solid #ddd;
}

.logo {
  margin-top: 50px;
  margin-bottom: 50px;
  color: white;
  text-align: center;
}

.logo .icon-salaries:before {
  width: 100% !important;
  font-size: 45px;
  margin-right: 0px !important;
  margin-left: 0px !important;
  color: white;
}

.logo .logo_text {
  font-size: 70px;
  background-image: url(../img/LogoAgrumeblanc250.png);
  background-repeat: no-repeat;
  text-indent: -9999px;
  background-position: center;
}

.logo_site {
  color: white;
  text-align: center;
}

.logo_site .logo_text {
  font-size: 50px;
  background-image: url(../img/LogoAgrumeblanc200.png);
  background-repeat: no-repeat;
  text-indent: -9999px;
  background-position: center;
}

div.login {
  -webkit-box-shadow: 0px 0px 10px #666666;
  -moz-box-shadow: 0px 0px 10px #666666;
  box-shadow: 0px 0px 10px #666666;
}

div.login input {
  padding: 30px;
  width: 100%;
  border-top-color: transparent;
  border-top-style: solid;
  border-top-width: 1px;
  border-right-color: transparent;
  border-right-style: solid;
  border-right-width: 1px;
  border-bottom-color: #eae9e9;
  border-bottom-style: solid;
  border-bottom-width: 1px;
  border-left-color: transparent;
  border-left-style: solid;
  border-left-width: 1px;
  border-image-source: initial;
  border-image-slice: initial;
  border-image-width: initial;
  border-image-outset: initial;
  border-image-repeat: initial;
  font-size: 20px;
}

button.btn-connexion {
  color: #ffffff;
  font-size: 20px;
  background: #7c65f1;
  padding: 30px 30px 30px 30px;
  text-align: left;
  text-decoration: none;
  width: 100%;
  border: 0px;
  text-transform: uppercase;
}

button.btn-connexion:hover {
  background: #52439f;
  text-decoration: none;
}

.form-group {
  margin-bottom: 0px !important;
}

.creation-compte {
  display: flex;
}

.creation-compte a {
  background-color: #353232;
  padding: 30px;
  width: 100%;
  border-radius: 60px;
  color: white;
  text-align: center;
  text-transform: uppercase;
  font-size: 20px;
}

.creation-compte a:hover {
  text-decoration: none;
  background-color: #2c2a2a;
}

#menu_account {
  padding-top: 20px;
}

#menu_account a.menuopen {
  color: white;
}

.nav .open > a,
.nav .open > a:hover,
.nav .open > a:focus {
  background-color: transparent;
  border-color: transparent;
  color: #0a5430;
}

[class^="icon-"]:after,
[class*=" icon-"]:after {
  font-family: "fontello";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  margin-right: 0.2em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  margin-left: 0.2em;
}

/*--------------PRODUCT MENU ----------------*/

.productsmenu a,
.productsmenu a:focus {
  position: relative;
  margin-top: 8px;
  background: #27cd7c;
  border: 1px solid white;
}

.productsmenu a:active {
  background: #339867;
  border: 1px solid #e5e5e5;
}

.productsmenu i {
  float: left;
  position: absolute;
  left: 10px;
  top: 16px;
  color: white;
}

.productsmenu a span {
  display: block;
  margin-left: 23px;
  text-align: left;
  font-weight: bold;
}

.productsmenu a small {
  font-size: 0.7em;
  color: #e5e5e5;
}

@media (max-width: 768px) {
  .productsmenu {
    position: relative;
    left: -5px !important;
  }

  .productsmenu a.pre-wrap-xs {
    margin-top: 16px !important;
    white-space: pre-wrap;
  }

  .productsmenu a span {
    margin-left: 0px;
    font-size: 0.6em;
    text-align: center;
  }
}

.baseline {
  position: absolute !important;
  left: 73% !important;
  /* top: 50px!important; */
  top: 43px !important;
  width: 100%;
  color: white;
  font-family: "Calibri";
  /*font-weight: bolder;*/
  font-weight: lighter;
  text-align: right;
  /*text-transform: uppercase;*/
  font-size: 1.3em;
}

/*---------ENTETE ET MENU GENERAL ------------------*/

.entete {
  height: 72px;
  background-color: #27cd7c;
}

/**
** DEBUT REVU PAR ADRIEN
**
**/

body {
  background-color: #f8f2e6;
  padding-bottom: 30px;
}

::placeholder {
  font-style: italic;
  font-size: 0.8em;
}

#menu_top {
  background-color: white;
}

#menu_account {
  border-bottom: 0 solid transparent;
  color: white;
  font-family: "Nunito", sans-serif !important;
  font-size: 14px;
}

#menu_account i {
  font-size: 22px;
}

#menu_account .jmoddiv.jmodinside {
  position: absolute;
  top: 100%;
  left: auto;
}

/** Global styles **/

h1,
h2,
h3 {
  color: #797070;
  font-size: 24px;
  font-weight: normal;
}

h1 i,
h2 i,
h3 i {
  font-size: 36px;
}

.agrume-softboxarea {
  background-color: #f0ebe0;
  color: #a09d98;
  padding: 15px;
  font-size: 12px;
}

.agrume-softboxarea h1 {
  text-transform: uppercase;
  font-size: 16px;
  margin-top: 0px;
  margin-bottom: 10px;
}

.agrume-boxarea,
.well {
  background-color: white;
  padding: 25px;
  box-shadow: 0 0px 10px #d4cec4;
  margin-bottom: 30px;
  text-align: justify;
  border-width: 0px;
  border-radius: 0px;
}

.agrume-boxarea img {
  max-width: 100%;
}

.agrume-boxarea h3 {
  font-size: 16px;
  text-transform: uppercase;
  color: #292828;
  font-weight: 600;
  padding: 0px;
}

/*Remove the margin top on the procedure_actionname element*/

.agrume-boxarea > h2:first-child,
.agrume-boxarea > h3:first-child {
  margin-top: 0px;
}

.table {
  text-align: left;
}

.agrumeShowRow {
  cursor: pointer;
}

.module_data,
.module_documents {
  padding-top: 15px;
  padding-bottom: 15px;
  display: inline-block;
  background-color: #fcf9f2;
  width: 100%;
}

/* breadcrumb */

.breadcrumb {
  padding: 8px 15px;
  padding-left: 0px;
  margin-bottom: 15px;
  font-size: 20px;
  list-style: none;
  background-color: transparent !important;
  border-radius: 4px;
}

.breadcrumb a {
  color: #797070;
  text-decoration: none;
}

.breadcrumb a:hover {
  color: #504a4a;
  text-decoration: none;
}

.breadcrumb > li + li:before {
  padding: 0 5px;
  color: #797070;
  content: ">" !important;
}

.breadcrumb > .active {
  color: #39c2db !important;
}

.dropzone {
  padding: 45px;
  border: 2px dashed #ccc;
  text-align: center;
  font-style: italic;
  margin-bottom: 15px;
  cursor: pointer;
}

/** TABS **/

.nav-tabs > li > a {
  margin-right: 2px;
  line-height: 1.42857143;
  font-size: 16px;
  padding: 15px 20px;
  color: #797070;
  border-radius: 4px 4px 0 0;
}

.nav-tabs li.active > a,
.nav-tabs li.active > a:hover,
.nav-tabs li.active > a:focus {
  color: red;
  /* to be changed for each parent element */
  background-color: #f8f2e6;
}

.nav-tabs > li > a:hover,
.nav-tabs > li > a:focus {
  text-decoration: none;
  color: #797070;
  background-color: #ece6db;
}

.nav-tabs.nav-justified > .active > a,
.nav-tabs.nav-justified > .active > a:focus,
.nav-tabs.nav-justified > .active > a:hover {
  border-bottom-color: transparent;
}

/** END TABS **/

/** PAGE HEADER **/

.agrume-header-filters {
  margin-top: 20px;
}

.agrume-header-filters .btn {
  text-transform: none;
}

/** END PAGE HEADER **/

/** FIXED BUTTONS **/

.agrume_buttons {
  text-align: right;
  clear: both;
  z-index: 12;
  top: 0px;
  margin-top: 10px;
  outline: 10px solid rgba(248, 242, 230, 0.9);
  background-color: rgba(248, 242, 230, 0.9);
}

.agrumebuttonsarea {
  clear: both;
  margin-bottom: 20px;
}

/* END FIXED BUTTONS */

/** FIXED MESSAGES **/

#agrume_messages {
  bottom: 15px;
  padding: 25px;
  position: fixed;
  right: 15px;
  max-width: 400px;
  z-index: 40;
  display: none;
}

#agrume_scrolltop {
  position: fixed;
  bottom: 15px;
  right: 15px;
  width: 40px;
  height: 40px;
  z-index: 30;
  background-color: white;
  box-shadow: 0 0 10px #d4cec4;
  border-radius: 40px;
  cursor: pointer;
  padding: 10px;
  background-image: url("../img/top.png");
  background-position: center;
  background-repeat: no-repeat;
}

#agrume_csevalidation {
  bottom: 0px;
  padding: 16px 14px 14px 8px;
  position: fixed;
  right: 7px;
  max-width: 400px;
  z-index: 30;
  /* display: none; */
}

#agrume_csevalidation .csesecretary-alert {
  padding-right: 32px;
  background-color: #46b0e6;
  border-color: #43b5cc;
}

/** END FIXED MESSAGES **/

/** BOXES **/

.agrume-box {
  box-shadow: 0 0 10px #c5c2bb;
  margin-top: 15px;
  margin-bottom: 15px;
  height: 218.75px;
  padding-top: 15px;
  padding-right: 25px;
  padding-bottom: 15px;
  padding-left: 25px;
  background-color: white;
}

.agrume-box-add {
  color: white;
  display: block;
  text-align: center;
  font-size: 16px;
  font-weight: 300;
  text-transform: uppercase;
}

.agrume-box-add:hover,
.agrume-box-add:active,
.agrume-box-add:focus {
  text-decoration: none;
  cursor: pointer;
  color: white;
}

.agrume-box-hover:hover {
  box-shadow: 0 0px 10px #d4cec4;
  cursor: pointer;
  color: white;
}

.agrume-listing .agrume-box .plus {
  font-size: 75px;
}

.agrume-listing-line .agrume-box .plus {
  font-size: 30px;
}

.agrume-listing-line .agrume-box {
  margin-bottom: 0px;
  min-height: 30px;
  height: auto;
}

.agrume-box-onhover {
  display: none;
}

.agrume-box:hover .agrume-box-onhover {
  display: inline;
}

.agrume-box-title {
  color: #313030;
  font-size: 15px;
  font-weight: bold;
  min-height: 90px;
  padding-top: 45px;
}

.agrume-listing-line .agrume-box-title {
  min-height: 30px;
  padding-top: 0px;
}

.agrume-box-subtitle {
  color: #797070;
  font-size: 15px;
}

.agrume-box-subtext {
  color: #797070;
  font-size: 12px;
}

.agrume-box-hover:hover .agrume-box-subtitle,
.agrume-box-hover:hover .agrume-box-subtext,
.agrume-box-hover:hover .agrume-box-title {
  color: white;
}

/** END BOXES **/

.agrume-list-add {
  display: flex;
  justify-content: space-between;
  background-color: #fa613d;
  color: #fff;
  height: 50px;
  font-size: 14px;
  text-transform: uppercase;
}

.salarie-list:hover {
  cursor: pointer;
}

/** FORMS **/

/*1st level*/

.groupfields legend {
  text-align: center;
  margin-top: 0px;
  font-size: 25px;
  color: #797070;
  margin-bottom: 15px;
  text-transform: uppercase;
  border-bottom: 0px solid #e5e5e5;
  font-weight: 100 !important;
}

/*2nd level*/

.subfields .groupfields {
  background-color: white;
  box-shadow: 0 0 10px #d4cec4;
  margin-bottom: 30px;
  padding-top: 15px;
}

form.autosave .subfields .subfields legend {
  font-size: 18px;
}

.subfields .groupfields legend {
  font-size: 20px;
  text-transform: uppercase;
  font-weight: 100;
  color: #fa613d;
  border-bottom: 0px solid #e5e5e5;
  text-align: left;
}

/*3rd level*/

.subfields .subfields .groupfields {
  background-color: transparent;
  box-shadow: none;
  margin: 0px;
  padding: 15px;
}

.subfields .subfields .groupfields legend {
  text-transform: initial;
}

/** inline radio **/

label.inlinelabel {
  float: left;
  margin-right: 30px;
}

/** DYNAMENU **/

.dynamenu {
  background-color: #f1eadd;
  border-radius: 10px;
  padding-top: 15px;
  padding-bottom: 15px;
  padding-right: 0px;
  padding-left: 0px;
  margin-top: 15px;
  top: 0px;
  max-height: 95%;
  overflow-y: auto;
}

.dynamenu .nav > li > a {
  position: relative;
  display: block;
  padding: 10px 5px;
  color: #797070;
}

.dynamenu .nav > li.active > a,
.dynamenu .nav > li > a:hover,
.dynamenu .nav > li > a:focus {
  background-color: #f8f2e6;
  border-radius: 0px;
}

.dynamenu li ul {
  display: none;
}

.dynamenu li.active ul li a {
  padding-left: 30px;
  font-size: 12px;
}

.dynamenu li.active ul {
  display: block;
}

/** filters under the search box **/

.agrume-filters > li.active > a,
.agrume-filters > li.active > a:focus,
.agrume-filters > li.active > a:hover {
  color: white !important;
  border-radius: 0px !important;
}

.agrume-filters > li > a:focus,
.agrume-filters > li > a:hover,
.agrume-filters > li > a {
  text-decoration: none !important;
  color: #868582 !important;
  border-radius: 0px !important;
  background-color: #f5eee2 !important;
  border: 1px solid #b6b0b0 !important;
}

/*agrume-area buttons*/

.agrume-box-button i {
  width: 30px !important;
  height: 30px !important;
  color: white;
  display: block;
  cursor: pointer;
  border-radius: 30px;
  text-align: center;
  padding-top: 7px;
  filter: brightness(1.1);
  -webkit-filter: brightness(1.1);
}

a.disabled {
  cursor: not-allowed;
  opacity: 0.5;
}

.agrume-box-disabled {
  cursor: not-allowed;
  opacity: 0.5;
}

.agrume-box-button:hover {
  text-decoration: none;
}

.agrume-area-button {
  display: none;
  float: right;
  margin-top: 30px;
  margin-right: 20px;
  z-index: 4;
}

.agrume-parentbox:hover .agrume-area-button {
  display: block;
  position: relative;
}

.agrume-area-button2 {
  display: none;
  position: absolute;
  margin-top: 10px;
  left: 95%;
  z-index: 4;
}

.agrume-parentbox:hover .agrume-area-button2 {
  display: block;
}

.agrume-area-button2:hover {
  background-color: #fe6845;
  width: 30px !important;
  height: 30px !important;
  color: white;
  display: block;
  cursor: pointer;
  border-radius: 30px;
  text-align: center;
  padding-top: 7px;
  filter: brightness(1.1);
  -webkit-filter: brightness(1.1);
}

.agrume-box-add2 {
  background-color: #fe6845 !important;
  color: white;
  display: flex;
  flex-direction: row;
  text-align: center;
  justify-content: center;
  font-size: 16px;
  font-weight: 300;
  text-transform: uppercase;
  height: 75px;
  align-items: center;
}

.agrume-box-add3 {
  background-color: #7c65f1 !important;
  color: white;
  display: flex;
  flex-direction: row;
  text-align: center;
  justify-content: center;
  font-size: 16px;
  font-weight: 300;
  text-transform: uppercase;
  height: 75px;
  align-items: center;
}

.agrume-add2 {
  height: 1.2rem;
}

.form_import_div {
  display: flex;
  flex-direction: column;
  margin-left: 1.2rem;
}

.agrume-area-highlight {
  font-weight: bold;
  margin-top: 15px;
  padding-top: 15px;
  border-top: 2px solid #ccc;
}

.agrume-comments {
  font-size: 10px;
  font-style: italic;
}

/* Colors for statut-individuel area */

.icon-statut-individuel:before {
  color: #27cd7c;
}

#main_menu .active .menu-statut-individuel,
#main_menu .menu-statut-individuel:hover {
  border-bottom-color: #27cd7c;
}

/* Colors for gestion-cse area */

.icon-gestion-cse {
  margin-right: 5px;
}

.icon-gestion-cse:before {
  color: #27cd7c;
}

#main_menu .active .menu-gestion-cse,
#main_menu .menu-gestion-cse:hover {
  border-bottom-color: #27cd7c;
}

/* Colors for employeurs area */

.agrume-area-employeurs .agrume-box-hover:hover {
  background-color: #7c65f1;
}

.agrume-area-employeurs .agrume-box-add {
  background-color: #7c65f1;
}

.agrume-area-employeurs .agrume-box-add:hover {
  background-color: #44368e;
}

.agrume-area-employeurs .agrume-box-coloredtext {
  color: #7c65f1;
}

.agrume-area-employeurs .agrume-box-hover:hover .agrume-box-coloredtext {
  color: white;
}

.icon-employeurs:before {
  color: #7c65f1;
}

#main_menu .active > .menu-employeurs,
#main_menu .menu-employeurs:hover,
#cse-params-settings.dropdown-menu a.menu-employeurs:hover {
  border-bottom-color: #7c65f1;
}

/* TODO Quelle couleur pour les tabs des employeurs ? */

.agrume-area-employeurs .nav-tabs li.active > a,
.agrume-area-employeurs .nav-tabs li.active > a:hover,
.agrume-area-employeurs .nav-tabs li.active > a:focus {
  color: #7c65f1;
}

.agrume-area-employeurs .dynamenu a,
.agrume-area-employeurs .dynamenu a:hover,
.agrume-area-employeurs .dynamenu a:focus,
.agrume-area-employeurs .dynamenu .active > a,
.agrume-area-employeurs .dynamenu .active > a:hover,
.agrume-area-employeurs .dynamenu .active > a:focus {
  color: #7c65f1;
}

.agrume-area-employeurs .subfields .groupfields legend {
  color: #7c65f1;
}

.agrume-area-employeurs .agrume-box-button i {
  background-color: #7c65f1;
}

.agrume-area-employeurs .agrume-filters > li.active > a {
  background-color: #7c65f1 !important;
  border: 1px solid #7c65f1 !important;
}

/* Colors for salaries area */

.agrume-area-salaries .agrume-box-hover:hover {
  background-color: #fe6845;
}

.agrume-area-salaries .agrume-box-add {
  background-color: #fe6845;
}

.agrume-area-salaries .agrume-box-add:hover {
  background-color: #e2593a;
}

.agrume-area-salaries .agrume-box-coloredtext {
  color: #fa613d;
}

.agrume-area-salaries .agrume-box-hover:hover .agrume-box-coloredtext {
  color: white;
}

.agrume-area-salaries .icon-salaries:before {
  width: 57px;
}

.icon-salaries:before {
  color: #fa613d;
}

.icon-handshake-o:before {
  color: #663232;
}

#main_menu .icon-salaries:before {
  width: 40px;
}

#main_menu .active > .menu-salaries,
#main_menu .menu-salaries:hover {
  border-bottom-color: #f35b37;
}

#cse-params-settings.dropdown-menu a.menu-salaries:hover {
  border-bottom-color: #f35b37;
}

#cse-params-settings.dropdown-menu a.menu-handshake-o:hover {
  border-bottom-color: #663232;
}

.agrume-area-salaries .nav-tabs li.active > a,
.agrume-area-salaries .nav-tabs li.active > a:hover,
.agrume-area-salaries .nav-tabs li.active > a:focus {
  color: #fa6943;
}

.agrume-area-salaries .dynamenu a,
.agrume-area-salaries .dynamenu a:hover,
.agrume-area-salaries .dynamenu a:focus,
.agrume-area-salaries .dynamenu .active > a,
.agrume-area-salaries .dynamenu .active > a:hover,
.agrume-area-salaries .dynamenu .active > a:focus {
  color: #fa613d;
}

.agrume-area-salaries .subfields .groupfields legend {
  color: #fa6943;
}

.agrume-area-salaries .agrume-box-button i {
  background-color: #fe6845;
}

.agrume-area-salaries .agrume-filters > li.active > a,
.agrume-area-salaries .agrume-filters > li.active > a:focus,
.agrume-area-salaries .agrume-filters > li.active > a:hover {
  background-color: #fe6845 !important;
  border: 1px solid #fe6845 !important;
}

.gcse-menu-right a {
  font-size: 16px !important;
}

.div-dynazoom {
  position: fixed;
  background-color: #f8f2e6;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  padding: 30px 10px 10px;
  z-index: 10;
  overflow: auto;
}

.div-dynazoom table {
  background-color: #fff;
}

.div-dynazoom table .hidden-cell {
  background-color: #f8f2e6;
  border-color: #f8f2e6;
}

.dynaclose {
  position: fixed;
  right: 10px;
  top: 5px;
  cursor: pointer;
}

.w-100 {
  width: 100% !important;
}

.editable-section {
  background-color: #f1eadd;
  margin-bottom: 10px;
  padding: 10px 16px;
  border-radius: 10px;
}

table.dynatable td:not(.sum-cell, .hidden-cell),
table.dynatable th:not(.sum-cell, .hidden-cell) {
  background-color: #f5f5f5;
}

/* fieldset.fieldgroup .subfields .type_dynatable .toto {
	color:red;
} */

/* Colors for procedures area */

.agrume-area-procedures .agrume-box-hover:hover {
  background-color: #27cd7c;
}

.agrume-area-procedures .agrume-box-add {
  background-color: #27cd7c;
}

.agrume-area-procedures .agrume-box-add:hover {
  background-color: #0c4a2c;
}

.agrume-area-procedures .agrume-box-coloredtext {
  color: #27cd7c;
}

.agrume-area-procedures .agrume-box-hover:hover .agrume-box-coloredtext {
  color: #0c4a2c;
}

.icon-procedures:before {
  color: #18c973;
}

.icon-book-open:before {
  color: #c99a18;
}

.icon-archive:before {
  color: #f35b37;
}

.icon-bdese:before {
  color: #7c65f1;
}

#main_menu .active .menu-archive,
#main_menu .menu-archive:hover {
  border-bottom-color: #f35b37;
}

#main_menu .active .menu-bdese,
#main_menu .menu-bdese:hover {
  border-bottom-color: #7c65f1;
}

#main_menu .active .menu-procedures,
#main_menu .menu-procedures:hover {
  border-bottom-color: #18c973;
}

.agrume-area-procedures .agrume-filters > li.active > a,
.agrume-area-procedures .agrume-filters > li.active > a:focus,
.agrume-area-procedures .agrume-filters > li.active > a:hover {
  background-color: #27cd7c !important;
  border: 1px solid #27cd7c !important;
}

/* TODO Quelle couleur pour les tabs des procedures ? */

.agrume-area-procedures .nav-tabs li.active > a,
.agrume-area-procedures .nav-tabs li.active > a:hover,
.agrume-area-procedures .nav-tabs li.active > a:focus {
  color: #18c973;
}

.agrume-area-procedures .dynamenu a,
.agrume-area-procedures .dynamenu a:hover,
.agrume-area-procedures .dynamenu a:focus,
.agrume-area-procedures .dynamenu .active > a,
.agrume-area-procedures .dynamenu .active > a:hover,
.agrume-area-procedures .dynamenu .active > a:focus {
  color: #18c973;
}

.agrume-area-procedures .subfields .groupfields legend {
  color: #18c973;
}

.agrume-area-procedures .agrume-box-button i {
  background-color: #27cd7c;
}

/* Colors for documents area */

.agrume-area-documents .agrume-box-hover:hover {
  background-color: #2bbed8;
}

.agrume-area-documents .agrume-box-add {
  background-color: #2bbed8;
}

.agrume-area-documents .agrume-box-add:hover {
  background-color: yellow;
  background-color: blue;
}

.agrume-area-documents .agrume-box-coloredtext {
  color: #39c2db;
}

.agrume-area-documents .agrume-box-hover:hover .agrume-box-coloredtext {
  color: white;
}

.agrume-area-documents .nav-tabs li.active > a,
.agrume-area-documents .nav-tabs li.active > a:hover,
.agrume-area-documents .nav-tabs li.active > a:focus {
  color: #39c2db;
}

.agrume-area-documents .dynamenu a,
.agrume-area-documents .dynamenu a:hover,
.agrume-area-documents .dynamenu a:focus,
.agrume-area-documents .dynamenu .active > a,
.agrume-area-documents .dynamenu .active > a:hover,
.agrume-area-documents .dynamenu .active > a:focus {
  color: #39c2db;
}

.agrume-area-documents .subfields .groupfields legend {
  color: #39c2db;
}

.agrume-area-documents .agrume-box-button i {
  background-color: #2bbed8;
}

/* Colors for home section */

.icon-home:before {
  color: #b6b0b0;
}

#main_menu .active .menu-home,
#main_menu .menu-home:hover {
  border-bottom-color: #b6b0b0;
}

/** Search area **/

.agrume-search {
  margin-bottom: 7.5px;
  margin-top: 7.5px;
}

.agrume-search input {
  border: medium none !important;
  box-shadow: 0 0 10px #c5c2bb !important;
  font-size: 16px !important;
  font-weight: 100 !important;
  height: 52px !important;
  padding: 15px 20px !important;
}

/** END SEARCH AREA **/

/** MAIN MENU **/

#menu_top {
}

#main_menu .menuicon {
  font-size: 24px;
}

#main_menu a {
  color: black;
  font-family: "Nunito", sans-serif !important;
  font-size: 16px;
  line-height: 3em;
  border-bottom: 4px solid transparent;
  background-color: transparent;
  border-radius: 0px;
  padding: 5px 15px;
}

#main_menu > ul > li > a,
#main_menu > ul > li.active.parent > ul.nav-child {
  border-left: 1px solid #e5e5e5;
}

#main_menu > ul > li:first-child {
  border-left: none;
}

/* Make sure the menu never stacks */

#main_menu > ul.nav-justified > li {
  display: table-cell;
  width: 1%;
}

#main_menu > ul.nav-justified > li > a {
  margin-bottom: 0;
}

#main_menu > ul > li:not(.active).parent > ul.nav-child {
  display: none;
}

#main_menu > ul > li.active.parent > ul.nav-child {
  display: table;
  width: 100%;
  margin: 0;
  padding: 0;
}

#main_menu > ul > li.active.parent > ul.nav-child > li {
  display: table-cell;
  width: 50%;
}

#main_menu > ul > li.active.parent > ul.nav-child > li:last-child {
  text-align: right;
}

#main_menu > ul > li.active.parent > ul.nav-child > li a {
  width: 100%;
}

#main_menu > ul > li.active.parent > ul.nav-child > li a .menuicon {
  font-size: 20px;
  margin-right: 20px;
}

/** MESSAGES **/

.alert {
  padding: 15px;
  margin-bottom: 20px;
  border: 1px solid transparent;
  border-radius: 0px !important;
  z-index: 2;
  position: relative;
}

.alert-success {
  color: white;
  background-color: #13a55e;
  border-color: #13a55e;
}

.alert-info {
  color: white;
  background-color: #3a87ad;
  border-color: #3a87ad;
}

.alert-warning {
  color: white;
  background-color: #d6672c;
  border-color: #d6672c;
}

.alert-danger,
.alert-error {
  color: white;
  background-color: #ff4e4e;
  border-color: #ff4e4e;
}

.alert-neutral {
  background-color: #eeeeee;
  border-color: #cccccc;
}

.alert a,
.alert a:focus {
  color: white;
  font-weight: bold;
}

.icon-procedures.color-white::before {
  color: white;
}

/** BDES **/

@media (min-width: 1400px) {
  .container.bdes {
    width: 1360px;
  }
}

@media (min-width: 1600px) {
  .container.bdes {
    width: 1540px;
  }
}

.container.bdes .agrume-area-procedures .nav-tabs li.active > a,
.container.bdes .agrume-area-procedures .nav-tabs li.active > a:hover,
.container.bdes .agrume-area-procedures .nav-tabs li.active > a:focus {
  color: #119b58;
}

.bdes-table table {
  border: none;
}

.bdes-table table,
.bdes-table td {
  padding: 0.3rem 0.6rem 0.6rem 0.3rem;
}

.bdes-table tr {
  border-style: solid none none none;
  border-width: 1px;
  border-color: #ddd;
}

.bdes-table td,
th {
  max-width: 48rem;
}

.bdes-table th {
  padding: 0.3rem;
  min-width: 6rem;
}

.bdes-table thead {
  background-color: #27cd7c;
  border: 3px solid #27cd7c;
  color: #fff;
}

.bdes-table-value {
  text-align: center;
}

.bdes-table-headerleft {
  padding-right: 12rem !important;
}

.bdes-table-date {
  border-left: 1px solid #fff;
  text-align: center;
}

.bdes-table-value input {
  /* width: 80px; */
  height: 32px !important;
}

.bdes .table {
  width: fit-content;
}

/** END BDES **/

.document_reception .alert,
.document_relation .alert {
  padding: 0px;
  padding-top: 3px;
  padding-left: 1px;
  margin-bottom: 0px;
}

.badge-danger {
  background-color: #ff4e4e !important;
  color: white !important;
}

div.message_error {
  background-color: #ff4e4e;
  clear: both;
  color: #ffffff;
  margin-top: 10px;
  margin-bottom: 10px;
  padding: 10px;
  font-size: 12px;
  display: inline-block;
  width: 100%;
}

div.message_error.messagetype_advise,
div.message_error.messagetype_info {
  background-color: #3a87ad;
}

div.message_error.messagetype_warning {
  background-color: #d6672c;
}

div.message_error.messagetype_condition {
  background-color: #dd8f5e;
}

div.message_error a,
div.message_error a:hover {
  color: #ccc;
}

div.message_error a:hover {
  text-decoration: underline;
}

/** END MESSAGES **/

/*              CHOIX PROCEDURE                */

ul.newprocedure {
  background-color: #27cd7c;
  margin-left: auto;
  margin-top: 30px;
  margin-right: auto;
  border-radius: 5px;
  padding: 15px;
  box-shadow: 0 0 10px #c5c2bb;
  max-width: 570px;
}

ul.newprocedure li:first-child {
  border-top: 0px solid #1b8d55;
}

ul.newprocedure li {
  border-top: 1px solid #1b8d55;
  list-style-type: none !important;
}

ul.newprocedure li a {
  color: white;
  font-size: 18px;
  text-align: center;
}

ul.newprocedure.vertmodale {
  padding: 8px;
}

ul.newprocedure.vertmodale li a {
  position: relative;
  display: block;
  padding: 10px 15px;
  text-align: center;
  font-size: 16px;
}

ul.newprocedure.vertmodale li a:hover,
ul.newprocedure.vertmodale li a:focus {
  text-decoration: none !important;
}

ul.newprocedure li a:hover,
ul.newprocedure li a:focus {
  color: white;
  background-color: #1b8d55;
  font-size: 16px;
  text-align: center;
}

/* FIN CHOIX PROCEDURES */

/* START CLASSIFICATION TREE */

.displaytree .closedelem ul {
  display: none;
}

.displaytree li {
  list-style-type: none;
}

.displaytree li.lastelement > span:before {
  content: url("../img/circle.png");
  padding-right: 10px;
}

.displaytree li.parentelement.closedelem > span:before {
  content: url("../img/plus.gif");
  padding-right: 10px;
}

.displaytree li.parentelement.openedelem > span:before {
  content: url("../img/minus.gif");
  padding-right: 10px;
}

.displaytree span {
  cursor: pointer;
}

.displaytree span:hover {
  text-decoration: underline;
}

/** END CLASSIFICATION TREE **/

/* Tooltip modification */

div.tip-wrap {
  background-color: #efefef;
  color: #333333;
  max-width: 600px;
  text-align: justify;
  border: 1px solid #ccc;
}

div.helptext {
  position: absolute;
  background-color: #efefef;
  color: #333333;
  max-width: 600px;
  max-height: 400px;
  overflow: auto;
  text-align: justify;
  border: 1px solid #ccc;
  border-radius: 4px;
  padding: 10px;
  z-index: 10;
}

div.helptext .helptitle {
  font-weight: bold;
  margin-bottom: 10px;
}

/** End of tooltip modifications **/

/** Dynatable **/

.dynatable tbody .tableedge-left {
  border-left: 2px solid darkgray;
}

.dynatable tbody .tableedge-top {
  border-top: 2px solid darkgray;
}

.dynatable tbody .tableedge-right {
  border-right: 2px solid darkgray;
}

.dynatable tbody .tableedge-bottom {
  border-bottom: 2px solid darkgray;
}

.dynatable tbody .sum-row {
  border: none;
}

.dynatable tbody .sum-row .sum-cell {
  border-top: 2px solid darkgray;
  border-bottom: 2px solid darkgray;
}

.dynatable tbody .sum-cell {
  background-color: rgb(191, 226, 191);
}

.dynatable .hidebottomright {
  border-bottom: 2px solid darkgray;
  background-color: darkgray !important;
}

.dynatable .hidebottomleft {
  border-bottom: none;
}

.dynatable tbody tr[class*="hidetopleft"] {
  border: none;
}

.dynatable tbody {
  border-right: 2px solid darkgray;
  border-bottom: 2px solid darkgray;
}

.dynatable.editable th,
.dynatable.editable td {
  padding: 4px 6px;
}

/* .dynatable.editable td {
  padding: 0.8em;
} */

.dynatable td,
.dynatable th {
  padding: 0.3em;
}

.dynatable td,
.dynatable th {
  height: 26px;
  text-align: left;
}

.dynatable td[class*="hidden-cell"] {
  border: none;
}

.dynatable th {
  border-style: none solid solid none;
  border-color: darkgray;
  border-width: 1px;
}

div.colrow-input .form-control {
  width: 54px;
  height: 28px;
}

div.fillall-input label.fillall-checkbox,
div.fillall-input label.fillall-btn-rightpadding,
div.fillall-input input[id^="fillall_"] {
  height: 28px;
}

div.fillall-input label.fillall-checkbox input,
div.fillall-input label.fillall-btn-rightpadding button {
  height: inherit;
  margin-top: 0px;
}

div.fillall-input label.fillall-checkbox,
div.fillall-input label.fillall-btn-rightpadding {
  font-weight: 400;
  line-height: 0;
  color: #555;
  background-color: #eee;
  border: 1px solid #ccc;
  border-radius: 4px;
  display: inline-flex;
  align-items: center;
}

div.editable-dt-menu-item {
  display: flex;
  justify-content: flex-end;
  /* padding-bottom: 1em; */
}

.d-flex,
.flex {
  display: flex !important;
}

.column,
.flex-column {
  flex-direction: column;
}

div.justify-content-end {
  justify-content: flex-end;
}

.content-center {
  justify-content: center;
}

.space-between {
  justify-content: space-between;
}

.gap5 {
  gap: 5px;
}

.gap10 {
  gap: 10px;
}

.gap20 {
  gap: 20px;
}

.gap45 {
  gap: 45px;
}

.items-center {
  align-items: center;
}

.items-start {
  align-items: start;
}

.grow {
  flex-grow: 1;
}

.grow2 {
  flex-grow: 2;
}

.wrap {
  flex-wrap: wrap;
}

.no-wrap {
  flex-wrap: nowrap;
}

.basis-content {
  flex-basis: min-content;
}

.mw100 {
  max-width: 100px;
}

.mw300 {
  max-width: 300px;
}

.mb5 {
  margin-bottom: 5px;
}

.minw560 {
  min-width: 520px;
}

.text-nowrap {
  text-wrap: nowrap;
}

.form-control {
  height: 28px;
  font-size: 13px;
  padding: 3px 6px;
}

/** End Dynatable **/

/** DOC RULES
 * Styles used to handle documents...
 * We should have the same in the word document and also in the backend
 * display the document... the Word generation should follow exactly the same rules
and also the editor.css file
 */

#agrume_document .headerright {
  margin-left: 400px;
}

#agrume_document .pagebreak {
  margin-top: 45px;
  margin-bottom: 45px;
  border-bottom: 1px solid #ccc;
}

#agrume_document .extraspaces li,
#agrume_document li.extraspaces {
  padding-top: 20px;
}

#agrume_document,
#agrume_document p,
#agrume_document div,
#agrume_document ul {
  font-family: Helvetica;
  font-size: 12px;
  margin-top: 0px;
  margin-bottom: 0px;
  padding-top: 0px;
  padding-bottom: 0px;
}

#agrume_document h1 {
  font-size: 22px;
  font-weight: bold;
  margin-top: 36px;
  margin-bottom: 18px;
  color: #333333;
  text-transform: none;
}

#agrume_document h2 {
  font-size: 18px;
  font-weight: bold;
  margin-top: 36px;
  margin-bottom: 18px;
  color: #333333;
  text-transform: none;
}

#agrume_document h3 {
  font-size: 18px;
  font-weight: bold;
  margin-top: 18px;
  margin-bottom: 9px;
  margin-left: 0px;
  color: #333333;
  text-transform: none;
}

#agrume_document hr {
  color: #999999;
}

.exemple {
  border: 1px solid #ccc;
  padding: 10px;
  font-style: italic;
}

.dispoconventionnelle {
  border: 1px solid #ccc;
  padding: 10px;
}

/** END OF DOC RULES **/

/** WAITING PAGE AND WAIT EFFECT **/

#waitingpage,
#loadingpage {
  position: fixed;
  top: 0px;
  left: 0px;
  background-color: rgba(248, 242, 230, 0.6);
  z-index: 999;
  width: 100%;
  height: 100%;
}

#loadingpage {
  background-color: #f8f2e6;
}

.waiteffect {
  background-image: url("../img/loading2.gif");
  background-repeat: no-repeat;
  background-position: center;
  height: 100px;
  width: 100px;
  margin-top: -50px;
  margin-left: -50px;
  position: fixed;
  top: 50%;
  left: 50%;
  z-index: 999;
}

.waitSuccess {
  background-image: url("../img/GreenCheck.gif");
  background-repeat: no-repeat;
  background-position: center;
  height: 100px;
  width: 100px;
  margin-top: -50px;
  margin-left: -50px;
  position: fixed;
  top: 50%;
  left: 50%;
  z-index: 999;
}

/** Flash effect **/

.flash {
  -moz-animation: flash 1s ease-out;
  -moz-animation-iteration-count: 1;
  -webkit-animation: flash 1s ease-out;
  -webkit-animation-iteration-count: 1;
  -ms-animation: flash 1s ease-out;
  -ms-animation-iteration-count: 1;
}

@-webkit-keyframes flash {
  0% {
    background-color: none;
  }

  30% {
    background-color: #fbf8b2;
  }

  100% {
    background-color: none;
  }
}

@-moz-keyframes flash {
  0% {
    background-color: none;
  }

  30% {
    background-color: #fbf8b2;
  }

  100% {
    background-color: none;
  }
}

@-ms-keyframes flash {
  0% {
    background-color: none;
  }

  30% {
    background-color: #fbf8b2;
  }

  100% {
    background-color: none;
  }
}

/** END OF WAITING PAGE AND WAIT EFFECT **/

.fieldhighlight {
  border-left: 2px solid orange;
}

/*Make sure date picker is displayed on top of everything else*/

.ui-datepicker:not(.morezindex) {
  z-index: 2 !important;
}

#cse-menu li.menu-employeurs,
#cse-menu li.item-183,
#cse-menu li.item-186 {
  display: none !important;
}

#cse-params-settings .menuicon {
  width: 30px;
  display: inline-block;
}

/*** FIN REVU PAR ADRIEN ***/

/*----------------- FILTRE ET RECHERCHE ---------------*/

.acces-procedure,
.acces-documents,
.acces_fiche {
  position: relative;
}

.text-agrume-acces-procedure,
.text-agrume-acces-documents,
.text-agrume-edit {
  z-index: 1;
}

/*-------------------------------------------------------------*/

/*---------            PAGE DASHBOARD       ------------------*/

/*-----------------------------------------------------------*/

body.com_agrume.view-dashboard.itemid-182 .row.contenu .container,
body.com_agrume.view-dashboard.itemid-184 .row.contenu .container {
  /*width: 96%;*/
}

/*	Menus CSE	*/

div.well.cse-leftmenu,
div.well.cse-rightmenu {
  background: none;
  box-shadow: none;
}

div.cse-leftmenu .menu-item {
  text-align: center;
  text-transform: uppercase;
  margin-top: 1.4rem;
  margin-bottom: 1.4rem;
  padding: 6px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

div.cse-rightmenu .menu-item {
  background-color: #27cd7c;
  color: white;
  text-align: left;
  margin-top: 1.4rem;
  margin-bottom: 1.4rem;
  padding: 6px;
}

div.cse-rightmenu .menu-item:hover {
  background-color: #0c4a2c;
}

div.cse-settings i {
  cursor: pointer;
}

.salarieSlide {
  display: flex;
  height: 6.2rem;
  margin-bottom: 0px;
}

.searchelement-tableau {
  margin: bottom 25px;
}

.salarieSlide:hover {
  background-color: #fe6845 !important;
  color: white !important;
}

.salarieSlide:hover > * {
  color: white;
}

.agrume-listing-tableau {
  margin-top: 10px;
}

.agrume-listing-tableau-employeur {
  width: 100%;
  display: flex;
  flex-direction: column;
}

/* .agrume-box-title-tableau{
  padding: 0px !important; 
  min-height: 0px !important; 
  width: 25%;
} */
.ajouter_employeur_div {
  width: 67%;
  margin-top: 30px;
  position: fixed;
}

.employeurSlide {
  padding: 0px !important;
  height: 6.2rem;
}

.employeurSlide:hover {
  background-color: #7c65f1 !important;
  color: white !important;
  cursor: pointer;
}

.changement_affichage_employeur {
  margin-left: 30px;
}

.btn-employeur {
  background-color: #7c65f1 !important;
}

.agrume-box-text-employeur {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  margin-left: 25px;
}

.employeur-parentbox {
  position: relative;
}

.agrume-box-title-employeur {
  color: #313030;
  font-size: 15px;
  font-weight: bold;
  width: 25%;
}

.agrume-area-button-employeur {
  margin-top: 25px !important;
}

.form_import_div_employeur {
  display: flex;
  margin-left: 1.2rem;
  position: relative;
  left: 40%;
}

#cse-params-settings.dropdown-menu {
  position: unset;
  top: unset;
  left: unset;
  right: 42px;
  position: absolute;
}

#cse-params-settings.dropdown-menu a {
  border-bottom-style: solid;
  border-bottom-width: 2px;
  border-bottom-color: white;
}

.well.cse-leftmenu a {
  color: #666;
}

.well.cse-leftmenu a:hover,
div.cse-settings i:hover {
  color: #222 !important;
}

/* CSE left menu icons */

.well.cse-leftmenu .menu-item svg {
  width: 72px;
  height: 72px;
}

.well.cse-leftmenu .menu-item svg path {
  fill-opacity: 0.5;
}

div.csenav-left {
  position: fixed;
  left: 6rem;
  top: 148px;
}

div.csenav-left a {
  color: #555;
}

div.csenav-left a:hover {
  color: #222;
}

.agrume-header h1.docslib-title svg {
  width: 48px;
  height: 48px;
  vertical-align: text-bottom;
}

.search-plus-btn i {
  color: #666;
  cursor: pointer;
}

.search-plus-btn i:hover {
  color: #222;
}

/* EMPLOYEURS */

div.ajout-employeurs {
  margin-top: 25px;
}

.ajouter_salarie_div {
  width: 67%;
  margin-top: 15px;
}

div.ajout-employeurs a {
  background-color: #7c65f1;
  color: white;
  text-transform: uppercase;
  padding: 15px;
  clear: both;
  display: block;
  border-radius: 10px;
}

div.ajout-employeurs a:hover {
  background-color: #44368e;
  text-decoration: none;
}

div.agrume-box-add .glyphicon-plus {
  font-size: 14px;
  padding-right: 5px;
}

.liste-employeurs {
  margin-top: 25px;
}

ul.liste-employeurs-dashboard {
  -webkit-padding-start: 0px;
  padding: 0px;
  margin-top: 25px;
}

ul.liste-employeurs-dashboard > li {
  display: block;
  border-bottom: 1px solid #e2ddd3;
}

ul.liste-employeurs-dashboard > li:first-child {
  display: block;
  border-top: 1px solid #e2ddd3;
}

ul.liste-employeurs-dashboard > li.active > a {
  background-color: #2a2624;
  color: #fff !important;
}

ul.liste-employeurs-dashboard > li > a {
  display: block;
  padding: 25px !important;
  color: #898989 !important;
  font-size: 14px !important;
  border: 0px solid !important;
}

ul.liste-employeurs-dashboard > li > a:hover {
  background-color: #fbfbfc;
  color: #222122 !important;
  text-decoration: none;
}

.badge {
  padding: 3px 6px;
}

.badge:empty {
  display: inline-block !important;
  width: 15px !important;
  background-color: transparent !important;
}

legend .badge {
  margin-bottom: 5px;
  margin-right: 5px;
}

.dynamenu .badge {
  font-size: 8px;
  padding: 3px 5px;
  margin-bottom: 2px;
}

.field_title.groupe {
  color: #fa613d;
  font-size: 20px;
  margin-top: 0px;
  font-weight: 100 !important;
  margin-bottom: 10px;
  text-transform: uppercase;
}

.field_title {
  color: #797070;
  font-size: 14px;
}

.field {
  margin-bottom: 15px;
}

.field input,
.field select.input-sm,
.field .input-sm {
  height: 40px;
  padding: 10px 10px;
  border: 1px solid #d0cfc9;
}

.field input[type="radio"],
input[type="checkbox"] {
  padding: 10px;
}

/*              PARTIE DOCUMENTS SALARIE              */

.titre-commentaire {
  text-transform: uppercase;
}

.block-commentaire {
  background-color: #f8f2e6;
  font-size: 11px;
  padding-top: 15px;
  padding-bottom: 15px;
}

.commentaires {
  overflow-y: scroll;
  max-height: 60px;
  padding-right: 15px;
}

#style-commentaire::-webkit-scrollbar-thumb {
  border-radius: 10px;
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
  background-color: #555;
}

#style-commentaire::-webkit-scrollbar {
  width: 12px;
  background-color: #f5f5f5;
}

#style-commentaire::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
  border-radius: 10px;
  background-color: #f5f5f5;
}

.helpicon,
.helpicon2,
.helpicon3 {
  width: 16px;
  height: 16px;
  display: inline-block;
  margin-left: 5px;
  background-image: url(../img/helpbutton.png);
  cursor: pointer;
}

.helpicon2 {
  background-image: url(../img/helpbutton2.png);
}

/*          Partie Procedure Salarié            */

div.flex {
  display: flex;
}

div.agrume-procedure-etat {
  border-right: 1px solid #d7d0c3;
  margin-right: 15px;
  font-size: 12px;
  text-transform: uppercase;
}

/* PAGE CREATION PROCEDURE */

div.procedure_intro,
div.module_intro {
  margin-bottom: 15px;
}

div.module_description {
  margin-top: 15px;
}

.modal-body,
.modal-body2 {
  padding: 30px;
  text-align: justify;
}

.btn {
  font-size: 14px !important;
  text-transform: uppercase;
}

.btn-sm {
  font-size: 10px !important;
  padding: 2px 6px;
}

.btn-primary {
  color: #fff;
  background-color: #5c5a59;
  border-color: #5c5a59;
}

.btn-primary:hover,
.btn-primary:focus {
  color: #fff;
  background-color: #3a3a3a;
}

.btn-salarie {
  color: #fff;
  background-color: #fa613d;
  border-color: #fa613d;
}

.btn-salarie:hover,
.btn-salarie:focus {
  color: #fff;
  background-color: #a03b24;
  border-color: #a03b24;
}

.btn-procedure {
  color: #fff;
  background-color: #18c973;
  border-color: #18c973;
}

.btn-procedure:hover,
.btn-procedure:focus {
  color: #fff;
  background-color: #0f8049;
  border-color: #0f8049;
}

.btn-employeur {
  color: #fff;
  background-color: #7c65f1;
  border-color: #7c65f1;
}

.btn-employeur:hover,
.btn-employeur:focus {
  color: #fff;
  background-color: #44368e;
  border-color: #7c65f1;
  /*TODO ADD THE RIGHT BORDER COLOR*/
}

.btn-success {
  color: #fff;
  background-color: #18c973;
  border-color: #18c973;
}

.btn-success:hover,
.btn-success:focus {
  color: #fff;
  background-color: #0f8049;
  border-color: #0f8049;
}

.icon-export {
  padding-right: 5px;
}

ul.list-documents {
  list-style-type: none;
  -webkit-padding-start: 0px;
  margin: 0px;
  padding: 0px;
}

ul.list-documents li {
  background-image: url(../img/trombone_vert.png);
  background-position: 0px 9px;
  background-repeat: no-repeat;
  padding-left: 30px;
  padding-top: 5px;
  margin-left: 0px;
  line-height: 2em;
}

.rule_title {
  font-weight: bold;
}

.module_actiondate input,
.module_receptiondate input {
  float: right;
}

.module_actiondate label,
.module_receptiondate label {
  text-align: right;
  padding-top: 5px;
  width: 100%;
}

/* do not think this is useful any more!
.module_actiondate .row div, .module_receptiondate .row div{
padding-left:  7.5px!important;
padding-right: 7.5px!important;}*/

.creation-compte {
  display: none;
}

.slide {
  cursor: pointer;
}

h3.internalSlide {
  cursor: pointer;
}

h3.internalSlide i.arrow {
  border: solid #797070;
  border-width: 0 3px 3px 0;
  display: inline-block;
  padding: 3px;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
}

h3.internalSlide.opened i.arrow {
  transform: rotate(-135deg);
  -webkit-transform: rotate(-135deg);
}

div.internalSlide {
  padding-left: 30px;
  border-left: 3px solid #ccc;
}

/** procedures steps **/

i.procstep {
  float: left;
  width: 32px;
  height: 32px;
  margin-right: 15px;
  border: 5px solid #ddd;
  padding: 2px;
  border-radius: 16px;
  cursor: pointer;
}

i.procstep {
  color: transparent;
}

i.procstep.step-validated,
i.procstep:hover {
  color: #18c973;
}

.procedure-step-title h3 {
  margin-top: 7px;
}

/** Calendar **/

#calendar .fc-title {
  font-size: 10px;
  cursor: pointer;
}

#calendar .fc-day-number {
  color: #797070;
}

#calendar_summary .oneproc {
  border-left: 3px solid;
  margin: 0 0 4px;
  padding-left: 10px;
  font-size: 13px;
}

#calendar_summary .no_proc {
  font-size: 12px;
  font-style: italic;
}

#calendar_summary .no_proc,
#updates_summary .no_proc,
#updates_summary ul li div {
  font-size: 12px;
  font-style: italic;
}

#updates_summary ul li {
  padding-bottom: 20px;
}

#updates_summary .descriptionmaj p {
  margin-bottom: 2px;
}

#updates_summary {
  font-size: 12px;
}

#updates_summary ul {
  padding-left: 15px;
}

#updates_summary ul li {
  text-align: left;
  list-style-type: square;
}

/**IMPORT SECTION **/

.importIgnore {
  text-decoration: line-through;
}

.importSuccess {
  color: green;
}

.importError,
.importError span,
.importError .caret {
  color: red !important;
}

#importedData td,
#importedData th {
  white-space: nowrap;
}

/* ACL_TABLE */

#acl_table .searchelement td:not(:first-child) {
  text-align: center;
  cursor: pointer;
}

#acl_table .fa-check,
#cseteam_table .fa-check {
  color: #13a55e;
}

#acl_table .fa-times,
#cseteam_table .fa-times {
  color: #ff4e4e;
}

/* CSETEAM_TABLE */
.cseteam-teammanager th {
  vertical-align: middle !important;
}

.cseteam-teammanager thead th {
  background-color: #ddd;
  border-top: none !important;
  border-bottom: none !important;
  padding-top: 9px !important;
  padding-bottom: 9px !important;
}

.cseteam-teammanager th.cseteam-action {
  font-size: 11px;
}

.cseteam-teammanager .cseteam-action {
  width: 60px;
}

.cseteam-teammanager .member-selector {
  width: 24px;
}

.cseteam-teammanager .cselogins-icon.clickable {
  cursor: pointer;
}

.cseteam-teammanager a.mass-action {
  cursor: pointer;
  text-decoration: none;
  color: unset;
}

.cseteam-teammanager a.mass-action:hover {
  text-decoration: underline;
}

#cseteam_table tr .agrume-onsearch {
  white-space: nowrap;
}

.action.fa-times:hover {
  color: #ff4e4e;
}

/*Page tarifs */

.tarification {
  font-size: 40px;
}

.tarification sup {
  font-size: 20px;
}

#tarification fieldset {
  margin-top: 20px;
}

.timeline {
  display: flex;
  align-items: center;
}

.timeline tr {
  border: solid #27cd7c;
}

.timeline td {
  border: solid white;
  border-width: 0 0 0 2px;
  text-align: center;
  background-color: #27cd7c;
}

.timeline td a {
  color: white;
}

#sectionoverwrite_modeles_area ul {
  padding: 10px;
}

.field.sectionoverwrite_modeles {
  text-align: left;
}

.callout {
  padding: 20px;
  margin: 20px 0;
  border: 1px solid #eee;
  border-left: 5px solid #18c973;
  border-radius: 3px;
}

/* CHOSEN */

.chosen-container-active .chosen-choices,
.chosen-container-active .chosen-drop {
  border: 1px solid #27cd7c;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(0, 0, 0, 0.4);
}

.chosen-container-active .chosen-choices {
  border-bottom: 0;
}

.chosen-container-active .chosen-drop {
  border-top: 0;
}

.chosen-container .chosen-results li.highlighted {
  background-color: #27cd7c !important;
}

pre > pre {
  margin: 0px 0px 10px;
  font-size: 0.8rem;
}

/* Tableau importmatch */

.importmatch thead th.stickycolumn,
.teammanager-wrapper thead th.stickycolumn {
  position: sticky;
  z-index: 2;
}

.importmatch thead th.stickycolumn {
  left: 7em;
}

.teammanager-wrapper thead th.stickycolumn {
  left: 0em;
}

.importmatch table thead th,
.teammanager-wrapper table thead th {
  padding: 3px;
  position: sticky;
  top: 0;
  z-index: 1;
  background-color: white;
}

.importmatch table tbody th.stickycolumn,
.teammanager-wrapper table tbody th.stickycolumn {
  position: relative;
  position: sticky;
  left: 0;
  z-index: 1;
  background-color: white;
}

.importmatch table tbody td.stickycolumn,
.teammanager-wrapper table tbody td.stickycolumn {
  position: relative;
  position: sticky;
  background-color: white;
}

.importmatch table tbody td.stickycolumn {
  z-index: 1;
  left: 7em;
}

.teammanager-wrapper table tbody td.stickycolumn {
  z-index: 0;
  left: 0em;
}

.importmatch table tbody .stickycolumn.oddrow,
.teammanager-wrapper table tbody .stickycolumn.oddrow {
  background-color: #f9f9f9;
}

.teammanager-row {
  overflow-x: hidden;
  overflow-y: hidden;
}

.teammanager-wrapper table tbody td.stickycolumn {
  min-width: 180px;
}

@media (min-width: 1400px) {
  .importmatch-row,
  .teammanager-row {
    width: 1460px;
    margin-left: -156px;
  }
}

.modal-body2 div[id^="envoimailmasse_"] input {
  width: 100%;
}

.listing-element-todelete {
  cursor: pointer;
}

.listing-right-buttons .row {
  margin-right: auto;
}

.agrume-box.grayed,
.agrume-box.grayed:hover {
  background-color: #fe674563;
}

footer.inexagrume {
  position: fixed;
  bottom: 0;
  left: 0;
  padding: 5px;
  font-size: 8px;
  color: #ccc;
}

#agrume_document h3.titlesize-sm {
  font-size: 12px;
}

#agrume_document h3.titlesize-md {
  font-size: 14px;
}

#agrume_document h3.titlesize-lg {
  font-size: 18px;
}

#agrume_document h3.titlesize-xl {
  font-size: 20px;
}

#agrume_document h3.sousarticle.titlesize-sm {
  font-size: 10px;
}

#agrume_document h3.sousarticle.titlesize-md {
  font-size: 12px;
}

#agrume_document h3.sousarticle.titlesize-lg {
  font-size: 14px;
}

#agrume_document h3.sousarticle.titlesize-xl {
  font-size: 18px;
}

.inlineblock {
  display: inline-block;
}

.agrume-tdb {
  text-align: center;
  color: #fff;
}

.agrume-tdb-1 {
  background-color: #7c65f1;
}

.agrume-tdb-2 {
  background-color: #676aef;
}

.agrume-tdb-3 {
  background-color: #fa613d;
}

.agrume-tdb-4 {
  background-color: #27cd7c;
}

.agrume-tdb-title {
  font-size: 32px;
}

.agrume-tdb-nb {
  font-size: 62px;
}

#tdbBornage input[name="date_debut"] {
  border-bottom-right-radius: 0;
  border-top-right-radius: 0;
}

#tdbBornage input[name="date_fin"] {
  border-radius: 0;
  margin-left: -5px;
  margin-right: -5px;
}

#tdbBornage button {
  border-bottom-left-radius: 0;
  border-top-left-radius: 0;
}

.pl-0 {
  padding-left: 0;
}

.pr-0 {
  padding-right: 0;
}

.pt-0 {
  padding-top: 0;
}
.px-10 {
  margin-left: 10px;
  margin-right: 10px;
}
.py-10 {
  margin-top: 10px;
  margin-bottom: 10px;
}
.pb-0 {
  padding-bottom: 0;
}

.ml-10 {
  margin-left: 10px;
}

.mr-10 {
  margin-right: 10px;
}

.mt-10 {
  margin-top: 10px;
}

.mb-10 {
  margin-bottom: 10px;
}

.ml-0 {
  margin-left: 0;
}

.mr-0 {
  margin-right: 0;
}

.mt-0 {
  margin-top: 0;
}

.mb-0 {
  margin-bottom: 0;
}

.ml-20 {
  margin-left: 20px;
}

.mr-20 {
  margin-right: 20px;
}

.mt-20 {
  margin-top: 20px;
}

.mb-20 {
  margin-bottom: 20px;
}

.mt-4 {
  margin-top: 4px;
}

.pt-18 {
  padding-top: 18px;
}

.plr-15 {
  padding: 0 15px 0 15px;
}

.text-left {
  text-align: left;
}

ul.list-none li,
li.list-none {
  list-style-type: none;
}

.tt-none {
  text-transform: none;
}

.btn.jmodedit {
  display: none !important;
}

.agrume-header-filters.w-100 .btn-group,
.agrume-header-filters.w-100 .btn-group .btn.btn-trie,
.agrume-header-filters.w-100 .btn-group ul {
  width: 100%;
}

.gris-c {
  color: #ccc;
}

.search-md {
  font-size: 1em;
  height: 34px;
}

.t-8 {
  font-size: 8px;
}

.t-9 {
  font-size: 9px;
}

.t-10 {
  font-size: 10px;
}

.t-11 {
  font-size: 11px;
}

.t-12 {
  font-size: 12px;
}

.t-13 {
  font-size: 13px;
}

.t-14 {
  font-size: 14px;
}

.container.bdes {
  width: 100%;
  margin: 0;
  margin-top: -30px;
}

.container.bdes .nav-item-donneesmultiple {
  display: none;
}

.container.bdes .div-dynazoom table .hidden-cell,
.container.bdes .icon-supprime.dynaclose {
  background-color: #f6f6f6;
}

.container.bdes .btn-primary.btn-dynazoom,
.container.bdes .btn-danger.btn-dynasuppr {
  background-color: transparent;
  border-color: transparent;
  color: #555;
  padding: 3px 6px;
  transition: all 0.1s ease-out;
}

.container.bdes .btn-danger.btn-dynasuppr {
  color: #900;
}

.container.bdes .btn-primary.btn-dynazoom:hover,
.container.bdes .btn-danger.btn-dynasuppr:hover {
  background-color: #555;
  border-color: #333;
  color: #fff;
  transition: all 0.1s ease-out;
}

.container.bdes .btn-danger.btn-dynasuppr:hover {
  background-color: #900;
  border-color: #700;
}

.container.bdes .field .dynatable input,
.container.bdes .field .dynatable select.input-sm,
.container.bdes .field .dynatable .input-sm {
  height: 30px;
  padding: 5px 10px;
  border: 1px solid #d0cfc9;
  border-radius: 3px;
}

.container.bdes .agrume-area-procedures .agrume-header ul.nav-tabs {
  margin: 15px 0 15px 0;
  border-bottom: 0;
}

.container.bdes .agrume-area-procedures .agrume-header ul.nav-tabs li.nav-item {
  border-bottom: 1px solid #ccc;
}

.container.bdes
  .agrume-area-procedures
  .agrume-header
  ul.nav-tabs
  li.nav-item
  a {
  font-size: 13px;
  padding: 10px 8px;
  max-width: 145px;
  text-align: center;
  height: 60px;
  overflow: hidden;
  border: 1px solid #ddd;
  background-color: #eee;
}

.container.bdes
  .agrume-area-procedures
  .agrume-header
  ul.nav-tabs
  li.nav-item:not(.active)
  > a:hover {
  background-color: #e9e9e9;
  color: #555;
}

.container.bdes
  .agrume-area-procedures
  .agrume-header
  ul.nav-tabs
  li.nav-item.active
  a,
.container.bdes
  .agrume-area-procedures
  .agrume-header
  ul.nav-tabs
  li.nav-item.active {
  background-color: transparent;
  border-bottom: 0;
}

.agrumebuttonsarea.bdese .agrume_buttons {
  width: 100% !important;
}

.dynatable.table.editable {
  min-width: 50%;
}

.container.bdes table.dynatable td,
.container.bdes table.dynatable th {
  font-size: 12px;
}

.container.bdes table.dynatable th.sum-cell,
.container.bdes table.dynatable td.sum-cell {
  vertical-align: middle;
}

.container.bdes table.dynatable td.sum-cell {
  text-align: center;
}

.container.bdes table.dynatable th input,
.container.bdes table.dynatable th textarea,
.container.bdes table.dynatable td input,
.container.bdes table.dynatable td textarea {
  width: 100%;
}

.edit-bdes-remplir > label {
  font-size: 11px;
  padding-top: 4px;
}

.edit-bdes-remplir > label span {
  font-size: 11px;
  font-weight: lighter;
}

.edit-bdes-remplir .form-inline .fillall-checkbox {
  padding: 6px;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  border-right: 0;
}

.edit-bdes-remplir .form-inline input {
  border-radius: 0;
  width: 100%;
}

.edit-bdes-remplir .form-inline .fillall-btn-rightpadding {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  border-left: 0;
}

.edit-bdes-remplir .form-inline .fillall-btn-rightpadding .btn {
  padding: 1px 4px;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
}

.hid {
  display: none;
}

.footer-version {
  position: relative;
  height: 20px;
}

.version-release {
  position: absolute;
  bottom: 5px;
  z-index: 100;
  font-size: 12px;
  color: #bbb;
}

.view-cse .version-release {
  right: 5px;
  opacity: 0.4;
}

.gap20 {
  gap: 20px;
}

.tagSalarie {
  padding: 1px 20px;
  background: red;
  border-radius: 5px;
  color: white;
}

.container.bdes .dynamenu .nav > li.active > a,
.container.bdes .dynamenu .nav > li > a:hover,
.container.bdes,
.dynamenu .nav > li > a:focus {
  background-color: transparent;
}

.container.bdes .dynatable.table {
  width: 100%;
}

.container.bdes .dynatable.table th.sum-cell.tableedge-top {
  text-align: center;
}

.container.bdes .dynatable.table .hidetopleft th.sum-cell:first-child,
.container.bdes
  .dynatable.table
  .hidetopleft
  th.sum-cell.tableedge-top:first-of-type {
  border-left: 2px solid darkgray;
}

.container.bdes .btn-csev2 {
  text-transform: none;
  width: 100%;
  font-size: 13px !important;
  background-color: #eee;
  color: #555;
  border-color: transparent;
  position: relative;
  transition: all 0.1s ease-out;
}

.container.bdes .btn-csev2:hover {
  background-color: #555;
  color: #fff;
  transition: all 0.2s ease-out;
}

.container.bdes .btn-csev2 i {
  margin-right: 5px;
}

.container.bdes .btn-csev2-vert {
  background-color: #18c973;
  color: #fff;
}

.container.bdes .editable-section {
  background-color: #e9e9e9;
}

.agrume-area-reporting .btnExport {
  margin-top: 20px;
  margin-bottom: 10px;
}

.agrume-area-reporting .btnToutCocher {
  float: right;
  cursor: pointer;
  margin-bottom: 10px;
}

.agrume-area-reporting fieldset legend {
  margin-top: 0;
}

.ferie {
  text-align: center;
  width: 90px;
  display: flex;
  flex-direction: column;
  float: right;
}

.dureeEssai {
  text-align: center;
  width: 100%;
}

.essaiExpire {
  text-align: center;
  color: white !important;
}

.productsmenu a.btn-cse-v2 {
  display: none;
}

.faspin:before {
  font-family: "FontAwesome";
  content: "\f2f1";
  display: inline-block;
  animation-name: spin;
  font-weight: 100;
  animation-duration: 2000ms;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}

@keyframes spin {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}

.agrume-box-transfert {
  background-color: grey;
  position: absolute;
  font-size: 10px;
  left: 16%;

  @media screen and (min-width: 992px) {
    left: 14%;
  }
}

.btn.btn-procedure.recalcul-calendrier {
  position: absolute;
  right: 140px;
  top: 1px;
}

/* Supression du calendrier sur la page vote CSEV2 a faire dans le menu de joomla mais pas le temps (JCA) */
.layout-donnees2.task-donnees2 .moduletable {
  display: none;
}

.layout-donnees3.task-donnees3 .moduletable {
  display: none;
}

.alerteEnvoiMasse {
  font-size: 10px;
  text-decoration: underline;
}

.resultatImport {
  text-align: center;
}

#inputRechercheEmployeurDiv {
  width: 100%;
  padding: 0px !important;
}

#global_sal_dureetravail_duree_conventionnelle_particuliere_clause_reinitialiser {
  display: flex !important;
  justify-content: flex-end !important;
  padding-right: 0px !important;
  margin-top: -15px !important;
}

#buttonSignataireDivContainer {
  display: flex;
  align-items: end;
  justify-content: end;
}

.btnMandantSignature {
  margin-left: 5px;
}

.addSignataire {
  display: flex !important;
}

.resetButton {
  margin-right: 5px;
  display: flex;
  align-items: center;
}

.blank_signing_div {
  position: relative;
  min-height: 1px;
  padding-right: 15px;
  padding-left: 15px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.document_blank_signing_value {
  display: flex;
  justify-content: center;
  gap: 10px;
}

.checkbox-container {
  display: flex;
  align-items: center;
}

.checkbox-container input {
  margin-right: 5px;
}

.blank_signing_text {
  margin-bottom: 0px !important;
  margin-top: 5px;
}

.suspensionDiv {
  display: flex;
  flex-direction: row-reverse;
  width: 100%;
  align-items: baseline;
  padding: 8px;
}

#notClient {
  position: fixed;
  top: 25px;
  right: 25px;
  color: white;
  background-color: #27cd7c;
  height: 50px;
  font-size: 16px;
  font-weight: 800;
  border-width: 1px;
  border-radius: 50px;
  padding: 10px 10px;
  border: none;
  cursor: pointer;
  border-style: solid;
  transition: background-color 0.3s ease, transform 0.2s ease;
}

#cancelSignature {
  margin-bottom: 10px;
}

#notClient:hover {
  background-color: white;
  color: #1fa764;
  border-width: 0px;
}

#ajaxhelp_modal table {
  border-collapse: collapse;
  margin: 25px;
  /* font-size: 16px; */
  text-align: left;
  border-radius: 8px;
  overflow: hidden;
}

/* En-tête du tableau */
#ajaxhelp_modal table thead {
  background-color: #d1fae5;
  color: #047857;
  font-weight: bold;
}

#ajaxhelp_modal table thead th {
  padding: 15px;
  text-align: center;
}

/* Lignes du tableau */
#ajaxhelp_modal table tbody tr {
  border-bottom: 1px solid #ddd;
}

/* Alternance de couleurs */
#ajaxhelp_modal table tbody tr:nth-child(odd) {
  background-color: #f9f9f9;
}

#ajaxhelp_modal table tbody tr:nth-child(even) {
  background-color: #fff;
}

/* Cellules */
#ajaxhelp_modal table td {
  padding: 12px;
  vertical-align: middle;
}

/* Centrer les colonnes spécifiques */
#ajaxhelp_modal table td p {
  margin: 0;
}

#ajaxhelp_modal table td:nth-child(1),
#ajaxhelp_modal table td:nth-child(3) {
  text-align: center;
  font-weight: bold;
}

/* Style des listes */
#ajaxhelp_modal table ul {
  padding-left: 20px;
  margin: 5px 0;
}

#ajaxhelp_modal table ul li {
  margin-bottom: 5px;
}

.alert-silae-employeur {
  position: absolute;
  bottom: 10px;
  font-weight: bolder;
  font-size: x-small;
  text-decoration: underline;
}

.connecteur-div-btnsyncroContainer {
  display: flex;
  justify-content: end;
}

.alert-syncro {
  font-weight: bold;
}

.alert-syncro-employeur {
  font-weight: 100;
}

.btnGoParametre {
  text-transform: capitalize;
}

.cancelSignature {
  margin-bottom: 10px;
}

.col-md- {
  margin-left: 15px;
}
#suspensionButton {
  display: flex;
  flex-direction: row-reverse;
  margin-top: 10px;
  margin-bottom: 10px;
}
#agrume-dashboard-signatures {
  margin-bottom: 20px;
}
.bg-white {
  background-color: white;
}
.wfull {
  width: 100%;
}
.font-semibold {
  font-weight: 600;
}
.font-normal {
  font-weight: 400;
}
.text-color-black {
  color: black;
}