/*
 * Typo lato
 */
@font-face {
  font-family: 'lato';
  src: url("../fonts/lato-Regular.eot?");
  src: url("../fonts/lato-Regular.eot?#iefix") format("embedded-opentype"), url("../fonts/lato-Regular.woff") format("woff"), url("../fonts/lato-Regular.ttf") format("truetype"), url("../fonts/lato-Regular.svg#lato-Regular") format("svg");
}

@font-face {
  font-family: 'cabin';
  src: url("../fonts/cabin.eot?");
  src: url("../fonts/cabin.eot?#iefix") format("embedded-opentype"), url("../fonts/cabin.woff") format("woff"), url("../fonts/cabin.ttf") format("truetype"), url("../fonts/cabin.svg#lato-Regular") format("svg");
}

h1 {
  font: 26px "cabin", "Arial", sans-serif;
  color: #323232;
  font-weight: normal;
}

h2 {
  font: 22px "cabin", "Arial", sans-serif;
  color: #323232;
  font-weight: normal;
}

h3 {
  font: 20px "cabin", "Arial", sans-serif;
  color: #323232;
  font-weight: normal;
}

h3 > span {
  font-weight: normal;
}

h4, h5 {
  font: 15px "lato", "Arial", sans-serif;
  color: #444444;
}

p, a, label, li {
  font: 14px "lato", "Arial", sans-serif;
  color: #808080;
}

a, .pointer { cursor: pointer; }

b { font-weight: bold; }
/*
 * Reset default style chrome
 */
input::-webkit-search-decoration,
input::-webkit-search-cancel-button {
  display: none;
}

.update {
  width: 100%;
  display: block;
  background: #d9edf7;
  padding: 15px;
  font-size: 14px;
  margin-bottom: 20px;
  color: #31708f;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
}

/*
 * Default classes
 */
.noScrolling { overflow: hidden }

.relative { position: relative; }

.block { display: inline-block; }

.hidden { display: none; }

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

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

.no-margin { margin: 0px !important; }

.no-padding { padding: 0px !important; }

.no-float { float: none !important; }

.no-border { border: none !important;  }

.medskip {
  font-size: 10pt;
  padding: 0ex 0ex;
}

.largeskip {
  font-size: 10pt;
  padding: 1ex 0ex;
}

.bigskip {
  font-size: 10pt;
  padding: 2ex 0ex;
}

.x-bigskip {
  font-size: 10pt;
  padding: 5ex 0ex;
}

.leftColumn {
  padding: 0 15px 0 0;
}

.rightColumn {
  padding: 0 0 0 15px;
}

.alignTop { vertical-align: top; }

.fleft { float: left; }

.fright { float: right !important; }

.line {
  height: 1px;
  background: #666666;
  text-align: center;
}

@media screen and (min-width: 768px) {
  .line {
    width: 300px;
    margin: 30px auto 20px auto;  
  }
}

@media screen and (max-width: 767px) {
  .line { 
    width: 220px;
    margin: 10px auto 10px auto;
  }
}

.titleHeading {
  background: #ffffff;
  padding: 20px;
  -webkit-border-radius: 5px 5px 0 0;
     -moz-border-radius: 5px 5px 0 0;
          border-radius: 5px 5px 0 0;
/*  border-left: 1px solid #efefef;
  border-top: 1px solid #efefef;
  border-right: 1px solid #efefef; */ 
}

.titleHeading h4 { margin-top: 5px; }

/* Heading Special Cases */
@media screen and (min-width: 768px) {
  #uniforme-info .titleHeading { padding-bottom: 0; }
}
/*
 * Clearfix
 */
.clearfix:after {
  content: '';
  display: block;
  clear: both;
}

.clearfix {
  display: block;
}

* html .clearfix {
  height: 1%;
}

/*
 * Loader
 */
#loading {
  width: 100%; height: 100%;
  top: 0;
  position: fixed;
  z-index: 99999;
  background: rgba(0, 0, 0, 0.3);
}

#loading p {
  top: 50%; left: 50%;
  display: inline-block;
  font-size: 16px;
  position: absolute;
  margin: -14px 0 0 -63px;
  background: #ffffff;
  padding: 10px;
}
#loading p img {
  margin-right: 7px;
  vertical-align: middle;
}

/*
 * Nofication
 */
.pastille {
  width: auto;
  min-width: 20px;
  min-height: 20px;
  position: absolute;
  -webkit-border-radius: 100px;
     -moz-border-radius: 100px;
          border-radius: 100px;
  z-index: 2;
  line-height: 21px !important;
  margin: -9px 0 0 8px;
  color: #ffffff;
  background: #DD4343;
  font: 14px "arial";
  text-align: center;
  overflow: hidden;
}

/*
 * Grid
 */
.grid-12 {
  display: inline-block;
  vertical-align: top;
  width: 100%;
}

.grid-11 {
  display: inline-block;
  vertical-align: top;
  width: 91.66666666665%;
}

.grid-10 {
  display: inline-block;
  vertical-align: top;
  width: 83.33333333332%;
}

.grid-9 {
  display: inline-block;
  vertical-align: top;
}

.grid-8 {
  display: inline-block;
  vertical-align: top;
}

.grid-7 {
  display: inline-block;
  vertical-align: top;
}

.grid-6 {
  display: inline-block;
  vertical-align: top;
}

.grid-5 {
  display: inline-block;
  vertical-align: top;
}

.grid-4 {
  display: inline-block;
  vertical-align: top;
}

.grid-3 {
  display: inline-block;
  vertical-align: top;
}

.grid-2 {
  display: inline-block;
  vertical-align: top;
}

.grid-1 {
  display: inline-block;
  vertical-align: top;
  width: 8.33333333332%;
}

@media screen and (max-width: 767px) {
  
  .grid-2 { width: calc(100% / 2); }
  .grid-3, .grid-4, .grid-5, .grid-6, .grid-7, .grid-8, .grid-9 { width: 100%; }
}

@media screen and (min-width: 768px) {
  
  .grid-2 { width: 16.66666666665%; }
  .grid-3 { width: 25%; }
  .grid-4 { width: 33.33333333332%; }
  .grid-5 { width: 41.66666666665%; }
  .grid-6 { width: 50%; }
  .grid-7 { width: 58.33333333332%;}
  .grid-8 { width: 66.66666666665%; }
  .grid-9 { width: 75%; } 
}

/*
 * Font awesome icons
 */
