yvan-window/public/static/css/ux/ux-all.css

.syno-ux-grid-mask-info div a,
.x-window .ext-el-mask-msg.syno-ux-mask-info div a,
.x-window .ext-el-mask-msg.syno-ux-grid-mask-info div a,
.x-panel .ext-el-mask-msg.syno-ux-mask-info div a,
.x-panel .ext-el-mask-msg.syno-ux-grid-mask-info div a,
.syno-ux-gridpanel .x-grid-group .x-grid-group-hd div.x-grid-group-title,
.syno-ux-editorgridpanel .x-grid-group .x-grid-group-hd div.x-grid-group-title,
.syno-ux-fieldset .x-fieldset-bottomlegend,
.syno-ux-datefield-menu
  table.x-date-inner
  tbody
  tr
  td.x-date-selected
  .x-date-date
  span,
.syno-ux-datefield-menu
  table.x-date-inner
  tbody
  tr
  td.x-date-selected.x-date-today
  .x-date-date
  span,
.syno-ux-datefield-menu
  table.x-date-inner
  tbody
  tr
  td.x-date-today
  .x-date-date
  span,
.syno-ux-datefield-menu .x-date-mp tr td.x-date-mp-sel a,
.syno-ux-datefield-menu .year-btn-ct .syno-ux-button.x-btn em button,
.syno-ux-datefield-menu .month-btn-ct .syno-ux-button.x-btn em button,
.syno-ux-tab-panel .x-tab-strip-top .x-tab-strip-text,
.syno-ux-tab-panel .x-tab-strip-top li.x-tab-strip-active .x-tab-strip-text,
.syno-ux-expandable-listview .item-summary .item-title,
.syno-ux-treepanel .x-tree-root-ct .x-tree-node a span,
.syno-ux-scheduletable .schedule-table td.schedule-hour-td {
  font-weight: 700;
}
.syno-ux-modulelist .x-tree-node-collapsed a span,
.syno-ux-modulelist .x-tree-node-expanded a span,
.syno-ux-treepanel .x-tree-node .x-tree-selected a span {
  font-weight: 600;
}
.syno-ux-displayfield.x-form-display-field a,
.syno-ux-treepanel .x-tree-root-ct .x-tree-node-ct a span {
  font-weight: 400;
}
.syno-ux-tab-panel .x-tab-strip-top li.x-tab-strip-over .x-tab-strip-text {
  color: #057feb;
}
.syno-ux-gridpanel div,
.syno-ux-editorgridpanel div,
.syno-ux-grid-hd-menu .x-menu-list-item .x-menu-item-text,
.syno-ux-editorgrid-hd-menu .x-menu-list-item .x-menu-item-text,
.syno-ux-groupcheck-menu .x-menu-list-item .x-menu-item-text,
.syno-ux-check-menu .x-menu-list-item .x-menu-item-text,
.syno-ux-searchfield-menu .x-menu-list-item .x-menu-item-text,
.syno-ux-menu .x-menu-list-item .x-menu-item-text,
.syno-ux-schedule-menu .x-menu-list-item .x-menu-item-text,
.syno-ux-button-menu .x-menu-list-item .x-menu-item-text,
.syno-ux-datefield-menu .x-menu-list-item .x-menu-item-text,
.syno-ux-grid-hd-menu
  .x-menu-list-item.syno-menu-check-item.x-menu-item-active
  span,
.syno-ux-editorgrid-hd-menu
  .x-menu-list-item.syno-menu-check-item.x-menu-item-active
  span,
.syno-ux-groupcheck-menu
  .x-menu-list-item.syno-menu-check-item.x-menu-item-active
  span,
.syno-ux-check-menu
  .x-menu-list-item.syno-menu-check-item.x-menu-item-active
  span,
.syno-ux-searchfield-menu
  .x-menu-list-item.syno-menu-check-item.x-menu-item-active
  span,
.syno-ux-menu .x-menu-list-item.syno-menu-check-item.x-menu-item-active span,
.syno-ux-schedule-menu
  .x-menu-list-item.syno-menu-check-item.x-menu-item-active
  span,
.syno-ux-button-menu
  .x-menu-list-item.syno-menu-check-item.x-menu-item-active
  span,
.syno-ux-datefield-menu
  .x-menu-list-item.syno-menu-check-item.x-menu-item-active
  span,
.syno-ux-textfield,
.ext-strict .x-small-editor .syno-ux-textfield.x-form-text,
.syno-ux-numberfield,
.x-form-item .x-form-item-label.syno-ux-item-label,
.syno-ux-triggerfield,
.syno-ux-combobox,
.syno-ux-colorfield,
.syno-ux-schedulefield,
.syno-ux-datefield,
.syno-ux-timefield,
.syno-ux-superboxselect,
.syno-ux-checkbox-label,
.syno-ux-displayfield.x-form-display-field,
.syno-ux-combobox-list .x-combo-list-item,
.syno-ux-button .x-btn-text,
.syno-ux-button-grey.x-btn .x-btn-text,
.syno-ux-button-grey.x-btn-over.x-btn .x-btn-text,
.syno-ux-button-grey:hover.x-btn .x-btn-text,
.syno-ux-button-grey.x-btn-focus.x-btn .x-btn-text,
.syno-ux-button-grey.x-btn-click.x-btn .x-btn-text,
.syno-ux-button-grey:active.x-btn .x-btn-text,
.syno-ux-button-grey.x-item-disabled.x-btn .x-btn-text,
.syno-ux-button.syno-ux-statebuttongroup-right.x-btn button,
.syno-ux-button.syno-ux-statebuttongroup-left.x-btn button,
.syno-ux-button.syno-ux-statebuttongroup-middle.x-btn button,
.syno-ux-modulelist .x-tree-node-leaf a span,
.syno-ux-modulelist .x-tree-node-ct .x-tree-node-leaf.x-tree-selected a span,
.syno-ux-datefield-menu table.x-date-inner tbody tr td span,
.syno-ux-datefield-menu .x-date-bottom .x-btn-noicon .x-btn-small button,
.syno-ux-datefield-menu
  .x-date-bottom
  .x-btn-over.x-btn-noicon
  .x-btn-small
  button,
.syno-ux-datefield-menu
  .x-date-bottom
  .x-btn-click.x-btn-noicon
  .x-btn-small
  button,
.syno-ux-datefield-menu .x-date-mp tr td a,
.syno-ux-datefield-menu .x-date-mp-btns button.x-date-mp-cancel,
.syno-ux-datefield-menu .x-date-mp-btns button.x-date-mp-cancel:hover,
.syno-ux-textarea,
.syno-textfilter .x-form-field-wrap .syno-textfilter-text,
.syno-ux-textfilter .x-form-field-wrap .syno-ux-textfilter-text.x-form-text,
.syno-ux-tab-panel .x-tab-strip-top li .x-tab-strip-text,
.syno-ux-expandable-listview .item-summary .item-title,
.syno-ux-treepanel .x-tree-node a span,
.syno-ux-treepanel .x-tree-node .x-tree-node-over,
.syno-ux-superboxselect-item,
.grid-dd-drag-proxy .x-dd-drag-ghost {
  color: #414b55;
}
.syno-ux-grid-hd-menu .x-menu-list-item.x-item-disabled span,
.syno-ux-editorgrid-hd-menu .x-menu-list-item.x-item-disabled span,
.syno-ux-groupcheck-menu .x-menu-list-item.x-item-disabled span,
.syno-ux-check-menu .x-menu-list-item.x-item-disabled span,
.syno-ux-searchfield-menu .x-menu-list-item.x-item-disabled span,
.syno-ux-menu .x-menu-list-item.x-item-disabled span,
.syno-ux-schedule-menu .x-menu-list-item.x-item-disabled span,
.syno-ux-button-menu .x-menu-list-item.x-item-disabled span,
.syno-ux-datefield-menu .x-menu-list-item.x-item-disabled span,
.syno-ux-cb-disabled.syno-ux-checkbox-label,
.syno-ux-modulelist .x-tree-node-leaf.x-tree-node-disabled a span,
.syno-ux-tab-panel .x-tab-strip-top li.x-item-disabled .x-tab-strip-text,
.syno-ux-treepanel .x-tree-node .x-tree-node-disabled a span {
  color: rgba(65, 75, 85, 0.4) !important;
}
.syno-ux-displayfield.x-form-display-field .syno-ux-note {
  color: #00a6a6;
}
.syno-ux-displayfield.x-form-display-field.x-item-disabled .syno-ux-note {
  color: rgba(0, 166, 166, 0.4);
}
.syno-ux-displayfield.x-form-display-field.x-item-disabled a {
  color: rgba(5, 127, 235, 0.4);
}
.x-statusbar .syno-ux-statusbar-success {
  color: #009e05;
}
.x-statusbar .syno-ux-statusbar-error {
  color: #e64040;
}
.syno-ux-formpanel .x-panel-footer,
.syno-ux-tab-panel .x-tab-panel-footer {
  background-color: transparent;
  border: 0px;
  padding-left: 12px;
  padding-right: 24px;
  border-bottom-width: 0;
  padding: 9px 16px 10px 12px;
  border-top: 1px solid rgba(198, 212, 224, 0.5);
}
.syno-ux-formpanel .x-panel-footer .x-toolbar-ct,
.syno-ux-tab-panel .x-tab-panel-footer .x-toolbar-ct {
  border: 0px;
}
.syno-ux-formpanel .x-panel-footer td.x-toolbar-cell,
.syno-ux-tab-panel .x-tab-panel-footer td.x-toolbar-cell {
  padding: 0 8px 0 0;
}
.syno-ux-formpanel .x-panel-footer td.x-toolbar-cell .syno-ux-button,
.syno-ux-tab-panel .x-tab-panel-footer td.x-toolbar-cell .syno-ux-button {
  margin: 0 0 0 8px;
  margin-right: 0 !important;
  padding-left: 13px;
  padding-right: 13px;
  border-radius: 100px;
  min-width: 52px;
}
.syno-ux-formpanel
  .x-panel-footer
  td.x-toolbar-cell
  .syno-ux-button.syno-ux-button-blue,
.syno-ux-tab-panel
  .x-tab-panel-footer
  td.x-toolbar-cell
  .syno-ux-button.syno-ux-button-blue {
  min-width: 92px;
}
.syno-ux-formpanel
  .x-panel-footer
  td.x-toolbar-cell
  .syno-ux-button.syno-ux-button-red,
.syno-ux-tab-panel
  .x-tab-panel-footer
  td.x-toolbar-cell
  .syno-ux-button.syno-ux-button-red {
  min-width: 92px;
}
@font-face {
  font-family: "Roboto";
  src: url(./fonts/Roboto/Roboto-Light.woff) format("woff");
  font-weight: 300;
}
@font-face {
  font-family: "Roboto";
  src: url(./fonts/Roboto/Roboto.woff) format("woff");
  font-weight: 400;
}
@font-face {
  font-family: "Roboto";
  src: url(./fonts/Roboto/Roboto-Medium.woff) format("woff");
  font-weight: 500;
}
@font-face {
  font-family: "Roboto";
  src: url(./fonts/Roboto/Roboto-Bold.woff) format("woff");
  font-weight: 700;
}
.syno-ux-grid-mask-info,
.x-window .ext-el-mask-msg.syno-ux-mask-info,
.x-window .ext-el-mask-msg.syno-ux-grid-mask-info,
.x-panel .ext-el-mask-msg.syno-ux-mask-info,
.x-panel .ext-el-mask-msg.syno-ux-grid-mask-info {
  margin: 24px;
  padding: 17px 19px;
  max-width: 400px;
  min-height: 20px;
  border: 1px solid rgba(198, 212, 224, 0.7);
  border-radius: 3px;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.16);
  background-position: 20px 10px;
  background-repeat: no-repeat;
  cursor: default;
}
.syno-ux-grid-mask-info div,
.x-window .ext-el-mask-msg.syno-ux-mask-info div,
.x-window .ext-el-mask-msg.syno-ux-grid-mask-info div,
.x-panel .ext-el-mask-msg.syno-ux-mask-info div,
.x-panel .ext-el-mask-msg.syno-ux-grid-mask-info div {
  padding: 0px;
  min-height: 20px;
  display: table-cell;
  vertical-align: middle;
  word-wrap: break-word;
  cursor: default;
  font-size: 13px;
  color: #414b55;
  line-height: 20px;
}
.syno-ux-grid-mask-info div a,
.x-window .ext-el-mask-msg.syno-ux-mask-info div a,
.x-window .ext-el-mask-msg.syno-ux-grid-mask-info div a,
.x-panel .ext-el-mask-msg.syno-ux-mask-info div a,
.x-panel .ext-el-mask-msg.syno-ux-grid-mask-info div a {
  color: #057feb;
}
.syno-ux-gridpanel .x-grid3-row .x-grid3-cell,
.syno-ux-editorgridpanel .x-grid3-row .x-grid3-cell,
.grid-dd-drag-proxy .x-grid3-row .x-grid3-cell {
  height: 28px;
}
.syno-ux-gridpanel .x-grid3-row .x-grid3-cell .x-grid3-cell-inner,
.syno-ux-editorgridpanel .x-grid3-row .x-grid3-cell .x-grid3-cell-inner,
.grid-dd-drag-proxy .x-grid3-row .x-grid3-cell .x-grid3-cell-inner {
  line-height: 28px;
  padding: 0 8px;
}
.syno-ux-gridpanel .x-grid3-row .x-grid3-cell .x-grid3-cell-inner > div,
.syno-ux-editorgridpanel .x-grid3-row .x-grid3-cell .x-grid3-cell-inner > div,
.grid-dd-drag-proxy .x-grid3-row .x-grid3-cell .x-grid3-cell-inner > div {
  text-overflow: ellipsis;
  overflow: hidden;
}
.syno-ux-gridpanel
  .x-grid3-row
  .x-grid3-cell-last-visible.x-grid3-cell
  .x-grid3-cell-inner,
.syno-ux-editorgridpanel
  .x-grid3-row
  .x-grid3-cell-last-visible.x-grid3-cell
  .x-grid3-cell-inner,
.grid-dd-drag-proxy
  .x-grid3-row
  .x-grid3-cell-last-visible.x-grid3-cell
  .x-grid3-cell-inner {
  padding-right: 25px;
}
.syno-ux-gridpanel
  .x-grid3-row
  .x-grid3-cell-last-visible.syno-ux-triggerfield.x-grid3-cell
  .x-grid3-cell-inner,
.syno-ux-editorgridpanel
  .x-grid3-row
  .x-grid3-cell-last-visible.syno-ux-triggerfield.x-grid3-cell
  .x-grid3-cell-inner,
.grid-dd-drag-proxy
  .x-grid3-row
  .x-grid3-cell-last-visible.syno-ux-triggerfield.x-grid3-cell
  .x-grid3-cell-inner,
.syno-ux-gridpanel
  .x-grid3-row
  .x-grid3-cell-last-visible.syno-ux-textfield.x-grid3-cell
  .x-grid3-cell-inner,
.syno-ux-editorgridpanel
  .x-grid3-row
  .x-grid3-cell-last-visible.syno-ux-textfield.x-grid3-cell
  .x-grid3-cell-inner,
.grid-dd-drag-proxy
  .x-grid3-row
  .x-grid3-cell-last-visible.syno-ux-textfield.x-grid3-cell
  .x-grid3-cell-inner {
  margin-right: 26px;
}
.syno-ux-gridpanel .x-grid3-row .syno-ux-triggerfield.x-grid3-cell,
.syno-ux-editorgridpanel .x-grid3-row .syno-ux-triggerfield.x-grid3-cell,
.grid-dd-drag-proxy .x-grid3-row .syno-ux-triggerfield.x-grid3-cell,
.syno-ux-gridpanel .x-grid3-row .syno-ux-textfield.x-grid3-cell,
.syno-ux-editorgridpanel .x-grid3-row .syno-ux-textfield.x-grid3-cell,
.grid-dd-drag-proxy .x-grid3-row .syno-ux-textfield.x-grid3-cell {
  box-shadow: none;
  background-color: transparent;
}
.syno-ux-gridpanel
  .x-grid3-row
  .syno-ux-triggerfield.x-grid3-cell
  .x-grid3-cell-inner,
.syno-ux-editorgridpanel
  .x-grid3-row
  .syno-ux-triggerfield.x-grid3-cell
  .x-grid3-cell-inner,
.grid-dd-drag-proxy
  .x-grid3-row
  .syno-ux-triggerfield.x-grid3-cell
  .x-grid3-cell-inner,
.syno-ux-gridpanel
  .x-grid3-row
  .syno-ux-textfield.x-grid3-cell
  .x-grid3-cell-inner,
.syno-ux-editorgridpanel
  .x-grid3-row
  .syno-ux-textfield.x-grid3-cell
  .x-grid3-cell-inner,
.grid-dd-drag-proxy
  .x-grid3-row
  .syno-ux-textfield.x-grid3-cell
  .x-grid3-cell-inner {
  background-color: #fff;
  background-clip: padding-box;
  border-radius: 4px;
  margin: 1px;
  line-height: 26px;
}
.syno-ux-gridpanel div,
.syno-ux-editorgridpanel div {
  font-size: 13px;
}
.syno-ux-gridpanel .x-panel-body .x-small-editor,
.syno-ux-editorgridpanel .x-panel-body .x-small-editor {
  background-color: #fff;
  border-radius: 4px;
}
.syno-ux-gridpanel .x-panel-ml,
.syno-ux-editorgridpanel .x-panel-ml,
.syno-ux-gridpanel .x-panel-mr,
.syno-ux-editorgridpanel .x-panel-mr {
  background-image: none;
  padding: 0px;
}
.syno-ux-gridpanel .x-panel-mc,
.syno-ux-editorgridpanel .x-panel-mc {
  padding: 0px;
}
.syno-ux-gridpanel .x-panel-tl,
.syno-ux-editorgridpanel .x-panel-tl {
  border: 0px;
}
.syno-ux-gridpanel .x-panel-header,
.syno-ux-editorgridpanel .x-panel-header {
  border-bottom: 0px dashed transparent !important;
  margin-bottom: 0px !important;
}
.syno-ux-gridpanel .x-panel-tbar .x-toolbar-layout-ct,
.syno-ux-editorgridpanel .x-panel-tbar .x-toolbar-layout-ct,
.syno-ux-gridpanel .x-panel-tbar-noheader .x-toolbar-layout-ct,
.syno-ux-editorgridpanel .x-panel-tbar-noheader .x-toolbar-layout-ct,
.syno-ux-gridpanel .x-panel-tbar-noborder .x-toolbar-layout-ct,
.syno-ux-editorgridpanel .x-panel-tbar-noborder .x-toolbar-layout-ct {
  padding: 0px 0px 8px 0px;
  padding-bottom: 8px;
  background-image: none;
  background-color: transparent;
  border: 0px;
}
.x-grid-panel.syno-ux-gridpanel .x-panel-bwrap,
.x-grid-panel.syno-ux-editorgridpanel .x-panel-bwrap {
  padding-bottom: 12px;
}
.x-grid-panel.syno-ux-gridpanel .x-panel-bwrap .x-panel-body,
.x-grid-panel.syno-ux-editorgridpanel .x-panel-bwrap .x-panel-body {
  border: 0px;
}
.x-grid-panel.syno-ux-gridpanel .x-panel-bwrap .x-panel-body .x-grid3-scroller,
.x-grid-panel.syno-ux-editorgridpanel
  .x-panel-bwrap
  .x-panel-body
  .x-grid3-scroller {
  padding-right: 0px;
}
.x-grid-panel.syno-ux-gridpanel .x-panel-bwrap .x-panel-body .x-grid3,
.x-grid-panel.syno-ux-editorgridpanel .x-panel-bwrap .x-panel-body .x-grid3 {
  background-color: transparent;
  border-top: solid 1px rgba(198, 212, 224, 0.7);
}
.syno-ux-gridpanel .x-grid3-header,
.syno-ux-editorgridpanel .x-grid3-header {
  background-image: none;
  background-color: transparent;
  border-bottom: solid 1px rgba(198, 212, 224, 0.4);
  padding-top: 0px;
}
.syno-ux-gridpanel .x-grid3-header .x-grid3-header-offset,
.syno-ux-editorgridpanel .x-grid3-header .x-grid3-header-offset {
  padding-left: 0px;
}
.syno-ux-gridpanel .x-grid3-header .syno-ux-checkbox-icon,
.syno-ux-editorgridpanel .x-grid3-header .syno-ux-checkbox-icon {
  margin-top: 0;
  margin-right: 4px;
  position: relative;
}
.syno-ux-gridpanel .x-grid3-header .syno-ux-checkbox-icon.no-margin,
.syno-ux-editorgridpanel .x-grid3-header .syno-ux-checkbox-icon.no-margin {
  margin-right: 0;
}
.hide-org-hd-menu.syno-ux-gridpanel .x-grid3-header,
.hide-org-hd-menu.syno-ux-editorgridpanel .x-grid3-header {
  position: relative;
}
.hide-org-hd-menu.syno-ux-gridpanel .x-grid3-header .x-grid3-header-bwrap,
.hide-org-hd-menu.syno-ux-editorgridpanel
  .x-grid3-header
  .x-grid3-header-bwrap {
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  width: 16px;
  border-left: solid 1px rgba(198, 212, 224, 0.4);
  background-color: inherit;
  background-color: #fff;
}
.hide-org-hd-menu.syno-ux-gridpanel
  .x-grid3-header
  .x-grid3-header-bwrap
  .syno-ux-grid-hd-btn,
