html:NOT(.winFrame) #page{ margin: unset !important; margin-bottom: 0 !important; }
.container{ width: unset !important; }
.tabSys > section{ min-width: 975px; }
#bankPreview{ padding: 20px; margin: 20px; margin-top: 100px; border: 1px solid #ccc; border-radius: 10px; text-align: center; }
html:NOT(.dark) #bankPreview{ background: #fff; }

/* --- dark mode --- */
html.dark .dataTable tr:NOT(:hover),
html.dark .dataTable th:NOT(:hover){ background: #181818; color: #fff; }
html.dark .dataTable thead th,
html.dark .dataTable tfoot th{ background: #3c3c3c !important; }
html.dark .dataTable thead th:hover{ color: #fff; }
html.dark .fg-toolbar{ background: #000 !important; color: #fff; }
html.dark tbody tr:hover > td:NOT(:hover),
html.dark tbody tr:hover > td a{ color: #000 !important; }
html.dark tbody tr:hover > td a:hover{ color: #a8cf20 !important; }
html.dark tbody tr:hover > td:NOT(.newTrans):hover{ color: #000 !important; }
html.dark .ressRow.head > span:NOT(:first-child){ background: #3c3c3c; color: #fff; }


/* ----------------------------------------------------- */
/* -------------------- tab-system --------------------- */
#bankTabs{ min-height: 800px; }
.tabSys > label{ text-decoration: none; color: #bbb; -webkit-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; }
.tabSys i{ margin-right: 10px; }
.tabSys > label { font-size: 18px; }
.tabSys > label:hover{ color: #888;  }
.tabSys > label:hover i{ color: var(--link-color-hover); }
input.tabSys:checked + label{ color: #000; }
input.tabSys:checked + label i{ color: var(--link-color-hover); }
section.tabSys{ padding: 0; }
section.tabSys > div:NOT(.dataTables_wrapper){ padding: 10px 20px; }

#tabb:checked ~ #bankb,
#tabs:checked ~ #banks,
#tabf:checked ~ #bankf{
  display: block;
}
@media (max-width: 840px){
  label.tabSys a{
    display: none;
  }
  label.tabSys:before {
    margin: 0;
    font-size: 18px;
  }
}
@media (max-width: 400px){
  label.tabSys {
    padding: 15px;
  }
}


/* -------------------------------------------------- */
/* -------------------- globals --------------------- */
input[type="search"]{ width: 150px; padding-right: 19px; }
.dataTables_scrollBody{ overflow: visible !important; }
.clearSearchBtn{ font-size: 22px; position: absolute; margin-top: 4px; margin-left: -19px; color: #000; cursor: pointer; }
.clearSearchBtn:hover{ color: red; }
#bankOmat:NOT(.total) > .info{ display: none; }
input.bankOmat{ width: 50px; }

.dataTables_scrollHeadInner, .dataTable{ width: 100% !important; }
.dataTable thead tr > th, tr > td{ width: 16.6% !important; }
.dataTable tr > td{ text-align: center; }
tbody tr:hover > td,
tbody tr:hover > td:NOT(:hover){ background: #e9e9e9 !important; border-color: #ccc; }
tbody tr:hover > td.newTrans:hover{ background: #3c3c3c !important; }
html:NOT(.dark) tbody tr:hover > td.newTrans:hover{ border-color: #3c3c3c; color: #fff; }
.bankValues .newTrans:hover, .bankValues button:hover{ background: #3c3c3c; color: #fff; }
.newTrans:hover{ cursor: pointer; }

.handleRequest{ padding: 2px 10px; margin: 0 5px; font-size: 18px; border: 1px solid #f1f1f1; border-radius: 50%; }
.handleRequest[data-do="a"]:hover{ color: green; border-color: green; cursor: pointer; }
.handleRequest[data-do="d"]:hover{ color: red; border-color: red; cursor: pointer; }
.calc-p{ color: green; }
.calc-m{ color: red; }

/* ---- bank overview ---- */
.bankValues, .bankValues > div{ display: inline-block; width: 820px; }
.bankValues:NOT(:hover) > div:nth-child(4),
.bankValues:NOT(:hover) > div:nth-child(5),
.bankValues:NOT(:hover) > div:nth-child(6){ display: none; }
.ressRow.head > span:NOT(:first-child){ background: #f6f6f6; color: #454545; font-weight: bold; line-height: 40px; }
.ressRow:NOT(.head) > span{ line-height: 32px; }
.ressRow > span:first-child{ width: 220px; border: none; text-align: right; padding-right: 4px; white-space: nowrap; }
.bankValues > div:nth-child(6){ padding-left: 220px; }
.ressRow > span{ display: inline-block; width: 120px; text-align: center; border: 1px solid #ccc; margin: -1px -1px 0 0; }
.ressRow.head > span:first-child{ border: none; }
#reqBlock{ padding-top: 1px; }


/* ---- bank-O-mat ---- */
#bankOmat > div > span:first-child{ width: 150px; }
#bankOmat > div > span{ display: inline-block; width: 80px; text-align: center; border: none; }
#bankOmat input{ text-align: center; }
#bankOmat input + span{ position: absolute; display: inline-block; margin-top: 2px; margin-left: 1px; }