.checkbox-no { color: #DD4343; }

.checkbox-yes { color: #7fb842; }

/*
 * Form elements
 */
fieldset {
  border: none;
  padding: 0;
  margin: 0;
}

select { cursor: pointer; }
input, select, button {  
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none; 
}

input, select, textarea, div.fake-select {
  width: 100%; height: 40px;
  outline: none;
  border: 2px solid #c9c9c9;
  padding: 6px;
  color: #666666;
  background: #ffffff;
  font: 14px "lato", "Arial", sans-serif;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;        
}
div.fake-select {
  overflow-y: scroll;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
}

textarea { width: 100%; min-height: 100px; }

select:hover,
select:focus,
input:hover,
input:focus, 
textarea:hover,
textarea:focus {
  border-color: rgba(127, 184, 66, 0.6);
  -webkit-transition: border 0.2s ease;
     -moz-transition: border 0.2s ease;
          transition: border 0.2s ease;
}

select, div.fake-select { cursor: pointer; }

label {
  width: 30%; 
  display: block;
  float: left;
  margin-right: 15px;
  text-align: left;
}

/*label i { padding-left: 5px; cursor: pointer; }*/

/*label i:hover { color: #DD4343; }*/

/* Input & Label Special Cases */
label[for='personnel-updateUser-iAmMale'],
label[for='personnel-updateUser-iAmFemale'],
label[for='externe-updateOutsider-iAmMale'],
label[for='externe-updateOutsider-iAmFemale'] {
  padding-top: 0;
  padding-bottom: 0;
  text-align: left;
  width: 70px;
}

input[type='radio'] { width: 12px; height: 12px; }

input[type='file'] {
  margin-top: 5px;
  padding: 10px;
}

input[type='file']:hover { cursor: pointer; }

/*input[type='time'] { width: 100px !important; }*/

input[type='search']:hover { border-color: rgba(127, 184, 66, 0.6) !important; }

input[type='submit'] {
  height: 40px;
  padding: 10px 15px;
  border: none;
  cursor: pointer;
  color: #ffffff;
  background: #7fb842 !important;
  float: right;
}

input[type='submit']:hover {
  background: #85C73E !important;
  -webkit-transition: background .3s ease-in;
  -moz-transition: background .3s ease-in;
  transition: background .3s ease-in;
}

input[type='checkbox'] {
  width: 14px;
  height: 14px;
  border: 1px solid #e6e6e6;
  vertical-align: middle;
  margin-right: 10px;
  float: left;
}

input[name='particle'], 
input[name='birthParticle'] {
  margin-right: 10px;
  width: 20%;
}

input[name='zipCode'],
input[name='birthPlaceZipCode'],
input[name='originZipCode'] { width: 25%; }

input[name='city'],
input[name='birthPlace'],
input[name='originCity'] {
  width: calc( 100% - 10px - 25% );
  margin-left: 10px;
}

input[name='lastName'].nameWithParticle,
input[name='birthName'].nameWithParticle {
  width: calc(100% - 20% - 10px)
}
/* End Input Special Cases */

.radio-group .radio-list { margin: 10px 0 17px 0; }

.label-group,
.checkbox-group,
.radio-group {
  margin-bottom: 20px;
  position: relative;
}

.label-group ul li { color: #474747; }

.label-group span,
.label-group span a,
.textarea-group span {
  color: #474747;
}

.radio-group span {
  color: #474747;
  font-size: 15px;
}

/*.label-group:last-child,
.checkbox-group:last-child,
*/
.textarea-group {
  margin-bottom: 0 !important;
  border: none !important;
}

.label-group .input-stack { display: inline; }

.label-group .wrench-group select { width: calc(100% - 43px); }

.checkbox-group label { width: 100%; }

.checkbox-group label > span:first-child {
  width: 30%;
  display: inline-block;
  margin-right: 15px;
  vertical-align: middle;
}

/* modal with search system (ex: peronnel-user-wizzard) */
.filterModal .buttons-form { margin-top: 0; }

.filterModal .buttons-form input[type="submit"] { 
  width: auto;
  margin: 0;
}


/* Style for checkbox - radio - select for formEdit mode */
form.editMode .checkbox-group label span { 
  width: 100%;
  margin-right: 0;
}

/*form.editMode .checkbox-group label span:hover { color: #999999; }*/

form.editMode .label-group label,
form.editMode .radio-group label {
  width: 100%;
}

form.editMode div.checkbox-group label { 
  width: auto;
  display: inline-block;
}

@media screen and (max-width: 767px) {

  form.editMode .label-group .wrench-group .selectArrow { right: 63px; }

  .filtersList .radioFilter {
    width: 100%;
    margin-bottom: 10px;
    margin-right: 0;
  }

  .filtersList .radioFilter:last-child { margin: 0; }  

}

@media screen and (min-width: 768px) {

  form.editMode .label-group label,
  form.editMode .radio-group label,
  form.editMode .textarea-group label {
    margin-bottom: 10px;
  }

  form.editMode .label-group .wrench-group .selectArrow { right: 53px !important; }

}

form.editMode .personnalisedInput,
form.filterSort .personnalisedFilter {
/*  width: 100%;*/
  display: block;
  margin-right: 0;
  position: relative;
/*  padding-left: 25px;*/
}

form.editMode .radio-group .personnalisedInput,
form.filterSort .personnalisedFilter.radioFilter {
/*  width: auto;*/
  display: inline-block;
}

form.editMode .personnalisedInput label,
form.filterSort .personnalisedFilter { cursor: pointer; }

form.editMode .personnalisedInput label,
form.filterSort .personnalisedFilter {
  min-height: 40px;
  border: 2px solid #c9c9c9;
  padding: 9px 10px 9px 40px;
  margin-bottom: 0; 
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  -webkit-transition: all .2s ease-in;
     -moz-transition: all .2s ease-in;
          transition: all .2s ease-in;            
}

form.editMode .personnalisedInput label:hover,
form.filterSort .personnalisedFilter:hover { 
  background: rgba(127, 184, 66, 0.6);
  border-color: rgba(127, 184, 66, 0.6);
}

form.editMode .personnalisedInput label:hover span,
form.filterSort .personnalisedFilter:hover span { color: #fff; }

form.editMode .personnalisedInput span,
form.filterSort .personnalisedFilter span {
  width: auto;
}

/*form.editMode .radio-group .personnalisedInput,
form.editMode .radio-group.personnalisedFilter { margin-right: 10px; }*/


form.editMode .personnalisedInput input,
form.filterSort .personnalisedFilter input {
  position: absolute;
  z-index: -1;
  opacity: 0;
}

form.filterSort .personnalisedFilter .controlIndicator {
  top: 8px; left: 8px;
}

form.editMode .controlIndicator,
form.filterSort .checkboxFilter .controlIndicator {
  position: absolute;
  top: 10px; left: 10px;
  width: 20px; height: 20px;
  border: 2px solid #c9c9c9;
  background: #ffffff;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  -webkit-transition: all .2s ease-in;
     -moz-transition: all .2s ease-in;
          transition: all .2s ease-in;             
}

form.editMode .radio-group .controlIndicator,
form.filterSort .radioFilter .controlIndicator {
  -webkit-border-radius: 50%;
     -moz-border-radius: 50%;
          border-radius: 50%;
}

form.editMode .personnalisedInput:hover input ~ .controlIndicator,
form.editMode .personnalisedInput input:focus ~ .controlIndicator,
form.filterSort .personnalisedFilter:hover input ~ .controlIndicator,
form.filterSort .personnalisedFilter input:focus ~ .controlIndicator  {
  border-color: rgba(127, 184, 66, 0.6);
}

form.editMode .personnalisedInput input:checked ~ .controlIndicator,
form.filterSort .personnalisedFilter input:checked ~ .controlIndicator {
  background: rgba(127, 184, 66, 0.6);
  border-color: rgba(127, 184, 66, 0.6);
}

form.editMode .controlIndicator:after,
form.filterSort .personnalisedFilter .controlIndicator:after {
  content: '';
  position: absolute;
  display: none;
}
form.editMode .personnalisedInput input:checked ~ .controlIndicator:after,
form.filterSort .personnalisedFilter input:checked ~ .controlIndicator:after {
  display: block;
}

form.editMode .checkbox-group .controlIndicator:after,
form.filterSort .checkboxFilter .controlIndicator:after {
  width: 5px; height: 9px;
  top: 1px; left: 5px;
  border: 2px solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

form.editMode .radio-group .controlIndicator:after,
form.filterSort .radioFilter .controlIndicator:after {
  width: 8px; height: 8px;
  top: 4px; left: 4px;
  border-radius: 50%;
  background: #fff;
}

form.editMode .label-group select::-ms-expand, 
form.filterSort .filterType select::-ms-expand { display: none; }

.unitsBlock select[data-editable="true"] ~ .selectArrow,
form.editMode .label-group select[data-editable="true"] ~ .selectArrow,
form.filterSort .filterType select[data-editable="true"] ~ .selectArrow  {
  width: 0; height: 0;
  top: 45px; right: 12px;
  position: absolute;
  pointer-events: none;
  border-style: solid;
  border-width: 8px 6px 0 6px;
  border-color: #7b7b7b transparent transparent transparent;
}

form.editMode .label-group select.list-insert-input ~ .selectArrow {right: 57px !important; top: 41px;}

.unitsBlock div.selectArrow { top: 14px; right: 7px; }

form.editMode .label-group .configure select { width: calc(100% - 43px); }

form.filterSort .filterType .selectArrow { top: 18px !important; }
form.editMode .grid-8.label-group .selectArrow { top: 18px !important; }
form.filterSort .filterType.leftColumn .selectArrow { top: 18px !important; right: 27px !important;}

form.editMode .radio-group span,
.filtersList .radio-group span {
  color: #808080;
  font-size: 14px;
}

span[data-valueEmpty="true"]:after {
  content: '\2014';
}
span[data-name="particle"][data-valueEmpty="true"]:after,
span[data-name="birthParticle"][data-valueEmpty="true"]:after,
span[data-name="zipCode"][data-valueEmpty="true"]:after,
span[data-name="birthPlaceZipCode"][data-valueEmpty="true"]:after
 {
  content: '';
}
ul[data-type="list"]:empty:after {
  content: '\2014';
}

/* End Style for checkbox - radio - select for formEdit mode */


/* part title in module */
#client-updateEmployee h4,
#formationCompetence-addPart h4 {
  width: 100%;  
  color: #323232;
  padding: 10px; 
  margin-bottom: 15px;
  background: #EDEDED;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
}

form label.compulsory:after {
  color: red;
  content: '*';
  margin-left: .5ex;
}

/*
 * Personnalised Lists style
 *
 * has-list-style   == li with only one link (ex : search page)
 * has-list-style-2 == li with many links hidden by an icon " ... " (ex : personnel - affectations)
 */

.moduleTitle span { vertical-align: middle; }
.moduleTitle i { vertical-align: middle; text-align: right; font-size: 23px; }

.has-list-style li { 
  margin-bottom: 10px;
  background: #f6f6f6;
  position: relative;
}

.has-list-style-2 li {
  padding: 15px;
  background: #f6f6f6;
}

.has-list-style li div > span { padding: 15px; }

.has-list-style li > a {
  color: #666666;
  padding: 15px;
  display: block;
}

.has-list-style li a:hover,
.has-list-style-2 li:hover  {
  background: rgba(201,201,201,0.3);
}

.has-list-style li a span, 
.has-list-style-2 li span {
  vertical-align: middle;
}

.has-list-style li i {
  text-align: right;
  vertical-align:middle;
  font-size: 22px;
}

.has-list-style-2 li i {
  text-align: right;
  vertical-align:middle;  
  font-size: 18px;
}
/*
.has-list-style .more-options {
  top: 8px; right: 40px;
  position: absolute;  
}

.has-list-style .more-options li {
  background: none;
  float: left; 
}

.has-list-style .more-options li:last-child { margin-right: 5px; }

.has-list-style .more-options li a  {
  width: 40px; height: 38px;  
  border-right: 1px solid #eaeaea;
  padding: 0;
}

.has-list-style .more-options li:hover,
.has-list-style .more-options li a:hover { background: none; }*/

/*.has-list-style li i.fa-edit,
.has-list-style li i.fa-trash-o { 
  font-size: 18px;
  padding: 11px;
}
*/
.results-list { margin: 10px 0 20px 0; }

.results-list li {
  margin-left: 10px;
  padding: 10px;
  background: #fbfbfb;  
}

.results-list li .admitted { color: #7fb842; }

.results-list li .refused { color: #FF6B6B; }

.results-list li i { font-size: 18px; margin-right: 3px; }

/*
 * Buttons
 */
.buttonsList .btn, 
.buttonsListModal .btn, 
.buttonsListInner .btn {
  margin-right: 15px;
/*  float: left;*/
}

.buttonsList {
  top: 0; right: 0;
  position: absolute;
}

@media screen and (min-width: 768px) {
  .buttonsListModal .btn, 
  .buttonsListInner .btn { 
    margin-bottom: 20px;
  }

}

@media screen and (max-width: 767px) {
  .buttonsListModal .btn, 
  .buttonsListInner .btn { 
    margin: 10px 10px 20px 10px;
  }

  .buttonsList {
    top: 0; right: 0;
    position: relative;
    margin-bottom: 10px;    
  }
/*  .buttonsListInner { margin-top: 10px; }*/
}

.buttonsListModal.button:empty,
.buttonsListInner.button:empty { display: none; }

button { 
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px; 
}

.selectSort {
  float: left;
  margin-right: 15px;
}

/*.button > a {
  height: 40px;
  padding: 10px 15px;
  border: 1px solid #DD4343;
  color: #DD4343;
  font: 14px "lato", "Arial", sans-serif;
  cursor: pointer;
  display: inline-block;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;    
  -webkit-transition: all .2s ease-in;
     -moz-transition: all .2s ease-in;
          transition: all .2s ease-in;
  text-align: center;            
}*/

.btn {
  height: 40px;
  padding: 11px 10px;
  border: 1px solid #DD4343;
  color: #DD4343;
  font: 14px "lato", "Arial", sans-serif;
  cursor: pointer;
  display: inline-block;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;    
  -webkit-transition: all .2s ease-in;
     -moz-transition: all .2s ease-in;
          transition: all .2s ease-in;
  text-align: center;            
}

.btn > input { width: auto; }

.btn.addButton {
  background: #DD4343;
  color: #FFFFFF;
}

.btn.addButton:hover {
  background: #e33838;
  border-color: #e33838;
}

.btn.iconButton { width: 40px; position: relative; }

.buttons-form .button-cancel,
.modal-buttons .button-cancel {
  margin: 0 20px;
  border-bottom: 2px solid #737373;
  color: #737373;
  -webkit-transition: all .3s ease-in;
     -moz-transition: all .3s ease-in;
          transition: all .3s ease-in;
}

.delete-button {
  border-bottom: 2px solid #737373;
  color: #737373;
  -webkit-transition: all .3s ease-in;
     -moz-transition: all .3s ease-in;
          transition: all .3s ease-in;  
}

.buttons-form .button-cancel:hover,
.modal-buttons .button-cancel:hover,
.delete-button:hover {
  border-bottom: 2px solid #c9c9c9;
  color: #c9c9c9;  
}

.buttons-form .button-validate,
.modal-buttons .button-validate {
  width: auto;
  float: none;
}

.modal-cancel {
  height: 40px;
  border: none !important;
  cursor: pointer;
  color: #ffffff;
  background: #737373;
}

a.button.button-cancel:hover,
.modal-cancel:hover {
  background: #bcbcbc;
  border-color: #bcbcbc;
  -webkit-transition: background .3s ease-in;
     -moz-transition: background .3s ease-in;
          transition: background .3s ease-in;  
}

/*.addButton { background: #f2f2f2; }*/

/*.addButtonInner { background: #ffffff; }*/

.btn:hover {
  color: #ffffff;
  background: #DD4343;
}

/*.button > a:hover {
  color: #ffffff;
  background: #DD4343;
}*/

.seeMore {
  background: #323232;
  border-color: #323232 !important;
  color: #ffffff;
}

.seeMore:hover {
  background: #666666;
  border-color: #666666 !important;
  color: #ffffff !important;
  -webkit-transition: all .3s ease-in;
     -moz-transition: all .3s ease-in;
          transition: all .3s ease-in;
}

/*a.goBack { background: #DD4343; color: #ffffff; }*/

.goBack {
  color: #323232;
  display: inline-block;
  vertical-align: middle;
  background: #FFF;
  padding: 3px 10px 3px 9px;
  border-radius: 3px;
  margin-right: 10px;
}

.goBack:hover {
  background-color: #DD4343;
  color: #fff;
  -webkit-transition: all .3s ease-in;
     -moz-transition: all .3s ease-in;
          transition: all .3s ease-in;
}

.validate { background: #DD4343 !important; color: #ffffff; }

.validate:hover {
  background: #7fb842 !important;
  -webkit-transition: background .3s ease-in;
     -moz-transition: background .3s ease-in;
          transition: background .3s ease-in;
}

.buttons-form { margin-top: 30px; margin-bottom: 0; }

.seeMoreButton { 
  width: 60%;
  padding: 10px; 
  display: inline-block;
  text-align: center;
  vertical-align: top;
  background: #fff;
  color: #737373;
  border: 1px solid #737373; 
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
}

.seeMoreButton:hover { 
  background: #737373;
  color: #ffffff;
  -webkit-transition: all .2s ease-in;
     -moz-transition: all .2s ease-in;
          transition: all .2s ease-in;
}


form input[type="date"] { width: 60%;}
form input[type="time"] { width: calc(100% - 60% - 1ex); margin-left: 1ex;}

/* Special Cases */
.communicationOptions .seeMoreButton { width: 100%; }

/*
 * Selects
 */
.selectSort p, .selectSort a {
  float: left;
}

.selectSort a {
  margin-left: 5px;
  color: #DD4343;
  margin-bottom: 5px;
}
.selectSort a:hover {
  text-decoration: underline;
}

.selectSort ul.select {
  width: 170px;
  margin: 30px 0 0 60px;
  background: #323232;
  position: absolute;
  z-index: 1000;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  padding: 10px;
  display: none;
}
.selectSort ul.select li {
  color: #ffffff;
  padding-bottom: 10px;
}
.selectSort ul.select li:last-child {
  padding-bottom: 0;
}
.selectSort ul.select li:hover {
  cursor: pointer;
  color: #DD4343;
}

/*
 * Filtrers
 */
.filterSort {
  padding: 15px;
  background: #ffffff;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;  
}

.filterSort p { color: #444444; }

.filterSort .filtersButton { margin-top: 20px; }

.filterSort input[type="submit"] { 
  width: calc(100% - 60% - 20px);
  margin-left: 20px;
}

.filtersList { margin-top: 15px; }
.filtersList label { width: 100%; margin-right: 0; }

.filterType { position: relative; }

.radioFilter { margin-right: 15px; }
.radioFilter label { margin-right: 0; }
.radioFilter input { float: left; }

/* Special cases */
#blockDateSince label, #blockDateUntil label,
#blockDateBegin label, #blockDateEnd label {
  width: 30px;
  margin-top: 10px;
  display: inline-block;
}

#blockDateSince input, #blockDateUntil input,
#blockDateBegin input, #blockDateEnd input { width: calc(100% - 30px); }

#blockDateTimeBegin input[type="date"], #blockDateTimeEnd input[type="date"] {width: calc(100% - 35% - 30px - 1ex) !important; }
#blockDateTimeBegin input[type="time"], #blockDateTimeEnd input[type="time"] {width: calc(100% - 65% - 30px - 1ex) !important; margin-left: 1ex;}
label.labelFilter {
  width: 30px;
  
}

/*#onCall-list-filter #blockSectionId {  margin-right: 0; } */
/*#blockTypeId.filterType,
#blockStatusId.filterType,
#blockStateId.filterType, 
#blockSectionId.filterType { width: 25%; margin-right: 15px; } */

/*#evenement-list-filter #blockSectionId { width: calc(100% - 230px - 230px); }
#evenement-list-filter #blockSectionId { width: calc(100% - 50% - 30px); }

#personnel-list-filter #blockRightsId.filterType,
/*#blockSearch.filterType,*/
/*#blockPattern.filterType { width: calc(100% - 25% - 15px); }*/

/* 33.33333% */
/*#blockAbilityId,
#blockTrainingId {
  width: calc(100% / 3);
  padding-right: 10px;
}

#blockPositionId {
  width: calc(100% / 3);
}*/

/*#vehicule-list-filter #blockPattern.filterType,
#personnel-list-filter #blockPattern.filterType,
#materiel-list-filter #blockPattern.filterType,
#personnel-list-filter #blockSectionId.filterType,
#formationCompetence-list-filter #blockSectionId { width: calc(100% - 50% - 30px) }

#vehicule-list-filter #blockUserId.filterType { width: 48%; margin-right: 10px; }

#vehicule-list-filter #blockSectionId.filterType { width: calc(100% - 48% - 10px) }*/

/*#seeMoreButton { margin: 10px 0; text-decoration: underline; display: block; }*/

#seeMoreFilters {
  margin-top: 25px; 
  display: none;
}

/*#seeMoreFilters.is-open { display: block; }*/

/*.filterSort input[type="submit"] { width: auto; float: none; margin-top: 10px; }*/


/*
 * Tooltips
 */
.tooltip {
  width: auto;
  position: absolute;
  display: inline-block;
  background: #323232;
  padding: 15px;
  margin-top: -10px;
  display: none;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;      
}

.tooltip span {
  color: #fff;
  font-size: 12px;
}

.tooltip li {
  color: #ffffff;
  padding: 4px 0;
}

.tooltip li a {
  color: #ffffff !important;
  display: block;
}

.tooltip li:hover,
.tooltip li a:hover {
  color: #DD4343 !important;
}

.tooltip .tooltip-arrow {
  width: 0px;
  display: block;
  position: absolute;
  background: inherit;
  width: 12px;
  height: 12px;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

.tooltip-arrow.arrow-top {
  left: 50%;
  margin-left: -6px;
  top: -6px;
}

.tooltip-arrow.arrow-right {
  top: 50%;
  margin-top: -6px;
  right: -6px;
}

.tooltip-arrow.arrow-bottom {
  left: 50%;
  margin-left: -6px;
  bottom: -6px;
}

.tooltip-arrow.arrow-left {
  top: 50%;
  margin-top: -6px;
  left: -6px;
}

.iconButton > .tooltip {
  top: 60px; left: -22px;
  min-width: 80px;
  padding: 8px 10px;
  opacity: 0;
  -webkit-transition: all .3s ease-in;
     -moz-transition: all .3s ease-in;
          transition: all .3s ease-in;   
}

.iconButton:hover > .tooltip {
  display: block;
  opacity: 1;
} 

#notification .notifs {
  top: 70px;
  right: 173px;
  display: none;
}
#notification .notifs p:nth-child(2) {
  color: #ffffff;
  border-bottom: 1px solid #ffffff;
  text-align: left;
}
#notification .notifs ul {
  margin-top: 10px;
}
#notification .notifs ul li {
  width: 100%;
  border: none;
  text-align: left;
  padding: 0 10px;
}
#notification .notifs ul li a {
  top: 0;
  color: #ffffff;
  font-size: 14px;
  padding: 5px 0;
}
#notification .notifs ul li a:hover {
  color: #DD4343;
}
#notification .notifs ul li:hover {
  background: none;
}

