/* ----- ../../Common/Resources/CSS/Reset.css ----- */
#content article.full .body .cbreplay {
    all: initial;
}

#content article.full .body table td, #content article.full .body table tr {
    font-family: Roboto;
    font-size: initial;
    vertical-align: middle;
    border: 0;
    text-align: unset;
    padding: 5px;
    font-weight: unset;
    color: #000000;
    line-height: 1;
    margin: 0;
}

#content article.full .body nota-head-container {
    all: initial;
}

#content article.full .body nota-head-container tr:nth-child(even) {
    background-color: initial;
}


/* ----- ../../Common/Libs/jsgrid/jsgrid-theme.min.css ----- */
/*
 * jsGrid v1.5.2 (http://js-grid.com)
 * (c) 2016 Artem Tabalin
 * Licensed under MIT (https://github.com/tabalinas/jsgrid/blob/master/LICENSE)
 */

.jsgrid-edit-row > .jsgrid-cell, .jsgrid-filter-row > .jsgrid-cell, .jsgrid-grid-body, .jsgrid-grid-header, .jsgrid-header-row > .jsgrid-header-cell, .jsgrid-insert-row > .jsgrid-cell {
    border: 1px solid #e9e9e9
}

.jsgrid-header-row > .jsgrid-header-cell {
    border-top: 0
}

.jsgrid-filter-row > .jsgrid-cell, .jsgrid-header-row > .jsgrid-header-cell, .jsgrid-insert-row > .jsgrid-cell {
    border-bottom: 0
}

.jsgrid-filter-row > .jsgrid-cell:first-child, .jsgrid-header-row > .jsgrid-header-cell:first-child, .jsgrid-insert-row > .jsgrid-cell:first-child {
    border-left: none
}

.jsgrid-filter-row > .jsgrid-cell:last-child, .jsgrid-header-row > .jsgrid-header-cell:last-child, .jsgrid-insert-row > .jsgrid-cell:last-child {
    border-right: none
}

.jsgrid-header-row .jsgrid-align-left, .jsgrid-header-row .jsgrid-align-right {
    text-align: center
}

.jsgrid-grid-header {
    background: #f9f9f9
}

.jsgrid-header-scrollbar {
    scrollbar-arrow-color: #f1f1f1;
    scrollbar-base-color: #f1f1f1;
    scrollbar-3dlight-color: #f1f1f1;
    scrollbar-highlight-color: #f1f1f1;
    scrollbar-track-color: #f1f1f1;
    scrollbar-shadow-color: #f1f1f1;
    scrollbar-dark-shadow-color: #f1f1f1
}

.jsgrid-header-scrollbar::-webkit-scrollbar {
    visibility: hidden
}

.jsgrid-header-scrollbar::-webkit-scrollbar-track {
    background: #f1f1f1
}

.jsgrid-header-sortable:hover {
    cursor: pointer;
    background: #fcfcfc
}

.jsgrid-header-row .jsgrid-header-sort {
    background: #c4e2ff
}

.jsgrid-header-sort:before {
    content: " ";
    display: block;
    float: left;
    width: 0;
    height: 0;
    border-style: solid
}

.jsgrid-header-sort-asc:before {
    border-width: 0 5px 5px;
    border-color: transparent transparent #009a67
}

.jsgrid-header-sort-desc:before {
    border-width: 5px 5px 0;
    border-color: #009a67 transparent transparent
}

.jsgrid-grid-body {
    border-top: none
}

.jsgrid-cell {
    border: 1px solid #f3f3f3
}

.jsgrid-grid-body .jsgrid-alt-row:first-child .jsgrid-cell, .jsgrid-grid-body .jsgrid-row:first-child .jsgrid-cell {
    border-top: none
}

.jsgrid-grid-body .jsgrid-cell:first-child {
    border-left: none
}

.jsgrid-grid-body .jsgrid-cell:last-child {
    border-right: none
}

.jsgrid-row > .jsgrid-cell {
    background: #fff
}

.jsgrid-alt-row > .jsgrid-cell {
    background: #fcfcfc
}

.jsgrid-header-row > .jsgrid-header-cell {
    background: #f9f9f9
}

.jsgrid-filter-row > .jsgrid-cell {
    background: #fcfcfc
}

.jsgrid-insert-row > .jsgrid-cell {
    background: #e3ffe5
}

.jsgrid-edit-row > .jsgrid-cell {
    background: #fdffe3
}

.jsgrid-selected-row > .jsgrid-cell {
    background: #c4e2ff;
    border-color: #c4e2ff
}

.jsgrid-nodata-row > .jsgrid-cell {
    background: #fff
}

.jsgrid-invalid input, .jsgrid-invalid select, .jsgrid-invalid textarea {
    background: #ffe3e5;
    border: 1px solid #ff808a
}

.jsgrid-pager-current-page {
    font-weight: 700
}

.jsgrid-pager-nav-inactive-button a {
    color: #d3d3d3
}

.jsgrid-button + .jsgrid-button {
    margin-left: 5px
}

.jsgrid-button:hover {
    opacity: .5;
    transition: opacity 200ms linear
}

.jsgrid .jsgrid-button {
    width: 16px;
    height: 16px;
    border: none;
    cursor: pointer;
    background-image: url(data:image/png;base64,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);
    background-repeat: no-repeat;
    background-color: transparent
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2) {
    .jsgrid .jsgrid-button {
        background-image: url(data:image/png;base64,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);
        background-size: 24px 352px
    }
}

.jsgrid .jsgrid-mode-button {
    width: 24px;
    height: 24px
}

.jsgrid-mode-on-button {
    opacity: .5
}

.jsgrid-cancel-edit-button {
    background-position: 0 0;
    width: 16px;
    height: 16px
}

.jsgrid-clear-filter-button {
    background-position: 0 -40px;
    width: 16px;
    height: 16px
}

.jsgrid-delete-button {
    background-position: 0 -80px;
    width: 16px;
    height: 16px
}

.jsgrid-edit-button {
    background-position: 0 -120px;
    width: 16px;
    height: 16px
}

.jsgrid-insert-mode-button {
    background-position: 0 -160px;
    width: 24px;
    height: 24px
}

.jsgrid-insert-button {
    background-position: 0 -208px;
    width: 16px;
    height: 16px
}

.jsgrid-search-mode-button {
    background-position: 0 -248px;
    width: 24px;
    height: 24px
}

.jsgrid-search-button {
    background-position: 0 -296px;
    width: 16px;
    height: 16px
}

.jsgrid-update-button {
    background-position: 0 -336px;
    width: 16px;
    height: 16px
}

.jsgrid-load-shader {
    background: #ddd;
    opacity: .5;
    filter: alpha(opacity=50)
}

.jsgrid-load-panel {
    width: 15em;
    height: 5em;
    background: #fff;
    border: 1px solid #e9e9e9;
    padding-top: 3em;
    text-align: center
}

.jsgrid-load-panel:before {
    content: ' ';
    position: absolute;
    top: .5em;
    left: 50%;
    margin-left: -1em;
    width: 2em;
    height: 2em;
    border: 2px solid #009a67;
    border-right-color: transparent;
    border-radius: 50%;
    -webkit-animation: indicator 1s linear infinite;
    animation: indicator 1s linear infinite
}

@-webkit-keyframes indicator {
    from {
        -webkit-transform: rotate(0deg)
    }
    50% {
        -webkit-transform: rotate(180deg)
    }
    to {
        -webkit-transform: rotate(360deg)
    }
}

@keyframes indicator {
    from {
        transform: rotate(0deg)
    }
    50% {
        transform: rotate(180deg)
    }
    to {
        transform: rotate(360deg)
    }
}


/* ----- ../../Common/Libs/jsgrid/jsgrid.min.css ----- */
/*
 * jsGrid v1.5.2 (http://js-grid.com)
 * (c) 2016 Artem Tabalin
 * Licensed under MIT (https://github.com/tabalinas/jsgrid/blob/master/LICENSE)
 */

.jsgrid {
    position: relative;
    overflow: hidden;
    font-size: 1em
}

.jsgrid, .jsgrid *, .jsgrid :after, .jsgrid :before {
    box-sizing: border-box
}

.jsgrid input, .jsgrid select, .jsgrid textarea {
    font-size: 1em
}

.jsgrid-grid-header {
    overflow-x: hidden;
    overflow-y: scroll;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none
}

.jsgrid-grid-body {
    overflow-x: auto;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch
}

.jsgrid-table {
    width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
    border-spacing: 0
}

.jsgrid-cell {
    padding: .5em
}

.jsgrid-header-cell, .jsgrid-Ñell {
    box-sizing: border-box
}

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

.jsgrid-align-center, .jsgrid-align-center input, .jsgrid-align-center select, .jsgrid-align-center textarea {
    text-align: center
}

.jsgrid-align-right, .jsgrid-align-right input, .jsgrid-align-right select, .jsgrid-align-right textarea {
    text-align: right
}

.jsgrid-header-cell {
    padding: .5em
}

.jsgrid-edit-row input, .jsgrid-edit-row select, .jsgrid-edit-row textarea, .jsgrid-filter-row input, .jsgrid-filter-row select, .jsgrid-filter-row textarea, .jsgrid-insert-row input, .jsgrid-insert-row select, .jsgrid-insert-row textarea {
    width: 100%;
    padding: .3em .5em
}

.jsgrid-edit-row input[type=checkbox], .jsgrid-filter-row input[type=checkbox], .jsgrid-insert-row input[type=checkbox] {
    width: auto
}

.jsgrid-selected-row .jsgrid-cell {
    cursor: pointer
}

.jsgrid-nodata-row .jsgrid-cell {
    padding: .5em 0;
    text-align: center
}

.jsgrid-header-sort {
    cursor: pointer
}

.jsgrid-pager {
    padding: .5em 0
}

.jsgrid-pager-nav-button {
    padding: .2em .6em
}

.jsgrid-pager-nav-inactive-button {
    display: none;
    pointer-events: none
}

.jsgrid-pager-page {
    padding: .2em .6em
}


/* ----- ../../Common/Libs/jqwidgets/styles/jqx.base.css ----- */
:root {
    --jqx-grid-row-height: 36px;
    --jqx-grid-column-height: 48px;
    --jqx-grid-show-column-lines: 1;
    --jqx-list-item-height: -1;
    --jqx-grid-filter-menu-items-height: 30px;
    --jqx-dropdown-animation: transform;
    --jqx-datetimeinput-dropdown-height: 280px;
    --jqx-datetimeinput-dropdown-width: 280px;
    --jqx-calendar-header-height: 40px;
    --jqx-calendar-title-height: 49px;
    --jqx-icon-calendar: '\e829'; /* Code of calendar icon */
    --jqx-icon-filter: '\f0b0'; /* Code of filter icon */
    --jqx-icon-menu: '\f0c9'; /* Code of menu icon */
    --jqx-icon-check: '\e908'; /* Code of check icon */
    --jqx-icon-first-page: '\e900'; /* Code of first page icon */
    --jqx-icon-arrow-down: '\e901'; /* Code of down arrow icon */
    --jqx-icon-arrow-left: '\e902'; /* Code of left arrow icon */
    --jqx-icon-arrow-right: '\e903'; /* Code of right arrow icon */
    --jqx-icon-arrow-up: '\e904'; /* Code of up arrow icon */
    --jqx-icon-arrow-down-filled: '\e812'; /* Code of filled down arrow icon */
    --jqx-icon-arrow-left-filled: '\e816'; /* Code of filled left arrow icon */
    --jqx-icon-arrow-right-filled: '\e81e'; /* Code of filled right arrow icon */
    --jqx-icon-arrow-up-filled: '\e815'; /* Code of filled up arrow icon */
    --jqx-icon-visibility: '\e90d'; /* Code of visibility icon */
    --jqx-icon-visibility-off: '\e90e'; /* Code of visibility off icon */
    --jqx-icon-last-page: '\e905'; /* Code of last page icon */
    --jqx-icon-close: '\e80d'; /* Code of close icon */
    --jqx-icon-search: '\e828'; /* Code of search icon */
    --jqx-border-radius: 4px;
    --jqx-font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif;
    --jqx-font-size: 14px;
    --jqx-action-button-size: 25px;
}

/*Rounded Corners*/
/*top-left rounded Corners*/
.jqx-rc-tl {
    -moz-border-radius-topleft: 3px;
    -webkit-border-top-left-radius: 3px;
    border-top-left-radius: 3px;
}

/*top-right rounded Corners*/
.jqx-rc-tr {
    -moz-border-radius-topright: 3px;
    -webkit-border-top-right-radius: 3px;
    border-top-right-radius: 3px;
}

/*bottom-left rounded Corners*/
.jqx-rc-bl {
    -moz-border-radius-bottomleft: 3px;
    -webkit-border-bottom-left-radius: 3px;
    border-bottom-left-radius: 3px;
}

/*bottom-right rounded Corners*/
.jqx-rc-br {
    -moz-border-radius-bottomright: 3px;
    -webkit-border-bottom-right-radius: 3px;
    border-bottom-right-radius: 3px;
}

/*top rounded Corners*/
.jqx-rc-t {
    -moz-border-radius-topleft: 3px;
    -webkit-border-top-left-radius: 3px;
    border-top-left-radius: 3px;
    -moz-border-radius-topright: 3px;
    -webkit-border-top-right-radius: 3px;
    border-top-right-radius: 3px;
}

/*bottom rounded Corners*/
.jqx-rc-b {
    -moz-border-radius-bottomleft: 3px;
    -webkit-border-bottom-left-radius: 3px;
    border-bottom-left-radius: 3px;
    -moz-border-radius-bottomright: 3px;
    -webkit-border-bottom-right-radius: 3px;
    border-bottom-right-radius: 3px;
}

/*right rounded Corners*/
.jqx-rc-r {
    -moz-border-radius-topright: 3px;
    -webkit-border-top-right-radius: 3px;
    border-top-right-radius: 3px;
    -moz-border-radius-bottomright: 3px;
    -webkit-border-bottom-right-radius: 3px;
    border-bottom-right-radius: 3px;
}

/*left rounded Corners*/
.jqx-rc-l {
    -moz-border-radius-topleft: 3px;
    -webkit-border-top-left-radius: 3px;
    border-top-left-radius: 3px;
    -moz-border-radius-bottomleft: 3px;
    -webkit-border-bottom-left-radius: 3px;
    border-bottom-left-radius: 3px;
}

/*all rounded Corners*/
.jqx-rc-all {
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
}

/*reset rounded corners*/
.jqx-rc-reset {
    -moz-border-radius: 0px !important;
    -webkit-border-radius: 0px !important;
    border-radius: 0px !important;
}

/*Reset Style*/
.jqx-reset {
    padding: 0;
    margin: 0;
    border: none;
    background: transparent;
    outline: none;
    box-sizing: content-box;
}

.jqx-clear {
    align: left;
    valign: top;
    left: 0px;
    top: 0px;
    -webkit-appearance: none !important;
    outline: none !important;
    padding: 0px;
    margin: 0px;
}

.jqx-popup {
    box-sizing: content-box;
}

.jqx-position-reset {
    position: static !important;
}

.jqx-border-reset {
    border: none !important;
}

.jqx-overflow-hidden {
    overflow: hidden !important;
}

.jqx-position-relative {
    position: relative !important;
}

.jqx-position-absolute {
    position: absolute !important;
}

.jqx-max-size {
    width: 100% !important;
    height: 100% !important;
}

.jqx-background-reset {
    background: transparent !important;
}

/*Disable browser selection*/
.jqx-disableselect {
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    -ms-user-select: none;
    -webkit-touch-callout: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.jqx-enableselect {
    -webkit-user-select: text;
    -moz-user-select: text;
    -ms-user-select: text;
    user-select: all;
}

.jqx-hideborder {
    border: none !important;
}

.jqx-hidescrollbars {
    overflow: hidden !important;
}

/*jqxButton, jqxToggleButton, jqxRepeatButton Style*/
.jqx-button {
    outline: none;
    border: 1px solid transparent;
    padding: 5px;
    text-align: center;
    vertical-align: central;
    margin: 0 0 0 0;
    cursor: default;
}

.jqx-button[aria-disabled="true"] {
    pointer-events: none;
}

button.jqx-button, input[type=button].jqx-button, input[type=submit].jqx-button {
    box-sizing: border-box !important;
    -moz-box-sizing: border-box !important;
}

.jqx-buttongroup {
}

.jqx-group-button-normal {
    vertical-align: middle;
    text-align: center;
}

/*applied to the link button's anchor element.*/
.jqx-link {
    text-decoration: none;
    color: #111111;
}

/*shows elements.*/
.jqx-visible {
    display: block;
}

/*hides elements.*/
.jqx-hidden {
    display: none;
}

.jqx-widget, .jqx-widget-content, .jqx-widget-header, .jqx-fill-state-normal {
    line-height: 1.231;
}

/*jqxGauge Style*/
.jqx-gauge-label, .jqx-gauge-caption {
    fill: #333333;
    color: #333333;
    font-size: 11px;
    font-family: Verdana;
}

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

/*jqxChart Style*/
.jqx-knob-label,
.jqx-chart-axis-text,
.jqx-chart-label-text,
.jqx-chart-tooltip-text,
.jqx-chart-legend-text {
    fill: #333333;
    color: #333333;
    font-size: 11px;
    font-family: Verdana;
}

.jqx-chart-axis-description {
    fill: #555555;
    color: #555555;
    font-size: 11px;
    font-family: Verdana;
}

.jqx-chart-title-text {
    fill: #111111;
    color: #111111;
    font-size: 14px;
    font-weight: bold;
    font-family: Verdana;
}

.jqx-chart-title-description {
    fill: #111111;
    color: #111111;
    font-size: 12px;
    font-weight: normal;
    font-family: Verdana;
}

/*applied to the Grid's element.*/
.jqx-grid {
    overflow: hidden;
    border-style: solid;
    border-width: 1px;
}

.jqx-grid .jqx-adaptive-table {
    border-collapse: collapse;
    border: none;
    width: 100%;
}

.jqx-grid .jqx-adaptive-table td, .jqx-grid .jqx-adaptive-table th {
    border-bottom: 1px solid #ddd;
    padding: 8px;
    overflow: auto;
}

.jqx-grid .jqx-adaptive-table tr:nth-child(even) {
    background-color: #f2f2f2;
}

.jqx-grid .jqx-adaptive-table th {
    padding-top: 12px;
    padding-bottom: 12px;
    text-align: left;
    background-color: #4CAF50;
    color: white;
}

.jqx-grid .jqx-adaptive-view a {
    padding: 10px;
    text-decoration: none;
    color: orangered;
}

/*applied to the Pager.*/
.jqx-grid-pager {
    border: none;
    border-top: 1px solid transparent;
}

/*applied to the Top Pager.*/
.jqx-grid-pager-top {
    border: none;
    border-bottom: 1px solid transparent;
}

.jqx-grid-pager-number {
    padding: 2px 5px;
    text-decoration: none;
    margin: 1px;
    border: 1px solid transparent;
    color: inherit !important;
    outline: none;
    font-weight: normal !important;
    line-height: 14px;
}

.jqx-grid-menu-item-touch {
    padding-top: 6px !important;
    padding-bottom: 6px !important;
}

/*applied to the Grid's bottom-right area between the horizontal and vertical scrollbars.*/
.jqx-grid-bottomright {
}

/*applied to the Grid's header area.*/
.jqx-grid-header {
    border-style: solid;
    border-width: 0px 0px 1px 0px;
    overflow: hidden;
    border-color: transparent;
    margin: 0px;
    padding: 0px;
}

/*applied to the columns.*/
.jqx-grid-column-header, .jqx-grid-columngroup-header {
    border-style: solid;
    border-width: 0px 1px 0px 0px;
    border-color: transparent;
    white-space: nowrap;
    border-style: solid;
    font-weight: normal;
    overflow: hidden;
    text-align: left;
    padding: 0px;
    margin: 0px;
}

.jqx-grid-column-header-rtl, .jqx-grid-columngroup-header-rtl {
    border-width: 0px 0px 0px 1px;
}

.jqx-grid-columngroup-header {
    border-bottom-width: 1px;
    border-left-width: 1px;
}

/*applied to the column's button.*/
.jqx-grid-column-menubutton {
    border-style: solid;
    border-width: 0px 0px 0px 1px;
    border-color: transparent;
    background-image: url('images/icon-menu-small.png') !important;
    background-repeat: no-repeat;
    background-position: center !important;
    cursor: pointer;
}

.jqx-grid-column-menubutton-rtl {
    border-width: 0px 1px 0px 0px;
}

/*applied to the column's sort button when the sort order is ascending.*/
.jqx-grid-column-sortascbutton {
    border: none;
    background-image: url('images/sortascbutton.png');
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
}

/*applied to the column's sort button when the sort order is descending.*/
.jqx-grid-column-sortdescbutton {
    border: none;
    background-image: url('images/sortdescbutton.png');
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
}

/*applied to the column's filter button.*/
.jqx-grid-column-filterbutton {
    border: none;
    background-image: url('images/filter.png');
    background-repeat: no-repeat;
    background-position: center;
    margin-top: 1px;
}

/*applied to the column's resize line.*/
.jqx-grid-column-resizeline {
    border-right: 1px dotted #555;
}

/*applied to the validation popup during cell editing.*/
.jqx-grid-validation {
    background: #df2227 !important;
    color: #fff !important;
    padding: 4px 8px;
}

.jqx-grid-validation-label {
    color: #fff !important;
    background: #df2227 !important;
    border: 1px solid #df2227 !important;
}

.jqx-grid-validation-arrow-up {
    background-image: url('images/red_arrow_up.png');
    background-repeat: no-repeat;
    background-position: center center;
}

.jqx-grid-validation-arrow-down {
    background-image: url('images/red_arrow_down.png');
    background-repeat: no-repeat;
    background-position: center center;
}

/*applied to the column's resize start line.*/
.jqx-grid-column-resizestartline {
    border-right: 1px solid #444;
}

/*applied to the sort ascending menu item in the Grid's Context Menu*/
.jqx-grid-sortasc-icon {
    background-image: url('images/icon-sort-asc.png');
    background-repeat: no-repeat;
    background-position: left center;
    width: 16px;
    height: 16px;
    float: left;
    margin-left: -4px;
    margin-right: 4px;
}

/*applied to the sort ascending menu item in the Grid's Context Menu*/
.jqx-grid-sortdesc-icon {
    background-image: url('images/icon-sort-desc.png');
    background-repeat: no-repeat;
    background-position: left center;
    width: 16px;
    height: 16px;
    float: left;
    margin-left: -4px;
    margin-right: 4px;
}

/*applied to the grid menu's sort remove item/*/
.jqx-grid-sortremove-icon {
    background-image: url('images/icon-sort-remove.png');
    background-repeat: no-repeat;
    background-position: left center;
    width: 16px;
    height: 16px;
    float: left;
    margin-left: -4px;
    margin-right: 4px;
}

/*applied to the grouping column's drag and drop item when the drop operation is allowed.*/
.jqx-grid-drag-icon {
    background-image: url('images/drag.png');
    background-repeat: no-repeat;
    background-position: left center;
    width: 16px;
    height: 16px;
}

/*applied to the grouping column's drag and drop item when the drop operation is not allowed.*/
.jqx-grid-dragcancel-icon {
    background-image: url('images/dragcancel.png');
    background-repeat: no-repeat;
    background-position: left center;
    width: 16px;
    height: 16px;
}

/*applied to the 'group by' menu item.*/
.jqx-grid-groupby-icon {
    background-repeat: no-repeat;
    background-position: left center;
    width: 16px;
    height: 16px;
    float: left;
    margin-left: -4px;
    margin-right: 4px;
}

/*applied to the column anchor tags.*/
.jqx-grid-column-header a:link, .jqx-grid-column-header a:visited {
    display: block;
    margin: 4px;
    height: 18px;
    line-height: 18px !important;
    color: inherit;
    outline: 0 none;
    text-decoration: none;
    cursor: pointer;
}

.jqx-grid-toolbar a:link, .jqx-grid-toolbar a:visited {
    margin: 4px;
    height: 18px;
    line-height: 18px !important;
    color: inherit;
    outline: 0 none;
    text-decoration: none;
    cursor: pointer;
}

/*applied to the groups header area.*/
.jqx-grid-groups-header, .jqx-grid-toolbar, .jqx-scheduler-toolbar {
    border-style: solid;
    border-width: 0px 0px 1px 0px;
    border-color: #aaa;
    white-space: nowrap;
    overflow: hidden;
    text-align: left;
    padding: 0px;
    margin: 0px;
}

/*applied to a grouping row.*/
.jqx-grid-groups-row {
    font-weight: bold;
    white-space: nowrap;
    text-align: left;
    padding: 0px;
    top: 50%;
    margin-top: -8px;
}

/*applied to the row details.*/
.jqx-grid-groups-row-details {
    font-weight: normal;
}

/*applied to a grouping column.*/
.jqx-grid-group-column {
    border: 1px solid transparent;
    white-space: nowrap;
    border-style: solid;
    font-weight: normal;
    overflow: hidden;
    text-align: left;
    padding: 0px;
    margin: 0px;
}

/*applied to the lines between the group columns.*/
.jqx-grid-group-column-line {
    background: #aaa;
}

/*applied to the drop line indicators displayed in the grouping header.*/
.jqx-grid-group-drag-line {
    background: #80be09;
}

/*applied to the anchor tags inside a grouping column.*/
.jqx-grid-group-column a:link {
    display: block;
    margin: 4px;
    height: 18px;
    line-height: 18px !important;
    outline: 0 none;
    text-decoration: none;
    cursor: pointer;
    color: inherit;
}

.jqx-grid-group-column a:visited {
    color: inherit;
    display: block;
    margin: 4px;
    height: 18px;
    line-height: 18px !important;
    outline: 0 none;
    text-decoration: none;
    cursor: pointer;
}

/*applied to a grid cell*/
.jqx-grid-cell {
    border-style: solid;
    border-width: 0px 1px 1px 0px;
    margin-right: 1px;
    margin-bottom: 1px;
    border-color: transparent;
    background: #fff;
    white-space: nowrap;
    font-weight: normal;
    font-size: inherit;
    overflow: hidden;
    position: absolute !important;
    height: 100%;
    outline: none;
}

.jqx-grid-cell-locked {
    color: #aaa !important;
}

.jqx-grid-cell-left-align {
    overflow: hidden;
    text-overflow: ellipsis;
    padding-bottom: 2px;
    text-align: left;
    margin-right: 2px;
    margin-left: 4px;
}

.jqx-grid-cell-middle-align {
    text-overflow: ellipsis;
    overflow: hidden;
    padding-bottom: 2px;
    text-align: center;
}

.jqx-grid-cell-right-align {
    overflow: hidden;
    text-overflow: ellipsis;
    padding-bottom: 2px;
    text-align: right;
    margin-right: 4px;
    margin-left: 2px;
}

/*applied to a grid cell that is part of a rows group.*/
.jqx-grid-group-cell {
    overflow: hidden;
    position: absolute !important;
    height: 100%;
    background: #fff;
}

/*applied to the grid cells in the sort column*/
.jqx-grid-cell-sort {
    background-color: #f0f0f0;
}

/*applied to the grid cells in the filter column*/
.jqx-grid-cell-filter {
    background-color: #e6e6e6;
}

.jqx-grid-cell-add-new-row {
    background: #fdfcf3 !important;
    color: #000 !important;
}

/*applied to the grid cells area.*/
.jqx-grid-content {
    border-style: solid;
    border-width: 0px 0px 0px 0px;
    border-color: transparent;
    white-space: nowrap;
    overflow: hidden;
}

/*applied to a grid cell that is part of a rows group.*/
.jqx-grid-group-cell, .jqx-grid-empty-cell {
    border-style: solid;
    border-width: 0px 0px 1px 0px;
    white-space: nowrap;
    font-weight: normal;
}

.jqx-widget .jqx-grid-cleared-cell, .jqx-grid-cleared-cell {
    border: transparent !important;
}

.jqx-grid-cell-wrap {
    white-space: normal !important;
}

.jqx-tree-grid-indent {
    width: 18px;
    display: inline-block;
    height: 8px;
    overflow: hidden;
    vertical-align: top;
}

.jqx-tree-grid-title {
    text-decoration: none;
    vertical-align: bottom;
    line-height: 20px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.jqx-tree-grid-collapse-button, .jqx-tree-grid-expand-button {
    display: inline-block;
    margin-top: 0px;
    margin-right: 0px;
    position: relative;
    width: 18px;
    height: 18px;
    vertical-align: top;
}

.jqx-tree-grid-checkbox {
    float: none !important;
    width: 16px;
    height: 16px;
    cursor: pointer;
    margin-right: 6px !important;
    margin-left: 2px !important;
}

.jqx-tree-grid-icon {
    float: none !important;
    width: 14px;
    height: 14px;
    margin-right: 4px;
}

.jqx-tree-grid-icon-rtl {
    margin-right: 0px;
    margin-left: 4px;
}

.jqx-tree-grid-icon-size {
    width: 14px;
    height: 14px;
    line-height: 16px;
}

.jqx-tree-grid-checkbox-tick {
    width: 100%;
    height: 100%;
}

.jqx-tree-grid-expand-button {
    height: 18px;
    width: 18px;
    vertical-align: top;
}

/*applied to a cell in jqxDataTable*/
.jqx-cell {
    min-height: 23px;
    padding: 6px 4px;
    margin: 0;
    border-collapse: separate;
    border-spacing: 0px;
    overflow: hidden;
    text-overflow: ellipsis;
    border: 1px solid transparent;
    border-top-width: 0px;
    border-left-width: 0px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    white-space: normal;
    line-height: 1.231;
}

.jqx-grid-cell-nowrap {
    white-space: nowrap;
}

.jqx-cell-editor {
    padding-left: 4px !important;
    padding-right: 3px !important;
}

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

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

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

.jqx-top-align {
    vertical-align: top;
}

.jqx-bottom-align {
    vertical-align: bottom;
}

.jqx-grid-table .jqx-grid-cell {
    position: static !important;
    zoom: 1 !important;
}

/*applied to the Grid's Table element.*/
.jqx-grid-table {
    font-size: 13px;
    table-layout: fixed;
    margin: 0px;
    padding: 0px;
    border-collapse: separate;
    border-spacing: 0px;
    -webkit-overflow-scrolling: touch;
    outline: none;
    zoom: 1 !important;
    empty-cells: show;
    border-right: 1px solid #aaa;
    line-height: 1.231;
    width: auto;
    border: none;
}

.jqx-grid-table-rtl {
    border-left-width: 1px;
    border-right-width: 0px;
}

.jqx-details table {
    border-collapse: collapse;
    table-layout: fixed;
    border-spacing: 0px;
}

/*applied to a grid cell that is part of a details row and grouping is enabled.*/
.jqx-grid-group-details-cell {
}

/*applied to a grid cell that is part of a details row.*/
.jqx-grid-details-cell {
    border-width: 0px 1px 0px 0px;
}

/*applied to a grid cell. Represents the alternating cell background.*/
.jqx-grid-cell-alt {
    background: #f9f9f9;
}

/*applied to a sorted and alternating grid cell*/
.jqx-grid-cell-sort-alt {
    background-color: #e5e5e5;
}

/*applied to a sorted and alternating grid cell*/
.jqx-grid-cell-filter-alt {
    background-color: #f0f0f0;
}

/*applied to a pinned grid cell.*/
.jqx-grid-cell-pinned {
    background-color: #e5e5e5;
}

/*applied to a pinned grid cell. Represents the alternating cell background.*/
.jqx-grid-cell-pinned-alt {
    background-color: #e5e5e5;
}

/*applied to a selected grid cell.*/
.jqx-grid-cell-selected {
    border-left: 0px solid transparent;
}

.jqx-grid-cell-selected.jqx-grid-cell-edit {
    border-color: #DDDDDD !important;
    background-color: #fff !important;
    color: #333 !important;
}

.jqx-fill-state-focus.jqx-grid-cell-edit,
.jqx-grid-cell-edit .jqx-fill-state-focus,
.jqx-grid-cell-edit.jqx-fill-state-focus .jqx-action-button,
.jqx-grid-cell-edit .jqx-numberinput-focus,
.jqx-grid-cell-edit .jqx-combobox-content-focus {
    border-color: #DDDDDD !important;
}

.jqx-cell-rtl {
    border-left-width: 1px;
    border-right-width: 0px;
}

.jqx-grid-cell-rtl {
    border-width: 0px 0px 1px 1px;
}

.jqx-grid-table .jqx-grid-cell {
    border-width: 0px 0px 1px 1px;
}

.jqx-grid-table-one-cell {
    border: none;
    border-right-width: 1px;
    border-right-style: solid;
    border-right-color: #aaa;
}

.jqx-grid-table .jqx-grid-cell:first-child {
    border-left-width: 0px;
}

/*applied to the selection area.*/
.jqx-grid-selectionarea {
    border: 1px solid transparent;
    opacity: 0.5;
    filter: alpha(opacity=50);
}

/*applied to a hovered grid cell.*/
.jqx-grid-cell-hover {
    border-color: transparent;
}

/*applied to a grid cell when the grid is empty.*/
.jqx-grid-empty-cell {
    overflow: visible;
    border-bottom: none;
}

/*applied to the Grid when its loading the data.*/
.jqx-grid-load {
    padding-right: 0px;
    background-image: url(./images/loader.gif);
    background-position: 50% 50%;
    background-repeat: no-repeat;
    z-index: 9999;
    display: block;
}

/*applied to a group's collapse button.*/
.jqx-grid-group-collapse {
    padding-right: 0px;
    background-image: url(./images/icon-right.png);
    background-position: 50% 50%;
    background-repeat: no-repeat;
    cursor: pointer;
}

.jqx-grid-group-collapse-rtl {
    padding-right: 0px;
    background-image: url(./images/icon-left.png);
    background-position: 50% 50%;
    background-repeat: no-repeat;
    cursor: pointer;
}

/*applied to a group's expand button.*/
.jqx-grid-group-expand, .jqx-grid-group-expand-rtl {
    padding-right: 0px;
    background-image: url(./images/icon-down.png);
    background-position: 50% 50%;
    background-repeat: no-repeat;
    cursor: pointer;
}

/*jqxProgresBar Style*/
.jqx-progressbar {
    position: relative;
    overflow: hidden;
    outline: none;
    border: 1px solid transparent;
    height: 2em;
}

/*applied to the progressbar's value element*/
.jqx-progressbar-value {
    outline: none;
    border: 0px solid transparent;
    height: 100%;
}

/*applied to the progress bar's vertical value element- when the widget's orientation is 'vertical'*/
.jqx-progressbar-value-vertical {
    outline: none;
    border: 0px solid transparent;
    height: 100%;
    background: transparent;
}

/*applied to the progressbar's text element*/
.jqx-progressbar-text {
    font-size: 10px;
    border: none;
}

/*applied to the progress bar when the widget is in disabled state*/
.jqx-progressbar-disabled {
    outline: none;
    border: 1px solid transparent;
    height: 2em;
}

/*jqxMenu Style*/
.jqx-menu {
    border: 1px solid transparent;
    float: none;
    margin: 0px;
    height: 100%;
    padding: 0px;
    overflow: hidden;
    text-align: left;
}

.jqx-menu-dropdown-column {
    float: left;
}

/*applied to the menu when it is horizontal. Sets the menu's background*/
.jqx-menu-horizontal {
    margin: 0px;
    padding: 0px;
    overflow: hidden;
    text-align: center;
}

/*applied to the menu when it is vertical. Sets the menu's background*/
.jqx-menu-vertical {
    text-align: left;
}

/*applied to the sub menu. Sets the sub menu's background*/
.jqx-menu-dropdown {
    left: 100%;
    margin: 0px;
    padding: 0px;
    right: 0;
    overflow: hidden;
    display: none;
    float: none;
    width: 150px;
    border-style: solid;
    border-width: 1px;
    text-align: left;
    padding: 2px;
}

/*applied to the sub menu's ul elements.*/
.jqx-menu-dropdown ul {
    left: 100%;
    margin: 0px;
    padding: 0px;
    right: 0;
    overflow: hidden;
    border: none;
}

/*applied to the menu's ul elements.*/
.jqx-menu ul {
    left: 100%;
    margin: 0px;
    padding: 2px;
    right: 0;
    overflow: hidden;
    background-color: transparent;
    border: none;
}

/*applied to the menu's li elements.*/
.jqx-menu li, .jqx-menu-dropdown li {
    line-height: 1.3 !important;
}

/*applied to the top level menu items.*/
.jqx-menu-item-top {
    border: 1px solid transparent;
    text-indent: 0;
    list-style: none;
    padding: 4px 8px 4px 8px;
    left: 100%;
    overflow: hidden;
    color: inherit;
    right: 0;
    margin: 0px 3px 0px 3px;
    cursor: pointer;
}

/*applied to the sub menu items.*/
.jqx-menu-item {
    border: 1px solid transparent;
    text-indent: 0;
    list-style: none;
    padding: 4px 8px 4px 8px;
    margin: 1px;
    margin-left: 3px;
    margin-right: 3px;
    float: none;
    overflow: hidden;
    left: 100%;
    color: inherit;
    right: 0;
    text-align: left;
    cursor: pointer;
}

/*applied to a sub menu item when the mouse is over the item.*/
.jqx-menu-item-hover {
    color: inherit;
    right: 0;
    list-style: none;
    margin: 1px;
    margin-left: 3px;
    margin-right: 3px;
    left: 100%;
    padding: 4px 8px 4px 8px;
    text-align: left;
    cursor: pointer;
}

/*applied to a top-level menu item when the mouse is over it.*/
.jqx-menu-item-top-hover {
    color: inherit;
    right: 0;
    list-style: none;
    margin: 0px 3px 0px 3px;
    left: 100%;
    padding: 4px 8px 4px 8px;
    top: 50%;
    cursor: pointer;
}

/*applied to a sub menu item when its sub menu is opened.*/
.jqx-menu-item-selected {
    right: 0;
    list-style: none;
    margin: 1px;
    margin-left: 3px;
    margin-right: 3px;
    left: 100%;
    padding: 4px 8px 4px 8px;
    text-align: left;
    cursor: pointer;
}

/*applied to a disabled sub menu item.*/
.jqx-menu-item-disabled {
}

/*applied to a top-level menu item when its sub menu is opened.*/
.jqx-menu-item-top-selected {
    right: 0;
    list-style: none;
    margin: 0px 1px 0px 1px;
    margin-left: 3px;
    margin-right: 3px;
    left: 100%;
    padding: 4px 8px 4px 8px;
    cursor: pointer;
}

/*applied to the menu separator items.*/
.jqx-menu-item-separator {
    text-indent: 0;
    background-color: #ddd;
    border: none;
    list-style: none;
    height: 1px;
    line-height: 0 !important;
    padding: 0px;
    margin: 1px 2px 1px 2px;
    float: none;
    overflow: hidden;
    left: 100%;
    color: inherit;
    right: 0;
    font-size: 1px;
}

/*applied to a sub menu item when it has sub menu items. Displays right arrow icon.*/
.jqx-menu-item-arrow-right {
    background-image: url(./images/icon-right.png);
}

/*applied to a sub menu item when it has sub menu items. Displays down arrow icon.*/
.jqx-menu-item-arrow-down {
    background-image: url(./images/icon-down.png);
}

/*applied to a sub menu item when it has sub menu items. Displays up arrow icon.*/
.jqx-menu-item-arrow-up {
    background-image: url(./images/icon-up.png);
}

.jqx-menu-minimized {
    position: relative;
}

.jqx-menu-title {
    position: relative;
    float: right;
    margin-top: 4px;
    padding-top: 4px;
    padding-right: 20px;
}

.jqx-menu-minimized-button {
    background-image: url('images/icon-menu-minimized.png');
    background-repeat: no-repeat;
    background-position: left center;
    height: 24px;
    width: 24px;
    padding: 0px;
    margin-left: 7px;
    margin-top: 4px;
    float: left;
}

.jqx-menu-ul-minimized {
    display: block !important;
    width: auto !important;
}

.jqx-menu-ul-minimized ul {
    margin-top: 0px;
    margin-bottom: 0px;
    padding-top: 0px;
    padding-bottom: 0px;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    -o-box-shadow: none !important;
    box-shadow: none !important;
}

.jqx-menu-minimized li:last-child {
    padding-bottom: 0px;
    margin: 0px;
}

.jqx-menu-item-arrow-right, .jqx-menu-item-arrow-down, .jqx-menu-item-arrow-up, .jqx-menu-item-arrow-right {
    background-position: 100% 50%;
    background-repeat: no-repeat;
    padding-right: 0px;
    margin-right: -8px;
    width: 17px;
    height: 15px;
}

/*applied to a sub menu item when it has sub menu items. Displays left arrow icon.*/
.jqx-menu-item-arrow-left {
    padding-right: 0px;
    padding-left: 5px;
    width: 17px;
    height: 15px;
    background-image: url(./images/icon-left.png);
    background-position: 0 50%;
    background-repeat: no-repeat;
}

/*applied to a sub menu item when it has sub menu items and its sub menu is opened. Displays right arrow icon.*/
.jqx-menu-item-arrow-right-selected {
    background-image: url(./images/icon-right.png);
}

/*applied to a sub menu item when it has sub menu items and its sub menu is opened. Displays down arrow icon.*/
.jqx-menu-item-arrow-down-selected {
    background-image: url(./images/icon-down.png);
}

/*applied to a sub menu item when it has sub menu items and its sub menu is opened. Displays up arrow icon.*/
.jqx-menu-item-arrow-up-selected {
    background-image: url(./images/icon-up.png);
}

.jqx-menu-item-arrow-right-selected, .jqx-menu-item-arrow-up-selected, .jqx-menu-item-arrow-down-selected, .jqx-menu-item-arrow-top-right {
    padding-right: 0px;
    margin-right: -8px;
    width: 17px;
    height: 15px;
    background-position: 100% 50%;
    background-repeat: no-repeat;
}

/*applied to a top-level menu item when it has sub menu items. Displays right arrow icon.*/
.jqx-menu-item-arrow-top-right {
    background-image: url(./images/icon-right.png);
}

/*applied to a sub menu item when it has sub menu items and its sub menu is opened. Displays left arrow icon.*/
.jqx-menu-item-arrow-left-selected {
    background-image: url(./images/icon-left.png);
}

/*applied to a top-level menu item when it has sub menu items. Displays left arrow icon.*/
.jqx-menu-item-arrow-top-left {
    background-image: url(./images/icon-left.png);
}

.jqx-menu-item-arrow-left-selected, .jqx-menu-item-arrow-top-left {
    background-position: 0 50%;
    background-repeat: no-repeat;
    padding-right: 0px;
    padding-left: 5px;
    width: 17px;
    height: 15px;
}

/*applied to the anchor elements*/
.jqx-menu-item a:link, .jqx-menu-item a:visited, .jqx-menu-item a:hover, .jqx-menu-item-top a:link, .jqx-menu-item-top a:visited, .jqx-menu-item-top a:hover {
    font: inherit;
    text-decoration: none;
    color: inherit;
    outline: none;
    background-color: transparent;
}

/*applied to the menu widget when it is disabled.*/
.jqx-menu-disabled {
    cursor: default;
}

/*applied to the anchor elements of all disabled menu items.*/
.jqx-menu-disabled a:link {
    cursor: default;
    text-decoration: none;
}

.jqx-menu-disabled a:visited {
    cursor: default;
    text-decoration: none;
}

.jqx-menu-disabled a:hover {
    cursor: default;
}

.jqx-menu-dropdown {
    right: -1px;
}

/*jqxtree Style*/
.jqx-tree {
    left: 100%;
    right: 0;
    float: none;
    margin: 0px;
    border-style: solid;
    border-width: 1px;
    padding: 0px;
    overflow: hidden;
    text-align: left;
    outline: none;
    white-space: nowrap;
    line-height: 14px !important;
}

/*applied to the jqxTree root UL element.*/
.jqx-tree-dropdown-root {
    left: 100%;
    padding: 0px 5px 0px 5px;
    right: 0;
    display: block;
    float: none;
    background-color: transparent;
    border-style: solid;
    border-width: 0px;
    border-color: #fff;
    text-align: left;
    outline: none;
    white-space: nowrap;
    margin: 0px;
}

.jqx-tree-dropdown-root-rtl {
    padding: 0px 5px 0px 0px;
    text-align: right;
    float: right;
    margin: 0px;
}

/*applied to the jqxTree UL elements.*/
.jqx-tree-dropdown {
    left: 100%;
    margin: 0px;
    padding: 0px 0px 0px 10px;
    right: 0;
    display: block;
    float: none;
    background-color: transparent;
    border-style: solid;
    border-width: 0px;
    border-color: transparent;
    text-align: left;
    outline: none;
}

.jqx-tree-dropdown-rtl {
    padding: 3px 0px 0px 0px;
    text-align: right;
}

/*applied to a tree item.*/
.jqx-tree-item {
    border: 1px solid transparent;
    text-indent: 0;
    list-style: none;
    padding: 3px;
    margin: 0px;
    float: none;
    overflow: hidden;
    left: 100%;
    right: 0;
    text-align: left;
    cursor: default;
    text-decoration: none;
}

/*applied to the jqxTree LI elements.*/
.jqx-tree-item-li {
    text-indent: 0;
    background-color: transparent;
    border: 0px solid transparent;
    list-style: none;
    left: 100%;
    right: 0;
    text-align: left;
    outline: none;
    margin: 0px;
    margin-top: 1px;
    padding: 0px;
}

/*applied to the last LI elements in an UL element.*/
.jqx-tree-item-u-last {
    margin: 0px 0px 0px 0px;
}

/*applied to a tree item when the mouse is over the item.*/
.jqx-tree-item-hover {
    color: inherit;
    right: 0;
    padding: 3px;
    margin: 0px;
    list-style: none;
    left: 100%;
    cursor: pointer;
    text-decoration: none;
}

/*applied to a tree item when the item is selected.*/
.jqx-tree-item-selected {
    color: inherit;
    right: 0;
    padding: 3px;
    margin: 0px;
    list-style: none;
    left: 100%;
    cursor: pointer;
    text-decoration: none;
}

.jqx-tree-item-rtl {
    text-align: right;
}

.jqx-tree-item-li-rtl {
    text-align: right;
}

/*applied to the anchor element of a tree item.*/
.jqx-tree-item a:link, .jqx-tree-item a:visited {
    text-indent: 0;
    background-color: transparent;
    border: 0px solid transparent;
    list-style: none;
    padding: 0px;
    margin: 0px;
    float: none;
    overflow: hidden;
    left: 100%;
    color: inherit;
    right: 0;
    text-align: left;
    cursor: pointer;
    text-decoration: none;
    outline: none;
}

.jqx-tree-item-selected, .jqx-tree-item-hover a:hover {
    color: inherit;
}

.jqx-tree-item-selected, .jqx-tree-item-hover a:visited {
    color: inherit;
}

/*applied to a tree item when the item is disabled.*/
.jqx-tree-item-disabled {
}

/*applied to a tree item when it has sub items and is collapsed. Displays an arrow icon next to the item.*/
.jqx-tree-item-arrow-collapse, .jqx-tree-item-arrow-collapse-hover {
    padding-right: 0px;
    width: 17px;
    height: 17px;
    background-image: url(./images/icon-right.png);
    background-position: 100% 50%;
    background-repeat: no-repeat;
    cursor: pointer;
}

.jqx-tree-item-arrow-collapse-rtl, .jqx-tree-item-arrow-collapse-hover-rtl {
    background-image: url(./images/icon-left.png);
}

/*applied to a tree item when it has sub items and is expanded. Displays an arrow icon next to the item.*/
.jqx-tree-item-arrow-expand, .jqx-tree-item-arrow-expand-hover {
    padding-right: 0px;
    width: 17px;
    height: 17px;
    background-image: url(./images/icon-down.png);
    background-position: 100% 50%;
    background-repeat: no-repeat;
    cursor: pointer;
}

/*applied to the tree when it is disabled.*/
.jqx-tree-disabled {
    cursor: default;
}

/*applied to the anchor elements in a tree when it is disabled.*/
.jqx-tree-disabled a:link {
    cursor: default;
    text-decoration: none;
}

.jqx-tree-disabled a:visited {
    cursor: default;
    text-decoration: none;
}

.jqx-tree-disabled a:hover {
    cursor: default;
}


/*jqxTabs*/
.jqx-tabs {
    outline: none;
    margin: 0 0 0 0;
    padding: 0px;
    overflow: hidden;
    background: transparent;
    border: 1px solid transparent;
}

/*applied to the tab close button.*/
.jqx-tabs-close-button {
    outline: none;
    background-image: url(./images/close.png);
    cursor: pointer;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    position: relative;
    left: 5px;
}

/*applied to the tab close button when the tab is selected.*/
.jqx-tabs-close-button-selected {
    outline: none;
    background-image: url(./images/close.png);
    cursor: pointer;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
}

/*applied to the tab close button when the mouse is over the tab.*/
.jqx-tabs-close-button-hover {
    outline: none;
    background-image: url(./images/close.png);
    cursor: pointer;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
}

.jqx-tabs-close-button, .jqx-tabs-close-button-selected, .jqx-tabs-close-button-hover {
    background-repeat: no-repeat;
    background-position: center;
}

/*applied to the tab's left scroll arrow.*/
.jqx-tabs-arrow-left {
    outline: none;
    position: relative;
    z-index: 15;
    float: left;
    cursor: pointer;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    background-image: url('images/icon-left.png');
    background-repeat: no-repeat;
    background-position: center;
}

/*applied to the tab's right scroll arrow.*/
.jqx-tabs-arrow-right {
    outline: none;
    position: relative;
    z-index: 15;
    background-image: url('images/icon-right.png');
    background-repeat: no-repeat;
    background-position: center;
    float: left;
    cursor: pointer;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
}

.jqx-tabs-arrow-background {
    background: #eeeeee;
}

/*applied to the tab's title.*/
.jqx-tabs-title {
    outline: none;
    display: block;
    cursor: pointer;
    white-space: nowrap;
    left: 100%;
    right: 0;
    text-indent: 0px;
    list-style: none;
    border: 1px solid transparent;
    margin: 0px 2px 0px 0px;
    overflow: hidden;
    z-index: 1;
    padding-left: 13px;
    padding-right: 13px;
    padding-bottom: 5px;
    padding-top: 5px;
    background: transparent;
    height: auto;
    position: relative;
}

.jqx-tabs-title-bottom {
}

.jqx-tabs-title a:link {
    color: inherit;
    text-decoration: none;
}

.jqx-tabs-title a:hover {
    color: inherit;
    text-decoration: none;
}

.jqx-tabs-title a:active {
    color: inherit;
    text-decoration: none;
}

.jqx-tabs-title a:visited {
    color: inherit;
    text-decoration: none;
}

/*applied to the tab's title when the tab is selected and the jqxTab's position property is set to 'top' .*/
.jqx-tabs-title-selected-top {
    z-index: 99;
    outline: none;
    border-top: 1px solid transparent;
    border-left: 1px solid transparent;
    border-right: 1px solid transparent;
    border-bottom: 1px solid #fff;
    background-color: #fff;
    padding-bottom: 7px;
}

/*applied to the tab's title when the tab is selected and the jqxTab's position property is set to 'bottom' .*/
.jqx-tabs-title-selected-bottom {
    outline: none;
    border-top: 1px solid #fff;
    border-left: 1px solid transparent;
    border-right: 1px solid transparent;
    border-bottom: 1px solid transparent;
    padding-top: 7px;
    padding-bottom: 5px;
    margin-top: -2px;
    background-color: #fff;
}

/*applied to the tab's title when the tab is hovered and the jqxTab's position property is set to 'top' .*/
.jqx-tabs-title-hover-top {
    outline: none;
    border: 1px solid transparent;
    padding-bottom: 5px;
}

/*applied to the tab's title when the tab is hovered and the jqxTab's position property is set to 'bottom' .*/
.jqx-tabs-title-hover-bottom {
    outline: none;
    border: 1px solid transparent;
    padding-top: 5px;
}

/*applied to the tab's title when the tab is disabled.*/
.jqx-tabs-title-disable {
}

/*applied to the tab's header.*/
.jqx-tabs-header {
    padding-left: 0px;
    padding-right: 0px;
    padding-top: 3px;
    padding-bottom: 1px;
    margin: 0px;
    border-top: 0px solid transparent;
    border-left: 0px solid transparent;
    border-right: 0px solid transparent;
    border-bottom: 1px solid #aaa;
    background: #eeeeee;
}

/*applied to the tab's header when the position is bottom.*/
.jqx-tabs-header-bottom {
    padding-top: 1px;
    padding-bottom: 3px;
    border-top: 0px solid #aaa;
    border-left: 0px solid transparent;
    border-right: 0px solid transparent;
    border-bottom: 1px solid transparent;
}

/*applied to the tab's header when the tab is collapsed.*/
.jqx-tabs-header-collapsed {
    border: 1px solid #aaa;
}

/*applied to the tab's header when the position is bottom and tab is collapsed.*/
.jqx-tabs-header-collapsed-bottom {
    border: 1px solid #aaa;
}

.jqx-tabs-collapsed {
    border: 0px solid transparent;
}

.jqx-tabs-collapsed-bottom {
    border: 0px solid transparent;
}

/*applied to the tab's selection tracker container element.*/
.jqx-tabs-selection-tracker-container {
    outline: none;
    position: relative;
    text-indent: 0px;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    width: 100%;
    background: transparent;
    height: 0px;
}

/*applied to the tab's selection tracker when the jqxTab's position property is set to 'top'.*/
.jqx-tabs-selection-tracker-top {
    border-top: 1px solid transparent;
    border-left: 1px solid transparent;
    border-right: 1px solid transparent;
    padding-bottom: 2px;
    background-color: #fff;
    outline: none;
    position: absolute;
    z-index: 10;
}

/*applied to the tab's selection tracker when the jqxTab's position property is set to 'bottom'.*/
.jqx-tabs-selection-tracker-bottom {
    border-left: 1px solid transparent;
    border-right: 1px solid transparent;
    border-bottom: 1px solid transparent;
    background-color: #fff;
    outline: none;
    position: absolute;
    z-index: 10;
    margin-top: -1px;
    padding-bottom: 2px;
}

/*applied to the tab's content element which represents a DIV element.*/
.jqx-tabs-content {
    outline: none;
    border-bottom: 0px solid transparent;
    border-left: 0px solid transparent;
    border-right: 0px solid transparent;
    border-top: 0px solid transparent;
    text-align: left;
    clear: both;
}

.jqx-tabs-content-element {
    height: 100%;
    overflow: auto;
}

/*jqxCheckBox*/
.jqx-checkbox {
    overflow: hidden;
    text-align: left;
    border: none;
    outline: none;
    margin: 0 0 0 0;
    white-space: nowrap;
    text-overflow: ellipsis;
}

/*applied to the check box.*/
.jqx-checkbox-default {
    text-align: left;
    float: left;
    padding: 0px;
    border: 1px solid transparent;
    outline: none;
    margin: 0px 3px 0px 3px;
}

/*applied to the check box when the mouse cursor is over it.*/
.jqx-checkbox-hover {
    cursor: pointer;
    float: left;
    padding: 0px;
    border: 1px solid transparent;
    outline: none;
    margin: 0px 3px 0px 3px;
}

/*applied to the widget when it is disabled.*/
.jqx-checkbox-disabled {
    cursor: default;
    background: transparent;
    padding: 0px;
    border: none;
    outline: none;
    margin: 0px 0px 0px 0px;
}

/*applied to the check box when the widget is disabled.*/
.jqx-checkbox-disabled-box {
    float: left;
    padding: 0px;
    border: 1px solid transparent;
    outline: none;
    margin: 0px 3px 0px 3px;
}

/*applied to the check box when it is checked. Displays a check icon.*/
.jqx-checkbox-check-checked {
    float: left;
    background: transparent url(./images/check_black.png) center center no-repeat;
    padding: 0px;
    border: none;
    outline: none;
    margin: 0 0 0 0;
}

/*applied to the check box when the widget is disabled. Displays a disabled check icon.*/
.jqx-checkbox-check-disabled {
    float: left;
    background: transparent url(./images/check_disabled.png) center center no-repeat;
    padding: 0px;
    border: none;
    outline: none;
    margin: 0 0 0 0;
}

/*applied to the check box when its state is indeterminate.*/
.jqx-checkbox-check-indeterminate {
    float: left;
    background: transparent url(./images/check_indeterminate_black.png) center center no-repeat;
    padding: 0px;
    border: none;
    outline: none;
    margin: 0 0 0 0;
}

/*applied to the check box when its state is indeterminate and it is disabled.*/
.jqx-checkbox-check-indeterminate-disabled {
    float: left;
    background: transparent url(./images/check_indeterminate_disabled.png) center center no-repeat;
    padding: 0px;
    border: none;
    outline: none;
    margin: 0 0 0 0;
}

/*applied to the check box when its in rtl mode.*/
.jqx-checkbox-rtl {
    float: right;
}

/*jqxRadioButton*/
.jqx-radiobutton {
    overflow: hidden;
    text-overflow: ellipsis;
    border: none;
    outline: none;
    margin: 0 0 0 0;
    white-space: nowrap;
}

/*applied to the radio button.*/
.jqx-radiobutton-default {
    cursor: pointer;
    float: left;
    background: transparent url(./images/roundbg_classic_normal.png) left center scroll repeat-x;
    padding: 0px;
    border: 1px solid transparent;
    outline: none;
    margin: 1px 3px 0px 3px;
    -moz-border-radius: 100%;
    -webkit-border-radius: 100%;
    border-radius: 100%;
}

/*applied to the radio button when the mouse is over it.*/
.jqx-radiobutton-hover {
    cursor: pointer;
    float: left;
    background: transparent;
    padding: 0px;
    border: 1px solid transparent;
    outline: none;
    margin: 1px 3px 0px 3px;
    -moz-border-radius: 100%;
    -webkit-border-radius: 100%;
    border-radius: 100%;
}

/*applied to the radio button when it is disabled.*/
.jqx-radiobutton-disabled {
    cursor: default;
}

/*applied to the radio button's radio icon when it is disabled.*/
.jqx-radiobutton-disabled-box {
}

/*applied to the radio button when it is checked.*/
.jqx-radiobutton-check-checked {
    float: left;
    background: transparent url(./images/roundbg_check_black.png) left top no-repeat;
    padding: 0px;
    border: 1px solid transparent;
    outline: none;
    margin: 0 0 0 0;
    -moz-border-radius: 100%;
    -webkit-border-radius: 100%;
    border-radius: 100%;
    width: 7px;
    height: 7px;
    margin-left: 2px;
    margin-top: 2px;
}

/*applied to the radio button when it is checked and disabled.*/
.jqx-radiobutton-check-disabled {
}

/*applied to the radio button when it is in indeterminate state.*/
.jqx-radiobutton-check-indeterminate {
    float: left;
    background: transparent url(./images/roundbg_check_indeterminate.png) left top no-repeat;
    padding: 0px;
    border: none;
    outline: none;
    margin: 0 0 0 0;
    -moz-border-radius: 100%;
    -webkit-border-radius: 100%;
    border-radius: 100%;
    width: 6px;
    height: 6px;
    margin-left: 2px;
    margin-top: 2px;
}

/*applied to the radio button when it is in indeterminate state and disabled.*/
.jqx-radiobutton-check-indeterminate-disabled {
}

/*applied to the radio button when its in rtl mode.*/
.jqx-radiobutton-rtl {
    float: right;
}

/*jqxRating*/
.jqx-rating {
    margin: 0px;
    padding: 0px;
    outline: none;
    overflow: hidden;
}

.jqx-rating-image {
    border-width: 0px;
}

.jqx-rating-image-default {
    margin: 0px;
    padding: 0px;
    outline: none;
    background-color: transparent;
    background-repeat: no-repeat;
    cursor: pointer;
    background-image: url(./images/star.png);
    overflow: hidden;
}

/*applied to the rating when it is hovered.*/
.jqx-rating-image-hover {
    background-color: transparent;
    padding: 0px;
    background-repeat: no-repeat;
    cursor: pointer;
    background-image: url(./images/star_hover.png);
    overflow: hidden;
}

/*applied to the rating when it is disabled.*/
.jqx-rating-image-backward {
    background-color: transparent;
    padding: 0px;
    background-repeat: no-repeat;
    cursor: pointer;
    background-image: url(./images/star_disabled.png);
    overflow: hidden;
}

/*jqxCalendar Style*/
.jqx-calendar {
    border: 1px solid transparent;
    -webkit-appearance: none;
    overflow: hidden;
    outline: none;
    padding: 0px;
    margin: 0 0 0 0;
    cursor: default;
    border-collapse: separate;
}

.jqx-calendar .jqx-widget-header {
}

.jqx-calendar > div {
    padding: 0px;
    box-sizing: border-box;
}

.jqx-calendar-light > div {
    padding: 10px;
}

.jqx-calendar td {
    padding-top: 0px;
    padding-bottom: 0px;
    border-collapse: separate;
    border-spacing: 1px;
    font-size: 13px;
    line-height: 1.231;
    height: auto;
}

.jqx-calendar table {
    margin: 0px;
    padding: 0px;
    border-collapse: separate;
    border-spacing: 1px;
    font-size: 13px;
    line-height: 1.231;
}

/*applied to the calendar's row header. This header displays the week numbers.*/
.jqx-calendar-row-header {
    outline: none;
    border: 0px solid #f2f2f2;
    padding: 0;
    margin: 0 0 0 0;
    cursor: default;
}

/*applied to the calendar's column. This header displays the day names.*/
.jqx-calendar-column-header {
    outline: none;
    text-align: right;
    padding: 3px;
    border-top: none;
    border-bottom: 1px solid transparent;
    border-left: none;
    border-right: none;
    margin: 0 0 0 0;
    cursor: default;
}

/*applied to the calendar's top-left header. This header is displayed before the day names and above the week numbers.*/
.jqx-calendar-top-left-header {
    outline: none;
    border: 0px solid #f2f2f2;
    margin: 0 0 0 0;
    cursor: default;
}

/*applied to the calendar's navigation buttons.*/
.jqx-calendar-title-navigation {
    cursor: pointer;
    background-color: transparent;
    margin: 0;
    padding: 0;
    border: none;
    width: 25px;
    height: 25px;
}

/*applied to the month table*/
.jqx-calendar-month {
    margin: 0;
    padding: 0;
    border: none;
    width: 100%;
}

/*applied to the calendar's title content.*/
.jqx-calendar-title-content {
    cursor: pointer;
    text-align: center;
}

/*applied to the calendar's navigation title.*/
.jqx-calendar-title-header {
    border-left: none;
    border-top: none;
    border-right: none;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    margin: 0 0 0 0;
}

.jqx-calendar-title-header td {
    padding-left: 0px;
    padding-right: 0px;
    border: none;
}

/*applied to the calendar's navigation title when the calendar is disabled.*/
.jqx-calendar-title-header-disabled {
    border-bottom-width: 1px;
    border-bottom-style: solid;
    margin: 0 0 0 0;
    border-left: 0px solid transparent;
    border-right: 0px solid transparent;
    border-top: 0px solid transparent;
}

/*applied to a calendar cell.*/
.jqx-calendar-cell {
    border: 1px solid transparent;
    margin: 0px;
    outline: none;
    text-align: center;
    padding: 1px;
    cursor: pointer;
    background-color: transparent;
}

.jqx-calendar-cell td {
    padding: 0;
    margin: 0;
}

/*applied to a calendar cell in decade and year views.*/
.jqx-calendar-cell-decade, .jqx-calendar-cell-year {
    text-align: center;
}

.jqx-calendar .jqx-fill-state-normal {
    background: transparent;
    border: 1px solid transparent;
}

/*applied to a calendar cell when the cell is hidden. A cell can be hidden when the showOtherMonthDays property is false and the calendar hides the cells with dates from the other months*/
.jqx-calendar-cell-hidden {
    margin: 0 0 0 0;
    visibility: hidden;
    cursor: default;
}

/*applied to a calendar cell when the cell's date is a weekend date.*/
.jqx-calendar-cell-weekend {
    color: #898989 !important;
    margin: 0 0 0 0;
    cursor: pointer;
}

/*applied to a calendar cell when the cell's date is a special date(holiday, vacation, birthay. See the SpecialDates demo).*/
.jqx-calendar-cell-specialDate {
    color: #FF0000 !important;
    background-color: transparent;
    border: 1px solid #fff;
    margin: 0 0 0 0;
    cursor: pointer;
}

/*applied to a calendar cell when the cell's date is a restricted date.*/
.jqx-calendar-cell-restrictedDate {
    background-color: rgba(251, 132, 153, 1);
    border: 1px solid #fff;
    margin: 0 0 0 0;
    cursor: pointer;
}

.jqx-calendar-cell-selected-invalid {
    color: #FFF !important;
    background: #FF0000 !important;
    border: 1px solid #FF0000 !important;
}

/*applied to a calendar cell when the cell's date is the today date.*/
.jqx-calendar-cell-today {
    color: #898989;
    background-color: #ffffdb;
    border: 1px solid #fdc066;
    margin: 0 0 0 0;
    cursor: pointer;
}

/*applied to a calendar cell when the cell is hovered.*/
.jqx-calendar-cell-hover {
    margin: 0 0 0 0;
    cursor: pointer;
}

/*applied to a calendar cell when the cell is selected.*/
.jqx-calendar-cell-selected {
    margin: 0 0 0 0;
    cursor: pointer;
}

/*applied to a calendar cell when the cell's date represents a date from the previous or next month.*/
.jqx-calendar-cell-othermonth {
    color: #898989 !important;
    margin: 0 0 0 0;
    cursor: pointer;
}

/*applied to a calendar cell when the calendar is disabled.*/
.jqx-calendar-cell-disabled {
    color: #ccc;
}

/*applied to a calendar cell when the cell is from the row header that displays the week numbers.*/
.jqx-calendar-row-cell {
    outline: none;
    text-align: center;
    border: 1px solid transparent;
    margin: 0 0 0 0;
    cursor: default;
}

/*applied to a calendar cell when the cell is from the row header that displays the week numbers and the calendar is disabled.*/
.jqx-calendar-row-cell-disabled {
}

.jqx-calendar-footer {
    margin: 5px;
    color: inherit;
    font-size: 13px;
}

.jqx-calendar-title-container {
    overflow: hidden;
}

/*applied to a calendar cell when the cell is from the column header that displays the day names.*/
.jqx-calendar-column-cell {
    overflow: hidden;
    text-align: center;
    outline: none;
    font-weight: normal;
    padding: 1px;
    border: 1px solid transparent;
    margin: 0 0 0 0;
    cursor: default;
}

/*applied to a calendar cell when the cell is from the column header that displays the day names and the calendar is disabled.*/
.jqx-calendar-column-cell-disabled {
}

/*applied to the calendar's cell area element.*/
.jqx-calendar-view {
    -webkit-appearance: none;
    outline: none;
    padding: 0px;
    border: 0px solid #fff;
    margin: 0 0 0 0;
    cursor: default;
}

/*jqxExpander and jqxNavigationBar Style*/
.jqx-expander {
}

/*applied to the Expander's header and content*/
.jqx-expander-header, .jqx-expander-content {
    border-left-width: 1px;
    border-right-width: 1px;
    border-left-style: solid;
    border-right-style: solid;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 5px;
    padding-right: 5px;
    outline: 0;
}

/*applid to the content of the expander header.*/
.jqx-expander-header-content {
    padding-left: 3px;
}

/*applid to the content of the expander header.*/
.jqx-expander-header-content-rtl {
    padding-right: 3px;
}

.jqx-expander-content {
    padding-top: 0px;
    padding-bottom: 0px;
    overflow: auto;
    outline: 0;
}

/*applied to the Expander's header and its content when it is on the top of the header*/
.jqx-expander-header, .jqx-expander-content-top {
    border-top-width: 1px;
    border-top-style: solid;
}

/*applied to the Expander's header and its content when it is on the bottom of the header*/
.jqx-expander-header, .jqx-expander-content-bottom {
    border-bottom-width: 1px;
    border-bottom-style: solid;
}

/*applied to the Expander's header*/
.jqx-expander-header {
    cursor: pointer;
    overflow: hidden;
}

/*applied to the Expander's header when the expander is disabled or the toggleMode is "none"*/
.jqx-expander-header-disabled {
    cursor: default;
}

/*applied to the Expander's arrow*/
.jqx-expander-arrow {
    width: 17px;
    height: 17px;
    position: relative;
}

/*applied to the Expander's content if it is empty*/
.jqx-expander-content-empty {
    border-width: 0px;
    padding: 0px;
}

/*applied to jqxNavigationBar. The NavigationBar internally uses jqxExpander's classes and inherits all header and content style settings from the Expander.*/
.jqx-navigationbar {
    border: none;
    margin: 0px;
    -webkit-appearance: none;
    outline: none;
}

/*jqxPanel Style*/
.jqx-panel {
    border: 1px solid transparent;
    -webkit-appearance: none;
    outline: none;
    padding: 0px;
    margin: 0px;
    cursor: default;
    overflow: hidden;
}

/*applied to the Panel's element displayed when the horizontal and vertical scrollbars are visible and the element is positioned below the vertical scrollbar and on the right
of the horizontal scrollbar.*/
.jqx-panel-bottomright {
}

/*applied to the DropDownButton's Popup.*/
.jqx-dropdownbutton-popup {
    -webkit-appearance: none;
    outline: none;
    border: 1px solid transparent;
}

.jqx-listbox {
    -webkit-appearance: none;
    outline: none;
    border: 1px solid transparent;
    padding: 0px;
    margin: 0px;
    cursor: default;
    overflow: hidden;
}

/*applied to the ListBox's element displayed when the horizontal and vertical scrollbars are visible and the element is positioned below the vertical scrollbar and on the right
of the horizontal scrollbar.*/
.jqx-listbox-bottomright {
}

/*applied to the ListBox's groups.*/
.jqx-listitem-state-group {
    white-space: nowrap;
    padding: 5px 2px 5px 2px;
    background: transparent;
    font-weight: bold;
    text-align: left;
    outline: none;
    overflow: hidden;
    vertical-align: middle;
    cursor: default;
}

/*applied to a list item in default state.*/
.jqx-listitem-state-normal {
    white-space: nowrap;
    padding: 3px;
    padding-top: 5px;
    padding-bottom: 5px;
    border: 1px solid transparent;
    outline: none;
    visibility: inherit;
    display: inherit;
    text-align: left;
    overflow: hidden;
    position: absolute;
    left: 0;
    top: 0;
    cursor: default;
}

/*applied to a list item in hovered state.*/
.jqx-listitem-state-hover {
    white-space: nowrap;
    background: transparent;
    padding: 3px 3px 3px 3px;
    padding-top: 5px;
    padding-bottom: 5px;
    border: 1px solid transparent;
}

/*applied to a list item when the item is selected.*/
.jqx-listitem-state-selected {
    white-space: nowrap;
    padding: 3px 3px 3px 3px;
    padding-top: 5px;
    padding-bottom: 5px;
    border: 1px solid transparent;
}

.jqx-listbox-feedback {
    height: 1px;
    border-top: 1px dashed #000;
}

.jqx-listitem-element {
    -ms-touch-action: none;
    border: none;
    width: 100%;
    height: 100%;
    align: left;
    valign: top;
    position: absolute;
}

/*jqxComboBox Style*/
/*applied to the jqxComboBox's content which displays the text.*/
.jqx-combobox-content {
    padding: 0px;
    overflow: hidden;
    padding-left: 0px;
    padding-top: 0px;
    padding-bottom: 0px;
    padding-right: 0px;
    margin: 0px;
    text-align: left;
    vertical-align: middle;
    white-space: nowrap;
    -webkit-appearance: none;
    outline: none;
    border: none;
    -moz-border-radius-topleft: 3px;
    -webkit-border-top-left-radius: 3px;
    border-top-left-radius: 3px;
    -moz-border-radius-bottomleft: 3px;
    -webkit-border-bottom-left-radius: 3px;
    border-bottom-left-radius: 3px;
    border-right: 1px solid transparent;
    -moz-background-clip: padding;
    background-clip: padding-box;
    -webkit-background-clip: padding-box;
}

.jqx-combobox-content-rtl {
    border: none;
    -moz-border-radius-topleft: 0px;
    -webkit-border-top-left-radius: 0px;
    border-top-left-radius: 0px;
    -moz-border-radius-bottomleft: 0px;
    -webkit-border-bottom-left-radius: 0px;
    border-bottom-left-radius: 0px;
    -moz-border-radius-topleft: 3px;
    -webkit-border-top-left-radius: 0px;
    border-top-right-radius: 3px;
    -moz-border-radius-bottomright: 3px;
    -webkit-border-bottom-right-radius: 0px;
    border-bottom-right-radius: 3px;
    border-right: none;
    border-left: 1px solid transparent;
    -moz-background-clip: padding;
    background-clip: padding-box;
    -webkit-background-clip: padding-box;
}

/*applied to the ComboBox's input field.*/
.jqx-combobox-input {
    -webkit-appearance: none;
    -webkit-border-radius: 0px;
    padding: 0 0 0 0;
    outline: none;
    border: 0px solid #aaa;
    -moz-background-clip: padding;
    background-clip: padding-box;
    -webkit-background-clip: padding-box;
}

.jqx-combobox-input::-ms-clear {
    display: none;
}

/*applied to the ComboBox's content when the widget is disabled.*/
.jqx-combobox-content-disabled {
    color: #AAA;
}

/*applied to the ComboBox's arrow button.*/
.jqx-combobox-arrow-normal, .jqx-action-button {
    -webkit-appearance: none;
    outline: none;
    overflow: hidden;
    margin: 0 0 0 0;
    border: none;
    cursor: pointer;
}

/*applied to the ComboBox's arrow button*/
.jqx-combobox-arrow-hover, .jqx-combobox-arrow-selected {
    -webkit-appearance: none;
    outline: none;
    overflow: hidden;
    margin: 0 0 0 0;
}

/*applied to the ComboBox in normal state.*/
.jqx-combobox-state-normal {
    -webkit-appearance: none;
    outline: none;
    border: 1px solid transparent;
    overflow: hidden;
    margin: 0 0 0 0;
}

/*applied to the ComboBox when the mouse is over the widget.*/
.jqx-combobox-state-hover {
    overflow: hidden;
    border: 1px solid transparent;
    margin: 0 0 0 0;
}

/*applied to the ComboBox when the popup ListBox is shown.*/
.jqx-combobox-state-selected {
    overflow: hidden;
    border: 1px solid transparent;
    margin: 0 0 0 0;
}

/*applied to the ComboBox when the widget is focused.*/
.jqx-combobox-state-focus {
    border: 1px solid transparent;
}

.jqx-combobox-multi-item {
    padding: 1px 3px;
    margin: 2px;
    white-space: nowrap;
    border-style: solid;
    font-weight: normal;
    overflow: hidden;
    text-align: left;
}

.jqx-combobox-multi-item a:link, .jqx-combobox-multi-item a:visited {
    color: inherit;
    display: block;
    outline: 0 none;
    text-decoration: none;
    cursor: pointer;
}

/*applied to the ComboBox when the widget is disabled.*/
.jqx-combobox-state-disabled {
    white-space: nowrap;
    margin: 0px;
    color: #AAA;
}

/*jqxSelect Style*/
.jqx-select {
    overflow: hidden;
    padding-left: 3px;
    padding-top: 0px;
    padding-bottom: 0px;
    margin: 0px;
    -webkit-appearance: none;
    outline: 0 none;
}

.jqx-select-content {
    cursor: pointer;
    text-overflow: ellipsis;
}

.jqx-select-container {
    padding: 0;
}

.jqx-select-item {
    padding: 3px;
    margin: 1px;
    white-space: normal !important;
    cursor: default;
}

/*jqxDropDownList Style*/
/*applied to the dropdownlist's content element which displays the selected item's text or html.*/
.jqx-dropdownlist-content {
    padding: 0px;
    overflow: hidden;
    padding-left: 4px;
    padding-top: 0px;
    padding-bottom: 0px;
    margin: 0px;
    text-align: left;
    vertical-align: middle;
    white-space: nowrap;
    -webkit-appearance: none;
    outline: 0 none;
    border: none;
}

.jqx-dropdownlist-content-rtl {
    padding-left: 0px;
    padding-right: 3px;
}

.jqx-dropdownlist .jqx-icon-arrow-down {
    width: 13px;
}

.jqx-dropdownlist .jqx-icon-arrow-up {
    width: 13px;
}

.jqx-combobox .jqx-icon-arrow-down {
    width: 13px;
}

.jqx-combobox .jqx-icon-arrow-up {
    width: 13px;
}

/*applied to the dropdownlist's content element which displays the selected item's text or html and the widget is disabled. */
.jqx-dropdownlist-content-disabled {
}

/*applied to the dropdownlist in default state.*/
.jqx-dropdownlist-state-normal {
    -webkit-appearance: none;
    outline: none;
    border: 1px solid transparent;
    overflow: hidden;
    margin: 0 0 0 0;
    cursor: pointer;
}

/*applied to the dropdownlist in hovered state.*/
.jqx-dropdownlist-state-hover {
    overflow: hidden;
    border: 1px solid transparent;
    margin: 0 0 0 0;
    cursor: pointer;
}

/*applied to the dropdownlist in selected state.*/
.jqx-dropdownlist-state-selected {
    overflow: hidden;
    background-color: transparent;
    border: 1px solid transparent;
    margin: 0 0 0 0;
    cursor: pointer;
}

/*applied to the dropdownlist in focused state.*/
.jqx-dropdownlist-state-focus {
    border: 1px solid #909090;
}

/*applied to the dropdownlist in disabled state.*/
.jqx-dropdownlist-state-disabled {
}

/*jqxScrollBar Style*/
.jqx-scrollbar {
    background: transparent;
    margin: 0;
    padding: 0;
    border: none;
}

/*applied to the scrollbar in default state.*/
.jqx-scrollbar-state-normal {
    background: #efefef;
    margin: 0px;
    padding: 0px;
    border: 1px solid transparent;
}

/*applied to the scrollbar buttons in default state.*/
.jqx-scrollbar-button-state-normal {
    margin: 0px;
    padding: 0px;
    border: 1px solid transparent;
}

/*applied to the scrollbar buttons in hovered state.*/
.jqx-scrollbar-button-state-hover {
    margin: 0px;
    padding: 0px;
    border: 1px solid transparent;
}

/*applied to the scrollbar buttons in pressed state.*/
.jqx-scrollbar-button-state-pressed {
    margin: 0px;
    padding: 0px;
    border: 1px solid transparent;
}

/*applied to the horizontal scrollbar thumb in default state.*/
.jqx-scrollbar-thumb-state-normal-horizontal {
    margin: 0px;
    padding: 0px;
    background: transparent;
    border: 1px solid transparent;
    touch-action: none;
}

/*applied to the horizontal scrollbar thumb in hovered state.*/
.jqx-scrollbar-thumb-state-hover-horizontal {
    margin: 0px;
    padding: 0px;
    border: 1px solid transparent;
}

/*applied to the horizontal scrollbar thumb in default state.*/
.jqx-scrollbar-thumb-state-pressed-horizontal {
    margin: 0px;
    padding: 0px;
    border: 1px solid transparent;
}

/*applied to the vertical scrollbar thumb in default state.*/
.jqx-scrollbar-thumb-state-normal {
    margin: 0px;
    padding: 0px;
    border: 1px solid transparent;
    touch-action: none;
}

/*applied to the vertical scrollbar thumb in default state.*/
.jqx-scrollbar-thumb-state-hover {
    margin: 0px;
    padding: 0px;
    background: transparent;
    border: 1px solid transparent;
}

/*applied to the vertical scrollbar thumb in default state.*/
.jqx-scrollbar-thumb-state-pressed {
    margin: 0px;
    padding: 0px;
    background: #d1d1d1;
    border: 1px solid #909090;
}

/* jqxWindow */
.jqx-window {
    position: absolute;
    overflow: hidden;
    border: 1px solid transparent;
}

/*applied to the jqxWindow when itâ€™s disabled*/
.jqx-window-disabled {
}

/*applied to the windowâ€™s header*/
.jqx-window-header {
    outline: none;
    border-width: 0px;
    border-bottom: 1px solid transparent;
    overflow: hidden;
    padding: 7px;
    height: auto;
    white-space: nowrap;
    overflow: hidden;
}

/*applied to the windowâ€™s header when the window is disabled*/
.jqx-window-header-disabled {
}

/*applied to the windowâ€™s content*/
.jqx-window-content {
    outline: none;
    overflow: auto;
    text-align: left;
    background-color: transparent;
    padding: 5px;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
}

/*applied to the windowâ€™s content when the window is disabled*/
.jqx-window-content-disabled {
    outline: none;
    overflow: auto;
    text-align: left;
    padding: 5px;
}

/*applied to the windowâ€™s close button*/
.jqx-window-close-button {
    cursor: pointer;
    background-image: url(./images/close.png);
    background-repeat: no-repeat;
    margin-top: 2px;
}

/*applied to the window's collapse button*/
.jqx-window-collapse-button {
    background-image: url(./images/icon-up.png);
    cursor: pointer;
    margin-top: 3px;
}

/*applied to the window's collapse button when the window is collapsed*/
.jqx-window-collapse-button-collapsed {
    margin-top: 3px;
    cursor: pointer;
    background-image: url(./images/icon-down.png);
}

/*setting styles of the modal windowâ€™s background*/
.jqx-window-modal {
    background-color: Black;
}

.jqx-window-close-button-hover {
}

.jqx-docking {
    overflow: hidden;
}

.jqx-docking-panel {
    margin: 0px;
    padding: 0px;
    min-height: 100px;
}

.jqx-docking-drop-indicator {
    border-style: dashed;
    border-width: 1px;
    margin: 0px;
}

.jqx-docking-window {
    margin: 0px;
}

/* jxSlider */
/* applied to jqxSlider widget */
.jqx-slider {
    outline: none;
    clear: both;
    position: relative;
    overflow: hidden;
}

/*applied to the ticks which can be in the top/bottom/both sides of the jqxSlider*/
.jqx-slider-tick {
    border-left: 1px solid transparent;
    z-index: 9;
}

/*applied to the ticks when the slider is in horizontal mode*/
.jqx-slider-tick-horizontal {
    width: 1px;
    border-left: none;
    margin-top: 1px;
}

/*applied to the ticks when the slider is in vertical mode*/
.jqx-slider-tick-vertical {
    height: 1px;
    border-top: none;
}

/*applied to the ticks container*/
.jqx-slider-tickscontainer {
    z-index: 10;
    position: relative;
    margin-top: 0px;
    margin-bottom: 0px;
    z-index: 9;
}

/*applied to the jqxSlider thumb used for changing/indicating current value*/
.jqx-slider-slider {
    cursor: pointer;
    width: 20px;
    height: 20px;
    z-index: 15;
    position: absolute;
    left: 0px;
    top: 0px;
    -moz-border-radius: 100%;
    -webkit-border-radius: 100%;
    border-radius: 100%;
}

.jqx-slider-button {
    cursor: pointer;
    -moz-border-radius: 100%;
    -webkit-border-radius: 100%;
    border-radius: 100%;
    box-sizing: content-box !important;
    padding: 3px !important;
}

/*applied to the slider's thumb when the slider is in horizontal mode*/
.jqx-slider-slider-horizontal {
    margin-top: -9px;
    -moz-border-radius: 100%;
    -webkit-border-radius: 100%;
    border-radius: 100%;
    border: 1px solid transparent;
}

/*applied to the slider's thumb when the slider is in vertical mode*/
.jqx-slider-slider-vertical {
    margin-left: -9px;
    -moz-border-radius: 100%;
    -webkit-border-radius: 100%;
    border-radius: 100%;
    border: 1px solid transparent;
}

/*applied to the track where is located the thumb*/
.jqx-slider-track {
    height: 4px;
    float: left;
    position: relative;
    z-index: 20;
    cursor: pointer;
}

/*used in horizontal slider*/
.jqx-slider-track-horizontal {
    height: 4px;
    margin-top: 2px;
}

/*used in vertical slider*/
.jqx-slider-track-vertical {
    width: 4px;
}

/*applied to the div which is between the thumbs in a range slider or from beginning of the track to the current thumb position in the default slider*/
.jqx-slider-rangebar {
}

/* jqxSplitter */
.jqx-splitter {
    overflow: hidden;
    border: 1px solid transparent;
    position: relative;
}

/* Split bar's class when the jqxSplitter is with horizontal orientation */
.jqx-splitter-splitbar-vertical {
    border: 1px solid transparent;
    border-top-width: 0px;
    border-bottom-width: 0px;
    cursor: e-resize;
    cursor: col-resize;
    position: absolute;
}

/* Split bar's mouse over state */
.jqx-splitter-splitbar-hover {
    background-color: transparent;
}

/* Split bar's class when the jqxSplitter is with horizontal orientation. */
.jqx-splitter-splitbar-horizontal {
    position: absolute;
    border: 1px solid transparent;
    border-left-width: 0px;
    border-right-width: 0px;
    cursor: n-resize;
    cursor: row-resize;
}

/* This class is applied to the splitter when it's dragged to it's max left/right boundary */
.jqx-splitter-splitbar-invalid {
    background: #FF0000 !important;
}

/* This class is added to split bar's collapse button when the splitter is with vectical orientation. */
.jqx-splitter-collapse-button-horizontal {
    cursor: pointer;
    width: 45px;
    height: 5px;
}

/* This class is added to split bar's collapse button when the splitter is with horizontal orientation. */
.jqx-splitter-collapse-button-vertical {
    cursor: pointer;
    width: 5px;
    height: 45px;
}

/* This class is added when the user disable the splitter. */
.jqx-splitter-splitbar-collapsed {
    cursor: default;
}

/* Applied to the jqxSplitter panels. */
.jqx-splitter-panel {
    border: none;
    outline: none;
    position: absolute;
    overflow: hidden;
}

/* This class is added to a nested splitter.*/
.jqx-splitter-nested, .jqx-splitter-panel-nested {
    border: none;
    overflow: hidden;
}

.jqx-draggable {
}

.jqx-draggable-dragging {
    border: 0px solid black;
}

.jqx-draggable-disabled {
    cursor: default;
}

.jqx-validator-hint {
    height: 18px;
    width: auto;
    display: inline-block;
    cursor: pointer;
    padding-left: 5px;
    padding-right: 5px;
    font-family: Verdana;
    font-size: 13px;
    border: 1px solid #6E0000;
    background-color: #942724;
    color: #fff;
    z-index: 99999;
    white-space: nowrap;
}

.jqx-validator-hint-arrow {
    z-index: 99999;
    height: 9px;
    width: 9px;
    padding: 0px;
    margin: 0px;
    background-color: transparent;
    background-image: url(./images/multi-arrow.gif);
}

.jqx-validator-error-label {
    color: #dd4b39;
    vertical-align: top;
    text-align: left;
    display: block;
    cursor: default;
    line-height: 17px;
}

.jqx-validator-error-element {
    border-color: #dd4b39 !important;
}

.jqx-switchbutton {
    outline: none;
    overflow: hidden;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 1px solid #ccc;
}

.jqx-switchbutton[aria-disabled="true"] {
    opacity: 0.5;
    pointer-events: none;
}

.jqx-switchbutton-thumb {
    display: inline-block;
    cursor: pointer;
    border: 1px solid #ccc;
}

.jqx-switchbutton-label {
    font-size: 15px;
    font-family: Sans-Serif;
    text-align: center;
    text-transform: uppercase;
    font-weight: bold;
}

.jqx-switchbutton-wrapper {
}

.jqx-switchbutton-label-on {
}

.jqx-switchbutton-label-off {
}

/*left, right, up and down arrow icons.*/
.jqx-left-arrow {
    background: transparent;
    background-image: url('images/icon-left.png');
    cursor: pointer;
}

.jqx-right-arrow {
    background: transparent;
    background-image: url('images/icon-right.png');
    cursor: pointer;
}

.jqx-icon-delete {
    background-image: url('images/icon-delete.png');
    background-repeat: no-repeat;
    background-position: center;
}

.jqx-icon-edit {
    background-image: url('images/icon-edit.png');
    background-repeat: no-repeat;
    background-position: center;
}

.jqx-icon-save {
    background-image: url('images/icon-save.png');
    background-repeat: no-repeat;
    background-position: center;
}

.jqx-icon-cancel {
    background-image: url('images/icon-cancel.png');
    background-repeat: no-repeat;
    background-position: center;
}

.jqx-icon-arrow-up, .jqx-icon-arrow-up-hover, .jqx-icon-arrow-up-selected {
    background-image: url('images/icon-up.png');
    background-repeat: no-repeat;
    background-position: center;
}

.jqx-icon-arrow-down, .jqx-icon-arrow-down-hover, .jqx-icon-arrow-down-selected {
    background-image: url('images/icon-down.png');
    background-repeat: no-repeat;
    background-position: center;
}

.jqx-icon-arrow-left, .jqx-icon-arrow-left-hover, .jqx-icon-arrow-left-selected {
    background-image: url('images/icon-left.png');
    background-repeat: no-repeat;
    background-position: center;
}

.jqx-icon-arrow-right, .jqx-icon-arrow-right-hover, .jqx-icon-arrow-right-selected {
    background-image: url('images/icon-right.png');
    background-repeat: no-repeat;
    background-position: center;
}

.jqx-icon-arrow-first, .jqx-icon-arrow-first-hover, .jqx-icon-arrow-first-selected {
    background-image: url('images/icon-first.png');
    background-repeat: no-repeat;
    background-position: center;
}

.jqx-icon-arrow-last, .jqx-icon-arrow-last-hover, .jqx-icon-arrow-last-selected {
    background-image: url('images/icon-last.png');
    background-repeat: no-repeat;
    background-position: center;
}

.jqx-icon-arrow-up-hover {
    background-image: url('images/icon-up.png');
    background-repeat: no-repeat;
    background-position: center;
}

.jqx-icon-arrow-down-hover {
    background-image: url('images/icon-down.png');
    background-repeat: no-repeat;
    background-position: center;
}

.jqx-icon-arrow-left-hover {
    background-image: url('images/icon-left.png');
    background-repeat: no-repeat;
    background-position: center;
}

.jqx-icon-arrow-right-hover {
    background-image: url('images/icon-right.png');
    background-repeat: no-repeat;
    background-position: center;
}

.jqx-icon-arrow-up-selected {
    background-image: url('images/icon-up.png');
    background-repeat: no-repeat;
    background-position: center;
}

.jqx-icon-arrow-down-selected {
    background-image: url('images/icon-down.png');
    background-repeat: no-repeat;
    background-position: center;
}

.jqx-icon-arrow-left-selected {
    background-image: url('images/icon-left.png');
    background-repeat: no-repeat;
    background-position: center;
}

.jqx-icon-arrow-right-selected {
    background-image: url('images/icon-right.png');
    background-repeat: no-repeat;
    background-position: center;
}

.jqx-icon-close {
    cursor: pointer;
    background-image: url(./images/close.png);
    background-repeat: no-repeat;
    background-position: center;
}

.jqx-icon-close-white {
    background-image: url(./images/close_white.png);
}

.jqx-icon-close-hover {
    cursor: pointer;
    background-image: url(./images/close.png);
    background-repeat: no-repeat;
    background-position: center;
}

.jqx-icon-search {
    cursor: pointer;
    background-image: url(./images/search.png);
    background-repeat: no-repeat;
    background-position: center;
    margin-top: 1px;
    background-size: 13px;
    width: 13px;
    height: 13px;
}

.jqx-icon-plus {
    background-image: url(./images/plus.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 16px;
    width: 16px;
    height: 16px;
}

.jqx-icon-plus-alt, .jqx-icon-plus-alt-white {
    background-image: url(./images/icon-plus.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 16px;
    width: 16px;
    height: 16px;
}

.jqx-icon-plus-alt-white {
    background-image: url(./images/icon-plus-white.png);
}

/* jqxScrollView */
.jqx-scrollview-button {
    width: 10px;
    height: 10px;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    display: inline-block;
    margin: 2px;
    cursor: pointer;
    background-color: #aaaeaf;
}

.jqx-scrollview {
    background-color: #000;
    -ms-touch-action: auto !important;
}

.jqx-icon-calendar, .jqx-icon-calendar-hover, .jqx-icon-calendar-pressed {
    background-image: url('images/icon-calendar.png');
    background-repeat: no-repeat;
    background-position: left top;
    position: relative;
    width: 15px !important;
    height: 15px !important;
    margin-top: -7.5px !important;
}

/*applied to Inputs*/
.jqx-input-widget {
    box-sizing: border-box !important;
}

.jqx-input {
    overflow: hidden;
    background-color: inherit;
    border-color: #c7c7c7;
}

.jqx-input-invalid {
    color: red !important;
}

.jqx-input-group {
    overflow: hidden;
}

.jqx-input-group-addon {
    border: 1px solid transparent;
    position: relative;
    -webkit-box-sizing: border-box !important;
    -moz-box-sizing: border-box !important;
    box-sizing: border-box !important;
    padding: 2px 8px !important;
    float: left;
    white-space: nowrap;
    vertical-align: middle;
}

.jqx-input-group-addon:first-child {
    border-right-width: 0px;
    border-bottom-right-radius: 0 !important;
    border-top-right-radius: 0 !important;
}

.jqx-input-group-addon:last-child {
    border-left-width: 0px;
    border-bottom-left-radius: 0 !important;
    border-top-left-radius: 0 !important;
}

.jqx-input-group-addon:not(:last-child):not(:first-child) {
    border-bottom-left-radius: 0 !important;
    border-top-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    border-top-right-radius: 0 !important;
    border-left-width: 0px;
}

.jqx-input-group .jqx-input {
    padding: 2px 1px !important;
    border-left-width: 1px !important;
    border-right-width: 1px !important;
}

.jqx-editor {
    border-style: solid;
    border-width: 1px;
    border-color: transparent;
    overflow: hidden;
    box-sizing: border-box !important;
}

.jqx-editor-window {
    overflow: hidden;
}

.jqx-editor-inline {
    padding: 0px;
    border-width: 1px;
    border-style: solid;
    border-color: transparent;
}

.jqx-editor-inline p {
    margin: 0px;
    padding: 0 .2em;
}

.jqx-editor-inline-focus {
    border-width: 1px;
    border-style: solid;
    overflow: auto;
}

.jqx-editor iframe {
    border: 0;
    margin: 0;
    padding: 0;
    background: #fff;
    display: inline;
    vertical-align: top;
    width: 100%;
    height: 100%;
}

.jqx-editor-color-bar {
    height: 3px;
}

.jqx-editor-color-picker table {
    margin: 0;
    padding: 0 4px 4px;
    empty-cells: show;
    border-collapse: separate;
}

.jqx-editor-color-picker td {
    border-collapse: separate;
    border: 1px solid transparent;
    cursor: pointer;
    margin: 0;
    position: relative;
}

.jqx-editor-color-picker td:hover {
    border: 1px solid #000;
}

.jqx-editor-color-picker-selected-cell {
    outline: 1px solid #000;
}

.jqx-editor-color-picker td div {
    width: 16px;
    height: 16px;
}

.jqx-editor-content {
    width: 100%;
    border-style: solid;
    border-width: 1px;
    outline: 0;
    left: 0px;
    position: relative;
    box-sizing: border-box !important;
}

.jqx-editor-container {
    position: relative;
    padding: 4px;
    padding-top: 0px;
    width: 100%;
    height: 100%;
    box-sizing: border-box !important;
}

.jqx-editor-toolbar-container {
    top: 0px;
    left: 0px;
    box-sizing: border-box !important;
}

.jqx-editor-toolbar-inline {
    padding: 0px 4px;
    border-width: 1px;
    border-style: solid;
}

.jqx-editor-toolbar {
    margin: 0;
    padding: 0px;
    padding-bottom: 4px;
}

.jqx-editor-toolbar-icon {
    height: 21px;
    width: 21px;
    vertical-align: middle;
    opacity: .667;
    margin: 2px 0;
    background: url('images/html_editor.png') no-repeat;
}

.jqx-editor-toolbar-icon-bold {
    background-position: 0px 0px !important;
}

.jqx-editor-toolbar-icon-italic {
    background-position: -21px 0px !important;
}

.jqx-editor-toolbar-icon-underline {
    background-position: -42px 0px !important;
}

.jqx-editor-toolbar-icon-fontname {
    background-position: -63px 0px !important;
}

.jqx-editor-toolbar-icon-fontsize {
    background-position: -84px 0px !important;
}

.jqx-editor-toolbar-icon-createlink {
    background-position: -147px 0px !important;
}

.jqx-editor-toolbar-icon-insertorderedlist {
    background-position: -168px 0px !important;
}

.jqx-editor-toolbar-icon-insertunorderedlist {
    background-position: -189px 0px !important;
}

.jqx-editor-toolbar-icon-outdent {
    background-position: -210px 0px !important;
}

.jqx-editor-toolbar-icon-indent {
    background-position: -231px 0px !important;
}

.jqx-editor-toolbar-icon-insertimage {
    background-position: -337px 0px !important;
}

.jqx-editor-toolbar-icon-justifyleft {
    background-position: -252px 0px !important;
}

.jqx-editor-toolbar-icon-justifycenter {
    background-position: -273px 0px !important;
}

.jqx-editor-toolbar-icon-justifyright {
    background-position: -294px 0px !important;
}

.jqx-editor-toolbar-icon-removeformat {
    background-position: -316px 0px !important;
}

.jqx-editor-toolbar-icon-viewsource {
    background-position: -359px 0px !important;
}

.jqx-editor-toolbar-icon-forecolor {
    background-position: -105px 0px !important;
    height: 15px;
}

.jqx-editor-toolbar-icon-backcolor {
    background-position: -380px 0px !important;
    height: 15px;
}

.jqx-editor-toolbar-icon:hover {
    opacity: 1;
}

.jqx-fill-state-disabled .jqx-editor-toolbar-icon {
    opacity: .667;
}

.jqx-editor-toolbar-item {
    display: inline-block;
    margin-left: 2px;
    vertical-align: middle;
}

.jqx-editor-toolbar-separator {
    border-left: 1px solid #ccc;
    margin: 0 2px;
    outline: none;
    overflow: hidden;
    padding: 0;
    text-decoration: none;
    vertical-align: middle;
    width: 0;
    display: inline-block;
}

.jqx-editor-toolbar-group {
    display: inline-block;
    margin-right: 4px;
    margin-top: 4px;
    white-space: nowrap;
}

.jqx-editor-toolbar-button {
    text-decoration: none;
    vertical-align: middle;
    cursor: default;
    display: inline-block;
    padding: 0px !important;
    margin-right: 2px;
}

.jqx-editor-toolbar-group .jqx-editor-toolbar-button {
    margin-right: -1px;
    box-shadow: none;
    position: relative;
    margin-left: 0px !important;
}

.jqx-editor-toolbar-group .jqx-editor-toolbar-button:hover, .jqx-editor-toolbar-group .jqx-editor-toolbar-button:active {
    z-index: 55;
}

.jqx-editor-toolbar-group .jqx-editor-toolbar-button.jqx-fill-state-normal {
    background: transparent !important;
}

.jqx-date-time-input-popup table td a {
    border: 1px transparent solid;
    width: 100%;
    display: inline-block;
    margin: 0;
    padding: 0;
    outline: 0;
    color: #333;
}

.jqx-date-time-input-popup table td input {
    width: 25px;
    margin: 0;
    text-align: center;
    padding: 4px 6px;
    height: 20px;
    line-height: 20px;
    vertical-align: middle;
}

.jqx-scheduler .jqx-cell {
    padding: 0px !important;
    cursor: default;
}

.jqx-scheduler .jqx-widget-header.jqx-grid-header {
    border-bottom-color: transparent;
    border-bottom-width: 0px;
}

.jqx-scheduler .jqx-grid-column-header, .jqx-scheduler.jqx-widget .jqx-grid-column-header {
    border-bottom: 1px solid #c5c5c5;
}

.jqx-grid-column-header[sort] > div > div {
    width: calc(100% - 20px);
}

.jqx-grid-column-header[filter] > div > div {
    width: calc(100% - 20px);
}

.jqx-grid-column-header[filter][sort] > div > div {
    width: calc(100% - 40px);
}

.jqx-scheduler-all-day-cell {
    text-align: left;
}

.jqx-scheduler-all-day-cell span {
    margin-left: 3px;
}

.jqx-scheduler-month-cell {
    background: #f2f2f2;
    color: #000;
    opacity: 0.8;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: inherit;
    vertical-align: top;
    text-align: left;
}

.jqx-scheduler-month-cell-touch {
    background: transparent;
    border: none;
    vertical-align: middle;
    text-align: center;
}

.jqx-scheduler-month-cell-popup {
    border: 1px solid #333;
    background: #f2f2f2;
    box-shadow: 0 5px 0px rgba(0, 0, 0, .15) !important;
}

.jqx-widget .jqx-scheduler-middle-cell, .jqx-scheduler-middle-cell {
    border-bottom-color: #ddd !important;
}

.jqx-scheduler-cell-selected.jqx-scheduler-middle-cell {
    border-bottom-style: dotted;
}

.jqx-scheduler-work-time-cell {
    background: #fff;
}

.jqx-scheduler-not-work-time-cell {
    background: #eee;
}

.jqx-scheduler-month-outer-cell {
    color: #555;
}

.jqx-scheduler-month-weekend-cell {
    background: #eee;
}

.jqx-scheduler-disabled-cell {
    background: #e9edf1;
}

.jqx-scheduler-toolbar {
    font-size: 14px;
}

.jqx-scheduler-time-column, .jqx-scheduler-toolbar {
    background-image: none !important;
    background: #fff !important;
    color: #333 !important;
}

.jqx-scheduler-week-number-column {
    background: #e8e8e8 !important;
    color: #333;
}

.jqx-scheduler-time-column-header-cell {
    border-left-color: transparent !important;
}

.jqx-scheduler-time-column-header-cell-rtl {
    border-right-color: transparent !important;
}

.jqx-scheduler-appointment {
    overflow: visible;
    border: 1px solid #555;
    white-space: pre-line;
    cursor: pointer;
    vertical-align: middle;
    text-overflow: ellipsis;
    user-select: none;
}

.jqx-scheduler-appointment-rtl {
    direction: rtl;
    text-align: right;
}

.jqx-scheduler-appointment-content {
    overflow: hidden;
    text-overflow: ellipsis;
    height: 100%;
    padding-left: 5px;
    padding-right: 5px;
}

.jqx-scheduler-appointment-inner-content {
    overflow: hidden;
    width: 100%;
    text-overflow: ellipsis;
    padding-bottom: 3px;
}

.jqx-scheduler-appointment-duration-status {
    height: 0px;
    border-bottom-width: 2px;
    border-bottom-style: dotted;
    border-color: #f05c2d;
    background: #f05c2d;
    position: absolute;
    bottom: -1px;
    left: 0px;
    border-radius: 5px;
}

.jqx-scheduler-appointment-status {
    width: 4px;
    height: 100%;
    border-right-width: 1px;
    border-right-style: solid;
    position: absolute;
    top: 0px;
    left: 0px;
}

.jqx-scheduler-appointment-status-rtl {
    width: 4px;
    height: 100%;
    border-right-width: 0px;
    border-right-style: none;
    border-left-width: 1px;
    border-left-style: solid;
    position: absolute;
    top: 0px;
    right: 0px;
}

.jqx-scheduler-appointment-status-stripes {
    background-image: url('images/stripes.png');
    background-repeat: repeat-y;
    background-position: left top;
}

.jqx-scheduler-appointment-resize-indicator {
    width: 4px;
    height: 4px;
    position: absolute;
    border: 1px solid black;
    background: white;
    display: none;
}

.jqx-scheduler-appointment-top-resize-indicator {
    top: -3px;
    left: 50%;
    margin-left: -2px;
    cursor: row-resize;
}

.jqx-scheduler-appointment-bottom-resize-indicator {
    cursor: row-resize;
    bottom: -3px;
    left: 50%;
    margin-left: -2px;
}

.jqx-scheduler-appointment-left-resize-indicator {
    cursor: col-resize;
    top: 50%;
    left: -3px;
    margin-top: -2px;
}

.jqx-scheduler-appointment-right-resize-indicator {
    cursor: col-resize;
    top: 50%;
    margin-top: -2px;
    right: -3px;
}

.jqx-scheduler-appointment span {
    vertical-align: middle;
    text-overflow: ellipsis;
    position: relative;
    top: -1px;
}

.jqx-scheduler-feedback-appointment {
    opacity: 0.7;
    position: absolute;
    z-index: 99999;
}

.jqx-scheduler-selected-appointment {
    border: 1px solid #316293 !important;
    -webkit-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05) !important;
    -moz-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05) !important;
    box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05) !important;
    white-space: pre-line;
}

.jqx-scheduler-appointment:hover {
    border: 1px solid #3f7ebe !important;
}

.jqx-scheduler-feedback-drag-appointment {
    background: #aaa !important;
}

.jqx-icon-recurrence, .jqx-icon-recurrence-exception, .jqx-icon-recurrence-white, .jqx-icon-recurrence-exception-white, .jqx-icon-time {
    background-image: url('images/icon-recurrence.png');
    background-repeat: no-repeat;
    background-position: center;
    width: 16px;
    height: 16px;
    float: left;
    margin: 3px;
    margin-left: 5px;
}

.jqx-icon-time {
    background-image: url('images/icon-time.png');
    margin: 0px;
    position: relative;
    left: 1px;
    margin-top: -8px;
}

.jqx-icon-time-white {
    background-image: url('images/icon-time-white.png');
}

.jqx-icon-recurrence-exception {
    background-image: url('images/icon-recurrence-exception.png');
}

.jqx-icon-recurrence-exception-white {
    background-image: url('images/icon-recurrence-exception-white.png');
}

.jqx-icon-recurrence-white {
    background-image: url('images/icon-recurrence-white.png');
}

.jqx-scheduler-cell-hover {
    border-color: #3f7ebe !important;
    background: #a2c0df !important;
}

.jqx-scheduler-cell-selected {
    border-color: #316293 !important;
    background: #2f7eb6 !important;
}

.jqx-scheduler-edit-dialog-label {
    clear: both;
    float: left;
    margin-left: 2%;
    padding: 4px;
    text-align: right;
    width: 18%;
    line-height: 25px;
}

.jqx-scheduler-edit-dialog-field {
    clear: right;
    float: right;
    margin-right: 2%;
    padding: 4px;
    width: 380px;
}

.jqx-scheduler-edit-dialog-label-rtl {
    clear: both;
    float: right;
    margin-left: 0px;
    margin-right: 2%;
    padding: 4px;
    text-align: left;
    width: 18%;
    line-height: 25px;
}

.jqx-scheduler-edit-dialog-field-rtl {
    clear: left;
    float: left;
    margin-right: 0px;
    margin-left: 2%;
    padding: 4px;
    width: 72%;
}

.jqx-scheduler-legend-bar {
    overflow: hidden;
    border-color: inherit;
    border: none;
}

.jqx-scheduler-legend-bar-bottom {
    border-top-width: 1px;
    border-top-style: solid;
}

.jqx-scheduler-legend-bar-top {
    border-bottom-width: 1px;
    border-bottom-style: solid;
}

.jqx-scheduler-legend {
    width: 14px;
    height: 14px;
    float: left;
    margin-right: 3px;
    border-style: solid;
    border-width: 1px;
    cursor: pointer;
    vertical-align: middle;
    margin-top: 4px;
}

.jqx-scheduler-legend-label {
    float: left;
    margin-right: 12px;
    cursor: pointer;
    vertical-align: middle;
    margin-top: 4px;
}

.jqx-scheduler-cell-selected .jqx-scheduler-agenda-date {
    color: #fff;
}

.jqx-scheduler-cell-selected .jqx-scheduler-agenda-time {
    color: #fff;
}

.jqx-scheduler-cell-selected .jqx-scheduler-agenda-appointment, .jqx-scheduler-cell-selected .jqx-scheduler-agenda-appointment-rtl {
    color: #fff;
}

.jqx-scheduler-agenda-date {
    padding-top: 5px;
    padding-bottom: 5px;
}

.jqx-scheduler-agenda-time {
    padding: 5px;
}

.jqx-scheduler-agenda-appointment, .jqx-scheduler-agenda-appointment-rtl {
    cursor: pointer;
}

.jqx-scheduler-agenda-appointment-resource, .jqx-scheduler-agenda-appointment-resource-rtl {
    margin: 5px;
    cursor: pointer;
}

.jqx-scheduler-agenda-appointment-resource-rtl, .jqx-scheduler-agenda-appointment-rtl {
    float: right;
}

.jqx-scheduler-agenda-day {
    margin: 3px;
    font-size: 33px;
    font-weight: normal;
}

.jqx-scheduler-agenda-week {
    font-style: normal;
    font-size: 13px;
}

.jqx-scheduler-agenda-date {
    font-size: 10px;
}

.jqx-scheduler-cell-focus {
    border-style: dotted;
    border-color: #59a0d5 !important;
    background: #59a0d5 !important;
}

/*applied to all widgets*/
.jqx-widget {
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    -ms-touch-action: none;
    zoom: 1 !important;
    color: #000000;
    -moz-background-clip: padding;
    background-clip: padding-box;
    -webkit-text-size-adjust: none;
    -ms-text-size-adjust: none;
    -webkit-appearance: none;
    -webkit-background-clip: padding-box;
    direction: ltr !important;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    font-family: Verdana, Arial, sans-serif;
    font-style: normal;
    font-size: 13px;
}

.jqx-item {
    -ms-touch-action: none;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    color: inherit;
    -webkit-text-size-adjust: none;
}

/*applied to containers to set a background and border color. Tabs, NavigationBar, Calendar content.*/
.jqx-widget-content {
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    -ms-touch-action: none;
    -moz-background-clip: padding;
    -webkit-text-size-adjust: none;
    background-clip: padding-box;
    -webkit-background-clip: padding-box;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    font-family: Verdana, Arial, sans-serif;
    font-style: normal;
    font-size: 13px;
    border-color: #c7c7c7;
    background: #fff;
}

/*applied to header areas. Tabs, Menu, Window, Calendar.*/
.jqx-widget-header {
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    -ms-touch-action: none;
    -moz-background-clip: padding;
    -webkit-text-size-adjust: none;
    background-clip: padding-box;
    -webkit-background-clip: padding-box;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    border-color: #c5c5c5;
    background: #e8e8e8;
}

.jqx-fill-state-normal {
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    -ms-touch-action: none;
    font-family: Verdana, Arial, sans-serif;
    font-style: normal;
    font-size: 13px;
    border-color: #aaa;
    background: #efefef;
}

.jqx-fill-state-hover {
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    border-color: #999;
    background: #e8e8e8;
}

.jqx-fill-state-pressed {
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    border-color: #999;
    background: #d1d1d1;
}

.jqx-fill-state-focus {
    border-color: #555;
}

.jqx-fill-state-disabled {
    cursor: default;
    color: #000;
    opacity: .55;
    filter: Alpha(Opacity=45);
}

.jqx-grid.jqx-fill-state-disabled {
    pointer-events: none;
}

.jqx-fill-state-normal td, .jqx-fill-state-hover td, .jqx-fill-state-pressed td, .jqx-fill-state-disabled td, .jqx-fill-state-focus td, .jqx-widget td, .jqx-widget-content td, .jqx-widget-header td {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
}

.jqx-widget .jqx-grid-cell, .jqx-widget .jqx-grid-column-header, .jqx-widget .jqx-grid-group-cell {
    border-color: #aaa;
}

.jqx-widget .jqx-grid-column-menubutton, .jqx-widget .jqx-grid-column-sortascbutton, .jqx-widget .jqx-grid-column-sortdescbutton, .jqx-widget .jqx-grid-column-filterbutton {
    background-color: transparent;
    border-color: #aaa;
}

.jqx-grid-column-header a:link, .jqx-grid-column-header a:visited {
}

.jqx-grid-bottomright, .jqx-panel-bottomright, .jqx-listbox-bottomright {
    background-color: #e5e5e5;
}

.jqx-tabs-title-selected-top {
    border-color: #aaa;
    border-bottom: 1px solid #fff;
    background-color: #fff;
}

/*applied to the tab's title when the tab is selected and the jqxTab's position property is set to 'bottom' .*/
.jqx-tabs-title-selected-bottom {
    border-color: #aaa;
    border-top: 1px solid #fff;
    background-color: #fff;
}

/*applied to the tab's selection tracker when the jqxTab's position property is set to 'top'.*/
.jqx-tabs-selection-tracker-top {
    border-color: #aaa;
    border-bottom: 1px solid #fff;
}

/*applied to the tab's selection tracker when the jqxTab's position property is set to 'bottom'.*/
.jqx-tabs-selection-tracker-bottom {
    border-color: #aaa;
    border-top: 1px solid #fff;
}

/*jqxMaskedInput and jqxNumberInput Styles*/
.jqx-input {
    -webkit-appearance: none;
    padding: 0 0 0 0;
    outline: none;
    border-width: 1px;
    border-style: solid;
    -moz-background-clip: padding;
    background-clip: padding-box;
    -webkit-background-clip: padding-box;
}

input[type=text].jqx-input, input[type=password].jqx-input {
    min-height: 16px;
    min-width: 16px;
    margin: 0px;
    border-width: 1px;
    border-style: solid;
    font-size: 13px;
    padding: 3px;
    padding-left: 3px;
    padding-right: 3px;
}

.jqx-input::-ms-reveal {
    display: none;
}

.jqx-input::-ms-clear {
    display: none;
}

.jqx-input-content::-ms-clear {
    display: none;
}

.jqx-input::-ms-value {
    margin: 0px;
    padding: 0px;
    min-height: 13px;
    line-height: 13px;
}

/*applied to the input when the validation fails.*/
.jqx-input-invalid {
    border-color: #dd4b39 !important;
}

/*applied to the input's content.*/
.jqx-input-content {
    -webkit-appearance: none;
    padding: 1px;
    resize: none;
    outline: none;
    outline-width: 0px;
    -webkit-user-modify: inherit;
    -moz-user-modify: inherit;
    -moz-background-clip: padding;
    background-clip: padding-box;
    -webkit-background-clip: padding-box;
}

/*applied to the input when it is disabled.*/
.jqx-input-disabled {
    -webkit-appearance: none;
    resize: none;
    outline: none;
    outline-width: 0px;
}

/*applied to the list menu.*/
.jqx-listmenu-widget {
    -ms-touch-action: auto;
}

.jqx-listmenu-widget .jqx-widget-content {
    -ms-touch-action: auto;
}

.jqx-listmenu-widget .jqx-widget-header {
    -ms-touch-action: auto;
}

.jqx-listmenu-widget li {
    -ms-touch-action: auto;
}

.jqx-menu-popup {
}

.jqx-menu-vertical {
    background-color: #efefef;
}

.jqx-color-picker {
}

.jqx-color-picker-panel {
}

.jqx-color-picker-map {
    border: 1px solid #A0A0A0;
    background-color: transparent;
    background-image: url('images/colorpicker/map-saturation.png');
    background-repeat: no-repeat;
    background-position: left top;
    overflow: hidden;
}

.jqx-color-picker-map-hue {
    border: 1px solid #A0A0A0;
    background-color: transparent;
    background-image: url('images/colorpicker/map-hue.png');
    background-repeat: no-repeat;
    background-position: left top;
    overflow: hidden;
}

.jqx-color-picker-map-overlay {
    background-color: transparent;
    background-image: url('images/colorpicker/map-saturation-overlay.png');
    background-repeat: no-repeat;
    background-position: left top;
}

.jqx-color-picker-bar {
    border: 1px solid #A0A0A0;
    background-color: transparent;
    background-image: url('images/colorpicker/bar-saturation.png');
    background-repeat: no-repeat;
    background-position: left top;
}

.jqx-color-picker-bar-hue {
    border: 1px solid #A0A0A0;
    background-color: transparent;
    background-image: url('images/colorpicker/bar-hue.png');
    background-repeat: no-repeat;
    background-position: left top;
}

.jqx-color-picker-preview {
    border: 1px solid #A0A0A0;
}

.jqx-color-picker-pointer {
    background-image: url('images/crosshair.png');
    background-repeat: no-repeat;
    height: 16px;
    width: 16px;
}

.jqx-color-picker-pointer-alt {
    background-image: url('images/crosshair-white.png');
    background-repeat: no-repeat;
    height: 16px;
    width: 16px;
}

.jqx-color-picker-bar-pointer {
    background-image: url('images/pointer.png');
    background-repeat: no-repeat;
    height: 15px;
    margin-left: 6px;
    background-position: right top;
}

.jqx-icon {
    width: 16px;
    height: 16px;
    margin: 0 auto;
    position: relative;
    top: 50%;
    margin-top: -8px;
}

.jqx-input-icon {
    width: 13px;
    height: 13px;
    margin: 0 auto;
}

.jqx-scrollbar-thumb-state-normal-touch {
    border-color: #c3c3c3;
    background: #c3c3c3;
}

.jqx-touch, .jqx-touch .jqx-fill-state-normal, .jqx-touch .jqx-widget-content, .jqx-touch .jqx-widget-header, .jqx-touch a:link {
}

.jqx-scrollbar .jqx-icon-arrow-up {
    width: 100%;
    height: 100%;
}

.jqx-scrollbar .jqx-icon-arrow-down {
    width: 100%;
    height: 100%;
}

.jqx-scrollbar .jqx-icon-arrow-left {
    width: 100%;
    height: 100%;
}

.jqx-scrollbar .jqx-icon-arrow-right {
    width: 100%;
    height: 100%;
}

/*jqx-listmenu*/
.jqx-listmenu-widget {
    border-width: 1px;
    border-style: solid;
}

ol.jqx-listmenu, ul.jqx-listmenu {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    line-height: 1;
    counter-reset: section;
}

.jqx-listmenu li {
    margin-left: 0px;
    list-style: none;
    line-height: 1;
}

.jqx-listmenu {
    width: 100%;
}

.jqx-listmenu-header {
    padding: 15px;
}

.jqx-listmenu-item {
    cursor: pointer;
    padding: 15px;
    float: none;
    overflow: hidden;
    text-align: left;
    position: relative;
}

.jqx-listmenu-separator {
    padding: 10px;
    counter-reset: section;
}

.jqx-listmenu-header-label {
    margin-left: 30px;
}

.jqx-listmenu-arrow-right {
    width: 16px;
    height: 16px;
    position: absolute;
    top: 50%;
    margin-top: -7px;
    right: 7px;
}

.jqx-listmenu-arrow-rtl {
    right: 0px;
    left: 7px;
}

.jqx-listmenu-arrow-right-pressed {
    width: 16px;
    height: 16px;
}

.jqx-listmenu-header .jqx-button {
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    padding: 6px 10px;
}

.jqx-listmenu-filter-input {
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    border: 1px solid;
    outline: none;
    width: 97%;
    padding: 3px;
    padding-left: 10px;
    padding-right: 10px;
    border-color: #c7c7c7;
    background-color: #fff;
    font-size: 20px;
    min-height: 25px !important;
    height: 25px;
}

.jqx-listmenu-filter {
    text-align: center;
    padding: 4px;
}

ol li .jqx-listmenu-item-label:before {
    content: counter(section) ". ";
    counter-increment: section;
}

.jqx-listmenu div {
    clear: both;
}

.jqx-listmenu-auto-separator {
}

.jqx-listmenu-item-readonly {
    cursor: default;
}

.jqx-tooltip {
    position: absolute;
    width: auto;
    height: auto;
}

.jqx-tooltip-main {
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
    filter: inherit;
    border-style: solid;
    border-width: 1px;
}

.jqx-tooltip-text {
    padding: 5px 8px;
    overflow: hidden;
    filter: inherit;
}

.jqx-tooltip, .jqx-tooltip-text, .jqx-tooltip-main {
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    -moz-background-clip: padding;
    background-clip: padding-box;
    -webkit-background-clip: padding-box;
}

.jqx-tooltip-arrow {
    position: absolute;
    width: 0px;
    height: 0px;
    display: block;
    border-style: solid;
    margin: -6px 0 0 -7px;
    background: transparent !important;
    filter: inherit;
}

.jqx-tooltip-arrow-t-b {
    border-left-color: transparent !important;
    border-right-color: transparent !important;
}

.jqx-tooltip-arrow-l-r {
    border-top-color: transparent !important;
    border-bottom-color: transparent !important;
}

/*Sets the text-alignment to right.*/
.jqx-rtl {
    text-align: right !important;
}

.jqx-shadow {
    -webkit-box-shadow: 0 2px 3px rgba(0, 0, 0, .15) !important;
    -moz-box-shadow: 0 2px 3px rgba(0, 0, 0, .15) !important;
    box-shadow: 0 2px 3px rgba(0, 0, 0, .15) !important;
}

.jqx-noshadow {
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    box-shadow: none !important;
}

.jqx-passwordinput-password-icon, .jqx-passwordinput-password-icon-rtl {
    background-image: url(./images/icon-showpassword.png) !important;
    background-repeat: no-repeat !important;
    width: 14px;
    height: 9px;
}

.jqx-passwordinput-password-icon-ltr {
    background-position: right !important;
}

.jqx-passwordinput-password-icon-rtl {
    background-position: left !important;
}

.jqx-passwordinput-password-strength-inicator {
    width: 20%;
    height: 5px;
    margin-top: 5px;
}

/*top rounded Corners*/
.jqx-rc-t-expanded {
    -moz-border-radius-topleft: 0px !important;
    -webkit-border-top-left-radius: 0px !important;
    border-top-left-radius: 0px !important;
    -moz-border-radius-topright: 0px !important;
    -webkit-border-top-right-radius: 0px !important;
    border-top-right-radius: 0px !important;
}

/*bottom rounded Corners*/
.jqx-rc-b-expanded {
    -moz-border-radius-bottomleft: 0px !important;
    -webkit-border-bottom-left-radius: 0px !important;
    border-bottom-left-radius: 0px !important;
    -moz-border-radius-bottomright: 0px !important;
    -webkit-border-bottom-right-radius: 0px !important;
    border-bottom-right-radius: 0px !important;
}

.jqx-treemap-rectangle {
    font-size: 13px;
    font-weight: normal;
    border: 1px solid #555;
    color: #222;
    text-shadow: 0px 0px 0px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.jqx-treemap-label {
    text-overflow: ellipsis;
    overflow: hidden;
}

.jqx-treemap-rectangle-parent {
    color: #222;
    font-size: 15px;
    font-family: Verdana;
    font-weight: bold;
}

.jqx-treemap-legend-label {
    color: #fff;
}

.jqx-treemap-legend {
    width: 350px;
    background-color: rgba(0, 0, 0, 0.1);
    z-index: 41;
    overflow: hidden;
}

.jqx-treemap-legend-table {
    table-layout: fixed;
    width: 100%;
}

.jqx-treemap-legend-color {
    height: 3px;
}

.jqx-treemap-legend-values {
    height: 12px;
    width: 100%;
}

.jqx-treemap-legend-value {
    font-size: 9px;
    position: absolute;
    color: #fff;
}

.jqx-treemap-rectangle-hover {
    -webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
    z-index: 40;
}

/*jqxRangeSelector*/
.jqx-rangeselector, .jqx-rangeselector-content, .jqx-rangeselector-slider, .jqx-rangeselector-markers,
.jqx-rangeselector-ticks-container, .jqx-rangeselector-ticks, .jqx-rangeselector-shutter {
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    box-sizing: content-box !important;
}

.jqx-rangeselector-markers {
}

.jqx-rangeselector-content, .jqx-rangeselector-ticks, .jqx-rangeselector-labels, .jqx-rangeselector-shutter, .jqx-rangeselector-markers, .jqx-rangeselector-marker-arrow {
    position: absolute;
}

.jqx-rangeselector-ticks-container, .jqx-rangeselector-ticks, .jqx-rangeselector-shutter, .jqx-rangeselector-slider {
    height: 100%;
}

.jqx-rangeselector-ticks-container, .jqx-rangeselector-slider {
    width: 100%;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    -moz-border-radius: 0px !important;
    -webkit-border-radius: 0px !important;
    border-radius: 0px !important;
}

.jqx-rangeselector-group-labels-rtl, .jqx-rangeselector-group-labels-ticks, .jqx-rangeselector-slider {
    float: left;
}

.jqx-rangeselector-slider, .jqx-rangeselector-markers, .jqx-rangeselector-marker-arrow {
    border-style: solid;
}

.jqx-rangeselector-ticks, .jqx-rangeselector-group-labels-ticks {
    width: 1px;
    background: #aaa;
}

.jqx-rangeselector-labels, .jqx-rangeselector-markers {
    white-space: nowrap;
    width: auto;
}

.jqx-rangeselector-slider, .jqx-rangeselector-markers {
    border-width: 1px !important;
}

.jqx-rangeselector-ticks-container {
    background-color: transparent;
    position: relative;
}

.jqx-rangeselector-shutter {
    opacity: 0.75;
    background: #efefef;
    border-width: 0px !important;
}

.jqx-rangeselector-slider {
    background-color: transparent !important;
    border-top: none !important;
    background-image: none !important;
    border-bottom: none !important;
    border-color: #aaa;
    border-right-color: transparent !important;
    position: relative;
    overflow: hidden;
}

.jqx-rangeselector-inner-slider {
    position: absolute;
    right: 0;
    background: #aaa;
    width: 1px;
    height: 100%;
}

.jqx-rangeselector-ticks {
    margin-top: 0px;
}

.jqx-rangeselector-labels, .jqx-rangeselector-group-labels {
    margin-top: 4px;
}

.jqx-rangeselector-markers {
    height: 20px;
    padding: 5px;
    opacity: 0.75;
}

.jqx-rangeselector-marker-arrow {
    width: 0px;
    height: 0px;
    display: block;
    margin: -6px 0 0 -7px;
    background-color: transparent !important;
    filter: inherit;
    border-top-width: 5px;
    border-bottom-width: 5px;
    border-right-color: transparent !important;
    border-left-color: transparent !important;
    background-clip: border-box;
    background-repeat: repeat;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    background-image: none !important;
}

.jqx-rangeselector-marker-arrow-top {
    border-bottom-color: transparent !important;
}

.jqx-rangeselector-marker-arrow-bottom {
    border-top-color: transparent !important;
}

.jqx-rangeselector-marker-left-arrow {
    border-right-width: 0px;
    border-left-width: 5px;
}

.jqx-rangeselector-marker-right-arrow {
    border-right-width: 5px;
    border-left-width: 0px;
}

.jqx-rangeselector-markers-value {
    overflow: hidden;
    white-space: nowrap;
}

.jqx-rangeselector-group-labels-rtl {
    margin-right: 10px;
    direction: rtl;
}

.jqx-rangeselector-group-labels-ticks {
    height: 17px;
}

.jqx-rangeselector-group-labels-ticks-rtl {
    margin-left: 5px;
}

.jqx-action-button {
    border: none;
    border-left: 1px solid #c7c7c7;
}

.jqx-action-button-rtl {
    border: none;
    border-right: 1px solid #c7c7c7;
    cursor: pointer;
}

/*jqxBulletChart*/
.jqx-bulletchart {
}

.jqx-bulletchart, .jqx-bulletchart-title-container-horizontal, .jqx-bulletchart-title-container-vertical, .jqx-bulletchart-chart-container-horizontal, .jqx-bulletchart-chart-container-vertical {
    position: relative;
}

.jqx-bulletchart-title-inner-container, .jqx-bulletchart-range, .jqx-bulletchart-pointer, .jqx-bulletchart-target, .jqx-bulletchart-ticks, .jqx-bulletchart-labels {
    position: absolute;
}

.jqx-bulletchart-title-container-vertical, .jqx-bulletchart-title, .jqx-bulletchart-description, .jqx-bulletchart-range-vertical {
    width: 100%;
}

.jqx-bulletchart-title-container-horizontal, .jqx-bulletchart-chart-container-horizontal {
    float: left;
    overflow: hidden;
}

.jqx-bulletchart-title, .jqx-bulletchart-description {
    text-align: center;
}

.jqx-bulletchart-title-inner-container {
    margin: auto;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.jqx-bulletchart-title-inner-container-ltr {
    padding-right: 5px;
}

.jqx-bulletchart-title-inner-container-rtl {
    padding-left: 5px;
}

.jqx-bulletchart-title-description-ltr {
    text-align: right;
}

.jqx-bulletchart-title-description-rtl {
    text-align: left;
}

.jqx-bulletchart-title-description-vertical {
    text-align: center;
}

.jqx-bulletchart-title {
    font-size: 110%;
    font-weight: bold;
}

.jqx-bulletchart-description {
    font-size: 90%;
}

.jqx-bulletchart-range-horizontal {
    height: 100%;
}

.jqx-bulletchart-target-horizontal {
    top: 10%;
    height: 80%;
}

.jqx-bulletchart-target-vertical {
    left: 10%;
    width: 80%;
}

.jqx-bulletchart-ticks {
    background-color: #AAAAAA;
}

.jqx-bulletchart-ticks-horizontal {
    width: 1px;
}

.jqx-bulletchart-ticks-vertical {
    height: 1px;
}

.jqx-bulletchart-zero-tick {
}

.jqx-bulletchart-labels {
}

/*jqxNotification*/
.jqx-notification {
    padding: 10px;
    border-width: 1px;
    border-style: solid;
    box-sizing: border-box;
    pointer-events: auto;
}

.jqx-notification-table {
    width: 100%;
    font-size: inherit;
    font-weight: inherit;
    font-style: inherit;
    color: inherit;
}

.jqx-notification-container {
    position: fixed;
    height: auto;
    width: auto;
    pointer-events: none;
}

.jqx-notification-container-full-width {
    width: 100%;
}

.jqx-notification-container-full-height {
    height: 100%;
}

#jqxNotificationDefaultContainer-top-right, #jqxNotificationDefaultContainer-bottom-left {
    direction: rtl;
}

.jqx-notification-icon, .jqx-notification-content {
    vertical-align: middle;
}

.jqx-notification-content {
}

.jqx-notification-content-rtl {
    direction: rtl;
}

.jqx-link, .jqx-inverse, .jqx-primary, .jqx-warning, .jqx-danger, .jqx-success, .jqx-info {
    background: none !important;
    box-shadow: none !important;
    text-shadow: none !important;
}

.jqx-primary .jqx-icon-calendar, .jqx-primary .jqx-icon-calendar-hover, .jqx-primary .jqx-icon-calendar-pressed {
    background-image: url('images/icon-calendar-white.png');
}

.jqx-primary .jqx-icon-time, .jqx-primary .jqx-icon-time-hover, .jqx-primary .jqx-icon-time-pressed {
    background-image: url('images/icon-time-white.png');
}

.jqx-success .jqx-icon-calendar, .jqx-success .jqx-icon-calendar-hover, .jqx-success .jqx-icon-calendar-pressed {
    background-image: url('images/icon-calendar-white.png');
}

.jqx-success .jqx-icon-time, .jqx-success .jqx-icon-time-hover, .jqx-success .jqx-icon-time-pressed {
    background-image: url('images/icon-time-white.png');
}

.jqx-warning .jqx-icon-calendar, .jqx-warning .jqx-icon-calendar-hover, .jqx-warning .jqx-icon-calendar-pressed {
    background-image: url('images/icon-calendar-white.png');
}

.jqx-warning .jqx-icon-time, .jqx-warning .jqx-icon-time-hover, .jqx-warning .jqx-icon-time-pressed {
    background-image: url('images/icon-time-white.png');
}

.jqx-danger .jqx-icon-calendar, .jqx-danger .jqx-icon-calendar-hover, .jqx-danger .jqx-icon-calendar-pressed {
    background-image: url('images/icon-calendar-white.png');
}

.jqx-danger .jqx-icon-time, .jqx-danger .jqx-icon-time-hover, .jqx-danger .jqx-icon-time-pressed {
    background-image: url('images/icon-time-white.png');
}

.jqx-info .jqx-icon-calendar, .jqx-info .jqx-icon-calendar-hover, .jqx-info .jqx-icon-calendar-pressed {
    background-image: url('images/icon-calendar-white.png');
}

.jqx-info .jqx-icon-time, .jqx-info .jqx-icon-time-hover, .jqx-info .jqx-icon-time-pressed {
    background-image: url('images/icon-time-white.png');
}

.jqx-inverse .jqx-icon-calendar, .jqx-inverse .jqx-icon-calendar-hover, .jqx-inverse .jqx-icon-calendar-pressed {
    background-image: url('images/icon-calendar-white.png');
}

.jqx-inverse .jqx-icon-time, .jqx-inverse .jqx-icon-time-hover, .jqx-inverse .jqx-icon-time-pressed {
    background-image: url('images/icon-time-white.png');
}


.jqx-notification-info, .jqx-info {
    color: #ffffff !important;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25) !important;
    background-color: #5bc0de !important;
    *background-color: #5bc0de !important;
    border-left-color: #46b8da !important;
    border-right-color: #46b8da !important;
    border-top-color: #46b8da !important;
    border-bottom-color: #46b8da !important;
}

.jqx-info:hover,
.jqx-info:focus,
.jqx-info:active,
.jqx-info.active,
.jqx-info.disabled,
.jqx-info[disabled] {
    color: #ffffff !important;
    background-color: #31b0d5 !important;
    *background-color: #31b0d5 !important;
    border-color: #269abc !important;
}

.jqx-fill-state-pressed.jqx-info,
.jqx-info:active,
.jqx-info.active {
    background-color: #269abc \9 !important;
}

.jqx-notification-warning, .jqx-warning {
    color: #ffffff !important;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25) !important;
    background-color: #f0ad4e !important;
    *background-color: #f0ad4e !important;
    border-left-color: #eea236 !important;
    border-right-color: #eea236 !important;
    border-top-color: #eea236 !important;
    border-bottom-color: #eea236 !important;
}

.jqx-warning:hover,
.jqx-warning:focus,
.jqx-warning:active,
.jqx-warning.active,
.jqx-warning.disabled,
.jqx-warning[disabled] {
    color: #ffffff !important;
    background-color: #ec971f !important;
    *background-color: #ec971f !important;
    border-color: #d58512 !important;
}

.jqx-fill-state-pressed.jqx-warning,
.jqx-warning:active,
.jqx-warning.active {
    background-color: #d58512 \9 !important;
    border-color: #985f0d !important;
}

.jqx-notification-success, .jqx-success {
    color: #ffffff !important;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25) !important;
    background-color: #5cb85c !important;
    *background-color: #5cb85c !important;
    border-left-color: #4cae4c !important;
    border-right-color: #4cae4c !important;
    border-top-color: #4cae4c !important;
    border-bottom-color: #4cae4c !important;
}

.jqx-success:hover,
.jqx-success:focus,
.jqx-success:active,
.jqx-success.active,
.jqx-success.disabled,
.jqx-success[disabled] {
    color: #ffffff !important;
    background-color: #449d44 !important;
    *background-color: #449d44 !important;
    border-color: #398439 !important;
}

.jqx-fill-state-pressed.jqx-success,
.jqx-success:active,
.jqx-success.active {
    background-color: #398439 !important;
    border-color: #255625 !important;
}

.jqx-notification-error, .jqx-danger {
    color: #ffffff !important;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25) !important;
    background-color: #d9534f !important;
    *background-color: #d9534f !important;
    border-left-color: #d43f3a !important;
    border-right-color: #d43f3a !important;
    border-top-color: #d43f3a !important;
    border-bottom-color: #d43f3a !important;
}

.jqx-danger:hover,
.jqx-danger:focus,
.jqx-danger:active,
.jqx-danger.active,
.jqx-danger.disabled,
.jqx-danger[disabled] {
    color: #ffffff !important;
    background-color: #c9302c !important;
    *background-color: #c9302c !important;
    border-color: #ac2925 !important;
}

.jqx-fill-state-pressed.jqx-danger, .jqx-danger:active,
.jqx-danger.active {
    background-color: #ac2925 !important;
    border-color: #761c19 !important;
}

.jqx-notification-mail, .jqx-primary {
    color: #ffffff !important;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25) !important;
    background-color: #337ab7 !important;
    *background-color: #337ab7 !important;
    border-left-color: #2e6da4 !important;
    border-right-color: #2e6da4 !important;
    border-top-color: #2e6da4 !important;
    border-bottom-color: #2e6da4 !important;
}

.jqx-primary:hover,
.jqx-primary:focus,
.jqx-primary:active,
.jqx-primary.active,
.jqx-primary.disabled,
.jqx-primary[disabled] {
    color: #ffffff !important;
    background-color: #286090 !important;
    *background-color: #286090 !important;
}

.jqx-fill-state-pressed.jqx-primary,
.jqx-primary:active,
.jqx-primary.active {
    background-color: #204d74 !important;
}

.jqx-notification-time, .jqx-inverse {
    color: #ffffff !important;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25) !important;
    background-color: #363636 !important;
    *background-color: #222222 !important;
    border-left-color: #222222 !important;
    border-right-color: #222222 !important;
    border-top-color: #222222 !important;
    border-bottom-color: #000000 !important;
}

.jqx-inverse:hover,
.jqx-inverse:focus,
.jqx-inverse:active,
.jqx-inverse.active,
.jqx-inverse.disabled,
.jqx-inverse[disabled] {
    color: #ffffff !important;
    background-color: #222222 !important;
    *background-color: #151515 !important;
}

.jqx-fill-state-pressed.jqx-inverse,
.jqx-inverse:active,
.jqx-inverse.active {
    background-color: #080808 !important;
    background-image: linear-gradient(to bottom, #444444, #444444) !important;
}

.jqx-link,
.jqx-link:active,
.jqx-link[disabled] {
    background-color: transparent !important;
    background-image: none !important;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    box-shadow: none !important;
}

.jqx-link {
    color: #0088cc !important;
    cursor: pointer !important;
    border-color: transparent !important;
    -webkit-border-radius: 0 !important;
    -moz-border-radius: 0 !important;
    border-radius: 0 !important;
}

.jqx-link:hover,
.jqx-link:focus {
    color: #005580 !important;
    text-decoration: underline !important;
    background-color: transparent !important;
}

.jqx-link[disabled]:hover,
.jqx-link[disabled]:focus {
    color: #333333 !important;
    text-decoration: none !important;
}

.jqx-link:focus, .jqx-inverse:focus, .jqx-primary:focus, .jqx-warning:focus, .jqx-danger:focus, .jqx-success:focus, .jqx-info:focus,
.jqx-link:hover, .jqx-inverse:hover, .jqx-primary:hover, .jqx-warning:hover, .jqx-danger:hover, .jqx-success:hover, .jqx-info:hover {
    background-position: 0 -15px !important;
    -webkit-transition: background-position 0.1s linear !important;
    -moz-transition: background-position 0.1s linear !important;
    -o-transition: background-position 0.1s linear !important;
    transition: background-position 0.1s linear !important;
}

.jqx-link:active, .jqx-inverse:active, .jqx-primary:active, .jqx-warning:active, .jqx-danger:active, .jqx-success:active, .jqx-info:active {
    background-image: none !important;
    outline: 0 !important;
    -webkit-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05) !important;
    -moz-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05) !important;
    box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05) !important;
}

.jqx-notification-icon {
    background-repeat: no-repeat;
}

.jqx-notification-icon-ltr {
    background-position: left center;
}

.jqx-notification-icon-rtl {
    background-position: right center;
}

.jqx-notification-icon-info, .jqx-notification-icon-warning, .jqx-notification-icon-success, .jqx-notification-icon-error, .jqx-notification-icon-mail, .jqx-notification-icon-time {
    width: 30px;
    height: 25px;
}

.jqx-notification-icon-info {
    background-image: url('images/info.png');
}

.jqx-notification-icon-warning {
    background-image: url('images/warning.png');
}

.jqx-notification-icon-success {
    background-image: url('images/success.png');
}

.jqx-notification-icon-error {
    background-image: url('images/error.png');
}

.jqx-notification-icon-mail {
    background-image: url('images/mail.png');
}

.jqx-notification-icon-time {
    background-image: url('images/time.png');
}

.jqx-notification-close-button-info, .jqx-notification-close-button-success, .jqx-notification-close-button-mail, .jqx-notification-close-button-time, .jqx-notification-close-button-error {
    background-image: url('images/close_white.png');
}

.jqx-notification-close-button-warning {
    background-image: url('images/close_black.png');
}

.jqx-notification-close-button-container, .jqx-notification-close-button {
    width: 16px;
    height: 16px;
}

.jqx-notification-close-button-container {
    vertical-align: top;
}

.jqx-notification-close-button {
    position: relative;
    top: -11px;
    background-repeat: no-repeat;
    cursor: pointer;
}

.jqx-notification-close-button-ltr {
    right: -11px;
    background-position: right top;
}

.jqx-notification-close-button-rtl {
    left: -11px;
    background-position: left top;
}

.jqx-navbar {
    width: 100%;
    border-style: solid;
    border-width: 1px;
}

.jqx-navbar ul:before,
.jqx-navbar ul:after {
    content: "";
    display: table;
}

.jqx-navbar ul:after {
    clear: both;
}

.jqx-navbar ul {
    list-style: none;
    margin: 0;
    padding: 0;
    position: relative;
    display: block;
    border: 0;
    max-width: 100%;
    overflow: visible;
}

.jqx-navbar-block {
    margin: 0;
    overflow: hidden;
    padding: 0px 12px;
    border-width: 0px;
    float: left;
    min-height: 1px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    box-shadow: none !important;
    border-radius: 0px !important;
}

.jqx-navbar-block-rtl {
    float: right;
}

.jqx-ribbon {
    position: relative;
    overflow: hidden;
}

.jqx-ribbon-auto {
    display: inline-block;
}

.jqx-ribbon-popup {
    overflow: visible;
}

.jqx-ribbon-header {
    position: absolute;
    margin: 0;
    border-width: 1px;
    border-style: solid;
    box-sizing: border-box;
    overflow: hidden;
    float: left;
    display: block;
    box-shadow: none !important;
}

.jqx-ribbon-header-auto {
    position: relative;
}

.jqx-ribbon-header-horizontal {
    width: 100%;
    min-height: 30px;
    padding: 0px;
    white-space: nowrap;
}

.jqx-ribbon-header-bottom {
    bottom: 0;
}

.jqx-ribbon-header-vertical {
    min-width: 75px;
    height: 100%;
    float: left;
    padding: 0px;
}

.jqx-ribbon-header-right {
    right: 0;
}

.jqx-ribbon-header-horizontal-popup, .jqx-ribbon-header-vertical-popup {
    position: relative;
}

.jqx-ribbon-header-horizontal-popup {
    height: 100%;
}

.jqx-ribbon-header-vertical-popup {
    width: 100%;
}

.jqx-ribbon-item {
    position: relative;
    list-style-type: none;
    padding: 5px;
    border: 1px solid transparent;
    box-sizing: border-box;
    text-overflow: ellipsis;
    cursor: default;
    min-width: 10px;
    vertical-align: top;
}

.jqx-ribbon-item-top, .jqx-ribbon-item-bottom {
    height: 100%;
    display: inline-block;
    margin-left: 1px;
    margin-right: 1px;
}

.jqx-ribbon-item-top {
    margin-top: 1px;
}

.jqx-ribbon-item-bottom {
    margin-top: -1px;
}

.jqx-ribbon-item-left, .jqx-ribbon-item-right {
    width: 100%;
    margin-top: 2px;
}

.jqx-ribbon-item-left {
    margin-left: 1px;
}

.jqx-ribbon-item-right {
    margin-left: -1px;
}

.jqx-ribbon-item-hover {
    border-color: inherit;
}

.jqx-ribbon-item-top.jqx-ribbon-item-hover {
    border-bottom-color: inherit !important;
}

.jqx-ribbon-item-bottom.jqx-ribbon-item-hover {
    border-top-color: inherit !important;
}

.jqx-ribbon-item-left.jqx-ribbon-item-hover {
    border-right-color: inherit !important;
}

.jqx-ribbon-item-right.jqx-ribbon-item-hover {
    border-left-color: inherit !important;
}

.jqx-ribbon-item-selected {
    border-color: inherit;
}

.jqx-ribbon-item-top.jqx-ribbon-item-selected {
    border-bottom-color: transparent;
}

.jqx-ribbon-item-bottom.jqx-ribbon-item-selected {
    border-top-color: transparent;
}

.jqx-ribbon-item-left.jqx-ribbon-item-selected {
    border-right-color: transparent;
}

.jqx-ribbon-item-right.jqx-ribbon-item-selected {
    border-left-color: transparent;
}

.jqx-ribbon-content {
    background-image: none !important;
    background-color: transparent !important;
    box-sizing: border-box;
}

.jqx-ribbon-content-horizontal {
    clear: both;
    height: 100%;
}

.jqx-ribbon-content-vertical {
    height: 100%;
    width: 100%;
    float: left;
    border-width: 1px;
}

.jqx-ribbon-content-popup {
    z-index: 99999;
    position: absolute;
    border-left: none;
}

.jqx-ribbon-content-popup.jqx-ribbon-content-horizontal {
    width: 100%;
    height: auto;
}

.jqx-ribbon-content-popup.jqx-ribbon-content-vertical {
    width: auto;
    height: 100%;
}

.jqx-ribbon-content-popup-top {
    -webkit-box-shadow: 0 6px 15px rgba(0, 0, 0, 0.15);
    -moz-box-shadow: 0 6px 15px rgba(0, 0, 0, 0.15);
    box-shadow: 0 6px 15px rgba(0, 0, 0, 0.15);
}

.jqx-ribbon-content-popup-bottom {
    -webkit-box-shadow: 0 -6px 15px rgba(0, 0, 0, 0.15);
    -moz-box-shadow: 0 -6px 15px rgba(0, 0, 0, 0.15);
    box-shadow: 0 -6px 15px rgba(0, 0, 0, 0.15);
}

.jqx-ribbon-content-popup-left {
    -webkit-box-shadow: 0 6px 15px rgba(0, 0, 0, 0.15);
    -moz-box-shadow: 0 6px 15px rgba(0, 0, 0, 0.15);
    box-shadow: 0 6px 15px rgba(0, 0, 0, 0.15);
}

.jqx-ribbon-content-popup-right {
    -webkit-box-shadow: -6px 6px 15px 0 rgba(0, 0, 0, 0.15);
    box-shadow: -6px 6px 15px 0 rgba(0, 0, 0, 0.15);
}

.jqx-ribbon-content-auto-width {
    width: auto;
}

.jqx-ribbon-content-section {
    width: 100%;
    height: 100%;
    display: none;
    border-width: 1px;
    border-style: solid;
    box-sizing: inherit;
    overflow: auto;
}

.jqx-ribbon-content-section-top {
    border-top: none;
}

.jqx-ribbon-content-section-bottom {
    bottom: 0;
    border-bottom: none;
}

.jqx-ribbon-content-section-left {
    border-left: none;
}

.jqx-ribbon-content-section-right {
    border-right: none;
    right: 0;
}

.jqx-ribbon-content-section-popup {
    position: relative;
}

.jqx-ribbon-content-section-horizontal-popup {
    height: auto;
}

.jqx-ribbon-content-section-vertical-popup {
    width: auto;
}

.jqx-ribbon-header-rtl {
    text-align: right;
}

.jqx-ribbon-header-horizontal.jqx-ribbon-header-rtl {
    direction: rtl;
}

.jqx-ribbon-item-rtl {
    direction: rtl;
}

.jqx-ribbon-scrollbutton {
    position: absolute;
    display: none;
    box-sizing: border-box;
    cursor: pointer;
    background-repeat: no-repeat !important;
    background-position: center !important;
    z-index: 0;
}

.jqx-ribbon-scrollbutton-top, .jqx-ribbon-scrollbutton-bottom {
    width: 17px;
}

.jqx-ribbon-scrollbutton-left, .jqx-ribbon-scrollbutton-right {
    height: 17px;
}

.jqx-ribbon-scrollbutton-top {
    top: 1px;
    border-bottom-width: 1px;
    border-bottom-style: solid;
}

.jqx-ribbon-scrollbutton-bottom {
    bottom: 1px;
    border-top-width: 1px;
    border-top-style: solid;
}

.jqx-ribbon-scrollbutton-left {
    left: 1px;
    border-right-width: 1px;
    border-right-style: solid;
}

.jqx-ribbon-scrollbutton-right {
    right: 1px;
    border-left-width: 1px;
    border-left-style: solid;
}

.jqx-ribbon-scrollbutton-top.jqx-ribbon-scrollbutton-lt.jqx-ribbon-scrollbutton-both, .jqx-ribbon-scrollbutton-top.jqx-ribbon-scrollbutton-lt.jqx-ribbon-scrollbutton-near, .jqx-ribbon-scrollbutton-bottom.jqx-ribbon-scrollbutton-lt.jqx-ribbon-scrollbutton-both, .jqx-ribbon-scrollbutton-bottom.jqx-ribbon-scrollbutton-lt.jqx-ribbon-scrollbutton-near {
    left: 1px;
    border-right-width: 1px;
    border-right-style: solid;
}

.jqx-ribbon-scrollbutton-top.jqx-ribbon-scrollbutton-lt.jqx-ribbon-scrollbutton-far, .jqx-ribbon-scrollbutton-bottom.jqx-ribbon-scrollbutton-lt.jqx-ribbon-scrollbutton-far {
    right: 18px;
    border-left-width: 1px;
    border-left-style: solid;
}

.jqx-ribbon-scrollbutton-top.jqx-ribbon-scrollbutton-rb.jqx-ribbon-scrollbutton-both, .jqx-ribbon-scrollbutton-top.jqx-ribbon-scrollbutton-rb.jqx-ribbon-scrollbutton-far, .jqx-ribbon-scrollbutton-bottom.jqx-ribbon-scrollbutton-rb.jqx-ribbon-scrollbutton-both, .jqx-ribbon-scrollbutton-bottom.jqx-ribbon-scrollbutton-rb.jqx-ribbon-scrollbutton-far {
    right: 1px;
    border-left-width: 1px;
    border-left-style: solid;
}

.jqx-ribbon-scrollbutton-top.jqx-ribbon-scrollbutton-rb.jqx-ribbon-scrollbutton-near, .jqx-ribbon-scrollbutton-bottom.jqx-ribbon-scrollbutton-rb.jqx-ribbon-scrollbutton-near {
    left: 18px;
    border-right-width: 1px;
    border-right-style: solid;
}

.jqx-ribbon-scrollbutton-left.jqx-ribbon-scrollbutton-lt.jqx-ribbon-scrollbutton-both, .jqx-ribbon-scrollbutton-left.jqx-ribbon-scrollbutton-lt.jqx-ribbon-scrollbutton-near, .jqx-ribbon-scrollbutton-right.jqx-ribbon-scrollbutton-lt.jqx-ribbon-scrollbutton-both, .jqx-ribbon-scrollbutton-right.jqx-ribbon-scrollbutton-lt.jqx-ribbon-scrollbutton-near {
    top: 1px;
    border-bottom-width: 1px;
    border-bottom-style: solid;
}

.jqx-ribbon-scrollbutton-left.jqx-ribbon-scrollbutton-lt.jqx-ribbon-scrollbutton-far, .jqx-ribbon-scrollbutton-right.jqx-ribbon-scrollbutton-lt.jqx-ribbon-scrollbutton-far {
    bottom: 18px;
    border-top-width: 1px;
    border-top-style: solid;
}

.jqx-ribbon-scrollbutton-left.jqx-ribbon-scrollbutton-rb.jqx-ribbon-scrollbutton-both, .jqx-ribbon-scrollbutton-left.jqx-ribbon-scrollbutton-rb.jqx-ribbon-scrollbutton-far, .jqx-ribbon-scrollbutton-right.jqx-ribbon-scrollbutton-rb.jqx-ribbon-scrollbutton-both, .jqx-ribbon-scrollbutton-right.jqx-ribbon-scrollbutton-rb.jqx-ribbon-scrollbutton-far {
    bottom: 1px;
    border-top-width: 1px;
    border-top-style: solid;
}

.jqx-ribbon-scrollbutton-left.jqx-ribbon-scrollbutton-rb.jqx-ribbon-scrollbutton-near, .jqx-ribbon-scrollbutton-right.jqx-ribbon-scrollbutton-rb.jqx-ribbon-scrollbutton-near {
    top: 18px;
    border-bottom-width: 1px;
    border-bottom-style: solid;
}

.jqx-ribbon-scrollbutton-inner {
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-position: center;
}

.jqx-ribbon-selection-token {
    position: absolute;
    z-index: 0;
}

.jqx-ribbon-selection-token-top, .jqx-ribbon-selection-token-bottom {
    height: 1px;
}

.jqx-ribbon-selection-token-left, .jqx-ribbon-selection-token-right {
    width: 1px;
}

.jqx-ribbon-auto, .jqx-ribbon-item-top, .jqx-ribbon-item-bottom, .jqx-ribbon-content {
    *display: inline;
}

.jqx-ribbon-content-left {
    *float: none;
}

.jqx-ribbon-content-right {
    *float: left;
}

.jqx-ribbon-content.jqx-ribbon-content-popup {
    *left: 0;
}

.jqx-ribbon-content-popup .jqx-ribbon-content-section {
    *overflow: visible;
}

.jqx-ribbon-content-section-popup {
    *position: absolute;
}

.jqx-toolbar, .jqx-toolbar-minimized-popup-separator {
    box-sizing: border-box;
}

.jqx-toolbar, .jqx-toolbar-minimized-popup {
    padding: 5px;
}

.jqx-toolbar {
    position: relative;
    border-width: 1px;
    border-style: solid;
    overflow: hidden;
}

.jqx-toolbar-tool {
    float: left;
    margin-top: 0;
    margin-bottom: 0;
}

.jqx-toolbar-tool-rtl {
    float: right;
}

.jqx-toolbar-tool-no-separator-ltr {
    margin-right: 2px !important;
}

.jqx-toolbar-tool-no-separator-rtl {
    margin-left: 2px !important;
}

.jqx-toolbar-tool-separator-ltr {
    margin-right: 6px !important;
}

.jqx-toolbar-tool-separator-rtl {
    margin-left: 6px !important;
}

.jqx-toolbar-tool-inner-button {
    margin-right: 0;
    margin-left: 0;
    border-radius: 0 !important;
}

.jqx-toolbar-minimized-button, .jqx-toolbar-minimized-popup {
    position: absolute;
}

.jqx-toolbar-minimized-button {
    height: 100%;
    right: 0;
    cursor: pointer;
    margin-top: -5px;
    margin-right: 5px;
    display: none;
}

.jqx-toolbar-minimized-button-rtl {
    left: 0;
    margin-left: 5px;
    margin-right: 0;
}

.jqx-toolbar-minimized-popup {
    border-width: 1px;
    border-top-width: 0;
    border-style: solid;
    visibility: hidden;
    z-index: 1000;
}

.jqx-toolbar-tool-minimized {
    margin: 1px 0 !important;
}

.jqx-toolbar-minimized-popup-separator {
    width: 100%;
    height: 2px;
    margin: 5px 0;
    display: none;
}

.jqx-complex-input-spin-buttons-container {
    border-width: 1px;
    border-style: solid;
    position: relative;
    -webkit-box-sizing: border-box !important;
    -moz-box-sizing: border-box !important;
    box-sizing: border-box !important;
    padding: 2px 8px !important;
    white-space: nowrap;
    vertical-align: middle;
}

.jqx-formatted-input, .jqx-complex-input {
    padding-right: 2px !important;
    text-align: right;
}

.jqx-formatted-input-lower-case, .jqx-complex-input {
    text-transform: lowercase;
}

.jqx-formatted-input-upper-case {
    text-transform: uppercase;
}

.jqx-formatted-input-item {
    word-wrap: break-word;
}

.jqx-formatted-input-item-rtl, .jqx-complex-input-rtl {
    direction: rtl !important;
}

.jqx-formatted-input-spin-buttons-container, .jqx-formatted-input-addon {
    height: 100%;
}

.jqx-formatted-input-spin-buttons-container {
    width: 18px;
    padding: 0 0 0 1px !important;
    overflow: hidden;
}

.jqx-formatted-input-spin-buttons-container-rtl {
    border-right-width: 0px;
    padding: 0 0 0 2px !important;
}

.jqx-formatted-input-spin-buttons-container-rtl-border {
    border-left-width: 1px !important;
}

.jqx-formatted-input-spin-button {
    position: relative;
    width: 17px;
    height: 50%;
    margin-left: -1px;
    border-width: 0px;
    padding: 0px;
    overflow: hidden;
    cursor: pointer;
}

.jqx-formatted-input-addon {
    width: 19px;
    padding: 0 !important;
    cursor: pointer;
}

.jqx-formatted-input-addon-rtl {
    border-right-width: 1px !important;
}

.jqx-complex-input-parent {
    overflow: hidden;
}

.jqx-complex-input-child {
    height: 100%;
    float: left;
    box-sizing: border-box;
}

.jqx-complex-input-child-rtl {
    float: right;
}

.jqx-complex-input-spin-buttons-container-ltr {
    border-left-width: 0;
}

.jqx-complex-input-spin-buttons-container-rtl {
    border-left-width: 1px !important;
    border-right-width: 0;
}

.jqx-file-upload {
    position: relative;
    overflow: auto;
}

.jqx-file-upload, .jqx-file-upload-file-row, .jqx-file-upload-file-name, .jqx-file-upload-file-cancel, .jqx-file-upload-file-upload {
    border-width: 1px;
    border-style: solid;
    box-sizing: border-box;
}

.jqx-file-upload-buttons-container, .jqx-file-upload-iframe, .jqx-file-upload-loading-element {
    display: none;
}

.jqx-file-upload-file-input-ie9, .jqx-file-upload-buttons-container, .jqx-file-upload-file-row, .jqx-file-upload-icon {
    width: 100%;
}

.jqx-file-upload-file-input-ie9, .jqx-file-upload-file-name, .jqx-file-upload-file-cancel, .jqx-file-upload-file-upload, .jqx-file-upload-icon, .jqx-file-upload-loading-element {
    height: 100%;
}

.jqx-file-input-iframe, .jqx-file-upload-form-ie9 {
    position: absolute;
}

.jqx-file-input-iframe {
    width: 0;
    height: 0;
    border: none;
}

.jqx-file-upload-form, .jqx-file-upload-file-input {
    visibility: hidden;
    display: none;
}

.jqx-file-upload-form-ie9, .jqx-file-upload-file-input-ie9 {
    display: block;
    visibility: visible;
}

.jqx-file-upload-form-ie9 {
    z-index: 10000;
    opacity: 0;
    filter: alpha(opacity=0);
}

.jqx-file-upload-file-name {
    width: auto;
    padding: 0 2px 0 2px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    *float: left;
}

.jqx-file-upload-button-browse-rtl, .jqx-file-upload-button-upload-rtl, .jqx-file-upload-button-cancel-rtl, .jqx-file-upload-file-name-rtl, .jqx-file-upload-file-cancel, .jqx-file-upload-file-upload, .jqx-file-upload-loading-element {
    float: right;
}

.jqx-file-upload, .jqx-file-upload-file-row {
    padding: 5px;
}

.jqx-file-upload-button-browse {
    display: block;
}

.jqx-file-upload-buttons-container {
    height: auto;
    margin-top: 10px;
}

.jqx-file-upload-button-browse-rtl, .jqx-file-upload-button-upload-rtl, .jqx-file-upload-button-cancel-rtl, .jqx-file-upload-file-name-rtl, .jqx-file-upload-file-cancel-rtl, .jqx-file-upload-file-upload-rtl {
    direction: rtl !important;
}

.jqx-file-upload-button-cancel, .jqx-file-upload-button-upload-rtl {
    margin-left: 5px;
}

.jqx-file-upload-button-upload-rtl-ie {
    margin-right: 5px;
}

.jqx-file-upload-button-cancel-rtl, .jqx-file-upload-button-upload-rtl-ie {
    margin-left: 0;
}

.jqx-file-upload-file-row {
    height: 30px;
    margin-bottom: 3px;
    clear: both;
}

.jqx-file-upload-file-cancel, .jqx-file-upload-file-upload, .jqx-file-upload-loading-element {
    width: 17px;
    margin: 0 1px 0 1px;
}

.jqx-file-upload-file-cancel-rtl, .jqx-file-upload-file-upload-rtl, .jqx-file-upload-loading-element-rtl {
    float: none;
    *float: left;
}

.jqx-file-upload-button-browse, .jqx-file-upload-button-upload, .jqx-file-upload-button-cancel, .jqx-file-upload-form-ie9, .jqx-file-upload-file-input-ie9, .jqx-file-upload-file-cancel, .jqx-file-upload-file-upload {
    cursor: pointer;
    white-space: nowrap;
}

.jqx-file-upload-file-name, .jqx-file-upload-file-cancel, .jqx-file-upload-file-upload {
    display: inline-block;
}

.jqx-file-upload-icon-upload, .jqx-file-upload-loading-element {
    margin-top: 1px;
}

.jqx-file-upload-loading-element {
    background-image: url('images/loader-small.gif');
    background-repeat: no-repeat;
}

.jqx-date-time-input-popup .jqx-icon {
    margin-top: 0px;
}


.jqx-text-area-element {
    height: 100%;
    width: 100%;
    overflow: hidden;
    border: none;
    outline: none;
    left: 0px;
    top: 0px;
    margin: 0px;
    position: absolute;
    resize: none;
}

.jqx-text-area-element-rtl {
    direction: rtl !important;
}

.jqx-responsive-panel {
    overflow: auto;
}

.jqx-responsive-panel {
    border-width: 0px;
}

.jqx-responsive-panel-button {
    border-width: 1px;
    border-style: solid;
}

.jqx-responsive-panel-button {
    display: none;
    cursor: pointer;
}

.jqx-responsive-panel-button-inner {
    margin: 0;
    width: 100%;
    height: 100%;
    background-position: center;
}

.jqx-loader {
    margin: auto;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-color: rgba(255, 255, 255, 0.5);
    z-index: 999;
    border-style: solid;
    border-width: 1px;
}

.jqx-loader-ie-transparency {
    background: transparent;
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#7fffffff, endColorstr=#7fffffff)"; /*For IE 8*/
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#7fffffff, endColorstr=#7fffffff); /*For IE 7*/
}

.jqx-loader-modal {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
    filter: alpha(opacity=50);
    position: fixed;
    height: 100%;
    width: 100%;
    z-index: 99;
    cursor: default;
    top: 0;
    left: 0;
    background-color: black;
    opacity: 0.6;
}

.jqx-loader-icon {
    background-image: url("images/loader.gif");
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 999;
}

.jqx-loader-text {
    z-index: 999;
    position: relative;
}

.jqx-loader-text-left {
    margin-left: 5px;
    position: absolute;
    top: 50%;
}

.jqx-loader-text-right {
    margin-right: 5px;
    position: absolute;
    top: 50%;
    right: 0px;
}

.jqx-loader-text-top {
    text-align: center;
    margin-top: 5px;
}

.jqx-loader-text-bottom {
    bottom: 0px;
    position: absolute;
    text-align: center;
    margin: 0 auto;
    width: 100%;
    margin-bottom: 5px;
}

.jqx-loader-rtl {
    direction: rtl;
}

/* jqxLayout and jqxDockingLayout */
.jqx-layout, .jqx-layout-group-root, .jqx-layout-pseudo-window-header, .jqx-docking-layout-overlay-inner-square-content {
    position: relative;
}

.jqx-layout-pseudo-window-pin-background, .jqx-layout-pseudo-window-close-background, .jqx-layout-resize-feedback, .jqx-layout-overlay, .jqx-docking-layout-overlay, .jqx-docking-layout-overlay-highlight-right, .jqx-docking-layout-overlay-highlight-bottom, .jqx-docking-layout-overlay-square-edge, .jqx-docking-layout-drop-overlay {
    position: absolute;
}

.jqx-layout {
    background-color: #c5c5c5;
}

.jqx-layout-group-root, .jqx-layout-pseudo-window-pin-icon, .jqx-layout-pseudo-window-pinned-icon, .jqx-layout-pseudo-window-close-icon, .jqx-layout-overlay {
    width: 100%;
    height: 100%;
}

.jqx-layout-group-default-horizontal > div, .jqx-layout-pseudo-window-title-ltr, .jqx-docking-layout-overlay-square, .jqx-docking-layout-overlay-mini-window-edge-horizontal, .jqx-docking-layout-overlay-square-edge-arrow-container-horizontal {
    float: left;
}

.jqx-layout-group-tabbed {
    position: static;
    box-sizing: border-box;
    min-height: 0 !important;
}

.jqx-layout-group-tabbed .jqx-window-content, .jqx-docking-layout-group-floating .jqx-window-content {
    padding: 0;
}

.jqx-layout-group-tabbed .jqx-ribbon-content-section, .jqx-layout-window, .jqx-docking-layout-group-floating .jqx-ribbon-content-section {
    border: none;
}

.jqx-layout-window {
    position: static;
}

.jqx-layout-group-auto-hide-content-vertical, .jqx-layout-group-auto-hide-content-horizontal {
    overflow: auto;
}

.jqx-layout-group-auto-hide-content-vertical {
    width: 150px;
}

.jqx-layout-group-auto-hide-content-horizontal {
    width: 100%;
    height: 150px;
}

.jqx-layout-pseudo-window {
    border-width: 1px;
    border-style: solid;
    box-sizing: border-box;
    box-shadow: none !important;
}

.jqx-layout-pseudo-window-header, .jqx-layout-pseudo-window-content {
    width: 100%;
    box-sizing: border-box;
}

.jqx-layout-pseudo-window-header {
    height: 30px;
}

.jqx-layout-pseudo-window-pin-background, .jqx-layout-pseudo-window-close-background {
    width: 16px;
    height: 16px;
    top: 5px;
}

.jqx-layout-pseudo-window-pin-background-ltr {
    right: 15px;
}

.jqx-layout-pseudo-window-close-background-ltr {
    right: 0;
}

.jqx-layout-pseudo-window-pin-background-rtl {
    left: 15px;
}

.jqx-layout-pseudo-window-close-background-rtl {
    left: 0;
}

.jqx-layout-pseudo-window-pin-icon, .jqx-layout-pseudo-window-pinned-icon, .jqx-layout-pseudo-window-close-icon {
    cursor: pointer;
}

.jqx-layout-pseudo-window-title {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.jqx-layout-pseudo-window-pin-icon {
    background-image: url("images/pin.png");
}

.jqx-layout-pseudo-window-pinned-icon {
    background-image: url("images/pinned.png");
}

.jqx-layout-pseudo-window-title-rtl {
    float: right;
}

.jqx-layout-resize-feedback {
    z-index: 9999;
    top: 0;
    left: 0;
    border-width: 1px;
    border-style: solid;
    box-sizing: border-box;
    opacity: 0.6;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
    display: none;
}

.jqx-layout-resize-feedback-horizontal {
    width: 100%;
    height: 4px;
    cursor: row-resize;
}

.jqx-layout-resize-feedback-vertical {
    width: 4px;
    height: 100%;
    cursor: col-resize;
}

.jqx-layout-resize-feedback-warning {
    border-color: #800000 !important;
    background-color: Red !important;
}

.jqx-layout-overlay {
    top: 0;
    left: 0;
    display: none;
    background-color: transparent;
    z-index: 8999;
    pointer-events: none;
}

.jqx-layout-ribbon-header-ltr {
    padding-left: 20px;
}

.jqx-layout-ribbon-header-rtl {
    padding-right: 20px;
}

/* jqxDockingLayout-specific */
.jqx-docking-layout-group-floating {
    border-color: #FFD280 !important;
}

.jqx-docking-layout-group-floating .jqx-window-header {
    border-color: #FFD280;
    background-color: #FFD280 !important;
    background: -webkit-linear-gradient(#FFE4B5, #FFD280) !important;
    background: -o-linear-gradient(#FFE4B5, #FFD280) !important;
    background: -moz-linear-gradient(#FFE4B5, #FFD280) !important;
    background: linear-gradient(#FFE4B5, #FFD280) !important;
}

.jqx-docking-layout-overlay, .jqx-docking-layout-overlay-square-edge {
    z-index: 99999;
    opacity: 0.9;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
}

.jqx-docking-layout-overlay-square-edge {
    display: none;
}

.jqx-docking-layout-overlay {
    width: 100px;
    height: 100px;
    left: 100px;
    top: 70px;
}

.jqx-docking-layout-overlay-section {
    height: 33px;
    width: 100px;
}

.jqx-docking-layout-overlay-square {
    width: 26px;
    height: 26px;
    padding: 3px;
}

.jqx-docking-layout-overlay-square-invisible {
    background-color: transparent !important;
    background-image: none !important;
}

.jqx-docking-layout-overlay-square-top, .jqx-docking-layout-overlay-square-left, .jqx-docking-layout-overlay-square-center, .jqx-docking-layout-overlay-square-right, .jqx-docking-layout-overlay-highlight-bottom {
    border-top-width: 1px;
    border-top-style: solid;
}

.jqx-docking-layout-overlay-square-top, .jqx-docking-layout-overlay-square-left, .jqx-docking-layout-overlay-square-bottom, .jqx-docking-layout-overlay-highlight-right {
    border-left-width: 1px;
    border-left-style: solid;
}

.jqx-docking-layout-overlay-square-top, .jqx-docking-layout-overlay-square-right, .jqx-docking-layout-overlay-square-bottom, .jqx-docking-layout-overlay-highlight-left {
    border-right-width: 1px;
    border-right-style: solid;
}

.jqx-docking-layout-overlay-square-left, .jqx-docking-layout-overlay-square-center, .jqx-docking-layout-overlay-square-right, .jqx-docking-layout-overlay-square-bottom, .jqx-docking-layout-overlay-inner-square-header, .jqx-docking-layout-overlay-highlight-top {
    border-bottom-width: 1px;
    border-bottom-style: solid;
}

.jqx-docking-layout-overlay-square-center {
    border-color: transparent !important;
}

.jqx-docking-layout-overlay-inner-square, .jqx-docking-layout-overlay-inner-square-header, .jqx-docking-layout-overlay-inner-square-content, .jqx-docking-layout-overlay-highlight-top, .jqx-docking-layout-overlay-highlight-bottom, .jqx-docking-layout-overlay-mini-window-edge-vertical {
    width: 24px;
}

.jqx-docking-layout-overlay-inner-square {
    border-width: 1px;
    border-style: solid;
    height: 24px;
}

.jqx-docking-layout-overlay-inner-square-header {
    height: 5px;
}

.jqx-docking-layout-overlay-inner-square-content {
    height: 18px;
}

.jqx-docking-layout-overlay-highlight {
}

.jqx-docking-layout-overlay-highlight-top {
    height: 9px;
    border-bottom-style: dashed;
}

.jqx-docking-layout-overlay-highlight-left, .jqx-docking-layout-overlay-highlight-right {
    width: 12px;
    height: 18px;
}

.jqx-docking-layout-overlay-highlight-left {
    border-right-style: dashed;
}

.jqx-docking-layout-overlay-highlight-right {
    right: 0;
    border-left-style: dashed;
}

.jqx-docking-layout-overlay-highlight-bottom {
    bottom: 0;
    height: 9px;
    border-top-style: dashed;
}

.jqx-docking-layout-drop-overlay {
    display: none;
    background-color: #6495ED;
    opacity: 0.5;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
    z-index: 10000;
    top: 0px;
    left: 0px;
}

.jqx-docking-layout-square-disabled {
    visibility: hidden;
}

.jqx-docking-layout-overlay-square-edge, .jqx-docking-layout-overlay-mini-window-edge-horizontal, .jqx-docking-layout-overlay-mini-window-edge-vertical {
    border-style: solid;
    border-width: 1px;
}

.jqx-docking-layout-overlay-inner-square-edge {
    width: 26px;
    height: 26px;
}

.jqx-docking-layout-overlay-mini-window-edge-horizontal {
    height: 24px;
}

.jqx-docking-layout-overlay-mini-window-edge-vertical {
    height: 13px;
}

.jqx-docking-layout-overlay-mini-window-edge-horizontal, .jqx-docking-layout-overlay-inner-square-header-horizontal, .jqx-docking-layout-overlay-inner-square-content-horizontal {
    width: 13px;
}

.jqx-docking-layout-overlay-inner-square-content-vertical {
    height: 7px;
}

.jqx-docking-layout-overlay-square-edge-arrow {
    border-style: solid;
    border-width: 5px;
    width: 0px;
    height: 0px;
    display: block;
    background: transparent !important;
}

.jqx-docking-layout-overlay-square-edge-arrow-left, .jqx-docking-layout-overlay-square-edge-arrow-right, .jqx-docking-layout-overlay-square-edge-arrow-top {
    border-top-color: transparent !important;
}

.jqx-docking-layout-overlay-square-edge-arrow-left, .jqx-docking-layout-overlay-square-edge-arrow-right, .jqx-docking-layout-overlay-square-edge-arrow-bottom {
    border-bottom-color: transparent !important;
}

.jqx-docking-layout-overlay-square-edge-arrow-left, .jqx-docking-layout-overlay-square-edge-arrow-top, .jqx-docking-layout-overlay-square-edge-arrow-bottom {
    border-left-color: transparent !important;
}

.jqx-docking-layout-overlay-square-edge-arrow-right, .jqx-docking-layout-overlay-square-edge-arrow-top, .jqx-docking-layout-overlay-square-edge-arrow-bottom {
    border-right-color: transparent !important;
}

.jqx-docking-layout-overlay-square-edge-arrow-left, .jqx-docking-layout-overlay-square-edge-arrow-right {
    margin-top: 8px;
}

.jqx-docking-layout-overlay-square-edge-arrow-top, .jqx-docking-layout-overlay-square-edge-arrow-bottom {
    margin-left: 8px;
}

.jqx-tag-cloud ul {
    padding-left: 5px;
}

.jqx-tag-cloud-item {
    padding: 3px;
    display: inline-block;
}

.jqx-tag-cloud-item a {
    text-decoration: initial;
}

.jqx-tag-cloud-item a:hover {
    text-decoration: underline;
}

.jqx-popover {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 9999;
    background-color: #ffffff;
    border: 1px solid #aaa;
    border: 1px solid rgba(0, 0, 0, 0.3);
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.3);
}

.jqx-popover-modal-background {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 999;
    /* Fallback for web browsers that don't support RGBa */
    background-color: rgb(0, 0, 0);
    /* RGBa with 0.6 opacity */
    background-color: rgba(0, 0, 0, 0.6);
    /* For IE 5.5 - 7*/
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000);
    /* For IE 8*/
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000)";
}

.jqx-popover-close-button {
    width: 16px;
    height: 16px;
    float: right;
}

.jqx-popover-close-button-rtl {
    float: left;
}

.jqx-popover.top {
    margin-top: -10px;
}

.jqx-popover.right {
    margin-left: 10px;
}

.jqx-popover.bottom {
    margin-top: 10px;
}

.jqx-popover.left {
    margin-left: -10px;
}

.jqx-popover-title {
    padding: 8px 14px;
    margin: 0;
    border-bottom: 1px solid inherit;
    -webkit-border-radius: 3px 3px 0 0;
    -moz-border-radius: 3px 3px 0 0;
    border-radius: 3px 3px 0 0;
}

.jqx-popover-title:empty {
    display: none;
}

.jqx-popover-content {
    padding: 9px 14px;
}

.jqx-popover .jqx-popover-arrow,
.jqx-popover .jqx-popover-arrow:after {
    position: absolute;
    display: block;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
}

.jqx-popover .jqx-popover-arrow {
    border-width: 11px;
}

.jqx-popover .jqx-popover-arrow:after {
    border-width: 10px;
    content: "";
}

.jqx-popover.top .jqx-popover-arrow {
    bottom: -11px;
    left: 50%;
    margin-left: -11px;
    border-top-color: inherit;
    border-bottom-width: 0;
}

.jqx-popover.top .jqx-popover-arrow:after {
    bottom: 1px;
    margin-left: -10px;
    border-top-color: #ffffff;
    border-bottom-width: 0;
}

.jqx-popover.right .jqx-popover-arrow {
    top: 50%;
    left: -11px;
    margin-top: -11px;
    border-right-color: inherit;
    border-left-width: 0;
}

.jqx-popover.right .jqx-popover-arrow:after {
    bottom: -10px;
    left: 1px;
    border-right-color: #ffffff;
    border-left-width: 0;
}

.jqx-popover.bottom .jqx-popover-arrow {
    top: -11px;
    left: 50%;
    margin-left: -11px;
    border-bottom-color: inherit;
    border-top-width: 0;
}

.jqx-popover.bottom .jqx-popover-arrow:after {
    top: 1px;
    margin-left: -10px;
    border-bottom-color: #ffffff;
    border-top-width: 0;
}

.jqx-popover.left .jqx-popover-arrow {
    top: 50%;
    right: -11px;
    margin-top: -11px;
    border-right-width: 0;
    border-left-color: inherit;
}

.jqx-popover.left .jqx-popover-arrow:after {
    right: 1px;
    bottom: -10px;
    border-left-color: #ffffff;
    border-right-width: 0;
}


.jqx-kanban-full-frame {
    width: 100vw;
    height: 100vh;
}

.jqx-kanban-in-frame {
    width: 100%;
    height: 100%;
    box-sizing: border-box;
}

.jqx-kanban-rtl {
    direction: rtl;
    text-align: right;
}

.jqx-kanban-column {
    box-sizing: border-box;
    border-style: solid;
    border-width: 1px 1px 1px 0px;
    float: left;
}

.jqx-kanban-column-collapsed {
    width: 50px;
}

.jqx-kanban-column-first {
    border-width: 1px;
}

.jqx-kanban-column:first-of-type {
    border-width: 1px 1px 1px 1px;
}

.jqx-kanban-column-selected {
    /*  background-color: blue;*/
}

.jqx-kanban-column-header-collapsed { /*vertical column invisible*/
    display: none;
    box-sizing: border-box;
    height: 0px;
    width: 0px;
    position: relative;
    cursor: pointer;
}

.jqx-kanban-column-header-collapsed-show { /*vertical column visible*/
    display: block !important;
    height: 100%;
    box-sizing: border-box;
    width: 100%;
    position: relative;
    cursor: pointer;
}

.jqx-kanban-column-vertical-container {
    padding-top: 0px;
    padding-left: 0px;
    transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
    white-space: nowrap;
}

.jqx-kanban-column-vertical-container-inverse {
    padding-top: 0px;
    padding-left: 20px;
    transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    white-space: nowrap;
}

.jqx-kanban-column-vertical-container .jqx-kanban-column-header-title, .jqx-kanban-column-vertical-container .jqx-kanban-column-header-status {
    position: relative;
}

.jqx-kanban-column-hide { /*colapsed*/
    display: none !important;
}

.jqx-kanban-column-header {
    border-width: 1px;
    border-style: solid;
    margin: 1px;
    white-space: nowrap;
    padding-left: 5px;
    padding-right: 5px;
    cursor: pointer;
    overflow: hidden;
    position: relative;
}

.jqx-kanban-column-header-button {
    position: absolute;
    right: 0px;
    top: 50%;
    margin-top: -8px;
    width: 16px;
    height: 16px;
}

.jqx-kanban-column-header .jqx-window-collapse-button {
    margin-top: 1px !important;
}

.jqx-kanban-column-header-custom-button {
    position: absolute;
    right: 20px;
    top: 50%;
    margin-top: -8px;
    width: 16px;
    height: 16px;
}

.jqx-kanban-column-header-custom-button-rtl {
    left: 20px;
}

.jqx-kanban-column-header-button-rtl {
    left: 0px;
}

.jqx-kanban-column-header-collapsed .jqx-kanban-column-header-button {
    top: 100%;
    right: 50%;
    margin-top: -21px;
    left: 50%;
    margin-left: -8px;
}

.jqx-kanban-column-header-collapsed .jqx-kanban-column-header-custom-button {
    top: 100%;
    right: 50%;
    margin-top: -41px;
    left: 50%;
    margin-left: -8px;
}

.jqx-kanban-column-container {
    margin: 1px;
    overflow-y: auto;
}

.jqx-kanban-item-placeholder {
    height: 100px;
    border: gray dotted 1px;
    border-radius: 3px;
    margin: 5px;
}

.jqx-kanban-column-vertical-container-inverse-ie8-fix {
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
}

.jqx-kanban-column-vertical-container-ie8-fix {
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
}

.jqx-kanban-item {
    margin: 2px;
    padding-top: 5px;
    padding-bottom: 5px;
    border-width: 1px;
    border-style: solid;
    border-color: inherit;
    position: relative;
    box-shadow: #ddd 2px 2px 3px;
    cursor: pointer;
    touch-action: none;
    -ms-touch-action: none;
}

.jqx-kanban-item-selected {
}

.jqx-kanban-item-color-status {
    background-color: #6bbd49;
    width: 3px;
    height: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
}

.jqx-kanban-item-color-status-rtl {
    right: 0px;
    left: 100%;
}

.jqx-kanban-item-text {
    padding-left: 6px;
    padding-right: 23px;
    font-size: 14px;
    padding-bottom: 5px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.jqx-kanban-rtl .jqx-kanban-item-text {
    padding-right: 6px;
    padding-left: 23px;
}

.jqx-kanban-column-header-title {
}

.jqx-kanban-column-header-status {
}

.jqx-kanban-item-content {
}

.jqx-kanban-item-avatar {
    width: 22px;
    height: 22px;
    position: absolute;
    right: 3px;
    top: 3px;
    background: #eee;
    text-align: center;
    overflow: hidden;
}

.jqx-kanban-item-avatar-rtl {
    left: 3px;
}

.jqx-kanban-item-avatar-image {
    width: 20px;
    height: 20px;
}

.jqx-kanban-item-avatar-image:hover {
}

.jqx-kanban-item-footer {
    border-top: 1px solid transparent;
    border-color: inherit;
    overflow: hidden;
    padding-top: 5px;
    margin-top: 5px;
    padding-bottom: 1px;
    padding-left: 6px;
    padding-right: 6px;
}


.jqx-kanban-item-keyword {
    float: left;
    margin: 2px;
    overflow: hidden;
    text-overflow: ellipsis;
    border: 1px solid transparent;
    border-color: inherit;
    padding-left: 2px;
    padding-right: 2px;
    cursor: pointer;
}

.jqx-kanban-item-keyword-rtl {
    direction: rtl;
    text-align: right;
    float: right;
}

.jqx-kanban-item-keyword:hover {
}

.jqx-kanban-item-avatar {
    height: 20px;
}

.jqx-kanban-handle {
    cursor: move;
}

.jqx-kanban-clearing {
    clear: both;
}

.jqx-sortable {
    touch-action: none;
    -ms-touch-action: none;
}

.jqx-bar-gauge-tooltip {
    position: absolute;
    left: 20px;
    top: 20px;
    display: none;
    padding: 6px 12px;
    border: black solid 1px;
    background-color: white;
    color: #333333;
    font-size: 11px;
    font-weight: 100;
    font-family: Verdana;
    border: black solid 1px;
    border-radius: 3px;
    opacity: 1;
    white-space: nowrap;
    z-index: 5;
}

.jqx-bar-gauge-measure-text {
    position: absolute;
    top: 0;
    right: 0;
    visibility: hidden;
    z-index: -99999;
    margin: 0px;
    padding: 0px;
    border-width: 0px;
}

.jqx-scrollbar-mobile {
    background: transparent !important;
}

.jqx-scrollbar-mobile .jqx-scrollbar-state-normal {
    background: transparent !important;
    border-color: transparent !important;
}

.jqx-scrollbar-mobile .jqx-scrollbar-thumb-state-normal-horizontal, .jqx-scrollbar-mobile .jqx-scrollbar-thumb-state-normal {
    background: #808080 !important;
    border-color: #808080 !important;
    border-width: 1px;
    z-index: 99999;
    border-radius: 0px !important;
}

.jqx-scrollbar-mobile .jqx-scrollbar-thumb-state-normal {
    width: 4px !important;
}

.jqx-scrollbar-mobile .jqx-scrollbar-thumb-state-normal-horizontal {
    height: 4px !important;
}


.jqx-primary .jqx-icon-arrow-down, .jqx-warning .jqx-icon-arrow-down, .jqx-danger .jqx-icon-arrow-down, .jqx-success .jqx-icon-arrow-down, .jqx-info .jqx-icon-arrow-down {
    background-image: url('images/icon-down-white.png');
}

.jqx-primary .jqx-icon-arrow-down-selected, .jqx-warning .jqx-icon-arrow-down-selected, .jqx-danger .jqx-icon-arrow-down-selected, .jqx-success .jqx-icon-arrow-down-selected, .jqx-info .jqx-icon-arrow-down-selected {
    background-image: url('images/icon-down-white.png');
}

.jqx-primary .jqx-icon-arrow-down-hover, .jqx-warning .jqx-icon-arrow-down-hover, .jqx-danger .jqx-icon-arrow-down-hover, .jqx-success .jqx-icon-arrow-down-hover, .jqx-info .jqx-icon-arrow-down-hover {
    background-image: url('images/icon-down-white.png');
}

.jqx-primary .jqx-icon-arrow-up, .jqx-warning .jqx-icon-arrow-up, .jqx-danger .jqx-icon-arrow-up, .jqx-success .jqx-icon-arrow-up, .jqx-info .jqx-icon-arrow-up {
    background-image: url('images/icon-up-white.png');
}

.jqx-primary .jqx-icon-arrow-up-selected, .jqx-warning .jqx-icon-arrow-up-selected, .jqx-danger .jqx-icon-arrow-up-selected, .jqx-success .jqx-icon-arrow-up-selected, .jqx-info .jqx-icon-arrow-up-selected {
    background-image: url('images/icon-up-white.png');
}

.jqx-primary .jqx-icon-arrow-up-hover, .jqx-warning .jqx-icon-arrow-up-hover, .jqx-danger .jqx-icon-arrow-up-hover, .jqx-success .jqx-icon-arrow-up-hover, .jqx-info .jqx-icon-arrow-up-hover {
    background-image: url('images/icon-up-white.png');
}

.jqx-primary .jqx-icon-arrow-right, .jqx-warning .jqx-icon-arrow-right, .jqx-danger .jqx-icon-arrow-right, .jqx-success .jqx-icon-arrow-right, .jqx-info .jqx-icon-arrow-right {
    background-image: url('images/icon-right-white.png');
}

.jqx-primary .jqx-icon-arrow-right-selected, .jqx-warning .jqx-icon-arrow-right-selected, .jqx-danger .jqx-icon-arrow-right-selected, .jqx-success .jqx-icon-arrow-right-selected, .jqx-info .jqx-icon-arrow-right-selected {
    background-image: url('images/icon-right-white.png');
}

.jqx-primary .jqx-icon-arrow-right-hover, .jqx-warning .jqx-icon-arrow-right-hover, .jqx-danger .jqx-icon-arrow-right-hover, .jqx-success .jqx-icon-arrow-right-hover, .jqx-info .jqx-icon-arrow-right-hover {
    background-image: url('images/icon-right-white.png');
}

.jqx-primary .jqx-icon-arrow-left, .jqx-warning .jqx-icon-arrow-left, .jqx-danger .jqx-icon-arrow-left, .jqx-success .jqx-icon-arrow-left, .jqx-info .jqx-icon-arrow-left {
    background-image: url('images/icon-left-white.png');
}

.jqx-primary .jqx-icon-arrow-left-selected, .jqx-warning .jqx-icon-arrow-left-selected, .jqx-danger .jqx-icon-arrow-left-selected, .jqx-success .jqx-icon-arrow-left-selected, .jqx-info .jqx-icon-arrow-left-selected {
    background-image: url('images/icon-left-white.png');
}

.jqx-primary .jqx-icon-arrow-left-hover, .jqx-warning .jqx-icon-arrow-left-hover, .jqx-danger .jqx-icon-arrow-left-hover, .jqx-success .jqx-icon-arrow-left-hover, .jqx-info .jqx-icon-arrow-left-hover {
    background-image: url('images/icon-left-white.png');
}

.jqx-primary-item .jqx-listitem-state-hover, .jqx-primary-item .jqx-menu-item-hover, .jqx-primary-item .jqx-tree-item-hover, .jqx-primary-item .jqx-calendar-cell-hover, .jqx-primary-item .jqx-grid-cell-hover,
.jqx-primary-item .jqx-menu-vertical .jqx-menu-item-top-hover, .jqx-primary-item .jqx-input-popup .jqx-fill-state-hover,
.jqx-primary-item .jqx-input-popup .jqx-fill-state-pressed {
    background-color: #f5f5f5 !important;
    color: #333 !important;
    text-shadow: none !important;
    border-color: #f5f5f5 !important;
}

.jqx-primary-item .jqx-listitem-state-selected, .jqx-primary-item .jqx-menu-item-selected, .jqx-primary-item .jqx-tree-item-selected, .jqx-primary-item .jqx-calendar-cell-selected, .jqx-primary-item .jqx-grid-cell-selected,
.jqx-primary-item .jqx-menu-vertical .jqx-primary-item .jqx-menu-item-top-selected, .jqx-primary-item .jqx-grid-selectionarea, .jqx-primary-item .jqx-input-button-header, .jqx-primary-item .jqx-input-button-innerHeader {
    background-color: #f5f5f5 !important;
    color: #333 !important;
    text-shadow: none !important;
    border-color: #f5f5f5 !important;
}

.jqx-warning-item .jqx-listitem-state-hover, .jqx-warning-item .jqx-menu-item-hover, .jqx-warning-item .jqx-tree-item-hover, .jqx-warning-item .jqx-calendar-cell-hover, .jqx-warning-item .jqx-grid-cell-hover,
.jqx-warning-item .jqx-menu-vertical .jqx-menu-item-top-hover, .jqx-warning-item .jqx-input-popup .jqx-fill-state-hover,
.jqx-warning-item .jqx-input-popup .jqx-fill-state-pressed {
    background-color: #f5f5f5 !important;
    color: #333 !important;
    text-shadow: none !important;
    border-color: #f5f5f5 !important;
}

.jqx-warning-item .jqx-listitem-state-selected, .jqx-warning-item .jqx-menu-item-selected, .jqx-warning-item .jqx-tree-item-selected, .jqx-warning-item .jqx-calendar-cell-selected, .jqx-warning-item .jqx-grid-cell-selected,
.jqx-warning-item .jqx-menu-vertical .jqx-warning-item .jqx-menu-item-top-selected, .jqx-warning-item .jqx-grid-selectionarea, .jqx-warning-item .jqx-input-button-header, .jqx-warning-item .jqx-input-button-innerHeader {
    background-color: #f5f5f5 !important;
    color: #333 !important;
    text-shadow: none !important;
    border-color: #f5f5f5 !important;
}

.jqx-danger-item .jqx-listitem-state-hover, .jqx-danger-item .jqx-menu-item-hover, .jqx-danger-item .jqx-tree-item-hover, .jqx-danger-item .jqx-calendar-cell-hover, .jqx-danger-item .jqx-grid-cell-hover,
.jqx-danger-item .jqx-menu-vertical .jqx-menu-item-top-hover, .jqx-danger-item .jqx-input-popup .jqx-fill-state-hover,
.jqx-danger-item .jqx-input-popup .jqx-fill-state-pressed {
    background-color: #f5f5f5 !important;
    color: #333 !important;
    text-shadow: none !important;
    border-color: #f5f5f5 !important;
}

.jqx-danger-item .jqx-listitem-state-selected, .jqx-danger-item .jqx-menu-item-selected, .jqx-danger-item .jqx-tree-item-selected, .jqx-danger-item .jqx-calendar-cell-selected, .jqx-danger-item .jqx-grid-cell-selected,
.jqx-danger-item .jqx-menu-vertical .jqx-danger-item .jqx-menu-item-top-selected, .jqx-danger-item .jqx-grid-selectionarea, .jqx-danger-item .jqx-input-button-header, .jqx-danger-item .jqx-input-button-innerHeader {
    background-color: #f5f5f5 !important;
    color: #333 !important;
    text-shadow: none !important;
    border-color: #f5f5f5 !important;
}

.jqx-success-item .jqx-listitem-state-hover, .jqx-success-item .jqx-menu-item-hover, .jqx-success-item .jqx-tree-item-hover, .jqx-success-item .jqx-calendar-cell-hover, .jqx-success-item .jqx-grid-cell-hover,
.jqx-success-item .jqx-menu-vertical .jqx-menu-item-top-hover, .jqx-success-item .jqx-input-popup .jqx-fill-state-hover,
.jqx-success-item .jqx-input-popup .jqx-fill-state-pressed {
    background-color: #f5f5f5 !important;
    color: #333 !important;
    text-shadow: none !important;
    border-color: #f5f5f5 !important;
}

.jqx-success-item .jqx-listitem-state-selected, .jqx-success-item .jqx-menu-item-selected, .jqx-success-item .jqx-tree-item-selected, .jqx-success-item .jqx-calendar-cell-selected, .jqx-success-item .jqx-grid-cell-selected,
.jqx-success-item .jqx-menu-vertical .jqx-success-item .jqx-menu-item-top-selected, .jqx-success-item .jqx-grid-selectionarea, .jqx-success-item .jqx-input-button-header, .jqx-success-item .jqx-input-button-innerHeader {
    background-color: #f5f5f5 !important;
    color: #333 !important;
    text-shadow: none !important;
    border-color: #f5f5f5 !important;
}

.jqx-info-item .jqx-listitem-state-hover, .jqx-info-item .jqx-menu-item-hover, .jqx-info-item .jqx-tree-item-hover, .jqx-info-item .jqx-calendar-cell-hover, .jqx-info-item .jqx-grid-cell-hover,
.jqx-info-item .jqx-menu-vertical .jqx-menu-item-top-hover, .jqx-info-item .jqx-input-popup .jqx-fill-state-hover,
.jqx-info-item .jqx-input-popup .jqx-fill-state-pressed {
    background-color: #f5f5f5 !important;
    color: #333 !important;
    text-shadow: none !important;
    border-color: #f5f5f5 !important;
}

.jqx-info-item .jqx-listitem-state-selected, .jqx-info-item .jqx-menu-item-selected, .jqx-info-item .jqx-tree-item-selected, .jqx-info-item .jqx-calendar-cell-selected, .jqx-info-item .jqx-grid-cell-selected,
.jqx-info-item .jqx-menu-vertical .jqx-info-item .jqx-menu-item-top-selected, .jqx-info-item .jqx-grid-selectionarea, .jqx-info-item .jqx-input-button-header, .jqx-info-item .jqx-input-button-innerHeader {
    background-color: #f5f5f5 !important;
    color: #333 !important;
    text-shadow: none !important;
    border-color: #f5f5f5 !important;
}

.jqx-inverse-item .jqx-listitem-state-hover, .jqx-inverse-item .jqx-menu-item-hover, .jqx-inverse-item .jqx-tree-item-hover, .jqx-inverse-item .jqx-calendar-cell-hover, .jqx-inverse-item .jqx-grid-cell-hover,
.jqx-inverse-item .jqx-menu-vertical .jqx-menu-item-top-hover, .jqx-inverse-item .jqx-input-popup .jqx-fill-state-hover,
.jqx-inverse-item .jqx-input-popup .jqx-fill-state-pressed {
    background-color: #f5f5f5 !important;
    color: #333 !important;
    text-shadow: none !important;
    border-color: #f5f5f5 !important;
}

.jqx-inverse-item .jqx-listitem-state-selected, .jqx-inverse-item .jqx-menu-item-selected, .jqx-inverse-item .jqx-tree-item-selected, .jqx-inverse-item .jqx-calendar-cell-selected, .jqx-inverse-item .jqx-grid-cell-selected,
.jqx-inverse-item .jqx-menu-vertical .jqx-inverse-item .jqx-menu-item-top-selected, .jqx-inverse-item .jqx-grid-selectionarea, .jqx-inverse-item .jqx-input-button-header, .jqx-inverse-item .jqx-input-button-innerHeader {
    background-color: #f5f5f5 !important;
    color: #333 !important;
    text-shadow: none !important;
    border-color: #f5f5f5 !important;
}

.jqx-element {
    overflow: hidden;
    border-style: solid;
    border-width: 0px;
    border-color: transparent;
    box-sizing: border-box;
}

.jqx-element-no-border {
    border-width: 0px;
}

.jqx-element-container {
}

.jqx-resize-trigger, .jqx-resize-trigger-shrink {
    position: absolute;
    left: 0;
    top: 0;
    transition: 0s;
}

.jqx-resize-trigger-shrink {
    width: 200%;
    height: 200%;
}

.jqx-resize-trigger-container {
    display: block;
    visibility: hidden;
    position: relative;
    top: -100%;
    left: 0;
    min-height: 0.1px;
    height: 100%;
    width: 100%;
    overflow: hidden;
    pointer-events: none;
    z-index: -1;
    visibility: hidden;
}

/* jqxPivotGrid */
.jqx-pivotgrid {
    background-color: #DEDEDE;
}

.jqx-pivotgrid-item {
    white-space: nowrap;
    overflow: hidden;
    position: absolute;
    padding: 0px;
    text-overflow: ellipsis;
}

.jqx-pivotgrid-content-wrapper {
    align: left;
    valign: top;
    overflow: hidden;
    border: solid 1px grey;
}

.jqx-pivotgrid-menu-button {
    border: none;
    background-image: url('images/icon-menu-small.png');
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
}

.jqx-pivotgrid-expand-button {
    outline: none;
    background-image: url('images/icon_expand.png');
    background-repeat: no-repeat;
    cursor: pointer;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    position: relative;
    left: 5px;
    float: left;
    vertical-align: middle;
}

.jqx-pivotgrid-collapse-button {
    outline: none;
    background-image: url('images/icon_collapse.png');
    background-repeat: no-repeat;
    cursor: pointer;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    position: relative;
    left: 5px;
    float: left;
    vertical-align: middle;
}

.jqx-pivotgrid-sortasc-icon {
    background-image: url('images/icon-sort-asc.png');
    background-repeat: no-repeat;
    background-position: left center;
    width: 16px;
    height: 16px;
    float: left;
    margin-left: -4px;
    margin-right: 4px;
}

.jqx-pivotgrid-sortdesc-icon {
    background-image: url('images/icon-sort-desc.png');
    background-repeat: no-repeat;
    background-position: left center;
    width: 16px;
    height: 16px;
    float: left;
    margin-left: -4px;
    margin-right: 4px;
}

.jqx-pivotgrid-sortremove-icon {
    background-image: url('images/icon-sort-remove.png');
    background-repeat: no-repeat;
    background-position: left center;
    width: 16px;
    height: 16px;
    float: left;
    margin-left: -4px;
    margin-right: 4px;
}

.jqx-pivotgrid-settings-icon {
    background-image: url('images/icon-menu-small.png');
    background-repeat: no-repeat;
    background-position: left center;
    width: 16px;
    height: 16px;
    float: left;
    margin-left: -4px;
    margin-right: 4px;
}

jqx-bullet-chart {
    width: 800px;
    height: 80px;
}

jqx-scroll-view {
    width: 600px;
}

jqx-bar-gauge, jqx-draw {
    width: 850px;
    height: 600px;
}

jqx-menu {
    width: 600px;
}

jqx-data-table, jqx-pivotgrid, jqx-grid, jqx-scheduler, jqx-tree-grid, jqx-docking-layout, jqx-layout, jqx-tree-map, jqx-splitter, jqx-kanban {
    width: 850px;
}

jqx-nav-bar {
    height: 50px;
}

jqx-chart {
    width: 850px;
    height: 400px;
}

jqx-docking-layout, jqx-layout {
    width: 850px;
    height: 600px;
}

jqx-ribbon, jqx-panel {
    width: 450px;
    height: 300px;
}

jqx-scheduler {
    height: 600px;
}

jqx-list-box, jqx-text-area {
    width: 200px;
    height: 200px;
}

jqx-file-upload {
    width: 300px;
}

jqx-complex-input, jqx-formatted-input, jqx-password-input, jqx-input, jqx-number-input, jqx-slider,
jqx-masked-input, jqx-drop-down-list, jqx-combo-box, jqx-date-time-input, jqx-drop-down-button {
    width: 300px;
    height: 35px;
}

jqx-loader {
    width: 100px !important;
    height: 60px !important;
}

jqx-expander, jqx-navigation-bar {
    width: 350px;
}

jqx-navigation-bar {
    height: 450px;
}

jqx-range-selector {
    width: 600px;
}

jqx-tabs {
    width: 800px;
}

jqx-tool-bar {
    width: 800px;
    height: 35px;
}

jqx-editor {
    width: 600px;
    height: 400px;
}

jqx-tree-map {
    width: 850px;
    height: 600px;
}

jqx-tree {
    width: 250px;
}

jqx-linear-gauge {
    width: 100px;
}

jqx-color-picker, jqx-calendar {
    width: 200px;
    height: 200px;
}

jqx-scroll-bar {
    width: 400px;
    height: 20px;
}

jqx-knob {
    width: 600px;
    height: 600px;
}

.jqx-input-label {
    visibility: hidden;
    position: absolute;
}

.jqx-input-bar {
    visibility: hidden;
    position: absolute;
}

.jqx-info-icon {
    background-image: url('images/icon-info-small.png');
    background-repeat: no-repeat;
    background-position: left center;
    width: 16px;
    height: 16px;
    float: left;
}

.jqx-labels-and-palette {
    display: flex;
}

.jqx-shades {
    width: 560px;
    padding-left: 100px;
}

.jqx-palette > ul,
.jqx-shades > ul,
.jqx-color-labels > ul {
    display: flex;
    list-style: none;
    padding: 0;
    margin: 0;
}

.jqx-color-labels > ul {
    flex-direction: column;
}

.jqx-color-cell {
    width: 39px;
    height: 39px;
    margin: 0.5px;
    cursor: pointer;
}

.jqx-color-cell:hover {
    border-radius: 8px;
}

.jqx-shade-cell {
    width: 38px;
    height: 47px;
    display: flex;
    justify-content: center;
    align-items: flex-end;
    padding: 0 1px 5px 1px;
    text-align: center;
}

.jqx-color-label {
    width: 100px;
    height: 40px;
    display: flex;
    align-items: center;
}

.jqx-heatmap-container-wrapper {
    display: flex;
}

.jqx-heatmap-container-wrapper canvas {
    display: block;
}

.jqx-heatmap-title {
    font-weight: bold;
    margin-bottom: 25px;
    text-align: center;
}

.jqx-heatmap-grid {
    display: flex;
    cursor: default;
}

.jqx-x-axis-container {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.jqx-y-axis-container {
    display: flex;
    flex-direction: row-reverse;
    flex-grow: 1;
}

.jqx-column {
    display: flex;
    flex-direction: column-reverse;
}

.jqx-x-axis {
    display: flex;
}

.jqx-x-axis-label {
    padding-top: 10px;
    font-size: 14px;
    color: gray;
    text-align: center;
}

.jqx-x-axis-label.jqx-top {
    padding: 0 0 10px 0;
}

.jqx-y-axis {
    display: flex;
    flex-direction: column-reverse;
}

.jqx-y-axis.jqx-margin-top-auto {
    margin-top: auto;
}

.jqx-y-axis-label {
    display: flex;
    align-items: center;
    color: gray;
    padding-right: 10px;
}

.jqx-y-axis-label.jqx-right {
    padding: 0 0 0 10px;
}

.jqx-heatmap-cell {
    position: relative;
    padding: 20px 10px;
    margin: 1px;
    text-align: center;
}

.jqx-heatmap-cell.jqx-empty-cell {
    pointer-events: none;
}

.jqx-heatmap-tooltip {
    display: inline-block;
    position: absolute;
    background: #000;
    color: #fff;
    opacity: 0.6;
    padding: 10px;
    pointer-events: none;
    border-radius: 3px;
    transition: top 0.7s ease, left 0.7s ease;
    box-shadow: 0px 5px 3px -3px rgba(0, 0, 0, 0.75);
}

.jqx-heatmap-tooltip::after {
    content: '';
    position: absolute;
    bottom: -10px;
    left: calc(50% - 5px);
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 5px 0 5px;
    border-color: #000 transparent transparent transparent;
}

.jqx-legend-vertical {
    position: relative;
    margin-left: 10px;
}

.jqx-legend-vertical.jqx-left {
    margin: 0 10px 0 0;
}

.jqx-legend-vertical.jqx-margin-top-auto {
    margin-top: auto;
}

.jqx-legend-horizontal {
    position: relative;
    margin-left: auto;
    margin-bottom: 40px;
}

.jqx-legend-horizontal.jqx-bottom {
    margin-top: 10px;
    margin-bottom: 30px;
}

.jqx-legend-horizontal.jqx-margin-right-auto {
    margin-right: auto;
    margin-left: 0;
}

.jqx-palette-vertical {
    width: 10px;
    height: 100%;
}

.jqx-palette-horizontal {
    width: 100%;
    height: 10px;
}

.jqx-palette-horizontal.jqx-fixed {
    display: flex;
}

.jqx-color-container,
.jqx-color-container-tick {
    cursor: pointer;
}

.jqx-opacity-50 {
    opacity: 0.5;
}

.jqx-selected-color {
    background: #d3d3d3 !important;
}

.jqx-heatmap-hidden {
    visibility: hidden;
}

.jqx-tick-vertical {
    position: absolute;
    left: 15px;
}

.jqx-tick-vertical::before {
    content: '';
    width: 10px;
    background: #fff;
    height: 1px;
    position: absolute;
    top: 6px;
    left: -15px;
}

.jqx-tick-vertical.jqx-no-line::before,
.jqx-tick-horizontal.jqx-no-line::before {
    content: none;
}

.jqx-tick-horizontal {
    position: absolute;
    top: 20px;
}

.jqx-tick-horizontal::before {
    content: '';
    width: 10px;
    background: #fff;
    width: 1px;
    height: 10px;
    position: absolute;
    top: -20px;
    left: 6px;
}

.jqx-arrow-vertical {
    width: 0;
    height: 0;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
    border-left: 6px solid gray;
    position: absolute;
    left: -8px;
    display: none;
}

.jqx-arrow-horizontal {
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-bottom: 6px solid gray;
    position: absolute;
    top: 11px;
    left: -6px;
    display: none;
}

/*jqxTimePicker Style*/
.jqx-time-picker {
    display: block;
    border: 1px solid #c5c5c5;
    border-radius: 1px;
    font-family: Verdana;
    font-size: 12px;
    line-height: initial;
    touch-action: none;
    min-width: 250px;
    box-sizing: border-box;
}

.jqx-time-picker * {
    box-sizing: border-box;
}

.jqx-time-picker[view="landscape"] {
    min-width: 400px;
}

.jqx-time-picker > .jqx-container {
    width: 100%;
    height: 100%;
}

.jqx-time-picker[view="landscape"] > .jqx-container, .jqx-time-picker .jqx-header, .jqx-time-picker .jqx-svg-container, .jqx-time-picker .jqx-hour-minute-container {
    display: flex;
}

.jqx-time-picker .jqx-header {
    width: 100%;
    height: 20%;
    justify-content: center;
    align-items: center;
}

.jqx-time-picker[view="landscape"] .jqx-header {
    flex-direction: column;
    width: 33%;
    height: 100%;
}

.jqx-time-picker .jqx-main-container {
    width: 100%;
    height: 80%;
    padding: 2%;
    background-color: var(--jqx-time-picker-background);
}

.jqx-time-picker[view="portrait"] .jqx-header.jqx-widget-header.jqx-unselectable {
    border-top-left-radius: inherit;
    border-top-right-radius: inherit;
}

.jqx-time-picker[view="landscape"] .jqx-main-container {
    width: 67%;
    height: 100%;
}

.jqx-time-picker .jqx-svg-container {
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
}

.jqx-time-picker[footer] .jqx-svg-container {
    height: calc(100% - 30px);
}

.jqx-time-picker .jqx-footer {
    display: none;
}

.jqx-time-picker[footer] .jqx-footer {
    display: block;
    width: 100%;
    height: 30px;
}

.jqx-time-picker .jqx-hour-minute-container {
    font-size: 50px;
}

.jqx-time-picker .jqx-am-pm-container {
    margin-left: 10px;
}

.jqx-time-picker[view="landscape"] .jqx-am-pm-container {
    margin-left: 0;
}

.jqx-time-picker .jqx-hour-container, .jqx-time-picker .jqx-minute-container, .jqx-time-picker .jqx-am-container, .jqx-time-picker .jqx-pm-container {
    opacity: 0.5;
    cursor: pointer;
}

.jqx-time-picker[readonly] .jqx-hour-container, .jqx-time-picker[disabled] .jqx-hour-container, .jqx-time-picker[readonly] .jqx-minute-container, .jqx-time-picker[disabled] .jqx-minute-container, .jqx-time-picker[readonly] .jqx-am-container, .jqx-time-picker[disabled] .jqx-am-container, .jqx-time-picker[readonly] .jqx-pm-container, .jqx-time-picker[disabled] .jqx-pm-container {
    cursor: default;
}

.jqx-time-picker .jqx-selected {
    opacity: 1;
}

.jqx-time-picker .jqx-hour-minute-container div:nth-child(2) {
    opacity: 0.5;
}

.jqx-time-picker .jqx-svg-picker {
    border-radius: 50%;
    position: relative;
    box-sizing: content-box;
}

.jqx-time-picker .jqx-svg-picker.animate {
    animation: jqx-time-picker-animation 0.5s linear;
}

.jqx-time-picker[disabled] {
    opacity: 0.55;
    cursor: default;
    pointer-events: none;
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

.jqx-time-picker .jqx-label.jqx-selected {
    fill: white;
}

.jqx-time-picker .jqx-header:focus {
    outline: 1px solid skyblue;
}

.jqx-time-picker .jqx-svg-picker:focus {
    border: 1px solid skyblue;
    outline: none;
}

@keyframes jqx-time-picker-animation {
    0% {
        opacity: 1;
    }
    25% {
        opacity: 0.5;
    }
    50% {
        opacity: 0;
    }
    75% {
        opacity: 0.5;
    }
    100% {
        opacity: 1;
    }
}

.jqx-grid-card-row {
    display: grid;
    grid-template-columns: 1fr;
    height: 100%;
    overflow: hidden;
}

.jqx-grid-card-cell {
    padding: 15px;
    overflow: auto;
}

.jqx-grid-card-cell table {
    width: 100%;
    height: 100%;
    padding: 10px;
    table-layout: fixed;
    border: 1px solid #bbb;
    overflow: hidden;
    text-overflow: ellipsis;
    border-radius: 4px;
    box-shadow: 0 3px 1px -2px rgba(0, 0, 0, .2), 0 2px 2px 0 rgba(0, 0, 0, .14), 0 1px 5px 0 rgba(0, 0, 0, .12);
}

.jqx-grid-card-cell {
    position: relative;
}

.jqx-grid-card-cell .jqx-icon-edit {
    width: 16px;
    height: 16px;
    display: inline-block;
    position: absolute;
    right: 25px;
    top: 25px;
    background-size: 13px;
    cursor: pointer;
}

.jqx-grid-card-cell input {
    padding: 4px;

}

.jqx-grid-card-cell-label {
    font-size: 12px;
    text-transform: uppercase;
    color: rgb(90, 90, 90);
}

.jqx-grid-card-cell td div {
    text-overflow: ellipsis;
    overflow: hidden;
}

.jqx-card-edit-buttons {
    display: flex;
    margin-top: 30px;
    justify-content: center;
}


/* ----- ../../Common/Libs/CBMods/jqx.chessbase.css ----- */
.jqx-widget-content-chessbase {
    border: 0;
}

.jqx-fill-state-normal-chessbase, .jqx-widget-header-chessbase {
    background-color: hsla(30, 30%, 96%, 1.0);
    box-shadow: 0px 0px 25px hsla(30, 30%, 70%, 0.4) inset;
}

.jqx-fill-state-hover-chessbase {
    background-color: hsla(40, 40%, 99%, 1.0);
    box-shadow: 0px 0px 25px hsla(120, 50%, 30%, 0.6) inset;
}

.jqx-fill-state-pressed-chessbase {
    background-color: hsla(30, 50%, 99%, 1.0);
    box-shadow: 0px 0px 45px hsla(40, 30%, 50%, 0.6) inset;
}

.jqx-fill-state-focus-chessbase {
    border-color: #477396;
}

.jqx-scrollbar-state-normal-chessbase, .jqx-grid-bottomright-chessbase, .jqx-panel-bottomright-chessbase, .jqx-listbox-bottomright-chessbase {
    background-color: #e0e9f5;
}

.jqx-widget-chessbase .jqx-grid-column-header-chessbase, .jqx-grid-cell-chessbase, .jqx-widget-chessbase .jqx-grid-cell-chessbase, .jqx-widget-chessbase .jqx-grid-group-cell-chessbase, .jqx-grid-group-cell-chessbase {
    font-family: Roboto, sans-serif;
    border-color: hsla(30, 30%, 30%, 0.3);
}

.jqx-grid-groups-row-details-chessbase {
    font-family: Montserrat;
}

.jqx-grid-column-header-chessbase {
    /*background-image:linear-gradient(to bottom, hsl( 31, 25%, 70% ) 20%, hsl( 31, 25%, 54% ) );*/
    background-image: linear-gradient(to bottom, hsl(31, 25%, 98%) 20%, hsl(31, 25%, 94%));
    color: hsl(30, 30%, 30%);
}

.jqx-tabs-title-chessbase {
    border-top: 2px solid;
    border-left: 2px solid;
    border-right: 2px solid;
    border-bottom: 1px solid;
    border-top-left-radius: 10px;
    border-top-right-radius: 6px;
    border-color: hsla(30, 30%, 60%, 0.4);
}

.jqx-tabs-title-selected-bottom-chessbase, .jqx-tabs-selection-tracker-bottom-chessbase, .jqx-tabs-title-selected-top-chessbase, .jqx-tabs-selection-tracker-top-chessbase {
    border-color: #a4bed4;
    border-bottom: 1px solid hsla(30, 40%, 50%, 0.6);
    /*  background: #fff;*/
}

.jqx-grid-cell-filter-alt-chessbase, .jqx-grid-cell-pinned-chessbase, .jqx-grid-cell-alt-chessbase {
    background-color: hsla(230, 20%, 90%, 0.3);
}

.jqx-grid-chessbase div[role=row]:nth-child(even) div[role=gridcell] {
    background-color: hsla(31, 20%, 90%, 0.4);
}

.jqx-grid-cell-sort-alt-chessbase, .jqx-grid-cell-sort-chessbase {
    background-color: hsla(130, 20%, 90%, 0.3);
}

.jqx-grid-cell-selected-chessbase {
    background-color: #cfdde9 !important;
    color: #2b465e !important;
}

.jqx-grid-cell-hover-chessbase {
    background-color: #cfdde9 !important;
}

.jqx-grid-cell-left-align {
    margin-left: 5px;
    font-family: Roboto Condensed, sans-serif;
}

@media screen and ( min-width: 800px ) {
    .jqx-grid-cell-left-align {
        font-family: Roboto, sans-serif;
    }
}

.jqx-menu-vertical-chessbase {
    background: #e0e9f5;
}

.jqx-layout-chessbase {
    background-color: #a4bed4;
}

.jqx-grid-cell-pinned-chessbase {
    background-color: hsl(30, 30%, 95%);
}

/********************************/

.jqx-ribbon-content-section-top-chessbase {
    background-image: linear-gradient(to bottom, hsl(30, 30%, 88%) 20%, hsl(30, 30%, 80%)) !important;
}

.jqx-button-chessbase {
    border-radius: 6px;
}

.jqx-window-chessbase {
    border: 1px solid hsla(30, 30%, 20%, 0.4);
    border-radius: 10px;
    box-shadow: 2px 2px 20px hsla(30, 20%, 40%, 0.2);
}

.jqx-window-content-chessbase {
    background-color: hsl(30, 30%, 98%);
}

.jqx-input-chessbase {
    border: 1px solid hsla(30, 30%, 30%, 0.2);
    border-radius: 4px;
}

/********************************/

.jqx-tooltip-chessbase {
    border-radius: 6px;
}

.jqx-splitter-splitbar-horizontal-chessbase {
    background-image: linear-gradient(to bottom, hsla(30, 40%, 92%, 0.4) 30%, hsla(30, 40%, 75%, 0.4));
}

.jqx-splitter-splitbar-vertical-chessbase {
    background-image: linear-gradient(to right, hsla(30, 40%, 92%, 0.4) 30%, hsla(30, 40%, 75%, 0.4));
}


/*.jqx-splitter-collapse-button-horizontal-chessbase:after
{
   content: "Drag this to resize";
}

.jqx-splitter-collapse-button-horizontal-chessbase
{
   width: 70px;
}*/


/*@media screen and (max-width:700px)
{
   .jqx-splitter-splitbar-horizontal-chessbase:after
   {
      content: "Drag this to resize";
      font-size: 8px;
      color: black;
      margin-left: auto;
      margin-right: auto;
   }
}*/

.cbJqxTabHeaderText {
    float: left;
    margin-left: 5px;
    margin-top: 4px;
}


.cbJqxFormTable {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    padding-top: 8px;
    margin-left: 0px;
}

.cbJqxFormCaption {
    margin-right: 4px;
    min-width: 120px;
}

.cbJqxFormSeparator {
    /*margin-top:12px;*/
    height: 2px;
    margin: 0 20px 0 20px;
    background-color: hsla(30, 30%, 30%, 0.2);
}


/* ----- ../../Common/Libs/CBMods/jqx.chessbasered.css ----- */
.jqx-widget-content-chessbase {
    border: 0;
}

.jqx-fill-state-normal-chessbase, .jqx-widget-header-chessbase {
    background-color: hsla(30, 30%, 96%, 1.0);
    box-shadow: 0px 0px 25px hsla(30, 30%, 70%, 0.4) inset;
}

.jqx-fill-state-hover-chessbase {
    background-color: hsla(40, 40%, 99%, 1.0);
    box-shadow: 0px 0px 25px hsla(120, 50%, 30%, 0.6) inset;
}

.jqx-fill-state-pressed-chessbase {
    background-color: hsla(30, 50%, 99%, 1.0);
    box-shadow: 0px 0px 45px hsla(40, 30%, 50%, 0.6) inset;
}

.jqx-fill-state-focus-chessbase {
    border-color: #477396;
}

.jqx-scrollbar-state-normal-chessbase, .jqx-grid-bottomright-chessbase, .jqx-panel-bottomright-chessbase, .jqx-listbox-bottomright-chessbase {
    background-color: #e0e9f5;
}

.jqx-widget-chessbase .jqx-grid-column-header-chessbase, .jqx-grid-cell-chessbase, .jqx-widget-chessbase .jqx-grid-cell-chessbase, .jqx-widget-chessbase .jqx-grid-group-cell-chessbase, .jqx-grid-group-cell-chessbase {
    font-family: Roboto, sans-serif;
    border-color: hsla(30, 30%, 30%, 0.3);
}

.jqx-grid-groups-row-details-chessbase {
    font-family: Montserrat;
}

.jqx-grid-column-header-chessbase {
    /*background-image:linear-gradient(to bottom, hsl( 31, 25%, 70% ) 20%, hsl( 31, 25%, 54% ) );*/
    background-image: linear-gradient(to bottom, hsl(31, 25%, 98%) 20%, hsl(31, 25%, 94%));
    color: hsl(30, 30%, 30%);
}

.jqx-tabs-title-chessbase {
    border-top: 2px solid;
    border-left: 2px solid;
    border-right: 2px solid;
    border-bottom: 1px solid;
    border-top-left-radius: 10px;
    border-top-right-radius: 6px;
    border-color: hsla(30, 30%, 60%, 0.4);
}

.jqx-tabs-title-selected-bottom-chessbase, .jqx-tabs-selection-tracker-bottom-chessbase, .jqx-tabs-title-selected-top-chessbase, .jqx-tabs-selection-tracker-top-chessbase {
    border-color: #a4bed4;
    border-bottom: 1px solid hsla(30, 40%, 50%, 0.6);
    /*  background: #fff;*/
}

.jqx-grid-cell-filter-alt-chessbase, .jqx-grid-cell-pinned-chessbase, .jqx-grid-cell-alt-chessbase {
    background-color: hsla(230, 20%, 90%, 0.3);
}

.jqx-grid-chessbase div[role=row]:nth-child(even) div[role=gridcell] {
    background-color: hsla(31, 20%, 90%, 0.4);
}

.jqx-grid-cell-sort-alt-chessbase, .jqx-grid-cell-sort-chessbase {
    background-color: hsla(130, 20%, 90%, 0.3);
}

.jqx-grid-cell-selected-chessbase {
    background-color: #cfdde9 !important;
    color: #2b465e !important;
}

.jqx-grid-cell-hover-chessbase {
    background-color: #cfdde9 !important;
}

.jqx-grid-cell-left-align {
    margin-left: 5px;
    font-family: Roboto Condensed, sans-serif;
}

@media screen and ( min-width: 800px ) {
    .jqx-grid-cell-left-align {
        font-family: Roboto, sans-serif;
    }
}

.jqx-menu-vertical-chessbase {
    background: #e0e9f5;
}

.jqx-layout-chessbase {
    background-color: #a4bed4;
}

.jqx-grid-cell-pinned-chessbase {
    background-color: hsl(30, 30%, 95%);
}

/********************************/

.jqx-ribbon-content-section-top-chessbase {
    background-image: linear-gradient(to bottom, hsl(30, 30%, 88%) 20%, hsl(30, 30%, 80%)) !important;
}

.jqx-button-chessbase {
    border-radius: 6px;
}

.jqx-window-chessbase {
    border: 1px solid hsla(30, 30%, 20%, 0.4);
    border-radius: 10px;
    box-shadow: 2px 2px 20px hsla(30, 20%, 40%, 0.2);
}

.jqx-window-content-chessbase {
    background-color: hsl(30, 30%, 98%);
}

.jqx-input-chessbase {
    border: 1px solid hsla(30, 30%, 30%, 0.2);
    border-radius: 4px;
}

/********************************/

.jqx-tooltip-chessbase {
    border-radius: 6px;
}

/*.jqx-splitter-splitbar-horizontal-chessbase
{
   background-image: linear-gradient( to bottom, hsla( 30, 40%, 92%, 0.4 ) 30%, hsla( 30, 40%, 75%, 0.4 ) );
}
*/
.jqx-splitter-splitbar-vertical-chessbasered {
    background-image: linear-gradient(to right, hsla(30, 0%, 92%, 0.4) 30%, hsla(30, 0%, 75%, 0.4));
}

.jqx-splitter-splitbar-horizontal-chessbasered {
    background-image: linear-gradient(to bottom, hsla(30, 0%, 92%, 0.4) 30%, hsla(30, 0%, 75%, 0.4));
}


/*.jqx-splitter-collapse-button-horizontal-chessbase:after
{
   content: "Drag this to resize";
}

.jqx-splitter-collapse-button-horizontal-chessbase
{
   width: 70px;
}*/


/*@media screen and (max-width:700px)
{
   .jqx-splitter-splitbar-horizontal-chessbase:after
   {
      content: "Drag this to resize";
      font-size: 8px;
      color: black;
      margin-left: auto;
      margin-right: auto;
   }
}*/

.cbJqxTabHeaderText {
    float: left;
    margin-left: 5px;
    margin-top: 4px;
}


.cbJqxFormTable {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    padding-top: 8px;
    margin-left: 0px;
}

.cbJqxFormCaption {
    margin-right: 4px;
    min-width: 120px;
}

.cbJqxFormSeparator {
    /*margin-top:12px;*/
    height: 2px;
    margin: 0 20px 0 20px;
    background-color: hsla(30, 30%, 30%, 0.2);
}


/* ----- ../../Common/Libs/Swiper/swiper-bundle.css ----- */
/**
 * Swiper 7.4.1
 * Most modern mobile touch slider and framework with hardware accelerated transitions
 * https://swiperjs.com
 *
 * Copyright 2014-2021 Vladimir Kharlampidi
 *
 * Released under the MIT License
 *
 * Released on: December 24, 2021
 */

@font-face {
    font-family: 'swiper-icons';
    src: url('data:application/font-woff;charset=utf-8;base64, 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');
    font-weight: 400;
    font-style: normal;
}

:root {
    --swiper-theme-color: #007aff;
}

.swiper {
    margin-left: auto;
    margin-right: auto;
    position: relative;
    overflow: hidden;
    list-style: none;
    padding: 0;
    /* Fix of Webkit flickering */
    z-index: 1;
}

.swiper-vertical > .swiper-wrapper {
    flex-direction: column;
}

.swiper-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: flex;
    transition-property: transform;
    box-sizing: content-box;
}

.swiper-android .swiper-slide,
.swiper-wrapper {
    transform: translate3d(0px, 0, 0);
}

.swiper-pointer-events {
    touch-action: pan-y;
}

.swiper-pointer-events.swiper-vertical {
    touch-action: pan-x;
}

.swiper-slide {
    flex-shrink: 0;
    width: 100%;
    height: 100%;
    position: relative;
    transition-property: transform;
}

.swiper-slide-invisible-blank {
    visibility: hidden;
}

/* Auto Height */
.swiper-autoheight,
.swiper-autoheight .swiper-slide {
    height: auto;
}

.swiper-autoheight .swiper-wrapper {
    align-items: flex-start;
    transition-property: transform, height;
}

/* 3D Effects */
.swiper-3d,
.swiper-3d.swiper-css-mode .swiper-wrapper {
    perspective: 1200px;
}

.swiper-3d .swiper-wrapper,
.swiper-3d .swiper-slide,
.swiper-3d .swiper-slide-shadow,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top,
.swiper-3d .swiper-slide-shadow-bottom,
.swiper-3d .swiper-cube-shadow {
    transform-style: preserve-3d;
}

.swiper-3d .swiper-slide-shadow,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top,
.swiper-3d .swiper-slide-shadow-bottom {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 10;
}

.swiper-3d .swiper-slide-shadow {
    background: rgba(0, 0, 0, 0.15);
}

.swiper-3d .swiper-slide-shadow-left {
    background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}

.swiper-3d .swiper-slide-shadow-right {
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}

.swiper-3d .swiper-slide-shadow-top {
    background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}

.swiper-3d .swiper-slide-shadow-bottom {
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}

/* CSS Mode */
.swiper-css-mode > .swiper-wrapper {
    overflow: auto;
    scrollbar-width: none;
    /* For Firefox */
    -ms-overflow-style: none;
    /* For Internet Explorer and Edge */
}

.swiper-css-mode > .swiper-wrapper::-webkit-scrollbar {
    display: none;
}

.swiper-css-mode > .swiper-wrapper > .swiper-slide {
    scroll-snap-align: start start;
}

.swiper-horizontal.swiper-css-mode > .swiper-wrapper {
    scroll-snap-type: x mandatory;
}

.swiper-vertical.swiper-css-mode > .swiper-wrapper {
    scroll-snap-type: y mandatory;
}

.swiper-centered > .swiper-wrapper::before {
    content: '';
    flex-shrink: 0;
    order: 9999;
}

.swiper-centered.swiper-horizontal > .swiper-wrapper > .swiper-slide:first-child {
    margin-inline-start: var(--swiper-centered-offset-before);
}

.swiper-centered.swiper-horizontal > .swiper-wrapper::before {
    height: 100%;
    min-height: 1px;
    width: var(--swiper-centered-offset-after);
}

.swiper-centered.swiper-vertical > .swiper-wrapper > .swiper-slide:first-child {
    margin-block-start: var(--swiper-centered-offset-before);
}

.swiper-centered.swiper-vertical > .swiper-wrapper::before {
    width: 100%;
    min-width: 1px;
    height: var(--swiper-centered-offset-after);
}

.swiper-centered > .swiper-wrapper > .swiper-slide {
    scroll-snap-align: center center;
}

.swiper-virtual.swiper-css-mode .swiper-wrapper::after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    pointer-events: none;
}

.swiper-virtual.swiper-css-mode.swiper-horizontal .swiper-wrapper::after {
    height: 1px;
    width: var(--swiper-virtual-size);
}

.swiper-virtual.swiper-css-mode.swiper-vertical .swiper-wrapper::after {
    width: 1px;
    height: var(--swiper-virtual-size);
}

:root {
    --swiper-navigation-size: 44px;
    /*
  --swiper-navigation-color: var(--swiper-theme-color);
  */
}

.swiper-button-prev,
.swiper-button-next {
    position: absolute;
    top: 50%;
    width: calc(var(--swiper-navigation-size) / 44 * 27);
    height: var(--swiper-navigation-size);
    margin-top: calc(0px - (var(--swiper-navigation-size) / 2));
    z-index: 10;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--swiper-navigation-color, var(--swiper-theme-color));
}

.swiper-button-prev.swiper-button-disabled,
.swiper-button-next.swiper-button-disabled {
    opacity: 0.35;
    cursor: auto;
    pointer-events: none;
}

.swiper-button-prev:after,
.swiper-button-next:after {
    font-family: swiper-icons;
    font-size: var(--swiper-navigation-size);
    text-transform: none !important;
    letter-spacing: 0;
    text-transform: none;
    font-variant: initial;
    line-height: 1;
}

.swiper-button-prev,
.swiper-rtl .swiper-button-next {
    left: 10px;
    right: auto;
}

.swiper-button-prev:after,
.swiper-rtl .swiper-button-next:after {
    content: 'prev';
}

.swiper-button-next,
.swiper-rtl .swiper-button-prev {
    right: 10px;
    left: auto;
}

.swiper-button-next:after,
.swiper-rtl .swiper-button-prev:after {
    content: 'next';
}

.swiper-button-lock {
    display: none;
}

:root {
    /*
  --swiper-pagination-color: var(--swiper-theme-color);
  --swiper-pagination-bullet-size: 8px;
  --swiper-pagination-bullet-width: 8px;
  --swiper-pagination-bullet-height: 8px;
  --swiper-pagination-bullet-inactive-color: #000;
  --swiper-pagination-bullet-inactive-opacity: 0.2;
  --swiper-pagination-bullet-opacity: 1;
  --swiper-pagination-bullet-horizontal-gap: 4px;
  --swiper-pagination-bullet-vertical-gap: 6px;
  */
}

.swiper-pagination {
    position: absolute;
    text-align: center;
    transition: 300ms opacity;
    transform: translate3d(0, 0, 0);
    z-index: 10;
}

.swiper-pagination.swiper-pagination-hidden {
    opacity: 0;
}

/* Common Styles */
.swiper-pagination-fraction,
.swiper-pagination-custom,
.swiper-horizontal > .swiper-pagination-bullets,
.swiper-pagination-bullets.swiper-pagination-horizontal {
    bottom: 4px;
    left: 0;
    width: 100%;
}

/* Bullets */
.swiper-pagination-bullets-dynamic {
    overflow: hidden;
    font-size: 0;
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    transform: scale(0.33);
    position: relative;
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active {
    transform: scale(1);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main {
    transform: scale(1);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
    transform: scale(0.66);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
    transform: scale(0.33);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
    transform: scale(0.66);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
    transform: scale(0.33);
}

.swiper-pagination-bullet {
    width: var(--swiper-pagination-bullet-width, var(--swiper-pagination-bullet-size, 8px));
    height: var(--swiper-pagination-bullet-height, var(--swiper-pagination-bullet-size, 8px));
    display: inline-block;
    border-radius: 50%;
    background: var(--swiper-pagination-bullet-inactive-color, #000);
    opacity: var(--swiper-pagination-bullet-inactive-opacity, 0.2);
}

button.swiper-pagination-bullet {
    border: none;
    margin: 0;
    padding: 0;
    box-shadow: none;
    -webkit-appearance: none;
    appearance: none;
}

.swiper-pagination-clickable .swiper-pagination-bullet {
    cursor: pointer;
}

.swiper-pagination-bullet:only-child {
    display: none !important;
}

.swiper-pagination-bullet-active {
    opacity: var(--swiper-pagination-bullet-opacity, 1);
    background: var(--swiper-pagination-color, var(--swiper-theme-color));
}

.swiper-vertical > .swiper-pagination-bullets,
.swiper-pagination-vertical.swiper-pagination-bullets {
    right: 10px;
    top: 50%;
    transform: translate3d(0px, -50%, 0);
}

.swiper-vertical > .swiper-pagination-bullets .swiper-pagination-bullet,
.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: var(--swiper-pagination-bullet-vertical-gap, 6px) 0;
    display: block;
}

.swiper-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic,
.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
    top: 50%;
    transform: translateY(-50%);
    width: 8px;
}

.swiper-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,
.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    display: inline-block;
    transition: 200ms transform, 200ms top;
}

.swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet,
.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0 var(--swiper-pagination-bullet-horizontal-gap, 4px);
}

.swiper-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic,
.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap;
}

.swiper-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,
.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    transition: 200ms transform, 200ms left;
}

.swiper-horizontal.swiper-rtl > .swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    transition: 200ms transform, 200ms right;
}

/* Progress */
.swiper-pagination-progressbar {
    background: rgba(0, 0, 0, 0.25);
    position: absolute;
}

.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    background: var(--swiper-pagination-color, var(--swiper-theme-color));
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    transform: scale(0);
    transform-origin: left top;
}

.swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    transform-origin: right top;
}

.swiper-horizontal > .swiper-pagination-progressbar,
.swiper-pagination-progressbar.swiper-pagination-horizontal,
.swiper-vertical > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,
.swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite {
    width: 100%;
    height: 4px;
    left: 0;
    top: 0;
}

.swiper-vertical > .swiper-pagination-progressbar,
.swiper-pagination-progressbar.swiper-pagination-vertical,
.swiper-horizontal > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,
.swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite {
    width: 4px;
    height: 100%;
    left: 0;
    top: 0;
}

.swiper-pagination-lock {
    display: none;
}

/* Scrollbar */
.swiper-scrollbar {
    border-radius: 10px;
    position: relative;
    -ms-touch-action: none;
    background: rgba(0, 0, 0, 0.1);
}

.swiper-horizontal > .swiper-scrollbar {
    position: absolute;
    left: 1%;
    bottom: 3px;
    z-index: 50;
    height: 5px;
    width: 98%;
}

.swiper-vertical > .swiper-scrollbar {
    position: absolute;
    right: 3px;
    top: 1%;
    z-index: 50;
    width: 5px;
    height: 98%;
}

.swiper-scrollbar-drag {
    height: 100%;
    width: 100%;
    position: relative;
    background: rgba(0, 0, 0, 0.5);
    border-radius: 10px;
    left: 0;
    top: 0;
}

.swiper-scrollbar-cursor-drag {
    cursor: move;
}

.swiper-scrollbar-lock {
    display: none;
}

.swiper-zoom-container {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.swiper-zoom-container > img,
.swiper-zoom-container > svg,
.swiper-zoom-container > canvas {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.swiper-slide-zoomed {
    cursor: move;
}

/* Preloader */
:root {
    /*
  --swiper-preloader-color: var(--swiper-theme-color);
  */
}

.swiper-lazy-preloader {
    width: 42px;
    height: 42px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -21px;
    margin-top: -21px;
    z-index: 10;
    transform-origin: 50%;
    animation: swiper-preloader-spin 1s infinite linear;
    box-sizing: border-box;
    border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color));
    border-radius: 50%;
    border-top-color: transparent;
}

.swiper-lazy-preloader-white {
    --swiper-preloader-color: #fff;
}

.swiper-lazy-preloader-black {
    --swiper-preloader-color: #000;
}

@keyframes swiper-preloader-spin {
    100% {
        transform: rotate(360deg);
    }
}

/* a11y */
.swiper .swiper-notification {
    position: absolute;
    left: 0;
    top: 0;
    pointer-events: none;
    opacity: 0;
    z-index: -1000;
}

.swiper-free-mode > .swiper-wrapper {
    transition-timing-function: ease-out;
    margin: 0 auto;
}

.swiper-grid > .swiper-wrapper {
    flex-wrap: wrap;
}

.swiper-grid-column > .swiper-wrapper {
    flex-wrap: wrap;
    flex-direction: column;
}

.swiper-fade.swiper-free-mode .swiper-slide {
    transition-timing-function: ease-out;
}

.swiper-fade .swiper-slide {
    pointer-events: none;
    transition-property: opacity;
}

.swiper-fade .swiper-slide .swiper-slide {
    pointer-events: none;
}

.swiper-fade .swiper-slide-active,
.swiper-fade .swiper-slide-active .swiper-slide-active {
    pointer-events: auto;
}

.swiper-cube {
    overflow: visible;
}

.swiper-cube .swiper-slide {
    pointer-events: none;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    z-index: 1;
    visibility: hidden;
    transform-origin: 0 0;
    width: 100%;
    height: 100%;
}

.swiper-cube .swiper-slide .swiper-slide {
    pointer-events: none;
}

.swiper-cube.swiper-rtl .swiper-slide {
    transform-origin: 100% 0;
}

.swiper-cube .swiper-slide-active,
.swiper-cube .swiper-slide-active .swiper-slide-active {
    pointer-events: auto;
}

.swiper-cube .swiper-slide-active,
.swiper-cube .swiper-slide-next,
.swiper-cube .swiper-slide-prev,
.swiper-cube .swiper-slide-next + .swiper-slide {
    pointer-events: auto;
    visibility: visible;
}

.swiper-cube .swiper-slide-shadow-top,
.swiper-cube .swiper-slide-shadow-bottom,
.swiper-cube .swiper-slide-shadow-left,
.swiper-cube .swiper-slide-shadow-right {
    z-index: 0;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.swiper-cube .swiper-cube-shadow {
    position: absolute;
    left: 0;
    bottom: 0px;
    width: 100%;
    height: 100%;
    opacity: 0.6;
    z-index: 0;
}

.swiper-cube .swiper-cube-shadow:before {
    content: '';
    background: #000;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    filter: blur(50px);
}

.swiper-flip {
    overflow: visible;
}

.swiper-flip .swiper-slide {
    pointer-events: none;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    z-index: 1;
}

.swiper-flip .swiper-slide .swiper-slide {
    pointer-events: none;
}

.swiper-flip .swiper-slide-active,
.swiper-flip .swiper-slide-active .swiper-slide-active {
    pointer-events: auto;
}

.swiper-flip .swiper-slide-shadow-top,
.swiper-flip .swiper-slide-shadow-bottom,
.swiper-flip .swiper-slide-shadow-left,
.swiper-flip .swiper-slide-shadow-right {
    z-index: 0;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.swiper-creative .swiper-slide {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    overflow: hidden;
    transition-property: transform, opacity, height;
}

.swiper-cards {
    overflow: visible;
}

.swiper-cards .swiper-slide {
    transform-origin: center bottom;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    overflow: hidden;
}


/* ----- ../../Common/Resources/CSS/ChessNew.css ----- */
/*/////////////////////*/


/****************************************/

/*.clsNotation
{
   font-size: 13px;
   font-family: sans-serif;
}*/

.ChessBoard2D {
    cursor: pointer;
}

/************* database grid:*/

.dbPlayerCell {
}

.dbEventCell {
    font-style: italic !important;
}

.dbResultCell {
    font-weight: bold !important;
}

.video {
    background-color: #606060;
}

.plNameCell {
    font-weight: 500 !important;
    text-indent: 12px !important; /* make space for icon */
}

.plEloCell {
}

.plDefaultCell {
}

.plStatCell {
    /*	text-indent: 14px !important;
	color: #bbb;*/
    color: #444;
}

.plRankCell {
    color: #444;
}

.gmWhiteCell {
    font-weight: 400 !important;
    text-indent: 13px !important; /* make space for icon */
    font-size: larger;
}

.gmBlackCell {
    font-weight: 400 !important;
    font-size: larger;
}

.gmEloCell {
}

.gmLine {
}

.gmMoves {
    /*font-style: italic;*/
    font-size: 95%;
}

.gmPremiumOnly {
    font-size: 90%;
}

.gmPremiumOnly a {
    color: hsla(0, 50%, 40%, 0.7);
}

.gmPremiumOnly a:hover {
    color: hsla(0, 60%, 50%, 1.0);
}

.liveBookMove {
    font-size: 100%;
    font-weight: 600 !important;
}

.liveBookMoreMoves {
    font-size: 75%;
    font-weight: normal;
    /*   padding-left: 0.1em;*/
}

.liveBookMyLine {
    font-weight: 600 !important;
    font-size: 108%;
}

.liveBookMoveInRep {
    font-weight: 600 !important;
    font-size: 108%;
}

.liveBookMoveImportant {
    font-weight: 600 !important;
    font-size: 110%;
}

.liveBookBoth {
    color: darkcyan;
}

.liveBookWhite {
    color: blue;
}

.liveBookBlack {
    color: hsl(130, 85%, 25%);
}

.liveBookGames {
}

.liveBookResult {
}

.liveBookEval {
    /*color: hsla( 120, 50%, 20%, 1.0 );*/
    font-size: 115%;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.25);
}

.liveBookEloAvg {
}

.liveBookVisits {
    font-weight: 400 !important;
}

.liveBookPlayers {
    font-style: italic;
    font-size: 95%;
}


@media screen and (min-width: 800px) and (min-height: 600px) {
    .dbPlayerCell {
        font-weight: 700 !important;
    }
}

@media screen and (min-width: 1000px) and (min-height: 700px) {
    .dbPlayerCell {
        font-size: 110%;
    }

    .plNameCell {
        font-size: larger;
    }

    .liveBookMove {
        font-size: 115%;
        font-weight: 600 !important;
    }

    .liveBookMyLine {
        font-weight: 600 !important;
        font-size: 130%;
    }

    .liveBookMoveInRep {
        font-weight: 600 !important;
        font-size: 138%;
    }

    .liveBookMoveImportant {
        font-weight: 600 !important;
        font-size: 135%;
    }
}


/*HACK*/
#tbBookGrid .x-grid-cell-inner {
    direction: ltr;
}

/*HACK*/
#tbPanelGrid .x-grid-cell-inner {
    direction: ltr;
}

.gmMoveLen {
}

.gmKibitzers {
}

.gmTourn {
    font-style: italic;
}

.challName {
    font-weight: 400 !important;
    text-indent: 13px !important; /* make space for icon */
}


.clsPing {
    font-weight: bold;
    background-color: #DCF7CC;
    font-size: larger;
}

.clsWait {
    cursor: wait;
}

.clsPointer {
    cursor: crosshair;
}

.TournGroup-live {
    color: #108810;
}

.TournGroup-finished {
    color: #333333;
}


/*************************************/

.NonMobiH1 {
    font-size: 21px;
    text-align: center;
    font-family: sans-serif;
}

.NonMobiH3 {
    font-size: 17px;
    text-align: center;
    font-family: sans-serif;
}

.NonMobiBody {
    font-size: 17px;
    text-align: center;
    font-family: sans-serif;
}

.NonMobiLink {
    color: red !important;
    font-family: sans-serif;
    text-align: center;
    font-size: 20px;
}

.NonMobiLink:visited {
    color: black !important;
}


table.scroll {
    border-spacing: 0;
    border: 0px;
    padding: 1px;
}

table.notaTable {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
}

/***********************/

.PlaychessLogoInRibbon {
    background-image: url('media/playchess_48pix.png');
    background-repeat: no-repeat;
    background-position: center;
    vertical-align: middle;
}

.cb-button {
    border-radius: 1px;
    border: 1px solid gray;
    font-size: 12px;
    font-family: Roboto, sans-serif;
    font-weight: normal;
    color: white;
}

.cb-button:disabled {
    color: lightgrey;
    border-color: gray;
}

.cb-CloseButton {
    border-radius: 1px;
    border: 1px solid gray;
    /* background-color: rgb( 220, 50, 0 );*/
    background-image: linear-gradient(to bottom right, hsl(0, 95%, 65%), hsl(0, 78%, 30%));
    color: white;
    font-weight: bold;
    padding: 0px; /* essential for proper centering in small buttons*/
}

.cb-CloseButton:hover {
    /*background-color: rgb( 240, 100, 50 );*/
    background-image: linear-gradient(to bottom right, hsl(0, 95%, 30%), hsl(0, 78%, 20%));
}

.cb-CloseButton:active {
    /*background-color: rgb( 200, 100, 60 );*/
    background-image: linear-gradient(to bottom right, rgb(155, 155, 39), rgb(137, 114, 33));
}

@media screen and (min-height: 600px) {
    .cb-CloseButton {
        border-radius: 5px;
        border: 0; /*px solid #a00 */
    }
}


#posInputBtnsBG .cb-button {
    border-radius: 4px;
    background-color: hsla(35, 57%, 82%, 0.4); /* rgba(238, 213, 183, 0.4); */
    box-shadow: 2px 2px 4px 0px hsla(35, 57%, 10%, 0.2);
}

#posInputBtnsBG .cb-button:hover {
    background-color: hsla(35, 57%, 82%, 0.6); /* rgba(238, 213, 183, 0.4); */
}

#posInputBtnsBG .cb-button:active {
    background-color: hsla(35, 57%, 82%, 0.8); /* rgba(238, 213, 183, 0.4); */
}

#posInputBtnsBG * {
    z-index: 2000;
}

#content {
    position: absolute;
    top: 50px;
    left: 0;
    right: 0;
    bottom: 50px;
    overflow: scroll;
    -webkit-overflow-scrolling: touch;
}

/**************** Forms *****************/

.formSubTitle {
    font-weight: bold;
}

/*****************************************/
/**
    CRAZY SHIT for TPL
*/
tpl[if="0"],
tpl[if=""] {
    display: none;
}


div.board-toolbar div.brd-btn {
    display: inline-block;
    height: 100%;
    /*margin-right: 8px;*/
}

div.board-toolbar div.brd-btn div.icn {
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    margin: 10% auto;
    height: 80%;
}

div.board-toolbar div.brd-btn[data-enabled="false"] div.icn {
    opacity: 0.3;
}

div.board-toolbar div.brd-btn[data-on="true"] {
    background-color: rgba(255, 255, 255, 0.5);
}

div.board-toolbar div.brd-btn {
    background-color: rgba(255, 255, 255, 0.1);
}

div.board-toolbar div.brd-btn:hover {
    background-color: rgba(255, 255, 255, 0.3);
}

div.board-toolbar div.brd-btn:active {
    background-color: rgba(255, 255, 255, 0.5);
}

div.board-toolbar div.brd-btn div.txt {
    display: none;
}

div.board-toolbar[data-cnt="1"] div.brd-btn {
    width: 100%;
}

div.board-toolbar[data-cnt="2"] div.brd-btn {
    width: 50%;
}

div.board-toolbar[data-cnt="3"] div.brd-btn {
    width: 33%;
}

div.board-toolbar[data-cnt="4"] div.brd-btn {
    width: 25%;
}

div.board-toolbar[data-cnt="5"] div.brd-btn {
    width: 20%;
}

div.board-toolbar[data-cnt="6"] div.brd-btn {
    width: 16%;
}

div.board-toolbar[data-cnt="7"] div.brd-btn {
    width: 14.27%;
}

div.board-toolbar[data-cnt="8"] div.brd-btn {
    width: 12.5%;
}

/**************************************************************/
.board-msg {
    /*font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Roboto, Arial, Helvetica, sans-serif;*/
    font-family: Roboto, sans-serif;
}

.board-msg.modal {
    z-index: 20;
}

.board-msg.modal:after {
    content: "";
    position: absolute;
    left: -10000px;
    top: -10000px;
    right: -10004px;
    bottom: -10004px;
    border-color: rgba(0, 0, 0, 0.2);
    border-width: 10000px;
    border-style: solid;
}

.splitter {
    background-color: black;
    position: absolute;
}

.splitter.dir-v {
    height: 8px;
    width: 100%;
    cursor: row-resize;
}

.splitter.dir-h {
    width: 8px;
    height: 100%;
    cursor: col-resize;
}

.splitter:hover {
    background-color: rgb(140, 140, 140);
}

/**********************************************************/

.ExtToolTips {
    padding: 2px;
    background-color: rgb(247, 243, 243);
}

/**********************************************************/

.x-splitter-horizontal {
    /*background-image:linear-gradient( to bottom, rgb( 224, 224, 224 ), rgb( 232, 232, 232 ), rgb( 213, 213, 213 ) );*/
    background-image: linear-gradient(to bottom, rgb(246, 246, 246), rgb(235, 235, 235) 30%);
}

.x-splitter-vertical {
    /*background-image:linear-gradient( to right, rgb( 235, 235, 235), rgb( 246, 246, 246 ) 30% );*/
    background-image: linear-gradient(to right, rgb(246, 246, 246), rgb(235, 235, 235) 30%);
}

.CBRibbonBar_Disabled {
    /*background-image:linear-gradient( to right, rgb( 225, 225, 225 ) 30%, rgb( 249, 249, 249 ) );*/
    background-image: linear-gradient(to right, rgb(220, 216, 216), rgb(255, 252, 252) 35%, rgb(230, 230, 230));
}


/*@media screen and (min-width: 800px ) {
   .CBRibbonBarTraining {
      background-image: linear-gradient( to right, rgb( 216, 222, 216 ), rgb( 252, 255, 252 ) 280px, rgb( 230, 234, 230 ) );
   }


   .CBRibbonBarOnlineDB {
      background-image: linear-gradient( to right, rgb( 220, 215, 208 ), rgb( 255, 253, 252 ) 40%, rgb( 220, 210, 200 ) );
   }
}*/

.CBChatOut {
    border-radius: 1px; /* iOS 8 hack for box-shadow problem*/
    box-shadow: 0px 5px 9px -9px hsla(20, 30%, 0%, 0.98) inset;
    padding-left: 5px;
}

/*.CBInfoParentLoggedIn
{
   background-image: linear-gradient( to right, rgba(6, 216,19,1.0), rgba(24, 147,23,1.0) );
}

.CBInfoParentNotLoggedIn
{
   background-image: linear-gradient( to right, rgba(254, 254,252,1.0), rgba( 251, 251,247,1.9) );
}*/

.CBInfoNotLoggedIn {
    width: 100%;
    /*display: inline-block;*/
    font-family: Helvetica Neue, Roboto, sans-serif;
    box-shadow: 0px 5px 9px -9px hsla(20, 30%, 0%, 0.98) inset;
    padding: 2px;
    color: black;
    font-size: xx-small;
}

.CBInfoLoggedIn {
    margin: auto;
    font-family: Helvetica Neue, Roboto, Helvetica, sans-serif;
    font-size: 10px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    text-align: center;
    color: white;
    padding-top: 2px;
    width: 100%;
}

.CBInfoNotLoggedIn h3 {
    font-family: Helvetica Neue, Roboto, sans-serif;
    text-transform: uppercase;
    font-weight: lighter;
    margin-bottom: 3px;
}

.CBInfoNotLoggedIn a {
    font-family: Helvetica Neue, Roboto, sans-serif;
    text-transform: uppercase;
    font-weight: lighter;
}

.CBEngineOut {
    box-shadow: 0px 5px 9px -9px hsla(20, 30%, 0%, 0.98) inset;
}

@media screen and (min-height: 450px) {
    .CBInfoNotLoggedIn {
        font-size: x-small;
    }

    .CBInfoNotLoggedIn h3 {
        margin-bottom: 4px;
    }

    .CBInfoLoggedIn {
        font-size: 12px;
        letter-spacing: 0.08em;
        padding-top: 3px;
    }
}

@media screen and (min-height: 600px) {
    .CBChatOut {
        /*border-top: 1px solid rgba( 50, 50, 50, 0.15 );*/
        border-radius: 1px; /* iOS 8 hack for box-shadow problem*/
        box-shadow: 0px 11px 20px -20px hsla(20, 30%, 0%, 0.96) inset;
    }

    .CBEngineOut {
        /*border-top: 1px solid rgba( 50, 50, 50, 0.15 );*/
        border-radius: 1px; /* iOS 8 hack for box-shadow problem*/
        box-shadow: 0px 11px 20px -20px hsla(20, 30%, 0%, 0.96) inset;
    }

    .CBInfoNotLoggedIn {
        /*border-top: 1px solid rgba( 50, 50, 50, 0.15 );*/
        box-shadow: 0px 11px 20px -20px hsla(20, 30%, 0%, 0.96) inset;
        padding: 5px;
        font-size: small;
    }

    .CBInfoNotLoggedIn h3 {
        margin-bottom: 6px;
    }

    .CBInfoLoggedIn {
        padding-top: 4px;
        font-size: 14px;
        letter-spacing: 0.09em;
    }
}

@media screen and (min-height: 850px) {

    .CBChatOut {
        /*border-top: 1px solid rgba( 50, 50, 50, 0.15 );*/
        border-radius: 1px; /* iOS 8 hack for box-shadow problem*/
        box-shadow: 0px 15px 24px -24px hsla(20, 30%, 0%, 0.98) inset;
    }

    .CBEngineOut {
        border-radius: 1px;
        /*border-top: 1px solid rgba( 50, 50, 50, 0.15 );*/
        border-radius: 1px; /* iOS 8 hack for box-shadow problem*/
        box-shadow: 0px 15px 24px -24px hsla(20, 30%, 0%, 0.98) inset;
    }

    .CBInfoNotLoggedIn {
        font-size: small;
        box-shadow: 0px 15px 24px -24px hsla(20, 30%, 0%, 0.98) inset;
    }

    .CBInfoNotLoggedIn h3 {
        margin-bottom: 8px;
    }
}


.x-header, x-panel-header {
    background-image: linear-gradient(to right, rgb(235, 235, 235), rgb(249, 249, 249) 60%) !important;
}

/* another Ext JS hack*/
.x-grid-item, .x-btn-inner-default-toolbar-large, .x-btn-inner-default-toolbar-medium, .x-btn-inner-default-toolbar-small {
    font-family: Roboto, tahoma, arial, verdana, sans-serif;
}


.gridEmptyText {
    font-family: Roboto;
    margin-top: 20px;
    margin-left: 20px;
    /*padding-top: 40px;*/
    font-size: 120%;
}

.PgnButton {
    padding-left: 2px;
    padding-right: 2px;
}

.eloSmaller {
    font-size: 80%;
}


.diagarea {
    margin-left: auto;
    margin-right: auto;
}


.hoverBright {
    filter: brightness(108%);
}

/*
   Chat Styles:
*/

/*****************************************************************************
   Chat Window:
*/

.cbChatContainer {
}

.cbChatOut {
    overflow: auto;
    width: 100%;
}

.cbChatInp {
    width: calc(100% - 8px);
    font-family: Roboto, sans-serif;
    margin: 2px;
    border-radius: 3px;
    border: 1px solid hsla(120, 40%, 40%, 0.4);
    background-image: linear-gradient(to bottom, hsla(0, 0%, 70%, 0.2), hsla(0, 0%, 99, 0.2));
    max-width: 1000px;
}

/*****************************************************************************
   Chat Style
*/

.cbChatTitle {
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: white;
    background-image: linear-gradient(to bottom, hsl(31, 25%, 70%) 20%, hsl(31, 25%, 54%));
    padding: 6px 3px;
    font-family: Roboto;
    text-align: center;
}

.cbChatLine {
    padding: 1px 3px 2px 4px;
    font-size: 0.85em;
    color: black;
    font-family: Roboto;
    box-shadow: 0px 3px 7px -5px hsla(0, 0%, 0%, 0.3) inset;
}

.cbChatLine a {
    color: #a00;
    text-decoration: underline;
}

.cbChatOrigin {
    padding: 0px 3px 3px 4px;
    /*background-image: linear-gradient(to bottom, hsl( 0, 10%, 97% ) 20%, hsl( 0, 10%, 94% ));*/
    background-color: hsl(100, 30%, 90%);
    border-top: 1px solid hsla(0, 10%, 1%, 0.25);
    /*border-radius:5px;*/
    color: black;
}

.cbAutoChat {
    /*font-family:Roboto;*/
    background-color: hsl(200, 30%, 90%);
    font-weight: 400;
}

.cbSender {
    font-size: 0.85em;
    font-family: Roboto;
    margin-right: 6px;
}

.cbChatLoginOk {
    font-size: 1.0em;
    padding: 4px;
    margin-bottom: 10px;
}

.cbChatUserName {
    font-weight: 600;
    color: hsla(100, 50%, 20%, 0.9);
    text-transform: capitalize;
}

.cbBigUserName {
    font-size: 1.0em;
}

/*.cbSender::after
{
   content:":";
}*/

.cbSessionName {
    font-size: 0.8em;
    color: black;
    font-family: Roboto Condensed;
}

.cbChatGameLink {
    font-size: 0.8em;
    color: #900;
    text-decoration: underline;
    font-family: Roboto Condensed;
}

.cbChatGameLink:hover {
    cursor: pointer;
    color: #e00;
}

/*.cbSender::before
{
   content: "(";
}

.cbSender::after
{
   content: ")";
}*/

.cbChatSeparator {
    margin-bottom: 4px;
    /*border-bottom: 1px solid hsla( 0, 0%, 0%, 0.12 );*/
}

.cbChatBubble {
    width: 85%;
    max-width: 450px;
    background-color: antiquewhite;
    border: 1px solid hsla(0, 0%, 0%, 0.2);
    border-radius: 6px;
    margin-bottom: 3px;
    padding: 3px;
}


.cbChatRight {
    margin-right: 6px;
    margin-left: auto;
}

.cbChatLeft {
    margin-right: auto;
    margin-left: 5px;
    background-color: beige;
}

.cbChannelBubble {
    background-color: aliceblue;
}


.LogTrace .Trace {
    font-size: 10px;
    border-top: thin solid rgba(230, 230, 230, 0.4);
    padding-top: 2px;
    color: darkblue;
}

.LogBold {
    font-weight: bold;
    font-size: 0.8em;
}

.LogRed {
    color: red;
}

.LogGreen {
    color: darkgreen;
}

.LogBlue {
    color: darkslateblue;
}

.LogError {
    color: red;
    font-weight: bold;
    font-size: larger;
}

.LogException {
    color: red;
    font-weight: bold;
}

.LogBlue {
    color: blue;
}

.LogBlue {
    color: green;
}

.LogBoard {
    color: darkgreen;
    font-size: 0.9em;
}

.cbChannelSender, .cbGameChatSender {
    font-size: 0.9em;
    font-family: Roboto Condensed;
    color: darkblue;
    margin-right: 5px;
    margin-left: 2px;
}

.cbChannelChat, .cbGameChat {
    padding-top: 3px;
    font-family: Roboto;
}

.cbMyChat {
    color: hsla(100, 50%, 20%, 0.9);
    padding-left: 4px;
    font-size: 1.10em;
}

.cbPing {
    width: 20px;
    height: 10px;
    display: inline-block;
    border: 1px solid hsl(0, 0%, 55%);
    border-radius: 3px;
    margin-left: auto;
    margin-right: auto;
}


/*****************************************************/

.switchBar {
    width: 78px;
    height: 100%;
    background-color: hsla(30, 30%, 97%, 1.0);
    float: right;
    display: flex;
    flex-direction: column;
    padding-top: 12px;
    padding-left: 3px; /*compensate shadow*/
    box-shadow: inset 2px 0px 4px hsla(0, 0%, 20%, 0.3);
    /*border-left: 2px solid hsla(0, 0%, 20%, 0.8);*/
}

.switchAppBtn {
    border: 1px solid;
    border-color: #a4bed4;
    border-radius: 4px;
    text-align: center;
    background-position: center;
    background-repeat: no-repeat !important;
    background: none;
    width: 60px;
    height: 50px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 16px;

    /*see .jqx-fill-state-normal-chessbase*/
    background-color: hsla(30, 30%, 96%, 1.0);
    box-shadow: 0px 0px 15px hsla(30, 30%, 70%, 0.4) inset;
}

.switchAppBtn:hover {
    background-color: hsla(40, 40%, 99%, 1.0);
    box-shadow: 0px 0px 25px hsla(120, 10%, 30%, 0.6) inset;
}

.switchAppBtn:active {
    background-color: hsla(30, 50%, 99%, 1.0);
    box-shadow: 0px 0px 45px hsla(40, 30%, 50%, 0.6) inset;
}

.btnSubText {
    display: inline-block;
    font-size: 0.75em;
    margin-top: 74%;
    font-family: Roboto Condensed, Arial Narrow, sans-serif;
}

.cboldBrowserWarn {
    font-family: Roboto, sans-serif;
    padding: 10px;
    margin-left: auto;
    margin-right: auto;
    width: 80%;
    color: hsl(30, 20%, 50%);
}

.cboldBrowserWarn div {
    margin-top: 0.4em;
}

.repListCell {
    display: inline-block;
    padding-left: 5px;
    font-family: Roboto;
}

.repListParent {
    margin-top: 8px;
    font-weight: 600;
    font-family: Montserrat;
}

.repListName {
    font-weight: 500;
    font-size: 12px;
    font-family: Roboto;
    margin-top: 3px;
    margin-left: 6px;
}

.repListNota {
    padding-top: 1px;
    font-weight: normal;
    font-family: Roboto; /* Roboto Condensed;*/
    font-size: 10px;
    margin-left: 6px;
}

.repListSize {
    font-family: Roboto;
    text-align: center;
}


.repListECO {
    margin-top: 8px;
    font-weight: 500;
    text-align: center;
}

.repLevel {
    margin-top: 0px;
    margin-left: 2px;
    padding-top: 10px;
    padding-left: 32px;
    font-family: Roboto;
    font-size: 10px;
    height: 100%;
    width: 24px;
    background-repeat: no-repeat;
    background-position-y: 6px;
    background-position-x: 2px;
    background-size: 22px;
    vertical-align: middle;
}

.repLevelEasy {
    background-image: url(/common/media/Ribbons/Openings/Easy24.png);
}

.repLevelClub {
    background-image: url(/common/media/Ribbons/Openings/Club24.png);
}

.repLevelTournament {
    background-image: url(/common/media/Ribbons/Openings/Tournament24.png);
}

.repLevelProfessional {
    background-image: url(/common/media/Ribbons/Openings/Professional24.png);
}

.repLevelMyMoves {
    background-image: url(/common/media/Ribbons/MyMove24.png);
}

.repLevelFashion {
    background-image: url(/common/media/Ribbons/Fashion24.png);
}


.repListVolume {
    display: inline-block;
    padding-left: 5px;
    font-family: Montserrat;
    font-size: 14px;
    font-weight: 700;
    margin-top: 8px;
}

.repListOpening, .repListOpeningCount {
    display: inline-block;
    padding-left: 5px;
    font-family: Montserrat;
    font-size: 13px;
    font-weight: 600;
    margin-top: 8px;
}

.repListOpeningCount {
    font-family: Roboto;
    font-weight: 600;
}

.repListPremiumOnly a {
    color: hsla(0, 50%, 40%, 0.7);
}

.repListPremiumOnly a:hover {
    color: hsla(0, 60%, 50%, 1.0);
}


.cbBoardAreaInfo {
    background-image: linear-gradient(to bottom, hsla(0, 0%, 99%, 0.9), hsla(0, 0%, 92%, 0.9));
    box-shadow: 0px 0px 7px hsla(120, 10%, 30%, 0.3);
    box-sizing: border-box;
    border: 2px solid hsla(0, 20%, 50%, 0.3);
    padding: 20px;
    border-radius: 12px;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 10000;
}

#idBoardAreaInfo {
    display: inline-block;
}

/*************************/

.logDiv {
    padding: 5px;
    padding-bottom: 10px;
    width: 400px;
    height: 100%;
    border-left: 1px solid gray;
    background-color: white;
    color: black;
    font-size: 10px;
    font-family: Roboto;
    float: right;
    overflow-y: scroll;
}

.cbFriendImg {
    max-width: 64px;
}

.cbChoiceBtn {
    display: inline-block;
    line-height: 36px;
    font-size: 16px;
    font-weight: 500;
    vertical-align: middle;
    font-family: Roboto;
}


/* ----- ../../Common/Resources/CSS/Notation.css ----- */

/* Fonts e.g. for engine output */

@font-face {
    font-family: "CBArial";
    src: url("/Common/Media/Chess/Fonts/CBArialLink.ttf");
}


@font-face {
    font-family: "CBArial";
    src: url("/Common/Media/Chess/Fonts/CBArialLinkItalic.ttf");
    font-style: italic;
}

@font-face {
    font-family: "CBArial";
    src: url("/Common/Media/Chess/Fonts/CBArialLinkBold.ttf");
    font-weight: bold;
}

/* Latin Robotos: */

@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: local('Roboto'), local('Roboto-Regular'), url(https://fonts.gstatic.com/s/roboto/v15/CWB0XYA8bzo0kSThX0UTuA.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}

@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 500;
    src: local('Roboto Medium'), local('Roboto-Medium'), url(https://fonts.gstatic.com/s/roboto/v15/RxZJdnzeo3R5zSexge8UUVtXRa8TVwTICgirnJhmVJw.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}

@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 700;
    src: local('Roboto Bold'), local('Roboto-Bold'), url(https://fonts.gstatic.com/s/roboto/v15/d-6IYplOFocCacKzxwXSOFtXRa8TVwTICgirnJhmVJw.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}

@font-face {
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 300;
    src: local('Roboto Light Italic'), local('Roboto-LightItalic'), url(https://fonts.gstatic.com/s/roboto/v15/7m8l7TlFO-S3VkhHuR0at44P5ICox8Kq3LLUNMylGO4.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}

@font-face {
    font-family: 'Roboto Condensed';
    font-style: normal;
    font-weight: 300;
    src: local('Roboto Condensed Light'), local('RobotoCondensed-Light'), url(https://fonts.gstatic.com/s/robotocondensed/v13/b9QBgL0iMZfDSpmcXcE8nBBQ_Gf4FfI8J4SYljBAylk.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}

@font-face {
    font-family: 'Roboto Condensed';
    font-style: normal;
    font-weight: 400;
    src: local('Roboto Condensed'), local('RobotoCondensed-Regular'), url(https://fonts.gstatic.com/s/robotocondensed/v13/Zd2E9abXLFGSr9G3YK2MsDAdhzWOYhqHvOZMRGaEyPo.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}


/*********************************************************************************************
cbNotation plugin.
*********************************************************************************************/

span.cbmove {
    text-decoration: none;
    cursor: pointer;
    /*padding: 0em 0.1em 0em 0.1em;*/
    padding: 0;
    padding-left: 0.1em;
    padding-right: 0;
    margin: 0;
    /*white-space: nowrap;*/
}

span.cbmove.cbmove-success {
    background-color: green;
    color: white;
    border-radius: 0.2em;
    box-shadow: 1px 1px 5px hsla(0, 0%, 0%, 0.12);
}

span.cbmove.cbmove-stop {
    background-color: red;
    color: white;
    border-radius: 0.2em;
    box-shadow: 1px 1px 5px hsla(0, 0%, 0%, 0.12);
}

span.cbmove.cbmove-start {
    background-color: blue;
    color: white;
    border-radius: 0.2em;
    box-shadow: 1px 1px 5px hsla(0, 0%, 0%, 0.12);
}

span.cbmove.cbmove-start::after {
    content: "\1F6A6";
}

span.cbmove.cbmove-continue {
    background-color: black;
    color: white;
    border-radius: 0.2em;
    box-shadow: 1px 1px 5px hsla(0, 0%, 0%, 0.12);
}

span.cbmove.cbmove-goal::after {
    content: "\1F3AF";
}

span.cbline {
}

.nota-container {
    font-family: Helvetica Neue, Roboto, sans-serif;
    font-size: 14px;
    color: black;
    display: table;
    height: 100%;
    width: 100%;
    padding: 0;
    margin: 0;
    border: 0;
    table-layout: fixed;
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Chrome/Safari/Opera */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
}

@media ( pointer: coarse) {
    .nota-container {
        font-size: 14px;
    }
}

.nota-container td {
    /*padding: 0;*/
}

.nota-head-container,
.nota-game-container,
.nota-foot-container {
    display: table-row;
    height: auto;
    background-color: none !important;
}

.notafooter-container {
    display: flex !important;
    flex-direction: row;
    background: white;
    color: black;
    height: 20px;
    min-height: 20px;
    line-height: 20px;
    font-size: 12px;
    margin: 0;
    padding-left: 4px;
    padding-bottom: 2px;
    padding-top: 2px;
    min-width: 1px;
    border-top: thin solid hsla(0, 0%, 0%, 0.25);
    box-shadow: 1px 2px 4px -2px hsla(20, 30%, 0%, 0.28) inset;
    vertical-align: middle;
}

.nota-ogame,
.nota-foot {
    display: table-cell;
}

.nota-head {
    display: block;
    background-color: whitesmoke;
}

/*
   reset global declarations:
*/
.nota-head td {
    border: none;
    padding: 0 !important;
}

.nota-ogame {
    /* only for safari with padding-right fix -> see NotationElement.js*/
    background-image: linear-gradient(to right, hsla(40, 15%, 97.5%, 1.0), hsla(40, 10%, 99%, 1.0) 30%) !important;
}

.nota-game {
    overflow-y: auto;
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    box-shadow: 2px 4px 6px -6px hsla(20, 30%, 0%, 0.98) inset;
    padding: 8px;
    line-height: 1.25em;
    background-image: url('https://pgn.chessbase.com//common/Media/Chess/notapaper.jpg') !important;
}

@media screen and (min-width: 700px ) {
    .nota-container {
        font-size: 15px;
    }

    .nota-game {
        /*box-shadow: 4px 8px 12px -12px hsla( 20, 30%, 0%, 0.8 ) inset;*/
        /*background-image: linear-gradient( to right, hsla( 40, 15%, 97.5%, 1.0 ), hsla( 40, 10%, 99%, 1.0 ) 30% ) !important;*/
        background-image: url('https://pgn.chessbase.com//common/Media/Chess/notapaper.jpg') !important;
        line-height: 1.55em;
    }

    .nota-head td {
        border: none;
        padding: 1px;
    }
}

@media screen and (min-width: 700px ) and (pointer: coarse) {
    .nota-container {
        font-size: 16px;
    }
}

.nota-igame {
    position: relative;
    height: 100%;
    width: 100%;
}

.nota-ogame {
    height: 100%;
}

table.position {
    border: 0px;
    padding: 1px;
}

.cbnota-container {
    margin-bottom: 0px;
    display: block;
    width: 100%;
    height: 100%;
    -webkit-overflow-scrolling: touch;
    user-select: none;
}

.nomat {
    bottom: 0px;
}


span.cbline[data-level="0"] {
    display: block;
    margin-top: 2px;
    /*letter-spacing:0.04em;*/
}

span.cbline[data-level="0"][data-commented="1"] {
    /*font-size: 2em;*/
    font-weight: 500;
    text-shadow: 1px 1px 1px hsla(0, 30%, 20%, 0.12);
}

/*TOP LEVEL VARIANTE*/
span.cbline[data-level="0"] {
}

span.cbline[data-level="1"]:before {
    content: "[ ";
    padding: 0;
}

span.cbline[data-level="1"]:after {
    content: "]";
    padding: 0;
}

span.cbline[data-level="2"]:before,
span.cbline[data-level="3"]:before,
span.cbline[data-level="4"]:before,
span.cbline[data-level="5"]:before,
span.cbline[data-level="6"]:before,
span.cbline[data-level="7"]:before,
span.cbline[data-level="8"]:before {
    content: "(";
}

span.cbline[data-level="2"]:after,
span.cbline[data-level="3"]:after,
span.cbline[data-level="4"]:after,
span.cbline[data-level="5"]:after,
span.cbline[data-level="6"]:after,
span.cbline[data-level="7"]:after,
span.cbline[data-level="8"]:after {
    content: ")";
    padding: 0;
    display: inline;
    white-space: nowrap;
}


span.cbline[data-level="9"][data-inx-line="0"]:before,
span.cbline[data-level="10"][data-inx-line="0"]:before,
span.cbline[data-level="11"][data-inx-line="0"]:before,
span.cbline[data-level="12"][data-inx-line="0"]:before,
span.cbline[data-level="13"][data-inx-line="0"]:before,
span.cbline[data-level="14"][data-inx-line="0"]:before {
    content: "(";
}

span.cbline[data-level="9"][data-inx-line="0"]:before {
    padding-left: 0.5em;
}

span.cbline[data-level="9"]:after,
span.cbline[data-level="10"]:after,
span.cbline[data-level="11"]:after,
span.cbline[data-level="12"]:after,
span.cbline[data-level="13"]:after,
span.cbline[data-level="14"]:after {
    content: ";";
    white-space: pre;
    margin-right: 0.5em;
}

span.cbline[data-level="9"][lastLine="1"]:after,
span.cbline[data-level="10"][lastLine="1"]:after,
span.cbline[data-level="11"][lastLine="1"]:after,
span.cbline[data-level="12"][lastLine="1"]:after,
span.cbline[data-level="13"][lastLine="1"]:after,
span.cbline[data-level="14"][lastLine="1"]:after {
    content: ")";
    display: inline;
    white-space: nowrap;
    padding-right: 0;
}

span.cbline[data-level="1"] {
    font-size: 1em;
    display: block;
    font-weight: normal;
    margin-left: 2ex;
    text-shadow: none;
}

span.cbline[data-level="2"] {
    font-size: 97%;
    display: block;
    margin-left: 2ex;
}

span.cbline[data-level="1"] span.cbmove[data-inx-mv="0"] {
    font-weight: 500;
    text-decoration: underline;
}

span.cbline[data-level="2"] span.cbmove[data-inx-mv="0"] {
    text-decoration: none;
    text-shadow: none;
}

span.cbline[data-level="2"] span.cbmove[data-inx-mv="0"] {
    text-decoration: none;
    /*text-shadow:1px 1px 1px rgba(0, 0, 0, 0.2);*/
}

span.cbline[data-level="6"] span.cbmove[data-inx-mv="0"] {
    text-shadow: none;
    font-weight: normal;
}

span.cbline[data-level="9"] span.cbmove[data-inx-mv="0"] {
    text-decoration: underline;
}

span.cbline[data-level="10"] span.cbmove[data-inx-mv="0"] {
    text-decoration: none;
}

span.cbline[data-level="3"] {
    font-size: 96%;
}

span.cbline[data-level="3"] {
    display: block;
    margin-left: 1.8ex;
}

span.cbline[data-level="4"] {
    font-size: 96%;
    display: block;
    margin-left: 1.9ex;
}

span.cbline[data-level="5"] {
    font-size: 96%;
    font-weight: normal;
    display: block;
    margin-left: 2.0ex;
}

span.cbline[data-level="6"],
span.cbline[data-level="7"],
span.cbline[data-level="8"] {
    font-weight: normal;
    font-style: normal;
    display: block;
}

span.cbline[data-level="6"] {
    margin-left: 2.1ex;
}

span.cbline[data-level="7"] {
    margin-left: 2.5ex;
}

span.cbline[data-level="8"] {
    margin-left: 2.8ex;
}

span.cbline[data-level="9"],
span.cbline[data-level="10"],
span.cbline[data-level="11"],
span.cbline[data-level="12"],
span.cbline[data-level="13"],
span.cbline[data-level="14"],
span.cbline[data-level="15"] {
    display: inline;
}

span.cbline[data-level="10"] {
}

span.cbline[data-level="11"] {
    font-style: italic;
    font-family: 'Roboto Condensed';
    font-size: 92%;
}

span.cbline[data-level="11"] {
    font-weight: 300;
}

span.cbcomment {
    font-weight: normal;
    font-style: normal;
    color: brown; /*hsl( 0, 40%, 50%); */ /*was brown*/
    font-family: 'Roboto Condensed', 'Arial Narrow';
    font-weight: 400;
    text-shadow: none;
}

span.cbspec-glyph {
    font-family: "CBArial";
}

span.cbcol-marker {
    background-image: url(/Common/Media/buttons/NotaArrow16.png);
    background-repeat: no-repeat;
    vertical-align: middle;
    width: 16px;
    height: 16px;
    display: inline-block;
}

span.cbcurline {
    /*color: hsla( 120, 60%, 40%, 1.0 );*/
    background-color: hsla(60, 90%, 85%, 0.45); /*text marker*/
    /*background-image: linear-gradient( to bottom, hsla( 60, 90%, 80%, 0.7 ), hsla( 60, 90%, 90%, 0.3 ) );*/ /* overwrites node colors */
    transition: background-color 0.4s;
}

span.cbcurlineparent {
    /*background-color: hsla( 120, 80%, 88%, 0.25 );*/ /* text marker*/
    background-color: hsla(60, 90%, 85%, 0.45); /*text marker*/
    transition: background-color 0.3s;
}

span.cbcurnode6 {
    /*background-color: hsla( 270, 60%, 80%, 0.35);*/
}

span.cbcurnode5 {
    /*background-color: hsla( 185, 70%, 65%, 0.4 );*/
}

span.cbcurnode4 {
    /*background-color: hsla( 55, 70%, 80%, 0.4 );*/
}

span.cbcurnode3 {
    /*background-color: hsla( 90, 70%, 60%, 0.4 );*/
}

span.cbcurnode2 {
    /*background-color: hsla( 10, 80%, 85%, 0.4 );*/
}

span.cbcurnode1 {
    /*background-color: hsla( 220, 90%, 85%, 0.4 );*/
    background-color: hsla(90, 70%, 60%, 0.4);
}

span.cbcurAlternative {
    background-color: hsla(120, 60%, 88%, 0.34);
    box-shadow: 1px 2px 5px hsla(0, 0%, 0%, 0.12);
    text-decoration: none;
    transition: background-color 0.3s
}

span.cbgame-result {
    display: block;
    font-weight: bold;
    font-size: 115%;
    padding: 0.3em 2px 0px 2px;
}


span.cbmedal {
    display: inline-block;
    background-color: red;
    /*width:20px;
   height:16px;*/
    margin: 0;
    padding: 0;
    max-height: 16px;
    vertical-align: middle;
    border-radius: 2px;
    border: 1px solid hsla(0, 0%, 0%, 0.3);
    box-shadow: 1px 1px 4px hsla(30, 40%, 50%, 0.3);
}

span.medal-1 {
    background-color: rgb(255, 192, 0);
}

span.medal-2 {
    background-color: magenta;
}

span.medal-4 {
    background-color: blue;
}

span.medal-8 {
    background-color: Highlight;
}

span.medal-16 {
    background-color: darkcyan;
}

span.medal-32 {
    background-color: saddlebrown;
}

span.medal-64 {
    background-color: indianred;
}

span.medal-128 {
    background-color: yellow;
}

span.medal-256 {
    background-color: white;
}

span.medal-512 {
    background-color: red;
}

span.medal-1024 {
    background-color: darkmagenta;
}

span.medal-2048 {
    background-color: green;
}

span.medal-4096 {
    background-color: darkgreen;
}

span.medal-8192 {
    background-color: black;
}

span.medal-16384 {
    background-color: gray;
}

span.medal-32768 {
    background-color: cyan;
}

.cbevprofile {
    width: 100%;
    border: 1px solid hsla(0, 0%, 0%, 0.3);
    margin-left: auto;
    margin-right: auto;
    margin-top: 10px;
    margin-bottom: 10px;
    box-shadow: 1px 1px 5px hsla(0, 0%, 0%, 0.1);
}

.bookparent {
    height: 100%;
}

.footer-eval, .footer-book {
    height: 16px;
    font-size: 11px;
    margin-left: 3px;
    vertical-align: middle;
    overflow: hidden;
    text-align: left;
    margin-top: 3px;
    font-family: 'Roboto', Arial Narrow, sans-serif;
}

.footer-book {
    order: 2;
    /*height:16px;*/
    padding-top: 1px;
    padding-left: 3px;
    margin-right: 3px;
    margin-top: 0px;
    color: hsla(1, 70%, 30%, 1.0);
}

.footer-book:hover {
    color: hsla(1, 75%, 55%, 1.0);
}

.footer-eval {
    order: 1;
    /*width:40%;*/
    /*border:1px solid red;*/
    padding-right: 3px;
}

.mat-balance {
    order: 3;
    height: 16px;
    margin-top: 2px;
}

.mat-balance span {
    box-sizing: border-box; /*background image distortion*/
    display: inline-block;
    width: 16px;
    height: 16px;
    background-size: cover;
    padding: 1px;
    /*margin-top:2px;*/
}

.mat-balance span.piece-wp {
    background-image: url(/Common/Media/Buttons/wP-16px.png);
}

.mat-balance span.piece-wn {
    background-image: url(/Common/Media/Buttons/wN-16px.png);
}

.mat-balance span.piece-wb {
    background-image: url(/Common/Media/Buttons/wB-16px.png);
}

.mat-balance span.piece-wr {
    background-image: url(/Common/Media/Buttons/wR-16px.png);
}

.mat-balance span.piece-wq {
    background-image: url(/Common/Media/Buttons/wQ-16px.png);
}

.mat-balance span.piece-wk {
    background-image: url(/Common/Media/Buttons/wK-16px.png);
}

.mat-balance span.piece-bp {
    background-image: url(/Common/Media/Buttons/bP-16px.png);
}

.mat-balance span.piece-bn {
    background-image: url(/Common/Media/Buttons/bN-16px.png);
}

.mat-balance span.piece-bb {
    background-image: url(/Common/Media/Buttons/bB-16px.png);
}

.mat-balance span.piece-br {
    background-image: url(/Common/Media/Buttons/bR-16px.png);
}

.mat-balance span.piece-bq {
    background-image: url(/Common/Media/Buttons/bQ-16px.png);
}

.mat-balance span.piece-bk {
    background-image: url(/Common/Media/Buttons/bK-16px.png);
}


.div.cbgame-header-compact {
    padding-bottom: 2px;
}

div.cbgame-header {
    text-align: center;
    width: 100%;
    height: auto;
    padding-top: 1px;
    padding-bottom: 3px;
    border-bottom: 1px solid rgba(50, 50, 50, 0.4);
    box-shadow: 0px 4px 8px -8px hsla(20, 30%, 0%, 0.98) inset;
    /*background-image: linear-gradient( to bottom, hsla( 30, 10%, 98%, 0.6), hsla( 30, 10%, 95%, 0.6) ) !important;*/
    background-image: linear-gradient(to bottom, hsla(30, 10%, 98%, 1.0), hsla(40, 10%, 95%, 1.0)) !important;
    overflow: hidden;
}

@media screen and (min-width: 700px) {
    div.cbgame-header {
        /*background-image: linear-gradient( to bottom, hsla( 30, 10%, 98%, 1.0), hsla( 40, 10%, 95%, 1.0) ) !important;*/
        box-shadow: 0px 7px 10px -10px hsla(20, 30%, 0%, 0.68) inset;
    }

    div.cbgame-header-compact {
        box-shadow: 0px 7px 10px -10px hsla(20, 30%, 0%, 0.68) inset;
    }
}

@media screen and (min-width: 1200px) {
    div.cbgame-header {
        font-size: 105%;
        padding-top: 3px;
        padding-bottom: 4px;
    }

    div.cbgame-header-compact {
        box-shadow: 0px 7px 10px -10px hsla(20, 30%, 0%, 0.68) inset;
    }
}

/*box-shadow: 0px -40px 50px -50px hsla( 20, 30%, 40%, 0.10 ) inset, 0px 180px 7px -180px hsla( 20, 20%, 20%, 0.80 ) inset;*/

div.cbgame-headerinside {
    text-align: center !important;
    width: 100%;
    padding-bottom: 0.2em !important;
}

.cbresult {
    font-size: 100%;
    font-weight: bold;
    white-space: nowrap;
    text-align: center;
}

.cbplayerwhite {
    font-weight: 700;
    text-align: left;
    vertical-align: top;
    padding-left: 1px;
    margin: 0;
}

.cbplayerblack {
    font-weight: 700;
    text-align: right;
    vertical-align: top;
    padding-right: 1px;
    margin: 0;
}

.cbplayerwhite a, .cbplayerblack a {
    color: #720;
    text-decoration: underline;
}

.cbplayerwhite a:hover, .cbplayerblack a:hover {
    color: #c50;
    text-decoration: underline;
}

.cbflagwhite-morecompact {
    text-align: left;
    vertical-align: top;
    padding-left: 1px;
}

.cbflagblack-morecompact {
    text-align: right;
    vertical-align: top;
    padding-right: 1px;
}

.cbflagwhite {
    text-align: left;
    vertical-align: top;
    padding-left: 3px;
}

.cbflagblack {
    text-align: right;
    vertical-align: top;
    padding-right: 3px;
}

.cbplayernation img, .cbflagwhite img, .cbflagblack img, .cbflagblack-morecompact img, .cbflagwhite-morecompact img {
    border: none !important;
    padding: 0 !important;
    display: inline;
}

@media screen and (min-width: 800px) and (min-height: 400px) {
    .cbplayerwhite {
        padding-left: 2px;
    }

    .cbplayerblack {
        padding-right: 2px;
    }
}

@media screen and (min-width: 1200px) and (min-height: 700px) {
    .cbplayerwhite {
        padding-left: 3px;
    }

    .cbplayerblack {
        padding-right: 4px;
    }
}


.cbplayerimage {
    vertical-align: top;
    border: 1px solid lightgray;
}

.cbplayerportrait {
    vertical-align: top;
    padding: 0px 2px 0px 2px;
}

.cbplayerportrait img {
    border: thin silver solid;
    border-radius: 4px;
    padding: 0;
    display: inline;
    box-shadow: 1px 1px 4px hsla(0, 0%, 0%, 0.2);
}

@media screen and (min-width: 800px) {
    .cbplayerportrait img {
        border-radius: 8px;
    }
}

span.cbplayer {
    vertical-align: top;
    font-weight: 700;
}

span.cbplayertiny {
    font-weight: 500;
}

span.cbevent {
    font-size: 90%;
    text-align: center;
}

span.cbeventdate {
    font-size: 85%;
    padding-left: 0.35em !important;
}

span.cbsite {
    font-size: 80%;
    font-style: italic;
    font-family: Roboto Condensed;
    margin-left: 4px;
    margin-right: 5px;
    padding: 0px !important;
}

span.cbmain-header {
    display: block;
    font-size: larger;
    padding: 3px;
}

span.cbmain-header-tiny {
    font-size: 90%;
    display: block;
    overflow: hidden;
    box-shadow: 0px 6px 8px -8px hsla(20, 30%, 0%, 0.98) inset;
    padding: 2px;
}

span.cbmain-header-verycompact {
    font-size: 92%;
    display: block;
    overflow: hidden;
    box-shadow: 0px 6px 8px -8px hsla(20, 30%, 0%, 0.98) inset;
    padding: 3px;
}

span.cbmain-header-morecompact {
    font-size: 94%;
    display: block;
    overflow: hidden;
    box-shadow: 0px 10px 14px -14px hsla(20, 30%, 0%, 0.98) inset;
    background-image: linear-gradient(to bottom, hsla(30, 10%, 98%, 1.0), hsla(40, 10%, 95%, 1.0)) !important;
    padding: 3px;
}

span.cbmain-header-compact {
    padding: 3px;
    font-size: 95%;
    display: block;
    overflow: hidden;
    background-image: linear-gradient(to bottom, hsla(30, 10%, 98%, 1.0), hsla(40, 10%, 95%, 1.0)) !important;
    box-shadow: 0px 10px 14px -14px hsla(20, 30%, 0%, 0.98) inset;
}

span.cbeco {
    font-size: xx-small;
    font-weight: 700;
    margin: 0px;
    padding: 0px;
}

span.cbround:before {
    content: "(";
}

span.cbround:after {
    content: ")";
}

span.cbannotator {
    /*font-style: italic;*/
    display: block;
    font-weight: 500;
    font-size: 88%;
    font-family: Roboto Condensed;
}

span.cbelo {
    font-size: 80%;
    padding-left: 0.25em !important;
    font-weight: 300;
}

span.cbelocompact {
    font-size: 80%;
    padding-left: 0.20em !important;
    font-weight: 300;
}

.cbfide {
    font-size: 70%;
    font-weight: 500;
    padding-left: 0.20em !important;
    color: hsl(0, 40%, 40%);
    padding: 1px;
    border: 1px solid lightgray;
    vertical-align: top;
    padding-top: 6px !important;
}

.cbtourndata {
    padding-top: 3px !important;
    vertical-align: top;
}

.cbfidecompact {
    font-size: 65%;
    padding-top: 4px !important;
}

div.cbgame-header span {
    padding: 0 0.2ex 0 0.2ex;
}

span.cbnota-title {
    font-family: Helvetica Neue, Roboto, sans-serif;
    text-transform: uppercase;
    /*font-weight: bold;*/
    font-size: 75%;
}

span.cbnota-subtitle {
    font-family: Helvetica Neue, Roboto, sans-serif;
    font-size: 72%;
}

/*@media screen and (min-width: 1000px) and (min-height: 700px) {
   span.cbnota-title {
      font-size: 90%;
   }
}*/

span.cbmove:hover {
    /*background-color: #F5F1D3;*/
    background-color: hsla(50, 80%, 70%, 0.8);
    -moz-border-radius: 0.2em;
    border-radius: 0.2em;
}

span.cbmove:active,
span.cbmove.cbcur-move,
span.cbmove.cbcur-move:hover {
    background-color: brown;
    color: white;
    -moz-border-radius: 0.2em;
    border-radius: 0.2em;
    box-shadow: 1px 1px 5px hsla(0, 0%, 0%, 0.12);
    /*transition: box-shadow 1s;*/
}

/*.cbrepl-download
{
   text-align: center;
   left: 0px;
   right: 0px;
   text-align: center;
   bottom: 8px;
   margin-top: 16px;
}

   .cbrepl-download a
   {
      color: brown;
      font-family: Arial;
   }

.cbrepl-gameselect
{
   padding-bottom: 8px;
}

   .cbrepl-gameselect button
   {
      width: 20px;
      height: 20px;
      border-style: none;
      background-color: transparent;
      background-image: url(select.png);
   }*/

table.scroll {
    border-spacing: 0;
    border: 0px;
    padding: 1px;
}

table.notaTable {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 1px;
}

/**************************************************************/
.board-msg {
    font-family: Helvetica Neue, Roboto, sans-serif;
}

.board-msg.modal {
    z-index: 20;
}

.board-msg.modal:after {
    content: "";
    position: absolute;
    left: -10000px;
    top: -10000px;
    right: -10004px;
    bottom: -10004px;
    border-color: rgba(0, 0, 0, 0.2);
    border-width: 10000px;
    border-style: solid;
}

/*.splitter
{
   background-color: black;
   position: absolute;
}

   .splitter.dir-v
   {
      height: 8px;
      width: 100%;
      cursor: row-resize;
   }

   .splitter.dir-h
   {
      width: 8px;
      height: 100%;
      cursor: col-resize;
   }

   .splitter:hover
   {
      background-color: rgb( 140, 140, 140);
   }*/

/**********************************************************/

.ExtToolTips {
    padding: 2px;
    background-color: rgb(247, 243, 243);
}

/**********************************************************/

/*.x-splitter-horizontal
{
   background-image: linear-gradient( to bottom, rgb( 246, 246, 246), rgb( 235, 235, 235 ) 30% );
}

.x-splitter-vertical
{
   background-image: linear-gradient( to right, rgb( 246, 246, 246), rgb( 235, 235, 235 ) 30% );
}

*/


.BoardAreaShadowT {
    border-radius: 1px; /* iOS 8 hack for box-shadow problem*/
    box-shadow: 0px 16px 23px -23px hsla(20, 30%, 0%, 0.38) inset;
    /*-12px 0px 19px -19px hsla( 20, 30%, 0%, 0.98 ) inset,
      12px 0px 19px -19px hsla( 20, 30%, 0%, 0.98 ) inset;*/
}

.BoardAreaShadowR {
    /*border: 1px solid red;*/
    border-radius: 1px; /* iOS 8 hack for box-shadow problem*/
    box-shadow: -12px 0px 25px -25px hsla(20, 30%, 0%, 0.98) inset;
}

.BoardAreaShadowB {
    /*border: 1px solid red;*/
    border-radius: 1px; /* iOS 8 hack for box-shadow problem*/
    box-shadow: 0px -12px 19px -19px hsla(20, 30%, 0%, 0.98) inset, -12px 0px 19px -19px hsla(20, 30%, 0%, 0.98) inset, 12px 0px 19px -19px hsla(20, 30%, 0%, 0.98) inset;
}

.BoardAreaShadowL {
    /*border: 1px solid red;*/
    border-radius: 1px; /* iOS 8 hack for box-shadow problem*/
    box-shadow: 12px 0px 19px -19px hsla(20, 30%, 0%, 0.98) inset;
}

.BoardBottomURL {
    text-align: center;
    font-family: Helvetica Neue, Roboto, sans-serif;
    font-size: 21px;
    font-weight: normal;
    /*color: #f6f5aa;*/
    color: #fff190;
}

.CBSymbol {
    font-family: "CBArial";
}

.shakeAnimation {
    animation: animShake 2.0s ease;
    animation-delay: 2s;
    animation-iteration-count: 5;
    animation-duration: 5s;
}

.shakeShort {
    animation: animShakeBig ease;
    animation-delay: 0.5s;
    animation-iteration-count: 1;
    animation-duration: 1.2s;
}


@keyframes animShake {
    0%, 100% {
        transform: translateX(0);
    }

    10%, 30%, 50%, 70%, 90% {
        transform: translateX(-3px);
    }

    20%, 40%, 60%, 80% {
        transform: translateX(3px);
    }
}

@keyframes animShakeBig {
    0%, 100% {
        transform: translateX(0);
    }

    10%, 30%, 50%, 70%, 90% {
        transform: translateX(-5px);
    }

    20%, 40%, 60%, 80% {
        transform: translateX(5px);
    }
}

.rotateShort {
    animation: animRotate ease;
    animation-iteration-count: 1;
    animation-duration: 0.3s;
    transform-origin: 50% 50%;
}

@keyframes animRotate {

    0% {
        transform: rotate(60deg);
        transform-origin: 50% 50%;
    }

    100% {
        transform: rotate(0deg);
        transform-origin: 50% 50%;
    }
    /*0%, 100%
	{
		transform: rotate(0deg);
	}

	25%
	{
		transform: rotate(90deg);
	}
	50%
	{
		transform: rotate(180deg);
	}
	75%
	{
		transform: rotate(270deg);
	}*/
}

.blinkAnimation {
    animation: blinkFrames 0.5s linear 6;
}

.blinkShort {
    animation: blinkFrames 0.3s linear 1;
}

.blinkMedium {
    animation: blinkFrames 0.4s linear 3;
}

@keyframes blinkFrames {
    0% {
        opacity: 1.0;
    }

    25% {
        opacity: 0.8;
    }

    50% {
        opacity: 0.1;
    }

    70% {
        opacity: 0.8;
    }

    100% {
        opacity: 1.0;
    }
}

@keyframes textColorFrames {
    0% {
        color: hsla(0, 0%, 0%, 1.0);
        font-weight: bold;
    }

    50% {
        color: hsla(270, 30%, 50%, 1.0);
        font-weight: bold;
    }

    100% {
        color: hsla(120, 30%, 50%, 1.0);
        font-weight: bold;
    }
}

.blinkText {
    animation: textColorFrames 0.8s linear 10;
}

.blinkTextFast {
    animation: textColorFrames 0.5s linear 3;
}

.gridEmptyText {
    font-family: Helvetica Neue, Roboto;
    margin-top: 20px;
    margin-left: 20px;
    /*padding-top: 40px;*/
    font-size: 120%;
}

.PgnButton {
    padding-left: 2px;
    padding-right: 2px;
}

.cbtraining {
    display: block;
    margin-top: 0;
    text-align: center;
}

.cbTrainingLinks {
    margin-top: 0.1em;
    margin-bottom: 1.0em;
    text-align: center;
}

.cbTrainingLink {
    text-decoration: underline;
}

.cbTrainingSolution {
    color: darkgreen;
    margin-right: 0.8em;
}

.cbTrainingHelp {
    color: darkGreen;
    margin-left: 0.8em;
}

.cbTrainingLink:hover {
    cursor: pointer;
    text-align: center;
}


/* DEBUGGING: */
/*td
{
   border: 1px solid green!important;
}

tr
{
   border: 1px solid red!important;
}*/

/*********************************/

.cbdia {
    margin-left: 30px;
    margin-top: 3px;
    margin-bottom: 2px;
    display: block;
}

@media (min-width: 700px) {
    .cbdia {
        margin-left: 40px;
        margin-top: 5px;
        margin-bottom: 4px;
    }
}

.diagarea {
    margin-left: auto;
    margin-right: auto;
}


.cbBoardBubble /*, .cbBoardBubbleNoCircles*/
{
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 6px;
    padding-left: 8px;
    padding-right: 8px;
    font-family: Montserrat, Roboto, sans-serif;
    color: hsla(200, 100%, 17%, 1);
    position: absolute;
    color: black;
    min-width: 160px;
    border: 2px solid hsla(200, 40%, 50%, 1); /* hsla( 0, 0%, 65%, 0.8);*/
    border-radius: 20px;
    text-align: center;
    background-image: linear-gradient(to bottom, hsla(0, 0%, 97%, 0.85), hsla(0, 0%, 92%, 0.83));
    z-index: 5000;
}

.cbBoardBubbleTR, .cbBoardBubbleBR, .cbBoardBubbleTL, .cbBoardBubbleBL {
}

.cbBoardBubbleTR:after, .cbBoardBubbleBR:after, .cbBoardBubbleTL:after, .cbBoardBubbleBL:after {
    content: '';
    position: absolute;
    display: block;
    border: 3px solid hsla(0, 0%, 65%, 0.8);
    border-radius: 16px;
    background-image: linear-gradient(to bottom, hsla(0, 0%, 97%, 0.85), hsla(0, 0%, 92%, 0.85));
    width: 16px;
    height: 16px;
}

.cbBoardBubbleTR:before, .cbBoardBubbleBR:before, .cbBoardBubbleTL:before, .cbBoardBubbleBL:before {
    content: '';
    position: absolute;
    display: block;
    border: 3px solid hsla(0, 0%, 75%, 0.8);
    border-radius: 10px;
    background-image: linear-gradient(to bottom, hsla(0, 0%, 97%, 0.9), hsla(0, 0%, 92%, 0.9));
    width: 10px;
    height: 10px;
}

.cbBoardBubbleTR:after {
    bottom: -1.8em; /*34px;*/
    left: 1.1em; /*25px;*/
}

.cbBoardBubbleTR:before {
    bottom: -2.9em; /*-56px;*/
    left: 0.5em; /*5px;*/
}

.cbBoardBubbleTL:after {
    bottom: -1.8em; /*34px;*/
    right: 1.1em; /*25px;*/
}

.cbBoardBubbleTL:before {
    bottom: -2.9em; /*-56px;*/
    right: 0.5em; /*5px;*/
}


.cbBoardBubbleBR:after {
    top: -1.8em; /*34px;*/
    left: 1.1em; /*25px;*/
}

.cbBoardBubbleBR:before {
    top: -2.9em; /*-56px;*/
    left: 0.5em; /*5px;*/
}

.cbBoardBubbleBL:after {
    top: -1.8em; /*34px;*/
    right: 1.1em; /*25px;*/
}

.cbBoardBubbleBL:before {
    top: -2.9em; /*-56px;*/
    right: 0.5em; /*5px;*/
}


.cbBoardBubbleIcon {
    margin-left: 15px;
    float: right;
    max-height: 32px;
}


.cbNodeBtn {
    width: 22px;
    height: 1.25em;
    margin-top: 1px;
    vertical-align: middle;
    display: inline-block;
    background-repeat: no-repeat;
    background-position-y: 0px;
    background-position-x: 0px;
    background-size: 16px;
}

.cbFoldBtn {
    background-image: url(/Common/Media/Buttons/Fold_Lev1_16.png);
    margin-left: 4px;
}

.cbFoldBtn[data-level="1"] {
    margin-left: 1px;
}

.cbFoldBtn[data-level="2"] {
    background-image: url(/Common/Media/Buttons/Fold_Lev2_16.png);
}

.cbFoldBtn[data-level="3"] {
    background-image: url(/Common/Media/Buttons/Fold_Lev3_16.png);
}

.cbFoldBtn[data-level="4"] {
    background-image: url(/Common/Media/Buttons/Fold_Lev4_16.png);
}

.cbFoldBtn[data-level="5"] {
    background-image: url(/Common/Media/Buttons/Fold_Lev5_16.png);
}

.cbFoldBtn[data-level="6"] {
    background-image: url(/Common/Media/Buttons/Fold_Lev6_16.png);
}

.cbFoldBtn[data-level="7"] {
    background-image: url(/Common/Media/Buttons/Fold_Lev7_16.png);
}

.cbFoldBtn[data-level="8"] {
    background-image: url(/Common/Media/Buttons/Fold_Lev8_16.png);
}

.cbUnFoldBtn {
    background-image: url(/Common/Media/Buttons/UnFold_Lev1_16.png);
    margin-left: 4px;
}

.cbUnFoldBtn[data-level="1"] {
    margin-left: 1px;
}

.cbUnFoldBtn[data-level="2"] {
    background-image: url(/Common/Media/Buttons/UnFold_Lev2_16.png);
}

.cbUnFoldBtn[data-level="3"] {
    background-image: url(/Common/Media/Buttons/UnFold_Lev3_16.png);
}

.cbUnFoldBtn[data-level="4"] {
    background-image: url(/Common/Media/Buttons/UnFold_Lev4_16.png);
}

.cbUnFoldBtn[data-level="5"] {
    background-image: url(/Common/Media/Buttons/UnFold_Lev5_16.png);
}

.cbUnFoldBtn[data-level="6"] {
    background-image: url(/Common/Media/Buttons/UnFold_Lev6_16.png);
}

.cbUnFoldBtn[data-level="7"] {
    background-image: url(/Common/Media/Buttons/UnFold_Lev7_16.png);
}

.cbUnFoldBtn[data-level="8"] {
    background-image: url(/Common/Media/Buttons/UnFold_Lev8_16.png);
}


/*.cbgame-header table td
{
	border:1px solid blue;
}

.cbgame-header table tr
{
	border: 2px dashed red;
}*/


.notaToolbar {
    width: 100%;
}

.notaToolbar, .liveBookToolbar {
    border: 0;
    padding: 5px;
    background-color: hsl(31, 30%, 80%);
}

.notaToolbar button, .liveBookToolbar button, .databasePanel button {
    margin-right: 0px;
    border: 0px;
    cursor: pointer;
    background-color: hsl(31, 30%, 80%);
    box-sizing: content-box;
}

@media screen and (max-width: 749px) {
    .notaToolbar, .liveBookToolbar, .databasePanel {
        height: 28px;
    }

    .notaToolbar button, .liveBookToolbar button, .databasePanel button {
        padding: 2px;
    }
}

@media screen and (min-width: 750px) {
    .notaToolbar, .liveBookToolbar, .databasePanel {
        height: 28px;
    }

    .notaToolbar button, .liveBookToolbar button, .databasePanel button {
        padding: 4px;
    }
}

.notaToolbar button:hover {
    filter: brightness(110%);
}

.notaToolbar button img, .liveBookToolbar button img, .databasePanel button img {
    vertical-align: bottom;
    padding-right: 5px;
}

.nota-EmptyLine {
    margin: 16px;
}


/* ----- ../../Common/Resources/CSS/Engine.css ----- */
/***********************
    ENGINE
*/

.engParent {
    background-image: url('https://pgn.chessbase.com//common/Media/Chess/notapaper.jpg') !important;
}

.lines-container {
    overflow-y: auto;
    overflow-x: hidden !important;
    width: 100%;
    height: 100%;
    /*padding: 2px;*/
    font-size: 13px !important;
    border: 1px grey solid;
    background-image: url('https://pgn.chessbase.com//common/Media/Chess/notapaper.jpg') !important;
}

.engine-lines {
    font-family: Helvetica Neue, Roboto, sans-serif;
    font-size: 12px;
    padding: 4px;
    overflow-x: hidden !important;
}

@media screen and (min-height: 300px) {
    .engine-lines {
        font-size: 0.8em;
    }
}

@media screen and (min-height: 400px) {
    .engine-lines {
        font-size: 0.85em;
    }
}

@media screen and (min-height: 500px) {
    .engine-lines {
        font-size: 0.88em;
    }
}

@media screen and (min-height: 600px) {
    .engine-lines {
        font-size: 0.92em;
    }
}

.engine-lines .line {
    padding-bottom: 0px;
    padding-top: 1px;
}

.engine-lines .line .nota {
    padding-bottom: 1px;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.engine-lines .line.outdated .nota {
    color: darkgray;
}

.infoHandicap {
    color: red;
    font-weight: bold;
}

.engine-info-text {
    width: 100%;
    height: 100%;
    background-image: url('https://pgn.chessbase.com//common/Media/Chess/notapaper.jpg') !important;
}

.findStrong {
    font-size: 120%;
    font-weight: bold;
    padding: 20px;
    animation: engineAnimFlash 1.0s ease;
    animation-iteration-count: 5;
}

.startSearch {
    font-size: 105%;
    color: hsla(120, 20%, 30%, 0.5);
    padding: 10px;
    text-transform: uppercase;
}

.engineStopped {
    font-size: 102%;
    color: hsla(10, 40%, 30%, 0.5);
    padding: 10px;
    text-transform: uppercase;
}

@keyframes engineAnimFlash {
    0%, 100% {
        opacity: 1;
    }

    50% {
        opacity: 0.3;
    }
}

.engine-lines[data-lines="1"] .line .nota {
    font-weight: bold;
    white-space: inherit;
    text-overflow: inherit;
    font-size: 115%;
}

.engine-lines .line .nota .pvnum {
    margin-right: 4px;
}

/*.engine-lines .line .nota .pvnum:after
   {
      content: ".";
   }*/

.engine-lines .line .nota .symbol {
    margin-right: 2px;
}

.engine-lines .data,
.engine-lines .data-common {
    font-size: 90%;
    font-weight: normal;
    color: darkslategray;
    padding-left: 1em;
}

.engine-lines .line .data {
    display: none;
}

.engine-lines[data-lines="1"] .line .data {
    display: inherit;
}

.engine-lines .data-common {
    display: inherit;
}

.engine-lines[data-lines="1"] .data-common {
    display: none;
}

.engine-lines[data-lines="1"] .pvnum {
    display: none;
}

.engine-lines .evStr {
    font-weight: normal;
    font-size: 90%;
    padding-left: 1em;
    margin-top: 0.3em;
    color: hsla(180, 30%, 10%, 0.8);
}

.cbEngineThreat {
    color: hsl(15, 70%, 45%);
}

.evImage img {
    float: right;
    max-height: 36px;
    max-width: 36px;
    margin-right: 10px;
    padding-left: 1em;
    /*margin-top:10px;*/
}

@media screen and ( min-height: 600px ) {
    .evImage img {
        float: right;
        /*margin-top: 12px;*/
        max-height: 48px;
        margin-right: 16px;
    }
}

.evImageInfo {
    padding: 6px;
    margin-top: 6px;
}

.evImageInfo img {
    max-height: 32px;
}

@media screen and ( min-height: 700px ) {
    .evImageInfo {
        padding: 6px;
        margin-top: 10px;
    }

    .evImageInfo img {
        max-height: 48px;
    }
}

@media screen and ( min-height: 920px ) {
    .evImageInfo {
        padding: 8px;
        margin-top: 16px;
    }

    .evImageInfo img {
        max-height: 72px;
    }
}

/* EngineOutputFritz and EngineLinesElementEx.js */

.engOutContainer {
    width: 100%;
    height: 100%;
    /*border: solid black 1px;*/
    box-sizing: border-box;
    font-family: Karla, sans-serif, Roboto, Helvetica Neue;
    font-size: 12px;
    min-height: 30px;
    padding-top: 4px;
    padding-left: 2px;
    padding-right: 2px;
    /*background-color: hsla( 240, 50%, 94%, 0.4 );*/
    background-image: url('https://pgn.chessbase.com//common/Media/Chess/notapaper.jpg') !important;
    overflow: hidden;
}

.engOutContainerPlay {
    display: flex;
    flex-direction: row;
}

@media screen and ( min-width: 600px ) {
    .engOutContainer {
        font-size: 13px;
        min-height: 90px;
        padding: 6px;
    }
}

@media screen and ( min-width: 820px ) {
    .engOutContainer {
        font-size: 14px;
        padding: 8px;
    }
}

@media screen and ( min-width: 1000px ) {
    .engOutContainer {
        font-size: 16px;
        padding: 12px;
    }
}

.engOutLeftCol {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    max-width: 62%;
}

@media screen and (min-width: 1000px) {
    .engOutLeftCol {
        max-width: 64%;
    }
}

.engOutRightCol {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    max-width: 38%;
}

.engOutPane {
    /*border:1px dashed black;*/
}

.engOutLine {
    display: flex;
    flex-direction: row;
    /*justify-content: space-between;
   flex-grow: 1;
   flex-basis: 25px;*/
    overflow-y: hidden;
    height: 100%;
    /*   padding: 3px;*/
}

@media screen and ( min-width: 900px) {
    .engOutLine {
        /*padding: 7px;*/
    }
}

.engOutLineLeft {
    overflow-x: hidden;
    overflow-y: auto;
    width: 100%;
}

.engOutLineRight {
    /*min-width:24px;
   max-width:24px;*/
    flex-basis: 24px;
    margin-left: 4px;

    display: flex;
    flex-direction: column; /*may switch in portrait layout*/
}

.engOutHintParent {
    flex-grow: 1;
    flex-basis: 25px;
}

.engOutHint {
    width: max-content;
}

.engOutHintInner {
    display: inline-block;
    padding-right: 8px;
}

.engOutNextHint {
    display: inline-block;
    margin-left: -1px;
    margin-top: 10px;
}

.engOutShaker {
    animation: shaker 1s 6;
}

@keyframes blinker {
    0% {
        filter: brightness(1.0);
        transform: scale(1.0);
    }

    50% {
        filter: brightness(1.1);
        transform: scale(1.08);
    }

    100% {
        filter: brightness(0.95);
        transform: scale(0.96);
    }
}

.engOutBlinkDiod {
    animation: blinker 1.2s linear infinite;
}

.engOutHintText {
    font-weight: 600;
    background-color: saddlebrown; /*used!?*/
    color: hsl(60, 70%, 85%);
    font-size: 12px;
    min-height: 20px;
    padding-top: 3px;
    padding-left: 8px;
    padding-right: 8px;
}

.engOutHintStrong {
    background-image: linear-gradient(rosybrown, saddlebrown);
    color: hsl(60, 70%, 85%);
}

.engOutHintStatus {
    background-color: hsla(0, 0%, 10%, 0.8);
    color: hsl(60, 70%, 85%);
    /*color:white;*/
}

.engOutHintPrecise {
    background-image: linear-gradient(olive, olivedrab);
    color: hsl(60, 70%, 85%);
}

.engOutOneHint {
    background-image: linear-gradient(hsl(23, 30%, 50%), hsl(23, 39%, 42%));
    color: hsl(60, 70%, 85%);
}

.engHintBlue {
    background-image: linear-gradient(hsl(210, 35%, 50%), hsl(210, 35%, 40%));
    color: hsl(60, 70%, 85%);
}

@media screen and (min-height: 800px) {
    .engOutHintText {
        font-weight: 600;
        color: darkgreen;
        font-size: 18px;
        min-height: 26px;
    }

    .engOutHintStrong, .engOutHintPrecise, .engOutOneHint, .engOutHintStatus {
        font-weight: 600;
        border-radius: 2px;
        box-shadow: 2px 2px 8px hsla(0, 0%, 0%, 0.20);
        color: hsl(60, 70%, 85%);
        padding: 4px;
        padding-left: 10px;
        padding-right: 10px;
    }

    .engOutHintStrong, .engOutHintPrecise {
        animation: shaker 1s 10;
    }
}

@media (orientation: portrait) {
    .engOutHint {
        margin-bottom: 5px;
    }

    .engOutHintText {
        font-size: 14px;
        min-height: 22px;
        padding-top: 2px;
        padding-bottom: 0px;
    }
}


.engOutHintCheck, .engOutAssistCheck {
    background-color: hsla(240, 50%, 94%, 0.1);
    padding: 0;
    margin: 0;
    font-size: 10px;
}

@media screen and (min-height: 600px) and (min-width: 900px) {
    .engOutHintCheck, .engOutAssistCheck {
        font-size: 12px;
        padding-top: 4px;
        padding-left: 0px;
        margin-left: -3px;
    }
}

@keyframes shaker {
    0% {
        transform: translate(-2px, 0px);
    }

    50% {
        transform: translate(2px, 0px);
    }
}

.exercise .engOutHint {
    margin-top: 10px;
}

.engOutFeedbackParent {
    flex-grow: 1;
    flex-basis: 25px;
    margin-top: 2px;
    max-width: 94%;
}

.engOutFeedbackText {
    /*padding: 2px;*/
    font-size: 12px;
    /*font-family: Karla;*/
}

@media screen and (min-height: 700px) and (min-width: 1200px) {
    .engOutFeedbackParent {
        flex-grow: 1;
        flex-basis: 25px;
        margin-top: 6px;
    }


    .engOutFeedbackText {
        /*font-style: italic;*/
        /*padding: 7px;*/
        font-size: 16px;
        font-weight: 500;
    }
}

.engOutMoveOk, .engOutMoveBlunder {
    color: hsl(60, 70%, 85%);
    /*padding: 4px;
   padding-left: 6px;
   padding-right: 6px;*/
    text-align: center;
}

.engOutMoveOk {
    background-image: linear-gradient(hsl(102, 50%, 45%), hsl(102, 50%, 32%));
}

.engOutMoveBlunder {
    background-image: linear-gradient(hsl(5, 50%, 50%), hsl(5, 50%, 42%));
}

.engOutEval {
    display: flex;
    justify-content: space-between;
    flex-grow: 1;
    max-height: 38px;
}

.engOutEvalText {
    flex-grow: 2;
    padding-left: 2px;
    font-family: serif;
    font-style: italic;
}

.exercise .engOutEvalText {
    padding-right: 4px;
}

.engOutEvalImg {
    padding: 2px;
    max-width: 38px;
    max-height: 38px;
}

.engOutEvalImg img {
    max-height: 32px;
    max-width: 32px;
}

@media screen and ( min-width: 1000px ) and ( min-height: 800px ) {
    .engOutEval {
        max-height: 56px;
    }

    .engOutEvalImg {
        max-height: 56px;
        max-width: 56px;
    }

    .engOutEvalImg img {
        max-height: 48px;
        max-width: 48px;
        border-radius: 4px;
        box-shadow: 2px 2px 10px hsla(0, 0%, 0%, 0.12);
        /*background-color: hsla( 60, 20%, 96%, 1.0 );*/
        padding: 4px;
    }
}

@media screen and ( min-width: 1400px ) {
    .engOutEval {
        max-height: 84px;
    }

    .engOutEvalImg {
        max-height: 80px;
        max-width: 80px;
    }

    .engOutEvalImg img {
        max-height: 68px;
        max-width: 68px;
        border-radius: 10px;
        box-shadow: 2px 2px 10px hsla(0, 0%, 0%, 0.15);
        padding: 5px;
    }
}

.engOutEvProfile .cbevprofile {
    width: calc(100% - 3px);
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 0;
    margin-top: 10px;
    border-radius: 4px;
}

.engOutPosInfo {
    width: calc(100% - 3px);
    max-width: 470px;
    border: 1px solid hsla(0, 0%, 0%, 0.2);
    background-color: hsla(60, 20%, 96%, 1.0);
    border-radius: 4px;
    box-shadow: 2px 2px 10px hsla(0, 0%, 0%, 0.15);
    margin-top: 10px;
    overflow: hidden;
}

.engOutPosInfoDebug {
    display: flex;
    flex-direction: column;
    flex-grow: 3;
    padding: 4px;
}

.engOutPosInfoTitle {
    font-weight: 600;
}

.engOutSpaceInfo {
}

.engine-info-text {
    font-size: 12px;
    background-image: url('https://pgn.chessbase.com//common/Media/Chess/notapaper.jpg') !important;
}

@media screen and (min-height: 700px) {
    .engine-info-text {
        font-size: 13px;
        /*background-image: url('https://pgn.chessbase.com//common/Media/Chess/notapaper.jpg') !important;*/
    }
}

@media screen and (min-height: 900px) {
    .engine-info-text {
        font-size: 16px;
    }
}

.engine-info-text ul {
    list-style-position: inside;
    list-style-type: circle;
}

.engOutVariation .line .nota .symbol {
    margin-right: 1px;
    margin-right: 1px;
}


.engOutCalculation {
    min-height: 90px;
}

.engOutVariation {
    /*font-family: Helvetica Neue, Roboto, sans-serif;*/
    font-size: 1px;
    min-height: 30px;
    padding: 4px;
    padding-left: 0;
    padding-top: 0;
    overflow-x: hidden !important;
    display: flex;
    flex-direction: column
}

@media screen and (min-height: 250px) and (min-width: 250px) {
    .engOutVariation {
        font-size: 12px;
    }
}

@media screen and (min-height: 400px) and (min-width: 400px) {
    .engOutVariation {
        font-size: 13px;
    }
}

@media screen and (min-height: 500px) and (min-width: 500px) {
    .engOutVariation {
        font-size: 13px;
    }

    .engOutVariation .line .nota .pvnum {
        margin-right: 4px;
    }

    .engOutVariation .line .nota .symbol {
        margin-right: 2px;
    }

}

@media screen and (min-height: 600px) and (min-width: 1300px) {
    .engOutVariation {
        font-size: 14px;
    }
}

.engOutVariation .line {
    padding-bottom: 0px;
    padding-top: 1px;
    padding-right: 6px;
}

.engOutVariation .line .nota {
    padding-bottom: 1px;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: flex;
}

.engOutVariation .line.outdated .nota {
    color: darkgray;
}

.engOutVariation[data-lines="1"] .line .nota {
    font-weight: 600;
    white-space: inherit;
    text-overflow: inherit;
    /*font-size: 115%;*/ /*font-size: 115%;*/
    /*max-height:48px;*/
    overflow-y: auto;
}


.engOutVariation .data,
.engOutVariation .data-common {
    font-size: 90%;
    font-weight: normal;
    color: darkslategray;
    padding-left: 1em;
}

.engOutVariation .line .data {
    display: none;
}

.engOutVariation[data-lines="1"] .line .data {
    display: inherit;
}

.engOutVariation .data-common {
    display: inherit;
}

.engOutVariation[data-lines="1"] .data-common {
    display: none;
}

.engOutVariation[data-lines="1"] .pvnum {
    display: none;
}

.engOutVariation .pvHandicap, .engOutVariationText .pvHandicap {
    font-size: 14px;
}

@media screen and (min-width: 1000px) {
    .engOutVariation .pvHandicap, .engOutVariationText .pvHandicap {
        font-size: 16px;
    }
}

@media screen and (min-height: 900px) {
    .engOutVariationText {
        font-size: 16px;
    }
}

.engOutVariation .evStr {
    font-weight: normal;
    font-size: 90%;
    padding-left: 1em;
    margin-top: 0.3em;
    color: hsla(180, 30%, 10%, 0.8);
}


.engOutSearchInfo {
    margin-top: 0px;
    padding-left: 2px;
    font-size: 10px;
}

@media screen and ( min-height: 700px ) {
    .engOutSearchInfo {
        margin-top: 1px;
        padding-left: 2px;
        font-size: 11px;
    }


}

@media screen and ( min-height: 850px ) {
    .engOutSearchInfo {
        margin-top: 2px;
        padding-left: 2px;
        font-size: 14px;
    }
}


.engOutHelpShareParent {
    background-color: hsla(80, 30%, 50%, 1.0);
    width: 100%;
    max-width: 400px;
    margin-top: 6px;
    height: 20px;
    display: flex;
    flex-direction: row;
    border-radius: 6px;
    box-shadow: 1px 1px 5px hsla(0, 0%, 0%, 0.2);
}

.engOutHelpShare, .engOutUserShare {
    height: 100%;
    display: flex;
    /*   border-radius: 4px;*/
}

.engOutHelpShare {
    background-image: linear-gradient(to bottom, hsl(240, 30%, 70%) 10%, hsl(240, 30%, 44%));
    width: 40%;
    border-top-left-radius: 6px;
    border-bottom-left-radius: 6px;
}

.engOutUserShare {
    background-image: linear-gradient(to bottom, hsl(80, 30%, 70%) 10%, hsl(80, 30%, 44%));
    width: 60%;
    border-top-right-radius: 6px;
    border-bottom-right-radius: 6px;
}

.engOutUserShareText, .engOutHelpShareText {
    color: white;
    font-size: x-small;
    width: 100%;
    align-self: center;
    text-align: center;
}

@media screen and (min-height: 700px) and (min-width: 700px) {
    .engOutHelpShareParent {
        margin-top: 10px;
        height: 30px;
    }
}

.engOutHintShareTxt {
    font-weight: bold;
    display: inline-block;
}

.engOutHintCnt {
    font-size: 10px;
    height: 12px;
    text-align: center;
    margin-top: 4px;
    max-width: 400px;
}

@media screen and (min-height: 700px) and (min-width: 700px) {
    .engOutHintCnt {
        font-size: 11px;
        height: 14px;
        margin-top: 5px;
    }
}


/************************************************************************/
/***** engOutPosInfo - static evaluations *********************************/
/************************************************************************/

.engOutPosInfoAttribute {
    display: flex;
    flex-direction: row;
    flex-grow: 1;
}

.engOutInfoAttributeTxt {
    display: flex;
    flex-direction: row;
    flex-grow: 1;
}

.engOutPosInfoAttributeBar {
}

.engOutPosInfoAttributeIcon {
}

.engOutPieceEvalsHori, .engOutPieceEvalsVerti {
    margin-top: 10px;
    padding-left: 10px;
    padding-bottom: 10px;
}

.engOutPieceEvalsVerti {
}

.engOutPieceEvalsHori {
}

.engOutPieceEvalLineVerti {
    display: flex;
    flex-direction: row;
}

.engOutPieceEvalLineHori {
    display: flex;
    flex-direction: column;
    margin-right: 7px;
}

.engOutPieceEval {
    display: flex;
    flex-direction: row;
}

.engOutEvalIcon {
}

.engOutEvalIcon img {
    /*   image-rendering:pixelated;*/
}

.engOutEvalDiods {
    display: flex;
    flex-direction: row;
}

.engOutEvalDiod {
}

.engOutEvalDiodInner {
    margin: 2px;
    /*   background-image: radial-gradient(hsl(100,50%,50%), hsl(100,60%,60%));*/
    border-radius: 4px;
    box-shadow: 2px 2px 3px hsla(0, 0%, 0%, 0.15);
}

.engOutEvalTexts {
    display: flex;
    flex-direction: row;
}

.engOutEvalButton {
}

.engOutVertiActivity {
    margin-top: 6px;
}

.engOutHoriActivity {
    margin-top: 12px;
}

.engOutHoriComplexity {
    margin-top: 12px;
    margin-left: 20px;
}

.engOutActivity {
    display: flex;
    flex-direction: row;
}

.engOutActivitySteps {
    display: flex;
    flex-direction: row;
    margin-right: 3px;
}

.engOutVertiComplexity {
    margin-top: 8px;
}

.engOutComplexity {
    display: flex;
    flex-direction: row;
}

.engOutComplexitySteps {
    display: flex;
    flex-direction: row;
}

.engOutComplexityText {
    align-self: center;
    margin-left: 6px;
    margin-top: 2px;
    font-weight: 300;
}

.engOutBtn {
    width: 20px;
    height: 20px;
    margin-bottom: 2px;
    margin-left: 5px;
    background-position: center;
    background-repeat: no-repeat;
    border: 1px solid hsla(0, 0%, 0%, 0.2);
    border-radius: 2px;
}

.engOutBtn:hover {
    background-color: green;
}

.engOutBtn:active, .engOutBtn:visited {
    background-color: inherit;
}

.engOutBtnPlus {
    background-image: url('https://pgn.chessbase.com/common/media/ribbons/engplus16.png');
}

.engOutBtnMinus {
    background-image: url('https://pgn.chessbase.com/common/media/ribbons/engminus16.png');
}

.engOutBtnThreat {
    background-image: url('https://pgn.chessbase.com/common/media/ribbons/engthreat16.png');
}

.engOutBtnHints {
    background-image: url('https://pgn.chessbase.com/common/media/ribbons/enghelp16.png');
}

.engOutBtnEval {
    background-image: url('https://pgn.chessbase.com/common/media/ribbons/engPosEval16.png');
}


.engOutNextHintBtn {
    margin-top: 5px;
}

#idAttacks {
    margin-left: 10px;
}


/***** End Of engOutPosInfo - static evaluations ****/


/* ----- ../../Common/Resources/CSS/Controls.css ----- */


.hambNav {
    overflow: hidden;
    display: flex;
    width: 100%;
}

.hambIcon {
    background-color: black;
    display: flex;
    flex-direction: column;
    padding: 10px;
    width: 50px;
    box-sizing: border-box;
}

.hamburger:hover {
    background-color: #464;
    color: black;
    transition: background-color 0.15s ease;
}

.hambLine {
    width: 30px;
    height: 4px;
    background-color: white;
    margin-top: 2px;
}

.hambCaption {
    padding-top: 10px;
    text-align: center;
    width: 100%;
    background-image: linear-gradient(to right, hsl(210, 21%, 28%), hsl(209, 11%, 53%));
    box-sizing: border-box;
    color: white;
    padding-top: 12px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-size: 13px;
    font-weight: 500;
    font-family: Roboto;
    white-space: nowrap;
    overflow: hidden;
}

.hambMenu {
    display: table; /*make it same height as children*/
    background-color: rgb(30, 30, 30);
    position: absolute;
    top: 0px;
    bottom: 0;
    left: 0;
    min-width: 260px;
    max-width: 380px !important;
    width: 92%;
    transform: translateX(-20em) scale(0.5) skew(0deg);
    transition: .1s ease-out;
    opacity: 0.0;
    z-index: 10;
}

.translateX0 {
    transform: translateX(0%) scale(1.0) skew(0deg);
    opacity: 1.0;
}

.slideInMenu {
    overflow: auto;
    padding: 8px;
    font-family: 'Roboto Condensed', Helvetica, sans-serif;
    box-shadow: 3px 3px 10px hsla(0, 0%, 0%, 0.5);
    background-color: rgb(30, 30, 30);
    border-bottom-right-radius: 10px;
}

.slideInItem {
    color: white;
    padding: 6px;
    padding-top: 8px;
    text-decoration: none;
    font-size: 16px;
    display: block;
}

.slideInItem .slideInItem {
    margin-left: 30px;
}

.slideInItem:hover {
    background: #555;
    transition: background 0.1s ease;
}

.slideInText {
    display: inline-block;
}

.slideInCheckMark {
    display: inline-block;
    margin-left: 10px;
    background-position: right;
    background-repeat: no-repeat;
    width: 16px;
    height: 16px;
}

.slideInNoCheck {
}

.slideInWithCheck {
    background-image: url("https://pgn.chessbase.com/Common/Media/Ribbons/Reader/Check16.png");
}

.subMenuClosed {
    display: none;
}


/* ----- ../../Common/Resources/CSS/JqAdapter.css ----- */
.ribbon {
    border-top: 1px solid hsla(0, 0%, 0%, 0.3);
}

.ribbon table {
    padding-top: 5px;
}

.ribbonTD {
    text-align: center;
    padding-left: 4px;
    padding-right: 4px;
}

.ribbonNoTabUL {
    display: none;
}

.ribbonBtnTextR {
    display: inline-flex;
    padding: 4px;
    padding-right: 10px;
    font-size: small;
    font-family: Roboto;
}

.ribbonBtnIconOnly {
    display: inline-flex;
    padding: 2px;
}

.ribbonBtnLine32 {
    line-height: 32px;
}

.ribbonBtnLine24 {
    line-height: 24px;
}

.ribbonBtnTextBelow {
    padding: 4px;
    margin-bottom: 3px;
}

.ribbonBtnTextR span {
    padding-left: 6px;
    white-space: nowrap;
}

.ribbonSeparator {
    border-left: 1px solid hsla(0, 0%, 0%, 0.3);
    margin-left: 5px;
    margin-right: 5px;
    padding-top: 3px;
    width: 1px;
}

.ribbonSpacer {
    width: 6px;
}

/*.ribbonCategory
{
   display:flex;
}*/

.ribbonCategoryTitle {
    font-size: 0.8em;
    color: hsla(0, 0%, 0%, 0.3);
    font-family: Roboto;
    text-align: center;
    margin-bottom: 20px;
}


/* ----- ../../Common/Chess/GUI/Guessing/GuessingElement.css ----- */
.overlay {
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 999;
    opacity: 0.7;
    background: rgba(255, 255, 255, 0.8) url("loader.gif") center no-repeat;
}

body.loading {
    overflow: hidden;
}

body.loading .overlay {
    display: block;
}

.RankHeader {
    font-family: Roboto;
    font-size: 16px;
}

.tdRankRank {
    width: 6%;
}

.tdRankUser {
    width: 86%;
}


/* ----- ReaderNew.css ----- */

.cbreplay, .cblive, .cbvideo, .cblivevideo {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    max-width: 100vw; /*strange el-pais width of 1 mill pixel*/
    /*height:100%;*/
    height: 86vh;
    min-width: 120px;
    min-height: 120px;
    padding: 0px;
    position: relative;
    /*border: 1px solid gray;*/
    box-shadow: 2px 2px 8px hsla(0, 0%, 0%, 0.14);
    box-sizing: border-box;
    background-color: hsla(0, 0%, 99%, 0.01);
    /*border-bottom: 2px solid gray;*/
}

.cbPluginHolder .cbreplay {
    height: 100%;
}

@media screen and (min-width: 700px) {
    .cbreplay, .cbvideo, .cblivevideo {
        border-bottom: 2px solid gray
    }
}

.cbofflinevideo {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    min-width: 400px;
    max-width: 1100px;
    height: 82vh;
    min-height: 400px;
    max-height: 800px;
    margin-bottom: 0px;
    margin-top: 0px;
    padding: 0px;
    position: relative;
    /*border: 1px solid gray;*/
    box-shadow: 2px 2px 8px hsla(0, 0%, 0%, 0.15);
    box-sizing: border-box;
    background-color: hsla(0, 0%, 99%, 0.01);
    border-bottom: 2px solid gray;
}

.cblive {
    border: 0;
}


.cbreplay .root, .cblive .root, .cbvideo .root, .cblivevideo .root, .cbofflinevideo .root {
    user-select: none;
    /*touch-action: none;
   -webkit-touch-callout: none;*/
    /*border: 2px solid blue;*/
}

.root {
    width: 100%;
    height: 100%;
    box-sizing: border-box;
}

.mobCaption {
    min-height: 26px;
    max-height: 40px;
    height: 7%;
    width: 100%;
}

.north {
    width: 100%;
    height: 50%;
    box-sizing: border-box;
}

.south {
    width: 100%;
    height: 40%;
    box-sizing: border-box;
}


.main {
    height: 100%;
    width: 100%;
}

.mobEast {
    width: 30%;
    height: 100%;
    box-sizing: border-box;
    /*display: inline-block;*/
    /*border: 2px dotted green;*/
}

.mobWest {
    width: 70%;
    height: 100%;
    box-sizing: border-box;
    /*display: inline-block;*/
    /*border: 1px solid red;*/
}

.cbreplay .east, .cblive .east, .cbvideo.east /*, .cblivevideo.east, .cbofflinevideo.east */
{
    position: absolute;
    top: 0px;
    /*width: 50%;
   left: 50%;*/
    width: 100%;
    margin-left: 0%;
    margin-top: 0;
    box-sizing: border-box;
    height: 100%;
    /*background-color:red;*/
}


/* WARNING: Not valid without spaces (descendant rule) */

.cbreplay.west, .cblive.west, .cbvideo.west, cblivevideo.west, cbofflinevideo.west {
    position: absolute;
    top: 0px;
    margin-left: 0%;
    margin-top: 0;
    box-sizing: border-box;
    height: 100%;
    width: 100%;
    /*width: 50%;*/
}

.cbreplay.westNest, .cblive.westNest, cbvideo.westNest, cblivevideo.westNest, cbofflinevideo.westNest {
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    background-image: linear-gradient(to right, hsla(31, 20%, 77%, 1.0), hsla(31, 35%, 85%, 1.0) 40%, hsla(31, 35%, 61%, 1.0));
}

.cbreplay.westNorth, .cblive.westNorth, .cbvideo.westNorth, .cblivevideo.westNorth, .cbofflinevideo.westNorth {
    width: 100%;
    height: 55%;
    box-sizing: border-box;
    background-image: linear-gradient(to right, hsla(31, 25%, 85%, 1.0), hsla(31, 35%, 61%, 1.0));
    /*background-color: hsla( 31, 35%, 61%, 0.6 );*/
    /*background-color: greenyellow;*/
}

.cbreplay.westSouth, .cblive.westSouth, .cbvideo.westSouth, .cblivevideo.westSouth, .cbofflinevideo.westSouth {
    width: 100%;
    height: 45%;
    box-sizing: border-box;
}

.cblive.westSouth {
    height: 38%;
}

.cbreplay.southNorth, .cblive.southNorth, .cbvideo.southNorth, .cblivevideo.southNorth, .cbofflinevideo.southNorth {
    width: 100%;
    height: 60%;
    box-sizing: border-box;
    border: 1px solid brown;
}

.cbreplay.southSouth, .cblive.southSouth, .cbvideo.southSouth, .cblivevideo.southSouth, .cbofflinevideo.southSouth {
    width: 100%;
    height: 40%;
    box-sizing: border-box;
    border: 1px solid yellow;
}

.cbreplay .notaparent, .cblive .notaparent, .cbvideo.notaparent, .cblivevideo.notaparent, .cbofflinevideo.notaparent {
    top: 0;
    left: 0;
    /*border-left: 1px solid gray;*/
    height: calc(100% - 34px);
}

.notaNest {
    height: 100%;
    min-height: 40px;
}

.boardAndEng {
    height: 100%;
    display: flex;
    flex-direction: row;
    border-top: 1px solid hsla(0, 0%, 0%, 0.3);
}

.board-sw {
    width: 60%;
    height: 100%;
}

.eng-se {
    width: 40%;
    height: 100%;
}

.cbcaption {
    /*min-height: 26px;
   max-height: 40px;
   height: 7%;*/
    width: 100%;
    height: 38px;
    margin-left: 0px;
    background-image: linear-gradient(to right, hsl(210, 21%, 28%), hsl(209, 11%, 53%));
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    /*border: 1px solid hsla( 0, 0%, 22%, 1.0);*/
    border-bottom: none;
    box-sizing: border-box;
    color: white;
    /*padding-left: 40px;
   padding-top: 11px;*/
    text-transform: uppercase;
    letter-spacing: 0.12em;
    font-size: 14px;
    font-weight: 500;
    font-family: Roboto;
}

.cbbottom {
}

.cbbottom {
    height: 5px;
    border-bottom-right-radius: 12px;
    border-bottom-left-radius: 12px;
    background-image: linear-gradient(to top, hsl(210, 21%, 48%), hsl(209, 11%, 63%));
    /*border-top:1px solid black;*/
    box-sizing: border-box;
}

.cbdiagram {
    margin-left: auto;
    margin-right: auto;
    min-height: 10px;
    min-width: 10px;
    /* margin-top: 20px;*/
    margin-bottom: 20px;
    width: 100%;
}

.diagarea /*see notation.css*/
{
}

.aboveDiag {
    /*width:100%;*/
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
    /*border:1px solid green;*/
}

.diagTitle {
    text-align: center;
    font-weight: bold;
}

.belowDiag {
    /*max-height: 34px;*/
    margin-top: 0px;
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
    /*border:1px solid green;*/
}

.diagButtons {
    display: flex;
    flex-direction: row;
    justify-content: center;
    /*top: 0px;*/
    height: 100%;
    max-height: 36px;
    box-sizing: border-box;
    /*border:1px solid green;*/
}

.diagText {
    font-size: 0.9em;
    text-align: center;
    font-style: italic;
    padding-top: 4px;
    /*margin-bottom: 15px;*/
}

.diagChoices {
    display: flex;
    flex-direction: row;
    justify-content: center;
    margin-top: 15px;
}

.diagChoices table {
    border: 2px solid hsla(200, 40%, 50%, 1);
    border-radius: 8px;
    border-collapse: separate;
    padding: 20px;
    padding-top: 10px;
    padding-bottom: 10px;
    background-image: linear-gradient(to bottom, hsla(40, 30%, 99%, 0.7) 40%, hsla(40, 30%, 96%, 0.5));
    box-shadow: 1px 1px 6px hsla(0, 0%, 0%, 0.12);
}

.diagChoices table th {
    padding: 10px;
    padding-top: 0;
    font-family: Montserrat;
    font-weight: 500;
}

.diagChoices table td {
    font-family: Roboto Condensed;
    padding: 2px;
    padding-left: 4px;
    padding-right: 4px;
}

.diaChoiceFeedback {
    margin-top: 15px;
    text-align: center;
    font-family: Roboto;
    font-weight: 500;
}

.cbtable {
    line-height: 1.2;
}

.cbtable,
.cbpairing {
    border-collapse: collapse;
    padding-left: 0px;
    margin-left: 0px;
    font-size: 0.8em;
    font-family: 'Roboto', sans-serif;
    width: 100%;
}

.cbtable table,
.cbpairing table {
    max-width: 800px;
}

.cbtable caption,
.cbpairing caption {
    background-color: hsla(192, 3%, 77%, 0.56);
}

.cbtable a,
.cbpairing a {
    color: #900;
    text-decoration: none;
    font-weight: 500;
    vertical-align: middle;
}


.cbtable a:hover,
.cbpairing a:hover {
    color: hsla(0, 60%, 40%, 0.4);
}


.cbtable caption a,
.cbpairing caption a {
    /*color: black;*/
    font-weight: 800;
}

.cbtable thead,
.cbpairing thead {
    /*background-image: linear-gradient(to right,hsla(0,80%,50%,1),hsla(0,80%,40%,1));*/
    color: white;
    background-attachment: fixed;
}

.cbtable thead th,
.cbpairing thead th {
    /*background-color: hsla(0,80%,30%,1);*/
    /*background-color:#FF0000*/
}

.cbtable tr,
.cbpairing tr {
    border-bottom: 1px solid hsla(10, 50%, 76%, 0.2);
}

.cbtable tbody a:visited,
.cbpairing tbody a:visited {
    color: hsla(14, 24%, 43%, 1);
}

.cbtable tbody tr:nth-child(2n),
.cbpairing tbody tr:nth-child(2n) {
    background-color: hsla(0, 10%, 93%, 0.7);
}

.cbtable tbody tr:nth-child(2n+1),
.cbpairing tbody tr:nth-child(2n+1) {
    background-color: white;
}

.cbtable td.tdNumber,
.cbpairing td.tdNumber {
    text-align: right;
    border-collapse: collapse;
    padding-right: 4px;
}

.cbtable td,
.cbpairing td {
    height: 18px;
    padding: 1px;
    border-right: 1px solid hsla(0, 0%, 0%, 0.1);
    border-left: 1px solid hsla(0, 0%, 0%, 0.1);
}

.cbtable td + td,
.cbpairing td + td {
    /*border-left:1px outset black;*/
}


.cbtable td .crossResult,
.cbpairing td .crossResult {
    width: inherit;
    height: inherit;
    text-align: center;
    font-size: 0.85em;
    margin-left: auto;
    margin-right: auto;
}

.cbtable td .samePlayer,
.cbpairing td .samePlayer {
    background-color: hsl(0, 10%, 83%);
    height: 1em;
    width: 1em;
    margin-left: auto;
    margin-right: auto;
}

.cbtable td .points,
.cbpairing td .points {
    font-weight: 500;
}

.cbtable td .name,
.cbpairing td .name {
    /*max-width: 8em;*/
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cbtable td .tb, .cbtable td .perf,
.cbpairing td .tb, .cbpairing td .perf {
    padding-left: 3px;
}

.cbtable .innerResultsBox,
.cbpairing .innerResultsBox {
    display: inline-block;
}

.cbtable th, .cbtable td,
.cbpairing th, .cbpairing td {
    background-image: none;
}

.cbtable tfoot,
.cbpairing tfoot {
    font-size: 0.73em;
}


.cbtable thead,
.cbpairing thead {
    background: hsla(192, 3%, 77%, 0.56);
    color: black;
    /*background: rgba(28,28,28,1);
      background: -moz-linear-gradient(top, rgba(28,28,28,1) 0%, rgba(69,69,69,1) 57%, rgba(69,69,69,1) 100%);
      background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(28,28,28,1)), color-stop(57%, rgba(69,69,69,1)), color-stop(100%, rgba(69,69,69,1)));
      background: -webkit-linear-gradient(top, rgba(28,28,28,1) 0%, rgba(69,69,69,1) 57%, rgba(69,69,69,1) 100%);
      background: -o-linear-gradient(top, rgba(28,28,28,1) 0%, rgba(69,69,69,1) 57%, rgba(69,69,69,1) 100%);
      background: -ms-linear-gradient(top, rgba(28,28,28,1) 0%, rgba(69,69,69,1) 57%, rgba(69,69,69,1) 100%);
      background: linear-gradient(to bottom, rgba(28,28,28,1) 0%, rgba(69,69,69,1) 57%, rgba(69,69,69,1) 100%);
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1c1c1c', endColorstr='#454545', GradientType=0 );*/
}

.cbtable .flag,
.cbpairing .flag {
    height: 1.2em;
    width: 1.2em;
    padding-left: 2px;
    padding-right: 2px;
    display: block;
    margin: 0 auto;
}

.cbtable .flagImg,
.cbpairing .flagImg {
    height: 100% !important;
    width: auto;
}

/*.cbtable .picture
{
   height: 1.2em;
   width: 1.2em;
   padding-left: 2px;
   padding-right: 2px;
   /*display:block;
}*/

.cbtable .playerPic,
.cbpairing .playerPic {
    height: 100%;
    width: auto;
}

.cbtable .picture,
.cbpairing .picture {
    height: 1.2em;
    width: 1.2em;
    padding-left: 2px;
    padding-right: 2px;
}

.cbtable .playerImageContainer,
.cbpairing .playerImageContainer {
    display: inline-block;
    position: relative;
    z-index: 0;
    height: 100%;
    /*box-shadow: 1px 1px 5px hsla(0, 0%, 0%, 0.15);*/
}

.cbtable {
    /*position: relative;*/
}

.cbtable .koContainer .playerImageContainer {
    /*position: static;*/
}


.cbtable .playerImageContainer span,
.cbpairing .playerImageContainer span {
    position: absolute;
    display: none;
    left: calc(100%);
}

.cbtable .playerImageContainer img,
.cbpairing .playerImageContainer img {
}

.cbtable .playerImageContainer:hover,
.cbpairing .playerImageContainer:hover {
    z-index: 50;
    cursor: pointer;
}

.cbtable .playerImageContainer:hover span,
.cbpairing .playerImageContainer:hover span {
    top: 0px;
    left: calc(100%);
    display: inline-block;
}

.player-info-container {
    width: 450px;
    background-color: hsla(192, 3%, 95%, 0.98);
    border-radius: 25px;
    font-weight: 800;
}

.player-info-box {
    width: 100%;
    padding-top: 4px;
    display: flex;
    align-items: center;
    padding-bottom: 8px;
    background-color: hsla(53, 0%, 80%, 0.61);
    border-top-left-radius: inherit;
    border-top-right-radius: inherit;
}

.player-info-box .player-info-picture {
    display: inline-block;
    width: 100px;
    height: auto;
}

.player-info-box .player-info-picture img {
    width: 45px;
    height: auto;
    display: block;
    margin: 0 auto;
    box-shadow: 5px 5px 6px hsla(0, 0%, 0%, .35);
}

.player-info-box .player-info-personal {
    display: inline-block;
    width: 340px;
}

.player-info-nation, .player-info-nation img.flagImg {
    width: 40px;
    height: auto;
}

.inline-block {
    display: inline-block;
}

.player-info-namerow {
    display: flex;
    align-items: center;
}

.player-info-title {
    margin-left: 15px;
}

.player-info-name {
    margin-left: 15px;
}

.player-info-elo {
    margin-left: 12px;
}

hr.player-opponent-box-seperator {
    margin-top: 0 !important;
    margin-bottom: 8px !important;
    border: 1px solid black;
}

.player-opponent-box {
    font-size: 0.9em;
}

.opponent-line {
    display: flex;
    align-items: center;
    width: 90%;
    margin-left: 20px;
    /*height:40px;*/
}

.opponent-line > div {
    display: inline-block;
}

.opponent-line-img {
    width: 30px;
    margin-left: 9px;
}

.opponent-line-img img {
    width: 25px;
    box-shadow: 4px 1px 9px hsla(20, 10%, 10%, .75);
}

.opponent-line-flag {
    height: 20px;
    margin-left: 8px;
}

.opponent-line-round {
    width: 20px;
    text-align: right;
    font-size: 1.2em;
}

.opponent-line-title {
    width: 42px;
    margin-left: 12px;
}

.opponent-line-name {
    width: 180px;
}

.opponent-line-elo {
    width: 45px;
}


.opponent-line-color {
    width: 13px;
    height: 13px;
    border-radius: 15px;
    border: 1px solid black;
}

.opponent-line-result {
    width: 12px;
    margin-left: 8px;
}

.opponent-line-seperator {
    margin: 0;
    width: 90%;
    margin: auto;
    border-style: inset
}

.opponent-average-box-seperator {
    margin-bottom: 0;
}

.player-avg-line-avgelo {
    margin-left: 325px;
}

.player-avg-line-points {
    margin-left: 10px;
    width: 35px;
    text-align: right;
}

.color-white {
    background-color: white;
}

.color-black {
    background-color: black;
}

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

.playerPicLarge {
    border: 1px solid hsla(0, 0%, 0%, 0.4);
    border-radius: 4px;
    box-shadow: 2px 2px 12px hsla(0, 0%, 0%, 0.4);
    padding-bottom: 0px;
    max-width: unset !important;
}


.cbtable .cbmatch .picture {
    height: 2.2em;
    width: 2.2em;
}

.cbtable .games-1 .crossResult {
    width: 1em;
}

.cbtable .games-2 .crossResult {
    width: 2em;
}

.cbtable .games-3 .crossResult {
    width: 3em;
}

.cbtable .games-4 .crossResult {
    width: 4em;
}

.cbtable .playerDiv .title, .cbtable .playerDiv .flag, .cbtable .playerDiv a,
.cbpairing .playerDiv .title, .cbpairing .playerDiv .flag, .cbpairing .playerDiv a {
    display: inline-block;
    padding: 0 3px;
}

.cbtable .shev-rotate .outerPlayerDiv {
    display: inline-block;
}

.cbtable .shev-rotate .playerDiv {
    white-space: nowrap;
    -webkit-transform-origin: 11px 4px;
    -moz-transform-origin: 11px 4px;
    -o-transform-origin: 11px 4px;
    -ms-transform-origin: 11px 4px;
    transform-origin: 11px 4px;
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
    display: inline-block;
    margin-top: 50%;
    background-color: hsla(0, 10%, 93%, 0.7);
    border-bottom: 1px solid black;
}

.cbtable .shev-rotate {
    max-width: 30px;
}

.cbtable .shev {
    /*margin-top: 46px;*/
}


/*KO TABLE*/

.cbtable .koContainer .koContent {
    width: 1400px;
    display: flex;
    align-items: stretch;
}

.cbtable .koContainer .koRound {
    display: inline-flex;
}

.cbtable .koContainer .koRoundDiv {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
}

.cbtable .koContainer {
    max-height: 95vh;
    overflow: scroll;
    /*border: 1px solid black;*/
    /*display: inline-block;*/
    position: relative;
}


.cbtable .koMatch {
    margin-bottom: 35px;
    margin-right: 20px;
    border-bottom: 1px solid black;
    border-top: 1px solid black;
}

.cbtable .koMatch .playerLine:nth-child(1) {
    border-bottom: 1px solid hsla(217, 54%, 61%, 0.39);
    background-color: hsla(351, 9%, 73%, 0.25);
    /*border-bottom: 1px solid black;*/
}

.cbtable .koMatch .playerLine:nth-child(2) {
    background-color: hsla(351, 9%, 73%, 0.39);
}

.cbtable .koContainer .title, .cbtable .koContainer .name, .cbtable .koContainer .nation, .cbtable .koContainer .picture, .cbtable .koContainer .rating {
    display: inline-block;
}

.cbtable .koContainer .rating {
    margin-right: 3px;
}

.cbtable .koContainer .playerDiv, .cbtable .koContainer .resultsBox {
    display: inline-block;
}

.cbtable .koContainer .innerResultsBox {
    margin-left: 2px;
    width: 13px;
    text-align: center;
}

.cbtable .koContainer .innerResultsBox:last-child {
    width: 30px;
    text-align: right;
    font-weight: bold;
}

.cbtable .koContainer .innerResultsBox.w {
    background-color: white;
}

.cbtable .koContainer .innerResultsBox.b {
    background-color: lightgray;
}

.cbtable .koContainer .roundNrContainer {
    display: inline-block;
    width: 40%;
    text-align: center;
    height: 100%;
    position: relative;
    top: -30%; /*magic die keiner versteht*/
}

.cbtable .koContainer .koHead {
    height: 30px;
    border-bottom: 1px solid black;
    padding: 2px 0 2px 0;
    background-color: hsla(192, 3%, 77%, 0.56);
}


.arrowSideContainer {
    width: 30%;
    display: inline-block;
    height: 100%;
}

.arrowSideContainer img {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}


.arrowContainer {
    height: 100%;
}

.arrowContainer .arrow {
    background-size: contain;
    background-repeat: no-repeat;
    height: 20px !important;
    width: auto;
}

.arrowSideContainer:hover .arrow {
    height: 30px;
}


.arrowLeft {
    background-image: url("http://pgn.chessbase.com/Common/Media/Webimages/Arrow_left.png");
    float: right;
    background-position: right;
}

.arrowRight {
    background-image: url("http://pgn.chessbase.com/Common/Media/Webimages/Arrow_right.png");
    float: left;
    background-position: left;
}

.arrowLeft.inactive {
    content: url("http://pgn.chessbase.com/Common/Media/Webimages/Arrow_left_gray.png");
}

.arrowRight.inactive {
    content: url("http://pgn.chessbase.com/Common/Media/Webimages/Arrow_right_gray.png");
}

.arrowSideContainer:hover img.arrow.inactive {
    height: 20px;
}

.koContainer .title {
    width: 3.1em;
    font-size: 0.64em;
}

.koContainer .name {
    width: 10em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: text-bottom;
}

.koContainer .playerDiv div.picture,
.koContainer .playerDiv div.nation,
.koContainer .playerDiv div.flag {
    vertical-align: bottom;
}

.koContainer .nation {
    width: 30px;
}

.koContainer .playerDiv .name a {
    vertical-align: bottom;
}


.cbpairing .title {
    min-width: 3em;
    text-align: center;
}

.cbpairing .result {
    white-space: nowrap;
    min-width: 32px;
    text-align: center;
}

/**********/
.cblive {
    max-width: 98vw;
}

.tabMenu {
    width: 100%;
    height: 32px;
    border: 1px solid gray;
}

/*.cbreplay td
{
   border: thin solid green;
}

.cbreplay tr
{
   border: thin solid blue;
}*/

.belowNota {
    border: 1px solid hsla(0, 0%, 0%, 0.2);
    border-top: 0px;
    /*position:absolute;*/
    height: 35px;
    width: 100%;
    left: 0;
    background-image: linear-gradient(to right, hsla(31, 20%, 97%, 1.0), hsla(31, 35%, 99%, 1.0) 40%, hsla(31, 35%, 95%, 1.0));
    border-top: 1px solid rgba(120, 110, 75, 0.5);
    box-shadow: 0px 4px 8px -6px rgba(0, 0, 0, 1.0) inset;
    overflow: hidden;
    box-sizing: border-box;
}

.boardHolder {
    top: 0px;
    left: 0px;
    width: calc(100%);
    height: calc(100% - 34px);
    box-sizing: border-box;
    background-image: linear-gradient(to right, hsla(31, 20%, 77%, 1.0), hsla(31, 35%, 85%, 1.0) 40%, hsla(31, 35%, 61%, 1.0));
    /*background-color: blue;*/ /* testing */
}

.boardArea1 {
    width: 100%;
    height: 100%;
    float: left;
}

.boardArea2 {
    margin-left: 66%;
    height: 100%;
    width: 33%;
    /*border: 1px dotted yellow;*/
    background-color: green;
}

.belowBoard {
    /*border:1px solid gray;*/
    /*border-top:0px;*/
    /*position:absolute;*/
    height: 34px;
    width: 100%;
    background-image: linear-gradient(to right, hsla(31, 20%, 77%, 1.0), hsla(31, 35%, 85%, 1.0) 40%, hsla(31, 35%, 61%, 1.0));
    /*border-top: 1px solid rgba( 120, 110, 75, 0.5 );*/
    box-shadow: 0px 4px 8px -6px rgba(0, 0, 0, 1.0) inset;
    box-sizing: border-box;
}

.buttons {
    /*position:absolute;*/
    top: 0px;
    height: 100%;
    box-sizing: border-box;
}

.engineParent {
    box-sizing: border-box;
    border-bottom: 1px solid hsla(0, 0%, 0%, 0.5);
    width: 100%;
    /*height: 58px;*/
}

.engineEl {
    box-shadow: 0px 4px 8px -6px rgba(0, 0, 0, 1.0) inset;
    box-sizing: border-box;
    height: 100%;
    width: 100%;
}

.engineButtons {
    box-shadow: 0px 4px 8px -6px rgba(0, 0, 0, 1.0) inset;
    width: 20px;
    /*background-color:papayawhip;*/
    height: 100%;
    float: right;
    padding-top: 5px;
    border-left: 1px solid hsla(0, 0%, 0%, 0.1);
}

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

.listEl {
    height: 100%;
    padding: 5px;
}

.msgInListParent {
    padding: 10px;
    font-size: 16px;
    font-family: Roboto Condensed, sans-serif;
}

.cbreplay.message, .cbvideo.message, .cblivevideo.message, .cbofflinevideo.message {
    font-family: Roboto, sans-serif;
    text-align: center;
    vertical-align: middle;
    line-height: 18px;
    font-size: 0.60em;
    color: white;
    height: 18px;
    float: none;
    margin: 2px;
}

.toolBtn {
    border: none;
    text-align: center;
    background: none;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain;
    width: 24px;
    height: 24px;
    margin: 5px;
    margin-left: 6px;
    margin-right: 4px;
    z-index: 100;
}

.toolBtnV16 {
    width: 16px;
    height: 16px;
    margin: 2px;
    margin-top: 1px;
    margin-bottom: 1px;
}

.toolBtn16 {
    width: 16px;
    height: 16px;
    margin: 3px;
    margin-left: 3px;
    margin-right: 2px;
}

.toolBtn24 {
    width: 24px;
    height: 24px;
    margin: 3px;
    margin-left: 3px;
    margin-right: 2px;
}

.toolBtn32 {
    width: 32px;
    height: 32px;
    margin: 7px;
    margin-left: 6px;
    margin-right: 4px;
}

.toolBtn48 {
    width: 48px;
    height: 48px;
    margin: 7px;
    margin-left: 7px;
    margin-right: 5px;
}

.toolBtn:hover {
    opacity: 0.75;
    filter: brightness(1.3);
    border: 1px solid hsla(0, 0%, 0%, 0.01);
}

.toolBtn:active {
    filter: brightness(1.1);
    opacity: 0.7;
    /*border: 1px solid hsla( 0, 0%, 0%, 0.01 );*/
}

.toolBtn:focus {
    outline: none;
}

.toolBtnSep {
    width: 16px;
    height: 16px;
    display: inline-block;
}

.cbdiagram .toolBtn, .cbdiagram .toolBtn32, .cbdiagram .toolBtn24, .cbdiagram .toolBtn48, .cbdiagram .toolBtn16 {
    margin-top: 0 !important;
}

.btnSound {
    float: right;
}

.btnPieces {
    float: right;
}

.btnNewGame {
    background-image: url("/Common/Media/Ribbons/Reader/NewGame24.png");
}

.btnSave {
    background-image: url("/Common/Media/Ribbons/Reader/Save24.png");
}

.btnDownload {
    background-image: url("/Common/Media/Ribbons/Reader/Download24.png");
}

.btn3D {
    background-image: url("/Common/Media/Ribbons/Reader/Board3D24.png");
}

.btnExec {
    background-image: url("/Common/Media/Ribbons/Reader/Exec24.png");
}

.btnRetract {
    background-image: url("/Common/Media/Ribbons/Reader/Retract24.png");
}

.btnAnalysis {
    background-image: url("/Common/Media/Ribbons/Reader/Engine24.png");
}


/*.btnPromoteLine
{
   background-image: url( "/Common/Media/Ribbons/Reader/PromoteLine24.png" );
}

.btnCutLine
{
   background-image: url( "/Common/Media/Ribbons/Reader/CutLine24.png" );
}

.btnDeleteLine
{
   background-image: url( "/Common/Media/Ribbons/Reader/DeleteLine24.png" );
}*/

.btnFullScreen {
    background-image: url("/Common/Media/Ribbons/Reader/FullScreen24.png");
    left: calc(100% - 34px);
    position: absolute;
}

.btnMyGames {
    background-image: url("/Common/Media/Ribbons/Reader/MyGames24.png");
}

.btnFritz {
    background-image: url("/Common/Media/Ribbons/Reader/FritzOnline24.png");
}

.jsgrid-row, .jsgrid-alt-row {
    height: 20px;
    font-size: 14px;
    font-family: Roboto Condensed;
    padding: 1px;
}

@media screen and ( min-width: 800px ) {
    .jsgrid-row, .jsgrid-alt-row {
        font-family: Roboto;
    }
}

@media ( pointer: coarse ) and ( min-width: 800px ) {
    .jsgrid-row, .jsgrid-alt-row {
        height: 1.3em;
        font-size: 1.2em;
    }
}

.jsgrid-alt-row td {
    background-image: linear-gradient(to bottom, hsla(120, 10%, 96%, 0.15) 30%, hsla(120, 10%, 86%, 0.15));
}

.jsgrid-header-row > th {
    padding: 0.2em;
    padding-left: 0.4em;
    text-align: left !important;
    font-family: Roboto Condensed;
    font-size: 80%;
    font-weight: 300;
    border-bottom: 1px solid hsla(0, 0%, 0%, 0.3);
}

@media ( pointer: coarse) {
    .jsgrid-header-row > th {
        height: 2.0em;
        font-size: 1.1em;
    }
}

@media screen and ( min-width: 800px ) {
    .jsgrid-header-row > th {
        font-family: Roboto;
    }
}

.jsgrid-grid-body {
    /*background-color: hsla( 120, 00%, 80%, 0.15)!important;*/
    background-color: white !important;
}

.jsgrid-table {
    padding: 0;
    margin: 0 !important; /*Chessbase India*/
    background-color: hsla(120, 00%, 80%, 0.15) !important;
}

.jsgrid-table td {
    padding-top: 0.20em; /*!important*/
    padding-bottom: 0.23em; /*!important*/
    padding-left: 0.3em !important;
    overflow: hidden;
    white-space: nowrap;
}

/*.jsgrid-table td:nth-child(2), td:nth-child(4)
{
   font-size:95%;
   padding-right:0.5em!important;
}*/

.jsg-player {
    /*font-size: 103% !important;*/
    font-weight: 600 !important;
    font-size: 14px;
}

@media ( pointer: coarse) {
    .jsg-player {
        /*font-weight: 500;*/
    }
}


.jsg-elo {
    text-align: center;
    /*font-size: 95%;*/
    font-size: 13px;
    /*padding-right:0.5em!important;*/
}

.jsg-eco {
    text-align: center;
    font-weight: 500;
    font-size: 95%;
    /*padding-right:0.5em!important;*/
}

.jsg-result {
    text-align: center;
    /*font-size: 95%;*/
    font-size: 13px;
    /*padding-right:0.5em!important;*/
}

.jsg-event {
    font-family: Roboto Condensed, Arial Narrow, sans-serif;
    /*font-size: 90%;*/
    font-size: 12px;
}


.jsg-round {
    font-family: Roboto Condensed, Arial Narrow, sans-serif;
    font-size: 12px;
}

.jsg-len {
    font-size: 12px;
}

.jsg-name {
    font-family: Roboto Condensed, Arial Narrow, sans-serif;
    font-size: 90%;
}

.jsg-created {
    font-family: Roboto Condensed, Arial Narrow, sans-serif;
    font-size: 90%;
}

.jsg-duration {
    font-family: Roboto Condensed, Arial Narrow, sans-serif;
    font-size: 90%;
}

.jsg-icon {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}

.jsg-icon img {
    /*width:16px;*/
    height: 16px;
    padding: 0 !important;
    margin: 0 !important;
    border: 0;
}

.jsg-liveMove {
    padding-left: 3px;
    font-size: 13px;
    font-weight: 600;
}

.jsg-liveResult, .jsg-liveNGames, .jsg-liveElo {
    padding-left: 3px;
    font-size: 13px;
    font-weight: 500;
}

.jsg-liveNGames {
}

.jsg-liveVisits {
    font-family: Roboto Condensed;
    font-size: 80%;
    color: hsl(0, 0%, 30%);
}

.jsg-liveResult {
}

.jsg-liveElo {
}

.jsg-livePlayers {
    font-family: Roboto Condensed;
    font-size: 80%;
}


@media screen and (min-width: 500) {
    .jsg-liveMove, .jsg-liveResult, .jsg-liveNGames, .jsg-liveElo {
        padding-left: 4px;
        font-size: 14px;
    }
}

.jsg-premiumRequired {
    color: #900;
}

.jsg-premiumRequired:hover {
    color: #e00;
}

/************************************************************************************************************/

.jqx-ribbon-item {
    font-family: Roboto;
}

.jqx-ribbon-header {
    background-image: linear-gradient(to bottom, hsla(30, 40%, 96%, 0.4) 30%, hsla(30, 40%, 75%, 0.4));
}

/*.jqx-ribbon-header-horizontal
 {
    min-height:40px;
 }*/

/************************************************************************************************************/

/*
   cbdia kann weg, ist in Notation.css
*/

/*.cbdia
{
   margin-left: 30px;
   margin-top: 3px;
   margin-bottom: 3px;
   display: block;
}*/


.buttons a, .notaButtons a {
    padding: 0;
    margin: 2px;
    margin-left: 7px;
    margin-right: 3px;
    text-decoration: none;
    color: hsla(10, 50%, 30%, 1.0);
    font-size: 0.8em;
    font-family: Helvetica Neue, Roboto, sans-serif;
}

.buttons a:hover {
    color: hsla(10, 60%, 50%, 1.0);
}

.pgnLink {
    margin: 0px 26px 0 10px;
    padding: 0;
    vertical-align: middle;
    line-height: 34px;
    width: 24px;
    height: 34px;
    background-repeat: no-repeat !important;
    background-position: center !important;
    vertical-align: top;
    font-size: 108%;
    text-decoration: underline !important;
}

.cbreplayInfo {
    color: black;
    background-color: hsl(40, 19%, 90%);
    padding-top: 10px;
    padding-left: 10px;
    height: 100%;
    overflow: auto;
    box-sizing: border-box;
    line-height: 1.1em;
    font-size: 14px !important;
    font-family: Helvetica Neue, Roboto Condensed, sans-serif;
}

.cbreplayInfo ul {
    margin-block-start: 0;
    padding-inline-start: 14px;
}

.cbreplayInfo ul li {
    padding-bottom: 5px;
}

.cbreplayInfo a {
    color: #b70d20;
    text-decoration: underline;
}

@media screen and ( min-width: 1200px ) {
    .cbreplayInfo {
        background-image: url('https://pgn.chessbase.com//common/Media/Chess/notapaper.jpg') !important;
    }

    .cbreplayInfo ul {
        margin-top: 10px !important;
        font-size: 95%;
        list-style-type: disc !important;
    }

    .toolBarSep {
        margin-left: 2.5%;
    }
}

.browserWarning {
    text-transform: uppercase;
    color: darkred;
    font-size: 110%;
}

.cbVersion {
    font-size: 8px;
    width: 30px;
    margin-top: 10px;
    left: calc(100% - 26px);
    position: absolute;
}

.cbDebugInfo {
    float: right;
    /*margin-top:10px;*/
    font-size: 8px;
    color: gray;
}

.cbTinyLog {
    margin: 0;
    padding: 0;
    font-size: 10px;
    line-height: 11px;
    color: gray;
}

.cbEngineWarnBrowser {
    font-size: 14px;
    font-style: italic;
    text-align: center;
    padding: 6px;
    padding-top: 10px;
}

.cbHelloUser {
    padding-left: 0.3em;
    font-weight: 600;
    font-family: 'Roboto';
    letter-spacing: 0.06em;
    text-transform: capitalize;
}

.cbImgFullScreen, .cbImgEngine, .cbImgDownload {
    display: inline-block;
    position: relative;
    top: 0.4em;
    margin-left: 0.5em;
    margin-top: 0.0em;
    margin-bottom: 0.2em;
    border: 0;
    width: 16px;
    height: 16px;
    background-repeat: no-repeat;
}

.cbImgFullScreen {
    background-image: url('https://pgn.chessbase.com/common/media/ribbons/reader/fullscreen16.png');
}

.cbImgEngine {
    background-image: url('https://pgn.chessbase.com/common/media/ribbons/reader/engine16.png');
}

.cbImgDownload {
    background-image: url('https://pgn.chessbase.com/common/media/ribbons/reader/download16.png');
}

.cbMaximizeHint {
    /*   color: darkgreen;*/
    /*font-weight: bold;*/
    font-weight: normal;
    /*margin-bottom: 0.3em;*/
}

.cbEngineHint, .cbDownloadHint {
    /*color: darkgreen;*/
    font-weight: normal;
    margin-bottom: 0.2em;
}


/* TODO TM: Implement this class if needed */
.cbGuessingContainer {
}

/*****************************************************************************
   Chat Window:
*/

.cbChatContainer {
}

.cbChatOut {
    overflow: auto;
    width: 100%;
    height: calc(100% - 54px) !important;
}

.cbChatInp {
    width: calc(100% - 16px);
    font-family: Roboto, sans-serif;
    margin: 2px;
    border-radius: 3px;
    border: 1px solid hsla(120, 40%, 40%, 0.4);
    background-image: linear-gradient(to bottom, hsla(0, 0%, 70%, 0.2), hsla(0, 0%, 99, 0.2));
    max-width: 1000px;
}

/*****************************************************************************
   Chat Style
*/

.cbChatTitle {
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: antiquewhite;
    background-image: linear-gradient(to bottom, hsl(31, 25%, 70%) 20%, hsl(31, 25%, 54%));
    padding: 6px 3px;
    font-family: Roboto;
    text-align: center;
}

.cbChatLine {
    padding: 1px 3px 2px 4px;
    font-size: 0.85em;
    color: black;
    font-family: Roboto;
    box-shadow: 0px 3px 7px -5px hsla(0, 0%, 0%, 0.3) inset;
}

.cbChatLine a {
    color: #a00;
    text-decoration: underline;
}

.cbChatOrigin {
    padding: 0px 3px 3px 4px;
    /*background-image: linear-gradient(to bottom, hsl( 0, 10%, 97% ) 20%, hsl( 0, 10%, 94% ));*/
    background-color: hsl(100, 30%, 90%);
    border-top: 1px solid hsla(0, 10%, 1%, 0.25);
    /*border-radius:5px;*/
    color: black;
}

.cbAutoChat {
    /*font-family:Roboto;*/
    background-color: hsl(200, 30%, 90%);
    font-weight: 400;
}

.cbSender {
    font-size: 0.85em;
    font-family: Roboto;
    margin-right: 6px;
}

.cbChatLoginOk {
    font-size: 1.0em;
    padding: 4px;
    margin-bottom: 10px;
}

.cbChatUserName {
    font-weight: 600;
    color: hsla(100, 50%, 20%, 0.9);
    text-transform: capitalize;
}

.cbBigUserName {
    font-size: 1.0em;
}

/*.cbSender::after
{
   content:":";
}*/

.cbSessionName {
    font-size: 0.8em;
    color: black;
    font-family: Roboto Condensed;
}

.cbChatGameLink {
    font-size: 0.8em;
    color: #900;
    text-decoration: underline;
    font-family: Roboto Condensed;
}

.cbChatGameLink:hover {
    cursor: pointer;
    color: #e00;
}

/*.cbSender::before
{
   content: "(";
}

.cbSender::after
{
   content: ")";
}*/

.cbChatSeparator {
    margin-bottom: 4px;
    /*border-bottom: 1px solid hsla( 0, 0%, 0%, 0.12 );*/
}

.cbMyChat {
    color: hsla(100, 50%, 20%, 0.9);
    padding-left: 4px;
    font-size: 1.10em;
}

.cbEngOut {
    margin-left: 20px;
    margin-top: 2px;
    padding: 2px;
    height: 20px;
    width: 70px;
    font-size: 0.8em;
    font-family: Roboto Condensed;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}

.LogBold {
    font-weight: bold;
    font-size: 0.8em;
}

.LogRed {
    color: red;
}

.LogGreen {
    color: darkgreen;
}

.LogBlue {
    color: darkslateblue;
}

.LogError {
    color: red;
    font-weight: bold;
}

.LogException {
    color: red;
    font-weight: bold;
}

.LogBlue {
    color: blue;
}

.LogBlue {
    color: green;
}

.LogBoard {
    color: darkgreen;
    font-size: 0.9em;
}


/*****************************************************************************
   Live Book
*/

.cbBookContainer {
    /*background-color:green;*/
}

#n-btnFen-0 {
    visibility: hidden;
    display: none;
}


.shake {
    animation: shake 3s cubic-bezier(.36, .07, .19, .97) both;
    transform: translate3d(0, 0, 0);
    backface-visibility: hidden;
    perspective: 1000px;
}

@keyframes shake {
    5%, 95% {
        transform: translate3d(-1px, 0, 0);
    }

    10%, 90% {
        transform: translate3d(2px, 0, 0);
    }

    15%, 25%, 35%, 45%, 55%, 65%, 75%, 85% {
        transform: translate3d(-3px, 0, 0);
    }

    20%, 30%, 40%, 50%, 60%, 70%, 80% {
        transform: translate3d(3px, 0, 0);
    }
}

.shiftLeft {
    animation: shiftLeft 0.3s;
}

.shiftRight {
    animation: shiftRight 0.3s;
}


@keyframes shiftLeft {
    0% {
        transform: translateX(0%);
    }

    50% {
        transform: translateX(-60%);
        opacity: 0.3;
    }

    59.55% {
        transform: translateX(49%);
    }

    60% {
        transform: translateX(50%) scale(0.6);
    }

    100% {
        transform: translateX(0);
        opacity: 1.0;
    }
}

@keyframes shiftRight {
    0% {
        transform: translateX(0%);
    }

    50% {
        transform: translateX(60%);
        opacity: 0.3;
    }

    59.99% {
        transform: translateX(-49%);
    }

    60% {
        transform: translateX(-50%) scale(0.6);
    }

    100% {
        transform: translateX(0);
        opacity: 1.0;
    }
}

.rotateLeft {
    animation: rotationLeft 0.25s ease-out;
}

.rotateRight {
    animation: rotationRight 0.25s ease-out;
}

@keyframes rotationLeft {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(-359deg) scale(0.8);
    }
}

@keyframes rotationRight {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(359deg) scale(0.8);
    }
}

.flip {
    animation: flip 0.4s ease-in-out;
}

@keyframes flip {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(180deg);
    }
}

.zoomIn {
    animation: zoomIn 0.3s linear;
}

.zoomOut {
    animation: zoomOut 0.3s linear;
}

@keyframes zoomIn {
    from {
        transform: scale(1.0);
    }

    to {
        transform: scale(1.5);
    }
}

@keyframes zoomOut {
    from {
        transform: scale(1.0);
    }

    to {
        transform: scale(0.6);
    }
}

.cbifritz {
    position: relative;
    background-image: unset !important;
    display: block;
}


.animationModule {
    display: flex;
    flex-direction: row;
    justify-content: center;
    flex-wrap: wrap;
}

.animationModule .annoArea {
    padding: 8px;
    border: 1px solid black;
    background-color: white;
    color: black;
    min-width: 120px;
    flex-grow: 1;
}

.animationModule .board {
    width: 100%;
}

.animationModule .board .boardArea {
}

.animationModule .buttonArea {
    display: flex;
    justify-content: center;
}

.simplediaModule {
    height: 100%;
}

.simplediaModule .boardArea {
    height: 100%;
    width: 100%;
    margin: 0 auto;
}

.marker {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 50px;
    height: 50px;
    background-size: contain;
}

.marker.solved {
    background-image: url("/Common/Media/Ribbons/Reader/Check48.png");
}

.marker.unsolved {
    background-image: url("/Common/Media/Ribbons/Reader/Delete24.png");
}

.exercise {
    width: 100%;
    height: 100%;
}

.exercise .buttonArea {
    height: 34px;
    display: flex;
    flex-direction: row;
    justify-content: center;
}

.exercise .root {
    height: 100%;
}

.exercise .horiArea {
    height: calc(100% - 34px);
}

.exercise .vertArea {
    height: 100%;
}


.choiceModule {
    /*display: flex;*/
    height: 100%;
}

/*

	.choiceModule .board {
		width: 68%;
	}

	.choiceModule .question {
		width: 28%;
	}
*/

.question {
    padding: 7px 20px;
    border: 2px solid hsla(200, 40%, 50%, 1);
    border-radius: 8px;
    box-shadow: 1px 1px 6px hsl(0deg 0% 0% / 12%);
}

.answer {
    font-weight: bold;
    margin-bottom: 5px;
}

.answer:hover {
    background-color: floralwhite;
    cursor: pointer;
}

.answer.correct {
    color: green;
}

.answer.wrong {
    color: red;
}

#idTabGuessMoves {
    padding: 10px;
}

.GuessMoveTitle {
    font-weight: bold;
    font-size: 18px;
}

.GuessMoveDiv {
    width: 100%;
    overflow-y: scroll;
    height: calc(100% - 296px);
}

.GuessMoveButtons {
    margin-top: 10px;
}

.taOutput {
    width: 96%;
    height: 150px;
    overflow: auto;
}

.colMove {
    cursor: pointer;
    width: 33%;
    height: 20px;
    font-weight: 500;
}

.TopVotersDiv {
    width: 100%;
}

.voteTable, .rankTable {
    width: 100%;
    border-collapse: collapse;
    font-family: Roboto;
}

.voteTable tr td, .rankTable tr td {
    border: 1px solid #f3f3f3;
    padding: 3px 5px;
}

.voteTable tr:nth-child(even), .rankTable tr:nth-child(even) {
    background: #fcfcfc;
}

.voteTable tr:first-of-type td {
    font-weight: 600;
    background-color: #eee;
    padding: 6px;
}

.colVotes, .colQuote {
    width: 33%;
    height: 20px;
}

.colMyVote, .colMyBet {
    width: 33%;
    height: 20px;
}

.colButtonVoteOnMove {
}

.colButtonBetSelectedMove {
}

.colButtonRefresh {
}

.selectedMove {
    background-color: brown;
    color: white;
}

.colVoteOutput {
}

.buttonsTable, .topVotersTable {
    width: 96%;
}

.tblOutput {
    width: 100%;
}

.maxBoardWidth {
    max-width: 350px;
}


/*******************************/

.engOutHoriActivity, .engOutHoriComplexity {
    margin-top: 6px;
}

/************************/

.liveTourns {
    height: 100%;
    overflow-y: scroll;
}

.mobNotaEng, .swpEngBook, .swpNotaEng, .swpVideoNota {
    height: 100%;
    width: 100%;
    display: flex;
    flex-direction: column;
}

.mobNotaEngNota {
    width: 100%;
    height: 80%;
}

.mobNotaEngEng {
    width: 100%;
    height: 20%;
    border: 2px solid gray;
}

.cbLoadLiveListWait {
    margin: 20px;
    font-size: 18px;
    font-family: Roboto;
}

.swpParent {
    height: 100%;
    width: 100%;
}

.swpEngBookEng {
    width: 100%;
    height: 50%;
}

.swpEngBookBook {
    width: 100%;
    height: 50%;
    border-bottom: 1px inset saddlebrown;
}

.swpEngOnlyBook {
    width: 100%;
    height: 100%;
    border-bottom: 1px inset saddlebrown;
}

.swpNotaEngNest {
    width: 100%;
    height: 100%;
}

.swpNotaEngNota {
    width: 100%;
    height: 82%;
    border-bottom: 2px inset saddlebrown;
}

.swpNotaEngEng {
    border-top: 1px inset saddlebrown;
    width: 100%;
    height: 18%;
    min-height: 80px;
}

.swpVideoNotaVideo {
    width: 100%;
    height: 40%;
}

.swpVideoNotaNota {
    width: 100%;
    height: 60%;
}

.full-story .cbnota .nota-game {
    line-height: unset;
    max-height: 2000px;
    overflow-y: auto;
}

/** cbnota ***/
.cbnota {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 10px;
    max-width: 100vw;
    border: 1px solid hsla(0, 0%, 0%, 0.1);
}

/*.cbreplay .notaparent
{
   height: auto;
}
*/
.cbnota .cbnota-container {
    height: auto;
}

.cbnota .nota-container {
    display: block;
    height: auto;
}

/*.full-story .cbnota .nota-container
{
   font-family: __Merriweather_5, Helvetica Neue, Roboto, sans-serif!important;
}

.full-story .cbnota span.cbcomment
{
   font-family: __Merriweather_5, 'Roboto Condensed', 'Arial Narrow'!important;
}*/

.cbnota .cbgame-header {
    background-image: none !important;
    /*background-color: none!important;*/
    box-shadow: none;
    border: 0;
    padding-top: 4px;
}

.cbnota .nota-game {
    position: unset;
    top: unset;
    left: unset;
    right: unset;
    bottom: unset;
    overflow-y: auto;
    background-image: none !important;
    background-color: transparent !important;
    box-shadow: none !important;
}

.cbnota .notaNest {
    height: auto;
    min-height: 100px;
    /*   border: 4px dotted blue;*/
}

.cbnota .nota-igame {
    position: initial;
}

.cbnota .nota-head-container,
.cbnota .nota-game-container,
.cbnota .nota-foot-container {
    display: block;
}

.cbnota .nota-head-container {
    border-bottom: 1px solid hsla(0, 0%, 0%, 0.1);
}

.cbnota div.nota-head {
    background-color: hsla(0, 0%, 0%, 0.0);
}

div.cbgame-header-compact {
    box-shadow: none !important;
}

.cbnota .nota-ogame,
.cbnota .nota-foot {
    display: block;
    background-image: none !important;
}


.cbnota span.cbmove:hover {
    background-color: hsla(50, 80%, 70%, 0.8);
    text-decoration: underline;
    cursor: zoom-in;
    /*   border: 4px solid hsla( 50, 80%, 70%, 0.8);*/
}

.cbFloatEng {
    border: 1px solid gray;
}

.diaEng, .diaNota {
    border: 1px solid hsla(0, 0%, 0%, 0.2);
    margin-top: 8px;
    margin-left: auto;
    margin-right: auto;
}

.diaEng .engineParent {
    border-bottom: 0;
}

.symbolMenu {
    font-family: CBArialLink;
    /*  font-weight: bold;*/
    font-size: 14px;
}

.symbolMenu li:first-child, .symbolMenu li:last-child, .symbolMenu li:nth-last-child(2) {
    font-family: Roboto;
}

#annoEdit {
    max-width: 600px;
}


.listHolder {
    height: 100%;
    width: 100%;
    margin: 0;
    padding: 0;
}

.listTools {
    box-sizing: border-box;
    box-shadow: 0px 4px 8px -6px rgba(0, 0, 0, 1.0) inset;
    background-image: linear-gradient(to right, hsla(31, 20%, 77%, 1.0), hsla(31, 35%, 85%, 1.0) 40%, hsla(31, 35%, 61%, 1.0));
    margin: 0;
    padding: 0;
    padding-left: 3px;
    padding-top: 5px;
    display: flex;
}

.listToolsBtn {
    z-index: 100;
    font-family: Roboto, sans-serif;
}

.listToolsCheck {
    z-index: 100;
    font-family: Roboto, sans-serif;
    margin-left: auto;
}

.listToolsClear {
    margin-left: auto;
    right: auto;
}

.jsg-selectedRow {
}

.jsg-selectedRow td {
    background-color: hsla(120, 70%, 60%, 0.4) !important;
}

.jsg-invisible-id {
    display: none;
}

.saveMenu {
    z-index: 350;
    position: relative;
}

.westLayer {
    height: 100% !important;
}

@media screen and (min-width: 700px) {
    .swiper-pagination-bullets /*hack to avoid conflict with e.g. splitters*/
    {
        width: 50% !important;
        min-width: 80px;
        margin-left: 25%;
    }
}


