@font-face {
  font-family: "Exo2";
  src: url("./fonts/Exo2-Regular.woff") format("woff"), url("./fonts/Exo2-Regular.ttf") format("truetype");
}

@font-face {
  font-family: "Exo2Bold";
  src: url("./fonts/Exo2-Bold.woff") format("woff"), url("./fonts/Exo2-Bold.ttf") format("truetype");
}

@font-face {
  font-family: "Din";
  src: url("./fonts/Din.ttf") format("truetype");
}

@font-face {
  font-family: "DinBold";
  src: url("./fonts/Din-Bold.ttf") format("truetype");
}

@font-face {
  font-family: "Roboto";
  src: url("./fonts/Roboto-Regular.ttf") format("truetype");
}

@font-face {
  font-family: "RobotoBold";
  src: url("./fonts/Roboto-Medium.ttf") format("truetype");
}

@font-face {
  font-family: "Rodina";
  src: url("./fonts/Rodina-Bold.otf") format("truetype");
}

@font-face {
  font-family: "Lato";
  src: url("./fonts/Lato-Regular.ttf") format("truetype");
}

/* FIX IE : delete clear input */
input::-ms-clear {
  display: none;
}

.titre-titre-panel,
.titre-titre-panel > .x-panel-body {
  color: #cd2728;
  font-size: 22px;
  font-family: "RobotoBold", sans-serif;
  letter-spacing: -0.5px;
  height: 40px;
}

.commentaire-titre-panel,
.commentaire-titre-panel > .x-panel-body {
  color: #888888;
  font-size: 12px;
  font-style: italic;
}

.sub-information-texte,
.sub-information-texte > .x-panel-body {
  color: #888888;
  font-size: 14px;
  font-style: italic;
  text-align: center;
}

.sub-information-texte a {
  color: #555555;
}

.x-form-field[data-unite]::after {
  content: attr(data-unite);
}

.help-large-icon {
  background-color: hsl(45, 77%, 50%);
  border-radius: 50%;
}
.help-large-icon:hover {
  background-color: hsl(45, 77%, 62%);
}
.help-large-icon::after {
  content: "";
  background-color: #fff;
  position: absolute;
  top: 5px;
  left: 5px;
  width: 22px;
  height: 22px;
  mask: url("./images/icon/carto/icon_question-mark.svg");
  -webkit-mask: url("./images/icon/carto/icon_question-mark.svg");
}

.help-small-icon {
  background-color: hsl(45, 0%, 20%);
  border-radius: 50%;
}
.help-small-icon:hover {
  background-color: hsl(45, 0%, 10%);
}
.help-small-icon::after {
  content: "";
  background-color: #fff;
  position: absolute;
  top: 3px;
  left: 3px;
  width: 11px;
  height: 11px;
  mask: url("./images/icon/carto/icon_question-mark.svg");
  -webkit-mask: url("./images/icon/carto/icon_question-mark.svg");
}

.help-video-large-icon {
  background-color: hsl(45, 77%, 50%);
  border-radius: 50%;
}
.help-video-large-icon:hover {
  background-color: hsl(45, 77%, 62%);
}
.help-video-large-icon::after {
  content: "";
  background-color: #fff;
  position: absolute;
  top: 5px;
  left: 5px;
  width: 22px;
  height: 22px;
  mask: url("./images/icon/aide-video.svg");
  -webkit-mask: url("./images/icon/aide-video.svg");
  -webkit-mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position-y: center;
}

.info-large-icon {
  border-radius: 50%;
}
.info-large-icon::after {
  content: "";
  background-color: #6e605b;
  position: absolute;
  top: 5px;
  left: 5px;
  width: 22px;
  height: 22px;
  mask: url("./images/info-v2.svg");
  -webkit-mask: url("./images/info-v2.svg");
}

.warning-text {
  color: #df0000;
}

.warning-orange-text {
  color: #ff8100; /* Couleur orange de la charte graphique MP.*/
}

.warning-text-bold {
  color: #df0000;
  font-weight: bold;
}

.bold,
.bold .x-form-display-field-default {
  font-weight: bold;
}

.italic,
.italic input {
  font-style: italic !important;
}

.phyto_number_check_parcel_warning {
  font-style: italic;
  margin-left: 2em;
}

.bold-cell > .x-grid-cell-inner {
  font-weight: bold;
}

.h1-cell > .x-grid-cell-inner {
  font-size: 150%;
}

.h2-cell > .x-grid-cell-inner {
  font-size: 130%;
}

.h3-cell > .x-grid-cell-inner {
  font-size: 115%;
}

.no-display {
  display: none;
}

.lock-panel,
.lock-panel > .x-panel-body {
  background-image: url(images/icon/lock.png);
  background-size: 32px 32px;
  background-repeat: no-repeat;
  background-position: 40px 50%;
  padding: 15px 10px 10px 100px;
  background-color: #898989;
  color: #ffffff;
}

.grid-dar-notexist {
  background-image: url(images/alert_phyto/phyto-DAR-orange.svg);
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: 16px 16px;
  margin: 0 2px 0 2px;
}

.grid-dar-invalid {
  background-image: url(images/alert_phyto/phyto-DAR-red.svg);
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: 16px 16px;
  margin: 0 2px 0 2px;
}

.icon-dar-notexist {
  background-image: url(images/metier/dar-notexist.png);
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: 28px 28px;
  width: 30px;
  height: 16px;
  display: inline-block;
}

.icon-dar-invalid {
  background-image: url(images/metier/dar-invalid.png);
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: 28px 28px;
  width: 30px;
  height: 16px;
  display: inline-block;
}

.icon-edit-add {
  background-image: url(images/icon/edit-add.svg);
  background-repeat: no-repeat;
  background-size: contain;
  width: 30px;
  height: 16px;
  display: inline-block;
}

.icon-carte-modulation {
  background-image: url(images/icon/carte-modulation.png);
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: 28px 28px;
  width: 30px;
  height: 16px;
  display: inline-block;
}

.grid-ispac {
  background-image: url(images/icon/star.png);
  background-repeat: no-repeat;
  background-position: left center;
  padding-left: 18px;
  background-size: 16px 16px;
  margin: 0 2px 0 2px;
}

.grid-icon-generique {
  background-repeat: no-repeat;
  cursor: pointer;
  background-size: 32px 32px;
  background-position: 50% 50%;
  margin: 0 2px 0 2px;
}

.grid-fauche {
  background-image: url(images/icon/f.svg);
  background-repeat: no-repeat;
  cursor: pointer;
  background-size: 20px 20px;
  background-position: 50% 50%;
  margin: 0 2px 0 2px;
}

.grid-pature {
  background-image: url(images/icon/p.svg);
  background-repeat: no-repeat;
  cursor: pointer;
  background-size: 20px 20px;
  background-position: 50% 50%;
  margin: 0 2px 0 2px;
}

.grid-derobe {
  background-image: url(images/icon/d.svg);
  background-repeat: no-repeat;
  cursor: pointer;
  background-size: 20px 20px;
  background-position: 50% 50%;
  margin: 0 2px 0 2px;
}

.grid-info {
  background-image: url(images/info-v2.svg);
  background-repeat: no-repeat;
  cursor: pointer;
  background-size: contain;
  margin: 0 2px 0 2px;
}

.grid-derogation-info {
  background: url(images/icon/d.svg) no-repeat left center transparent !important;
  background-size: contain;
  height: 16px;
  width: 16px;
}

.grid-calc-decitrait {
  background-image: url(images/calc.png);
  background-repeat: no-repeat;
  cursor: pointer;
  background-size: 18px;
  margin: 0 2px 0 2px;
  background-position: center;
}