/*
 * Tabs
 */
.tab {
  display: none;
}

.first-tab {
  display: block;
}

.tabs > ul {
  margin: 0;
  padding: 0;
  background: #e0dfdf;
  white-space: nowrap;
  overflow: auto;
}

.tabs > ul > li {
  display: inline-block;
  padding: 15px;
  cursor: pointer;
/*  margin: 2px 0 0 5px;
  background: #e6e6e6;
  border: 1px solid #e0dfdf;*/
}

/*.tabs > ul > li.active-tab,*/
.tabs > ul > li:hover { background: rgba(255,255,255,0.2); }
.tabs > ul > li.active-tab { background: rgba(255,255,255,0.3); }

/*.tabs > ul li:first-child.active-tab {
  border-left: 1px solid #efefef;
}*/

.tabs > ul > li.active-tab a,
.tabs > ul > li:hover a {
  color: #DD4343;
}

.tabs > ul > li {
  margin-bottom: 0px !important;
}

/*.tabs > ul > li.active-tab a {
  font-size: 15px
}*/
/*
 * Drop-down menu / List of suggestions
 */
.suggestionList {
  box-shadow: 0px 0px 8px rgba(76, 76, 76, 0.23) !important;
}

.suggestionList .extraData {
  color: #888;
  font-style: italic;
}

