:root {
    --color-pale: rgba(0, 0, 0, .25);
    --color-bright: rgba(0, 0, 0, 1);
    --color-pale-dark: rgba(255, 255, 255, .25);
    --color-bright-dark: rgba(255, 255, 255, 1);
    --color-green: rgba(70, 250, 115, 0.4);
    --color-red: rgba(255, 120, 120, 0.4);
    --color-green-max: rgba(70, 250, 115, 0.6);
    --color-red-max: rgba(255, 120, 120, 0.6);
    --color-green-min: rgba(70, 250, 115, 0.2);
    --color-red-min: rgba(255, 120, 120, 0.2);
    --color-green-mins: rgba(70, 250, 115, 0.05);
    --color-red-mins: rgba(255, 120, 120, 0.05);
    --color-fr: rgba(231, 164, 76, 0.5);
    --color-f: rgba(231, 76, 76, 0.5);
    --color-b: rgba(76, 142, 187, 0.75);
    --color-r: rgba(164, 154, 135, 0.25);
    --color-pale-opt: rgba(0, 0, 0, 0.05);
    --color-bright-opt: rgba(0, 0, 0, 0.05);
    --color-green-opt: rgba(70, 250, 115, 0.05);
    --color-red-opt: rgba(255, 120, 120, 0.05);
    --color-green-max-opt: rgba(70, 250, 115, 0.05);
    --color-red-max-opt: rgba(255, 120, 120, 0.05);
    --color-green-min-opt: rgba(70, 250, 115, 0.05);
    --color-red-min-opt: rgba(255, 120, 120, 0.05);
    --color-fr-opt: rgba(231, 164, 76, 0.05);
    --color-f-opt: rgba(231, 76, 76, 0.05);
    --color-b-opt: rgba(76, 142, 187, 0.05);
    --color-r-opt: rgba(164, 154, 135, 0.05);
}

.npadding th {
    padding: 0;
}

.nowrap {
    white-space: nowrap;
}

.preline {
    white-space: pre-line;
}

.scrollable {
    height: auto;
    max-height: 30em;
    overflow-x: hidden;
}

/*красный*/

.c1 {
    background-color: rgba(231, 76, 76, 0.25);
    color: rgba(0, 0, 0);
}

/*желтый*/

.c2 {
    background-color: rgba(242, 159, 5, 0.25);
    color: rgba(0, 0, 0);
}

/*грин*/

.c3 {
    background-color: rgba(54, 166, 28, 0.25);
    color: rgba(0, 0, 0);
}

/*синька*/

.c4 {
    background-color: rgba(52, 152, 219, 0.25);
    color: rgba(0, 0, 0);
}

/*сирень*/

.c5 {
    background-color: rgba(234, 141, 247, 0.25);
    color: rgba(0, 0, 0);
}

/*красный*/

.table-dark .c1 {
    background-color: rgba(231, 76, 76, 0.25);
    color: rgba(255, 255, 255);
}

/*желтый*/

.table-dark .c2 {
    background-color: rgba(242, 159, 5, 0.25);
    color: rgba(255, 255, 255);
}

/*грин*/

.table-dark .c3 {
    background-color: rgba(54, 166, 28, 0.25);
    color: rgba(255, 255, 255);
}

/*синька*/

.table-dark .c4 {
    background-color: rgba(52, 152, 219, 0.25);
    color: rgba(255, 255, 255);
}

/*сирень*/

.table-dark .c5 {
    background-color: rgba(234, 141, 247, 0.25);
    color: rgba(255, 255, 255);
}

.pointer {
    cursor: pointer;
}

td.pointer {
    cursor: pointer;
    border: 2px dotted white;
}

td.nopointer {
    box-sizing: border-box;
    border: 2px solid white;
}

td.pointer:hover {
    cursor: pointer;
    box-sizing: border-box;
    border: 2px dashed red;
}

.notpointer {
    cursor: none;
}

body {
    background-color: rgba(240, 240, 240, 1);
}

.table th, .table td {
    vertical-align: middle !important;
}

table {
    white-space: nowrap;
}

.gr, .clfa .fa {
    background-color: var(--color-green);
}

.rd, .clfa .af {
    background-color: var(--color-red);
}

.gradient {
    background: linear-gradient(to top left, rgba(0, 0, 0, .075), rgba(0, 0, 0, 0));
}

.table thead th {
    vertical-align: middle;
}

.table .thead-dark th {
    border-color: rgba(240, 240, 240, 1);
}

.table-bordered thead th.bnone, .table-bordered tbody td.bnone {
    /* width: 5px; */
    border: none;
    padding: 2px;
    margin: 0;
}

/* TABLE  */

.clp1p2 td.p1, .clp1p2 td.p2 {
    color: var(--color-bright);
}

.clp1p2 .table-dark td.p1, .clp1p2 .table-dark td.p2 {
    color: var(--color-bright-dark);
}

.clp1 td.p1 {
    color: var(--color-bright);
    font-weight: 600;
}

.clp2 td.p2 {
    color: var(--color-bright);
    font-weight: 600;
}

