/* Minification failed. Returning unminified contents.
(1784,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(1785,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(1786,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(1787,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(1788,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(1795,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(3663,23): run-time error CSS1039: Token not allowed after unary operator: '-portal-environment'
(7785,27): run-time error CSS1039: Token not allowed after unary operator: '-toolbar-justify-content'
(7786,23): run-time error CSS1039: Token not allowed after unary operator: '-toolbar-align-items'
(7787,26): run-time error CSS1039: Token not allowed after unary operator: '-toolbar-flex-direction'
(7791,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(7795,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(7799,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(7803,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(7807,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(7811,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(7815,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(7819,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(7825,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(7829,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(7833,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(7837,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(7841,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(7845,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(7850,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(9213,37): run-time error CSS1046: Expect comma, found '0'
(9213,41): run-time error CSS1046: Expect comma, found '/'
(10228,36): run-time error CSS1046: Expect comma, found '0'
(10228,40): run-time error CSS1046: Expect comma, found '/'
(11153,35): run-time error CSS1030: Expected identifier, found '.'
(11153,58): run-time error CSS1031: Expected selector, found ')'
(11153,58): run-time error CSS1025: Expected comma or open brace, found ')'
(12235,26): run-time error CSS1030: Expected identifier, found '['
(12235,32): run-time error CSS1031: Expected selector, found '^='
(12235,32): run-time error CSS1025: Expected comma or open brace, found '^='
(15424,43): run-time error CSS1034: 
(15424,43): run-time error CSS1042: Expected function, found ','
(15424,48): run-time error CSS1062: Expected semicolon or closing curly-brace, found ')'
(15430,43): run-time error CSS1034: 
(15430,43): run-time error CSS1042: Expected function, found ','
(15430,48): run-time error CSS1062: Expected semicolon or closing curly-brace, found ')'
(15436,42): run-time error CSS1034: 
(15436,42): run-time error CSS1042: Expected function, found ','
(15436,47): run-time error CSS1062: Expected semicolon or closing curly-brace, found ')'
(15508,17): run-time error CSS1039: Token not allowed after unary operator: '-cardcontext-basecard-width'
(15509,18): run-time error CSS1039: Token not allowed after unary operator: '-cardcontext-basecard-height'
(15535,17): run-time error CSS1039: Token not allowed after unary operator: '-cardcontext-basecard-width'
(15536,18): run-time error CSS1039: Token not allowed after unary operator: '-cardcontext-basecard-height'
(15809,43): run-time error CSS1039: Token not allowed after unary operator: '-pie-rotate-calc-arg'
(15809,73): run-time error CSS1039: Token not allowed after unary operator: '-pie-rotate-maxval-arg'
(15818,47): run-time error CSS1039: Token not allowed after unary operator: '-pie-rotate-calc-arg'
(15818,77): run-time error CSS1039: Token not allowed after unary operator: '-pie-rotate-maxval-arg'
(16000,15): run-time error CSS1030: Expected identifier, found '.'
(16000,53): run-time error CSS1031: Expected selector, found ')'
(16000,53): run-time error CSS1025: Expected comma or open brace, found ')'
(16010,15): run-time error CSS1030: Expected identifier, found '.'
(16010,47): run-time error CSS1031: Expected selector, found ')'
(16010,47): run-time error CSS1025: Expected comma or open brace, found ')'
(17077,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(17078,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(17087,43): run-time error CSS1039: Token not allowed after unary operator: '-gantt-color'
(17087,64): run-time error CSS1039: Token not allowed after unary operator: '-gantt-percentdone-angle'
(17087,107): run-time error CSS1039: Token not allowed after unary operator: '-gantt-percentdone-angle'
(17102,16): run-time error CSS1030: Expected identifier, found '>'
(17102,41): run-time error CSS1031: Expected selector, found ')'
(17102,41): run-time error CSS1025: Expected comma or open brace, found ')'
(17109,56): run-time error CSS1030: Expected identifier, found '>'
(17109,81): run-time error CSS1031: Expected selector, found ')'
(17109,81): run-time error CSS1025: Expected comma or open brace, found ')'
(21921,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(21922,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(21923,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(21924,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(21930,31): run-time error CSS1039: Token not allowed after unary operator: '-scheduler-v2-selected-tab-border-bottom-color'
(21977,22): run-time error CSS1039: Token not allowed after unary operator: '-scheduler-v2-selected-calendar-day-background-color'
(21983,38): run-time error CSS1039: Token not allowed after unary operator: '-scheduler-v2-calendar-today-border-color'
(22019,24): run-time error CSS1039: Token not allowed after unary operator: '-scheduler-v2-calendar-today-border-color'
(22054,24): run-time error CSS1039: Token not allowed after unary operator: '-scheduler-v2-scheduler-today-border-color'
 */
/* ============================== EXTJS RESETS ============================== */

/* Font family resets */
.x-dd-drag-ghost,
.x-body,
.x-mask-msg-inner,
.x-progress-default .x-progress-text,
.x-toolbar-text-default,
.x-toolbar-text-footer,
.x-panel-header-title-default,
.x-panel-body-default,
.x-panel-header-title-default-framed,
.x-panel-body-default-framed,
.x-form-item-label-default,
.x-form-invalid-under-default,
.x-form-item-label-toolbar,
.x-form-invalid-under-toolbar,
.x-form-display-field-default,
.x-form-display-field-toolbar,
.x-grid-empty,
.x-grid-item,
.x-form-cb-label-default,
.x-form-cb-label-toolbar,
.x-column-header,
.x-form-text-default,
.x-form-text-toolbar,
.x-btn-inner-default-small,
.x-btn-inner-default-medium,
.x-btn-inner-default-large,
.x-btn-inner-default-toolbar-small,
.x-btn-inner-default-toolbar-medium,
.x-btn-inner-default-toolbar-large,
.x-tab-inner-default,
.x-window-body-default,
.x-window-header-title-default,
.x-btn-group-header-text-container-default,
.x-btn-group-header-text-container-default-framed,
.x-fieldset-header-default > .x-fieldset-header-text,
.x-boundlist-item,
.x-datepicker-column-header,
.x-datepicker-date,
.x-monthpicker-item,
.x-html-editor-wrap textarea,
.x-form-text-grid-cell,
.x-form-cb-label-grid-cell,
.x-btn-inner-grid-cell-small,
.x-grid-group-title,
.x-grid-rowbody,
.x-grid-row-summary .x-grid-cell,
.x-grid-row-summary .x-grid-cell-rowbody,
.x-grid-row-summary .x-grid-rowwrap,
.x-menu-item-text-default,
.x-form-display-field-grid-cell,
.x-accordion-hd .x-panel-header-title,
.field.x-tagcombo .x-taglabel-item-text {
    font-family: inherit;
    line-height: inherit;
    font-size: inherit;
    font-weight: inherit;
}

body .x-legend-item {
    font-family: inherit;
}

/* Line height resets */
.x-clear,
.x-title-icon-wrap,
.x-tool,
.x-box-scroller,
.x-col-move-bottom,
.x-form-trigger,
.x-btn-button,
.x-btn-split-bottom:after,
.x-tab-button,
.x-tab-close-btn,
.x-tab-bar-strip,
.x-grid-cell-inner-action-col,
.x-grid-cell-inner-checkcolumn,
.x-grid-editor div.x-form-action-col-field,
.x-grid-row-expander {
    line-height: inherit;
}

/* Filter resets */
.x-shim,
.x-proxy-el,
.x-dd-drag-repair .x-dd-drag-ghost,
.x-dd-drag-ghost,
.x-resizable-overlay,
.x-form-file-input,
.x-splitter-active,
.x-panel-ghost,
.x-panel-default-resizable .x-panel-handle,
.x-panel-default-framed-resizable .x-panel-handle,
.x-form-item-default.x-item-disabled,
.x-form-item-toolbar.x-item-disabled,
.x-btn-disabled.x-btn-default-small .x-btn-icon-el,
.x-btn-disabled.x-btn-default-medium .x-btn-icon-el,
.x-btn-disabled.x-btn-default-large .x-btn-icon-el,
.x-btn-disabled.x-btn-default-toolbar-small,
.x-btn-disabled.x-btn-default-toolbar-medium,
.x-btn-disabled.x-btn-default-toolbar-large,
.x-tab-default-br,
.x-tab-default .x-tab-close-btn,
.x-tab-default .x-tab-close-btn-over,
.x-tab-default.x-tab-disabled .x-tab-close-btn,
.x-window-ghost,
.x-tip-anchor-top,
.x-tip-anchor-bottom,
.x-tip-anchor-left,
.x-tip-anchor-right,
.x-bindinspector-unhighlighted,
.x-bindinspector-data-only .x-tree-icon,
.x-datepicker-arrow,
div.x-datepicker-arrow:hover,
.x-action-col-cell .x-item-disabled,
.x-btn-disabled.x-btn-grid-cell-small .x-btn-icon-el,
.x-resizable-handle,
.x-window .x-window-handle,
.x-resizable-pinned .x-resizable-handle {
    filter: none;
}

/* Font Size */
.x-body,
.x-progress-default .x-progress-text,
.x-panel-header-default,
.x-panel-header-title-default,
.x-panel-body-default,
.x-panel-header-default-framed,
.x-panel-header-title-default-framed,
.x-panel-body-default-framed,
.x-window-body-default,
.x-window-header-default,
.x-window-header-title-default,
.x-tip-header-title-default,
.x-tip-body-default,
.x-tip-header-title-form-invalid,
.x-tip-body-form-invalid,
.x-componentlist-tip .x-tip-body-default,
.x-menu-item-default .x-form-item-label {
    font-size: inherit;
    line-height: inherit;
}

    /* Color */
    .x-body,
    .x-field:not(.x-item-disabled) .x-tagfield-item.x-tagfield-item-selected,
    .x-mask-msg-inner,
    .x-progress-default .x-progress-text,
    .x-progress-default .x-progress-text-back,
    .x-toolbar-text-default,
    .x-toolbar-text-footer,
    .x-panel-header-title-default,
    .x-panel-body-default,
    .x-panel-header-title-default-framed,
    .x-panel-body-default-framed,
    .x-form-item-label-default,
    .x-form-invalid-under-default,
    .x-form-item-label-toolbar,
    .x-form-invalid-under-toolbar,
    .x-form-display-field-default,
    .x-form-display-field-toolbar,
    .x-grid-empty,
    .x-grid-item,
    .x-grid-item-over,
    .x-grid-item-focused,
    .x-grid-item-selected,
    .x-grid-row .x-grid-cell-selected,
    .x-column-header,
    .x-column-header.x-column-header-focus,
    .x-form-text-default,
    .x-form-text-default.x-form-text-file,
    .x-form-empty-field-default,
    .x-form-text-toolbar,
    .x-form-text-toolbar.x-form-text-file,
    .x-form-empty-field-toolbar,
    .x-btn-inner-default-small,
    .x-btn-inner-default-medium,
    .x-btn-inner-default-large,
    .x-btn-inner-default-toolbar-small,
    .x-btn.x-btn-disabled.x-btn-default-toolbar-small .x-btn-inner,
    .x-btn-inner-default-toolbar-medium,
    .x-btn.x-btn-disabled.x-btn-default-toolbar-medium .x-btn-inner,
    .x-btn-inner-default-toolbar-large,
    .x-btn.x-btn-disabled.x-btn-default-toolbar-large .x-btn-inner,
    .x-tab-inner-default,
    .x-tab.x-tab-active.x-tab-default .x-tab-inner-default,
    .x-tab.x-tab-disabled.x-tab-default .x-tab-inner-default,
    .x-window-body-default,
    .x-window-header-title-default,
    .x-window-header-default .x-window-header-icon,
    .x-tip-header-title-default,
    .x-tip-body-default,
    .x-tip-body-default a,
    .x-btn-group-header-text-container-default,
    .x-btn-group-header-text-container-default-framed,
    .x-fieldset-header-default > .x-fieldset-header-text,
    .x-datepicker-month .x-btn-inner,
    .x-datepicker-column-header,
    .x-datepicker-date,
    div.x-datepicker-date:hover,
    .x-datepicker-nextday .x-datepicker-date,
    .x-datepicker-disabled .x-datepicker-date,
    .x-datepicker-disabled div.x-datepicker-date:hover,
    .x-monthpicker-item-inner,
    .x-form-text-grid-cell,
    .x-form-text-grid-cell.x-form-text-file,
    .x-form-empty-field-grid-cell,
    .x-btn-inner-grid-cell-small,
    .x-grid-group-title,
    .x-menu-item-default .x-form-item-label,
    .x-menu-item-text-default,
    .x-form-display-field-grid-cell,
    .x-accordion-hd .x-panel-header-title,
    .x-multiselector-remove,
    .x-grid-item-over .x-multiselector-remove,
    .x-box-mc,
    .x-dd-drag-ghost {
        color: inherit;
    }


    .x-body {
        background-color: transparent;
    }









/* PANEL RESETS */
.x-panel-default {
    border-color: inherit;
}

.x-panel-body-default {
    background-color: transparent;
    color: inherit;
    border: 0px none;
}


body.x-border-layout-ct,
div.x-border-layout-ct,
.x-panel-body-default,
.x-panel-header-default {
    background-color: transparent;
    background-image: none;
}

.x-panel-header-default {
    border: 0px none;
    box-shadow: none;
}

.x-panel-header-title-default>.x-title-text-default {
    padding: 0;
    margin: 0;
}
.x-panel-header-default-horizontal.x-header-noborder {
    padding: 0;
}

.x-panel-header-default-top {
    box-shadow: none;
}

.x-panel-header-default .x-tool-img {
    background-color: transparent;
}



/* TAB RESETS */
.x-tab-bar {
    background-color: transparent;
    background-image: none;
    border: 0px none;
}
.x-tab-bar-default-top,
.x-tab-bar-strip-default {
    background-color: transparent;
    background-image: none;
}

.x-tab-bar-top > .x-tab-bar-strip-default {
    border: 0px none;
}

.x-tab-bar-default-top > .x-tab-bar-body-default,
.x-tab-bar-top > .x-tab-bar-body-default {
    padding: 0;
}

.x-tab.x-tab-default .x-tab-inner-default,
.x-tab.x-tab-active.x-tab-default .x-tab-inner-default {
    color: inherit;
}

.x-tab,
.x-tab.x-tab-over,
.x-tab.x-tab-active,
.x-tab-default-top.x-tab-focus {
    background-image: none;
    background-color: transparent;
    box-shadow: none;
    border: 0px solid;
    border-radius: 0px;
}

.x-tab-default {
    border-color: transparent;
}

    .x-tab.x-tab-active.x-tab-default-top, .x-tab.x-tab-active.x-tab-default-left, .x-tab.x-tab-active.x-tab-default-right {
        background-image: none;
        background-color: transparent;
        box-shadow: none;
    }

.x-tab-bar-body {
    padding: 0;
    margin: 0;
}

.x-tab-bar-strip {
    display: none;
    border-width: 0;
}

.x-tab-icon-right > .x-tab-inner-default,
.x-tab-icon-left > .x-tab-inner-default {
    max-width: 100%;
}

.x-tab-tabmenu-right,
.x-tab-bar-default-top .x-box-scroller-left,
.x-tab-bar-default-top .x-box-scroller-right {
    background-image: none;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    top: 0;
    bottom: 0;
}

.x-tab-default .x-tab-inner {
    font-weight: normal;
}

.x-tab-bar .x-tab-inner {
    background-image: none;
}

.x-tab-focus.x-tab-default .x-tab-button:before {
    outline: none;
}



/* BUTTON RESETS */
.x-btn,
.x-btn-default-toolbar-small,
.x-btn-inner-default-small {
    padding: 0;
    line-height: normal;
    vertical-align: bottom;
}

    .x-btn,
    .x-btn-default-toolbar-small,
    .x-btn.x-btn-over,
    .x-btn.x-btn-over.x-btn-default-small,
    .x-btn.x-btn-over.x-btn-default-toolbar-small,
    .x-btn.x-btn-pressed,
    .x-btn.x-btn-pressed.x-btn-default-small,
    .x-btn.x-btn-pressed.x-btn-default-toolbar-small
    .x-btn-focus,
    .x-btn-focus.x-btn-default-small,
    .x-btn-focus.x-btn-default-toolbar-small,
    .x-btn.x-btn-disabled,
    .x-btn.x-btn-disabled.x-btn-default-small,
    .x-btn.x-btn-disabled.x-btn-default-toolbar-small,
    .x-btn.x-btn-menu-active,
    .x-btn.x-btn-menu-active.x-btn-default-small,
    .x-btn.x-btn-menu-active.x-btn-default-toolbar-small,
    .x-btn.x-btn-menu-active.x-btn-default-toolbar-small,
    .x-btn.x-btn-pressed.x-btn-default-toolbar-small {
        background-image: none;
        background-color: transparent;
        /*border: 0px none;*/
        border-color: transparent;
        box-shadow: none;
    }

        .x-btn .x-btn-wrap {
            outline: none !important;
        }

.x-btn-disabled.x-btn-default-small .x-btn-inner,
.x-btn-disabled.x-btn-default-small .x-btn-icon-el {
    opacity: 1;
    filter: none;
    color: inherit;
}

.x-field-buttons-body .x-btn,
.x-field-buttons-body .x-btn:hover {
    border: 0px none;
}

.x-btn-icon>.x-btn-icon-el {
    display: inline-flex;
}

.x-btn-button-default-toolbar-small {
    height: auto;
}

.x-btn-inner-default-toolbar-small {
    padding: 0;
}

.x-btn-wrap-default-toolbar-small.x-btn-arrow-right::after,
.x-btn-wrap-default-small.x-btn-arrow-right::after {
    background-image: none;
}

.x-btn-focus.x-btn-default-toolbar-small,
.x-btn-focus.x-btn-menu-active.x-btn-default-toolbar-small,
.x-btn-focus.x-btn-pressed.x-btn-default-toolbar-small,
.x-btn-focus.x-btn-plain-toolbar-small {
    box-shadow: none;
}




/* FORM RESETS */
.x-form-text-wrap,
.x-form-text-wrap-toolbar,
.x-form-text-wrap-default {
    box-shadow: none;
    background-color: transparent;
    background-image: none;
    color: inherit;
    border: 0px none;
}

.x-form-text-default,
.x-form-text-toolbar {
    background-color: transparent;
    background-image: none;
    background-repeat: initial;
    padding: 0;
    margin: 0;
    min-height: 20px; /* same value as ExtJS base style, here it is set both for "x-form-text-default" and "x-form-text-toolbar" */
}

body.mobile .x-form-text-default,
body.mobile .x-form-text-toolbar {
    min-height: 30px;
}

.x-form-trigger-default,
.x-form-trigger-toolbar {
    border: 0px none;
    background: none;
    background-color: transparent;
    background-repeat: no-repeat;
}

.x-form-item-label-default.x-form-item-label-top>.x-form-item-label-inner {
    padding: 0;
}

.x-form-text-default.x-form-textarea {
    line-height: normal;
    min-height: unset;
}


/* Tooltip */
.x-tip-body-default {
    padding: 0;
}

/* Label */
.x-label {
    height: auto;
}


/* Error QTip */
.x-tip-form-invalid {
    background-image: none;
    background-color: transparent;
    border: 0px none;
}

.x-tip-body-form-invalid {
    background-image: none;
    background-color: transparent;
    color: inherit;
    padding: 0;

}


/* Date picker resets */
.x-datepicker {
    border-color: inherit;

}

.x-datepicker-header,
.x-datepicker-footer,
.x-datepicker-column-header,
.x-monthpicker-buttons {
    background-image: none;
    background-color: transparent;
    color: inherit;
}

.date-picker-cell.x-datepicker-selected .x-datepicker-date {
    background-color: transparent;
}

.x-monthpicker {
    border: 0px none;
}

.x-monthpicker-months {
    border: 0px none;
}


/* Checkbox resets */
.x-form-item-body-default.x-form-checkboxgroup-body {
    padding: 0;
}




/* GRID RESETS */
.x-grid-header {
    background-color: transparent;
    background-image: none;
}
.x-grid-header-ct {
    background-image: none;
    background-color: transparent;
    border: 0px none;
}

.x-grid-body {
    background-color: transparent;
    border: 0px none;
}

.x-grid-cell-inner {
    line-height: normal;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    padding: 0;
}

td.x-grid3-hd-over .x-grid3-hd-inner,
td.sort-desc .x-grid3-hd-inner,
td.sort-asc .x-grid3-hd-inner,
td.x-grid3-hd-menu-open .x-grid3-hd-inner {
    background-image: none;
}

.x-column-header,
.x-column-header-over,
.x-column-header-sort-ASC,
.x-column-header-sort-DESC,
.x-column-header-sort-ASC .x-column-header-text,
.x-column-header-sort-DESC .x-column-header-text {
    background-image: none;
    background-color: transparent;
    border: 0px none;
    background-position: unset;
}


.x-column-header-trigger {
    background-color: transparent;
}

.x-grid-item {
    background-color: transparent;
}

.x-grid-item-focused .x-grid-cell-inner:before {
    border: 0px none;
    outline: none;
}

.x-grid-row .x-grid-cell-special,
.x-grid-row-summary .x-grid-cell-special {
    background-color: transparent;
    background-image: none;
    border: 0px none;
    vertical-align: middle;
}

.x-grid-hd-row {
    border-left-color: transparent;
}

.x-view-item-focused .x-view-cell-inner:before {
    border: 0px none;
    outline: none;
}

.x-view-item-focused {
    outline: 0px !important;
    outline-offset: -1px;
}

.x-grid-cell.toolbar-cell {
    vertical-align: middle;
}

.x-grid-with-row-lines .x-grid-item {
    border-style: solid;
    border-color: transparent;
    border-width: 0px;
}

.x-grid-with-row-lines .x-grid-item.x-grid-item-selected {
    border-style: solid;
    border-color: transparent;
}

.x-grid-item-selected,
.x-grid-item-over,
.x-grid-item-focused {
    background-color: transparent;
    border: 0px none;
    outline: none;
}

.x-grid-empty {
    background-color: transparent;
}

.x-grid-row .x-grid-cell-selected {
    color: inherit;
    background-color: transparent;
}



/* TOOLBAR RESETS */

.x-toolbar-default {
    background-color: transparent;
    background-image: none !important;
    border: 0px none;
    padding: 0;
    margin: 0;
}

.x-toolbar-footer {
    background-color: transparent;
    padding: 0;
}

.x-toolbar-more-icon {
    background-image: none;
}


/* MENU RESETS */
.x-menu {
    background-image: none;
    border: 0px none;
}

.x-menu-body-default {
    background-color: transparent;
    background-image: none;
    padding: 0;
}

.x-menu-item {
    border: 0px none;
}

.x-menu-item-default.x-menu-item-active {
    background-image: none;
    border-radius: 0;
}

.x-menu-item-default.x-menu-item-separator {
    margin: 0;
    height: 1px;
    background-color: #CCC;
    border: 0px none;
}

/* TREE RESETS */

.x-tree-icon,
.x-tree-elbow-img,
.x-tree-checkbox {
    margin: 0;
}

.x-noleaf-icon .x-tree-icon-leaf,
.x-noleaf-icon .x-tree-icon-leaf:before {
    display: none !important;
}


/* BADGE RESETS */

.x-badge {
    border: 0px none;
    box-shadow: none;
}

    .x-badge .x-badge-inner {
        color: inherit;
    }

    .x-badge .x-badge-wrap {
        background-image: none;
        background-color: transparent;
    }

.x-badge-small .x-badge-inner {
    font-size: inherit;
}


/* WINDOW RESETS */
.x-window-default {
    padding: 0;
}

.x-window-body-default {
    background-color: transparent;
}

.x-window-header,
.x-window-header-default-top {
    background-color: transparent;
    box-shadow: none;
    border: 0px none;
    border-radius: 0px;
    font-weight: normal;
    line-height: normal;
}

.x-resizable-handle {
    background-color: transparent;
}




/* FIELDSET RESETS */
.x-fieldset-default {
    border: 0px none;
    padding: 0;
}



/* LOAD MASK RESETS */
.x-mask.x-focus {
    border: 0px none;
}


/* MESSAGE BOX RESETS */
.x-message-box .x-window-body {
    background-color: transparent;
}





/* ============================== WEBIX RESETS ============================== */

.webix_view,
.webix_header,
.webix_control input,
.webix_control button,
.webix_control textarea,
.webix_tooltip,
.webix_el_label,
.webix_inp_label,
.webix_inp_top_label,
.webix_inp_bottom_label,
div.webix_inp_static,
.webix_el_textarea textarea,
.webix_all_tabs .webix_item_tab,
.webix_header .webix_el_label .webix_el_box,
.webix_toolbar .webix_el_label .webix_el_box,
.webix_el_text .webix_multicombo_input,
.webix_cal_month_name,
.webix_time_header .webix_cal_hours,
.webix_time_header .webix_cal_minutes,
.webix_accordionitem_header,
.webix_accordionitem_header .webix_el_label .webix_el_box,
.webix_group_back,
.webix_group_back.webix_selected,
.webix_chart,
.webix_dt_editor input,
.webix_dt_editor select,
.webix_ss_sort_num,
.webix_ss_filter select,
.webix_ss_filter input,
.webix_ss_header,
.webix_hcolumn,
.webix_ss_vscroll_header,
.webix_dd_drag_column,
.webix_hs_left,
.webix_hs_center,
.webix_hs_right,
.webix_hcell.webix_measure_size,
.webix_measure_size,
.webix_cal_done,
.webix_property_label_line,
.webix_property_label_line .webix_el_label .webix_el_box,
.webix_message,
.webix_modal_box,
.webix_popup_button,
.webix_popup_button.confirm,
.webix_popup_input.webix_el_text input,
.webix_color_out_text,
.webix_drag_zone,
.webix_button,
.webixbutton,
.webix_richtext_inp_label .webix_template,
.webix_control input,
.webix_control button,
.webix_control textarea,
.webix_el_label,
.webix_inp_label,
.webix_inp_top_label,
.webix_inp_bottom_label,
.webix_el_text input,
.webix_el_search input,
.webix_el_combo input,
.webix_el_datepicker input,
.webix_el_colorpicker input,
.webix_el_select select,
.webix_segment_0,
.webix_segment_1,
.webix_segment_N,
.webix_el_combo input,
.webix_el_richselect input,
.webix_el_datepicker input,
.webix_el_colorpicker input,
.webix_el_search input,
.webix_el_combo .webix_inp_static,
.webix_el_richselect .webix_inp_static,
.webix_el_datepicker .webix_inp_static,
.webix_el_colorpicker .webix_inp_static,
.webix_el_search .webix_inp_static,
.webix_el_text .webix_multicombo_input,
.webix_toolbar.webix_layout_subbar .webix_el_label .webix_el_box,
.webix_forminput_label,
.webix_dbllist .dbllist_button,
.webix_table_print .webix_header_cell,
.mainFont,
.buttonFont,
.barFont,
.layoutBarBG .webix_el_label .webix_el_box,
.dataHeaderFont,
.buttonStyle,
.webix_dtable .webix_ss_footer,
.webix_dtable .webix_ss_footer .webix_hcolumn,
.webix_dtable .webix_ss_footer .webix_hs_left,
.webix_dtable .webix_ss_footer .webix_hs_center,
.webix_dtable .webix_ss_footer .webix_hs_right,
.webix_dtable .webix_ss_footer div.webix_ss_vscroll_footer,
.webix_view .webix_pager_item,
.webix_view .webix_pager_item_selected,
.webix_list .webix_unit_header,
.webix_el_select select,
.webix_el_counter .webix_inp_counter_value,
.webix_all_tabs .webix_item_tab,
.webix_section > .webix_template,
.webix_cal_icon,
.webix_cal_time,
.webix_cal_month_name,
.webix_cal_month_name,
.webix_time_header .webix_cal_hours,
.webix_time_header .webix_cal_minutes,
.webix_cal_body .webix_cal_block,
.webix_inp_label,
.webix_inp_top_label,
legend.webix_forminput_label,
.webix_el_label .webix_el_box,
.webix_dbllist .bottom_label,
.webix_chart .webix_chart_legend_item,
.webix_chart .webix_canvas_text,
.webix_chart .webix_axis_title_x,
.webix_chart .webix_axis_title_y {
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
    color: inherit;
}


.webix_view {
    background-color: transparent;
}

    .webix_view .menu {
        box-shadow: none;
    }

div.webix_inp_static,
.webix_el_textarea textarea {
    background-color: transparent;
    border-color: transparent;
}

.webix_multicombo_delete {
    color: inherit;
    font-size: inherit;
    height: auto;
}

.webix_el_combo .webix_el_box,
.webix_el_richselect .webix_el_box,
.webix_el_datepicker .webix_el_box,
.webix_el_colorpicker .webix_el_box,
.webix_el_search .webix_el_box,
.webix_el_text .webix_el_box,
.webix_el_texthighlight .webix_el_box,
.webix_view.webix_window.webix_popup .wxi-checkbox-marked,
.webix_multilist .wxi-checkbox-blank,
.webix_multilist .wxi-checkbox-marked,
.webix_icon_button .webix_icon,
.webix_icon_button:hover .webix_icon,
.webix_secondary .webix_button .webix_icon,
.webix_secondary .webix_button .webix_img_btn_text,
.webix_secondary .webix_button .webix_icon_btn,
.webix_cal_prev_button:hover,
.webix_cal_next_button:hover,
.webix_cal_prev_button:focus,
.webix_cal_next_button:focus,
.webix_scheduler_cal_list .webix_list_item.webix_selected .webix_scheduler_cal_edit,
.webix_cal_day,
.webix_cal_week_num,
.webix_cal_prev_button,
.webix_cal_next_button,
.webix_cal_body .webix_cal_select .webix_cal_day_inner,
.webix_cal_body .webix_cal_today.webix_cal_select .webix_cal_day_inner,
.webix_scheduler_info .webix_template .webix_scheduler_event_title,
.webix_popup_title {
    color: inherit;
}

.webix_cal_prev_button, 
.webix_cal_next_button {
    background-image: none;
}

.webix_icon_button::before {
    content: none;
}

.webix_secondary .webix_button:focus,
.webix_scheduler_cal_edit:hover {
    background-color: transparent;
}

.webix_scheduler_info .webix_template .webix_scheduler_event_title {
    font-weight: normal;
    margin: 0;
}

.webix_kanban_drag_zone {
    box-shadow: none;
}

.webix_kanban_drag_zone,
.webix_kanban_drag_zone > * {
    background-color: transparent;

}










/* ============================== TINYMCE RESETS ============================== */

body .mce-container,
body .mce-widget,
body .mce-reset,
body .mce-btn button {
    font-family: inherit;
    color: inherit;
}

    body .mce-container,
    body .mce-container *:not(.mce-ico),
    body .mce-widget,
    body .mce-widget *:not(.mce-ico),
    body .mce-reset {
        font-family: inherit;
    }

body .mce-btn:hover,
body .mce-btn:focus {
    color: inherit;
    background-color: transparent;
    border-color: transparent;
}

body .mce-ico,
body .mce-caret {
    color: inherit;
}

body .mce-menu {
    border: 0px none;
    padding: 0;
}

body .mce-menu-item {
    margin: 0;
    border: 0px none;
}

    body .mce-menu-item:hover .mce-ico,
    body .mce-menu-item.mce-selected .mce-ico,
    body .mce-menu-item:focus .mce-ico,
    body .mce-menu-item:hover .mce-text,
    body .mce-menu-item.mce-selected .mce-text,
    body .mce-menu-item:focus .mce-text {
        color: inherit;
    }

    body .mce-menu-item-normal.mce-active:hover .mce-text,
    body .mce-menu-item-normal.mce-active:hover .mce-ico,
    body .mce-menu-item.mce-disabled .mce-text,
    body .mce-menu-item.mce-disabled .mce-ico,
    body .mce-menu-item.mce-disabled:hover {
        background-color: transparent;
        color: inherit;
    }

    body .mce-menu-item.mce-selected .mce-caret,
    body .mce-menu-item:focus .mce-caret,
    body .mce-menu-item:hover .mce-caret {
        color: inherit;
        border-left-color: inherit;
    }




/* ============================== FONTS ============================== */

/*#region Commissioner*/

/*
    Commissioner font
    https://fonts.google.com/specimen/Commissioner
    https://google-webfonts-helper.herokuapp.com/fonts/commissioner
*/

/* commissioner-100 - Thin */
@font-face {
    font-family: 'Commissioner';
    font-style: normal;
    font-weight: 100;
    src: local(''), url('Commissioner/commissioner-v5-100.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
    url('Commissioner/commissioner-v5-100.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* commissioner-200 - Extra-light */
@font-face {
    font-family: 'Commissioner';
    font-style: normal;
    font-weight: 200;
    src: local(''), url('Commissioner/commissioner-v5-200.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
    url('Commissioner/commissioner-v5-200.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* commissioner-300 - Light */
@font-face {
    font-family: 'Commissioner';
    font-style: normal;
    font-weight: 300;
    src: local(''), url('Commissioner/commissioner-v5-300.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
    url('Commissioner/commissioner-v5-300.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* commissioner-regular - Regular */
@font-face {
    font-family: 'Commissioner';
    font-style: normal;
    font-weight: 400;
    src: local(''), url('Commissioner/commissioner-v5-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
    url('Commissioner/commissioner-v5-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* commissioner-500 - Medium */
@font-face {
    font-family: 'Commissioner';
    font-style: normal;
    font-weight: 500;
    src: local(''), url('Commissioner/commissioner-v5-500.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
    url('Commissioner/commissioner-v5-500.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* commissioner-600 - Semi-bold */
@font-face {
    font-family: 'Commissioner';
    font-style: normal;
    font-weight: 600;
    src: local(''), url('Commissioner/commissioner-v5-600.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
    url('Commissioner/commissioner-v5-600.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* commissioner-700 - Bold */
@font-face {
    font-family: 'Commissioner';
    font-style: normal;
    font-weight: 700;
    src: local(''), url('Commissioner/commissioner-v5-700.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
    url('Commissioner/commissioner-v5-700.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* commissioner-800 - Extra-bold */
@font-face {
    font-family: 'Commissioner';
    font-style: normal;
    font-weight: 800;
    src: local(''), url('Commissioner/commissioner-v5-800.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
    url('Commissioner/commissioner-v5-800.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* commissioner-900 - Black */
@font-face {
    font-family: 'Commissioner';
    font-style: normal;
    font-weight: 900;
    src: local(''), url('Commissioner/commissioner-v5-900.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
    url('Commissioner/commissioner-v5-900.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/*#endregion*/

/*#region Poppins*/

/*
    Poppins font
    https://fonts.google.com/specimen/Poppins
    https://gwfh.mranftl.com/fonts/poppins?subsets=latin
*/

/* poppins-100 - Thin */
@font-face {
    font-display: swap;
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 100;
    src: local(''), url('Poppins/poppins-v22-latin-100.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
    url('Poppins/poppins-v22-latin-100.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* poppins-200 - Extra-light */
@font-face {
    font-display: swap;
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 200;
    src: local(''), url('Poppins/poppins-v22-latin-200.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
    url('Poppins/poppins-v22-latin-200.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* poppins-300 - Light */
@font-face {
    font-display: swap;
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 300;
    src: local(''), url('Poppins/poppins-v22-latin-300.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
    url('Poppins/poppins-v22-latin-300.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* poppins-regular - Regular */
@font-face {
    font-display: swap;
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 400;
    src: local(''), url('Poppins/poppins-v22-latin-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
    url('Poppins/poppins-v22-latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* poppins-500 - Medium */
@font-face {
    font-display: swap;
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 500;
    src: local(''), url('Poppins/poppins-v22-latin-500.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
    url('Poppins/poppins-v22-latin-500.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* poppins-600 - Semi-bold */
@font-face {
    font-display: swap;
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 600;
    src: local(''), url('Poppins/poppins-v22-latin-600.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
    url('Poppins/poppins-v22-latin-600.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* poppins-700 - Bold */
@font-face {
    font-display: swap;
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 700;
    src: local(''), url('Poppins/poppins-v22-latin-700.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
    url('Poppins/poppins-v22-latin-700.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* poppins-800 - Extra-bold */
@font-face {
    font-display: swap;
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 800;
    src: local(''), url('Poppins/poppins-v22-latin-800.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
    url('Poppins/poppins-v22-latin-800.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* poppins-900 - Black */
@font-face {
    font-display: swap;
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 900;
    src: local(''), url('Poppins/poppins-v22-latin-900.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
    url('Poppins/poppins-v22-latin-900.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/*#endregion*/

/* ============================== PAT ICONS ============================== */

@font-face {
    font-family: "pat-icons";
    src: url("PatIcons/Outline/pat-icons.woff2") format("woff2"), url("PatIcons/Outline/pat-icons.woff") format("woff");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "pat-icons";
    src: url("PatIcons/Solid/pat-icons.woff2") format("woff2"), url("PatIcons/Solid/pat-icons.woff") format("woff");
    font-weight: bold;
    font-style: normal;
}

[class^="icon-"]:before,
[class*=" icon-"]:before,
.icon:before {
    font-family: "pat-icons" !important;
    display: inline-block !important;
    line-height: 1 !important;
    font-weight: normal !important;
    font-style: normal !important;
    text-decoration: none !important;
    text-transform: none !important;
    text-rendering: auto !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    speak: none;
    font-size: 16px;
}

.iconsize-14::before,
.icon-size-14::before {
    font-size: 14px;
}

.iconsize-16::before,
.icon-size-16::before {
    font-size: 16px;
}

.iconsize-18::before,
.icon-size-18::before {
    font-size: 18px;
}

.iconsize-20::before,
.icon-size-20::before {
    font-size: 20px;
}

.iconsize-22::before,
.icon-size-22::before{
    font-size: 22px;
}

.iconsize-24::before,
.icon-size-24::before {
    font-size: 24px;
}

.icon-solid:before {
    font-weight: bold !important;
}

.icon-outline:before {
    font-weight: normal !important;
}



/* ============================== ICON FONT (LEGACY, AVOID USAGE) ============================== */


@font-face {
    font-family: "pat-font";
    src: url("pat-font.eot");
    src: url("pat-font.eot?#iefix") format("embedded-opentype"), url("pat-font.woff") format("woff"), url("pat-font.ttf") format("truetype"), url("pat-font.svg#pat-font") format("svg");
    font-weight: normal;
    font-style: normal;
}

[class^="icon-ico-"]:before,
[class*=" icon-ico-"]:before {
    font-family: "pat-font" !important;
    font-style: normal !important;
    font-weight: normal !important;
    font-variant: normal !important;
    text-transform: none !important;
    speak: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size: inherit;
}
/* ============================== HTML RESETS ============================== */
/*
    https://bitsofco.de/my-css-reset-base/
    https://meyerweb.com/eric/tools/css/reset/
*/

/* Resetting margins, paddings, and borders */
html, body,
h1, h2, h3, h4, h5, h6,
a, p, span,
em, small, strong,
sub, sup,
mark, del, ins, strike,
abbr, dfn,
blockquote, q, cite,
code, pre,
ol, ul, li, dl, dt, dd,
div, section, article,
main, aside, nav,
header, hgroup, footer,
img, figure, figcaption,
address, time,
audio, video,
canvas, iframe,
details, summary,
fieldset, form, label, legend,
table, caption,
tbody, tfoot, thead,
tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
}

* {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
}

a,
a:visited {
    color: inherit;
}

button {
    color: inherit;
    background-color: transparent;
    border: 0px none;
    padding: 0;
    text-transform: inherit;
}

/* Layout & box sizing */
article,
aside,
footer,
header,
nav,
section,
main {
    display: block;
}

* {
    box-sizing: border-box;
}

    *:before,
    *:after {
        box-sizing: inherit;
    }

/* Resetting specific element styles */
table {
    border-collapse: collapse;
    border-spacing: 0;
}

ol,
ul {
    list-style: none;
}

img {
    border-style: none;
}

blockquote,
q {
    quotes: none;
}

    blockquote:after,
    blockquote:before,
    q:after,
    q:before {
        content: "";
        content: none;
    }


/* Attributes & states */
[hidden] {
    display: none !important;
}

[disabled] {
    cursor: not-allowed;
}

:focus:not(:focus-visible) {
    outline: none;
}



/* ============================== HTML STYLES ============================== */

html {
    background-color: #F7F8FA;
    color: #222;
    font-family: 'Poppins', 'Commissioner', sans-serif;
    font-size: 14px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    height: 100%;
}

body {
    min-height: 100%;
}

/* Standard headings */

h1, h2, h3, h4, h5, h6 {
    font-weight: 600;
    margin: 0.67em 0;
}

h1 {
    font-size: 32px;
}

h2 {
    font-size: 24px;
}

h3 {
    font-size: 18px;
}

h4 {
    font-size: 16px;
}

h5 {
    font-size: 14px;
}

h6 {
    font-size: 12px;
}


/* Specific element styles */

ol,
ul {
    list-style-position: outside;
    margin: 0.67em 0;
    padding-left: 28px;
}

ul {
    list-style-type: disc;
}
    ul ul {
        list-style-type: circle;
        margin: 0;
    }
        ul ul ul {
            list-style-type: square;
        }

ol {
    list-style-type: decimal;
}
    ol ol {
        margin: 0;
    }

li + li {
    margin-top: 0.325rem;
}

dl {
    display: block;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
}

dd {
    margin-inline-start: 40px;
}

dt {
    display: block;
}


code,
kbd,
samp {
    font-family: monospace;
}

sub,
sup {
    font-size: smaller;
}

/* ============================== HTML INLINE PREVIEW ============================== */
.html-preview-container {
    margin: 0;
    padding: 0
}

    .html-preview-container .html-preview {
        word-wrap: break-word;
        padding: 0 15px 0 15px;
        color: #6D6D6D;
    }

    body.mobile .html-preview-container .html-preview {
        padding: 0 14px;
    }

    .html-preview h1,
    .html-preview h2,
    .html-preview h3,
    .html-preview h4,
    .html-preview h5,
    .html-preview h6 {
        color: #222;
    }

    .html-preview > :first-child {
        margin-top: 0;
    }

    .html-preview p {
        margin: 0.67em 0;
    }

    .html-preview img {
        max-width: 100%;
        height: auto;
    }

    .html-preview iframe {
        border: 0px;
        max-width: 100%;
        height: auto;
    }

    .html-preview .infoarea {
        padding: 15px;
        margin: 15px 0;
        border-left: 4px solid transparent;
        border-radius: 4px;
        border-color: #818185;
        background-color: #F8F8F8;
        color: #222;
    }

        .html-preview .infoarea.info-lvl-neutral {
            border-color: #42A5D7;
            background-color: #D9EDF7;
        }

        .html-preview .infoarea.info-lvl-low {
            border-color: #109006;
            background-color: #D1E9CE;
        }

        .html-preview .infoarea.info-lvl-medium {
            border-color: #FAB450;
            background-color: #FDEFDD;
        }

        .html-preview .infoarea.info-lvl-high {
            border-color: #EF5350;
            background-color: #FADCDC;
        }

.html-preview .table-wrapper {
    overflow-x: auto;
    margin-bottom: 20px;
}

.html-preview table {
    border-collapse: collapse;
    border-spacing: 0;
}

.html-preview td,
.html-preview th {
    border: 1px solid #ddd;
    text-align: left;
    padding: 8px;
    min-width: 150px;
    max-width: 500px;
}

.html-preview tr:nth-child(even) {
    background-color: #FEFEFE;
}

.html-preview th {
    padding-top: 11px;
    padding-bottom: 11px;
    background-color: #C7C7C7;
    color: #222;
}

/* ============================== PALETTE ============================== */
/*

	#CCCCCC                     | Main accent (overriden by product-specific accent color)

	#222222                     | Primary color (text, header background, negative background, ...)
	
	#FFFFFF                     | Content background, fields background, ...
	
	#444444                     | Header text base color, inactive nav tabs color, ...
	
	#777777                     | Light text color, ...
	
	#999999                     | Thin text color, heavy border color, ...
	
	#CCCCCC                     | Light border color, list rows border color, ...
	
	#E0E0E0                     | Tiny border color, field border color, 

	#F7F8FA                     | Body background color, ...
	
	#055DEB                     | Special text color (tiles text, ...)



	#109006                     | Success - Primary color, dark success color
	rgb(16 144 6)               |
	hsl(116deg 92% 29%)         |

	rgba(15, 142, 6, 0.2)       | Success - Secondary color, light success color (opacity 20%)
	hsla(116, 92%, 29%, 0.2)    |
	#CFE8CD                     | > (solid version, no opacity)



	#FAB450                     | Warning - Primary color, dark warning color
	rgb(250 180 80)             |
	hsl(35deg 94% 65%)          |
	
	rgba(250, 180, 80, 0.2)     | Warning  Secondary color, light warning color (opacity 20%)
	hsla(35, 94%, 65%, 0.2)     |
	#FEF0DC                     | > (solid version, no opacity)



	#EF5350                     | Error - Primary color, dark error color
	rgb(239 83 80)              | 
	hsl(1deg 83% 63%)           |

	rgba(239, 85, 82, 0.2)      | Error - Secondary color, light error color (opacity 20%)
	hsla(1deg, 83%, 63%, 0.2)   |
	#FCDDDC                     | > (solid version, no opacity)



	#055deb                     | Info - Primary color, dark error color
	rgb(5, 93, 235)             | 
	hsl(217deg 96% 47%)         |

	rgba(5, 93, 235, 0.2)       | Info - Secondary color, light error color (opacity 20%)
	hsla(217, 96%, 47%, 0.2)    |
	#C3DAFF                     | > (solid version, no opacity)

	


	# : Primary info color
	# : Secondary info color
	
	

*/



/* ============================== SHADOWS ============================== */
/* 

	- Light shadow: "light" content areas, ...
	  box-shadow: 0 2px 6px 0 rgba(224, 224, 224, 0.6);
	
	- Normal shadow: modules, content cards, tiles, ...
	  box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.1);
	  box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.1);

	- Normal shadow hover: tiles, ...
	  box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.2);

	- Strong shadow: windows, sliding panels, floating menu, ...
	  box-shadow: 0 6px 15px 0 rgba(34, 34, 34, 0.4);

	- Mobile shadow:
	  box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.15);


*/


/* ============================== VARIABLES ============================== */
:root {
    --cardcontext-basecard-width: 228px;
    --cardcontext-basecard-height: 246px;
    --toolbar-justify-content: center;
    --toolbar-align-items: flex-start;
    --toolbar-flex-direction: row;
}


/* ============================== VARIABLES ============================== */

:root {
    --pie-rotate-calc-arg: 0;
}


/* ================================ PRINT ================================ */

body {
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
}


/* ============================== TYPOGRAPHY ============================== */
/* Text Types */
.text-title-large,
.text-title-large-strong {
    font-size: 40px;
}

.text-title,
.text-title-strong {
    font-size: 32px;
}

.text-heading,
.text-heading-strong {
    font-size: 24px;
}

.text-subheading,
.text-subheading-strong {
    font-size: 18px;
}

.text-default,
.text-default-strong {
    font-size: 14px;
}

.text-caption,
.text-caption-strong {
    font-size: 12px;
}

.text-highlight {
    background-color: yellow;
    color: black;
}

.text-title-strong,
.text-title-large-strong,
.text-heading-strong,
.text-subheading-strong,
.text-default-strong,
.text-caption-strong {
    font-weight: 600;
}



/* Font Weights (utility classes) */

.text-weight-thin {
    font-weight: 100 !important;
}

.text-weight-extralight {
    font-weight: 200 !important;
}

.text-weight-light, .font-light {
    font-weight: 300 !important;
}

.text-weight-regular {
    font-weight: 400 !important;
}

.text-weight-medium {
    font-weight: 500 !important;
}

.text-weight-semibold {
    font-weight: 600 !important;
}

.text-weight-bold, .font-bold {
    font-weight: 700 !important;
}

.text-weight-extrabold {
    font-weight: 800 !important;
}

.text-weight-black {
    font-weight: 900 !important;
}


/* Font Sizes (utility classes) */

.text-size-xxlarge {
    font-size: 40px !important;
}

.text-size-xlarge {
    font-size: 32px !important;
}

.text-size-large {
    font-size: 24px !important;
}

.text-size-medium {
    font-size: 18px !important;
}

.text-size-normal {
    font-size: 14px !important;
}

.text-size-small {
    font-size: 12px !important;
}

.text-size-xsmall {
    font-size: 11px !important;
}

.text-size-xsmall {
    font-size: 11px;
}





/* ============================== ICONS ============================== */
/*.icon-size-s::before {
	font-size: 16px;
}

.icon-size-m::before {
	font-size: 20px;
}

.icon-size-l::before {
	font-size: 32px;
}

.icon-size-xl::before {
	font-size: 48px;
}*/


/* ============================== ICONS [AVOID MIGRATION?] ============================== */

body .icon-templates::before {
    content: "\f147";
}

body .icon-findbyid::before {
    content: "\f109";
}

body .icon-changestatus::before {
    content: "\f107";
}

body .icon-changetype::before {
    content: "\f108";
}

body .icon-addsolicit::before {
    content: "\f103";
}

body .icon-saveclose::before {
    content: "\f12d";
}

body .icon-savenew::before {
    content: "\f12e";
}

body .icon-cross::before,
body .icon-decline::before,
body .icon-remove::before {
    content: "\f140";
}

body .icon-cross,
body .icon-decline {
    background-image: none;
}

/*.icon-cancel, .x-tree-icon.icon-cancel {
	background: url('../Img/metro-common.png') no-repeat -64px -16px !important;
}*/

body .icon-setAsUnread::before {
    content: "\f14c";
}

body .icon-locked::before {
    content: "\f170";
}

body .icon-unlocked::before {
    content: "\f16f";
}

body .icon-sortascending,
body .icon-sortdescending {
    background-image: none;
}

    body .icon-sortascending::before {
        content: "\f15b";
    }

    body .icon-sortdescending::before {
        content: "\f15a";
    }

body .icon-menu-planner {
    background-image: none;
}

    body .icon-menu-planner::before {
        content: "\f149";
    }

body .icon-sendmail::before {
    content: "\f14c";
}

body .icon-translate::before {
    content: "\f139";
}


/* ============================== ICONS [OLD FONT, could be renamed icon-ico-xxx] ============================== */

body .icon-visible:before,
body .icon-not-visible:before {
    font-family: "pat-font" !important;
    font-size: inherit;
}

body .icon-visible:before {
    content: "\e90d"
}

body .icon-not-visible:before {
    content: "\e90f"
}


/* ============================== ICONS ============================== */

body .icon-foldergo {
    /* background-image: none; */
}

body .icon-webtocall {
    background-image: url(../Img/base/ico-webtocall.png);
    width: 16px !important;
    height: 16px !important;
}

body .icon-changepwd {
    background-image: url(../Img/base/ico-changepwd.png);
    width: 16px !important;
    height: 16px !important;
}

body .icon-house, body .icon-menu-home {
    background-image: url(../Img/base/ico-menu-home.png);
    width: 16px !important;
    height: 16px !important;
}

body .icon-menu-ticket, .navTreeMain .x-tree-icon-parent.icon-menu-ticket {
    background-image: url(../Img/base/ico-menu-ticket.png);
    width: 16px !important;
    height: 16px !important;
}

body .icon-menu-order, .navTreeMain .x-tree-icon-parent.icon-menu-order {
    background-image: url(../Img/base/ico-addtocart.png);
    width: 16px !important;
    height: 16px !important;
}

body .icon-menu-servicecatalog,
body .icon-menu-servicerequest,
body .icon-services,
.navTreeMain .x-tree-icon-parent.icon-menu-servicerequest {
    background-image: url(../Img/base/ico-menu-servicerequest.png) !important;
    width: 16px !important;
    height: 16px !important;
}

body .icon-database,
body .icon-menu-knowledgebase,
.navTreeMain .x-tree-icon-parent.icon-menu-knowledgebase {
    background-image: url(../Img/base/ico-menu-knowledgebase.png);
    width: 16px !important;
    height: 16px !important;
}

body .icon-menu-intervention,
.navTreeMain .x-tree-icon-parent.icon-menu-intervention,
.x-grid-tree-node-expanded .x-tree-icon-parent.icon-menu-intervention {
    background-image: url(../Img/base/ico-menu-intervention.png);
    width: 16px !important;
    height: 16px !important;
}

body .icon-menu-incidents,
.navTreeMain .x-tree-icon-parent.icon-menu-incidents,
.x-grid-tree-node-expanded .x-tree-icon-parent.icon-menu-incidents {
    background-image: url(../Img/base/ico-incident.png);
    width: 16px !important;
    height: 16px !important;
}

body .icon-menu-projects,
.navTreeMain .x-tree-icon-parent.icon-menu-projects,
.x-grid-tree-node-expanded .x-tree-icon-parent.icon-menu-projects {
    background-image: url(../Img/base/ico-project.png);
}

body .icon-menu-problems,
.navTreeMain .x-tree-icon-parent.icon-menu-problems,
.x-grid-tree-node-expanded .x-tree-icon-parent.icon-menu-problems {
    background-image: url(../Img/base/ico-problems.png);
    width: 16px !important;
    height: 16px !important;
}

body .icon-menu-change,
.navTreeMain .x-tree-icon-parent.icon-menu-change {
    background-image: url(../Img/base/ico-change.png);
    width: 16px !important;
    height: 16px !important;
}

body .icon-menu-documents,
.navTreeMain .x-tree-icon-parent.icon-menu-documents {
    background-image: url(../Img/base/ico-menu-documents.png);
    width: 16px !important;
    height: 16px !important;
}

body .icon-menu-sitesusers {
    background-image: url(../Img/base/ico-rubric.png);
    width: 16px !important;
    height: 16px !important;
}

body .icon-menu-notifications,
.navTreeMain .x-tree-icon-parent.icon-menu-notifications {
    background-image: url(../Img/base/ico-notifications.png);
    width: 16px !important;
    height: 16px !important;
}

body .icon-menu-users {
    background-image: url(../Img/EMailAddresses/user-icon.png);
    background-size: 16px;
    width: 16px !important;
    height: 16px !important;
}

body .icon-menu-usergroup, .navTreeMain .x-tree-icon-parent.icon-menu-usergroup {
    background-image: url(../Img/base/ico-usergroup.png);
    background-size: 16px;
    width: 16px !important;
    height: 16px !important;
}

body .checked-menu-item {
    background-image: url(../Img/base/ico-accept2.png) !important;
    background-size: 16px;
    background-repeat: no-repeat;
    background-position-x: right;
    background-position-y: center;
}

body .icon-menu-accounts {
    background-image: url(../Img/EMailAddresses/account-icon.png);
    background-size: 16px;
    width: 16px !important;
    height: 16px !important;
}

body .icon-menu-warehouses {
    background-image: url(../Img/EMailAddresses/warehouse-icon.png);
    background-size: 16px;
    width: 16px !important;
    height: 16px !important;
}

body .icon-menu-contacts {
    background-image: url(../Img/EMailAddresses/contact-icon.png);
    background-size: 16px;
    width: 16px !important;
    height: 16px !important;
}

body .icon-menu-suppliers {
    background-image: url(../Img/EMailAddresses/supplier-icon.png);
    background-size: 16px;
    width: 16px !important;
    height: 16px !important;
}

body .icon-menu-groups {
    background-image: url(../Img/EMailAddresses/group-icon.png);
    background-size: 16px;
    width: 16px !important;
    height: 16px !important;
}

/*.assigned-user-or-group-indicator {
	height: 20px;
	width: 20px;
	background-size: 20px;
	padding-top: 0px;
	background-position: 1px 2px;
	left: 0px;
}*/

body .icon-menu-assets,
.navTreeMain .x-tree-icon-parent.icon-menu-assets {
    background-image: url(../Img/base/ico-asset.png);
    width: 16px !important;
    height: 16px !important;
}

body .icon-menu-warehousedocuments,
.navTreeMain .x-tree-icon-parent.icon-menu-warehousedocuments,
.x-grid-tree-node-expanded .x-tree-icon-parent.icon-menu-warehousedocuments {
    width: 16px !important;
    height: 16px !important;
    background-image: url(../Img/base/ico-warehousedocument.png);
}

body .icon-menu-brainbusiness, body .icon-brainbusiness,
.navTreeMain .x-tree-icon-parent.icon-menu-brainbusiness {
    background-image: url(../Img/base/ico-brainbusiness.png);
    width: 16px !important;
    height: 16px !important;
}

body .icon-menu-zapier, .navTreeMain .x-tree-icon-parent.icon-menu-zapier {
    background-image: url(../Img/base/zapier.png);
    width: 16px !important;
    height: 16px !important;
}

body .icon-menu-processes {
    background-image: url(../Img/base/ico-settings.png);
    width: 16px !important;
    height: 16px !important;
}

body .icon-menu-manuals {
    background-image: url(../Img/base/ico-manuals.png);
    width: 16px !important;
    height: 16px !important;
}

body .icon-cross2:before {
    content: "\f00d";
    font-family: "Font Awesome 6 Pro" !important;
    font-weight: 600 !important;
    font-size: 16px;
    color: #EF5350;
}

body .icon-sectioncollapsed {
    background-image: url(../Img/base/ico-arrows-down.png);
    width: 16px !important;
    height: 16px !important;
}

body .filterToggle.x-btn.x-btn-pressed .icon-sectioncollapsed {
    background-image: url(../Img/base/ico-arrows-up.png);
    width: 16px !important;
    height: 16px !important;
}

body .icon-pagewhitestack {
    background-image: url(../Img/base/ico-menu-documents.png);
    width: 16px !important;
    height: 16px !important;
}

body .icon-accept-white {
    background-image: url(../Img/base/ico-accept-white.png);
    width: 16px !important;
    height: 16px !important;
}

body .icon-accept2:before {
    content: "\f00c";
    font-family: "Font Awesome 6 Pro" !important;
    font-weight: 600 !important;
    font-size: 16px;
    color: #109006;
}

body .icon-magnifierzoomin {
    background-image: url(../Img/base/ico-expand.png);
    width: 16px !important;
    height: 16px !important;
}

body .icon-magifierzoomout,
body .icon-magnifierzoomout {
    background-image: url(../Img/base/ico-compress.png);
    width: 16px !important;
    height: 16px !important;
}

body .icon-othercommands::before {
    font-family: "pat-icons" !important;
    content: "\f1c5";
}

body .icon-subpages {
    background-image: url(../Img/base/ico-othercommands-2.png);
    width: 16px !important;
    height: 16px !important;
}

body .icon-public {
    background-image: url(../Img/base/ico-public.png);
    width: 16px !important;
    height: 16px !important;
}

body .icon-private {
    background-image: url(../Img/base/ico-private.png);
    width: 16px !important;
    height: 16px !important;
}

.icon-ownership::before {
    content: "\f14e";
}

body .icon-excel, body .icon-exportexcel {
    background-image: url(../Img/base/ico-export-excel.png);
}

body .icon-pdf, body .icon-exportpdf {
    background-image: url(../Img/base/ico-pdf.png);
    width: 16px !important;
    height: 16px !important;
}

body .icon-word, body .icon-exportword, body .icon-word, body .icon-exportrtf {
    background-image: url(../Img/base/ico-word.png);
    width: 16px !important;
    height: 16px !important;
}

body .icon-csv, body .icon-exportcsv {
    background-image: url(../Img/base/ico-csv.png);
    width: 16px !important;
    height: 16px !important;
}

body .icon-exportpdf {
    background-image: url(../Img/base/ico-pdf.png);
    width: 16px !important;
    height: 16px !important;
}

body .icon-bulb {
    background-image: url(../Img/base/ico-bulb.png);
    width: 16px !important;
    height: 16px !important;
}

body .icon-resetgrid {
    background-image: url(../Img/base/ico-reset-grid.png);
    width: 16px !important;
    height: 16px !important;
}

body .icon-mail-forward {
    background-image: url(../Img/base/ico-mail-forward.png);
    width: 16px !important;
    height: 16px !important;
}

body .icon-mail-reply {
    background-image: url(../Img/base/ico-mail-reply.png);
    width: 16px !important;
    height: 16px !important;
}

body .icon-mail-reply-all {
    background-image: url(../Img/base/ico-mail-reply-all.png);
    width: 16px !important;
    height: 16px !important;
}

body .icon-nostar {
    background-image: url(../Img/base/ico-no-star.png);
    background-repeat: no-repeat;
    width: 16px !important;
    height: 16px !important;
}

body .icon-wand {
    background-image: url(../Img/base/ico-wand.png);
    width: 16px !important;
    height: 16px !important;
}

body .x-tbar-loading,
body .icon-reload {
    background-image: url(../Img/base/ico-refresh.png);
    width: 16px !important;
    height: 16px !important;
}

body .icon-chart {
    background: url('../Img/base/ico-graph.png');
    width: 16px !important;
    height: 16px !important;
}

body .icon-results {
    background: url('../Img/base/ico-result.png');
    width: 16px !important;
    height: 16px !important;
}

body .icon-close-ticket {
    background: url('../Img/base/ico-close-ticket.png');
    width: 16px !important;
    height: 16px !important;
}

body .icon-hourglass {
    background: url('../Img/base/ico-hourglass.png');
    width: 16px !important;
    height: 16px !important;
}

body .icon-entities, .x-grid-row .x-tree-icon.icon-entities {
    background: url('../Img/base/ico-entities.png') no-repeat;
    width: 16px !important;
    height: 16px !important;
}

.x-grid-row .x-tree-icon.icon-entity {
    background: url('../Img/base/ico-entity.png') 0 2px no-repeat;
    width: 16px !important;
    height: 16px !important;
}

body .icon-entity-custom, .x-tree-icon.icon-entity-custom {
    background: url('../Img/base/ico-entity-custom.png') 0 2px no-repeat;
    width: 16px !important;
    height: 16px !important;
}

body .icon-entity-filter {
    background-image: url('../Img/base/ico-entity-filter.png');
    width: 16px !important;
    height: 16px !important;
}

body .icon-and,
.x-grid-row .x-tree-icon.icon-and {
    background-image: url('../Img/base/ico-and.png');
    width: 16px !important;
    height: 16px !important;
}

body .icon-or,
.x-grid-row .x-tree-icon.icon-or {
    background-image: url('../Img/base/ico-or.png');
    width: 16px !important;
    height: 16px !important;
}

body .icon-nand,
.x-grid-row .x-tree-icon.icon-nand {
    background-image: url('../Img/base/ico-and.png');
    width: 16px !important;
    height: 16px !important;
}

body .icon-nor,
.x-grid-row .x-tree-icon.icon-nor {
    background-image: url('../Img/base/ico-or.png');
    width: 16px !important;
    height: 16px !important;
}

body .icon-tosee {
    width: 16px !important;
    height: 16px !important;
    background-image: url('../Img/base/ico-tosee.png');
}

body .icon-partial-tosee {
    background-image: url('../Img/base/ico-partial-tosee.png');
    width: 16px !important;
    height: 16px !important;
}

body .icon-timer {
    background-image: url('../Img/base/ico-timer.png');
    background-repeat: no-repeat;
    width: 16px !important;
    height: 16px !important;
}

body .icon-teammee {
    background-image: url(../Img/base/ico-teammee.png);
    width: 16px !important;
    height: 16px !important;
}

body .icon-event {
    background-image: url(../Img/base/ico-event.png);
    width: 16px !important;
    height: 16px !important;
}

body .icon-engagent {
    background-image: url(../Img/base/ico-engagent.png);
    width: 16px !important;
    height: 16px !important;
}

body .icon-mask {
    -moz-opacity: 0.5;
    opacity: .5;
}




body .x-tool-expand-bottom, body .tool-expand {
    background-image: url(../Img/base/ico-arrows-down.png);
    background-position: 0 0;
    background-repeat: no-repeat;
}

body .x-tool-collapse-top, body .tool-collapse {
    background-image: url(../Img/base/ico-arrows-up.png);
    background-position: 0 0;
    background-repeat: no-repeat;
}

.x-tool-over .x-tool-expand-bottom, .x-tool-over .x-tool-collapse-top {
    background-position: 0 0;
}


/*
	METRO ICONS 
*/
.metro-icon, .portal-icon {
    height: 16px;
    width: 16px;
}

.icon-admin, .x-tree-icon.icon-admin {
    background: url('../Img/metro-misc1.png') no-repeat -16px -16px !important;
}

.icon-alert, .x-tree-icon.icon-alert {
    background: url('../Img/metro-misc1.png') no-repeat -64px -16px !important;
}

.icon-alert-2, .x-tree-icon.icon-alert-2 {
    background: url('../Img/metro-misc1.png') no-repeat -112px -16px !important;
}

.icon-flat-arrow-left, .x-tree-icon.icon-flat-arrow-left {
    background: url('../Img/metro-misc1.png') no-repeat -2654px -16px !important;
}

.icon-flat-arrow-right, .x-tree-icon.icon-flat-arrow-right {
    background: url('../Img/metro-misc1.png') no-repeat -2222px -16px !important;
}

.icon-associate, .x-tree-icon.icon-associate {
    background: url('../Img/metro-misc1.png') no-repeat -160px -16px !important;
}

.x-tree-icon.icon-attachment {
    background: url('../Img/metro-misc1.png') no-repeat -208px -16px !important;
}

.icon-branch, .x-tree-icon.icon-branch {
    background: url('../Img/metro-misc1.png') no-repeat -352px -16px !important;
}

.x-tree-icon.icon-chart {
    background: url('../Img/metro-misc1.png') no-repeat -400px -16px !important;
}

.icon-chart-bar, .x-tree-icon.icon-chart-bar {
    background: url('../Img/metro-misc1.png') no-repeat -448px -16px !important;
}

.icon-chart-pie, .x-tree-icon.icon-chart-pie {
    background: url('../Img/metro-misc1.png') no-repeat -496px -16px !important;
}

.icon-chart-series, .x-tree-icon.icon-chart-series {
    background: url('../Img/metro-misc1.png') no-repeat -544px -16px !important;
}

.icon-clipboard, .x-tree-icon.icon-clipboard {
    background: url('../Img/metro-misc1.png') no-repeat -592px -16px !important;
}

.icon-close-2, .x-tree-icon.icon-close-2 {
    background: url('../Img/metro-misc1.png') no-repeat -640px -16px !important;
}

.icon-colors, .x-tree-icon.icon-colors {
    background: url('../Img/metro-misc1.png') no-repeat -688px -16px !important;
}

.icon-comments, .x-tree-icon.icon-comments {
    background: url('../Img/metro-misc1.png') no-repeat -736px -16px !important;
}

.icon-compare, .x-tree-icon.icon-compare {
    background: url('../Img/metro-misc1.png') no-repeat -784px -16px !important;
}

.icon-compare-2, .x-tree-icon.icon-compare-2 {
    background: url('../Img/metro-misc1.png') no-repeat -832px -16px !important;
}

.icon-conflict, .x-tree-icon.icon-conflict {
    background: url('../Img/metro-misc1.png') no-repeat -880px -16px !important;
}

.icon-cut, .x-tree-icon.icon-cut {
    background: url('../Img/metro-common.png') no-repeat -208px -16px !important;
}

.icon-menu-3p {
    background-image: url(../Img/base/ico-menu-3p.png) !important;
}

.icon-menu-favorites {
    background-image: url(../Img/base/ico-menu-favorites.png) !important;
}

/*
	overrides Ext one...
 */
.icon-document, .x-tree-icon.icon-document {
    background: url('../Img/metro-misc1.png') no-repeat -928px -16px !important;
}

.icon-dot, .x-tree-icon.icon-dot {
    background: url('../Img/metro-misc1.png') no-repeat -4670px -16px !important;
}

.icon-down, .x-tree-icon.icon-down {
    background: url('../Img/metro-common.png') no-repeat -304px -16px !important;
}

.icon-down-2, .x-tree-icon.icon-down-2 {
    background: url('../Img/metro-misc1.png') no-repeat -976px -16px !important;
}

.icon-down-gray, .x-tree-icon.icon-down-gray {
    background: url('../Img/metro-common.png') no-repeat -350px -16px !important;
}

.icon-drop, .x-tree-icon.icon-drop {
    background: url('../Img/metro-common.png') no-repeat -398px -16px !important;
}

.icon-drop-left, .x-tree-icon.icon-drop-left {
    background: url('../Img/metro-common.png') no-repeat -448px -16px !important;
}

.icon-drop-right, .x-tree-icon.icon-drop-right {
    background: url('../Img/metro-common.png') no-repeat -496px -16px !important;
}

.x-tree-icon.icon-edit {
    background: url('../Img/metro-common.png') no-repeat -540px -16px !important;
}

.icon-edit-next, .x-tree-icon.icon-edit-next {
    background: url('../Img/metro-misc1.png') no-repeat -1024px -16px !important;
}

.icon-edit-prev, .x-tree-icon.icon-edit-prev {
    background: url('../Img/metro-misc1.png') no-repeat -1072px -16px !important;
}

.icon-edit-table, .x-tree-icon.icon-edit-table {
    background: url('../Img/metro-common.png') no-repeat -592px -16px !important;
}

.icon-edit-window, .x-tree-icon.icon-edit-window {
    background: url('../Img/metro-misc1.png') no-repeat -1120px -16px !important;
}

.icon-empty, .x-tree-icon.icon-empty {
    background: url('../Img/metro-common.png') no-repeat -640px -16px !important;
}

.icon-envelope, .x-tree-icon.icon-envelope {
    background: url('../Img/metro-misc1.png') no-repeat -1168px -16px !important;
}

.icon-fail, .x-tree-icon.icon-fail {
    background: url('../Img/metro-common.png') no-repeat -688px -16px !important;
}

.icon-favorite, .x-tree-icon.icon-favorite {
    background: url('../Img/metro-common.png') no-repeat -736px -16px !important;
}

.icon-favorite-in, .x-tree-icon.icon-favorite-in {
    background: url('../Img/metro-common.png') no-repeat -2560px -16px !important;
}

.icon-favorite-out, .x-tree-icon.icon-favorite-out {
    background: url('../Img/metro-common.png') no-repeat -2512px -16px !important;
}

.icon-favorites, .x-tree-icon.icon-favorites {
    background: url('../Img/metro-common.png') no-repeat -784px -16px !important;
}

.icon-favorites-add, .x-tree-icon.icon-favorites-add {
    background: url('../Img/metro-common.png') no-repeat -832px -16px !important;
}

.icon-find, .x-tree-icon.icon-find {
    background: url('../Img/metro-misc1.png') no-repeat -1216px -16px !important;
}

.icon-find-in-document, .x-tree-icon.icon-find-in-document {
    background: url('../Img/metro-misc1.png') no-repeat -1264px -16px !important;
}

.icon-find-in-folders, .x-tree-icon.icon-find-in-folders {
    background: url('../Img/metro-misc1.png') no-repeat -1312px -16px !important;
}

.icon-folder:not(.icon),
.icon-folder-simple {
    background: url('../Img/folder-closed.png') no-repeat !important;
}

.icon-folder-open {
    background: url('../Img/folder-opened.png') no-repeat !important;
}

.icon-folder-open-simple {
    background: url('../Img/metro-common.png') no-repeat -996px -16px !important;
}

.icon-folder-up, .x-tree-icon.icon-folder-up {
    background: url('../Img/metro-common.png') no-repeat -1024px -16px !important;
}

.icon-full-view, .x-tree-icon.icon-full-view {
    background: url('../Img/metro-misc1.png') no-repeat -1360px -16px !important;
}

.icon-gear, .x-tree-icon.icon-gear {
    background: url('../Img/metro-misc1.png') no-repeat -1408px -16px !important;
}

.icon-gears, .x-tree-icon.icon-gears {
    background: url('../Img/metro-misc1.png') no-repeat -1456px -16px !important;
}

.icon-go, .x-tree-icon.icon-go {
    background: url('../Img/metro-misc1.png') no-repeat -4718px -16px !important;
}

.icon-hand, .x-tree-icon.icon-hand {
    background: url('../Img/metro-misc1.png') no-repeat -1504px -16px !important;
}

.icon-help, .x-tree-icon.icon-help {
    background: url('../Img/base/ico-help.png');
}

.x-tree-icon.icon-hierarchy {
    background: url('../Img/metro-misc1.png') no-repeat -1600px -16px !important;
}

.icon-highlight, .x-tree-icon.icon-highlight {
    background: url('../Img/metro-misc1.png') no-repeat -1648px -16px !important;
}

.icon-history, .x-tree-icon.icon-history {
    background: url('../Img/metro-misc1.png') no-repeat -1696px -16px !important;
}

.icon-idea, .x-tree-icon.icon-idea {
    background: url('../Img/metro-misc1.png') no-repeat -1744px -16px !important;
}

.icon-legend, .x-tree-icon.icon-legend {
    background: url('../Img/metro-misc1.png') no-repeat -1792px -16px !important;
}

.icon-link, .x-tree-icon.icon-link {
    background: url('../Img/metro-misc1.png') no-repeat -1840px -16px !important;
}

.icon-minus-blue, .x-tree-icon.icon-minus-blue {
    background: url('../Img/metro-misc1.png') no-repeat -1936px -16px !important;
}

.icon-minus-green, .x-tree-icon.icon-minus-green {
    background: url('../Img/metro-misc1.png') no-repeat -1984px -16px !important;
}

.icon-minus-orange, .x-tree-icon.icon-minus-orange {
    background: url('../Img/metro-misc1.png') no-repeat -2032px -16px !important;
}

.icon-new-card, .x-tree-icon.icon-new-card {
    background: url('../Img/metro-misc1.png') no-repeat -2080px -16px !important;
}

.icon-new-document, .x-tree-icon.icon-new-document {
    background: url('../Img/metro-misc1.png') no-repeat -2128px -16px !important;
}

.icon-new-folder, .x-tree-icon.icon-new-folder {
    background: url('../Img/metro-misc1.png') no-repeat -2176px -16px !important;
}

.icon-new-window, .x-tree-icon.icon-new-window {
    background: url('../Img/metro-common.png') no-repeat -1168px -16px !important;
}

.icon-next, .x-tree-icon.icon-next {
    background: url('../Img/metro-common.png') no-repeat -1216px -16px !important;
}

.icon-next-2, .x-tree-icon.icon-next-2 {
    background: url('../Img/metro-misc1.png') no-repeat -2224px -16px !important;
}

.x-tree-icon.icon-open, .icon-open1 {
    background: url('../Img/metro-common.png') no-repeat -1264px -16px !important;
}

.icon-open-2, .x-tree-icon.icon-open-2 {
    background: url('../Img/metro-misc1.png') no-repeat -2272px -16px !important;
}

.icon-options, .x-tree-icon.icon-options {
    background: url('../Img/metro-common.png') no-repeat -1312px -16px !important;
}

/*.icon-pause,*/
.x-tree-icon.icon-pause {
    background: url('../Img/metro-misc1.png') no-repeat -2320px -16px !important;
}

.icon-people, .x-tree-icon.icon-people {
    background: url('../Img/metro-common.png') no-repeat -1408px -16px !important;
}

/*.icon-play,*/
.x-tree-icon.icon-play {
    background: url('../Img/metro-misc1.png') no-repeat -2368px -16px !important;
}

.icon-plus-blue, .x-tree-icon.icon-plus-blue {
    background: url('../Img/metro-misc1.png') no-repeat -2464px -16px !important;
}

.icon-plus-green, .x-tree-icon.icon-plus-green {
    background: url('../Img/metro-misc1.png') no-repeat -2512px -16px !important;
}

.icon-plus-orange, .x-tree-icon.icon-plus-orange {
    background: url('../Img/metro-misc1.png') no-repeat -2560px -16px !important;
}

.icon-post-it, .x-tree-icon.icon-post-it {
    background: url('../Img/metro-misc1.png') no-repeat -2608px -16px !important;
}

.icon-prev, .x-tree-icon.icon-prev {
    background: url('../Img/metro-common.png') no-repeat -1456px -16px;
}

.icon-prev-2, .x-tree-icon.icon-prev-2 {
    background: url('../Img/metro-misc1.png') no-repeat -2656px -16px !important;
}

.icon-print, .x-tree-icon.icon-print {
    background: url('../Img/metro-common.png') no-repeat -1504px -16px !important;
}

.icon-print-details, .x-tree-icon.icon-print-details {
    background: url('../Img/metro-misc1.png') no-repeat -2704px -16px !important;
}

.icon-print-preview, .x-tree-icon.icon-print-preview {
    background: url('../Img/metro-common.png') no-repeat -1552px -16px !important;
}

.icon-profile, .x-tree-icon.icon-profile {
    background: url('../Img/metro-common.png') no-repeat -1600px -16px !important;
}

.icon-properties, .x-tree-icon.icon-properties {
    background: url('../Img/metro-common.png') no-repeat -1648px -16px !important;
}

.icon-push-pin, .x-tree-icon.icon-push-pin {
    background: url('../Img/metro-misc1.png') no-repeat -2752px -16px !important;
}

.icon-queue-build, .x-tree-icon.icon-queue-build {
    background: url('../../_content/build-icons.png') no-repeat -1312px -16px !important;
}

.icon-record, .x-tree-icon.icon-record {
    background: url('../Img/metro-misc1.png') no-repeat -2800px -16px !important;
}

.icon-redo, .x-tree-icon.icon-redo {
    background: url('../Img/metro-misc1.png') no-repeat -2848px -16px !important;
}

.icon-refresh-2, .x-tree-icon.icon-refresh-2 {
    background: url('../Img/metro-misc1.png') no-repeat -2896px -16px !important;
}

.icon-refresh-3, .x-tree-icon.icon-refresh-3 {
    background: url('../Img/metro-misc1.png') no-repeat -2944px -16px !important;
}

.icon-rename, .x-tree-icon.icon-rename {
    background: url('../Img/metro-common.png') no-repeat -1744px -16px !important;
}

.icon-repeat, .x-tree-icon.icon-repeat {
    background: url('../Img/metro-misc1.png') no-repeat -2992px -16px !important;
}

.x-tree-icon.icon-report {
    background: url('../Img/metro-misc1.png') no-repeat -3040px -16px !important;
}

.icon-restricted-2, .x-tree-icon.icon-restricted-2 {
    background: url('../Img/metro-misc1.png') no-repeat -3088px -16px !important;
}

.icon-restricted-document, .x-tree-icon.icon-restricted-document {
    background: url('../Img/metro-misc1.png') no-repeat -3138px -18px !important;
}

.icon-restrited, .x-tree-icon.icon-restrited {
    background: url('../Img/metro-misc1.png') no-repeat -3184px -16px !important;
}

.icon-results, .x-tree-icon.icon-results {
    background: url('../Img/metro-misc1.png') no-repeat -3232px -16px !important;
}

.icon-row-delete, .x-tree-icon.icon-row-delete {
    background: url('../Img/metro-misc1.png') no-repeat -3280px -16px !important;
}

.icon-row-insert, .x-tree-icon.icon-row-insert {
    background: url('../Img/metro-misc1.png') no-repeat -3328px -16px !important;
}

.icon-row-remove, .x-tree-icon.icon-row-remove {
    background: url('../Img/metro-misc1.png') no-repeat -3376px -16px !important;
}

.icon-rss, .x-tree-icon.icon-rss {
    background: url('../Img/metro-common.png') no-repeat -1788px -16px !important;
}

.x-tree-icon.icon-save {
    background: url('../Img/metro-common.png') no-repeat -1840px -16px !important;
}

.icon-save-all, .x-tree-icon.icon-save-all {
    background: url('../Img/metro-common.png') no-repeat -1888px -16px !important;
}

.icon-save-as, .x-tree-icon.icon-save-as {
    background: url('../Img/metro-common.png') no-repeat -1936px -16px !important;
}

.icon-save-close, .x-tree-icon.icon-save-close {
    background: url('../Img/metro-common.png') no-repeat -1984px -16px !important;
}

.x-tree-icon.icon-search {
    background: url('../Img/metro-common.png') no-repeat -2028px -16px !important;
}

.icon-search-2, .x-tree-icon.icon-search-2 {
    background: url('../Img/metro-misc1.png') no-repeat -3424px -16px !important;
}

.icon-search-folder, .x-tree-icon.icon-search-folder {
    background: url('../Img/metro-misc1.png') no-repeat -3472px -16px !important;
}

.icon-send-2, .x-tree-icon.icon-send-2 {
    background: url('../Img/metro-misc1.png') no-repeat -3568px -16px !important;
}

.x-tree-icon.icon-settings {
    background: url('../Img/metro-common.png') no-repeat -2080px -16px !important;
}

.icon-sort, .x-tree-icon.icon-sort {
    background: url('../Img/metro-misc1.png') no-repeat -3616px -16px !important;
}

.icon-sort-asc, .x-tree-icon.icon-sort-asc {
    background: url('../Img/metro-misc1.png') no-repeat -3664px -16px !important;
}

.icon-sort-asc-1, .x-tree-icon.icon-sort-asc-1 {
    background: url('../Img/metro-common.png') no-repeat -2124px -16px !important;
}

.icon-sort-desc, .x-tree-icon.icon-sort-desc {
    background: url('../Img/metro-misc1.png') no-repeat -3712px -16px !important;
}

.icon-sort-desc-1, .x-tree-icon.icon-sort-desc-1 {
    background: url('../Img/metro-common.png') no-repeat -2167px -16px !important;
}

.icon-stop-play, .x-tree-icon.icon-stop-play {
    background: url('../Img/metro-misc1.png') no-repeat -3760px -16px !important;
}

.icon-synchronize, .x-tree-icon.icon-synchronize {
    background: url('../Img/metro-misc1.png') no-repeat -3808px -16px !important;
}

.icon-tick, .x-tree-icon.icon-tick {
    background: url('../Img/metro-misc1.png') no-repeat -3856px -16px !important;
}

.icon-tick-2, .x-tree-icon.icon-tick-2 {
    background: url('../Img/metro-misc1.png') no-repeat -3904px -16px !important;
}

.icon-tip, .x-tree-icon.icon-tip {
    background: url('../Img/metro-misc1.png') no-repeat -3952px -16px !important;
}

.icon-tools, .x-tree-icon.icon-tools {
    background: url('../Img/metro-common.png') no-repeat -2258px -16px !important;
}

.icon-tree, .x-tree-icon.icon-tree {
    background: url('../Img/metro-misc1.png') no-repeat -3998px -16px !important;
}

.icon-tree-add, .x-tree-icon.icon-tree-add {
    background: url('../Img/metro-misc1.png') no-repeat -4046px -16px !important;
}

.icon-tree-corner, .x-tree-icon.icon-tree-corner {
    background: url('../Img/metro-misc1.png') no-repeat -4622px -16px !important;
}

.icon-undo, .x-tree-icon.icon-undo {
    background: url('../Img/metro-misc1.png') no-repeat -4094px -16px !important;
}

.icon-untrusted, .x-tree-icon.icon-untrusted {
    background: url('../Img/metro-misc1.png') no-repeat -4142px -16px !important;
}

.icon-up, .x-tree-icon.icon-up {
    background: url('../Img/metro-common.png') no-repeat -2320px -16px !important;
}

.icon-up-2, .x-tree-icon.icon-up-2 {
    background: url('../Img/metro-misc1.png') no-repeat -4190px -16px !important;
}

.icon-user, .x-tree-icon.icon-user {
    background: url('../Img/metro-misc1.png') no-repeat -4238px -16px !important;
}

.icon-users, .x-tree-icon.icon-users {
    background: url('../Img/metro-misc1.png') no-repeat -4286px -16px !important;
}

.icon-window, .x-tree-icon.icon-window {
    background: url('../Img/metro-common.png') no-repeat -2416px -16px !important;
}

.icon-windows, .x-tree-icon.icon-windows {
    background: url('../Img/metro-misc1.png') no-repeat -4334px -16px !important;
}

.icon-windows-tile, .x-tree-icon.icon-windows-tile {
    background: url('../Img/metro-misc1.png') no-repeat -4382px -16px !important;
}

.icon-zoom, .x-tree-icon.icon-zoom {
    background: url('../Img/metro-common.png') no-repeat -2464px -16px !important;
}

body .icon-symantec {
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAIAAADYYG7QAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAsZJREFUeNrsmD9ME1Ecx9/vwiALhI78mcpEdSQpDozC6CBERv64sGlXEzVxLU66AGHEqAMjZRMS2sAIZWonqGNRFpz6/Fxfc/6B2nt3vqaJ93LT5V7f576/7+/PVb4ezKpeWp7qsZUAJUAJ0H8H1Bdn80VdFU5l71S+XauzmpoaVwN39IN7auauHuiP+JsSrVJfXas3Bdncl7lJnR1XYyk1MazPvsh5XX06lnJNLU/rpzO6S0CIsbLlZYb1i4d6NHXLA6WqvNyRwX61vtiwlcqLoM38O28qrdeXbqdhZdP6w2pjdEjzpHNTP9nysEh+oUM4EMY8Q2QdAhELXEKkQj6/sdgACO+7Atr87Ls1vC2IKa7/eCyugEhy4mW1hSrALidAJBdv3M7I7Rb2Z6MToKvvMpayrivO076Hehm1uFixPoB4WYnUZyU+Bgp8TTJfXMrfX4AtxapgI1fNlRzeO6F3Njvrpcy/lYkRNXhDgHJTlcPnPgf9LnzdsgaiCN1/7c1V/ebAtTztC7b2uAHWz1q1L8WKbCy1aCCzqhTWzZUq92pHaFUGgiOpxYSSuNDmCBA31xZ8XNwzm/d2c7/hOun2uW1BmIAJDgYP/I4YmRFfvICbYBHlbsxD5jxiwdDzR6mk36EZNiJq2bT1SCSRP6XJMg5GKoShYDIrUjnP6y3vW7W8uEDECA4gjAClpm8ImRlhTRyR0NbOUYCMKhzG2eVaq5njG1NyTGUqnLS6qbmDVFZqWQDd9A13ShUfIqjggALHlG20IdF4AVIvyIB/BmRoovmUvSQmI2+YCIYqjLjk19pju0zmw5TJ6Y7TS6jm+mxbCFM0moCJK/e+83FeGMFJKIwZc67glcgDk5KxgGgOjybj0pik8+fro3geIm/JFJPt8ZlMAcsrHUuhaF/E7T5CCD1YTlpH8v9QApQAJUAJUHfWDwEGAAodWnZc1TdbAAAAAElFTkSuQmCC');
}

body.mobile .icon-symantec {
    background-image: url('../Img/base/symantec-logo.png');
}

body .icon-gantt-zoomin {
    background-image: url('../Img/base/ico-add.png');
}

body .icon-gantt-zoomout {
    background-image: url('../Img/base/ico-less.png');
}

body .icon-zoomtofit {
    background-image: url('../Img/base/ico-zoomtofit.png');
}

body .icon-dragdrop {
    background-image: url('../Img/base/ico-drag-drop.png');
}

body .icon-quicktasks-zero {
    background-image: url('../Img/base/ico-quicktasks-zero.png');
}

body.mobile .mini-icon {
    background-size: 10px;
    background-repeat: no-repeat;
    background-position: left center;
    padding-left: 15px;
}

    body.mobile .mini-icon.ticket-status {
        background-image: url('../Img/base/mini-status.png');
    }

    body.mobile .mini-icon.account {
        background-image: url('../Img/base/mini-company.png');
    }

    body.mobile .mini-icon.location {
        background-image: url('../Img/base/mini-location.png');
    }

body .icon-microsoft {
    width: 18px !important;
    height: 18px !important;
    background-size: 17px;
    background-image: url(../Img/ExternalAuthProviders/Microsoft/microsoft.svg);
}

body .icon-google {
    width: 18px !important;
    height: 18px !important;
    background-size: 17px;
    background-image: url(../Img/ExternalAuthProviders/Google/google.svg);
}

body .icon-from-to-vertical {
    background-image: url(../Svg/from-to-vertical-icon.svg);
    width: 16px;
    height: 26px;
    margin-top: 6px;
    background-repeat: no-repeat;
}


/* ============================== FILE ICONS ============================== */

.document-item:before,
.file-icon:before {
    font-family: "pat-icons" !important;
    display: inline-block !important;
    line-height: 1 !important;
    font-weight: normal !important;
    font-style: normal !important;
    text-decoration: none !important;
    text-transform: none !important;
    text-rendering: auto !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    speak: none;
    font-size: 24px;
}

.document-item-generic:before,
.file-icon.generic:before {
    content: "\f1b2";
}

.document-item-excel:before,
.file-icon.excel:before {
    content: "\f1b7";
}

.document-item-image:before,
.file-icon.image:before {
    content: "\f1b3";
}

.document-item-pdf:before,
.file-icon.pdf:before {
    content: "\f1b5";
}

.document-item-presentation:before,
.file-icon.presentation:before {
    content: "\f1bc";
}

.document-item-word:before,
.file-icon.word:before {
    content: "\f1b6";
}

.document-item-txt:before,
.file-icon.txt:before {
    content: "\f1b4";
}

/* TODO - SOSTITUIRE CON ICON FONT */
.x-tool-img {
    background-image: url(../Img/base/tools.gif);
}





/* ============================== LAYOUT ============================== */

.portal-right {
    padding: 0 10px 0 0;
}

.portal-page-column + .portal-page-column {
    margin-left: 12px;
}

.portal-pages-container .portal-tab {
    padding: 20px 32px 20px 32px;
}

.layout-small-desktop .portal-pages-container .portal-tab {
    padding: 10px;
}

    .portal-pages-container .portal-tab.no-padding,
    .layout-small-desktop .portal-pages-container .portal-tab.no-padding {
        padding: 0;
    }

body.mobile .portal-pages-container .portal-tab {
    padding: 0;
}

.portal-tab .module-container {
}

    .portal-tab .module-container + .module-container {
        margin-top: 10px;
    }


.module-container {
}

body.mobile .module-container {
    background-color: #FFF;
}

.module-header,
.module-container .module-header {
    padding: 0;
    margin: 0 8px 12px 8px;
    font-size: 24px;
    font-weight: 300;
}

.layout-small-desktop .module-header,
.layout-small-desktop .module-container .module-header {
    margin-bottom: 6px;
    font-size: 20px;
    font-weight: normal;
}

body.mobile .module-header,
body.mobile .module-container .module-header {
    margin: 0 0 12px 0;
    padding: 12px 14px;
}



/* Module */
.module {
}

/* Content Area - Part of the page appearing as a "boxed" content area. */
.content-area {
    padding: 14px 16px;
    border-radius: 4px;
    background-color: #FFF;
    box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.1);
    margin: 2px 8px 12px 8px;
}

.layout-small-desktop .content-area {
    padding: 10px;
}

/*.content-area + .content-area {
	margin-left: 20px;
}*/

body.mobile .content-area {
    box-shadow: none;
    margin: 0;
    padding: 0;
    border-radius: 0;
}


/* Content Area Resets - Nested content-areas */

/* Simply nested areas */
.content-area .content-area,
/* Window/SlidingPanel contained areas */
.floating-panel .content-area {
    background-color: transparent;
    box-shadow: none;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
}


/* Content Area Resets - Explicit resets.
   In some cases content areas don't have to appear as standard "content boxes" and they delegate to inner components the "content area" role.
*/

/* Unstyled module containers (action links) */
.is-unstyled > .panel-body > .module {
    background-color: transparent;
    box-shadow: none;
    margin: 0;
    padding: 0;
    border: 0;
}




/* content negative utility class */
.content-negative {
    background-color: #222;
    color: #FFF;
}


/* Single Module Viewport (/Portal/Module) */

.single-module-viewport {
    background-color: #FFF;
}

    .single-module-viewport .single-module-done {
        height: 100%;
        width: 100%;
        display: table;
    }

        .single-module-viewport .single-module-done .placeholder-text,
        body.mobile .single-module-viewport .single-module-done .placeholder-text {
            display: table-cell;
            vertical-align: middle;
            text-align: center;
            font-size: 100px;
            color: #CCC;
        }


.single-module-ct {
}

body.mobile .single-module-ct {
    padding: 0px;
}

.x-border-region-slide-in,
.x-border-region-slide-out {
    background-color: #FFF;
}



/* ============================== MODULE ============================== */

.module {
}

/*body.mobile .module {
	padding: 0 6px;
}*/

body.mobile .module-header .x-tool-img {
    width: 24px;
    height: 24px;
}

.module-content-wrapper {
}

body.mobile .module-content-wrapper {
    padding: 0 14px; /* mobile side spacing */
}







/* ============================== MASKS ============================== */

/* GENERIC MASK / LOAD MASK */

.x-mask {
    background-color: hsla(0, 0%, 98%, 0.6);
}


    .x-mask .x-mask-msg {
        border: 0;
        background-image: none;
        background-color: hsla(0, 0%, 94%, 0.85);
        border-radius: 6px;
    }

    .x-mask .x-mask-msg-inner {
        background-color: transparent;
        border: 0;
    }

    .x-mask .x-mask-msg-text {
        background-image: url(../img/wait.gif);
        background-position: center 10px;
        padding: 50px 30px 10px 30px;
        border: 0;
    }


body #mce-modal-block.mce-in {
    background-color: hsla(0, 0%, 13%, 0.6);
    filter: none;
    opacity: 1;
}


/* Advanced load mask*/
.load-mask {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background-color: hsla(0, 0%, 13%, 0.6);
}

    .load-mask .x-mask-msg,
    .load-mask .x-mask-msg-inner,
    .load-mask .x-mask-msg-text {
        background-color: transparent;
        border: none;
        padding: 0;
    }

    .load-mask .x-mask-msg-text {
        background-image: none;
    }

    .load-mask .mask-content {
        display: flex;
        flex-direction: column;
        align-items: center;
        padding: 40px;
        background-color: #FFF;
        border-radius: 10px;
        max-height: 260px;
        width: 300px;
        box-shadow: 0 6px 15px 0 rgba(34, 34, 34, 0.4);
    }

body.mobile .load-mask .mask-content {
    padding: 20px;
    width: 200px;
    max-height: 360px;
}

.load-mask .mask-icon {
    width: 32px;
    height: 32px;
    font-size: 32px;
    line-height: 32px;
    text-align: center;
}

    .load-mask .mask-icon:before {
        font-family: "pat-font" !important;
        content: attr(data-icon);
        font-style: normal !important;
        font-weight: normal !important;
        font-variant: normal !important;
        text-transform: none !important;
        speak: none;
        line-height: 1;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }

.load-mask .mask-content.loading .mask-icon {
    background-image: url(../img/wait.gif);
}

.load-mask .mask-content.success .mask-icon:before {
    content: "\28";
    color: #16934E;
}

.load-mask .mask-content.error .mask-icon:before {
    content: "\3f";
    color: #FB5231;
}

.load-mask .mask-content.warning .mask-icon:before {
    content: "\3f";
    color: #F4BD00;
}

.load-mask .mask-message {
    font-size: 12px;
    margin-top: 18px;
    align-self: stretch;
    overflow: auto;
    text-align: center;
    line-height: 1.5em;
}

.load-mask .mask-buttons {
    margin-top: 18px;
    display: flex;
    justify-content: center;
}

    .load-mask .mask-buttons .btn + .btn {
        margin-left: 20px;
    }


/* MODAL MASK (window, confirm, all modals...) */

.modal-mask.x-mask,
div.webix_modal_cover {
    background-color: hsla(0, 0%, 13%, 0.6);
    filter: none;
    opacity: 1;
}

/* Webix modals */
.webix_modal_box {
    width: 280px;
    min-width: 280px;
    border: 0px none;
    box-shadow: 0 6px 15px 0 rgba(34, 34, 34, 0.4);
}

.webix_confirm .webix_popup_title {
    box-shadow: none;
    font-size: 18px;
    font-weight: 600;
}








/* ============================== HEADER ============================== */

.portal-header {
    background-color: #222;
    color: #999;
}

    .portal-header .module {
        background-color: transparent;
    }

body:not(.mobile) .portal-header {
    border-bottom: 1px solid #444;
}

body.mobile .portal-header {
    padding: 14px;
}

/* just to avoid strange border appearing with low resolutions */
body:not(.mobile) .portal-header-ct {
    border-bottom: 1px solid transparent;
}

body:not(.mobile) .portal-header-content {
    display: flex;
    align-items: center;
    padding: 6px 16px 6px 8px;
    overflow: hidden;
    height: 48px;
}

.portal-header-center {
    width: 100%;
    max-height: 100%;
    overflow: hidden;
}

    .portal-header-center::before {
        content: var(--portal-environment);
        font-size: 22px;
        font-weight: bold;
        color: #666;
        text-shadow: 1px 1px 0px #EEE;
        text-transform: capitalize;
    }

.portal-header-right {
}

.portal-logo {
    background-repeat: no-repeat;
    background-size: contain;
    height: 40px;
    width: 100px;
    flex: none;
}

.logon-info {
    display: flex;
    align-items: center;
    cursor: pointer;
}

.logon-info-photo {
}

.logon-info img {
    border: 1px solid #999;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    order: 0;
    margin-right: 12px;
}

.logon-info-description-ct {
    white-space: nowrap;
    order: 1;
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.logon-info-description {
    font-size: 14px;
    color: #FFF;
    font-weight: 500;
    text-overflow: ellipsis;
    overflow: hidden;
}

.logon-info-description-secondary {
    font-size: 11px;
    color: #AAA;
    font-weight: 300;
    text-overflow: ellipsis;
    overflow: hidden;
    margin-top: 2px;
}


/* ============================== HEADER BADGES ============================== */

.header-badges {
    display: flex;
    align-items: center;
}

.header-badges-ct {
    white-space: nowrap;
    margin: 0 30px 0 20px;
}

.header-badge {
    border: 0px none;
    color: #222;
    font-size: 12px;
    font-weight: 600;
    padding: 5px;
    margin-right: 26px;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    text-align: center;
    position: relative;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition-property: background-color, border-color, color, opacity;
    transition-duration: 0.2s;
}

    .header-badge:before {
        font-family: 'pat-font';
        font-size: 18px;
        font-weight: normal;
        color: #999;
        vertical-align: middle;
        line-height: 10px;
        content: '/';
        position: absolute;
        top: 8px;
        transition-property: background-color, border-color, color, opacity;
        transition-duration: 0.2s;
        padding: 1px;
    }

    .header-badge.type-count {
        background-color: #999;
        margin-right: 54px;
    }

        .header-badge.type-count:before {
            left: 35px;
        }

        .header-badge.type-count.toggled-on {
            background-color: #CCC;
        }

            .header-badge.type-count.toggled-on:before {
                color: #CCC;
            }

    .header-badge.type-button {
        background-color: transparent;
    }

        .header-badge.type-button,
        .header-badge.type-button:before {
            color: #CCC;
        }

    .header-badge.type-toggle:hover,
    .header-badge.type-toggle:hover:before,
    .header-badge.type-toggle.toggled-on,
    .header-badge.type-toggle.toggled-on:before {
        color: #CCC;
    }






/* ============================== HEADER CALLOUT ============================== */
.logon-info-callout {
    box-shadow: 0 6px 15px 0 rgba(34, 34, 34, 0.4);
    border: 0;
    border-radius: 6px;
    z-index: 10100;
}

    .logon-info-callout .x-callout-body {
        padding: 20px;
    }

    .logon-info-callout .module {
        padding: 0;
    }

    .logon-info-callout .profile-cmd-bar {
    }

    .logon-info-callout .profile-image {
        width: 80px;
        height: 80px;
        cursor: pointer;
        border-radius: 50%;
        margin-bottom: 20px;
    }

    .logon-info-callout .btn {
        width: 120px;
    }

        .logon-info-callout .btn + .btn {
            margin-top: 12px;
        }

    .logon-info-callout label {
        font-size: 11px;
        font-weight: 600;
    }

    .logon-info-callout .display-field {
        display: block;
    }

        .logon-info-callout .display-field .field-body {
            display: block;
        }

        .logon-info-callout .display-field .x-form-display-field-default {
            margin-top: 0px;
            color: #777;
            overflow: hidden;
            text-overflow: ellipsis;
        }

    .logon-info-callout .profile-fields-separator {
        margin: 16px 0;
    }

    .logon-info-callout .x-callout-arrow {
        right: 20px;
        border-bottom-color: transparent;
    }

    .logon-info-callout .fieldset {
        padding: 0;
        margin: 0;
    }

    .logon-info-callout .profile-user-info-ct {
        padding: 0 0 0 20px;
    }


/* ============================== NAV AREA / NAVBAR  ============================== */
.portal-nav {
    background-color: #222;
    color: #999;
    padding: 0 16px 0 0;
}

    .portal-nav .portal-navbar {
        border: 0px none;
        padding: 0 0 0 16px;
    }

    .portal-nav.is-main-menu-visible .portal-navbar {
        border: 0;
        border-left: 1px solid #444;
    }

.portal-navbar .x-box-inner {
    border-bottom: 0px none;
}

.portal-navbar .tab {
    color: inherit;
    margin-top: 4px;
}

.layout-small-desktop .portal-navbar .tab {
    margin-top: 0;
}

.portal-navbar .tab.is-over,
.portal-navbar .tab.x-tab.is-over {
    color: #CCC;
}

.portal-navbar .tab.is-selected,
.portal-navbar .tab.x-tab.is-selected {
    color: #FFF;
}

    .portal-navbar .tab.is-selected .tab-label,
    .portal-navbar .tab.x-tab.is-selected .x-tab-inner {
        font-weight: normal;
    }

.portal-navbar .x-tab-icon-el {
    display: none;
}

.portal-navbar .x-tab-tabmenu-right,
.portal-navbar .x-tab-bar-default-top .x-box-scroller-left,
.portal-navbar .x-tab-bar-default-top .x-box-scroller-right {
    background-color: transparent;
}

    .portal-navbar .x-tab-tabmenu-right:hover,
    .portal-navbar .x-box-scroller-left:hover,
    .portal-navbar .x-box-scroller-right:hover {
        background-color: rgba(255, 255, 255, 0.15);
    }

    .portal-navbar .x-tab-tabmenu-right:before,
    .portal-navbar .x-box-scroller-left:before,
    .portal-navbar .x-box-scroller-right:before {
        color: #CCC;
    }

.portal-navbar-menu.menu .menu-item .menu-item-icon {
    display: none;
}

/* ============================== MAIN MENU ============================== */
body .portal-nav-menu-container {
    padding: 0;
    font-weight: 300;
}

body .portal-menu-pinned,
body .portal-menu-floating,
body .portal-nav-menu-container,
body .portal-main-menu-splitter {
    background-color: #222;
}


body .portal-menu-floating {
    box-shadow: 0 6px 15px 0 rgba(34, 34, 34, 0.4);
}

body.mobile .portal-menu-floating {
    border: 0px none;
}

    body.mobile .portal-menu-floating .x-mask {
        background-color: transparent;
    }

.portal-nav-main-menu *::-webkit-scrollbar-track {
    background-color: transparent;
}

.portal-nav-main-menu *::-webkit-scrollbar-thumb {
    background-color: #444;
}

body .portal-main-menu-splitter.x-splitter-vertical {
    background-image: none;
    border: 0;
    margin: 0;
    padding: 0;
}


/* ============================== MAIN MENU - TOOLBAR/BUTTONS ============================== */

.webix_view.webix_toolbar.webix_layout_toolbar button {
    font-size: 14px;
    text-transform: unset;
    background-color: transparent;
    color: #222222;
    border: none;
}

.webix_el_text input:focus,
.webix_el_text input:hover {
    border-color: #777 !important;
}

.portal-nav-btn.x-btn,
.portal-nav-btn.x-btn:hover,
.portal-nav-btn.x-btn.x-btn-over,
.portal-nav-btn.x-btn.x-btn-focus,
.portal-nav-btn.x-btn.x-btn-pressed,
.portal-nav-btn.x-btn.x-btn-default-small {
    background-color: transparent;
    border: 0px none;
    box-shadow: none;
    outline: none;
    padding: 0;
    min-width: unset;
}

.portal-nav-menu-btn.x-btn .x-btn-icon-el {
    width: 24px;
    height: 24px;
    font-size: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .portal-nav-menu-btn.x-btn .x-btn-icon-el::before,
    .portal-menu-btn.x-btn .x-btn-icon-el::before {
        font-size: 24px;
    }

.portal-nav-menu-btn.is-menu-expanded .x-btn-icon-el::before,
.portal-menu-btn.is-menu-expanded .x-btn-icon-el::before {
    font-size: 18px;
}

.portal-nav .portal-nav-menu-btn.x-btn {
    padding: 13px 16px;
}

body.mobile .portal-nav-btn.x-btn,
body.mobile .portal-nav-btn.x-btn:hover,
body.mobile .portal-nav-btn.x-btn.x-btn-over,
body.mobile .portal-nav-btn.x-btn.x-btn-focus,
body.mobile .portal-nav-btn.x-btn.x-btn-pressed,
body.mobile .portal-nav-btn.x-btn.x-btn-default-small {
    background-color: transparent;
    border: 0px none;
    box-shadow: none;
    outline: none;
    padding: 0;
}

    body.mobile .portal-nav-btn.x-btn .x-btn-icon-el {
        width: 24px;
        height: 24px;
        font-size: 24px;
    }




body .portal-nav-menu-toolbar {
    padding: 7px 16px;
}

body.mobile .portal-nav-menu-toolbar {
    padding: 8px 14px 0 14px;
    margin-bottom: 8px;
}

.layout-small-desktop body .portal-nav-menu-toolbar {
    padding: 3px 16px;
}

body .portal-nav-menu-toolbar .x-btn {
    color: #AAA;
    margin: 8px 0 4px 0;
}

.portal-nav-menu-toolbar input::placeholder {
    color: #AAA;
}

.portal-nav-menu-toolbar input::-webkit-input-placeholder {
    color: #AAA;
}

.portal-nav-menu-toolbar input::-moz-placeholder {
    color: #AAA;
}

.portal-nav-menu-toolbar input::-ms-placeholder {
    color: #AAA;
}

.portal-nav-menu-toolbar input:-ms-input-placeholder {
    color: #AAA;
}

/* TODO - TEMPORARY, FIX ICON */
.portal-nav-menu-toolbar .portal-nav-menu-btn .icon-ico-037.x-btn-icon-el-default-small {
    font-size: 26px;
    padding: 4px;
}

.portal-nav-menu-toolbar .portal-nav-pin-btn.x-btn .x-btn-icon-el-default-small {
    width: 18px;
    height: 18px;
    font-size: 18px;
}

.portal-nav-menu-toolbar .portal-nav-pin-btn.is-active {
    color: #FFF;
}

.portal-nav-menu-toolbar .portal-nav-pin-btn .portal-nav-pin-btn-icon:before {
    content: "\f17d";
}

.portal-nav-menu-toolbar .portal-nav-pin-btn.is-active .portal-nav-pin-btn-icon:before {
    content: "\f17c";
}

.portal-nav-menu-toolbar .portal-nav-close-btn.x-btn .x-btn-icon-el {
    width: 36px;
    height: 36px;
    font-size: 36px;
}

.layout-small-desktop .portal-nav-menu-btn.x-btn .x-btn-icon-el {
    width: 20px;
    height: 20px;
}

    .layout-small-desktop .portal-nav-menu-btn.x-btn .x-btn-icon-el::before,
    .layout-small-desktop .portal-main-menu.webix_sidebar .webix_tree_item .webix_sidebar_icon::before {
        font-size: 20px;
    }

.portal-main-menu.webix_sidebar .webix_tree_item .webix_sidebar_icon.far:before {
	font-size: 20px;
}

.layout-small-desktop .portal-main-menu.webix_sidebar .webix_tree_item .webix_sidebar_icon.far::before {
    font-size: 17px;
}

.portal-main-menu-item-icon {
    background-image: none !important;
}

    .portal-main-menu-item-icon::before {
        content: "\f11a";
    }

.layout-small-desktop .portal-main-menu .webix_tree_item {
    height: 36px;
    line-height: 36px;
}


.portal-nav-menu-toolbar .portal-main-menu-search {
    margin: 0 16px 0 16px;
}

    .portal-nav-menu-toolbar .portal-main-menu-search .x-form-text-default {
        background-color: transparent;
    }

    .portal-nav-menu-toolbar .portal-main-menu-search .x-form-trigger-wrap {
        background-color: transparent;
        border: 0px none;
        border-bottom: 1px solid #444;
        border-radius: 0;
        /*padding: 6px;*/
    }

    .portal-nav-menu-toolbar .portal-main-menu-search,
    .portal-nav-menu-toolbar .portal-main-menu-search input,
    .portal-nav-menu-toolbar .portal-main-menu-search .x-form-text-default .x-btn {
        color: #FFF;
        background-color: transparent;
    }


/* ============================== MAIN MENU - CONTENT (SIDEBAR) ============================== */

/* webix resets*/
.portal-main-menu.webix_sidebar .webix_tree_item,
.portal-main-menu.webix_sidebar .webix_tree_item .webix-icon,
.portal-main-menu.webix_sidebar .webix_tree_branch_1 > .webix_tree_item,
.portal-main-menu.webix_sidebar .webix_sidebar_dir_icon,
.portal-main-menu.webix_sidebar .webix_sidebar_icon,
.portal-main-menu.webix_sidebar .webix_tree_item.webix_selected,
.portal-main-menu.webix_sidebar .webix_tree_item.webix_selected span,
.portal-main-menu.webix_sidebar .webix_tree_item.webix_selected .webix-icon,
.portal-main-menu.webix_sidebar .webix_tree_item.webix_selected .webix_sidebar_icon,
.portal-main-menu.webix_sidebar .webix_tree_item.webix_sidebar_selected .webix_sidebar_icon,
.portal-main-menu.webix_sidebar .webix_tree_item.webix_selected .webix_sidebar_dir_icon,
.portal-main-menu.webix_sidebar .webix_tree_item.webix_sidebar_selected .webix_sidebar_dir_icon {
    color: inherit;
}

.portal-main-menu.webix_sidebar .webix_tree_item,
.portal-main-menu.webix_sidebar_popup .webix_list_item {
    transition-property: background-color, color;
    transition-duration: 0.2s;
    overflow: hidden;
    text-overflow: ellipsis;
}

    .portal-main-menu.webix_sidebar,
    .portal-main-menu.webix_popup.webix_sidebar_popup .webix_sidebar_popup_left,
    .portal-main-menu.webix_sidebar_popup .webix_sidebar_popup_title,
    .portal-main-menu.webix_sidebar_popup .webix_menu .webix_list_item,
    .portal-main-menu.webix_sidebar_popup .webix_menu-x .webix_list_item,
    .portal-main-menu.webix_sidebar .webix_tree_item.webix_selected,
    .portal-main-menu.webix_popup.webix_menu .webix_list_item {
        background-color: transparent;
        color: inherit;
    }

.portal-nav-menu-container .x-panel-body-default,
.portal-main-menu.webix_sidebar {
    background-color: transparent;
}

    .portal-main-menu.webix_sidebar .webix_tree_item.webix_sidebar_selected,
    .portal-main-menu .webix_menu.webix_view .webix_list_item.webix_selected {
        background-color: transparent;
    }


.portal-main-menu .webix_sidebar_dir_icon {
    visibility: hidden;
}

    .portal-main-menu .webix_sidebar_dir_icon.wxi-angle-down {
        visibility: visible;
    }

.portal-main-menu .webix_tree_item:hover .webix_sidebar_dir_icon {
    visibility: visible;
}

.portal-main-menu.webix_view,
.portal-main-menu .webix_view {
    background-color: transparent;
}

/* Main menu styles */

.portal-nav-menu-container {
    padding: 0;
}

.portal-main-menu.webix_sidebar .webix_tree_item,
.portal-main-menu.webix_sidebar .webix_tree_branch_1 > .webix_tree_item {
    padding-left: 16px;
}

    .portal-main-menu.webix_sidebar .webix_tree_item.webix_selected .webix_sidebar_icon,
    .portal-main-menu.webix_sidebar .webix_tree_item .webix_sidebar_icon {
        margin-right: 16px;
        width: auto;
    }

.portal-main-menu.webix_sidebar .webix_tree_branch_2 .webix_tree_item {
    padding-left: 57px;
}

.layout-desktop-small .portal-main-menu.webix_sidebar .webix_tree_branch_2 .webix_tree_item {
    padding-left: 53px;
}

.portal-main-menu.webix_sidebar .webix_tree_item .webix_sidebar_icon {
    margin-left: 0px;
}

    .portal-main-menu.webix_sidebar .webix_tree_item .webix_sidebar_icon:before {
        font-size: 24px
    }

.portal-main-menu.webix_sidebar .webix_tree_branch_1 > .webix_tree_item,
.portal-main-menu.webix_sidebar_popup .webix_sidebar_popup_title {
    text-transform: uppercase;
}

.portal-main-menu.webix_sidebar_popup .webix_list_item,
.portal-main-menu.webix_menu.webix_view .webix_list_item:hover,
.portal-main-menu .webix_sidebar_popup_list .webix_list_item:hover,
.portal-main-menu.webix_popup.webix_menu .webix_list_item.webix_selected {
    border-radius: 0;
}

/* Main menu hover background */
.portal-main-menu.webix_sidebar .webix_tree_item:hover,
.portal-main-menu.webix_sidebar .webix_list_item:hover,
.portal-main-menu.webix_sidebar .webix_tree_item.webix_sidebar_selected:hover,
.portal-main-menu.webix_sidebar .webix_tree_item.webix_selected:hover,
.portal-main-menu.webix_menu.webix_view .webix_list_item:hover,
.portal-main-menu .webix_sidebar_popup_list .webix_list_item.webix_sidebar_selected:hover {
    background-color: rgba(170, 170, 170, .6) !important;
}

/* Main menu selected color */
.portal-main-menu.webix_sidebar_popup .webix_list_item.webix_selected,
.portal-main-menu.webix_sidebar_popup .webix_list_item.webix_selected span,
.portal-main-menu.webix_sidebar .webix_tree_item.webix_sidebar_selected,
.portal-main-menu.webix_sidebar .webix_tree_item.webix_selected,
.portal-main-menu .webix_sidebar_popup_list .webix_list_item.webix_sidebar_selected {
    color: #FFF !important;
}

/* Main menu selected box shadow (side border) */
.portal-main-menu.webix_sidebar.webix_sidebar_left .webix_tree_item.webix_sidebar_selected,
.portal-main-menu.webix_sidebar.webix_sidebar_left .webix_tree_item.webix_sidebar_selected + .webix_tree_leaves .webix_tree_item,
.portal-main-menu.webix_sidebar_popup .webix_list_item.webix_selected {
    box-shadow: inset 2px 0 #FFF;
}

/* (Mobile) Main menu selected box shadow (side border) */
body.mobile .portal-main-menu.webix_sidebar.webix_sidebar_left .webix_tree_item.webix_sidebar_selected,
body.mobile .portal-main-menu.webix_sidebar.webix_sidebar_left .webix_tree_item.webix_sidebar_selected + .webix_tree_leaves .webix_tree_item,
body.mobile .portal-main-menu.webix_sidebar_popup .webix_list_item.webix_selected {
    box-shadow: inset 4px 0 #FFF;
}

/* Main menu sidebar "popup" (side-menu shown on hover) */

.portal-main-menu.webix_sidebar_popup,
.portal-main-menu.webix_popup.webix_menu {
    background-color: #222;
    font-size: 12px;
}

.portal-main-menu.webix_popup.webix_sidebar_popup .webix_layout_line {
    border-left: 1px solid #444;
}

.portal-main-menu.webix_sidebar_popup.webix_sidebar_popup_left,
.portal-main-menu.webix_sidebar_popup.webix_sidebar_popup_right {
    box-shadow: 0 6px 15px 0 rgba(34, 34, 34, 0.4);
}

/*  Main menu sidebar "popup" title 
	Trick: 2px width to have 1px visible border, because webix puts -1px margin on element below (?)
*/
/*
.portal-main-menu.webix_sidebar_popup  .webix_sidebar_popup_title .webix_template {
	border-bottom: 2px solid #444; 
}
*/




/* ============================== MAIN MENU - USER INFO ============================== */
.nav-user-info {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding: 12px 14px 12px 16px;
    margin-bottom: 8px;
    border-bottom: 1px solid #444;
    color: #FFF;
}

.nav-user-description {
    display: flex;
    align-items: center;
    margin-right: 10px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 24px;
}

    .nav-user-description:before {
        font-family: "pat-icons";
        font-size: 24px;
        content: "\f129";
        width: 24px;
        height: 24px;
        font-weight: normal;
        margin-right: 14px;
    }

.nav-user-logout {
    margin-left: auto;
    color: inherit;
    width: 24px;
    height: 24px;
    line-height: 24px;
    text-decoration: none;
}

    .nav-user-logout::before {
        font-family: "pat-icons";
        font-size: 24px;
        content: "\f182";
    }


.navbar-badge {
    color: #222;
}





/* ============================== COMPONENTS ============================== */


/* ============================== COMPONENTS - BADGES ============================== */

.badge,
.x-badge {
    background-color: #CCC;
    font-weight: 500;
    font-size: 12px;
}

/* Standard Badges (Detail Menu, Pinned Pages) */

.nav-tree .badge,
.tab .badge,
.pinned-page .badge {
    width: 26px;
    height: 26px;
    line-height: 26px;
    border-radius: 50%;
    text-align: center;
    color: #222;
}




/* ============================== COMPONENTS - BUTTONS ============================== */


/* ============================== Buttons Common Styles ============================== */
.btn,
.webix_button,
.webix_popup_button,
.webix_popup_button.confirm,
.webix_control button:not(.webix_switch_handle) {
    transition-property: background-color, color, border-color, box-shadow;
    transition-duration: 0.2s;
    cursor: pointer;
    padding: 0.5em 1em;
    border-radius: 4px;
    border-width: 1px;
    border-style: solid;
    border-color: transparent;
    text-transform: uppercase;
    font-weight: 600;
    box-shadow: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.layout-small-desktop .btn,
.layout-small-desktop .webix_button,
.layout-small-desktop .webix_popup_button,
.layout-small-desktop .webix_popup_button.confirm,
.layout-small-desktop .webix_control button {
    padding: 0.25em 0.5em;
}


.mce-btn {
    transition-property: background-color, color, border-color, box-shadow;
    transition-duration: 0.2s;
    cursor: pointer;
    border-radius: 4px;
    border-width: 1px;
    border-style: solid;
    border-color: transparent;
}

.mce-foot .mce-btn {
    text-transform: uppercase;
    font-weight: 600;
}

    .mce-foot .mce-btn * {
        text-transform: inherit;
        font-weight: inherit;
    }


.btn:disabled,
.btn.is-disabled {
    cursor: default;
}

.btn.x-btn .x-btn-wrap {
    display: block;
}

.btn.x-btn .x-btn-button {
    display: flex;
    align-items: center;
    justify-content: center;
    height: auto;
    line-height: 18px;
}

.btn.x-btn .x-btn-button-default-small {
    height: auto;
}


/* Button icon */
.btn .x-btn-icon .x-btn-inner {
    padding-left: 4px;
}

.btn .x-btn-icon-el,
.btn .btn-icon-el {
    width: auto;
    height: auto;
}

    .btn .x-btn-icon-el::before,
    .btn .btn-icon-el::before {
        font-size: 18px;
    }


.btn .x-btn-icon > .x-btn-icon-el {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.btn .btn-icon-el + .btn-text {
    margin-left: 6px;
}

.btn .x-btn-icon-right > .x-btn-inner-default-small,
.btn .x-btn-icon-left > .x-btn-inner-default-small,
.btn .x-btn-icon-right > .x-btn-inner-default-toolbar-small,
.btn .x-btn-icon-left > .x-btn-inner-default-toolbar-small {
    max-width: 100%;
}

.btn .x-btn-icon-left > .x-btn-icon-el-default-toolbar-small,
.btn .x-btn-icon-right > .x-btn-icon-el-default-toolbar-small {
    width: auto;
    height: auto;
    align-items: center;
}

/* Button with menu */
.btn.x-btn .x-btn-arrow {
    display: flex;
    align-items: center;
}

    .btn.x-btn .x-btn-arrow .x-btn-button {
        flex: 1;
        text-overflow: ellipsis;
        overflow: hidden;
        margin-right: 4px;
    }


.toolbar.x-toolbar .btn [class^="icon-"]::before,
.toolbar.x-toolbar .btn [class*=" icon-"]::before {
    font-size: 18px;
}

.layout-small-desktop .toolbar.x-toolbar .btn [class^="icon-"]::before,
.layout-small-desktop .toolbar.x-toolbar .btn [class*=" icon-"]::before {
    font-size: 16px;
}


/* Split Button */
.split-btn {
}

    .split-btn.x-btn .x-btn-button {
        padding-right: 6px;
        margin-right: 6px;
        border-right: 1px solid currentColor;
        flex: 1;
        text-overflow: ellipsis;
        overflow: hidden;
        height: auto;
    }

    .split-btn .x-btn-button-default-small {
        height: auto;
    }

    .split-btn.x-btn .x-btn-wrap {
        display: flex;
        align-items: center;
    }

    /*.x-btn-wrap-default-toolbar-small*/
    .split-btn .x-btn-split-right::after {
        background-image: none;
        font-family: 'pat-icons';
        font-weight: bold;
        font-size: 12px;
        content: '\f117';
        padding: 0;
        vertical-align: middle;
        display: flex;
        align-items: center;
        width: auto;
    }

    .split-btn:hover > .x-btn-split-right::after,
    .split-btn.x-btn.x-btn-over > .x-btn-split-right::after {
        background-image: none;
        padding: 0;
    }

.btn .x-btn-arrow-right::after {
    content: '\f117';
    padding: 0;
    background-image: none;
    font-family: 'pat-icons';
    font-size: 12px;
    font-weight: bold;
    vertical-align: middle;
    width: auto;
    display: flex;
    align-items: center;
}



/* ============================== Button Sizes ============================== */

.btn.btn-small {
    font-size: 12px;
    padding: 5px 10px;
}

    .btn.btn-small .x-btn-button {
        line-height: 16px;
    }

    .btn.btn-small .x-btn-icon-el::before,
    .btn.btn-small .btn-icon-el::before,
    .x-toolbar.toolbar .btn.btn-small [class^="icon-"]::before,
    .x-toolbar.toolbar .btn.btn-small [class*=" icon-"]::before {
        font-size: 16px;
    }



.btn.btn-large {
    border-radius: 6px;
    font-size: 18px;
}

    .btn.btn-large .x-btn-button {
        line-height: 24px;
    }

    .btn.btn-large .x-btn-icon-el::before,
    .btn.btn-large .btn-icon-el::before,
    .x-toolbar.toolbar .btn.btn-large [class^="icon-"]::before,
    .x-toolbar.toolbar .btn.btn-large [class*=" icon-"]::before {
        font-size: 24px;
    }



/* ============================== Standard Button Type ============================== */

.btn.btn-default {
    border-color: #999;
}

    .btn.btn-default:hover,
    .btn.btn-default.is-over,
    .btn.btn-default.x-btn.is-over {
        background-color: #777;
        border-color: #777;
        color: #FFF;
    }

    .btn.btn-default:focus,
    .btn.btn-default.is-focused,
    .btn.btn-default.x-btn.is-focused {
        border-color: #222;
    }

    .btn.btn-default:active,
    .btn.btn-default.is-active,
    .btn.btn-default.x-btn.is-active {
        background-color: #777;
    }

    .btn.btn-default:disabled,
    .btn.btn-default.is-disabled,
    .btn.btn-default.x-btn.is-disabled {
        color: #999;
        border-color: #CCC;
        background-color: transparent;
    }


/* ============================== Primary Button Type ============================== */
.btn.btn-primary,
.webix_primary .webix_button,
.webix_popup_button.confirm,
.mce-btn.mce-primary,
.webix_hint_buttons .webix_hint_button.webix_hint_button_next {
    background-color: #E0E0E0;
    border-color: #E0E0E0;
}

    .btn.btn-primary:hover,
    .btn.btn-primary.is-over,
    .btn.btn-primary.x-btn.is-over,
    .webix_primary .webix_button:hover,
    .webix_popup_button.confirm:hover,
    .mce-btn.mce-primary:hover,
    .webix_hint_buttons .webix_hint_button.webix_hint_button_next:hover {
        background-color: #F0F0F0;
        border-color: #F0F0F0;
    }

    .btn.btn-primary:focus,
    .btn.btn-primary.is-focused,
    .btn.btn-primary.x-btn.is-focused,
    .webix_primary .webix_button:focus,
    .webix_popup_button.confirm:focus,
    .mce-btn.mce-primary:focus,
    .webix_hint_buttons .webix_hint_button.webix_hint_button_next:focus {
        background-color: #E0E0E0;
        border-color: #222;
    }

    .btn.btn-primary:active,
    .btn.btn-primary.is-active,
    .btn.btn-primary.x-btn.is-active,
    .webix_primary .webix_button:active,
    .webix_popup_button.confirm:active,
    .mce-btn.mce-primary:active,
    .webix_hint_buttons .webix_hint_button.webix_hint_button_next:active {
        background-color: #CCC;
        border-color: #CCC;
    }

    .btn.btn-primary:disabled,
    .btn.btn-primary.is-disabled,
    .btn.btn-primary.x-btn.is-disabled {
        background-color: #E0E0E0;
        border-color: #E0E0E0;
        color: #999;
    }


/* ============================== Secondary Button Type ============================== */

.btn.btn-secondary,
.webix_secondary .webix_button,
.webix_popup_button,
.webix_hint_buttons .webix_hint_button.webix_hint_button_prev {
    background-color: #E0E0E0;
    border-color: #999;
}

    .btn.btn-secondary:hover,
    .btn.btn-secondary.is-over,
    .btn.btn-secondary.x-btn.is-over,
    .btn.btn-secondary:focus,
    .btn.btn-secondary.is-focused,
    .btn.btn-secondary.x-btn.is-focused,
    .webix_secondary .webix_button:hover,
    .webix_secondary .webix_button:focus,
    .webix_popup_button:hover,
    .webix_popup_button:focus,
    .webix_hint_buttons .webix_hint_button.webix_hint_button_prev:focus,
    .webix_hint_buttons .webix_hint_button.webix_hint_button_prev:hover {
        background-color: #E0E0E0;
        border-color: #222;
    }

    .btn.btn-secondary:active,
    .btn.btn-secondary.is-active,
    .btn.btn-secondary.x-btn.is-active,
    .webix_secondary .webix_button:active,
    .webix_hint_buttons .webix_popup_button:active,
    .webix_hint_buttons .webix_hint_button.webix_hint_button_prev:active {
        background-color: #F0F0F0;
    }

    .btn.btn-secondary:disabled,
    .btn.btn-secondary.is-disabled,
    .btn.btn-secondary.x-btn.is-disabled {
        color: #999;
        box-shadow: none;
        background-color: #F0F0F0;
        border-color: transparent
    }


/* ============================== Command Button Type ============================== */

.btn.btn-command {
    font-weight: normal;
    text-transform: none;
    box-shadow: none;
    background-color: transparent;
    border-color: transparent;
}

    .btn.btn-command.btn-small {
        font-weight: 600;
    }


    .btn.btn-command:hover,
    .btn.btn-command.is-over,
    .btn.btn-command.x-btn.is-over {
    }

        .btn.btn-command:hover .btn-text,
        .btn.btn-command.is-over .x-btn-inner {
            text-decoration: underline;
        }

    .btn.btn-command:focus,
    .btn.btn-command.is-focused,
    .btn.btn-command.x-btn.is-focused {
        border-color: #222;
    }

    .btn.btn-command:active,
    .btn.btn-command.is-active,
    .btn.btn-command.x-btn.is-active {
        color: #999;
    }

    .btn.btn-command:disabled,
    .btn.btn-command:disabled:active,
    .btn.btn-command.is-disabled,
    .btn.btn-command.x-btn.is-disabled {
        color: #999;
        background-color: transparent;
        border-color: transparent;
    }

        .btn.btn-command:disabled .btn-text,
        .btn.btn-command.is-disabled .x-btn-inner {
            text-decoration: none;
        }


/* Positive Button */

.btn.btn-positive {
    color: #FFF;
    background-color: #109006;
    border-color: #109006;
}

    .btn.btn-positive:hover,
    .btn.btn-positive.is-over,
    .btn.btn-positive.x-btn.is-over {
        background-color: #12A607;
        border-color: #12A607;
    }

    .btn.btn-positive:focus,
    .btn.btn-positive.is-focused,
    .btn.btn-positive.x-btn.is-focused {
        background-color: #109006;
        border-color: #222;
    }

    .btn.btn-positive:active,
    .btn.btn-positive.is-active,
    .btn.btn-positive.x-btn.is-active {
        background-color: #0a5d04;
        border-color: #0a5d04;
    }

    .btn.btn-positive:disabled,
    .btn.btn-positive.is-disabled,
    .btn.btn-positive.x-btn.is-disabled {
        color: #999;
        background-color: #E0E0E0;
        border-color: #E0E0E0;
        box-shadow: none;
    }



/* Negative Button */

.btn.btn-negative,
.webix_danger .webix_button {
    background-color: #EF5350;
    border-color: #EF5350;
    color: #FFF;
}

    .btn.btn-negative:hover,
    .btn.btn-negative.is-over,
    .btn.btn-negative.x-btn.is-over,
    .webix_danger .webix_button:hover {
        background-color: #F59796;
        border-color: #F59796;
    }

    .btn.btn-negative:focus,
    .btn.btn-negative.is-focused,
    .btn.btn-negative.x-btn.is-focused,
    .webix_danger .webix_button:focus {
        background-color: #EF5350;
        border-color: #222;
    }

    .btn.btn-negative:active,
    .btn.btn-negative.is-active,
    .btn.btn-negative.x-btn.is-active,
    .webix_danger .webix_button:active {
        background-color: #C91613;
        border-color: #C91613;
    }

    .btn.btn-negative:disabled,
    .btn.btn-negative.is-disabled,
    .btn.btn-negative.x-btn.is-disabled {
        color: #999;
        background-color: #E0E0E0;
        border-color: #E0E0E0;
    }


/* Light Positive Button */

.btn.btn-positive-light {
    border-color: #109006;
    background-color: transparent;
}

    .btn.btn-positive-light:hover,
    .btn.btn-positive-light.is-over,
    .btn.btn-positive-light.x-btn.is-over {
        background-color: #12a607;
        border-color: #12A607;
        color: #FFF;
    }

    .btn.btn-positive-light:focus,
    .btn.btn-positive-light.is-focused,
    .btn.btn-positive-light.x-btn.is-focused {
        border-color: #222;
    }

    .btn.btn-positive-light:active,
    .btn.btn-positive-light.is-active,
    .btn.btn-positive-light.x-btn.is-active {
        background-color: #109006;
        border-color: #109006;
        color: #FFF;
    }

    .btn.btn-positive-light:disabled,
    .btn.btn-positive-light.is-disabled,
    .btn.btn-positive-light.x-btn.is-disabled {
        border-color: #999;
        color: #999;
    }


/* Light Negative Button */

.btn.btn-negative-light {
    border-color: #EF5350;
    background-color: transparent;
}

    .btn.btn-negative-light:hover,
    .btn.btn-negative-light.is-over,
    .btn.btn-negative-light.x-btn.is-over {
        background-color: #F59796;
        border-color: #F59796;
        color: #FFF;
    }

    .btn.btn-negative-light:focus,
    .btn.btn-negative-light.is-focused,
    .btn.btn-negative-light.x-btn.is-focused {
        border-color: #222;
    }

    .btn.btn-negative-light:active,
    .btn.btn-negative-light.is-active,
    .btn.btn-negative-light.x-btn.is-active {
        background-color: #EF5350;
        border-color: #EF5350;
        color: #FFF;
    }

    .btn.btn-negative-light:disabled,
    .btn.btn-negative-light.is-disabled,
    .btn.btn-negative-light.x-btn.is-disabled {
        border-color: #999;
        color: #999;
    }


/* Icon Button */
.btn.btn-icon {
    background-color: transparent;
    border-color: transparent;
    padding: 0.5em;
}

.layout-small-desktop .btn.btn-icon {
    padding: 0.25em;
}

.btn.btn-icon .x-btn-button {
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn.btn-icon.btn-small .x-btn-icon-el,
.btn.btn-icon.btn-small .btn-icon-el {
    font-size: 16px;
}

.btn.btn-icon.btn-large .x-btn-icon-el,
.btn.btn-icon.btn-large .btn-icon-el {
    font-size: 24px;
}

.btn.btn-icon:hover,
.btn.btn-icon.is-over,
.btn.btn-icon.x-btn.is-over {
}

.btn.btn-icon:focus,
.btn.btn-icon.is-focused,
.btn.btn-icon.x-btn.is-focused {
    border-color: #222;
}

.btn.btn-icon:active,
.btn.btn-icon.is-active,
.btn.btn-icon.x-btn.is-active {
}

.btn.btn-icon:disabled,
.btn.btn-icon.is-disabled,
.btn.btn-icon.x-btn.is-disabled {
    color: #999;
}




/* ============================== COMPONENTS - FIELDS ============================== */


/* ============================== Inputs Base Styles ============================== */

input::-webkit-input-placeholder {
    color: #999;
}

input::-moz-placeholder {
    color: #999;
}

input:-ms-input-placeholder {
    color: #999;
}

input:-moz-placeholder {
    color: #999;
}

input::placeholder {
    color: #999;
}

textarea::-webkit-input-placeholder {
    color: #999;
}

textarea::-moz-placeholder {
    color: #999;
}

textarea:-ms-input-placeholder {
    color: #999;
}

textarea:-moz-placeholder {
    color: #999;
}

textarea::placeholder {
    color: #999;
}


.field.is-readonly input::-webkit-input-placeholder {
    opacity: 0;
}

.field.is-readonly input::-moz-placeholder {
    opacity: 0;
}

.field.is-readonly input:-ms-input-placeholder {
    opacity: 0;
}

.field.is-readonly input:-moz-placeholder {
    opacity: 0;
}

.field.is-readonly input::placeholder {
    opacity: 0;
}

.field.is-readonly textarea::-webkit-input-placeholder {
    opacity: 0;
}

.field.is-readonly textarea::-moz-placeholder {
    opacity: 0;
}

.field.is-readonly textarea:-ms-input-placeholder {
    opacity: 0;
}

.field.is-readonly textarea:-moz-placeholder {
    opacity: 0;
}

.field.is-readonly textarea::placeholder {
    opacity: 0;
}


/* ============================== Fields Common Styles ============================== */
.field {
    margin-bottom: 12px;
    overflow: hidden;
}

.field {
    display: table;
    /* 
		Forcing table-layout auto to let the browser set the cols width based on the cells content;
		we need to do this to avoid fixed layout (set by ExtJS) calculations, which are based on the first row of cells only
		and cause issues with all possible combinations of label left/top and field indicators.
		https://www.w3schools.com/cssref/pr_tab_table-layout.asp

	*/
    table-layout: auto;
}

label.x-label {
    margin: 16px 0;
}

.field-body {
    min-width: 20px;
}



/* Fields spacing */

.fields-row.labelposition-top .field:not(.is-hidden):first-child, /* this styles the first visible if it is the first child */
.fields-row.labelposition-top .field.is-hidden + .field:not(.is-hidden), /* this will style thie first show following a hidden panel */
.fields-row.labelposition-top .composite-field .field:not(.is-hidden):first-child ~ .field,
.filter-area.labelposition-top .fields-row .field:not(.is-hidden):first-child, /* this styles the first visible if it is the first child */
.filter-area.labelposition-top .fields-row .field.is-hidden + .field:not(.is-hidden), /* this will style thie first show following a hidden panel */
.filter-area.labelposition-top .fields-row .composite-field .field:not(.is-hidden):first-child ~ .field,
.page-container.labelposition-top .fields-row .field:not(.is-hidden):first-child, /* this styles the first visible if it is the first child */
.page-container.labelposition-top .fields-row .field.is-hidden + .field:not(.is-hidden), /* this will style thie first show following a hidden panel */
.page-container.labelposition-top .fields-row .composite-field .field:not(.is-hidden):first-child ~ .field {
    padding-left: 0px;
}

    .fields-row.labelposition-top .field:not(.is-hidden):first-child ~ .field,
    .fields-row.labelposition-top .field.is-hidden + .field:not(.is-hidden) ~ .field,
    .filter-area.labelposition-top .fields-row .field:not(.is-hidden):first-child ~ .field,
    .filter-area.labelposition-top .fields-row .field.is-hidden + .field:not(.is-hidden) ~ .field,
    .page-container.labelposition-top .fields-row .field:not(.is-hidden):first-child ~ .field,
    .page-container.labelposition-top .fields-row .field.is-hidden + .field:not(.is-hidden) ~ .field { /* these will reset all following visible back to original */
        padding-left: 30px;
    }

















.field .field-content-wrapper {
    display: flex;
    border: 1px solid #CCC;
    background-color: #FFF;
    border-radius: 4px;
    overflow: hidden;
    transition-property: border-color;
    transition-duration: 0.2s;
    color: #444;
}

.field:hover .field-content-wrapper,
.field.is-over .field-content-wrapper,
.field:focus .field-content-wrapper,
.field.is-focused .field-content-wrapper {
    border-color: #777;
}

.field .field-content-wrapper.is-unstyled {
    border: 0px none;
    background-color: transparent;
}

.field .field-input-wrapper {
    padding: 4px 10px;
}

.layout-small-desktop .field-input-wrapper,
.layout-small-desktop .field.x-tagcombo .x-form-text-wrap {
    padding: 2px 6px;
}


.field .field-text-input-wrapper {
    display: block;
    flex: auto;
}

.field-label {
    font-weight: 600;
    text-align: right;
    position: relative;
    padding-top: 6px;
}

.layout-small-desktop .field-label {
    font-size: 12px;
}

.field-label.field-label-top {
    text-align: left;
    padding: 0;
}

    .field-label.field-label-top > .field-label-inner {
        padding-bottom: 4px;
    }

.layout-small-desktop .field-label.field-label-top > .field-label-inner {
    padding-bottom: 2px;
}

/* top label - inject a zero-width white space to get whitespace only labels have a content that occupies a single text line height */
.field-label.field-label-top > .field-label-inner::before {
    content: "\200b"; /* zero-width whitespace */
}

.field-label:not(.field-label-top) {
    vertical-align: top;
    width: 160px;
    min-width: 160px;
    padding-right: 4px;
    padding-left: 8px;
    transition-property: width;
    transition-duration: 0.2s;
}

.layout-small-desktop .field-label:not(.field-label-top) {
    width: 110px;
    min-width: 110px;
}


.field-label:not(.field-label-top) .x-form-item-label-inner {
    /*padding-left: 12px;*/
    /*overflow: hidden;
			text-overflow: ellipsis;*/
}

/*.field-content-wrapper .x-form-text-wrap .x-btn:hover,
.field-content-wrapper .x-form-text-wrap .x-btn-over.x-btn-default-small,
.field-content-wrapper .x-form-text-wrap .x-btn-over.x-btn-default-toolbar-small,
.field-content-wrapper .objectToolbar .x-btn.x-btn-over {
	border-color: transparent;
	background-image: none;
	background-color: #E0E0E0;
}*/

.field .field-body {
    min-height: 22px;
}


.mce-textbox,
.mce-combobox input {
    border-radius: 4px;
}


/* ============================== Field Inner Icon ============================== */

.field:not(.textarea-field) .x-form-text-wrap > .x-textfield-icon-input {
    padding-left: 23px;
}

.field .x-textfield-icon {
    top: 5px;
    height: 20px;
}

/* ============================== Field Sizes ============================== */
.field.field-large {
}

    .field.field-large .x-form-text-wrap {
        padding-top: 10px;
        padding-bottom: 10px;
    }


/* ============================== Field Triggers / Buttons ============================== */

.field .side-button,
.field .side-button.is-over {
    display: inline-flex;
    background-image: none;
    align-items: center;
    justify-content: center;
    background-color: #F0F0F0;
    border: 0;
    border-left: 1px solid #CCC;
    border-radius: 0;
    width: 28px;
    min-width: 28px;
}

.layout-small-desktop .field .side-button,
.layout-small-desktop .field .side-button.is-over {
    min-width: 24px;
    width: 24px;
}

    .layout-small-desktop .field .side-button::before,
    .layout-small-desktop .field .side-button .x-btn-icon-el::before {
        font-size: 16px;
    }

body.mobile .side-button {
    width: 30px;
    min-width: 30px;
}

    body.mobile .side-button.x-form-trigger-spinner {
        display: none;
    }

.field .side-button:hover,
.field .side-button.is-over {
    background-color: #E0E0E0;
}

.field:not(.textarea-field) .field-text-input-wrapper > .x-form-text-default {
    height: 100%;
}

    .field:not(.textarea-field) .field-text-input-wrapper > .x-form-text-default * {
        height: 100% !important;
        align-items: center;
        justify-content: center;
    }

.field .side-button .x-btn-icon-el-default-toolbar-small {
    width: 18px;
    height: 18px;
}

.field .side-button.float-button {
    border: 0;
    height: 28px !important;
    width: 28px !important;
    text-decoration: none;
}

.field .side-button::before,
.field .side-button .x-btn-icon-el::before {
    font-family: "pat-icons";
    font-size: 18px;
    color: #222;
}

.field .side-button .x-btn-icon-el.fa-micbtn.fa-microphone-slash::before {
    font-family: "Font Awesome 6 Pro";
    font-size: 16px;
    color: #222;
}

@keyframes blink {
    from, to {
        opacity: 1
    }

    50% {
        opacity: 0
    }
}

.field .side-button .x-btn-icon-el.fa-micbtn.fa-microphone.blink::before {
    font-family: "Font Awesome 6 Pro";
    font-size: 16px;
    color: #222;
    padding-left: 4px;
    animation: blink 2s ease-in-out infinite;
}

.x-form-arrow-trigger::before {
    content: "\f117";
}

.x-form-time-trigger::before {
    content: "\f117";
}

.x-form-date-trigger::before {
    content: "\f105";
}

.x-form-ellipsis-trigger::before {
    content: "\f177";
}

.x-form-search-trigger::before {
    content: "\f13d";
}

.x-form-clear-trigger::before {
    content: "\f140";
    font-size: 17px !important;
}

.layout-small-desktop .x-form-clear-trigger::before {
    font-size: 14px !important;
}



/* ============================== Field Indicator ============================== */

.field .field-indicator-ct,
.field .field-error-ct-side {
    padding-left: 4px;
    padding-top: 6px;
    vertical-align: top;
    display: table-cell;
}

.layout-small-desktop .field .field-indicator-ct,
.layout-small-desktop .field .field-error-ct-side {
    padding-top: 4px;
}

body.mobile .field .field-indicator-ct,
body.mobile .field .field-error-ct-side {
    width: 32px;
    padding-top: 10px;
}

body.mobile .field .field-label.field-label-top::after {
    display: none;
}

.field .field-indicator {
    background-image: none !important;
    display: flex;
    align-items: center;
    height: 100%;
    padding: 0;
    position: relative;
    top: initial;
    left: initial;
}

.field .field-indicator-icon {
    width: 18px;
    height: 18px;
}

.field .field-indicator-text {
}

.field .field-indicator::before {
    font-family: "pat-icons" !important;
    display: inline-block !important;
    line-height: 1 !important;
    text-decoration: none !important;
    text-transform: none !important;
    text-rendering: auto !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    speak: none;
    font-size: 18px;
}

.field .indicator-info::before {
    content: "\f146";
    font-weight: bold !important;
    color: #055DEB;
}

.field .indicator-success::before {
    content: "\f144";
    font-weight: bold !important;
    color: #109006;
}

.field .indicator-warning::before {
    content: "\f145";
    font-weight: bold !important;
    color: #FAB450;
}

.field .indicator-error::before {
    content: "\f110";
    font-weight: bold !important;
    color: #EF5350;
}


/* ============================== Field (Foot)Note ============================== */

.field-note {
    display: block;
    font-size: 12px;
    color: #777;
    margin-top: 2px;
    line-height: normal;
}



/* ============================== Field Errors ============================== */

.field-error-ct-under {
    height: auto;
    line-height: normal;
}

    .field-error-ct-under .field-error-text {
        padding-top: 2px; /* Workaround - Using padding because margin doesn't work here, don't know why... */
    }

        .field-error-ct-under .field-error-text::before {
            /* zero-width white space, just to have a content that occupies a single text line height */
            content: "\200b";
            display: inline-block;
        }

    .field-error-ct-under .x-list-plain {
        display: inline-block;
    }

.field-error-text {
    font-size: 12px;
    color: #EF5350;
}

.with-msg-target-under {
}

.with-msg-target-reserved {
}

.with-msg-target-reserved-under {
    margin-bottom: 8px;
}


/* ============================== Mandatory Field ============================== */
.field.is-mandatory .field-label .field-label-inner {
    position: relative;
    padding-right: 10px;
}

.field.is-mandatory .field-label span::after {
    content: '*';
    padding-left: 4px;
}

.field.is-mandatory .field-label:not(.field-label-top) span::after {
    font-size: 14px;
    position: absolute;
    top: 0;
    right: 0;
}


/* ============================== Readonly Field ============================== */
.field.is-readonly,
.field.is-readonly .field-content-wrapper,
.field.display-field {
    color: #999;
}

    .field.is-readonly .field-content-wrapper,
    .field.is-readonly:hover .field-content-wrapper,
    .field.is-readonly.is-over .field-content-wrapper,
    .field.is-readonly:focus .field-content-wrapper,
    .field.is-readonly.is-focused .field-content-wrapper {
        border-color: #E0E0E0;
    }


/* ============================== Disabled Field ============================== */
.field.is-disabled {
    opacity: 1;
}

    .field.is-disabled,
    .field.is-disabled .field-content-wrapper {
        color: #999;
    }

        .field.is-disabled .field-content-wrapper,
        .field.is-disabled:hover .field-content-wrapper,
        .field.is-disabled.is-over .field-content-wrapper,
        .field.is-disabled:focus .field-content-wrapper,
        .field.is-disabled.is-focused .field-content-wrapper {
            border-color: #E0E0E0;
        }


/* ============================== Invalid Field ============================== */

.field.is-invalid .field-label,
.field.is-mandatory.is-invalid .field-label:not(.field-label-top) span::after {
    color: #EF5350;
}

.field.is-invalid .field-content-wrapper {
    border-color: #EF5350;
}

.field .field-error-icon {
    color: #EF5350;
}

    .field .field-error-icon .x-list-plain {
        display: none;
    }


/* ============================== Composite Field (Field Container based complex controls) ============================== */

.composite-field {
}

    .composite-field .field {
        margin: 0;
    }

    .composite-field .field-content-wrapper {
        overflow: hidden;
        position: relative;
    }

        /*.composite-field .field-input-wrapper {
			min-height: 28px;
			padding: 4px 10px;
		}*/

        .composite-field .field-content-wrapper.is-unstyled {
            border: 0px none;
            background-color: transparent;
        }

    .composite-field .field-input-wrapper.is-unstyled {
        padding: 0;
    }


    .composite-field .webix_control.borderless .webix_el_box > input,
    .composite-field .webix_control.borderless div.webix_inp_static {
        border: none;
        height: inherit;
        padding: 0;
        margin: 0;
    }


/* ============================== Text Field ============================== */
.text-field {
}

/* ============================== TextArea Field ============================== */
.textarea-field {
}

    .textarea-field .x-form-text {
        /*height: auto;*/
    }

.field .textarea-right-button {
    display: block;
}

.field.textarea-expanded textarea {
}


/* ============================== Picker Panel Styles (common picker components styles) ============================== */
.picker-panel {
    border: 0px none;
    border-top: 2px solid #CCC;
    border-radius: 0 0 4px 4px;
    background-color: #FFF;
    box-shadow: 0 6px 15px 0 rgba(34, 34, 34, 0.4);
}


/* ============================== Picker List (Combo-like Fields) Styles ============================== */
.picker-list {
}

    .picker-list:not(.x-boundlist-above) {
        /*border-top: 0px none;*/
        /*border-radius: 0 0 4px 4px;*/
        /*box-shadow: 0 6px 15px 0 rgba(34, 34, 34, 0.4);*/
    }

    .picker-list.x-boundlist-above {
        /*border-bottom: 0px none;*/
        /*border-radius: 4px 4px 0 0;*/
        /*box-shadow: 0 0px 15px 0 rgba(34, 34, 34, 0.4);*/
    }

.picker-list-item,
li.picker-list-item {
    padding: 6px 10px;
    border: 0px none;
    transition-property: background-color, color;
    transition-duration: 0.2s;
    margin-top: 0;
}

    .picker-list-item.is-over,
    .picker-list-item.is-selected {
        background-color: rgba(170, 170, 170, .6);
    }

/*.field .is-open:not(.is-open-above) .field-content-wrapper {
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;

	border-color: #777;
	
	border-bottom-color: #CCC;
}

.field .is-open-above .field-content-wrapper {
	border-top-left-radius: 0;
	border-top-right-radius: 0;

	border-color: #777;
	
	border-top-color: #CCC;

	box-shadow: 0 6px 15px 0 rgba(34, 34, 34, 0.4);
}*/


/* 
	bugfix: safari bad support translate3d which is used by ext:combobox mobile to handle scroll  
	hiding the elements of the list. Forcing it by css seems to resolve the problem somehow
*/
body.mobile.x-body.x-safari .x-boundlist .x-boundlist-list-ct {
    transform: translate3d(0px, 0px, 0px);
}


/* ============================== Combo Field ============================== */
.combo-field {
}

/* ============================== MultiCombo Field ============================== */
.multicombo-field {
}

.x-mcombo-item-unchecked,
.x-mcombo-item-checked {
    background-image: none;
    padding-left: 0px;
}

    .x-mcombo-item-unchecked .x-mcombo-text:before,
    .x-mcombo-item-checked .x-mcombo-text:before {
        font-family: "pat-icons" !important;
        line-height: 1 !important;
        font-weight: normal !important;
        font-style: normal !important;
        text-decoration: none !important;
        text-transform: none !important;
        text-rendering: auto !important;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        speak: none;
    }

    .x-mcombo-item-unchecked .x-mcombo-text:before,
    .x-mcombo-item-checked .x-mcombo-text:before {
        font-size: 16px;
        padding-right: 6px;
    }

    .x-mcombo-item-unchecked .x-mcombo-text:before {
        content: "\f131";
    }

    .x-mcombo-item-checked .x-mcombo-text:before {
        content: "\f132";
    }


/* ============================== Date Field ============================== */
.date-field {
}

    .date-field .field-body {
        min-width: 120px;
    }

/* Date Picker */
.date-picker {
    width: 288px;
}

    .date-picker .x-datepicker-header,
    .date-picker table,
    .date-picker .x-datepicker-footer,
    .month-picker .x-monthpicker-buttons {
        padding: 12px 16px;
    }

    .date-picker .x-datepicker-footer,
    .month-picker .x-monthpicker-buttons {
        border-top-color: #E0E0E0;
    }

    .date-picker .x-datepicker-header {
        display: flex;
        align-items: center;
    }

        .date-picker .x-datepicker-header .x-btn {
            font-weight: 600;
        }

        .date-picker .x-datepicker-header .x-datepicker-arrow {
            position: relative;
            top: auto;
            left: auto;
            right: auto;
        }

        .date-picker .x-datepicker-header .x-datepicker-month {
            flex: 1;
        }

    .date-picker .x-datepicker-arrow {
        background-image: none;
    }

        .date-picker .x-datepicker-arrow::before {
            font-family: 'pat-icons';
            font-size: 14px;
        }

    .date-picker .x-datepicker-prev::before {
        content: "\f118";
    }

    .date-picker .x-datepicker-next::before {
        content: "\f119";
    }


    .date-picker table {
        border-spacing: 4px;
    }

    .date-picker .x-datepicker-column-header {
        color: #999;
        text-align: center;
        width: 32px;
        border-bottom-color: #E0E0E0;
    }

.date-picker-cell {
    height: 32px;
    width: 32px;
    text-align: center;
    border: 0px none;
    transition-property: color, background-color;
    transition-duration: 0.2s;
    border: 1px solid transparent;
}

    .date-picker-cell:hover,
    .date-picker .x-monthpicker-item-inner:hover {
        background-color: rgba(170, 170, 170, .6);
    }

    .date-picker-cell.is-prevday,
    .date-picker-cell.is-nextday {
        color: #CCC;
    }

    .date-picker-cell.is-today {
        border-color: #777;
    }

    .date-picker-cell.is-selected,
    .month-picker .x-monthpicker-item-inner.is-selected {
        background-color: #999;
        font-weight: 600;
    }

    .date-picker-cell .x-datepicker-date {
        padding: 0;
    }

.date-picker .x-datepicker-footer {
    margin: 0 16px;
    border-top-color: #E0E0E0;
}

    .date-picker .x-datepicker-footer .btn {
        min-width: 80px;
    }


/* Month Picker */
.month-picker {
    padding: 10px 12px;
}

    .month-picker .x-monthpicker-months,
    .month-picker .x-monthpicker-years {
        width: 48%;
    }

    .month-picker .x-monthpicker-months {
        margin-right: 10px;
        padding-right: 10px;
        border-right: 1px solid #E0E0E0;
    }

        .month-picker .x-monthpicker-months .x-monthpicker-item,
        .month-picker .x-monthpicker-years .x-monthpicker-item,
        .month-picker .x-monthpicker-yearnav-button-ct {
            width: 54px;
        }

    .month-picker .x-monthpicker-item-inner {
        border: 0px none;
        padding: 4px;
    }

    .month-picker .x-monthpicker-buttons {
        padding-bottom: 0;
        background-color: #FFF;
    }

        .month-picker .x-monthpicker-buttons .btn {
            margin: 0;
            min-width: 80px
        }

            .month-picker .x-monthpicker-buttons .btn + .btn {
                margin-left: 12px;
            }

    .month-picker .x-monthpicker-yearnav-button {
        background-image: none;
    }

        .month-picker .x-monthpicker-yearnav-button::before {
            font-family: 'pat-icons';
            font-size: 14px;
        }

    .month-picker .x-monthpicker-yearnav-prev::before {
        content: "\f118";
    }

    .month-picker .x-monthpicker-yearnav-next::before {
        content: "\f119";
    }



/* ============================== Time Field ============================== */
.time-field {
}

    .time-field .field-body {
        min-width: 100px;
    }



/* ============================== DateTime Field ============================== */
.datetime-field {
}

    .datetime-field.field .field-content-wrapper {
        padding: 0;
    }

    .datetime-field .date-field {
    }

        .datetime-field .date-field .field-content-wrapper {
            border: 0px none;
            border-radius: 0;
        }

        .datetime-field .date-field .side-button:last-child {
            border-right: 1px solid #CCC;
        }


    .datetime-field .time-field {
    }

        .datetime-field .time-field .field-content-wrapper {
            border: 0px none;
            border-radius: 0;
        }


/* ============================== Number Field ============================== */

/* Number Field Common Styles (NumberField, DurationField, ... all NumberField derived controls) */
.number-field-base .x-form-trigger-wrap .x-form-trigger {
    min-width: 20px;
    width: 28px;
    flex-direction: column;
    padding: 0;
}

.layout-small-desktop .number-field-base .x-form-trigger-wrap .x-form-trigger {
    width: 24px;
}

/*.number-field-base .x-form-trigger {
	background-image: none;
}*/

/*    .number-field-base .x-form-trigger:hover {
		background-color: transparent;
	}*/

.number-field-base .x-form-spinner {
    /*height: 50%;*/
    height: 14px; /* Workaround to fix FireFox height issue */
    width: 100%;
    background-image: none;
    /*background-color: transparent;*/
    font-family: 'pat-font';
    text-align: center;
    font-size: 14px;
}

.layout-small-desktop .number-field-base .x-form-spinner {
    font-size: 12px;
    height: 12px;
}

.x-form-spinner-default {
    background-color: #F0F0F0;
}

.x-form-spinner:hover,
.x-form-spinner.x-form-spinner-over {
    background-color: #E0E0E0;
}

/*    .number-field-base .x-form-spinner:hover,
	.number-field-base .x-form-spinner.x-form-spinner-over {
		background-color: #E0E0E0;
	}*/

/*    .number-field-base .x-form-spinner.x-form-spinner-click {
		background-color: #CCC;
	}*/

.number-field-base .x-form-spinner-up::before {
    content: '\e04a';
}

.number-field-base .x-form-spinner-down::before {
    content: '\e049'
}

/* Number Field Styles */
.number-field {
}


/* ============================== Flag Combobox Field ============================== */
.flagcombo-field {
}


/* ============================== Checkbox Field / Radio Field (Common styles) ============================== */
.choice-field-base:not(.is-readonly) label {
    cursor: pointer;
}

.choice-field-base .field-body {
    vertical-align: middle;
}

.choice-field-base .x-form-cb-wrap-inner {
    display: flex;
    align-items: center;
    margin-top: 2px;
}

.choice-field-base .x-form-cb {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    margin: 0;
}

.choice-field-base .choice-label-after {
}

.choice-field-base .choice-label-before {
    padding-right: 6px;
}

.choice-field-base:not(.is-readonly) .choice-label,
.choice-field-base:not(.is-readonly) input {
    cursor: pointer;
}

.choice-field-base .x-form-cb-wrap-inner input {
    /* display: none; */ /* Must be displayed otherwise ignored while moving between controls with tab key */
    height: 0;
    width: 0;
    opacity: 0;
}

/* Workaround to keep label el always visible and attach the font icon */
.choice-field-base .x-form-cb-wrap-inner-no-box-label > .x-form-cb-label {
    display: inline-block;
}

.choice-field-base .x-form-cb-wrap-inner label::before {
    font-family: "pat-icons" !important;
    line-height: 1 !important;
    font-weight: normal !important;
    font-style: normal !important;
    text-decoration: none !important;
    text-transform: none !important;
    text-rendering: auto !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    speak: none;
}

.choice-field-base .x-form-cb-wrap-inner label::before {
    font-size: 16px;
    vertical-align: text-top;
    display: inline-block;
    padding-right: 4px;
}


/* ============================== Checkbox Field ============================== */
.checkbox-field {
}

    .checkbox-field .x-form-cb-wrap-inner label::before {
        content: "\f131";
    }

    .checkbox-field.is-checked .x-form-cb-wrap-inner label::before {
        content: "\f132";
    }


/* ============================== Radio Field ============================== */
.radio-field {
}

    .radio-field .x-form-cb-wrap-inner label::before {
        content: "\f133";
    }

    .radio-field.is-checked .x-form-cb-wrap-inner label::before {
        content: "\f134";
    }


/* ============================== Checkbox Group / Radio Group ============================== */
.checkbox-group-field .field-content-wrapper,
.radio-group-field .field-content-wrapper {
    border: 0px none;
}

.checkbox-group-field .x-form-cb-wrap-inner,
.radio-group-field .x-form-cb-wrap-inner {
    margin-top: 6px;
}

/* ============================== ObjectLink Field ============================== */
.objectlink-field {
}

    .objectlink-field .x-trigger-cell .x-form-trigger {
        opacity: 1;
    }

    .objectlink-field.hyperLink input {
        text-decoration: underline;
        cursor: pointer;
    }

.objectlink_object-not-found .field-content-wrapper {
    color: #EF5350;
}

.objectlink_object-not-visible .field-content-wrapper {
    color: #999;
}

.objectlink_object-not-available .field-content-wrapper {
    color: #FAB450;
}

.loadingObjectLink .field-content-wrapper {
    color: #999;
}


/* ============================== ObjectLink Multi Field ============================== */
.objectlink-multi-field {
}

    .objectlink-multi-field input {
        cursor: pointer;
        text-overflow: ellipsis;
    }

    .objectlink-multi-field .x-btn .x-btn-icon-el,
    .obj-link-multi-selection .btn .x-btn-icon-el:before,
    .obj-link-multi-selection .col-commands .x-btn-icon-el:before {
        font-size: 16px;
    }

    .objectlink-multi-field.is-readonly.is-empty input {
        cursor: default;
    }


/* ============================== ObjectLink Extended Field ============================== */
.objectlink-extended-field {
}

    .objectlink-extended-field .composite-field-content.field-input-wrapper {
        padding: 0;
    }

    .objectlink-extended-field.preview-expanded {
    }


    .objectlink-extended-field.preview-collapsed {
    }

    .objectlink-extended-field .objectlink-field .field-content-wrapper {
        border: 0px none;
    }

    .objectlink-extended-field .preview-ct {
        border-top: 1px solid #CCC;
        padding: 10px 6px;
    }

    .objectlink-extended-field.is-readonly .preview-ct {
        border-color: #E0E0E0;
    }


    /* ObjectLink Extended - Preview Placeholders */
    .objectlink-extended-field .content-placeholder {
        max-width: 360px;
        margin: 0 auto;
    }

.content-placeholder.obj-link-extended-empty {
    background-image: url(../Img/base/placeholder-notext.png);
}

/* ObjectLink Extended  - Default Preview Tpl */
.objectlink-extended-field .preview-tpl .preview-item {
    display: inline-block;
    min-width: 80px;
    min-height: 68px;
    margin: 0 8px 0 0;
    padding: 16px 0 0 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.objectlink-extended-field .preview-tpl .image-item {
    min-width: 68px;
    width: 68px;
    height: 68px;
    background-position: center;
    background-repeat: no-repeat;
    background-color: #CCC;
}

body.mobile .objectlink-extended-field .preview-tpl .image-item {
    background-image: url(../Images/asset-placeholder.png);
}

.objectlink-extended-field .preview-tpl .preview-item label {
    display: block;
    text-transform: uppercase;
    font-size: 12px;
    color: #666;
}

.objectlink-extended-field.preview-expanded .btn-expand:before {
    content: "\f116";
}


.objectlink-extended-field.preview-collapsed .btn-expand:before {
    content: "\f117";
}


/* ============================== SQLLink Field ============================== */
.sqllink-field {
}


/* ============================== Static ObjectLink Field ============================== */
.static-objectlink-field {
}


/* ============================== Static ObjectLink Multi Field ============================== */
.static-objectlink-multi-field {
}


/* ============================== Tree Field ============================== */
.tree-field {
}

.treefield-tree {
    /*border: 0px none;
	border-top: 2px solid #DDD;
	border-radius: 0 0 4px 4px;
	background-color: #FFF;
	box-shadow: 0 6px 15px 0 rgba(34, 34, 34, 0.4);*/
    padding: 8px;
}

    .treefield-tree .toolbar {
        box-shadow: 0 1px 0 0 #ccc;
        margin: 0 0 12px 0;
        padding: 0 0 8px 0;
    }



/* ============================== Html Field ============================== */
.html-field {
}

    .html-field .mce-panel {
        border-color: transparent;
    }

    .html-field .mce-tinymce .mce-btn-group,
    .html-field .mce-tinymce .mce-toolbar-grp.mce-panel {
        border-color: #F0F0F0;
    }

    .html-field .mce-content-body {
        background-color: transparent;
    }

    .html-field.is-readonly .mce-toolbar-grp {
        display: none;
    }

    .html-field .mce-btn {
        border-radius: 4px;
    }

        .html-field .mce-btn:hover,
        .html-field .mce-btn:focus,
        .html-field .mce-btn.mce-active,
        .html-field .mce-btn.mce-active:hover {
            background-color: #F0F0F0;
            border-color: #CCC;
        }


body .mce-floatpanel.mce-popover {
    box-shadow: 0 6px 15px 0 rgba(34, 34, 34, 0.4);
    border: 0px none;
    border-top: 2px solid #CCC;
}

    body .mce-floatpanel.mce-popover .mce-arrow {
        display: none;
    }

    body .mce-floatpanel.mce-popover.mce-bottom {
        margin-top: 2px;
    }

.field .side-button.html-field-right-button {
    background-color: transparent;
}

.html-field .mce-panel.mce-fullscreen {
    background-color: rgba(0,0,0,0.2);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
}

    .html-field .mce-panel.mce-fullscreen > .mce-container-body {
        margin: 36px;
        margin: max(2%, 36px);
        background-color: #FFF;
        box-shadow: 0 6px 15px 0 rgba(34, 34, 34, 0.4);
        border-radius: 6px;
        overflow: hidden;
        padding: 12px;
    }

.html-field .html-field-fullscreen-button {
    position: absolute;
    top: 10px;
    right: 10px;
}

.html-field .mce-panel.mce-fullscreen .html-field-fullscreen-button {
    top: 58px;
    right: 58px;
}

.html-field .html-field-speechrecon-button {
    position: absolute;
    top: 10px;
    right: 10px;
}

.html-field .mce-panel.mce-fullscreen .html-field-speechrecon-button {
    top: 58px;
    right: 58px;
}


/* ============================== Attachment Field ============================== */
.attachment-field {
}

    .attachment-field .progress-bar {
        position: absolute;
        top: 0;
        left: 0;
        height: 4px;
        width: 100%;
    }

    .attachment-field .progress {
        background-color: #999;
        width: 0%;
        height: 100%;
    }

    .attachment-field.has-value input {
        text-decoration: underline;
        cursor: pointer;
    }


/* ============================== Tag Field ============================== */
.field.x-tagcombo .x-form-text-wrap {
    display: block;
    padding: 4px 10px;
}

.field.x-tagcombo .x-taglabel-item,
.field.x-tagcombo .x-taglabel-item.x-taglabel-closable {
    padding: 2px 6px;
}

.field.x-tagcombo .x-taglabel-closable .x-taglabel-item-text {
    padding-right: 6px;
}

.field.x-tagcombo .x-taglabel-item {
    border: 0px none;
    margin: 0;
    display: flex;
    align-items: center;
}

.field.x-tagcombo .x-taglabel-item,
.field.x-tagcombo.is-readonly .x-taglabel-item {
    background-color: #F0F0F0;
}

.field.x-tagcombo .x-taglabel-list {
    display: flex;
    flex-wrap: wrap;
    grid-gap: 4px 8px;
}

.field.x-tagcombo .x-taglabel-item .x-taglabel-close-btn {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 12px;
    height: 12px;
    background-image: none;
}

    .field.x-tagcombo .x-taglabel-item .x-taglabel-close-btn::after {
        content: '\4b';
        font-family: 'pat-font';
        font-size: 12px;
        line-height: normal;
        text-align: center;
    }

@media all and (-ms-high-contrast:none) {

    /* Tag Field IE11-Specific CSS Hacks - Using display:block + margins instead of display:flex + gap to manage tag items disposition. */

    .field.x-tagcombo .x-taglabel-list {
        display: block;
    }

    .field.x-tagcombo .x-taglabel-item,
    .field.x-tagcombo .x-taglabel-item.x-taglabel-closable {
        margin-bottom: 4px;
        margin-right: 8px;
    }
}



/* ============================== Tag Label Field ============================== */

.tag-field-base .field-input-wrapper {
    padding: 0;
}

.tag-field-base .webix_view .webix_list_item {
}

.tag-field-base .webix_el_box {
    display: flex;
    align-items: center;
    padding: 0px;
}

.tag-field-base .webix_multicombo .webix_el_box .webix_inp_static {
    border: 0px none;
}

.list .tag-field-base .webix_multicombo .webix_el_box {
    padding-right: 10px;
}

.tag-field-base .webix_multicombo_text {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.tag-field-base .webix_el_box.webix_focused .webix_inp_static {
    border-color: #C0C0C0;
}



.tag-field-base .webix_el_text .webix_multicombo_input {
    margin: 1px 0 0 8px;
    background-color: transparent;
}

.tag-field-base .webix_multicombo_value,
.tag-field-base .webix_multicombo_tag,
.tag-field-base .webix_multicombo_value.webix_readonly {
    background-color: #F0F0F0;
    margin: 2px 0 0 6px;
    padding: 2px 6px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    line-height: 16px !important; /* to override webix inline style */
}

.layout-small-desktop .tag-field-base .webix_multicombo_value,
.layout-small-desktop .tag-field-base .webix_multicombo_tag,
.layout-small-desktop .tag-field-base .webix_multicombo_value.webix_readonly {
    margin: 2px 0 0 6px;
    padding: 0 4px;
}

.tag-field-base .webix_multicombo_delete {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    margin: 0 0 0 6px;
}

    .tag-field-base .webix_multicombo_delete::after {
        content: '\4b';
        font-family: 'pat-font';
        font-size: 12px;
    }

.tag-field-base .webix_el_box .webix_inp_static {
    border-radius: 0px;
    white-space: nowrap;
}

.tag-field-base .webix_multicombo .webix_inp_static {
    padding: 0px;
}

.tag-field-base.is-readonly .webix_inp_static {
    border-top: 0;
    border-bottom: 0;
    border-right: 0;
}

/*.tag-field-list.picker-list {
	border-top: 2px solid #CCC;
}*/






/* ============================== Hyperlink Field ============================== */
.hyperlink-field {
}


/* ============================== Color Picker Field ============================== */
.colorpicker-field {
}

    .colorpicker-field.picker-enabled input {
        opacity: 0;
        cursor: pointer;
    }


        .colorpicker-field.picker-enabled input:disabled {
            cursor: auto;
        }

    .colorpicker-field.picker-enabled .placeholder {
        position: absolute;
        height: calc(100% - 8px);
        width: calc(100% - 40px);
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
    }

    .colorpicker-field.picker-enabled.is-readonly .placeholder {
        width: calc(100% - 20px);
    }


/* ============================== Display Field ============================== */
.display-field {
}

    .display-field .x-form-display-field-default {
        margin-top: 6px;
    }


/* ============================== Button Field ============================== */
.button-field {
}



/* ============================== Image Field ============================== */
.image-field {
}

    .image-field .media-image.x-component {
        position: relative;
        border: 1px solid transparent;
        border-radius: 4px;
        padding: 4px;
    }

    .image-field img {
        height: auto;
        width: auto;
    }

    .image-field:not(.is-readonly) .media-image {
        cursor: pointer;
    }

        .image-field:not(.is-readonly) .media-image:hover {
            border-color: #CCC;
        }

body.mobile .image-field:not(.is-readonly) .media-image {
    border-color: #CCC;
}


/* ============================== Duration Field ============================== */
.duration-field {
}

    .duration-field .field-content-wrapper {
        /*max-width: 100px;*/
    }

body.mobile .duration-field .side-button.x-form-trigger-spinner {
    display: flex;
    flex-direction: column-reverse;
}


/* ============================== Composite Duration Field ============================== */
.composite-duration-field {
}

    .composite-duration-field .major-duration-field,
    .composite-duration-field .minor-duration-field {
        /*max-width: 100px;*/
    }


/* ============================== Composite Duration Field ============================== */
/* => /Helpers/CustomControls/SignatureField/SignatureField.css */


/* ============================== File Upload Field ============================== */
/* => /Helpers/CustomControls/FileUploadFieldDD/FileUploadFieldDD.css */


/* ============================== CodeScript Field ============================== */
.codescript-field {
}


/* ============================== Captcha Field ============================== */
.captcha-field {
}

    .captcha-field .field .field-content-wrapper {
        border-width: 1px;
    }

    .captcha-field .captcha-input {
        margin-top: 8px;
    }

        .captcha-field .captcha-input .field-body {
            min-width: 150px;
        }


/* ============================== Geography Field ============================== */
.geography-field {
}

    .geography-field .geography-wrapper {
        height: 100%;
        width: 100%;
        display: flex;
        flex-direction: column;
        position: relative;
    }


    /* geography-field geography-search-wrapper */

    .geography-field .geography-search-wrapper {
        flex-direction: row;
        align-items: center;
        text-align: right;
        padding-bottom: 6px;
    }

    .geography-field .geography-search-wrapper,
    .geography-field.is-readonly .geography-search-wrapper {
        display: none;
    }

    .geography-field.is-search-mode:not(.is-readonly) .geography-search-wrapper {
        display: flex;
    }

    .geography-field .geography-search-wrapper > * + * {
        margin-left: 6px;
    }

    .geography-field .geography-search-wrapper input {
        width: 100%;
        padding: 4px 10px;
    }

    .geography-field .geography-search-wrapper .geography-tool {
        width: 30px;
        height: 100%;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
    }


    /* geography-field map-buttons-wrapper */

    .geography-field .map-buttons-wrapper {
        position: absolute;
        display: flex;
        z-index: 100;
        flex-direction: column;
        top: 7px;
        right: 7px;
        background-color: rgba(255,255,255,.4);
        padding: 2px;
        border-radius: 3px;
        font-size: 22px;
    }

    .geography-field.is-search-mode .map-buttons-wrapper {
        display: none;
    }

    .geography-field .map-buttons-wrapper .geography-tool {
        color: #FFF;
        background-color: rgba(0,60,136,.5);
        padding: 0px;
        font-size: 12px;
        height: 22px;
        width: 22px;
        margin: 1px;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
    }

        .geography-field .map-buttons-wrapper .geography-tool + .geography-tool {
            margin-top: 0;
        }

        .geography-field .map-buttons-wrapper .geography-tool:first-child {
            border-radius: 2px 2px 0 0;
        }

        .geography-field .map-buttons-wrapper .geography-tool:last-child {
            border-radius: 0 0 2px 2px;
        }

        .geography-field .map-buttons-wrapper .geography-tool:hover {
            background-color: rgba(0,60,136,.7);
        }

        .geography-field .map-buttons-wrapper .geography-tool.clear-btn,
        .geography-field .map-buttons-wrapper .geography-tool.search-btn {
            display: flex;
        }

        .geography-field .map-buttons-wrapper .geography-tool.expand-btn {
            display: none;
        }

    .geography-field.is-readonly .map-buttons-wrapper .geography-tool.clear-btn,
    .geography-field.is-readonly .map-buttons-wrapper .geography-tool.search-btn {
        display: none;
    }

    .geography-field.is-readonly .map-buttons-wrapper .geography-tool.expand-btn {
        display: flex;
    }



    /* geography-field map */

    .geography-field .map {
        overflow: hidden;
        min-height: 200px;
        height: 100%;
    }

.ol-attribution {
    font-size: 12px;
    padding: 0px;
}

    .ol-attribution a {
        color: black;
        font-weight: bold;
        text-decoration: none;
    }



/* geography-field info-coordinates */

.geography-field .info-coordinates {
    padding: 6px 12px;
    font-size: 11px;
    position: absolute;
    border-radius: 6px;
    background-color: rgba(255,255,255,.8);
    border: 1px solid #CCC;
    width: max-content;
    bottom: 30px;
    left: 15px;
    box-shadow: 0 6px 15px 0 rgba(34, 34, 34, 0.4);
}



/* geography-field info-address */

.geography-field .info-address {
    font-size: 12px;
    padding-top: 6px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}



/* geography-field - map popup */

.map-popup-module .map-note-label {
    margin-bottom: 12px;
}

.map-popup-module .geography-field {
    margin-bottom: 0;
}

    .map-popup-module .geography-field.is-readonly .geography-tool.expand-btn {
        display: none;
    }



/* geography-field - unsupported map placeholder */
.geography-field .map-placeholder .map-text {
    font-style: italic;
    background-color: #F0F0F0;
    padding: 20px;
    text-align: center;
    font-size: 12px;
}

.geography-field .map-placeholder .map-value {
    font-size: 12px;
    margin-top: 6px;
}



/* ============================== Filler Field ============================== */

.filler-field {
    visibility: hidden !important;
    margin: 0px !important;
    padding: 0px !important;
}



/* ============================== Mobile Datetime Picker ============================== */

.mobile-datetime-picker .mobile-date-picker .x-form-trigger-wrap-default {
    border-right: 0px none;
}

.mobile-datetime-picker .mobile-date-picker .x-form-text-field-body-default,
.mobile-datetime-picker .mobile-time-picker .x-form-text-field-body-default {
    min-width: unset;
    max-width: unset;
}

.mobile-datetime-field {
}

    .mobile-datetime-field .field-content-wrapper {
        padding: 0;
    }

    .mobile-datetime-field .mobile-date-field {
    }

        .mobile-datetime-field .mobile-date-field .field-content-wrapper {
            border: 0px none;
            border-radius: 0;
        }

        .mobile-datetime-field .mobile-date-field .side-button:last-child {
            border-right: 1px solid #CCC;
        }


    .mobile-datetime-field .mobile-time-field {
    }

        .mobile-datetime-field .mobile-time-field .field-content-wrapper {
            border: 0px none;
            border-radius: 0;
        }


/* ============================== SmartText Control ============================== */

.smart-text .smart-text-editor {
    height: 100%;
    white-space: -moz-pre-wrap !important; /* Mozilla */
    white-space: -pre-wrap; /* Opera 4-6 */
    white-space: -o-pre-wrap; /* Opera 7 */
    white-space: pre-wrap; /* css-3 */
    word-wrap: break-word; /* Internet Explorer 5.5+ */
    white-space: -webkit-pre-wrap; /* Newer versions of Chrome/Safari*/
    word-break: break-word;
    white-space: break-spaces;
    padding-top: 3px;
    padding-bottom: 1px;
}

    .smart-text .smart-text-editor .smart-text-keyword {
        background-color: #055DEB;
        border-radius: 2px;
        padding: 0px 2px 0px 2px;
        color: #EEE;
    }

    .smart-text .smart-text-editor div {
        width: fit-content;
    }






/* ============================== TOOLTIPS ============================== */

/* ============================== Tooltip common styles ============================== */
.x-tip,
.x-tip-default,
.x-tip-form-invalid,
body .mce-tooltip-inner,
body .tooltip,
body .webix_tooltip {
    background-color: #222;
    color: #FFF;
    box-shadow: 0 6px 15px 0 rgba(34, 34, 34, 0.4);
    font-size: 12px;
    font-weight: normal;
    padding: 6px 12px;
    border: 0px none;
    border-radius: 4px;
}

    .x-tip .x-autocontainer-innerCt,
    .x-tip-default .x-autocontainer-innerCt,
    .x-tip-form-invalid .x-autocontainer-innerCt {
        display: -webkit-box;
        -webkit-line-clamp: 5;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

.x-tip-header-default {
    padding-left: 12px;
}

.x-tip-anchor {
    border-color: #222;
}

.x-tip-anchor-top {
    border-top-color: transparent;
    border-left-color: transparent;
    border-right-color: transparent;
}

.x-tip-anchor-bottom {
    border-bottom-color: transparent;
    border-left-color: transparent;
    border-right-color: transparent;
}

.x-tip-anchor-left {
    border-top-color: transparent;
    border-bottom-color: transparent;
    border-left-color: transparent;
}

.x-tip-anchor-right {
    border-top-color: transparent;
    border-bottom-color: transparent;
    border-right-color: transparent;
}



body .mce-tooltip {
    opacity: 1;
}

body .mce-tooltip-arrow {
    border-color: #222;
}



/* ============================== Generic tooltip ============================== */

.x-tip,
.x-tip-default {
}



/* ============================== Error tooltip ============================== */
.x-tip-form-invalid {
}


/* ============================== Field tooltip (field value, filter value) ============================== */
.field-tooltip {
    /* we want to preserve whitespaces and line breaks on tooltips*/
    white-space: pre-wrap;
}


/* ============================== Special tooltips ============================== */
.x-tip-default .category {
    font-size: 14px;
    padding: 0 5px 5px 5px;
}

.x-tip-default .series {
    color: gray;
    padding: 5px;
}

    .x-tip-default .series.selected {
        background-color: #faf6c7;
        color: black;
    }




/* ============================== SPLITTER ============================== */

.x-splitter-vertical,
.x-splitter-horizontal {
    background-image: none;
    width: 4px;
    background-color: #F0F0F0;
}

.module .x-splitter-vertical {
    border-top: 0px none;
}

.x-layout-collapsed {
    background-color: transparent;
}

.x-layout-split-top, .x-splitter-collapsed .x-layout-split-bottom {
    background-image: url(../Img/base/splitter-top.png);
}

.x-layout-split-bottom, .x-splitter-collapsed .x-layout-split-top {
    background-image: url(../Img/base/splitter-bottom.png);
}


.x-layout-split-left, .x-splitter-collapsed .x-layout-split-right {
    background-image: url(../Img/base/splitter-left.png);
}

.x-layout-split-right, .x-splitter-collapsed .x-layout-split-left {
    background-image: url(../Img/base/splitter-right.png);
}



/* ============================== TAB BAR ============================== */
.tab-bar:not(.x-tab-bar),
.tab-bar .x-box-inner,
body .mce-tabs {
    border-bottom: 1px solid #CCC;
}

.tab-bar.x-vertical .x-box-inner {
    border-bottom: 0px none;
}

.tab-bar.x-vertical.x-right .x-box-inner {
}

.tab-bar.x-vertical.x-left .x-box-inner {
}

.tab-bar-no-border .tab-bar .x-box-inner {
    border: 0 none;
}

.tab-bar:not(.x-tab-bar) {
    display: flex;
}

.x-tab-tabmenu-right:hover,
.x-tab-tabmenu-left:hover,
.x-box-scroller:hover {
    background-color: rgba(240, 240, 240, 0.4);
}

.x-tab-tabmenu-right::before,
.x-tab-tabmenu-left::before,
.x-box-scroller-left::before,
.x-box-scroller-right::before {
    font-family: 'pat-font';
    font-size: 18px;
    vertical-align: middle;
    line-height: 40px;
}

.x-tab-tabmenu-right::before {
    content: 'A';
}

.x-box-scroller-left::before {
    content: '\e06a';
}

.x-box-scroller-right::before {
    content: '\e06b';
}

.x-box-scroller.x-box-scroller-disabled {
    opacity: 0.3;
}

/* ============================== TAB (COMMON STYLES) ============================== */
.tab,
body .mce-tabs .mce-tab {
    cursor: pointer;
    text-align: center;
    color: #777;
    display: inline-flex;
    align-items: center;
    vertical-align: bottom;
    max-width: 200px;
    padding: 10px 8px 6px 8px;
    margin: 0 8px 0 8px;
    text-transform: uppercase;
    transition-property: background-color, border-color, color;
    transition-duration: 0.2s;
}

.layout-small-desktop .tab {
    padding: 6px 4px 2px 4px;
    margin: 0 6px;
}

.tab,
.tab:hover,
.tab.is-over,
.tab.x-tab.is-over,
.tab:focus,
.tab.is-focused,
.tab.x-tab.is-focused,
.tab.is-selected,
.tab.x-tab.is-selected,
.tab.x-tab-focus,
body .mce-tabs .mce-tab {
    border-bottom-width: 4px;
    border-bottom: 4px solid transparent;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
}

body .mce-tabs .mce-tab {
    background-color: transparent;
    height: auto;
    text-shadow: none;
}

.tab:hover,
.tab.is-over,
.tab.x-tab.is-over,
.tab:focus,
.tab.is-focused,
.tab.x-tab.is-focused {
    border-bottom-color: #CCC;
}

.tab.is-selected,
.tab.x-tab.is-selected,
body .mce-tabs .mce-tab.mce-active {
    border-bottom-color: currentColor;
    color: inherit;
}

    .tab.is-selected .tab-label,
    .tab.x-tab.is-selected .x-tab-inner,
    body .mce-tabs .mce-tab.mce-active {
        font-weight: 600;
    }

.tab.is-disabled,
.tab.x-tab.is-disabled,
.tab.is-disabled.is-focused {
    border-color: transparent;
    box-shadow: none;
    color: #CCC;
}

.tab.x-tab.is-disabled {
    background-image: none;
    background-color: transparent;
    border-color: transparent;
}

.tab .x-tab-wrap {
    display: block;
    flex-grow: 1;
    min-width: 0;
}

.tab .x-tab-button,
.tab:not(.x-tab) {
    display: flex;
    align-items: center;
    justify-content: center;
}

.tab .x-tab-button {
    height: auto;
}



/* TAB > LABEL */

.tab .x-tab-inner,
.tab .tab-label {
    line-height: 26px;
}

.tab .x-tab-inner,
.tab .tab-label {
    flex-shrink: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 26px;
}


/* TAB > ICON */
.tab .x-tab-icon-el,
.tab .tab-icon {
    flex-shrink: 0;
    height: auto;
    width: auto;
}

.tab .tab-icon {
    margin-right: 6px;
}



/* TAB > BADGE */
.tab .badge {
    flex-shrink: 0;
    margin-left: 6px;
}


/* TAB > CLOSE BUTTON */
.tab .x-tab-close-btn {
    background-image: none;
    display: flex;
    align-items: center;
    justify-content: center;
    order: 0;
    position: relative;
    top: auto;
    right: auto;
    order: 2;
    margin-left: 6px;
}

    .tab .x-tab-close-btn::after {
        font-family: "pat-font";
        font-size: 14px;
        line-height: 1;
        content: "K";
        color: inherit;
        position: relative;
    }

.tab.is-over .x-tab-close-btn {
    opacity: 1;
}

.tab .x-tab-close-btn {
    flex-shrink: 0;
}

.tab.is-closable .x-tab-button {
    padding-right: 0;
    line-height: 16px;
}

/* Vertical Tab-Bar Tab */
.x-tab-bar-vertical .tab {
    border-bottom: 4px solid #DDD;
    border-left: 0 !important;
    border-right: 0 !important;
}

    .x-tab-bar-vertical .tab .x-tab-inner {
        font-weight: normal !important;
    }

    .x-tab-bar-vertical .tab .x-tab-icon-el {
        display: none;
    }



/* IE11 Hack - Tabs - Replace flexbox with table layout to avoid min-width issues when tabbar scrolls. */
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {

    .tab.x-tab {
        display: block;
    }

        .tab.x-tab .x-tab-wrap {
            display: table;
            height: 100%;
            width: 100%;
        }

        .tab.x-tab .x-tab-button {
            display: table-cell;
        }

    .tab.x-tab-closable .x-tab-button {
        padding-right: 14px;
    }

    .tab.x-tab-closable .x-tab-close-btn {
        position: absolute;
        top: 18px;
        right: 6px;
    }
}


/* ============================== MENU ============================== */
.menu {
    background-color: #FFF;
    box-shadow: 0 6px 15px 0 rgba(34, 34, 34, 0.4);
    border-top: 2px solid #CCC;
    border-radius: 0 0 4px 4px;
    color: #444;
}

    .menu .x-menu-icon-separator-default {
        display: none;
    }

.menu-item,
.menu-item.btn {
    padding: 10px 14px;
    border-radius: 0;
    justify-content: flex-start;
    transition-property: background-color, color;
    transition-duration: 0.2s;
}

    .menu-item.btn {
        display: block;
    }

.layout-small-desktop .menu-item,
.layout-small-desktop .menu-item.btn {
    padding: 8px 10px;
}

.menu-item .menu-item-link {
    position: relative;
    display: flex;
    align-items: center;
}

.menu-item .menu-item-text {
    margin: 0 0 0 6px;
    flex: 1;
    order: 1;
}

.menu-item .menu-item-icon {
    position: relative;
    top: auto;
    left: auto;
    margin: 0;
    padding: 0;
    order: 0;
    font-size: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.layout-small-desktop .menu-item .menu-item-icon {
    font-size: 16px;
}


.menu-item .menu-item-arrow {
    position: relative;
    top: auto;
    right: auto;
    order: 2;
    font-size: 14px;
    margin-left: 12px;
    display: flex;
    align-items: center;
    background: none;
}

    .menu-item .menu-item-arrow::before {
        font-size: 12px;
    }

.x-menu-item-checked .x-menu-item-icon-default.x-menu-item-checkbox:not(.x-menu-group-icon),
.x-menu-item-unchecked .x-menu-item-icon-default.x-menu-item-checkbox:not(.x-menu-group-icon) {
    background-image: none;
}

.menu-item .menu-item-checkbox {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    margin: 0;
    padding: 0;
    order: 0;
    font-size: 16px;
}

.menu-item .menu-item-checkbox {
    font-family: "pat-icons" !important;
    line-height: 1 !important;
    font-weight: normal !important;
    font-style: normal !important;
    text-decoration: none !important;
    text-transform: none !important;
    text-rendering: auto !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    speak: none;
}

    .menu-item .menu-item-checkbox:not(.x-menu-group-icon):before {
        content: "\f131";
    }

.menu-item.is-checked .menu-item-checkbox:not(.x-menu-group-icon):before {
    content: "\f132";
}

.menu-item .menu-item-text.x-menu-item-indent-right-icon {
    margin-right: 28px;
}

.menu-item .menu-item-checkbox.x-menu-group-icon,
.menu-item.is-checked .menu-item-checkbox.x-menu-group-icon {
    order: 2;
    font-size: 16px;
}

.menu-item:hover,
.menu-item.is-active,
.menu-item.btn.btn-command:hover,
.menu-item.btn.btn-command.is-active {
    background-color: #CCC;
    color: #222;
}

.menu-item.is-disabled,
.menu-item.is-disabled:hover,
.menu-item.is-disabled.is-active,
.menu-item.btn.btn-command.is-disabled,
.menu-item.btn.btn-command.is-disabled:hover,
.menu-item.btn.btn-command.is-disabled.is-active {
    background-color: #F0F0F0;
    color: #999;
}


/* Menu item button (toolbar overflow menu) */
.menu .menu-item.btn:hover,
.menu .menu-item.btn.is-over,
.menu .menu-item.btn:focus,
.menu .menu-item.btn.is-focused,
.menu .menu-item.btn:active,
.menu .menu-item.btn.is-active {
    color: inherit;
}

    .menu .menu-item.btn:hover .btn-text,
    .menu .menu.item.btn.is-over .x-btn-inner {
        text-decoration: none;
    }


/* Special menus - TinyMCE command menu */

body .mce-menu {
    box-shadow: 0 6px 15px 0 rgba(34, 34, 34, 0.4), inset 0 2px 0 0 #CCC;
    padding: 0;
}

body div.mce-menu .mce-menu-item-sep,
body .mce-menu-item-sep:hover {
    border-bottom: 0px none;
    margin: 0;
    background-color: #CCC;
}

body .mce-menu-item {
    padding: 10px 14px;
    margin: 0;
    transition-property: background-color, color;
    transition-duration: 0.2s;
}

    body .mce-menu-item-normal.mce-active,
    body .mce-menu-item:hover,
    body .mce-menu-item.mce-selected,
    body .mce-menu-item:focus {
        background-color: #CCC;
        color: #222;
    }

    body .mce-menu-item.mce-disabled,
    body .mce-menu-item.mce-disabled:hover,
    body .mce-menu-item.mce-disabled:focus {
        background-color: #F0F0F0;
        color: #999;
    }





/* ============================== TOOLBAR ============================== */

.toolbar {
}

body.mobile .toolbar {
    padding: 0px 14px;
}

.toolbar .toolbar-item {
    margin: 0;
}

    .toolbar .btn + .btn,
    .toolbar .toolbar-item + .toolbar-item {
        margin: 0 0 0 6px;
    }

.toolbar.x-toolbar-vertical .btn + .btn,
.toolbar.toolbar-dir-vertical .btn + .btn,
.toolbar.x-toolbar-vertical .toolbar-item + .toolbar-item,
.toolbar.toolbar-dir-vertical .toolbar-item + .toolbar-item {
    margin: 6px 0 0 0;
}





/* Toolbar items alignment (requires anchor layout for ExtJs toolbars) */
.toolbar > .x-autocontainer-outerCt > .x-autocontainer-innerCt {
    display: flex;
    align-items: center;
    justify-content: var(--toolbar-justify-content);
    align-items: var(--toolbar-align-items);
    flex-direction: var(--toolbar-flex-direction);
}

.toolbar.toolbar-center {
    --toolbar-justify-content: center;
}

.toolbar.toolbar-right {
    --toolbar-justify-content: flex-end;
}

.toolbar.toolbar-left {
    --toolbar-justify-content: flex-start;
}

.toolbar.toolbar-between {
    --toolbar-justify-content: space-between;
}

.toolbar.toolbar-evenly {
    --toolbar-justify-content: space-evenly;
}

.toolbar.toolbar-around {
    --toolbar-justify-content: space-around;
}

.toolbar.toolbar-top {
    --toolbar-align-items: flex-start;
}

.toolbar.toolbar-bottom {
    --toolbar-align-items: flex-start;
}



.toolbar.toolbar-dir-vertical {
    --toolbar-flex-direction: column;
}

    .toolbar.toolbar-dir-vertical.toolbar-middle {
        --toolbar-justify-content: center;
    }

    .toolbar.toolbar-dir-vertical.toolbar-top {
        --toolbar-justify-content: flex-start;
    }

    .toolbar.toolbar-dir-vertical.toolbar-bottom {
        --toolbar-justify-content: flex-end;
    }

    .toolbar.toolbar-dir-vertical.toolbar-left {
        --toolbar-align-items: flex-start;
    }

    .toolbar.toolbar-dir-vertical.toolbar-right {
        --toolbar-align-items: flex-end;
    }


body.mobile .toolbar.toolbar-dir-vertical {
    --toolbar-align-items: stretch;
}

.layout-normal-mobile .button-toolbar.toolbar-dir-vertical > .x-autocontainer-outerCt > .x-autocontainer-innerCt,
.layout-large-mobile .button-toolbar.toolbar-dir-vertical > .x-autocontainer-outerCt > .x-autocontainer-innerCt {
    max-width: 360px;
    margin: 0 auto;
}




/* Toolbar position */
.toolbar.toolbar-pos-top,
.module .toolbar.x-toolbar-docked-top {
    margin-bottom: 12px;
}

.toolbar.toolbar-pos-bottom,
.x-toolbar.x-toolbar-docked-bottom,
.x-toolbar.x-toolbar-footer {
    margin-top: 12px;
}

body.mobile .toolbar.toolbar-pos-bottom,
body.mobile .x-toolbar.x-toolbar-docked-bottom,
body.mobile .x-toolbar.x-toolbar-footer {
    margin-bottom: 12px;
}



/*  Toolbar fill: ensure toolbar fill height is the same of buttons (including borders + padding + margins).
	This is for ensuring the right toolbar height when there are no starting visible elements.
	An example is when detail module hasn't visible title and GetAvailableOperations hides buttons on record view rendering. 
	In this case when GetAvailableOperations shows buttons, the toolbar height changes from 0 to button height and moves down the whole detail content.
 */
.toolbar-fill {
    height: 34px;
}

body.mobile .toolbar-fill {
    height: 34px;
}


.x-toolbar-more-icon {
    transform: rotate(90deg);
    font-size: 16px;
}

    .x-toolbar-more-icon:before {
        font-family: 'pat-font';
        content: '\e048';
    }







/* ============================== PANEL ============================== */
.panel {
}

.panel-header,
/* we need this class combination to handle title-collapsible panels */
.panel-header.collapsed {
    font-size: 18px;
    padding: 8px 12px;
    margin-bottom: 8px;
}

body.mobile .panel-header,
/* we need this class combination to handle title-collapsible panels */
body.mobile .panel-header.collapsed {
    padding: 8px 14px;
}

.panel .x-region-collapsed-left-placeholder {
    border-left: 1px solid #E0E0E0;
}

.panel .x-region-collapsed-right-placeholder {
    border-right: 1px solid #E0E0E0;
}


/* Cannot use pat font icons till we change panel tools html template (replacing img with div/span) */
/*.panel .x-tool-expand-right,
.panel .x-tool-collapse-right,
.panel .x-tool-expand-left,
.panel .x-tool-collapse-left {
	font-family: 'pat-font';
	background-image: none;
}

	.panel .x-tool-expand-right::before,
	.panel .x-tool-collapse-right::before {
		content: '\e06b';
	}

	.panel .x-tool-expand-left::before,
	.panel .x-tool-collapse-left::before {
		content: '\e06a';
	}*/

/* ============================== FLOATING PANELS (WINDOW / SLIDING PANEL) ============================== */

/* Floating panels generic styles */

.floating-panel {
    background-color: #FFF;
    box-shadow: 0 6px 15px 0 rgba(34, 34, 34, 0.4);
    border: 0px none;
    padding: 0 0 20px 0;
    border-radius: 6px;
}

body.mobile .floating-panel {
    padding: 0;
}

.floating-panel > .panel-header {
    padding: 14px 20px;
    font-size: 14px;
    margin-bottom: 4px;
}

.layout-small-desktop .floating-panel > .panel-header {
    padding: 8px 20px;
    margin-bottom: 8px;
}

body.mobile .floating-panel > .panel-header {
    margin-bottom: 0;
    padding: 8px 14px 8px 14px;
}

.floating-panel > .panel-header .panel-title {
    display: flex;
    white-space: nowrap;
    font-size: 24px;
    padding: 0;
    font-weight: 600;
    letter-spacing: 1px;
    font-stretch: normal;
    font-style: normal;
    overflow: hidden;
}

.layout-small-desktop .floating-panel > .panel-header .panel-title {
    font-size: 18px;
    font-size: 20px;
}

.floating-panel > .panel-header .panel-title-text {
    max-width: 100%;
    padding: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.floating-panel > .panel-body {
    border: 0px none;
    background-color: transparent;
    padding: 0 20px;
}

body.mobile .floating-panel > .panel-body {
    padding: 0;
}

.floating-panel > .panel-header .x-tool-img {
    background-image: none;
    width: 0px;
    height: 0px;
    display: none;
}

.floating-panel > .panel-header .x-tool::before {
    font-family: "pat-icons";
    font-size: 18px;
    content: "\f135";
    width: 18px;
    height: 18px;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    speak: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.layout-small-desktop .floating-panel > .panel-header .x-tool::before {
    font-size: 16px;
}

body.mobile .floating-panel > .panel-header .x-tool {
    margin: 0 0 0 2px;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    body.mobile .floating-panel > .panel-header .x-tool::before {
        content: "\f135";
        font-size: 18px;
        width: 18px;
        height: 18px;
    }

.floating-panel > .panel-body > .module {
    padding: 0;
}


/* Window specific styles */

.window {
}

body .mce-window {
    border-radius: 6px;
    box-shadow: 0 6px 15px 0 rgba(34, 34, 34, 0.4);
}

    body .mce-window .mce-window-head {
        border-bottom: 0px none;
    }

    body .mce-window .mce-foot {
        border: 0px none;
    }



/* Sliding Panel specific styles */

.sliding-panel {
    border-radius: 0;
}



.x-resizable-handle-north-over,
.x-resizable-handle-east-over,
.x-resizable-handle-west-over,
.x-resizable-handle-souht-over {
    background-image: none;
    background-color: #FFF;
    filter: none;
}








/* ============================== SLIDING PANEL ============================== */

.sliding-panel {
}

    .sliding-panel.content-negative {
        background-color: #222;
        color: #FFF;
        border: 0px none;
    }



/* ============================== CALLOUT ============================== */
.x-callout {
    box-shadow: 0 6px 15px 0 rgba(34, 34, 34, 0.4);
    border-color: transparent;
    padding: 0;
}

.x-callout-header {
    padding: 14px;
    display: flex;
    align-items: center;
}

.x-callout-header-text {
    font-weight: 600;
}

/* CALLOUT - INFO */

.x-callout.callout-info .x-callout-header {
    background-color: #999;
    color: #FFF;
}


/* CALLOUT - WARNING */

.x-callout.callout-warning .x-callout-header {
    background-color: #FAB450;
    color: #FFF;
}


/* CALLOUT - ERROR */

.x-callout.callout-error .x-callout-header {
    background-color: #EF5350;
    color: #FFF;
}



/* ============================== WEBIX CONTROLS ============================== */

/* Webix windows (dropdown lists, ...) */

.webix_window:not(.portal-main-menu) {
    box-shadow: 0 6px 15px 0 rgba(34, 34, 34, 0.4);
    background-color: #FFF;
    border-radius: 4px;
}

/* Webix list items */

.webix_multilist .webix_list_item:hover {
    background-color: rgba(250, 180, 80, 0.6);
}

.webix_multilist .webix_list_item {
    display: flex;
    align-items: center;
}

.webix_multilist .wxi-checkbox-blank,
.webix_multilist .wxi-checkbox-marked {
    font-family: 'pat-icons';
    font-size: 16px;
}

    .webix_multilist .wxi-checkbox-blank::before {
        content: '\f131';
    }

    .webix_multilist .wxi-checkbox-marked::before {
        content: '\f132';
    }



.nopadding-x .webix_template, .nopadding .webix_template {
    padding-right: 0;
    padding-left: 0;
}

.nopadding-y .webix_template, .nopadding .webix_template {
    padding-top: 0;
    padding-bottom: 0;
}


.input-like .webix_template {
    line-height: 22px;
    font-size: 16px;
    font-weight: 500;
}




/* ============================== MODULE ============================== */






/* ============================== LIST GRID / TREE - COMMON STYLES ============================== */
.list-header {
    border-top: 1px solid #CCC;
    /* border bottom: using inset box shadow instead of border-bottom because ExtJS base style sets border-bottom-width: 0 !important */
    box-shadow: inset 0 -1px 0 0 #CCC;
}

.list-col-header {
    background-image: none;
    background-color: transparent;
    font-size: 11px;
    line-height: normal;
    border: 0px none;
    border-left: 1px solid transparent;
    text-transform: uppercase;
    font-weight: 600;
}

    .list-col-header:hover {
        border-left-color: #F0F0F0;
    }

.list-header .list-col-header:last-of-type {
    border-right: 1px solid transparent;
}

.list-col-header:hover + .list-col-header {
    border-left-color: #F0F0F0;
}

.list-header .list-col-header:last-of-type:hover {
    border-right: 1px solid #F0F0F0;
}

.list-col-header .x-column-header-inner {
    padding: 12px 8px;
}

.layout-small-desktop .list-col-header .x-column-header-inner {
    padding: 8px 4px;
}

.list-col-header .x-column-header-text {
    display: inline-block;
}

.list-col-header.is-sortable {
    cursor: pointer;
}

    .list-col-header.is-sortable .x-column-header-text {
        background-image: none;
        padding: 0;
    }

        .list-col-header.is-sortable .x-column-header-text::after,
        .list-col-header.x-column-header-sort-ASC .x-column-header-text::after,
        .list-col-header.x-column-header-sort-DESC .x-column-header-text::after {
            content: '';
            font-family: 'pat-icons';
            font-weight: bold;
            margin-left: 4px;
        }

.list-col-header.x-column-header-sort-ASC .x-column-header-text::after {
    content: '\f116';
}

.list-col-header.x-column-header-sort-DESC .x-column-header-text::after {
    content: '\f117';
}


.list-col-header .x-column-header-trigger {
    background-image: none;
    background-color: #FFFFFF;
    border-bottom: 1px solid #CCC;
    width: 16px;
    align-items: center;
    justify-content: center;
}

    .list-col-header .x-column-header-trigger::before {
        content: "\f117";
        font-family: "pat-icons";
        font-weight: normal;
    }

.list-col-header .x-column-header-over .x-column-header-trigger,
.list-col-header .x-column-header-open .x-column-header-trigger {
    display: flex;
}


.list-col-header .x-column-header-trigger:hover,
.list-col-header .x-column-header-open .x-column-header-trigger {
    background-color: #E0E0E0;
    /*border-bottom: 1px solid #CCC;*/
}

.list-col-header .x-column-header-sort-ASC .x-column-header-text,
.list-col-header .x-column-header-sort-DESC .x-column-header-text {
    margin-right: 8px;
}

/* column menu icons*/
.menu-item .x-hmenu-sort-asc {
    background: url('../Img/base/ico-crescente.png');
}

.menu-item .x-hmenu-sort-desc {
    background: url('../Img/base/ico-decrescente.png');
}

.menu-item .x-cols-icon {
    background: url('../Img/base/ico-columns.png');
}

.menu-item .x-group-by-icon {
    background: url('../Img/base/ico-group.png');
}

/* List Filtering */

.field-label.x-grid-filters-find {
    display: none;
}

.field-label.x-grid-filters-icon {
    max-width: 26px !important;
    min-width: 26px !important;
    width: 26px !important;
}

.list-col-header.x-grid-filters-filtered-column .x-column-header-inner {
    padding-left: 22px;
    background-position-y: center !important;
}

.list .list-cell-no-ellipsis * {
    text-overflow: clip !important;
    overflow: visible !important;
}



/* ============================== LIST COMMON STYLES (GRID & DATAVIEW) ============================== */

.list-view {
}

    .list-view .list-view-row {
        border-top: 1px solid #DDD;
        border-bottom: 0 none;
        transition-property: background-color, border-color, color;
        transition-duration: 0.2s;
    }

        .list-view .list-view-row + .list-view-row {
            border-top: 1px solid #DDD;
        }

        .list-view .list-view-row:last-child {
            border-bottom: 1px solid #DDD;
        }

        .list-view .list-view-row.is-selected,
        .list-view .list-view-row.is-over {
            background-color: #F0F0F0;
        }



/* ============================== GRID ============================== */

.list-grid {
}

    .list-grid > .panel-body {
        border-bottom: 1px solid #CCC;
    }

body.mobile .list-grid > .panel-body {
    border-bottom: 0px none;
}

.list-grid .list-grid-row.is-selected .x-grid-td.x-grid-dirty-cell,
.list-grid .list-grid-row.is-over .x-grid-td.x-grid-dirty-cell {
    background-image: url(../../../extjs/resources/ext_theme_gray/images/grid/dirty-gif/ext.axd);
    background-repeat: no-repeat;
    background-position: 0 0;
}

.editable-grid .field-body {
    width: 99% !important;
}

.list-grid .list-grid-row .list-grouping,
.list-grid .list-grid-row .x-grid-row-summary {
    background-color: #FFF;
    border-style: solid;
    border-width: 0 0 1px 0;
    border-color: #CCC;
    padding: 10px 5px;
}

.list-grid .list-grid-row .x-grid-row-summary {
    border-width: 1px 0 0 0;
}

.list-grid .list-grid-row .list-grouping div {
    display: inline !important;
    text-align: left !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #222 !important;
}

.list-grid .list-grid-row .list-grouping img {
    display: none;
}



/* ============================== GRID Selection CheckboxModel ============================== */

.list-grid .x-column-header-checkbox {
    cursor: pointer;
}

/*.list-col-header.x-column-header-checkbox,
.list-grid-row .x-grid-cell-row-checker {
	width: 40px !important;
}*/

.list-grid-row .x-grid-cell-row-checker .x-grid-cell-inner,
.list-col-header.x-column-header-checkbox .x-column-header-inner {
    padding: 12px 0;
}

.list-col-header.x-column-header-checkbox .x-column-header-text,
.list-grid-row .x-grid-row-checker {
    background: none;
    height: 16px;
    width: 100%;
    line-height: 16px;
    text-align: center;
}

    .list-col-header.x-column-header-checkbox .x-column-header-text::before,
    .list-grid-row .x-grid-row-checker::before {
        font-size: 16px;
        font-family: "pat-icons" !important;
        line-height: 1 !important;
        font-weight: normal !important;
        font-style: normal !important;
        text-decoration: none !important;
        text-transform: none !important;
        text-rendering: auto !important;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        speak: none;
    }

    .list-col-header.x-column-header-checkbox .x-column-header-text::before,
    .list-grid-row .x-grid-row-checker::before {
        content: "\f131";
    }

.list-col-header.x-column-header-checkbox.x-grid-hd-checker-on .x-column-header-text::before,
.list-grid-row.is-selected .x-grid-row-checker::before {
    content: "\f132";
}



/* ============================== LIST CELLS ============================== */

.list-cell-wrapper {
    vertical-align: middle;
    padding: 12px 8px;
}

    /* Workaround to fix editor cut inside grid cells */
    .list-cell-wrapper .field.x-grid-editor {
        padding-right: 18px;
    }


.layout-small-desktop .list-cell-wrapper {
    padding: 6px 4px;
}


/* IE11 hack - Workaround to solve flexbox not centering vertically with min-height
 * https://stackoverflow.com/questions/47179795/ie-flexbox-vertical-align-center-and-min-height
 */
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    .list-cell-wrapper .x-grid-cell-inner {
        display: flex;
        flex-direction: row;
    }
}

.list-cell {
    display: flex;
    justify-content: center;
    flex-direction: column;
    flex-wrap: nowrap;
    /*font-size: 14px;*/
    /*line-height: 1.25em;*/
    min-height: 40px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.layout-small-desktop .list-cell {
    min-height: 32px;
}

.list-cell * {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.list-cell .text-caption {
    color: #777;
}

.list-grid .x-grid-dirty-cell {
    background-image: none;
    font-weight: 600;
}





/*.list-cell-primary {
	cursor: pointer;
	position: relative;
	padding-right: 20px;
}*/

/*.list-cell-primary:hover {
		text-decoration: underline;
	}*/

/* IMPORTANT - "text-decoration" is set only to fix an IE buggy behaviour, that makes it show underline for :after elements too.
	 * The trick is to set a value for text-decoration in the :after element base style, and then overwrite it with a more specific class.
	 * 
	 * https://stackoverflow.com/questions/8820286/how-to-remove-only-underline-from-abefore
	 */
/*.list-cell-primary:after {
		font-family: 'pat-font';
		content: '\e06b';
		font-size: 18px;
		position: absolute;
		right: 0;
		top: 50%;
		transform: translateY(-50%);
		text-decoration: underline;
	}*/

/*body .list-cell-primary:after {
	text-decoration: none;
}*/

.list-cell-primary .primary-text-wrapper {
    display: flex;
    align-items: center;
}

    .list-cell-primary .primary-text-wrapper > * {
        padding-bottom: 1px;
    }

    .list-cell-primary .primary-text-wrapper .icon {
        width: 16px;
        height: 16px;
        font-size: 16px;
        line-height: 18px;
        text-overflow: unset;
        display: inline-block;
        margin: 0;
        flex-shrink: 0;
        margin-left: 8px;
    }

.list-cell-text {
}

.list-cell-boolean {
    padding: 0 8px;
}

    .list-cell-boolean .icon {
    }

.list-cell-number {
    text-align: right;
}

    .list-cell-number .good {
        color: #2CC48A;
    }

    .list-cell-number .neutral {
    }

    .list-cell-number .bad {
        color: #EF5350;
    }

    .list-cell-number .discard {
    }

.list-cell-enum {
}

    .list-cell-enum.good {
    }

    .list-cell-enum.neutral {
    }

    .list-cell-enum.bad {
    }

    .list-cell-enum.discard {
    }

.list-cell-multitext {
}

    .list-cell-multitext > * + * {
        margin-top: 2px;
    }

.list-cell-icon {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-start;
}

    .list-cell-icon .icon {
        min-width: 16px;
        margin-right: 6px;
        margin-left: 0;
    }

    .list-cell-icon .text {
    }

.list-cell-icon-left {
}

    .list-cell-icon-left .icon {
        order: 0;
        margin-right: 6px;
        margin-left: 0;
    }

    .list-cell-icon-left .text {
        order: 1;
    }

.list-cell-icon-right {
}

    .list-cell-icon-right .icon {
        order: 1;
        margin-left: 6px;
        margin-right: 0;
    }

    .list-cell-icon-right .text {
        order: 0;
    }

.list-cell-icon .circle,
.text-with-icon .circle,
.text-with-icon-left .circle,
.text-with-icon-right .circle {
    display: inline-block;
    width: 10px;
    min-width: 10px;
    height: 10px;
    border-radius: 50%;
    margin-right: 8px;
}

.list-cell-icon-array {
    text-overflow: ellipsis;
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
}

    .list-cell-icon-array span[class^="icon-"] + span[class^="icon-"],
    .list-cell-icon-array span[class*=" icon-"] + span[class*=" icon-"] {
        margin-left: 10px;
        font-size: 16px;
    }

.list-cell-datetime {
    text-align: left;
}

.text-datetime-time {
    color: #999;
    font-size: 0.875em;
}

.list-cell-date-expiration {
    display: flex;
    align-items: center;
}

    .list-cell-date-expiration .date-exp-indicator {
        display: inline-block;
        width: 10px;
        min-width: 10px;
        height: 10px;
        border-radius: 50%;
        margin-right: 6px;
        background-color: #E0E0E0;
    }

    .list-cell-date-expiration.date-exp-valid .date-exp-indicator,
    .list-cell-date-expiration.list-cell-date-before .date-exp-indicator {
        background-color: #109006;
    }

    .list-cell-date-expiration.date-exp-today .date-exp-indicator,
    .list-cell-date-expiration.list-cell-date-today .date-exp-indicator {
        background-color: #FAB450;
    }

    .list-cell-date-expiration.date-exp-expired .date-exp-indicator,
    .list-cell-date-expiration.list-cell-date-after .date-exp-indicator {
        background-color: #EF5350;
    }

.list-cell-prog-bar {
    height: 54px;
    position: relative;
}

    .list-cell-prog-bar .top-left-value, .list-cell-prog-bar .top-right-value {
        position: absolute;
        font-size: 1.6em;
        top: 15px;
        z-index: 1;
    }

    .list-cell-prog-bar .top-left-value {
        left: 20px;
    }

    .list-cell-prog-bar .top-right-value {
        right: 20px;
    }

    .list-cell-prog-bar .bar {
        height: 25px;
        position: absolute;
        top: 15px;
        left: 10px;
        right: 10px;
        background-color: #EEE;
        border-radius: 2px;
        overflow: hidden;
    }

        .list-cell-prog-bar .bar div:first-child {
            position: absolute;
            z-index: 1;
            left: 0px;
            right: 0px;
            height: 100%;
            text-align: center;
            font-size: 1.6em;
        }

        .list-cell-prog-bar .bar div:last-child {
            height: 100%;
            background-color: #1da2d4;
        }

.list-cell.list-cell-unread .unread-target,
.list-cell .list-cell-unread .unread-target {
    font-weight: 600;
    color: #222;
}

.list-cell .text-subheading {
    color: #777;
}

.list-cell-tags {
    display: flex;
    flex-wrap: wrap;
}

.list-cell-tag {
    border: 1px solid #CCC;
    border-radius: 16px;
    padding: 4px 12px;
    height: 100%;
    margin: 2px;
    display: flex;
}

    .list-cell-tag .list-cell-tag-icon {
    }

    .list-cell-tag .list-cell-tag-text {
        font-weight: 600;
        max-width: 150px;
        text-overflow: ellipsis;
        overflow: hidden;
    }

    .list-cell-tag span.list-cell-tag-counter::before {
        content: '(';
    }

    .list-cell-tag span.list-cell-tag-counter::after {
        content: ')';
    }

    .list-cell-tag span + span {
        margin-left: 2px;
    }

.layout-small-desktop .list-cell-tag {
    padding: 2px 8px;
}


/* ============================== LIST - ENTITY SPECIFIC STYLES ============================== */


/* ============================== LIST - ENTITY - ATTACHMENTS ============================== */

.list.entity-attachment .attachment-img-preview {
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .list.entity-attachment .attachment-img-preview img {
        width: 100%;
        object-fit: contain;
    }

.list.entity-attachment .attachment-preview-content {
    width: 64px;
    height: 64px;
    border: 1px solid;
    border-color: rgba(0,0,0,0.08);
    display: grid;
    place-items: center;
    border-radius: 10px;
    overflow: hidden;
}

    .list.entity-attachment .attachment-preview-content img {
        object-fit: cover;
        width: 100%;
        height: 100%;
    }

    .list.entity-attachment .attachment-preview-content .icon {
        width: 100%;
        height: 100%;
        display: grid;
        place-items: center;
        background-color: rgba(0,0,0,0.02);
        color: #666;
    }

        .list.entity-attachment .attachment-preview-content .icon::before {
            font-size: 32px;
        }

.list.entity-attachment .card {
    height: auto;
}

    .list.entity-attachment .card .icon::before {
        font-size: 32px;
    }

body.mobile .list.entity-attachment .uploader-control {
    margin: 0 0 2rem 0;
}


/* ============================== LIST - ENTITY - TICKET CONVERSATION ITEMS ============================== */
.list.entity-ticketconversationitem .card {
    height: auto;
}

    .list.entity-ticketconversationitem .card .body {
        display: flex;
    }

.list.entity-ticketconversationitem .card-body-content {
    width: 100%;
}

.list.entity-ticketconversationitem .card-body-icons {
    flex-shrink: 0;
    align-self: center;
}

    .list.entity-ticketconversationitem .card-body-icons .icon + .icon {
        margin-left: 8px;
    }



/* ============================== LIST - ENTITY - USERS ============================== */
.list.entity-user .card {
    height: auto;
}

    .list.entity-user .card .header {
        border-bottom: 0px none;
        margin-bottom: 0;
        padding-bottom: 0;
    }






/* ============================== LIST DATAVIEW ============================== */

.list-dataview {
}


/* ============================== TREE ICONS ============================== */

.x-tree-view .x-tree-icon,
.x-tree-view .x-tree-expander,
.x-tree-view .x-tree-icon-parent,
.x-tree-view .x-tree-elbow-plus,
.x-tree-lines .x-tree-elbow-plus,
.x-tree-lines .x-grid-tree-node-expanded .x-tree-elbow-plus,
.x-tree-lines .x-tree-elbow-end-plus,
.x-tree-lines .x-grid-tree-node-expanded .x-tree-elbow-end-plus {
    /* 
		Using "important" with width/height to ensure right icon size even with legacy background image based icons.
		Remove "important" when image icons will be removed at all.
	*/
    width: 20px !important;
    height: 20px !important;
    line-height: 20px;
    display: inline-block;
    vertical-align: middle;
    text-align: center;
    font-size: 18px;
    font-family: "pat-font" !important;
    font-weight: normal !important;
    text-decoration: none !important;
    background-image: none !important;
}

    .x-tree-view .x-tree-icon-parent::before,
    .x-tree-view .x-grid-tree-node-expanded .x-tree-icon-parent::before,
    .x-tree-icon-leaf::before {
        font-family: "pat-icons" !important;
        font-size: 18px;
    }

.x-tree-view .x-tree-elbow,
.x-tree-view .x-tree-elbow-end,
.x-tree-view .x-tree-elbow-line,
.x-tree-view .x-tree-elbow-empty,
.x-tree-view .x-tree-elbow-img {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

.x-tree-view .x-tree-icon-parent:before {
    content: "\f11a";
}

.x-tree-view .x-grid-tree-node-expanded .x-tree-icon-parent:before {
    content: "\f11b";
}

.x-tree-icon-leaf:before {
    content: "\f10c";
}

.x-tree-view .x-tree-elbow-plus:before,
.x-tree-view .x-tree-elbow-end-plus:before {
    content: "\e00f";
}

.x-tree-view .x-grid-tree-node-expanded .x-tree-elbow-plus:before,
.x-tree-view .x-grid-tree-node-expanded .x-tree-elbow-end-plus:before {
    content: "\e010";
}

.x-tree-arrows .x-tree-view .x-tree-elbow-plus:before,
.x-tree-arrows .x-tree-view .x-tree-elbow-end-plus:before {
    content: "\e045";
    display: inline-block;
    transform: rotate(90deg);
    font-size: 12px;
    vertical-align: top;
}

.x-tree-arrows .x-tree-view .x-grid-tree-node-expanded .x-tree-elbow-plus:before,
.x-tree-arrows .x-tree-view .x-grid-tree-node-expanded .x-tree-elbow-end-plus:before {
    content: "\e046";
    transform: none;
}


/* ============================== TREE ============================== */
.tree {
}

    .tree .x-grid-cell-inner-treecolumn {
        display: flex;
        align-items: center;
    }

.tree-node {
    /*font-size: 14px;*/
    transition-property: background-color, color;
    transition-duration: 0.2s;
}

    .tree-node.is-selected,
    .tree-node.is-over {
        background-color: #F0F0F0;
    }

    .tree-node.is-over {
        cursor: pointer;
    }

    .tree-node .tree-node-cell {
        padding: 6px;
    }

.tree .list-cell-wrapper {
    padding: 6px;
}

/* Tree checkbox temporary fix */
.tree-node .x-tree-checkbox {
    top: auto;
    margin: 0 4px;
    background-image: none;
    z-index: 1;
    opacity: 0;
    height: 16px;
    width: 16px;
    flex-shrink: 0;
}

.tree .tree-checkbox {
    font-family: "pat-icons" !important;
    line-height: 1 !important;
    font-weight: normal !important;
    font-style: normal !important;
    text-decoration: none !important;
    text-transform: none !important;
    text-rendering: auto !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    speak: none;
}

.tree .tree-checkbox {
    width: 0;
    height: 20px;
    line-height: 20px;
    margin-right: 3px;
    vertical-align: middle;
    text-align: center;
    font-size: 16px;
    position: relative;
    left: -20px;
}

    .tree .tree-checkbox::before {
        vertical-align: middle;
        content: "\f131";
    }

    .tree .tree-checkbox.is-checked::before {
        content: "\f132";
    }


.tree.tree-with-cells .tree-node {
    border-top: 1px solid transparent;
}

    .tree.tree-with-cells .tree-node + .tree-node {
        border-top: 1px solid #DDD;
    }

    .tree.tree-with-cells .tree-node:last-child {
        border-bottom: 1px solid #DDD;
    }

.tree.tree-with-cells .list-cell-wrapper,
.tree.tree-with-cells .tree-node-cell {
    border-right: 1px solid #DDD;
}


/* ============================== SECTION INFORMATION AREA ============================== */

.section-information-container-outer {
    /*width: 100%;
	text-align: center;
	padding-left: 5px;*/
}

.section-information-container-inner {
    width: 100%;
    padding: 10px 12px;
    margin-bottom: 16px;
    margin-top: 0px;
    border-radius: 4px;
    /* border: 1px solid #EAEAEA; */
    background: #F0F0F0;
    /* color: darkslategrey; */
    /* display: inline-block; */
    /* text-align: left; */
    /* font-style: italic; */
    /*font-size: 14px;*/
    line-height: 1.5;
}






/* ============================== LIST MODULE ============================== */
.list {
}

    .list .x-toolbar-default .x-toolbar-separator-horizontal {
        border: 0px;
        margin-right: 20px;
    }

/* Paging Toolbar */

.paging-toolbar {
    font-size: 12px;
}

body.mobile .list .paging-toolbar {
    padding: 0 14px;
    margin: 0;
    box-shadow: 0 -2px 10px 0 rgb(0 0 0 / 10%);
    z-index: 2;
}

body.mobile .detail .list .paging-toolbar {
    padding: 0;
}

body.mobile .list .paging-toolbar .toolbar-item {
    margin: 20px 0 0 6px;
}

.list .paging-toolbar .x-toolbar-separator {
    margin-right: 0;
}

body.mobile .list .paging-toolbar .page-size-label,
body.mobile .list .paging-toolbar .page-size-field,
body.mobile .list .paging-toolbar .export-excel-list,
body.mobile .list .paging-toolbar .x-toolbar-separator {
    margin: 0;
    display: none;
}

body.mobile .list .paging-toolbar .x-toolbar-text-default {
    padding: 0 6px;
}

.paging-toolbar .toolbar-item + .toolbar-item {
    margin-left: 4px;
}

.paging-toolbar .x-btn-icon-el {
    font-family: "pat-font";
    font-size: 18px;
    line-height: 1;
    background-image: none;
    display: flex;
    align-items: center;
    justify-content: center;
}

body.mobile .paging-toolbar .x-btn-icon-el {
    font-size: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.paging-toolbar .x-btn-icon-el.x-tbar-page-first::before {
    content: "\e066"
}

.paging-toolbar .x-btn-icon-el.x-tbar-page-prev::before {
    content: "\e067"
}

.paging-toolbar .x-btn-icon-el.x-tbar-page-next::before {
    content: "\e068";
}

.paging-toolbar .x-btn-icon-el.x-tbar-page-last::before {
    content: "\e069";
}

.paging-toolbar .x-btn-icon-el.x-tbar-loading::before {
    content: "O";
}


/* List Preview (floating panel specific styles, to handle spacing when internal "content areas" styles have been reset) */
.floating-panel .list .list-preview-wrapper {
    margin-left: 8px;
}

.floating-panel .list .list-grid-wrapper {
    margin-right: 8px;
}



/* ============================== FILTER AREA ============================== */

.filter-area-container {
    padding: 20px 0 8px 0;
    border-top: 1px solid #CCC;
}

body.mobile .filter-area-container {
    padding: 0;
    border-top: 0px none;
}

/* collapsed filter area container must have zero height, reset margins, paddings, borders */
.filter-area-container.x-panel-collapsed {
    margin: 0;
    padding: 0;
    border: 0;
}

body.mobile .filter-area-container > .panel-header {
    margin-bottom: 12px;
}


.filter-area-notification {
    margin-bottom: 8px;
}

.filter-area-active-filter {
}

    .filter-area-active-filter .text-caption {
        margin-top: 6px;
    }

body.mobile .filter-area-toolbar {
    margin-bottom: 12px;
}

body.mobile .filter-toggle.filter-status-indicator {
    position: relative;
}

    body.mobile .filter-toggle.filter-status-indicator::after {
        content: "";
        position: absolute;
        top: 1px;
        right: 1px;
        width: 6px;
        aspect-ratio: 1;
        border-radius: 50%;
        background-color: #222;
    }










/* ============================== DETAIL ============================== */

.detail {
}

.detail-body {
    padding-top: 6px;
}

body.mobile .detail-body {
    padding-top: 0;
}

.detail-side-column {
}

    .detail-side-column.column-left {
        margin-right: 12px;
        padding-right: 12px;
        border-right: 1px solid #DDD;
    }

    .detail-side-column.column-right {
        margin-left: 12px;
        padding-left: 12px;
        border-left: 1px solid #DDD;
    }

    .detail-side-column .module {
        padding: 0;
    }

.detail .page-container > .panel-header {
    margin-bottom: 20px;
}

body.mobile .detail .page-container > .panel-header {
    padding: 0 14px;
    margin-bottom: 12px;
}

.detail-toolbar {
}

body.mobile .detail-toolbar {
    padding: 4px 6px;
}





/* Detail - Section */

.section {
    margin: 0 8px 18px 0;
    border: 0px;
    border-radius: 0;
    padding: 0;
}

.layout-small-desktop .section {
    margin: 0 8px 10px 0;
}

.detail-side-column .section {
    margin-left: 0;
    margin-right: 0;
    padding: 0;
}

.section.x-fieldset-with-title {
    border-top: 1px solid #999;
}

body.mobile .section {
    overflow: visible; /* SAFARI FIX: sections title of recordView invisible*/
    margin: 0;
    border: 0;
}


/* Safari: show section labels */
.x-safari .x-component.x-fieldset-header-text.x-fieldset-header-text-collapsible.x-component-default {
    position: static;
}

.section legend {
    margin-bottom: 14px;
    font-size: 18px;
    line-height: normal;
    text-transform: uppercase;
    color: #999;
    padding: 0 12px 0 0;
}

body.mobile .section legend {
    padding-top: 6px;
    padding-left: 14px;
}

.section legend .x-tool-toggle {
    margin-top: 6px;
}

body.mobile .section legend .x-tool-toggle {
    margin-top: 0;
}

.section > .fieldset-body {
    /*padding: 0 12px;*/
}

body.mobile .section > .fieldset-body {
    padding: 0 14px;
}

.detail-side-column .section > .fieldset-body {
    padding: 0;
}

.section.is-multi-column .action-link:not(.is-hidden) + .action-link:not(.is-hidden) {
    margin-left: 16px;
}

.section.is-single-column .action-link:not(.is-hidden) + .action-link:not(.is-hidden) {
    margin-top: 16px;
}

.section .notification-banner {
    margin-bottom: 16px;
}


/* Detail Pages Container */
.detail-pages-container {
    padding: 0;
}

body.mobile .detail-pages-container {
    padding: 0;
}


/* Detail child modules */
.module.detail .module {
    padding: 0;
}

.detail .module .section {
    margin-left: 0;
    margin-right: 0;
}

    .detail .module .section .fieldset-body {
        padding: 0;
    }


/* Window / Sliding Panel child modules */
.window .detail-pages-container,
.sliding-panel .detail-pages-container {
    padding: 0;
}








/* ============================== RecordView Title and Dirty Status Management ============================== */
.detail-title {
    margin-right: 36px;
    font-size: 18px;
    color: #444;
    padding: 0;
}

    .detail-title .detail-title-text {
        max-width: 100%;
        display: inline-block;
        vertical-align: top;
        overflow: hidden;
        text-overflow: ellipsis;
        margin-right: 12px;
        /*  This is for ensuring the right toolbar height when there are no starting visible elements.
			An example is when detail module hasn't visible title and GetAvailableOperations hides buttons on record view rendering. 
			In this case when GetAvailableOperations shows buttons, the toolbar height changes from 0 to button height and moves down the whole detail content.
		 */
        line-height: 34px;
    }

/*
	Workaround for mobile device half-screen title due to a toolbar-fill.
	However, that toolbar-filler is currently used to prevent the recordview pages menu from disappearing:
	https://tfs.pat.it/tfs/Test_vNext/PAT.CRM.vNext.HDA/_workitems?id=5443
*/
body.mobile .detail-title .detail-title-text {
    padding-left: 8px;
}

.module.dirty .detail-toolbar:first-of-type .detail-title::after,
.tab.x-tab.dirty::after,
.window.dirty > .panel-header .panel-title::after,
.module.dirty > .panel-header .panel-title-text::after {
    content: '*';
    display: inline-block;
    position: relative;
    padding: 0 2px;
}

.tab.x-tab.dirty::after {
    order: 1;
    margin-left: 4px;
    align-self: flex-start;
}

.module.dirty .detail-title::after {
    left: -10px;
}

.tab.is-closable.dirty .x-tab-wrap::after {
    right: 13px;
}

.window.dirty > .panel-header .panel-title::after {
    margin-left: 6px;
    margin-right: 12px;
}


/* ============================== DETAIL NAVBAR ============================== */
.detail-navbar {
    margin-bottom: 14px;
}




/* ============================== DETAIL NAVIGATION TREE ============================== */

.nav-tree {
}

    .nav-tree .tree-node {
        font-size: 14px;
    }

        .nav-tree .tree-node.is-selected {
            font-weight: 600;
        }

        .nav-tree .tree-node .tree-node-cell {
            padding: 8px;
        }

.layout-small-desktop .nav-tree .tree-node .tree-node-cell {
    padding: 6px;
}

.nav-tree .tree-node .x-tree-node-text {
    padding-left: 10px;
    line-height: 26px;
}

.nav-tree .nav-item-primary {
    font-weight: 600;
    text-transform: uppercase;
}

.nav-tree .x-tree-icon-parent,
.nav-tree .x-tree-elbow,
.nav-tree .x-tree-elbow-end {
    display: none;
}


/* ============================== DETAIL BADGES ============================== */
body.desktop .nav-tree .tree-node-cell.has-badge {
    padding-left: 2px;
}

.nav-tree .tree-node-cell.has-badge .x-tree-elbow-line,
.nav-tree .tree-node-cell.has-badge .x-tree-elbow-img {
    display: none;
}

.nav-tree .tree-node-cell.has-badge .x-tree-node-text {
    padding: 0;
    margin: 0;
}

.nav-tree .badge {
    display: inline-block;
    margin-right: 10px;
}

body.mobile .nav-tree .badge {
    margin-right: 5px;
}

.layout-small-desktop .nav-tree .badge {
    margin-right: 8px;
}

.nav-tree .tree-node-cell.is-badge-loading .x-tree-node-text {
    color: #999;
}

.nav-tree .tree-node-cell.is-badge-loading .badge {
    background-color: #F0F0F0;
}


body.mobile .nav-tree tree-node-cell.has-badge .x-tree-node-text {
    margin-left: 26px;
}





/* ============================== PINNED PAGES ============================== */

.pinned-pages {
    border-top: 1px solid #CCC;
    border-bottom: 1px solid #CCC;
}

body.mobile .pinned-pages > .x-tab-bar-body {
    min-height: auto;
}

.pinned-page {
    width: 160px;
}











/*****************************************************************************************************************************/
/*****************************************************************************************************************************/
/*****************************************************************************************************************************/
/*****************************************************************************************************************************/
/*****************************************************************************************************************************/
/*****************************************************************************************************************************/





















.fileUploadContainer {
    text-align: left;
}

    .fileUploadContainer .x-form-item {
        float: left;
    }

.fileUploadName {
    float: left;
    color: #888;
    margin-left: 5px;
    padding-top: 3px;
}

.ctype_pdf {
    background-image: url('/icons/page_white_acrobat-png/ext.axd');
}

#CalendarSummary {
    font-size: 11px;
}

/* 
	CALENDAR AGENDA SLOTS 
*/


.calendarPicker td.x-date-left {
    height: 30px;
}

.calendar-details .panel-header {
    background-color: #F5F5F5;
    border: 0px none;
}

.calendar-details .ext-cal-mdv {
    background-color: #F5F5F5;
}

    .calendar-details .ext-cal-mdv table {
        border: 1px solid #888;
    }









/*
	Forms 
*/

/*.x-form-text-wrap,
.x-form-text-wrap-toolbar,
.x-form-text-wrap-default {
	box-shadow: none;
	border: 1px solid #DDD;
}*/

body.mobile .x-form-text-wrap,
body.mobile .x-form-text-wrap-toolbar,
body.mobile .x-form-text-wrap-default {
    border: 0px none;
}

/*.x-form-text-wrap:hover,
.x-form-text-wrap-toolbar:hover,
.x-form-text-wrap-default:hover {
	border: 1px solid #C0C0C0;
}*/

/*.x-form-text-wrap.x-form-text-wrap-invalid:hover,
.x-form-text-wrap-toolbar.x-form-text-wrap-invalid:hover,
.x-form-text-wrap-default.x-form-text-wrap-invalid:hover {
	border-color: #FF7870;
}*/

/*.x-form-text, textarea.x-form-field {
	background-image: none;
}*/


/*.x-form-text-default {
	background-image: none;
}*/

.x-field-buttons-body .x-form-text,
.x-field-buttons-body .x-form-text:hover,
.x-field-buttons-body .x-form-text:focus {
    border: 0px none;
}


body.mobile .x-form-item,
body.mobile .field,
body.mobile .field-label {
    font-size: 16px;
}

.x-item-disabled {
    opacity: 1;
}



/*
	Progress Bar
*/

.x-progress-bar {
    background-color: #16a764;
    background-image: none;
    border: 0px;
    height: 18px;
}

.x-progress-wrap {
    border: 1px solid silver;
}

.x-progress-inner {
    background-color: transparent;
    background-image: none;
    border-color: silver;
}









/* =========== CARD LAYOUT REQUIREMENTS =========== */

.list.cards .list-header,
body.mobile .list .list-header {
    display: none;
}

body.mobile .list.cards {
}

.list.cards .list-grid > .panel-body {
    background-color: #F7F8FA;
}

.list.cards .list-grid .list-grid-row {
    padding: 10px 0;
    border: 0;
    border-bottom: 0px none;
}

    .list.cards .list-grid .list-grid-row:first-child {
        margin-top: 10px;
    }

    .list.cards .list-grid .list-grid-row:last-child {
        margin-bottom: 10px;
    }

body .list.cards .list-grid .list-grid-row.is-selected,
body .list.cards .list-grid .list-grid-row.is-over,
body .list.cards .list-grid .list-grid-row.is-selected + .list-grid-row,
body .list.cards .list-grid .list-grid-row.is-over + .list-grid-row {
    background-color: transparent;
    border: 0;
    border-bottom: 0px none;
}

.list.cards .x-grid-item.x-grid-item-selected .card {
    background-color: #F7F7F7;
}

.list.cards .list-cell-wrapper {
    padding-right: 0;
    padding-left: 0;
}

/* =========== CARD LAYOUT =========== */
.card {
    height: 175px;
    background-color: white;
    border-radius: 8px;
    box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.15);
    margin: 10px;
    padding: 12px;
    border-left: 8px solid transparent;
}

    .card.unknown {
        border-color: #CCC;
    }

    .card.positive {
        border-color: #109006;
    }

    .card.warning {
        border-color: #FAB450;
    }

    .card.danger {
        border-color: #EF5350;
    }

    .card.info {
        border-color: #055deb;
    }

    .card .header {
        border-bottom: 1px solid #DDD;
        padding-bottom: 8px;
        margin-bottom: 8px;
        display: flex;
        align-items: center;
    }

        .card .header > * + * {
            margin-left: 10px;
        }

        .card .header .title-image {
            height: 48px;
            width: 48px;
            border-radius: 50%;
            border: 2px solid #999;
            overflow: hidden;
            background-position: -1px -1px;
            background-size: 48px 48px;
            background-repeat: no-repeat;
            flex-shrink: 0;
        }

        .card .header .title-icon {
            flex-shrink: 0;
            display: flex;
            align-items: center;
            justify-content: center;
        }

    .card.assignable .header .title-image {
        order: 1;
    }

    .card.assignable .header .title-container {
        margin-left: 0;
        margin-right: 10px;
    }

    .card .header .title-image img {
        height: 48px;
        width: 48px;
        position: relative;
        top: -2px;
        left: -2px;
    }

    .card .header .title-container {
        float: left;
        overflow: hidden;
        text-overflow: ellipsis;
        width: calc(100% - 64px);
    }

    .card .header .title {
        font-size: 18px;
        text-overflow: ellipsis;
        overflow: hidden;
    }

    .card .header .sub-title {
        font-size: 14px;
        color: #777;
        margin-top: 2px;
        text-overflow: ellipsis;
        overflow: hidden;
    }

.card-date {
    color: #777;
    font-size: 12px;
}

.card .body {
}

    .card .body .row + .row {
        padding-top: 6px;
    }

    .card .body .label {
        font-size: 12px;
        font-weight: 600;
        margin-bottom: 2px;
    }

    .card .body .value {
        font-size: 14px;
        overflow: hidden;
        text-overflow: ellipsis;
    }

        .card .body .value .icon {
            padding-left: 16px;
        }


.list.entity-asset .card .header .title-image {
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEQAAABECAIAAAC3cQTlAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTM4IDc5LjE1OTgyNCwgMjAxNi8wOS8xNC0wMTowOTowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTcgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOkJFMTBCRTJGMkIyNzExRTc4RDY1RjdCNzUzRjdFRjkwIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOkJFMTBCRTMwMkIyNzExRTc4RDY1RjdCNzUzRjdFRjkwIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6QkUxMEJFMkQyQjI3MTFFNzhENjVGN0I3NTNGN0VGOTAiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6QkUxMEJFMkUyQjI3MTFFNzhENjVGN0I3NTNGN0VGOTAiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz4Vw5JsAAAEo0lEQVR42uya+1MbVRTHs5ttCgHsQECUV6CBlJAQwoYEhBY6QlVoqygjZXRaZxy1v/V3/wB/9zdn/LWd0VasSFs6iDOVDpSShoRAwiMPQkKIPJJgyAtrHh6bGeykLYTswtLOPXOHWTZ3b+7nnnO/5+wF7OMvrrBeFcNZr5AhGASDYBAMgkEwCAbBIBgEg2AQzMtqxL6Onp+Xq6ytPs4vhusF25JKO7267nrJYDAME5SWvCWX5WQfmzMtXOvth5t1NZKezg7PhndsYtKyaI/FYvR/L71nAATBrquprpWIAEgzZYD2Tzi8/ekRgiClYmisWEyrn1XrpsPhyGGEyc3JlkvFImH5utut0kyZrLYdOleU8ZWkNI/HmzWaJ6YMLs/GYYEpLS5sUpK5vByrzfHgkSb5mQF/o4Is4xe53J5RlWZxaZkxGBzHxSfKlWRNGoejmZ7Rzxl9/kAK42RlZkgqhWR11dbjxyqNzjBvjkajBy0AX1+5zOWmX++7MzUzT2U5YQnG1Fpo0qoTPR+eCwZD33z73UHnmcwMLigVbHeFrBq8RCnZ4TgMAkPBgDAsA9Jsdziv/tQnFJQ2yGWNitpJ/eyjSX0wFNrTINz0dIVMIpOINrybIyq10bJ4+VIPAzAYjsFP+HpohW/kn2qo+/JiN1w/UGm8Pt+ujx/LympUkrAWq2uu3luDyyurcRdRcTIFGKDBsHjug6n82Hfn9VxePSn9/JMu0CVQpzWX+7kPQjdQP9BAs9X2w83bT3cj2GwqyTR1mGgkMd/BtG79di+Dyz2pJD/tOg+/joxP2BzO7Q78ooKT9XKAmZk3f3/1RiAYfHbzMAMDxmbjz6ZwmOLgHyP3x9Uysej9d1s3/X7wEkQkBNVrmZlqnf7mwFAotPWCAdkp6zI1GAgyFvaiD2G6ccGFsuCz7s5AMDQ0PArJftfVYcYzkUgkmc0KACVFBUvLf+5KEvcMFZjUpeOJ8GD0lr1sHI8yAgOegUhLMh6x5HpCmLEYgYkvJM3vvTg7yhRMkuu9hx1MTQBShwENxen2zH8CEGUCBntSAtAOw5AAQHajG4ZiBZA6zFEOh3YB4HCOEASbAZjVddeFDzrKSoroIoGXs/a3m807Hh7sVwXwy8BQjbiys73N4VyBYmzT56dyvNbR1sJNS/v59qDV7mCm0NQZ5gzzprbmxq8uXlBP6ofHVHuNeIjVd043CQVl4xodlNhU9UNM1lN5PhqNma1204KNlFadalD4AwGXO/F0RiQUgN+cK2sJ96EG7Tr3XiAQutF/l0p00eOZbVt3e6719osqBOAlZa104PdhuLND/8I38ztaW0CI++4OUT9hohkmbrMmi9FihfeWS92ds0bLvdGHoa2/E/rAqxsAC0qLIahU2ima0xTFMEsw2DN2hxM2UmWF4ExLUzgchugqP873/OUF9WuQyz46ewaur/86YKPPIf/n8f37f7OSwoL21uZgaCs97Sgg5fGyCYKACIyfXeyH0eyZp83r803o9FDVwy7K4+Xcf6gGktROPRnYM8817fQMNNaBGPozIIJBMAgGwSAYBINgEAyCQTAIBsEcAvtXgAEAo8MAn8Up+88AAAAASUVORK5CYII=');
}





/* ADVANCED FILTERS */

.advanced-filter-editor {
}

    .advanced-filter-editor .x-panel-header-default-horizontal.x-header-noborder {
        padding: 0;
    }

    .advanced-filter-editor .treefield-tree {
    }

        .advanced-filter-editor .treefield-tree .x-toolbar {
            margin: 0 0 4px 0;
        }

    .advanced-filter-editor .advanced-filter-panel .x-grid-header-ct {
        margin: 8px 0 0 0;
    }

    .advanced-filter-editor .advanced-filter-panel .operators-tb {
        background-color: #FFFFFF;
        padding: 6px;
        margin: 4px 0 0 0;
    }

        .advanced-filter-editor .advanced-filter-panel .operators-tb .x-toolbar-text {
            font-size: 12px;
        }

/*.advanced-filter-editor .advanced-filter-panel .operators-tb .x-btn {
			border: 1px solid #DDD;
		}*/

.entity-fields-panel .entities-info-panel {
    background-color: #EEE;
    font-size: 12px;
    margin: 4px 0 0 0;
    padding: 6px 4px;
}


/*
	FILTER AREA       
*/

.listFilters {
    background-color: transparent;
}

.filter-toggle.btn.btn-icon:active,
.filter-toggle.btn.btn-icon.is-active,
.filter-toggle.btn.btn-icon.x-btn.is-active {
    border-color: transparent;
    color: inherit;
}

.list .advanced-filters-on {
    cursor: pointer;
}

/*body.mobile .filterField {
	padding-right: 10px;
	padding-left: 10px;
}*/


/*
	SCROLLBARS (Webkit only)
*/

::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track-piece {
    margin: 0;
}

::-webkit-scrollbar-thumb {
    background-color: rgba(158, 158, 158, 0.2);
    -webkit-border-radius: 2px;
}

    ::-webkit-scrollbar-thumb:hover {
        background-color: dimgray;
    }

::-webkit-scrollbar-button {
    width: 0px;
    height: 0px;
}

::-webkit-scrollbar-track {
    background-color: rgba(198, 198, 198, 0.2);
}

/*
	SCROLLBARS (FF64+ ONLY)
*/

* {
    scrollbar-width: thin;
}

/*
	Editors
*/

.x-editor .field {
    margin: 0;
}



















/* ============================== NAVIGATION BUTTON MENU ============================== */

.btn.btn-nav-menu,
.btn.btn-nav-menu:hover,
.btn.btn-nav-menu.is-over,
.btn.btn-nav-menu.x-btn.is-over,
.btn.btn-nav-menu:focus,
.btn.btn-nav-menu.is-focused,
.btn.btn-nav-menu.x-btn.is-focused,
.btn.btn-nav-menu:active,
.btn.btn-nav-menu.is-active,
.btn.btn-nav-menu.x-btn.is-active,
.btn.btn-nav-menu.is-menu-active,
.btn.btn-nav-menu.x-btn.is-menu-active {
    border: 1px solid #CCC;
}

    .btn.btn-nav-menu:disabled,
    .btn.btn-nav-menu.is-disabled,
    .btn.btn-nav-menu.x-btn.is-disabled {
        background-color: #E0E0E0;
        border-color: #E0E0E0;
        color: #999;
    }








.module.list .list-toolbar {
    /*padding: 8px 0 12px 0;*/
    padding: 0;
    margin-bottom: 12px;
}

body.mobile .module.list .list-toolbar {
    margin-bottom: 0;
    padding: 4px 6px;
    box-shadow: 0 2px 10px 0 rgb(0 0 0 / 10%);
    z-index: 2;
}

.analysis-toolbar.list-toolbar {
    margin: 0;
}

body.mobile .list-toolbar [id$=filterButton] {
    visibility: hidden;
}

body.mobile .list-toolbar .filter-clear {
    visibility: hidden;
}

body.mobile .list-toolbar .filterToggle .icon-sectioncollapsed {
    background-image: url(../Img/base/ico-filter.png);
}

body.mobile .list-toolbar .x-toolbar-separator-horizontal {
    visibility: hidden;
}






/* ============================== SIDE AREAS ============================== */

.portal-viewport > .x-region-collapsed-placeholder.panel-header {
    border-width: 0;
}

.portalWestContainer,
.portalEastContainer {
    background-color: #222;
    padding: 20px 10px 0 10px;
    border-top: 1px solid #444;
}

.layout-small-desktop .portalWestContainer,
.layout-small-desktop .portalEastContainer {
    padding: 10px 10px 0 10px;
}

.portalWestContainer .module-container .module-header,
.portalEastContainer .module-container .module-header {
    color: #FFF;
    font-weight: 300;
}

.portalWestContainer .x-tool-img,
.portalEastContainer .x-tool-img {
    filter: invert(1);
}


/* disabled nodes */
.x-tree-view .x-item-disabled {
    -moz-opacity: 0.5;
    opacity: .5;
}


/* ANALYSIS SPECIFIC */
.analysis-ct {
}

    .analysis-ct .filter-area-container {
        margin-bottom: 6px;
    }

.analysis-toolbar {
}

    .analysis-toolbar.list-toolbar {
    }

    .analysis-toolbar.compact-toolbar {
        background-color: #FFF;
    }

    .analysis-toolbar .x-label-value {
        vertical-align: inherit;
    }

    .analysis-toolbar .analysis-last-update {
        color: #777;
        font-size: 11px;
    }

    .analysis-toolbar .analysis-filters-label .x-label-value {
        color: #777;
        font-size: 11px;
    }

    .analysis-toolbar.dirty-filters .analysis-filters-label .x-label-value {
        color: #666;
        font-weight: 600;
        font-style: italic;
    }

.analysis-ct.pending-refresh {
}

    .analysis-ct.pending-refresh .x-mask {
        opacity: 0.9;
    }

    .analysis-ct.pending-refresh .x-mask-msg-text {
        padding: 0;
        background-image: none;
    }

    .analysis-ct.pending-refresh .pending-refresh-link {
        font-size: 16px;
        color: #000;
        background-repeat: no-repeat;
        background-position: 10px center;
        padding: 6px 12px 6px 28px;
        text-decoration: none;
        cursor: pointer;
    }

        .analysis-ct.pending-refresh .pending-refresh-link:hover {
            background-color: #DFDFDF;
        }

body.mobile .analysis-ct.pending-refresh .pending-refresh-link {
    opacity: 1;
}


/* TILE ANALYSIS */
.tile-array,
.TileArray {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
}

    .tile-array.tile-array-wrap,
    .TileArray.tile-array-wrap {
        flex-wrap: wrap;
    }

.tile,
.Tile {
    padding: 4px 12px 8px 12px;
    width: 160px;
    height: 70px;
    flex-shrink: 0;
    line-height: normal;
    border: 1px solid #CCC;
    border-left-width: 4px;
    border-radius: 4px;
    cursor: pointer;
    transition-property: box-shadow;
    transition-duration: 0.2s;
}

body.mobile .tile,
body.mobile .Tile {
    border-left-width: 8px;
    border-radius: 8px;
}

.tile-array .tile + .tile,
.TileArray .Tile + .Tile {
    margin-left: 12px;
}

.tile-array.tile-array-wrap .tile,
.TileArray.tile-array-wrap .Tile {
    margin: 0 12px 12px 0;
}

.is-unstyled .tile-array,
.is-unstyled .TileArray {
    margin-left: 8px;
}

.is-unstyled .tile,
.is-unstyled .Tile {
    background-color: #FFF;
    box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.1);
    border-width: 0 0 0 4px;
}

body.mobile .is-unstyled .tile,
body.mobile .is-unstyled .Tile {
    box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.15);
    border-width: 0 0 0 8px;
    border-radius: 8px;
}

.is-unstyled .tile:hover,
.is-unstyled .Tile:hover {
    box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.2);
}


.tile-text,
.TileText {
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.tile-title,
.TileTitle {
    font-size: 32px;
    font-weight: 500;
    color: #055DEB;
}

.tile-good,
.TileGood {
    border-left-color: #109006;
}

.tile-highlight,
.tile-bad,
.TileBad {
    border-left-color: #EF5350;
}

.tile-warn,
.TileWarn {
    border-left-color: #FAB450;
}

/* SMALL TILE ANALYSIS WITH ICON */

.small-tiles {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}

    .small-tiles .small-tile {
        width: calc(50% - 16px);
        height: 75px;
        border: 1px solid #ddd;
        border-radius: 4px;
        margin: 4px;
        padding: 8px;
        display: flex;
        flex-direction: column;
    }

        .small-tiles .small-tile.empty-space {
            border: none;
        }

        .small-tiles .small-tile > div {
            display: flex;
        }

            .small-tiles .small-tile > div:first-of-type > i {
                background-color: #aaa;
                color: #FFFFFF;
                width: 30px;
                height: 30px;
                line-height: 30px;
                border-radius: 50%;
                display: inline-block;
                text-align: center;
                float: left;
                padding-left: 1px;
            }

            .small-tiles .small-tile > div:last-of-type {
                align-items: stretch;
                margin-top: 8px;
            }

                .small-tiles .small-tile > div:last-of-type > span {
                    text-align: right;
                    font-size: 14px;
                }

                    .small-tiles .small-tile > div:last-of-type > span:first-of-type {
                        width: 0; /*placeholder to insert extra data in future (eg: percentage change)*/
                    }

                    .small-tiles .small-tile > div:last-of-type > span:last-of-type {
                        width: 100%;
                    }

            .small-tiles .small-tile > div:first-of-type > i.good {
                background-color: #2cc48a;
            }

            .small-tiles .small-tile > div:first-of-type > i.warn {
                background-color: #FAB450;
            }

            .small-tiles .small-tile > div:first-of-type > i.bad {
                background-color: #EF5350;
            }

            .small-tiles .small-tile > div:first-of-type > span:last-of-type {
                font-size: 12px;
                line-height: 30px;
                width: calc(100% - 30px);
                padding-left: 8px;
            }

                .small-tiles .small-tile > div:first-of-type > span:last-of-type.longtext {
                    overflow: hidden;
                    text-overflow: ellipsis;
                    display: -webkit-box;
                    -webkit-line-clamp: 2;
                    -webkit-box-orient: vertical;
                    line-height: 15px;
                }


/* ACCOUNT INFO */
.AccountInfo {
    /*padding: 8px;*/
}

    .AccountInfo DIV:only-child {
        background-color: transparent;
    }

    .AccountInfo IMG {
        margin: 8px;
        border-radius: 50%;
    }

.AccountInfo {
    font-size: 14px;
    margin-top: 2px;
}

.InfoLink {
    cursor: pointer;
}

    .InfoLink:hover {
        text-decoration: underline;
    }

.AccountInfo .InfoTitle {
    font-size: 24px;
}

.AccountInfo .InfoBadge {
    font-weight: 600;
    font-size: 12px;
    padding: 4px;
    text-align: center;
    float: left;
    margin-top: 6px;
    margin-right: 4px;
}

.AccountInfo .InfoSubtitle {
    font-size: 18px;
}

.CostCenterInfo {
    margin: 10px 0;
}

/* CONVERSATION */
.Conversation {
}

.ConversationItem {
    float: left;
    width: 100%;
    margin-left: 8px;
    margin-right: 8px;
    margin-top: 4px;
    font-size: 12px;
}

IMG.ConversationPhoto {
    width: 32px;
    height: 32px;
    margin: 4px;
    border: 1px solid silver;
}

.ConversationRight {
    color: #666;
    background-color: white;
    padding: 4px;
    width: 80%;
    float: right;
}

.ConversationLeft {
    color: #666;
    background-color: silver;
    float: left;
    padding: 4px;
    width: 80%;
}

.ConversationContent {
}

.ConversationRightFooter {
    font-size: 10px;
    float: right;
    margin-top: 4px;
    color: #666;
}

.ConversationLeftFooter {
    font-size: 10px;
    float: left;
    margin-top: 4px;
    color: #666;
}

.ConversationLeftPointer {
    float: left;
    width: 1px;
    height: 1px;
    border-style: none;
    border-left: 15px solid transparent;
    border-top: 15px solid silver;
    position: relative;
    top: 10px;
}

.ConversationRightPointer {
    float: right;
    margin-right: 8px;
    width: 1px;
    height: 1px;
    border-style: none;
    border-right: 15px solid transparent;
    border-top: 15px solid white;
    position: relative;
    top: 10px;
}

/* TICKET SLA STATUS */
.SLAStatus {
    font-size: 12px;
    width: 100%;
    color: #666;
}

.SLAStatusItem {
    margin: 8px;
    background-color: white;
    border-left: 8px solid #F4f4f4;
}

div.SLAGridLabelContainer div {
    margin-left: 2px;
}

div.SLAGridItem div {
    float: left;
}

div.SLAGridIcon {
    width: 10px;
    height: 10px;
    border-radius: 8px;
    background-color: #E0E0E0;
}

div.SLAGridLabel {
    font-size: 9px;
    border-radius: 8px;
    padding: 4px;
    background-color: #E0E0E0;
}

div.ServiceLevel1 {
    background-color: #EF5350;
    color: white;
}

div.ServiceLevel2 {
    background-color: #109006;
    color: white;
}

/* SOLICIT */
div.Solicit {
    width: 16px;
    height: 16px;
    background-image: url(../../../icons/bell-png/ext.axd);
}

/* Warning message with icon on the left */
.warningMessage {
    background-image: url(../../../icons/exclamation-png/ext.axd);
    background-repeat: no-repeat;
    color: red;
    padding-left: 20px;
    margin-left: 5px;
    margin-right: 5px;
}

.icon-ko {
    background-image: url(../../../icons/exclamation-png/ext.axd) !important;
    background-repeat: no-repeat;
}

.icon-ok {
    background-image: url(../../../icons/tick-png/ext.axd) !important;
    background-repeat: no-repeat;
}

/* Grid Context Menu */
.list-ctx-menu {
    width: 16px;
    height: 16px;
    font-size: 16px;
    cursor: pointer;
    transform: rotate(90deg);
    align-self: center;
}

.x-panel-bbar:hover .x-toolbar-left {
    visibility: visible;
}



/* Advanced Search/Reporting Styles */
.configurable-dg-colsettings-window {
}

.configurable-dg-colsettings-form {
}

    .configurable-dg-colsettings-form .x-toolbar .x-toolbar-item {
        background: transparent;
    }

.repField {
    background-image: url(../../../icons/table_column-png/ext.axd);
    background-repeat: no-repeat;
    background-position: left;
    padding-left: 20px;
}

.repOperatorAND {
    background-image: url(../Img/base/ico-and.png);
    background-repeat: no-repeat;
    background-position: left;
    padding-left: 20px;
}

.repOperatorOR {
    background-image: url(../Img/base/ico-or.png);
    background-repeat: no-repeat;
    background-position: left;
    padding-left: 20px;
}



.x-form-trigger-wrap:hover .x-trigger-cell.trigger-visible {
    display: table-cell !important;
}












/*
	We need these "overrides" in order to get the browse button working on mobile devices.
	These styles keep the input type=file over the target element and keep the browse button in right position to be "selected"
 */
body.mobile .moxie-shim {
    z-index: 100 !important;
}

    body.mobile .moxie-shim input {
        z-index: 101 !important;
        font-size: initial !important;
    }

body.mobile .uploadstatusbase .uploadbutton {
    visibility: visible;
}


/* REPORT */

.report-line {
    padding: 6px;
    cursor: pointer;
    display: flex;
    align-items: center;
}

    .report-line .icon::before {
        font-size: 32px;
        color: #444;
    }

.report-item-body {
    margin-left: 10px;
}

    .report-item-body .report-item-title {
        font-size: 18px;
    }

    .report-item-body .report-item-desc {
        font-size: 12px;
        color: #777;
    }









/* BRAIN BUSINESS WORKFLOW */
table.aa-workflow {
    width: 100%;
    height: 52px;
    max-height: 52px;
    background: #FAB450;
    text-align: right;
}

    table.aa-workflow td {
        height: 52px;
        max-height: 52px;
        background: #FAB450 url(../Img/aa-arrow.png) left bottom no-repeat;
        text-align: center;
        font-size: 12px;
        color: #333;
        max-width: 100px;
    }

        table.aa-workflow td.aa-last-child {
            background-color: #FFF;
        }

        table.aa-workflow td.aa-first-child {
            height: 52px;
            max-height: 52px;
            background: #EEE url(../Img/aa-gradient.png) right center no-repeat;
            width: 52px;
        }

.aa-workflow-status-container {
    background-image: none;
    color: #ccc;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 36px 0;
}

    .aa-workflow-status-container .aa-workflow-status {
        text-align: center;
        background-repeat: no-repeat;
        background-position: bottom;
        background-size: 48px 48px;
        position: relative;
        flex-shrink: 0;
    }

.aa-workflow-status {
    height: 48px;
    width: 48px;
    border-radius: 50%;
}

.aa-workflow-status-canceled {
    background: url(../Img/WF/canceled48.gif) no-repeat center;
}

.aa-workflow-status-completed {
    background: url(../Img/WF/complete48.gif) no-repeat center;
}

.aa-workflow-status-failed {
    background: url(../Img/WF/failed48.gif) no-repeat center;
}

.aa-workflow-status-pending {
    background: url(../Img/WF/pending48.gif) no-repeat center;
}

.aa-workflow-status-resumable {
    background: url(../Img/WF/resumable48.gif) no-repeat center;
}

.aa-workflow-status-running {
    background: url(../Img/WF/running48.gif) no-repeat center;
}

.aa-workflow-status-scheduled {
    background: url(../Img/WF/scheduled48.gif) no-repeat center;
}

.aa-workflow-status-description-container {
    margin-top: 12px;
    text-align: center;
    max-width: 400px;
}

.aa-workflow-status-title {
    font-weight: 600;
    font-size: 14px;
    color: #222;
    text-transform: uppercase;
}

.aa-workflow-status-description {
    font-size: 12px;
    color: #666666;
    padding-top: 4px;
}


.clearContainer {
    position: absolute;
    top: 4px;
    right: 4px;
    width: 16px;
    height: 16px;
    display: none;
    z-index: 2;
}

/* TINYMCE EDITOR */
.mce-widget.mce-btn.mce-browsebutton input[type="file"][accept=".jpg,.jpeg,.png,.gif"] {
    opacity: 0;
}

.mce-window .mce-dropzone {
    border: 1px dashed #BEBEBE;
    background-color: #FEFEFE;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.icon-Failed, .x-tree-icon.icon-Failed {
    background: url('../Img/WF/fail.gif') no-repeat;
    padding: 5px 0 5px 30px;
    border: 0;
}

.icon-Canceled, .x-tree-icon.icon-Canceled {
    background: url('../Img/WF/canceled.gif') no-repeat;
    padding: 5px 0 5px 30px;
    border: 0;
}

.icon-Completed, .x-tree-icon.icon-Completed {
    background: url('../Img/WF/complete.gif') no-repeat;
    padding: 5px 0 5px 30px;
    border: 0;
}

.icon-Pending, .x-tree-icon.icon-Pending {
    background: url('../Img/WF/pending.gif') no-repeat;
    padding: 5px 0 5px 30px;
    border: 0;
}

.icon-Resumable, .x-tree-icon.icon-Resumable {
    background: url('../Img/WF/resumable.gif') no-repeat;
    padding: 5px 0 5px 30px;
    border: 0;
}

.icon-Running, .x-tree-icon.icon-Running {
    background: url('../Img/WF/running.gif') no-repeat;
    padding: 5px 0 5px 30px;
    border: 0;
}

.icon-Scheduled, .x-tree-icon.icon-Scheduled {
    background: url('../Img/WF/scheduled.gif') no-repeat;
    padding: 5px 0 5px 30px;
    border: 0;
}

.wfItem {
    padding: 5px;
    cursor: pointer;
    border: 1px solid transparent;
}

/*
	POWERFINDER SPECIFIC 
*/
.pfSearch input.x-form-text:hover,
.pfSearch input.x-form-text:focus {
    border-width: 0px;
}

.pfItem {
    padding: 18px 10px 10px 10px;
    cursor: pointer;
    border: 1px solid transparent;
    margin-right: 10px;
    word-break: break-word;
    border-top: 1px solid #E0E0E0;
    transition-property: background-color, border-color, color, opacity;
    transition-duration: 0.2s;
}

    .pfItem + .pfItem {
        border-top: 1px solid #E0E0E0;
    }

    .pfItem:hover {
        background-color: #F0F0F0;
    }

    .pfItem .pfItemTitle {
        margin-top: 3px;
        margin-bottom: 2px;
        padding-bottom: 4px;
        text-wrap: none;
        font-size: 16px;
        font-weight: 600;
        color: #222;
    }

    .pfItem.pfItemHL .pfItemTitle {
    }

    .pfItem .pfItemCatalog {
        text-wrap: none;
        margin-top: 0px;
        font-size: 14px;
        margin-bottom: 2px;
        padding-bottom: 4px;
        color: #6d6d6d;
        font-weight: 600;
    }

    .pfItem .pfItemCommands {
        display: inline-block;
        margin-top: 10px;
        opacity: 0;
        transition-property: opacity;
        transition-duration: 0.2s;
    }

    .pfItem:hover .pfItemCommands {
        opacity: 1;
    }

    .pfItem .pfItemCommands div {
        float: left;
    }

        .pfItem .pfItemCommands div:hover {
            text-decoration: underline;
        }

    .pfItem .pfItemCommands .powerfinder-command {
        line-height: 14px;
    }

        .pfItem .pfItemCommands .powerfinder-command + .powerfinder-command {
            margin-left: 10px;
        }

        .pfItem .pfItemCommands .powerfinder-command::before {
            font-size: 14px;
            padding-right: 5px;
        }

    .pfItem .pfItemCommands .icon-powerfinder-open::before {
        content: "\f13e";
    }

    .pfItem .pfItemCommands .icon-powerfinder-use::before {
        content: "\f1cb";
    }

    .pfItem .pfItemCommands .icon-powerfinder-use-solution::before {
        content: "\f1cb";
    }

    .pfItem .pfItemAbstract {
        display: none;
    }

    .pfItem .pfItemSolution {
        display: none;
    }

    .pfItem.pfItemHL .pfItemAbstract,
    .pfItem.pfItemHL .pfItemSolution {
        display: block;
        font-size: 14px;
        color: #6d6d6d;
    }

.panel-body.portal-tab-body .power-finder-container::before,
.floating-panel.sliding-panel:has(.power-finder-container)::before {
    content: "";
    height: 5px;
    width: 100%;
    position: absolute;
    border-radius: 5px;
    background: linear-gradient(90deg, #7342CC 0%, #feb91659 40%, #FFF 78%);
    top: 0;
    left: 0;
}


.powerFinderTitle {
    font-size: 18px;
}

    .powerFinderTitle > i {
        color: #7342CC;
        font-size: 20px;
        margin-right: 5px;
    }

    .powerFinderTitle > span {
        font-weight: 300;
    }

    .powerFinderTitle span:first-child {
        font-weight: 600;
    }

.pf-content-placeholder {
    border: 3px solid red;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

    .pf-content-placeholder .placeholder-text {
        border: 1px solid blue;
    }

    .pf-content-placeholder .placeholder-image {
        flex: 1;
        border: 1px solid green;
    }

.pf-result-tooltip {
}

    .pf-result-tooltip > * + * {
        margin-top: 0.5rem;
    }

    .pf-result-tooltip label {
        display: block;
        font-weight: 600;
        font-size: 16px;
    }

    .pf-result-tooltip p {
        display: -webkit-box;
        -webkit-line-clamp: 10;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }









/* Document*/

.list.entity-document .document-details * + *:before {
    content: "-";
    margin: 0 6px;
}

.supportscrollbar {
    padding: 0 18px 0 0;
}

div.TicketUnreadIcon {
    width: 16px;
    height: 16px;
    background: url(../../../Client/Resources/Img/base/ico-set-as-unread.png) no-repeat center;
    color: white;
    background-position: left center;
    background-repeat: no-repeat;
    margin-top: 10px;
}

div.MessageUnreadIcon {
    width: 16px;
    height: 16px;
    background: url(../../../Client/Resources/Img/base/ico-message-unread.png) no-repeat center;
    color: white;
    background-position: left center;
    background-repeat: no-repeat;
    margin-top: 10px;
}

div.LockedIcon {
    width: 16px;
    height: 16px;
    background: url(../Img/base/ico-locked.png) no-repeat left center;
    background-size: 13px 13px;
    margin: 2px 0 2px 0;
}

body .icon-messageUnread {
    background-image: url(../Img/base/ico-message-unread.png);
}

.icon-subscribe:before {
    content: "\f180";
}

.icon-unsubscribe:before {
    content: "\f180";
}

/* MAIL */
.mail-item-User {
    background: url(../../../Client/Resources/Img/EMailAddresses/user-icon.png) no-repeat 11px 7px;
}

.mail-item-Account {
    background: url(../../../Client/Resources/Img/EMailAddresses/account-icon.png) no-repeat 11px 7px;
}

.mail-item-Warehouse {
    background: url(../../../Client/Resources/Img/EMailAddresses/warehouse-icon.png) no-repeat 11px 7px;
}

.mail-item-Contact {
    background: url(../../../Client/Resources/Img/EMailAddresses/contact-icon.png) no-repeat 11px 7px;
}

.mail-item-Supplier {
    background: url(../../../Client/Resources/Img/EMailAddresses/supplier-icon.png) no-repeat 11px 7px;
}

.mail-item-UserGroup {
    background: url(../../../Client/Resources/Img/EMailAddresses/group-icon.png) no-repeat 11px 7px;
}

.mail-item {
    height: 48px;
    width: 48px;
    float: left;
    background-size: 31px;
}

.mail-item-body {
    float: left;
    margin-left: 10px;
}

    .mail-item-body div {
        font-size: 13px;
        border-top: 2px;
        color: gray;
    }

        .mail-item-body div:first-child {
            color: black;
            font-size: 19px;
        }

.mail-line {
    border: 1px solid transparent;
    padding-top: 5px;
    cursor: pointer;
}

/* USER PROFILE */
.userProfile {
    margin: 3px;
}

    .userProfile IMG {
        border-radius: 32px;
        border: 1px solid silver;
        float: left;
        margin-right: 8px;
        width: 32px;
        height: 32px;
    }

    .userProfile DIV {
        float: left;
    }

    .userProfile H1 {
        font-size: 14px;
        margin: 1px;
    }

    .userProfile H2 {
        font-size: 10px;
        color: gray;
        margin: 1px;
    }

/* END USER PROFILE */

.vote {
    width: 50px;
    float: left;
}

.vote-up, .vote-down {
    height: 15px;
    cursor: pointer;
}

.vote-result {
    margin-top: 5px;
    margin-bottom: 5px;
    text-align: center;
    font-size: 15px;
    font-weight: 600;
}

.vote-up-off {
    background-image: url(../Img/base/vote_up_off.png) !important;
    background-repeat: no-repeat;
    background-position: center;
}

.vote-up-on {
    background-image: url(../Img/base/vote_up_on.png) !important;
    background-repeat: no-repeat;
    background-position: center;
}

.vote-down-off {
    background-image: url(../Img/base/vote_down_off.png) !important;
    background-repeat: no-repeat;
    background-position: center;
}

.vote-down-on {
    background-image: url(../Img/base/vote_down_on.png) !important;
    background-repeat: no-repeat;
    background-position: center;
}

.faqContainer {
    cursor: auto;
}

.userInfo {
    min-width: 100px;
}

    .userInfo TD {
        white-space: normal;
    }

        .userInfo TD:first-child {
            padding-right: 10px;
        }

            .userInfo TD:first-child IMG {
                border-radius: 32px;
                border: 1px solid silver;
                width: 32px;
                height: 32px;
            }

.validation-icon,
.validation-result-ct .validation-message {
    height: 24px;
    width: 24px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
}

.validation-success::before,
.validation-result-ct .validation-success::before {
    font-family: "pat-icons";
    font-weight: 600;
    content: "\f144";
    color: #109006;
}

.validation-failure::before,
.validation-result-ct .validation-failure::before {
    font-family: "pat-icons";
    font-weight: 600;
    content: "\f110";
    color: #EF5350;
}

.validation-warning::before,
.validation-result-ct .validation-warning::before {
    font-family: "pat-icons";
    font-weight: 600;
    content: "\f145";
    color: #FAB450;
}

.validation-info::before,
.validation-result-ct .validation-info::before {
    font-family: "pat-icons";
    font-weight: 600;
    content: "\f146";
    color: #055deb;
}

/*******************************************************************************WIZARD******************************************* */

.portal-wizard .wizard-page-container.panel-body {
    padding-top: 10px;
}

.portal-wizard .panel-title {
    padding-left: 0;
}

.portal-wizard .wizard-page-container {
}

.portal-wizard h1 {
    color: #444;
    font-size: 18px;
    font-weight: normal;
}

.portal-wizard .wizard-message {
    margin: 1rem 0;
}

.portal-wizard fieldset {
    margin-top: 10px;
}

.portal-wizard .x-fieldset-header {
    margin-bottom: 2px;
}

.portal-wizard .wizard-extended-description {
    margin-bottom: 20px;
}

.portal-wizard .field-selection-row {
    margin: 5px 0 0 0;
}

.portal-wizard .field-selection-checkbox {
    margin: 0 10px 0 0;
}

    .portal-wizard .field-selection-checkbox label {
        visibility: hidden;
    }

.portal-wizard .fields-configuration-label .x-form-item-label-inner {
    padding: 2px !important;
}

.portal-wizard .wizard-toolbar {
}

.wizard-bottom-container.wizard-bottom-large .btn {
    font-size: 18px;
    min-width: 140px;
    margin: 10px 6px;
}

.wizard-footer-notes {
}

.wiz-footer-std-content {
}

    .wiz-footer-std-content div {
    }

/* WIZARD MILESTONE */
.wiz-mstone-ct {
}

.portal-wizard .mstone-container {
    text-align: center;
    margin-top: 20px;
    overflow-x: hidden;
    padding: 2px 0px 0px 0px;
}

.portal-wizard .mstone .icon {
    font-size: 3em;
    line-height: 1.36em;
    margin: auto;
    height: 68px;
    width: 68px;
    border: transparent 2px solid;
    font-family: "pat-font";
    border-radius: 50%;
}

.portal-wizard .icon h1 {
    font-size: 0.88em;
}

/* QUESTI SONO GLI STATUS */
.portal-wizard .mstone {
    display: inline-block;
    margin: 0px 10px 0px 10px;
    font-size: 16px;
    width: 125px;
    text-overflow: clip;
    white-space: nowrap;
    overflow: hidden;
}

    .portal-wizard .mstone h1 {
        padding: 4px 6px;
        border-radius: 14px;
    }

.portal-wizard .todo h1 {
    color: #FAB450;
}

.portal-wizard .disable h1 {
    color: #e6e6e6;
}

.portal-wizard .current h1 {
    color: #ffffff;
    background-color: #FAB450;
}

.portal-wizard .processed h1 {
    color: #FAB450;
    background-color: transparent;
}

.portal-wizard .todo .icon {
    background-color: #e6e6e6;
    border-color: #FAB450;
}

.portal-wizard .disable .icon {
    background-color: #e6e6e6;
    border-color: #e6e6e6;
    color: #ffffff;
}

.portal-wizard .current .icon, .portal-wizard .processed .icon {
    background-color: #FAB450;
    border-color: #FAB450;
    color: #ffffff;
}

.portal-wizard .todo .icon::before {
    color: #FAB450;
}

/* WIZARD FIELD */
.portal-wizard .x-field label {
    font-size: 12px;
}


.portal-wizard .x-form-field {
    font-size: 14px;
    padding: 4px;
}

.portal-wizard .section .x-box-layout-ct .x-box-inner {
    margin-bottom: 18px;
}

/* WIZARD TAB */
.portal-wizard .portalTab .x-tab-bar .x-box-inner {
    background-color: transparent;
}

.portal-wizard .portalTab span.x-tab-inner {
    color: #999999;
}

.portal-wizard .portalTab .x-tab {
    background-color: #FFFFFF;
}

    .portal-wizard .portalTab .x-tab.x-tab-active,
    .portal-wizard .portalTab .x-tab.x-tab-over {
        background-color: #F5F5F5;
    }

.portal-wizard .portalTab .x-tab-active span.x-tab-inner,
.portal-wizard .portalTab .x-tab-over span.x-tab-inner {
    color: #666666;
}

.portal-wizard .portalTab .x-tab-bar-strip {
    top: 32px !important;
}

.portal-wizard .portalTab .portalTabBody {
    top: 33px !important;
    border-top: 2px solid #F5F5F5;
    padding-top: 10px;
}

/* WIZARD CONDITION FORM */
.condition-input .wizard-form.x-panel.wizard-form.x-panel-default,
.condition-input .wizard-form.x-panel.wizard-form.x-panel-default .x-panel-body.x-panel-body-default.x-box-layout-ct.x-panel-body-default,
.condition-input .wizard-form.x-panel.wizard-form.x-panel-default .x-panel-body.x-panel-body-default.x-box-layout-ct.x-panel-body-default .x-box-inner {
    height: 100px !important;
}


/* WIZARD GRID ------------------------------------------*/
.portal-wizard .listViewGrid .x-toolbar.paging-toolbar {
    display: none;
}

/* JOBS */

.job-status-container {
    width: 380px;
    height: 75px;
    border: 2px #E6E6E6 solid;
    overflow: hidden;
    margin: auto;
    position: relative;
    top: 120px;
    padding: 10px 10px 8px 10px;
}

.job-status {
    height: 48px;
    width: 48px;
    float: left;
    border-radius: 50%;
}

.job-status-small {
    height: 24px;
    width: 24px;
    float: left;
}

.job-pnl-status {
    vertical-align: middle;
}

.job-status-created, .job-status-0 {
    background: url(../Img/Statuses/pending48.gif) no-repeat center;
}

.job-status-scheduled, .job-status-1 {
    background: url(../Img/Statuses/scheduled48.gif) no-repeat center;
}

.job-status-running, .job-status-2 {
    background: url(../Img/Statuses/running48.gif) no-repeat center;
}

.job-status-succeeded, .job-status-3 {
    background: url(../Img/Statuses/complete48.gif) no-repeat center;
}

.job-status-failed, .job-status-4 {
    background: url(../Img/Statuses/failed48.gif) no-repeat center;
}

.job-status-created-small, .job-status-0-small {
    background: url(../Img/Statuses/pending.gif) no-repeat center;
}

.job-status-scheduled-small, .job-status-1-small {
    background: url(../Img/Statuses/scheduled.gif) no-repeat center;
}

.job-status-running-small, .job-status-2-small {
    background: url(../Img/Statuses/running.gif) no-repeat center;
}

.job-status-succeeded-small, .job-status-3-small {
    background: url(../Img/Statuses/complete.gif) no-repeat center;
}

.job-status-failed-small, .job-status-4-small {
    background: url(../Img/Statuses/fail.gif) no-repeat center;
}

.job-status-description-container {
    width: 300px;
    padding-left: 8px;
    text-align: left;
    display: inline-block;
}

.job-status-title {
    font-weight: 300;
    font-size: 22px;
    color: #666666;
    line-height: 20px;
}

.job-status-description {
    font-size: 12px;
    padding-top: 4px;
}

.module.list .job-status-small {
    float: none;
    display: block;
    background-position: center center;
    border-radius: 50%;
    margin: 0 auto;
}

.job-details {
    display: flex;
}

    .job-details .job-details-status {
        width: 48px;
        height: 48px;
    }

    .job-details .job-data {
        padding-left: 12px;
    }

        .job-details .job-data > * + * {
            margin-top: 8px;
        }

    .job-details .job-title {
        font-size: 16px;
    }

    .job-details .job-data-item {
        font-size: 12px;
    }

    .job-details a {
        text-decoration: underline;
    }

        .job-details a:hover {
            text-decoration: none;
        }

    .job-details .job-final-status {
        font-weight: 600;
    }

.job-viewer-import .x-fieldset {
    margin: 0;
    padding: 0;
}


/* IMPORT */
.import-upload {
}

    .import-upload .wizard-form {
    }

.validation-grid {
}

    .validation-grid .validation-cell {
    }

    .validation-grid .row-highlight .validation-cell .cell-desc {
        font-weight: 600;
    }

    .validation-grid .validation-cell .cell-input {
        color: #777;
    }

    .validation-grid .validation-cell .cell-desc {
        font-size: 12px;
    }

    .validation-grid .validation-cell .cell-success {
    }

    .validation-grid .validation-cell .cell-failure .cell-desc {
        color: #EF5350;
    }

    .validation-grid .validation-cell .cell-warning .cell-desc {
        color: #FAB450;
    }

    .validation-grid .validation-cell.validation-status {
        vertical-align: middle;
    }

/* 
	(Chrome v56) Fix for wrong field height calculation (fields with notes and FlagComboBoxes)
	http://forums.ext.net/showthread.php?61747-Chrome-V56-and-field-height-wrong-in-certain-cases-(eg-Field-Notes)&p=281171#post281171
 */
.field-body {
    /*height: initial;*/
    vertical-align: top;
}

.livespell_textarea {
    border: 0px !important;
}

.mce-i-javascriptspellcheck:before {
    content: "\e024"
}

.mce-i-javascriptaddattachment:before {
    content: "\e034"
}

.mce-i-javascriptaddsignature:before {
    content: "\e026"
}

.mce-i-javascriptmanagetranslations {
    background-image: url('../Img/base/ico-translate.png') !important;
}

.mce-i-speechrecognition {
    font-family: "Font Awesome 6 Pro" !important;
}

    .mce-i-speechrecognition::before {
        content: "\f131";
    }

    .mce-i-speechrecognition.fa-microphone.blink::before {
        content: "\f130";
        padding-left: 4px;
        animation: blink 2s ease-in-out infinite;
    }

.mce-i-javascriptvariable {
    font-family: "Font Awesome 6 Pro" !important;
    font-weight: 300;
}

    .mce-i-javascriptvariable:before {
        content: "\f303";
    }

.infopanel-flat {
    box-shadow: 0 0px 0px #ccc;
    border-radius: 0;
}

    .infopanel-flat .x-infopanel-body {
        padding: 4px 6px;
    }

.infopanel-content {
    font-size: 10px;
    padding-left: 4px;
}

    .infopanel-content > b {
        padding-left: 6px;
        padding-right: 6px;
    }

.infopanel-info {
    padding-right: 20px;
    vertical-align: middle;
    background-repeat: no-repeat;
}


.templateTag {
    border-color: black;
    border-left: 8px solid transparent;
}



/*
	DIAGNOSTICS
*/
#diagnostics-body {
    margin: 10px;
}

    #diagnostics-body .validation-icon {
        font-size: 18px;
    }

    #diagnostics-body .validation-icon-big {
        font-size: 24px;
    }

    #diagnostics-body .config-category {
        margin: 0 0 6px 0;
    }

        #diagnostics-body .config-category .panel-header {
            border: 0px none;
            cursor: pointer;
        }

    #diagnostics-body .config-module {
    }

        #diagnostics-body .config-module .disabled {
            color: #AAA;
        }

        #diagnostics-body .config-module .validation-icon, #diagnostics-body .config-module .validation-icon-big {
            float: left;
            width: 24px;
        }

        #diagnostics-body .config-module .validation-icon-big {
            margin-right: 6px;
        }

    #diagnostics-body .config-module-content {
        padding: 6px;
        margin: 6px;
        background-color: #eee;
        border-radius: 6px;
    }

        #diagnostics-body .config-module-content h1 {
            font-size: 18px;
            margin: 0 0 4px 0;
            padding: 0 0 2px 0;
            border: none;
            display: table;
            width: 100%;
        }

    #diagnostics-body h1.failure {
        color: #FF0000;
    }

    #diagnostics-body .config-module-content h1 .text {
        display: table-cell;
        vertical-align: middle;
        width: 100%;
        padding-top: 4px;
    }

    #diagnostics-body .config-module-content h1 .status {
        font-size: 14px;
    }

    #diagnostics-body .config-module-content h2 {
        font-size: 12px;
        margin: 6px 0 12px 0px;
        padding: 0 0 0 4px;
        display: table;
        width: 100%;
    }

        #diagnostics-body .config-module-content h2 .text {
            display: table-cell;
            vertical-align: middle;
        }

    #diagnostics-body .config-module-content h3 {
        font-size: 12px;
        margin: 6px 0 6px 0;
        padding: 0 0 4px 0;
        cursor: pointer;
        text-decoration: underline;
    }

        #diagnostics-body .config-module-content h3:hover {
            text-decoration: none;
        }

    #diagnostics-body .config-module .config-status {
        margin: 0 0 0 30px;
    }

    #diagnostics-body .config-module table {
        width: 100%;
        margin: 0;
        padding: 0;
    }

    #diagnostics-body .hidden {
        display: none;
    }

    #diagnostics-body .config-module tr {
        background-color: white;
    }

        #diagnostics-body .config-module tr.failure {
            color: #FF0000;
        }

        #diagnostics-body .config-module tr.even {
        }

    #diagnostics-body .config-module th {
        padding: 4px;
        text-align: left;
        border-bottom: 1px solid #EEE;
    }

    #diagnostics-body .config-module td {
        padding: 4px;
        border-bottom: 1px solid #EEE;
    }

/*
	SIGNALR
*/
#signalr-connection-status {
    position: absolute;
    top: 3px;
    height: 6px;
    width: 6px;
    border-radius: 50%;
    background-color: #DDD;
    flex: none;
    top: 2px;
    left: 23px;
}

    #signalr-connection-status.signalr-connected {
        /*border-color: transparent lime transparent transparent;*/
        background-color: lime;
    }

    #signalr-connection-status.signalr-disconnected {
        /*border-color: transparent tomato transparent transparent;*/
        background-color: tomato;
    }

    #signalr-connection-status.signalr-reconnecting {
        /*border-color: transparent yellow transparent transparent;*/
        background-color: yellow;
    }

    #signalr-connection-status.signalr-connectionslow {
        /*border-color: transparent lightsteelblue transparent transparent;*/
        background-color: lightsteelblue;
    }



/* DURATION (QUICK TASKS, COMMESSE, SCHEDULED TASK) */
.duration-ct {
    border: 1px solid #FAB450;
    position: relative;
}

    .duration-ct.overwork {
        border-color: red;
    }

        .duration-ct.overwork .duration-value {
            background-color: #FCDDDC;
        }

    .duration-ct.day {
        overflow: hidden;
    }

    .duration-ct .duration-value {
        height: 100%;
        background-color: #FAB450;
        width: 0;
    }

    .duration-ct .consumed-duration-value {
        height: 20px;
        background-color: #F75D59;
        width: 0;
    }

    .duration-ct .duration-desc {
        font-weight: 600;
        position: absolute;
        top: 6px;
        left: 8px;
    }

    .duration-ct.scheduled-task {
        border-color: #82d0f2;
    }

        .duration-ct.scheduled-task .duration-value {
            background-color: #82d0f2;
        }

.hierarchy-module-tree-ct,
.hierarchy-module-preview-ct {
    padding-left: 3px;
    padding-right: 3px;
}



.x-field-custom-error {
    background-color: #FCF8E3;
    border-color: #8A6D3B;
}

.x-tip-form-invalid-warning {
    border-color: #8A6D3B;
    -webkit-box-shadow: #FCF8E3 0 1px 0 0 inset,#FCF8E3 0 -1px 0 0 inset,#FCF8E3 -1px 0 0 0 inset,#FCF8E3 1px 0 0 0 inset;
    -moz-box-shadow: #FCF8E3 0 1px 0 0 inset,#FCF8E3 0 -1px 0 0 inset,#FCF8E3 -1px 0 0 0 inset,#FCF8E3 1px 0 0 0 inset;
    box-shadow: #FCF8E3 0 1px 0 0 inset,#FCF8E3 0 -1px 0 0 inset,#FCF8E3 -1px 0 0 0 inset,#FCF8E3 1px 0 0 0 inset;
    background-color: white;
}

.x-tip-body-form-invalid-warning {
    background: 1px 1px no-repeat;
    background-image: url(/PAT.CRM.Portal/extjs/packages/ext_theme_gray/build/resources/images/shared/warning-gif/ext.axd);
}




/* ============================== CONTENT PLACEHOLDER ============================== */
.content-placeholder {
    background-image: none;
    color: #ccc;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    text-align: center;
}

body .content-placeholder::before {
    font-family: "pat-font" !important;
    font-style: normal !important;
    font-weight: normal !important;
    font-variant: normal !important;
    font-size: 160px;
    text-transform: none !important;
    speak: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.content-placeholder .placeholder-text {
    font-size: 14px;
    color: #999;
}

body.mobile .content-placeholder .placeholder-text {
    font-size: 12px;
}

.content-placeholder.preview::before,
.content-placeholder.no-results::before,
.content-placeholder.analysis::before {
    content: "\e031";
}

.content-placeholder.error:before {
    content: "\e06c";
}

.content-placeholder:has([class^="preview-"]) {
    justify-content: center;
}

.content-placeholder [class^="preview-"] {
    height: 50%;
    width: 50%;
    max-width: 400px;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}

body .content-placeholder.content-placeholder-text-top {
    flex-direction: column-reverse;
}

.content-placeholder .preview-ufo,
.content-placeholder.content-placeholder-text-top .preview-ufo::after {
    background-image: url(../Img/base/placeholder-ufo.png);
}

.content-placeholder .preview-telescope,
.content-placeholder.content-placeholder-text-top .preview-telescope::after {
    background-image: url(../Img/base/placeholder-telescope.png);
}

.content-placeholder .preview-rabbit,
.content-placeholder.content-placeholder-text-top .preview-rabbit::after {
    background-image: url(../Img/base/placeholder-rabbit.png);
}



/* PLACEHOLDER CONTAINERS */
.module-container.load-error .panel-body,
.portal-tab.load-error .panel-body,
.window.load-error .panel-body,
.analysis-placeholder-ct {
    background-color: #FAFAFA;
    padding: 20px;
}

/* Visibility in AssignedUseroOrGroup TreeField filter*/
.leaf-userOrGroup-invisible span {
    opacity: 0.6;
}

.leaf-userOrGroup-disabled span {
    text-decoration: line-through;
}

/* CUSTOM FIELDS EDITOR */

.x-fieldset.customfield-type-settings {
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
    padding-right: 0;
}






/* ============================== NOTIFICATIONS ============================== */
.notification-panel {
    border: 0px none;
    border-radius: 0;
}

    .notification-panel panel-body {
        padding: 0;
    }

.notification-item {
    display: grid;
    grid-template-columns: auto 1fr auto;
    grid-template-rows: auto;
    grid-template-areas: "icon body close";
    /*grid-gap: 1rem;*/
    padding: 0.5rem;
    border-width: 1px 1px 1px 4px;
    border-color: transparent;
    border-style: solid;
    transition-property: background-color, border-color, color, opacity;
    transition-duration: 0.2s;
}

    .notification-item .notification-header {
        grid-area: header;
        display: none;
        flex-wrap: nowrap;
        overflow: hidden;
        margin-bottom: 0.5rem;
    }

    .notification-item .notification-type-icon {
        grid-area: icon;
        margin-right: 0.5rem;
    }

        .notification-item .notification-type-icon::before {
            font-weight: bold;
        }

    .notification-item .notification-body {
        grid-area: body;
        align-self: center;
        line-height: 1.25em;
        overflow: hidden;
    }

    .notification-item .notification-actions {
        grid-area: actions;
        display: none;
        text-overflow: ellipsis;
        overflow: hidden;
        margin-top: 0.5rem;
    }

    .notification-item .notification-dismiss {
        grid-area: close;
        cursor: pointer;
        margin-left: 0.5rem;
    }

        .notification-item .notification-dismiss::before {
            font-size: 14px;
        }

    .notification-item .notification-header > * + * {
        /*margin-left: 0.5rem;*/
    }

    .notification-item .notification-title {
        flex: 1;
        font-size: 16px;
        font-weight: 600;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
        text-transform: uppercase;
        align-self: center;
    }

    .notification-item .notification-icon {
        flex-shrink: 0;
        width: 20px;
        height: 20px;
        font-size: 20px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .notification-item .notification-type-icon::before {
        font-family: "pat-icons" !important;
        display: inline-block !important;
        line-height: 1 !important;
        font-weight: bold;
        font-style: normal !important;
        text-decoration: none !important;
        text-transform: none !important;
        text-rendering: auto !important;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        speak: none;
        font-size: 18px;
    }


    /* Single-line notification */

    .notification-item.is-single-line {
    }


        .notification-item.is-single-line .notification-body,
        .notification-item .is-single-line {
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
        }


    /* Notification with title */

    .notification-item.has-title {
        grid-template-columns: 1fr;
        grid-template-rows: auto 1fr;
        grid-template-areas: "header" "body";
    }

        .notification-item.has-title .notification-header {
            display: flex;
            align-items: center;
        }


    /* Notification with actions */

    .notification-item.has-actions {
        grid-template-columns: auto 1fr auto;
        grid-template-rows: min-content min-content;
        grid-template-areas: "icon body close" ". actions .";
    }

        .notification-item.has-actions .notification-actions {
            display: flex;
            align-items: center;
        }


    /* Notification with title and actions */

    .notification-item.has-title.has-actions {
        grid-template-columns: 1fr;
        grid-template-rows: min-content min-content min-content;
        grid-template-areas: "header" "body" "actions";
    }


    /* Clickable notifications */

    .notification-item.is-clickable {
        cursor: pointer;
    }

        .notification-item.is-clickable:hover {
        }


    /* ============================== NOTIFICATION TYPES ============================== */

    .notification-item.notification-type-negative {
        border-left-color: #EF5350;
        background-color: #FCDDDC;
    }

        .notification-item.notification-type-negative .notification-title,
        .notification-item.notification-type-negative .notification-icon {
            color: #EF5350;
        }

        .notification-item.notification-type-negative .notification-type-icon::before {
            content: "\f110";
        }

        .notification-item.notification-type-negative.is-clickable:hover {
            border-color: #EF5350;
        }



    .notification-item.notification-type-warning {
        border-left-color: #FAB450;
        background-color: #FEF0DC;
    }

        .notification-item.notification-type-warning .notification-title,
        .notification-item.notification-type-warning .notification-icon {
            color: #FAB450;
        }

        .notification-item.notification-type-warning .notification-type-icon::before {
            content: "\f145";
        }

        .notification-item.notification-type-warning.is-clickable:hover {
            border-color: #FAB450;
        }


    .notification-item.notification-type-positive {
        border-left-color: #109006;
        background-color: #CFE8CD;
    }

        .notification-item.notification-type-positive .notification-title,
        .notification-item.notification-type-positive .notification-icon {
            color: #109006;
        }

        .notification-item.notification-type-positive .notification-type-icon::before {
            content: "\f144";
        }

        .notification-item.notification-type-positive.is-clickable:hover {
            border-color: #109006;
        }



    .notification-item.notification-type-info {
        border-left-color: #055deb;
        background-color: #C3DAFF;
    }

        .notification-item.notification-type-info .notification-title,
        .notification-item.notification-type-info .notification-icon {
            color: #055deb;
        }

        .notification-item.notification-type-info .notification-type-icon::before {
            content: "\f146";
        }

        .notification-item.notification-type-info.is-clickable:hover {
            border-color: #055deb;
        }



    .notification-item.notification-type-neutral {
        border-left-color: transparent;
        background-color: #444;
        color: #DDD;
    }

        .notification-item.notification-type-neutral .notification-title,
        .notification-item.notification-type-neutral .notification-icon {
            color: #DDD;
        }

        .notification-item.notification-type-neutral.is-clickable:hover {
            border-color: #DDD;
        }



    /* ============================== NOTIFICATIONS - FILL ALL ============================== */

    .notification-item.fill-all-space {
        margin: 0;
        width: 100%;
        height: 100%;
    }



    /* ============================== NOTIFICATIONS - COMPACT ============================== */

    .notification-item.compact {
        width: 100%;
        padding: 2px 6px;
    }

        .notification-item.compact .notification-body {
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }

/* ============================== NOTIFICATIONS - DETAIL ============================== */

.detail .notification-item {
    margin-bottom: 16px;
}

/* ============================== NOTIFICATIONS - TOASTS ============================== */
.notification-toast-ct {
    background-color: transparent;
    box-shadow: 0 6px 15px 0 rgba(34, 34, 34, 0.4);
    border-radius: 4px;
    /* Toast Messages Shown Behind Modal-Window */
    z-index: 100000 !important;
}

body.mobile .notification-toast-ct {
    box-shadow: 0 -6px 15px 0 rgba(34, 34, 34, 0.4);
    border-radius: 0;
}

.notification-toast {
    padding: 16px;
    border-top: 0px;
    border-bottom: 0px;
    border-right: 0px;
}

    .notification-toast .notification-header {
        margin-bottom: 1rem;
    }

body.mobile .notification-toast {
    padding: 30px;
}




/* ------------------------------ Dark Toasts ------------------------------ */
/*
	.notification-toast,
	.notification-toast.notification-type-info,
	.notification-toast.notification-type-positive,
	.notification-toast.notification-type-warning,
	.notification-toast.notification-type-negative,
	.notification-toast.notification-type-neutral {
		background-color: #444;
		color: #CCC;
	}

	.notification-toast.notification-type-negative {
		border-left-color: #dc6765;
	}

		.notification-toast.notification-type-negative .notification-type-icon,
		.notification-toast.notification-type-negative .notification-title,
		.notification-toast.notification-type-negative .notification-dismiss {
			color: #dc6765;
		}


	.notification-toast.notification-type-warning {
		border-left-color: #FAB450;
	}

		.notification-toast.notification-type-warning .notification-type-icon,
		.notification-toast.notification-type-warning .notification-title,
		.notification-toast.notification-type-warning .notification-dismiss {
			color: #FAB450;
		}

	.notification-toast.notification-type-positive {
		border-left-color: #41b738;
	}

		.notification-toast.notification-type-positive .notification-type-icon,
		.notification-toast.notification-type-positive .notification-title,
		.notification-toast.notification-type-positive .notification-dismiss {
			color: #41b738;
		}

	.notification-toast.notification-type-info {
		border-left-color: #588ee4;
	}

		.notification-toast.notification-type-info .notification-type-icon,
		.notification-toast.notification-type-info .notification-title,
		.notification-toast.notification-type-info .notification-dismiss {
			color: #588ee4;
		}

	.notification-toast.notification-type-neutral {
		border-left-color: transparent;
	}
	*/





/* ============================== NOTIFICATIONS - BANNERS ============================== */
.notification-banner-ct {
    box-shadow: none;
    background-color: transparent;
}

.notification-banner {
    border-width: 1px 1px 1px 4px;
    border-color: transparent;
    border-radius: 4px;
}

.notification-banner-ct.no-margin .notification-item {
    margin: 0;
}

/* ============================== NOTIFICATIONS - MODALS (MESSAGE BOXES) ============================== */
.notification-modal {
}

body.mobile .notification-modal > .panel-body {
    padding: 14px;
}

.notification-modal .x-message-box-icon {
    font-family: "pat-icons";
    font-weight: normal;
    font-size: 23px;
    background-image: none;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    width: 24px;
    height: 24px;
}

.notification-modal.notification-modal .x-message-box-icon {
    background-image: none;
}

.notification-modal .x-message-box-icon.x-message-box-question::before {
    content: "\f198"; /* icon-question*/
}

.notification-modal.notification-type-neutral .x-message-box-icon::before {
    content: "\f146"; /* icon-info*/
}

.notification-modal.notification-type-info .x-message-box-icon::before {
    content: "\f146"; /* icon-info*/
    color: #055deb;
}

.notification-modal.notification-type-positive .x-message-box-icon::before {
    content: "\f144"; /* icon-success*/
    color: #109006;
}

.notification-modal.notification-type-warning .x-message-box-icon::before {
    content: "\f145"; /* icon-warning*/
    color: #FAB450;
}

.notification-modal.notification-type-negative .x-message-box-icon::before {
    content: "\f110"; /* icon-error*/
    color: #EF5350;
}

.notification-modal .toolbar {
    margin-top: 14px;
    padding: 0 20px;
}




/* ============================== FORM VALIDATION MESSAGES ============================== */

.form-messages {
}

.form-message {
}

    .form-message + .form-message {
        margin-top: 12px;
    }

.form-message-title {
    font-weight: 600;
}





/* ============================== OPERATION LOG ============================== */
.operationlog-container {
    border: 1px solid transparent;
    margin-top: 5px;
    margin-bottom: 5px;
    padding-top: 5px;
    cursor: pointer;
}

.operationlog-item {
}

    .operationlog-item::before {
        font-size: 24px;
    }

.operationlog-item-0 {
    color: #109006;
}

.operationlog-item-1 {
    color: #FAB450;
}

.operationlog-item-2 {
    color: #EF5350;
}

.operationlog-item-0::before {
    content: "\f102";
}

.operationlog-item-1::before {
    content: "\f10d";
}

.operationlog-item-2::before {
    content: "\f10b";
}

.operationlog-item-body {
    margin-left: 20px;
}

    .operationlog-item-body .operationlog-item-title > * + * {
        margin-left: 6px;
    }

    .operationlog-item-body .operationlog-item-operation-type {
        font-weight: 600;
    }

    .operationlog-item-body .operationlog-item-detail {
        font-size: 12px;
        color: #777;
    }

        .operationlog-item-body .operationlog-item-detail > * + *::before {
            content: "-";
            margin: 0 6px 0 6px;
        }


.operationlog-detail-ct {
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-rows: auto 1fr;
    grid-template-areas:
        "image header"
        ". body";
    align-items: center;
    gap: 1rem;
    height: 100%;
    margin: 0 1rem;
}

    .operationlog-detail-ct .operationlog-detail-image {
        grid-area: image;
    }

    .operationlog-detail-ct .operationlog-detail-header {
        grid-area: header;
    }

        .operationlog-detail-ct .operationlog-detail-header > * + * {
            margin-top: 6px;
        }

    .operationlog-detail-ct .operationlog-detail-body {
        grid-area: body;
        height: 100%;
    }


    .operationlog-detail-ct .operationlog-detail-title {
        font-size: 18px;
    }

    .operationlog-detail-ct .operationlog-detail-type {
        font-weight: 600;
    }

    .operationlog-detail-ct .operationlog-detail-title > * + * {
        margin-left: 6px;
    }

    .operationlog-detail-ct .operationlog-detail-details {
        color: #777;
    }

        .operationlog-detail-ct .operationlog-detail-details > * + *::before {
            content: "-";
            margin: 0 6px 0 6px;
        }


.operationLogChangeItems .operationlog-detail-image {
    height: 64px;
    width: 64px;
    border-radius: 50%;
    max-width: 100%;
    min-width: 64px;
}

.operationLogChangeItems .operationLogDetailContainer {
    display: block;
    margin-top: 10px;
    margin-left: 20px;
    float: left;
    height: 50px;
}

.operationLogChangeItems .operationLogDetailTitle {
    font-size: 18px;
}

.operationLogChangeItems .operationLogDetail {
    font-size: 12px;
    float: left;
}

    .operationLogChangeItems .operationLogDetail .operationLogUsername {
        font-weight: 600;
    }

    .operationLogChangeItems .operationLogDetail .operationLogDate {
        margin-left: 15px;
        color: #BFBFBF;
    }

.operationLogChangeItems .fieldsTable {
    width: 100%;
}

.operationLogChangeItems .fieldsColumn {
    width: 33%;
    border-bottom: 1px solid #EAEAEA;
    padding-top: 10px;
    padding-bottom: 10px;
}

.operationLogChangeItems .fieldsColumn-header {
    font-family: "pat-font";
    text-align: center;
    color: gray;
    font-size: 32px;
    border-bottom: none;
    padding-top: 0px;
    padding-bottom: 0px;
}

.operationLogChangeItems .fieldsColumn-fieldName {
    font-weight: 600;
}

.operationLogChangeItems .fieldsColumn-oldValue {
    color: #C1C1C1;
}

.operationLogChangeItems .fieldsColumn-newValue {
    color: #878787;
}

.operationlog-detail-ct .operationlog-item-empty {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .operationlog-detail-ct .operationlog-item-empty::before {
        font-size: 128px;
        color: #F0F0F0;
    }

.operationlog-detail-ct .operation-log-changes {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-gap: 0.5rem;
}

.operationlog-detail-ct .operation-log-change-header {
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 600;
}

    .operationlog-detail-ct .operation-log-change-header .icon::before {
        font-size: 18px;
    }


.operationlog-detail-ct .operation-log-change-field {
    font-weight: 600;
}

.operationlog-detail-ct .operation-log-change-oldvalue {
    color: #999;
}




/* GDPR show password in export report */
.export-placeholder-line2 {
    position: relative;
    left: 35%;
}

body .icon-editImage {
    font-family: "pat-font";
    color: #464646;
    width: 16px;
    height: 16px;
    padding-top: 8px;
}

    body .icon-editImage:before {
        content: '\e007';
        font-size: 12px;
    }

body .icon-like {
    font-family: "pat-font";
}

    body .icon-like:before {
        content: '~';
        font-size: 14px;
    }

body .icon-unlike {
    font-family: "pat-font";
    color: #464646;
    width: 16px;
    height: 16px;
    padding-top: 2px;
}

    body .icon-unlike:before {
        content: '\\';
        font-size: 12px;
    }










/* =========== RATING =========== */

.rating-wrapper {
    display: inline-block;
    vertical-align: middle;
}

.rating .rate-base-layer span,
.rating .rate-select-layer span,
.rating .rate-hover-layer span {
    font-size: 18px;
    font-family: "pat-icons" !important;
    font-style: normal !important;
    font-weight: normal !important;
    font-variant: normal !important;
    text-transform: none !important;
    speak: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    display: inline-block;
    vertical-align: middle;
    color: #fec747;
}

    .rating .rate-base-layer span::before,
    .rating .rate-select-layer span::before,
    .rating .rate-hover-layer span::before {
        content: "\f180"; /* star icon */
    }

.rating .rate-select-layer span,
.rating .rate-hover-layer span {
    font-weight: bold !important; /* solid icon */
}


/* ============================== USE CONDITIONS ============================== */

.use-conditions {
    background-color: #777;
}

    .use-conditions .use-conditions-toolbar {
        padding-top: 15px;
    }

body.mobile .use-conditions .use-conditions-toolbar {
    padding-bottom: 15px;
}

.use-conditions .use-conditions-ct {
    border-radius: 4px;
    background-color: #FFF;
    box-shadow: 0 6px 15px 0 rgba(34, 34, 34, 0.4);
    border: 0px none;
    margin: 0px;
    padding-bottom: 20px;
}

@media (min-width: 992px) {

    .use-conditions .use-conditions-ct {
        margin-left: 15vw;
        margin-right: 15vw;
    }
}

@media (min-height: 768px) {

    .use-conditions .use-conditions-ct {
        margin-top: 10vh;
        margin-bottom: 10vh;
    }
}

.use-conditions .use-conditions-ct .x-panel-header {
    font-size: 24px;
    font-weight: 600;
    letter-spacing: 1px;
    padding: 8px 12px;
}

.use-conditions .use-conditions-text {
    padding: 0 15px;
}

.use-conditions .btn-scroll .x-btn-inner {
    text-align: left;
    position: relative;
    width: 24px;
    padding: 0;
}

    .use-conditions .btn-scroll .x-btn-inner:before {
        font-family: "pat-font";
        color: #333;
        content: 'A';
        font-size: 22px;
        position: absolute;
        top: -2px;
    }


/* ============================== ACCORDION DATAVIEW ============================== */

.accordion-dview {
}

    .accordion-dview .accordion-dview-item {
        margin-right: 6px;
        border: 0;
        border-top: 1px solid #E0E0E0;
        transition-property: background-color, border-color, color, opacity;
        transition-duration: 0.2s;
    }

body.mobile .accordion-dview .accordion-dview-item {
    margin-right: 0;
}

.accordion-dview .accordion-dview-item:last-child {
    border-bottom: 1px solid #E0E0E0;
}

.accordion-dview .accordion-dview-item-header {
    padding: 12px 5px 12px 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
}

    .accordion-dview .accordion-dview-item-header .item-header-content {
        flex: 1;
        white-space: nowrap;
        overflow: hidden;
    }

        .accordion-dview .accordion-dview-item-header .item-header-content * + * {
            margin-top: 6px;
        }

    .accordion-dview .accordion-dview-item-header .icon-expand-collapse:before {
        content: "\e049";
        font-family: 'pat-font' !important;
    }

    .accordion-dview .accordion-dview-item-header .item-header-title {
        font-size: 16px;
        font-weight: 600;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .accordion-dview .accordion-dview-item-header .item-header-time {
        font-size: 14px;
        color: #6D6D6D;
    }

.accordion-dview .accordion-dview-item-body {
    padding: 0;
    margin: 0;
}

.accordion-dview .accordion-dview-item-body-content {
    padding: 12px;
}

.accordion-dview .accordion-dview-item.is-over .accordion-dview-item-header,
.accordion-dview .accordion-dview-item.is-selected .accordion-dview-item-header {
    background-color: #F0F0F0;
    transition-property: background-color, border-color, color, opacity;
    transition-duration: 0.2s;
}

    .accordion-dview .accordion-dview-item.is-selected .accordion-dview-item-header .icon-expand-collapse:before {
        content: "\e04a";
        font-family: 'pat-font' !important;
    }


/******************************* ADVANCED FILTER *******************************/
/*
	PALETTE:
	operator AND:   #E6BB49;
	operator OR:    #3BB34A;
	operator NAND:  #6E86D4;
	operator NOR:   #C4476A;
*/

.entity-fields-panel,
.advanced-filter-panel,
.configurable-data-grid {
    margin-bottom: 0px;
}

    .configurable-data-grid .sort-toolbar {
        padding: 12px 0 0 0;
    }

    .configurable-data-grid .sort-btn {
        padding: 0.25em;
        background-color: #E0E0E0;
        border-radius: 4px;
        font-weight: normal;
        text-transform: none;
    }

        .configurable-data-grid .sort-btn.is-over,
        .configurable-data-grid .sort-btn.is-focused,
        .configurable-data-grid .sort-btn.is-active {
            background-color: #F0F0F0;
        }

.entities-info-panel {
    border: 1px solid #C0C0C0;
    padding: 8px;
    margin: 4px 0;
}

.entity-fields-panel .filter-match {
    font-weight: 600;
}

.entity-fields-panel .x-tree-icon-parent,
.entity-fields-panel .x-tree-icon-leaf {
    display: none;
}

.entity-fields-panel .fieldicon {
    font-size: 19px;
    padding-right: 6px;
    vertical-align: middle;
    /* override in application css file to use application specific colors */
    /* color: #808080; */
}

.entity-fields-panel .x-grid-row:hover .fieldicon {
}

.entity-fields-panel .x-form-trigger-wrap .x-form-trigger.icon-cross {
    vertical-align: middle;
    border-width: 1px 1px 1px 0px;
    opacity: 0.7;
}

.advanced-filter-editor .advanced-filter-panel .x-grid-header-ct {
    margin: 0;
}

.advanced-filter-panel .x-grid-item.x-grid-item-selected {
    background-color: #FFFFFF;
    border-color: #FFFFFF;
}

.advanced-filter-panel .x-grid-item.x-grid-item-over {
    background-color: #FFFFFF;
    border-color: #FFFFFF;
}


.advanced-filter-panel .node-selected {
    opacity: 1;
    font-weight: 600;
}

.advanced-filter-panel .node-unselected {
    opacity: 0.3;
}

.advanced-filter-panel .value-cell-empty-text {
    font-size: 12px;
    font-style: italic;
}

.advanced-filter-panel .node-selected .value-cell-empty-text {
    opacity: 0.5;
}

.advanced-filter-panel .node-unselected .value-cell-empty-text {
}

.advanced-filter-panel .x-tree-icon {
    display: none;
}

.advanced-filter-panel .x-grid-cell-advancedFilterPanel_VisibilityColumn .icon-visible {
    opacity: 0.8;
}

.advanced-filter-panel .x-grid-cell-advancedFilterPanel_VisibilityColumn,
.advanced-filter-panel .x-grid-cell-advancedFilterPanel_RemoveColumn {
    /*padding: 0;*/
    max-width: 30px;
}

    .advanced-filter-panel .x-grid-cell-advancedFilterPanel_VisibilityColumn .icon-not-visible.icon-mask,
    .advanced-filter-panel .x-grid-cell-advancedFilterPanel_RemoveColumn .icon-cross {
        opacity: 0.3;
    }

        .advanced-filter-panel .x-grid-cell-advancedFilterPanel_VisibilityColumn .icon-not-visible:hover,
        .advanced-filter-panel .x-grid-cell-advancedFilterPanel_RemoveColumn .icon-cross:hover {
            opacity: 1;
        }

.advanced-filter-panel .operators-tb .x-form-cb-label-toolbar {
    margin-top: 2px;
}

.advanced-filter-panel-editor.field .field-content-wrapper {
    border-width: 1px;
}

body .filter-group,
body .filter-group:hover {
    padding: 4px;
    border: 2px solid;
    border-radius: 16px;
}

    body .filter-group.filter-group-and {
        border-color: #E6BB49;
    }

        body .filter-group.filter-group-and:hover {
            background-color: #E6BB49;
        }

            body .filter-group.filter-group-and:hover .x-btn-inner.x-btn-inner-default-toolbar-small {
                color: #FFFFFF;
            }

        body .filter-group.filter-group-and .x-btn-inner.x-btn-inner-default-toolbar-small {
            font-weight: 600;
            font-size: 14px;
            color: #E6BB49;
        }

    body .filter-group.filter-group-or {
        border-color: #3BB34A;
    }

        body .filter-group.filter-group-or:hover {
            background-color: #3BB34A;
        }

            body .filter-group.filter-group-or:hover .x-btn-inner.x-btn-inner-default-toolbar-small {
                color: #FFFFFF;
            }

        body .filter-group.filter-group-or .x-btn-inner.x-btn-inner-default-toolbar-small {
            font-weight: 600;
            font-size: 14px;
            color: #3BB34A;
        }

    body .filter-group.filter-group-nand {
        border-color: #6E86D4;
    }

        body .filter-group.filter-group-nand:hover {
            background-color: #6E86D4;
        }

            body .filter-group.filter-group-nand:hover .x-btn-inner.x-btn-inner-default-toolbar-small {
                color: #FFFFFF;
            }

        body .filter-group.filter-group-nand .x-btn-inner.x-btn-inner-default-toolbar-small {
            font-weight: 600;
            font-size: 14px;
            color: #6E86D4;
        }

    body .filter-group.filter-group-nor {
        border-color: #C4476A;
    }

        body .filter-group.filter-group-nor:hover {
            background-color: #C4476A;
        }

            body .filter-group.filter-group-nor:hover .x-btn-inner.x-btn-inner-default-toolbar-small {
                color: #FFFFFF;
            }

        body .filter-group.filter-group-nor .x-btn-inner.x-btn-inner-default-toolbar-small {
            font-weight: 600;
            font-size: 14px;
            color: #C4476A;
        }



.filter-group-and .x-tree-node-text {
    font-weight: 600;
    border: 2px solid;
    border-radius: 16px;
    padding: 1px 8px;
    border-color: #E6BB49;
    color: #E6BB49;
}

.filter-group-or .x-tree-node-text {
    font-weight: 600;
    border: 2px solid;
    border-radius: 16px;
    padding: 1px 8px;
    border-color: #3BB34A;
    color: #3BB34A;
}

.filter-group-nand .x-tree-node-text {
    font-weight: 600;
    border: 2px solid;
    border-radius: 16px;
    padding: 1px 8px;
    border-color: #6E86D4;
    color: #6E86D4;
}

.filter-group-nor .x-tree-node-text {
    font-weight: 600;
    border: 2px solid;
    border-radius: 16px;
    padding: 1px 8px;
    border-color: #C4476A;
    color: #C4476A;
}

.parent-filter-group-and .x-tree-elbow-img.x-tree-elbow,
.parent-filter-group-and .x-tree-elbow-img.x-tree-elbow-end,
.parent-filter-group-and .x-tree-elbow-img.x-tree-elbow-plus.x-tree-expander,
.parent-filter-group-and .x-tree-elbow-img.x-tree-elbow-end-plus.x-tree-expander {
    /*border-left: 2px solid;
	border-color: red;*/
}

.parent-filter-group-or .x-tree-elbow-img.x-tree-elbow,
.parent-filter-group-or .x-tree-elbow-img.x-tree-elbow-end,
.parent-filter-group-or .x-tree-elbow-img.x-tree-elbow-plus.x-tree-expander,
.parent-filter-group-or .x-tree-elbow-img.x-tree-elbow-end-plus.x-tree-expander {
    /*border-left: 2px solid;
	border-color: green;*/
}

.parent-filter-group-nand .x-tree-elbow-img.x-tree-elbow,
.parent-filter-group-nand .x-tree-elbow-img.x-tree-elbow-end,
.parent-filter-group-nand .x-tree-elbow-img.x-tree-elbow-plus.x-tree-expander,
.parent-filter-group-nand .x-tree-elbow-img.x-tree-elbow-end-plus.x-tree-expander {
    /*border-left: 2px solid;
	border-color: blue;*/
}

.parent-filter-group-nor .x-tree-elbow-img.x-tree-elbow,
.parent-filter-group-nor .x-tree-elbow-img.x-tree-elbow-end,
.parent-filter-group-nor .x-tree-elbow-img.x-tree-elbow-plus.x-tree-expander,
.parent-filter-group-nor .x-tree-elbow-img.x-tree-elbow-end-plus.x-tree-expander {
    /*border-left: 2px solid;
	border-color: cornflowerblue;*/
}


.advanced-filter-panel .x-grid-cell-inner.x-grid-cell-inner-treecolumn {
    /*display: inline-block;*/
}

.advanced-filter-panel .icon-change-type.advancedFilterPanel-icon {
    margin-left: 6px;
    opacity: 0.7;
    cursor: pointer;
}

.advanced-filter-panel .icon-refresh.advancedFilterPanel-icon:hover {
    opacity: 1;
}

.advanced-filter-panel .filter-group-and .icon-change-type.advancedFilterPanel-icon {
    color: #E6BB49;
}

.advanced-filter-panel .filter-group-or .icon-change-type.advancedFilterPanel-icon {
    color: #3BB34A;
}

.advanced-filter-panel .filter-group-nand .icon-change-type.advancedFilterPanel-icon {
    color: #6E86D4;
}

.advanced-filter-panel .filter-group-nor .icon-change-type.advancedFilterPanel-icon {
    color: #C4476A;
}



/******************************* KANBAN *******************************/

.kanban {
}

    .kanban .kanban-toolbar {
        margin-bottom: 12px;
    }

    .kanban .webixbutton.add {
        color: #1CA1C1;
        font-size: 20px;
        padding: 0 4px 0 0;
        vertical-align: middle;
    }

    .kanban .webix_kanban {
        background-color: transparent;
    }

    .kanban .webix_kanban_list {
        background-color: transparent;
        border: none;
    }

    .kanban .webix_kanban_list_item {
        background-color: transparent;
    }

    .kanban .standard-column .webix_view.webix_kanban_sub_header,
    .kanban .drop-only-column .webix_view.webix_kanban_sub_header,
    .kanban .standard-column .webix_template {
        background: #eeeeee;
        border-radius: 4px;
        text-transform: uppercase;
    }

    .kanban .standard-column .webix_template {
        align-items: center;
        display: flex;
        flex-direction: row;
    }

    .kanban .webix_view .webix_kanban_sub_header .webix_template {
        text-overflow: ellipsis;
        overflow: hidden;
        justify-content: flex-start;
    }

    .kanban .webix_view.drop-only-column .webix_kanban_sub_header {
        padding: 0;
        text-align: center;
    }

    .kanban .webix_view.drop-only-column.webix_layout_line {
    }

    .kanban .drop-only-column .webix_view.webix_list.webix_kanban_list {
        overflow: hidden !important;
        text-align: center;
        color: #999;
        background-color: #eeeeee;
    }

        .kanban .drop-only-column .webix_view.webix_list.webix_kanban_list:after {
            font-family: "pat-font" !important;
            font-style: normal !important;
            font-weight: normal !important;
            font-variant: normal !important;
            text-transform: none !important;
            speak: none;
            line-height: 1;
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
        }

        .kanban .drop-only-column .webix_view.webix_list.webix_kanban_list:after {
            font-size: 80px;
            content: "\e02a";
        }

    .kanban .webix_kanban_list_content {
        border-color: #bbbbbb;
    }

    .kanban .kanban-container.empty {
        text-align: center;
        vertical-align: middle;
        color: #999;
        font-size: 22px;
        display: grid;
    }

        .kanban .kanban-container.empty:before {
            font-size: 300px;
        }

    .kanban .webix_kanban_sub_header .webix_strong {
        font-weight: 600;
    }

    .kanban .kanban-statistics {
        line-height: 32px;
        margin-left: auto;
    }


.kanban-card {
    background-color: white;
    box-shadow: 0 6px 10px 0 rgba(0,0,0,.1);
    padding: 12px;
    line-height: normal;
    margin-bottom: 5px;
    margin-left: 10px;
    margin-right: 10px;
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
    border-right: 1px solid #eee;
    border-left: 4px solid transparent;
    border-radius: 4px;
}

    .kanban-card:hover {
        box-shadow: 0 6px 10px 0 rgba(0,0,0,.2);
    }

    /*	
	.kanban-card.is-expired {
		border-left-color: #EF5350;
	}
	*/

    .kanban-card.is-closed {
        border-left-color: #2CC48A;
        opacity: 0.4;
    }

    .kanban-card.is-open {
        border-left-color: #2CC48A;
    }

        .kanban-card.is-open.is-expired {
            border-left-color: #EF5350;
        }

    .kanban-card.is-suspended {
        border-left-color: #FAB450;
    }

    .kanban-card.is-draft {
        border-left-color: #AAAAAA;
        border-style: dotted;
    }

.kanban-card-header {
    margin-bottom: 12px;
}

.kanban-card-body > * {
    font-size: 12px;
}

    .kanban-card-body > * + * {
        margin-top: 6px;
    }

.kanban-card-body .text-with-icon-left .text {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.kanban-card-title {
    font-size: 14px;
    font-weight: 600;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.kanban-card-subtitle {
    font-size: 12px;
    font-weight: 400;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.kanban-card-type {
    display: inline-block;
    background-color: #F0F0F0;
    padding: 4px 8px;
    border-radius: 6px;
}

.kanban-card .icon {
    font-size: 18px;
}

.kanban-card-expiration {
    font-size: 12px;
    color: #999;
}

    .kanban-card-expiration.is-expired {
        color: #EF5350;
    }

.webix_selected .kanban-card {
    border: 1px solid #999;
}

.kanban .standard-column .webix_view.webix_kanban_sub_header::after
.kanban .standard-column .webix_template::after {
    border-color: #F7F8FA transparent #F7F8FA #d3eaf3 !important;
}

/* ============================== AGENDA ============================== */
.event-scheduler-ct {
}

    .event-scheduler-ct .add_calendar {
        width: 100%;
        height: 100% !important;
        margin-top: 0 !important;
        flex: 1;
        min-height: 35px;
    }

        .event-scheduler-ct .add_calendar .webix_button {
            white-space: nowrap;
            display: block;
            overflow: hidden;
            text-overflow: ellipsis;
            text-align: left;
        }

            .event-scheduler-ct .add_calendar .webix_button:hover {
                text-decoration: underline;
                background-color: transparent;
            }

    .event-scheduler-ct .webix_scheduler_cal_list .webix_list_item {
        border-bottom: none;
    }

.event-scheduler {
    border-top: 1px solid #CCC;
}

.event-scheduler-inner-toolbar,
.event-scheduler-inner-toolbar .webix_el_label {
    text-transform: uppercase;
}

    .event-scheduler-inner-toolbar .webix_item_tab {
        background-color: transparent;
        color: inherit;
        text-transform: uppercase;
        border-top: 4px solid transparent;
        border-left: 4px solid transparent;
        border-right: 4px solid transparent;
        border-bottom: 4px solid transparent;
        padding: 10px 8px 6px 8px;
        margin: 0 8px 0 8px;
        transition-property: background-color, border-color, color;
        transition-duration: 0.2s;
    }

        .event-scheduler-inner-toolbar .webix_item_tab:hover {
            background-color: transparent;
            border-bottom-color: #CCC;
        }

        .event-scheduler-inner-toolbar .webix_item_tab.webix_selected,
        .event-scheduler-inner-toolbar .webix_item_tab.webix_selected:focus {
            color: inherit;
        }

        .event-scheduler-inner-toolbar .webix_item_tab.webix_selected {
            padding-bottom: 6px;
            box-shadow: none;
            font-weight: 600;
            border-bottom-color: #CCC;
        }

            .event-scheduler-inner-toolbar .webix_item_tab.webix_selected:focus {
                box-shadow: none;
            }

    .event-scheduler-inner-toolbar .webix_icon_button {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 4px;
    }

        .event-scheduler-inner-toolbar .webix_icon_button:hover {
            background-color: #F0F0F0;
        }

    .event-scheduler-inner-toolbar .webix_button,
    .webix_cal_prev_button,
    .webix_cal_next_button {
        background-color: transparent;
        color: inherit;
        border-radius: 4px;
    }

        .event-scheduler-inner-toolbar .webix_button:hover {
            text-decoration: underline;
            background-color: #F0F0F0;
        }

    .event-scheduler-inner-toolbar .user-calendars-btn {
        text-align: left;
    }

        .event-scheduler-inner-toolbar .user-calendars-btn .webix_button {
            background-color: transparent;
            border: 0px none;
            display: inline-block;
            text-align: left;
        }

            .event-scheduler-inner-toolbar .user-calendars-btn .webix_button:hover,
            .event-scheduler-inner-toolbar .user-calendars-btn .webix_button:focus,
            .event-scheduler-inner-toolbar .user-calendars-btn .webix_button:active {
                background-color: transparent;
                border: 0px none;
                color: inherit;
            }

    /* workarodund to vertically align toolbar date label */
    .event-scheduler-inner-toolbar .toolbar_date_view .webix_el_label .webix_el_box {
        padding-top: 5px;
        padding-bottom: 3px;
    }

.event-scheduler .webix_scheduler_calendar_header,
.event-scheduler .webix_scheduler_day_header {
    background-color: #F0F0F0;
    text-transform: uppercase;
}

    .event-scheduler .webix_scheduler_calendar_header .webix_dataview_item,
    .event-scheduler .webix_scheduler_day_header .webix_dataview_item {
        border-right: 1px solid #DDD;
    }

        .event-scheduler .webix_scheduler_calendar_header .webix_dataview_item:last-child,
        .event-scheduler .webix_scheduler_day_header .webix_dataview_item:last-child {
            border-right: 0px none;
        }


.event-scheduler .webix_event_time .end,
.event-scheduler .webix_unit_header .webix_scheduler_dayofweek {
    color: #999;
}

.event-scheduler .webix_cal_outside {
    color: #AAA;
}

.event-info-view {
}


    .event-info-view .sync-button button {
        background-color: transparent;
        padding: 0;
        margin: 0;
        text-transform: capitalize;
    }


    .event-info-view .primary .webix_button,
    .event-info-view .primary .webix_button .icon-edit::before {
        background-color: #203C80;
        color: #FFFFFF;
    }

    .event-info-view .secondary .webix_button,
    .event-info-view .secondary .webix_button .icon-delete::before {
        background-color: #ECEEFF;
        color: #203C80;
    }

    .event-info-view .webix_scheduler_info .agenda-event-info-template > div {
        color: #828282;
    }

    .event-info-view .webix_scheduler_info .agenda-event-info-template .long-text {
        overflow: hidden;
        display: -webkit-box;
        -webkit-line-clamp: 5; /* number of lines to show */
        line-clamp: 5;
        -webkit-box-orient: vertical;
    }

        .event-info-view .webix_scheduler_info .agenda-event-info-template .long-text.title {
            -webkit-line-clamp: 2; /* number of lines to show */
            line-clamp: 2;
        }

    .event-info-view .webix_scheduler_info .agenda-event-info-template .title {
        font-weight: 600;
        font-size: 18px;
        color: #222222;
        margin: 0 0 16px 0;
    }

    .event-info-view .webix_scheduler_info .agenda-event-info-template .datetime {
        font-size: 14px;
        margin: 6px 0;
    }

        .event-info-view .webix_scheduler_info .agenda-event-info-template .datetime > i {
            font-size: 16px;
            padding-right: 4px;
        }

        .event-info-view .webix_scheduler_info .agenda-event-info-template .datetime > span {
            padding-right: 12px;
        }

    .event-info-view .webix_scheduler_info .agenda-event-info-template .separator {
        border-bottom: 1px solid #828282;
        opacity: 0.5;
    }

    .event-info-view .webix_scheduler_info .agenda-event-info-template .secondary-title {
        font-weight: 600;
        font-size: 16px;
        color: #222222;
        padding-top: 12px;
        padding-bottom: 8px;
    }

.event-info-view-toolbar {
}

    .event-info-view-toolbar .webix_view .webix_el_box > button {
        padding: 20px 0;
    }

.event-info-view-body {
}

    .event-info-view-body .webix_danger .webix_button::before {
        font-family: "pat-icons";
        content: "\f10b";
        padding-right: 12px;
    }

    .event-info-view-body .webix_template .webix_scheduler_event_title {
        font-size: 18px;
        font-weight: 600;
        margin-bottom: 12px;
    }

    .event-info-view-body .webix_template .webix_scheduler_event_from_to,
    .event-info-view-body .webix_template .webix_scheduler_event_recurring_pattern {
        color: #999;
    }

.event-scheduler .webix_scheduler_calendar .webix_cal_today .webix_cal_date {
    border-color: #CCC;
}

.event-scheduler .webix_cal_body .webix_cal_day_inner:hover,
.event-scheduler .webix_scheduler_calendar .webix_cal_date:hover,
.event-scheduler .webix_scheduler_month_event_single:hover,
.event-scheduler .webix_scheduler_agenda .webix_event_overall:hover {
    background-color: rgba(170, 170, 170, .2);
    color: inherit;
}

.event-scheduler .webix_cal_body .webix_cal_select .webix_cal_day_inner,
.event-scheduler .webix_cal_body .webix_cal_today.webix_cal_select .webix_cal_day_inner {
    background-color: #999;
    font-weight: 600;
}

.event-scheduler .webix_cal_body .webix_cal_day_inner {
    border-radius: 0;
}

.event-scheduler .webix_cal_prev_button:hover,
.event-scheduler .webix_cal_next_button:hover {
    background-color: #F0F0F0;
}

.event-scheduler .webix_cal_body .webix_cal_event {
    color: #EF5350;
}

.event-scheduler .webix_scheduler_agenda .webix_event_overall .webix_event_time {
    line-height: normal;
}



/******************************* CAROUSEL *******************************/
.carousel {
    overflow: hidden;
}

    .carousel .webix_nav_panel {
        box-sizing: content-box;
    }

    .carousel .webix_nav_panel_side {
        left: 50%;
        transform: translateX(-50%);
        bottom: 10px;
        width: auto;
    }

    .carousel .webix_nav_panel .webix_nav_item {
        border-color: #222;
        opacity: 0.3;
    }

    .carousel .webix_nav_panel .webix_nav_active {
        background-color: #222;
        border-color: #222;
        opacity: 0.6;
    }

    .carousel .webix_nav_panel .webix_nav_inactive {
    }

        .carousel .webix_nav_panel .webix_nav_inactive:hover {
            opacity: 0.6;
            background-color: rgba(0, 0, 0, 0.1);
        }

    .carousel .webix_nav_button_side .webix_nav_button_inner,
    .carousel .webix_nav_button_corner .webix_nav_button_inner {
        color: #222;
        opacity: 0.6;
        background-color: transparent;
        font-size: 28px;
    }

    .carousel .webix_nav_button_side .webix_nav_button_inner {
        padding: 0;
    }

    .carousel .webix_nav_button_side:hover,
    .carousel .webix_nav_button_corner:hover {
        background: rgba(0, 0, 0, 0.05);
    }

    .carousel .webix_nav_button_side.webix_nav_button_next .webix_nav_button_inner:hover,
    .carousel .webix_nav_button_side.webix_nav_button_prev .webix_nav_button_inner:hover {
        background: transparent;
    }

    .carousel .webix_nav_button_side .webix_nav_button_inner:hover,
    .carousel .webix_nav_button_corner .webix_nav_button_inner:hover {
        opacity: 0.6;
    }


    .carousel .webix_nav_button_side {
        position: absolute;
        top: 0;
        bottom: 0;
        margin: auto 0;
        height: max-content;
        line-height: normal;
        width: auto;
    }

        .carousel .webix_nav_button_side.webix_nav_button_prev {
            left: 0;
        }

        .carousel .webix_nav_button_side.webix_nav_button_next {
            right: 0;
        }

    .carousel .webix_nav_button_corner.webix_nav_button_prev,
    .carousel .webix_nav_button_corner.webix_nav_button_next {
        height: 24px;
        width: 24px;
        line-height: 24px;
        border-radius: 4px;
    }

    .carousel .webix_nav_button_corner .webix_nav_button_inner {
        font-family: "pat-icons";
        font-size: 16px;
    }

    .carousel .webix_nav_button_corner.webix_nav_button_prev {
        right: 36px;
    }

body.mobile .carousel .webix_nav_button_corner.webix_nav_button_prev {
    right: 46px;
}

.carousel .webix_nav_button_corner.webix_nav_button_prev .webix_nav_button_inner::before {
    content: "\f118";
}

.carousel .webix_nav_button_corner.webix_nav_button_next .webix_nav_button_inner::before {
    content: "\f119";
}

.carousel .webix_nav_panel_corner {
    bottom: 12px;
    right: 72px;
}


.carousel .carousel-item .webix_template {
    padding: 0;
}

    .carousel .carousel-item .webix_template > .notification-item {
        height: 100%;
    }


/******************************* ICONS *******************************/

[class^="icon-fieldtype-"]:before,
[class*=" icon-fieldtype-"]:before {
    font-family: "pat-font" !important;
    font-style: normal !important;
    font-weight: normal !important;
    font-variant: normal !important;
    text-transform: none !important;
    speak: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size: inherit;
    content: "\e048";
}

body .icon-fieldtype-text:before {
    content: "\e904";
}

body .icon-fieldtype-datetime:before {
    content: "\e905";
}

body .icon-fieldtype-list:before {
    content: "\e906";
}

body .icon-fieldtype-number:before {
    content: "\e907";
}

body .icon-fieldtype-boolean:before {
    content: "\e908";
}

body .icon-fieldtype-subtable:before {
    content: "\e909";
}

body .icon-fieldtype-attachment:before {
    content: "\e900";
}

body .icon-fieldtype-tree:before {
    content: "\e90c";
}

body .icon-fieldtype-hyperlink:before {
    content: "\e90b";
}

body .icon-fieldtype-objectlink:before {
    content: "\e902";
}

body .icon-fieldtype-objectlink-expanded:before {
    content: "\e901";
}

body .icon-fieldtype-html:before {
    content: "\e90a";
}

body .icon-fieldtype-taglabel:before {
    content: "\0026";
}




/* ============================== ACL EDITOR ============================== */
.acl-list-editor {
}

    .acl-list-editor .toolbar-pos-top {
        padding-bottom: 6px;
        border-bottom: 1px solid #CCC;
    }

.acl-list-editor-col-left {
    padding-right: 12px;
}

.acl-list-editor-col-right {
    padding-left: 12px;
}

.acl-permission-btn {
    padding: 4px;
    background-color: #F0F0F0;
}

    .acl-permission-btn .icon-accept,
    .acl-permission-btn-menu .icon-accept {
        color: #109006;
    }

    .acl-permission-btn .icon-cancel,
    .acl-permission-btn-menu .icon-cancel {
        color: #EF5350;
    }

    .acl-permission-btn .acl-icon-empty::before,
    .acl-permission-btn-menu .acl-icon-empty::before {
        content: "-";
    }

.acl-list-editor .acl-item-permission {
    font-size: 12px;
    color: #777;
}




/* ============================== DRAG & DROP ============================== */
.x-dd-drag-proxy {
    display: flex;
    align-items: center;
    background-color: #F0F0F0;
    border-radius: 4px;
    padding: 6px;
    box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.2)
}

.x-dd-drag-ghost {
    padding: 0;
    border: 0;
    background-color: transparent;
}

.x-dd-drop-icon {
    position: relative;
    top: initial;
    left: initial;
    right: initial;
    bottom: initial;
}

.x-dd-drop-ok .x-dd-drop-icon,
.x-dd-drop-ok-append .x-dd-drop-icon,
.x-tree-drop-ok-between .x-dd-drop-icon,
.x-tree-drop-ok-above .x-dd-drop-icon,
.x-tree-drop-ok-below .x-dd-drop-icon,
.x-tree-drop-ok-append .x-dd-drop-icon,
.x-dd-drop-nodrop div.x-dd-drop-icon {
    background-image: none;
    background-color: transparent;
    font-family: "pat-icons";
    font-size: 18px;
    width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 6px;
    flex-shrink: 0;
}

    .x-dd-drop-ok .x-dd-drop-icon::before,
    .x-tree-drop-ok-between .x-dd-drop-icon::before,
    .x-tree-drop-ok-between .x-dd-drop-icon::before,
    .x-tree-drop-ok-above .x-dd-drop-icon::before,
    .x-tree-drop-ok-below .x-dd-drop-icon::before {
        content: "\f144";
        color: #109006;
    }

    .x-dd-drop-ok-append .x-dd-drop-icon::before,
    .x-tree-drop-ok-append .x-dd-drop-icon::before {
        content: "\f102";
        color: #109006;
    }

    .x-dd-drop-nodrop div.x-dd-drop-icon::before {
        content: "\f110";
        color: #EF5350;
    }







/* ============================== UTILITIES ============================== */

@keyframes rotation {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(359deg);
    }
}

.rotate {
    animation: rotation 2s infinite linear;
}

.relative {
    position: relative !important;
}

.clear {
    clear: both;
}

.ellipsis::after {
    content: "\2026";
}

.is-hidden {
    display: none !important;
}

.is-visibility-hidden {
    visibility: hidden !important;
}

.is-html-content p {
    display: block;
    margin: 1em 0;
}

*.unselectable {
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    /*
	 Introduced in Internet Explorer 10.
	 See http://ie.microsoft.com/testdrive/HTML5/msUserSelect/
   */
    -ms-user-select: none;
    user-select: none;
}



/* Shape utilities */

.circle-filled,
.circle-filled-s,
.circle-filled-l,
.circle-filled-xl {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border-radius: 50%;
    background-color: rgba(0,0,0,0.05);
}

    .circle-filled.bold,
    .circle-filled-s.bold,
    .circle-filled-l.bold,
    .circle-filled-xl.bold {
        font-weight: bold;
    }

.circle-filled-s {
    width: 14px;
    height: 14px;
}

.circle-filled {
    width: 18px;
    height: 18px;
}

.circle-filled-l {
    width: 24px;
    height: 24px;
}

.circle-filled-xl {
    width: 32px;
    height: 32px;
}


/* Separator Utilities */

.analysis-separator-line {
    display: block;
    margin: 1rem 0 !important;
    height: 1px;
    background-color: #DDD;
}


/* Layout Utilities */

.multitext-ct > * + * {
    margin-top: 2px;
}

.text-with-image,
.text-with-image-left,
.text-with-image-right {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-start;
}

    .text-with-image img,
    .text-with-image-left img,
    .text-with-image-right img {
        border-radius: 50%;
        flex-shrink: 0;
        width: 32px;
        height: 32px;
        object-fit: cover;
    }


.text-with-image-left {
}

    .text-with-image img,
    .text-with-image .icon,
    .text-with-image-left img,
    .text-with-image-left .icon {
        order: 0;
    }

        .text-with-image img + *,
        .text-with-image .icon + *,
        .text-with-image-left img + *,
        .text-with-image-left .icon + * {
            order: 1;
            margin-left: 8px;
        }

.text-with-image-right {
}

    .text-with-image-right img,
    .text-with-image-right .icon {
        order: 1;
    }

        .text-with-image-right img + *,
        .text-with-image-right .icon + * {
            order: 0;
            margin-right: 8px;
        }

.text-with-icon,
.text-with-icon-left,
.text-with-icon-right {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-start;
}

    .text-with-icon .icon,
    .text-with-icon-left .icon,
    .text-with-icon-right .icon {
        flex-shrink: 0;
    }

    .text-with-icon .text,
    .text-with-icon-left .text,
    .text-with-icon-right .text {
    }

.text-with-icon-left {
}

    .text-with-icon-left .icon {
        order: 0;
        margin-right: 8px;
    }

    .text-with-icon-left .text {
        order: 1;
    }

.text-with-icon-right {
}

    .text-with-icon-right .icon {
        order: 1;
        margin-left: 8px;
    }

    .text-with-icon-right .text {
        order: 0;
    }

.flex-row,
.flex-column {
    display: flex;
    align-items: center;
}

.flex-row {
}

    .flex-row > * + * {
        margin-left: 8px;
    }

.flex-column {
    flex-direction: column;
}

    .flex-column > * + * {
        margin-top: 8px;
    }



/* Text Utilities */

/* text with a "tag" (pill) effect */
.text-tag {
    background-color: #F0F0F0;
    padding: 0.25em 0.5em;
    display: inline-block;
    border-radius: 4px;
    font-size: 12px;
}

.text-tag-upper {
    text-transform: uppercase;
}

.text-tag-size-small {
    font-size: 12px;
}

.text-tag-size-large {
    font-size: 16px;
}

.link {
    cursor: pointer;
    text-decoration: underline;
}

    .link:hover {
        text-decoration: none;
    }




/* ============================== GENERIC STYLES ============================== */

/* For disabled x in field set from IE10+ */
::-ms-clear {
    display: none;
}

/******************************** Triggers ***************************/

.trigger-engine .vertical-connector {
    width: 50%;
    border-right: 2px solid #CCCCCC;
    height: 40px;
}

.trigger-engine.preview .group-box .vertical-connector:last-of-type {
    display: none;
}


.trigger-engine.preview .vertical-connector-container.task-separator:last-of-type .vertical-connector {
    display: none;
}

.trigger-engine .text-container div:first-of-type {
    font-weight: 600;
}

.trigger-engine:not(.preview) .text-container.empty-message {
    display: none;
}

.trigger-engine.preview .text-container.empty-message {
    width: 100%;
    text-align: center;
}

.trigger-engine .add {
    width: 27px;
    height: 27px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    font-size: 20px;
    color: #FFF;
    cursor: pointer;
    background-color: #777777;
    border: 1px solid #777777;
    border-radius: 4px;
    line-height: 22px;
    /*Set text not selectable*/
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */
}

.trigger-engine.preview .add {
    display: none;
}

.trigger-engine .white-box,
.trigger-engine .task-box {
    border-radius: 8px;
    padding: 22px 32px 22px 20px;
    position: relative;
    /* margin: auto; */
    box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.1);
    background-color: #FFF;
    width: 80%;
    /*Set text not selectable*/
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */
}

.trigger-engine .flex-row .white-box,
.trigger-engine .flex-row .task-box {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.trigger-engine .white-box.disabled:hover {
    background: #FFF;
    box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.1);
}

.trigger-engine .white-box.selected,
.trigger-engine .white-box:hover {
    -webkit-box-shadow: inset 0 -7px 2px -2px red;
    -moz-box-shadow: inset 0 -7px 2px -2px red;
    box-shadow: inset 0 -7px 0px 0px red;
    background: rgba(255, 0, 0,.3);
}

.trigger-engine .add.clickable.selected,
.trigger-engine .add.clickable:hover {
    box-shadow: inset 0 -2px 0px 0px #fdc35e, 0 2px 0px 0px #fdc35e;
    background: rgba(253, 195, 94,.3);
    border: none;
    color: #222;
}

.trigger-engine .title {
    text-align: center;
    font-size: 14px;
    position: absolute;
    top: -10px;
    left: 0px;
    right: 0px;
}

    .trigger-engine .title span {
        background-color: red; /* <- overrides with application color */
        padding: 5px 20px 5px 20px;
        border-radius: 6px;
        font-size: 14px;
        line-height: 14px;
        text-transform: uppercase;
        color: white;
    }

.trigger-engine .container {
    white-space: nowrap;
}

.trigger-engine .icon-container {
    font-size: 22px;
    width: 46px;
    background-color: transparent;
    padding: 10px;
    border-radius: 4px;
    height: 100%;
    text-align: center;
    display: inline-block;
    vertical-align: top;
}

.trigger-engine .task-box > .container > .icon-container {
    font-size: 22px;
    width: 46px;
    background-color: transparent;
    padding: 10px;
    border-radius: 4px;
    height: 100%;
    text-align: center;
    display: inline-block;
    vertical-align: top;
}

.trigger-engine .text-container {
    display: inline-block;
    padding-left: 10px;
    color: #222222;
    font-size: 16px;
    vertical-align: top;
    overflow: hidden;
    /* Wrapping text */
    white-space: -moz-pre-wrap !important; /* Mozilla */
    white-space: -pre-wrap; /* Opera 4-6 */
    white-space: -o-pre-wrap; /* Opera 7 */
    white-space: pre-wrap; /* css-3 */
    word-wrap: break-word; /* Internet Explorer 5.5+ */
    white-space: -webkit-pre-wrap; /* Newer versions of Chrome/Safari*/
    word-break: break-word;
    white-space: break-spaces;
    inline-size: 85%;
}

    .trigger-engine .text-container .single-line {
        line-height: 46px;
    }

    .trigger-engine .text-container div {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

div.trigger-engine .task-box > div.container > div.text-container,
div.trigger-engine .task-box > div.text-container {
    inline-size: 85%;
}

.trigger-engine .flex-column {
    height: 100%;
    margin-top: auto;
    display: flex;
    align-items: center;
}

.trigger-engine .or-row .white-box {
    width: 100%;
}

.trigger-engine .or-row {
    width: 80%;
    position: relative;
}

.trigger-engine .or-box-link {
    /*
	position: absolute;
	margin: 0;
	top: 50%;
	right: -4px;
	*/
    position: relative;
}

.trigger-engine .or-row-add {
    position: absolute;
    right: 0px;
    /* border: 1px #FF0000 solid; */
    height: 23px;
    width: 0px;
    border-top-right-radius: 12px;
    border-bottom-right-radius: 12px;
    text-align: end;
    padding-right: 0px;
    background-color: #FF0000;
    color: #FFF;
    transition: 0.5s;
    cursor: pointer;
    overflow: hidden;
}

    .trigger-engine .or-row-add > span {
        margin-top: 4px;
        float: right;
    }

.trigger-engine .hover-box:hover .or-row-add {
    right: -45px;
    width: 45px;
    padding-right: 2px;
}

.trigger-engine .or-row-add > div {
    width: 100%;
    height: 100%;
    background-color: transparent;
    position: absolute;
    z-index: 1;
}

.or-row-add.disabled > div {
    display: none;
}

.trigger-engine .or-row-add.disabled {
    background-color: #CCC;
}

.trigger-engine .or-box-link > div {
    border: 1px red solid;
    border-radius: 50%;
    z-index: 1;
    position: absolute;
    left: -12px;
    top: -10px;
    width: 23px;
    height: 23PX;
    text-align: center;
    padding-top: 4px;
    background-color: red;
    color: #fff;
    font-size: 10px;
}

.trigger-engine .group-box {
    width: 100%;
    position: relative;
    border: 2px solid #F00; /* <- overrides with application color */
    border-radius: 8px;
    padding-top: 50px;
    padding-bottom: 50px;
}

.trigger-engine .delete {
    position: absolute;
    top: 5px;
    right: 5px;
    width: 20px;
    height: 20px;
    background-color: transparent;
    border-radius: 4px;
    text-align: center;
    padding-top: 2px;
    color: red;
}

    .trigger-engine .delete:before {
        font-size: 18px;
    }

.trigger-engine.preview .delete {
    display: none;
}


.tr-right-arrow {
    width: 100%;
    text-align: center;
    font-size: 60px;
    color: #666;
}

.trigger-engine .section-title {
    font-size: 18px;
    line-height: normal;
    text-transform: uppercase;
    color: #999;
    padding: 0 12px 0 0;
}

.trigger-engine .section-title-line {
    border: none;
    height: 15px !important;
    border-bottom: 1px solid #999;
}

.trigger-engine .box-container {
    width: 100%;
}

.trigger-engine .task-box.task-box-autoWidth {
    width: auto;
}

.trigger-engine .task-box {
    min-width: 200px;
    margin: 0px 0px 16px 0px;
    border: 1px solid rgba(200,200,200,0.5);
    padding: 8px 12px 8px 10px;
}

    .trigger-engine .task-box:before {
        cursor: pointer;
    }

.trigger-engine .group-box .title {
    left: 4%;
    right: unset;
    /*Set text not selectable*/
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */
}

.trigger-engine .task-box.left {
    display: inline-block;
    width: auto;
    margin-right: 10px;
}

.tr-box span {
    vertical-align: middle;
    font-size: 14px;
    line-height: 24px;
}

.trigger-engine .task-box:hover {
    cursor: pointer;
    border: 1px solid transparent;
    background: rgba(255, 0, 0,.3);
    -webkit-box-shadow: inset 0 -4px 2px -2px red;
    -moz-box-shadow: inset 0 -4px 2px -2px red;
    box-shadow: inset 0 -4px 0px 0px red;
}

.trigger-engine .task-box.selected {
    border: 1px solid transparent;
    background: rgba(255, 0, 0,.3);
    -webkit-box-shadow: inset 0 -4px 2px -2px red;
    -moz-box-shadow: inset 0 -4px 2px -2px red;
    box-shadow: inset 0 -4px 0px 0px red;
}

    .trigger-engine .task-box.selected > .container > .text-container {
        color: #222;
    }

.trigger-engine .x-toolbar {
    background-color: #FFF;
    border: 0px;
}

    .trigger-engine .x-toolbar.toolbar-solid .x-btn.x-btn-danger-small {
        background-color: #d9534f;
    }

    .trigger-engine .x-toolbar.toolbar-solid .x-btn {
        background-color: red; /* <- overrides with application color */
        border-radius: 4px;
    }

        .trigger-engine .x-toolbar.toolbar-solid .x-btn span {
            color: #FFFFFF;
            font-size: 16px;
            line-height: 20px;
        }

        .trigger-engine .x-toolbar.toolbar-solid .x-btn.x-btn-disabled {
            background-color: #F0F0F0;
        }

.flex-column .hover-box .group-box .white-box {
    width: 80%;
}

span.tr-keywork-placeholder {
    background-color: #00588C;
    color: #EEE;
    border-radius: 4px;
    padding: 0px 2px 0px 2px;
}

.clickable {
    cursor: pointer;
}

.x-component.xtxtContainer {
    border: 1px solid #DDD;
}

    .x-component.xtxtContainer:hover {
        cursor: text;
        border: 1px solid #C0C0C0;
    }


.trigger-engine-icon-good {
    color: green;
}

.trigger-engine-icon-bad {
    color: red;
}

.trigger-designer-top-btn {
    height: fit-content !important;
}

.TriggerFieldWindow > .panel-body {
    padding: 0;
}

.TriggerFieldWindow > .toolbar {
    top: 75px !important;
}

[id*="itemsPanel"] .filter-match {
    font-weight: 600;
}

[id*="itemsPanel"] > [id*="button"] {
    border-bottom: 1px solid rgba(0,0,0,.2);
}

    [id*="itemsPanel"] > [id*="button"]:hover {
        border-bottom: 1px solid rgba(0,0,0,.4);
        font-weight: 600;
    }

.triggerDateTimeSelection .x-form-cb-wrap {
    padding-top: 5px;
}

.triggerDateField {
    height: 30px !important;
}

.triggerBaseOffset,
.triggerRadioColor > div > div > label {
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently
								  supported by Chrome, Edge, Opera and Firefox */
}

.trigger-extraPopUpInfo {
    color: #777777;
    font-size: 12px;
}

.trigger-PopUptitleBtn {
    font-size: 16px;
    font-weight: 500;
}

.triggerRadioColor > div > div > label:before {
    color: rgb(32,175,233);
}

.trigger-item-disabled.x-masked-relative.x-masked {
    overflow: inherit !important;
}

    .trigger-item-disabled.x-masked-relative.x-masked > .x-mask {
        background-color: transparent;
    }

.trigger-engine .task-box.left .single-line {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 120px;
}

.field.label-slim > label.field-label {
    width: unset;
    min-width: unset;
    padding-left: 0px;
}

.field.label-slim > label.field-label {
    width: unset;
    min-width: unset;
    padding-left: 0px;
}

.trigger-engine .field {
    margin-bottom: 0;
}

.trigger-engine .field-common {
    margin-bottom: 16px;
}

.trigger-engine .webix_control input:read-only {
    border-top: 0;
    border-left: 0;
    border-right: 0;
    border-radius: 0;
}


.trigger-engine .stats-container .status {
    border: 2px solid #2dde98;
    text-align: center;
    padding: 5px 0;
    border-radius: 22px;
    background-color: #2dde98;
    color: #FFF;
    font-weight: bold;
}

    .trigger-engine .stats-container .status.red {
        border: 2px solid #ff6c5f;
        background-color: #ff6c5f;
    }

    .trigger-engine .stats-container .status.yellow {
        border: 2px solid #ffef5f;
        background-color: #ffef5f;
    }

.trigger-engine .split-btn.x-btn .x-btn-button {
    padding: 0;
    margin: 0;
    border: unset;
}


.trigger-engine .is-disabled span.x-btn-icon-el {
    opacity: 0.4;
}

.trigger-instructions {
    line-height: 1.5em;
    height: 3em;
    overflow: hidden;
}

/******************************* WEBIX *******************************/
.webix_control input,
.webix_control div.webix_inp_static {
    border-radius: 4px;
    border-color: #ccc;
    height: 30px;
}

/* TextHighlight */
.webix_el_texthighlight.webix_el_text .webix_text_highlight,
.webix_el_texthighlight.webix_el_textarea .webix_text_highlight,
.webix_control.webix_el_texthighlight input,
.webix_view.webix_control.webix_el_texthighlight.webix_el_textarea textarea,
.webix_view.webix_control.webix_el_texthighlight.webix_el_textarea .webix_text_highlight_value {
    border: none;
    height: inherit;
    padding: 0;
    margin: 0;
}

.webix_el_texthighlight span.highlight {
    color: #1da2d4;
}

.texthiglight-trigger {
    z-index: 2;
}

.composite-field-content .texthiglight-trigger button {
    color: #333;
    background-color: transparent;
}

    .composite-field-content .texthiglight-trigger button:hover {
        background-color: transparent;
        border: transparent;
        color: #555;
    }



/* Controls */
.webix_el_box {
    padding: 0;
}

.detail .webix_inp_top_label,
.detail .detail .webix_inp_top_label {
    color: #222222;
    font-size: inherit;
    height: 21px;
    padding: 0;
}

.webix_view.webix_toolbar.webix_layout_toolbar button {
    font-size: 14px;
    padding-left: 4px;
    color: inherit;
    font-weight: inherit;
}

    .webix_view.webix_toolbar.webix_layout_toolbar button:hover {
        text-decoration: underline;
    }

.webix_view.webix_toolbar.webix_layout_toolbar .webix_el_icon button:hover {
    text-decoration: none;
}

/* Combobox/Select */
.webix_el_box input:read-only + span {
    display: none;
}

.webix_input_icon.wxi-menu-down {
    color: #222222;
    background-color: #F0F0F0;
    border: 1px solid #ccc;
    height: 100%;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    padding-top: 6px !important;
}

    .webix_input_icon.wxi-menu-down:hover {
        background-color: #E0E0E0;
    }

    .webix_input_icon.wxi-menu-down::before {
        font-family: "pat-icons";
        font-size: 18px;
        content: "\f117";
    }

/* Combobox/Select - options popup */

.webix_view.webix_window.webix_popup .webix_win_content .webix_view.webix_list .webix_scroll_cont {
    border-top: 2px solid #CCC;
    padding: 0 !important;
}

    .webix_view.webix_window.webix_popup .webix_win_content .webix_view.webix_list .webix_scroll_cont .webix_list_item {
        /*padding: 0 12px;*/
        border-bottom: none;
    }

        .webix_view.webix_window.webix_popup .webix_win_content .webix_view.webix_list .webix_scroll_cont .webix_list_item:hover,
        .webix_view.webix_window.webix_popup .webix_win_content .webix_view.webix_list .webix_scroll_cont .webix_list_item.webix_selected {
            box-shadow: unset;
        }

/* Datatable */

.webix_ss_header,
.webix_hcolumn,
.webix_ss_vscroll_header,
.webix_dd_drag_column,
.webix_hs_left,
.webix_hs_center,
.webix_hs_right {
    background: transparent;
}

.webix_ss_header {
    text-transform: uppercase;
    font-size: 11px;
}

    .webix_ss_header .webix_hcell.webix_last_row {
        font-weight: 600;
    }

        .webix_ss_header .webix_hcell.webix_last_row .webix_ss_sort_single:before {
            font-weight: normal;
        }

.webix_dtable .webix_ss_header .webix_hcolumn div.webix_last_row,
.webix_dtable .webix_ss_header .webix_span.webix_last_row {
    border: 1px solid #ccc;
    border-left-color: transparent;
    border-right-color: transparent;
}

    .webix_dtable .webix_ss_header .webix_hcolumn div.webix_last_row:hover,
    .webix_dtable .webix_ss_header .webix_span.webix_last_row:hover {
        border-left-color: #F0F0F0;
        border-right-color: #F0F0F0;
    }

.webix_dtable div.webix_ss_vscroll_header {
    border: none;
}

.webix_column > div.webix_row_select,
.webix_dtable .webix_select_mark > div.webix_row_select,
.webix_dtable_focused .webix_column > div.webix_row_select,
.webix_dtable_focused .webix_column > div.webix_column_select {
    border: 1px solid #CCC;
    border-left: none;
    border-right: none;
    box-shadow: unset;
}

.webix_scheduler_cal_popup .webix_input_icon {
    right: 3px !important;
    top: 3px !important;
}

.webix_scheduler_settings .webix_template {
    line-height: 28px !important;
}

.webix_scheduler_cal_popup .webix_custom_checkbox {
    padding: 0 !important;
}

/******************************* Tasgs *******************************/

.tag-info {
    font-size: 14px;
    border: 1px solid;
    border-radius: 16px;
    padding: 2px 8px;
    margin-left: 8px;
    display: inline-block;
}

    .tag-info.info {
        color: #39A3EA;
        border-color: #39A3EA;
        background-color: #D4E9F7;
    }

    .tag-info.good {
        border-color: #2cc48a;
        color: #2cc48a;
        background-color: rgb(44, 196, 138, 0.2);
    }

    .tag-info.warn {
        border-color: #FAB450;
        color: #FAB450;
        background-color: rgb(250, 180, 82, 0.2);
    }

    .tag-info.bad {
        border-color: #ee5350;
        color: #ee5350;
        background-color: rgb(238, 83, 80, 0.2);
    }

/******************************* Grid icons *******************************/

.list-cell-icon .neutral {
    color: #ABABAB;
}

    .list-cell-icon .neutral.circle,
    .list-cell-icon .neutral.full {
        background-color: #ABABAB;
    }

.list-cell-icon .good {
    color: #2CC48A;
}

    .list-cell-icon .good.circle,
    .list-cell-icon .good.full {
        background-color: #2CC48A;
    }

.list-cell-icon .warn {
    color: #FAB450;
}

    .list-cell-icon .warn.circle,
    .list-cell-icon .warn.full {
        background-color: #FAB450;
    }


.list-cell-icon .bad {
    color: #EF5350;
}

    .list-cell-icon .bad.circle,
    .list-cell-icon .bad.full {
        background-color: #EF5350;
    }

/******************************* DevExpress Report Designer *******************************/

.reportDxDesigner .reportDxDesigner-toolbar {
    border: 0;
    padding: 6px;
}

    .reportDxDesigner .reportDxDesigner-toolbar .x-label-value {
        vertical-align: inherit;
        padding: 0 6px;
    }

.reportDxDesigner .reportDxDesigner-container.empty {
    text-align: center;
    vertical-align: middle;
    color: #999;
    font-size: 22px;
    display: grid;
}

    .reportDxDesigner .reportDxDesigner-container.empty:before {
        font-size: 300px;
    }

/*********************************************************************/

/******************************* CARD VIEW *******************************/

#AddNewObjectCard {
    display: inline-block;
    width: var(--cardcontext-basecard-width);
    height: var(--cardcontext-basecard-height);
    border: 2px dashed #B3B3B3;
    border-radius: 4px;
    opacity: 1;
    background-image: url('../img/triggers/automate_lightning.png');
    background-repeat: no-repeat;
    background-position-x: 50%;
    background-position-y: 35%;
    color: #B3B3B3;
    font-weight: 600;
    text-align: center;
    margin-left: 20px;
    margin-bottom: 20px;
}

    #AddNewObjectCard:hover {
        cursor: pointer;
    }

    #AddNewObjectCard > p {
        padding-top: 67%;
    }

.CardsDv .singleCard {
    display: inline-block;
    vertical-align: top;
    width: var(--cardcontext-basecard-width);
    height: var(--cardcontext-basecard-height);
    background: #ffffff 0% 0% no-repeat padding-box;
    box-shadow: 0px 3px 6px #00000029;
    border-radius: 4px;
    opacity: 1;
    margin-left: 20px;
    margin-bottom: 20px;
    border-bottom: 4px solid transparent;
}

    .CardsDv .singleCard:hover {
        box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.2);
    }

    .CardsDv .singleCard.is-selected {
        border-bottom: 4px solid red;
    }

    .CardsDv .singleCard .body {
        height: 100%;
        width: 100%;
        display: flex;
        flex-direction: column;
        transition: height .8s;
    }

    .CardsDv .singleCard.is-selected .body {
        background: transparent linear-gradient( 180deg, rgba(153,153,153,0.3) 0%, rgba(0,0,0,0.3) 100% ) 0% 0% no-repeat padding-box;
        height: 80%;
    }

    .CardsDv .singleCard .body .backGroundImage {
        height: 100%;
        width: 100%;
        background-image: none;
        background-repeat: no-repeat;
        background-size: 150px;
        background-position: center;
    }

    .CardsDv .singleCard.is-selected .body .backGroundImage {
        opacity: 0.8;
    }

    .CardsDv .singleCard .body .textContent {
        padding-left: 20px;
        padding-right: 20px;
        padding-bottom: 20px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

        .CardsDv .singleCard .body .textContent:hover {
            cursor: default;
        }

    .CardsDv .singleCard .body .textContentTemplate {
        padding-left: 20px;
        padding-right: 20px;
        padding-bottom: 20px;
        padding-top: 10px;
        text-overflow: ellipsis;
        font-weight: bold;
        text-align: center;
    }

    .CardsDv .singleCard .body .textContentTemplateDescription {
        text-align: center;
    }

    .CardsDv .singleCard .footer {
        height: 0;
        display: flex;
        padding-left: 10px;
        padding-right: 10px;
        overflow: hidden;
        transition: height .8s;
    }

    .CardsDv .singleCard.is-selected .footer {
        height: 20%;
    }

    .CardsDv .singleCard .footer .btn {
        display: flex;
        flex-direction: column;
    }

        .CardsDv .singleCard .footer .btn.btn-command {
            padding-left: 7px;
            padding-right: 7px;
        }

            .CardsDv .singleCard .footer .btn.btn-command::before {
                transition: font-size .2s ease-in;
                -webkit-transition: font-size .2s ease-in;
                -moz-transition: font-size .2s linear;
                -o-transition: font-size .2s ease-in;
            }

            .CardsDv .singleCard .footer .btn.btn-command:hover::before {
                font-size: 16px;
            }

            .CardsDv .singleCard .footer .btn.btn-command > div.btn-text {
                font-family: 'Poppins', 'Commissioner', sans-serif;
                line-height: normal;
                height: 0;
                overflow: hidden;
                transition: height .2s;
                -webkit-transition: height .2s;
                -moz-transition: height .2s;
                -o-transition: height .2s;
            }

            .CardsDv .singleCard .footer .btn.btn-command:hover > div.btn-text {
                height: 40px;
            }

            .CardsDv .singleCard .footer .btn.btn-command.btn-primary {
                margin-left: auto;
                color: red;
                background-color: transparent;
                border-color: transparent;
            }

                .CardsDv .singleCard .footer .btn.btn-command.btn-primary:hover {
                    background-color: transparent;
                    border-color: transparent;
                }

    .CardsDv .singleCard .body .topRightStatus {
        position: absolute;
        width: fit-content;
        align-self: end;
        margin-top: 16px;
        margin-right: 10px;
    }

        .CardsDv .singleCard .body .topRightStatus.displayNone {
            display: none;
        }

        .CardsDv .singleCard .body .topRightStatus .icon {
            border-radius: 15px;
            padding: 6px;
            color: #109006;
            background: rgba(16, 144, 6, .3);
            height: 25px;
            width: 25px;
            text-align: center;
            display: flex;
            flex-direction: row;
            justify-content: center;
            align-items: center;
            transition: width .4s;
            -webkit-transition: width .4s;
            -moz-transition: width .4s;
            -o-transition: width .4s;
        }

            .CardsDv .singleCard .body .topRightStatus .icon:hover {
                width: 95px;
                border-radius: 15px;
            }

            .CardsDv .singleCard .body .topRightStatus .icon::before {
                vertical-align: bottom;
                font-size: 12px;
            }

            .CardsDv .singleCard .body .topRightStatus .icon .automateStatusText {
                width: 0;
                overflow: hidden;
                transition: width .4s;
                -webkit-transition: width .4s;
                -moz-transition: width .4s;
                -o-transition: width .4s;
            }

            .CardsDv .singleCard .body .topRightStatus .icon:hover > div.automateStatusText {
                width: 60px;
            }

    .CardsDv .singleCard .body.fullSizeCard ~ .footer {
        height: 20%;
    }

    .CardsDv .singleCard .body.fullSizeCard {
        height: 80%;
    }

    .CardsDv .singleCard .body .backGroundImage.fullSize {
        background-size: cover;
    }

    .CardsDv .singleCard .body.fullSizeCard {
        position: relative;
    }

        .CardsDv .singleCard .body.fullSizeCard .textContent {
            position: absolute;
            bottom: 0;
        }

    .CardsDv .singleCard .body .textContent.fullSize {
        background: white;
        padding-bottom: 10px;
        padding-top: 10px;
        width: 100%;
    }
/*********************************************************************/
/*********************************************************************/

/********************************* ANIMATED PIE COLUMN *********************************/
.circle-wrap {
    display: grid;
    grid-template-columns: repeat(1, 60px);
    grid-gap: 30px;
    width: 40px;
    height: 40px;
    background: #d9d7da;
    border-radius: 50%;
}

    .circle-wrap .circle .mask,
    .circle-wrap .circle .fillBar {
        width: 40px;
        height: 40px;
        position: absolute;
        border-radius: 50%;
    }

    .circle-wrap .circle .mask {
        clip: rect(0px, 40px, 40px, 20px);
    }

    .circle-wrap .inside-circle {
        width: 32px;
        height: 32px;
        border-radius: 50%;
        background: white;
        line-height: 22px;
        text-align: center;
        align-content: center;
        margin-top: 4px;
        margin-left: 4px;
        color: black;
        position: absolute;
        z-index: 100;
        font-weight: 700;
        font-size: 20px;
    }

	.circle-wrap .inside-circle.small {
		font-size: 16px;
	}

		.circle-wrap .inside-circle.extra-small {
			font-size: 12px;
		}

/* color animation */

.mask .fillBar {
    clip: rect(0px, 20px, 40px, 0px);
    background-color: red;
}

.mask.full,
.circle .fillBar {
    animation: fillBar ease-in-out 3s;
    transform: rotate(calc((180deg * var(--pie-rotate-calc-arg)) / var(--pie-rotate-maxval-arg)));
}

@keyframes fillBar {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(calc((180deg * var(--pie-rotate-calc-arg)) / var(--pie-rotate-maxval-arg)));
    }
}

/*********************************************************************/
/*********************************************************************/

.customfield-icons {
    padding: 1px;
}




/*
.floating-panel .detail-title .detail-title-text,
.floating-panel .module.dirty .detail-title::after {
	visibility: hidden;
}
*/


/* ===================================== WBS TREE =====================================*/

.wbs-diagram {
    padding: 4px;
}

    .wbs-diagram > div:first-of-type {
        color: #222222;
        font-size: 16px;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }

    .wbs-diagram > div:last-of-type > span:first-of-type {
        color: #FAB450;
        position: absolute;
        left: 16px;
        top: 8px;
    }

    .wbs-diagram > div:last-of-type > span:last-of-type {
        position: absolute;
        right: 16px;
        bottom: 8px;
    }

/* ====================================================================================*/

/* ===================================== WEBIX SLIM GAUGE ===================================== */

.webix-slim-gauge.hidden-range-info .webix_gage_label,
.webix-slim-gauge.hidden-range-info .webix_gage_range_info {
    display: none;
}

.webix-slim-gauge.hidden-range-info .webix_gage_placeholder {
    margin-top: -80px;
}

.webix-slim-gauge.hidden-range-info .webix_gage_value {
    display: flex;
    flex-direction: column;
}

    .webix-slim-gauge.hidden-range-info .webix_gage_value span:last-child {
        font-size: 13px;
    }

.webix-slim-gauge .webix_gage_label {
    margin-top: 0;
    padding-bottom: 15px;
    font-size: 18px;
}

.webix-slim-gauge .webix_gage_curves {
    stroke: #dddddd;
}

.webix-slim-gauge .webix_gage_animated {
    stroke: #aaaaaa;
}

.webix-slim-gauge .webix_gage_info {
    width: 180px !important;
}

.webix-slim-gauge .webix_gage_min_range,
.webix-slim-gauge .webix_gage_max_range,
.webix-slim-gauge .webix_gage_gradient_point.webix_gage_gradient_point_animated {
    display: none;
}

.webix-slim-gauge .webix_gage_placeholder {
    margin-top: -40px;
}

.webix-slim-gauge .webix_gage_value {
    font-size: 30px;
    color: #222;
}

.webix-slim-gauge .webix_gage_range_info {
    font-size: 15px;
    padding-top: 8px;
    color: #707482;
    height: 28px;
}

.webix_gage_animated {
    animation: gage_dash 1.8s linear forwards;
    transition: stroke 1.8s linear, stroke-dasharray 1.3s linear;
}

@keyframes gage_dash {
    to {
        stroke-dashoffset: 0;
    }
}

/* ============================================================================================ */

/* =============================== BreadcrumbTree =================================== */

.breadcrumbtree-field .webix_el_box > input {
    border: none;
    height: inherit;
    padding: 0;
    margin: 0;
}

.breadcrumbtree-field.composite-field .field-input-wrapper.composite-field-content {
    border: 1px solid #CCC;
    background-color: #FFF;
    border-radius: 4px;
}


    .breadcrumbtree-field.composite-field .field-input-wrapper.composite-field-content .x-btn-icon > .x-btn-icon-el {
        display: inline-block;
        vertical-align: unset;
        width: 20px;
    }


.crumbs .webix_scroll_cont,
.explorer .search-bar .search-input .webix_el_box {
    display: flex;
    align-items: center;
    height: 100%;
}

.crumbs .webix_list_item:not(:first-child):before {
    content: ">";
    padding-right: 10px;
}

.crumbs .webix_list_item {
    border-right: none;
    color: #2378ff;
    max-width: 180px;
}

    .crumbs .webix_list_item:first-child {
        min-width: 40px;
    }

    .crumbs .webix_list_item:not(:first-child) {
        min-width: 90px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .crumbs .webix_list_item:not(:first-child) {
        margin-left: -10px;
    }

.explorer:has(.search-bar .search-input:not(.hidden)) .crumbs {
    transition: width .3s ease-in-out;
}

.explorer .search-bar .search-input.hidden {
    width: 0 !important;
    transition: width .3s ease-in-out;
}

.explorer .search-bar .search-input,
.explorer:has(.search-bar .search-input.hidden) .crumbs {
    width: calc(100% - 30px) !important;
    transition: width .3s ease-in-out;
}

.explorer .search-bar .icon-container .webix_template {
    padding-left: 0;
    padding-right: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #2378ff;
}

.webix_view.webix_window.webix_popup .webix_win_content .pages .webix_view.webix_list .webix_scroll_cont {
    border-top-color: transparent;
}

.explorer .webix_table_radio.checked {
    background-color: #2378ff;
}

.explorer .webix_table_radio {
    width: 15px;
    height: 15px;
    border: 1px solid #2378ff;
    border-radius: 50%;
    margin-top: 12px;
    box-shadow: 0px 0px 0px 2px #fff inset;
}


/******************************************* SCALE FIELD ************************************************* */
.scale-field.field .field-input-wrapper {
    padding: 0px;
}

.scale-field.composite-field .webix_control .webix_el_box .webix_button {
    background-color: transparent;
}

.scale-field.composite-field .webix_control div.webix_inp_static {
    text-align: center !important;
    /*line-height: 31px !important;*/
    /*border-left: 1px solid #ccc;*/
    /*border-radius: 0px;*/
    background-color: transparent;
}


    .scale-field.composite-field .webix_control .webix_el_box .webix_button:focus,
    .scale-field.composite-field .webix_control div.webix_inp_static:focus {
        border: none;
    }

    .scale-field.composite-field .webix_control .webix_el_box .webix_button:hover,
    .scale-field.composite-field .webix_control div.webix_inp_static:hover {
        color: #fff;
        border: none;
    }

.scale-field.composite-field.is-readonly .webix_control div.webix_inp_static {
    background-color: transparent;
    border-left: 1px solid transparent;
}


.scale-field.composite-field.is-readonly .webix_control .webix_el_box.webix_disabled_box div.webix_inp_static {
    color: inherit;
}


.scale-field .x-container.field-content-wrapper {
    border: none;
    border-radius: 0;
}

    .scale-field .x-container.field-content-wrapper .field-content-wrapper {
        border: none;
        box-shadow: inset 0 0 0 1px #CCC;
    }

.scale-field .side-button:not(.webix_el_richselect) {
    border-radius: 50%;
    border: 1px solid #CCC;
    width: 20px;
    height: 20px;
    min-width: unset;
}

    .scale-field .side-button:not(.webix_el_richselect) button {
        padding: unset;
    }

.scale-field .webix_el_text .webix_el_box > input {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    padding: 4px;
}

.scale-field .webix_el_richselect .webix_el_box .webix_inp_static {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    padding: 0;
}

/******************************* MILESTONE FIELD ***********************************/
.milestone-field .field-content-wrapper {
    border-color: #FFF;
}

.milestone-field.field:hover .field-content-wrapper, .milestone-field.field.is-focused .field-content-wrapper {
    border-color: #FFF;
}

.milestone-field .webix_timeline_value span {
    cursor: pointer;
    text-decoration: underline;
}

.milestone-field .webix_timeline_value .not-reached {
    color: #ccc;
}



/******************** ADVANCED COLOR PICKER FIELD ********************/
.advancedcolorpicker-field.field .field-input-wrapper {
    padding: 0px;
}


.advancedcolorpicker-field.composite-field .webix_control div.webix_inp_static {
    padding-left: 10px;
    line-height: 31px !important;
    border-radius: 0px;
}

.advancedcolorpicker-field.composite-field .webix_control div.webix_input_icon {
    top: 2px !important;
    right: 10px !important;
}
/*********************************************************************/


/******************** COUNTER FIELD ********************/
.counterfield-field.field .field-input-wrapper {
    padding: 0;
}

.counterfield-field.field.composite-field .webix_control input.webix_inp_counter_value {
    max-width: calc(100% - 27px - 27px);
    width: 100%;
    border: 0;
    cursor: text;
}

.counterfield-field.field.composite-field .webix_control button.webix_inp_counter_next,
.counterfield-field.field.composite-field .webix_control button.webix_inp_counter_prev {
    width: 27px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: rgba(198, 198, 198, 0.2);
    font-size: 0;
}

    .counterfield-field.field.composite-field .webix_control button.webix_inp_counter_next:hover,
    .counterfield-field.field.composite-field .webix_control button.webix_inp_counter_prev:hover {
        background: #E0E0E0;
        color: white;
    }

.counterfield-field.field.composite-field .webix_control button.webix_inp_counter_next {
    border-left: 1px solid #CCC;
}

    .counterfield-field.field.composite-field .webix_control button.webix_inp_counter_next:before {
        font-family: "pat-icons";
        content: "\f1cd";
        font-size: 14px;
    }

.counterfield-field.field.composite-field .webix_control button.webix_inp_counter_prev {
    border-right: 1px solid #CCC;
}

    .counterfield-field.field.composite-field .webix_control button.webix_inp_counter_prev:before {
        font-family: "pat-icons";
        content: "\f1ce";
        font-size: 14px;
    }

.counterfield-field.field.composite-field.is-readonly .webix_control button.webix_inp_counter_next,
.counterfield-field.field.composite-field.is-readonly .webix_control button.webix_inp_counter_prev {
    visibility: hidden;
}
/*******************************************************/

.image-message {
    display: flex;
    flex-direction: column;
    align-items: center;
}

    .image-message.center-page {
        justify-content: center;
        height: 100%;
    }

    .image-message > div:first-of-type {
        width: 200px;
        height: 200px;
    }

    .image-message > div.arm {
        background-image: url(../Svg/arm.svg);
    }

    .image-message > div.nocreditcard {
        background-image: url(../Svg/money.svg);
    }

    .image-message > div.nochat {
        background-image: url(../Svg/bubble.svg);
    }

    .image-message > div.ghost {
        background-image: url(../Svg/ghost.svg);
    }

    .image-message > div.mail {
        background-image: url(../Svg/mail.svg);
    }

    .image-message > div.mailbox {
        background-image: url(../Svg/mailbox.svg);
    }

    .image-message > div.time {
        background-image: url(../Svg/time.svg);
    }

    .image-message > div.title {
        font-weight: 600;
        font-size: 14px;
        padding: 0;
    }

    .image-message > div.text {
        font-size: 12px;
        padding: 0;
    }


.x-btn-icon-el-default-small[class^="fa-"], .x-btn-icon-el-default-small[class*=" fa-"] {
    height: unset;
}



.x-btn-icon-left > .x-btn-icon-el-default-small[class^="fa-"],
.x-btn-icon-left > .x-btn-icon-el-default-small[class*=" fa-"],
.x-btn-icon-right > .x-btn-icon-el-default-small[class^="fa-"],
.x-btn-icon-right > .x-btn-icon-el-default-small[class*=" fa-"] {
    width: unset;
}

/* Gantt save button "IsDirty" management */

.gantt-save-needed::after {
    content: '';
    background-color: #EB3334;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    display: inline-block;
    position: absolute;
    top: 8px;
    right: 0;
}

.gantt-save-needed .icon-save::before {
    color: #EB3334 !important;
}

/* COPY & PASTE AUTOMATE */
.context-menu {
    display: none;
    position: absolute;
    background-color: white;
    border: 1px solid #ccc;
    border-top: 2px solid #999;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    width: 100px;
    height: 35px;
}

    .context-menu .liDiv {
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        list-style: none;
        padding: 0;
        margin: 0;
        height: 100%;
        cursor: pointer;
        background-color: white;
    }

        .context-menu .liDiv .text {
            padding: 4px 8px;
        }

.lastEl {
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    border: 1px solid #ccc;
    margin: -1.2px !important;
}

.context-menu .ulDiv:hover {
    background: #7bdbff;
}

.webix_column > div,
.webix_table_cell {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.webix_row_select {
    border-bottom: 1px solid #EDEFF0 !important;
    border-top: unset !important;
    color: #222 !important;
}

.webix_row_select,
.datatable-row-hover {
    background: #EDEFF0 !important;
}

.webix_first > .webix_row_select,
.webix_first > .datatable-row-hover {
    box-shadow: inset 5px 0px 0px #EDEFF0 !important;
}

/*
	####################################################
	################ TRIGGER STATISTICS ################
	####################################################
*/

.trigger-stat-total-run-popup {
    padding-left: 5px;
    padding-right: 6px;
}

    .trigger-stat-total-run-popup > p {
        font-size: 14px;
        padding-bottom: 7px;
    }

    .trigger-stat-total-run-popup .success-count,
    .trigger-stat-total-run-popup .fail-count {
        display: flex;
        flex-direction: row;
        justify-content: start;
        align-items: center;
    }

        .trigger-stat-total-run-popup .success-count div,
        .trigger-stat-total-run-popup .fail-count div {
            height: 8px;
            width: 8px;
            border-radius: 50%;
            margin-right: 7px;
        }

        .trigger-stat-total-run-popup .success-count div {
            background-color: #109006;
        }

        .trigger-stat-total-run-popup .fail-count div {
            background-color: #EF5350;
        }

.datatable-pager .webix_pager_item,
.datatable-pager .webix_pager_item:hover {
    background: transparent !important;
}

.datatable-pager .webix_icon.wxi-angle-double-left,
.datatable-pager .webix_icon.wxi-angle-left,
.datatable-pager .webix_icon.wxi-angle-right,
.datatable-pager .webix_icon.wxi-angle-double-right {
    font-family: "Font Awesome 6 Sharp";
    font-size: 16px;
}

.datatable-pager .webix_icon.wxi-angle-double-left,
.datatable-pager .webix_icon.wxi-angle-left {
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
}

    .datatable-pager .webix_icon.wxi-angle-left::before,
    .datatable-pager .webix_icon.wxi-angle-right::before {
        content: "\f04b" !important;
    }

    .datatable-pager .webix_icon.wxi-angle-double-left::before,
    .datatable-pager .webix_icon.wxi-angle-double-right::before {
        content: "\f04e" !important;
    }

.datatable-refresh .webix_button.webix_img_btn,
.datatable-refresh .webix_button.webix_img_btn:hover {
    background: transparent;
    border-color: transparent;
    color: black;
    font-weight: 400;
}

.trigger-stat .webix_multicombo_value {
    padding: 0 12px 0 12px;
}

    .trigger-stat .webix_multicombo_value .webix_multicombo_delete {
        position: relative;
        top: auto;
        left: auto;
        right: auto;
        bottom: auto;
        margin: 0 0 0 6px;
    }

        .trigger-stat .webix_multicombo_value .webix_multicombo_delete::after {
            content: '\4b';
            font-family: 'pat-font';
            font-size: 12px;
        }

.trigger-stat .trigger-history-workflow-container {
    background: #F7F8FA;
    overflow-y: auto;
}

.trigger-stat .spacer {
    width: 100%;
    height: 15px;
    background: transparent;
}

.trigger-stat .splitter-container {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

    .trigger-stat .splitter-container .splitter {
        transform: rotate(90deg);
        width: 10px;
        border: 1.5px solid #8C88FF;
        margin-bottom: 2px;
        margin-top: 2px;
    }

    .trigger-stat .splitter-container .symbol {
        margin-top: 5px;
        margin-bottom: 5px;
        padding-left: 1.5px;
        color: #8C88FF;
    }

    .trigger-stat .splitter-container .or-splitter-symbol {
        padding: 2px 4px;
        border: 1px solid #8C88FF;
        color: #FFF;
        text-align: center;
        border-radius: 4px;
        background: #8C88FF;
        font-weight: 500;
        font-size: 10px;
        margin-top: 5px;
        margin-bottom: 5px;
    }

.trigger-stat .trigger-history-item-container {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}

    .trigger-stat .trigger-history-item-container .trigger-history-item-body-container {
        display: flex;
        flex-direction: row;
        width: 80%;
        align-items: center;
        justify-content: flex-start;
        padding: 14px 18px;
        border-radius: 10px;
        margin-bottom: 5px;
        margin-top: 5px;
        background: #FFF;
        box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.1);
    }

        .legenda div i,
        .trigger-legend-tooltip-container div i,
        .trigger-stat .trigger-history-item-container .trigger-history-item-body-container .icon-container {
            background: #F4F6F6;
            border-radius: 10px;
        }

            .legenda div .fal.fa-location-crosshairs,
            .legenda div .fal.fa-split,
            .trigger-legend-tooltip-container div .fal.fa-location-crosshairs,
            .trigger-legend-tooltip-container div .fal.fa-split,
            .trigger-stat .trigger-history-item-container .trigger-history-item-body-container .icon-container .fal.fa-location-crosshairs,
            .trigger-stat .trigger-history-item-container .trigger-history-item-body-container .icon-container .fal.fa-split {
                padding: 8px;
            }

            .legenda div .fal.fa-location-crosshairs,
            .trigger-legend-tooltip-container div .fal.fa-location-crosshairs,
            .trigger-stat .trigger-history-item-container .trigger-history-item-body-container .icon-container .fal.fa-location-crosshairs {
                color: #8C88FF;
            }

            .legenda div .fal.fa-split,
            .trigger-legend-tooltip-container div .fal.fa-split,
            .trigger-stat .trigger-history-item-container .trigger-history-item-body-container .icon-container .fal.fa-split {
                color: #009D66;
            }

        .trigger-stat .trigger-history-item-container .trigger-history-item-body-container .text-container {
            line-height: 20px;
            padding-left: 10px;
            display: flex;
            flex-direction: column;
            width: 78%;
        }

            .trigger-stat .trigger-history-item-container .trigger-history-item-body-container .text-container span:first-child,
            .trigger-stat .trigger-history-item-container .trigger-history-item-body-container .text-container span:last-child {
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
            }

            .trigger-stat .trigger-history-item-container .trigger-history-item-body-container .text-container span:first-child {
                font-weight: 600;
                font-size: 13px;
            }

            .trigger-stat .trigger-history-item-container .trigger-history-item-body-container .text-container span:last-child {
                font-size: 11px;
            }

        .trigger-stat .trigger-history-item-container .trigger-history-item-body-container .success-container {
            display: flex;
            flex-direction: column;
            align-items: flex-end;
            justify-content: space-between;
            width: 30%;
            height: 100%;
        }

            .trigger-stat .trigger-history-item-container .trigger-history-item-body-container .success-container span {
                font-size: 11px;
                color: #EB3333;
                text-decoration: underline;
                text-align: right;
            }

                .trigger-stat .trigger-history-item-container .trigger-history-item-body-container .success-container span:hover {
                    cursor: pointer;
                }

            .trigger-stat .trigger-history-item-container .trigger-history-item-body-container .success-container .good {
                color: #2cc48a;
            }

            .trigger-stat .trigger-history-item-container .trigger-history-item-body-container .success-container .bad {
                color: #EB3333;
            }

.trigger-stat .legend-button {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: center;
    padding-top: 8px;
}

    .trigger-stat .legend-button div {
        padding: 6px;
        background: #FFF;
        box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.1);
        border-radius: 10px;
        color: #4198FF;
        display: flex;
        flex-direction: row;
        align-items: center;
    }

        .trigger-stat .legend-button div:hover {
            cursor: help;
        }

        .trigger-stat .legend-button div span {
            padding-left: 4px;
        }

.legenda,
.trigger-legend-tooltip-container {
    min-width: 5vw;
}

    .legenda div,
    .trigger-legend-tooltip-container div {
        display: flex;
        flex-direction: row;
        padding: 8px;
        justify-content: flex-start;
        align-items: center;
    }

        .legenda div span,
        .trigger-legend-tooltip-container div span {
            margin-left: 10px;
        }

.trigger-stat .custom-webix-datatable-style .webix_cell {
    line-height: normal !important;
    display: flex;
    flex-direction: row;
    align-items: center;
}

.trigger-stat .custom-webix-datatable-style .view-execution-log .webix_cell {
    justify-content: center;
}

.trigger-stat .single-trigger-history-back-arrow .webix_template {
    padding-left: 0;
}

.trigger-stat .single-trigger-history-back-arrow .go-back-to-grid {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
}

    .trigger-stat .single-trigger-history-back-arrow .go-back-to-grid:hover {
        cursor: pointer;
    }

    .trigger-stat .single-trigger-history-back-arrow .go-back-to-grid span {
        font-weight: 600;
        font-size: 15px;
        margin-left: 10px;
    }

.trigger-stat .trigger-history-spline .webix_template {
    display: flex;
    flex-direction: column;
    justify-content: end;
    height: 88%;
}

    .trigger-stat .trigger-history-spline .webix_template .container {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
    }

        .trigger-stat .trigger-history-spline .webix_template .container .value,
        .trigger-stat .trigger-history-spline .webix_template .container .sub-value {
            font-weight: 500;
        }

        .trigger-stat .trigger-history-spline .webix_template .container .value {
            font-size: 30px;
        }

        .trigger-stat .trigger-history-spline .webix_template .container .sub-value {
            font-size: 13px;
        }

.trigger-stat .trigger-infos {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
}

    .trigger-stat .trigger-infos .Title {
        font-size: 18px;
        font-weight: 600;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

        .trigger-stat .trigger-infos .Title:hover {
            cursor: pointer;
        }

    .trigger-stat .trigger-infos .sub-trigger-infos {
        line-height: 20px;
    }

        .trigger-stat .trigger-infos .sub-trigger-infos div span:first-child {
            font-weight: 500;
        }

        .trigger-stat .trigger-infos .sub-trigger-infos div span:last-child {
            margin-left: 5px;
        }

        .trigger-stat .trigger-infos .sub-trigger-infos .trigger-enabled,
        .trigger-stat .trigger-infos .sub-trigger-infos .trigger-disabled {
            padding: 2px 10px;
            border-radius: 15px;
        }

        .trigger-stat .trigger-infos .sub-trigger-infos .trigger-disabled {
            color: #7B7B7B;
            background-color: #E6E6E6;
            border: 1px solid #7B7B7B;
        }

        .trigger-stat .trigger-infos .sub-trigger-infos .trigger-enabled {
            color: #2FC38A;
            background-color: #D0F3E8;
            border: 1px solid #2FC38A;
        }

.trigger-stat .error-text-container {
    background: #FCD6D6;
    color: #EA5454;
}

    .trigger-stat .error-text-container .inner-container {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        padding-top: 5px;
        height: 100%;
    }

        .trigger-stat .error-text-container .inner-container i:last-child:hover {
            cursor: pointer;
        }

        .trigger-stat .error-text-container .inner-container div {
            display: flex;
            flex-direction: row;
            align-items: center;
            width: 98%;
        }

        .trigger-stat .error-text-container .inner-container .error-text {
            padding-left: 10px;
            max-width: 90%;
        }


.trigger-stat .trigger-history-or-condition-container {
    margin-top: 12px;
    padding-bottom: 2px;
    background-image: url('data:image/svg+xml,%3csvg width=\'100%25\' height=\'100%25\' xmlns=\'http://www.w3.org/2000/svg\'%3e%3crect width=\'100%25\' height=\'100%25\' fill=\'none\' rx=\'5\' ry=\'5\' stroke=\'black\' stroke-width=\'1\' stroke-dasharray=\'5%2c 6\' stroke-dashoffset=\'33\' stroke-linecap=\'butt\'/%3e%3c/svg%3e');
    border-radius: 5px;
}

    .trigger-stat .trigger-history-or-condition-container.collapsed {
        background-image: none;
    }

    .trigger-stat .trigger-history-or-condition-container div:last-child {
        overflow: hidden;
        transition: max-height 0.3s ease-out;
    }

    .trigger-stat .trigger-history-or-condition-container .header {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        height: 40px;
        padding: 0 20px;
    }

    .trigger-stat .trigger-history-or-condition-container.collapsed .header {
        box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.1);
        background: #E6E7E9;
        border-radius: 5px;
    }

    .trigger-stat .trigger-history-or-condition-container .header .left-container {
        display: flex;
        flex-direction: row;
        align-items: center;
        width: 38%;
        justify-content: space-evenly;
    }

        .trigger-stat .trigger-history-or-condition-container .header .left-container .icon-container {
            display: flex;
            align-items: center;
        }

            .trigger-stat .trigger-history-or-condition-container .header .left-container .icon-container i:first-child {
                padding-right: 10px;
            }

            .trigger-stat .trigger-history-or-condition-container .header .left-container .icon-container i:last-child {
                color: #8c90fe;
            }

        .trigger-stat .trigger-history-or-condition-container .header .left-container span {
            font-weight: 500;
        }

.context-menu .liDiv:hover {
    background: #7bdbff;
}

.trigger-stat .trigger-history-or-condition-container .header .right-container {
    visibility: hidden;
}

.trigger-stat .trigger-history-or-condition-container.collapsed .header .right-container {
    visibility: visible;
    padding: 2px 6px;
    border: 1px solid #FFF;
    text-align: center;
    border-radius: 50%;
    background: #FFF;
    font-weight: 500;
    font-size: 12px;
}

.pasteEl {
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}

.testUserObjectLink {
    top: 6px !important;
}

    .testUserObjectLink input {
        font-size: smaller;
    }

.testBannerContainer {
    background-color: #e9ebec;
    border-radius: 5px;
    border: 1px solid #989898;
    top: 14px !important;
}

.testUserObjectLink .side-button:before {
    font-size: 16px !important;
}

.testUserObjectLink .side-button {
    width: 25px;
    min-width: 25px;
}

.labelTestUser {
    top: 11px !important;
}

.trigger-engine .white-box .task-designer {
    /* background-color: #f4f6f6; */
    background-color: #f4f6f6;
    border-radius: 15px;
}

.trigger-engine .white-box .icon-selected {
    background-color: #b6e2f5;
}

.trigger-engine .white-box:hover .task-designer {
    background-color: #b6e2f5;
    border-radius: 15px;
}

.title-legenda {
    background-color: white;
    padding: 8px;
    color: #7ea3ff;
    border-radius: 10px;
    /*width:118px;*/
    box-shadow: 2px 4px 8px 3px #e3e4e5;
    float: right;
    font-size: 16px;
}

    .title-legenda:before {
        margin-right: 5px;
        font-size: 18px;
    }

    .title-legenda:hover {
        cursor: help;
    }

        .title-legenda:hover + .legenda {
            display: flex;
            flex-direction: column;
            position: absolute;
            right: -50px;
            top: 36px;
            background-color: white;
            border-radius: 10px;
            box-shadow: 2px 4px 8px 3px #e3e4e5;
            padding: 10px !important;
        }

.legenda {
    display: none;
}

.legend-wrapper {
    left: 10px !important;
    height: 0px !important;
    position: absolute;
    /*right:-50px;
		top:-20px;*/
    right: -26px;
    top: -37px;
    z-index: 100;
}

.task {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 5px;
}

.legend-wrapper .task .text {
    padding: 5px;
}

.legend-wrapper .task .legendIcon {
    font-size: 20px;
}

.legend-wrapper .task .legendIconContainer {
    background-color: #f4f6f6;
    border-radius: 10px;
    padding: 5px;
}

.x-triggerCollapsed .x-tool {
    top: 0px !important;
}

.trigger-engine .section-title-line {
    margin-top: -30px;
}

.locks_unseen .webix_lock:before {
    display: none;
}

.disabled-field .x-mask {
    background-color: hsla(0, 0%, 98%,0)
}

.webix_hint {
    min-width: 400px;
    background-color: #FFF;
    box-shadow: 0 6px 15px 0 rgba(34, 34, 34, 0.4);
    border: 0px none;
    border-radius: 6px;
}

    .webix_hint .webix_hint_label {
        font-size: 14px;
    }


.excel-filter .webix_inp_static,
.excel-filter-popup .webix_win_body .webix_scroll_cont div {
    display: flex;
    align-items: center;
}

.excel-filter .webix_el_richselect .webix_el_box div {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.excel-filter .webix_el_datepicker .webix_el_box div,
.excel-filter .webix_el_text .webix_el_box input {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}



/* ------- donut - start ------- */

.donut-svg-item {
    width: 100%;
    font-size: 15px;
}

    .donut-svg-item .donut-ring {
        stroke: #EBEBEB;
    }

    .donut-svg-item .donut-segment {
        transform-origin: center;
        stroke: #BBBBBB;
    }

    .donut-svg-item .donut-text {
        font-family: Arial, Helvetica, sans-serif;
        fill: #BBBBBB;
    }

    .donut-svg-item .donut-value {
        font-weight: bold;
    }


/* ------- donut - end --------- */








/**************************************************************************/
/*                       spostare input PLANNER.CSS
/**************************************************************************/

.gantt .x-grid-cell .badge {
    width: 30px;
    height: 30px;
    margin: 0 auto;
    color: #FFFFFF;
}

.gantt .x-grid-cell .planner-percentdone {
    height: 30px;
    width: 30px;
    font-size: 14px;
    --gantt-percentdone-angle: 0;
    --gantt-color: red;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
    max-height: 3em;
    max-width: 3em;
    border-radius: 50%;
    background-color: #e0e0e7;
    background-image: conic-gradient(var(--gantt-color) 0 var(--gantt-percentdone-angle),transparent var(--gantt-percentdone-angle) 1turn);
}

    .gantt .x-grid-cell .planner-percentdone::after {
        content: attr(data-value);
        display: flex;
        align-items: center;
        justify-content: center;
        width: calc(100% - 6px);
        height: calc(100% - 6px);
        border-radius: 50%;
        background: #fff;
        font-size: .8em;
    }

.gantt div:has(> .sch-gantt-progress-bar) {
    width: 100%;
    height: 100%;
    border-radius: 13px;
    overflow: hidden;
}

.gantt .sch-gantt-task.sch-event-startsoutside div:has(> .sch-gantt-progress-bar) {
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}

.gantt div.gantt-context-menu.keep-visible {
    display: block;
}


.gantt-context-menu-popup {
}

    .gantt-context-menu-popup .header {
        background-color: #E6F2FF;
        display: flex;
        align-items: center;
    }


        .gantt-context-menu-popup .header span.webix_icon {
            color: #007AFF;
            font-size: 16px;
        }

        .gantt-context-menu-popup .header div.webix_el_label .webix_el_box {
            line-height: 30px !important;
            font-size: 16px;
        }

    .gantt-context-menu-popup .webix_el_counter .webix_inp_counter_prev,
    .gantt-context-menu-popup .webix_el_counter .webix_inp_counter_next {
        width: 30px;
        height: 30px;
        border-radius: 15px;
        padding: 0;
        border: 1px solid #ccc;
    }

    .gantt-context-menu-popup .border-bottom {
        border-bottom: 1px solid #ccc;
    }

    .gantt-context-menu-popup .webix_el_counter .webix_inp_counter_prev {
        margin-right: 4px;
    }

    .gantt-context-menu-popup .webix_el_counter .webix_inp_counter_next {
        margin-left: 4px;
    }

    .gantt-context-menu-popup .webix_view.webix_layout_line .webix_el_label {
        font-weight: 600;
    }

    .gantt-context-menu-popup .webix_inp_counter_value {
        border-width: 1px;
    }

    .gantt-context-menu-popup .webix_view.webix_layout_line .option-button button {
        display: flex;
        align-items: center;
        justify-content: space-between;
        background-color: #FFF;
        border-color: #CCCCCC;
        border-radius: 4px;
        font-weight: 400;
        font-size: 14px;
        text-transform: none;
    }

.gantt.sch-ganttpanel-showbaseline .sch-gantt-parenttask-bar {
    height: 10px;
}

/******************************************************************************
*                                Toggle Field                                 *
******************************************************************************/

.togglefield-field.field.composite-field .webix_control .webix_el_box {
    display: flex;
}

    .togglefield-field.field.composite-field .webix_control .webix_el_box .webix_switch_box {
        min-width: 50px;
    }

    .togglefield-field.field.composite-field .webix_control .webix_el_box .webix_switch_on {
        background-color: #CCC;
    }

/******************************************************************************/

[class^="emojijs-emoji-"],
[class*=" emojijs-emoji-"]{
    background-size:100%;
    background-repeat:no-repeat;
    width:1em;
    height:1em;
    vertical-align:bottom;
    display:inline-block;
}

.emojijs-emoji-26c5{
    background-image:url('//twemoji.maxcdn.com/72x72/26c5.png');
}
.emojijs-emoji-1f48c{
    background-image:url('//twemoji.maxcdn.com/72x72/1f48c.png');
}
.emojijs-emoji-1f605{
    background-image:url('//twemoji.maxcdn.com/72x72/1f605.png');
}
.emojijs-emoji-1f466{
    background-image:url('//twemoji.maxcdn.com/72x72/1f466.png');
}
.emojijs-emoji-1f467{
    background-image:url('//twemoji.maxcdn.com/72x72/1f467.png');
}
.emojijs-emoji-1f48b{
    background-image:url('//twemoji.maxcdn.com/72x72/1f48b.png');
}
.emojijs-emoji-1f468{
    background-image:url('//twemoji.maxcdn.com/72x72/1f468.png');
}
.emojijs-emoji-1f469{
    background-image:url('//twemoji.maxcdn.com/72x72/1f469.png');
}
.emojijs-emoji-1f455{
    background-image:url('//twemoji.maxcdn.com/72x72/1f455.png');
}
.emojijs-emoji-1f45e{
    background-image:url('//twemoji.maxcdn.com/72x72/1f45e.png');
}
.emojijs-emoji-1f4f7{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4f7.png');
}
.emojijs-emoji-260e{
    background-image:url('//twemoji.maxcdn.com/72x72/260e.png');
}
.emojijs-emoji-1f4f1{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4f1.png');
}
.emojijs-emoji-1f4e0{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4e0.png');
}
.emojijs-emoji-1f4bb{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4bb.png');
}
.emojijs-emoji-1f44a{
    background-image:url('//twemoji.maxcdn.com/72x72/1f44a.png');
}
.emojijs-emoji-1f44d{
    background-image:url('//twemoji.maxcdn.com/72x72/1f44d.png');
}
.emojijs-emoji-261d{
    background-image:url('//twemoji.maxcdn.com/72x72/261d.png');
}
.emojijs-emoji-270a{
    background-image:url('//twemoji.maxcdn.com/72x72/270a.png');
}
.emojijs-emoji-270c{
    background-image:url('//twemoji.maxcdn.com/72x72/270c.png');
}
.emojijs-emoji-270b{
    background-image:url('//twemoji.maxcdn.com/72x72/270b.png');
}
.emojijs-emoji-1f3bf{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3bf.png');
}
.emojijs-emoji-26f3{
    background-image:url('//twemoji.maxcdn.com/72x72/26f3.png');
}
.emojijs-emoji-1f3be{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3be.png');
}
.emojijs-emoji-26be{
    background-image:url('//twemoji.maxcdn.com/72x72/26be.png');
}
.emojijs-emoji-1f3c4{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3c4.png');
}
.emojijs-emoji-26bd{
    background-image:url('//twemoji.maxcdn.com/72x72/26bd.png');
}
.emojijs-emoji-1f3a3{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3a3.png');
}
.emojijs-emoji-1f434{
    background-image:url('//twemoji.maxcdn.com/72x72/1f434.png');
}
.emojijs-emoji-1f697{
    background-image:url('//twemoji.maxcdn.com/72x72/1f697.png');
}
.emojijs-emoji-26f5{
    background-image:url('//twemoji.maxcdn.com/72x72/26f5.png');
}
.emojijs-emoji-2708{
    background-image:url('//twemoji.maxcdn.com/72x72/2708.png');
}
.emojijs-emoji-1f683{
    background-image:url('//twemoji.maxcdn.com/72x72/1f683.png');
}
.emojijs-emoji-1f685{
    background-image:url('//twemoji.maxcdn.com/72x72/1f685.png');
}
.emojijs-emoji-2753{
    background-image:url('//twemoji.maxcdn.com/72x72/2753.png');
}
.emojijs-emoji-2757{
    background-image:url('//twemoji.maxcdn.com/72x72/2757.png');
}
.emojijs-emoji-2764{
    background-image:url('//twemoji.maxcdn.com/72x72/2764.png');
}
.emojijs-emoji-1f494{
    background-image:url('//twemoji.maxcdn.com/72x72/1f494.png');
}
.emojijs-emoji-1f550{
    background-image:url('//twemoji.maxcdn.com/72x72/1f550.png');
}
.emojijs-emoji-1f551{
    background-image:url('//twemoji.maxcdn.com/72x72/1f551.png');
}
.emojijs-emoji-1f552{
    background-image:url('//twemoji.maxcdn.com/72x72/1f552.png');
}
.emojijs-emoji-1f553{
    background-image:url('//twemoji.maxcdn.com/72x72/1f553.png');
}
.emojijs-emoji-1f554{
    background-image:url('//twemoji.maxcdn.com/72x72/1f554.png');
}
.emojijs-emoji-1f555{
    background-image:url('//twemoji.maxcdn.com/72x72/1f555.png');
}
.emojijs-emoji-1f556{
    background-image:url('//twemoji.maxcdn.com/72x72/1f556.png');
}
.emojijs-emoji-1f557{
    background-image:url('//twemoji.maxcdn.com/72x72/1f557.png');
}
.emojijs-emoji-1f558{
    background-image:url('//twemoji.maxcdn.com/72x72/1f558.png');
}
.emojijs-emoji-23f0{
    background-image:url('//twemoji.maxcdn.com/72x72/23f0.png');
}
.emojijs-emoji-1f55a{
    background-image:url('//twemoji.maxcdn.com/72x72/1f55a.png');
}
.emojijs-emoji-1f55b{
    background-image:url('//twemoji.maxcdn.com/72x72/1f55b.png');
}
.emojijs-emoji-1f338{
    background-image:url('//twemoji.maxcdn.com/72x72/1f338.png');
}
.emojijs-emoji-1f531{
    background-image:url('//twemoji.maxcdn.com/72x72/1f531.png');
}
.emojijs-emoji-1f339{
    background-image:url('//twemoji.maxcdn.com/72x72/1f339.png');
}
.emojijs-emoji-1f384{
    background-image:url('//twemoji.maxcdn.com/72x72/1f384.png');
}
.emojijs-emoji-1f48d{
    background-image:url('//twemoji.maxcdn.com/72x72/1f48d.png');
}
.emojijs-emoji-1f48e{
    background-image:url('//twemoji.maxcdn.com/72x72/1f48e.png');
}
.emojijs-emoji-1f3e0{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3e0.png');
}
.emojijs-emoji-26ea{
    background-image:url('//twemoji.maxcdn.com/72x72/26ea.png');
}
.emojijs-emoji-1f3e2{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3e2.png');
}
.emojijs-emoji-1f689{
    background-image:url('//twemoji.maxcdn.com/72x72/1f689.png');
}
.emojijs-emoji-26fd{
    background-image:url('//twemoji.maxcdn.com/72x72/26fd.png');
}
.emojijs-emoji-1f5fb{
    background-image:url('//twemoji.maxcdn.com/72x72/1f5fb.png');
}
.emojijs-emoji-1f3a4{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3a4.png');
}
.emojijs-emoji-1f3a5{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3a5.png');
}
.emojijs-emoji-1f3b5{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3b5.png');
}
.emojijs-emoji-1f511{
    background-image:url('//twemoji.maxcdn.com/72x72/1f511.png');
}
.emojijs-emoji-1f3b7{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3b7.png');
}
.emojijs-emoji-1f3b8{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3b8.png');
}
.emojijs-emoji-1f3ba{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3ba.png');
}
.emojijs-emoji-1f374{
    background-image:url('//twemoji.maxcdn.com/72x72/1f374.png');
}
.emojijs-emoji-1f377{
    background-image:url('//twemoji.maxcdn.com/72x72/1f377.png');
}
.emojijs-emoji-2615{
    background-image:url('//twemoji.maxcdn.com/72x72/2615.png');
}
.emojijs-emoji-1f370{
    background-image:url('//twemoji.maxcdn.com/72x72/1f370.png');
}
.emojijs-emoji-1f37a{
    background-image:url('//twemoji.maxcdn.com/72x72/1f37a.png');
}
.emojijs-emoji-26c4{
    background-image:url('//twemoji.maxcdn.com/72x72/26c4.png');
}
.emojijs-emoji-2601{
    background-image:url('//twemoji.maxcdn.com/72x72/2601.png');
}
.emojijs-emoji-2600{
    background-image:url('//twemoji.maxcdn.com/72x72/2600.png');
}
.emojijs-emoji-2614{
    background-image:url('//twemoji.maxcdn.com/72x72/2614.png');
}
.emojijs-emoji-1f313{
    background-image:url('//twemoji.maxcdn.com/72x72/1f313.png');
}
.emojijs-emoji-1f304{
    background-image:url('//twemoji.maxcdn.com/72x72/1f304.png');
}
.emojijs-emoji-1f47c{
    background-image:url('//twemoji.maxcdn.com/72x72/1f47c.png');
}
.emojijs-emoji-1f431{
    background-image:url('//twemoji.maxcdn.com/72x72/1f431.png');
}
.emojijs-emoji-1f42f{
    background-image:url('//twemoji.maxcdn.com/72x72/1f42f.png');
}
.emojijs-emoji-1f43b{
    background-image:url('//twemoji.maxcdn.com/72x72/1f43b.png');
}
.emojijs-emoji-1f429{
    background-image:url('//twemoji.maxcdn.com/72x72/1f429.png');
}
.emojijs-emoji-1f42d{
    background-image:url('//twemoji.maxcdn.com/72x72/1f42d.png');
}
.emojijs-emoji-1f433{
    background-image:url('//twemoji.maxcdn.com/72x72/1f433.png');
}
.emojijs-emoji-1f427{
    background-image:url('//twemoji.maxcdn.com/72x72/1f427.png');
}
.emojijs-emoji-1f60a{
    background-image:url('//twemoji.maxcdn.com/72x72/1f60a.png');
}
.emojijs-emoji-1f603{
    background-image:url('//twemoji.maxcdn.com/72x72/1f603.png');
}
.emojijs-emoji-1f61e{
    background-image:url('//twemoji.maxcdn.com/72x72/1f61e.png');
}
.emojijs-emoji-1f620{
    background-image:url('//twemoji.maxcdn.com/72x72/1f620.png');
}
.emojijs-emoji-1f4a9{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4a9.png');
}
.emojijs-emoji-1f4ea{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4ea.png');
}
.emojijs-emoji-1f4ee{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4ee.png');
}
.emojijs-emoji-2709{
    background-image:url('//twemoji.maxcdn.com/72x72/2709.png');
}
.emojijs-emoji-1f4f2{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4f2.png');
}
.emojijs-emoji-1f61c{
    background-image:url('//twemoji.maxcdn.com/72x72/1f61c.png');
}
.emojijs-emoji-1f60d{
    background-image:url('//twemoji.maxcdn.com/72x72/1f60d.png');
}
.emojijs-emoji-1f631{
    background-image:url('//twemoji.maxcdn.com/72x72/1f631.png');
}
.emojijs-emoji-1f613{
    background-image:url('//twemoji.maxcdn.com/72x72/1f613.png');
}
.emojijs-emoji-1f435{
    background-image:url('//twemoji.maxcdn.com/72x72/1f435.png');
}
.emojijs-emoji-1f419{
    background-image:url('//twemoji.maxcdn.com/72x72/1f419.png');
}
.emojijs-emoji-1f437{
    background-image:url('//twemoji.maxcdn.com/72x72/1f437.png');
}
.emojijs-emoji-1f47d{
    background-image:url('//twemoji.maxcdn.com/72x72/1f47d.png');
}
.emojijs-emoji-1f680{
    background-image:url('//twemoji.maxcdn.com/72x72/1f680.png');
}
.emojijs-emoji-1f451{
    background-image:url('//twemoji.maxcdn.com/72x72/1f451.png');
}
.emojijs-emoji-1f4a1{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4a1.png');
}
.emojijs-emoji-1f331{
    background-image:url('//twemoji.maxcdn.com/72x72/1f331.png');
}
.emojijs-emoji-1f48f{
    background-image:url('//twemoji.maxcdn.com/72x72/1f48f.png');
}
.emojijs-emoji-1f381{
    background-image:url('//twemoji.maxcdn.com/72x72/1f381.png');
}
.emojijs-emoji-1f52b{
    background-image:url('//twemoji.maxcdn.com/72x72/1f52b.png');
}
.emojijs-emoji-1f50d{
    background-image:url('//twemoji.maxcdn.com/72x72/1f50d.png');
}
.emojijs-emoji-1f3c3{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3c3.png');
}
.emojijs-emoji-1f528{
    background-image:url('//twemoji.maxcdn.com/72x72/1f528.png');
}
.emojijs-emoji-1f386{
    background-image:url('//twemoji.maxcdn.com/72x72/1f386.png');
}
.emojijs-emoji-1f341{
    background-image:url('//twemoji.maxcdn.com/72x72/1f341.png');
}
.emojijs-emoji-1f342{
    background-image:url('//twemoji.maxcdn.com/72x72/1f342.png');
}
.emojijs-emoji-1f47f{
    background-image:url('//twemoji.maxcdn.com/72x72/1f47f.png');
}
.emojijs-emoji-1f47b{
    background-image:url('//twemoji.maxcdn.com/72x72/1f47b.png');
}
.emojijs-emoji-1f480{
    background-image:url('//twemoji.maxcdn.com/72x72/1f480.png');
}
.emojijs-emoji-1f525{
    background-image:url('//twemoji.maxcdn.com/72x72/1f525.png');
}
.emojijs-emoji-1f4bc{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4bc.png');
}
.emojijs-emoji-1f4ba{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4ba.png');
}
.emojijs-emoji-1f354{
    background-image:url('//twemoji.maxcdn.com/72x72/1f354.png');
}
.emojijs-emoji-26f2{
    background-image:url('//twemoji.maxcdn.com/72x72/26f2.png');
}
.emojijs-emoji-26fa{
    background-image:url('//twemoji.maxcdn.com/72x72/26fa.png');
}
.emojijs-emoji-2668{
    background-image:url('//twemoji.maxcdn.com/72x72/2668.png');
}
.emojijs-emoji-1f3a1{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3a1.png');
}
.emojijs-emoji-1f3ab{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3ab.png');
}
.emojijs-emoji-1f4bf{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4bf.png');
}
.emojijs-emoji-1f4c0{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4c0.png');
}
.emojijs-emoji-1f4fb{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4fb.png');
}
.emojijs-emoji-1f4fc{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4fc.png');
}
.emojijs-emoji-1f4fa{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4fa.png');
}
.emojijs-emoji-1f47e{
    background-image:url('//twemoji.maxcdn.com/72x72/1f47e.png');
}
.emojijs-emoji-303d{
    background-image:url('//twemoji.maxcdn.com/72x72/303d.png');
}
.emojijs-emoji-1f004{
    background-image:url('//twemoji.maxcdn.com/72x72/1f004.png');
}
.emojijs-emoji-1f19a{
    background-image:url('//twemoji.maxcdn.com/72x72/1f19a.png');
}
.emojijs-emoji-1f4b0{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4b0.png');
}
.emojijs-emoji-1f3af{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3af.png');
}
.emojijs-emoji-1f3c6{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3c6.png');
}
.emojijs-emoji-1f3c1{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3c1.png');
}
.emojijs-emoji-1f3b0{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3b0.png');
}
.emojijs-emoji-1f40e{
    background-image:url('//twemoji.maxcdn.com/72x72/1f40e.png');
}
.emojijs-emoji-1f6a4{
    background-image:url('//twemoji.maxcdn.com/72x72/1f6a4.png');
}
.emojijs-emoji-1f6b2{
    background-image:url('//twemoji.maxcdn.com/72x72/1f6b2.png');
}
.emojijs-emoji-26d4{
    background-image:url('//twemoji.maxcdn.com/72x72/26d4.png');
}
.emojijs-emoji-1f6b9{
    background-image:url('//twemoji.maxcdn.com/72x72/1f6b9.png');
}
.emojijs-emoji-1f6ba{
    background-image:url('//twemoji.maxcdn.com/72x72/1f6ba.png');
}
.emojijs-emoji-1f6bc{
    background-image:url('//twemoji.maxcdn.com/72x72/1f6bc.png');
}
.emojijs-emoji-1f489{
    background-image:url('//twemoji.maxcdn.com/72x72/1f489.png');
}
.emojijs-emoji-1f4a4{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4a4.png');
}
.emojijs-emoji-26a1{
    background-image:url('//twemoji.maxcdn.com/72x72/26a1.png');
}
.emojijs-emoji-1f460{
    background-image:url('//twemoji.maxcdn.com/72x72/1f460.png');
}
.emojijs-emoji-1f6c0{
    background-image:url('//twemoji.maxcdn.com/72x72/1f6c0.png');
}
.emojijs-emoji-1f6bd{
    background-image:url('//twemoji.maxcdn.com/72x72/1f6bd.png');
}
.emojijs-emoji-1f50a{
    background-image:url('//twemoji.maxcdn.com/72x72/1f50a.png');
}
.emojijs-emoji-1f4e2{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4e2.png');
}
.emojijs-emoji-1f38c{
    background-image:url('//twemoji.maxcdn.com/72x72/1f38c.png');
}
.emojijs-emoji-1f50f{
    background-image:url('//twemoji.maxcdn.com/72x72/1f50f.png');
}
.emojijs-emoji-1f513{
    background-image:url('//twemoji.maxcdn.com/72x72/1f513.png');
}
.emojijs-emoji-1f306{
    background-image:url('//twemoji.maxcdn.com/72x72/1f306.png');
}
.emojijs-emoji-1f373{
    background-image:url('//twemoji.maxcdn.com/72x72/1f373.png');
}
.emojijs-emoji-1f4c7{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4c7.png');
}
.emojijs-emoji-1f4b1{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4b1.png');
}
.emojijs-emoji-1f4b9{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4b9.png');
}
.emojijs-emoji-1f4e1{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4e1.png');
}
.emojijs-emoji-1f4aa{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4aa.png');
}
.emojijs-emoji-1f3e6{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3e6.png');
}
.emojijs-emoji-1f6a5{
    background-image:url('//twemoji.maxcdn.com/72x72/1f6a5.png');
}
.emojijs-emoji-1f17f{
    background-image:url('//twemoji.maxcdn.com/72x72/1f17f.png');
}
.emojijs-emoji-1f68f{
    background-image:url('//twemoji.maxcdn.com/72x72/1f68f.png');
}
.emojijs-emoji-1f6bb{
    background-image:url('//twemoji.maxcdn.com/72x72/1f6bb.png');
}
.emojijs-emoji-1f46e{
    background-image:url('//twemoji.maxcdn.com/72x72/1f46e.png');
}
.emojijs-emoji-1f3e3{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3e3.png');
}
.emojijs-emoji-1f3e7{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3e7.png');
}
.emojijs-emoji-1f3e5{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3e5.png');
}
.emojijs-emoji-1f3ea{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3ea.png');
}
.emojijs-emoji-1f3eb{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3eb.png');
}
.emojijs-emoji-1f3e8{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3e8.png');
}
.emojijs-emoji-1f68c{
    background-image:url('//twemoji.maxcdn.com/72x72/1f68c.png');
}
.emojijs-emoji-1f695{
    background-image:url('//twemoji.maxcdn.com/72x72/1f695.png');
}
.emojijs-emoji-1f6b6{
    background-image:url('//twemoji.maxcdn.com/72x72/1f6b6.png');
}
.emojijs-emoji-2693{
    background-image:url('//twemoji.maxcdn.com/72x72/2693.png');
}
.emojijs-emoji-1f201{
    background-image:url('//twemoji.maxcdn.com/72x72/1f201.png');
}
.emojijs-emoji-1f49f{
    background-image:url('//twemoji.maxcdn.com/72x72/1f49f.png');
}
.emojijs-emoji-2734{
    background-image:url('//twemoji.maxcdn.com/72x72/2734.png');
}
.emojijs-emoji-2733{
    background-image:url('//twemoji.maxcdn.com/72x72/2733.png');
}
.emojijs-emoji-1f51e{
    background-image:url('//twemoji.maxcdn.com/72x72/1f51e.png');
}
.emojijs-emoji-1f6ad{
    background-image:url('//twemoji.maxcdn.com/72x72/1f6ad.png');
}
.emojijs-emoji-1f530{
    background-image:url('//twemoji.maxcdn.com/72x72/1f530.png');
}
.emojijs-emoji-267f{
    background-image:url('//twemoji.maxcdn.com/72x72/267f.png');
}
.emojijs-emoji-1f4f6{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4f6.png');
}
.emojijs-emoji-2665{
    background-image:url('//twemoji.maxcdn.com/72x72/2665.png');
}
.emojijs-emoji-2666{
    background-image:url('//twemoji.maxcdn.com/72x72/2666.png');
}
.emojijs-emoji-2660{
    background-image:url('//twemoji.maxcdn.com/72x72/2660.png');
}
.emojijs-emoji-2663{
    background-image:url('//twemoji.maxcdn.com/72x72/2663.png');
}
.emojijs-emoji-27bf{
    background-image:url('//twemoji.maxcdn.com/72x72/27bf.png');
}
.emojijs-emoji-1f195{
    background-image:url('//twemoji.maxcdn.com/72x72/1f195.png');
}
.emojijs-emoji-1f199{
    background-image:url('//twemoji.maxcdn.com/72x72/1f199.png');
}
.emojijs-emoji-1f192{
    background-image:url('//twemoji.maxcdn.com/72x72/1f192.png');
}
.emojijs-emoji-1f236{
    background-image:url('//twemoji.maxcdn.com/72x72/1f236.png');
}
.emojijs-emoji-1f21a{
    background-image:url('//twemoji.maxcdn.com/72x72/1f21a.png');
}
.emojijs-emoji-1f237{
    background-image:url('//twemoji.maxcdn.com/72x72/1f237.png');
}
.emojijs-emoji-1f238{
    background-image:url('//twemoji.maxcdn.com/72x72/1f238.png');
}
.emojijs-emoji-26aa{
    background-image:url('//twemoji.maxcdn.com/72x72/26aa.png');
}
.emojijs-emoji-25aa{
    background-image:url('//twemoji.maxcdn.com/72x72/25aa.png');
}
.emojijs-emoji-25ab{
    background-image:url('//twemoji.maxcdn.com/72x72/25ab.png');
}
.emojijs-emoji-1f250{
    background-image:url('//twemoji.maxcdn.com/72x72/1f250.png');
}
.emojijs-emoji-1f239{
    background-image:url('//twemoji.maxcdn.com/72x72/1f239.png');
}
.emojijs-emoji-1f202{
    background-image:url('//twemoji.maxcdn.com/72x72/1f202.png');
}
.emojijs-emoji-1f194{
    background-image:url('//twemoji.maxcdn.com/72x72/1f194.png');
}
.emojijs-emoji-1f235{
    background-image:url('//twemoji.maxcdn.com/72x72/1f235.png');
}
.emojijs-emoji-1f233{
    background-image:url('//twemoji.maxcdn.com/72x72/1f233.png');
}
.emojijs-emoji-1f22f{
    background-image:url('//twemoji.maxcdn.com/72x72/1f22f.png');
}
.emojijs-emoji-1f23a{
    background-image:url('//twemoji.maxcdn.com/72x72/1f23a.png');
}
.emojijs-emoji-1f446{
    background-image:url('//twemoji.maxcdn.com/72x72/1f446.png');
}
.emojijs-emoji-1f447{
    background-image:url('//twemoji.maxcdn.com/72x72/1f447.png');
}
.emojijs-emoji-1f448{
    background-image:url('//twemoji.maxcdn.com/72x72/1f448.png');
}
.emojijs-emoji-1f449{
    background-image:url('//twemoji.maxcdn.com/72x72/1f449.png');
}
.emojijs-emoji-2b06{
    background-image:url('//twemoji.maxcdn.com/72x72/2b06.png');
}
.emojijs-emoji-2b07{
    background-image:url('//twemoji.maxcdn.com/72x72/2b07.png');
}
.emojijs-emoji-27a1{
    background-image:url('//twemoji.maxcdn.com/72x72/27a1.png');
}
.emojijs-emoji-2b05{
    background-image:url('//twemoji.maxcdn.com/72x72/2b05.png');
}
.emojijs-emoji-2197{
    background-image:url('//twemoji.maxcdn.com/72x72/2197.png');
}
.emojijs-emoji-2196{
    background-image:url('//twemoji.maxcdn.com/72x72/2196.png');
}
.emojijs-emoji-2198{
    background-image:url('//twemoji.maxcdn.com/72x72/2198.png');
}
.emojijs-emoji-2199{
    background-image:url('//twemoji.maxcdn.com/72x72/2199.png');
}
.emojijs-emoji-25b6{/*right arrow */
    background-image:url('//twemoji.maxcdn.com/72x72/25b6.png');
}
.emojijs-emoji-25c0{
    background-image:url('//twemoji.maxcdn.com/72x72/25c0.png');
}
.emojijs-emoji-23e9{
    background-image:url('//twemoji.maxcdn.com/72x72/23e9.png');
}
.emojijs-emoji-23ea{
    background-image:url('//twemoji.maxcdn.com/72x72/23ea.png');
}
.emojijs-emoji-1f52e{
    background-image:url('//twemoji.maxcdn.com/72x72/1f52e.png');
}
.emojijs-emoji-2648{
    background-image:url('//twemoji.maxcdn.com/72x72/2648.png');
}
.emojijs-emoji-2649{
    background-image:url('//twemoji.maxcdn.com/72x72/2649.png');
}
.emojijs-emoji-264a{
    background-image:url('//twemoji.maxcdn.com/72x72/264a.png');
}
.emojijs-emoji-264b{
    background-image:url('//twemoji.maxcdn.com/72x72/264b.png');
}
.emojijs-emoji-264c{
    background-image:url('//twemoji.maxcdn.com/72x72/264c.png');
}
.emojijs-emoji-264d{
    background-image:url('//twemoji.maxcdn.com/72x72/264d.png');
}
.emojijs-emoji-264e{
    background-image:url('//twemoji.maxcdn.com/72x72/264e.png');
}
.emojijs-emoji-264f{
    background-image:url('//twemoji.maxcdn.com/72x72/264f.png');
}
.emojijs-emoji-2650{
    background-image:url('//twemoji.maxcdn.com/72x72/2650.png');
}
.emojijs-emoji-2651{
    background-image:url('//twemoji.maxcdn.com/72x72/2651.png');
}
.emojijs-emoji-2652{
    background-image:url('//twemoji.maxcdn.com/72x72/2652.png');
}
.emojijs-emoji-2653{
    background-image:url('//twemoji.maxcdn.com/72x72/2653.png');
}
.emojijs-emoji-26ce{
    background-image:url('//twemoji.maxcdn.com/72x72/26ce.png');
}
.emojijs-emoji-1f51d{
    background-image:url('//twemoji.maxcdn.com/72x72/1f51d.png');
}
.emojijs-emoji-1f197{
    background-image:url('//twemoji.maxcdn.com/72x72/1f197.png');
}
.emojijs-emoji-00a9{
    background-image:url('//twemoji.maxcdn.com/72x72/00a9.png');
}
.emojijs-emoji-00ae{
    background-image:url('//twemoji.maxcdn.com/72x72/00ae.png');
}
.emojijs-emoji-1f4f3{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4f3.png');
}
.emojijs-emoji-1f4f4{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4f4.png');
}
.emojijs-emoji-26a0{
    background-image:url('//twemoji.maxcdn.com/72x72/26a0.png');
}
.emojijs-emoji-1f481{
    background-image:url('//twemoji.maxcdn.com/72x72/1f481.png');
}
.emojijs-emoji-270f{
    background-image:url('//twemoji.maxcdn.com/72x72/270f.png');
}
.emojijs-emoji-1f454{
    background-image:url('//twemoji.maxcdn.com/72x72/1f454.png');
}
.emojijs-emoji-1f33a{
    background-image:url('//twemoji.maxcdn.com/72x72/1f33a.png');
}
.emojijs-emoji-1f337{
    background-image:url('//twemoji.maxcdn.com/72x72/1f337.png');
}
.emojijs-emoji-1f33b{
    background-image:url('//twemoji.maxcdn.com/72x72/1f33b.png');
}
.emojijs-emoji-1f490{
    background-image:url('//twemoji.maxcdn.com/72x72/1f490.png');
}
.emojijs-emoji-1f334{
    background-image:url('//twemoji.maxcdn.com/72x72/1f334.png');
}
.emojijs-emoji-1f335{
    background-image:url('//twemoji.maxcdn.com/72x72/1f335.png');
}
.emojijs-emoji-1f6be{
    background-image:url('//twemoji.maxcdn.com/72x72/1f6be.png');
}
.emojijs-emoji-1f3a7{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3a7.png');
}
.emojijs-emoji-1f376{
    background-image:url('//twemoji.maxcdn.com/72x72/1f376.png');
}
.emojijs-emoji-1f37b{
    background-image:url('//twemoji.maxcdn.com/72x72/1f37b.png');
}
.emojijs-emoji-3297{
    background-image:url('//twemoji.maxcdn.com/72x72/3297.png');
}
.emojijs-emoji-1f6ac{
    background-image:url('//twemoji.maxcdn.com/72x72/1f6ac.png');
}
.emojijs-emoji-1f48a{
    background-image:url('//twemoji.maxcdn.com/72x72/1f48a.png');
}
.emojijs-emoji-1f388{
    background-image:url('//twemoji.maxcdn.com/72x72/1f388.png');
}
.emojijs-emoji-1f4a3{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4a3.png');
}
.emojijs-emoji-1f389{
    background-image:url('//twemoji.maxcdn.com/72x72/1f389.png');
}
.emojijs-emoji-2702{
    background-image:url('//twemoji.maxcdn.com/72x72/2702.png');
}
.emojijs-emoji-1f380{
    background-image:url('//twemoji.maxcdn.com/72x72/1f380.png');
}
.emojijs-emoji-3299{
    background-image:url('//twemoji.maxcdn.com/72x72/3299.png');
}
.emojijs-emoji-1f4bd{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4bd.png');
}
.emojijs-emoji-1f4e3{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4e3.png');
}
.emojijs-emoji-1f452{
    background-image:url('//twemoji.maxcdn.com/72x72/1f452.png');
}
.emojijs-emoji-1f457{
    background-image:url('//twemoji.maxcdn.com/72x72/1f457.png');
}
.emojijs-emoji-1f461{
    background-image:url('//twemoji.maxcdn.com/72x72/1f461.png');
}
.emojijs-emoji-1f462{
    background-image:url('//twemoji.maxcdn.com/72x72/1f462.png');
}
.emojijs-emoji-1f484{
    background-image:url('//twemoji.maxcdn.com/72x72/1f484.png');
}
.emojijs-emoji-1f485{
    background-image:url('//twemoji.maxcdn.com/72x72/1f485.png');
}
.emojijs-emoji-1f486{
    background-image:url('//twemoji.maxcdn.com/72x72/1f486.png');
}
.emojijs-emoji-1f487{
    background-image:url('//twemoji.maxcdn.com/72x72/1f487.png');
}
.emojijs-emoji-1f488{
    background-image:url('//twemoji.maxcdn.com/72x72/1f488.png');
}
.emojijs-emoji-1f458{
    background-image:url('//twemoji.maxcdn.com/72x72/1f458.png');
}
.emojijs-emoji-1f459{
    background-image:url('//twemoji.maxcdn.com/72x72/1f459.png');
}
.emojijs-emoji-1f45c{
    background-image:url('//twemoji.maxcdn.com/72x72/1f45c.png');
}
.emojijs-emoji-1f3ac{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3ac.png');
}
.emojijs-emoji-1f514{
    background-image:url('//twemoji.maxcdn.com/72x72/1f514.png');
}
.emojijs-emoji-1f3b6{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3b6.png');
}
.emojijs-emoji-1f493{
    background-image:url('//twemoji.maxcdn.com/72x72/1f493.png');
}
.emojijs-emoji-1f497{
    background-image:url('//twemoji.maxcdn.com/72x72/1f497.png');
}
.emojijs-emoji-1f498{
    background-image:url('//twemoji.maxcdn.com/72x72/1f498.png');
}
.emojijs-emoji-1f499{
    background-image:url('//twemoji.maxcdn.com/72x72/1f499.png');
}
.emojijs-emoji-1f49a{
    background-image:url('//twemoji.maxcdn.com/72x72/1f49a.png');
}
.emojijs-emoji-1f49b{
    background-image:url('//twemoji.maxcdn.com/72x72/1f49b.png');
}
.emojijs-emoji-1f49c{
    background-image:url('//twemoji.maxcdn.com/72x72/1f49c.png');
}
.emojijs-emoji-2728{
    background-image:url('//twemoji.maxcdn.com/72x72/2728.png');
}
.emojijs-emoji-2b50{
    background-image:url('//twemoji.maxcdn.com/72x72/2b50.png');
}
.emojijs-emoji-1f4a8{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4a8.png');
}
.emojijs-emoji-1f4a6{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4a6.png');
}
.emojijs-emoji-2b55{
    background-image:url('//twemoji.maxcdn.com/72x72/2b55.png');
}
.emojijs-emoji-2716{
    background-image:url('//twemoji.maxcdn.com/72x72/2716.png');
}
.emojijs-emoji-1f4a2{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4a2.png');
}
.emojijs-emoji-1f31f{
    background-image:url('//twemoji.maxcdn.com/72x72/1f31f.png');
}
.emojijs-emoji-2754{
    background-image:url('//twemoji.maxcdn.com/72x72/2754.png');
}
.emojijs-emoji-2755{
    background-image:url('//twemoji.maxcdn.com/72x72/2755.png');
}
.emojijs-emoji-1f375{
    background-image:url('//twemoji.maxcdn.com/72x72/1f375.png');
}
.emojijs-emoji-1f35e{
    background-image:url('//twemoji.maxcdn.com/72x72/1f35e.png');
}
.emojijs-emoji-1f366{
    background-image:url('//twemoji.maxcdn.com/72x72/1f366.png');
}
.emojijs-emoji-1f35f{
    background-image:url('//twemoji.maxcdn.com/72x72/1f35f.png');
}
.emojijs-emoji-1f361{
    background-image:url('//twemoji.maxcdn.com/72x72/1f361.png');
}
.emojijs-emoji-1f358{
    background-image:url('//twemoji.maxcdn.com/72x72/1f358.png');
}
.emojijs-emoji-1f35a{
    background-image:url('//twemoji.maxcdn.com/72x72/1f35a.png');
}
.emojijs-emoji-1f35d{
    background-image:url('//twemoji.maxcdn.com/72x72/1f35d.png');
}
.emojijs-emoji-1f35c{
    background-image:url('//twemoji.maxcdn.com/72x72/1f35c.png');
}
.emojijs-emoji-1f35b{
    background-image:url('//twemoji.maxcdn.com/72x72/1f35b.png');
}
.emojijs-emoji-1f359{
    background-image:url('//twemoji.maxcdn.com/72x72/1f359.png');
}
.emojijs-emoji-1f362{
    background-image:url('//twemoji.maxcdn.com/72x72/1f362.png');
}
.emojijs-emoji-1f363{
    background-image:url('//twemoji.maxcdn.com/72x72/1f363.png');
}
.emojijs-emoji-1f34e{
    background-image:url('//twemoji.maxcdn.com/72x72/1f34e.png');
}
.emojijs-emoji-1f34a{
    background-image:url('//twemoji.maxcdn.com/72x72/1f34a.png');
}
.emojijs-emoji-1f353{
    background-image:url('//twemoji.maxcdn.com/72x72/1f353.png');
}
.emojijs-emoji-1f349{
    background-image:url('//twemoji.maxcdn.com/72x72/1f349.png');
}
.emojijs-emoji-1f345{
    background-image:url('//twemoji.maxcdn.com/72x72/1f345.png');
}
.emojijs-emoji-1f346{
    background-image:url('//twemoji.maxcdn.com/72x72/1f346.png');
}
.emojijs-emoji-1f382{
    background-image:url('//twemoji.maxcdn.com/72x72/1f382.png');
}
.emojijs-emoji-1f371{
    background-image:url('//twemoji.maxcdn.com/72x72/1f371.png');
}
.emojijs-emoji-1f372{
    background-image:url('//twemoji.maxcdn.com/72x72/1f372.png');
}
.emojijs-emoji-1f625{
    background-image:url('//twemoji.maxcdn.com/72x72/1f625.png');
}
.emojijs-emoji-1f60f{
    background-image:url('//twemoji.maxcdn.com/72x72/1f60f.png');
}
.emojijs-emoji-1f614{
    background-image:url('//twemoji.maxcdn.com/72x72/1f614.png');
}
.emojijs-emoji-1f601{
    background-image:url('//twemoji.maxcdn.com/72x72/1f601.png');
}
.emojijs-emoji-1f609{
    background-image:url('//twemoji.maxcdn.com/72x72/1f609.png');
}
.emojijs-emoji-1f623{
    background-image:url('//twemoji.maxcdn.com/72x72/1f623.png');
}
.emojijs-emoji-1f4ab{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4ab.png');
}
.emojijs-emoji-1f62a{
    background-image:url('//twemoji.maxcdn.com/72x72/1f62a.png');
}
.emojijs-emoji-1f445{
    background-image:url('//twemoji.maxcdn.com/72x72/1f445.png');
}
.emojijs-emoji-1f606{
    background-image:url('//twemoji.maxcdn.com/72x72/1f606.png');
}
.emojijs-emoji-1f628{
    background-image:url('//twemoji.maxcdn.com/72x72/1f628.png');
}
.emojijs-emoji-1f637{
    background-image:url('//twemoji.maxcdn.com/72x72/1f637.png');
}
.emojijs-emoji-1f633{
    background-image:url('//twemoji.maxcdn.com/72x72/1f633.png');
}
.emojijs-emoji-1f612{
    background-image:url('//twemoji.maxcdn.com/72x72/1f612.png');
}
.emojijs-emoji-1f630{
    background-image:url('//twemoji.maxcdn.com/72x72/1f630.png');
}
.emojijs-emoji-1f632{
    background-image:url('//twemoji.maxcdn.com/72x72/1f632.png');
}
.emojijs-emoji-1f62d{
    background-image:url('//twemoji.maxcdn.com/72x72/1f62d.png');
}
.emojijs-emoji-1f602{
    background-image:url('//twemoji.maxcdn.com/72x72/1f602.png');
}
.emojijs-emoji-1f622{
    background-image:url('//twemoji.maxcdn.com/72x72/1f622.png');
}
.emojijs-emoji-263a{
    background-image:url('//twemoji.maxcdn.com/72x72/263a.png');
}
.emojijs-emoji-1f604{
    background-image:url('//twemoji.maxcdn.com/72x72/1f604.png');
}
.emojijs-emoji-1f621{
    background-image:url('//twemoji.maxcdn.com/72x72/1f621.png');
}
.emojijs-emoji-1f61a{
    background-image:url('//twemoji.maxcdn.com/72x72/1f61a.png');
}
.emojijs-emoji-1f618{
    background-image:url('//twemoji.maxcdn.com/72x72/1f618.png');
}
.emojijs-emoji-1f440{
    background-image:url('//twemoji.maxcdn.com/72x72/1f440.png');
}
.emojijs-emoji-1f443{
    background-image:url('//twemoji.maxcdn.com/72x72/1f443.png');
}
.emojijs-emoji-1f442{
    background-image:url('//twemoji.maxcdn.com/72x72/1f442.png');
}
.emojijs-emoji-1f444{
    background-image:url('//twemoji.maxcdn.com/72x72/1f444.png');
}
.emojijs-emoji-1f64f{
    background-image:url('//twemoji.maxcdn.com/72x72/1f64f.png');
}
.emojijs-emoji-1f44b{
    background-image:url('//twemoji.maxcdn.com/72x72/1f44b.png');
}
.emojijs-emoji-1f44f{
    background-image:url('//twemoji.maxcdn.com/72x72/1f44f.png');
}
.emojijs-emoji-1f44c{
    background-image:url('//twemoji.maxcdn.com/72x72/1f44c.png');
}
.emojijs-emoji-1f44e{
    background-image:url('//twemoji.maxcdn.com/72x72/1f44e.png');
}
.emojijs-emoji-1f450{
    background-image:url('//twemoji.maxcdn.com/72x72/1f450.png');
}
.emojijs-emoji-1f645{
    background-image:url('//twemoji.maxcdn.com/72x72/1f645.png');
}
.emojijs-emoji-1f646{
    background-image:url('//twemoji.maxcdn.com/72x72/1f646.png');
}
.emojijs-emoji-1f491{
    background-image:url('//twemoji.maxcdn.com/72x72/1f491.png');
}
.emojijs-emoji-1f647{
    background-image:url('//twemoji.maxcdn.com/72x72/1f647.png');
}
.emojijs-emoji-1f64c{
    background-image:url('//twemoji.maxcdn.com/72x72/1f64c.png');
}
.emojijs-emoji-1f46b{
    background-image:url('//twemoji.maxcdn.com/72x72/1f46b.png');
}
.emojijs-emoji-1f46f{
    background-image:url('//twemoji.maxcdn.com/72x72/1f46f.png');
}
.emojijs-emoji-1f3c0{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3c0.png');
}
.emojijs-emoji-1f3c8{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3c8.png');
}
.emojijs-emoji-1f3b1{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3b1.png');
}
.emojijs-emoji-1f3ca{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3ca.png');
}
.emojijs-emoji-1f699{
    background-image:url('//twemoji.maxcdn.com/72x72/1f699.png');
}
.emojijs-emoji-1f69a{
    background-image:url('//twemoji.maxcdn.com/72x72/1f69a.png');
}
.emojijs-emoji-1f692{
    background-image:url('//twemoji.maxcdn.com/72x72/1f692.png');
}
.emojijs-emoji-1f691{
    background-image:url('//twemoji.maxcdn.com/72x72/1f691.png');
}
.emojijs-emoji-1f693{
    background-image:url('//twemoji.maxcdn.com/72x72/1f693.png');
}
.emojijs-emoji-1f3a2{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3a2.png');
}
.emojijs-emoji-24c2{
    background-image:url('//twemoji.maxcdn.com/72x72/24c2.png');
}
.emojijs-emoji-1f684{
    background-image:url('//twemoji.maxcdn.com/72x72/1f684.png');
}
.emojijs-emoji-1f38d{
    background-image:url('//twemoji.maxcdn.com/72x72/1f38d.png');
}
.emojijs-emoji-1f49d{
    background-image:url('//twemoji.maxcdn.com/72x72/1f49d.png');
}
.emojijs-emoji-1f38e{
    background-image:url('//twemoji.maxcdn.com/72x72/1f38e.png');
}
.emojijs-emoji-1f393{
    background-image:url('//twemoji.maxcdn.com/72x72/1f393.png');
}
.emojijs-emoji-1f392{
    background-image:url('//twemoji.maxcdn.com/72x72/1f392.png');
}
.emojijs-emoji-1f38f{
    background-image:url('//twemoji.maxcdn.com/72x72/1f38f.png');
}
.emojijs-emoji-1f302{
    background-image:url('//twemoji.maxcdn.com/72x72/1f302.png');
}
.emojijs-emoji-1f492{
    background-image:url('//twemoji.maxcdn.com/72x72/1f492.png');
}
.emojijs-emoji-1f30a{
    background-image:url('//twemoji.maxcdn.com/72x72/1f30a.png');
}
.emojijs-emoji-1f367{
    background-image:url('//twemoji.maxcdn.com/72x72/1f367.png');
}
.emojijs-emoji-1f387{
    background-image:url('//twemoji.maxcdn.com/72x72/1f387.png');
}
.emojijs-emoji-1f41a{
    background-image:url('//twemoji.maxcdn.com/72x72/1f41a.png');
}
.emojijs-emoji-1f390{
    background-image:url('//twemoji.maxcdn.com/72x72/1f390.png');
}
.emojijs-emoji-1f300{
    background-image:url('//twemoji.maxcdn.com/72x72/1f300.png');
}
.emojijs-emoji-1f33e{
    background-image:url('//twemoji.maxcdn.com/72x72/1f33e.png');
}
.emojijs-emoji-1f383{
    background-image:url('//twemoji.maxcdn.com/72x72/1f383.png');
}
.emojijs-emoji-1f391{
    background-image:url('//twemoji.maxcdn.com/72x72/1f391.png');
}
.emojijs-emoji-1f343{
    background-image:url('//twemoji.maxcdn.com/72x72/1f343.png');
}
.emojijs-emoji-1f385{
    background-image:url('//twemoji.maxcdn.com/72x72/1f385.png');
}
.emojijs-emoji-1f305{
    background-image:url('//twemoji.maxcdn.com/72x72/1f305.png');
}
.emojijs-emoji-1f307{
    background-image:url('//twemoji.maxcdn.com/72x72/1f307.png');
}
.emojijs-emoji-1f303{
    background-image:url('//twemoji.maxcdn.com/72x72/1f303.png');
}
.emojijs-emoji-1f308{
    background-image:url('//twemoji.maxcdn.com/72x72/1f308.png');
}
.emojijs-emoji-1f3e9{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3e9.png');
}
.emojijs-emoji-1f3a8{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3a8.png');
}
.emojijs-emoji-1f3a9{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3a9.png');
}
.emojijs-emoji-1f3ec{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3ec.png');
}
.emojijs-emoji-1f3ef{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3ef.png');
}
.emojijs-emoji-1f3f0{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3f0.png');
}
.emojijs-emoji-1f3a6{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3a6.png');
}
.emojijs-emoji-1f3ed{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3ed.png');
}
.emojijs-emoji-1f5fc{
    background-image:url('//twemoji.maxcdn.com/72x72/1f5fc.png');
}
.emojijs-emoji-1f471{
    background-image:url('//twemoji.maxcdn.com/72x72/1f471.png');
}
.emojijs-emoji-1f472{
    background-image:url('//twemoji.maxcdn.com/72x72/1f472.png');
}
.emojijs-emoji-1f473{
    background-image:url('//twemoji.maxcdn.com/72x72/1f473.png');
}
.emojijs-emoji-1f474{
    background-image:url('//twemoji.maxcdn.com/72x72/1f474.png');
}
.emojijs-emoji-1f475{
    background-image:url('//twemoji.maxcdn.com/72x72/1f475.png');
}
.emojijs-emoji-1f476{
    background-image:url('//twemoji.maxcdn.com/72x72/1f476.png');
}
.emojijs-emoji-1f477{
    background-image:url('//twemoji.maxcdn.com/72x72/1f477.png');
}
.emojijs-emoji-1f478{
    background-image:url('//twemoji.maxcdn.com/72x72/1f478.png');
}
.emojijs-emoji-1f5fd{
    background-image:url('//twemoji.maxcdn.com/72x72/1f5fd.png');
}
.emojijs-emoji-1f482{
    background-image:url('//twemoji.maxcdn.com/72x72/1f482.png');
}
.emojijs-emoji-1f483{
    background-image:url('//twemoji.maxcdn.com/72x72/1f483.png');
}
.emojijs-emoji-1f42c{
    background-image:url('//twemoji.maxcdn.com/72x72/1f42c.png');
}
.emojijs-emoji-1f426{
    background-image:url('//twemoji.maxcdn.com/72x72/1f426.png');
}
.emojijs-emoji-1f420{
    background-image:url('//twemoji.maxcdn.com/72x72/1f420.png');
}
.emojijs-emoji-1f423{
    background-image:url('//twemoji.maxcdn.com/72x72/1f423.png');
}
.emojijs-emoji-1f439{
    background-image:url('//twemoji.maxcdn.com/72x72/1f439.png');
}
.emojijs-emoji-1f41b{
    background-image:url('//twemoji.maxcdn.com/72x72/1f41b.png');
}
.emojijs-emoji-1f418{
    background-image:url('//twemoji.maxcdn.com/72x72/1f418.png');
}
.emojijs-emoji-1f428{
    background-image:url('//twemoji.maxcdn.com/72x72/1f428.png');
}
.emojijs-emoji-1f412{
    background-image:url('//twemoji.maxcdn.com/72x72/1f412.png');
}
.emojijs-emoji-1f411{
    background-image:url('//twemoji.maxcdn.com/72x72/1f411.png');
}
.emojijs-emoji-1f43a{
    background-image:url('//twemoji.maxcdn.com/72x72/1f43a.png');
}
.emojijs-emoji-1f42e{
    background-image:url('//twemoji.maxcdn.com/72x72/1f42e.png');
}
.emojijs-emoji-1f430{
    background-image:url('//twemoji.maxcdn.com/72x72/1f430.png');
}
.emojijs-emoji-1f40d{
    background-image:url('//twemoji.maxcdn.com/72x72/1f40d.png');
}
.emojijs-emoji-1f414{
    background-image:url('//twemoji.maxcdn.com/72x72/1f414.png');
}
.emojijs-emoji-1f417{
    background-image:url('//twemoji.maxcdn.com/72x72/1f417.png');
}
.emojijs-emoji-1f42b{
    background-image:url('//twemoji.maxcdn.com/72x72/1f42b.png');
}
.emojijs-emoji-1f438{
    background-image:url('//twemoji.maxcdn.com/72x72/1f438.png');
}
.emojijs-emoji-1f170{
    background-image:url('//twemoji.maxcdn.com/72x72/1f170.png');
}
.emojijs-emoji-1f171{
    background-image:url('//twemoji.maxcdn.com/72x72/1f171.png');
}
.emojijs-emoji-1f18e{
    background-image:url('//twemoji.maxcdn.com/72x72/1f18e.png');
}
.emojijs-emoji-1f17e{
    background-image:url('//twemoji.maxcdn.com/72x72/1f17e.png');
}
.emojijs-emoji-1f43e{
    background-image:url('//twemoji.maxcdn.com/72x72/1f43e.png');
}
.emojijs-emoji-2122{
    background-image:url('//twemoji.maxcdn.com/72x72/2122.png');
}
.emojijs-emoji-1f0cf{
    background-image:url('//twemoji.maxcdn.com/72x72/1f0cf.png');
}
.emojijs-emoji-1f191{
    background-image:url('//twemoji.maxcdn.com/72x72/1f191.png');
}
.emojijs-emoji-1f193{
    background-image:url('//twemoji.maxcdn.com/72x72/1f193.png');
}
.emojijs-emoji-1f196{
    background-image:url('//twemoji.maxcdn.com/72x72/1f196.png');
}
.emojijs-emoji-1f198{
    background-image:url('//twemoji.maxcdn.com/72x72/1f198.png');
}
.emojijs-emoji-1f1e6{
    background-image:url('//twemoji.maxcdn.com/72x72/1f1e6.png');
}
.emojijs-emoji-1f1e7{
    background-image:url('//twemoji.maxcdn.com/72x72/1f1e7.png');
}
.emojijs-emoji-1f1e8{
    background-image:url('//twemoji.maxcdn.com/72x72/1f1e8.png');
}
.emojijs-emoji-1f1e9{
    background-image:url('//twemoji.maxcdn.com/72x72/1f1e9.png');
}
.emojijs-emoji-1f1ea{
    background-image:url('//twemoji.maxcdn.com/72x72/1f1ea.png');
}
.emojijs-emoji-1f1eb{
    background-image:url('//twemoji.maxcdn.com/72x72/1f1eb.png');
}
.emojijs-emoji-1f1ec{
    background-image:url('//twemoji.maxcdn.com/72x72/1f1ec.png');
}
.emojijs-emoji-1f1ed{
    background-image:url('//twemoji.maxcdn.com/72x72/1f1ed.png');
}
.emojijs-emoji-1f1ee{
    background-image:url('//twemoji.maxcdn.com/72x72/1f1ee.png');
}
.emojijs-emoji-1f1ef{
    background-image:url('//twemoji.maxcdn.com/72x72/1f1ef.png');
}
.emojijs-emoji-1f1f0{
    background-image:url('//twemoji.maxcdn.com/72x72/1f1f0.png');
}
.emojijs-emoji-1f1f1{
    background-image:url('//twemoji.maxcdn.com/72x72/1f1f1.png');
}
.emojijs-emoji-1f1f2{
    background-image:url('//twemoji.maxcdn.com/72x72/1f1f2.png');
}
.emojijs-emoji-1f1f3{
    background-image:url('//twemoji.maxcdn.com/72x72/1f1f3.png');
}
.emojijs-emoji-1f1f4{
    background-image:url('//twemoji.maxcdn.com/72x72/1f1f4.png');
}
.emojijs-emoji-1f1f5{
    background-image:url('//twemoji.maxcdn.com/72x72/1f1f5.png');
}
.emojijs-emoji-1f1f6{
    background-image:url('//twemoji.maxcdn.com/72x72/1f1f6.png');
}
.emojijs-emoji-1f1f7{
    background-image:url('//twemoji.maxcdn.com/72x72/1f1f7.png');
}
.emojijs-emoji-1f1f8{
    background-image:url('//twemoji.maxcdn.com/72x72/1f1f8.png');
}
.emojijs-emoji-1f1f9{
    background-image:url('//twemoji.maxcdn.com/72x72/1f1f9.png');
}
.emojijs-emoji-1f1fa{
    background-image:url('//twemoji.maxcdn.com/72x72/1f1fa.png');
}
.emojijs-emoji-1f1fb{
    background-image:url('//twemoji.maxcdn.com/72x72/1f1fb.png');
}
.emojijs-emoji-1f1fc{
    background-image:url('//twemoji.maxcdn.com/72x72/1f1fc.png');
}
.emojijs-emoji-1f1fd{
    background-image:url('//twemoji.maxcdn.com/72x72/1f1fd.png');
}
.emojijs-emoji-1f1fe{
    background-image:url('//twemoji.maxcdn.com/72x72/1f1fe.png');
}
.emojijs-emoji-1f1ff{
    background-image:url('//twemoji.maxcdn.com/72x72/1f1ff.png');
}
.emojijs-emoji-1f232{
    background-image:url('//twemoji.maxcdn.com/72x72/1f232.png');
}
.emojijs-emoji-1f234{
    background-image:url('//twemoji.maxcdn.com/72x72/1f234.png');
}
.emojijs-emoji-1f251{
    background-image:url('//twemoji.maxcdn.com/72x72/1f251.png');
}
.emojijs-emoji-1f301{
    background-image:url('//twemoji.maxcdn.com/72x72/1f301.png');
}
.emojijs-emoji-1f309{
    background-image:url('//twemoji.maxcdn.com/72x72/1f309.png');
}
.emojijs-emoji-1f30b{
    background-image:url('//twemoji.maxcdn.com/72x72/1f30b.png');
}
.emojijs-emoji-1f30c{
    background-image:url('//twemoji.maxcdn.com/72x72/1f30c.png');
}
.emojijs-emoji-1f30d{
    background-image:url('//twemoji.maxcdn.com/72x72/1f30d.png');
}
.emojijs-emoji-1f30e{
    background-image:url('//twemoji.maxcdn.com/72x72/1f30e.png');
}
.emojijs-emoji-1f30f{
    background-image:url('//twemoji.maxcdn.com/72x72/1f30f.png');
}
.emojijs-emoji-1f310{
    background-image:url('//twemoji.maxcdn.com/72x72/1f310.png');
}
.emojijs-emoji-1f311{
    background-image:url('//twemoji.maxcdn.com/72x72/1f311.png');
}
.emojijs-emoji-1f312{
    background-image:url('//twemoji.maxcdn.com/72x72/1f312.png');
}
.emojijs-emoji-1f314{
    background-image:url('//twemoji.maxcdn.com/72x72/1f314.png');
}
.emojijs-emoji-1f315{
    background-image:url('//twemoji.maxcdn.com/72x72/1f315.png');
}
.emojijs-emoji-1f316{
    background-image:url('//twemoji.maxcdn.com/72x72/1f316.png');
}
.emojijs-emoji-1f317{
    background-image:url('//twemoji.maxcdn.com/72x72/1f317.png');
}
.emojijs-emoji-1f318{
    background-image:url('//twemoji.maxcdn.com/72x72/1f318.png');
}
.emojijs-emoji-1f319{
    background-image:url('//twemoji.maxcdn.com/72x72/1f319.png');
}
.emojijs-emoji-1f31a{
    background-image:url('//twemoji.maxcdn.com/72x72/1f31a.png');
}
.emojijs-emoji-1f31b{
    background-image:url('//twemoji.maxcdn.com/72x72/1f31b.png');
}
.emojijs-emoji-1f31c{
    background-image:url('//twemoji.maxcdn.com/72x72/1f31c.png');
}
.emojijs-emoji-1f31d{
    background-image:url('//twemoji.maxcdn.com/72x72/1f31d.png');
}
.emojijs-emoji-1f31e{
    background-image:url('//twemoji.maxcdn.com/72x72/1f31e.png');
}
.emojijs-emoji-1f320{
    background-image:url('//twemoji.maxcdn.com/72x72/1f320.png');
}
.emojijs-emoji-1f330{
    background-image:url('//twemoji.maxcdn.com/72x72/1f330.png');
}
.emojijs-emoji-1f332{
    background-image:url('//twemoji.maxcdn.com/72x72/1f332.png');
}
.emojijs-emoji-1f333{
    background-image:url('//twemoji.maxcdn.com/72x72/1f333.png');
}
.emojijs-emoji-1f33c{
    background-image:url('//twemoji.maxcdn.com/72x72/1f33c.png');
}
.emojijs-emoji-1f33d{
    background-image:url('//twemoji.maxcdn.com/72x72/1f33d.png');
}
.emojijs-emoji-1f33f{
    background-image:url('//twemoji.maxcdn.com/72x72/1f33f.png');
}
.emojijs-emoji-1f340{
    background-image:url('//twemoji.maxcdn.com/72x72/1f340.png');
}
.emojijs-emoji-1f344{
    background-image:url('//twemoji.maxcdn.com/72x72/1f344.png');
}
.emojijs-emoji-1f347{
    background-image:url('//twemoji.maxcdn.com/72x72/1f347.png');
}
.emojijs-emoji-1f348{
    background-image:url('//twemoji.maxcdn.com/72x72/1f348.png');
}
.emojijs-emoji-1f34b{
    background-image:url('//twemoji.maxcdn.com/72x72/1f34b.png');
}
.emojijs-emoji-1f34c{
    background-image:url('//twemoji.maxcdn.com/72x72/1f34c.png');
}
.emojijs-emoji-1f34d{
    background-image:url('//twemoji.maxcdn.com/72x72/1f34d.png');
}
.emojijs-emoji-1f34f{
    background-image:url('//twemoji.maxcdn.com/72x72/1f34f.png');
}
.emojijs-emoji-1f350{
    background-image:url('//twemoji.maxcdn.com/72x72/1f350.png');
}
.emojijs-emoji-1f351{
    background-image:url('//twemoji.maxcdn.com/72x72/1f351.png');
}
.emojijs-emoji-1f352{
    background-image:url('//twemoji.maxcdn.com/72x72/1f352.png');
}
.emojijs-emoji-1f355{
    background-image:url('//twemoji.maxcdn.com/72x72/1f355.png');
}
.emojijs-emoji-1f356{
    background-image:url('//twemoji.maxcdn.com/72x72/1f356.png');
}
.emojijs-emoji-1f357{
    background-image:url('//twemoji.maxcdn.com/72x72/1f357.png');
}
.emojijs-emoji-1f360{
    background-image:url('//twemoji.maxcdn.com/72x72/1f360.png');
}
.emojijs-emoji-1f364{
    background-image:url('//twemoji.maxcdn.com/72x72/1f364.png');
}
.emojijs-emoji-1f365{
    background-image:url('//twemoji.maxcdn.com/72x72/1f365.png');
}
.emojijs-emoji-1f368{
    background-image:url('//twemoji.maxcdn.com/72x72/1f368.png');
}
.emojijs-emoji-1f369{
    background-image:url('//twemoji.maxcdn.com/72x72/1f369.png');
}
.emojijs-emoji-1f36a{
    background-image:url('//twemoji.maxcdn.com/72x72/1f36a.png');
}
.emojijs-emoji-1f36b{
    background-image:url('//twemoji.maxcdn.com/72x72/1f36b.png');
}
.emojijs-emoji-1f36c{
    background-image:url('//twemoji.maxcdn.com/72x72/1f36c.png');
}
.emojijs-emoji-1f36d{
    background-image:url('//twemoji.maxcdn.com/72x72/1f36d.png');
}
.emojijs-emoji-1f36e{
    background-image:url('//twemoji.maxcdn.com/72x72/1f36e.png');
}
.emojijs-emoji-1f36f{
    background-image:url('//twemoji.maxcdn.com/72x72/1f36f.png');
}
.emojijs-emoji-1f378{
    background-image:url('//twemoji.maxcdn.com/72x72/1f378.png');
}
.emojijs-emoji-1f379{
    background-image:url('//twemoji.maxcdn.com/72x72/1f379.png');
}
.emojijs-emoji-1f37c{
    background-image:url('//twemoji.maxcdn.com/72x72/1f37c.png');
}
.emojijs-emoji-1f38a{
    background-image:url('//twemoji.maxcdn.com/72x72/1f38a.png');
}
.emojijs-emoji-1f38b{
    background-image:url('//twemoji.maxcdn.com/72x72/1f38b.png');
}
.emojijs-emoji-1f3a0{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3a0.png');
}
.emojijs-emoji-1f3aa{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3aa.png');
}
.emojijs-emoji-1f3ad{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3ad.png');
}
.emojijs-emoji-1f3ae{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3ae.png');
}
.emojijs-emoji-1f3b2{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3b2.png');
}
.emojijs-emoji-1f3b3{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3b3.png');
}
.emojijs-emoji-1f3b4{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3b4.png');
}
.emojijs-emoji-1f3b9{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3b9.png');
}
.emojijs-emoji-1f3bb{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3bb.png');
}
.emojijs-emoji-1f3bc{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3bc.png');
}
.emojijs-emoji-1f3bd{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3bd.png');
}
.emojijs-emoji-1f3c2{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3c2.png');
}
.emojijs-emoji-1f3c7{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3c7.png');
}
.emojijs-emoji-1f3c9{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3c9.png');
}
.emojijs-emoji-1f3e1{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3e1.png');
}
.emojijs-emoji-1f3e4{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3e4.png');
}
.emojijs-emoji-1f3ee{
    background-image:url('//twemoji.maxcdn.com/72x72/1f3ee.png');
}
.emojijs-emoji-1f400{
    background-image:url('//twemoji.maxcdn.com/72x72/1f400.png');
}
.emojijs-emoji-1f401{
    background-image:url('//twemoji.maxcdn.com/72x72/1f401.png');
}
.emojijs-emoji-1f402{
    background-image:url('//twemoji.maxcdn.com/72x72/1f402.png');
}
.emojijs-emoji-1f403{
    background-image:url('//twemoji.maxcdn.com/72x72/1f403.png');
}
.emojijs-emoji-1f404{
    background-image:url('//twemoji.maxcdn.com/72x72/1f404.png');
}
.emojijs-emoji-1f405{
    background-image:url('//twemoji.maxcdn.com/72x72/1f405.png');
}
.emojijs-emoji-1f406{
    background-image:url('//twemoji.maxcdn.com/72x72/1f406.png');
}
.emojijs-emoji-1f407{
    background-image:url('//twemoji.maxcdn.com/72x72/1f407.png');
}
.emojijs-emoji-1f408{
    background-image:url('//twemoji.maxcdn.com/72x72/1f408.png');
}
.emojijs-emoji-1f409{
    background-image:url('//twemoji.maxcdn.com/72x72/1f409.png');
}
.emojijs-emoji-1f40a{
    background-image:url('//twemoji.maxcdn.com/72x72/1f40a.png');
}
.emojijs-emoji-1f40b{
    background-image:url('//twemoji.maxcdn.com/72x72/1f40b.png');
}
.emojijs-emoji-1f40c{
    background-image:url('//twemoji.maxcdn.com/72x72/1f40c.png');
}
.emojijs-emoji-1f40f{
    background-image:url('//twemoji.maxcdn.com/72x72/1f40f.png');
}
.emojijs-emoji-1f410{
    background-image:url('//twemoji.maxcdn.com/72x72/1f410.png');
}
.emojijs-emoji-1f413{
    background-image:url('//twemoji.maxcdn.com/72x72/1f413.png');
}
.emojijs-emoji-1f415{
    background-image:url('//twemoji.maxcdn.com/72x72/1f415.png');
}
.emojijs-emoji-1f416{
    background-image:url('//twemoji.maxcdn.com/72x72/1f416.png');
}
.emojijs-emoji-1f41c{
    background-image:url('//twemoji.maxcdn.com/72x72/1f41c.png');
}
.emojijs-emoji-1f41d{
    background-image:url('//twemoji.maxcdn.com/72x72/1f41d.png');
}
.emojijs-emoji-1f41e{
    background-image:url('//twemoji.maxcdn.com/72x72/1f41e.png');
}
.emojijs-emoji-1f41f{
    background-image:url('//twemoji.maxcdn.com/72x72/1f41f.png');
}
.emojijs-emoji-1f421{
    background-image:url('//twemoji.maxcdn.com/72x72/1f421.png');
}
.emojijs-emoji-1f422{
    background-image:url('//twemoji.maxcdn.com/72x72/1f422.png');
}
.emojijs-emoji-1f424{
    background-image:url('//twemoji.maxcdn.com/72x72/1f424.png');
}
.emojijs-emoji-1f425{
    background-image:url('//twemoji.maxcdn.com/72x72/1f425.png');
}
.emojijs-emoji-1f42a{
    background-image:url('//twemoji.maxcdn.com/72x72/1f42a.png');
}
.emojijs-emoji-1f432{
    background-image:url('//twemoji.maxcdn.com/72x72/1f432.png');
}
.emojijs-emoji-1f436{
    background-image:url('//twemoji.maxcdn.com/72x72/1f436.png');
}
.emojijs-emoji-1f43c{
    background-image:url('//twemoji.maxcdn.com/72x72/1f43c.png');
}
.emojijs-emoji-1f43d{
    background-image:url('//twemoji.maxcdn.com/72x72/1f43d.png');
}
.emojijs-emoji-1f453{
    background-image:url('//twemoji.maxcdn.com/72x72/1f453.png');
}
.emojijs-emoji-1f456{
    background-image:url('//twemoji.maxcdn.com/72x72/1f456.png');
}
.emojijs-emoji-1f45a{
    background-image:url('//twemoji.maxcdn.com/72x72/1f45a.png');
}
.emojijs-emoji-1f45b{
    background-image:url('//twemoji.maxcdn.com/72x72/1f45b.png');
}
.emojijs-emoji-1f45d{
    background-image:url('//twemoji.maxcdn.com/72x72/1f45d.png');
}
.emojijs-emoji-1f45f{
    background-image:url('//twemoji.maxcdn.com/72x72/1f45f.png');
}
.emojijs-emoji-1f463{
    background-image:url('//twemoji.maxcdn.com/72x72/1f463.png');
}
.emojijs-emoji-1f464{
    background-image:url('//twemoji.maxcdn.com/72x72/1f464.png');
}
.emojijs-emoji-1f465{
    background-image:url('//twemoji.maxcdn.com/72x72/1f465.png');
}
.emojijs-emoji-1f46a{
    background-image:url('//twemoji.maxcdn.com/72x72/1f46a.png');
}
.emojijs-emoji-1f46c{
    background-image:url('//twemoji.maxcdn.com/72x72/1f46c.png');
}
.emojijs-emoji-1f46d{
    background-image:url('//twemoji.maxcdn.com/72x72/1f46d.png');
}
.emojijs-emoji-1f470{
    background-image:url('//twemoji.maxcdn.com/72x72/1f470.png');
}
.emojijs-emoji-1f479{
    background-image:url('//twemoji.maxcdn.com/72x72/1f479.png');
}
.emojijs-emoji-1f47a{
    background-image:url('//twemoji.maxcdn.com/72x72/1f47a.png');
}
.emojijs-emoji-1f495{
    background-image:url('//twemoji.maxcdn.com/72x72/1f495.png');
}
.emojijs-emoji-1f496{
    background-image:url('//twemoji.maxcdn.com/72x72/1f496.png');
}
.emojijs-emoji-1f49e{
    background-image:url('//twemoji.maxcdn.com/72x72/1f49e.png');
}
.emojijs-emoji-1f4a0{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4a0.png');
}
.emojijs-emoji-1f4a5{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4a5.png');
}
.emojijs-emoji-1f4a7{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4a7.png');
}
.emojijs-emoji-1f4ac{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4ac.png');
}
.emojijs-emoji-1f4ad{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4ad.png');
}
.emojijs-emoji-1f4ae{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4ae.png');
}
.emojijs-emoji-1f4af{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4af.png');
}
.emojijs-emoji-1f4b2{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4b2.png');
}
.emojijs-emoji-1f4b3{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4b3.png');
}
.emojijs-emoji-1f4b4{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4b4.png');
}
.emojijs-emoji-1f4b5{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4b5.png');
}
.emojijs-emoji-1f4b6{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4b6.png');
}
.emojijs-emoji-1f4b7{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4b7.png');
}
.emojijs-emoji-1f4b8{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4b8.png');
}
.emojijs-emoji-1f4be{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4be.png');
}
.emojijs-emoji-1f4c1{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4c1.png');
}
.emojijs-emoji-1f4c2{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4c2.png');
}
.emojijs-emoji-1f4c3{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4c3.png');
}
.emojijs-emoji-1f4c4{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4c4.png');
}
.emojijs-emoji-1f4c5{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4c5.png');
}
.emojijs-emoji-1f4c6{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4c6.png');
}
.emojijs-emoji-1f4c8{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4c8.png');
}
.emojijs-emoji-1f4c9{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4c9.png');
}
.emojijs-emoji-1f4ca{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4ca.png');
}
.emojijs-emoji-1f4cb{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4cb.png');
}
.emojijs-emoji-1f4cc{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4cc.png');
}
.emojijs-emoji-1f4cd{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4cd.png');
}
.emojijs-emoji-1f4ce{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4ce.png');
}
.emojijs-emoji-1f4cf{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4cf.png');
}
.emojijs-emoji-1f4d0{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4d0.png');
}
.emojijs-emoji-1f4d1{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4d1.png');
}
.emojijs-emoji-1f4d2{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4d2.png');
}
.emojijs-emoji-1f4d3{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4d3.png');
}
.emojijs-emoji-1f4d4{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4d4.png');
}
.emojijs-emoji-1f4d5{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4d5.png');
}
.emojijs-emoji-1f4d6{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4d6.png');
}
.emojijs-emoji-1f4d7{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4d7.png');
}
.emojijs-emoji-1f4d8{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4d8.png');
}
.emojijs-emoji-1f4d9{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4d9.png');
}
.emojijs-emoji-1f4da{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4da.png');
}
.emojijs-emoji-1f4db{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4db.png');
}
.emojijs-emoji-1f4dc{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4dc.png');
}
.emojijs-emoji-1f4dd{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4dd.png');
}
.emojijs-emoji-1f4de{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4de.png');
}
.emojijs-emoji-1f4df{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4df.png');
}
.emojijs-emoji-1f4e4{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4e4.png');
}
.emojijs-emoji-1f4e5{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4e5.png');
}
.emojijs-emoji-1f4e6{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4e6.png');
}
.emojijs-emoji-1f4e7{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4e7.png');
}
.emojijs-emoji-1f4e8{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4e8.png');
}
.emojijs-emoji-1f4e9{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4e9.png');
}
.emojijs-emoji-1f4eb{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4eb.png');
}
.emojijs-emoji-1f4ec{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4ec.png');
}
.emojijs-emoji-1f4ed{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4ed.png');
}
.emojijs-emoji-1f4ef{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4ef.png');
}
.emojijs-emoji-1f4f0{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4f0.png');
}
.emojijs-emoji-1f4f5{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4f5.png');
}
.emojijs-emoji-1f4f9{
    background-image:url('//twemoji.maxcdn.com/72x72/1f4f9.png');
}
.emojijs-emoji-1f500{
    background-image:url('//twemoji.maxcdn.com/72x72/1f500.png');
}
.emojijs-emoji-1f501{
    background-image:url('//twemoji.maxcdn.com/72x72/1f501.png');
}
.emojijs-emoji-1f502{
    background-image:url('//twemoji.maxcdn.com/72x72/1f502.png');
}
.emojijs-emoji-1f503{
    background-image:url('//twemoji.maxcdn.com/72x72/1f503.png');
}
.emojijs-emoji-1f504{
    background-image:url('//twemoji.maxcdn.com/72x72/1f504.png');
}
.emojijs-emoji-1f505{
    background-image:url('//twemoji.maxcdn.com/72x72/1f505.png');
}
.emojijs-emoji-1f506{
    background-image:url('//twemoji.maxcdn.com/72x72/1f506.png');
}
.emojijs-emoji-1f507{
    background-image:url('//twemoji.maxcdn.com/72x72/1f507.png');
}
.emojijs-emoji-1f508{
    background-image:url('//twemoji.maxcdn.com/72x72/1f508.png');
}
.emojijs-emoji-1f509{
    background-image:url('//twemoji.maxcdn.com/72x72/1f509.png');
}
.emojijs-emoji-1f50b{
    background-image:url('//twemoji.maxcdn.com/72x72/1f50b.png');
}
.emojijs-emoji-1f50c{
    background-image:url('//twemoji.maxcdn.com/72x72/1f50c.png');
}
.emojijs-emoji-1f50e{
    background-image:url('//twemoji.maxcdn.com/72x72/1f50e.png');
}
.emojijs-emoji-1f510{
    background-image:url('//twemoji.maxcdn.com/72x72/1f510.png');
}
.emojijs-emoji-1f512{
    background-image:url('//twemoji.maxcdn.com/72x72/1f512.png');
}
.emojijs-emoji-1f515{
    background-image:url('//twemoji.maxcdn.com/72x72/1f515.png');
}
.emojijs-emoji-1f516{
    background-image:url('//twemoji.maxcdn.com/72x72/1f516.png');
}
.emojijs-emoji-1f517{
    background-image:url('//twemoji.maxcdn.com/72x72/1f517.png');
}
.emojijs-emoji-1f518{
    background-image:url('//twemoji.maxcdn.com/72x72/1f518.png');
}
.emojijs-emoji-1f519{
    background-image:url('//twemoji.maxcdn.com/72x72/1f519.png');
}
.emojijs-emoji-1f51a{
    background-image:url('//twemoji.maxcdn.com/72x72/1f51a.png');
}
.emojijs-emoji-1f51b{
    background-image:url('//twemoji.maxcdn.com/72x72/1f51b.png');
}
.emojijs-emoji-1f51c{
    background-image:url('//twemoji.maxcdn.com/72x72/1f51c.png');
}
.emojijs-emoji-1f51f{
    background-image:url('//twemoji.maxcdn.com/72x72/1f51f.png');
}
.emojijs-emoji-1f520{
    background-image:url('//twemoji.maxcdn.com/72x72/1f520.png');
}
.emojijs-emoji-1f521{
    background-image:url('//twemoji.maxcdn.com/72x72/1f521.png');
}
.emojijs-emoji-1f522{
    background-image:url('//twemoji.maxcdn.com/72x72/1f522.png');
}
.emojijs-emoji-1f523{
    background-image:url('//twemoji.maxcdn.com/72x72/1f523.png');
}
.emojijs-emoji-1f524{
    background-image:url('//twemoji.maxcdn.com/72x72/1f524.png');
}
.emojijs-emoji-1f526{
    background-image:url('//twemoji.maxcdn.com/72x72/1f526.png');
}
.emojijs-emoji-1f527{
    background-image:url('//twemoji.maxcdn.com/72x72/1f527.png');
}
.emojijs-emoji-1f529{
    background-image:url('//twemoji.maxcdn.com/72x72/1f529.png');
}
.emojijs-emoji-1f52a{
    background-image:url('//twemoji.maxcdn.com/72x72/1f52a.png');
}
.emojijs-emoji-1f52c{
    background-image:url('//twemoji.maxcdn.com/72x72/1f52c.png');
}
.emojijs-emoji-1f52d{
    background-image:url('//twemoji.maxcdn.com/72x72/1f52d.png');
}
.emojijs-emoji-1f52f{
    background-image:url('//twemoji.maxcdn.com/72x72/1f52f.png');
}
.emojijs-emoji-1f532{
    background-image:url('//twemoji.maxcdn.com/72x72/1f532.png');
}
.emojijs-emoji-1f533{
    background-image:url('//twemoji.maxcdn.com/72x72/1f533.png');
}
.emojijs-emoji-1f534{
    background-image:url('//twemoji.maxcdn.com/72x72/1f534.png');
}
.emojijs-emoji-1f535{
    background-image:url('//twemoji.maxcdn.com/72x72/1f535.png');
}
.emojijs-emoji-1f536{
    background-image:url('//twemoji.maxcdn.com/72x72/1f536.png');
}
.emojijs-emoji-1f537{
    background-image:url('//twemoji.maxcdn.com/72x72/1f537.png');
}
.emojijs-emoji-1f538{
    background-image:url('//twemoji.maxcdn.com/72x72/1f538.png');
}
.emojijs-emoji-1f539{
    background-image:url('//twemoji.maxcdn.com/72x72/1f539.png');
}
.emojijs-emoji-1f53a{
    background-image:url('//twemoji.maxcdn.com/72x72/1f53a.png');
}
.emojijs-emoji-1f53b{
    background-image:url('//twemoji.maxcdn.com/72x72/1f53b.png');
}
.emojijs-emoji-1f53c{
    background-image:url('//twemoji.maxcdn.com/72x72/1f53c.png');
}
.emojijs-emoji-1f53d{
    background-image:url('//twemoji.maxcdn.com/72x72/1f53d.png');
}
.emojijs-emoji-1f559{
    background-image:url('//twemoji.maxcdn.com/72x72/1f559.png');
}
.emojijs-emoji-1f55c{
    background-image:url('//twemoji.maxcdn.com/72x72/1f55c.png');
}
.emojijs-emoji-1f55d{
    background-image:url('//twemoji.maxcdn.com/72x72/1f55d.png');
}
.emojijs-emoji-1f55e{
    background-image:url('//twemoji.maxcdn.com/72x72/1f55e.png');
}
.emojijs-emoji-1f55f{
    background-image:url('//twemoji.maxcdn.com/72x72/1f55f.png');
}
.emojijs-emoji-1f560{
    background-image:url('//twemoji.maxcdn.com/72x72/1f560.png');
}
.emojijs-emoji-1f561{
    background-image:url('//twemoji.maxcdn.com/72x72/1f561.png');
}
.emojijs-emoji-1f562{
    background-image:url('//twemoji.maxcdn.com/72x72/1f562.png');
}
.emojijs-emoji-1f563{
    background-image:url('//twemoji.maxcdn.com/72x72/1f563.png');
}
.emojijs-emoji-1f564{
    background-image:url('//twemoji.maxcdn.com/72x72/1f564.png');
}
.emojijs-emoji-1f565{
    background-image:url('//twemoji.maxcdn.com/72x72/1f565.png');
}
.emojijs-emoji-1f566{
    background-image:url('//twemoji.maxcdn.com/72x72/1f566.png');
}
.emojijs-emoji-1f567{
    background-image:url('//twemoji.maxcdn.com/72x72/1f567.png');
}
.emojijs-emoji-1f5fe{
    background-image:url('//twemoji.maxcdn.com/72x72/1f5fe.png');
}
.emojijs-emoji-1f5ff{
    background-image:url('//twemoji.maxcdn.com/72x72/1f5ff.png');
}
.emojijs-emoji-1f600{
    background-image:url('//twemoji.maxcdn.com/72x72/1f600.png');
}
.emojijs-emoji-1f607{
    background-image:url('//twemoji.maxcdn.com/72x72/1f607.png');
}
.emojijs-emoji-1f608{
    background-image:url('//twemoji.maxcdn.com/72x72/1f608.png');
}
.emojijs-emoji-1f60b{
    background-image:url('//twemoji.maxcdn.com/72x72/1f60b.png');
}
.emojijs-emoji-1f60c{
    background-image:url('//twemoji.maxcdn.com/72x72/1f60c.png');
}
.emojijs-emoji-1f60e{
    background-image:url('//twemoji.maxcdn.com/72x72/1f60e.png');
}
.emojijs-emoji-1f610{
    background-image:url('//twemoji.maxcdn.com/72x72/1f610.png');
}
.emojijs-emoji-1f611{
    background-image:url('//twemoji.maxcdn.com/72x72/1f611.png');
}
.emojijs-emoji-1f615{
    background-image:url('//twemoji.maxcdn.com/72x72/1f615.png');
}
.emojijs-emoji-1f616{
    background-image:url('//twemoji.maxcdn.com/72x72/1f616.png');
}
.emojijs-emoji-1f617{
    background-image:url('//twemoji.maxcdn.com/72x72/1f617.png');
}
.emojijs-emoji-1f619{
    background-image:url('//twemoji.maxcdn.com/72x72/1f619.png');
}
.emojijs-emoji-1f61b{
    background-image:url('//twemoji.maxcdn.com/72x72/1f61b.png');
}
.emojijs-emoji-1f61d{
    background-image:url('//twemoji.maxcdn.com/72x72/1f61d.png');
}
.emojijs-emoji-1f61f{
    background-image:url('//twemoji.maxcdn.com/72x72/1f61f.png');
}
.emojijs-emoji-1f624{
    background-image:url('//twemoji.maxcdn.com/72x72/1f624.png');
}
.emojijs-emoji-1f626{
    background-image:url('//twemoji.maxcdn.com/72x72/1f626.png');
}
.emojijs-emoji-1f627{
    background-image:url('//twemoji.maxcdn.com/72x72/1f627.png');
}
.emojijs-emoji-1f629{
    background-image:url('//twemoji.maxcdn.com/72x72/1f629.png');
}
.emojijs-emoji-1f62b{
    background-image:url('//twemoji.maxcdn.com/72x72/1f62b.png');
}
.emojijs-emoji-1f62c{
    background-image:url('//twemoji.maxcdn.com/72x72/1f62c.png');
}
.emojijs-emoji-1f62e{
    background-image:url('//twemoji.maxcdn.com/72x72/1f62e.png');
}
.emojijs-emoji-1f62f{
    background-image:url('//twemoji.maxcdn.com/72x72/1f62f.png');
}
.emojijs-emoji-1f634{
    background-image:url('//twemoji.maxcdn.com/72x72/1f634.png');
}
.emojijs-emoji-1f635{
    background-image:url('//twemoji.maxcdn.com/72x72/1f635.png');
}
.emojijs-emoji-1f636{
    background-image:url('//twemoji.maxcdn.com/72x72/1f636.png');
}
.emojijs-emoji-1f638{
    background-image:url('//twemoji.maxcdn.com/72x72/1f638.png');
}
.emojijs-emoji-1f639{
    background-image:url('//twemoji.maxcdn.com/72x72/1f639.png');
}
.emojijs-emoji-1f63a{
    background-image:url('//twemoji.maxcdn.com/72x72/1f63a.png');
}
.emojijs-emoji-1f63b{
    background-image:url('//twemoji.maxcdn.com/72x72/1f63b.png');
}
.emojijs-emoji-1f63c{
    background-image:url('//twemoji.maxcdn.com/72x72/1f63c.png');
}
.emojijs-emoji-1f63d{
    background-image:url('//twemoji.maxcdn.com/72x72/1f63d.png');
}
.emojijs-emoji-1f63e{
    background-image:url('//twemoji.maxcdn.com/72x72/1f63e.png');
}
.emojijs-emoji-1f63f{
    background-image:url('//twemoji.maxcdn.com/72x72/1f63f.png');
}
.emojijs-emoji-1f640{
    background-image:url('//twemoji.maxcdn.com/72x72/1f640.png');
}
.emojijs-emoji-1f648{
    background-image:url('//twemoji.maxcdn.com/72x72/1f648.png');
}
.emojijs-emoji-1f649{
    background-image:url('//twemoji.maxcdn.com/72x72/1f649.png');
}
.emojijs-emoji-1f64a{
    background-image:url('//twemoji.maxcdn.com/72x72/1f64a.png');
}
.emojijs-emoji-1f64b{
    background-image:url('//twemoji.maxcdn.com/72x72/1f64b.png');
}
.emojijs-emoji-1f64d{
    background-image:url('//twemoji.maxcdn.com/72x72/1f64d.png');
}
.emojijs-emoji-1f64e{
    background-image:url('//twemoji.maxcdn.com/72x72/1f64e.png');
}
.emojijs-emoji-1f681{
    background-image:url('//twemoji.maxcdn.com/72x72/1f681.png');
}
.emojijs-emoji-1f682{
    background-image:url('//twemoji.maxcdn.com/72x72/1f682.png');
}
.emojijs-emoji-1f686{
    background-image:url('//twemoji.maxcdn.com/72x72/1f686.png');
}
.emojijs-emoji-1f687{
    background-image:url('//twemoji.maxcdn.com/72x72/1f687.png');
}
.emojijs-emoji-1f688{
    background-image:url('//twemoji.maxcdn.com/72x72/1f688.png');
}
.emojijs-emoji-1f68a{
    background-image:url('//twemoji.maxcdn.com/72x72/1f68a.png');
}
.emojijs-emoji-1f68b{
    background-image:url('//twemoji.maxcdn.com/72x72/1f68b.png');
}
.emojijs-emoji-1f68d{
    background-image:url('//twemoji.maxcdn.com/72x72/1f68d.png');
}
.emojijs-emoji-1f68e{
    background-image:url('//twemoji.maxcdn.com/72x72/1f68e.png');
}
.emojijs-emoji-1f690{
    background-image:url('//twemoji.maxcdn.com/72x72/1f690.png');
}
.emojijs-emoji-1f694{
    background-image:url('//twemoji.maxcdn.com/72x72/1f694.png');
}
.emojijs-emoji-1f696{
    background-image:url('//twemoji.maxcdn.com/72x72/1f696.png');
}
.emojijs-emoji-1f698{
    background-image:url('//twemoji.maxcdn.com/72x72/1f698.png');
}
.emojijs-emoji-1f69b{
    background-image:url('//twemoji.maxcdn.com/72x72/1f69b.png');
}
.emojijs-emoji-1f69c{
    background-image:url('//twemoji.maxcdn.com/72x72/1f69c.png');
}
.emojijs-emoji-1f69d{
    background-image:url('//twemoji.maxcdn.com/72x72/1f69d.png');
}
.emojijs-emoji-1f69e{
    background-image:url('//twemoji.maxcdn.com/72x72/1f69e.png');
}
.emojijs-emoji-1f69f{
    background-image:url('//twemoji.maxcdn.com/72x72/1f69f.png');
}
.emojijs-emoji-1f6a0{
    background-image:url('//twemoji.maxcdn.com/72x72/1f6a0.png');
}
.emojijs-emoji-1f6a1{
    background-image:url('//twemoji.maxcdn.com/72x72/1f6a1.png');
}
.emojijs-emoji-1f6a2{
    background-image:url('//twemoji.maxcdn.com/72x72/1f6a2.png');
}
.emojijs-emoji-1f6a3{
    background-image:url('//twemoji.maxcdn.com/72x72/1f6a3.png');
}
.emojijs-emoji-1f6a6{
    background-image:url('//twemoji.maxcdn.com/72x72/1f6a6.png');
}
.emojijs-emoji-1f6a7{
    background-image:url('//twemoji.maxcdn.com/72x72/1f6a7.png');
}
.emojijs-emoji-1f6a8{
    background-image:url('//twemoji.maxcdn.com/72x72/1f6a8.png');
}
.emojijs-emoji-1f6a9{
    background-image:url('//twemoji.maxcdn.com/72x72/1f6a9.png');
}
.emojijs-emoji-1f6aa{
    background-image:url('//twemoji.maxcdn.com/72x72/1f6aa.png');
}
.emojijs-emoji-1f6ab{
    background-image:url('//twemoji.maxcdn.com/72x72/1f6ab.png');
}
.emojijs-emoji-1f6ae{
    background-image:url('//twemoji.maxcdn.com/72x72/1f6ae.png');
}
.emojijs-emoji-1f6af{
    background-image:url('//twemoji.maxcdn.com/72x72/1f6af.png');
}
.emojijs-emoji-1f6b0{
    background-image:url('//twemoji.maxcdn.com/72x72/1f6b0.png');
}
.emojijs-emoji-1f6b1{
    background-image:url('//twemoji.maxcdn.com/72x72/1f6b1.png');
}
.emojijs-emoji-1f6b3{
    background-image:url('//twemoji.maxcdn.com/72x72/1f6b3.png');
}
.emojijs-emoji-1f6b4{
    background-image:url('//twemoji.maxcdn.com/72x72/1f6b4.png');
}
.emojijs-emoji-1f6b5{
    background-image:url('//twemoji.maxcdn.com/72x72/1f6b5.png');
}
.emojijs-emoji-1f6b7{
    background-image:url('//twemoji.maxcdn.com/72x72/1f6b7.png');
}
.emojijs-emoji-1f6b8{
    background-image:url('//twemoji.maxcdn.com/72x72/1f6b8.png');
}
.emojijs-emoji-1f6bf{
    background-image:url('//twemoji.maxcdn.com/72x72/1f6bf.png');
}
.emojijs-emoji-1f6c1{
    background-image:url('//twemoji.maxcdn.com/72x72/1f6c1.png');
}
.emojijs-emoji-1f6c2{
    background-image:url('//twemoji.maxcdn.com/72x72/1f6c2.png');
}
.emojijs-emoji-1f6c3{
    background-image:url('//twemoji.maxcdn.com/72x72/1f6c3.png');
}
.emojijs-emoji-1f6c4{
    background-image:url('//twemoji.maxcdn.com/72x72/1f6c4.png');
}
.emojijs-emoji-1f6c5{
    background-image:url('//twemoji.maxcdn.com/72x72/1f6c5.png');
}
.emojijs-emoji-203c{
    background-image:url('//twemoji.maxcdn.com/72x72/203c.png');
}
.emojijs-emoji-2049{
    background-image:url('//twemoji.maxcdn.com/72x72/2049.png');
}
.emojijs-emoji-2139{
    background-image:url('//twemoji.maxcdn.com/72x72/2139.png');
}
.emojijs-emoji-2194{
    background-image:url('//twemoji.maxcdn.com/72x72/2194.png');
}
.emojijs-emoji-2195{
    background-image:url('//twemoji.maxcdn.com/72x72/2195.png');
}
.emojijs-emoji-21a9{
    background-image:url('//twemoji.maxcdn.com/72x72/21a9.png');
}
.emojijs-emoji-21aa{
    background-image:url('//twemoji.maxcdn.com/72x72/21aa.png');
}
.emojijs-emoji-231a{
    background-image:url('//twemoji.maxcdn.com/72x72/231a.png');
}
.emojijs-emoji-231b{
    background-image:url('//twemoji.maxcdn.com/72x72/231b.png');
}
.emojijs-emoji-23eb{
    background-image:url('//twemoji.maxcdn.com/72x72/23eb.png');
}
.emojijs-emoji-23ec{
    background-image:url('//twemoji.maxcdn.com/72x72/23ec.png');
}
.emojijs-emoji-23f3{
    background-image:url('//twemoji.maxcdn.com/72x72/23f3.png');
}
.emojijs-emoji-25fb{
    background-image:url('//twemoji.maxcdn.com/72x72/25fb.png');
}
.emojijs-emoji-25fc{
    background-image:url('//twemoji.maxcdn.com/72x72/25fc.png');
}
.emojijs-emoji-25fd{
    background-image:url('//twemoji.maxcdn.com/72x72/25fd.png');
}
.emojijs-emoji-25fe{
    background-image:url('//twemoji.maxcdn.com/72x72/25fe.png');
}
.emojijs-emoji-2611{
    background-image:url('//twemoji.maxcdn.com/72x72/2611.png');
}
.emojijs-emoji-267b{
    background-image:url('//twemoji.maxcdn.com/72x72/267b.png');
}
.emojijs-emoji-26ab{
    background-image:url('//twemoji.maxcdn.com/72x72/26ab.png');
}
.emojijs-emoji-2705{
    background-image:url('//twemoji.maxcdn.com/72x72/2705.png');
}
.emojijs-emoji-2712{
    background-image:url('//twemoji.maxcdn.com/72x72/2712.png');
}
.emojijs-emoji-2714{
    background-image:url('//twemoji.maxcdn.com/72x72/2714.png');
}
.emojijs-emoji-2744{
    background-image:url('//twemoji.maxcdn.com/72x72/2744.png');
}
.emojijs-emoji-2747{
    background-image:url('//twemoji.maxcdn.com/72x72/2747.png');
}
.emojijs-emoji-274c{
    background-image:url('//twemoji.maxcdn.com/72x72/274c.png');
}
.emojijs-emoji-274e{
    background-image:url('//twemoji.maxcdn.com/72x72/274e.png');
}
.emojijs-emoji-2795{
    background-image:url('//twemoji.maxcdn.com/72x72/2795.png');
}
.emojijs-emoji-2796{
    background-image:url('//twemoji.maxcdn.com/72x72/2796.png');
}
.emojijs-emoji-2797{
    background-image:url('//twemoji.maxcdn.com/72x72/2797.png');
}
.emojijs-emoji-27b0{
    background-image:url('//twemoji.maxcdn.com/72x72/27b0.png');
}
.emojijs-emoji-2934{
    background-image:url('//twemoji.maxcdn.com/72x72/2934.png');
}
.emojijs-emoji-2935{
    background-image:url('//twemoji.maxcdn.com/72x72/2935.png');
}
.emojijs-emoji-2b1b{
    background-image:url('//twemoji.maxcdn.com/72x72/2b1b.png');
}
.emojijs-emoji-2b1c{
    background-image:url('//twemoji.maxcdn.com/72x72/2b1c.png');
}
.emojijs-emoji-3030{
    background-image:url('//twemoji.maxcdn.com/72x72/3030.png');
}
.emojijs-emoji-fe4e5{
    background-image:url('//twemoji.maxcdn.com/72x72/1f1ef-1f1f5.png');
}
.emojijs-emoji-fe4e6{
    background-image:url('//twemoji.maxcdn.com/72x72/1f1fa-1f1f8.png');
}
.emojijs-emoji-fe4e7{
    background-image:url('//twemoji.maxcdn.com/72x72/1f1eb-1f1f7.png');
}
.emojijs-emoji-fe4e8{
    background-image:url('//twemoji.maxcdn.com/72x72/1f1e9-1f1ea.png');
}
.emojijs-emoji-fe4e9{
    background-image:url('//twemoji.maxcdn.com/72x72/1f1ee-1f1f9.png');
}
.emojijs-emoji-fe4ea{
    background-image:url('//twemoji.maxcdn.com/72x72/1f1ec-1f1e7.png');
}
.emojijs-emoji-fe4eb{
    background-image:url('//twemoji.maxcdn.com/72x72/1f1ea-1f1f8.png');
}
.emojijs-emoji-fe4ec{
    background-image:url('//twemoji.maxcdn.com/72x72/1f1f7-1f1fa.png');
}
.emojijs-emoji-fe4ed{
    background-image:url('//twemoji.maxcdn.com/72x72/1f1e8-1f1f3.png');
}
.emojijs-emoji-fe4ee{
    background-image:url('//twemoji.maxcdn.com/72x72/1f1f0-1f1f7.png');
}

.icon-ico-001:before {
    content: "\e90e";
}

.icon-ico-002:before {
    content: "\62";
}

.icon-ico-003:before {
    content: "\63";
}

.icon-ico-004:before {
    content: "\64";
}

.icon-ico-005:before {
    content: "\65";
}

.icon-ico-006:before {
    content: "\66";
}

.icon-ico-007:before {
    content: "\67";
}

.icon-ico-008:before {
    content: "\68";
}

.icon-ico-009:before {
    content: "\69";
}

.icon-ico-010:before {
    content: "\6a";
}

.icon-ico-011:before {
    content: "\6b";
}

.icon-ico-012:before {
    content: "\6c";
}

.icon-ico-013:before {
    content: "\6d";
}

.icon-ico-014:before {
    content: "\6e";
}

.icon-ico-015:before {
    content: "\6f";
}

.icon-ico-016:before {
    content: "\70";
}

.icon-ico-017:before {
    content: "\71";
}

.icon-ico-018:before {
    content: "\72";
}

.icon-ico-019:before {
    content: "\73";
}

.icon-ico-020:before {
    content: "\74";
}

.icon-ico-021:before {
    content: "\75";
}

.icon-ico-022:before {
    content: "\76";
}

.icon-ico-023:before {
    content: "\77";
}

.icon-ico-024:before {
    content: "\78";
}

.icon-ico-025:before {
    content: "\79";
}

.icon-ico-026:before {
    content: "\7a";
}

.icon-ico-027:before {
    content: "\41";
}

.icon-ico-028:before {
    content: "\42";
}

.icon-ico-029:before {
    content: "\43";
}

.icon-ico-030:before {
    content: "\44";
}

.icon-ico-031:before {
    content: "\45";
}

.icon-ico-032:before {
    content: "\46";
}

.icon-ico-033:before {
    content: "\47";
}

.icon-ico-034:before {
    content: "\48";
}

.icon-ico-035:before {
    content: "\49";
}

.icon-ico-036:before {
    content: "\4a";
}

.icon-ico-037:before {
    content: "\4b";
}

.icon-ico-038:before {
    content: "\e90d";
}

.icon-ico-039:before {
    content: "\4d";
}

.icon-ico-040:before {
    content: "\4e";
}

.icon-ico-041:before {
    content: "\4f";
}

.icon-ico-042:before {
    content: "\50";
}

.icon-ico-043:before {
    content: "\51";
}

.icon-ico-044:before {
    content: "\52";
}

.icon-ico-045:before {
    content: "\53";
}

.icon-ico-046:before {
    content: "\54";
}

.icon-ico-047:before {
    content: "\55";
}

.icon-ico-048:before {
    content: "\56";
}

.icon-ico-049:before {
    content: "\57";
}

.icon-ico-050:before {
    content: "\58";
}

.icon-ico-051:before {
    content: "\59";
}

.icon-ico-052:before {
    content: "\5a";
}

.icon-ico-053:before {
    content: "\30";
}

.icon-ico-054:before {
    content: "\31";
}

.icon-ico-055:before {
    content: "\32";
}

.icon-ico-056:before {
    content: "\33";
}

.icon-ico-057:before {
    content: "\34";
}

.icon-ico-058:before {
    content: "\35";
}

.icon-ico-059:before {
    content: "\36";
}

.icon-ico-060:before {
    content: "\e900";
}

.icon-ico-061:before {
    content: "\38";
}

.icon-ico-062:before {
    content: "\39";
}

.icon-ico-063:before {
    content: "\21";
}

.icon-ico-064:before {
    content: "\22";
}

.icon-ico-065:before {
    content: "\23";
}

.icon-ico-066:before {
    content: "\24";
}

.icon-ico-067:before {
    content: "\25";
}

.icon-ico-068:before {
    content: "\26";
}

.icon-ico-069:before {
    content: "\27";
}

.icon-ico-070:before {
    content: "\28";
}

.icon-ico-071:before {
    content: "\29";
}

.icon-ico-072:before {
    content: "\2a";
}

.icon-ico-073:before {
    content: "\2b";
}

.icon-ico-074:before {
    content: "\2c";
}

.icon-ico-075:before {
    content: "\2d";
}

.icon-ico-076:before {
    content: "\2e";
}

.icon-ico-077:before {
    content: "\2f";
}

.icon-ico-078:before {
    content: "\3a";
}

.icon-ico-079:before {
    content: "\3b";
}

.icon-ico-080:before {
    content: "\3c";
}

.icon-ico-081:before {
    content: "\3d";
}

.icon-ico-082:before {
    content: "\3e";
}

.icon-ico-083:before {
    content: "\3f";
}

.icon-ico-084:before {
    content: "\40";
}

.icon-ico-085:before {
    content: "\5b";
}

.icon-ico-086:before {
    content: "\5d";
}

.icon-ico-087:before {
    content: "\5e";
}

.icon-ico-088:before {
    content: "\5f";
}

.icon-ico-089:before {
    content: "\60";
}

.icon-ico-090:before {
    content: "\7b";
}

.icon-ico-091:before {
    content: "\7c";
}

.icon-ico-092:before {
    content: "\7d";
}

.icon-ico-093:before {
    content: "\7e";
}

.icon-ico-094:before {
    content: "\5c";
}

.icon-ico-095:before {
    content: "\e000";
}

.icon-ico-096:before {
    content: "\e001";
}

.icon-ico-097:before {
    content: "\e002";
}

.icon-ico-098:before {
    content: "\e003";
}

.icon-ico-099:before {
    content: "\e004";
}

.icon-ico-100:before {
    content: "\e005";
}

.icon-ico-101:before {
    content: "\e006";
}

.icon-ico-102:before {
    content: "\e007";
}

.icon-ico-103:before {
    content: "\e008";
}

.icon-ico-104:before {
    content: "\e009";
}

.icon-ico-105:before {
    content: "\e00a";
}

.icon-ico-106:before {
    content: "\e00b";
}

.icon-ico-107:before {
    content: "\e00c";
}

.icon-ico-108:before {
    content: "\e00d";
}

.icon-ico-109:before {
    content: "\e00e";
}

.icon-ico-110:before {
    content: "\e00f";
}

.icon-ico-111:before {
    content: "\e010";
}

.icon-ico-112:before {
    content: "\e011";
}

.icon-ico-113:before {
    content: "\e012";
}

.icon-ico-114:before {
    content: "\e013";
}

.icon-ico-115:before {
    content: "\e014";
}

.icon-ico-116:before {
    content: "\e901";
}

.icon-ico-117:before {
    content: "\e902";
}

.icon-ico-118:before {
    content: "\e017";
}

.icon-ico-119:before {
    content: "\e018";
}

.icon-ico-120:before {
    content: "\e019";
}

.icon-ico-121:before {
    content: "\e01a";
}

.icon-ico-122:before {
    content: "\e01b";
}

.icon-ico-123:before {
    content: "\e01c";
}

.icon-ico-124:before {
    content: "\e01d";
}

.icon-ico-125:before {
    content: "\e01e";
}

.icon-ico-126:before {
    content: "\e01f";
}

.icon-ico-127:before {
    content: "\e020";
}

.icon-ico-128:before {
    content: "\e021";
}

.icon-ico-129:before {
    content: "\e022";
}

.icon-ico-130:before {
    content: "\e023";
}

.icon-ico-131:before {
    content: "\e024";
}

.icon-ico-132:before {
    content: "\e025";
}

.icon-ico-133:before {
    content: "\e026";
}

.icon-ico-134:before {
    content: "\e027";
}

.icon-ico-135:before {
    content: "\e028";
}

.icon-ico-136:before {
    content: "\e029";
}

.icon-ico-137:before {
    content: "\e02a";
}

.icon-ico-138:before {
    content: "\e02b";
}

.icon-ico-139:before {
    content: "\e02c";
}

.icon-ico-140:before {
    content: "\e02d";
}

.icon-ico-141:before {
    content: "\e02e";
}

.icon-ico-142:before {
    content: "\e02f";
}

.icon-ico-143:before {
    content: "\e030";
}

.icon-ico-144:before {
    content: "\e031";
}

.icon-ico-145:before {
    content: "\e032";
}

.icon-ico-146:before {
    content: "\e033";
}

.icon-ico-147:before {
    content: "\e034";
}

.icon-ico-148:before {
    content: "\e035";
}

.icon-ico-149:before {
    content: "\e036";
}

.icon-ico-150:before {
    content: "\e037";
}

.icon-ico-151:before {
    content: "\e038";
}

.icon-ico-152:before {
    content: "\e039";
}

.icon-ico-153:before {
    content: "\e03a";
}

.icon-ico-154:before {
    content: "\e03b";
}

.icon-ico-155:before {
    content: "\e03c";
}

.icon-ico-156:before {
    content: "\e03d";
}

.icon-ico-157:before {
    content: "\e03e";
}

.icon-ico-158:before {
    content: "\e03f";
}

.icon-ico-159:before {
    content: "\e040";
}

.icon-ico-160:before {
    content: "\e041";
}

.icon-ico-161:before {
    content: "\e042";
}

.icon-ico-162:before {
    content: "\e043";
}

.icon-ico-163:before {
    content: "\e044";
}

.icon-ico-164:before {
    content: "\e045";
}

.icon-ico-165:before {
    content: "\e046";
}

.icon-ico-166:before {
    content: "\e047";
}

.icon-ico-167:before {
    content: "\e048";
}

.icon-ico-168:before {
    content: "\e049";
}

.icon-ico-169:before {
    content: "\e04a";
}

.icon-ico-170:before {
    content: "\e04b";
}

.icon-ico-171:before {
    content: "\e04c";
}

.icon-ico-172:before {
    content: "\e04d";
}

.icon-ico-173:before {
    content: "\e04e";
}

.icon-ico-174:before {
    content: "\e04f";
}

.icon-ico-175:before {
    content: "\e050";
}

.icon-ico-176:before {
    content: "\e051";
}

.icon-ico-177:before {
    content: "\e052";
}

.icon-ico-178:before {
    content: "\e053";
}

.icon-ico-179:before {
    content: "\e054";
}

.icon-ico-180:before {
    content: "\e055";
}

.icon-ico-181:before {
    content: "\e056";
}

.icon-ico-182:before {
    content: "\e057";
}

.icon-ico-183:before {
    content: "\e058";
}

.icon-ico-184:before {
    content: "\e059";
}

.icon-ico-185:before {
    content: "\e05a";
}

.icon-ico-186:before {
    content: "\e05b";
}

.icon-ico-187:before {
    content: "\e05c";
}

.icon-ico-188:before {
    content: "\e05d";
}

.icon-ico-189:before {
    content: "\e05e";
}

.icon-ico-190:before {
    content: "\e05f";
}

.icon-ico-191:before {
    content: "\e903";
}

.icon-ico-192:before {
    content: "\e061";
}

.icon-ico-193:before {
    content: "\e062";
}

.icon-ico-194:before {
    content: "\e063";
}

.icon-ico-195:before {
    content: "\e064";
}

.icon-ico-196:before {
    content: "\e065";
}

.icon-ico-197:before {
    content: "\e066";
}

.icon-ico-198:before {
    content: "\e067";
}

.icon-ico-199:before {
    content: "\e068";
}

.icon-ico-200:before {
    content: "\e069";
}

.icon-ico-201:before {
    content: "\e06a";
}

.icon-ico-202:before {
    content: "\e06b";
}

.icon-ico-203:before {
    content: "\e06c";
}

.icon-ico-204:before {
    content: "\e06d";
}

.icon-ico-205:before {
    content: "\e904";
}

.icon-ico-206:before {
    content: "\e905";
}

.icon-ico-207:before {
    content: "\e906";
}

.icon-ico-208:before {
    content: "\e907";
}

.icon-ico-209:before {
    content: "\e908";
}

.icon-ico-210:before {
    content: "\e909";
}

.icon-ico-211:before {
    content: "\e90c";
}

.icon-ico-212:before {
    content: "\e90b";
}

.icon-ico-213:before {
    content: "\e90a";
}

.icon-ico-214:before {
    content: "\e90f";
}

.icon-ico-215:before {
    content: "\e91b";
}

.icon-ico-216:before {
    content: "\e910";
}

.icon-ico-217:before {
    content: "\e91a";
}

.icon-ico-218:before {
    content: "\e919";
}

.icon-ico-219:before {
    content: "\e918";
}

.icon-ico-220:before {
    content: "\e917";
}

.icon-ico-221:before {
    content: "\e916";
}

.icon-ico-222:before {
    content: "\e915";
}

.icon-ico-223:before {
    content: "\e911";
}

.icon-ico-224:before {
    content: "\e914";
}

.icon-ico-225:before {
    content: "\e913";
}

.icon-ico-226:before {
    content: "\e912";
}
/* Generated by grunt-webfont */




/* Icons */


.icon-accept:before {
	content:"\f101";
}


.icon-add:before {
	content:"\f102";
}


.icon-solicit:before {
	content:"\f103";
}


.icon-attachment:before {
	content:"\f104";
}


.icon-calendar:before {
	content:"\f105";
}


.icon-cancel:before {
	content:"\f106";
}


.icon-change-status:before {
	content:"\f107";
}


.icon-change-type:before {
	content:"\f108";
}


.icon-find-id:before {
	content:"\f109";
}


.icon-analysis:before {
	content:"\f10a";
}


.icon-delete:before {
	content:"\f10b";
}


.icon-item:before {
	content:"\f10c";
}


.icon-edit:before {
	content:"\f10d";
}


.icon-engagent:before {
	content:"\f10e";
}


.icon-entity:before {
	content:"\f10f";
}


.icon-error:before {
	content:"\f110";
}


.icon-collapse:before {
	content:"\f111";
}


.icon-export:before {
	content:"\f112";
}


.icon-import:before {
	content:"\f113";
}


.icon-field-generic:before {
	content:"\f114";
}


.icon-filter:before {
	content:"\f115";
}


.icon-arrow-up:before {
	content:"\f116";
}


.icon-arrow-down:before {
	content:"\f117";
}


.icon-arrow-left:before {
	content:"\f118";
}


.icon-arrow-right:before {
	content:"\f119";
}


.icon-folder:before {
	content:"\f11a";
}


.icon-folder-opened:before {
	content:"\f11b";
}


.icon-ticket-forward:before {
	content:"\f11c";
}


.icon-menu-hamburger:before {
	content:"\f11d";
}


.icon-hierarchy:before {
	content:"\f11e";
}


.icon-message-forward:before {
	content:"\f11f";
}


.icon-message-reply:before {
	content:"\f120";
}


.icon-message-reply-all:before {
	content:"\f121";
}


.icon-process:before {
	content:"\f122";
}


.icon-entity-changerequest:before {
	content:"\f123";
}


.icon-entity-incident:before {
	content:"\f124";
}


.icon-entity-intervention:before {
	content:"\f125";
}


.icon-entity-problem:before {
	content:"\f126";
}


.icon-support:before {
	content:"\f127";
}


.icon-entity-ticket:before {
	content:"\f128";
}


.icon-user-profile:before {
	content:"\f129";
}


.icon-open-new-window:before {
	content:"\f12a";
}


.icon-refresh:before {
	content:"\f12b";
}


.icon-report:before {
	content:"\f12c";
}


.icon-save-close:before {
	content:"\f12d";
}


.icon-save-new:before {
	content:"\f12e";
}


.icon-send:before {
	content:"\f12f";
}


.icon-settings:before {
	content:"\f130";
}


.icon-checkbox-empty:before {
	content:"\f131";
}


.icon-checkbox-checked:before {
	content:"\f132";
}


.icon-radiobutton-empty:before {
	content:"\f133";
}


.icon-radiobutton-set:before {
	content:"\f134";
}


.icon-close:before {
	content:"\f135";
}


.icon-expand:before {
	content:"\f136";
}


.icon-field-complex:before {
	content:"\f137";
}


.icon-entity-project:before {
	content:"\f138";
}


.icon-languages:before {
	content:"\f139";
}


.icon-favourite:before {
	content:"\f13a";
}


.icon-save:before {
	content:"\f13b";
}


.icon-finance:before {
	content:"\f13c";
}


.icon-search:before {
	content:"\f13d";
}


.icon-open:before {
	content:"\f13e";
}


.icon-view:before {
	content:"\f13f";
}


.icon-clear:before {
	content:"\f140";
}


.icon-upload:before {
	content:"\f141";
}


.icon-download:before {
	content:"\f142";
}


.icon-browse:before {
	content:"\f143";
}


.icon-success:before {
	content:"\f144";
}


.icon-warning:before {
	content:"\f145";
}


.icon-info:before {
	content:"\f146";
}


.icon-error:before {
	content:"\f110";
}


.icon-entity-template:before {
	content:"\f147";
}


.icon-reset-settings:before {
	content:"\f148";
}


.icon-entity-scheduledtask:before {
	content:"\f149";
}


.icon-select:before {
	content:"\f14a";
}


.icon-select-id:before {
	content:"\f14b";
}


.icon-entity-email:before {
	content:"\f14c";
}


.icon-entity-emailaddress:before {
	content:"\f14d";
}


.icon-entity-user:before {
	content:"\f14e";
}


.icon-entity-usergroup:before {
	content:"\f14f";
}


.icon-entity-contact:before {
	content:"\f150";
}


.icon-entity-account:before {
	content:"\f151";
}


.icon-supplier:before {
	content:"\f152";
}


.icon-copy:before {
	content:"\f153";
}


.icon-paste:before {
	content:"\f154";
}


.icon-emoji:before {
	content:"\f155";
}


.icon-spellcheck:before {
	content:"\f156";
}


.icon-brainbusiness-forms:before {
	content:"\f157";
}


.icon-clone:before {
	content:"\f158";
}


.icon-load-data:before {
	content:"\f159";
}


.icon-sort-descending:before {
	content:"\f15a";
}


.icon-sort-ascending:before {
	content:"\f15b";
}


.icon-group-by:before {
	content:"\f15c";
}


.icon-table:before {
	content:"\f15d";
}


.icon-expiration:before {
	content:"\f15e";
}


.icon-message:before {
	content:"\f15f";
}


.icon-category:before {
	content:"\f160";
}


.icon-suspension:before {
	content:"\f161";
}


.icon-entity-ticketconversationitem:before {
	content:"\f162";
}


.icon-change-priority:before {
	content:"\f163";
}


.icon-change-category:before {
	content:"\f164";
}


.icon-add-related-object:before {
	content:"\f165";
}


.icon-remove-related-object:before {
	content:"\f166";
}


.icon-history-item:before {
	content:"\f167";
}


.icon-entity-asset:before {
	content:"\f168";
}


.icon-feedback:before {
	content:"\f169";
}


.icon-user-schedule:before {
	content:"\f16a";
}


.icon-allocation:before {
	content:"\f16b";
}


.icon-plan:before {
	content:"\f16c";
}


.icon-clock:before {
	content:"\f16d";
}


.icon-entity-workhour:before {
	content:"\f16e";
}


.icon-unlock:before {
	content:"\f16f";
}


.icon-lock:before {
	content:"\f170";
}


.icon-reschedule:before {
	content:"\f171";
}


.icon-entity-service:before {
	content:"\f172";
}


.icon-service-catalog:before {
	content:"\f173";
}


.icon-entity-catalogfolder:before {
	content:"\f174";
}


.icon-entity-catalogitem:before {
	content:"\f175";
}


.icon-entity-catalogitemrequest:before {
	content:"\f176";
}


.icon-menu:before {
	content:"\f177";
}


.icon-notifications:before {
	content:"\f178";
}


.icon-entity-communication:before {
	content:"\f179";
}


.icon-upvote:before {
	content:"\f17a";
}


.icon-downvote:before {
	content:"\f17b";
}


.icon-pin:before {
	content:"\f17c";
}


.icon-unpin:before {
	content:"\f17d";
}


.icon-knowledge-base:before {
	content:"\f17e";
}


.icon-registry:before {
	content:"\f17f";
}


.icon-star:before {
	content:"\f180";
}


.icon-archive:before {
	content:"\f181";
}


.icon-logout:before {
	content:"\f182";
}


.icon-key:before {
	content:"\f183";
}


.icon-read:before {
	content:"\f184";
}


.icon-unread:before {
	content:"\f185";
}


.icon-home:before {
	content:"\f186";
}


.icon-cart:before {
	content:"\f187";
}


.icon-play:before {
	content:"\f188";
}


.icon-stop:before {
	content:"\f189";
}


.icon-pause:before {
	content:"\f18a";
}


.icon-forward:before {
	content:"\f18b";
}


.icon-backward:before {
	content:"\f18c";
}


.icon-skip-forward:before {
	content:"\f18d";
}


.icon-skip-backward:before {
	content:"\f18e";
}


.icon-command:before {
	content:"\f18f";
}


.icon-sliders:before {
	content:"\f190";
}


.icon-arrow-double-up:before {
	content:"\f191";
}


.icon-arrow-double-down:before {
	content:"\f192";
}


.icon-arrow-double-left:before {
	content:"\f193";
}


.icon-arrow-double-right:before {
	content:"\f194";
}


.icon-deny:before {
	content:"\f195";
}


.icon-toggle-off:before {
	content:"\f196";
}


.icon-toggle-on:before {
	content:"\f197";
}


.icon-question:before {
	content:"\f198";
}


.icon-phone:before {
	content:"\f199";
}


.icon-mobile:before {
	content:"\f19a";
}


.icon-fax:before {
	content:"\f19b";
}


.icon-sms:before {
	content:"\f19c";
}


.icon-email:before {
	content:"\f19d";
}


.icon-social:before {
	content:"\f19e";
}


.icon-note:before {
	content:"\f19f";
}


.icon-entity-note:before {
	content:"\f1a0";
}


.icon-schedule:before {
	content:"\f1a1";
}


.icon-send-mail:before {
	content:"\f1a2";
}


.icon-address-book:before {
	content:"\f1a3";
}


.icon-call:before {
	content:"\f1a4";
}


.icon-call-ok:before {
	content:"\f1a5";
}


.icon-call-ko:before {
	content:"\f1a6";
}


.icon-call-re:before {
	content:"\f1a7";
}


.icon-location:before {
	content:"\f1a8";
}


.icon-entity-blocked:before {
	content:"\f1a9";
}


.icon-entity-closed:before {
	content:"\f1aa";
}


.icon-entity-inactive:before {
	content:"\f1ab";
}


.icon-experimental:before {
	content:"\f1ac";
}


.icon-drop-above:before {
	content:"\f1ad";
}


.icon-drop-between:before {
	content:"\f1ae";
}


.icon-drop-below:before {
	content:"\f1af";
}


.icon-bank:before {
	content:"\f1b0";
}


.icon-money:before {
	content:"\f1b1";
}


.icon-file-type-generic:before {
	content:"\f1b2";
}


.icon-file-type-image:before {
	content:"\f1b3";
}


.icon-file-type-text:before {
	content:"\f1b4";
}


.icon-file-type-pdf:before {
	content:"\f1b5";
}


.icon-file-type-document:before {
	content:"\f1b6";
}


.icon-file-type-spreadsheet:before {
	content:"\f1b7";
}


.icon-file-type-csv:before {
	content:"\f1b8";
}


.icon-file-type-email:before {
	content:"\f1b9";
}


.icon-file-type-archive:before {
	content:"\f1ba";
}


.icon-file-type-xml:before {
	content:"\f1bb";
}


.icon-file-type-presentation:before {
	content:"\f1bc";
}


.icon-entity-warehousedocument:before {
	content:"\f1bd";
}


.icon-entity-costcenter:before {
	content:"\f1be";
}


.icon-eye:before {
	content:"\f1bf";
}


.icon-eye-crossed:before {
	content:"\f1c0";
}


.icon-eye-closed:before {
	content:"\f1c1";
}


.icon-eye-plus:before {
	content:"\f1c2";
}


.icon-eye-minus:before {
	content:"\f1c3";
}


.icon-eye-cross:before {
	content:"\f1c4";
}


.icon-menu-dot-matrix:before {
	content:"\f1c5";
}


.icon-menu-half-burger:before {
	content:"\f1c6";
}


.icon-menu-dots-circle:before {
	content:"\f1c7";
}


.icon-arrow-line-up:before {
	content:"\f1c8";
}


.icon-arrow-line-down:before {
	content:"\f1c9";
}


.icon-arrow-line-left:before {
	content:"\f1ca";
}


.icon-arrow-line-right:before {
	content:"\f1cb";
}


.icon-web:before {
	content:"\f1cc";
}


.icon-plus:before {
	content:"\f1cd";
}


.icon-minus:before {
	content:"\f1ce";
}


.icon-asterisk:before {
	content:"\f1cf";
}


.icon-ownership:before {
	content:"\f1d0";
}


.icon-milestone:before {
	content:"\f1d1";
}


.icon-task-dependency-start-to-start:before {
	content:"\f1d2";
}


.icon-task-dependency-start-to-end:before {
	content:"\f1d3";
}


.icon-task-dependency-end-to-start:before {
	content:"\f1d4";
}


.icon-task-dependency-end-to-end:before {
	content:"\f1d5";
}


.icon-check:before {
	content:"\f1d6";
}


.icon-drag-indicator:before {
	content:"\f1d7";
}


.icon-resize-indicator:before {
	content:"\f1d8";
}


.icon-entity-role:before {
	content:"\f1d9";
}


.icon-impersonate:before {
	content:"\f1da";
}


.icon-remove-favourite:before {
	content:"\f1db";
}


.icon-star-crossed:before {
	content:"\f1dc";
}


.icon-binoculars:before {
	content:"\f1dd";
}


.icon-sublevel:before {
	content:"\f1de";
}


.icon-automation:before {
	content:"\f1df";
}


.icon-trend-upward:before {
	content:"\f1e0";
}


.icon-trend-downward:before {
	content:"\f1e1";
}


.icon-hardware:before {
	content:"\f1e2";
}


.icon-software:before {
	content:"\f1e3";
}


.icon-effort:before {
	content:"\f1e4";
}


.icon-external:before {
	content:"\f1e5";
}


.icon-internal:before {
	content:"\f1e6";
}


.icon-delta:before {
	content:"\f1e7";
}


.icon-unchanged:before {
	content:"\f1e8";
}


.icon-entity-majorincident:before {
	content:"\f1e9";
}


.icon-entity-securityincident:before {
	content:"\f1ea";
}


.icon-entity-demand:before {
	content:"\f1eb";
}


.icon-map:before {
	content:"\f1ec";
}


.icon-chart-bar:before {
	content:"\f1ed";
}


.icon-chart-line:before {
	content:"\f1ee";
}


.icon-chart-pie:before {
	content:"\f1ef";
}


.icon-chart-gantt:before {
	content:"\f1f0";
}


.icon-ask:before {
	content:"\f1f1";
}

.icon-assetflow-assetcreation:before {
	content: "\f168";
}

.icon-assetflow-assetassignment:before {
	content: "\f14f";
}
:root {
    --scheduler-v2-selected-tab-border-bottom-color: #CCC;
    --scheduler-v2-selected-calendar-day-background-color: #CCC;
    --scheduler-v2-calendar-today-border-color: #CCC;
    --scheduler-v2-scheduler-today-border-color: #CCC;
}

/******************************* WEBIX SCHEDULER **********************/

.event-scheduler-inner-toolbar .webix_item_tab.webix_selected {
    border-bottom-color: var(--scheduler-v2-selected-tab-border-bottom-color);
}

.scheduler_v2 .webix_view.toolbar_navbar_view .webix_all_tabs .webix_item_tab {
    font-size: 14px;
    text-transform: uppercase;
    background-color: transparent;
    letter-spacing: 0.56px;
    padding: 5px;
}

/* Users Calendar list */
.scheduler_v2 .webix_scheduler_cal_list .webix_list_item {
    opacity: 1;
    margin-left: 22px;
}

    .scheduler_v2 .webix_scheduler_cal_list .webix_list_item .webix_icon {
        opacity: 1;
    }

.scheduler_v2 .add_user_calendar {
    text-align: left;
}

    .scheduler_v2 .add_user_calendar .webix_button {
        text-align: left;
        text-decoration: underline;
        font-size: 14px;
        letter-spacing: 0.14px;
        color: #17AAE2;
        text-transform: uppercase;
        opacity: 1;
        background-color: transparent;
    }

        .scheduler_v2 .add_user_calendar .webix_button::before {
            content: "+ ";
        }

/* Calendar */
.scheduler_v2 .webix_cal_month {
    text-transform: capitalize;
}

.scheduler_v2 .webix_cal_today.webix_cal_select.webix_cal_day .webix_cal_day_inner,
.scheduler_v2 .webix_cal_body .webix_cal_select .webix_cal_day_inner, .webix_cal_body .webix_cal_today.webix_cal_select .webix_cal_day_inner {
    background: var(--scheduler-v2-selected-calendar-day-background-color) 0% 0% no-repeat padding-box;
    letter-spacing: 0.44px;
    color: #FFFFFF;
}

.webix_cal_body .webix_cal_today .webix_cal_day_inner {
    box-shadow: inset 0 0 0 1px var(--scheduler-v2-calendar-today-border-color);
}

/* Month View */
.scheduler_v2 .webix_scheduler_month_event {
    text-align: left;
    font-size: 12px;
    letter-spacing: 0px;
    color: #FFFFFF;
    opacity: 1;
}

.scheduler_v2 .webix_scheduler_month_event_single {
    text-align: left;
    font-size: 12px;
    letter-spacing: 0px;
    color: #333333;
    opacity: 1;
}

.scheduler_v2 .webix_event_time {
    text-align: left;
    font-size: 12px;
    letter-spacing: 0px;
    color: #333333;
    opacity: 1;
}


.scheduler_v2 .webix_event_marker_inner {
    width: 9px;
    height: 9px;
    margin-bottom: 2px;
}

.scheduler_v2 .webix_scheduler_calendar .webix_cal_today .webix_cal_date {
    border-color: var(--scheduler-v2-calendar-today-border-color);
    line-height: 20px;
}

/* Day View */
.scheduler_v2 .webix_view.webix_list.webix_scheduler_scale .webix_list_item {
    background-color: #F2F2F2;
    display: flex;
    align-items: flex-start;
    justify-content: center;
}

.scheduler_v2 .webix_view.webix_scheduler_day_header {
    /*text-transform: capitalize;*/
}

/* Week View */

.scheduler_v2 .webix_view.webix_dataview.webix_scheduler_day_header .webix_scheduler_weekday {
    text-align: left;
    letter-spacing: 0px;
    color: #333333;
    opacity: 1;
}

.scheduler_v2 .webix_view.webix_dataview.webix_scheduler_day_header .webix_scheduler_monthday {
    text-align: center;
    letter-spacing: 0px;
    color: #333333;
    opacity: 1;
}

.webix_scheduler_day_header .webix_dataview_item.webix_scheduler_list_today .webix_scheduler_monthday {
    line-height: 20px;
    padding-bottom: 1px;
    border-color: var(--scheduler-v2-scheduler-today-border-color);
}

/*             */
/* Agenda View */
/*             */
.scheduler_v2 .webix_scheduler_agenda .webix_event_overall .start,
.scheduler_v2 .webix_scheduler_agenda .webix_event_overall .end {
    text-align: left;
    font-size: 14px;
    letter-spacing: 0px;
    color: #ACACAC;
    opacity: 1;
}


.scheduler_v2 .webix_view.webix_list.webix_scheduler_agenda .webix_unit_header {
    text-align: left;
    font-size: 14px;
    letter-spacing: 0px;
    color: #333333;
    opacity: 1;
    text-transform: capitalize;
    font-weight: bold;
}

.scheduler_v2 .webix_view.webix_list.webix_scheduler_agenda .webix_scheduler_monthday {
    text-align: center;
    font-size: 14px;
    letter-spacing: 0px;
    color: #333333;
    opacity: 1;
    float: left;
    margin-right: 5px;
}

    .scheduler_v2 .webix_view.webix_list.webix_scheduler_agenda .webix_scheduler_monthday.webix_scheduler_today {
        border-color: #C66200;
        margin-top: -2px;
    }


.scheduler_v2 .webix_view.webix_list.webix_scheduler_agenda .webix_event_time {
    line-height: 18px;
}

.scheduler_v2 .webix_view.webix_list.webix_scheduler_agenda .webix_scheduler_dayofweek {
    text-transform: capitalize;
    text-align: left;
    font-size: 14px;
    letter-spacing: 0px;
    color: #ACACAC;
    opacity: 1;
}

.scheduler_v2 .webix_view.webix_list.webix_scheduler_agenda .webix_event_text {
    text-align: left;
    font-size: 14px;
    letter-spacing: 0px;
    opacity: 1;
    height: 100%;
    line-height: 25px;
}

.scheduler_v2 .webix_view.webix_list.webix_scheduler_agenda .webix_event_marker {
    width: 16px;
    height: 100%;
    padding-top: 2px;
}

    .scheduler_v2 .webix_view.webix_list.webix_scheduler_agenda .webix_event_marker .webix_event_marker_inner {
        height: 16px;
        width: 16px;
        vertical-align: top;
        margin-top: 3px;
    }

.scheduler_v2 .webix_scheduler_agenda .webix_event_first {
    padding-top: 3px;
}

/*  */
/* Event Datails View */
/*  */

/* Etichetta del titolo */
.scheduler_v2 .webix_view.webix_scheduler_info .webix_template .webix_scheduler_event_title {
    text-align: left;
    font-size: 14px;
    font-weight: bold;
    letter-spacing: 0px;
    color: #333333;
    opacity: 1;
    margin-left: 10px;
}

/* Testo del titolo */
.scheduler_v2 .webix_scheduler_info .webix_template .webix_scheduler_event_text {
    text-align: left;
    font-size: 14px;
    letter-spacing: 0px;
    color: #333333;
    opacity: 1;
    margin-left: 10px;
}

/* Titolo delle note */
.scheduler_v2 .webix_scheduler_info .webix_template .webix_scheduler_event_details_title, .webix_scheduler_info .webix_template .webix_scheduler_event_units_title {
    text-align: left;
    font-size: 14px;
    font-weight: bold;
    letter-spacing: 0px;
    color: #333333;
    opacity: 1;
    margin-left: 10px;
}

/* Titolo delle note */
.scheduler_v2 .webix_scheduler_info .webix_template .webix_scheduler_event_text {
    text-align: left;
    font-size: 14px;
    letter-spacing: 0px;
    color: #333333;
    opacity: 1;
    margin-left: 10px;
}






/*  */
/* Popup modifica calendario */
/*  */


.scheduler_v2 div.webix_view.webix_window.webix_scheduler_cal_popup label,
.scheduler_v2div.webix_view.webix_window.webix_scheduler_cal_popup div,
.scheduler_v2div.webix_view.webix_window.webix_scheduler_cal_popup input {
    font-size: 14px;
}

/* Pulsante Annulla */
div.webix_view.webix_window.webix_scheduler_cal_popup > div > div.webix_win_body > div > div > div.webix_view.webix_layout_line > div.webix_view.webix_control.webix_el_button.webix_danger.webix_scheduler_danger > div > button {
    background: #F2F2F2 0% 0% no-repeat padding-box;
    color: #FF6C6C;
    width: 100%;
    margin-left: 0px;
}

/* Pulsante modifica */
div.webix_view.webix_window.webix_scheduler_cal_popup > div > div.webix_win_body > div > div > div.webix_view.webix_layout_line > div.webix_view.webix_control.webix_el_button.webix_primary > div > button {
    background: #17AAE2 0% 0% no-repeat padding-box;
}

div.webix_view.webix_window.webix_scheduler_cal_popup > div > div.webix_win_body > div > div > div.webix_view.webix_control.webix_el_checkbox > div > div > a > button {
    color: #17AAE2;
}

/* Pulsante warning */
.scheduler_v2 .webix_scheduler_warning .webix_button, .webix_scheduler_warning .webix_button {
    text-align: center;
    background: #F2F2F2 0% 0% no-repeat padding-box;
    border: 1px solid #FF9800;
}

    .scheduler_v2 .webix_scheduler_warning .webix_button:hover, .webix_scheduler_warning .webix_button {
        text-align: center;
        background: #FF9800 0% 0% no-repeat padding-box;
        border: 1px solid #FF9800;
    }

div.webix_view.webix_control.webix_el_button.webix_secondary.webix_scheduler_warning > div.webix_el_box > button.webix_button > span.webix_icon_btn.wxi-sync {
    color: #FF9800;
}

div.webix_view.webix_control.webix_el_button.webix_secondary.webix_scheduler_warning > div.webix_el_box > button.webix_button:hover {
    text-decoration-color: #FF9800;
}

div.webix_scheduler_week_days .webix_scheduler_day_event,
div.webix_scheduler_day .webix_scheduler_day_event {
    padding: 8px;
}

    div.webix_scheduler_day .webix_scheduler_day_event .webix_scheduler_inner_day {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
    }

        div.webix_scheduler_day .webix_scheduler_day_event .webix_scheduler_inner_day .webix_scheduler_event_name {
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            flex: 1;
            padding-right: 10px;
        }

        div.webix_scheduler_day .webix_scheduler_day_event .webix_scheduler_inner_day .webix_scheduler_event_time {
            line-height: 20px;
            font-size: 14px;
            margin: 0;
            font-style: italic;
        }

div.scheduler_v2 .webix_view .webix_view.webix_scrollview .webix_view.webix_layout_clean,
div.scheduler_v2 .webix_view .webix_view.webix_scrollview.webix_custom_scroll .webix_view.webix_layout_clean {
    display: flex;
    flex-direction: column;
}

div.scheduler_v2 .webix_layout_clean .webix_view.webix_calendar,
div.scheduler_v2 .webix_view.webix_layout_form {
    height: 100% !important;
    display: flex;
    flex-direction: column;
    min-height: 265px;
}

    div.scheduler_v2 .webix_view.webix_layout_form .webix_scheduler_cal_list {
        height: 100% !important;
        flex: 4;
        margin-top: 0 !important;
    }

div.scheduler_v2 .webix_scheduler_timeline_content {
    text-align: left;
}

div.scheduler_v2 .webix_scheduler .webix_layout_line .webix_toolbar .webix_scroll_cont .webix_el_richselect span {
    height: 22px !important;
}

.webix_scheduler_month_event_single:hover {
    background-color: transparent;
}

div.scheduler_v2 .webix_toolbar .webix_el_richselect .webix_inp_label {
    text-align: right !important;
}

.webix_view.webix_window.webix_popup.webix_sidemenu.webix_sidemenu_left.webix_scheduler_sidemenu .webix_view.webix_list.webix_custom_scroll.webix_scheduler_navlist .webix_list_item {
    display: flex;
    flex-direction: row;
    align-items: center;
}

.webix_view.webix_window.webix_popup.webix_sidemenu.webix_sidemenu_left.webix_scheduler_sidemenu .webix_layout_form .webix_scroll_cont {
    border-top: 0;
}

.webix_event_overall .webix_event_time {
    line-height: normal;
}

.webix_scheduler_sidemenu .webix_win_body .webix_view.webix_scrollview.webix_custom_scroll .webix_view.webix_layout_clean {
    display: flex;
    flex-direction: column;
}

    .webix_scheduler_sidemenu .webix_win_body .webix_view.webix_scrollview.webix_custom_scroll .webix_view.webix_layout_clean .webix_view.webix_list.webix_custom_scroll.webix_scheduler_navlist {
        height: 40% !important;
    }

    .webix_scheduler_sidemenu .webix_win_body .webix_view.webix_scrollview.webix_custom_scroll .webix_view.webix_layout_clean .webix_view.webix_layout_form,
    .webix_scheduler_sidemenu .webix_win_body .webix_view.webix_scrollview.webix_custom_scroll .webix_view.webix_layout_clean .webix_view.webix_layout_form > div.webix_scheduler_cal_list {
        height: 75% !important;
    }

        .webix_scheduler_sidemenu .webix_win_body .webix_view.webix_scrollview.webix_custom_scroll .webix_view.webix_layout_clean .webix_view.webix_layout_form > div.webix_scheduler_cal_list {
            margin-top: 0 !important;
        }

.webix_view.webix_dataview.webix_scheduler_day_header .webix_scroll_cont {
    display: flex;
}

    .webix_view.webix_dataview.webix_scheduler_day_header .webix_scroll_cont div {
        width: 100% !important;
    }

.webix_list_item.webix_scheduler_day_scale_item.hour_disabled {
    background: #e8e8e8;
}

.webix_list_item.webix_scheduler_day_scale_item.hour_half_disabled_top {
    background: linear-gradient(180deg, #e8e8e8 50%, #ffffff 50%)
}

.webix_list_item.webix_scheduler_day_scale_item.hour_half_disabled_bottom {
    background: linear-gradient(0deg, #e8e8e8 50%, #ffffff 50%)
}