.suggestionContainer {
  clear: both;
  position: relative;
}

.suggestionList {
  position: absolute !important;
  overflow-y: auto;
  margin-left: 0px !important;
}

.suggestionList .extraData {
  margin-left: 1ex;
}

.dropdown {
  overflow-y: auto;
  min-width: 150px;
  text-align: left;
  position: relative;
  margin: 0px;
  /*margin-top: 8px;*/
  list-style: none;
  background-color: #ffffff;
  display: none;
  z-index: 1;
  -webkit-box-shadow: 0px 0px 30px rgba(76, 76, 76, 1);
     -moz-box-shadow: 0px 0px 30px rgba(76, 76, 76, 1);
          box-shadow: 0px 0px 30px rgba(76, 76, 76, 1);
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
}

.dropdown ul li:first-child.selected { border-radius: 3px 3px 0 0; }

.dropdown ul li:last-child.selected { border-radius:0 0 3px 3px; }

.dropdown ul li:hover,
.dropdown li.selected {
  background-color: #7fb842;
  color: #fff;
}

.dropdown li {
  padding: 1ex 0.7ex;
}

.dropdown .dropdown-content ul li  {
  padding: 1.5ex;
  margin: 0px !important;
}

.dropdown .dropdown-content-2 ul li a { padding: 1.5ex; display: block; }