.grid-check-vert {
  background: url(images/metier/realise.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: 50% 50%;
}

.grid-sentinel-no-geom {
  background-image: url("/mvc/ressources/css/images/icon/warning-yellow.png");
  background-repeat: no-repeat;
  background-size: contain;
  margin: 0 2px 0 2px;
}

.grid-info-red {
  background-image: url(images/icon/info-red.png);
  background-repeat: no-repeat;
  cursor: pointer;
  background-size: 32px 32px;
  background-position: 50% 50%;
  margin: 0 2px 0 2px;
}

.grid-produit {
  background-image: url(images/icon/chemistry.svg);
  background-repeat: no-repeat;
  cursor: pointer;
  background-size: contain;
  margin: 0 2px 0 2px;
}

.grid-h {
  background: url(images/icon/h.svg) no-repeat center center transparent;
  cursor: pointer;
  background-size: contain;
  margin: 0 2px 0 2px;
  height: 16px;
  width: 16px;
}

.grid-p {
  background-image: url(images/icon/p.svg);
  background-repeat: no-repeat;
  cursor: pointer;
  background-size: contain;
  margin: 0 2px 0 2px;
}

.grid-s {
  background-image: url(images/icon/s.svg);
  background-repeat: no-repeat;
  cursor: pointer;
  background-size: contain;
  margin: 0 2px 0 2px;
}

.grid-p-disabled {
  background-image: url(images/icon/p.svg);
  background-repeat: no-repeat;
  cursor: pointer;
  background-size: contain;
  margin: 0 2px 0 2px;
  opacity: 0.5;
}

.grid-c {
  background-image: url(images/icon/c.png);
  background-repeat: no-repeat;
  cursor: pointer;
  background-size: 32px 32px;
  background-position: 50% 50%;
  margin: 0 2px 0 2px;
}

.grid-c-gris {
  background: url(images/icon/c-gris.svg) no-repeat center center transparent;
  cursor: pointer;
  background-size: contain;
  margin: 0 2px 0 2px;
  height: 16px;
  width: 16px;
}

.grid-c-vert {
  background-image: url(images/icon/c-vert.png);
  background-repeat: no-repeat;
  cursor: pointer;
  background-size: 20px 20px;
  background-position: 50% 50%;
  margin: 0 2px 0 2px;
}

.grid-c-rouge {
  background-image: url(images/icon/c-rouge.png);
  background-repeat: no-repeat;
  cursor: pointer;
  background-size: 20px 20px;
  background-position: 50% 50%;
  margin: 0 2px 0 2px;
}

.grid-e {
  background-image: url(images/icon/e.png);
  background-repeat: no-repeat;
  cursor: pointer;
  background-size: 30px 30px;
  background-position: 50% 50%;
  margin: 0 2px 0 2px;
}

.grid-i {
  background: url(images/icon/i.svg) no-repeat center center transparent;
  cursor: pointer;
  background-size: contain;
  margin: 0 2px 0 2px;
  height: 16px;
  width: 16px;
}

.paturee-check {
  -webkit-mask-image: url(images/icon/paturee.svg);
  mask-image: url(images/icon/paturee.svg);
  cursor: pointer;
  mask-repeat: no-repeat;
  background-color: #6d605c;
  margin: 0 2px 0 2px;
  height: 16px;
  width: 16px;
}
.fauchee-check {
  -webkit-mask-image: url(images/icon/fauchee.svg);
  mask-image: url(images/icon/fauchee.svg);
  cursor: pointer;
  mask-repeat: no-repeat;
  background-color: #6d605c;
  margin: 0 2px 0 2px;
  height: 16px;
  width: 16px;
}

.no-fauche-pature-check {
  cursor: initial !important;
  margin: 0 2px 0 2px;
}

.grid-a {
  background-image: url(images/icon/a.png);
  background-repeat: no-repeat;
  cursor: pointer;
  background-size: 32px 32px;
  background-position: 50% 50%;
  margin: 0 2px 0 2px;
}

.grid-no-mail {
  background-image: url(images/icon/mail-disabled.svg);
  background-repeat: no-repeat;
  cursor: default !important;
  background-size: contain;
  margin-left: 2px;
}

.img-grid-align {
  vertical-align: middle;
}

.grid-mail-send {
  background-image: url(images/icon/mail-oui.png);
  background-repeat: no-repeat;
  cursor: pointer;
  background-size: 32px 32px;
  background-position: 50% 50%;
  margin: 0 2px 0 2px;
}

.grid-green-dot {
  background-image: url(images/icon/green-dot.png);
  background-size: 28px 28px;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  margin: 0 2px 0 2px;
}

.grid-green-dot-fade {
  background-image: url(/geotracanet/gt_image/avert_valid.gif);
  background-size: 14px 14px;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  margin: 0 2px 0 2px;
}

.grid-orange-dot {
  background-image: url(images/icon/orange-dot.png);
  background-size: 28px 28px;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  margin: 0 2px 0 2px;
}

.grid-gray-dot {
  background-image: url(images/icon/gray-dot.png);
  background-size: 28px 28px;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  margin: 0 2px 0 2px;
}

.grid-red-dot {
  background-image: url(images/icon/red-dot.png);
  background-size: 28px 28px;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  margin: 0 2px 0 2px;
}

.grid-red-dot-fade {
  background-image: url(/geotracanet/gt_image/avert_ag.gif);
  background-size: 14px 14px;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  margin: 0 2px 0 2px;
}

.grid-red-dot-interrogation {
  background-image: url(images/icon/red-dot-interrogation.png);
  background-size: 28px 28px;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  margin: 0 2px 0 2px;
}

.grid-horloge-orange {
  background-image: url(images/icon/horloge-orange.png);
  background-size: 16px 16px;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  margin: 0 2px 0 2px;
}

.grid-horloge-rouge {
  background-image: url(images/icon/horloge-rouge.png);
  background-size: 16px 16px;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  margin: 0 2px 0 2px;
}

.grid-icon-white-background {
  background-image: radial-gradient(ellipse at center, white 0%, transparent 65%, transparent 100%);
  background-size: 30px 30px;
  background-repeat: no-repeat;
  background-position: 50% 50%;
}

.grid-oui {
  background-image: url(images/icon/check-oui.png);
  background-size: 28px 28px;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  margin: 0 2px 0 2px;
}

.grid-non {
  background-image: url(images/icon/check-non.png);
  background-size: 28px 28px;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  margin: 0 2px 0 2px;
}

.grid-mail-notsend {
  background-image: url(images/icon/mail-non.svg);
  background-repeat: no-repeat;
  cursor: pointer;
  background-size: contain;
  margin: 0 2px 0 2px;
}

.grid-chantier-aborted {
  background-image: url(images/icon/a-non.svg);
  background-repeat: no-repeat;
  cursor: pointer;
  background-size: 17px 17px;
  margin: 0 2px 0 2px;
}

.grid-chantier-realise-avec-modif {
  background-image: url(images/icon/r-moyen.svg);
  background-repeat: no-repeat;
  cursor: pointer;
  background-size: 17px 17px;
  margin: 0 2px 0 2px;
}

.grid-chantier-previsionnel-to-realise {
  background-image: url(images/icon/editandmore.svg);
  background-repeat: no-repeat;
  cursor: pointer;
  background-size: 17px 17px;
  margin: 0 2px 0 2px;
}

.grid-chantier-realise-sans-modif {
  background-image: url(images/icon/r-oui.svg);
  background-repeat: no-repeat;
  cursor: pointer;
  background-size: 17px 17px;
  margin: 0 2px 0 2px;
}

.grid-editandmore {
  background-image: url(images/icon/editandmore.png);
  background-repeat: no-repeat;
  cursor: pointer;
  background-size: 32px 32px;
  background-position: 50% 50%;
  margin: 0 2px 0 2px;
}

.grid-carte-modulation {
  background-image: url(images/icon/carte-modulation.png);
  background-repeat: no-repeat;
  cursor: pointer;
  background-size: 32px 32px;
  background-position: 50% 50%;
  margin: 0 2px 0 2px;
}

.no-cursor {
  cursor: default !important;
}

.grid-r-oui {
  background-image: url(images/icon/r-oui.png);
  background-repeat: no-repeat;
  cursor: pointer;
  background-size: 30px 30px;
  background-position: 50% 50%;
  margin: 0 2px 0 2px;
}

.grid-r-non {
  background-image: url(images/icon/r-non.png);
  background-repeat: no-repeat;
  cursor: pointer;
  background-size: 30px 30px;
  background-position: 50% 50%;
  margin: 0 2px 0 2px;
}

.grid-print {
  background-image: url(images/icon/print.svg);
  background-size: contain;
  background-repeat: no-repeat;
  margin: 0 2px 0 2px;
}

.grid-edit {
  background-image: url(images/edit.svg);
  background-size: contain;
  background-repeat: no-repeat;
  margin: 0 2px 0 2px;
}

.grid-view {
  background-image: url(images/icon/carto/eye-open.svg);
  background-size: contain;
  background-repeat: no-repeat;
  margin: 0 2px 0 2px;
}

.grid-no-edit {
  background-image: url(images/no-edit.svg);
  background-size: contain;
  background-repeat: no-repeat;
  margin: 0 2px 0 2px;
}

.grid-edit-modulation {
  background-image: url(images/icon/edit-modulation.png);
  background-size: 38px 38px;
  width: 28px !important;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  margin: 0 2px 0 2px;
}

.grid-isobus {
  background-image: url(images/icon/isobus.png);
  background-size: 40px;
  width: 40px !important;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  margin: 0 2px 0 2px;
}

.grid-etendre {
  background-image: url(images/icon/etendre.png);
  background-size: 28px 28px;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  margin: 0 2px 0 2px;
}

.grid-edit-add {
  background: url(images/icon/edit-add.svg) no-repeat center center transparent;
  background-size: contain;
  margin: 0 2px 0 2px;
  height: 16px;
  width: 16px;
}

.grid-edit-add-ms {
  background-image: url(images/icon/edit-add-ms.png);
  background-size: 32px 32px;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  margin: 0 2px 0 2px;
}

.grid-delete {
  background-image: url(images/delete.svg);
  background-size: contain;
  background-repeat: no-repeat;
  margin: 0 2px 0 2px;
}

.grid-refresh {
  background-image: url(../ext/css/images/grid/refresh.png);
  background-size: contain;
  background-repeat: no-repeat;
  margin: 0 2px 0 2px;
}

.grid-warning {
  background: url(images/icon/warning-yellow.svg) no-repeat center center transparent;
  background-size: contain;
  margin: 0 2px 0 2px;
  height: 16px;
  width: 16px;
}

.grid-expand {
  background-image: url(../ext/css/images/grid/group-expand.png);
  background-size: 24px 24px;
  background-repeat: no-repeat;
  background-position: 50% 50%;
}

.grid-collapse {
  background-image: url(../ext/css/images/grid/group-collapse.png);
  background-size: 24px 24px;
  background-repeat: no-repeat;
  background-position: 50% 50%;
}

.grid-arrow-right {
  background-image: url(images/icon/arrow-right.svg);
  background-size: 16px 16px;
  background-repeat: no-repeat;
  background-position: 50% 50%;
}

.grid-arrow-left {
  background-image: url(images/icon/arrow-left.svg);
  background-size: 16px 16px;
  background-repeat: no-repeat;
  background-position: 50% 50%;
}

.grid-group-button {
  padding: 3px;
  float: right;
  margin-top: -5px;
}

.grid-loupe {
  background: url(images/icon/loupe.svg) no-repeat center center transparent;
  background-size: contain;
  margin: 0 2px 0 2px;
  height: 16px;
  width: 16px;
}

.grid-dre-alerte-orange {
  background-image: url(images/icon/warning-yellow.png);
  background-size: 32px 32px;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  margin: 0 2px 0 2px;
}

.grid-dre-alerte-rouge {
  background-image: url(images/icon/warning-red.png);
  background-size: 32px 32px;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  margin: 0 2px 0 2px;
}

.grid-realiser {
  background-image: url(images/icon/editandmore.png);
  background-repeat: no-repeat;
  background-position: 50% 50%;
}

.grid-fleche-droite {
  background-image: url(images/icon/fleche-droite.png);
  background-repeat: no-repeat;
  background-position: 50% 50%;
  margin: 0 2px 0 2px;
}

.grid-check {
  display: inline-block;
  background-color: #5ac621;
  height: 30px;
  width: 30px;
  mask: url("./images/mpconnect/icons/service-operationnel.svg") no-repeat 50% 50%/100%;
  -webkit-mask: url("./images/mpconnect/icons/service-operationnel.svg") no-repeat 50% 50%/100%;
}

.select-all-grid-group-button {
  background-color: #f5f5f5;
  border: 1px solid #e0e0e0;
}

.select-all-grid-group-button:hover {
  background-color: #fbfbfb;
  border: 1px solid #f0f0f0;
}

.deselect-all-grid-group-button {
  background-color: #d5d5d5;
  border: 1px solid #d0d0d0;
}

.deselect-all-grid-group-button:hover {
  background-color: #ebebeb;
  border: 1px solid #e0e0e0;
}

.x-grid-group-title {
  white-space: normal;
}

.grid-row-border-top .x-grid-cell-inner {
  border-top: 1px solid #cccccc !important;
}

.grid-row-border-top-dashed .x-grid-cell-inner {
  border-top: 2px dashed #cccccc !important;
}

.grid-row-border-top-thick .x-grid-cell-inner {
  border-top: 2px solid #cccccc !important;
}

.grid-specific-cell-border-top .showfirst-is-specific-cell .x-grid-cell-inner {
  border-top: 1px solid #aaaaaa;
}

.x-grid-row-checker.grid-row-checker-disabled {
  filter: grayscale(100%) contrast(50%);
}

.disabled-row {
  background-color: #cccccc;
}

.largefield {
  height: 40px;
}

.largefield .x-form-text {
  font-size: 150%;
}

.loading .x-form-text {
  background-image: url(../ext/css/images/loadmask/loading.gif);
  background-repeat: no-repeat;
  background-position: 99% 50%;
}

.combo-categorie-list-cell {
  padding: 0px 6px;
}

.combo-categorie-list-header {
  width: 100%;
  padding: 5px 0px;
  border: 1px solid #6b5f5c;
  background-color: #6b5f5c;
  vertical-align: top;
  text-align: center;
  color: #ffffff;
  font-size: 130%;
  font-weight: bold;
  line-height: normal !important;
  cursor: default !important;
}

.combo-categorie-list .x-boundlist-item {
  padding: 0px !important;
}

.combo-categorie-list .x-boundlist-selected,
.combo-categorie-list .x-boundlist-item-over {
  border: 1px solid #ffffff !important;
}

.x-column-header.column-header-compact .x-column-header-inner {
  font-size: 0.9em;
  padding: 4px;
}

.grid-vertical-header .x-column-header-text {
  transform: rotate(90deg);
  -ms-filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
  display: block;
  margin-top: -20px;
}

.x-grid-row .grid-fake-editor > .x-grid-cell-inner {
  border-width: 1px;
  border-style: solid;
  border-color: #c1c1c1 #d9d9d9 #d9d9d9;
  margin: 0px;
  padding: 4px 0px 2px 6px;
  background-color: #ffffff;
  cursor: cell;
}

.x-grid-row .grid-fake-editor-invalid > .x-grid-cell-inner {
  border-width: 1px;
  border-style: solid;
  border-color: #c1c1c1 #d9d9d9 #d9d9d9;
  margin: 0px;
  padding: 4px 0px 2px 6px;
  background-color: #cf4c35;
  cursor: cell;
}

.x-grid-row .editable > .x-grid-cell-inner {
  background-color: #ffffff;
  border: 1px solid #fe3a3c;
  color: #000000;
  cursor: cell;
  font-weight: bold;
  margin: 1px;
}

.x-grid-row .editable.error > .x-grid-cell-inner {
  background-color: #ffffff;
  border: 1px solid #fe3a3c;
  color: #df0000;
  font-weight: bold;
  cursor: cell;
  margin: 1px;
}

.x-grid-row .editable-light > .x-grid-cell-inner {
  background-color: #ffffff;
  border: 1px solid #fe3a3c;
  color: #000000;
  cursor: cell;
  margin: 1px;
}

.x-grid-row .editable-light.error > .x-grid-cell-inner {
  background-color: #fe3a3c;
}

.x-grid-row .editable-valid > .x-grid-cell-inner {
  background-color: #ffffff;
  border: 1px solid #0a7f6d;
  color: #000000;
  cursor: cell;
  margin: 1px;
}

.x-grid-row .padding_pastille > .x-grid-cell-inner {
  padding: 4px 4px 0 4px;
}

.x-grid-row.disabled-row-semence > .x-grid-cell {
  color: rgb(0, 0, 0, 0.5);
}

.parcelle-commande {
  background: url("images/mpconnect/icons/diable.svg") no-repeat center center transparent;
  background-size: 70%;
}
.parcelle-valide {
  background: url("images/metier/realise.png") no-repeat center center transparent;
  background-size: 60%;
}

.btn-map-icon {
  filter: brightness(2);
}

.supply-note,
.supply-note .x-form-display-field {
  font-style: italic;
  color: #888888;
  font-size: 98%;
  text-align: right;
}

.x-grid-row .grid-invalid > .x-grid-cell-inner {
  color: #be1515;
  font-weight: bold;
}

.compact .x-grid-cell-inner {
  padding-left: 0;
  padding-right: 0;
}

.wrap .x-grid-cell-inner {
  white-space: normal;
}

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

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

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

.x-btn.rounded-button.x-btn-default-small,
.x-btn.rounded-button.x-btn-default-small.x-btn-focus {
  border-radius: 50px;
  background-color: white;
  background-image: none;
  border: 1px solid hsl(45, 77%, 50%);
  box-shadow: none;
}

.x-btn.rounded-button.x-btn-default-small.x-btn-over {
  background-color: #ffffff;
}

.x-btn.rounded-button.x-btn-default-small.x-btn-pressed {
  background-color: #ffffff;
}

.x-btn.rounded-button .x-btn-inner-default-small {
  color: #333333;
}

.x-btn.border-button.x-btn-default-small,
.x-btn.border-button.x-btn-default-small.x-btn-focus {
  background-color: #dedede;
  background-image: none;
  border: none;
  border-radius: 0px;
  background-image: none;
  box-shadow: 0px 2px 8px #777;
}

.x-btn.border-button.x-btn-default-small.x-btn-over {
  background-color: #eeeeee;
  background-image: none;
  box-shadow: 0px 2px 8px #888;
}

.x-btn.border-button.x-btn-default-small.x-btn-pressed {
  background-color: #ffacad;
  background-image: none;
  box-shadow: 0px 2px 8px #888;
}

.x-btn.border-button .x-btn-inner-default-small {
  color: #333333;
  font-size: 110%;
  font-weight: normal;
  padding: 5px 0px;
}

.x-btn.border-button.x-btn-default-small.selected-border-button,
.x-btn.border-button.x-btn-default-small.x-btn-focus.selected-border-button {
  background-color: #ffacad;
}

.x-btn.border-button.x-btn-default-small.x-btn-over.selected-border-button {
  background-color: #f6abac;
}

.x-btn.border-button.x-btn-default-small.x-btn-pressed.selected-border-button {
  background-color: #cc898a;
}

.green-dot-background {
  padding-left: 35px;
  background-image: url(images/icon/green-dot.png);
  background-repeat: no-repeat;
  background-position: 0px 50%;
  min-height: 20px;
  background-size: 34px 34px;
}

.orange-dot-background {
  padding-left: 35px;
  background-image: url(images/icon/orange-dot.png);
  background-repeat: no-repeat;
  background-position: 0px 50%;
  min-height: 20px;
  background-size: 34px 34px;
}

.red-dot-background {
  padding-left: 35px;
  background-image: url(images/icon/red-dot.png);
  background-repeat: no-repeat;
  background-position: 0px 50%;
  min-height: 20px;
  background-size: 34px 34px;
}

.gray-dot-background {
  padding-left: 35px;
  background-image: url(images/icon/gray-dot.png);
  background-repeat: no-repeat;
  background-position: 0px 50%;
  min-height: 20px;
  background-size: 34px 34px;
}

.abeille-orange {
  background-image: url(images/metier/fichePhyto/logo_abeille_orange.png);
  background-repeat: no-repeat;
  background-position: 0px 50%;
  min-height: 20px;
  background-size: 22px 22px;
  cursor: help !important;
}

.abeille-red {
  background-image: url(images/metier/fichePhyto/logo_abeille_red.png);
  background-repeat: no-repeat;
  background-position: 0px 50%;
  min-height: 20px;
  background-size: 22px 22px;
  cursor: help !important;
}

.red-dot-background {
  padding-left: 35px;
  background-image: url(images/icon/red-dot.png);
  background-repeat: no-repeat;
  background-position: 0px 50%;
  min-height: 20px;
  background-size: 34px 34px;
}

.grid-pastille {
  background-color: #6b5f5c;
  border-radius: 2px;
  box-shadow: 0 0 3px 0 #ffffff;
  color: #ffffff;
  font-size: 0.7em;
  font-weight: bold;
  margin: 0 2px;
  padding: 0 4px;
  text-align: center;
}
.grid-pastille-undisplayed {
  border-radius: 2px;
  margin: 0 5px;
  padding: 0 4px;
}

/* Classes pour cellule de grid */
.grid-cell-horizontal-container {
  /* Pour les navigateurs sans flexbox */
  display: table;
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: end;
}

.grid-cell-horizontal-container > .grid-cell-item {
  display: table-cell;
}

.grid-cell-horizontal-container > .grid-cell-item.grow {
  width: 100%;
  max-width: 100%;
  flex: 1;
  display: inline-block;
}

/* TODO : Corriger dans css ext */
.x-datepicker-disabled {
  background-color: #eee;
}

.x-tab.x-tab-active.x-tab-default .x-tab-inner-default {
  color: #ffffff !important;
}

.x-tab-inner-default {
  color: #c0c0c0 !important;
}

.x-tab-default-top.x-tab-focus {
  box-shadow: none !important;
}

.x-btn-inner {
  overflow: visible;
}

/* fin TODO */

.x-form-item-default.x-item-disabled {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
  opacity: 0.5 !important;
}

.x-mask-msg.combobox-cls-mask {
  padding: 5px;
  background-color: transparent;
  webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  -ms-border-radius: 0px;
  -o-border-radius: 0px;
}

.combobox-cls-mask .x-mask-msg-text {
  padding: 0px 0px 0px 30px;
  background-repeat: no-repeat;
  background-position: 5% 50%;
}

.x-form-multiselect-body .x-boundlist .x-mask {
  background: none;
}

.x-form-itemselector-body .x-form-item {
  margin: 0;
}

.x-form-itemselector-top {
  background-image: url(images/icon/up.gif);
  background-size: 34px 34px;
}

.x-form-itemselector-up {
  background-image: url(images/icon/up.gif);
  background-size: 34px 34px;
}

.x-form-itemselector-add {
  background-image: url(images/icon/right.png);
  background-size: 34px 34px;
}

.x-form-itemselector-remove {
  background-image: url(images/icon/left.png);
  background-size: 34px 34px;
}

.x-form-itemselector-down {
  background-image: url(images/icon/down.png);
  background-size: 34px 34px;
}

.x-form-itemselector-bottom {
  background-image: url(images/icon/down.png);
  background-size: 34px 34px;
}

.x-form-password-trigger {
  background: url("images/icon-visibility.svg") no-repeat center !important;
}

.x-form-password-trigger.x-form-password-trigger-visible {
  background: url("images/icon-visibility-barre.svg") no-repeat center !important;
}

.button-phytos-rechercheproduits {
  background-image: url("/geotracanet/gt_image/btn_phyto.jpg");
  width: 139px;
  height: 57px;
}

.button-phytos-rechercheproduits.active {
  background-image: url("/geotracanet/gt_image/btn_phyto_s.jpg");
  width: 139px;
  height: 57px;
}

.button-phytos-rechercheproduits:hover {
  background-image: url("/geotracanet/gt_image/btn_phyto_v.jpg");
  width: 139px;
  height: 57px;
}

.button-phytos-testmelange {
  background-image: url("/geotracanet/gt_image/btn_melphyto.jpg");
  width: 139px;
  height: 57px;
}

.button-phytos-testmelange.active {
  background-image: url("/geotracanet/gt_image/btn_melphyto_s.jpg");
  width: 139px;
  height: 57px;
}

.button-phytos-testmelange:hover {
  background-image: url("/geotracanet/gt_image/btn_melphyto_v.jpg");
  width: 139px;
  height: 57px;
}

/*************** Menu Personalisation ******************/

.button-perso-intervention {
  background-image: url(images/metier/btn_intervention.jpg);
  width: 139px;
  height: 57px;
}

.button-perso-intervention.active {
  background-image: url(images/metier/btn_intervention_active.jpg);
}

.button-perso-intervention:hover {
  background-image: url(images/metier/btn_intervention_hover.jpg);
}

.button-perso-semences {
  background-image: url(images/metier/btn_semences.jpg);
  width: 139px;
  height: 57px;
}

.button-perso-semences.active {
  background-image: url(images/metier/btn_semences_active.jpg);
}

.button-perso-semences:hover {
  background-image: url(images/metier/btn_semences_hover.jpg);
}

.button-perso-intrants {
  background-image: url(images/metier/btn_intrants.jpg);
  width: 139px;
  height: 57px;
}

.button-perso-intrants.active {
  background-image: url(images/metier/btn_intrants_active.jpg);
}

.button-perso-intrants:hover {
  background-image: url(images/metier/btn_intrants_hover.jpg);
}

.button-perso-ferti-org {
  background-image: url(images/metier/btn_engrais_orga.jpg);
  width: 139px;
  height: 57px;
}

.button-perso-ferti-org.active {
  background-image: url(images/metier/btn_engrais_orga_active.jpg);
}

.button-perso-ferti-org:hover {
  background-image: url(images/metier/btn_engrais_orga_hover.jpg);
}

.button-perso-ferti-min {
  background-image: url(images/metier/btn_engrais_mineraux.jpg);
  width: 139px;
  height: 57px;
}

.button-perso-ferti-min.active {
  background-image: url(images/metier/btn_engrais_mineraux_active.jpg);
}

.button-perso-ferti-min:hover {
  background-image: url(images/metier/btn_engrais_mineraux_hover.jpg);
}

.button-perso-materiel {
  background-image: url(images/metier/btn_materiel.jpg);
  width: 139px;
  height: 57px;
}

.button-perso-materiel.active {
  background-image: url(images/metier/btn_materiel_active.jpg);
}

.button-perso-materiel:hover {
  background-image: url(images/metier/btn_materiel_hover.jpg);
}

.button-perso-operateurs {
  background-image: url(images/metier/btn_operateurs.jpg);
  width: 139px;
  height: 57px;
}

.button-perso-operateurs.active {
  background-image: url(images/metier/btn_operateurs_active.jpg);
}

.button-perso-operateurs:hover {
  background-image: url(images/metier/btn_operateurs_hover.jpg);
}

.button-perso-recolte {
  background-image: url(images/metier/btn_recolte.jpg);
  width: 139px;
  height: 57px;
}

.button-perso-recolte.active {
  background-image: url(images/metier/btn_recolte_active.jpg);
}

.button-perso-recolte:hover {
  background-image: url(images/metier/btn_recolte_hover.jpg);
}

.button-perso-animaux_paturage {
  background-image: url(images/metier/btn_animaux_paturage.jpg);
  width: 139px;
  height: 57px;
}

.button-perso-animaux_paturage.active {
  background-image: url(images/metier/btn_animaux_paturage_active.jpg);
}

.button-perso-animaux_paturage:hover {
  background-image: url(images/metier/btn_animaux_paturage_hover.jpg);
}

.button-justification-groupee {
  background-color: #be1515 !important;
  -webkit-text-fill-color: #ffffff;
}

.button-justification-groupee:hover {
  background-color: #ce2323;
  -webkit-text-fill-color: #ffffff;
}

.button-justification-groupee:hover {
  background-color: #be1515;
  -webkit-text-fill-color: #ffffff;
}

.pac-creation {
  -webkit-mask: url(/mvc/ressources/css/images/icon/c.svg) no-repeat;
  mask: url(/mvc/ressources/css/images/icon/c.svg) no-repeat;
  width: 15px;
  height: 15px;
  background-color: #6d605c;
  margin: 0 auto;
  display: block;
}

.pac-modification {
  -webkit-mask: url(/mvc/ressources/css/images/icon/justification-modif-pac.svg) no-repeat;
  mask: url(/mvc/ressources/css/images/icon/justification-modif-pac.svg) no-repeat;
  width: 15px;
  height: 15px;
  background-color: #6d605c;
  margin: 0 auto;
  display: block;
}

.pac-suppression {
  -webkit-mask: url(/mvc/ressources/css/images/icon/s-gris.svg) no-repeat;
  mask: url(/mvc/ressources/css/images/icon/s-gris.svg) no-repeat;
  width: 15px;
  height: 15px;
  background-color: #6d605c;
  margin: 0 auto;
  display: block;
}

.pac-justification-zdh-manquante {
  -webkit-mask: url(/mvc/ressources/css/images/icon/red-dot.svg) no-repeat;
  mask: url(/mvc/ressources/css/images/icon/red-dot.svg) no-repeat;
  width: 15px;
  height: 15px;
  background-color: #e31520;
  margin: 0 auto;
  display: block;
}

.tool-edit {
  background-image: url(images/edit.svg);
  background-repeat: no-repeat;
  background-position: center center;
  height: 18px;
  width: 18px;
  cursor: pointer;
}

.button-left {
  background-image: url(images/icon/left.png);
  background-position: 50% 50%;
  background-size: 34px 34px;
  height: 17px;
  width: 17px;
}

.button-edit-add {
  background-image: url(images/icon/edit-add.svg);
  background-repeat: no-repeat;
  background-size: contain;
  height: 18px;
  width: 18px;
}

.button-configuration {
  background-image: url(images/icon/option.svg);
  background-size: contain;
  height: 25px !important;
  width: 25px !important;
}

.button-configuration-small {
  background-image: url(images/icon/option.svg);
  background-position: 50% 48% !important;
  background-size: 40px 40px;
  height: 20px !important;
  width: 20px !important;
}

.button-delete {
  background-image: url(images/icon/delete.png);
  background-position: 50% 50%;
  background-size: 34px 34px;
  height: 25px;
  width: 25px;
}

.button-edit {
  background-image: url(images/icon/edit.png);
  background-position: 50% 50%;
  background-size: 34px 34px;
  height: 25px;
  width: 25px;
}

.button-icon-add {
  background-image: url(images/icon/add.svg);
  background-position: 50% 50%;
  background-size: 24px 24px;
  height: 25px;
  width: 25px;
}

.button-icon-link {
  background-image: url(images/icon/lien-vert.svg);
  background-position: 50% 50%;
  background-size: 24px 24px;
  height: 25px;
  width: 25px;
}

.button-info-produit {
  background-image: url(images/icon/chemistry.svg);
  background-size: contain;
  width: 18px;
  height: 18px;
  background-repeat: no-repeat;
  background-position: center;
}

.button-info {
  background-image: url(images/info-v2.svg);
  background-size: contain;
  height: 16px;
  width: 16px;
}

.button-warning-red {
  background-image: url(images/icon/warning-red.png);
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: 32px 32px;
  height: 15px;
}

.button-warning-yellow {
  background-image: url(images/icon/warning-yellow.png);
  background-position: 50% 50%;
  background-size: 32px 32px;
  height: 25px;
  width: 25px;
}

.button-send-mail {
  background-image: url("images/icon/mail.png");
  background-position: 50% 50%;
  width: 25px;
  height: 25px;
}

.button-option {
  background-image: url(images/icon/option.svg);
  background-size: contain;
  height: 25px;
  width: 25px;
}

.button-load {
  background-image: url(images/icon/load.png);
  background-size: contain;
  height: 25px;
  width: 25px;
}

.button-loupe-plus {
  background-image: url(images/icon/loupe-plus.png);
  background-position: 50% 50%;
  background-size: 24px 24px;
  height: 25px;
  width: 25px;
}

.button-info-big {
  background-image: url(images/info-v2.svg);
  background-size: contain;
  height: 49px;
  width: 49px;
}

.button-inline {
  width: 20px;
  height: 20px;
  margin: 0 0.5em -5px 0;
}

.button-send-export {
  background-color: #e73841 !important;
  .x-btn-inner {
    color: white !important;
  }
}

.group-edit-button {
  background-color: #e73841 !important;
  .x-btn-inner {
    color: white !important;
  }
}

.perso-expphyto .datephyto {
  top: 4px !important;
}

.inactive-exp {
  font-weight: bold !important;
}

.perso-expphyto .fieldinfo {
  color: rgb(102, 102, 102);
}

.perso-expphyto .fieldinfo li {
  margin-bottom: 7px;
}

.perso-expphyto .fieldinfo img {
  vertical-align: middle;
  cursor: pointer;
}

.clear-combo-button {
  font-size: 22px;
  color: #999999;
  cursor: pointer !important;
  vertical-align: middle;
  background-color: #ffffff;
  border-top: 1px solid #cecece;
  border-right: 1px solid #cecece;
  border-bottom: 1px solid #cecece;
  text-align: center;
}

.clear-combo-button:hover {
  color: #777777;
}

.grid-cell-split-border {
  border-right: 2px solid #e31520 !important;
}

.grid-cell-split-left-border {
  border-left: 2px solid #e31520 !important;
}

.loading {
  background-color: #e5e5e5;
  background-image: url("../ext/css/images/loadmask/loading.gif");
  background-repeat: no-repeat;
  background-position: 5px center;
  border-radius: 0.2em;
}

.loading .x-panel-body-default {
  background: transparent;
  padding: 0.5em 2em;
  color: #666;
}

.simple-table {
  margin: 0.5em auto;
  border: 1px solid #ededed;
  border-collapse: collapse;
}

.simple-table thead th {
  background-color: #6b5f5c;
  color: white;
  border-collapse: collapse;
}

.simple-table tbody tr + tr {
  border-top: 1px solid #ededed;
}

.simple-table td,
.simple-table th {
  padding: 0.2em 0.5em;
}

/* Champ résultat volatilisation */
.volatilisation {
  padding-top: 1em;
}

.volatilisation label {
  font-size: 1.2em;
  font-weight: bold;
}

.volatilisation .x-form-display-field {
  font-size: 1.2em;
  font-weight: bold;
}

.message-informatif {
  font-family: "Roboto", "sans-serif" !important;
  background-color: #e7e7e7;
  color: #998573;
  padding: 0.5em !important;
  text-align: center;
  font-size: 1.2em !important;
  line-height: 120%;
  border: 2px solid #b0b0b0 !important;
  border-radius: 10px;
}

.message-informatif li {
  text-align: left;
}

.message-informatif .x-panel-body-default {
  background-color: transparent;
  font-size: inherit;
  font-family: inherit;
}

.info {
  padding: 6px 8px;
  font: 14px/16px Arial, Helvetica, sans-serif;
  background: white;
  background: rgba(255, 255, 255, 0.8);
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
  border-radius: 5px;
}

.info h4 {
  margin: 0 0 5px;
  color: #777;
}

.legend {
  text-align: left;
  line-height: 18px;
  color: #555;
}

.legend i {
  width: 18px;
  height: 18px;
  float: left;
  margin-right: 8px;
  opacity: 0.7;
}

.label-legend {
  font-weight: bold;
  margin-bottom: 10px;
}
.item-legend {
  margin-top: 3px;
}

/** Module IFT **/
.ift-grid .x-panel-header {
  background-color: #ffffff;
  border-bottom-color: #ffffff;
  border-top-color: #ffffff;
  color: #ffffff;
}

.ift-totaux {
  font-weight: bold;
  font-size: 16px;
}

.ift-grid .x-panel-body-default {
  border-color: #ffffff;
}

.ift-label-calcul {
  font-style: italic;
}

.ift-grid .x-panel-header-default-horizontal {
  padding: 0px 0px 0px 0px;
}

.ift-grid .x-panel-header-default-horizontal.x-header-noborder {
  padding: 0px 0px 0px 0px;
}

.ift-grid .ref-no-exist {
  width: 20px;
  height: 20px;
  padding-left: 35px;
  background-image: url(images/icon/orange-dot.png);
  background-repeat: no-repeat;
  background-position: 0px 50%;
  min-height: 20px;
  background-size: 20px 20px;
}

.ift-first-level {
  padding-left: 3px;
}

.ift-first-level .x-form-cb-label {
  font-weight: bold;
  font-size: 110%;
  font-family: Exo2Bold;
  color: #666;
}

.ift-second-level {
  font-style: bold;
  padding-left: 9px;
}

.ift-third-level .x-grid-cell-inner {
  padding: 5px 10px 4px 25px;
}

.ift-grid-libelleparcelle {
  vertical-align: bottom;
}

div.ift-grid {
  border-bottom: black solid 1px;
}

div.ift-grid td.x-group-hd-container span {
  font-size: 103%;
  font-weight: bold;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-family: Exo2Bold;
  font-weight: bold;
}

div.ift-grid div.x-panel-body {
  background-color: #dddddd;
  border: none;
}

div.ift-grid table:first-of-type tr:first-of-type td.ift-header-spacing {
  padding-top: 0px;
}

div.ift-grid table td.ift-header-spacing {
  padding-top: 20px;
}

div.ift-grid div.ift-grid-group-hd {
  text-align: center;
}

div.ift-grid .ift-second-level img {
  vertical-align: bottom;
}

div.ift-sous-total-grid div.x-panel-body,
div.ift-sous-total-grid .x-grid-item,
div.ift-sous-total-grid.x-grid-body,
div.ift-sous-total-grid.x-panel-body-default,
div.ift-sous-total-grid.x-grid-item {
  border: none;
  background: none;
}

div.ift-sous-total-grid {
  background-color: #dddddd;
  border: none;
}

.ift-grid-labeltbarbutton {
  color: #c52525;
  font-weight: bold;
}

.checkbox-invert .x-form-checkbox {
  display: none;
}
.checkbox-invert .x-form-checkbox + label {
  padding-left: 0;
  cursor: pointer;
  display: block;
  margin: 0 auto;
  font-size: 12px;
  font-weight: bold;
}
.checkbox-invert .x-form-checkbox + label::after {
  content: "";
  background-color: #444;
  position: absolute;
  top: 40px;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 20px;
  height: 20px;
  mask: url("./images/icon/Inverser-la-sélection.svg") no-repeat;
  -webkit-mask: url("./images/icon/Inverser-la-sélection.svg") no-repeat;
  -webkit-mask-size: contain;
}

.icon-recent {
  mask: url("images/icon/recent.svg") no-repeat;
  background-size: contain;
  background-repeat: no-repeat;
  background: #545455;
  height: 14px;
  width: 14px;
  margin-right: 5px;
}

.icon_sablier {
  mask: url("./images/icon/debut-de-sablier.svg") no-repeat;
  -webkit-mask: url("./images/icon/debut-de-sablier.svg") no-repeat;
  -webkit-mask-size: contain;
  background-size: contain;
  background-repeat: no-repeat;
  background: #545455;
}

.icon_sablier.icon_normal {
  width: 24px;
  height: 24px;
}

.icon_sablier.icon_small {
  margin-left: 10px;
  width: 11px;
  height: 13px;
}

.icon_wifi_succes {
  background-image: url(images/icon/icon-wifi-succes.svg);
  background-size: contain;
  background-repeat: no-repeat;
}

.icon_wifi_succes.icon_normal {
  width: 24px;
  height: 24px;
}

.icon_wifi_erreur.icon_small {
  margin-left: 10px;
  width: 13px;
  height: 13px;
}

.icon_wifi_erreur {
  background-image: url(images/icon/icon-wifi-erreur.svg);
  background-size: contain;
  background-repeat: no-repeat;
}

.icon_wifi_erreur.icon_normal {
  width: 24px;
  height: 24px;
}

.icon_wifi_erreur.icon_small {
  margin-left: 10px;
  width: 13px;
  height: 13px;
}

.icon_wifi_aretraiter {
  background-image: url(images/icon/icon-wifi-aretraiter.svg);
  background-size: contain;
  background-repeat: no-repeat;
}

.icon_wifi_aretraiter.icon_normal {
  width: 24px;
  height: 24px;
}

.icon_wifi_aretraiter.icon_small {
  margin-left: 10px;
  width: 13px;
  height: 13px;
}

.rotate {
  animation: rotate-stop 3s infinite linear;
  transform: rotate();
}

@keyframes rotate-stop {
  0% {
    transform: rotate(0deg);
  }
  5%,
  50% {
    transform: rotate(180deg);
  }
  55%,
  100% {
    transform: rotate(360deg);
  }
}
/** Fin Module IFT **/

.important-field {
  border: 10px solid #aaaaaa;
  padding: 5px;
  background-color: #dddddd;
}

.x-form-cb-wrap-default {
  height: 24px;
}

/* Composant checkbox à 3 états */
.x-form-tricb-default {
  margin-top: 5px;
}

.x-form-tricheckbox-default,
.x-form-radio-default {
  width: 15px;
  height: 15px;
}

.x-form-tricb-checked .x-form-radio-default {
  background-position: 0 -15px;
}

.x-form-tricheckbox-default {
  background: url(images/icon/tricheckbox.png) no-repeat;
  border: none;
}

.x-form-tricb-checked .x-form-tricheckbox-default {
  background-position: 0 -15px;
}

.x-field-default-form-tricheckbox-focus {
  background-position: -15px 0;
}

.x-form-tricb-checked .x-field-default-form-tricheckbox-focus {
  background-position: -15px -15px;
}

.x-form-tricb-undef .x-form-tricheckbox-default {
  background-position: 0 -30px;
}

.x-form-tricb-undef .x-field-default-form-tricheckbox-focus {
  background-position: -15px -30px;
}

.x-form-tricb-label-default {
  margin-top: 4px;
  font: normal helvetica, arial, verdana, sans-serif/17px helvetica, arial, verdana, sans-serif;
}

.x-form-tricb-label-default.x-form-tricb-label-before {
  padding-right: 19px;
}

.x-form-tricb-label-default.x-form-tricb-label-before.x-rtl {
  padding-right: 0;
  padding-left: 19px;
}

.x-form-tricb-label-default.x-form-tricb-label-after {
  padding-left: 19px;
}

.x-form-tricb-label-default.x-rtl {
  padding-left: 0;
  padding-right: 19px;
}

.x-tricheckbox-default-cell > .x-grid-cell-inner {
  padding-top: 0px;
  padding-bottom: 0px;
}

/* FICHE PHYTO */
.datefin {
  top: 10px !important;
  padding: 0em 0em 2em;
}

.buttonPopupAlert > .x-center-target > .x-btn {
  top: 8px !important;
}

.ag_logo .x-autocontainer-innerCt {
  display: flex;
  flex-wrap: wrap;
}

.ag_logo img {
  margin: 0 0.5em 0.25em 0;
}

/* Retour à la ligne dans une cellule d'une grille */
.multiline-row .x-grid-cell-inner {
  overflow: auto !important;
  white-space: normal !important;
  text-overflow: ellipsis;
  display: block;
}

/* Désactivation des espaces entres les rows pour avoir un separateur uniforme */
.gridspectre > .x-panel-body > .x-grid-view > .x-grid-item-container > .x-grid-item {
  border-width: 0 0 0 !important;
}

/*Partie grid spectres pour produit phyto*/
.gridspectre .grid-row-border-top .x-grid-cell-inner {
  border-top: none !important;
}

.gridspectre .grid-row-border-top {
  border-top: 1px solid #cccccc !important;
}

.gridspectre .middle-align-td {
  vertical-align: middle !important;
}

.gridspectre .info-detail-btn {
  padding: 3px 0px 3px 0px;
}

.right-red-separator {
  border-right: 1px solid red !important;
}

.actioncolumn-hide > div > img {
  visibility: hidden;
}

.phyto-warning-label {
  background-color: #ffffff;
  border: 3px solid #c0282e;
  height: 54px;
  padding: 1em;
  font-weight: bold;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.phyto-warning-label .main-text {
  color: #c0282e;
}

.phyto-warning-label .second-text {
  color: #000000;
}

/* Fiche popup alerte culture phyto */
.gridalert > .x-toolbar {
  border-width: 0 !important;
}

.titre-fiche-alerte {
  font-size: 1.5em;
  padding: 10px !important;
}

/* Fiche Cible Phyto */
.fiche-cible {
  padding: 1em;
}

.fiche-cible table {
  border-collapse: collapse;
  width: 100%;
}

.fiche-cible tbody + tbody::before {
  display: block;
  height: 2em;
  content: " ";
}

.fiche-cible tr td {
  vertical-align: top;
  padding: 0.5em;
  border: 1px solid #bbb;
}

.fiche-cible tr td:first-of-type {
  background-color: #6b5f5c;
  color: white;
  font-weight: bold;
  border: none;
}

.fiche-cible tbody tr:first-of-type td:first-of-type {
  border-top: 1px solid #6b5f5c;
}

.major-title-fieldset .x-fieldset-header-default > .x-fieldset-header-text {
  font-size: 1.1em;
  font-weight: bold;
}

/* Calcul Dose PK fenetre info */
td.gfenteteinfopk {
  font-weight: bold;
  vertical-align: top;
  text-align: left;
  padding-top: 2px;
  padding-bottom: 2px;
  padding-right: 2px;
  padding-left: 5px;
  margin-top: 5px;
}

td.gfvaleurinfopk {
  color: #666666;
  width: 100px;
  padding: 2px;
  text-align: center;
}

td.gfvaleurdoseinfopk {
  color: #000000;
  width: 100px;
  padding: 2px;
  text-align: center;
  font-weight: bold;
}

td.gfvaleurinfopk-haut {
  color: #666666;
  width: 100px;
  padding: 2px;
  text-align: center;
  border-top: 1px solid #666666;
}

td.gfenteteinfopk-haut {
  font-weight: bold;
  vertical-align: top;
  text-align: left;
  padding-top: 2px;
  padding-bottom: 2px;
  padding-right: 2px;
  padding-left: 5px;
  margin-top: 5px;
  border-top: 1px solid #666666;
}

td.gfnominfopk {
  font-style: italic;
  width: 150px;
  padding: 2px;
}

td.gfnominfopk-haut {
  font-style: italic;
  width: 150px;
  padding: 2px;
  border-top: 1px solid #666666;
}

/** DIAGNOSTIC PAC **/
.diagnosticPAC .cellDisable {
  background-color: #898989;
  background: repeating-linear-gradient(-45deg, #222, #222 2px, transparent 2px, transparent 15px);
}

.diagnosticPAC .inlineTooltip {
  display: inline-block;
  vertical-align: middle;
  margin: 0 5px;
}

.diagnosticPAC .hideActionParcelle > div {
  display: none;
}

.diagnosticPAC .viewParcelles,
.diagnosticPAC .viewParcelles:hover,
.diagnosticPAC .viewParcelles:focus {
  border: none !important;
  background-image: none !important;
  background-color: transparent !important;
  box-shadow: none !important;
}

.diagnosticPAC .inputEditable input {
  text-align: center;
}

/* Documentation */
.documentation .chapitre {
  margin-top: 5px;
}

.documentation .titre {
  font-weight: bold;
  padding: 4px 0px;
}

.documentation .titre-level-2 {
  font-size: 20px;
}

.documentation .titre-level-3 {
  font-size: 18px;
}

.documentation .chapitre .commentaire {
  padding: 5px 0;
  display: block;
}

.documentation .informations-container {
  padding-left: 20px;
}

.documentation .informations {
  width: 100%;
  display: flex;
}

.documentation .informations .information-block-container {
  flex: 1;
  margin: 2px;
  color: #ffffff;
  border-radius: 3px;
}

.documentation .informations .information-block-container .information-icon {
  background-position: 50% 50%;
  background-size: 22px 22px;
  background-repeat: no-repeat;
  width: 36px;
  height: 36px;
  float: left;
}

.documentation .informations .information-block-container .information-block {
  padding: 9px 0 9px 36px;
}

.documentation .informations .information-block-container.droit {
  background-color: #eeae24;
}

.documentation .informations .information-block-container.droit .information-icon {
  background-image: url(images/icon/documentation/key.png);
}

.documentation .informations .information-block-container.champ {
  background-color: #aaaaaa;
}

.documentation .informations .information-block-subcontainer.champaffichage .information-icon {
  background-image: url(images/icon/documentation/eye.png);
}

.documentation .informations .information-block-subcontainer.champprovenance .information-icon {
  background-image: url(images/icon/documentation/data-up.png);
}

.documentation .informations .information-block-subcontainer.champenregistrement .information-icon {
  background-image: url(images/icon/documentation/data-down.png);
}

.documentation .informations .information-block-container.condition {
  background-color: #aaaaaa;
}

.documentation .informations .information-block-container.condition .information-icon {
  background-image: url(images/icon/documentation/setting.png);
}

.documentation .informations .information-block-container.filtre {
  background-color: #aaaaaa;
}

.documentation .informations .information-block-container.filtre .information-icon {
  background-image: url(images/icon/documentation/filter.png);
}

.documentation .informations .information-block-container.champ {
  display: flex;
}

.documentation .informations .champprovenance-champenregistrement {
  flex: 1;
  display: flex;
  flex-direction: column;
}

.documentation .informations .information-block-subcontainer.champaffichage,
.documentation .informations .information-block-subcontainer.champprovenance,
.documentation .informations .information-block-subcontainer.champenregistrement {
  flex: 1;
}

.documentation .informations .border-top {
  border-top: 1px dotted #ffffff;
}

.documentation .informations .border-right {
  border-right: 1px dotted #ffffff;
}

.documentation ul {
  padding: 0 5px 0 13px;
  margin: 0px;
}

.documentation .commentaire li {
  line-height: 15px;
}

.highlight-encard {
  animation: highlight-encard 2000ms ease-out;
}

@keyframes highlight-encard {
  0% {
    background-color: #fe6b6c;
  }
  100% {
    background-color: inherit;
  }
}

/*Tableau Affectation Regroupement*/

.row-selected .x-grid-cell {
  background-color: #ffacad;
}

.row-selected:hover .x-grid-cell {
  background-color: #ffd9da;
}

@media (max-width: 1050px) {
  .x-grid-cell-inner {
    padding: 5px 2px 4px 4px !important;
    font-size: 80%;
  }

  .x-column-header-inner {
    font-size: 80%;
    padding: 7px 5px 7px 7px;
  }
}

.button-edit-add-small {
  background: url(images/icon/edit-add.svg) no-repeat center center transparent;
  background-size: contain;
  height: 16px;
  width: 16px;
}

/**************************
* BEGIN style SwitchField *
***************************/
.switch {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  width: 30px;
  height: 17px;
}

.switch input {
  display: none;
}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0 !important;
  right: 0;
  bottom: 0;
  background-color: #ff6600;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}

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

.switchfield-checked .slider {
  background-color: #33cc33;
}

input:focus + .slider,
.switchfield-checked .slider {
  box-shadow: 0 0 1px #33cc33;
}

.switchfield-checked .slider:before {
  -webkit-transform: translateX(13px);
  -ms-transform: translateX(13px);
  transform: translateX(13px);
}

.slider:before {
  -webkit-transform: translateX(0);
  -ms-transform: translateX(0);
  transform: translateX(0);
}

.slider.round {
  border-radius: 17px;
}

.slider.round:before {
  border-radius: 50%;
}

/************************
* END style SwitchField *
*************************/

/***************************************************
*     BEGIN style outils d'aide à la décision      *
*   Récupération des données - synthèse et stade   *
***************************************************/
.reception-synthese-legende div {
  height: 400px !important;
  width: 400px !important;
}

.reception-synthese-grid .x-grid-with-row-lines .x-grid-item.x-grid-item-over {
  background-color: initial !important;
}

.reception-synthese-grid table.x-grid-item-alt,
.reception-synthese-grid .x-grid-with-row-lines .x-grid-item.x-grid-item-alt.x-grid-item-over {
  background-color: #f7f7f7 !important;
}

.reception-synthese-stade > div {
  display: flex;
}

.parametrage-mail .mail-days-buttons .x-btn-default-small {
  background-color: #a1a1a1;
  background-image: none;
  border-color: #000;
}

.reception-synthese-grid .x-grid-td {
  vertical-align: middle;
}

.reception-synthese-grid .date-mediane {
  font-size: 18px;
  color: #5ac621;
}

.saisieseptoriose .x-grid-td,
.recalagestadeepi1cm .x-grid-td,
.choix-certifications .x-grid-td {
  vertical-align: middle;
}

/****************************************
* END style outils d'aide à la décision *
*  Récupération des données - synthèse  *
*****************************************/

/***********************************************
* BEGIN style des vignettes de services *
************************************************/

.service .btn-categorie,
.service .btn-fournisseur {
  width: 200px;
  margin-bottom: 10px;
  float: left;
  display: inline-block;
  height: 30px;
  color: #c0c0c0;
  background-color: #ededed;
}

.service .btn-fournisseur-selected,
.service .btn-categorie-selected {
  color: #ffffff;
  background-color: hsl(45, 77%, 50%);
}

.service .btn-categorie:hover,
.service .btn-fournisseur:hover {
  color: #ffffff;
  background-color: #9bcc29;
}

.service .service-action-btn span:last-child {
  color: #ffffff;
  line-height: 18px;
}

.service .service-status {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 5px;
  border-radius: 100%;
  background-color: #92d36e;
  width: 25px;
  height: 25px;
}

.service .service-operationnel {
  height: 50px;
  width: 50px;
  background-color: #ffffff;
  mask: url("./images/mpconnect/icons/service-operationnel.svg") no-repeat 50% 50%/100%;
  -webkit-mask: url("./images/mpconnect/icons/service-operationnel.svg") no-repeat 50% 50%/100%;
}

.service .btn-service {
  text-align: center;
  outline: none;
  border-radius: 4px;
  cursor: pointer;
  background-color: #e31520;
  color: #ffffff;
}

.service .btn-service-selected,
.service-dispatcher .btn-service-selected {
  background-color: #e3e3e3;
}

.service .btn-service-main {
  text-align: center;
  outline: none;
  border-radius: 4px;
  font-family: Din, sans-serif;
  font-size: 16px;
  cursor: pointer;
  background-color: #e0e0e0;
  color: #ffffff;
}

.service .btn-service-main:hover {
  background-color: #937f79;
}

.service .btn-service-main.btn-service-selected {
  background-color: #6e605b;
}

.service .btn-service .x-btn-button,
.service .btn-service .x-btn-inner {
  color: #ffffff;
  overflow: visible;
}

.service .btn-action-service span {
  color: #ffffff;
  text-align: center;
  white-space: normal;
  font: 300 14px Roboto, sans-serif;
}

.service .btn-action-service:hover {
  background-color: #d4333b !important;
}

.service .btn-price {
  height: 30px;
  width: 30px;
  background-image: url("./images/mpconnect/icons/icon-euro-grey.svg");
}

.service .btn-info {
  height: 30px;
  width: 30px;
  background: url(./images/mpconnect/icons/icon-info-grey.svg) no-repeat right center;
}

.service .btn-info:hover,
.service .btn-price:hover {
  filter: brightness(1.2);
}

.service .btn-type-service {
  height: 25px;
  padding: 5px;
  color: #c0c0c0;
  background-color: #ededed;
  border: none;
  float: left;
  display: inline-block;
  margin-bottom: 10px;
  outline: none;
}

.service .btn-type-service-selected {
  color: #ffffff;
  background: #00973e;
}

.service-dispatcher .btn-import,
.service-dispatcher .btn-export,
.service-dispatcher .btn-command,
.service-dispatcher .btn-result,
.service-dispatcher .btn-telechargement {
  width: 220px;
  height: 90px;
  border: 1px solid #d3d3d3;
  border-radius: 15px;
  margin-right: 20px;
}

.service-dispatcher .btn-import:hover,
.service-dispatcher .btn-export:hover,
.service-dispatcher .btn-command:hover,
.service-dispatcher .btn-result:hover,
.service-dispatcher .btn-telechargement:hover {
  background-color: #f0f0f0;
}

.service-dispatcher .btn-action-service {
  background-color: #e31520;
}

.service .icon-typeservice {
  width: 40px;
  height: 40px;
}

.service .type-service-title {
  font-size: 18px;
  color: #4a4a4a;
  margin-left: 20px;
}

.service .service-name .x-panel-body strong {
  font-family: DinBold, sans-serif;
  font-weight: normal;
}

.service .type-service-menu {
  background-color: #ebebeb;
}

.service .type-service-menu-btn {
  padding: 0;
  margin-right: 10px;
  top: 5px;
}

.service .type-service-menu-btn.no-active {
  filter: brightness(1.2) contrast(0.8) saturate(0);
}

.service .type-service-menu-btn.no-active:hover {
  filter: brightness(1.4);
}

.service .logo-services {
  background-color: #f7f6f6;
  height: 100%;
  width: 100%;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: 50% 50%;
  border: 5px solid #f7f6f6;
  float: left;
  display: block;
}

.service .logo.large {
  border: 10px solid #f7f6f6;
}

.dataview-service-thumb-wrap {
  float: left;
  display: block;
  margin: 5px;
  text-align: center;
}

.dataview-service-thumb {
  padding: 0px 8px 8px 8px;
}
.dataview-service-div-name {
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: 200px;
  min-height: 35px;
}

.dataview-service-x-label {
  display: inline-block;
  text-align: center;
  padding-top: 8px;
  width: 150px;
}

.dataview-service-right {
  display: inline-block;
  float: right;
  margin-top: 5px;
}

.dataview-service-div-logo {
  width: 200px;
  height: 200px;
  background-color: #f7f6f6;
  cursor: pointer;
  align-items: center;
  display: flex;
  justify-content: center;
}

.dataview-service-img-logo {
  width: 80%;
  height: 80%;
  object-fit: contain;
}

.dataview-service-window-detail {
  width: 80%;
  object-fit: contain;
}

.dataview-add {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 5px;
  border-radius: 100%;
  background-color: #92d36e;
  width: 25px;
  height: 25px;
}

.service .service-add {
  height: 50px;
  width: 50px;
  background-color: #ffffff;
  mask: url(images/icon/add.png) no-repeat 50% 50%/100%;
  -webkit-mask: url(images/icon/add.png) no-repeat 50% 50%/100%;
}

/*********************************************
* END style des vignettes de services *
**********************************************/

/******************************************
* BEGIN style bottom *
*******************************************/

.bottom__part-one,
.bottom__part-one a {
  color: #6e605b;
  font-family: "Din", sans-serif;
  text-decoration: none;
}

.bottom__part-one a:hover {
  color: #e31520;
}

.bottom__part-two,
.bottom__part-two a {
  color: #ffffff;
  font-family: "Din", sans-serif;
  text-decoration: none;
}

.bottom__part-two a:hover {
  color: #6e605b;
}

.bottom__column__separator {
  border-left: 1px solid #ded5c7;
  flex: 1;
  padding: 10px 0;
}

.bottom__column__link__separator {
  position: relative;
  padding: 20px 0px;
}

.bottom__column__link__separator::after {
  content: "•";
  position: relative;
}

.bottom__part-one {
  display: flex;
  padding: 40px 20%;
  /* background-color: #4A4A4A;*/
  background-color: #ebe4db;
  background-image: url(images/metier/parcelles.png);
  background-position: 100% 100%;
  background-size: 200px;
  background-repeat: no-repeat;
}

@media (max-width: 1300px) {
  .bottom__part-one {
    padding: 40px 40px;
    background-image: none;
  }
}

.bottom__part-one a {
  font-size: 16px;
}

.bottom__column__header {
  font-family: "DinBold", sans-serif;
  font-size: 20px;
  padding: 5px 0 20px 0;
}

.bottom__column {
  list-style-type: none;
  margin-block-start: 0;
  margin-block-end: 0;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
  padding-inline-start: 0;
  flex: 8;
}

.bottom__part-two {
  display: grid;
  background-color: hsl(45, 77%, 50%);
  /*background-color: #00973e;*/
  border-bottom: 5px solid #6e605b;
  justify-content: center;
  grid-auto-flow: column;
}

.bottom__column__link {
  padding: 20px 10px;
}

/****************************************
* END style bottom  *
*****************************************/

.mpconnect-date-label {
  font-family: DinBold, sans-serif;
  font-size: 24px;
  color: #4a4a4a;
  padding: 10px;
  text-align: right;
}

.mpconnect-materiel-label {
  font-family: Din, sans-serif;
  font-size: 22px;
  color: #4a4a4a;
  padding: 10px;
}

.x-panel-header-title-default > .x-title-text-default {
  padding: 2px 0 !important;
}

.affectation-rapide {
  background-color: #f5f5f5;
  font-style: italic;
}

.x-grid-row .affectation-rapide-cell > .x-grid-cell-inner {
  border: none;
  background-color: #ffffff;
  color: #333333;
  border-bottom: 3px solid #ffffff;
}

.isok {
  -webkit-mask: url(/mvc/ressources/css/images/icon/carto/check.svg) !important;
  mask: url(/mvc/ressources/css/images/icon/carto/check.svg) !important;
  background-repeat: no-repeat;
  background-position: center;
  padding: 1em;
  width: 100%;
  background-color: #83b81a;
}

.isok-decitrait {
  -webkit-mask: url(/mvc/ressources/css/images/icon/carto/check.svg) no-repeat center !important;
  mask: url(/mvc/ressources/css/images/icon/carto/check.svg) no-repeat center !important;
  padding: 0.58em;
  background-color: #83b81a;
}

.importisobus-evenement-previ {
  background-color: #fafafa;
}

.importisobus-evenement-import {
}

.importisobus-evenement-realise {
  background-color: #fafafa;
  font-weight: bold;
}

.importexport-isobus-parcelle,
.importexport-isobus-parcelle .x-panel-body-default {
  font-size: "115%";
  background-color: #f0f0f0;
  color: #333333;
  font-family: "Din", sans-serif;
}

.importisobus-evenement-totaux .x-grid-cell-inner {
  background-color: #f0f0f0;
  color: #555555;
  font-size: "115%";
  font-family: "DinBold", sans-serif;
}

.icon-isobus-previ {
  background-image: url(images/metier/previsionnel.png);
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: 16px 16px;
  width: 30px;
  height: 16px;
  display: inline-block;
}

.icon-isobus-import {
  background-image: url(images/metier/import.png);
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: 16px 16px;
  width: 30px;
  height: 16px;
  display: inline-block;
}

.icon-isobus-rea {
  background-image: url(images/metier/realise.png);
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: 16px 16px;
  width: 30px;
  height: 16px;
  display: inline-block;
}

/* Debut KeyField */

.keyfield-by-mesparcelles-container {
  width: 100%;
  display: flex;
  height: 300px;
}

.internet-of-field-logo {
  width: 100px;
  height: 100px;
  background-image: url("./images/mpconnect/internet_of_fields.png");
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: contain;
}

.keyfield-accueil-synchronisation li {
  list-style: disc outside;
}

.accueil-synchronisation {
  width: 95vw;
}

/* Fin KeyField */

/* Début Smartbox */
.editable-field-smartbox {
  border: 1px dotted #e31520 !important;
  cursor: pointer !important;
}
.editable-field-smartbox:hover {
  border-style: solid !important;
}

.hour-evenement {
  margin-left: 60px;
}

/* Fin Smartbox */

.common-dropdown-arrow {
  background-color: black;
  mask: url(images/icon/common/down.svg) no-repeat 50% 50%;
  -webkit-mask: url(images/icon/common/down.svg) no-repeat 50% 50%;
  width: 1em;
  height: 1em;
  transition: transform 0.2s;
}

.common-dropdown-arrow.white {
  background-color: white;
}

.common-dropdown-arrow.up {
  transform: rotate(0.5turn);
  -webkit-transform: rotate(0.5turn);
}

.common-dropdown-arrow.down {
  transform: rotate(1turn);
  -webkit-transform: rotate(1turn);
}

.global-title-container {
  display: flex;
  justify-content: space-between;
}
.title-container {
  display: flex;
  align-items: center;
}
.switch_carto {
  padding: 5px 10px;
  display: inline-block;
  background-color: hsl(358, 79%, 52%);
  color: hsl(358, 79%, 99%);
  border-radius: 5px;
  font-size: 16px;
  text-decoration: none;
  font-weight: bold;
  line-height: 19px;
  cursor: pointer;
}
.d-flex {
  display: flex;
}

.switch_page {
  padding: 8px 10px;
  display: flex;
  align-items: center;
  border-radius: 5px;
  font-size: 16px;
  text-decoration: none;
  font-weight: bold;
  line-height: 16px;
  margin-left: 20px;
  cursor: pointer;
}
.switch_page.to_new_carto,
.switch_page.to_services {
  background-color: hsl(45, 77%, 50%);
  color: hsl(358, 79%, 99%);
}
.switch_page.to_new_carto:hover,
.switch_page.to_services:hover {
  background-color: hsl(45, 77%, 62%);
  color: hsl(358, 79%, 99%);
}
.switch_page.to_old_carto {
  background-color: #ff972e;
  color: hsl(358, 79%, 99%);
}
.switch_page.to_old_carto:hover {
  background-color: #ff8100;
  color: hsl(358, 79%, 99%);
}
.switch_page.to_tableau {
  background-color: hsl(45, 77%, 50%);
  color: hsl(358, 79%, 99%);
}
.switch_page.to_tableau:hover {
  background-color: hsl(45, 77%, 62%);
  color: hsl(358, 79%, 99%);
}
.switch_page.to_interv {
  background-color: hsl(45, 77%, 50%);
  color: hsl(358, 79%, 99%);
  display: flex;
  width: 250px;
}
.switch_page.to_interv:hover {
  background-color: hsl(45, 77%, 62%);
  color: hsl(358, 79%, 99%);
}

.switch_page:before {
  display: inline-block;
  margin-right: 8px;
  vertical-align: bottom;
  filter: brightness(2);
  height: 16px;
  width: 16px;
}
.switch_page.to_services::before {
  content: "";
  mask: url("./images/icon/carto/icon_chevron-left.svg");
  -webkit-mask: url("./images/icon/carto/icon_chevron-left.svg");
  background: #fff;
  width: 8px;
}
.switch_page.to_new_carto::before {
  content: url("./images/icon/carto/icon_map.svg");
}
.switch_page.to_old_carto::before {
  content: url("./images/icon/carto/icon_map.svg");
}
.switch_page.to_tableau::before {
  filter: invert(100%);
  content: url("./images/mpconnect/icons/list.svg");
}
.switch_page.to_interv::before {
  content: url("./images/icon/edit-add-white.svg");
  display: inline-block;
  margin-right: 20px;
  margin-bottom: 16px;
  vertical-align: center;
  filter: brightness(2);
  height: 10px;
  width: 24px;
}
.switch_page.agri_precision {
  padding-right: 0;
}
.switch_page.agri_precision * {
  font-size: 16px;
  padding-left: 0;
}

.link-xml-telepac {
  width: 90px;
  position: absolute;
  top: 20px;
  bottom: 0;
  margin-left: 30px;
  background-image: url(images/icon/rapport_fichier.svg);
  background-repeat: no-repeat;
  background-size: 70%;
  background-position: 50% 0;
}

.link-xml-telepac::before {
  content: "Fichier XML TéléPAC";
  width: 110px;
  position: absolute;
  background: #b0b0b0;
  top: 45px;
  left: calc(50% - 55px);
  color: #555;
  font-size: 11px;
  font-weight: bold;
  padding: 3px 0;
  text-align: center;
}

.accordion-dispositif.x-accordion-item {
  margin-bottom: 10px !important;
}
.accordion-dispositif .x-accordion-hd .x-tool-img {
  background-color: #e5232a;
}
.accordion-dispositif.x-accordion-item .x-accordion-hd {
  cursor: pointer;
}

/******************************************
* BEGIN custom puce services window *
*******************************************/

.bdd-text-formater ul {
  padding: 0 0 0 10px;
  margin: 3px 0;
}

.bdd-text-formater ul li {
  padding: 0 0 0 10px;
}

/******************************************
* END custom puce services window *
*******************************************/

.optiprotect-tabpanel-header.x-tab-default {
  border-color: #f2ebd4 !important;
  background-color: #f2ebd4 !important;
}

.optiprotect-tabpanel-header.x-tab.x-tab-active.x-tab-default {
  border-color: #e9c353 !important;
  background-color: #e9c353 !important;
}

.optiprotect-tabpanel-header .x-tab-inner {
  font-size: 1.2em;
  overflow: visible;
}

.badge-alternatif {
  background-color: #ffffff;
  padding: 1em;
  color: #83b81a;
  border: 0.2em solid #83b81a;
  border-radius: 0.5em;
  position: relative;
  display: inline-block;
  width: 8em;
  height: 2.5em;
  font-size: 60%;
  line-height: 2.2em !important;
}

.badge-alternatif::after {
  content: "Alternatif";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  text-align: center;
  font-size: 150%;
  padding-top: 0.01em;
}

/*
* START Decitrait custom *
*/
.title-information {
  font-size: 15px;
  padding-left: 10px;
}
.x-action-col-icon.decitrait-icon {
  height: 16px;
  width: 16px;
  margin-top: 5px;
}
.decitrait-grid-envoi {
  mask: url(images/icon/arrow-send.svg) 0 0/16px no-repeat;
  -webkit-mask: url(images/icon/arrow-send.svg) 0 0/16px no-repeat;
  background-color: #83b81a;
  margin: 0 2px 0 2px;
}

.decitrait-grid-border-left {
  border-left: 2px solid #cccccc !important;
}

.decitrait-grid-border-right {
  border-right: 2px solid #cccccc !important;
}
.decitrait-grid-border-light-left {
  border-left: 1px solid #cccccc !important;
}
.decitrait-grid-border-light-top {
  border-top: 1px solid #cccccc !important;
}
.font-risque {
  font-size: 12px;
  line-height: 10px;
}

.no-cursor .x-action-col-icon {
  cursor: initial;
}

.grid-icon-ecran {
  background-image: url(images/info-v2.svg);
  background-repeat: no-repeat;
  cursor: pointer;
  background-size: 20px;
  background-position: center;
  margin: 0 2px 0 2px;
}

.decitrait-risque {
  position: absolute;
  right: 15px;
  height: 30px;
  width: 30px;
  padding: 2px 0;
  /**background-color: #ffffffaa;*/
  background: radial-gradient(rgb(255, 255, 255) 0%, rgb(255, 255, 255, 0) 75%);
  margin-left: 20px;
  border-radius: 50px;
}

.decitrait-risque::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  background-repeat: no-repeat;
  background-position: center;
  height: 100%;
  width: 100%;
  vertical-align: middle;
}

.decitrait-risque.oidium::after {
  background-image: url(images/mpconnect/decitrait/vigne_V08-2021-risqueOidium.svg);
}

.decitrait-risque.mildiou::after {
  background-image: url(images/mpconnect/decitrait/vigne_V08-2021-risqueMildiou.svg);
}

.decitrait .main-image {
  border: solid 2px #c52525;
}

.decitrait .secondary-image {
  filter: grayscale(1);
  cursor: pointer;
}
.decitrait .secondary-image:hover {
  filter: grayscale(0);
}

.decitrait .main-title {
  font-weight: bold;
}
.sliderContainerGraduate table {
  width: 100%;
}
.sliderContainerGraduate table tr td {
  display: grid;
  grid-row: 1;
}
.sliderContainerGraduate table tr {
  display: grid;
}
.sliderContainerGraduate table tr td span.value {
  grid-row: 1;
  margin-top: -2px;
}
.sliderGraduate {
  padding: 0px 3px 0px 5px;
}
.sliderContainerGraduate table tbody tr td span.tick {
  border-left: solid 1px black;
  height: 5px;
  margin-left: 4px;
}

.title-graphique {
  font-size: 25px;
  font-weight: bold;
  padding: 10px 0px;
}
.decitrait-alerte {
  height: 26px;
  display: flex;
  align-items: center;
}
.decitrait-modified {
  text-stroke: 1px black;
  -webkit-text-stroke: 1px black;
}
.decitrait-modified-white {
  text-stroke: 1px #ffffff;
  -webkit-text-stroke: 1px #ffffff;
}
.decitrait-protection {
  width: 10px;
  height: 10px;
  display: inline-block;
  border-radius: 50%;
  position: absolute;
  top: 14px;
  right: 14px;
}
/*ALERTE VALEUR NULL*/
.alerte-null {
  background: rgb(200, 200, 200);
}
/*ALERTE AUCUNE PROTECTION BLACKROT*/
.alerte-aucune-protection {
  background: rgb(255, 255, 255);
}
/*ALERTE VERTE PROTECTION TOTALE BLACKROT*/
.alerte-level-1 {
  background: rgb(117, 189, 84);
}
/*ALERTE VERTE PROTECTION DOSAGE FAIBLE BLACKROT*/
.alerte-level-2 {
  background: rgb(166, 227, 120);
}
/*ALERTE JAUNE RISQUE MINIMUM OU PROTECTION MOYENNE BLACKROT*/
.alerte-level-3 {
  background: rgb(226, 240, 123);
}
/*ALERTE JAUNE RISQUE MOYEN OU PROTECTION FREINANT BLACKROT*/
.alerte-level-4 {
  background: rgb(244, 216, 102);
}
/*ALERTE ORANGE RISQUE GRAND OU PROTECTION FREINANT BLACKROT*/
.alerte-level-5 {
  background: rgb(244, 153, 86);
}
/*ALERTE ROUGE RISQUE TOTAL*/
.alerte-level-6 {
  background: rgb(244, 86, 86);
}

/*ALERTE PLUVIO BLANC*/
.alerte-pluvio-1 {
  background: rgb(238, 244, 252);
}
/*ALERTE PLUVIO MINIMUM*/
.alerte-pluvio-2 {
  background: rgb(203, 222, 246);
}
/*ALERTE PLUVIO MOYENNE*/
.alerte-pluvio-3 {
  background: rgb(168, 202, 240);
}
/*ALERTE PLUVIO GRANDE*/
.alerte-pluvio-4 {
  background: rgb(115, 170, 231);
}
/*ALERTE PLUVIO MAXIMALE*/
.alerte-pluvio-5 {
  background: rgb(1, 19, 43);
  color: #ffffff;
}

.grid-row-border-bottom-dashed-decitrait .x-grid-cell {
  border-bottom: 2px dashed rgb(90, 90, 90) !important;
}

.intervention-cell {
  background-color: #ffffff;
  border: 1px solid #fe3a3c;
  color: #000000;
  cursor: cell;
  margin: 1px;
}

.empty-organisme,
.combo-organisme input {
  background-color: #fff !important;
}
.empty-organisme::placeholder,
.combo-organisme input::placeholder {
  color: #fe3a3c !important;
  opacity: 1; /* Firefox */
}

.mask-dispositif .x-mask {
  z-index: 99999 !important;
}
.mask-dispositif .x-mask-msg-text {
  font-size: 18px;
}

.disabled-delete-expfertiorg,
.enabled-delete-expfertiorg {
  mask-image: url(/mvc/ressources/css/images/delete.svg);
  -webkit-mask-image: url(/mvc/ressources/css/images/delete.svg);
  background: #dedede;
  margin-left: 2px;
}
.enabled-delete-expfertiorg {
  background: #fe3a3c;
}

/* CSS Champ de recherche pages personnalisation */
.fieldSearch {
  margin-bottom: 20px !important;
}
.fieldSearch input[type="text"] {
  background: url("../css/images/icon/loupe.png") no-repeat left 0px center;
  background-size: 28px;
  padding-left: 26px;
}

/* CSS GroupComboBox */
.group-header {
  padding: 5px;
  background: #666;
  color: #fff;
  text-transform: uppercase;
  text-align: center;
}
.grouped-list .x-boundlist-item:nth-of-type(even) {
  background-color: #eee;
  border-color: #eee;
}
.grouped-list .x-boundlist-item:nth-of-type(odd) {
  background-color: #fff;
  border-color: #fff;
}
.grouped-list .x-boundlist-item:nth-of-type(even).x-boundlist-item-over,
.grouped-list .x-boundlist-item:nth-of-type(odd).x-boundlist-item-over {
  background-color: #fad6d7;
  border-color: #fad6d7;
}
.grouped-list .x-boundlist-item.nohover:nth-of-type(even).x-boundlist-item.nohover,
.grouped-list .x-boundlist-item.nohover:nth-of-type(odd).x-boundlist-item.nohover {
  background-color: #fff;
  border-color: #fff;
}

.grouped-list .combo-typeevenement {
  margin-top: 15px;
  margin-bottom: 15px;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  color: white;
  display: inline-block;
  text-align: center;
}

.grouped-list .combo-typeevenement-span {
  margin-right: auto;
  margin-left: auto;
  width: 50%;
  padding: 5px;
  border-radius: 5px;
  border-color: #e31520;
  background-color: #d4333b;
  cursor: pointer;
}

.block-btn-add-mainoeuvre,
.block-select-grid-mainoeuvre {
  display: block !important;
}
.block-select-grid-mainoeuvre table {
  width: 800px;
  margin: 10px 15px 5px;
}

.fakeheader-persoform {
  width: 100%;
  background-color: #f5f5f5 !important;
  padding: 10px !important;
  margin-top: 5px;
}
.fakeheader-persoform span.x-btn-inner {
  color: #e31520;
  font-size: 16px;
  font-weight: 300;
  font-family: "Lato", verdana, sans-serif;
  line-height: 16px;
  padding-left: 5px;
  letter-spacing: -0.5px;
  overflow: visible;
}

/* Couleur du placeholder d'un champ en erreur */
.placeholder-field-error::placeholder {
  color: #ffffff !important;
}

.phytoLux iframe {
  width: 100%;
  height: 100%;
  margin-top: -30px;
}

/* Bouton impression de tous les résultats sur les services MesSatimages */
.panelresultat .btnimpressionresultat,
.panelresultat .btnimpressionresultat:hover,
.panelresultat .btnimpressionresultat.x-btn.x-btn-disabled {
  -webkit-mask-image: url(/mvc/ressources/css/images/icon/carto/icon_print.svg);
  background-color: hsl(45, 77%, 50%);
  display: block;
  width: 24px;
  height: 24px;
}
.panelresultat .btnimpressionresultat:hover,
.panelresultat .btnimpressionresultat:active,
.panelresultat .btnimpressionresultat:focus {
  background-color: hsl(45, 77%, 62%);
}
.panelresultat .btnimpressionresultat.x-btn-disabled {
  cursor: default;
}

/*
  Start custom saisie intervention
 */

.saisie-interv-infos-cible-tests-panel {
  margin-top: 5px;
  margin-bottom: 5px;
  color: #df0000;
}

/*
  End custom saisie intervention
 */