.hide-org-hd-menu.syno-ux-editorgridpanel
  .x-grid3-header
  .x-grid3-header-bwrap
  .syno-ux-grid-hd-btn {
  cursor: pointer;
  display: block;
  width: 12px;
  height: 24px;
  position: absolute;
  top: 50%;
  left: 2px;
  margin-top: -12px;
  background-position: 0 0;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack
    .hide-org-hd-menu.syno-ux-gridpanel
    .x-grid3-header
    .x-grid3-header-bwrap
    .syno-ux-grid-hd-btn,
  .synohdpack
    .hide-org-hd-menu.syno-ux-editorgridpanel
    .x-grid3-header
    .x-grid3-header-bwrap
    .syno-ux-grid-hd-btn {
    background-size: 12px 72px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug
    .hide-org-hd-menu.syno-ux-gridpanel
    .x-grid3-header
    .x-grid3-header-bwrap
    .syno-ux-grid-hd-btn,
  .synohdpackdebug
    .hide-org-hd-menu.syno-ux-editorgridpanel
    .x-grid3-header
    .x-grid3-header-bwrap
    .syno-ux-grid-hd-btn {
    background-size: 12px 72px;
    outline: 1px green dashed;
  }
}
.hide-org-hd-menu.syno-ux-gridpanel
  .x-grid3-header
  .x-grid3-header-bwrap
  .syno-ux-grid-hd-btn:hover,
.hide-org-hd-menu.syno-ux-editorgridpanel
  .x-grid3-header
  .x-grid3-header-bwrap
  .syno-ux-grid-hd-btn:hover {
  background-position: 0 -24px;
}
.hide-org-hd-menu.syno-ux-gridpanel
  .x-grid3-header
  .x-grid3-header-bwrap
  .syno-ux-grid-hd-btn:active,
.hide-org-hd-menu.syno-ux-editorgridpanel
  .x-grid3-header
  .x-grid3-header-bwrap
  .syno-ux-grid-hd-btn:active {
  background-position: 0 -48px;
}
.hide-org-hd-menu.syno-ux-gridpanel
  .x-grid3-header
  .x-grid3-hd-over
  .x-grid3-hd-btn,
.hide-org-hd-menu.syno-ux-editorgridpanel
  .x-grid3-header
  .x-grid3-hd-over
  .x-grid3-hd-btn {
  display: none;
}
.syno-ux-gridpanel .scroll-menu-ct,
.syno-ux-editorgridpanel .scroll-menu-ct {
  position: absolute;
  top: 0;
  right: 0;
  width: 58px;
  height: 26px;
  background-color: #fff;
  border-left: solid 1px rgba(198, 212, 224, 0.4);
}
.syno-ux-gridpanel .scroll-menu-ct .scroll-control-left,
.syno-ux-editorgridpanel .scroll-menu-ct .scroll-control-left,
.syno-ux-gridpanel .scroll-menu-ct .scroll-control-right,
.syno-ux-editorgridpanel .scroll-menu-ct .scroll-control-right {
  cursor: pointer;
  font-size: 0px;
  margin-top: 5px;
  width: 16px;
  height: 16px;
  display: inline-block;
  vertical-align: top;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack .syno-ux-gridpanel .scroll-menu-ct .scroll-control-left,
  .synohdpack .syno-ux-editorgridpanel .scroll-menu-ct .scroll-control-left,
  .synohdpack .syno-ux-gridpanel .scroll-menu-ct .scroll-control-right,
  .synohdpack .syno-ux-editorgridpanel .scroll-menu-ct .scroll-control-right {
    background-size: 16px 32px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug .syno-ux-gridpanel .scroll-menu-ct .scroll-control-left,
  .synohdpackdebug
    .syno-ux-editorgridpanel
    .scroll-menu-ct
    .scroll-control-left,
  .synohdpackdebug .syno-ux-gridpanel .scroll-menu-ct .scroll-control-right,
  .synohdpackdebug
    .syno-ux-editorgridpanel
    .scroll-menu-ct
    .scroll-control-right {
    background-size: 16px 32px;
    outline: 1px green dashed;
  }
}
.syno-ux-gridpanel .scroll-menu-ct .scroll-control-left,
.syno-ux-editorgridpanel .scroll-menu-ct .scroll-control-left {
  margin-left: 10px;
  background-position: 0 0;
}
.syno-ux-gridpanel .scroll-menu-ct .scroll-control-right,
.syno-ux-editorgridpanel .scroll-menu-ct .scroll-control-right {
  margin-right: 10px;
  margin-left: 6px;
  background-position: 0 -16px;
}
.syno-ux-gridpanel .x-grid3-hd,
.syno-ux-editorgridpanel .x-grid3-hd {
  height: 26px;
  border-left: 0px;
  border-right: solid 1px rgba(198, 212, 224, 0.4);
  cursor: pointer;
}
.syno-ux-gridpanel .x-grid3-hd .x-grid3-hd-inner,
.syno-ux-editorgridpanel .x-grid3-hd .x-grid3-hd-inner {
  height: 28px;
  line-height: 28px;
  color: rgba(65, 75, 85, 0.6);
  background-color: transparent;
  padding: 0 8px;
}
.syno-ux-gridpanel .x-grid3-hd .x-grid3-hd-inner:hover,
.syno-ux-editorgridpanel .x-grid3-hd .x-grid3-hd-inner:hover {
  color: #057feb;
}
.syno-ux-gridpanel .x-grid3-hd .x-grid3-hd-inner:hover .x-grid3-sort-icon,
.syno-ux-editorgridpanel
  .x-grid3-hd
  .x-grid3-hd-inner:hover
  .x-grid3-sort-icon {
  display: inline;
  background-position: 0 -60px;
}
.syno-ux-gridpanel .x-grid3-hd .x-grid3-hd-inner:active,
.syno-ux-editorgridpanel .x-grid3-hd .x-grid3-hd-inner:active {
  color: #006dcc;
}
.syno-ux-gridpanel .x-grid3-hd .x-grid3-hd-inner:active .x-grid3-sort-icon,
.syno-ux-editorgridpanel
  .x-grid3-hd
  .x-grid3-hd-inner:active
  .x-grid3-sort-icon {
  display: inline;
  background-position: 0 -100px;
}
.syno-ux-gridpanel
  .x-grid3-hd.sort-desc
  .x-grid3-hd-inner:hover
  .x-grid3-sort-icon,
.syno-ux-editorgridpanel
  .x-grid3-hd.sort-desc
  .x-grid3-hd-inner:hover
  .x-grid3-sort-icon {
  background-position: 0 -40px;
}
.syno-ux-gridpanel
  .x-grid3-hd.sort-desc
  .x-grid3-hd-inner:active
  .x-grid3-sort-icon,
.syno-ux-editorgridpanel
  .x-grid3-hd.sort-desc
  .x-grid3-hd-inner:active
  .x-grid3-sort-icon {
  background-position: 0 -80px;
}
.syno-ux-gridpanel .x-grid3-hd.sort-desc .x-grid3-sort-icon,
.syno-ux-editorgridpanel .x-grid3-hd.sort-desc .x-grid3-sort-icon {
  display: inline;
}
.syno-ux-gridpanel
  .x-grid3-hd.sort-asc
  .x-grid3-hd-inner:hover
  .x-grid3-sort-icon,
.syno-ux-editorgridpanel
  .x-grid3-hd.sort-asc
  .x-grid3-hd-inner:hover
  .x-grid3-sort-icon {
  background-position: 0 -60px;
}
.syno-ux-gridpanel
  .x-grid3-hd.sort-asc
  .x-grid3-hd-inner:active
  .x-grid3-sort-icon,
.syno-ux-editorgridpanel
  .x-grid3-hd.sort-asc
  .x-grid3-hd-inner:active
  .x-grid3-sort-icon {
  background-position: 0 -100px;
}
.syno-ux-gridpanel .x-grid3-hd.sort-asc .x-grid3-sort-icon,
.syno-ux-editorgridpanel .x-grid3-hd.sort-asc .x-grid3-sort-icon {
  display: inline;
}
.syno-ux-gridpanel .x-grid3-hd.x-grid3-cell-disable-sort,
.syno-ux-editorgridpanel .x-grid3-hd.x-grid3-cell-disable-sort {
  cursor: default;
}
.syno-ux-gridpanel
  .x-grid3-hd.x-grid3-cell-disable-sort
  .x-grid3-hd-inner:hover,
.syno-ux-editorgridpanel
  .x-grid3-hd.x-grid3-cell-disable-sort
  .x-grid3-hd-inner:hover {
  color: rgba(65, 75, 85, 0.6);
}
.syno-ux-gridpanel
  .x-grid3-hd.x-grid3-cell-disable-sort
  .x-grid3-hd-inner:active,
.syno-ux-editorgridpanel
  .x-grid3-hd.x-grid3-cell-disable-sort
  .x-grid3-hd-inner:active {
  color: rgba(65, 75, 85, 0.6);
}
.syno-ux-gridpanel
  .x-grid3-hd.x-grid3-cell-disable-sort
  .x-grid3-hd-inner
  .x-grid3-sort-icon,
.syno-ux-editorgridpanel
  .x-grid3-hd.x-grid3-cell-disable-sort
  .x-grid3-hd-inner
  .x-grid3-sort-icon {
  display: none;
}
.syno-ux-gridpanel .x-grid3-hd.x-grid3-cell-last-visible,
.syno-ux-editorgridpanel .x-grid3-hd.x-grid3-cell-last-visible {
  border-right-width: 0px;
}
.syno-ux-gridpanel .x-grid3-hd.x-grid3-cell-last-visible .x-grid3-hd-inner,
.syno-ux-editorgridpanel
  .x-grid3-hd.x-grid3-cell-last-visible
  .x-grid3-hd-inner {
  padding-right: 25px;
}
.syno-ux-gridpanel .x-grid3-hd.x-grid3-hd-over .x-grid3-hd-inner,
.syno-ux-editorgridpanel .x-grid3-hd.x-grid3-hd-over .x-grid3-hd-inner,
.syno-ux-gridpanel .x-grid3-hd.x-grid3-hd-menu-open .x-grid3-hd-inner,
.syno-ux-editorgridpanel .x-grid3-hd.x-grid3-hd-menu-open .x-grid3-hd-inner {
  background-image: none;
  background-color: transparent;
}
.syno-ux-gridpanel
  .x-grid3-hd.x-grid3-hd-over
  .x-grid3-hd-inner
  .x-grid3-hd-btn,
.syno-ux-editorgridpanel
  .x-grid3-hd.x-grid3-hd-over
  .x-grid3-hd-inner
  .x-grid3-hd-btn,
.syno-ux-gridpanel
  .x-grid3-hd.x-grid3-hd-menu-open
  .x-grid3-hd-inner
  .x-grid3-hd-btn,
.syno-ux-editorgridpanel
  .x-grid3-hd.x-grid3-hd-menu-open
  .x-grid3-hd-inner
  .x-grid3-hd-btn {
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: -26px 0px;
  width: 26px;
  height: 26px !important;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack
    .syno-ux-gridpanel
    .x-grid3-hd.x-grid3-hd-over
    .x-grid3-hd-inner
    .x-grid3-hd-btn,
  .synohdpack
    .syno-ux-editorgridpanel
    .x-grid3-hd.x-grid3-hd-over
    .x-grid3-hd-inner
    .x-grid3-hd-btn,
  .synohdpack
    .syno-ux-gridpanel
    .x-grid3-hd.x-grid3-hd-menu-open
    .x-grid3-hd-inner
    .x-grid3-hd-btn,
  .synohdpack
    .syno-ux-editorgridpanel
    .x-grid3-hd.x-grid3-hd-menu-open
    .x-grid3-hd-inner
    .x-grid3-hd-btn {
    background-size: 104px 28px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug
    .syno-ux-gridpanel
    .x-grid3-hd.x-grid3-hd-over
    .x-grid3-hd-inner
    .x-grid3-hd-btn,
  .synohdpackdebug
    .syno-ux-editorgridpanel
    .x-grid3-hd.x-grid3-hd-over
    .x-grid3-hd-inner
    .x-grid3-hd-btn,
  .synohdpackdebug
    .syno-ux-gridpanel
    .x-grid3-hd.x-grid3-hd-menu-open
    .x-grid3-hd-inner
    .x-grid3-hd-btn,
  .synohdpackdebug
    .syno-ux-editorgridpanel
    .x-grid3-hd.x-grid3-hd-menu-open
    .x-grid3-hd-inner
    .x-grid3-hd-btn {
    background-size: 104px 28px;
    outline: 1px green dashed;
  }
}
.syno-ux-gridpanel .x-grid3-hd.sort-desc .x-grid3-hd-inner,
.syno-ux-editorgridpanel .x-grid3-hd.sort-desc .x-grid3-hd-inner,
.syno-ux-gridpanel .x-grid3-hd.sort-asc .x-grid3-hd-inner,
.syno-ux-editorgridpanel .x-grid3-hd.sort-asc .x-grid3-hd-inner {
  background-image: none;
  background-color: transparent;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack
    .syno-ux-gridpanel
    .x-grid3-hd.sort-desc
    .x-grid3-hd-inner
    .x-grid3-sort-icon,
  .synohdpack
    .syno-ux-editorgridpanel
    .x-grid3-hd.sort-desc
    .x-grid3-hd-inner
    .x-grid3-sort-icon,
  .synohdpack
    .syno-ux-gridpanel
    .x-grid3-hd.sort-asc
    .x-grid3-hd-inner
    .x-grid3-sort-icon,
  .synohdpack
    .syno-ux-editorgridpanel
    .x-grid3-hd.sort-asc
    .x-grid3-hd-inner
    .x-grid3-sort-icon {
    background-size: 8px 120px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug
    .syno-ux-gridpanel
    .x-grid3-hd.sort-desc
    .x-grid3-hd-inner
    .x-grid3-sort-icon,
  .synohdpackdebug
    .syno-ux-editorgridpanel
    .x-grid3-hd.sort-desc
    .x-grid3-hd-inner
    .x-grid3-sort-icon,
  .synohdpackdebug
    .syno-ux-gridpanel
    .x-grid3-hd.sort-asc
    .x-grid3-hd-inner
    .x-grid3-sort-icon,
  .synohdpackdebug
    .syno-ux-editorgridpanel
    .x-grid3-hd.sort-asc
    .x-grid3-hd-inner
    .x-grid3-sort-icon {
    background-size: 8px 120px;
    outline: 1px green dashed;
  }
}
.syno-ux-gridpanel .x-grid3-hd.sort-desc .x-grid3-hd-inner .x-grid3-sort-icon,
.syno-ux-editorgridpanel
  .x-grid3-hd.sort-desc
  .x-grid3-hd-inner
  .x-grid3-sort-icon {
  background-position: 0px 0px;
}
.syno-ux-gridpanel .x-grid3-hd.sort-asc .x-grid3-hd-inner .x-grid3-sort-icon,
.syno-ux-editorgridpanel
  .x-grid3-hd.sort-asc
  .x-grid3-hd-inner
  .x-grid3-sort-icon {
  background-position: 0px -20px;
}
.syno-ux-gridpanel .x-grid3-sort-icon,
.syno-ux-editorgridpanel .x-grid3-sort-icon {
  background-color: transparent;
  background-repeat: no-repeat;
  margin-left: 4px;
  margin-top: 4px;
  width: 8px;
  height: 20px;
  vertical-align: top;
  display: none;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack .syno-ux-gridpanel .x-grid3-sort-icon,
  .synohdpack .syno-ux-editorgridpanel .x-grid3-sort-icon {
    background-size: 8px 120px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug .syno-ux-gridpanel .x-grid3-sort-icon,
  .synohdpackdebug .syno-ux-editorgridpanel .x-grid3-sort-icon {
    background-size: 8px 120px;
    outline: 1px green dashed;
  }
}
.syno-ux-gridpanel .x-grid3-grouped-header,
.syno-ux-editorgridpanel .x-grid3-grouped-header {
  height: 20px;
  padding-top: 2px;
}
.syno-ux-gridpanel .x-grid3-grouped-header .syno-ux-checkbox-icon,
.syno-ux-editorgridpanel .x-grid3-grouped-header .syno-ux-checkbox-icon {
  margin-top: 0;
  margin-right: 4px;
}
.syno-ux-gridpanel .x-grid3-grouped-header .syno-ux-checkbox-icon.no-margin,
.syno-ux-editorgridpanel
  .x-grid3-grouped-header
  .syno-ux-checkbox-icon.no-margin {
  margin-right: 0;
}
.syno-ux-gridpanel .x-grid3-grouped-header .x-grid3-hd-inner,
.syno-ux-editorgridpanel .x-grid3-grouped-header .x-grid3-hd-inner {
  height: 20px;
  line-height: 20px;
}
.syno-ux-gridpanel .x-grid3-grouped-header .x-grid3-hd-inner .x-grid3-sort-icon,
.syno-ux-editorgridpanel
  .x-grid3-grouped-header
  .x-grid3-hd-inner
  .x-grid3-sort-icon {
  margin-top: 0;
  vertical-align: middle;
}
.syno-ux-gridpanel .x-grid3-grouped-header.x-grid3-cell-colspan,
.syno-ux-editorgridpanel .x-grid3-grouped-header.x-grid3-cell-colspan {
  text-align: center;
}
.syno-ux-gridpanel .x-grid3-grouped-header.hidden,
.syno-ux-editorgridpanel .x-grid3-grouped-header.hidden {
  display: none;
}
.syno-ux-gridpanel .x-grid3-hd-first-row td,
.syno-ux-editorgridpanel .x-grid3-hd-first-row td {
  padding-top: 2px;
}
.syno-ux-gridpanel .x-grid3-hd-last-row td,
.syno-ux-editorgridpanel .x-grid3-hd-last-row td {
  padding-bottom: 2px;
  border-right-color: transparent;
  position: relative;
}
.syno-ux-gridpanel .x-grid3-hd-last-row td:after,
.syno-ux-editorgridpanel .x-grid3-hd-last-row td:after,
.syno-ux-gridpanel .x-grid3-hd-last-row td::after,
.syno-ux-editorgridpanel .x-grid3-hd-last-row td::after {
  content: "";
  position: absolute;
  top: 4px;
  right: 0;
  height: 16px;
  border-right: 1px solid rgba(198, 212, 224, 0.4);
}
.syno-ux-gridpanel .x-grid3-hd-last-row td.x-gri3-child-last,
.syno-ux-editorgridpanel .x-grid3-hd-last-row td.x-gri3-child-last {
  border-right-color: rgba(198, 212, 224, 0.4);
}
.syno-ux-gridpanel .x-grid3-hd-last-row td.x-gri3-child-last:after,
.syno-ux-editorgridpanel .x-grid3-hd-last-row td.x-gri3-child-last:after,
.syno-ux-gridpanel .x-grid3-hd-last-row td.x-gri3-child-last::after,
.syno-ux-editorgridpanel .x-grid3-hd-last-row td.x-gri3-child-last::after {
  display: none;
}
.syno-ux-gridpanel .x-grid3-row,
.syno-ux-editorgridpanel .x-grid3-row {
  background-color: transparent;
  border-bottom: 1px solid rgba(198, 212, 224, 0.4);
  border-width: 0 0 1px 0;
  padding-top: 0px;
}
.syno-ux-gridpanel .x-grid3-row .x-grid3-cell,
.syno-ux-editorgridpanel .x-grid3-row .x-grid3-cell {
  padding-left: 0px;
  padding-right: 0px;
}
.syno-ux-gridpanel .x-grid3-row .x-grid3-cell.syno-ux-triggerfield,
.syno-ux-editorgridpanel .x-grid3-row .x-grid3-cell.syno-ux-triggerfield {
  padding: 0px 1px;
}
.syno-ux-gridpanel .x-grid3-row .x-grid3-cell.syno-ux-triggerfield:after,
.syno-ux-editorgridpanel .x-grid3-row .x-grid3-cell.syno-ux-triggerfield:after,
.syno-ux-gridpanel .x-grid3-row .x-grid3-cell.syno-ux-triggerfield::after,
.syno-ux-editorgridpanel
  .x-grid3-row
  .x-grid3-cell.syno-ux-triggerfield::after {
  width: 26px;
  height: 26px;
  right: 10px;
  top: 0;
  position: absolute;
  content: "";
  background-position: 0 2px;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack
    .syno-ux-gridpanel
    .x-grid3-row
    .x-grid3-cell.syno-ux-triggerfield:after,
  .synohdpack
    .syno-ux-editorgridpanel
    .x-grid3-row
    .x-grid3-cell.syno-ux-triggerfield:after,
  .synohdpack
    .syno-ux-gridpanel
    .x-grid3-row
    .x-grid3-cell.syno-ux-triggerfield::after,
  .synohdpack
    .syno-ux-editorgridpanel
    .x-grid3-row
    .x-grid3-cell.syno-ux-triggerfield::after {
    background-size: 24px 72px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug
    .syno-ux-gridpanel
    .x-grid3-row
    .x-grid3-cell.syno-ux-triggerfield:after,
  .synohdpackdebug
    .syno-ux-editorgridpanel
    .x-grid3-row
    .x-grid3-cell.syno-ux-triggerfield:after,
  .synohdpackdebug
    .syno-ux-gridpanel
    .x-grid3-row
    .x-grid3-cell.syno-ux-triggerfield::after,
  .synohdpackdebug
    .syno-ux-editorgridpanel
    .x-grid3-row
    .x-grid3-cell.syno-ux-triggerfield::after {
    background-size: 24px 72px;
    outline: 1px green dashed;
  }
}
.syno-ux-gridpanel .x-grid3-row .x-grid3-cell.syno-ux-triggerfield,
.syno-ux-editorgridpanel .x-grid3-row .x-grid3-cell.syno-ux-triggerfield,
.syno-ux-gridpanel .x-grid3-row .x-grid3-cell.syno-ux-textfield,
.syno-ux-editorgridpanel .x-grid3-row .x-grid3-cell.syno-ux-textfield {
  position: relative;
}
.syno-ux-gridpanel
  .x-grid3-row
  .x-grid3-cell.syno-ux-triggerfield:hover::before,
.syno-ux-editorgridpanel
  .x-grid3-row
  .x-grid3-cell.syno-ux-triggerfield:hover::before,
.syno-ux-gridpanel .x-grid3-row .x-grid3-cell.syno-ux-textfield:hover::before,
.syno-ux-editorgridpanel
  .x-grid3-row
  .x-grid3-cell.syno-ux-textfield:hover::before {
  border: 1px solid rgba(124, 138, 152, 0.5);
}
.syno-ux-gridpanel .x-grid3-row .x-grid3-cell.syno-ux-triggerfield::before,
.syno-ux-editorgridpanel
  .x-grid3-row
  .x-grid3-cell.syno-ux-triggerfield::before,
.syno-ux-gridpanel .x-grid3-row .x-grid3-cell.syno-ux-textfield::before,
.syno-ux-editorgridpanel .x-grid3-row .x-grid3-cell.syno-ux-textfield::before {
  border-radius: 4px;
  content: "";
  position: absolute;
  border: 1px solid rgba(198, 212, 224, 0.7);
}
.syno-ux-gridpanel .x-grid3-row .x-grid3-cell.syno-ux-triggerfield::before,
.syno-ux-editorgridpanel
  .x-grid3-row
  .x-grid3-cell.syno-ux-triggerfield::before {
  top: 1px;
  left: 9px;
  right: 9px;
  bottom: 1px;
}
.syno-ux-gridpanel .x-grid3-row .x-grid3-cell.syno-ux-textfield::before,
.syno-ux-editorgridpanel .x-grid3-row .x-grid3-cell.syno-ux-textfield::before {
  top: 1px;
  left: 8px;
  right: 8px;
  bottom: 1px;
}
.syno-ux-gridpanel
  .x-grid3-row
  .x-grid3-cell.x-grid3-cell-last-visible.syno-ux-triggerfield:before,
.syno-ux-editorgridpanel
  .x-grid3-row
  .x-grid3-cell.x-grid3-cell-last-visible.syno-ux-triggerfield:before,
.syno-ux-gridpanel
  .x-grid3-row
  .x-grid3-cell.x-grid3-cell-last-visible.syno-ux-triggerfield::before,
.syno-ux-editorgridpanel
  .x-grid3-row
  .x-grid3-cell.x-grid3-cell-last-visible.syno-ux-triggerfield::before,
.syno-ux-gridpanel
  .x-grid3-row
  .x-grid3-cell.x-grid3-cell-last-visible.syno-ux-textfield:before,
.syno-ux-editorgridpanel
  .x-grid3-row
  .x-grid3-cell.x-grid3-cell-last-visible.syno-ux-textfield:before,
.syno-ux-gridpanel
  .x-grid3-row
  .x-grid3-cell.x-grid3-cell-last-visible.syno-ux-textfield::before,
.syno-ux-editorgridpanel
  .x-grid3-row
  .x-grid3-cell.x-grid3-cell-last-visible.syno-ux-textfield::before {
  right: 26px;
}
.syno-ux-gridpanel
  .x-grid3-row
  .x-grid3-cell.x-grid3-cell-last-visible.syno-ux-triggerfield:before,
.syno-ux-editorgridpanel
  .x-grid3-row
  .x-grid3-cell.x-grid3-cell-last-visible.syno-ux-triggerfield:before,
.syno-ux-gridpanel
  .x-grid3-row
  .x-grid3-cell.x-grid3-cell-last-visible.syno-ux-triggerfield::before,
.syno-ux-editorgridpanel
  .x-grid3-row
  .x-grid3-cell.x-grid3-cell-last-visible.syno-ux-triggerfield::before {
  right: 27px;
}
.syno-ux-gridpanel
  .x-grid3-row
  .x-grid3-cell.x-grid3-cell-last-visible.syno-ux-triggerfield:after,
.syno-ux-editorgridpanel
  .x-grid3-row
  .x-grid3-cell.x-grid3-cell-last-visible.syno-ux-triggerfield:after,
.syno-ux-gridpanel
  .x-grid3-row
  .x-grid3-cell.x-grid3-cell-last-visible.syno-ux-triggerfield::after,
.syno-ux-editorgridpanel
  .x-grid3-row
  .x-grid3-cell.x-grid3-cell-last-visible.syno-ux-triggerfield::after {
  right: 28px;
}
.syno-ux-gridpanel .x-grid3-row.x-grid3-row-over,
.syno-ux-editorgridpanel .x-grid3-row.x-grid3-row-over {
  background-color: rgba(5, 127, 235, 0.04);
  border-width: 0 0 1px 0;
}
.syno-ux-gridpanel
  .x-grid3-row.x-grid3-row-over
  .x-grid3-cell.syno-ux-triggerfield:after,
.syno-ux-editorgridpanel
  .x-grid3-row.x-grid3-row-over
  .x-grid3-cell.syno-ux-triggerfield:after,
.syno-ux-gridpanel
  .x-grid3-row.x-grid3-row-over
  .x-grid3-cell.syno-ux-triggerfield::after,
.syno-ux-editorgridpanel
  .x-grid3-row.x-grid3-row-over
  .x-grid3-cell.syno-ux-triggerfield::after {
  background-position: 0px 2px;
}
.syno-ux-gridpanel .x-grid3-row.x-grid3-row-selected,
.syno-ux-editorgridpanel .x-grid3-row.x-grid3-row-selected {
  background-color: rgba(5, 127, 235, 0.1) !important;
  border-width: 0 0 1px 0;
}
.syno-ux-gridpanel
  .x-grid3-row.x-grid3-row-selected
  .x-grid3-cell.syno-ux-triggerfield:after,
.syno-ux-editorgridpanel
  .x-grid3-row.x-grid3-row-selected
  .x-grid3-cell.syno-ux-triggerfield:after,
.syno-ux-gridpanel
  .x-grid3-row.x-grid3-row-selected
  .x-grid3-cell.syno-ux-triggerfield::after,
.syno-ux-editorgridpanel
  .x-grid3-row.x-grid3-row-selected
  .x-grid3-cell.syno-ux-triggerfield::after {
  background-position: 0px 2px;
}
.syno-ux-gridpanel
  .x-grid-group
  .x-grid-group-body
  .x-grid3-cell-first-visible
  .x-grid3-cell-inner,
.syno-ux-editorgridpanel
  .x-grid-group
  .x-grid-group-body
  .x-grid3-cell-first-visible
  .x-grid3-cell-inner {
  padding-left: 32px;
}
.syno-ux-gridpanel .x-grid-group .x-grid-group-hd,
.syno-ux-editorgridpanel .x-grid-group .x-grid-group-hd {
  background-image: none;
  height: 28px;
  border-bottom: 1px solid rgba(198, 212, 224, 0.4);
  padding-top: 0px;
}
.syno-ux-gridpanel .x-grid-group .x-grid-group-hd div.x-grid-group-title,
.syno-ux-editorgridpanel .x-grid-group .x-grid-group-hd div.x-grid-group-title {
  position: relative;
  padding: 0 0 0 32px;
  font-size: 12px;
  color: rgba(65, 75, 85, 0.5);
  height: 28px;
  line-height: 28px;
}
.syno-ux-gridpanel .x-grid-group .x-grid-group-hd div.x-grid-group-title:before,
.syno-ux-editorgridpanel
  .x-grid-group
  .x-grid-group-hd
  div.x-grid-group-title:before {
  content: "";
  position: absolute;
  left: 4px;
  top: 2px;
  width: 24px;
  height: 24px;
  background-position: -24px 0;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack
    .syno-ux-gridpanel
    .x-grid-group
    .x-grid-group-hd
    div.x-grid-group-title:before,
  .synohdpack
    .syno-ux-editorgridpanel
    .x-grid-group
    .x-grid-group-hd
    div.x-grid-group-title:before {
    background-size: 48px 72px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug
    .syno-ux-gridpanel
    .x-grid-group
    .x-grid-group-hd
    div.x-grid-group-title:before,
  .synohdpackdebug
    .syno-ux-editorgridpanel
    .x-grid-group
    .x-grid-group-hd
    div.x-grid-group-title:before {
    background-size: 48px 72px;
    outline: 1px green dashed;
  }
}
.syno-ux-gridpanel .x-grid-group .x-grid-group-hd div.x-grid-group-title:hover,
.syno-ux-editorgridpanel
  .x-grid-group
  .x-grid-group-hd
  div.x-grid-group-title:hover {
  color: rgba(65, 75, 85, 0.6);
}
.syno-ux-gridpanel
  .x-grid-group
  .x-grid-group-hd
  div.x-grid-group-title:hover:before,
.syno-ux-editorgridpanel
  .x-grid-group
  .x-grid-group-hd
  div.x-grid-group-title:hover:before {
  background-position-y: -24px;
}
.syno-ux-gridpanel .x-grid-group .x-grid-group-hd div.x-grid-group-title:active,
.syno-ux-editorgridpanel
  .x-grid-group
  .x-grid-group-hd
  div.x-grid-group-title:active {
  color: rgba(65, 75, 85, 0.7);
}
.syno-ux-gridpanel
  .x-grid-group
  .x-grid-group-hd
  div.x-grid-group-title:active:before,
.syno-ux-editorgridpanel
  .x-grid-group
  .x-grid-group-hd
  div.x-grid-group-title:active:before {
  background-position-y: -48px;
}
.syno-ux-gridpanel
  .x-grid-group
  .syno-ux-grid-group-hd-over
  div.x-grid-group-title,
.syno-ux-editorgridpanel
  .x-grid-group
  .syno-ux-grid-group-hd-over
  div.x-grid-group-title {
  color: #006dcc;
}
.syno-ux-gridpanel
  .x-grid-group
  .syno-ux-grid-group-hd-over
  div.x-grid-group-title:before,
.syno-ux-editorgridpanel
  .x-grid-group
  .syno-ux-grid-group-hd-over
  div.x-grid-group-title:before {
  background-position-y: -24px;
}
.syno-ux-gridpanel
  .x-grid-group
  .syno-ux-grid-group-hd-click
  div.x-grid-group-title,
.syno-ux-editorgridpanel
  .x-grid-group
  .syno-ux-grid-group-hd-click
  div.x-grid-group-title {
  color: #005cad;
}
.syno-ux-gridpanel
  .x-grid-group
  .syno-ux-grid-group-hd-click
  div.x-grid-group-title:before,
.syno-ux-editorgridpanel
  .x-grid-group
  .syno-ux-grid-group-hd-click
  div.x-grid-group-title:before {
  background-position-y: -48px;
}
.syno-ux-gridpanel
  .x-grid-group.x-grid-group-collapsed
  .x-grid-group-hd
  div.x-grid-group-title:before,
.syno-ux-editorgridpanel
  .x-grid-group.x-grid-group-collapsed
  .x-grid-group-hd
  div.x-grid-group-title:before {
  background-position-x: 0;
}
.syno-ux-gridpanel .x-grid-group .x-grid-group-body.x-grid3-row-over,
.syno-ux-editorgridpanel .x-grid-group .x-grid-group-body.x-grid3-row-over {
  border: none;
}
.syno-ux-gridpanel .syno-ux-gridpanel-empty-hint,
.syno-ux-editorgridpanel .syno-ux-gridpanel-empty-hint {
  color: transparent;
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
}
.ext-ie8 .syno-ux-gridpanel .syno-ux-gridpanel-empty-hint,
.ext-ie8 .syno-ux-editorgridpanel .syno-ux-gridpanel-empty-hint {
  display: none;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack .col-move-top {
    background-size: 9px 9px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug .col-move-top {
    background-size: 9px 9px;
    outline: 1px green dashed;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack .col-move-bottom {
    background-size: 9px 9px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug .col-move-bottom {
    background-size: 9px 9px;
    outline: 1px green dashed;
  }
}
.ext-strict .x-grid3-viewport .x-small-editor .x-form-field-wrap {
  margin-top: 0px;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.16);
}
.ext-strict
  .x-grid3-viewport
  .x-small-editor
  .x-form-field-wrap
  .x-form-text.syno-ux-combobox {
  height: 18px;
  line-height: 18px;
}
.ext-strict
  .x-grid3-viewport
  .x-small-editor
  .x-form-field-wrap
  .x-form-trigger.syno-ux-combobox-trigger {
  height: 24px;
  background-position: 0 0;
}
.ext-strict
  .x-grid3-viewport
  .x-small-editor
  .x-form-field-wrap
  .x-form-trigger.syno-ux-combobox-trigger.x-form-trigger-over,
.ext-strict
  .x-grid3-viewport
  .x-small-editor
  .x-form-field-wrap
  .x-form-trigger.syno-ux-combobox-trigger.x-form-trigger-click {
  background-position: 0px -24px;
}
.syno-ux-grid-hd-menu,
.syno-ux-editorgrid-hd-menu,
.syno-ux-groupcheck-menu,
.syno-ux-check-menu,
.syno-ux-searchfield-menu,
.syno-ux-menu,
.syno-ux-schedule-menu,
.syno-ux-button-menu,
.syno-ux-datefield-menu {
  background-image: none;
}
.x-layer.syno-ux-grid-hd-menu,
.x-layer.syno-ux-editorgrid-hd-menu,
.x-layer.syno-ux-groupcheck-menu,
.x-layer.syno-ux-check-menu,
.x-layer.syno-ux-searchfield-menu,
.x-layer.syno-ux-menu,
.x-layer.syno-ux-schedule-menu,
.x-layer.syno-ux-button-menu,
.x-layer.syno-ux-datefield-menu {
  background: #ffffff;
  border: 1px solid rgba(198, 212, 224, 0.7);
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.16);
  border-radius: 4px;
  padding: 8px;
}
.syno-ux-grid-hd-menu ul,
.syno-ux-editorgrid-hd-menu ul,
.syno-ux-groupcheck-menu ul,
.syno-ux-check-menu ul,
.syno-ux-searchfield-menu ul,
.syno-ux-menu ul,
.syno-ux-schedule-menu ul,
.syno-ux-button-menu ul,
.syno-ux-datefield-menu ul {
  padding: 0px;
}
.syno-ux-grid-hd-menu .x-menu-sep,
.syno-ux-editorgrid-hd-menu .x-menu-sep,
.syno-ux-groupcheck-menu .x-menu-sep,
.syno-ux-check-menu .x-menu-sep,
.syno-ux-searchfield-menu .x-menu-sep,
.syno-ux-menu .x-menu-sep,
.syno-ux-schedule-menu .x-menu-sep,
.syno-ux-button-menu .x-menu-sep,
.syno-ux-datefield-menu .x-menu-sep {
  height: 1px;
  background-color: rgba(198, 212, 224, 0.4);
  margin: 4px 0px;
  border-width: 0px;
}
.syno-ux-grid-hd-menu .x-menu-scroller,
.syno-ux-editorgrid-hd-menu .x-menu-scroller,
.syno-ux-groupcheck-menu .x-menu-scroller,
.syno-ux-check-menu .x-menu-scroller,
.syno-ux-searchfield-menu .x-menu-scroller,
.syno-ux-menu .x-menu-scroller,
.syno-ux-schedule-menu .x-menu-scroller,
.syno-ux-button-menu .x-menu-scroller,
.syno-ux-datefield-menu .x-menu-scroller {
  height: 12px;
  line-height: 12px;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack .syno-ux-grid-hd-menu .x-menu-scroller,
  .synohdpack .syno-ux-editorgrid-hd-menu .x-menu-scroller,
  .synohdpack .syno-ux-groupcheck-menu .x-menu-scroller,
  .synohdpack .syno-ux-check-menu .x-menu-scroller,
  .synohdpack .syno-ux-searchfield-menu .x-menu-scroller,
  .synohdpack .syno-ux-menu .x-menu-scroller,
  .synohdpack .syno-ux-schedule-menu .x-menu-scroller,
  .synohdpack .syno-ux-button-menu .x-menu-scroller,
  .synohdpack .syno-ux-datefield-menu .x-menu-scroller {
    background-size: 12px 24px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug .syno-ux-grid-hd-menu .x-menu-scroller,
  .synohdpackdebug .syno-ux-editorgrid-hd-menu .x-menu-scroller,
  .synohdpackdebug .syno-ux-groupcheck-menu .x-menu-scroller,
  .synohdpackdebug .syno-ux-check-menu .x-menu-scroller,
  .synohdpackdebug .syno-ux-searchfield-menu .x-menu-scroller,
  .synohdpackdebug .syno-ux-menu .x-menu-scroller,
  .synohdpackdebug .syno-ux-schedule-menu .x-menu-scroller,
  .synohdpackdebug .syno-ux-button-menu .x-menu-scroller,
  .synohdpackdebug .syno-ux-datefield-menu .x-menu-scroller {
    background-size: 12px 24px;
    outline: 1px green dashed;
  }
}
.syno-ux-grid-hd-menu .x-menu-scroller.x-menu-scroller-active,
.syno-ux-editorgrid-hd-menu .x-menu-scroller.x-menu-scroller-active,
.syno-ux-groupcheck-menu .x-menu-scroller.x-menu-scroller-active,
.syno-ux-check-menu .x-menu-scroller.x-menu-scroller-active,
.syno-ux-searchfield-menu .x-menu-scroller.x-menu-scroller-active,
.syno-ux-menu .x-menu-scroller.x-menu-scroller-active,
.syno-ux-schedule-menu .x-menu-scroller.x-menu-scroller-active,
.syno-ux-button-menu .x-menu-scroller.x-menu-scroller-active,
.syno-ux-datefield-menu .x-menu-scroller.x-menu-scroller-active {
  border-width: 0;
}
.syno-ux-grid-hd-menu .x-menu-scroller:hover,
.syno-ux-editorgrid-hd-menu .x-menu-scroller:hover,
.syno-ux-groupcheck-menu .x-menu-scroller:hover,
.syno-ux-check-menu .x-menu-scroller:hover,
.syno-ux-searchfield-menu .x-menu-scroller:hover,
.syno-ux-menu .x-menu-scroller:hover,
.syno-ux-schedule-menu .x-menu-scroller:hover,
.syno-ux-button-menu .x-menu-scroller:hover,
.syno-ux-datefield-menu .x-menu-scroller:hover {
  background-color: rgba(198, 212, 224, 0.4);
}
.syno-ux-grid-hd-menu .x-menu-scroller:active,
.syno-ux-editorgrid-hd-menu .x-menu-scroller:active,
.syno-ux-groupcheck-menu .x-menu-scroller:active,
.syno-ux-check-menu .x-menu-scroller:active,
.syno-ux-searchfield-menu .x-menu-scroller:active,
.syno-ux-menu .x-menu-scroller:active,
.syno-ux-schedule-menu .x-menu-scroller:active,
.syno-ux-button-menu .x-menu-scroller:active,
.syno-ux-datefield-menu .x-menu-scroller:active {
  background-color: rgba(198, 212, 224, 0.6);
}
.syno-ux-grid-hd-menu .x-menu-scroller.x-menu-scroller-top,
.syno-ux-editorgrid-hd-menu .x-menu-scroller.x-menu-scroller-top,
.syno-ux-groupcheck-menu .x-menu-scroller.x-menu-scroller-top,
.syno-ux-check-menu .x-menu-scroller.x-menu-scroller-top,
.syno-ux-searchfield-menu .x-menu-scroller.x-menu-scroller-top,
.syno-ux-menu .x-menu-scroller.x-menu-scroller-top,
.syno-ux-schedule-menu .x-menu-scroller.x-menu-scroller-top,
.syno-ux-button-menu .x-menu-scroller.x-menu-scroller-top,
.syno-ux-datefield-menu .x-menu-scroller.x-menu-scroller-top {
  border-radius: 4px 4px 0 0;
  background-position: center 0;
  margin-bottom: 4px;
}
.syno-ux-grid-hd-menu
  .x-menu-scroller.x-menu-scroller-top.x-menu-scroller-active,
.syno-ux-editorgrid-hd-menu
  .x-menu-scroller.x-menu-scroller-top.x-menu-scroller-active,
.syno-ux-groupcheck-menu
  .x-menu-scroller.x-menu-scroller-top.x-menu-scroller-active,
.syno-ux-check-menu .x-menu-scroller.x-menu-scroller-top.x-menu-scroller-active,
.syno-ux-searchfield-menu
  .x-menu-scroller.x-menu-scroller-top.x-menu-scroller-active,
.syno-ux-menu .x-menu-scroller.x-menu-scroller-top.x-menu-scroller-active,
.syno-ux-schedule-menu
  .x-menu-scroller.x-menu-scroller-top.x-menu-scroller-active,
.syno-ux-button-menu
  .x-menu-scroller.x-menu-scroller-top.x-menu-scroller-active,
.syno-ux-datefield-menu
  .x-menu-scroller.x-menu-scroller-top.x-menu-scroller-active {
  background-position: center 0;
}
.syno-ux-grid-hd-menu .x-menu-scroller.x-menu-scroller-bottom,
.syno-ux-editorgrid-hd-menu .x-menu-scroller.x-menu-scroller-bottom,
.syno-ux-groupcheck-menu .x-menu-scroller.x-menu-scroller-bottom,
.syno-ux-check-menu .x-menu-scroller.x-menu-scroller-bottom,
.syno-ux-searchfield-menu .x-menu-scroller.x-menu-scroller-bottom,
.syno-ux-menu .x-menu-scroller.x-menu-scroller-bottom,
.syno-ux-schedule-menu .x-menu-scroller.x-menu-scroller-bottom,
.syno-ux-button-menu .x-menu-scroller.x-menu-scroller-bottom,
.syno-ux-datefield-menu .x-menu-scroller.x-menu-scroller-bottom {
  border-radius: 0 0 4px 4px;
  background-position: center -12px;
  margin-top: 4px;
}
.syno-ux-grid-hd-menu
  .x-menu-scroller.x-menu-scroller-bottom.x-menu-scroller-active,
.syno-ux-editorgrid-hd-menu
  .x-menu-scroller.x-menu-scroller-bottom.x-menu-scroller-active,
.syno-ux-groupcheck-menu
  .x-menu-scroller.x-menu-scroller-bottom.x-menu-scroller-active,
.syno-ux-check-menu
  .x-menu-scroller.x-menu-scroller-bottom.x-menu-scroller-active,
.syno-ux-searchfield-menu
  .x-menu-scroller.x-menu-scroller-bottom.x-menu-scroller-active,
.syno-ux-menu .x-menu-scroller.x-menu-scroller-bottom.x-menu-scroller-active,
.syno-ux-schedule-menu
  .x-menu-scroller.x-menu-scroller-bottom.x-menu-scroller-active,
.syno-ux-button-menu
  .x-menu-scroller.x-menu-scroller-bottom.x-menu-scroller-active,
.syno-ux-datefield-menu
  .x-menu-scroller.x-menu-scroller-bottom.x-menu-scroller-active {
  background-position: center -12px;
}
.syno-ux-grid-hd-menu .x-menu-list-item,
.syno-ux-editorgrid-hd-menu .x-menu-list-item,
.syno-ux-groupcheck-menu .x-menu-list-item,
.syno-ux-check-menu .x-menu-list-item,
.syno-ux-searchfield-menu .x-menu-list-item,
.syno-ux-menu .x-menu-list-item,
.syno-ux-schedule-menu .x-menu-list-item,
.syno-ux-button-menu .x-menu-list-item,
.syno-ux-datefield-menu .x-menu-list-item {
  position: relative;
  background-image: none;
  background-color: #fff;
  border: none;
  border-radius: 3px;
  padding: 0px;
  margin: 0px;
}
.syno-ux-grid-hd-menu .x-menu-list-item .x-menu-item-icon.no-icon,
.syno-ux-editorgrid-hd-menu .x-menu-list-item .x-menu-item-icon.no-icon,
.syno-ux-groupcheck-menu .x-menu-list-item .x-menu-item-icon.no-icon,
.syno-ux-check-menu .x-menu-list-item .x-menu-item-icon.no-icon,
.syno-ux-searchfield-menu .x-menu-list-item .x-menu-item-icon.no-icon,
.syno-ux-menu .x-menu-list-item .x-menu-item-icon.no-icon,
.syno-ux-schedule-menu .x-menu-list-item .x-menu-item-icon.no-icon,
.syno-ux-button-menu .x-menu-list-item .x-menu-item-icon.no-icon,
.syno-ux-datefield-menu .x-menu-list-item .x-menu-item-icon.no-icon {
  width: 0px;
  margin: 0 8px;
}
.syno-ux-grid-hd-menu .x-menu-list-item .x-menu-item-icon,
.syno-ux-editorgrid-hd-menu .x-menu-list-item .x-menu-item-icon,
.syno-ux-groupcheck-menu .x-menu-list-item .x-menu-item-icon,
.syno-ux-check-menu .x-menu-list-item .x-menu-item-icon,
.syno-ux-searchfield-menu .x-menu-list-item .x-menu-item-icon,
.syno-ux-menu .x-menu-list-item .x-menu-item-icon,
.syno-ux-schedule-menu .x-menu-list-item .x-menu-item-icon,
.syno-ux-button-menu .x-menu-list-item .x-menu-item-icon,
.syno-ux-datefield-menu .x-menu-list-item .x-menu-item-icon {
  position: relative;
  display: inline-block;
  margin: 2px 8px;
  left: 0;
  top: 0;
}
.syno-ux-grid-hd-menu .x-menu-list-item .x-menu-item-text,
.syno-ux-editorgrid-hd-menu .x-menu-list-item .x-menu-item-text,
.syno-ux-groupcheck-menu .x-menu-list-item .x-menu-item-text,
.syno-ux-check-menu .x-menu-list-item .x-menu-item-text,
.syno-ux-searchfield-menu .x-menu-list-item .x-menu-item-text,
.syno-ux-menu .x-menu-list-item .x-menu-item-text,
.syno-ux-schedule-menu .x-menu-list-item .x-menu-item-text,
.syno-ux-button-menu .x-menu-list-item .x-menu-item-text,
.syno-ux-datefield-menu .x-menu-list-item .x-menu-item-text {
  display: inline-block;
  padding-left: 0px;
  top: 0px;
}
.syno-ux-grid-hd-menu .x-menu-list-item .x-menu-item,
.syno-ux-editorgrid-hd-menu .x-menu-list-item .x-menu-item,
.syno-ux-groupcheck-menu .x-menu-list-item .x-menu-item,
.syno-ux-check-menu .x-menu-list-item .x-menu-item,
.syno-ux-searchfield-menu .x-menu-list-item .x-menu-item,
.syno-ux-menu .x-menu-list-item .x-menu-item,
.syno-ux-schedule-menu .x-menu-list-item .x-menu-item,
.syno-ux-button-menu .x-menu-list-item .x-menu-item,
.syno-ux-datefield-menu .x-menu-list-item .x-menu-item {
  line-height: 28px;
  height: 28px;
  padding: 0px 20px 0 0;
  border: 0px;
  font-size: 13px;
}
.syno-ux-grid-hd-menu .x-menu-list-item .x-menu-item.x-menu-item-arrow,
.syno-ux-editorgrid-hd-menu .x-menu-list-item .x-menu-item.x-menu-item-arrow,
.syno-ux-groupcheck-menu .x-menu-list-item .x-menu-item.x-menu-item-arrow,
.syno-ux-check-menu .x-menu-list-item .x-menu-item.x-menu-item-arrow,
.syno-ux-searchfield-menu .x-menu-list-item .x-menu-item.x-menu-item-arrow,
.syno-ux-menu .x-menu-list-item .x-menu-item.x-menu-item-arrow,
.syno-ux-schedule-menu .x-menu-list-item .x-menu-item.x-menu-item-arrow,
.syno-ux-button-menu .x-menu-list-item .x-menu-item.x-menu-item-arrow,
.syno-ux-datefield-menu .x-menu-list-item .x-menu-item.x-menu-item-arrow {
  background-position: right 6px top 2px;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack
    .syno-ux-grid-hd-menu
    .x-menu-list-item
    .x-menu-item.x-menu-item-arrow,
  .synohdpack
    .syno-ux-editorgrid-hd-menu
    .x-menu-list-item
    .x-menu-item.x-menu-item-arrow,
  .synohdpack
    .syno-ux-groupcheck-menu
    .x-menu-list-item
    .x-menu-item.x-menu-item-arrow,
  .synohdpack
    .syno-ux-check-menu
    .x-menu-list-item
    .x-menu-item.x-menu-item-arrow,
  .synohdpack
    .syno-ux-searchfield-menu
    .x-menu-list-item
    .x-menu-item.x-menu-item-arrow,
  .synohdpack .syno-ux-menu .x-menu-list-item .x-menu-item.x-menu-item-arrow,
  .synohdpack
    .syno-ux-schedule-menu
    .x-menu-list-item
    .x-menu-item.x-menu-item-arrow,
  .synohdpack
    .syno-ux-button-menu
    .x-menu-list-item
    .x-menu-item.x-menu-item-arrow,
  .synohdpack
    .syno-ux-datefield-menu
    .x-menu-list-item
    .x-menu-item.x-menu-item-arrow {
    background-size: 12px 72px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug
    .syno-ux-grid-hd-menu
    .x-menu-list-item
    .x-menu-item.x-menu-item-arrow,
  .synohdpackdebug
    .syno-ux-editorgrid-hd-menu
    .x-menu-list-item
    .x-menu-item.x-menu-item-arrow,
  .synohdpackdebug
    .syno-ux-groupcheck-menu
    .x-menu-list-item
    .x-menu-item.x-menu-item-arrow,
  .synohdpackdebug
    .syno-ux-check-menu
    .x-menu-list-item
    .x-menu-item.x-menu-item-arrow,
  .synohdpackdebug
    .syno-ux-searchfield-menu
    .x-menu-list-item
    .x-menu-item.x-menu-item-arrow,
  .synohdpackdebug
    .syno-ux-menu
    .x-menu-list-item
    .x-menu-item.x-menu-item-arrow,
  .synohdpackdebug
    .syno-ux-schedule-menu
    .x-menu-list-item
    .x-menu-item.x-menu-item-arrow,
  .synohdpackdebug
    .syno-ux-button-menu
    .x-menu-list-item
    .x-menu-item.x-menu-item-arrow,
  .synohdpackdebug
    .syno-ux-datefield-menu
    .x-menu-list-item
    .x-menu-item.x-menu-item-arrow {
    background-size: 12px 72px;
    outline: 1px green dashed;
  }
}
.syno-ux-grid-hd-menu .x-menu-list-item.x-menu-item-active,
.syno-ux-editorgrid-hd-menu .x-menu-list-item.x-menu-item-active,
.syno-ux-groupcheck-menu .x-menu-list-item.x-menu-item-active,
.syno-ux-check-menu .x-menu-list-item.x-menu-item-active,
.syno-ux-searchfield-menu .x-menu-list-item.x-menu-item-active,
.syno-ux-menu .x-menu-list-item.x-menu-item-active,
.syno-ux-schedule-menu .x-menu-list-item.x-menu-item-active,
.syno-ux-button-menu .x-menu-list-item.x-menu-item-active,
.syno-ux-datefield-menu .x-menu-list-item.x-menu-item-active {
  background-color: rgba(5, 127, 235, 0.1);
}
.syno-ux-grid-hd-menu
  .x-menu-list-item.x-menu-item-active
  .x-menu-item.x-menu-item-arrow,
.syno-ux-editorgrid-hd-menu
  .x-menu-list-item.x-menu-item-active
  .x-menu-item.x-menu-item-arrow,
.syno-ux-groupcheck-menu
  .x-menu-list-item.x-menu-item-active
  .x-menu-item.x-menu-item-arrow,
.syno-ux-check-menu
  .x-menu-list-item.x-menu-item-active
  .x-menu-item.x-menu-item-arrow,
.syno-ux-searchfield-menu
  .x-menu-list-item.x-menu-item-active
  .x-menu-item.x-menu-item-arrow,
.syno-ux-menu
  .x-menu-list-item.x-menu-item-active
  .x-menu-item.x-menu-item-arrow,
.syno-ux-schedule-menu
  .x-menu-list-item.x-menu-item-active
  .x-menu-item.x-menu-item-arrow,
.syno-ux-button-menu
  .x-menu-list-item.x-menu-item-active
  .x-menu-item.x-menu-item-arrow,
.syno-ux-datefield-menu
  .x-menu-list-item.x-menu-item-active
  .x-menu-item.x-menu-item-arrow {
  background-position: right 6px top 2px;
}
.syno-ux-grid-hd-menu
  .x-menu-list-item.x-item-disabled
  .x-menu-check-item
  .x-menu-item-icon,
.syno-ux-editorgrid-hd-menu
  .x-menu-list-item.x-item-disabled
  .x-menu-check-item
  .x-menu-item-icon,
.syno-ux-groupcheck-menu
  .x-menu-list-item.x-item-disabled
  .x-menu-check-item
  .x-menu-item-icon,
.syno-ux-check-menu
  .x-menu-list-item.x-item-disabled
  .x-menu-check-item
  .x-menu-item-icon,
.syno-ux-searchfield-menu
  .x-menu-list-item.x-item-disabled
  .x-menu-check-item
  .x-menu-item-icon,
.syno-ux-menu
  .x-menu-list-item.x-item-disabled
  .x-menu-check-item
  .x-menu-item-icon,
.syno-ux-schedule-menu
  .x-menu-list-item.x-item-disabled
  .x-menu-check-item
  .x-menu-item-icon,
.syno-ux-button-menu
  .x-menu-list-item.x-item-disabled
  .x-menu-check-item
  .x-menu-item-icon,
.syno-ux-datefield-menu
  .x-menu-list-item.x-item-disabled
  .x-menu-check-item
  .x-menu-item-icon {
  background-position: 0px -40px;
}
.syno-ux-grid-hd-menu
  .x-menu-list-item.x-item-disabled.x-menu-item-checked
  .x-menu-check-item
  .x-menu-item-icon,
.syno-ux-editorgrid-hd-menu
  .x-menu-list-item.x-item-disabled.x-menu-item-checked
  .x-menu-check-item
  .x-menu-item-icon,
.syno-ux-groupcheck-menu
  .x-menu-list-item.x-item-disabled.x-menu-item-checked
  .x-menu-check-item
  .x-menu-item-icon,
.syno-ux-check-menu
  .x-menu-list-item.x-item-disabled.x-menu-item-checked
  .x-menu-check-item
  .x-menu-item-icon,
.syno-ux-searchfield-menu
  .x-menu-list-item.x-item-disabled.x-menu-item-checked
  .x-menu-check-item
  .x-menu-item-icon,
.syno-ux-menu
  .x-menu-list-item.x-item-disabled.x-menu-item-checked
  .x-menu-check-item
  .x-menu-item-icon,
.syno-ux-schedule-menu
  .x-menu-list-item.x-item-disabled.x-menu-item-checked
  .x-menu-check-item
  .x-menu-item-icon,
.syno-ux-button-menu
  .x-menu-list-item.x-item-disabled.x-menu-item-checked
  .x-menu-check-item
  .x-menu-item-icon,
.syno-ux-datefield-menu
  .x-menu-list-item.x-item-disabled.x-menu-item-checked
  .x-menu-check-item
  .x-menu-item-icon {
  background-position: 0px -100px;
}
.syno-ux-grid-hd-menu
  .x-menu-list-item.x-item-disabled
  .x-menu-item.x-menu-item-arrow,
.syno-ux-editorgrid-hd-menu
  .x-menu-list-item.x-item-disabled
  .x-menu-item.x-menu-item-arrow,
.syno-ux-groupcheck-menu
  .x-menu-list-item.x-item-disabled
  .x-menu-item.x-menu-item-arrow,
.syno-ux-check-menu
  .x-menu-list-item.x-item-disabled
  .x-menu-item.x-menu-item-arrow,
.syno-ux-searchfield-menu
  .x-menu-list-item.x-item-disabled
  .x-menu-item.x-menu-item-arrow,
.syno-ux-menu .x-menu-list-item.x-item-disabled .x-menu-item.x-menu-item-arrow,
.syno-ux-schedule-menu
  .x-menu-list-item.x-item-disabled
  .x-menu-item.x-menu-item-arrow,
.syno-ux-button-menu
  .x-menu-list-item.x-item-disabled
  .x-menu-item.x-menu-item-arrow,
.syno-ux-datefield-menu
  .x-menu-list-item.x-item-disabled
  .x-menu-item.x-menu-item-arrow {
  background-position: right 6px top -46px;
}
.syno-ux-grid-hd-menu
  .x-menu-list-item.x-memu-item-has-no-icon
  .x-menu-item-icon,
.syno-ux-editorgrid-hd-menu
  .x-menu-list-item.x-memu-item-has-no-icon
  .x-menu-item-icon,
.syno-ux-groupcheck-menu
  .x-menu-list-item.x-memu-item-has-no-icon
  .x-menu-item-icon,
.syno-ux-check-menu .x-menu-list-item.x-memu-item-has-no-icon .x-menu-item-icon,
.syno-ux-searchfield-menu
  .x-menu-list-item.x-memu-item-has-no-icon
  .x-menu-item-icon,
.syno-ux-menu .x-menu-list-item.x-memu-item-has-no-icon .x-menu-item-icon,
.syno-ux-schedule-menu
  .x-menu-list-item.x-memu-item-has-no-icon
  .x-menu-item-icon,
.syno-ux-button-menu
  .x-menu-list-item.x-memu-item-has-no-icon
  .x-menu-item-icon,
.syno-ux-datefield-menu
  .x-menu-list-item.x-memu-item-has-no-icon
  .x-menu-item-icon {
  display: none;
}
.syno-ux-grid-hd-menu .x-menu-list-item .x-menu-check-item .x-menu-item-icon,
.syno-ux-editorgrid-hd-menu
  .x-menu-list-item
  .x-menu-check-item
  .x-menu-item-icon,
.syno-ux-groupcheck-menu .x-menu-list-item .x-menu-check-item .x-menu-item-icon,
.syno-ux-check-menu .x-menu-list-item .x-menu-check-item .x-menu-item-icon,
.syno-ux-searchfield-menu
  .x-menu-list-item
  .x-menu-check-item
  .x-menu-item-icon,
.syno-ux-menu .x-menu-list-item .x-menu-check-item .x-menu-item-icon,
.syno-ux-schedule-menu .x-menu-list-item .x-menu-check-item .x-menu-item-icon,
.syno-ux-button-menu .x-menu-list-item .x-menu-check-item .x-menu-item-icon,
.syno-ux-datefield-menu .x-menu-list-item .x-menu-check-item .x-menu-item-icon {
  background-position: 0px 0px;
  top: 4px;
  width: 20px;
  height: 20px;
}
.syno-ux-grid-hd-menu .x-menu-list-item.x-menu-item-checked .x-menu-item-icon,
.syno-ux-editorgrid-hd-menu
  .x-menu-list-item.x-menu-item-checked
  .x-menu-item-icon,
.syno-ux-groupcheck-menu
  .x-menu-list-item.x-menu-item-checked
  .x-menu-item-icon,
.syno-ux-check-menu .x-menu-list-item.x-menu-item-checked .x-menu-item-icon,
.syno-ux-searchfield-menu
  .x-menu-list-item.x-menu-item-checked
  .x-menu-item-icon,
.syno-ux-menu .x-menu-list-item.x-menu-item-checked .x-menu-item-icon,
.syno-ux-schedule-menu .x-menu-list-item.x-menu-item-checked .x-menu-item-icon,
.syno-ux-button-menu .x-menu-list-item.x-menu-item-checked .x-menu-item-icon,
.syno-ux-datefield-menu
  .x-menu-list-item.x-menu-item-checked
  .x-menu-item-icon {
  background-position: 0px -60px;
  top: 4px;
  width: 20px;
  height: 20px;
}
.syno-ux-grid-hd-menu .x-menu-list-item.syno-menu-check-item.x-menu-item-active,
.syno-ux-editorgrid-hd-menu
  .x-menu-list-item.syno-menu-check-item.x-menu-item-active,
.syno-ux-groupcheck-menu
  .x-menu-list-item.syno-menu-check-item.x-menu-item-active,
.syno-ux-check-menu .x-menu-list-item.syno-menu-check-item.x-menu-item-active,
.syno-ux-searchfield-menu
  .x-menu-list-item.syno-menu-check-item.x-menu-item-active,
.syno-ux-menu .x-menu-list-item.syno-menu-check-item.x-menu-item-active,
.syno-ux-schedule-menu
  .x-menu-list-item.syno-menu-check-item.x-menu-item-active,
.syno-ux-button-menu .x-menu-list-item.syno-menu-check-item.x-menu-item-active,
.syno-ux-datefield-menu
  .x-menu-list-item.syno-menu-check-item.x-menu-item-active {
  background-color: rgba(5, 127, 235, 0.1);
}
.syno-ux-groupcheck-menu
  .x-menu-list-item
  .x-menu-check-item
  img.x-menu-item-icon {
  background-position: 0px 0px;
}
.syno-ux-groupcheck-menu
  .x-menu-list-item.x-menu-item-checked
  img.x-menu-item-icon {
  background-position: 0px -60px;
  background-repeat: no-repeat;
  width: 20px;
  height: 20px;
  left: 0px;
  top: 4px;
}
.syno-ux-check-menu
  .x-menu-list-item.x-item-disabled
  .x-menu-check-item
  .x-menu-item-icon,
.syno-ux-searchfield-menu
  .x-menu-list-item.x-item-disabled
  .x-menu-check-item
  .x-menu-item-icon {
  background-position: 0px -24px;
}
.syno-ux-check-menu
  .x-menu-list-item.x-item-disabled.x-menu-item-checked
  .x-menu-check-item
  .x-menu-item-icon,
.syno-ux-searchfield-menu
  .x-menu-list-item.x-item-disabled.x-menu-item-checked
  .x-menu-check-item
  .x-menu-item-icon {
  background-position: 0px 0px;
}
.syno-ux-check-menu .x-menu-list-item .x-menu-item-icon,
.syno-ux-searchfield-menu .x-menu-list-item .x-menu-item-icon {
  margin-right: 6px !important;
  margin-left: 6px !important;
}
.syno-ux-check-menu .x-menu-list-item.x-menu-item-active,
.syno-ux-searchfield-menu .x-menu-list-item.x-menu-item-active {
  background-color: rgba(5, 127, 235, 0.1) !important;
  border-radius: 3px;
}
.syno-ux-check-menu .x-menu-list-item .x-menu-check-item img.x-menu-item-icon,
.syno-ux-searchfield-menu
  .x-menu-list-item
  .x-menu-check-item
  img.x-menu-item-icon {
  background-image: none;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack
    .syno-ux-check-menu
    .x-menu-list-item
    .x-menu-check-item
    img.x-menu-item-icon,
  .synohdpack
    .syno-ux-searchfield-menu
    .x-menu-list-item
    .x-menu-check-item
    img.x-menu-item-icon {
    background-image: none;
  }
}
.syno-ux-check-menu .x-menu-list-item .x-menu-check-item .x-menu-item-icon,
.syno-ux-searchfield-menu
  .x-menu-list-item
  .x-menu-check-item
  .x-menu-item-icon {
  top: 2px;
  width: 24px;
  height: 24px;
}
.syno-ux-check-menu .x-menu-list-item.x-menu-item-checked img.x-menu-item-icon,
.syno-ux-searchfield-menu
  .x-menu-list-item.x-menu-item-checked
  img.x-menu-item-icon {
  background-position: 0px 0px;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack
    .syno-ux-check-menu
    .x-menu-list-item.x-menu-item-checked
    img.x-menu-item-icon,
  .synohdpack
    .syno-ux-searchfield-menu
    .x-menu-list-item.x-menu-item-checked
    img.x-menu-item-icon {
    background-size: 24px 48px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug
    .syno-ux-check-menu
    .x-menu-list-item.x-menu-item-checked
    img.x-menu-item-icon,
  .synohdpackdebug
    .syno-ux-searchfield-menu
    .x-menu-list-item.x-menu-item-checked
    img.x-menu-item-icon {
    background-size: 24px 48px;
    outline: 1px green dashed;
  }
}
.syno-ux-textfield,
.ext-strict .x-small-editor .syno-ux-textfield.x-form-text,
.syno-ux-numberfield {
  font-size: 13px;
  background-color: #fff;
  background-image: none;
  padding-left: 11px;
  padding-right: 11px;
}
.x-form-align-left.syno-ux-textfield,
.ext-strict .x-small-editor .x-form-align-left.syno-ux-textfield.x-form-text,
.x-form-align-left.syno-ux-numberfield {
  text-align: left;
}
.x-form-align-center.syno-ux-textfield,
.ext-strict .x-small-editor .x-form-align-center.syno-ux-textfield.x-form-text,
.x-form-align-center.syno-ux-numberfield {
  text-align: center;
}
.x-form-align-right.syno-ux-textfield,
.ext-strict .x-small-editor .x-form-align-right.syno-ux-textfield.x-form-text,
.x-form-align-right.syno-ux-numberfield {
  text-align: right;
}
.x-form-text.syno-ux-textfield,
.ext-strict .x-small-editor .x-form-text.syno-ux-textfield,
.x-form-text.syno-ux-numberfield {
  border-color: rgba(198, 212, 224, 0.7);
  height: 20px;
  padding-top: 3px;
  padding-bottom: 3px;
  border-radius: 4px;
}
.syno-ux-textfield.syno-ux-textfield-hover,
.syno-ux-textfield.syno-ux-numberfield-hover,
.ext-strict
  .x-small-editor
  .syno-ux-textfield-hover.syno-ux-textfield.x-form-text,
.syno-ux-textfield-hover.syno-ux-numberfield,
.ext-strict
  .x-small-editor
  .syno-ux-textfield.x-form-text.syno-ux-numberfield-hover,
.syno-ux-numberfield.syno-ux-numberfield-hover {
  border-color: rgba(124, 138, 152, 0.5);
}
.x-form-focus.syno-ux-textfield,
.ext-strict .x-small-editor .x-form-focus.syno-ux-textfield.x-form-text,
.x-form-focus.syno-ux-numberfield {
  border-color: #057feb;
}
.x-form-invalid.syno-ux-textfield,
.ext-strict .x-small-editor .x-form-invalid.syno-ux-textfield.x-form-text,
.x-form-invalid.syno-ux-numberfield {
  border-color: #e64040;
  background-color: rgba(230, 64, 64, 0.08);
  background-image: none;
}
.x-item-disabled.x-form-text.syno-ux-textfield,
.ext-strict .x-small-editor .x-item-disabled.x-form-text.syno-ux-textfield,
.x-item-disabled.x-form-text.syno-ux-numberfield {
  color: rgba(65, 75, 85, 0.4);
  border-color: rgba(198, 212, 224, 0.7);
  background-color: rgba(198, 212, 224, 0.2);
}
.ext-strict .x-grid3-viewport .x-small-editor .x-form-text.syno-ux-textfield,
.ext-strict .x-grid3-viewport .x-small-editor .x-form-text.syno-ux-numberfield {
  margin-top: 0px;
  height: 18px !important;
  line-height: 26px !important;
}
.x-form-item .x-form-item-label.syno-ux-item-label {
  font-size: 13px;
  line-height: 20px;
  padding: 4px 0;
  overflow-wrap: break-word;
}
.syno-ux-triggerfield,
.syno-ux-combobox,
.syno-ux-colorfield,
.syno-ux-schedulefield,
.syno-ux-datefield,
.syno-ux-timefield,
.syno-ux-superboxselect {
  font-size: 13px;
  background-color: #fff;
  background-image: none;
  padding: 3px 0 3px 11px;
  border-right: 0px;
  border-radius: 4px;
}
.syno-ux-triggerfield-readonly.syno-ux-triggerfield,
.syno-ux-triggerfield-readonly.syno-ux-combobox,
.syno-ux-triggerfield-readonly.syno-ux-colorfield,
.syno-ux-triggerfield-readonly.syno-ux-schedulefield,
.syno-ux-triggerfield-readonly.syno-ux-datefield,
.syno-ux-triggerfield-readonly.syno-ux-timefield,
.syno-ux-triggerfield-readonly.syno-ux-superboxselect,
.syno-ux-triggerfield-no-trigger.syno-ux-triggerfield,
.syno-ux-triggerfield-no-trigger.syno-ux-combobox,
.syno-ux-triggerfield-no-trigger.syno-ux-colorfield,
.syno-ux-triggerfield-no-trigger.syno-ux-schedulefield,
.syno-ux-triggerfield-no-trigger.syno-ux-datefield,
.syno-ux-triggerfield-no-trigger.syno-ux-timefield,
.syno-ux-triggerfield-no-trigger.syno-ux-superboxselect {
  border-right: 1px solid rgba(198, 212, 224, 0.7);
}
.x-form-text.syno-ux-triggerfield,
.x-form-text.syno-ux-combobox,
.x-form-text.syno-ux-colorfield,
.x-form-text.syno-ux-schedulefield,
.x-form-text.syno-ux-datefield,
.x-form-text.syno-ux-timefield,
.x-form-text.syno-ux-superboxselect {
  vertical-align: top;
  border-color: rgba(198, 212, 224, 0.7);
  height: 20px;
  line-height: 20px;
  border-radius: 4px 0 0 4px;
}
.x-form-text.syno-ux-triggerfield-readonly.syno-ux-triggerfield,
.x-form-text.syno-ux-triggerfield-readonly.syno-ux-combobox,
.x-form-text.syno-ux-triggerfield-readonly.syno-ux-colorfield,
.x-form-text.syno-ux-triggerfield-readonly.syno-ux-schedulefield,
.x-form-text.syno-ux-triggerfield-readonly.syno-ux-datefield,
.x-form-text.syno-ux-triggerfield-readonly.syno-ux-timefield,
.x-form-text.syno-ux-triggerfield-readonly.syno-ux-superboxselect,
.x-form-text.syno-ux-triggerfield-no-trigger.syno-ux-triggerfield,
.x-form-text.syno-ux-triggerfield-no-trigger.syno-ux-combobox,
.x-form-text.syno-ux-triggerfield-no-trigger.syno-ux-colorfield,
.x-form-text.syno-ux-triggerfield-no-trigger.syno-ux-schedulefield,
.x-form-text.syno-ux-triggerfield-no-trigger.syno-ux-datefield,
.x-form-text.syno-ux-triggerfield-no-trigger.syno-ux-timefield,
.x-form-text.syno-ux-triggerfield-no-trigger.syno-ux-superboxselect {
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
}
.syno-ux-triggerfield.syno-ux-triggerfield-hover,
.syno-ux-triggerfield.syno-ux-combobox-hover,
.syno-ux-triggerfield.syno-ux-colorfield-hover,
.syno-ux-triggerfield.syno-ux-schedulefield-hover,
.syno-ux-triggerfield.syno-ux-datefield-hover,
.syno-ux-triggerfield.syno-ux-timefield-hover,
.syno-ux-triggerfield-hover.syno-ux-combobox,
.syno-ux-triggerfield-hover.syno-ux-colorfield,
.syno-ux-triggerfield-hover.syno-ux-schedulefield,
.syno-ux-triggerfield-hover.syno-ux-datefield,
.syno-ux-triggerfield-hover.syno-ux-timefield,
.syno-ux-triggerfield-hover.syno-ux-superboxselect,
.syno-ux-combobox.syno-ux-combobox-hover,
.syno-ux-combobox.syno-ux-colorfield-hover,
.syno-ux-combobox.syno-ux-schedulefield-hover,
.syno-ux-combobox.syno-ux-datefield-hover,
.syno-ux-combobox.syno-ux-timefield-hover,
.syno-ux-combobox-hover.syno-ux-colorfield,
.syno-ux-combobox-hover.syno-ux-schedulefield,
.syno-ux-combobox-hover.syno-ux-datefield,
.syno-ux-combobox-hover.syno-ux-timefield,
.syno-ux-combobox-hover.syno-ux-superboxselect,
.syno-ux-colorfield.syno-ux-colorfield-hover,
.syno-ux-colorfield.syno-ux-schedulefield-hover,
.syno-ux-colorfield.syno-ux-datefield-hover,
.syno-ux-colorfield.syno-ux-timefield-hover,
.syno-ux-colorfield-hover.syno-ux-schedulefield,
.syno-ux-colorfield-hover.syno-ux-datefield,
.syno-ux-colorfield-hover.syno-ux-timefield,
.syno-ux-colorfield-hover.syno-ux-superboxselect,
.syno-ux-schedulefield.syno-ux-schedulefield-hover,
.syno-ux-schedulefield.syno-ux-datefield-hover,
.syno-ux-schedulefield.syno-ux-timefield-hover,
.syno-ux-schedulefield-hover.syno-ux-datefield,
.syno-ux-schedulefield-hover.syno-ux-timefield,
.syno-ux-schedulefield-hover.syno-ux-superboxselect,
.syno-ux-datefield.syno-ux-datefield-hover,
.syno-ux-datefield.syno-ux-timefield-hover,
.syno-ux-datefield-hover.syno-ux-timefield,
.syno-ux-datefield-hover.syno-ux-superboxselect,
.syno-ux-timefield.syno-ux-timefield-hover,
.syno-ux-timefield-hover.syno-ux-superboxselect {
  border-color: rgba(124, 138, 152, 0.5);
}
.x-form-focus.syno-ux-triggerfield,
.x-form-focus.syno-ux-combobox,
.x-form-focus.syno-ux-colorfield,
.x-form-focus.syno-ux-schedulefield,
.x-form-focus.syno-ux-datefield,
.x-form-focus.syno-ux-timefield,
.x-form-focus.syno-ux-superboxselect {
  border-color: #057feb;
}
.x-form-invalid.syno-ux-triggerfield,
.x-form-invalid.syno-ux-combobox,
.x-form-invalid.syno-ux-colorfield,
.x-form-invalid.syno-ux-schedulefield,
.x-form-invalid.syno-ux-datefield,
.x-form-invalid.syno-ux-timefield,
.x-form-invalid.syno-ux-superboxselect {
  border-color: #e64040;
  background-color: rgba(230, 64, 64, 0.08);
  background-image: none;
}
.x-item-disabled .x-form-text.syno-ux-triggerfield,
.x-item-disabled .x-form-text.syno-ux-combobox,
.x-item-disabled .x-form-text.syno-ux-colorfield,
.x-item-disabled .x-form-text.syno-ux-schedulefield,
.x-item-disabled .x-form-text.syno-ux-datefield,
.x-item-disabled .x-form-text.syno-ux-timefield,
.x-item-disabled .x-form-text.syno-ux-superboxselect {
  color: rgba(65, 75, 85, 0.4);
  border-color: rgba(198, 212, 224, 0.7);
  background-color: rgba(198, 212, 224, 0.2);
  background-image: none;
  border-right: 0px;
}
.x-item-disabled
  .x-form-text.syno-ux-triggerfield-readonly.syno-ux-triggerfield,
.x-item-disabled .x-form-text.syno-ux-triggerfield-readonly.syno-ux-combobox,
.x-item-disabled .x-form-text.syno-ux-triggerfield-readonly.syno-ux-colorfield,
.x-item-disabled
  .x-form-text.syno-ux-triggerfield-readonly.syno-ux-schedulefield,
.x-item-disabled .x-form-text.syno-ux-triggerfield-readonly.syno-ux-datefield,
.x-item-disabled .x-form-text.syno-ux-triggerfield-readonly.syno-ux-timefield,
.x-item-disabled
  .x-form-text.syno-ux-triggerfield-readonly.syno-ux-superboxselect,
.x-item-disabled
  .x-form-text.syno-ux-triggerfield-no-trigger.syno-ux-triggerfield,
.x-item-disabled .x-form-text.syno-ux-triggerfield-no-trigger.syno-ux-combobox,
.x-item-disabled
  .x-form-text.syno-ux-triggerfield-no-trigger.syno-ux-colorfield,
.x-item-disabled
  .x-form-text.syno-ux-triggerfield-no-trigger.syno-ux-schedulefield,
.x-item-disabled .x-form-text.syno-ux-triggerfield-no-trigger.syno-ux-datefield,
.x-item-disabled .x-form-text.syno-ux-triggerfield-no-trigger.syno-ux-timefield,
.x-item-disabled
  .x-form-text.syno-ux-triggerfield-no-trigger.syno-ux-superboxselect {
  border-right: 1px solid rgba(198, 212, 224, 0.7);
}
.x-form-field-trigger-wrap .x-form-trigger.syno-ux-triggerfield-trigger,
.x-form-field-trigger-wrap .x-form-trigger.syno-ux-combobox-trigger,
.x-form-field-trigger-wrap .x-form-trigger.syno-ux-colorfield-trigger,
.x-form-field-trigger-wrap .x-form-trigger.syno-ux-schedulefield-trigger,
.x-form-field-trigger-wrap .x-form-trigger.syno-ux-datefield-trigger,
.x-form-field-trigger-wrap .x-form-trigger.syno-ux-timefield-trigger {
  background-position: 0px 1px;
  background-color: #fff;
  border: 1px solid rgba(198, 212, 224, 0.7);
  border-left: 0px;
  width: 26px;
  height: 26px;
  border-radius: 0 4px 4px 0;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack
    .x-form-field-trigger-wrap
    .x-form-trigger.syno-ux-triggerfield-trigger,
  .synohdpack
    .x-form-field-trigger-wrap
    .x-form-trigger.syno-ux-combobox-trigger,
  .synohdpack
    .x-form-field-trigger-wrap
    .x-form-trigger.syno-ux-colorfield-trigger,
  .synohdpack
    .x-form-field-trigger-wrap
    .x-form-trigger.syno-ux-schedulefield-trigger,
  .synohdpack
    .x-form-field-trigger-wrap
    .x-form-trigger.syno-ux-datefield-trigger,
  .synohdpack
    .x-form-field-trigger-wrap
    .x-form-trigger.syno-ux-timefield-trigger {
    background-size: 24px 72px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug
    .x-form-field-trigger-wrap
    .x-form-trigger.syno-ux-triggerfield-trigger,
  .synohdpackdebug
    .x-form-field-trigger-wrap
    .x-form-trigger.syno-ux-combobox-trigger,
  .synohdpackdebug
    .x-form-field-trigger-wrap
    .x-form-trigger.syno-ux-colorfield-trigger,
  .synohdpackdebug
    .x-form-field-trigger-wrap
    .x-form-trigger.syno-ux-schedulefield-trigger,
  .synohdpackdebug
    .x-form-field-trigger-wrap
    .x-form-trigger.syno-ux-datefield-trigger,
  .synohdpackdebug
    .x-form-field-trigger-wrap
    .x-form-trigger.syno-ux-timefield-trigger {
    background-size: 24px 72px;
    outline: 1px green dashed;
  }
}
.x-form-field-trigger-wrap
  .x-form-trigger.x-form-trigger-over.syno-ux-triggerfield-trigger,
.x-form-field-trigger-wrap
  .x-form-trigger.x-form-trigger-over.syno-ux-combobox-trigger,
.x-form-field-trigger-wrap
  .x-form-trigger.x-form-trigger-over.syno-ux-colorfield-trigger,
.x-form-field-trigger-wrap
  .x-form-trigger.x-form-trigger-over.syno-ux-schedulefield-trigger,
.x-form-field-trigger-wrap
  .x-form-trigger.x-form-trigger-over.syno-ux-datefield-trigger,
.x-form-field-trigger-wrap
  .x-form-trigger.x-form-trigger-over.syno-ux-timefield-trigger {
  border-color: rgba(124, 138, 152, 0.5);
}
.x-form-field-trigger-wrap
  .x-form-trigger.x-form-trigger-over.syno-ux-trigger-invalid.syno-ux-triggerfield-trigger,
.x-form-field-trigger-wrap
  .x-form-trigger.x-form-trigger-over.syno-ux-trigger-invalid.syno-ux-combobox-trigger,
.x-form-field-trigger-wrap
  .x-form-trigger.x-form-trigger-over.syno-ux-trigger-invalid.syno-ux-colorfield-trigger,
.x-form-field-trigger-wrap
  .x-form-trigger.x-form-trigger-over.syno-ux-trigger-invalid.syno-ux-schedulefield-trigger,
.x-form-field-trigger-wrap
  .x-form-trigger.x-form-trigger-over.syno-ux-trigger-invalid.syno-ux-datefield-trigger,
.x-form-field-trigger-wrap
  .x-form-trigger.x-form-trigger-over.syno-ux-trigger-invalid.syno-ux-timefield-trigger {
  border-color: #e64040;
  background-color: rgba(230, 64, 64, 0.08);
}
.x-form-field-trigger-wrap
  .x-form-trigger.x-form-trigger-click.syno-ux-triggerfield-trigger,
.x-form-field-trigger-wrap
  .x-form-trigger.x-form-trigger-click.syno-ux-combobox-trigger,
.x-form-field-trigger-wrap
  .x-form-trigger.x-form-trigger-click.syno-ux-colorfield-trigger,
.x-form-field-trigger-wrap
  .x-form-trigger.x-form-trigger-click.syno-ux-schedulefield-trigger,
.x-form-field-trigger-wrap
  .x-form-trigger.x-form-trigger-click.syno-ux-datefield-trigger,
.x-form-field-trigger-wrap
  .x-form-trigger.x-form-trigger-click.syno-ux-timefield-trigger {
  background-position: 0px -23px;
}
.x-form-field-trigger-wrap
  .x-form-trigger.syno-ux-trigger-invalid.syno-ux-triggerfield-trigger,
.x-form-field-trigger-wrap
  .x-form-trigger.syno-ux-trigger-invalid.syno-ux-combobox-trigger,
.x-form-field-trigger-wrap
  .x-form-trigger.syno-ux-trigger-invalid.syno-ux-colorfield-trigger,
.x-form-field-trigger-wrap
  .x-form-trigger.syno-ux-trigger-invalid.syno-ux-schedulefield-trigger,
.x-form-field-trigger-wrap
  .x-form-trigger.syno-ux-trigger-invalid.syno-ux-datefield-trigger,
.x-form-field-trigger-wrap
  .x-form-trigger.syno-ux-trigger-invalid.syno-ux-timefield-trigger {
  border-color: #e64040;
  background-color: rgba(230, 64, 64, 0.08);
}
.x-form-field-trigger-wrap.x-trigger-wrap-focus
  .x-form-trigger.syno-ux-triggerfield-trigger,
.x-form-field-trigger-wrap.x-trigger-wrap-focus
  .x-form-trigger.syno-ux-combobox-trigger,
.x-form-field-trigger-wrap.x-trigger-wrap-focus
  .x-form-trigger.syno-ux-colorfield-trigger,
.x-form-field-trigger-wrap.x-trigger-wrap-focus
  .x-form-trigger.syno-ux-schedulefield-trigger,
.x-form-field-trigger-wrap.x-trigger-wrap-focus
  .x-form-trigger.syno-ux-datefield-trigger,
.x-form-field-trigger-wrap.x-trigger-wrap-focus
  .x-form-trigger.syno-ux-timefield-trigger {
  background-position: 0 -23px;
  border-color: #057feb;
}
.x-form-field-trigger-wrap.x-trigger-wrap-focus
  .x-form-trigger.syno-ux-trigger-invalid.syno-ux-triggerfield-trigger,
.x-form-field-trigger-wrap.x-trigger-wrap-focus
  .x-form-trigger.syno-ux-trigger-invalid.syno-ux-combobox-trigger,
.x-form-field-trigger-wrap.x-trigger-wrap-focus
  .x-form-trigger.syno-ux-trigger-invalid.syno-ux-colorfield-trigger,
.x-form-field-trigger-wrap.x-trigger-wrap-focus
  .x-form-trigger.syno-ux-trigger-invalid.syno-ux-schedulefield-trigger,
.x-form-field-trigger-wrap.x-trigger-wrap-focus
  .x-form-trigger.syno-ux-trigger-invalid.syno-ux-datefield-trigger,
.x-form-field-trigger-wrap.x-trigger-wrap-focus
  .x-form-trigger.syno-ux-trigger-invalid.syno-ux-timefield-trigger {
  border-color: #e64040;
}
.x-form-field-trigger-wrap.x-item-disabled
  .x-form-trigger.syno-ux-triggerfield-trigger,
.x-form-field-trigger-wrap.x-item-disabled
  .x-form-trigger.syno-ux-combobox-trigger,
.x-form-field-trigger-wrap.x-item-disabled
  .x-form-trigger.syno-ux-colorfield-trigger,
.x-form-field-trigger-wrap.x-item-disabled
  .x-form-trigger.syno-ux-schedulefield-trigger,
.x-form-field-trigger-wrap.x-item-disabled
  .x-form-trigger.syno-ux-datefield-trigger,
.x-form-field-trigger-wrap.x-item-disabled
  .x-form-trigger.syno-ux-timefield-trigger {
  background-position: 0px -47px;
  background-color: rgba(198, 212, 224, 0.2);
  border-color: rgba(198, 212, 224, 0.7);
}
.x-form-field-trigger-wrap.x-item-disabled
  .x-form-trigger.x-form-trigger-over.syno-ux-triggerfield-trigger,
.x-form-field-trigger-wrap.x-item-disabled
  .x-form-trigger.x-form-trigger-over.syno-ux-combobox-trigger,
.x-form-field-trigger-wrap.x-item-disabled
  .x-form-trigger.x-form-trigger-over.syno-ux-colorfield-trigger,
.x-form-field-trigger-wrap.x-item-disabled
  .x-form-trigger.x-form-trigger-over.syno-ux-schedulefield-trigger,
.x-form-field-trigger-wrap.x-item-disabled
  .x-form-trigger.x-form-trigger-over.syno-ux-datefield-trigger,
.x-form-field-trigger-wrap.x-item-disabled
  .x-form-trigger.x-form-trigger-over.syno-ux-timefield-trigger,
.x-form-field-trigger-wrap.x-item-disabled
  .x-form-trigger.x-form-trigger-click.syno-ux-triggerfield-trigger,
.x-form-field-trigger-wrap.x-item-disabled
  .x-form-trigger.x-form-trigger-click.syno-ux-combobox-trigger,
.x-form-field-trigger-wrap.x-item-disabled
  .x-form-trigger.x-form-trigger-click.syno-ux-colorfield-trigger,
.x-form-field-trigger-wrap.x-item-disabled
  .x-form-trigger.x-form-trigger-click.syno-ux-schedulefield-trigger,
.x-form-field-trigger-wrap.x-item-disabled
  .x-form-trigger.x-form-trigger-click.syno-ux-datefield-trigger,
.x-form-field-trigger-wrap.x-item-disabled
  .x-form-trigger.x-form-trigger-click.syno-ux-timefield-trigger {
  background-position: 0px -47px !important;
  border-color: rgba(198, 212, 224, 0.7);
}
.x-form-hidden-error-msg {
  position: absolute;
  color: transparent;
  width: 1px;
  height: 1px;
  overflow: hidden;
}
.ext-ie8 .x-form-hidden-error-msg {
  display: none;
}
.syno-ux-gridpanel .x-panel-tbar .x-toolbar,
.syno-ux-editorgridpanel .x-panel-tbar .x-toolbar,
.syno-ux-panel .x-panel-tbar .x-toolbar,
.syno-ux-formpanel .x-panel-tbar .x-toolbar,
.syno-ux-tab-panel .x-panel-tbar .x-toolbar {
  border-bottom-color: rgba(198, 212, 224, 0.7);
  padding: 0px 0px 8px 0px;
}
.syno-ux-gridpanel .x-panel-bbar .x-toolbar,
.syno-ux-editorgridpanel .x-panel-bbar .x-toolbar,
.syno-ux-panel .x-panel-bbar .x-toolbar,
.syno-ux-formpanel .x-panel-bbar .x-toolbar,
.syno-ux-tab-panel .x-panel-bbar .x-toolbar {
  border-top-color: rgba(198, 212, 224, 0.4);
  height: 23px;
}
.syno-ux-gridpanel .x-panel-bbar .x-toolbar .xtb-text,
.syno-ux-editorgridpanel .x-panel-bbar .x-toolbar .xtb-text,
.syno-ux-panel .x-panel-bbar .x-toolbar .xtb-text,
.syno-ux-formpanel .x-panel-bbar .x-toolbar .xtb-text,
.syno-ux-tab-panel .x-panel-bbar .x-toolbar .xtb-text {
  line-height: 23px;
  padding-top: 0px;
}
.syno-ux-gridpanel .x-panel-ml,
.syno-ux-editorgridpanel .x-panel-ml,
.syno-ux-panel .x-panel-ml,
.syno-ux-formpanel .x-panel-ml,
.syno-ux-tab-panel .x-panel-ml,
.syno-ux-gridpanel .x-panel-mc,
.syno-ux-editorgridpanel .x-panel-mc,
.syno-ux-panel .x-panel-mc,
.syno-ux-formpanel .x-panel-mc,
.syno-ux-tab-panel .x-panel-mc {
  background-color: transparent;
}
.syno-ux-gridpanel .x-panel-header,
.syno-ux-editorgridpanel .x-panel-header,
.syno-ux-panel .x-panel-header,
.syno-ux-formpanel .x-panel-header,
.syno-ux-tab-panel .x-panel-header {
  background-image: none;
  border-bottom: 1px dashed rgba(198, 212, 224, 0.7);
  font-size: 15px;
  font-weight: normal;
  padding: 0px 0px 0px 8px;
}
.syno-ux-gridpanel .x-panel-header .x-panel-header-text,
.syno-ux-editorgridpanel .x-panel-header .x-panel-header-text,
.syno-ux-panel .x-panel-header .x-panel-header-text,
.syno-ux-formpanel .x-panel-header .x-panel-header-text,
.syno-ux-tab-panel .x-panel-header .x-panel-header-text {
  color: #057feb;
  line-height: 28px;
}
.syno-ux-checkbox-icon,
.syno-ux-radio-icon {
  background-position: 0px 0px;
  background-color: transparent;
  width: 20px;
  height: 20px;
  border: 0px;
  margin-top: 2px;
}
.ext-ie .x-form-check-wrap .syno-ux-checkbox-icon,
.ext-ie .x-form-check-wrap .syno-ux-radio-icon {
  width: 20px;
  height: 20px;
}
.syno-ux-cb-focus.syno-ux-checkbox-icon,
.syno-ux-cb-focus.syno-ux-radio-icon,
.syno-ux-cb-hover.syno-ux-checkbox-icon,
.syno-ux-cb-hover.syno-ux-radio-icon {
  background-position: 0px -20px;
}
.syno-ux-cb-disabled.syno-ux-checkbox-icon,
.syno-ux-cb-disabled.syno-ux-radio-icon {
  background-position: 0px -40px;
}
.syno-ux-cb-disabled.syno-ux-cb-checked.syno-ux-checkbox-icon,
.syno-ux-cb-disabled.syno-ux-cb-checked.syno-ux-radio-icon {
  background-position: 0px -100px;
}
.syno-ux-cb-disabled.syno-ux-cb-checked.syno-ux-cb-focus.syno-ux-checkbox-icon,
.syno-ux-cb-disabled.syno-ux-cb-checked.syno-ux-cb-focus.syno-ux-radio-icon,
.syno-ux-cb-disabled.syno-ux-cb-checked.syno-ux-cb-hover.syno-ux-checkbox-icon,
.syno-ux-cb-disabled.syno-ux-cb-checked.syno-ux-cb-hover.syno-ux-radio-icon {
  background-position: 0px -100px;
}
.syno-ux-cb-disabled.syno-ux-cb-grayed.syno-ux-checkbox-icon,
.syno-ux-cb-disabled.syno-ux-cb-grayed.syno-ux-radio-icon {
  background-position: 0px -160px;
}
.syno-ux-cb-disabled.syno-ux-cb-grayed.syno-ux-cb-focus.syno-ux-checkbox-icon,
.syno-ux-cb-disabled.syno-ux-cb-grayed.syno-ux-cb-focus.syno-ux-radio-icon,
.syno-ux-cb-disabled.syno-ux-cb-grayed.syno-ux-cb-hover.syno-ux-checkbox-icon,
.syno-ux-cb-disabled.syno-ux-cb-grayed.syno-ux-cb-hover.syno-ux-radio-icon {
  background-position: 0px -160px;
}
.syno-ux-cb-checked.syno-ux-checkbox-icon,
.syno-ux-cb-checked.syno-ux-radio-icon {
  background-position: 0px -60px;
}
.syno-ux-cb-checked.syno-ux-cb-focus.syno-ux-checkbox-icon,
.syno-ux-cb-checked.syno-ux-cb-focus.syno-ux-radio-icon,
.syno-ux-cb-checked.syno-ux-cb-hover.syno-ux-checkbox-icon,
.syno-ux-cb-checked.syno-ux-cb-hover.syno-ux-radio-icon {
  background-position: 0px -80px;
}
.syno-ux-cb-grayed.syno-ux-checkbox-icon,
.syno-ux-cb-grayed.syno-ux-radio-icon {
  background-position: 0px -120px;
}
.syno-ux-cb-grayed.syno-ux-cb-focus.syno-ux-checkbox-icon,
.syno-ux-cb-grayed.syno-ux-cb-focus.syno-ux-radio-icon,
.syno-ux-cb-grayed.syno-ux-cb-hover.syno-ux-checkbox-icon,
.syno-ux-cb-grayed.syno-ux-cb-hover.syno-ux-radio-icon {
  background-position: 0px -140px;
}
.x-form-check-wrap .syno-ux-checkbox-icon,
.x-form-check-wrap .syno-ux-radio-icon {
  position: absolute;
}
.syno-ux-checkbox-label {
  font-size: 13px;
  line-height: 20px !important;
  padding-top: 2px;
  padding-bottom: 2px;
  padding-left: 8px;
}
.x-form-check-wrap .syno-ux-checkbox-label {
  display: inline-block;
  vertical-align: top;
  padding-left: 28px;
}
.syno-ux-form-check-wrap input[type="checkbox"],
.syno-ux-form-radio-wrap input[type="checkbox"],
.syno-ux-form-check-wrap input[type="radio"],
.syno-ux-form-radio-wrap input[type="radio"] {
  width: 1px;
  height: 1px;
  margin-top: 5px;
  margin-left: 5px;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
}
.ext-ie8 .syno-ux-form-check-wrap input[type="checkbox"],
.ext-ie8 .syno-ux-form-radio-wrap input[type="checkbox"],
.ext-ie9 .syno-ux-form-check-wrap input[type="checkbox"],
.ext-ie9 .syno-ux-form-radio-wrap input[type="checkbox"],
.ext-ie8 .syno-ux-form-check-wrap input[type="radio"],
.ext-ie8 .syno-ux-form-radio-wrap input[type="radio"],
.ext-ie9 .syno-ux-form-check-wrap input[type="radio"],
.ext-ie9 .syno-ux-form-radio-wrap input[type="radio"] {
  position: absolute;
  top: -10000px;
  left: -10000px;
}
.ext-el-mask-msg.x-mask-loading div {
  cursor: wait;
}
.syno-ux-menu.syno-ux-menu-autofexcroll a.x-menu-item {
  margin-right: 10px;
}
.syno-ux-fieldset {
  border: 0px;
  padding: 0px;
  margin-bottom: 8px;
}
.ext-safari .syno-ux-fieldset.syno-ux-fieldset-default {
  position: static;
}
.syno-ux-fieldset.syno-ux-fieldset-default .x-fieldset-header:hover,
.syno-ux-fieldset.syno-ux-fieldset-default .x-fieldset-header:focus,
.syno-ux-fieldset.syno-ux-fieldset-default .x-fieldset-bottomlegend:hover,
.syno-ux-fieldset.syno-ux-fieldset-default .x-fieldset-bottomlegend:focus {
  color: #057feb;
}
.ext-safari .syno-ux-fieldset {
  position: relative;
}
.syno-ux-fieldset .x-fieldset-bwrap {
  padding: 8px;
}
.syno-ux-fieldset .x-tool.x-tool-toggle {
  margin-top: 0px;
  background-position: -24px -0px;
  width: 24px;
  height: 24px;
  margin-left: 4px;
  margin-right: 4px;
  float: left;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack .syno-ux-fieldset .x-tool.x-tool-toggle {
    background-size: 48px 72px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug .syno-ux-fieldset .x-tool.x-tool-toggle {
    background-size: 48px 72px;
    outline: 1px green dashed;
  }
}
.syno-ux-fieldset .x-fieldset-header,
.syno-ux-fieldset .x-fieldset-bottomlegend {
  font-size: 15px;
  font-weight: normal;
  height: 28px;
  line-height: 28px;
  padding: 0 0 3px 0;
  border-bottom: 1px dashed rgba(198, 212, 224, 0.7);
  color: #057feb;
}
.syno-ux-fieldset .x-fieldset-header .x-fieldset-header-text,
.syno-ux-fieldset .x-fieldset-bottomlegend .x-fieldset-header-text {
  padding-left: 8px;
  line-height: 24px;
  width: calc(100% - 48px);
  display: block;
}
.syno-ux-fieldset .x-fieldset-header:hover,
.syno-ux-fieldset .x-fieldset-header:focus,
.syno-ux-fieldset .x-fieldset-bottomlegend:hover,
.syno-ux-fieldset .x-fieldset-bottomlegend:focus {
  color: #006dcc;
}
.syno-ux-fieldset .x-fieldset-header:hover .x-tool.x-tool-toggle,
.syno-ux-fieldset .x-fieldset-header:focus .x-tool.x-tool-toggle,
.syno-ux-fieldset .x-fieldset-bottomlegend:hover .x-tool.x-tool-toggle,
.syno-ux-fieldset .x-fieldset-bottomlegend:focus .x-tool.x-tool-toggle {
  background-position: -24px -24px;
}
.syno-ux-fieldset .x-fieldset-header:active,
.syno-ux-fieldset .x-fieldset-bottomlegend:active {
  color: #005cad;
}
.syno-ux-fieldset .x-fieldset-header:active .x-tool.x-tool-toggle,
.syno-ux-fieldset .x-fieldset-bottomlegend:active .x-tool.x-tool-toggle {
  background-position: -24px -48px;
}
.syno-ux-fieldset .x-fieldset-bottomlegend {
  font-size: 13px;
  height: 26px;
  border: 0px;
  cursor: pointer;
}
.syno-ux-fieldset .x-fieldset-bottomlegend .x-fieldset-bottomlegend-text {
  line-height: 26px;
}
.syno-ux-fieldset.x-panel-collapsed
  .x-fieldset-bottomlegend
  .x-tool.x-tool-toggle,
.syno-ux-fieldset.x-panel-collapsed .x-fieldset-header .x-tool.x-tool-toggle {
  background-position: 0px 0px;
}
.syno-ux-fieldset.x-panel-collapsed
  .x-fieldset-bottomlegend:hover
  .x-tool.x-tool-toggle,
.syno-ux-fieldset.x-panel-collapsed
  .x-fieldset-bottomlegend:focus
  .x-tool.x-tool-toggle,
.syno-ux-fieldset.x-panel-collapsed
  .x-fieldset-header:hover
  .x-tool.x-tool-toggle,
.syno-ux-fieldset.x-panel-collapsed
  .x-fieldset-header:focus
  .x-tool.x-tool-toggle {
  background-position: 0px -24px;
}
.syno-ux-fieldset.x-panel-collapsed
  .x-fieldset-bottomlegend:active
  .x-tool.x-tool-toggle,
.syno-ux-fieldset.x-panel-collapsed
  .x-fieldset-header:active
  .x-tool.x-tool-toggle {
  background-position: 0px -48px;
}
.syno-ux-fieldset legend,
.syno-ux-fieldset legend span {
  cursor: pointer;
}
.syno-ux-fieldset.syno-ux-fieldset-default .x-fieldset-header-text {
  padding-left: 8px;
}
.syno-ux-fieldset.syno-ux-fieldset-default legend,
.syno-ux-fieldset.syno-ux-fieldset-default legend span {
  cursor: default;
}
.syno-ux-fieldset.syno-ux-inverse-fieldset .x-fieldset-bwrap {
  padding: 0;
}
.ext-ie .x-fieldset.syno-ux-fieldset {
  padding-bottom: 0px;
}
.ext-ie .x-fieldset.syno-ux-fieldset legend {
  margin-bottom: 0px;
}
input[type="text"]::-webkit-input-placeholder,
input[type="password"]::-webkit-input-placeholder,
input[type="textarea"]::-webkit-input-placeholder {
  color: rgba(65, 75, 85, 0.4);
}
input[type="text"]:-moz-placeholder,
input[type="password"]:-moz-placeholder,
input[type="textarea"]:-moz-placeholder {
  color: rgba(65, 75, 85, 0.4);
  opacity: 1;
}
input[type="text"]::-moz-placeholder,
input[type="password"]::-moz-placeholder,
input[type="textarea"]::-moz-placeholder {
  color: rgba(65, 75, 85, 0.4);
  opacity: 1;
}
input[type="text"]:-ms-input-placeholder,
input[type="password"]:-ms-input-placeholder,
input[type="textarea"]:-ms-input-placeholder {
  color: rgba(65, 75, 85, 0.4);
}
.syno-ux-displayfield.x-form-display-field {
  font-size: 13px;
  padding-top: 4px;
  padding-bottom: 4px;
  line-height: 20px;
}
.syno-ux-displayfield.x-form-display-field.x-item-disabled {
  color: rgba(65, 75, 85, 0.4);
}
.syno-ux-combobox-list.x-layer.x-combo-list {
  border-color: rgba(198, 212, 224, 0.7);
  background-color: #fff;
  padding: 8px;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.16);
  border-radius: 4px;
}
.syno-ux-combobox-list.x-resizable-pinned .x-combo-list-inner {
  border-bottom: 0;
}
.syno-ux-combobox-list .x-combo-list-item {
  height: 28px;
  line-height: 28px;
  background-color: #fff;
  font-size: 13px;
  padding: 0px 6px 0 12px;
  border-width: 0px;
  border-radius: 3px;
}
.syno-ux-combobox-list .x-combo-list-item.x-combo-selected {
  background-color: rgba(5, 127, 235, 0.1);
}
.syno-ux-combobox-list .x-combo-list-inner {
  margin-bottom: 0px;
}
.syno-ux-combobox-list .syno-ux-pagingtoolbar {
  border-top: 1px solid rgba(198, 212, 224, 0.4);
  border-bottom: 1px solid rgba(198, 212, 224, 0.7);
  padding: 0px;
}
.syno-ux-combobox-list .loading-indicator {
  margin: 0px 3px;
}
.syno-ux-colormenu {
  background-image: none;
}
.syno-ux-colormenu.x-layer {
  background-color: #fff;
  padding: 4px;
  border: 1px solid rgba(198, 212, 224, 0.7);
  border-radius: 4px;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.16);
}
.syno-ux-colormenu .x-color-palette.x-menu-list-item a {
  color: rgba(198, 212, 224, 0.7);
  padding: 3px;
  border: none;
}
.syno-ux-colormenu .x-color-palette.x-menu-list-item a:hover {
  padding: 2px;
  border: 1px solid rgba(124, 138, 152, 0.5);
  border-radius: 3px;
}
.syno-ux-schedule-menu
  > .x-menu-list
  > .x-menu-list-item
  > .x-menu-item
  > .x-menu-item-icon {
  width: 20px;
  height: 20px;
  top: 4px;
}
button {
  border-radius: 0px;
}
.syno-ux-button {
  height: 26px;
  line-height: 26px;
  border-radius: 3px;
  display: inline-block;
  text-align: center;
}
.syno-ux-button em {
  display: block;
}
.syno-ux-button.x-btn em button {
  height: 26px;
  font-size: 13px;
  padding-left: 13px;
  padding-right: 13px;
  background-repeat: no-repeat;
  vertical-align: top;
}
.syno-ux-button.x-btn-icon em button {
  height: 24px;
  padding-left: 14px;
  padding-right: 14px;
  margin: 1px 0px;
  background-position-x: center;
}
.syno-ux-button.x-btn em button.arrow {
  padding-right: 0px;
  padding-left: 2px;
  border: 0px;
  position: absolute;
  right: -1px;
  top: -1px;
  bottom: -1px;
  height: 28px;
  width: 14px;
  user-select: auto;
}
.syno-ux-button.syno-ux-button-dropdown {
  padding-right: 13px;
}
.syno-ux-button.syno-ux-button-dropdown.syno-ux-button-split {
  padding-right: 0px;
}
.syno-ux-button em {
  position: relative;
  cursor: pointer;
}
.syno-ux-button em.x-btn-arrow {
  display: block;
  padding-right: 12px;
  background-repeat: no-repeat;
  background-position: right 2px;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack .syno-ux-button em.x-btn-arrow {
    background-size: 12px 48px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug .syno-ux-button em.x-btn-arrow {
    background-size: 12px 48px;
    outline: 1px green dashed;
  }
}
.syno-ux-button em.x-btn-arrow button {
  padding-right: 2px;
}
.syno-ux-button em.x-btn-split {
  display: block;
  padding-right: 14px;
  background-repeat: no-repeat;
  background-position: right 1px top 1px;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack .syno-ux-button em.x-btn-split {
    background-size: 12px 48px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug .syno-ux-button em.x-btn-split {
    background-size: 12px 48px;
    outline: 1px green dashed;
  }
}
.syno-ux-button em.x-btn-split button:first-child {
  border-right: 1px solid #c8d2dc;
  padding-right: 13px;
}
.syno-ux-button.x-item-disabled {
  cursor: default;
}
.syno-ux-button.x-item-disabled.x-btn-icon .x-btn-text {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
  opacity: 0.4;
}
.syno-ux-button.x-item-disabled em.x-btn-arrow {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
  opacity: 0.4;
}
.syno-ux-button.x-item-disabled em.x-btn-arrow .x-btn-text {
  filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
  opacity: 1;
}
.syno-ux-button.x-item-disabled em.x-btn-split {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
  opacity: 0.4;
}
.syno-ux-button.x-item-disabled em.x-btn-split .x-btn-text {
  filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
  opacity: 1;
}
.syno-ux-button.syno-ux-button-blue em.x-btn-arrow,
.syno-ux-button.syno-ux-button-blue em.x-btn-split,
.syno-ux-button.syno-ux-button-red em.x-btn-arrow,
.syno-ux-button.syno-ux-button-red em.x-btn-split,
.syno-ux-button.syno-ux-button-green em.x-btn-arrow,
.syno-ux-button.syno-ux-button-green em.x-btn-split,
.syno-ux-button.syno-ux-button-orange em.x-btn-arrow,
.syno-ux-button.syno-ux-button-orange em.x-btn-split {
  background-position-y: -22px;
}
.syno-ux-button.syno-ux-button-blue.x-item-disabled em.x-btn-arrow,
.syno-ux-button.syno-ux-button-blue.x-item-disabled em.x-btn-split,
.syno-ux-button.syno-ux-button-red.x-item-disabled em.x-btn-arrow,
.syno-ux-button.syno-ux-button-red.x-item-disabled em.x-btn-split,
.syno-ux-button.syno-ux-button-green.x-item-disabled em.x-btn-arrow,
.syno-ux-button.syno-ux-button-green.x-item-disabled em.x-btn-split,
.syno-ux-button.syno-ux-button-orange.x-item-disabled em.x-btn-arrow,
.syno-ux-button.syno-ux-button-orange.x-item-disabled em.x-btn-split {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
  opacity: 0.4;
}
.syno-ux-button-blue,
.syno-ux-button-red,
.syno-ux-button-grey,
.syno-ux-button-green,
.syno-ux-button-orange {
  margin-right: 6px !important;
  text-align: center;
}
.syno-ux-button-blue.syno-ux-button-dropdown,
.syno-ux-button-blue.syno-ux-button-split,
.syno-ux-button-red.syno-ux-button-dropdown,
.syno-ux-button-red.syno-ux-button-split,
.syno-ux-button-grey.syno-ux-button-dropdown,
.syno-ux-button-grey.syno-ux-button-split,
.syno-ux-button-green.syno-ux-button-dropdown,
.syno-ux-button-green.syno-ux-button-split,
.syno-ux-button-orange.syno-ux-button-dropdown,
.syno-ux-button-orange.syno-ux-button-split {
  min-width: 0px;
}
.syno-ux-button-grey {
  border: solid 1px rgba(198, 212, 224, 0);
  background-color: rgba(198, 212, 224, 0.4);
}
.syno-ux-button-grey.x-btn-over,
.syno-ux-button-grey:hover,
.syno-ux-button-grey.x-btn-focus {
  border-color: rgba(124, 138, 152, 0.4);
  background-color: rgba(198, 212, 224, 0.4);
}
.syno-ux-button-grey.x-btn-click,
.syno-ux-button-grey:active {
  border-color: rgba(124, 138, 152, 0.5);
  background-color: rgba(198, 212, 224, 0.6);
}
.syno-ux-button-grey.x-item-disabled {
  border-color: rgba(198, 212, 224, 0);
  background-color: rgba(198, 212, 224, 0.4);
}
.syno-ux-button-grey.x-item-disabled .x-btn-text {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
  opacity: 0.4;
}
.syno-ux-button-grey.focus-effect {
  border-color: rgba(124, 138, 152, 0.4);
  background-color: rgba(198, 212, 224, 0.4);
}
.syno-ux-button-default {
  border: solid 1px rgba(198, 212, 224, 0);
  background-color: rgba(198, 212, 224, 0.4);
  margin-right: 6px !important;
}
.syno-ux-button-default.x-btn-over,
.syno-ux-button-default:hover,
.syno-ux-button-default.x-btn-focus {
  border-color: rgba(124, 138, 152, 0.4);
  background-color: rgba(198, 212, 224, 0.4);
}
.syno-ux-button-default.x-btn-click,
.syno-ux-button-default:active {
  border-color: rgba(124, 138, 152, 0.5);
  background-color: rgba(198, 212, 224, 0.6);
}
.syno-ux-button-default.x-item-disabled {
  border-color: rgba(198, 212, 224, 0);
  background-color: rgba(198, 212, 224, 0.4);
}
.syno-ux-button-default.x-item-disabled .x-btn-text {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
  opacity: 0.4;
}
.syno-ux-button-default.focus-effect {
  border-color: rgba(124, 138, 152, 0.4);
  background-color: rgba(198, 212, 224, 0.4);
}
.syno-ux-button-blue {
  border: solid 1px #057feb;
  background-color: #057feb;
}
.syno-ux-button-blue.x-btn-over,
.syno-ux-button-blue:hover,
.syno-ux-button-blue.x-btn-focus {
  border-color: #0062b8;
  background-color: #0075db;
}
.syno-ux-button-blue.x-btn-click,
.syno-ux-button-blue:active {
  border-color: #005299;
  background-color: #006dcc;
}
.syno-ux-button-blue.x-item-disabled {
  border-color: #057feb;
  background-color: #057feb;
}
.syno-ux-button-blue.x-item-disabled .x-btn-text {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
  opacity: 0.4;
}
.syno-ux-button-blue.focus-effect {
  border-color: #0062b8;
  background-color: #0075db;
}
.syno-ux-button-blue.x-btn .x-btn-text {
  color: #fff;
}
.syno-ux-button-blue.x-btn-over.x-btn .x-btn-text,
.syno-ux-button-blue:hover.x-btn .x-btn-text,
.syno-ux-button-blue.x-btn-focus.x-btn .x-btn-text,
.syno-ux-button-blue.x-btn-click.x-btn .x-btn-text,
.syno-ux-button-blue:active.x-btn .x-btn-text,
.syno-ux-button-blue.x-item-disabled.x-btn .x-btn-text {
  color: #fff;
}
.syno-ux-button-blue.syno-ux-button-dropdown.syno-ux-button-split .x-btn-text {
  border-right-color: rgba(255, 255, 255, 0.4);
}
.syno-ux-button-blue.syno-ux-button-dropdown.syno-ux-button-split.x-btn-over
  .x-btn-text,
.syno-ux-button-blue.syno-ux-button-dropdown.syno-ux-button-split.x-btn-focus
  .syno-ux-button-blue.syno-ux-button-dropdown.syno-ux-button-split.x-btn-click
  .x-btn-text,
.syno-ux-button-blue.syno-ux-button-dropdown.syno-ux-button-split.x-item-disabled
  .x-btn-text {
  border-right-color: rgba(255, 255, 255, 0.4);
}
.syno-ux-button-red {
  border: solid 1px #e64040;
  background-color: #e64040;
}
.syno-ux-button-red.x-btn-over,
.syno-ux-button-red:hover,
.syno-ux-button-red.x-btn-focus {
  border-color: #a81b1b;
  background-color: #d12e2e;
}
.syno-ux-button-red.x-btn-click,
.syno-ux-button-red:active {
  border-color: #991818;
  background-color: #bd1e1e;
}
.syno-ux-button-red.x-item-disabled {
  border-color: #e64040;
  background-color: #e64040;
}
.syno-ux-button-red.x-item-disabled .x-btn-text {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
  opacity: 0.4;
}
.syno-ux-button-red.focus-effect {
  border-color: #a81b1b;
  background-color: #d12e2e;
}
.syno-ux-button-red.x-btn button {
  color: #fff;
}
.syno-ux-button-red.x-btn-over.x-btn button,
.syno-ux-button-red:hover.x-btn button,
.syno-ux-button-red.x-btn-focus.x-btn button,
.syno-ux-button-red.x-btn-click.x-btn button,
.syno-ux-button-red:active.x-btn button,
.syno-ux-button-red.x-item-disabled.x-btn button {
  color: #fff;
}
.syno-ux-button-red.syno-ux-button-dropdown.syno-ux-button-split .x-btn-text {
  border-right-color: rgba(255, 255, 255, 0.4);
}
.syno-ux-button-red.syno-ux-button-dropdown.syno-ux-button-split.x-btn-over
  .x-btn-text,
.syno-ux-button-red.syno-ux-button-dropdown.syno-ux-button-split.x-btn-focus
  .syno-ux-button-red.syno-ux-button-dropdown.syno-ux-button-split.x-btn-click
  .x-btn-text,
.syno-ux-button-red.syno-ux-button-dropdown.syno-ux-button-split.x-item-disabled
  .x-btn-text {
  border-right-color: rgba(255, 255, 255, 0.4);
}
.syno-ux-button-green {
  border: solid 1px #009e05;
  background-color: #009e05;
}
.syno-ux-button-green.x-btn-over,
.syno-ux-button-green:hover,
.syno-ux-button-green.x-btn-focus {
  border-color: #006603;
  background-color: #038f08;
}
.syno-ux-button-green.x-btn-click,
.syno-ux-button-green:active {
  border-color: #005703;
  background-color: #008004;
}
.syno-ux-button-green.x-item-disabled {
  border-color: #009e05;
  background-color: #009e05;
}
.syno-ux-button-green.x-item-disabled .x-btn-text {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
  opacity: 0.4;
}
.syno-ux-button-green.focus-effect {
  border-color: #006603;
  background-color: #038f08;
}
.syno-ux-button-green.x-btn button {
  color: #fff;
}
.syno-ux-button-green.x-btn-over.x-btn button,
.syno-ux-button-green:hover.x-btn button,
.syno-ux-button-green.x-btn-focus.x-btn button,
.syno-ux-button-green.x-btn-click.x-btn button,
.syno-ux-button-green:active.x-btn button,
.syno-ux-button-green.x-item-disabled.x-btn button {
  color: #fff;
}
.syno-ux-button-green.syno-ux-button-dropdown.syno-ux-button-split .x-btn-text {
  border-right-color: rgba(255, 255, 255, 0.4);
}
.syno-ux-button-green.syno-ux-button-dropdown.syno-ux-button-split.x-btn-over
  .x-btn-text,
.syno-ux-button-green.syno-ux-button-dropdown.syno-ux-button-split.x-btn-focus
  .syno-ux-button-green.syno-ux-button-dropdown.syno-ux-button-split.x-btn-click
  .x-btn-text,
.syno-ux-button-green.syno-ux-button-dropdown.syno-ux-button-split.x-item-disabled
  .x-btn-text {
  border-right-color: rgba(255, 255, 255, 0.4);
}
.syno-ux-button-orange {
  border: solid 1px #f58414;
  background-color: #f58414;
}
.syno-ux-button-orange.x-btn-over,
.syno-ux-button-orange:hover,
.syno-ux-button-orange.x-btn-focus {
  border-color: #bf6000;
  background-color: #e67808;
}
.syno-ux-button-orange.x-btn-click,
.syno-ux-button-orange:active {
  border-color: #ad5700;
  background-color: #d96c00;
}
.syno-ux-button-orange.x-item-disabled {
  border-color: #f58414;
  background-color: #f58414;
}
.syno-ux-button-orange.x-item-disabled .x-btn-text {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
  opacity: 0.4;
}
.syno-ux-button-orange.focus-effect {
  border-color: #bf6000;
  background-color: #e67808;
}
.syno-ux-button-orange.x-btn button {
  color: #fff;
}
.syno-ux-button-orange.x-btn-over.x-btn button,
.syno-ux-button-orange:hover.x-btn button,
.syno-ux-button-orange.x-btn-focus.x-btn button,
.syno-ux-button-orange.x-btn-click.x-btn button,
.syno-ux-button-orange:active.x-btn button,
.syno-ux-button-orange.x-item-disabled.x-btn button {
  color: #fff;
}
.syno-ux-button-orange.syno-ux-button-dropdown.syno-ux-button-split
  .x-btn-text {
  border-right-color: rgba(255, 255, 255, 0.4);
}
.syno-ux-button-orange.syno-ux-button-dropdown.syno-ux-button-split.x-btn-over
  .x-btn-text,
.syno-ux-button-orange.syno-ux-button-dropdown.syno-ux-button-split.x-btn-focus
  .syno-ux-button-orange.syno-ux-button-dropdown.syno-ux-button-split.x-btn-click
  .x-btn-text,
.syno-ux-button-orange.syno-ux-button-dropdown.syno-ux-button-split.x-item-disabled
  .x-btn-text {
  border-right-color: rgba(255, 255, 255, 0.4);
}
.syno-ux-button.syno-ux-statebuttongroup-right,
.syno-ux-button.syno-ux-statebuttongroup-left,
.syno-ux-button.syno-ux-statebuttongroup-middle {
  margin-right: 0px !important;
  border-color: rgba(198, 212, 224, 0.4);
  background-color: rgba(198, 212, 224, 0.4);
}
.syno-ux-button.syno-ux-statebuttongroup-right.x-btn em button,
.syno-ux-button.syno-ux-statebuttongroup-left.x-btn em button,
.syno-ux-button.syno-ux-statebuttongroup-middle.x-btn em button {
  padding-right: 18px;
  padding-left: 18px;
}
.syno-ux-button.syno-ux-statebuttongroup-right.x-btn-over,
.syno-ux-button.syno-ux-statebuttongroup-right:hover,
.syno-ux-button.syno-ux-statebuttongroup-left.x-btn-over,
.syno-ux-button.syno-ux-statebuttongroup-left:hover,
.syno-ux-button.syno-ux-statebuttongroup-middle.x-btn-over,
.syno-ux-button.syno-ux-statebuttongroup-middle:hover {
  border-color: rgba(124, 138, 152, 0.3);
  background-color: rgba(198, 212, 224, 0.4);
}
.syno-ux-button.syno-ux-statebuttongroup-right.x-btn-click,
.syno-ux-button.syno-ux-statebuttongroup-right.syno-ux-statebuttongroup-pressed,
.syno-ux-button.syno-ux-statebuttongroup-left.x-btn-click,
.syno-ux-button.syno-ux-statebuttongroup-left.syno-ux-statebuttongroup-pressed,
.syno-ux-button.syno-ux-statebuttongroup-middle.x-btn-click,
.syno-ux-button.syno-ux-statebuttongroup-middle.syno-ux-statebuttongroup-pressed {
  border-color: #057feb;
  background-color: #057feb;
  box-shadow: inset 0px 1px 2px #007bd3;
}
.syno-ux-button.syno-ux-statebuttongroup-right.x-btn-click.x-btn button,
.syno-ux-button.syno-ux-statebuttongroup-right.syno-ux-statebuttongroup-pressed.x-btn
  button,
.syno-ux-button.syno-ux-statebuttongroup-left.x-btn-click.x-btn button,
.syno-ux-button.syno-ux-statebuttongroup-left.syno-ux-statebuttongroup-pressed.x-btn
  button,
.syno-ux-button.syno-ux-statebuttongroup-middle.x-btn-click.x-btn button,
.syno-ux-button.syno-ux-statebuttongroup-middle.syno-ux-statebuttongroup-pressed.x-btn
  button {
  text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.15);
  color: #fff;
}
.syno-ux-button.syno-ux-statebuttongroup-right.x-item-disabled,
.syno-ux-button.syno-ux-statebuttongroup-left.x-item-disabled,
.syno-ux-button.syno-ux-statebuttongroup-middle.x-item-disabled {
  border-color: rgba(198, 212, 224, 0.4);
  background-color: rgba(198, 212, 224, 0.4);
}
.syno-ux-button.syno-ux-statebuttongroup-right.x-item-disabled.x-btn
  .x-btn-text,
.syno-ux-button.syno-ux-statebuttongroup-left.x-item-disabled.x-btn .x-btn-text,
.syno-ux-button.syno-ux-statebuttongroup-middle.x-item-disabled.x-btn
  .x-btn-text {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
  opacity: 0.4;
}
.syno-ux-button.syno-ux-statebuttongroup-right,
.syno-ux-button.syno-ux-statebuttongroup-middle {
  border-top-left-radius: 0px;
  border-bottom-left-radius: 0px;
}
.syno-ux-button.syno-ux-statebuttongroup-left,
.syno-ux-button.syno-ux-statebuttongroup-middle {
  border-right: 0px;
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
}
.syno-ux-modulelist {
  box-shadow: 1px 0 0 0 rgba(198, 212, 224, 0.5);
}
.syno-ux-modulelist .x-panel-body {
  overflow-y: hidden;
}
.syno-ux-modulelist .x-panel-body:before,
.syno-ux-modulelist .x-panel-body:after {
  position: absolute;
  display: block;
  height: 6px;
  content: "";
  width: 94%;
}
.syno-ux-modulelist .x-panel-body:before {
  top: 0px;
  z-index: 99;
  background-color: #fff;
}
.syno-ux-modulelist .x-panel-body:after {
  bottom: 0;
  z-index: 99;
  background-color: #fff;
}
.syno-ux-modulelist.scroll-at-top .x-panel-body:before {
  display: none;
}
.syno-ux-modulelist.scroll-at-bottom .x-panel-body:after {
  display: none;
}
.syno-ux-modulelist .x-tree-root-ct {
  width: auto !important;
}
.syno-ux-modulelist .x-tree-root-node {
  padding-bottom: 8px;
}
.syno-ux-modulelist .x-tree-elbow,
.syno-ux-modulelist .x-tree-elbow-end {
  display: none;
}
.syno-ux-modulelist .x-tree-node,
.syno-ux-modulelist .x-tree-node * {
  cursor: pointer;
}
.syno-ux-modulelist .x-tree-node-icon {
  width: 22px;
  height: 22px;
  margin: 10px 8px 10px 12px;
}
.syno-ux-modulelist .x-tree-node-collapsed .x-tree-elbow-minus,
.syno-ux-modulelist .x-tree-node-collapsed .x-tree-elbow-end-minus,
.syno-ux-modulelist .x-tree-node-expanded .x-tree-elbow-minus,
.syno-ux-modulelist .x-tree-node-expanded .x-tree-elbow-end-minus,
.syno-ux-modulelist .x-tree-node-collapsed .x-tree-elbow-plus,
.syno-ux-modulelist .x-tree-node-collapsed .x-tree-elbow-end-plus,
.syno-ux-modulelist .x-tree-node-expanded .x-tree-elbow-plus,
.syno-ux-modulelist .x-tree-node-expanded .x-tree-elbow-end-plus {
  width: 24px;
  height: 24px;
  position: absolute;
  left: 11px;
  top: 8px;
}
.syno-ux-modulelist .x-tree-node-collapsed {
  padding-bottom: 8px;
}
.syno-ux-modulelist .x-tree-node.x-tree-node-category {
  border-bottom: 1px solid rgba(198, 212, 224, 0.4);
}
.syno-ux-modulelist .x-tree-node.x-tree-node-category:last-child,
.syno-ux-modulelist
  .x-tree-node.x-tree-node-category.x-tree-node-category-last {
  border-bottom: none;
}
.syno-ux-modulelist .x-tree-node-collapsed,
.syno-ux-modulelist .x-tree-node-expanded {
  height: 24px;
  padding-top: 8px;
  position: relative;
}
.syno-ux-modulelist .x-tree-node-collapsed .x-tree-node-icon,
.syno-ux-modulelist .x-tree-node-expanded .x-tree-node-icon {
  display: none;
}
.syno-ux-modulelist .x-tree-node-collapsed a,
.syno-ux-modulelist .x-tree-node-expanded a {
  display: inline-block;
  width: 100%;
  height: 24px;
  position: absolute;
  left: 0;
  color: rgba(65, 75, 85, 0.5);
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 24px;
  height: 24px;
}
.syno-ux-modulelist .x-tree-node-collapsed a span,
.syno-ux-modulelist .x-tree-node-expanded a span {
  line-height: 24px;
  display: inline-block;
  padding: 0;
  color: rgba(65, 75, 85, 0.5);
  font-size: 12px;
  margin-left: 40px;
  margin-right: 30px;
}
.syno-ux-modulelist
  .x-tree-node-collapsed.x-tree-node-not-collapsible
  .x-tree-elbow-minus,
.syno-ux-modulelist
  .x-tree-node-collapsed.x-tree-node-not-collapsible
  .x-tree-elbow-end-minus,
.syno-ux-modulelist
  .x-tree-node-collapsed.x-tree-node-not-collapsible
  .x-tree-elbow-plus,
.syno-ux-modulelist
  .x-tree-node-collapsed.x-tree-node-not-collapsible
  .x-tree-elbow-end-plus,
.syno-ux-modulelist
  .x-tree-node-expanded.x-tree-node-not-collapsible
  .x-tree-elbow-minus,
.syno-ux-modulelist
  .x-tree-node-expanded.x-tree-node-not-collapsible
  .x-tree-elbow-end-minus,
.syno-ux-modulelist
  .x-tree-node-expanded.x-tree-node-not-collapsible
  .x-tree-elbow-plus,
.syno-ux-modulelist
  .x-tree-node-expanded.x-tree-node-not-collapsible
  .x-tree-elbow-end-plus {
  display: none;
}
.syno-ux-modulelist
  .x-tree-node-collapsed.x-tree-node-not-collapsible
  .x-tree-node-text,
.syno-ux-modulelist
  .x-tree-node-expanded.x-tree-node-not-collapsible
  .x-tree-node-text {
  margin-left: 12px;
}
.syno-ux-modulelist .x-tree-node-collapsed.x-tree-node-not-collapsible *,
.syno-ux-modulelist .x-tree-node-expanded.x-tree-node-not-collapsible * {
  cursor: default;
}
.syno-ux-modulelist
  .x-tree-node-collapsed.x-tree-node-not-collapsible:hover
  a
  span,
.syno-ux-modulelist
  .x-tree-node-collapsed.x-tree-node-not-collapsible:active
  a
  span,
.syno-ux-modulelist
  .x-tree-node-expanded.x-tree-node-not-collapsible:hover
  a
  span,
.syno-ux-modulelist
  .x-tree-node-expanded.x-tree-node-not-collapsible:active
  a
  span {
  color: rgba(65, 75, 85, 0.5);
}
.syno-ux-modulelist .x-tree-node-collapsed .x-tree-elbow-minus,
.syno-ux-modulelist .x-tree-node-collapsed .x-tree-elbow-end-minus,
.syno-ux-modulelist .x-tree-node-expanded .x-tree-elbow-minus,
.syno-ux-modulelist .x-tree-node-expanded .x-tree-elbow-end-minus {
  background-position: -24px 0;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack .syno-ux-modulelist .x-tree-node-collapsed .x-tree-elbow-minus,
  .synohdpack
    .syno-ux-modulelist
    .x-tree-node-collapsed
    .x-tree-elbow-end-minus,
  .synohdpack .syno-ux-modulelist .x-tree-node-expanded .x-tree-elbow-minus,
  .synohdpack
    .syno-ux-modulelist
    .x-tree-node-expanded
    .x-tree-elbow-end-minus {
    background-size: 48px 72px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug
    .syno-ux-modulelist
    .x-tree-node-collapsed
    .x-tree-elbow-minus,
  .synohdpackdebug
    .syno-ux-modulelist
    .x-tree-node-collapsed
    .x-tree-elbow-end-minus,
  .synohdpackdebug
    .syno-ux-modulelist
    .x-tree-node-expanded
    .x-tree-elbow-minus,
  .synohdpackdebug
    .syno-ux-modulelist
    .x-tree-node-expanded
    .x-tree-elbow-end-minus {
    background-size: 48px 72px;
    outline: 1px green dashed;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack .syno-ux-modulelist .x-tree-node-collapsed .x-tree-elbow-plus,
  .synohdpack .syno-ux-modulelist .x-tree-node-collapsed .x-tree-elbow-end-plus,
  .synohdpack .syno-ux-modulelist .x-tree-node-expanded .x-tree-elbow-plus,
  .synohdpack .syno-ux-modulelist .x-tree-node-expanded .x-tree-elbow-end-plus {
    background-size: 48px 72px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug
    .syno-ux-modulelist
    .x-tree-node-collapsed
    .x-tree-elbow-plus,
  .synohdpackdebug
    .syno-ux-modulelist
    .x-tree-node-collapsed
    .x-tree-elbow-end-plus,
  .synohdpackdebug .syno-ux-modulelist .x-tree-node-expanded .x-tree-elbow-plus,
  .synohdpackdebug
    .syno-ux-modulelist
    .x-tree-node-expanded
    .x-tree-elbow-end-plus {
    background-size: 48px 72px;
    outline: 1px green dashed;
  }
}
.syno-ux-modulelist .x-tree-node-collapsed:hover a span,
.syno-ux-modulelist .x-tree-node-expanded:hover a span {
  color: rgba(65, 75, 85, 0.6);
}
.syno-ux-modulelist .x-tree-node-collapsed:hover .x-tree-elbow-minus,
.syno-ux-modulelist .x-tree-node-collapsed:hover .x-tree-elbow-end-minus,
.syno-ux-modulelist .x-tree-node-expanded:hover .x-tree-elbow-minus,
.syno-ux-modulelist .x-tree-node-expanded:hover .x-tree-elbow-end-minus {
  background-position: -24px -24px;
}
.syno-ux-modulelist .x-tree-node-collapsed:hover .x-tree-elbow-plus,
.syno-ux-modulelist .x-tree-node-collapsed:hover .x-tree-elbow-end-plus,
.syno-ux-modulelist .x-tree-node-expanded:hover .x-tree-elbow-plus,
.syno-ux-modulelist .x-tree-node-expanded:hover .x-tree-elbow-end-plus {
  background-position: 0 -24px;
}
.syno-ux-modulelist .x-tree-node-collapsed:active a span,
.syno-ux-modulelist .x-tree-node-expanded:active a span {
  color: rgba(65, 75, 85, 0.7);
}
.syno-ux-modulelist .x-tree-node-collapsed:active .x-tree-elbow-minus,
.syno-ux-modulelist .x-tree-node-collapsed:active .x-tree-elbow-end-minus,
.syno-ux-modulelist .x-tree-node-expanded:active .x-tree-elbow-minus,
.syno-ux-modulelist .x-tree-node-expanded:active .x-tree-elbow-end-minus {
  background-position: -24px -48px;
}
.syno-ux-modulelist .x-tree-node-collapsed:active .x-tree-elbow-plus,
.syno-ux-modulelist .x-tree-node-collapsed:active .x-tree-elbow-end-plus,
.syno-ux-modulelist .x-tree-node-expanded:active .x-tree-elbow-plus,
.syno-ux-modulelist .x-tree-node-expanded:active .x-tree-elbow-end-plus {
  background-position: 0 -48px;
}
.syno-ux-modulelist .x-tree-node-leaf {
  height: 42px;
  font-size: 14px;
  position: relative;
  border-radius: 5px;
}
.syno-ux-modulelist .x-tree-node-leaf a {
  display: inline-block;
  width: 100%;
  position: absolute;
  left: 0;
}
.syno-ux-modulelist .x-tree-node-leaf a span {
  padding: 0 0 0 40px;
  display: table-cell;
  line-height: 18px;
  height: 42px;
  white-space: normal;
  vertical-align: middle;
}
.syno-ux-modulelist .x-tree-node-leaf .x-tree-node-icon {
  position: absolute;
  background-position: 0 0;
  opacity: 0.9;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack .syno-ux-modulelist .x-tree-node-leaf .x-tree-node-icon {
    background-size: 24px 96px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug .syno-ux-modulelist .x-tree-node-leaf .x-tree-node-icon {
    background-size: 24px 96px;
    outline: 1px green dashed;
  }
}
.syno-ux-modulelist .x-tree-node-leaf.x-tree-node-over {
  background-color: rgba(5, 127, 235, 0.04);
}
.syno-ux-modulelist .x-tree-node-leaf.x-tree-node-over .x-tree-node-icon {
  background-position: 0 0;
}
.syno-ux-modulelist .x-tree-node-leaf.x-tree-selected {
  background-color: rgba(5, 127, 235, 0.1);
}
.syno-ux-modulelist .x-tree-node-leaf.x-tree-selected a span {
  color: #414b55;
}
.syno-ux-modulelist .x-tree-node-leaf.x-tree-selected .x-tree-node-icon {
  background-position: 0 0;
}
.syno-ux-modulelist .x-tree-node-leaf.x-tree-node-disabled .x-tree-node-icon {
  opacity: 0.4;
}
.syno-ux-modulelist .x-tree-node-ct {
  padding: 4px 0 8px 0;
}
.syno-ux-modulelist .x-tree-node-ct .x-tree-node-icon {
  opacity: 1;
}
.syno-ux-modulelist .x-tree-node-ct .x-tree-node-leaf.x-tree-node-over {
  background-color: rgba(5, 127, 235, 0.04);
}
.syno-ux-modulelist .x-tree-node-ct .x-tree-node-leaf.x-tree-selected {
  background-color: rgba(5, 127, 235, 0.1);
}
.syno-ux-modulelist .x-toolbar {
  border: none !important;
  background: none;
  padding: 0 12px;
}
.syno-ux-modulelist .x-panel-bwrap .x-panel-tbar .x-toolbar {
  padding-bottom: 0;
}
@-moz-keyframes syno-ux-count-bubble-show {
  30% {
    margin-top: 5px;
  }
  80% {
    margin-top: 25px;
  }
}
@-webkit-keyframes syno-ux-count-bubble-show {
  30% {
    margin-top: 5px;
  }
  80% {
    margin-top: 25px;
  }
}
@keyframes syno-ux-count-bubble-show {
  30% {
    margin-top: 5px;
  }
  80% {
    margin-top: 25px;
  }
}
.syno-ux-modulelist .syno-ux-count-bubble {
  right: 6px;
  margin-top: 12px;
  position: absolute;
  height: 18px;
  line-height: 18px;
  border-radius: 24px;
  text-align: center;
  font-size: 12px;
  color: #fff;
  padding: 0px 6px;
  background-color: #057feb;
}
.syno-ux-modulelist .syno-ux-count-bubble.count-bubble-hide {
  opacity: 0;
  -moz-transition: opacity 0.5s;
  -o-transition: opacity 0.5s;
  -webkit-transition: opacity 0.5s;
  transition: opacity 0.5s;
}
.syno-ux-form-check-wrap {
  position: relative;
}
.x-form-composite .syno-ux-form-check-wrap {
  position: absolute;
}
.x-form-field-trigger-wrap.x-form-field-wrap
  .syno-ux-datefield-trigger.x-form-trigger {
  background-position: 0px 1px;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack
    .x-form-field-trigger-wrap.x-form-field-wrap
    .syno-ux-datefield-trigger.x-form-trigger {
    background-size: 24px 72px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug
    .x-form-field-trigger-wrap.x-form-field-wrap
    .syno-ux-datefield-trigger.x-form-trigger {
    background-size: 24px 72px;
    outline: 1px green dashed;
  }
}
.x-form-field-trigger-wrap.x-form-field-wrap
  .syno-ux-datefield-trigger.x-form-trigger.x-form-trigger-click {
  background-position: 0px -23px;
}
.x-form-field-trigger-wrap.x-form-field-wrap.x-trigger-wrap-focus
  .syno-ux-datefield-trigger.x-form-trigger {
  background-position: 0px -23px;
}
.x-form-field-trigger-wrap.x-item-disabled
  .syno-ux-datefield-trigger.x-form-trigger {
  background-position: 0px -47px;
}
.x-form-field-trigger-wrap.x-item-disabled
  .syno-ux-datefield-trigger.x-form-trigger.x-form-trigger-over,
.x-form-field-trigger-wrap.x-item-disabled
  .syno-ux-datefield-trigger.x-form-trigger.x-form-trigger-click {
  background-position: 0px -47px !important;
}
.syno-datetimepicker-inner-menu .no-icon-space {
  width: 0px;
}
.syno-datetimepicker-inner-menu .x-menu-list {
  height: 210px;
}
.syno-ux-datefield-menu {
  border: none;
  box-shadow: 0 2px 11px 0 rgba(0, 0, 0, 0.35);
}
.syno-ux-datefield-menu .x-date-picker > table > tbody > tr:first-child td {
  padding-top: 12px;
  padding-bottom: 8px;
}
.syno-ux-datefield-menu
  .x-date-picker
  > table
  > tbody
  > tr:first-child
  td:first-child {
  padding-left: 16px;
}
.syno-ux-datefield-menu
  .x-date-picker
  > table
  > tbody
  > tr:first-child
  td:last-child {
  padding-right: 16px;
}
.syno-ux-datefield-menu .x-date-right,
.syno-ux-datefield-menu .x-date-middle,
.syno-ux-datefield-menu .x-date-left {
  background-image: none;
  height: 28px;
}
.syno-ux-datefield-menu .x-date-right a,
.syno-ux-datefield-menu .x-date-left a {
  width: 24px;
  height: 24px;
  opacity: 1;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack .syno-ux-datefield-menu .x-date-right a,
  .synohdpack .syno-ux-datefield-menu .x-date-left a {
    background-size: 48px 48px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug .syno-ux-datefield-menu .x-date-right a,
  .synohdpackdebug .syno-ux-datefield-menu .x-date-left a {
    background-size: 48px 48px;
    outline: 1px green dashed;
  }
}
.syno-ux-datefield-menu .x-date-left a {
  background-position: 0px 0px;
}
.syno-ux-datefield-menu .x-date-left a:hover {
  background-position: 0px -24px;
}
.syno-ux-datefield-menu .x-date-right a {
  background-position: -24px 0px;
}
.syno-ux-datefield-menu .x-date-right a:hover {
  background-position: -24px -24px;
}
.syno-ux-datefield-menu .x-date-middle {
  padding: 0px;
}
.syno-ux-datefield-menu .x-date-middle .x-btn button {
  height: 28px;
  font-size: 13px;
}
.syno-ux-datefield-menu .x-date-middle .x-btn-mc em.x-btn-arrow {
  background-position: right 0px;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack .syno-ux-datefield-menu .x-date-middle .x-btn-mc em.x-btn-arrow {
    background-size: 6px 112px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug
    .syno-ux-datefield-menu
    .x-date-middle
    .x-btn-mc
    em.x-btn-arrow {
    background-size: 6px 112px;
    outline: 1px green dashed;
  }
}
.syno-ux-datefield-menu .x-date-middle .x-btn-over em.x-btn-arrow {
  background-position: right -28px;
}
.syno-ux-datefield-menu .x-date-middle .x-btn-click em.x-btn-arrow {
  background-position: right -56px;
}
.syno-ux-datefield-menu table.x-date-inner {
  margin: 0px 13px 0px 17px;
  width: auto;
}
.syno-ux-datefield-menu table.x-date-inner thead th {
  width: 34px;
  height: 34px;
  background-image: none;
  background-color: white;
  border: 0px;
}
.syno-ux-datefield-menu table.x-date-inner thead th span {
  width: 28px;
  height: 28px;
  line-height: 28px;
  padding: 0px;
  text-align: center;
  color: rgba(65, 75, 85, 0.4);
}
.syno-ux-datefield-menu table.x-date-inner tbody tr td {
  height: 32px;
  width: 32px;
  border: 1px solid white;
}
.syno-ux-datefield-menu table.x-date-inner tbody tr td .x-date-date {
  background-color: transparent;
  border: 2px solid transparent;
  border-radius: 4px;
  padding: 0px;
  text-align: center;
  width: 24px;
  height: 24px;
  line-height: 24px;
}
.syno-ux-datefield-menu table.x-date-inner tbody tr td span {
  font-size: 13px;
  letter-spacing: 0px;
}
.syno-ux-datefield-menu table.x-date-inner tbody tr td.x-date-disabled span,
.syno-ux-datefield-menu table.x-date-inner tbody tr td.x-date-prevday span,
.syno-ux-datefield-menu table.x-date-inner tbody tr td.x-date-nextday span {
  color: rgba(65, 75, 85, 0.4);
}
.syno-ux-datefield-menu
  table.x-date-inner
  tbody
  tr
  td.x-date-disabled
  .x-date-date {
  background-color: transparent;
}
.syno-ux-datefield-menu
  table.x-date-inner
  tbody
  tr
  td.x-date-selected
  .x-date-date,
.syno-ux-datefield-menu
  table.x-date-inner
  tbody
  tr
  td.x-date-selected.x-date-today
  .x-date-date {
  background-color: #057feb;
  border-color: #057feb;
}
.syno-ux-datefield-menu
  table.x-date-inner
  tbody
  tr
  td.x-date-selected
  .x-date-date
  span,
.syno-ux-datefield-menu
  table.x-date-inner
  tbody
  tr
  td.x-date-selected.x-date-today
  .x-date-date
  span {
  color: white;
}
.syno-ux-datefield-menu
  table.x-date-inner
  tbody
  tr
  td.x-date-today
  .x-date-date {
  border-color: #057feb;
}
.syno-ux-datefield-menu
  table.x-date-inner
  tbody
  tr
  td.x-date-today
  .x-date-date
  span {
  color: #057feb;
}
.syno-ux-datefield-menu
  table.x-date-inner
  tbody
  tr
  td.x-date-active:hover
  .x-date-date {
  background-color: rgba(198, 212, 224, 0.4);
}
.syno-ux-datefield-menu
  table.x-date-inner
  tbody
  tr
  td.x-date-selected.x-date-active:hover
  .x-date-date {
  background-color: #057feb;
}
.syno-ux-datefield-menu
  table.x-date-inner
  tbody
  tr
  td.x-date-selected.x-date-active:hover
  .x-date-date
  span {
  color: white;
}
.syno-ux-datefield-menu
  table.x-date-inner
  tbody
  tr
  td.x-date-view-selected:not(.x-date-selected):not(.x-date-today)
  .x-date-date {
  background-color: rgba(198, 212, 224, 0.4);
}
.syno-ux-datefield-menu .x-date-bottom {
  background-image: none;
  background-color: transparent;
  border-top: none;
  padding: 6px 16px 12px 16px;
}
.syno-ux-datefield-menu .x-date-bottom table.x-btn {
  display: inline-block;
}
.syno-ux-datefield-menu .x-date-bottom .today-btn {
  float: left;
}
.syno-ux-datefield-menu .x-date-bottom .clear-btn {
  float: right;
}
.syno-ux-datefield-menu .x-date-bottom .x-btn-ml,
.syno-ux-datefield-menu .x-date-bottom .x-btn-mc,
.syno-ux-datefield-menu .x-date-bottom .x-btn-mr {
  background-image: none;
}
.syno-ux-datefield-menu .x-date-bottom .x-btn-noicon .x-btn-small button {
  width: 70px;
  height: 24px;
  border-radius: 3px;
  border: solid 1px #c8d2dc;
  background-size: 100%;
  background-image: -webkit-gradient(
    linear,
    50% 0%,
    50% 100%,
    color-stop(0%, #f5faff),
    color-stop(100%, rgba(198, 212, 224, 0.4))
  );
  background-image: -moz-linear-gradient(#f5faff, rgba(198, 212, 224, 0.4));
  background-image: -webkit-linear-gradient(#f5faff, rgba(198, 212, 224, 0.4));
  background-image: linear-gradient(#f5faff, rgba(198, 212, 224, 0.4));
  background-color: rgba(198, 212, 224, 0.4);
}
.syno-ux-datefield-menu
  .x-date-bottom
  .x-btn-over.x-btn-noicon
  .x-btn-small
  button {
  border: solid 1px #b4bec8;
  background-size: 100%;
  background-image: -webkit-gradient(
    linear,
    50% 0%,
    50% 100%,
    color-stop(0%, #f5faff),
    color-stop(100%, #e7ecf1)
  );
  background-image: -moz-linear-gradient(#f5faff, #e7ecf1);
  background-image: -webkit-linear-gradient(#f5faff, #e7ecf1);
  background-image: linear-gradient(#f5faff, #e7ecf1);
  background-color: #e7ecf1;
}
.syno-ux-datefield-menu
  .x-date-bottom
  .x-btn-click.x-btn-noicon
  .x-btn-small
  button {
  border: solid 1px #b4bec8;
  background-size: 100%;
  background-image: -webkit-gradient(
    linear,
    50% 0%,
    50% 100%,
    color-stop(0%, rgba(198, 212, 224, 0.4)),
    color-stop(100%, #e1e6eb)
  );
  background-image: -moz-linear-gradient(rgba(198, 212, 224, 0.4), #e1e6eb);
  background-image: -webkit-linear-gradient(rgba(198, 212, 224, 0.4), #e1e6eb);
  background-image: linear-gradient(rgba(198, 212, 224, 0.4), #e1e6eb);
  background-color: #e1e6eb;
}
.ext-ie9 .syno-ux-datefield-menu .x-date-picker,
.ext-ie8 .syno-ux-datefield-menu .x-date-picker {
  width: auto !important;
}
.ext-ie9 .syno-ux-datefield-menu .x-date-picker .x-date-mp,
.ext-ie8 .syno-ux-datefield-menu .x-date-picker .x-date-mp {
  width: auto !important;
}
.syno-ux-datefield-menu .x-date-mp {
  background-color: #fff;
}
.syno-ux-datefield-menu .x-date-mp tr td a {
  width: 50px;
  height: 24px;
  line-height: 24px;
  padding: 0px;
  font-size: 13px;
  border: 0px;
}
.syno-ux-datefield-menu .x-date-mp tr td.x-date-mp-sel a {
  color: white;
  background-image: none;
}
.syno-ux-datefield-menu .x-date-mp-year {
  padding-left: 6px;
  padding-right: 0px;
}
.syno-ux-datefield-menu .x-date-mp-month {
  padding-right: 6px;
  padding-left: 0px;
}
.syno-ux-datefield-menu .x-date-mp-ybtn .x-date-mp-prev,
.syno-ux-datefield-menu .x-date-mp-ybtn .x-date-mp-next {
  width: 24px;
  height: 24px;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack .syno-ux-datefield-menu .x-date-mp-ybtn .x-date-mp-prev,
  .synohdpack .syno-ux-datefield-menu .x-date-mp-ybtn .x-date-mp-next {
    background-size: 24px 192px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug .syno-ux-datefield-menu .x-date-mp-ybtn .x-date-mp-prev,
  .synohdpackdebug .syno-ux-datefield-menu .x-date-mp-ybtn .x-date-mp-next {
    background-size: 24px 192px;
    outline: 1px green dashed;
  }
}
.syno-ux-datefield-menu .x-date-mp-ybtn .x-date-mp-prev {
  background-position: 0px 0px;
}
.syno-ux-datefield-menu .x-date-mp-ybtn .x-date-mp-prev:hover {
  background-position: 0px -24px;
}
.syno-ux-datefield-menu .x-date-mp-ybtn .x-date-mp-next {
  background-position: 0px -96px;
}
.syno-ux-datefield-menu .x-date-mp-ybtn .x-date-mp-next:hover {
  background-position: 0px -120px;
}
.syno-ux-datefield-menu .x-date-mp-btns {
  background-image: none;
  background-color: white;
}
.syno-ux-datefield-menu .x-date-mp-btns td {
  border-top: 1px solid rgba(198, 212, 224, 0.7);
  padding: 0px;
  height: 37px;
}
.syno-ux-datefield-menu .x-date-mp-btns button {
  width: 70px;
  height: 24px;
  border-radius: 3px;
}
.syno-ux-datefield-menu .x-date-mp-btns button.x-date-mp-ok {
  margin-right: 10px;
  border: solid 1px #1687d9;
  background-size: 100%;
  background-image: -webkit-gradient(
    linear,
    50% 0%,
    50% 100%,
    color-stop(0%, #32aaff),
    color-stop(100%, #1994eb)
  );
  background-image: -moz-linear-gradient(#32aaff, #1994eb);
  background-image: -webkit-linear-gradient(#32aaff, #1994eb);
  background-image: linear-gradient(#32aaff, #1994eb);
  background-color: #1994eb;
  color: #fff;
}
.syno-ux-datefield-menu .x-date-mp-btns button.x-date-mp-ok:hover {
  border: solid 1px #0077cc;
  background-size: 100%;
  background-image: -webkit-gradient(
    linear,
    50% 0%,
    50% 100%,
    color-stop(0%, #25a4ff),
    color-stop(100%, #028aeb)
  );
  background-image: -moz-linear-gradient(#25a4ff, #028aeb);
  background-image: -webkit-linear-gradient(#25a4ff, #028aeb);
  background-image: linear-gradient(#25a4ff, #028aeb);
  background-color: #028aeb;
}
.syno-ux-datefield-menu .x-date-mp-btns button.x-date-mp-cancel {
  border: solid 1px #c8d2dc;
  background-size: 100%;
  background-image: -webkit-gradient(
    linear,
    50% 0%,
    50% 100%,
    color-stop(0%, #f5faff),
    color-stop(100%, rgba(198, 212, 224, 0.4))
  );
  background-image: -moz-linear-gradient(#f5faff, rgba(198, 212, 224, 0.4));
  background-image: -webkit-linear-gradient(#f5faff, rgba(198, 212, 224, 0.4));
  background-image: linear-gradient(#f5faff, rgba(198, 212, 224, 0.4));
  background-color: rgba(198, 212, 224, 0.4);
}
.syno-ux-datefield-menu .x-date-mp-btns button.x-date-mp-cancel:hover {
  border: solid 1px #b4bec8;
  background-size: 100%;
  background-image: -webkit-gradient(
    linear,
    50% 0%,
    50% 100%,
    color-stop(0%, #f5faff),
    color-stop(100%, #e7ecf1)
  );
  background-image: -moz-linear-gradient(#f5faff, #e7ecf1);
  background-image: -webkit-linear-gradient(#f5faff, #e7ecf1);
  background-image: linear-gradient(#f5faff, #e7ecf1);
  background-color: #e7ecf1;
}
.syno-ux-datefield-menu .year-btn-ct,
.syno-ux-datefield-menu .month-btn-ct {
  display: inline-block;
}
.syno-ux-datefield-menu .year-btn-ct .syno-ux-button.x-btn,
.syno-ux-datefield-menu .month-btn-ct .syno-ux-button.x-btn {
  height: 24px;
  border: none;
  padding: 0px;
  background: none;
}
.syno-ux-datefield-menu .year-btn-ct .syno-ux-button.x-btn .x-btn-arrow,
.syno-ux-datefield-menu .month-btn-ct .syno-ux-button.x-btn .x-btn-arrow {
  padding-right: 24px;
  background-position: right 0px;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack
    .syno-ux-datefield-menu
    .year-btn-ct
    .syno-ux-button.x-btn
    .x-btn-arrow,
  .synohdpack
    .syno-ux-datefield-menu
    .month-btn-ct
    .syno-ux-button.x-btn
    .x-btn-arrow {
    background-size: 24px 72px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug
    .syno-ux-datefield-menu
    .year-btn-ct
    .syno-ux-button.x-btn
    .x-btn-arrow,
  .synohdpackdebug
    .syno-ux-datefield-menu
    .month-btn-ct
    .syno-ux-button.x-btn
    .x-btn-arrow {
    background-size: 24px 72px;
    outline: 1px green dashed;
  }
}
.syno-ux-datefield-menu .year-btn-ct .syno-ux-button.x-btn em button,
.syno-ux-datefield-menu .month-btn-ct .syno-ux-button.x-btn em button {
  padding: 0px;
  font-size: 13px;
  letter-spacing: 0;
  line-height: 24px;
}
.syno-ux-datefield-menu .year-btn-ct .syno-ux-button.x-btn-over .x-btn-arrow,
.syno-ux-datefield-menu
  .year-btn-ct
  .syno-ux-button.x-btn-menu-active
  .x-btn-arrow,
.syno-ux-datefield-menu .month-btn-ct .syno-ux-button.x-btn-over .x-btn-arrow,
.syno-ux-datefield-menu
  .month-btn-ct
  .syno-ux-button.x-btn-menu-active
  .x-btn-arrow {
  background-position: right -24px;
}
.syno-ux-datefield-menu .year-btn-ct .syno-ux-button.x-btn-over em button,
.syno-ux-datefield-menu
  .year-btn-ct
  .syno-ux-button.x-btn-menu-active
  em
  button,
.syno-ux-datefield-menu .month-btn-ct .syno-ux-button.x-btn-over em button,
.syno-ux-datefield-menu
  .month-btn-ct
  .syno-ux-button.x-btn-menu-active
  em
  button {
  color: #057feb;
}
.syno-ux-datefield-menu .year-btn-ct .syno-ux-button {
  margin-right: 10px !important;
}
.syno-ux-datefield-menu .clear-btn,
.syno-ux-datefield-menu .today-btn {
  height: 28px;
  border: none;
  background: rgba(198, 212, 224, 0.4);
  border-radius: 100px;
}
.syno-ux-datefield-menu .clear-btn button.x-btn-text,
.syno-ux-datefield-menu .today-btn button.x-btn-text {
  height: 28px;
  padding: 0px 14px;
}
.syno-ux-datefield-menu .timefield-ct {
  border-top: 1px solid rgba(198, 212, 224, 0.35);
  padding: 0px 16px 16px 16px;
}
.syno-ux-timepickerfield .add-time-ct,
.syno-ux-timepickerfield .time-ct {
  margin-top: 8px;
}
.syno-ux-timepickerfield .x-form-item {
  margin-bottom: 0;
}
.syno-ux-timepickerfield .seperator {
  text-align: center;
}
.syno-ux-textarea {
  font-size: 13px;
  background-color: #fff;
  border-radius: 4px;
}
.syno-ux-textarea.x-form-field {
  padding: 3px 17px 3px 11px;
  background-image: none;
  border-color: rgba(198, 212, 224, 0.7);
  height: 20px;
  vertical-align: top;
}
.syno-ux-textarea.syno-ux-textarea-hover {
  border-color: rgba(124, 138, 152, 0.5);
}
.syno-ux-textarea.x-form-focus {
  border-color: #057feb;
}
.syno-ux-textarea.x-form-invalid {
  border-color: #e64040;
  background-color: rgba(230, 64, 64, 0.08);
  background-image: none;
}
.syno-ux-textarea.x-item-disabled.x-form-field {
  color: rgba(65, 75, 85, 0.4);
  border-color: rgba(198, 212, 224, 0.7);
  background-color: rgba(198, 212, 224, 0.2);
}
.syno-ux-form-fleXcroll-wrap {
  position: relative;
  display: inline-block;
}
.syno-ux-form-fleXcroll-wrap .syno-ux-form-fleXcroll-element {
  position: absolute;
  right: 0px;
  top: 0px;
  width: 10px;
}
.syno-ux-form-fleXcroll-wrap
  .syno-ux-form-fleXcroll-element
  .syno-ux-form-fleXcroll-inner-element {
  width: 10px;
}
.syno-ux-form-fleXcroll-wrap .vscroller {
  margin-left: -11px;
}
.syno-ux-textarea {
  line-height: 20px;
}
.syno-ux-textarea::-webkit-input-placeholder {
  line-height: 20px;
  color: rgba(65, 75, 85, 0.4);
}
.syno-ux-textarea:-moz-placeholder {
  line-height: 20px;
  color: rgba(65, 75, 85, 0.4);
}
.syno-ux-textarea::-moz-placeholder {
  line-height: 20px;
  color: rgba(65, 75, 85, 0.4);
}
.syno-ux-textarea:-ms-input-placeholder {
  line-height: 20px;
  color: rgba(65, 75, 85, 0.4);
}
.x-form-grow-sizer {
  padding: 2px 0;
  line-height: 20px;
}
.syno-textfilter .x-form-field-wrap,
.syno-ux-textfilter .x-form-field-wrap {
  border: 1px solid rgba(198, 212, 224, 0.7);
  border-radius: 4px;
  background-color: #fff;
  background-image: none;
}
.syno-textfilter .x-form-field-trigger-wrap.x-form-field-wrap,
.syno-ux-textfilter .x-form-field-trigger-wrap.x-form-field-wrap {
  box-shadow: none;
}
.syno-textfilter .x-form-field-wrap:hover,
.syno-ux-textfilter .x-form-field-wrap:hover {
  border-color: rgba(124, 138, 152, 0.5);
}
.syno-textfilter .x-trigger-wrap-focus.x-form-field-wrap,
.syno-ux-textfilter .x-trigger-wrap-focus.x-form-field-wrap {
  border-color: #057feb;
}
.syno-textfilter .x-item-disabled.x-form-field-wrap,
.syno-ux-textfilter .x-item-disabled.x-form-field-wrap {
  color: rgba(65, 75, 85, 0.4);
  border-color: rgba(198, 212, 224, 0.7);
  background-color: rgba(198, 212, 224, 0.2);
}
.syno-textfilter .x-form-field-wrap div,
.syno-ux-textfilter .x-form-field-wrap div {
  background-color: transparent;
}
.syno-textfilter .x-form-field-wrap .syno-textfilter-text,
.syno-ux-textfilter .x-form-field-wrap .syno-ux-textfilter-text.x-form-text {
  font-size: 13px;
  height: 24px !important;
  padding: 1px 12px 1px 33px;
  border: none;
  background-color: transparent;
  background-position: 5px 1px;
  background-repeat: no-repeat;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack .syno-textfilter .x-form-field-wrap .syno-textfilter-text,
  .syno-textfilter .x-form-field-wrap .synohdpack .syno-textfilter-text,
  .synohdpack
    .syno-ux-textfilter
    .x-form-field-wrap
    .syno-ux-textfilter-text.x-form-text,
  .syno-ux-textfilter
    .x-form-field-wrap
    .synohdpack
    .syno-ux-textfilter-text.x-form-text {
    background-size: 24px 96px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug .syno-textfilter .x-form-field-wrap .syno-textfilter-text,
  .syno-textfilter .x-form-field-wrap .synohdpackdebug .syno-textfilter-text,
  .synohdpackdebug
    .syno-ux-textfilter
    .x-form-field-wrap
    .syno-ux-textfilter-text.x-form-text,
  .syno-ux-textfilter
    .x-form-field-wrap
    .synohdpackdebug
    .syno-ux-textfilter-text.x-form-text {
    background-size: 24px 96px;
    outline: 1px green dashed;
  }
}
.syno-textfilter .x-form-field-wrap .x-form-empty-field.syno-textfilter-text,
.syno-ux-textfilter
  .x-form-field-wrap
  .x-form-empty-field.syno-ux-textfilter-text.x-form-text {
  color: rgba(65, 75, 85, 0.4);
}
.syno-textfilter .x-form-field-wrap .syno-textfilter-trigger,
.syno-ux-textfilter .x-form-field-wrap .syno-ux-textfilter-trigger {
  width: 24px;
  height: 24px;
  background-position: 0px 0px;
  background-repeat: no-repeat;
  right: 0px;
  margin: 1px 3px;
  border: none;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
  opacity: 0.4;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack .syno-textfilter .x-form-field-wrap .syno-textfilter-trigger,
  .syno-textfilter .x-form-field-wrap .synohdpack .syno-textfilter-trigger,
  .synohdpack
    .syno-ux-textfilter
    .x-form-field-wrap
    .syno-ux-textfilter-trigger,
  .syno-ux-textfilter
    .x-form-field-wrap
    .synohdpack
    .syno-ux-textfilter-trigger {
    background-size: 24px 24px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug .syno-textfilter .x-form-field-wrap .syno-textfilter-trigger,
  .syno-textfilter .x-form-field-wrap .synohdpackdebug .syno-textfilter-trigger,
  .synohdpackdebug
    .syno-ux-textfilter
    .x-form-field-wrap
    .syno-ux-textfilter-trigger,
  .syno-ux-textfilter
    .x-form-field-wrap
    .synohdpackdebug
    .syno-ux-textfilter-trigger {
    background-size: 24px 24px;
    outline: 1px green dashed;
  }
}
.syno-textfilter
  .x-form-field-wrap
  .x-form-trigger-over.syno-textfilter-trigger,
.syno-ux-textfilter
  .x-form-field-wrap
  .x-form-trigger-over.syno-ux-textfilter-trigger {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
  opacity: 0.7;
}
.syno-textfilter
  .x-form-field-wrap
  .x-form-trigger-click.syno-textfilter-trigger,
.syno-ux-textfilter
  .x-form-field-wrap
  .x-form-trigger-click.syno-ux-textfilter-trigger {
  filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
  opacity: 1;
}
.syno-textfilter .x-form-field-wrap.x-item-disabled .syno-textfilter-text,
.syno-textfilter .x-form-field-wrap.x-item-disabled .syno-textfilter-trigger {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
  opacity: 0.4;
}
.syno-ux-textfilter
  .x-form-field-wrap
  .syno-ux-textfilter-text.x-form-text.syno-ux-textfilter-filter-icon {
  background-position: 5px -23px;
}
.syno-ux-textfilter
  .x-form-field-wrap.x-item-disabled
  .x-form-field-wrap-center-img {
  background-position: 0 -71px;
}
.syno-ux-textfilter
  .x-form-field-wrap.x-item-disabled
  .x-form-field-wrap-center-img:hover {
  background-position: 0 -71px;
}
.syno-ux-textfilter .x-form-field-wrap.x-item-disabled .syno-ux-textfilter-text,
.syno-ux-textfilter
  .x-form-field-wrap.x-item-disabled
  .syno-ux-textfilter-trigger {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
  opacity: 0.4;
}
.syno-ux-textfilter.syno-ux-searchfield .x-form-field-wrap {
  background-image: none;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack .syno-ux-textfilter.syno-ux-searchfield .x-form-field-wrap {
    background-image: none;
  }
}
.syno-ux-textfilter.syno-ux-searchfield
  .x-form-field-wrap
  .syno-ux-textfilter-text.x-form-text {
  background-image: none;
  padding-left: 0;
  margin-left: 2px;
  display: block;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack
    .syno-ux-textfilter.syno-ux-searchfield
    .x-form-field-wrap
    .syno-ux-textfilter-text.x-form-text {
    background-image: none;
  }
}
.syno-ux-textfilter.syno-ux-searchfield
  .x-form-field-wrap
  .x-form-field-wrap-center-img {
  width: 32px;
  height: 24px;
  background-position: 0px 1px;
  background-repeat: no-repeat;
  padding-top: 1px;
  padding-bottom: 1px;
  display: table-cell;
  cursor: pointer;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack
    .syno-ux-textfilter.syno-ux-searchfield
    .x-form-field-wrap
    .x-form-field-wrap-center-img {
    background-size: 32px 72px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug
    .syno-ux-textfilter.syno-ux-searchfield
    .x-form-field-wrap
    .x-form-field-wrap-center-img {
    background-size: 32px 72px;
    outline: 1px green dashed;
  }
}
.syno-ux-textfilter.syno-ux-searchfield
  .x-form-field-wrap
  .x-form-field-wrap-center-img:hover {
  background-position: 0px -23px;
}
.syno-ux-textfilter.syno-ux-searchfield
  .x-form-field-wrap
  .x-form-field-wrap-center-img.active {
  background-position: 0px -47px;
}
.syno-search-condition-focus-el {
  position: absolute;
  width: 2px;
  height: 2px;
  left: 0px;
  top: 0px;
  background-color: transparent;
  border: none;
}
input[type="file"]::-webkit-file-upload-button {
  cursor: pointer;
}
.syno-ux-filebutton {
  filter: Alpha(opacity=0);
  opacity: 0;
  position: absolute !important;
  padding: 0px;
  border: none;
  z-index: 10;
  pointer-events: none;
}
.ext-ie .syno-ux-filebutton {
  font-size: 1000px;
}
.syno-ux-filebutton.x-item-disabled {
  filter: Alpha(opacity=0) !important;
  opacity: 0 !important;
}
.syno-ux-filebutton-btn-wrap {
  display: inline-block;
}
.syno-ux-filebutton-txt {
  vertical-align: top;
}
.x-form-item .x-form-element .syno-ux-filebutton-btn-wrap .syno-ux-button {
  margin-bottom: 0px;
}
.syno-ux-formpanel .x-panel-body {
  padding: 8px 8px 0 8px;
}
.syno-ux-formpanel .x-panel-tbar .x-toolbar {
  background-image: none;
  background-color: transparent;
  border-bottom: 1px solid rgba(198, 212, 224, 0.4);
}
.syno-ux-formpanel .x-panel-btns td.x-toolbar-cell {
  padding-right: 8px;
  padding-left: 0px;
}
.syno-ux-formpanel .x-form-element {
  font-size: 0;
}
.syno-ux-formpanel .syno-ux-item-label.x-item-disabled {
  color: rgba(65, 75, 85, 0.4);
}
.syno-ux-tab-panel .syno-ux-formpanel {
  background-color: white;
}
.syno-ux-tab-panel
  .x-tab-strip-top
  .x-tab-strip-active
  .x-tab-right
  span.x-tab-strip-text {
  padding-bottom: 0;
}
.syno-ux-tab-panel .x-tab-strip-wrap {
  position: relative;
}
.syno-ux-tab-panel .x-tab-strip-wrap::before {
  content: "";
  width: 100%;
  height: 0;
  position: absolute;
  bottom: 0px;
  border-bottom: 1px solid rgba(198, 212, 224, 0.7);
}
.syno-ux-tab-panel .x-tab-strip-top {
  position: relative;
  border: none;
}
.syno-ux-tab-panel .x-tab-strip-top .x-tab-left {
  padding: 0;
}
.syno-ux-tab-panel .x-tab-strip-top .x-tab-right {
  padding: 0;
}
.syno-ux-tab-panel .x-tab-strip-top .x-tab-strip-text {
  height: 22px;
  line-height: 22px;
  font-size: 12px;
  padding: 0 8px;
}
.syno-ux-tab-panel .x-tab-strip-top li {
  display: flex;
  justify-content: center;
  height: 30px;
  box-sizing: border-box;
  border-bottom: 0px;
  margin: 0 8px 0 0;
}
.syno-ux-tab-panel .x-tab-strip-top li.x-tab-strip-active::before {
  content: "";
  position: absolute;
  background-color: #fff;
  transform: rotate(45deg);
  width: 9px;
  height: 9px;
  border-width: 1px 0 0 1px;
  border-style: solid;
  border-color: rgba(198, 212, 224, 0.7);
  bottom: -5px;
}
.syno-ux-tab-panel .x-tab-strip-top li.x-tab-strip-active::after {
  content: "";
}
.syno-ux-tab-panel .x-tab-strip-top li.x-tab-strip-active .x-tab-strip-text {
  padding: 0 8px;
  font-size: 12px;
  color: #057feb;
}
.syno-ux-tab-panel
  .x-tab-strip-top
  li.x-tab-strip-active.x-tab-strip-closable
  .x-tab-strip-text {
  padding: 0 0 0 8px;
}
.syno-ux-tab-panel .x-tab-strip-top .x-tab-right,
.syno-ux-tab-panel .x-tab-strip-top .x-tab-left,
.syno-ux-tab-panel .x-tab-strip-top .x-tab-strip-inner {
  background-image: none;
}
.syno-ux-tab-panel .x-tab-strip-top .x-tab-strip-closable {
  width: auto !important;
  text-align: left !important;
  padding: 0 34px 0 0;
}
.syno-ux-tab-panel .x-tab-strip-top .x-tab-strip-closable .x-tab-strip-text {
  width: auto !important;
  padding: 0 0 0 8px;
}
.syno-ux-tab-panel
  .x-tab-strip-top
  .x-tab-strip-closable.x-tab-strip-over
  a.x-tab-strip-close {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
  opacity: 0.7;
  background-position: 0 -1px;
}
.syno-ux-tab-panel .x-tab-strip-top .x-tab-strip-closable a.x-tab-strip-close {
  top: 0px;
  right: 4px;
  width: 24px;
  height: 22px;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=30);
  opacity: 0.3;
  background-position: 0 -1px;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack
    .syno-ux-tab-panel
    .x-tab-strip-top
    .x-tab-strip-closable
    a.x-tab-strip-close {
    background-size: 24px 24px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug
    .syno-ux-tab-panel
    .x-tab-strip-top
    .x-tab-strip-closable
    a.x-tab-strip-close {
    background-size: 24px 24px;
    outline: 1px green dashed;
  }
}
.syno-ux-tab-panel
  .x-tab-strip-top
  .x-tab-strip-closable
  a.x-tab-strip-close:active {
  filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
  opacity: 1;
  background-position: 0 -1px;
}
.syno-ux-tab-panel .x-tab-strip-top .x-tab-strip-closable.x-tab-strip-active {
  padding: 0 34px 0 0;
}
.syno-ux-tab-panel .x-tab-strip-spacer {
  display: none;
}
.syno-ux-tab-panel .x-tab-panel-body {
  background-color: transparent;
  border: none;
}
.syno-ux-gridpanel.syno-ux-horizontal-grid .hscrollerbar {
  visibility: hidden !important;
}
.syno-ux-fixcol-grid .x-panel-tbar .x-toolbar-layout-ct,
.syno-ux-fixcol-grid .x-panel-tbar-noheader .x-toolbar-layout-ct,
.syno-ux-fixcol-grid .x-panel-tbar-noborder .x-toolbar-layout-ct {
  padding: 0px 0px 8px 0px;
  padding-bottom: 8px;
  background-image: none;
  background-color: transparent;
  border: 0px;
}
.syno-ux-fixcol-grid .syno-ux-fixcol-grid-west .x-grid3-header-offset {
  padding-left: 0;
}
.syno-ux-fixcol-grid
  .syno-ux-fixcol-grid-west
  .x-panel-bwrap
  .x-panel-body
  .x-grid3-scroller {
  padding-right: 0px;
}
.syno-ux-fixcol-grid .syno-ux-fixcol-grid-west .vscrollerbar {
  visibility: hidden !important;
}
.syno-ux-fixcol-grid .x-layout-split-west {
  margin-left: -1px;
  width: 1px;
}
.syno-ux-fixcol-grid .syno-ux-horizontal-grid {
  margin-left: -1px;
}
.syno-ux-editorgridpanel
  .x-grid3-row
  .syno-ux-triggerfield.x-grid3-cell
  .x-grid3-cell-inner,
.syno-ux-editorgridpanel
  .x-grid3-row
  .syno-ux-triggerfield.x-grid3-cell-last-visible
  .x-grid3-cell-inner {
  padding-left: 12px;
  padding-top: 1px;
  padding-bottom: 1px;
  line-height: 24px;
  margin-left: 8px;
  margin-right: 8px;
}
.syno-ux-editorgridpanel
  .x-grid3-row
  .syno-ux-textfield.x-grid3-cell
  .x-grid3-cell-inner,
.syno-ux-editorgridpanel
  .x-grid3-row
  .syno-ux-textfield.x-grid3-cell-last-visible
  .x-grid3-cell-inner {
  padding-left: 12px;
  padding-top: 1px;
  padding-right: 12px;
  padding-bottom: 1px;
  line-height: 24px;
  margin-left: 8px;
  margin-right: 8px;
}
.syno-ux-grid-enable-column-checked {
  height: 20px;
  margin-top: 4px;
  background-repeat: no-repeat;
  background-position: center -60px;
}
.syno-ux-grid-enable-column-checked:hover {
  background-position: center -80px;
}
.syno-ux-grid-enable-column-unchecked {
  height: 20px;
  margin-top: 4px;
  background-repeat: no-repeat;
  background-position: center 0px;
}
.syno-ux-grid-enable-column-unchecked:hover {
  background-position: center -20px;
}
.syno-ux-grid-enable-column-grayed {
  height: 20px;
  margin-top: 4px;
  background-repeat: no-repeat;
  background-position: center -120px;
}
.syno-ux-grid-enable-column-grayed:hover {
  background-position: center -140px;
}
.syno-ux-checkbox-icon:hover {
  background-position: 0px -20px;
}
.syno-ux-checkbox-icon:hover.syno-ux-cb-disabled {
  background-position: 0px -40px;
}
.syno-ux-checkbox-icon:hover.syno-ux-cb-checked {
  background-position: 0px -80px;
}
.syno-ux-checkbox-icon:hover.syno-ux-cb-checked.syno-ux-cb-disabled {
  background-position: 0px -100px;
}
.syno-ux-checkbox-icon:hover.syno-ux-cb-grayed {
  background-position: 0px -140px;
}
.syno-ux-checkbox-icon:hover.syno-ux-cb-grayed.syno-ux-cb-disabled {
  background-position: 0px -160px;
}
.syno-ux-grid-enable-column-disabled,
.syno-ux-grid-enable-column-disabled-unchecked {
  height: 20px;
  margin-top: 4px;
  background-repeat: no-repeat;
  background-position: center -40px;
}
.syno-ux-grid-enable-column-disabled-checked {
  height: 20px;
  margin-top: 4px;
  background-repeat: no-repeat;
  background-position: center -100px;
}
.x-panel-noborder .x-panel-bbar-noborder.x-panel-bbar .syno-ux-pagingtoolbar {
  border-top-color: rgba(198, 212, 224, 0.4);
  border-bottom: 1px solid rgba(198, 212, 224, 0.7);
  padding: 0px;
  height: 28px;
}
.x-panel-noborder
  .x-panel-bbar-noborder.x-panel-bbar
  .syno-ux-pagingtoolbar
  .x-toolbar-cell
  .x-btn {
  margin: 0px;
}
.syno-ux-pagingtoolbar {
  background-color: transparent;
  background-image: none;
  line-height: 24px;
}
.syno-ux-pagingtoolbar .x-toolbar-right,
.syno-ux-pagingtoolbar .x-toolbar-left {
  padding: 2px 0;
}
.syno-ux-pagingtoolbar.small-vertical-padding .x-toolbar-right {
  padding: 1px 0;
}
.syno-ux-pagingtoolbar.small-vertical-padding
  .x-toolbar-right
  .syno-ux-combobox-trigger {
  background-position: 0 0;
}
.syno-ux-pagingtoolbar .x-toolbar-right .x-toolbar-cell .xtb-text {
  padding: 0px 12px 0px 2px;
  font-size: 13px;
  height: 24px;
  line-height: 24px;
}
.syno-ux-pagingtoolbar
  .x-toolbar-right
  .x-toolbar-cell
  .xtb-text.syno-paging-display-text {
  padding-left: 12px;
}
.syno-ux-pagingtoolbar .xtb-sep {
  height: 20px;
  background-image: none;
  border-left: 1px solid rgba(198, 212, 224, 0.7);
  width: 0px;
  margin: 0px;
}
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-tl,
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-tc,
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-tr,
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-bl,
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-bc,
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-br,
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-small .x-btn-tl,
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-small .x-btn-tc,
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-small .x-btn-tr,
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-small .x-btn-bl,
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-small .x-btn-bc,
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-small .x-btn-br,
.syno-ux-pagingtoolbar .x-btn-icon.x-item-disabled .x-btn-tl,
.syno-ux-pagingtoolbar .x-btn-icon.x-item-disabled .x-btn-tc,
.syno-ux-pagingtoolbar .x-btn-icon.x-item-disabled .x-btn-tr,
.syno-ux-pagingtoolbar .x-btn-icon.x-item-disabled .x-btn-bl,
.syno-ux-pagingtoolbar .x-btn-icon.x-item-disabled .x-btn-bc,
.syno-ux-pagingtoolbar .x-btn-icon.x-item-disabled .x-btn-br,
.syno-ux-pagingtoolbar .x-btn-icon.x-item-disabled .x-btn-small .x-btn-tl,
.syno-ux-pagingtoolbar .x-btn-icon.x-item-disabled .x-btn-small .x-btn-tc,
.syno-ux-pagingtoolbar .x-btn-icon.x-item-disabled .x-btn-small .x-btn-tr,
.syno-ux-pagingtoolbar .x-btn-icon.x-item-disabled .x-btn-small .x-btn-bl,
.syno-ux-pagingtoolbar .x-btn-icon.x-item-disabled .x-btn-small .x-btn-bc,
.syno-ux-pagingtoolbar .x-btn-icon.x-item-disabled .x-btn-small .x-btn-br {
  display: none;
}
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-tl,
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-tr,
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-ml,
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-mr,
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-bl,
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-br,
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-small .x-btn-tl,
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-small .x-btn-tr,
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-small .x-btn-ml,
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-small .x-btn-mr,
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-small .x-btn-bl,
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-small .x-btn-br,
.syno-ux-pagingtoolbar .x-btn-icon.x-item-disabled .x-btn-tl,
.syno-ux-pagingtoolbar .x-btn-icon.x-item-disabled .x-btn-tr,
.syno-ux-pagingtoolbar .x-btn-icon.x-item-disabled .x-btn-ml,
.syno-ux-pagingtoolbar .x-btn-icon.x-item-disabled .x-btn-mr,
.syno-ux-pagingtoolbar .x-btn-icon.x-item-disabled .x-btn-bl,
.syno-ux-pagingtoolbar .x-btn-icon.x-item-disabled .x-btn-br,
.syno-ux-pagingtoolbar .x-btn-icon.x-item-disabled .x-btn-small .x-btn-tl,
.syno-ux-pagingtoolbar .x-btn-icon.x-item-disabled .x-btn-small .x-btn-tr,
.syno-ux-pagingtoolbar .x-btn-icon.x-item-disabled .x-btn-small .x-btn-ml,
.syno-ux-pagingtoolbar .x-btn-icon.x-item-disabled .x-btn-small .x-btn-mr,
.syno-ux-pagingtoolbar .x-btn-icon.x-item-disabled .x-btn-small .x-btn-bl,
.syno-ux-pagingtoolbar .x-btn-icon.x-item-disabled .x-btn-small .x-btn-br {
  display: none;
}
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-mc,
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-small .x-btn-mc,
.syno-ux-pagingtoolbar .x-btn-icon.x-item-disabled .x-btn-mc,
.syno-ux-pagingtoolbar .x-btn-icon.x-item-disabled .x-btn-small .x-btn-mc {
  line-height: 0;
}
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-text,
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-small .x-btn-text,
.syno-ux-pagingtoolbar .x-btn-icon.x-item-disabled .x-btn-text,
.syno-ux-pagingtoolbar .x-btn-icon.x-item-disabled .x-btn-small .x-btn-text {
  margin-right: 4px;
}
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-text.x-tbar-page-first,
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-small .x-btn-text.x-tbar-page-first,
.syno-ux-pagingtoolbar
  .x-btn-icon.x-item-disabled
  .x-btn-text.x-tbar-page-first,
.syno-ux-pagingtoolbar
  .x-btn-icon.x-item-disabled
  .x-btn-small
  .x-btn-text.x-tbar-page-first {
  margin-left: 8px;
}
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-text.x-tbar-loading,
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-small .x-btn-text.x-tbar-loading,
.syno-ux-pagingtoolbar .x-btn-icon.x-item-disabled .x-btn-text.x-tbar-loading,
.syno-ux-pagingtoolbar
  .x-btn-icon.x-item-disabled
  .x-btn-small
  .x-btn-text.x-tbar-loading {
  margin-right: 8px;
  margin-left: 4px;
}
.syno-ux-pagingtoolbar .x-btn-icon button,
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-small button,
.syno-ux-pagingtoolbar .x-btn-icon.x-item-disabled button,
.syno-ux-pagingtoolbar .x-btn-icon.x-item-disabled .x-btn-small button {
  outline: none;
  min-width: 24px;
  width: auto;
  height: 24px;
}
.syno-ux-pagingtoolbar .x-btn-icon button.x-tbar-loading-process,
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-small button.x-tbar-loading-process,
.syno-ux-pagingtoolbar
  .x-btn-icon.x-item-disabled
  button.x-tbar-loading-process,
.syno-ux-pagingtoolbar
  .x-btn-icon.x-item-disabled
  .x-btn-small
  button.x-tbar-loading-process {
  background-size: 16px 16px !important;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack .syno-ux-pagingtoolbar .x-btn-icon button.x-tbar-loading-process,
  .synohdpack
    .syno-ux-pagingtoolbar
    .x-btn-icon
    .x-btn-small
    button.x-tbar-loading-process,
  .synohdpack
    .syno-ux-pagingtoolbar
    .x-btn-icon.x-item-disabled
    button.x-tbar-loading-process,
  .synohdpack
    .syno-ux-pagingtoolbar
    .x-btn-icon.x-item-disabled
    .x-btn-small
    button.x-tbar-loading-process {
    background-size: 20px 20px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug
    .syno-ux-pagingtoolbar
    .x-btn-icon
    button.x-tbar-loading-process,
  .synohdpackdebug
    .syno-ux-pagingtoolbar
    .x-btn-icon
    .x-btn-small
    button.x-tbar-loading-process,
  .synohdpackdebug
    .syno-ux-pagingtoolbar
    .x-btn-icon.x-item-disabled
    button.x-tbar-loading-process,
  .synohdpackdebug
    .syno-ux-pagingtoolbar
    .x-btn-icon.x-item-disabled
    .x-btn-small
    button.x-tbar-loading-process {
    background-size: 20px 20px;
    outline: 1px green dashed;
  }
}
.syno-ux-pagingtoolbar .x-btn-icon .syno-ux-page-btn,
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-small .syno-ux-page-btn,
.syno-ux-pagingtoolbar .x-btn-icon.x-item-disabled .syno-ux-page-btn,
.syno-ux-pagingtoolbar
  .x-btn-icon.x-item-disabled
  .x-btn-small
  .syno-ux-page-btn {
  color: #414b55;
}
.syno-ux-pagingtoolbar .x-btn-icon .syno-ux-page-btn,
.syno-ux-pagingtoolbar .x-btn-icon .syno-ux-page-btn-focus,
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-small .syno-ux-page-btn,
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-small .syno-ux-page-btn-focus,
.syno-ux-pagingtoolbar .x-btn-icon.x-item-disabled .syno-ux-page-btn,
.syno-ux-pagingtoolbar .x-btn-icon.x-item-disabled .syno-ux-page-btn-focus,
.syno-ux-pagingtoolbar
  .x-btn-icon.x-item-disabled
  .x-btn-small
  .syno-ux-page-btn,
.syno-ux-pagingtoolbar
  .x-btn-icon.x-item-disabled
  .x-btn-small
  .syno-ux-page-btn-focus {
  padding: 0 3px;
  background-image: none !important;
  font-size: 13px;
  border-radius: 3px;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack .syno-ux-pagingtoolbar .x-btn-icon .syno-ux-page-btn,
  .synohdpack .syno-ux-pagingtoolbar .x-btn-icon .syno-ux-page-btn-focus,
  .synohdpack .syno-ux-pagingtoolbar .x-btn-icon .x-btn-small .syno-ux-page-btn,
  .synohdpack
    .syno-ux-pagingtoolbar
    .x-btn-icon
    .x-btn-small
    .syno-ux-page-btn-focus,
  .synohdpack
    .syno-ux-pagingtoolbar
    .x-btn-icon.x-item-disabled
    .syno-ux-page-btn,
  .synohdpack
    .syno-ux-pagingtoolbar
    .x-btn-icon.x-item-disabled
    .syno-ux-page-btn-focus,
  .synohdpack
    .syno-ux-pagingtoolbar
    .x-btn-icon.x-item-disabled
    .x-btn-small
    .syno-ux-page-btn,
  .synohdpack
    .syno-ux-pagingtoolbar
    .x-btn-icon.x-item-disabled
    .x-btn-small
    .syno-ux-page-btn-focus {
    background-image: none !important;
  }
}
.syno-ux-pagingtoolbar .x-btn-icon .syno-ux-page-btn .x-btn-ml,
.syno-ux-pagingtoolbar .x-btn-icon .syno-ux-page-btn .x-btn-mr,
.syno-ux-pagingtoolbar .x-btn-icon .syno-ux-page-btn .x-btn-mc,
.syno-ux-pagingtoolbar .x-btn-icon .syno-ux-page-btn-focus .x-btn-ml,
.syno-ux-pagingtoolbar .x-btn-icon .syno-ux-page-btn-focus .x-btn-mr,
.syno-ux-pagingtoolbar .x-btn-icon .syno-ux-page-btn-focus .x-btn-mc,
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-small .syno-ux-page-btn .x-btn-ml,
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-small .syno-ux-page-btn .x-btn-mr,
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-small .syno-ux-page-btn .x-btn-mc,
.syno-ux-pagingtoolbar
  .x-btn-icon
  .x-btn-small
  .syno-ux-page-btn-focus
  .x-btn-ml,
.syno-ux-pagingtoolbar
  .x-btn-icon
  .x-btn-small
  .syno-ux-page-btn-focus
  .x-btn-mr,
.syno-ux-pagingtoolbar
  .x-btn-icon
  .x-btn-small
  .syno-ux-page-btn-focus
  .x-btn-mc,
.syno-ux-pagingtoolbar .x-btn-icon.x-item-disabled .syno-ux-page-btn .x-btn-ml,
.syno-ux-pagingtoolbar .x-btn-icon.x-item-disabled .syno-ux-page-btn .x-btn-mr,
.syno-ux-pagingtoolbar .x-btn-icon.x-item-disabled .syno-ux-page-btn .x-btn-mc,
.syno-ux-pagingtoolbar
  .x-btn-icon.x-item-disabled
  .syno-ux-page-btn-focus
  .x-btn-ml,
.syno-ux-pagingtoolbar
  .x-btn-icon.x-item-disabled
  .syno-ux-page-btn-focus
  .x-btn-mr,
.syno-ux-pagingtoolbar
  .x-btn-icon.x-item-disabled
  .syno-ux-page-btn-focus
  .x-btn-mc,
.syno-ux-pagingtoolbar
  .x-btn-icon.x-item-disabled
  .x-btn-small
  .syno-ux-page-btn
  .x-btn-ml,
.syno-ux-pagingtoolbar
  .x-btn-icon.x-item-disabled
  .x-btn-small
  .syno-ux-page-btn
  .x-btn-mr,
.syno-ux-pagingtoolbar
  .x-btn-icon.x-item-disabled
  .x-btn-small
  .syno-ux-page-btn
  .x-btn-mc,
.syno-ux-pagingtoolbar
  .x-btn-icon.x-item-disabled
  .x-btn-small
  .syno-ux-page-btn-focus
  .x-btn-ml,
.syno-ux-pagingtoolbar
  .x-btn-icon.x-item-disabled
  .x-btn-small
  .syno-ux-page-btn-focus
  .x-btn-mr,
.syno-ux-pagingtoolbar
  .x-btn-icon.x-item-disabled
  .x-btn-small
  .syno-ux-page-btn-focus
  .x-btn-mc {
  background-image: none !important;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack .syno-ux-pagingtoolbar .x-btn-icon .syno-ux-page-btn .x-btn-ml,
  .synohdpack .syno-ux-pagingtoolbar .x-btn-icon .syno-ux-page-btn .x-btn-mr,
  .synohdpack .syno-ux-pagingtoolbar .x-btn-icon .syno-ux-page-btn .x-btn-mc,
  .synohdpack
    .syno-ux-pagingtoolbar
    .x-btn-icon
    .syno-ux-page-btn-focus
    .x-btn-ml,
  .synohdpack
    .syno-ux-pagingtoolbar
    .x-btn-icon
    .syno-ux-page-btn-focus
    .x-btn-mr,
  .synohdpack
    .syno-ux-pagingtoolbar
    .x-btn-icon
    .syno-ux-page-btn-focus
    .x-btn-mc,
  .synohdpack
    .syno-ux-pagingtoolbar
    .x-btn-icon
    .x-btn-small
    .syno-ux-page-btn
    .x-btn-ml,
  .synohdpack
    .syno-ux-pagingtoolbar
    .x-btn-icon
    .x-btn-small
    .syno-ux-page-btn
    .x-btn-mr,
  .synohdpack
    .syno-ux-pagingtoolbar
    .x-btn-icon
    .x-btn-small
    .syno-ux-page-btn
    .x-btn-mc,
  .synohdpack
    .syno-ux-pagingtoolbar
    .x-btn-icon
    .x-btn-small
    .syno-ux-page-btn-focus
    .x-btn-ml,
  .synohdpack
    .syno-ux-pagingtoolbar
    .x-btn-icon
    .x-btn-small
    .syno-ux-page-btn-focus
    .x-btn-mr,
  .synohdpack
    .syno-ux-pagingtoolbar
    .x-btn-icon
    .x-btn-small
    .syno-ux-page-btn-focus
    .x-btn-mc,
  .synohdpack
    .syno-ux-pagingtoolbar
    .x-btn-icon.x-item-disabled
    .syno-ux-page-btn
    .x-btn-ml,
  .synohdpack
    .syno-ux-pagingtoolbar
    .x-btn-icon.x-item-disabled
    .syno-ux-page-btn
    .x-btn-mr,
  .synohdpack
    .syno-ux-pagingtoolbar
    .x-btn-icon.x-item-disabled
    .syno-ux-page-btn
    .x-btn-mc,
  .synohdpack
    .syno-ux-pagingtoolbar
    .x-btn-icon.x-item-disabled
    .syno-ux-page-btn-focus
    .x-btn-ml,
  .synohdpack
    .syno-ux-pagingtoolbar
    .x-btn-icon.x-item-disabled
    .syno-ux-page-btn-focus
    .x-btn-mr,
  .synohdpack
    .syno-ux-pagingtoolbar
    .x-btn-icon.x-item-disabled
    .syno-ux-page-btn-focus
    .x-btn-mc,
  .synohdpack
    .syno-ux-pagingtoolbar
    .x-btn-icon.x-item-disabled
    .x-btn-small
    .syno-ux-page-btn
    .x-btn-ml,
  .synohdpack
    .syno-ux-pagingtoolbar
    .x-btn-icon.x-item-disabled
    .x-btn-small
    .syno-ux-page-btn
    .x-btn-mr,
  .synohdpack
    .syno-ux-pagingtoolbar
    .x-btn-icon.x-item-disabled
    .x-btn-small
    .syno-ux-page-btn
    .x-btn-mc,
  .synohdpack
    .syno-ux-pagingtoolbar
    .x-btn-icon.x-item-disabled
    .x-btn-small
    .syno-ux-page-btn-focus
    .x-btn-ml,
  .synohdpack
    .syno-ux-pagingtoolbar
    .x-btn-icon.x-item-disabled
    .x-btn-small
    .syno-ux-page-btn-focus
    .x-btn-mr,
  .synohdpack
    .syno-ux-pagingtoolbar
    .x-btn-icon.x-item-disabled
    .x-btn-small
    .syno-ux-page-btn-focus
    .x-btn-mc {
    background-image: none !important;
  }
}
.syno-ux-pagingtoolbar .x-btn-icon.x-btn-over .syno-ux-page-btn {
  background-color: rgba(198, 212, 224, 0.4);
}
.syno-ux-pagingtoolbar .x-btn-icon .syno-ux-page-btn-focus,
.syno-ux-pagingtoolbar .x-btn-icon.x-btn-over .syno-ux-page-btn-focus {
  background-color: #057feb;
  color: #ffffff;
}
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-small .x-tbar-page-first {
  background-position: 0 0;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack
    .syno-ux-pagingtoolbar
    .x-btn-icon
    .x-btn-small
    .x-tbar-page-first {
    background-size: 48px 72px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug
    .syno-ux-pagingtoolbar
    .x-btn-icon
    .x-btn-small
    .x-tbar-page-first {
    background-size: 48px 72px;
    outline: 1px green dashed;
  }
}
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-small .x-tbar-page-prev {
  background-position: 0 0;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack
    .syno-ux-pagingtoolbar
    .x-btn-icon
    .x-btn-small
    .x-tbar-page-prev {
    background-size: 48px 72px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug
    .syno-ux-pagingtoolbar
    .x-btn-icon
    .x-btn-small
    .x-tbar-page-prev {
    background-size: 48px 72px;
    outline: 1px green dashed;
  }
}
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-small .x-tbar-page-next {
  background-position: -24px 0px;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack
    .syno-ux-pagingtoolbar
    .x-btn-icon
    .x-btn-small
    .x-tbar-page-next {
    background-size: 48px 72px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug
    .syno-ux-pagingtoolbar
    .x-btn-icon
    .x-btn-small
    .x-tbar-page-next {
    background-size: 48px 72px;
    outline: 1px green dashed;
  }
}
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-small .x-tbar-page-last {
  background-position: -24px 0px;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack
    .syno-ux-pagingtoolbar
    .x-btn-icon
    .x-btn-small
    .x-tbar-page-last {
    background-size: 48px 72px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug
    .syno-ux-pagingtoolbar
    .x-btn-icon
    .x-btn-small
    .x-tbar-page-last {
    background-size: 48px 72px;
    outline: 1px green dashed;
  }
}
.syno-ux-pagingtoolbar .x-btn-icon .x-btn-small .x-tbar-loading {
  background-position: 0 0;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack .syno-ux-pagingtoolbar .x-btn-icon .x-btn-small .x-tbar-loading {
    background-size: 24px 72px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug
    .syno-ux-pagingtoolbar
    .x-btn-icon
    .x-btn-small
    .x-tbar-loading {
    background-size: 24px 72px;
    outline: 1px green dashed;
  }
}
.syno-ux-pagingtoolbar .x-btn-icon.x-btn-over .x-btn-small .x-tbar-page-first,
.syno-ux-pagingtoolbar .x-btn-icon.x-btn-click .x-btn-small .x-tbar-page-first {
  background-position: 0 -24px;
}
.syno-ux-pagingtoolbar .x-btn-icon.x-btn-over .x-btn-small .x-tbar-page-prev,
.syno-ux-pagingtoolbar .x-btn-icon.x-btn-click .x-btn-small .x-tbar-page-prev {
  background-position: 0 -24px;
}
.syno-ux-pagingtoolbar .x-btn-icon.x-btn-over .x-btn-small .x-tbar-page-next,
.syno-ux-pagingtoolbar .x-btn-icon.x-btn-click .x-btn-small .x-tbar-page-next {
  background-position: -24px -24px;
}
.syno-ux-pagingtoolbar .x-btn-icon.x-btn-over .x-btn-small .x-tbar-page-last,
.syno-ux-pagingtoolbar .x-btn-icon.x-btn-click .x-btn-small .x-tbar-page-last {
  background-position: -24px -24px;
}
.syno-ux-pagingtoolbar .x-btn-icon.x-btn-over .x-btn-small .x-tbar-loading,
.syno-ux-pagingtoolbar .x-btn-icon.x-btn-click .x-btn-small .x-tbar-loading {
  background-position: 0 -24px;
}
.syno-ux-pagingtoolbar .x-btn-icon.x-item-disabled .syno-ux-page-btn:hover,
.syno-ux-pagingtoolbar .x-btn-icon.x-item-disabled .syno-ux-page-btn-focus {
  background-color: transparent;
}
.syno-ux-pagingtoolbar
  .x-btn-icon.x-item-disabled
  .x-btn-small
  .x-tbar-page-first {
  background-position: 0 -48px;
}
.syno-ux-pagingtoolbar
  .x-btn-icon.x-item-disabled
  .x-btn-small
  .x-tbar-page-prev {
  background-position: 0 -48px;
}
.syno-ux-pagingtoolbar
  .x-btn-icon.x-item-disabled
  .x-btn-small
  .x-tbar-page-next {
  background-position: -24px -48px;
}
.syno-ux-pagingtoolbar
  .x-btn-icon.x-item-disabled
  .x-btn-small
  .x-tbar-page-last {
  background-position: -24px -48px;
}
.syno-ux-pagingtoolbar
  .x-btn-icon.x-item-disabled
  .x-btn-small
  .x-tbar-loading {
  background-position: 0 -48px;
}
.syno-ux-pagingtoolbar .x-toolbar-cell .syno-ux-combobox {
  padding-top: 2px;
  padding-bottom: 2px;
}
.syno-ux-pagingtoolbar .x-toolbar-cell .syno-ux-combobox-trigger {
  height: 24px;
}
.syno-ux-toolbar {
  background-color: transparent;
  background-image: none;
}
.syno-ux-expandable-listview .item-summary .item-toggle {
  display: inline-block;
  position: absolute;
  top: 0px;
  right: 0px;
  width: 52px;
  height: 58px;
}
.syno-ux-expandable-listview .item-summary .item-toggle .item-toggle-img {
  position: relative;
  left: 12px;
  top: 17px;
  width: 24px;
  height: 24px;
  background-repeat: no-repeat;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack
    .syno-ux-expandable-listview
    .item-summary
    .item-toggle
    .item-toggle-img,
  .syno-ux-expandable-listview
    .item-summary
    .item-toggle
    .synohdpack
    .item-toggle-img {
    background-size: 48px 72px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug
    .syno-ux-expandable-listview
    .item-summary
    .item-toggle
    .item-toggle-img,
  .syno-ux-expandable-listview
    .item-summary
    .item-toggle
    .synohdpackdebug
    .item-toggle-img {
    background-size: 48px 72px;
    outline: 1px green dashed;
  }
}
.syno-dataview .contentwrapper.is-empty {
  height: 100%;
}
.syno-dataview .empty-text-wrap {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 10px;
  right: 10px;
}
.syno-dataview .empty-text-wrap:before {
  content: "";
  display: inline-block;
  vertical-align: middle;
  height: 100%;
  width: 0px;
}
.syno-dataview .empty-text-inner-wrap {
  display: inline-block;
  width: 100%;
  vertical-align: middle;
}
.syno-dataview .empty-text-icon {
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 20px;
  width: 120px;
  height: 120px;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack .syno-dataview .empty-text-icon {
    background-size: 120px 120px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug .syno-dataview .empty-text-icon {
    background-size: 120px 120px;
    outline: 1px green dashed;
  }
}
.syno-dataview .empty-text {
  margin-left: auto;
  margin-right: auto;
  width: 330px;
  text-align: center;
  line-height: 20px;
  font-size: 13px;
  color: rgba(65, 75, 85, 0.6);
}
.syno-dataview .empty-text-btn {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  margin-top: 16px;
}
.syno-dataview .empty-text-btn .syno-ux-button {
  margin-right: 0px !important;
  min-width: 80px;
}
.syno-ux-operatable-listview.syno-ux-expandable-listview .item-wrap {
  padding: 0px;
  border: 1px solid #d4eaf9;
  border-top: 0px;
  margin-bottom: 10px;
}
.syno-ux-operatable-listview.syno-ux-expandable-listview .item-wrap.item-over,
.syno-ux-operatable-listview.syno-ux-expandable-listview
  .item-wrap.item-selected {
  background-color: #f2faff;
}
.syno-ux-operatable-listview.syno-ux-expandable-listview
  .item-wrap
  .item-tools {
  padding-left: 16px;
  background-color: #d4eaf9;
  height: 28px;
  border: 0px;
}
.syno-ux-operatable-listview.syno-ux-expandable-listview
  .item-wrap
  .item-tools
  .item-edit-img {
  width: 24px;
  height: 24px;
  margin-top: 2px;
  margin-right: 10px;
  float: left;
  background-repeat: no-repeat;
  cursor: pointer;
  background-position: 0 0px;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack
    .syno-ux-operatable-listview.syno-ux-expandable-listview
    .item-wrap
    .item-tools
    .item-edit-img {
    background-size: 24px 96px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug
    .syno-ux-operatable-listview.syno-ux-expandable-listview
    .item-wrap
    .item-tools
    .item-edit-img {
    background-size: 24px 96px;
    outline: 1px green dashed;
  }
}
.syno-ux-operatable-listview.syno-ux-expandable-listview
  .item-wrap
  .item-tools
  .item-edit-img:hover {
  background-position: 0 -24px;
}
.syno-ux-operatable-listview.syno-ux-expandable-listview
  .item-wrap
  .item-tools
  .item-edit-img:active {
  background-position: 0 -48px;
}
.syno-ux-operatable-listview.syno-ux-expandable-listview
  .item-wrap
  .item-tools
  .item-remove-img {
  width: 24px;
  height: 24px;
  margin-top: 2px;
  margin-right: 10px;
  float: left;
  background-repeat: no-repeat;
  cursor: pointer;
  background-position: 0 0px;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack
    .syno-ux-operatable-listview.syno-ux-expandable-listview
    .item-wrap
    .item-tools
    .item-remove-img {
    background-size: 24px 96px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug
    .syno-ux-operatable-listview.syno-ux-expandable-listview
    .item-wrap
    .item-tools
    .item-remove-img {
    background-size: 24px 96px;
    outline: 1px green dashed;
  }
}
.syno-ux-operatable-listview.syno-ux-expandable-listview
  .item-wrap
  .item-tools
  .item-remove-img:hover {
  background-position: 0 -24px;
}
.syno-ux-operatable-listview.syno-ux-expandable-listview
  .item-wrap
  .item-tools
  .item-remove-img:active {
  background-position: 0 -48px;
}
.syno-ux-operatable-listview.syno-ux-expandable-listview
  .item-wrap
  .item-summary,
.syno-ux-operatable-listview.syno-ux-expandable-listview
  .item-wrap
  .item-detail {
  padding-left: 16px;
}
.syno-ux-operatable-listview.syno-ux-expandable-listview
  .item-wrap
  .item-summary
  .item-toggle {
  top: 28px;
}
.syno-ux-operatable-listview.syno-ux-expandable-listview
  .item-wrap
  .item-summary
  .item-toggle
  .item-toggle-img {
  right: 6px;
  top: 8px;
}
.syno-ux-expandable-listview .item-wrap {
  position: relative;
  padding-left: 64px;
  border-bottom: 1px solid rgba(198, 212, 224, 0.4);
}
.syno-ux-expandable-listview .item-wrap.item-over {
  background-color: rgba(5, 127, 235, 0.04);
}
.syno-ux-expandable-listview .item-wrap.item-selected {
  background-color: rgba(5, 127, 235, 0.1);
}
.syno-ux-expandable-listview
  .item-wrap.item-selected
  .item-toggle
  .item-toggle-img {
  background-position: 0 -48px;
}
.syno-ux-expandable-listview
  .item-wrap.item-selected
  .item-toggle.item-toggle-expanded
  .item-toggle-img {
  background-position: -24px -48px;
}
.syno-ux-expandable-listview .item-summary {
  height: 58px;
}
.syno-ux-expandable-listview .item-summary .item-icon {
  display: inline-block;
  width: 32px;
  height: 32px;
  position: absolute;
  top: 13px;
  left: 16px;
}
.syno-ux-expandable-listview .item-summary .item-toggle .item-toggle-img {
  cursor: pointer;
  background-position: 0 0;
}
.syno-ux-expandable-listview .item-summary .item-toggle .item-toggle-img:hover {
  background-position: 0 -48px;
}
.syno-ux-expandable-listview
  .item-summary
  .item-toggle.item-toggle-expanded
  .item-toggle-img {
  background-position: -24px 0px;
}
.syno-ux-expandable-listview
  .item-summary
  .item-toggle.item-toggle-expanded
  .item-toggle-img:hover {
  background-position: -24px -48px;
}
.syno-ux-expandable-listview .item-summary .item-title {
  display: inline-block;
  font-size: 13px;
  line-height: 20px;
  padding-top: 8px;
}
.syno-ux-expandable-listview .item-summary .item-status {
  font-size: 13px;
  color: rgba(65, 75, 85, 0.6);
  line-height: 20px;
  margin-top: 2px;
}
.syno-ux-expandable-listview .item-detail {
  padding: 0px 20px 14px 0;
}
.syno-ux-expandable-add {
  -moz-animation: expand 0.5s;
  -webkit-animation: expand 0.5s;
  animation: expand 0.5s;
  -moz-animation-fill-mode: forward;
  -webkit-animation-fill-mode: forward;
  animation-fill-mode: forward;
  overflow: hidden;
}
.syno-ux-expandable-remove {
  -moz-animation: fold 0.5s;
  -webkit-animation: fold 0.5s;
  animation: fold 0.5s;
  -moz-animation-fill-mode: forward;
  -webkit-animation-fill-mode: forward;
  animation-fill-mode: forward;
  overflow: hidden;
  height: 0;
  border: 0;
}
@-moz-keyframes expand {
  0% {
    height: 0;
  }
  100% {
    height: 50px;
  }
}
@-webkit-keyframes expand {
  0% {
    height: 0;
  }
  100% {
    height: 50px;
  }
}
@keyframes expand {
  0% {
    height: 0;
  }
  100% {
    height: 50px;
  }
}
@-moz-keyframes fold {
  0% {
    height: 50px;
  }
  100% {
    height: 0;
  }
}
@-webkit-keyframes fold {
  0% {
    height: 50px;
  }
  100% {
    height: 0;
  }
}
@keyframes fold {
  0% {
    height: 50px;
  }
  100% {
    height: 0;
  }
}
.ux-float-layout-ct {
  position: relative;
}
.ux-float-layout-ct .ux-float-layout-sizer {
  background: transparent none;
  border: 0 none;
  padding: 0;
  margin: 0;
  width: 0;
}
.ux-float-layout-ct .x-box-item {
  position: absolute;
}
.ux-float-layout-ct.ux-float-layout-ct-animate .x-box-item {
  -moz-transition-property: top, left;
  -o-transition-property: top, left;
  -webkit-transition-property: top, left;
  transition-property: top, left;
  -moz-transition-timing-function: ease-in;
  -o-transition-timing-function: ease-in;
  -webkit-transition-timing-function: ease-in;
  transition-timing-function: ease-in;
  -moz-transition-duration: 0.3s;
  -o-transition-duration: 0.3s;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
}
.syno-ux-treepanel {
  overflow-x: hidden;
}
.syno-ux-treepanel .x-border-panel {
  background-color: transparent;
}
.syno-ux-treepanel .x-tree-root-ct {
  width: auto !important;
  overflow: hidden;
}
.syno-ux-treepanel .x-tree-node-el {
  display: table;
  width: 100%;
  line-height: 28px;
  height: 28px;
  overflow: hidden;
}
.syno-ux-treepanel .x-tree-node-indent {
  padding-left: 2px;
  padding-right: 2px;
}
.syno-ux-treepanel .x-tree-node-indent .x-tree-elbow-line {
  width: 14px;
}
.syno-ux-treepanel .x-tree-node {
  text-overflow: ellipsis;
  white-space: nowrap;
}
.syno-ux-treepanel .x-tree-node a span {
  font-size: 13px;
  padding-left: 0;
  padding-right: 6px;
}
.syno-ux-treepanel .x-tree-node .x-tree-ec-icon {
  height: 20px;
  width: 20px;
  margin-top: 4px;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack .syno-ux-treepanel .x-tree-node .x-tree-ec-icon {
    background-size: 20px 40px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug .syno-ux-treepanel .x-tree-node .x-tree-ec-icon {
    background-size: 20px 40px;
    outline: 1px green dashed;
  }
}
.syno-ux-treepanel .x-tree-node .x-tree-elbow,
.syno-ux-treepanel .x-tree-node .x-tree-elbow-end {
  visibility: hidden;
}
.syno-ux-treepanel .x-tree-node .x-tree-elbow-minus,
.syno-ux-treepanel .x-tree-node .x-tree-elbow-end-minus {
  background-position: 0px 0;
}
.syno-ux-treepanel .x-tree-node .x-tree-elbow-plus,
.syno-ux-treepanel .x-tree-node .x-tree-elbow-end-plus {
  background-position: 0 -20px;
}
.syno-ux-treepanel .x-tree-node .x-tree-node-over {
  background-color: rgba(5, 127, 235, 0.04);
  border-radius: 5px;
}
.syno-ux-treepanel .x-tree-node .x-tree-node-over .syno-ux-cb-grayed {
  background-position: 0 -140px;
}
.syno-ux-treepanel
  .x-tree-node
  .x-tree-node-over
  .syno-ux-cb-disabled.syno-ux-cb-checked {
  background-position: 0 -100px;
}
.syno-ux-treepanel .x-tree-node .x-tree-node-over .x-tree-elbow,
.syno-ux-treepanel .x-tree-node .x-tree-node-over .x-tree-elbow-end {
  visibility: hidden;
}
.syno-ux-treepanel .x-tree-node .x-tree-selected {
  background-color: rgba(5, 127, 235, 0.1);
  border-radius: 5px;
}
.syno-ux-treepanel .x-tree-node .x-tree-selected .x-tree-elbow,
.syno-ux-treepanel .x-tree-node .x-tree-selected .x-tree-elbow-end {
  visibility: hidden;
}
.syno-ux-treepanel .x-tree-node .x-tree-node-disabled .x-tree-elbow,
.syno-ux-treepanel .x-tree-node .x-tree-node-disabled .x-tree-elbow-end {
  visibility: hidden;
}
.syno-ux-treepanel .x-checkbox {
  height: 20px;
  width: 20px;
  background-repeat: no-repeat;
  background-position: 0px 0;
  margin-right: 4px !important;
  vertical-align: top;
  position: relative;
  top: 4px;
}
.syno-ux-treepanel .x-checkbox:hover {
  background-position: 0 -20px;
}
.syno-ux-treepanel .x-item-disabled .x-checkbox {
  background-position: 0 -40px;
}
.syno-ux-treepanel .x-checkbox-checked .x-checkbox {
  background-position: 0 -60px;
}
.syno-ux-treepanel .x-checkbox-checked .x-checkbox:hover {
  background-position: 0 -80px;
}
.syno-ux-treepanel .x-item-disabled .x-checkbox-checked .x-checkbox {
  background-position: 0 -100px;
}
.syno-ux-treepanel .x-checkbox-grayed .x-checkbox {
  background-position: 0 -120px;
}
.syno-ux-treepanel .x-checkbox-grayed .x-checkbox:hover {
  background-position: 0 -140px;
}
.syno-ux-treepanel .x-item-disabled .x-checkbox-grayed .x-checkbox {
  background-position: 0 -160px;
}
.syno-ux-treepanel.syno-ux-treepanel-gradient .x-panel-bwrap:before {
  position: absolute;
  display: block;
  height: 6px;
  content: "";
  width: 100%;
  z-index: 99;
}
.syno-ux-treepanel.syno-ux-treepanel-gradient .x-panel-bwrap:after {
  position: absolute;
  display: block;
  height: 6px;
  content: "";
  width: 100%;
  z-index: 99;
  margin-top: -6px;
}
.syno-ux-treepanel.syno-ux-treepanel-gradient.scroll-at-top
  .x-panel-bwrap:before,
.syno-ux-treepanel.syno-ux-treepanel-gradient.scroll-at-bottom
  .x-panel-bwrap:after {
  display: none;
}
.x-tip-invalid {
  border: 1px solid transparent;
  border-top: 1px solid #ff9191;
  border-radius: 4px;
  background-color: rgba(250, 75, 75, 0.9);
}
.x-tip-invalid .x-tip-invalid-ml,
.x-tip-invalid .x-tip-invalid-mr,
.x-tip-invalid .x-tip-invalid-mc,
.x-tip-invalid .x-tip-invalid-tl,
.x-tip-invalid .x-tip-invalid-tr,
.x-tip-invalid .x-tip-invalid-tc,
.x-tip-invalid .x-tip-invalid-bl,
.x-tip-invalid .x-tip-invalid-br,
.x-tip-invalid .x-tip-invalid-bc {
  padding: 0px;
  background-image: none;
  background-color: transparent;
}
.x-tip-invalid .x-tip-invalid-bwrap {
  padding: 2px 11px;
}
.x-tip-invalid .x-tip-invalid-body,
.x-tip-invalid .x-tip-invalid-body span,
.x-tip-invalid .x-tip-invalid-body div {
  font-size: 13px !important;
  color: #fff !important;
  line-height: 20px;
}
.x-tip-invalid::before {
  content: "";
  position: absolute;
  width: 11px;
  height: 100%;
  top: -1px;
  left: -1px;
  border-width: 1px 0 1px 1px;
  border-style: solid;
  border-color: #ff9191;
  border-radius: 4px 0 0 4px;
  opacity: 1;
  box-shadow: -3px 2px 4px 0 rgba(0, 0, 0, 0.2);
}
.x-tip-invalid::after {
  content: "";
  position: absolute;
  width: calc(100% - 21px);
  height: 100%;
  top: -1px;
  right: -1px;
  border-width: 1px 1px 1px 0px;
  border-style: solid;
  border-color: #ff9191;
  border-radius: 0px 4px 4px 0px;
  opacity: 1;
  box-shadow: 3.4px 3px 5px 0px rgba(0, 0, 0, 0.2);
}
.x-tip-invalid .x-tip-invalid-speech-bubble {
  display: block;
  width: 27px;
  height: 12px;
  position: absolute;
  float: left;
  clear: left;
  overflow: hidden;
}
.x-tip-invalid
  .x-tip-invalid-speech-bubble
  .x-tip-invalid-speech-bubble-border {
  top: -5px;
  left: 11px;
  position: absolute;
  background-color: transparent;
  transform: rotate(45deg);
  width: 9px;
  height: 9px;
  border-width: 0px 1px 1px 0px;
  border-style: solid;
  border-color: #ff9191;
  opacity: 1;
  box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.05),
    3px 4px 2px 0px rgba(0, 0, 0, 0.05), 3px 0px 2px 2px rgba(0, 0, 0, 0.05);
}
.x-tip-invalid .x-tip-invalid-speech-bubble .x-tip-invalid-speech-bubble-arrow {
  top: 1px;
  left: 10px;
  position: absolute;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 6px 6px 0px 6px;
  border-color: #fa4b4b transparent transparent transparent;
  opacity: 0.9;
}
.ext-gecko .x-window-body .x-form-item {
  overflow: hidden;
}
.ext-ie .x-toolbar .x-toolbar-cell .x-form-field-wrap {
  height: auto;
}
.ext-ie .x-toolbar .x-toolbar-cell .x-form-field-wrap .syno-textfilter-text,
.ext-ie .x-toolbar .x-toolbar-cell .x-form-field-wrap .syno-ux-textfilter-text {
  line-height: 24px;
  padding-top: 0px;
  padding-bottom: 0px;
}
.selectabletext {
  -moz-user-select: text;
  -khtml-user-select: text;
  -webkit-user-select: text;
  -ms-user-select: text;
  user-select: text;
}
input[type="text"][readonly].selectabletext,
input[type="textarea"][readonly].selectabletext,
input[type="password"][readonly].selectabletext {
  -moz-user-select: text;
  -khtml-user-select: text;
  -webkit-user-select: text;
  -ms-user-select: text;
  user-select: text;
}
.x-statusbar .syno-ux-statusbar-loading,
.x-statusbar .syno-ux-statusbar-success,
.x-statusbar .syno-ux-statusbar-error {
  display: table-cell;
  vertical-align: middle;
  white-space: normal;
  word-break: break-all;
  margin-left: 2px;
  height: 24px;
  line-height: 24px;
  font-size: 13px;
  padding-left: 28px;
  padding-right: 6px;
}
.x-statusbar .x-status-text {
  position: relative;
}
.x-statusbar .syno-ux-statusbar-loading {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-image: none;
}
.x-statusbar .syno-ux-statusbar-loading .x-loading-wrap {
  left: 0;
  top: 0;
}
.x-statusbar .syno-ux-statusbar-success {
  background-position: 0 0;
  background-repeat: no-repeat;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack .x-statusbar .syno-ux-statusbar-success {
    background-size: 24px 48px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug .x-statusbar .syno-ux-statusbar-success {
    background-size: 24px 48px;
    outline: 1px green dashed;
  }
}
.x-statusbar .syno-ux-statusbar-error {
  background-position: 0 -24px;
  background-repeat: no-repeat;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack .x-statusbar .syno-ux-statusbar-error {
    background-size: 24px 48px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug .x-statusbar .syno-ux-statusbar-error {
    background-size: 24px 48px;
    outline: 1px green dashed;
  }
}
.x-statusbar .x-status-text {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
.syno-ux-superboxselect {
  position: relative;
  height: auto !important;
  margin: 0px;
  overflow: hidden;
  padding: 0px;
  display: block;
  outline: 0px !important;
  border-right: 1px solid rgba(198, 212, 224, 0.7);
}
.syno-ux-superboxselect.x-form-text {
  border-radius: 4px;
}
.x-item-disabled .syno-ux-superboxselect.x-form-focus {
  border-right: 1px solid rgba(198, 212, 224, 0.7);
}
.syno-ux-superboxselect.x-form-invalid {
  border-right: 1px solid #e64040;
  background-color: rgba(230, 64, 64, 0.08);
}
.x-item-disabled .syno-ux-superboxselect.x-form-text {
  background-color: rgba(198, 212, 224, 0.2);
  border-right: 1px solid rgba(198, 212, 224, 0.7);
}
.syno-ux-superboxselect input[disabled] {
  background-color: transparent;
}
.syno-ux-superboxselect ul {
  overflow: hidden;
  cursor: text;
}
.syno-ux-superboxselect .vscrollerbar {
  width: 6px;
  margin-left: -8px;
}
.syno-ux-superboxselect-display-btns.has-clear ul,
.syno-ux-superboxselect-display-btns.has-expand ul {
  padding-right: 24px;
}
.syno-ux-superboxselect-display-btns.has-clear.has-expand ul {
  padding-right: 50px;
}
.syno-ux-superboxselect-display-btns ul {
  padding-right: 0px;
  position: relative;
}
.syno-ux-superboxselect-display-btns .syno-ux-superboxselect-btns {
  position: absolute;
  right: 0px;
  top: 0;
  height: 26px;
  width: 50px;
  overflow: hidden;
  padding: 0px;
}
.syno-ux-superboxselect-display-btns .syno-ux-superboxselect-btns div {
  float: left;
}
.syno-ux-superboxselect-display-btns
  .syno-ux-superboxselect-btns
  .syno-ux-superboxselect-btn-clear {
  width: 24px;
  height: 22px;
  position: absolute;
  top: 2px;
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-position: 0px -1px;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
  opacity: 0.4;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack
    .syno-ux-superboxselect-display-btns
    .syno-ux-superboxselect-btns
    .syno-ux-superboxselect-btn-clear {
    background-size: 24px 24px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug
    .syno-ux-superboxselect-display-btns
    .syno-ux-superboxselect-btns
    .syno-ux-superboxselect-btn-clear {
    background-size: 24px 24px;
    outline: 1px green dashed;
  }
}
.syno-ux-superboxselect-display-btns
  .syno-ux-superboxselect-btns
  .syno-ux-superboxselect-btn-clear.syno-ux-superboxselect-btn-over {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
  opacity: 0.7;
}
.syno-ux-superboxselect-display-btns
  .syno-ux-superboxselect-btns
  .syno-ux-superboxselect-btn-clear.syno-ux-superboxselect-btn-over.syno-ux-superboxselect-btn-click {
  filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
  opacity: 1;
}
.syno-ux-superboxselect-display-btns
  .syno-ux-superboxselect-btns
  .syno-ux-superboxselect-btn-clear.syno-ux-superboxselect-btn-click {
  filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
  opacity: 1;
}
.x-item-disabled
  .syno-ux-superboxselect-display-btns
  .syno-ux-superboxselect-btns
  .syno-ux-superboxselect-btn-clear {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=20);
  opacity: 0.2;
}
.syno-ux-superboxselect-display-btns
  .syno-ux-superboxselect-btns
  .syno-ux-superboxselect-btn-expand {
  cursor: pointer;
  width: 26px;
  height: 22px;
  right: 0;
  top: 3px;
  position: absolute;
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-position: 0px -2px;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack
    .syno-ux-superboxselect-display-btns
    .syno-ux-superboxselect-btns
    .syno-ux-superboxselect-btn-expand {
    background-size: 24px 72px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug
    .syno-ux-superboxselect-display-btns
    .syno-ux-superboxselect-btns
    .syno-ux-superboxselect-btn-expand {
    background-size: 24px 72px;
    outline: 1px green dashed;
  }
}
.syno-ux-superboxselect-display-btns
  .syno-ux-superboxselect-btns
  .syno-ux-superboxselect-btn-expand.syno-ux-superboxselect-btn-over {
  background-position: 0 -26px;
}
.syno-ux-superboxselect-display-btns
  .syno-ux-superboxselect-btns
  .syno-ux-superboxselect-btn-expand.syno-ux-superboxselect-btn-click {
  background-position: 0px -26px;
}
.x-item-disabled
  .syno-ux-superboxselect-display-btns
  .syno-ux-superboxselect-btns
  .syno-ux-superboxselect-btn-expand {
  background-position: 0px -50px;
}
.syno-ux-superboxselect-btn-hide {
  display: none;
}
.syno-ux-superboxselect li {
  float: left;
  margin: 1px 0 0 2px;
  padding: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}
.syno-ux-superboxselect-stacked li {
  float: none !important;
}
.syno-ux-superboxselect-input {
  line-height: 25px;
}
.syno-ux-superboxselect-input input {
  height: 100%;
  border: none;
  outline: 0px;
  margin-top: 3px;
  margin-bottom: 3px;
  background-color: transparent;
  margin-left: 9px;
}
.syno-ux-superboxselect-input input.has-value {
  margin-left: 0px;
}
body.ext-ie .x-superboxselect-input input {
  background: none;
  border: none;
  margin-top: 3px;
}
.syno-ux-superboxselect-item {
  position: relative;
  border-radius: 3px;
  border-width: 0px;
  background-color: rgba(5, 127, 235, 0.1);
  padding: 2px 30px 2px 12px !important;
  font-size: 13px;
  line-height: 20px;
}
.syno-ux-superboxselect-item.syno-ux-superboxselect-item-hover {
  background-color: rgba(5, 127, 235, 0.2);
}
.syno-ux-superboxselect-item.syno-ux-superboxselect-item-focus,
.syno-ux-superboxselect-item:active,
.syno-ux-superboxselect-item:focus {
  background-color: #057feb;
  color: #fff;
}
.syno-ux-superboxselect-item.syno-ux-superboxselect-item-focus
  .syno-ux-superboxselect-item-close,
.syno-ux-superboxselect-item:active .syno-ux-superboxselect-item-close,
.syno-ux-superboxselect-item:focus .syno-ux-superboxselect-item-close {
  background-position: left -60px;
}
.syno-ux-superboxselect-item.syno-ux-superboxselect-item-focus
  .syno-ux-superboxselect-item-close:hover,
.syno-ux-superboxselect-item:active .syno-ux-superboxselect-item-close:hover,
.syno-ux-superboxselect-item:focus .syno-ux-superboxselect-item-close:hover {
  background-position: left -80px;
}
.syno-ux-superboxselect-item.syno-ux-superboxselect-item-focus
  .syno-ux-superboxselect-item-close:active,
.syno-ux-superboxselect-item:active .syno-ux-superboxselect-item-close:active,
.syno-ux-superboxselect-item:focus .syno-ux-superboxselect-item-close:active {
  background-position: left -100px;
}
.syno-ux-superboxselect-item.x-item-disabled {
  color: rgba(65, 75, 85, 0.4);
}
.syno-ux-superboxselect-item-close {
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-position: left 0px;
  border: none;
  font-size: 1px;
  height: 20px;
  padding: 0;
  position: absolute;
  right: 4px;
  top: 2px;
  width: 20px;
  display: block;
  cursor: pointer;
  background-color: transparent;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack .syno-ux-superboxselect-item-close {
    background-size: 20px 120px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug .syno-ux-superboxselect-item-close {
    background-size: 20px 120px;
    outline: 1px green dashed;
  }
}
.syno-ux-superboxselect-item-close:hover {
  background-position: left -20px;
}
.syno-ux-superboxselect-item-close:active {
  background-position: left -40px;
}
.syno-gridtree.syno-ux-treepanel div.x-tree-node-el {
  display: block;
}
.syno-gridtree .syno-gridtree-col {
  border: none;
}
.syno-gridtree .syno-gridtree-icons {
  float: left;
}
.syno-gridtree .syno-gridtree-icons .x-tree-elbow-plus,
.syno-gridtree .syno-gridtree-icons .x-tree-elbow-minus,
.syno-gridtree .syno-gridtree-icons .x-tree-elbow-end-plus,
.syno-gridtree .syno-gridtree-icons .x-tree-elbow-end-minus {
  visibility: visible;
}
.syno-gridtree .syno-gridtree-static .x-tree-ec-icon {
  display: none;
}
.syno-gridtree .syno-gridtree-static .x-tree-node-el {
  cursor: default;
}
.syno-gridtree .x-tree-node-collasped .x-grid3-cell.syno-ux-triggerfield:after,
.syno-gridtree .x-tree-node-collasped .x-grid3-cell.syno-ux-triggerfield::after,
.syno-gridtree .x-tree-node-collasped .x-grid3-cell.syno-ux-triggerfield:before,
.syno-gridtree
  .x-tree-node-collasped
  .x-grid3-cell.syno-ux-triggerfield::before,
.syno-gridtree .x-tree-node-collasped .x-grid3-cell.syno-ux-textfield:after,
.syno-gridtree .x-tree-node-collasped .x-grid3-cell.syno-ux-textfield::after,
.syno-gridtree .x-tree-node-collasped .x-grid3-cell.syno-ux-textfield:before,
.syno-gridtree .x-tree-node-collasped .x-grid3-cell.syno-ux-textfield::before,
.syno-gridtree .x-tree-node-expanded .x-grid3-cell.syno-ux-triggerfield:after,
.syno-gridtree .x-tree-node-expanded .x-grid3-cell.syno-ux-triggerfield::after,
.syno-gridtree .x-tree-node-expanded .x-grid3-cell.syno-ux-triggerfield:before,
.syno-gridtree .x-tree-node-expanded .x-grid3-cell.syno-ux-triggerfield::before,
.syno-gridtree .x-tree-node-expanded .x-grid3-cell.syno-ux-textfield:after,
.syno-gridtree .x-tree-node-expanded .x-grid3-cell.syno-ux-textfield::after,
.syno-gridtree .x-tree-node-expanded .x-grid3-cell.syno-ux-textfield:before,
.syno-gridtree .x-tree-node-expanded .x-grid3-cell.syno-ux-textfield::before {
  display: none;
}
.syno-gridtree
  .x-tree-node-collasped
  .x-grid3-cell.syno-ux-triggerfield
  .x-grid3-cell-inner,
.syno-gridtree
  .x-tree-node-collasped
  .x-grid3-cell.syno-ux-textfield
  .x-grid3-cell-inner,
.syno-gridtree
  .x-tree-node-expanded
  .x-grid3-cell.syno-ux-triggerfield
  .x-grid3-cell-inner,
.syno-gridtree
  .x-tree-node-expanded
  .x-grid3-cell.syno-ux-textfield
  .x-grid3-cell-inner {
  background-color: transparent;
}
.syno-gridtree
  .x-tree-node-collasped.x-grid3-row-over
  .x-grid3-cell.syno-ux-triggerfield:after,
.syno-gridtree
  .x-tree-node-collasped.x-grid3-row-over
  .x-grid3-cell.syno-ux-triggerfield::after,
.syno-gridtree
  .x-tree-node-collasped.x-grid3-row-over
  .x-grid3-cell.syno-ux-triggerfield:before,
.syno-gridtree
  .x-tree-node-collasped.x-grid3-row-over
  .x-grid3-cell.syno-ux-triggerfield::before,
.syno-gridtree
  .x-tree-node-collasped.x-grid3-row-over
  .x-grid3-cell.syno-ux-textfield:after,
.syno-gridtree
  .x-tree-node-collasped.x-grid3-row-over
  .x-grid3-cell.syno-ux-textfield::after,
.syno-gridtree
  .x-tree-node-collasped.x-grid3-row-over
  .x-grid3-cell.syno-ux-textfield:before,
.syno-gridtree
  .x-tree-node-collasped.x-grid3-row-over
  .x-grid3-cell.syno-ux-textfield::before,
.syno-gridtree
  .x-tree-node-collasped.x-grid3-row-selected
  .x-grid3-cell.syno-ux-triggerfield:after,
.syno-gridtree
  .x-tree-node-collasped.x-grid3-row-selected
  .x-grid3-cell.syno-ux-triggerfield::after,
.syno-gridtree
  .x-tree-node-collasped.x-grid3-row-selected
  .x-grid3-cell.syno-ux-triggerfield:before,
.syno-gridtree
  .x-tree-node-collasped.x-grid3-row-selected
  .x-grid3-cell.syno-ux-triggerfield::before,
.syno-gridtree
  .x-tree-node-collasped.x-grid3-row-selected
  .x-grid3-cell.syno-ux-textfield:after,
.syno-gridtree
  .x-tree-node-collasped.x-grid3-row-selected
  .x-grid3-cell.syno-ux-textfield::after,
.syno-gridtree
  .x-tree-node-collasped.x-grid3-row-selected
  .x-grid3-cell.syno-ux-textfield:before,
.syno-gridtree
  .x-tree-node-collasped.x-grid3-row-selected
  .x-grid3-cell.syno-ux-textfield::before,
.syno-gridtree
  .x-tree-node-expanded.x-grid3-row-over
  .x-grid3-cell.syno-ux-triggerfield:after,
.syno-gridtree
  .x-tree-node-expanded.x-grid3-row-over
  .x-grid3-cell.syno-ux-triggerfield::after,
.syno-gridtree
  .x-tree-node-expanded.x-grid3-row-over
  .x-grid3-cell.syno-ux-triggerfield:before,
.syno-gridtree
  .x-tree-node-expanded.x-grid3-row-over
  .x-grid3-cell.syno-ux-triggerfield::before,
.syno-gridtree
  .x-tree-node-expanded.x-grid3-row-over
  .x-grid3-cell.syno-ux-textfield:after,
.syno-gridtree
  .x-tree-node-expanded.x-grid3-row-over
  .x-grid3-cell.syno-ux-textfield::after,
.syno-gridtree
  .x-tree-node-expanded.x-grid3-row-over
  .x-grid3-cell.syno-ux-textfield:before,
.syno-gridtree
  .x-tree-node-expanded.x-grid3-row-over
  .x-grid3-cell.syno-ux-textfield::before,
.syno-gridtree
  .x-tree-node-expanded.x-grid3-row-selected
  .x-grid3-cell.syno-ux-triggerfield:after,
.syno-gridtree
  .x-tree-node-expanded.x-grid3-row-selected
  .x-grid3-cell.syno-ux-triggerfield::after,
.syno-gridtree
  .x-tree-node-expanded.x-grid3-row-selected
  .x-grid3-cell.syno-ux-triggerfield:before,
.syno-gridtree
  .x-tree-node-expanded.x-grid3-row-selected
  .x-grid3-cell.syno-ux-triggerfield::before,
.syno-gridtree
  .x-tree-node-expanded.x-grid3-row-selected
  .x-grid3-cell.syno-ux-textfield:after,
.syno-gridtree
  .x-tree-node-expanded.x-grid3-row-selected
  .x-grid3-cell.syno-ux-textfield::after,
.syno-gridtree
  .x-tree-node-expanded.x-grid3-row-selected
  .x-grid3-cell.syno-ux-textfield:before,
.syno-gridtree
  .x-tree-node-expanded.x-grid3-row-selected
  .x-grid3-cell.syno-ux-textfield::before {
  display: none;
}
.syno-gridtree
  .x-tree-node-collasped.x-grid3-row-over
  .x-grid3-cell.syno-ux-triggerfield
  .x-grid3-cell-inner,
.syno-gridtree
  .x-tree-node-collasped.x-grid3-row-over
  .x-grid3-cell.syno-ux-textfield
  .x-grid3-cell-inner,
.syno-gridtree
  .x-tree-node-collasped.x-grid3-row-selected
  .x-grid3-cell.syno-ux-triggerfield
  .x-grid3-cell-inner,
.syno-gridtree
  .x-tree-node-collasped.x-grid3-row-selected
  .x-grid3-cell.syno-ux-textfield
  .x-grid3-cell-inner,
.syno-gridtree
  .x-tree-node-expanded.x-grid3-row-over
  .x-grid3-cell.syno-ux-triggerfield
  .x-grid3-cell-inner,
.syno-gridtree
  .x-tree-node-expanded.x-grid3-row-over
  .x-grid3-cell.syno-ux-textfield
  .x-grid3-cell-inner,
.syno-gridtree
  .x-tree-node-expanded.x-grid3-row-selected
  .x-grid3-cell.syno-ux-triggerfield
  .x-grid3-cell-inner,
.syno-gridtree
  .x-tree-node-expanded.x-grid3-row-selected
  .x-grid3-cell.syno-ux-textfield
  .x-grid3-cell-inner {
  background-color: transparent;
}
.syno-gridtree .no-node-icon .x-tree-node-leaf .x-tree-node-icon,
.syno-gridtree .no-node-icon .x-tree-node-collapsed .x-tree-node-icon,
.syno-gridtree .no-node-icon .x-tree-node-expanded .x-tree-node-icon {
  display: none;
}
.syno-gridtree .syno-ux-gridpanel-empty-hint {
  color: transparent !important;
  position: absolute;
  width: 1px;
  height: 1px;
}
.ext-ie8 .syno-gridtree .syno-ux-gridpanel-empty-hint {
  display: none;
}
.syno-ux-scheduletable .schedule-table td.schedule-hour-td,
.syno-ux-scheduletable .schedule-table td.schedule-day-td {
  background-color: rgba(198, 212, 224, 0.08);
  color: #414b55;
  line-height: 24px;
  text-align: center;
  cursor: pointer;
}
.syno-ux-scheduletable .schedule-table-ct {
  display: inline-block;
  position: relative;
  border-radius: 4px;
  overflow: hidden;
}
.syno-ux-scheduletable .schedule-table {
  border-collapse: collapse;
}
.syno-ux-scheduletable .schedule-table:before,
.syno-ux-scheduletable .schedule-table::before {
  content: "";
  border: 1px solid rgba(198, 212, 224, 0.7);
  border-radius: 4px;
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  pointer-events: none;
}
.syno-ux-scheduletable .schedule-table td {
  height: 24px;
  width: 24px;
  border: 1px solid #e6ecf2;
}
.syno-ux-scheduletable .schedule-table td.schedule-select-all-td {
  width: 42px !important;
  vertical-align: bottom;
  background-color: rgba(198, 212, 224, 0.08);
}
.syno-ux-scheduletable
  .schedule-table
  td.schedule-select-all-td.schedule-select-all-td-over {
  background-color: rgba(5, 127, 235, 0.06);
}
.syno-ux-scheduletable
  .schedule-table
  td.schedule-select-all-td.schedule-select-all-td-over
  .select-all-triangle {
  border-bottom: 8px solid rgba(5, 127, 235, 0.8);
}
.syno-ux-scheduletable
  .schedule-table
  td.schedule-select-all-td
  .select-all-triangle {
  width: 0px;
  height: 0px;
  float: right;
  border-left: 8px solid transparent;
  border-bottom: 8px solid #057feb;
  margin: 0px 3px 3px 0px;
}
.syno-ux-scheduletable .schedule-table td.schedule-hour-td {
  font-size: 12px;
}
.syno-ux-scheduletable
  .schedule-table
  td.schedule-hour-td.schedule-hour-td-over {
  background-color: rgba(5, 127, 235, 0.06);
}
.syno-ux-scheduletable .schedule-table td.schedule-day-td {
  font-size: 12px;
  width: 42px !important;
}
.syno-ux-scheduletable .schedule-table td.schedule-day-td.schedule-day-td-over {
  background-color: rgba(5, 127, 235, 0.06);
}
.syno-ux-scheduletable .schedule-table td.schedule-td:hover,
.syno-ux-scheduletable .schedule-table td.schedule-td.x-view-selected {
  background-color: rgba(5, 127, 235, 0.06);
}
.syno-ux-scheduletable .schedule-table td.schedule-td.schedule-td-full-speed {
  background-color: #057feb;
}
.syno-ux-scheduletable
  .schedule-table
  td.schedule-td.schedule-td-full-speed:hover,
.syno-ux-scheduletable
  .schedule-table
  td.schedule-td.schedule-td-full-speed.x-view-selected {
  background-color: rgba(5, 127, 235, 0.8);
}
.syno-ux-scheduletable .schedule-table td.schedule-td.schedule-td-alt-speed {
  background-color: #ffc041;
}
.syno-ux-scheduletable
  .schedule-table
  td.schedule-td.schedule-td-alt-speed:hover,
.syno-ux-scheduletable
  .schedule-table
  td.schedule-td.schedule-td-alt-speed.x-view-selected {
  opacity: 0.8;
}
.syno-ux-scheduletable .schedule-btn {
  padding-top: 2px;
}
.syno-ux-scheduletable .schedule-btn .x-btn-tl,
.syno-ux-scheduletable .schedule-btn .x-btn-tc,
.syno-ux-scheduletable .schedule-btn .x-btn-tr,
.syno-ux-scheduletable .schedule-btn .x-btn-ml,
.syno-ux-scheduletable .schedule-btn .x-btn-mr,
.syno-ux-scheduletable .schedule-btn .x-btn-bl,
.syno-ux-scheduletable .schedule-btn .x-btn-bc,
.syno-ux-scheduletable .schedule-btn .x-btn-br {
  display: none;
}
.syno-ux-scheduletable .schedule-btn .x-btn-mc {
  height: 24px;
  background-image: none;
  border-radius: 3px;
}
.syno-ux-scheduletable .schedule-btn .x-btn-small .x-btn-text {
  width: 14px;
  height: 14px;
  padding: 0px;
  margin: 5px;
  border: 1px solid #e6e8ea;
  border-radius: 1px;
}
.syno-ux-scheduletable .schedule-btn .x-btn-small .schedule-btn-no-download {
  background-position: -5px -5px;
  border: none;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack
    .syno-ux-scheduletable
    .schedule-btn
    .x-btn-small
    .schedule-btn-no-download {
    background-size: 24px 24px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug
    .syno-ux-scheduletable
    .schedule-btn
    .x-btn-small
    .schedule-btn-no-download {
    background-size: 24px 24px;
    outline: 1px green dashed;
  }
}
.syno-ux-scheduletable .schedule-btn .x-btn-small .schedule-btn-full-speed {
  background-color: #057feb;
}
.syno-ux-scheduletable .schedule-btn .x-btn-small .schedule-btn-alt-speed {
  background-color: #ffc041;
}
.syno-ux-scheduletable .schedule-btn.x-btn-over .x-btn-mc {
  background-color: rgba(198, 212, 224, 0.2);
}
.syno-ux-scheduletable .schedule-btn.x-btn-pressed .x-btn-mc {
  background-color: rgba(198, 212, 224, 0.4);
}
.syno-ux-scheduletable .schedule-btn-label {
  width: 176px;
}
.syno-ux-switch {
  width: 64px;
  height: 24px;
  line-height: 24px;
  overflow: hidden;
  text-align: left;
  border-radius: 3px;
  border: 1px solid #b4bec8;
  position: relative;
  margin: 0px auto;
}
.syno-ux-switch .syno-ux-switch-container {
  position: relative;
  width: 128px;
  -moz-transition: margin-left, 0.25s, ease-out;
  -o-transition: margin-left, 0.25s, ease-out;
  -webkit-transition: margin-left, 0.25s, ease-out;
  transition: margin-left, 0.25s, ease-out;
}
.syno-ux-switch .syno-ux-switch-off,
.syno-ux-switch .syno-ux-switch-on {
  display: inline-block;
  text-indent: -28px;
  width: 64px;
  height: 100%;
  line-height: 24px;
  text-align: center;
}
.syno-ux-switch .syno-ux-switch-label {
  position: absolute;
  top: 0;
  left: 36px;
  display: block;
  width: 29px;
  height: 100%;
  margin: 0;
  font-size: 0;
}
.syno-ux-switch.syno-ux-switch-status-off .syno-ux-switch-container {
  margin-left: -37px;
}
.syno-ux-switch.syno-ux-switch-status-off .syno-ux-switch-label {
  border-right: 1px solid #b4bec8;
}
.syno-ux-switch.syno-ux-switch-status-on .syno-ux-switch-container {
  margin-left: -1px;
}
.syno-ux-switch.syno-ux-switch-status-on .syno-ux-switch-label {
  border-left: 1px solid #b4bec8;
}
.syno-ux-switch.syno-ux-switch-normal .syno-ux-switch-off {
  color: #414b55;
  background-color: #f5faff;
  box-shadow: inset 0px 1px 0px rgba(80, 90, 100, 0.1);
}
.syno-ux-switch.syno-ux-switch-normal .syno-ux-switch-on {
  color: #fff;
  background-color: #1363bf;
  box-shadow: inset 0px 1px 0px rgba(80, 90, 100, 0.15);
}
.syno-ux-switch.syno-ux-switch-normal .syno-ux-switch-label {
  background-size: 100%;
  background-image: -webkit-gradient(
    linear,
    50% 0%,
    50% 100%,
    color-stop(0%, #f5faff),
    color-stop(100%, rgba(198, 212, 224, 0.4))
  );
  background-image: -moz-linear-gradient(#f5faff, rgba(198, 212, 224, 0.4));
  background-image: -webkit-linear-gradient(#f5faff, rgba(198, 212, 224, 0.4));
  background-image: linear-gradient(#f5faff, rgba(198, 212, 224, 0.4));
}
.syno-ux-switch.syno-ux-switch-normal .syno-ux-switch-label:hover {
  background-size: 100%;
  background-image: -webkit-gradient(
    linear,
    50% 0%,
    50% 100%,
    color-stop(0%, #f5faff),
    color-stop(100%, #e6ebf0)
  );
  background-image: -moz-linear-gradient(#f5faff, #e6ebf0);
  background-image: -webkit-linear-gradient(#f5faff, #e6ebf0);
  background-image: linear-gradient(#f5faff, #e6ebf0);
}
.syno-ux-switch.syno-ux-switch-normal .syno-ux-switch-label:active {
  background-size: 100%;
  background-image: -webkit-gradient(
    linear,
    50% 0%,
    50% 100%,
    color-stop(0%, rgba(198, 212, 224, 0.4)),
    color-stop(100%, #e1e6eb)
  );
  background-image: -moz-linear-gradient(
    top,
    rgba(198, 212, 224, 0.4),
    #e1e6eb
  );
  background-image: -webkit-linear-gradient(
    top,
    rgba(198, 212, 224, 0.4),
    #e1e6eb
  );
  background-image: linear-gradient(
    to bottom,
    rgba(198, 212, 224, 0.4),
    #e1e6eb
  );
}
.syno-ux-switch.syno-ux-switch-disable .syno-ux-switch-off {
  color: rgba(65, 75, 85, 0.4);
  background-color: #e6ebf0;
  box-shadow: inset 0px 1px 0px rgba(80, 90, 100, 0.1);
}
.syno-ux-switch.syno-ux-switch-disable .syno-ux-switch-on {
  color: #e5f4ff;
  background-color: #99b8dc;
  box-shadow: inset 0px 1px 0px rgba(80, 90, 100, 0.1);
}
.syno-ux-switch.syno-ux-switch-disable .syno-ux-switch-label {
  background-size: 100%;
  background-image: -webkit-gradient(
    linear,
    50% 0%,
    50% 100%,
    color-stop(0%, #f5faff),
    color-stop(100%, rgba(198, 212, 224, 0.4))
  );
  background-image: -moz-linear-gradient(#f5faff, rgba(198, 212, 224, 0.4));
  background-image: -webkit-linear-gradient(#f5faff, rgba(198, 212, 224, 0.4));
  background-image: linear-gradient(#f5faff, rgba(198, 212, 224, 0.4));
}
@-webkit-keyframes slidein {
  0% {
    left: 0;
    top: 100%;
  }
  100% {
    left: 0;
    top: 0;
  }
}
@-o-keyframes slidein {
  0% {
    left: 0;
    top: 100%;
  }
  100% {
    left: 0;
    top: 0;
  }
}
@-moz-keyframes slidein {
  0% {
    left: 0;
    top: 100%;
  }
  100% {
    left: 0;
    top: 0;
  }
}
@keyframes slidein {
  0% {
    left: 0;
    top: 100%;
  }
  100% {
    left: 0;
    top: 0;
  }
}
@-webkit-keyframes slideout {
  0% {
    left: 0;
    top: 0;
  }
  100% {
    left: 0;
    top: 100%;
  }
}
@-o-keyframes slideout {
  0% {
    left: 0;
    top: 0;
  }
  100% {
    left: 0;
    top: 100%;
  }
}
@-moz-keyframes slideout {
  0% {
    left: 0;
    top: 0;
  }
  100% {
    left: 0;
    top: 100%;
  }
}
@keyframes slideout {
  0% {
    left: 0;
    top: 0;
  }
  100% {
    left: 0;
    top: 100%;
  }
}
.slidein-effect {
  -webkit-animation: slidein 300ms ease-out;
  -moz-animation: slidein 300ms ease-out;
  -o-animation: slidein 300ms ease-out;
  animation: slidein 300ms ease-out;
}
.slideout-effect {
  -webkit-animation: slideout 300ms ease-out;
  -moz-animation: slideout 300ms ease-out;
  -o-animation: slideout 300ms ease-out;
  animation: slideout 300ms ease-out;
}
.sds-window-v5 .syno-ux-cover-panel .syno-ux-coverable-panel-tool-wrap {
  width: 100%;
  cursor: pointer;
}
.sds-window-v5
  .syno-ux-cover-panel
  .syno-ux-coverable-panel-tool-wrap
  .syno-ux-collapsed-text {
  font-size: 15px;
  color: #057feb;
  line-height: 24px;
  float: left;
}
.sds-window-v5
  .syno-ux-cover-panel
  .syno-ux-coverable-panel-tool-wrap
  .syno-ux-expand {
  width: 24px;
  height: 24px;
  float: left;
  background-repeat: no-repeat;
  background-position: 0 -216px;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack
    .sds-window-v5
    .syno-ux-cover-panel
    .syno-ux-coverable-panel-tool-wrap
    .syno-ux-expand {
    background-size: 24px 288px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug
    .sds-window-v5
    .syno-ux-cover-panel
    .syno-ux-coverable-panel-tool-wrap
    .syno-ux-expand {
    background-size: 24px 288px;
    outline: 1px green dashed;
  }
}
.sds-window-v5
  .syno-ux-cover-panel
  .syno-ux-coverable-panel-tool-wrap:hover
  .syno-ux-expand {
  background-position: 0 -240px;
}
.sds-window-v5
  .syno-ux-cover-panel
  .syno-ux-coverable-panel-tool-wrap:active
  .syno-ux-expand {
  background-position: 0 -264px;
}
.sds-window-v5
  .syno-ux-cover-panel
  .syno-ux-coverable-panel-tool-wrap
  .syno-ux-collapse {
  width: 24px;
  height: 24px;
  float: left;
  background-repeat: no-repeat;
  background-position: 0 -144px;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack
    .sds-window-v5
    .syno-ux-cover-panel
    .syno-ux-coverable-panel-tool-wrap
    .syno-ux-collapse {
    background-size: 24px 288px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug
    .sds-window-v5
    .syno-ux-cover-panel
    .syno-ux-coverable-panel-tool-wrap
    .syno-ux-collapse {
    background-size: 24px 288px;
    outline: 1px green dashed;
  }
}
.sds-window-v5
  .syno-ux-cover-panel
  .syno-ux-coverable-panel-tool-wrap:hover
  .syno-ux-collapse {
  background-position: 0 -168px;
}
.sds-window-v5
  .syno-ux-cover-panel
  .syno-ux-coverable-panel-tool-wrap:active
  .syno-ux-collapse {
  background-position: 0 -192px;
}
.sds-window-v5 .syno-ux-cover-panel .syno-ux-coverable-panel-up-item {
  position: absolute;
  top: 0;
  left: 0;
  background-color: #fff;
  z-index: 100;
}
.sds-window-v5 .syno-ux-cover-panel .syno-ux-coverable-panel-up-item.hidden {
  top: 10000px;
  left: 10000px;
}
.sds-window-v5 .syno-ux-cover-panel .syno-ux-coverable-panel-down-item {
  position: relative;
  z-index: 0;
}
.sds-window-v5 .syno-ux-cover-panel .syno-ux-cover-panel-bottom-wrap,
.sds-window-v5 .syno-ux-cover-panel .syno-ux-cover-panel-top-wrap {
  padding-top: 6px;
  padding-bottom: 6px;
  background-repeat: repeat-x;
  border: 0px;
  height: 24px;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack
    .sds-window-v5
    .syno-ux-cover-panel
    .syno-ux-cover-panel-bottom-wrap,
  .synohdpack
    .sds-window-v5
    .syno-ux-cover-panel
    .syno-ux-cover-panel-top-wrap {
    background-size: 8px 4px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug
    .sds-window-v5
    .syno-ux-cover-panel
    .syno-ux-cover-panel-bottom-wrap,
  .synohdpackdebug
    .sds-window-v5
    .syno-ux-cover-panel
    .syno-ux-cover-panel-top-wrap {
    background-size: 8px 4px;
    outline: 1px green dashed;
  }
}
.sds-window-v5 .syno-ux-cover-panel .syno-ux-cover-panel-top-wrap {
  background-position: 0 100%;
  padding-bottom: 10px;
}
.sds-window-v5 .syno-ux-cover-panel .syno-ux-cover-panel-bottom-wrap {
  padding-top: 10px;
}
.syno-ux-backnextgroup-back.x-btn {
  margin-right: 0 !important;
  border-radius: 3px 0 0 3px;
  border-right: 1px solid rgba(198, 212, 224, 0.9);
}
.syno-ux-backnextgroup-back.x-btn button {
  background-position: 1px 1px;
  background-repeat: no-repeat;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack .syno-ux-backnextgroup-back.x-btn button {
    background-size: 24px 192px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug .syno-ux-backnextgroup-back.x-btn button {
    background-size: 24px 192px;
    outline: 1px green dashed;
  }
}
.syno-ux-backnextgroup-back.x-btn-over.x-btn {
  border: 1px solid rgba(124, 138, 152, 0.4);
  line-height: 26px;
}
.syno-ux-backnextgroup-next.x-btn {
  margin-left: -1px !important;
  border-radius: 0 3px 3px 0;
}
.syno-ux-backnextgroup-next.x-btn button {
  background-position: 1px -47px;
  background-repeat: no-repeat;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack .syno-ux-backnextgroup-next.x-btn button {
    background-size: 24px 192px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug .syno-ux-backnextgroup-next.x-btn button {
    background-size: 24px 192px;
    outline: 1px green dashed;
  }
}
.syno-ux-backnextgroup-next.x-btn-over.x-btn {
  border: 1px solid rgba(124, 138, 152, 0.4);
  line-height: 26px;
}
.syno-ux-sliderfield-slider.x-slider-horz {
  background: none;
  padding-left: 9px;
}
.syno-ux-sliderfield-slider.x-slider-horz.calibration {
  padding-left: 7px;
}
.syno-ux-sliderfield-slider.x-slider-horz.calibration .x-slider-inner,
.syno-ux-sliderfield-slider.x-slider-horz.calibration .x-slider-end {
  height: 24px;
  background: none;
}
.syno-ux-sliderfield-slider.x-slider-horz.calibration .x-slider-end {
  padding-right: 7px;
}
.syno-ux-sliderfield-slider.x-slider-horz.calibration .x-slider-thumb {
  width: 15px;
  height: 24px;
  top: 0;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack
    .syno-ux-sliderfield-slider.x-slider-horz.calibration
    .x-slider-thumb {
    background-size: 30px 48px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug
    .syno-ux-sliderfield-slider.x-slider-horz.calibration
    .x-slider-thumb {
    background-size: 30px 48px;
    outline: 1px green dashed;
  }
}
.syno-ux-sliderfield-slider.x-slider-horz.calibration
  .x-slider-thumb.x-slider-thumb-over,
.syno-ux-sliderfield-slider.x-slider-horz.calibration
  .x-slider-thumb.x-slider-thumb-drag {
  background-position: 0 0;
}
.syno-ux-sliderfield-slider.x-slider-horz.calibration.x-item-disabled
  .x-slider-thumb {
  background-position: -15px -24px;
}
.syno-ux-sliderfield-slider.x-slider-horz.calibration .syno-ux-slider-progress,
.syno-ux-sliderfield-slider.x-slider-horz.calibration .syno-ux-slider-bg {
  top: 10px;
}
.syno-ux-sliderfield-slider.x-slider-horz .x-slider-inner,
.syno-ux-sliderfield-slider.x-slider-horz .x-slider-end {
  height: 18px;
  background: none;
}
.syno-ux-sliderfield-slider.x-slider-horz .x-slider-end {
  padding-right: 9px;
}
.syno-ux-sliderfield-slider.x-slider-horz .x-slider-thumb {
  width: 18px;
  height: 18px;
  top: 0;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack .syno-ux-sliderfield-slider.x-slider-horz .x-slider-thumb {
    background-size: 36px 36px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug .syno-ux-sliderfield-slider.x-slider-horz .x-slider-thumb {
    background-size: 36px 36px;
    outline: 1px green dashed;
  }
}
.syno-ux-sliderfield-slider.x-slider-horz .x-slider-thumb.x-slider-thumb-over,
.syno-ux-sliderfield-slider.x-slider-horz .x-slider-thumb.x-slider-thumb-drag {
  background-position: 0 0;
}
.syno-ux-sliderfield-slider.x-slider-horz.x-item-disabled .x-slider-thumb {
  background-position: -18px -18px;
}
.syno-ux-sliderfield-slider.x-slider-horz.x-item-disabled
  .syno-ux-slider-progress {
  background-color: #bbe0fa;
}
.syno-ux-sliderfield-slider.x-slider-horz.x-item-disabled .syno-ux-slider-bg {
  background-color: #e1e6e8;
}
.syno-ux-sliderfield-slider.x-slider-horz .syno-ux-slider-progress {
  position: absolute;
  top: 7px;
  height: 4px;
  border-radius: 2px;
  background-color: #057feb;
}
.syno-ux-sliderfield-slider.x-slider-horz .syno-ux-slider-bg {
  position: absolute;
  top: 7px;
  width: 100%;
  height: 4px;
  border-radius: 2px;
  background-color: #c8cdd2;
}
.syno-ux-gridpanel.syno-ux-ddgridpanel .x-grid3-col.x-grid3-cell-first,
.grid-dd-drag-proxy .x-grid3-col.x-grid3-cell-first {
  cursor: move;
  cursor: grab;
  cursor: -moz-grab;
  cursor: -webkit-grab;
}
.syno-ux-gridpanel.syno-ux-ddgridpanel
  .x-grid3-col.x-grid3-cell-first
  .x-grid3-cell-inner,
.grid-dd-drag-proxy .x-grid3-col.x-grid3-cell-first .x-grid3-cell-inner,
.syno-ux-gridpanel.syno-ux-ddgridpanel
  .x-grid3-col.x-grid3-cell-first
  .x-grid3-hd-inner,
.grid-dd-drag-proxy .x-grid3-col.x-grid3-cell-first .x-grid3-hd-inner,
.syno-ux-gridpanel.syno-ux-ddgridpanel
  .x-grid3-hd.x-grid3-col.x-grid3-cell-first,
.grid-dd-drag-proxy .x-grid3-hd.x-grid3-col.x-grid3-cell-first {
  cursor: default;
}
.syno-ux-gridpanel.syno-ux-ddgridpanel
  .syno-ux-ddgrid-grabbing-style
  .x-grid3-row,
.syno-ux-gridpanel.syno-ux-ddgridpanel
  .syno-ux-ddgrid-grabbing-style
  .x-grid3-row
  .x-grid3-cell-first,
.syno-ux-gridpanel.syno-ux-ddgridpanel
  .syno-ux-ddgrid-grabbing-style
  .x-grid3-row
  .x-grid3-cell-first
  .x-grid3-cell-inner,
.syno-ux-gridpanel.syno-ux-ddgridpanel
  .syno-ux-ddgrid-grabbing-style
  .x-grid3-row
  .x-grid3-cell-first
  .x-grid3-hd-inner,
.syno-ux-gridpanel.syno-ux-ddgridpanel
  .syno-ux-ddgrid-grabbing-style
  .x-grid3-row
  .x-grid3-cell-first.x-grid3-hd,
.syno-ux-gridpanel.syno-ux-ddgridpanel .syno-ux-ddgrid-grabbing-style {
  background-color: transparent;
  cursor: grabbing;
  cursor: -moz-grabbing;
  cursor: -webkit-grabbing;
}
.syno-ux-gridpanel.syno-ux-ddgridpanel
  .x-grid3-hd-row
  .x-grid3-cell.x-grid3-cell-first
  .x-grid3-hd-inner:before {
  content: "";
  display: inline-block;
  position: absolute;
  left: 16px;
  height: 100%;
  vertical-align: top;
  border-left: rgba(198, 212, 224, 0.4) 1px solid;
}
.syno-ux-gridpanel.syno-ux-ddgridpanel .x-grid3-col.x-grid3-cell-first,
.grid-dd-drag-proxy .x-grid3-col.x-grid3-cell-first {
  position: relative;
}
.syno-ux-gridpanel.syno-ux-ddgridpanel .x-grid3-col.x-grid3-cell-first:before,
.grid-dd-drag-proxy .x-grid3-col.x-grid3-cell-first:before {
  content: "";
  height: 24px;
  width: 8px;
  position: absolute;
  top: 0px;
  bottom: 0px;
  left: 0px;
  margin: auto 4px auto 4px;
  background-repeat: no-repeat;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack
    .syno-ux-gridpanel.syno-ux-ddgridpanel
    .x-grid3-col.x-grid3-cell-first:before,
  .syno-ux-gridpanel.syno-ux-ddgridpanel
    .synohdpack
    .x-grid3-col.x-grid3-cell-first:before,
  .synohdpack .grid-dd-drag-proxy .x-grid3-col.x-grid3-cell-first:before,
  .grid-dd-drag-proxy .synohdpack .x-grid3-col.x-grid3-cell-first:before {
    background-size: 8px 72px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug
    .syno-ux-gridpanel.syno-ux-ddgridpanel
    .x-grid3-col.x-grid3-cell-first:before,
  .syno-ux-gridpanel.syno-ux-ddgridpanel
    .synohdpackdebug
    .x-grid3-col.x-grid3-cell-first:before,
  .synohdpackdebug .grid-dd-drag-proxy .x-grid3-col.x-grid3-cell-first:before,
  .grid-dd-drag-proxy .synohdpackdebug .x-grid3-col.x-grid3-cell-first:before {
    background-size: 8px 72px;
    outline: 1px green dashed;
  }
}
.syno-ux-gridpanel.syno-ux-ddgridpanel
  .x-grid3-col.x-grid3-cell-first
  .x-grid3-cell-inner,
.grid-dd-drag-proxy .x-grid3-col.x-grid3-cell-first .x-grid3-cell-inner,
.syno-ux-gridpanel.syno-ux-ddgridpanel
  .x-grid3-col.x-grid3-cell-first
  .x-grid3-hd-inner,
.grid-dd-drag-proxy .x-grid3-col.x-grid3-cell-first .x-grid3-hd-inner {
  margin-left: 16px;
}
.syno-ux-gridpanel.syno-ux-ddgridpanel
  .x-grid3-hd.x-grid3-col.x-grid3-cell-first,
.grid-dd-drag-proxy .x-grid3-hd.x-grid3-col.x-grid3-cell-first {
  background-image: none;
}
.syno-ux-gridpanel.syno-ux-ddgridpanel
  .x-grid3-hd.x-grid3-col.x-grid3-cell-first
  .x-grid3-hd-inner,
.grid-dd-drag-proxy
  .x-grid3-hd.x-grid3-col.x-grid3-cell-first
  .x-grid3-hd-inner {
  border-left: 1px solid rgba(198, 212, 224, 0.4);
}
.syno-ux-gridpanel.syno-ux-ddgridpanel.syno-ux-ddgridpanel-highcell
  .x-grid3-col.x-grid3-cell-first
  .x-grid3-cell-inner,
.syno-ux-gridpanel.syno-ux-ddgridpanel.syno-ux-ddgridpanel-highcell
  .x-grid3-col.x-grid3-cell-first
  .x-grid3-hd-inner {
  margin-left: 18px;
  padding-left: 0px;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack
    .syno-ux-gridpanel.syno-ux-ddgridpanel.syno-ux-ddgridpanel-highcell
    .x-grid3-col.x-grid3-cell-first:before {
    background-size: 8px 72px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug
    .syno-ux-gridpanel.syno-ux-ddgridpanel.syno-ux-ddgridpanel-highcell
    .x-grid3-col.x-grid3-cell-first:before {
    background-size: 8px 72px;
    outline: 1px green dashed;
  }
}
.syno-ux-gridpanel.syno-ux-ddgridpanel
  .x-grid3-hd-row
  .x-grid3-cell.x-grid3-cell-first
  .x-grid3-hd-inner {
  padding-left: 24px;
}
.syno-ux-gridpanel.syno-ux-ddgridpanel.is-dragging .x-grid3-row-selected {
  background-color: rgba(222, 236, 252, 0.1) !important;
}
.syno-ux-gridpanel.syno-ux-ddgridpanel.is-dragging .x-grid3-row-selected div {
  color: rgba(65, 75, 85, 0.4);
}
.syno-ux-gridpanel.syno-ux-ddgridpanel.is-dragging
  .x-grid3-row-selected
  .x-grid3-cell-first:before {
  background-position-y: -48px;
}
.syno-ux-gridpanel.syno-ux-ddgridpanel.is-dragging
  .x-grid3-row-selected
  .syno-ux-grid-enable-column-checked {
  background-position: center -100px;
}
.syno-ux-gridpanel.syno-ux-ddgridpanel.is-dragging
  .x-grid3-row-selected
  .syno-ux-grid-enable-column-unchecked {
  background-position: center -40px;
}
.syno-ux-gridpanel.syno-ux-ddgridpanel.is-dragging
  .x-grid3-row-selected
  .syno-ux-grid-enable-column-grayed {
  background-position: center -160px;
}
.syno-ux-gridpanel.syno-ux-ddgridpanel
  .x-grid3-row-over
  .x-grid3-cell-first:before {
  background-position-y: -24px;
}
.syno-ux-gridpanel.syno-ux-ddgridpanel
  .x-grid3-row-selected
  .x-grid3-cell-first:before {
  background-position-y: -24px;
}
.syno-ux-gridpanel.syno-ux-ddgridpanel .x-grid3-row.syno-ux-ddgrid-border-top {
  border-top: solid 1px #057feb;
}
.syno-ux-gridpanel.syno-ux-ddgridpanel
  .x-grid3-row.syno-ux-ddgrid-border-bottom {
  border-bottom: solid 1px #057feb;
}
.grid-dd-drag-proxy {
  padding: 0;
  background: #ffffff;
  border: 1px solid rgba(5, 127, 235, 0.2);
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.08);
}
.grid-dd-drag-proxy .x-grid3-row {
  border: none;
  background-color: rgba(5, 127, 235, 0.1);
  padding-top: 0px;
}
.grid-dd-drag-proxy .x-grid3-col.x-grid3-cell-first:before {
  background-position-y: -24px;
}
.grid-dd-drag-proxy .x-dd-drag-ghost {
  filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
  opacity: 1;
  padding: 0px;
  font-size: 13px;
  border: none;
}
.syno-ux-whitetip-icon {
  width: 24px;
  height: 24px;
  margin-top: 2px;
  display: inline-block;
  vertical-align: middle;
  margin-left: 4px;
  vertical-align: top;
  overflow: visible;
  position: relative;
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpack .syno-ux-whitetip-icon {
    background-size: 24px 24px;
  }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
  (-o-min-device-pixel-ratio: 3 / 2),
  (min-resolution: 144dpi) {
  .synohdpackdebug .syno-ux-whitetip-icon {
    background-size: 24px 24px;
    outline: 1px green dashed;
  }
}
.syno-ux-whitetip-icon:before,
.syno-ux-whitetip-icon::before {
  content: "";
  width: 24px;
  height: 24px;
  top: 0px;
  position: absolute;
}
.syno-ux-whitetip-icon.x-item-disabled {
  opacity: 0.4 !important;
}
.x-form-check-wrap .syno-ux-whitetip-icon {
  margin-top: 0px;
}
.x-form-display-field .syno-ux-whitetip-icon {
  margin-left: 4px;
  margin-top: 0px;
}
.x-tip-white {
  z-index: 20002 !important;
}
.x-tip-white.wtip-text-wrapper {
  padding: 12px 20px 12px 20px;
}
.x-tip-white.wtip-items-wrapper {
  padding: 20px 20px 20px 20px;
}
.x-tip-white {
  background-color: #ffffff;
  border-radius: 8px;
  box-shadow: 0 4px 15px 0 rgba(0, 0, 0, 0.2);
  padding: 12px 20px 12px 24px;
  display: inline-block;
}
.x-tip-white .x-tip-white-body {
  line-height: 20px;
}
.x-tip-white .text-only {
  font-size: 13px;
  color: #414b55;
  line-height: 20px;
  word-wrap: break-word;
}