.dropdown .dropdown-content-2 ul li:hover a { color: #FFF; }

/*.dropdown li.selected {
  background-color: #7fb842;
  color: #fff;
}

.dropdown li.selected a { color: #FFF; }*/

/*.dropdown i.menu-item-icon {
  min-width: 1ex;
}*/

/*
 * Alert messages
 */
.alert {
/*  -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;
  border: 1px solid transparent;
  padding: 10px;
  margin-bottom: 1.5em;
  background: #DD4343;*/
  display: none;
  margin-top: .3em;
}

.alert-modal {
  margin: 2ex;
  -webkit-border-radius: 2px;
     -moz-border-radius: 2px;
          border-radius: 2px;
  border: 1px solid transparent;
  text-align: center;
  padding: .5ex;
}

.alert-form  p { color: #FF6B6B; }

/*div.alert-form {
  border: 1px solid transparent;
  padding: .5ex 1ex;
  margin-bottom: .3em;
  margin-top: 1em;
}*/

/*div.alert > p, div.alert-form > p {
  margin: 0px;
  padding: 0px;
}
*/
.alert-success {
  background-color: #dff0d8;
  color: #7fb842;
}

.alert-info {
  padding: 15px;
  background-color: #d9edf7;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
}

.alert-warning {
  padding: 15px;
  background-color: #fff7d5;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;  
}

.alert-error {
  padding: 15px;
  background-color: #ffcccc;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;  
}

/* {
  border-color: #faebcc;
  background-color: #fcf8e3;
  color: #8a6d3b;
}*/

.success { color: #7fb842; }

.info { color: #31708F; }

.warning { color: #8a6d3b; }

.error { color: #FF6B6B; }

/*
 * Image cropping system
 */
.user-update-picture {
  margin-bottom: 2ex;
  text-align: center;
}

.user-update-picture img {
  padding: 4px;
  border: 1px solid black;
}

.user-delete-picture {
  text-align: center;
  margin-bottom: 1ex;
}

.cropping-bkg {
  margin-left: auto;
  margin-right: auto;
  padding: 4px;
  border: 1px solid black;
  background-color: #FFFFFF;
  background-repeat: no-repeat;
  background-position: 4px 4px;
  text-align: left;
}

.cropping-area {
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.7);
}

.cropping {
  border: 2px dotted red;
  cursor: move;
}

.cropping-resize {
  display: inline-block;
  cursor: nw-resize;
  color: #CC3030;
  font-size: 10px;
}

.picture-updating {
  text-align: center;
  font-weight: bold;
  display: none;
}

.picture-updating i {
  margin-right: 1ex;
}

/*
 * List modules categories 
 */
.operational { color: #7fb842 ; }
.partiallyOperational { color: #FF782A ; }
.obsolete { color: #DD4343; }

.listItem {
  width: 20%;
  padding:0 10px;
  float: left;
  display: inline-block;
}
.listItem2 {
  width: 40%;
}
.listItem:first-child {
  padding-left: 0;
}
.listItem.button {
  padding: 0;
  text-align: right;
  margin: 0;
}

.listItem a:hover {
  color: #DD4343;
}


/*
 * Dragging area
 */
.drag-over { border: 5px dashed red; }

/*
 * Tables
 */
table {
  border-collapse: collapse;
  border-spacing: 0px;
}

table.table { width: 100% }

th, td {
  padding: 0.7em 1.0em;
  color: #444444;
  font-size: 14px;
}

table td a,
table td p {
  color: #444444;
}

table td a:hover {
  text-decoration: underline;
  color: #666666;
}

.header-table {
  width: 100%;
}

.header-table tr {
  height: 40px;
}

.header-table tr th {
  background: #DD4343;
  color: #fff;
  font-weight: bold;
}

@media screen and (min-width: 767px) {
  .header-table tr th:first-child {
    -webkit-border-radius: 3px 0 0 0;
       -moz-border-radius: 3px 0 0 0;
            border-radius: 3px 0 0 0;  
  }

  .header-table tr th:last-child {
    -webkit-border-radius: 0 3px 0 0;
       -moz-border-radius: 0 3px 0 0;
            border-radius: 0 3px 0 0;  
  }
}

.header-table .fa-sort,
.header-table .fa-sort-asc,
.header-table .fa-sort-desc {
  font-size: 10px;
}

.content-table {
  background: #ffffff;
  border-bottom: 1px solid #efefef;
}

.content-table tr {
  height: 60px;
  border-left: 1px solid #efefef;
  border-right: 1px solid #efefef;
}

.content-table tr:hover {
  background: #F0F0F0 !important;
  cursor: pointer;
}

.content-table .button {
  width: 130px;
  float: none;
  text-align: right;
  padding-right: 10px;
}

.content-table .button a:hover {
  text-decoration: none !important;
}

tbody.content-table tr:nth-child(2n) {
  background-color: #f8f8f8;
}

tbody.content-table tr:hover {
  transform: scale(1.01);
  box-shadow: 0px 0px 4px rgba(159,159,159,0.4);
}

/*
 * Updatable boxes
 */
div.updatableBoxes a[data-action] {
  display: none;
}

div.updatableBoxes[data-isEditable="true"] a[data-action] {
  display: inline-block;
}

div.updatableBoxes[data-alwaysShowUpdateLink="true"] a[data-action="update"] {
  display: block;
}

/*
 * Modal label/input size
 */
#evenement-event-type .input-stack {
  width: 70%;
}

/*
 * Modal windows
 */

/* Mobile Devices */
@media screen and (max-width: 767px) {

  div.modal div.modal-title {
    padding: 15px;
    text-align: center;
    line-height: 24px;
    font-size: 20px;
  }

  div.modal div.modal-title span { 
    max-width: 100% !important;
    margin-right: 0px !important;
  }

  div.modal div.modal-container { padding: 0;  }

  div.modal div.modal-container { padding: 10px; }

  div.modal-buttons {
    position: absolute;
    bottom: 0;
    padding: 10px; 
  }

  div.modal .buttonsListModal .button {
    text-align: center;
  }

}

/* Tablets & Desktop */
@media screen and (min-width: 768px) {

  div.modal {
    top: 7%; right: 23%; left: 23%;
    -webkit-border-radius: 5px;
       -moz-border-radius: 5px;
            border-radius: 5px;
  }

  div.modal div.modal-title {
    padding: 20px;
    font-size: 18px;
    -webkit-border-radius: 5px 5px 0 0;
       -moz-border-radius: 5px 5px 0 0;
            border-radius: 5px 5px 0 0;    
  }

  div.modal div.modal-container { padding: 20px; }

  div.modal div.modal-buttons { 
    padding: 15px;
    -webkit-border-radius: 0 0 5px 5px;
       -moz-border-radius: 0 0 5px 5px;
            border-radius: 0 0 5px 5px;    
  }  

}

div.modal-background {
  position: fixed;
  top: 0px; left: 0px;
  width: 100%; height: 100%;
  z-index: 1000;
  background-color: rgba(0, 0, 0, 0.6);
}

div.modal {
  position: fixed;
  background-color: #FFFFFF;  
}

div.modal div.modal-title {
  background: #f2f2f2;
  color: #565656;
}

div.modal div.modal-container { overflow: auto; }

div.modal-container .filterSort { padding: 0px; }

div.modal .contentBlock,
div.modal .contentBlockToggle {
  padding: 20px 0 0 0 !important;
}

div.modal div.modal-buttons {
  width: 100%;
  border-top: 1px solid #f2f2f2;
  margin-right: 0;
}  

div.modal-error {
  color: white;
  background-color: #FF2020;
  top: 50%; 
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  transform: translateY(-50%);  
}

div.modal-warning {
  background-color: #FFED92;
  top: 50%; 
  /*-webkit-transform: translateY(-50%);*/
  /*-moz-transform: translateY(-50%);*/
  /*transform: translateY(-50%);*/
}

div.modal-warning p {
  color: black;
}

div.modal-warning div.modal-title,
div.modal-warning div.modal-buttons {
  background-color: #FFD115 !important;
}

div.modal-error > div.modal-container p,
div.modal-error > div.modal-container li
{
  color: white !important;
}

div.modal-xlarge {
  left: 12.5%;
  right: 12.5%;
}

div.modal-small {
  left: 25%;
  right: 25%;
}

div.modal-xsmall {
  right: 35%; left: 35%;
}

div.modal div.modal-title > span {
  margin-right: 1.4ex;
  max-width: 90%;
  display: inline-block;  
}

div.modal-error div.modal-title {
  background-color: #FF8080 !important;
}

div.modal div.modal-close {
  width: 50px; height: 50px;
  top: 0; right: 0;
  position: absolute;
  font-size: 100%;
  color: #888;
  cursor: pointer;
}

div.modal div.modal-close > i {
  width: 100%;
  top: 15px;
  position: absolute;
  text-align: center;
}

div.modal div.modal-buttons > button {
  border: #666666;
  padding: 10px 15px;
  float: right;
  font-size: 13px;
}

/*a.modal-cancel {
  color: #ffffff;
  background: #666666;
}

a.modal-cancel:hover {
  background: #999999;
  border-color: #999999;
  -webkit-transition: background .3s ease-in;
  -moz-transition: background .3s ease-in;
  transition: background .3s ease-in;  
}*/

.modal-ok {
  height: 40px;
  color: #ffffff;
  background: #7fb842 !important;
  margin-left: 20px;  
}

.modal-ok:hover {
  background: #85C73E !important;
  -webkit-transition: background .3s ease-in;
  -moz-transition: background .3s ease-in;
  transition: background .3s ease-in;
}

.information-group { padding: 10px 0; }
.information-group:first-child { padding-top: 0; }
.information-group:last-child { padding-bottom: 0; }

.information-group h5,
.information-group p {
  width: 50%;
  display: inline-block; 
}

.information-group h5 {
  padding-right: 30px;
  text-align: right;
}


/*div.modal-xlarge .label-group label,
div.modal-xlarge .label-group input,
div.modal-xlarge .label-group select {
  width: 100%;
}

div.modal-xlarge .label-group label {
  text-align: left;
}*/

.configureList {
  display: inline;
  text-align: left;
}

div.list-button-bar {
  width: 45px;
  display: inline-block;
  vertical-align: top;
  float: right;
  margin-top: -50px;
}

div.list-button-bar .button {
  width: 40px; height: 40px; 
  padding: 3px;
  display: block;
  margin-bottom: 6px;
  margin-right: 0;
  cursor: pointer;
  float: right;
  background: #e0dfdf;
  text-align: center;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
}

div.list-button-bar .button:hover { background: #7e7e7e; }

div.list-button-bar .button:first-child { margin-bottom: 10px; }

div.list-button-bar .button i { padding: 10px; }

div.list-button-bar .button i:hover,
div.list-button-bar .button:hover i { color: #ffffff; }

ul.input-list {
  vertical-align: top;
  display: inline-block;
  list-style: none;
  margin: 0px;
  padding: 0px;
  width: 55%;
}

span.input-color {
  display: inline-block;
  height: 1em;
  width: 30%;
  border: 1px solid #888;
  vertical-align: middle;
}

input.input-section {
  margin: 0px;
  width: calc(100% - 43px);
}

a.input-section-wizard,
a.input-section-wrench {
  float: right;
  margin: 0px;
}

a.input-section-wizard > i,
a.input-section-wrench > i {
  width: 40px; height: 40px;
  padding: 14px 13px;
  background: #e0dfdf;
  display: inline-block;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  -webkit-transition: all 0.2s ease;
     -moz-transition: all 0.2s ease;
          transition: all 0.2s ease;  
}

a.input-section-wizard > i:hover,
a.input-section-wrench > i:hover {
  background: #7e7e7e;
  border-color: #7e7e7e;
  color: #ffffff;
}

.input-stack input {
  vertical-align: top; 
}

.input-stack .list-insert-input {
  width: calc(100% - 45px);
  margin-bottom: 10px;
  height: auto !important;
/*  width: 84% !important;*/
}

.input-stack select,
.input-stack div.fake-select {
  width: calc(100% - 45px); height: 19ex;
/*  width: 84% !important;*/
  float: left;  
}

div.fake-select ul li,
div.fake-select ul li:last-child
 {
  margin-bottom: 0px !important;
  padding: 1ex;
}

.input-stack select > option { padding: 1ex; }

.input-stack select > option:hover,
.input-stack select > option:focus,
.input-stack select > option:active,
.input-stack select > option:checked,
div.fake-select li.item-selected {
    background-color: #7e7e7e;
    color: white;
}    

.input-stack select #client-configType {
  min-height: 93px;
}

div.label-group div.input-stack + div.selectArrow { right: 58px; }

/* Special Cases */

select[name="evenement-updateEventType-unitsInput"],
select[name="organigramme-config-updateApproval-unitsInput"],
select[name="uniforme-config-updateItem-unitsInput"],
select[name="personnel-affiliateUser-rightsInput"] { height: 40px; }


/*
 * Treeview list
 */
.treeview ul {
	list-style: none;
	margin: 0px;
	padding: 0px;
	position: relative;
	background: url('../images/treeview_vline.png') repeat-y;
}

.treeview ul a,
.treeview ul span {
  padding: 8px;
  vertical-align: middle;
  display: inline-block;  
}

.treeview ul a:hover,
.treeview ul span:hover { background: #f2f2f2; }

.treeview ul ul { margin-left: 7px; }

.treeview ul li.last,
.treeview ul li:last-child {
	background: #fff url('../images/treeview_lastnode.png') 0px -1px no-repeat;
}

.treeview ul li {
	background: url('../images/treeview_node.png') 0 6px no-repeat;
	line-height: 20px;
	margin: 0px !important;
	padding: 0 12px;
}

.treeview[data-treeviewNoFirstList="true"] > ul { background: none !important; }

.treeview[data-treeviewNoFirstList="true"] > ul > li { background: none !important; }

.treeview ul i.fa {
  border: 1px solid;
  font-size: 10px;
  padding: 4px 5px;
  margin-right: .4em;
}

.treeview ul i.fa:hover { cursor: pointer; }

div.treeview ul li.depth-1,
div.treeview ul li.depth-1 a,
div.treeview ul li.depth-1 i.fa,
div.treeview ul li.depth-1 span {
  color: #1c911c;
  border-color: #1c911c;
}

div.treeview ul li.depth-1 i.fa:hover { background: #1c911c; color: #fff; }

div.treeview ul li.depth-2,
div.treeview ul li.depth-2 a,
div.treeview ul li.depth-2 i.fa,
div.treeview ul li.depth-2 span {
  color: #fda53a;
  border-color: #fda53a;
}

div.treeview ul li.depth-2 i.fa:hover { background: #fda53a; color: #fff; }

div.treeview ul li.depth-3,
div.treeview ul li.depth-3 a,
div.treeview ul li.depth-3 i.fa,
div.treeview ul li.depth-3 span {
  color: #31708f;
  border-color: #31708f;
}

div.treeview ul li.depth-3 i.fa:hover { background: #31708f; color: #fff; }

div.treeview ul li.depth-4,
div.treeview ul li.depth-4 a,
div.treeview ul li.depth-4 i.fa,
div.treeview ul li.depth-4 span  {
  color: #a932d7;
  border-color: #a932d7;
}

div.treeview ul li.depth-4 i.fa:hover { background: #a932d7; color: #fff; }

div.treeview ul li.depth-5,
div.treeview ul li.depth-5 a,
div.treeview ul li.depth-5 i.fa,
div.treeview ul li.depth-5 span {
  color: #dd4343;
  border-color: #dd4343;
}

div.treeview .treeview ul li.depth-5 i.fa:hover { background: #dd4343; color: #fff; }

div.treeview ul li.depth-6,
div.treeview ul li.depth-6 a,
div.treeview ul li.depth-6 i.fa,
div.treeview ul li.depth-6 span  {
  color: #666666;
  border-color: #666666; 
}

div.treeview ul li.depth-6 i.fa:hover { background: #666666; color: #fff; }


/*
 * ToolTip
 */

div.tooltipBox {
	display: inline-block;
}

div.tooltipBox div.tooltip {
	margin-top: -6.6ex;
	margin-left: 4ex;
	display: none;
}

li.itemDisabled { color: #888 !important; }

/*
 * Export list
 */
#export-list li { margin-bottom: 15px; }
#export-list li { width: 100%; text-align: center; }
#export-list li a { display: block; }


/*
 * Sliders
 */
.slider {
  overflow: hidden;
}

.slider > li {
  position: relative;
  float: left;
  width: 100%;
  margin-right: -100%;
  left: 100%;
  z-index: 1;
  background: white;
}


/*
 * Paging loading message
 */
.loading {
	margin-top: 2ex;
	text-align: center;
	display: none;
}

.loading i {
	margin-right: 1ex;
}

/*
 * Calendar 
 */
.calendar {
width: 100%
/*  margin-left: auto;
  margin-right: auto;
*/
}

.calendar td {
  width: 8em;
  height: 8em; 
}

.calendar thead { background-color: #f2f2f2; }

.calendar thead th {
  text-align: center;
  border: 1px solid black;
  font-weight: bold;
}

.calendar tr.monthName {
  border: 1px solid black;
}

.calendar tr.monthName th {
  font-size: 110%;
  border: 0px;
}

.calendar tr.monthName a,
.calendar tr.monthName i {
  font-size: 115%;
  font-weight: bold;
}

.calendar tr.monthName a.prevYear,
.calendar tr.monthName a.nextMonth {
  padding-right: 2ex;
}

.calendar tbody td {
  border: 1px solid black;
  vertical-align: top;
  padding: 0px;
}

.calendar tbody td.noday {
  background-color: #C0C0C0;
}

.calendar tbody td.sat, 
.calendar tbody td.sun {
  background-color: #F4F4F4;
}

.calendar tbody td.today {
  background-color: #FFE0E0;
}

.calendar tbody div.dayNumber {
  padding: .2ex 1ex;
  text-align: right;
}

.calendar tbody td.today div.dayNumber {
  color: red;
}

.calendar div.empty, 
.calendar div.busy {
  width: 100%;
  height: 1ex;
  margin: 1ex 0ex;
}

.calendar div.busy-begin {
  border-top-left-radius: 1ex;
  border-bottom-left-radius: 1ex;
}

.calendar div.busy-end {
  border-top-right-radius: 1ex;
  border-bottom-right-radius: 1ex;
}

.calendar div.busy-begin-end {
  -webkit-border-radius: 1ex;
     -moz-border-radius: 1ex;
          border-radius: 1ex;
}

div.calendarInfo {
  background-color: #FFFFFF;
  padding: 2ex;
  box-shadow: 0px 0px 8px rgba(76, 76, 76, 0.23) !important;
}

div.calendarInfo ul {
  margin: 0px !important;
}

div.calendarItemColor {
  width: 2ex;
  display: inline-block;
  margin-right: 1ex;
}

/*
 * Drag & drop
 */
[data-draggable] {
  cursor: move;
}


/*
 * Event information
 */
.preWrap {
  white-space: pre-wrap;
}


/*
 * Checkup
 */
/*#dps-checkup-diagram.checkup-update div.checkup-block {
  border: 1px solid #EEE;
  border-radius: 3px;
}*/

#dps-checkup-diagram.checkup-update a.checkup-block-button {
  float: right;
  font-size: 16px;
  padding: 6px 10px;
  background: #333;
  color: #fff;
}

/*div.checkup-title { border-bottom: 3px solid #333333; }

#dps-checkup-diagram div.checkup-block h1, 
#dps-checkup-diagram div.checkup-block h2, 
#dps-checkup-diagram div.checkup-block h3, 
#dps-checkup-diagram div.checkup-block h4, 
#dps-checkup-diagram div.checkup-block h5, 
#dps-checkup-diagram div.checkup-block h6 {
  display: inline-block;
}*/

#dps-checkup-diagram div.checkup-block h1 {
  font-size: 140%;
  padding-bottom: 5px;
  border-bottom: 2px solid #333;  
  text-transform: uppercase;
}

#dps-checkup-diagram div.checkup-block h2 {
  font-size: 130%;
  background: #ACACAC;
  border-top: 2px solid #333;
  border-bottom: 2px solid #333;
  color: #FFF;
  padding-bottom: 5px;
  padding-left: 8px;
  padding-top: 5px;  
}

#dps-checkup-diagram div.checkup-block h3 {
  font-size: 120%;
  border-top: 2px solid #333;
  border-bottom: 2px solid #333;
  background: #B0B0B0;
  padding-bottom: 5px;
  padding-left: 8px;
  padding-top: 5px; 
  text-transform: initial;
}

#dps-checkup-diagram div.checkup-block h4 {
  font-size: 115%;
}

#dps-checkup-diagram div.checkup-block h5 {
  font-size: 110%;
}

#dps-checkup-diagram div.checkup-block h6 {
  font-size: 105%;
}

#dps-checkup-diagram div.checkup-block-line {
  border-spacing: 0ex 0ex;
  display: table;
  width: 100%;
}

/*#dps-checkup-diagram div.checkup-block-line.checkup-block-line-border {
  border-spacing: 1.5ex .5ex;
}*/

/*#dps-checkup-diagram div.checkup-block-root-lines.checkup-block-line-border {
  border-spacing: 0ex .5ex;
}*/

#dps-checkup-diagram div.checkup-block-root-lines.checkup-block-line {
  margin-bottom: 3.5ex;
  border-bottom: 1px solid #333;
/*  padding: 14px 5px; */ 
}

#dps-checkup-diagram.checkup-update div.checkup-block {
  display: inline-block;
  margin-bottom: 1.5ex;
}

#dps-checkup-diagram.checkup-update div.checkup-block.block-noFields > div.clearfix > div.checkup-field-list {
  border: 2px dashed #CCC;
  height: 3ex;
}

#dps-checkup-diagram.checkup-update div.checkup-field-noField {
  height: 2ex;
}

#dps-checkup-diagram div.block-warning,
#dps-checkup-diagram div.field-warning {
  background-color: #FFE0E0;
}

#dps-checkup-diagram.checkup-update div.block-evolution {
  border: 1px solid #40CC40 !important;
}

#dps-checkup-diagram.checkup-update div.block-bodyHealth {
  border: 1px solid #4040CC !important;
}

/*#dps-checkup-diagram div.block-border {
  border: 1px solid #888 !important;
  padding: .5ex 1ex;
}*/

/* width > 768 == Tablette + Desktop */
@media screen and (min-width: 768px) {

  #dps-checkup-diagram div.block-size-11 { width: 91.66%; width: calc(100% * 11/12); }

  #dps-checkup-diagram div.block-size-10 { width: 83.33%; width: calc(100% * 5/6); }

  #dps-checkup-diagram div.block-size-9 { width: 75%; }

  #dps-checkup-diagram div.block-size-8 { width: 66.66%; width: calc(100% * 2/3); }

  #dps-checkup-diagram div.block-size-6 { width: 50%; }

  #dps-checkup-diagram div.block-size-4 { width: 33.33%; width: calc(100%/3); }

  #dps-checkup-diagram div.block-size-3 { width: 25%; }

  #dps-checkup-diagram div.block-size-2 { width: 16.66%; width: calc(100%/6); }

  #dps-checkup-diagram div.block-size-1 { width: 8.33%; width: calc(100%/12); }

  #dps-checkup-diagram div.checkup-block {
    display: table-cell;
    vertical-align: top;
  }  

  div.block-depth-2.block-size-4,
  div.block-depth-2.block-size-6,
  div.block-depth-3.block-size-4,
  div.block-depth-3.block-size-6 {
    border-right: 1px solid #333333;
  }

  div.block-depth-2.block-size-4:last-child,
  div.block-depth-2.block-size-6:last-child,
  div.block-depth-3.block-size-4:last-child,
  div.block-depth-3.block-size-6:last-child {
    border-right: none;
  }

  #dps-checkup-ListOfBlocks .checkup-field-list .label-group:last-child,
  #dps-checkup-ListOfBlocks .checkup-field-list .radio-group:last-child,
  #dps-checkup-ListOfBlocks .checkup-field-list .checkbox-group:last-child {
    border-bottom: none;
  }  

}

