.ybx-grid {
  display: flex;
  flex-flow: column nowrap; }

.ybx-form {
  flex: 1 0 auto;
  display: flex;
  flex-flow: column nowrap;
  max-width: 50%;
  margin: 8px; }
  .ybx-form .ybx-input {
    display: flex;
    flex-flow: row wrap;
    align-items: baseline;
    justify-content: flex-end;
    margin: 5px 0; }
    .ybx-form .ybx-input input {
      padding: .5em; }
  .ybx-form .ybx-input__label {
    flex: 1;
    text-align: start; }
  .ybx-form .ybx-input--ip input {
    max-width: 10em; }
  .ybx-form .ybx-msg {
    display: block;
    width: 100%;
    text-align: right;
    font-size: 0.8em; }
  .ybx-form .ybx-msg--error {
    color: #9e2e2e; }
  .ybx-form .ybx-msg--success {
    color: #2e9e4a; }

.yb-btn-refresh {
  background-image: url("../images/ybx-icons/baseline-refresh-24px.svg"); }

.yb-btn-share {
  background-image: url("../images/ybx-icons/baseline-share-24px.svg"); }

.ybx-list {
  text-align: start; }

.ybx-toolbar:not(:first-child) {
  padding-top: 5px;
  border-top: 1px solid #e8e7e7; }

.ybx-toolbar:not(:last-child) {
  border-bottom: 1px solid #e8e7e7;
  padding-bottom: 5px; }

[hidden] {
  display: none; }

hr {
  border: none;
  border-top: 1px solid #e8e7e7;
  margin: 20px 0 10px 0; }

[hidden] {
  display: none !important; }

body {
  font-family: Arial, Helvetica, sans-serif; }

.ybx-version {
  position: fixed;
  bottom: 0;
  right: 0;
  font-size: 0.7em;
  padding: 0 3px;
  margin: 0; }

#header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  background: #fff;
  border-bottom: #555 solid 5px;
  box-shadow: 0 0 20px rgba(94, 93, 93, 0.75), #cbcbcb 0 2px 3px 1px;
  z-index: 500; }

#header header {
  display: flex;
  align-items: center; }

header img {
  height: 20px;
  padding: 10px;
  align-self: center; }

header nav {
  flex: 1;
  display: flex;
  justify-content: flex-end;
  flex-flow: row wrap; }

.ybx-meta {
  columns: 2; }

.ybx-meta span {
  display: inline-flex;
  justify-content: space-between;
  width: 100%; }

.ybx-meta span:hover {
  background: #eee;
  border-radius: 3px; }

.ybx-meta dt {
  font-weight: 700; }

legend {
  color: #646464;
  line-height: 30px;
  height: 30px;
  font-weight: bold;
  padding-left: 20px;
  white-space: nowrap;
  margin-right: 40px;
  text-transform: uppercase; }

fieldset {
  margin: 10px; }

@media screen and (min-width: 1050px) {
  .ybx-btn.ybx-btn span {
    display: inline;
    min-width: 80px; } }

.btn {
  border: 1px solid #cfcfcf;
  background-color: #ebebeb;
  border-radius: 5px 5px;
  white-space: nowrap;
  height: 38px;
  width: 200px;
  color: #646464;
  cursor: pointer; }

.btn.small {
  width: auto;
  height: auto;
  padding: 5px; }

.btn-deco .btn-icon {
  background-image: url("../images/deco.png"); }

.btn-home .btn-icon {
  background-image: url("../images/home.png"); }

.btn-dash .btn-icon {
  background-image: url("../images/dashboard.png"); }

.btn-icon {
  line-height: 35px;
  height: 100%;
  float: left;
  border-right: 1px solid #cfcfcf;
  background: no-repeat center;
  width: 47px;
  position: relative; }

.btn-text {
  height: 100%;
  text-align: center;
  border-left: 1px solid #fff;
  margin-left: 48px;
  position: relative; }

.btn-text span {
  line-height: 35px; }

.btn:hover {
  background-color: #e4e4e4;
  color: #646464; }

.btn:active {
  background-color: #e4e4e4;
  color: #646464;
  box-shadow: #dedede 2px 2px 4px 0, #dedede 0 -1px 0 0, #dedede -1px 0 0 0, #dedede 1px 0 2px 0; }

.disabled {
  color: #999;
  cursor: not-allowed; }

.disabled-btn,
input[type="button"]:disabled,
.ybx-button:disabled,
button:disabled {
  color: #999;
  background-color: #e4e4e4;
  box-shadow: none;
  cursor: not-allowed; }

.btn30,
.btn24,
.btn16,
.btn-day-of-week input[type="button"],
.btn-day-of-month input[type="button"] {
  height: 30px;
  width: 30px;
  vertical-align: middle;
  margin-right: 10px;
  background: #e7e7e7 no-repeat center;
  border: 1px solid #cccccc;
  border-radius: 5px 5px;
  box-shadow: #ffffff 0 1px 0 0 inset; }

.btn30:hover,
.btn24:hover,
.btn16:hover,
.btn-day-of-week input[type="button"]:hover {
  background-color: #e0dfdf; }

.btn16 {
  height: 16px;
  width: 16px; }

.btn30:active,
.btn24:active,
.btn16:active {
  background-color: #d5d5d5;
  box-shadow: none; }

.btn24 {
  height: 24px;
  width: 24px; }

.btn30:disabled {
  color: #999;
  background-color: #e4e4e4;
  box-shadow: none;
  cursor: not-allowed; }

.btn-day-of-month input {
  margin: 5px; }

.btn-day-of-week,
.btn-day-of-month {
  text-align: center; }

.btn-day-of-week input[type="button"]:disabled.sday,
.btn-day-of-month input[type="button"]:disabled.sday {
  background-color: #bcbcbc;
  color: #ffffff; }

.btn-day-of-week input[type="button"].sday,
.btn-day-of-month input[type="button"].sday {
  background-color: #a8a8a8;
  color: #ffffff; }

.btn-day-of-week input[type="button"].sday:hover,
.btn-day-of-month input[type="button"].sday:hover {
  background-color: #bcbcbc;
  color: #ffffff; }

.btn-center {
  background: no-repeat center; }

.btn-log {
  background-image: url("../images/write_log.png"); }

.btn-zoom {
  background-image: url("../images/loupe.png"); }

.btn-refresh {
  background-image: url("../images/btn-refresh.png"); }

.btn-play {
  background-image: url("../images/btn-play.png"); }

.btn-play.on {
  background-image: url("../images/btn-pause.png"); }

.btn-stop {
  background-image: url("../images/btn-stop.png"); }

.btn-reboot {
  background-image: url("../images/btn-reboot.png"); }

.btn-setting {
  background-image: url("../images/btn-setting.png"); }

.btn-screen-expand {
  background-image: url(../images/screen-expand.png); }

.btn-screen-reduce {
  background-image: url(../images/screen-reduce.png); }

.btn-zoom-zoomed {
  position: absolute;
  z-index: 1000;
  right: 5px;
  top: 5px; }

.btn-add {
  background-image: url("../images/btn-add.png"); }

.btn-del {
  background-image: url("../images/btn-del.png"); }

.btn-helptemplate {
  background-image: url("../images/btn-helptemplate.png"); }

.btn-edit {
  background-image: url("../images/btn-edit.png"); }

.btn-check {
  background-image: url("../images/btn-check.png"); }

.btn-joblink {
  background: url("../images/btn-joblinked.png") 0 -2px; }

.btn-joblink:hover {
  background-position: 0 -24px; }

.btn-save {
  background-image: url("../images/btn-save.png"); }

.btn-back {
  background-image: url("../images/btn-back.png"); }

.btn-chevron {
  background: url("../images/btn-chevron.png") 1px -19px; }

.btn-chevron-down {
  background-position: 1px 1px; }

.btn16.btn-add {
  background-image: url("../images/btn-add12.png"); }

.btn16.btn-del {
  background-image: url("../images/btn-del12.png"); }

.btn16.btn-edit {
  background-image: url("../images/btn-edit12.png"); }

.table_title {
  width: 100%;
  padding: 0;
  margin: 0; }

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

.btn_page_restau input {
  width: 400px; }

/*********************** ABOVE this is leacy | below way to go************************************************/
.ybx-btn {
  display: inline-flex;
  background-color: rgba(0, 0, 0, 0);
  border-radius: 5px;
  border: none;
  margin: 5px;
  white-space: nowrap;
  transition: all ease-in-out 0.3s; }

nav .ybx-btn {
  line-height: 35px;
  height: 3em; }

.ybx-btn:focus,
.ybx-btn:hover {
  background-color: #ebebeb;
  background-color: rgba(0, 0, 0, 0.05); }

.ybx-btn.active {
  background-color: #b4b0b0;
  background-color: rgba(0, 0, 0, 0.2); }

a.ybx-btn {
  text-decoration: none; }

.ybx-btn span {
  display: none; }

.ybx-btn--primary {
  background: #2e9e4a; }

.loading,
.loading:disabled {
  background-image: url(../lib/ext-6.2.0/build/classic/theme-gray/resources/images/tree/loading.gif);
  background-repeat: no-repeat;
  cursor: wait; }

button,
input[type="button"] {
  transition: all 1s ease-in-out;
  background-position: right -30px center; }
  button:not(.btn30).loading.loading,
  input[type="button"]:not(.btn30).loading.loading {
    padding-right: 35px;
    background-position: right 10px center; }

.ybx-toolbar .ybx-switch {
  width: auto; }

.ybx-switch {
  display: flex;
  flex-flow: row;
  width: 100%;
  padding: 5px 0;
  align-items: center; }
  .ybx-switch .ybx-switch__label {
    flex: 1;
    padding-right: 5px; }
  .ybx-switch input[type="checkbox"] {
    display: none; }
    .ybx-switch input[type="checkbox"], .ybx-switch input[type="checkbox"]:after, .ybx-switch input[type="checkbox"]:before,
    .ybx-switch input[type="checkbox"] *,
    .ybx-switch input[type="checkbox"] *:after,
    .ybx-switch input[type="checkbox"] *:before,
    .ybx-switch input[type="checkbox"] + .ybx-switch__btn {
      box-sizing: border-box; }
      .ybx-switch input[type="checkbox"]::selection, .ybx-switch input[type="checkbox"]:after::selection, .ybx-switch input[type="checkbox"]:before::selection,
      .ybx-switch input[type="checkbox"] *::selection,
      .ybx-switch input[type="checkbox"] *:after::selection,
      .ybx-switch input[type="checkbox"] *:before::selection,
      .ybx-switch input[type="checkbox"] + .ybx-switch__btn::selection {
        background: none; }
    .ybx-switch input[type="checkbox"] + .ybx-switch__btn {
      outline: 0;
      display: block;
      width: 4em;
      height: 2em;
      position: relative;
      cursor: pointer;
      user-select: none; }
      .ybx-switch input[type="checkbox"] + .ybx-switch__btn:after, .ybx-switch input[type="checkbox"] + .ybx-switch__btn:before {
        position: relative;
        display: block;
        content: "";
        width: 50%;
        height: 100%; }
      .ybx-switch input[type="checkbox"] + .ybx-switch__btn:after {
        left: 0; }
      .ybx-switch input[type="checkbox"] + .ybx-switch__btn:before {
        display: none; }
    .ybx-switch input[type="checkbox"]:checked + .ybx-switch__btn:after {
      left: 50%; }
  .ybx-switch input[type="checkbox"] + .ybx-switch__btn {
    background: #eee;
    border-radius: 2em;
    padding: 2px;
    transition: all 0.4s ease; }
    .ybx-switch input[type="checkbox"] + .ybx-switch__btn:after {
      border-radius: 50%;
      background: #fff;
      transition: all 0.2s ease; }
  .ybx-switch input[type="checkbox"]:checked + .ybx-switch__btn {
    background: currentColor; }

.btn.warning {
  background-color: #cb4d4d;
  border: 1px #4f1717;
  color: #eee;
  float: right;
  transition: all 0.3s ease-in-out; }
  .btn.warning:hover {
    background-color: #9e2e2e;
    border: 1px #140606; }

.btn.primary {
  background-color: #62c07a;
  border: 1px #174f25;
  color: #eee;
  float: right;
  transition: all 0.3s ease-in-out; }
  .btn.primary:hover {
    background-color: #2e9e4a;
    border: 1px #061409;
    color: #eee;
    float: right; }

.btn.primary:disabled,
.btn.warning:disabled,
.btn.primary:hover:disabled,
.btn.warning:hover:disabled,
.btn.primary:focus:disabled,
.btn.warning:focus:disabled {
  color: #998;
  background-color: #e4e4e4;
  box-shadow: none;
  cursor: not-allowed; }

.btn.primary.loading,
.btn.warning.loading,
.btn.primary:hover.loading,
.btn.warning:hover.loading,
.btn.primary:focus.loading,
.btn.warning:focus.loading {
  cursor: wait; }

.ybx-file_picker .ybx-btn {
  background: #2e9e4a;
  border-radius: 5px;
  padding: 5px;
  transition: 0.3s all ease-in-out;
  color: #fff;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.3); }
  .ybx-file_picker .ybx-btn:hover, .ybx-file_picker .ybx-btn:focus {
    background: #174f25; }
  .ybx-file_picker .ybx-btn:disabled {
    color: #998;
    background-color: #e4e4e4;
    box-shadow: none;
    cursor: not-allowed; }

.btn-load {
  background: #d5d5d5 url("../images/wait.gif") no-repeat center !important; }

.gbtn-load {
  background: url("../images/loader.gif") no-repeat 10px !important; }

.wxo-btn-white.btn-load {
  background: #d5d5d5 url("../images/loader.gif") no-repeat 10px !important; }

.x-grid-item-focused .x-grid-cell-inner:before {
  border: 0; }

.x-message-box .ext-mb-download {
  background: url("../images/download.gif") no-repeat scroll 0 0 transparent;
  height: 52px !important; }

.x-tree-icon {
  height: 16px;
  vertical-align: middle; }

.wxo-btn-wrap, .wxo-btn input[type=button], .wxo-btn input[type=submit], .wxo-btn table, .wxo-btn button {
  color: #ffffff;
  -moz-border-radius: 5px 5px;
  -webkit-border-radius: 5px 5px;
  border-radius: 5px 5px;
  padding: 10px 50px 10px 50px;
  background-color: #bcbcbc;
  font-weight: bold;
  border: 1px solid #8b8b8b;
  -moz-box-shadow: #cdcdcd 2px 2px 4px 0 inset, #cdcdcd 0 -1px 0 0 inset, #cdcdcd -1px 0 0 0 inset, #cdcdcd 1px 0 2px 0 inset;
  -webkit-box-shadow: #cdcdcd 2px 2px 4px 0 inset, #cdcdcd 0 -1px 0 0 inset, #cdcdcd -1px 0 0 0 inset, #cdcdcd 1px 0 2px 0 inset;
  -o-box-shadow: #cdcdcd 2px 2px 4px 0 inset, #cdcdcd 0 -1px 0 0 inset, #cdcdcd -1px 0 0 0 inset, #cdcdcd 1px 0 2px 0 inset;
  box-shadow: #cdcdcd 2px 2px 4px 0 inset, #cdcdcd 0 -1px 0 0 inset, #cdcdcd -1px 0 0 0 inset, #cdcdcd 1px 0 2px 0 inset;
  cursor: pointer;
  text-transform: uppercase; }

.wxo-btn-button {
  color: #ffffff;
  font-weight: bold; }

.wxo-btn-white-wrap, .wxo-btn-white input[type=button], .wxo-btn-white input[type=submit], button.wxo-btn-white {
  text-transform: uppercase;
  padding: 10px 50px 10px 50px;
  border: 1px solid #cfcfcf;
  background-color: #EBEBEB;
  color: #646464;
  font-weight: bold;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  -o-box-shadow: none;
  box-shadow: none;
  -moz-border-radius: 5px 5px;
  -webkit-border-radius: 5px 5px;
  border-radius: 5px;
  cursor: pointer; }

.wxo-btn-white-button {
  color: #646464;
  font-weight: bold; }

.wxo-btn-wrap:hover, .wxo-btn input[type=button]:hover, .wxo-btn input[type=submit]:hover, .wxo-btn table:hover, .wxo-btn button:hover {
  color: #FFFFFF;
  background-color: #afafaf; }

.wxo-btn-white-wrap:hover, .wxo-btn-white input[type=button]:hover, .wxo-btn-white input[type=submit]:hover, button.wxo-btn-white:hover, .wxo-btn-white table:hover {
  background-color: #e4e4e4;
  color: #646464; }

.wxo-btn-wrap:active, .wxo-btn input[type=button]:active, .wxo-btn input[type=submit]:active, .wxo-btn table:active, .wxo-btn button:active {
  color: #FFFFFF;
  background-color: #afafaf;
  -moz-box-shadow: #cdcdcd 2px 2px 4px 0, #cdcdcd 0 -1px 0 0, #cdcdcd -1px 0 0 0, #cdcdcd 1px 0 2px 0;
  -webkit-box-shadow: #cdcdcd 2px 2px 4px 0, #cdcdcd 0 -1px 0 0, #cdcdcd -1px 0 0 0, #cdcdcd 1px 0 2px 0;
  -o-box-shadow: #cdcdcd 2px 2px 4px 0, #cdcdcd 0 -1px 0 0, #cdcdcd -1px 0 0 0, #cdcdcd 1px 0 2px 0;
  box-shadow: #cdcdcd 2px 2px 4px 0, #cdcdcd 0 -1px 0 0, #cdcdcd -1px 0 0 0, #cdcdcd 1px 0 2px 0; }

.wxo-btn-white-wrap:active, .wxo-btn-white input[type=button]:active, .wxo-btn-white input[type=submit]:active, button.wxo-btn-white:active, .wxo-btn-white table:active {
  background-color: #e4e4e4;
  color: #646464;
  -moz-box-shadow: #cdcdcd 2px 2px 4px 0, #cdcdcd 0 -1px 0 0, #cdcdcd -1px 0 0 0, #cdcdcd 1px 0 2px 0;
  -webkit-box-shadow: #cdcdcd 2px 2px 4px 0, #cdcdcd 0 -1px 0 0, #cdcdcd -1px 0 0 0, #cdcdcd 1px 0 2px 0;
  -o-box-shadow: #cdcdcd 2px 2px 4px 0, #cdcdcd 0 -1px 0 0, #cdcdcd -1px 0 0 0, #cdcdcd 1px 0 2px 0;
  box-shadow: #cdcdcd 2px 2px 4px 0, #cdcdcd 0 -1px 0 0, #cdcdcd -1px 0 0 0, #cdcdcd 1px 0 2px 0; }

.wxo-btn-form-align {
  text-align: right; }

/* Icon pour le treeview */
.x-tree-icon-leaf {
  width: 16px;
  background-image: url(../lib/ext-6.2.0/build/classic/theme-gray/resources/images/tree/leaf.gif); }

.x-tree-icon-parent {
  width: 16px;
  background-image: url(../lib/ext-6.2.0/build/classic/theme-gray/resources/images/tree/folder.gif); }

.x-tree-icon-parent-expanded {
  background-image: url(../lib/ext-6.2.0/build/classic/theme-gray/resources/images/tree/folder-open.gif); }

.x-tree-checkbox:hover {
  background-position: -13px 0; }

.x-tree-checkbox-checked:hover {
  background-position: -13px -13px; }

.x-form-radio {
  background-image: url(../lib/ext-6.2.0/build/classic/theme-gray/resources/images/form/radio.gif); }

.checkfilt {
  background: url("../images/checkfilt.png") 0 0; }

.checkfilt:hover {
  background: url(../lib/ext-6.2.0/build/classic/theme-gray/resources/images/form/checkbox.gif) -13px 0; }

.halfchecked {
  background: url("../images/halfcheck.png") 0 0; }

.halfchecked:hover {
  background: url("../images/halfcheck.png") 0 -13px; }

.childchecked {
  background: url("../images/childchecked.png") 0 0; }

.childchecked:hover {
  background-position: 0 -13px; }

/* Icon pour le treeview */
/* Window */
.x-window {
  -moz-box-shadow: #ebe7e7 0 1px 0 0 inset, #ebe7e7 0 -1px 0 0 inset, #ebe7e7 -1px 0 0 0 inset, #ebe7e7 1px 0 0 0 inset;
  -webkit-box-shadow: #ebe7e7 0 1px 0 0 inset, #ebe7e7 0 -1px 0 0 inset, #ebe7e7 -1px 0 0 0 inset, #ebe7e7 1px 0 0 0 inset;
  -o-box-shadow: #ebe7e7 0 1px 0 0 inset, #ebe7e7 0 -1px 0 0 inset, #ebe7e7 -1px 0 0 0 inset, #ebe7e7 1px 0 0 0 inset;
  box-shadow: #ebe7e7 0 1px 0 0 inset, #ebe7e7 0 -1px 0 0 inset, #ebe7e7 -1px 0 0 0 inset, #ebe7e7 1px 0 0 0 inset;
  -moz-border-radius: 1px;
  -webkit-border-radius: 1px;
  border-radius: 1px;
  padding: 4px 4px 4px 4px;
  border: 1px solid #a9a9a9;
  background-color: #FFFFFF; }

.x-window-header {
  margin: 20px 20px 10px 20px; }

.x-window-header-top {
  border: none;
  background: none;
  box-shadow: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  -o-box-shadow: none;
  padding: 0; }

.x-window-header {
  -moz-border-radius: 0;
  -webkit-border-radius: 0;
  border-radius: 0;
  border: none;
  margin: 10px; }

.x-window .x-title-item, .x-window .x-title-text {
  background-color: #f5f5f5 !important;
  color: #BEBE00;
  font-weight: bold;
  line-height: 24px;
  padding-left: 20px !important;
  text-transform: uppercase !important; }

.x-window-body, .x-window-body-default, .x-box-layout-ct {
  color: #646464;
  background-color: white !important; }

.x-window-text {
  padding: 10px; }

.x-window .x-btn {
  border: none;
  background: none; }

.x-window .x-btn * {
  outline: none !important; }

.x-window .x-btn-wrap {
  text-transform: uppercase;
  padding: 10px 50px 10px 50px;
  border: 1px solid #cfcfcf;
  background-color: #EBEBEB;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  -o-box-shadow: none;
  box-shadow: none;
  -moz-border-radius: 5px 5px;
  -webkit-border-radius: 5px 5px;
  border-radius: 5px;
  cursor: pointer; }

.x-window .x-btn-inner {
  color: #646464;
  font-weight: bold; }

.x-window .x-btn-wrap:hover {
  background-color: #e4e4e4;
  color: #646464; }

.x-window .x-btn-wrap:active {
  background-color: #e4e4e4;
  color: #646464;
  -moz-box-shadow: #cdcdcd 2px 2px 4px 0, #cdcdcd 0 -1px 0 0, #cdcdcd -1px 0 0 0, #cdcdcd 1px 0 2px 0;
  -webkit-box-shadow: #cdcdcd 2px 2px 4px 0, #cdcdcd 0 -1px 0 0, #cdcdcd -1px 0 0 0, #cdcdcd 1px 0 2px 0;
  -o-box-shadow: #cdcdcd 2px 2px 4px 0, #cdcdcd 0 -1px 0 0, #cdcdcd -1px 0 0 0, #cdcdcd 1px 0 2px 0;
  box-shadow: #cdcdcd 2px 2px 4px 0, #cdcdcd 0 -1px 0 0, #cdcdcd -1px 0 0 0, #cdcdcd 1px 0 2px 0; }

/* Window */
.x-toolbar, .x-title-text, .x-tab-bar-body {
  background: white none !important; }

/* Datepicker */
.x-form-type-text .x-form-trigger, .x-form-trigger-wrap, .x-form-trigger-wrap, .x-tagfield-list {
  position: relative; }

.x-form-trigger.x-form-arrow-trigger, .x-form-trigger.x-form-time-trigger, .x-form-trigger.x-form-trigger-spinner, .x-form-trigger.x-form-date-trigger {
  position: absolute;
  border: none;
  height: 22px;
  right: 3px;
  top: 2px; }

.x-datepicker {
  border: 1px solid #e7e6e6; }

.x-datepicker-header {
  background: white none !important; }

.x-btn-split-right::after {
  background-image: url(../images/arrow_forfait.png) !important;
  background-repeat: no-repeat; }

.x-datepicker-month span {
  color: #646464 !important;
  font-weight: bold !important; }

.x-datepicker-prev, .x-datepicker-next {
  background-color: #ececec;
  border: 1px solid #cccccc;
  -moz-border-radius: 5px 5px;
  -webkit-border-radius: 5px 5px;
  border-radius: 5px 5px;
  -moz-box-shadow: #dedede 2px 2px 4px 0, #dedede 0 -1px 0 0, #dedede -1px 0 0 0, #dedede 1px 0 2px 0;
  -webkit-box-shadow: #dedede 2px 2px 4px 0, #dedede 0 -1px 0 0, #dedede -1px 0 0 0, #dedede 1px 0 2px 0;
  -o-box-shadow: #dedede 2px 2px 4px 0, #dedede 0 -1px 0 0, #dedede -1px 0 0 0, #dedede 1px 0 2px 0;
  box-shadow: #dedede 2px 2px 4px 0, #dedede 0 -1px 0 0, #dedede -1px 0 0 0, #dedede 1px 0 2px 0;
  text-align: center; }

/* Datepicker */
.x-form-field-date .x-form-text-wrap, .x-form-type-text .x-form-text-wrap {
  border: none; }

.x-form-field-date .x-form-date-trigger {
  background: url("../images/calendrier.png") no-repeat center; }

.x-form-field-date .x-form-trigger-click, .x-form-field-date .x-form-trigger-focus {
  background: url("../images/calendrier.png") no-repeat center !important; }

.x-form-field-date {
  margin-right: 5px; }

/* Progress */
.x-progress {
  background: #d9d9d9;
  padding: 0;
  -moz-border-radius: 8px 8px;
  -webkit-border-radius: 8px 8px;
  border-radius: 8px 8px;
  margin: 0;
  -moz-box-shadow: #bcbcbc 2px 2px 4px 0 inset, #bcbcbc 0 -1px 0 0 inset, #bcbcbc -1px 0 0 0 inset, #bcbcbc 1px 0 2px 0 inset;
  -webkit-box-shadow: #bcbcbc 2px 2px 4px 0 inset, #bcbcbc 0 -1px 0 0 inset, #bcbcbc -1px 0 0 0 inset, #bcbcbc 1px 0 2px 0 inset;
  -o-box-shadow: #bcbcbc 2px 2px 4px 0 inset, #bcbcbc 0 -1px 0 0 inset, #bcbcbc -1px 0 0 0 inset, #bcbcbc 1px 0 2px 0 inset;
  box-shadow: #bcbcbc 2px 2px 4px 0 inset, #bcbcbc 0 -1px 0 0 inset, #bcbcbc -1px 0 0 0 inset, #bcbcbc 1px 0 2px 0 inset; }

.x-progress-default .x-progress-bar {
  background: url("../images/progressbar_restau.gif") repeat-x;
  -moz-border-radius: 8px 8px;
  -webkit-border-radius: 8px 8px;
  border-radius: 8px 8px;
  border: 1px solid #888801;
  margin: 0; }

/* Progress */
.x-tagfield {
  color: #646464;
  -moz-box-shadow: #dedede 2px 2px 4px 0 inset, #dedede 0 -1px 0 0 inset, #dedede -1px 0 0 0 inset, #dedede 1px 0 2px 0 inset;
  -webkit-box-shadow: #dedede 2px 2px 4px 0 inset, #dedede 0 -1px 0 0 inset, #dedede -1px 0 0 0 inset, #dedede 1px 0 2px 0 inset;
  -o-box-shadow: #dedede 2px 2px 4px 0 inset, #dedede 0 -1px 0 0 inset, #dedede -1px 0 0 0 inset, #dedede 1px 0 2px 0 inset;
  box-shadow: #dedede 2px 2px 4px 0 inset, #dedede 0 -1px 0 0 inset, #dedede -1px 0 0 0 inset, #dedede 1px 0 2px 0 inset;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  height: 26px;
  border: 1px solid #cccccc;
  min-height: 24px; }

.x-tagfield-list input {
  background: none !important;
  border: none !important;
  -moz-box-shadow: none !important;
  -webkit-box-shadow: none !important;
  -o-box-shadow: none !important;
  box-shadow: none !important;
  -moz-border-radius: 0 !important;
  -webkit-border-radius: 0 !important;
  border-radius: 0 !important; }

.x-placeholder-label {
  margin-left: 5px; }

input[disabled],
textarea[disabled] {
  border: 1px solid #eee;
  box-shadow: none;
  background: #fff; }

textarea {
  box-sizing: border-box;
  resize: vertical;
  min-height: 7em;
  width: 100%;
  padding: 1em;
  border: none; }

.ybx-icn {
  height: 24px;
  width: 24px;
  align-self: center;
  background: no-repeat center; }

.ybx-icn--off {
  background-image: url("../images/ybx-icons/icn-logout.svg"); }

.ybx-icn--settings {
  background-image: url("../images/ybx-icons/icn-admin.svg"); }

.ybx-icn--download {
  background-image: url("../images/ybx-icons/icn-download.svg"); }

.ybx-icn--backup {
  background-image: url("../images/ybx-icons/icn-backup.svg"); }

.ybx-icn--folder-shared {
  background-image: url("../images/ybx-icons/icn-fileserver.svg"); }

.ybx-icn--dashboard {
  background-image: url("../images/ybx-icons/icn-dashboard.svg"); }

.ybx-icn--share {
  background-image: url("../images/ybx-icons/icn-fileserver.svg"); }

.ybx-icn--devices {
  background-image: url("../images/ybx-icons/icn-gesparc.svg"); }

.ybx-icn--userguide {
  background-image: url("../images/ybx-icons/icn-userguide.svg"); }

.ybx-authnav {
  flex: 1;
  display: flex;
  justify-self: safe;
  justify-content: center; }

.icn-box, .x-grid-tree-node-expanded .icn-box {
  background-image: url("../images/box.png"); }

.icn-foldcomp {
  background-image: url("../images/folder_computer.png"); }

.icn-fsn, .x-grid-tree-node-expanded .icn-fsn {
  background: url("../images/icn-fsn.png") no-repeat; }

.icn-esx, .x-grid-tree-node-expanded .icn-esx {
  background: url("../images/icn-esx.png") no-repeat; }

.icn-fsn.win {
  background-image: url("../images/icn-win.png"); }

.icn-fsn.lin {
  background-image: url("../images/icn-lin.png"); }

.icn-fsn.mac {
  background-image: url("../images/icn-mac.png"); }

.icn-fsn.syn {
  background-image: url("../images/icn-syn.png"); }

.icn-fsn.fail, .icn-fsn.disconnected, .icn-esx.fail, .icn-esx.disconnected {
  background-position: 0 -16px; }

.icn-job {
  background-image: url("../images/copy.png"); }

.icn-job.sysimg, .icn-job.esx {
  background-image: url("../images/dd.gif"); }

.dd, .x-grid-tree-node-expanded .dd {
  background-image: url(../images/dd.gif); }

.icn-esx-pool, .x-grid-tree-node-expanded .icn-esx-pool {
  background-image: url(../images/esx-pool.png); }

.icn-esx-vm, .x-grid-tree-node-expanded .icn-esx-vm {
  background-image: url(../images/esx-vm.png); }

.icn-esx-host, .x-grid-tree-node-expanded .icn-esx-host {
  background-image: url(../images/esx-host.png); }

.icn-esx-datastore, .x-grid-tree-node-expanded .icn-esx-datastore {
  background-image: url(../images/esx-datastore.png); }

.btn-admin {
  background-image: url("../images/btn-setup.png"); }

.x-editor input {
  width: 250px !important; }

.icn16 {
  width: 16px;
  height: 16px;
  display: inline-block;
  background-repeat: no-repeat !important;
  vertical-align: middle; }

.icn16.backup {
  margin-right: 3px;
  background-image: url("../images/state_backup.png"); }

.icn16.backup.code0 {
  background-position: 0 0; }

.icn16.backup.code1 {
  background-position: 0 -16px; }

.icn16.backup.code2 {
  background-position: 0 -32px; }

.icn16.backup.code3 {
  background-position: 0 -48px; }

.icn16.backup.code4 {
  background-position: 0 -64px; }

.icn16.cloud {
  margin-right: 3px;
  background-image: url("../images/state_cloud.png"); }

.icn16.cloud.code0 {
  background-position: 0 0; }

.icn16.cloud.code1 {
  background-position: 0 -16px; }

.icn16.cloud.code2 {
  background-position: 0 -32px; }

.icn16.cloud.code3 {
  background-position: 0 -48px; }

.icn16.activity {
  background-image: url("../images/state_activity.png"); }

/*nothing*/
.icn16.activity.code0 {
  background-position: 0 0; }

/*backup*/
.icn16.activity.code1 {
  background-position: 0 -16px; }

/*restore*/
.icn16.activity.code2 {
  background-position: 0 -32px; }

/*externalisation upload*/
.icn16.activity.code3 {
  background-position: 0 -48px; }

/*externalisation download*/
.icn16.activity.code4 {
  background-position: 0 -64px; }

/*delete*/
.icn16.activity.code5 {
  background-position: 0 -80px; }

.ybx-toolbar {
  text-align: start;
  display: flex;
  align-items: center; }
  .ybx-toolbar .wide {
    flex: 1; }
  .ybx-toolbar .btn {
    margin: 0 5px;
    width: auto;
    padding: 0 15px;
    font-weight: 700; }
  .ybx-toolbar .btn:first-child {
    margin-left: 0; }
  .ybx-toolbar .btn:last-child {
    margin-right: 0; }

.ybx-spacer {
  flex: 1; }

.ybx-expand-box {
  display: block;
  overflow: hidden;
  transition: 1s all ease-in-out; }

.ybx-expand-box--show {
  transition: 1s all ease-in-out;
  opacity: 1;
  max-height: 100vh; }

.ybx-expand-box--hidden {
  transition: 1s all ease-in-out;
  opacity: 0;
  max-height: 0; }

/***
*
* allow us to format correctly composed title ( all word capitalised )
*/
[lang="en"] .btn,
[lang="en"] dt:not(.ybx-pkg-name),
[lang="en"] legend,
[lang="en"] .legend,
[lang="en"] .button-bg,
[lang="en"] [role="tab"],
[lang="en"] .tbar,
[lang="en"] .ybx-btn {
  text-transform: capitalize; }

.ybx-infobox h4 {
  margin: 0;
  text-transform: uppercase; }

.ybx-infobox p {
  background: #eee;
  padding: .5em;
  font-size: 2em;
  border-radius: .5em;
  text-align: center;
  margin: 0 auto 10px;
  box-shadow: #dedede 2px 2px 4px 0 inset; }

.ybx-grid {
  display: flex;
  flex-flow: column nowrap; }

.ybx-form {
  flex: 1 0 auto;
  display: flex;
  flex-flow: column nowrap;
  max-width: 50%;
  margin: 8px; }
  .ybx-form .ybx-input {
    display: flex;
    flex-flow: row wrap;
    align-items: baseline;
    justify-content: flex-end;
    margin: 5px 0; }
    .ybx-form .ybx-input input {
      flex: 1 0 200px; }
  .ybx-form .ybx-input__label {
    flex: 1;
    text-align: start; }
  .ybx-form .ybx-input--ip input {
    max-width: 10em; }
  .ybx-form .ybx-msg {
    display: block;
    width: 100%;
    text-align: right;
    font-size: .8em; }
  .ybx-form .ybx-msg--error {
    color: #9e2e2e; }
  .ybx-form .ybx-msg--success {
    color: #2e9e4a; }
  .ybx-form .ybx-expand-box {
    display: block;
    overflow: hidden; }

.ybx-input__group,
.ybx-input--port-binding {
  display: flex;
  justify-content: flex-start;
  align-items: baseline;
  flex-flow: row wrap; }
  .ybx-input__group input,
  .ybx-input--port-binding input {
    width: 5em; }

.ybx-input--port-binding {
  flex: 1 0 auto;
  padding-bottom: 5px; }
  .ybx-input--port-binding span {
    margin: 5px; }

.ybx-b2b__config {
  text-align: start; }

.ybx-toggle {
  text-align: start; }

.ybx-input__label {
  display: flex;
  justify-content: space-between; }

.ybx-hint {
  font-style: italic;
  margin: 0; }

.ybx-slave-url__wrapper {
  display: flex; }

.ybx-slave-url {
  flex: 1 auto 45em; }

.ybx-resolv {
  /*  border: 2px solid currentColor;
    border-radius: 5px; */
  margin: 0 0 0 5px;
  padding: 3px;
  /*   font-weight: 700; */
  white-space: nowrap; }

.ybx-resolv--success {
  color: #2e9e4a;
  /*   background-color: $color-success-bg; */ }

.ybx-resolv--warning {
  color: #cf9717;
  /*  background-color: $color-warning-bg; */ }

.ybx-resolv--error {
  color: #9e2e2e;
  /*  background-color: $color-error-bg; */ }

.ybx-file_picker input[type=text] {
  padding: 5px; }

.ybx-file_picker table {
  width: 100%;
  border-collapse: collapse; }

.ybx-file_picker header {
  padding: 0 5px; }

.ybx-file_picker header,
.ybx-file_picker thead {
  background: #f5f5f5; }

.ybx-file_picker header .meta {
  flex: 1;
  padding: 5px; }

.ybx-file_picker header,
.ybx-file_picker label {
  display: flex;
  align-items: baseline; }

.ybx-file_picker label {
  justify-self: end; }

.ybx-file_picker thead th {
  font-weight: 500;
  font-size: .8em; }

.ybx-file_picker th,
.ybx-file_picker td {
  text-align: start;
  border-bottom: 1px solid #ddd;
  padding: 5px; }

.ybx-file_picker td {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis; }

.ybx-file_picker th.fileName {
  font-weight: 500; }
  .ybx-file_picker th.fileName div {
    display: flex;
    flex-flow: column; }

.ybx-file_picker .is-mounted .ybx-btn--mount {
  background: #cf9717; }
  .ybx-file_picker .is-mounted .ybx-btn--mount:hover, .ybx-file_picker .is-mounted .ybx-btn--mount:focus {
    background: #8a650f; }

.ybx-file_picker button:active {
  background: #2e9e4a;
  color: #fff; }

.ybx-file_picker header {
  display: flex; }

.ybx-file_picker .loading {
  padding: 0 10px;
  background: url(../lib/ext-6.2.0/build/classic/theme-gray/resources/images/tree/loading.gif) no-repeat; }

.ybx-file_picker .version {
  width: 150px; }

.ybx-file_picker .action {
  width: 30%;
  min-width: 300px;
  text-align: end; }

.ybx-file_picker .ybx-tiny-btn {
  background: #eee;
  border: none;
  border-radius: 1em;
  margin: 0 5px;
  line-height: 2;
  width: 2em;
  display: inline-block;
  transition: .3s all ease-in-out; }

.ybx-file_picker .ybx-tiny-btn:active,
.ybx-file_picker .ybx-icn-btn:active,
.ybx-file_picker .ybx-icn-btn:hover,
.ybx-file_picker .ybx-icn-btn:focus,
.ybx-file_picker .ybx-tiny-btn:hover,
.ybx-file_picker .ybx-tiny-btn:focus {
  background: none;
  opacity: 1; }

.ybx-file_picker .ybx-icn-btn {
  background: none;
  border: none;
  vertical-align: middle;
  padding: 0;
  border-radius: 1em;
  opacity: .8;
  transition: .3s all ease-in-out; }
  .ybx-file_picker .ybx-icn-btn img {
    padding: 0;
    width: 20px;
    height: 20px; }

.ybx-modal {
  text-align: start;
  position: absolute;
  right: 0;
  width: 400px;
  background: #fff;
  box-shadow: 0 0 15px #aaa;
  padding: 0 0 15px;
  border-radius: 5px;
  overflow: hidden;
  transition: .3s all ease-in-out; }
  .ybx-modal header {
    padding: 0 15px;
    display: flex;
    align-items: center;
    margin-bottom: 15px; }
    .ybx-modal header h3 {
      flex: 1; }
  .ybx-modal label {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin: 5px 15px; }
    .ybx-modal label span {
      user-select: none;
      flex: 1; }
    .ybx-modal label input {
      max-width: 200px;
      padding: 0 5px; }
    .ybx-modal label button {
      margin: 0 5px; }

.ybx-modal--show {
  transition: .3s all ease-in-out;
  transform: translateY(0);
  opacity: 1; }

.ybx-modal--hidden {
  transition: .3s all ease-in-out;
  transform: translateY(-5em);
  opacity: 0;
  pointer-events: none; }

.ybx-expand-box {
  display: block;
  overflow: hidden; }

#ybx-backup-config {
  padding: 10px;
  width: 100%; }
  #ybx-backup-config h2 {
    text-transform: uppercase; }
  #ybx-backup-config .ybx-code-editor {
    min-height: 10em; }

.ybx-grid {
  display: flex;
  flex-flow: column nowrap; }

.ybx-form {
  flex: 1 0 auto;
  display: flex;
  flex-flow: column nowrap;
  max-width: 50%;
  margin: 8px; }
  .ybx-form .ybx-input {
    display: flex;
    flex-flow: row wrap;
    align-items: baseline;
    justify-content: flex-end;
    margin: 5px 0; }
    .ybx-form .ybx-input input {
      padding: .5em; }
  .ybx-form .ybx-input__label {
    flex: 1;
    text-align: start; }
  .ybx-form .ybx-input--ip input {
    max-width: 10em; }
  .ybx-form .ybx-msg {
    display: block;
    width: 100%;
    text-align: right;
    font-size: 0.8em; }
  .ybx-form .ybx-msg--error {
    color: #9e2e2e; }
  .ybx-form .ybx-msg--success {
    color: #2e9e4a; }

.yb-btn-refresh {
  background-image: url("../images/ybx-icons/baseline-refresh-24px.svg"); }

.yb-btn-share {
  background-image: url("../images/ybx-icons/baseline-share-24px.svg"); }

.ybx-list {
  text-align: start; }

.ybx-toolbar:not(:first-child) {
  padding-top: 5px;
  border-top: 1px solid #e8e7e7; }

.ybx-toolbar:not(:last-child) {
  border-bottom: 1px solid #e8e7e7;
  padding-bottom: 5px; }

[hidden] {
  display: none; }

.ybx-grid {
  display: flex;
  flex-flow: column nowrap; }

.ybx-form {
  flex: 1 0 auto;
  display: flex;
  flex-flow: column nowrap;
  max-width: 50%;
  margin: 8px; }
  .ybx-form .ybx-input {
    display: flex;
    flex-flow: row wrap;
    align-items: baseline;
    justify-content: flex-end;
    margin: 5px 0; }
    .ybx-form .ybx-input input {
      padding: .5em; }
  .ybx-form .ybx-input__label {
    flex: 1;
    text-align: start; }
  .ybx-form .ybx-input--ip input {
    max-width: 10em; }
  .ybx-form .ybx-msg {
    display: block;
    width: 100%;
    text-align: right;
    font-size: 0.8em; }
  .ybx-form .ybx-msg--error {
    color: #9e2e2e; }
  .ybx-form .ybx-msg--success {
    color: #2e9e4a; }

.yb-btn-refresh {
  background-image: url("../images/ybx-icons/baseline-refresh-24px.svg"); }

.yb-btn-share {
  background-image: url("../images/ybx-icons/baseline-share-24px.svg"); }

.ybx-list {
  text-align: start; }

.ybx-toolbar:not(:first-child) {
  padding-top: 5px;
  border-top: 1px solid #e8e7e7; }

.ybx-toolbar:not(:last-child) {
  border-bottom: 1px solid #e8e7e7;
  padding-bottom: 5px; }

[hidden] {
  display: none; }

.yb-vnc__toolbar {
  padding: 10px; }

.yb-vnc__toolbar button[disabled] {
  opacity: 0.2; }

.yb-vnc__thumbwrapper {
  float: left;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #eee;
  width: 508px;
  height: calc(508px * 0.8);
  margin: 10px;
  margin-top: 14px; }

.yb-vnc__thumbwrapper.transitioning {
  background: url("../images/loader.gif") 50% 60% no-repeat #eee; }

.yb-vnc {
  overflow: hidden; }

dt {
  font-weight: 700; }

.yb-vnc__meta input {
  padding-left: 5px; }

.btn.warning,
.vnc_error {
  background-color: #cb4d4d;
  border: 1px #4f1717;
  color: #eee;
  float: right;
  transition: all 0.3s ease-in-out; }

.btn.warning:hover {
  background-color: #9e2e2e;
  border: 1px #140606;
  color: #eee;
  float: right; }

.btn.primary {
  background-color: #62c07a;
  border: 1px #174f25;
  color: #eee;
  float: right;
  transition: all 0.3s ease-in-out; }

.btn.primary:hover {
  background-color: #2e9e4a;
  border: 1px #061409;
  color: #eee;
  float: right; }

.yb-param {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 5px; }

.yb-param--disabled {
  opacity: 0.5; }

.yb-param .checkbox-wrapper {
  max-width: none;
  display: inline; }

.yb-param .ybx-param__input {
  flex: 1 0 100px;
  max-width: 200px;
  display: inline-flex; }

.yb-param .ybx-param__input input {
  flex: 1 0 100px;
  margin: 0 5px;
  padding-left: 5px; }

input[readonly] {
  background-color: #fff;
  border: 0;
  --webkit-box-shadow: none;
  box-shadow: none; }

.yb-action__bar {
  margin-top: 2em;
  display: flex;
  align-items: center;
  justify-content: flex-end; }

.yb-msg {
  border: 1px solid currentColor;
  border-radius: 5px;
  padding: 5px;
  margin: 0 5px 0 0;
  box-shadow: #eee 0 3px 5px; }

.yb-msg--error {
  color: #9e2e2e;
  background-color: rgba(158, 46, 46, 0.1); }

.yb-msg--warning {
  color: #cf9717;
  background-color: rgba(207, 151, 23, 0.1); }

.yb-msg--success {
  color: #2e9e4a;
  background-color: rgba(45, 159, 73, 0.1); }

.yb-1cr__wrapper {
  overflow: hidden;
  padding: 10px; }

.btn {
  text-transform: uppercase; }

.yb-1cr__wrapper .btn {
  width: auto;
  min-width: 200px; }

li[data-activated="true"] {
  color: #2e9e4a;
  background-color: rgba(45, 159, 73, 0.1); }

.yb-ocr-summary {
  padding: 0; }

.yb-ocr-summary li {
  margin: 5px 0;
  max-width: 500px; }

.yb-ocr-summary li h4 {
  font-size: 1.2em;
  padding: 5px;
  margin: 0;
  text-transform: uppercase; }

.yb-ocr-summary li span {
  width: 100%;
  padding: 5px;
  background: #e8e7e7; }

.yb-ocr-state {
  position: absolute;
  right: 0;
  padding: 5px; }

.yb-ocr-summary li > button {
  width: 100%;
  transition: all 0.3s ease-in-out;
  position: relative;
  display: flex;
  align-items: stretch;
  flex-flow: column nowrap;
  padding: 0;
  box-shadow: 0 0 0 currentColor;
  border: 1px solid #e8e7e7;
  color: currentColor;
  background: none;
  text-align: start; }

.yb-ocr-summary li > button:hover,
.yb-ocr-summary li > button:focus {
  z-index: 10;
  box-shadow: 0 0 5px currentColor; }

.yb-1cr__wrapper h2 {
  font-size: 1.5em; }

.yb-btn-play {
  background-image: url("../images/ybx-icons/baseline-play_arrow-24px.svg"); }

.yb-btn-pause {
  background-image: url("../images/ybx-icons/baseline-pause-24px.svg"); }

.yb-btn-stop {
  background-image: url("../images/ybx-icons/baseline-stop-24px.svg"); }

.yb-btn-kill {
  background-image: url("../images/ybx-icons/baseline-power_off-24px.svg"); }