/* Grid */
.grid-mvc:focus { outline:none; }
.grid-table-wrap { overflow:auto; }
.grid-table-head { overflow:hidden; }
.grid-table-body { overflow:auto; }
.grid-error { color:red; }
table.grid-table { margin: 0; }
    table.grid-table .grid-wrap { padding: 0; position: relative; }
    table.grid-table .grid-empty-text { color: #666; }

    /* Grid headers */
    table.grid-table .grid-header { position: relative; vertical-align: top; }
        table.grid-table .grid-header .sorted-asc .grid-sort-arrow::after { content: " \2191"; }
        table.grid-table .grid-header .sorted-desc .grid-sort-arrow::after { content: " \2193"; }
        table.grid-table .grid-header > .grid-header-group { display:flex; }
        table.grid-table .grid-header > .grid-header-group > .grid-header-title { width: 100%; margin-right: 15px; white-space: nowrap; }
        div[dir="rtl"] table.grid-table .grid-header > .grid-header-group > .grid-header-title { margin-left: 15px; margin-right: 0;}
        table.grid-table .grid-header > .grid-header-group > .grid-header-title > button { font-weight: bold; color: #007bff; background-color: white; border: none }
        table.grid-table .grid-header > .grid-header-group > .grid-header-title > button:hover { color: #0056b3; text-decoration: underline }
        table.grid-table .grid-header > .grid-header-group > .grid-header-title > button:focus { outline: 0; }

    /* Grid header drag over  */
    table.grid-table .grid-header.grid-header-drag-over { border: 1px solid lightblue; border-radius: 16px; }
    table.grid-table .grid-header.grid-header-drag-over * { pointer-events: none; }
    table.grid-table .grid-header > .grid-header-group .grid-column-rearrange-insert-placeholder { margin-left: -12px; }

    /* Grid body */
    table.grid-table tr.grid-row-selected td { background: #4888C2 !important; color: white; }
    table.grid-table tr.grid-row-selected a { color: white; }
    table.striped > tbody > tr.grid-row:nth-of-type(odd) { background-color: #f9f9f9; }
    table.substriped > tbody > tr.grid-row:nth-of-type(4n + 1) { background-color: #f9f9f9; }

    /* Grid totals */
    table.grid-table tr.grid-totals-row td { border-color: #aaa; background: #eee !important;}

/* Grid filtering */
input.grid-filter-input { padding: 4px; /*font-size: 13px;*/ }
table.grid-table .grid-filter { position: relative; margin-top: 2px; margin-bottom: 10px; float: right; width: 10px; }
table.grid-table .grid-filter-btn { cursor: pointer; display: block; width: 10px; height: 12px; background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAMCAYAAABbayygAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAadEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjEwMPRyoQAAAJFJREFUKFNjkJSU/E8MZvj//78DMRhkoj+6bizYH2SiiIeHx2FjY+P/2DBIDqSGAQSOHTtmYWZm9hldEUgMJAdWBAJAHSzt7e056ApBYiA5qDIIAAoIhIaGroYpArFBYlBpVLB3715DmEIQGyqMCUDWwBRiWIkOYAqhXNwApMjX13c7lIsbgBQBrdWAcqGAgQEAdOGTrvsYKXIAAAAASUVORK5CYII=') no-repeat; }
    table.grid-table .grid-filter-btn.filtered { background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAMCAYAAABbayygAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAadEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjEwMPRyoQAAAJNJREFUKFNjYGj//58o/P//fwdiMIOkpKQ/VhOQMFgNULWIh4fHYWNj4//YMEgOpIYBBI4dO2ZhZmb2GV0RSAwkB1YEAkAdLO3t7TnoCkFiIDmoMggACgiEhoauhikCsUFiUGlUsHfvXkOYQhAbKowJQNbAFGJYiQ5gCqFc3ACkyNfXdzuUixuAFAGt1YByoYCBAQAUDanUpFB4UQAAAABJRU5ErkJggg==') no-repeat; }
table.grid-table .grid-filter-buttons { padding: 0; }
    table.grid-table .grid-filter-buttons button { margin-right: 5px; }
    div[dir="rtl"] table.grid-table .grid-filter-buttons button { margin-right: 0; margin-left: 5px;}
    table.grid-table .grid-filter-buttons button:last-child { margin-right: 0; }
    div[dir="rtl"] table.grid-table .grid-filter-buttons button:last-child { margin-left: 0; }
table.grid-table .grid-filter-datepicker { /*font-size: 12px;*/ }
    table.grid-table .grid-filter-datepicker table td { padding: 1px!important; }
    table.grid-table .grid-filter-datepicker .ui-datepicker { width: auto; }
table.grid-table .grid-dropdown-inner ul.menu-list li a.grid-filter-clear { white-space: nowrap; padding-left: 23px; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAMCAYAAABbayygAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAadEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjEwMPRyoQAAARpJREFUKFNjYGj//58o/P//fwdiMIOkpKQ/VhOQMFgNULWIh4fHYWNj4//YMEgOpIYBBI4dO2axOC/396GinP/O+vpwRVbGxl92+vluXm1kuASsEKiD5VB99aG3eTH/HxjL/A/RUPsfrqb6f7e21uutlhbRYEUwAFQskOLmun2+lND/0xxM/7dycXzd6OxoCpVGBduWLjXv4+f/v5WF+f9RbtYvfeysqlApBKhhY2Hcxsy0+xAL038nbe3/m8W4ss/Jcx2GSiPAal6uvGtczP9TFOXBHgGJ7RHlmLGOjy0UrAAGzgT7rn7urP/P3NDgv6+v73aQWAMzM+dqTtbJYAUwsNzeyuhImE8GSBHQYxpQYYYJQCcxMDAwAAB7/bt5uWh9FAAAAABJRU5ErkJggg=='); background-position: 3px center; background-repeat: no-repeat; }
div[dir="rtl"] table.grid-table .grid-dropdown-inner ul.menu-list li a.grid-filter-clear { padding-left: 0; padding-right: 23px; background-position:right;}
table.grid-table .grid-filter-choose.choose-selected { background-color: white!important; cursor: default; color: #999; }
table.grid-table .grid-popup-additional { padding: 3px 0 0 0; }

/* Grid header tooltip */
.grid-tooltip { position: relative; margin-top: 0px; }
.grid-tooltip-dropdown { font-weight: normal; left: -102px; top: 16px!important; margin-top: -5px; min-width: 300px; }
div[dir="rtl"] .grid-tooltip-dropdown { left: 0; right: -102px; }

/* POP-UP */
.grid-dropdown { font-weight: normal; left: -102px; top: 16px!important; min-width: 360px; }
div[dir="rtl"] .grid-dropdown { left: -258px; }
.grid-dropdown-arrow { background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAICAYAAADJEc7MAAAABGdBTUEAALGPC/xhBQAAAAlwSFlzAAAOwgAADsIBFShKgAAAABp0RVh0U29mdHdhcmUAUGFpbnQuTkVUIHYzLjUuMTAw9HKhAAAAl0lEQVQoU42PMQuFMAyE6xN5gpOjjsIb/P9/o3O3zh27dY25kIPq8DBwmLT35WoQkUEVOmGec84CaW2q7+N+AdCD6M9SisQYTei1jsfyCeCu+vjFVGs1AN++94DRfUOfuNLoKUiyRC5y2F5I8NdaM4P/l0EswvBorQTnfxBhLMRih+2pklIy+eEtjQPu6MNZwIBNbwteMBd5X4ZGHcwL3QAAAABJRU5ErkJggg==") no-repeat; height: 8px; left: 99px; position: absolute; top: -8px; width: 14px; }
div[dir="rtl"] .grid-dropdown-arrow { left: 255px; }
.grid-dropdown-inner { padding: 5px 7px; }
.grid-dropdown ul.menu-list { list-style-type: none; margin: 3px 0 0 0; padding: 0; }
    .grid-dropdown ul.menu-list li a { text-decoration: none; background-position: 6px center; background-repeat: no-repeat; display: flex; padding: 4px 5px; }
        .grid-dropdown ul.menu-list li a:hover { background-color: #EEE; text-decoration: none; }
.grid-dropdown input.grid-filter-input { width: 100%; }
.grid-dropdown select.grid-filter-type { width: 100%; }
.grid-dropdown input.grid-filter-list { margin: 5px 10px 5px 20px; }
div[dir="rtl"] .grid-dropdown input.grid-filter-list { margin: 5px 20px 5px 10px; }

/*Grid footer*/
.grid-footer { display: inline-flex; width: 100%; margin-top: 10px; justify-content: space-between; }
.grid-itemscount { display: inline-flex; margin-top: 6px; }
.grid-itemscount-label, .grid-itemscount-caption  { margin-left: 5px; margin-right: 5px; }
.grid-pager-sizer { display: inline-flex; }
.grid-pager ul { padding: 0; }
.page-link:focus { box-shadow: none; }
.page-item:first-child .page-link { border-radius: 4px 0 0 4px; }
div[dir="rtl"] .page-item:first-child .page-link { border-radius: 0 4px 4px 0; }
.page-item:last-child .page-link { border-radius: 0 4px 4px 0; }
div[dir="rtl"] .page-item:last-child .page-link { border-radius: 4px 0 0 4px; }

/* Style the caret/arrow */
.subgrid-caret { cursor: pointer; user-select: none; }
.subgrid-caret::after { content: "\25B7"; }
div[dir="rtl"] .subgrid-caret::after { content: "\25C1"; }

/* Rotate the caret/arrow icon when clicked on (using JavaScript) */
.subgrid-caret-down { cursor: pointer; user-select: none; }
.subgrid-caret-down::after { content: "\25E2"; }
div[dir="rtl"] .subgrid-caret-down::after { content: "\25E3"; }

/* Grid buttons */
.grid-button { background-color: #333; }
.grid-button:hover { border-color: #666; }
.grid-buttons { display:inline-flex; width:100%; justify-content:space-between; }

/* Grid header buttons */
.grid-header-buttons { display:inline-flex; }

/* Grid search */
.grid-search { margin-top: 10px; margin-bottom: 10px; }
button.grid-button { height: 34px; color: #333; border: 1px solid #aaa; border-radius: 4px; }
button.grid-search-apply { padding-left: 20px; border-radius: 4px 0 0 4px; background-repeat: no-repeat, no-repeat; background-position-x: 8px, 0px; background-position-y: 8px, 0px; background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 8 8"><path d="M3.5 0c-1.93 0-3.5 1.57-3.5 3.5s1.57 3.5 3.5 3.5c.59 0 1.17-.14 1.66-.41a1 1 0 0 0 .13.13l1 1a1.02 1.02 0 1 0 1.44-1.44l-1-1a1 1 0 0 0-.16-.13c.27-.49.44-1.06.44-1.66 0-1.93-1.57-3.5-3.5-3.5zm0 1c1.39 0 2.5 1.11 2.5 2.5 0 .66-.24 1.27-.66 1.72-.01.01-.02.02-.03.03a1 1 0 0 0-.13.13c-.44.4-1.04.63-1.69.63-1.39 0-2.5-1.11-2.5-2.5s1.11-2.5 2.5-2.5z"/></svg>'), linear-gradient(#ddd, #eee); }
div[dir="rtl"] button.grid-search-apply { border-radius: 0 4px 4px 0;}
button.grid-search-clear { padding-left: 22px; border-radius: 0 4px 4px 0; background-repeat: no-repeat, no-repeat; background-position-x: 8px, 0px; background-position-y: 8px, 0px; background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 8 8"><path d="M1.41 0l-1.41 1.41.72.72 1.78 1.81-1.78 1.78-.72.69 1.41 1.44.72-.72 1.81-1.81 1.78 1.81.69.72 1.44-1.44-.72-.69-1.81-1.78 1.81-1.81.72-.72-1.44-1.41-.69.72-1.78 1.78-1.81-1.78-.72-.72z" /></svg>'), linear-gradient(#ddd, #eee); }
div[dir="rtl"] button.grid-search-clear { border-radius: 4px 0 0 4px;}
input.grid-search-input {height: 34px; border-color: #ccc; }

/* Grid change page size */
.grid-change-page-size, .grid-goto-page { display:inline-flex; margin: 0px 20px; }
.grid-change-page-size { width: 250px; }
.grid-goto-page { width: 180px; }
.grid-change-page-size label, .grid-goto-page label { margin: 6px 10px; }
.grid-change-page-size-input, .grid-goto-page-input { display:inline; width: 60px; margin-left:5px;  margin-right:5px; }

/* Grid extended sorting */
.grid-extsort-droppable { height: 42px; width: 100%; margin-bottom:10px; border: 1px solid #ccc; border-radius: 4px; }
.grid-extsort-column { height: 28px; display: inline-block; margin: 6px 0px 6px 20px; padding: 5px; background-color:#efefef; border: 1px solid #ccc; border-radius: 4px; }
div[dir="rtl"] .grid-extsort-column { margin: 6px 20px 6px 0px; }
    .grid-extsort-column .sorted-asc .grid-sort-arrow::after { content: " \2191"; }
    .grid-extsort-column .sorted-desc .grid-sort-arrow::after { content: " \2193"; }
    .grid-extsort-column a { font-weight:700; }
    .grid-extsort-column > a { margin-left:10px; margin-right:5px; }
    div[dir="rtl"] .grid-extsort-column > a { margin-left:5px; margin-right:10px; }
    .grid-extsort-column button { border: none; padding: 0; font-size: 14px; font-weight:700; }
    .grid-extsort-column > button { margin-left:10px; margin-right:5px; }
    div[dir="rtl"] .grid-extsort-column > button { margin-left:5px; margin-right:10px; }
.grid-extsort-empty { font-size: 14px; height: 20px; margin: 10px; color:#aaa; }

/* Grid grouping */
.grid-group-caret { margin-right: 10px; cursor: pointer; user-select: none; }
div[dir="rtl"] .grid-group-caret { margin-left: 10px; margin-right: 0; }
.grid-group-caret::after { content: "\25B7"; }
.grid-group-caret-down { margin-right: 10px; cursor: pointer; user-select: none; }
div[dir="rtl"] .grid-group-caret-down { margin-left: 10px; margin-right: 0; }
.grid-group-caret-down::after { content: "\25E2"; }

.grid-group-tab { margin-left: 20px; }
div[dir="rtl"] .grid-group-tab { margin-left: 0; margin-right: 20px; }
.grid-group-row { background: #eee; }

/* Grid CRUD */
.grid-crud { margin-top: 10px; margin-bottom: 10px; margin-left: 0px; margin-right: 5px;}
div[dir="rtl"] .grid-crud { margin-left: 5px; margin-right: 0px;}
.grid-crud:first-child { margin-left: 0; }
div[dir="rtl"] .grid-crud:first-child { margin-right: 0; }
button.grid-button-add { width:32px; margin-right: 5px; background-repeat: no-repeat, no-repeat; background-position-x: 7px, 0px; background-position-y: 8px, 0px;  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 8 8"><path d="M3 0v3h-3v2h3v3h2v-3h3v-2h-3v-3h-2z"/></svg>'), linear-gradient(#ddd, #eee); }
div[dir="rtl"] button.grid-button-add { margin-left: 5px; margin-right: 0; }
button.grid-button-view { width:30px; height:30px; margin-right: 5px; background-repeat: no-repeat, no-repeat; background-position-x: 7px, 0px; background-position-y: 7px, 0px; background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 8 8"><path d="M4.03 0c-2.53 0-4.03 3-4.03 3s1.5 3 4.03 3c2.47 0 3.97-3 3.97-3s-1.5-3-3.97-3zm-.03 1c1.11 0 2 .9 2 2 0 1.11-.89 2-2 2-1.1 0-2-.89-2-2 0-1.1.9-2 2-2zm0 1c-.55 0-1 .45-1 1s.45 1 1 1 1-.45 1-1c0-.1-.04-.19-.06-.28-.08.16-.24.28-.44.28-.28 0-.5-.22-.5-.5 0-.2.12-.36.28-.44-.09-.03-.18-.06-.28-.06z" transform="translate(0 1)"/></svg>'), linear-gradient(#ddd, #eee); }
div[dir="rtl"] button.grid-button-view { margin-left: 5px; margin-right: 0; }
button.grid-button-edit { width:30px; height:30px; margin-right: 5px; background-repeat: no-repeat, no-repeat; background-position-x: 7px, 0px; background-position-y: 7px, 0px; background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 8 8"><path d="M6 0l-1 1 2 2 1-1-2-2zm-2 2l-4 4v2h2l4-4-2-2z"/></svg>'), linear-gradient(#ddd, #eee); }
div[dir="rtl"] button.grid-button-edit { margin-left: 5px; margin-right: 0; }
button.grid-button-delete { width:30px; height:30px; margin-right: 5px; background-repeat: no-repeat, no-repeat; background-position-x: 7px, 0px; background-position-y: 7px, 0px; background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 8 8"><path d="M3 0c-.55 0-1 .45-1 1h-1c-.55 0-1 .45-1 1h7c0-.55-.45-1-1-1h-1c0-.55-.45-1-1-1h-1zm-2 3v4.81c0 .11.08.19.19.19h4.63c.11 0 .19-.08.19-.19v-4.81h-1v3.5c0 .28-.22.5-.5.5s-.5-.22-.5-.5v-3.5h-1v3.5c0 .28-.22.5-.5.5s-.5-.22-.5-.5v-3.5h-1z"/></svg>'), linear-gradient(#ddd, #eee); }
div[dir="rtl"] button.grid-button-delete { margin-left: 5px; margin-right: 0; }
button.grid-button-header-view { width:34px; height:34px; margin-right: 5px; background-repeat: no-repeat, no-repeat; background-position-x: 8px, 0px; background-position-y: 8px, 0px; background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 8 8"><path d="M4.03 0c-2.53 0-4.03 3-4.03 3s1.5 3 4.03 3c2.47 0 3.97-3 3.97-3s-1.5-3-3.97-3zm-.03 1c1.11 0 2 .9 2 2 0 1.11-.89 2-2 2-1.1 0-2-.89-2-2 0-1.1.9-2 2-2zm0 1c-.55 0-1 .45-1 1s.45 1 1 1 1-.45 1-1c0-.1-.04-.19-.06-.28-.08.16-.24.28-.44.28-.28 0-.5-.22-.5-.5 0-.2.12-.36.28-.44-.09-.03-.18-.06-.28-.06z" transform="translate(0 1)"/></svg>'), linear-gradient(#ddd, #eee); }
div[dir="rtl"] button.grid-button-header-view { margin-left: 5px; margin-right: 0; }
button.grid-button-header-edit { width:34px; height:34px; margin-right: 5px; background-repeat: no-repeat, no-repeat; background-position-x: 8px, 0px; background-position-y: 8px, 0px; background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 8 8"><path d="M6 0l-1 1 2 2 1-1-2-2zm-2 2l-4 4v2h2l4-4-2-2z"/></svg>'), linear-gradient(#ddd, #eee); }
div[dir="rtl"] button.grid-button-header-edit { margin-left: 5px; margin-right: 0; }
button.grid-button-header-delete { width:34px; height:34px; margin-right: 5px; background-repeat: no-repeat, no-repeat; background-position-x: 9px, 0px; background-position-y: 8px, 0px; background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 8 8"><path d="M3 0c-.55 0-1 .45-1 1h-1c-.55 0-1 .45-1 1h7c0-.55-.45-1-1-1h-1c0-.55-.45-1-1-1h-1zm-2 3v4.81c0 .11.08.19.19.19h4.63c.11 0 .19-.08.19-.19v-4.81h-1v3.5c0 .28-.22.5-.5.5s-.5-.22-.5-.5v-3.5h-1v3.5c0 .28-.22.5-.5.5s-.5-.22-.5-.5v-3.5h-1z"/></svg>'), linear-gradient(#ddd, #eee); }
div[dir="rtl"] button.grid-button-header-delete { margin-left: 5px; margin-right: 0; }
button.grid-button-label-add {  height:34px;margin-right: 5px; }
div[dir="rtl"] button.grid-button-label-add { margin-left: 5px; margin-right: 0; }
button.grid-button-label-view { height:30px; margin-right: 5px; }
div[dir="rtl"] button.grid-button-label-view { margin-left: 5px; margin-right: 0; }
button.grid-button-label-edit { height:30px; margin-right: 5px; }
div[dir="rtl"] button.grid-button-label-edit { margin-left: 5px; margin-right: 0; }
button.grid-button-label-delete { height:30px; margin-right: 5px; }
div[dir="rtl"] button.grid-button-label-delete { margin-left: 5px; margin-right: 0; }
button.grid-button-header-label-view { height:34px; margin-right: 5px; }
div[dir="rtl"] button.grid-button-header-label-view { margin-left: 5px; margin-right: 0; }
button.grid-button-header-label-edit { height:34px; margin-right: 5px; }
div[dir="rtl"] button.grid-button-header-label-edit { margin-left: 5px; margin-right: 0; }
button.grid-button-header-label-delete { height:34px; margin-right: 5px; }
div[dir="rtl"] button.grid-button-header-label-delete { margin-left: 5px; margin-right: 0; }
td.grid-button-cell { padding: 5px 0px 5px 0px; width: 34px; }
.input-validation-error { border: 1px solid red; }
.field-validation-error { color: red; }
button.grid-button-input-file { border-radius: 0 4px 4px 0; background-image: linear-gradient(#ddd, #eee); font-weight:bold; }
div[dir="rtl"] button.grid-button-input-file { border-radius: 4px 0 0 4px; }
.grid-crud-header { font-size: 2rem; margin: 1rem 0 1rem 0; }

/* Grid Clear Filters */
.grid-all-filters-clear { margin-top: 10px; margin-bottom: 10px; margin-left: 15px; margin-right: 5px; }
.grid-all-filters-clear:first-child { margin-left: 0;}
div[dir="rtl"] .grid-all-filters-clear:first-child { margin-right: 0;}
button.grid-button-all-filters-clear { width:32px; margin-right: 5px; background-repeat: no-repeat, no-repeat; background-position-x: 10px, 0px; background-position-y: 10px, 0px; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAMCAYAAABbayygAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAadEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjEwMPRyoQAAARpJREFUKFNjYGj//58o/P//fwdiMIOkpKQ/VhOQMFgNULWIh4fHYWNj4//YMEgOpIYBBI4dO2axOC/396GinP/O+vpwRVbGxl92+vluXm1kuASsEKiD5VB99aG3eTH/HxjL/A/RUPsfrqb6f7e21uutlhbRYEUwAFQskOLmun2+lND/0xxM/7dycXzd6OxoCpVGBduWLjXv4+f/v5WF+f9RbtYvfeysqlApBKhhY2Hcxsy0+xAL038nbe3/m8W4ss/Jcx2GSiPAal6uvGtczP9TFOXBHgGJ7RHlmLGOjy0UrAAGzgT7rn7urP/P3NDgv6+v73aQWAMzM+dqTtbJYAUwsNzeyuhImE8GSBHQYxpQYYYJQCcxMDAwAAB7/bt5uWh9FAAAAABJRU5ErkJggg=='), linear-gradient(#ddd, #eee); }
div[dir="rtl"] button.grid-button-all-filters-clear { margin-left: 5px; margin-right: 0; }

/* Grid List Filter */
.grid-dropdown-list-filter-class > .grid-popup-widget > .grid-filter-body > .menu-list { max-height: 250px; overflow: auto; }
.grid-dropdown-list-filter-class > .grid-popup-widget > .grid-filter-body > .grid-buttons { margin-top: 8px; margin-left: 8px; }
.grid-dropdown-list-filter-class > .grid-popup-widget > .grid-filter-body .list-filter-label { width: 320px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* Grid Excel export */
.grid-excel { margin-top: 10px; margin-bottom: 10px; margin-left: 15px; margin-right: 5px; }
.grid-excel:first-child { margin-left: 0;}
div[dir="rtl"] .grid-excel:first-child { margin-right: 0;}
button.grid-button-excel { width:32px; margin-right: 5px; background-repeat: no-repeat, no-repeat; background-position-x: 7px, 0px; background-position-y: 8px, 0px;  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 8 8"><path d="M3 0v3h-2l3 3 3-3h-2v-3h-2zm-3 7v1h8v-1h-8z"/></svg>'), linear-gradient(#ddd, #eee); }
div[dir="rtl"] button.grid-button-excel { margin-left: 5px; margin-right: 0; }

/* Grid Button Components */
.grid-button-components { margin-top: 10px; margin-bottom: 10px; margin-left: 0px; margin-right: 5px; }
div[dir="rtl"] .grid-button-components { margin-left: 5px; margin-right: 0px; }
.grid-button-components:first-child { margin-left: 0; }
div[dir="rtl"] .grid-button-components:first-child { margin-right: 0; }
button.grid-button-component { min-width: 32px; margin-right: 5px;     background: -o-linear-gradient(top, #ddd 0%, #eee 100%); background: -moz-linear-gradient(top, #ddd 0%, #eee 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0,#ddd), color-stop(1, #eee)); }
div[dir="rtl"] button.grid-button-component { margin-left: 5px; margin-right: 0; }

/* Grid checkbox header */
.grid-header-checkbox-input { opacity: 0; }
    .grid-header-checkbox-input ~ .null-checkbox::before { position: absolute; top: 1rem; display: block; width: .9rem; height: .9rem; pointer-events: none; content: ""; border: 0.5px solid #666; border-radius: 3px; background-color: #ccc; }

div[dir="rtl"] label { display: flex; }

/* The switch - the box around the slider */
.grid-switch { position: relative; display: inline-block; width: 50px; height: 24px; margin-left: 16px; margin-right: 16px; margin-bottom: -8px; }

    /* Hide default HTML checkbox */
    .grid-switch input { display: none; }

/* The slider */
.grid-slider { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: #ccc; -webkit-transition: .4s; transition: .4s; }

    .grid-slider:before { position: absolute; content: ""; height: 16px; width: 16px; left: 4px; bottom: 4px; background-color: white; -webkit-transition: .4s; transition: .4s; }

input:checked + .grid-slider { background-color: #ccc; }

input:focus + .grid-slider { box-shadow: 0 0 1px #ccc; }

input:checked + .grid-slider:before { -webkit-transform: translateX(26px); -ms-transform: translateX(26px); transform: translateX(26px); }

/* Rounded sliders */
.grid-slider.round { border-radius: 24px; }

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

/* Spinner */
.grid-spinner { margin: 170px auto; border: 6px solid #f3f3f3; border-top: 6px solid #455a64; border-radius: 50%; width: 60px; height: 60px; animation: spin 2s linear infinite; }
@keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }
@-webkit-keyframes spin { 0% { -webkit-transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); } }
@-moz-keyframes spin { from { -moz-transform: rotate(0deg); } to { -moz-transform: rotate(360deg); } }