/* width < 768 == Mobile */
@media screen and (max-width: 767px) {

  #dps-checkup-diagram div.block-size-11
  #dps-checkup-diagram div.block-size-10,
  #dps-checkup-diagram div.block-size-9,
  #dps-checkup-diagram div.block-size-8,
  #dps-checkup-diagram div.block-size-6,
  #dps-checkup-diagram div.block-size-4,
  #dps-checkup-diagram div.block-size-3,
  #dps-checkup-diagram div.block-size-2,
  #dps-checkup-diagram div.block-size-1 { width: 100%; }

  #dps-checkup-diagram div.checkup-block { display: block; }

}

#dps-checkup-diagram div.checkup-field-halfField input {
  width: 47%;
  vertical-align: middle;
  width: calc(100% / 2 - 4ex);
}

#dps-checkup-diagram div.checkup-field-halfField div {
  width: 2ex;
  text-align: center;
  display: inline;
}

#dps-checkup-diagram div.checkup-field-unit input {
  width: 97%;
  vertical-align: middle;
  width: calc(100% - 4ex);
}

#dps-checkup-diagram div.checkup-field-unit div {
  width: 4ex;
  text-align: center;
  display: inline;
}


#dps-checkup-diagram div.checkup-body-health-picture {
  margin-top: 3ex;
  display: inline-block;
  position: relative;
}