td.p1, td.p2, td.fr, td.f, td.b, td.r {
    color: var(--color-pale);
}

.clfr td.fr {
    background-color: var(--color-fr);
    color: var(--color_bright);
}

.clf td.f {
    background-color: var(--color-f);
    color: var(--color_bright);
}

.clb td.b {
    background-color: var(--color-b);
    color: var(--color_bright);
}

.clr td.r {
    background-color: var(--color-r);
    color: var(--color_bright);
}

.cloum td.om, .clou td.om {
    background-color: var(--color-green-max);
}

.cloum td.um, .clou td.um {
    background-color: var(--color-red-max);
}

.clou td.o {
    background-color: var(--color-green);
}

.clou td.u {
    background-color: var(--color-red);
}

.grm {
    background-color: var(--color-green-mins);
}

.rdm {
    background-color: var(--color-red-min);
}

.clou td.mo, .cloum td.mo {
    background-color: var(--color-green-min);
    font-size: 0.8em;
    line-height: 1em;
}

.clou td.mu, .cloum td.mu {
    background-color: var(--color-red-min);
    font-size: 0.8em;
    line-height: 1em;
}

/* SPAN */

div.p1, div.p2, div.f, div.b, div.r {
    color: var(--color-pale-opt);
}

.clp1p2 div.p1, .clp1p2 div.p2 {
    color: var(--color-bright);
}

.clp1 div.p1 {
    color: var(--color-bright);
    font-weight: 600;
}

.clp2 div.p2 {
    color: var(--color-bright);
    font-weight: 600;
}

.clf div.f {
    background-color: var(--color-f-opt);
    border-color: var(--color-f);
    color: var(--color_bright);
}

.clb div.b {
    background-color: var(--color-b-opt);
    border-color: var(--color-b);
    color: var(--color_bright);
}

.clr div.r {
    background-color: var(--color-r-opt);
    border-color: var(--color-r);
    color: var(--color_bright);
}

.cloum div.om, .clou div.om {
    background-color: var(--color-green-max-opt);
    border-color: var(--color-green-max);
}

.cloum div.um, .clou div.um {
    background-color: var(--color-red-max-opt);
    border-color: var(--color-red-max);
}

.clou div.o {
    background-color: var(--color-green-opt);
    border-color: var(--color-green);
}

.clou div.u {
    background-color: var(--color-red-opt);
    border-color: var(--color-red);
}

.clou div.mo, .cloum div.mo {
    background-color: var(--color-green-min-opt);
    border-color: var(--color-green-min);
    font-size: 0.8em;
    line-height: 1em;
}

.clou div.mu, .cloum div.mu {
    background-color: var(--color-red-min-opt);
    border-color: var(--color-red-min);
    font-size: 0.8em;
    line-height: 1em;
}

.mt {
    font-size: 0.8em;
    line-height: 1em;
}

.small {
    font-size: 0.6em;
}

.tdsm {
    line-height: 0.9em !important;
}

.lds-hourglass {
    display: inline-block;
    position: relative;
    width: 80px;
    height: 80px;
}

.lds-hourglass:after {
    content: " ";
    display: block;
    border-radius: 50%;
    width: 0;
    height: 0;
    margin: 8px;
    box-sizing: border-box;
    border: 32px solid #fff;
    border-color: #fff transparent #fff transparent;
    animation: lds-hourglass 1.2s infinite;
}

@keyframes lds-hourglass {
    0% {
        transform: rotate(0);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }

    50% {
        transform: rotate(900deg);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }

    100% {
        transform: rotate(1800deg);
    }
}

.table-dark .sy {
    color: var(--color-bright-dark);
}

.table-dark .sn {
    color: var(--color-bright-dark);
}

.nscore .sn {
    font-size: 1em;
}

.nscore .sy {
    font-size: .55em;
    /* color: rgba(67, 68, 67, 0.5); */
}

.score .sn {
    font-size: .55em;
    /* color: rgba(67, 68, 67, 0.5); */
}

.score .sy {
    font-size: 1em;
}

.fontSize11 {
    font-size: 1.1em;
}

.fontSize12 {
    font-size: 1.2em;
}

.fontSize15 {
    font-size: 1.5em;
}

.image100 {
    max-width: 100px;
    height: auto;
}

.image50 {
    max-width: 50px;
    height: auto;
}

.image25 {
    max-width: 25px;
    height: auto;
}

.divE {
    border: 0.2em solid rgb(90, 90, 90) !important;
}

.divEv {
    box-sizing: border-box;
    float: left !important;
    width: 2em !important;
    height: 100% !important;
    /* border-top: .1em solid; */
    /* border-bottom: .2em solid; */
    font-size: 1em;
    padding-top: 0.5em;
    padding-bottom: 0.5em;
    /* margin: 0.1em; */
}

.table td.wdR3 {
    text-align: center;
    min-width: 6.1em;
}

.table td.wdR2 {
    text-align: center;
    min-width: 4.1em;
}

.table td.wdR1 {
    text-align: center;
    min-width: 2.1em;
}

.text-max {
    font-size: .95em;
}

.text-min {
    font-size: .75em;
}