#dps-checkup-diagram div.checkup-body-health-pointers {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

#dps-checkup-diagram div.checkup-body-health-pointer {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: absolute;
  width: 3ex;
  height: 3ex;
  margin-left: -1.5ex;
  margin-top: -1.5ex;
  border: 3px solid red;
  -webkit-border-radius: 3ex;
     -moz-border-radius: 3ex;
          border-radius: 3ex;
  text-align: center;
  vertical-align: middle;
  color: red;
  font-weight: bold;
}

#dps-checkup-diagram img.checkup-body-health {
  max-width: 100%;
}

#dps-checkup-diagram ul.checkup-body-health-entries ul > li,
#dps-checkup-diagram ul.checkup-evolution-entries ul > li {
  display: inline;
}

#dps-checkup-diagram ul.checkup-body-health-entries ul > li:last-child span.checkup-body-health-list-comma,
#dps-checkup-diagram ul.checkup-evolution-entries ul > li:last-child span.checkup-evolution-list-comma {
  display: none;
}

#dps-checkup-ListOfBlocks .checkup-field-list .label-group,
#dps-checkup-ListOfBlocks .checkup-field-list .radio-group,
#dps-checkup-ListOfBlocks .checkup-field-list .checkbox-group {
  border-bottom: 1px solid #333333;
  padding: 2ex 1ex;
  margin-bottom: 0; 
}

#dps-checkup-ListOfBlocks .checkbox-group .controlIndicator {
  top: calc(10px + 2ex);
  left: calc(10px + 1ex);
}

#dps-checkup-ListOfBlocks .selectArrow {
  top: calc(45px + 2ex);
  right: calc(12px + 1ex);
}

.checkup-field-list .label-group:last-child,
.checkup-field-list .radio-group:last-child {
  border-bottom: none;
}

/*.modal-container .checkup-field {
    border: none !important;
    padding: 0 20px 20px 0 !important;
}

.modal-container .checkup-block-line,
.modal-container .div.block-depth-2.block-size-4, 
.modal-container div.block-depth-2.block-size-6,
.modal-container div.block-depth-3.block-size-4, 
.modal-container div.block-depth-3.block-size-6 {
  border: none !important;
}
*/
/*
 * Clickable pictures
 */
[data-pictureClickQuery] {
  cursor: pointer;
}

div[data-isform="true"] *[data-pictureClickQuery][data-pictureClickEditMode="true"] {
  cursor: inherit !important;
}


/*
 * HTML embedded
 */
.htmlEmbedded strong {
  font-weight: bold;
}

.htmlEmbedded em {
  font-style: italic;
}

.htmlEmbedded sub {
  font-size: 85%;
  vertical-align: sub;
}

.htmlEmbedded sup {
  font-size: 85%;
  vertical-align: super;
}

.htmlEmbedded ul {
  margin: 1em 0px;
  padding: 0px 0px 0px 5ex;
  list-style: disc;
}

.htmlEmbedded ul > li > ul {
  margin: 0px;
  list-style: circle;
}

.htmlEmbedded ul > li > ul > li > ul {
  list-style: square;
}

.htmlEmbedded ol {
  margin: 1em 0px;
  padding: 0px 0px 0px 5ex;
  list-style: decimal;
}

.htmlEmbedded ol > li > ol {
  margin: 0px;
  list-style: lower-latin;
}

.htmlEmbedded ol > li > ol > li > ol {
  list-style: lower-roman;
}

.htmlEmbedded blockquote {
  margin: 1em 4ex;
  border-left: 4px solid #AAA;
  padding: 1em 0px 1em 4ex;
}

.htmlEmbedded p, 
.htmlEmbedded span,
.htmlEmbedded li {
  color: #474747;
}

.htmlEmbedded blockquote > p {
  font-style: italic;
}

.htmlEmbedded table, 
.htmlEmbedded td,
.htmlEmbedded th,
.htmlEmbedded tr {
  border: 1px solid black;
}

.htmlEmbedded th {
  font-weight: bold;
  text-align: center;
}

.htmlEmbedded table > caption {
  text-align: center;
  font-style: italic;

}

/* 
 * Communication module: erase css of cke_editor
 */
form.editMode label[for=communication-sendMessage-message],
form.editMode label[for=communication-updateWelcomeMessage-message],
form.editMode label[for="communication-updateCampain-message"] { 
  padding: 10px 10px 0 10px;
}

div#cke_communication-sendMessage-message,
div#cke_communication-updateWelcomeMessage-message,
div#cke_communication-updateCampain-message { 
  border: 2px solid #c9c9c9;
  box-shadow: none;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;  
}