:root {
    /* colors */
    --root-color: #000;
    --body-background-color: #fff;
    --hr-color: #ddd;
    --link-color: #2e3192;
    --link-hover-color: #000;
    --link-box-background-color: #eef;
    --link-box-hover-background-color: #cce;
    --title-separator-color: #ddd;
    --box-color: #333;
    --box-border-color: #ddd;
    --box-background-color: #f5f5f5;
    --box-shadow-color: rgba(0, 0, 0, 0.05);
    --button-disabled-color: #999;
    --container-background-color: #fff;

    --head-color: #000;
    --head-background-color: #fff;
    --head-link-color: #2e3192;
    --head-input-color: #000;
    --head-input-background-color: #fff;
    --title-color: #019ee1;
    --title-link-color: #019ee1;

    --shadow-color: #dadada;
    --contentscroll-scrollbar-background-color: #fff;
    --footer-border-color: #2e3192;

    --nav-brand-color: #eee;
    --nav-background-color: #2e3192;
    --nav-text-color: #fff;
    --nav-link-color: #fff;
    --nav-link-background-color: #0072bb;
    --nav-link-hover-color: #fff;
    --nav-link-hover-background-color: #66aaee;
    --nav-menu-link-color: #000;
    --nav-menu-link-background-color: #fff;
    --nav-menu-link-hover-color: #fff;
    --nav-menu-link-hover-background-color: #66aaee;
    --nav-menu-hidden-link-background-color: #eee;
    --nav-menu-header-color: #fff;
    --nav-menu-header-background-color: #0072bb;
    --nav-menu-separator-color: #aad;
    --nav-menu-submenu-link-background-color: #cde;

    --actionbar-color: #000;
    --actionbar-link-color: #2e3192;
    --actionbar-link-hover-color: #fff;
    --actionbar-link-hover-background-color: #66aaee;
    --actionbar-background-color: #f6f6f6;
    --actionbar-border-color: #ddd;
    --actionbar-shadow-color: #dadada;

    --pagemenu-color: #000;
    --pagemenu-background-color: #fff;
    --pagemenu-block-border-color: #ddd;
    --pagemenu-block-shadow-color: #dadada;
    --pagemenu-link-color: #2e3192;
    --pagemenu-link-background-color: #fff;
    --pagemenu-link-hover-color: #fff;
    --pagemenu-link-hover-background-color: #66aaee;

    --breadbrumbs-background-color: #eef;

    --listing-operations-background-color: #fff;
    --listing-operations-shadow-color: #dadada;

    --table-default-border-color: #000;
    --table-list-cell-border-color: #fff;
    --table-list-header-color: #fff;
    --table-list-header-link-color: #fff;
    --table-list-header-background-color: #0072bb;
    --table-list-row-hover-background-color: #bbf;
    --table-list-odd-row-background-color: #eef;
    --table-list-even-row-background-color: #dfdfef;

    --table-table-border-color: #dde;
    --table-table-header-color: #000;
    --table-table-header-background-color: #eef;

    --input-background-color: #fcfcfc;
    --input-border-color: #ccc;
    --input-automatic-background-color: #eda;
    --submit-background-color: #cde;
    --submit-hover-background-color: #eef;

    --form-border-color: #dadada;
    --form-shadow-color: #dadada;

    --form-view-background-color: #fff;
    --form-view-border-color: #dadada;
    --form-view-header-background-color: #eef;
    --form-view-header-border-color: #fff;

    --form-edit-background-color: #edb;
    --form-edit-border-color: #fff;
    --form-edit-header-background-color: #dc9;
    --form-edit-header-border-color: #fff;
    --form-edit-input-background-color: #fff;

    --form-structure-heading-color: #000;
    --form-structure-heading-background-color: #e5e0ea;
    --form-structure-block-color: #000;
    --form-structure-block-background-color: #c5c0ca;

    --form-required-color: #a00;
    --form-disabled-background-color: #eee;
    --form-readonly-background-color: #eee;

    --univiews-nested-deleted-color: #ccc;

    --color-red: #c00;
    --color-orange: #cd0;
    --color-green: #090;
    --color-blue: #00c;
    --color-magenta: #909;
    --color-yellow: #ee0;
    --color-grey: #999;

    --highlight-red: #ecc;
    --highlight-green: #cec;
    --highlight-blue: #cde;
    --highlight-magenta: #fcf;
    --highlight-orange: #fea;
    --highlight-brown: #eda;
    --highlight-grey: #ccc;
    --highlight-lightgrey: #f6f6f6;

    --message-info-color: #000;
    --message-info-background-color: #cec;
    --message-info-border-color: #8c8;
    --message-warning-color: #000;
    --message-warning-background-color: #fea;
    --message-warning-border-color: #efad00;
    --message-error-color: #000;
    --message-error-background-color: #ecc;
    --message-error-border-color: #c88;

}

html>body {
    margin:0;
    padding:0;
}

body {
    font-size: 12px;
    color: var(--root-color);
    background-color: var(--body-background-color);
    font-family: liberation sans, arial, tahoma, sans-serif;
    line-height: initial;
}

p {
    margin: 1em 0;
}

a {
    color: var(--link-color);
    font-weight: bold;
    text-decoration: none;
}

a:hover, th.aggregation a:hover {
    color: var(--link-hover-color);
    text-decoration:underline;
}

a.box {
    display: inline-block;
    border-radius: 2px;
    padding: 0.2em 0.5em;
    margin: 0.2em 0em;
    background-color: var(--link-box-background-color);
}
a.box-empty {
    background-color: inherit;
}
a.box-sm {
    padding: 0 0.2em;
    margin: 0.2em 0em;
}
a.box:first-child {
    margin-left: 0;
}
a.box:last-child {
    margin-right: 0;
}
a.box:hover {
    text-decoration: none;
    background-color: var(--link-box-hover-background-color);
}
.panel-heading a.box {
    margin-top: -0.2em;
    margin-bottom: -0.2em;
}

h1 {
    font-size:180%;
    margin-bottom:0px;
}
img.title-icon {                /* asume 32px icon size*/
    float:left;
    margin: -5px 10px 0px 0px;;
}
img.rel-view-icon {
    margin-right: 5px;
}
table img.info_text_form_icon {
    float:right;
    margin-left: 5px;
}
.edit img.info_text_form_icon {
    margin-top: 2px;
}

hr.title-separator {
    margin: 0px;
    padding: 0px;
    border: none;
    margin-bottom:16px;
}
hr.title-separator-border {
    border-top:1px solid var(--title-separator-color);
}

h2 {
    font-size:150%;
    margin-top:1em;
    margin-bottom:0.2em;
}

h3 {
    font-size:130%;
    margin-bottom:0.2em;
}

h4 {
    font-size:110%;
    margin-bottom:0.2em;
    font-style:italic;
}

.box, .uvbox {
    background-color: var(--box-background-color);
    border: 1px solid var(--box-border-color);
    color: var(--box-color);
    border-radius: 4px;
    padding: 10px 15px;
    box-shadow: 0 1px 1px var(--box-shadow-color);
}
.box-empty, .uvbox {
    background-color: initial;
}
.box-sm {
    padding: 3px 5px;
}
.box-noborder {
    border: none;
    border-radius: none;
    box-shadow: none;
}

.panel-heading h1, .panel-heading h2, .panel-heading h3, .panel-heading h4 {
    margin: 0;
}
h1.box, h2.box, h3.box, h4.box {
    margin-top: 2em;
    margin-bottom: 0.8em;
}
h1.box:first-child, h2.box:first-child, h3.box:first-child, h4.box:first-child {
    margin-top: 1em;
}
pre {
    white-space: pre-wrap;      /* css-3 */
    font-size: inherit;
    border-radius: 0;
}
table td pre {
    margin:0;
    padding:0;
}
table th, table td {
    padding: 2px 4px;
}


/* ELEMENTY */
.nw {
    white-space: nowrap;
}
.al {
    text-align: left;
}
.ar {
    text-align: right;
}
.ac {
    text-align: center;
}
.vat {
    vertical-align: top;
}
.vam {
    vertical-align: middle;
}
.vab {
    vertical-align: bottom;
}

.fl {
    float:left;
}

.fr {
    float:right;
}

.floatfix, .ffix {
    clear:both;
}
.floatfix_left, .ffix_l {
    clear:left;
}
.floatfix_right, .ffix_r {
    clear:right;
}

@keyframes rotateLoading {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
.spin {
  animation-name: rotateLoading;
  animation-duration: 4s;
  animation-iteration-count: infinite;
  animation-fill-mode: both;
  animation-timing-function: linear;
}

h1, h2, h3, h4 {
    font-weight:bold;
}

dt {
    font-weight:bold;
}

hr {
    border:0px;
    border-bottom:1px solid var(--hr-color);
    margin: 1.2em 0;
}
hr.sm {
    margin: 0.6em 0;
}

/* SPACERS (LaTeX inspired) */
.smallskip {
    margin-top: 0.7em;
}
.medskip {
    margin-top: 1.2em;
}
.bigskip {
    margin-top: 2.5em;
}


/* COLORS */
.red {
    color: var(--color-red);
}
.orange {
    color: var(--color-orange);
}
.green {
    color: var(--color-green);
}
.blue {
    color: var(--color-blue);
}
.magenta {
    color: var(--color-magenta);
}
.yellow {
    color: var(--color-yellow);
}
.grey {
    color: var(--color-grey);
}

form *[disabled] {
    background-color: var(--form-disabled-background-color) !important;
}

form *[readonly] {
    background-color: var(--form-readonly-background-color) !important;
}

button[disabled] {
    color: var(--button-disabled-color);
}

.container {
    clear: both;
    width: 100%;
    margin: 0;
    padding: 0;
    background-color: var(--container-background-color);
}

#head {
    position:relative;
    width:100%;
    margin:0px;
    padding:0px;
    color: var(--head-color);
    background-color: var(--head-background-color);
}

#head img {
    border:0px;
    margin:0px;
}
#head a, #head a:hover {
    color: var(--head-link-color);
}
#head button, #head input, #head optgroup, #head select, #head textarea {
    color: var(--head-input-color);
    background-color: var(--head-input-background-color);
}

#title {
    color: var(--title-color);
    position:relative;
    left:0px;
    top:0px;
    font-size: 47px;
    font-family: serif;
    font-style:italic;
    font-weight:bold;
    padding:10px 20px 5px 20px;
}
#title a {
    color: var(--title-link-color);
}
#title a:hover {
    text-decoration:none;
}

#subtitle {
    position:absolute;
    font-size: 200%;
    font-family: serif;
    font-style:italic;
    padding:5px 10px;
    bottom:0px;
    right:0px;
}
#module-selector {
    position:absolute;
    right:0px;
    top:0px;
    padding:10px 10px;
    width:auto;
}
#module-selector-title {
    font-style:italic;
    font-weight:bold;
}

#main-container {
    display: flex;
    width: auto;
    margin: 0 20px 20px 20px;
}
#content {
    flex-grow: 1;
    padding-top: 1.5rem;
    overflow: hidden;
}
#content > h1 {
    margin-top: 0;
}

#sidebar {
    padding: 0px;
    padding-top: 1.5rem;
    margin: 0px;
}
.stretcher {
    width:100%;
}
.overflow {
    display: block;
    overflow-x: auto;
    max-width: calc(100vw - 40px);
}
.shadow {
    box-shadow: var(--shadow-color) 1px 1px 6px;
}

#contentscroll_scrollbar {
    background-color: var(--contentscroll-scrollbar-background-color);
}

#footer {
    clear:both;
    position:relative;
    margin:20px;
    border-top:dotted var(--footer-border-color) 1px;
    margin-top:20px;
    font-size: 80%;
}

.blocklink {
    display:block;
    width:100%;
}


/* MENUS */

nav#menu-container [data-menu-action="unhide"] {
    font-size: 9px;
    font-weight: normal;
    text-align: center;
    border-top: 1px solid var(--nav-menu-separator-color);
}
nav#menu-container li.menu-item-hidden a {
    background-color: var(--nav-menu-hidden-link-background-color);
}
nav#menu-container li.menu-item-hidden a:hover {
    background-color: var(--nav-menu-link-hover-background-color);
}

/* MAIN MENU AND ACTION BAR*/

#pagemenu ul.ui-sortable {
    border: none;
    box-shadow: none;
}

nav#menu-container, nav#actionbar-container {
    position:relative;
    margin:0;
    padding:0;
    top:0px;
    width:100%;
    text-align:left;
    color: var(--nav-text-color);
    background-color: var(--nav-background-color);
    min-height: 0;
    height: auto;
    font-size: 11px;
    border-radius: 0px;
}
nav#menu-container {
    border: none;
    padding-top: 0.5em;
}
nav#menu-container .navbar-text, nav#menu-container .navbar-default {
    color: var(--nav-text-color);
}
nav#menu-container li {
    background-color: #fff;
}
nav#menu-container ul.navbar-nav > li, nav#actionbar-container ul.navbar-nav > li {
    margin: 0 3px;
}

nav#menu-container li a, nav#actionbar-container li a {
    padding: 2px 5px;
    color: var(--nav-link-color);
    background-color: var(--nav-link-background-color);
}
nav#menu-container li a:hover {
    color: var(--nav-link-hover-color);
    background-color: var(--nav-link-hover-background-color);
}
nav#menu-container li li a {
    color: var(--nav-menu-link-color);
    background-color: var(--nav-menu-link-background-color);
    margin: inherit;
    font-family: inherit;
    font-weight: bold;
}
nav#menu-container li li a:hover {
    color: var(--nav-menu-link-hover-color);
    background-color: var(--nav-menu-link-hover-background-color);
}
nav#menu-container .navbar-header button:hover {
    color: var(--nav-link-hover-color);
    background-color: var(--nav-link-hover-background-color);
}

nav#menu-container .navbar-toggle {
    color: var(--nav-link-color);
}
nav#menu-container .icon-bar {
    background-color: var(--nav-link-color);
}
nav#menu-container li.dropdown-header {
    color: var(--nav-menu-header-color);
    background-color: var(--nav-menu-header-background-color);
    font-weight: bold
}
nav#menu-container li.divider {
    margin-top: 0.25em;
    margin-bottom: 0.25em;
    color: var(--nav-menu-link-background-color);
    background-color: var(--nav-menu-separator-color);
}
nav#menu-container #menu-collapse > ul > li.divider {
    display: block;
    width: 10px;
    height: 10px;
    background-color: var(--nav-background-color);
}
nav#menu-container li.dropdown-header:not(:first-child) {
    margin-top: 0.5em;
}

nav#menu-container .dropdown-submenu > a::after {
    position:absolute;
    right: 0;
    top: 0.1em;
    margin-right: 3px;
}
nav#menu-container a.submenu-link {
    text-align: center;
    background-color: var(--nav-menu-submenu-link-background-color);
}
@media (max-width: 767px) {
    nav#menu-container li > a, nav#menu-container li.dropdown-header {
        font-size:16px;
        padding: 10px 15px;
    }
}
@media (min-width: 768px) {
    nav#menu-container li li a, nav#menu-container li.dropdown-header {
        font-size:11px;
    }
}

nav#menu-container.navbar-default a.navbar-brand,
nav#menu-container.navbar-default a.navbar-brand:hover {
    color: var(--nav-brand-color);
    text-decoration: none;
    font-weight: bold;
    font-size: 180%;
    font-family: serif;
    font-style: italic;
}
nav#menu-container .navbar {
    border-radius: 0px;
}
nav#menu-container.navbar-default, nav#menu-container.navbar-collapse {
    border-color: inherit;
}
nav#menu-container .navbar-collapse {
    padding: 0;
}
nav#menu-container .navbar-right {
    margin-right: 0;
}
nav#menu-container .navbar-nav {
    margin-left: 8px;
    margin-right: 8px;
}
nav#menu-container .navbar-header button {
    padding: 5px;
}
nav#menu-container .navbar-header button:focus {
    background-color: var(--nav-link-hover-background-color);
}
nav#menu-container .navbar-header .glyphicon {
    font-size: 180%;
}


/* ACTION BAR */

nav#actionbar-container {
    font-size: 12px;
    color: var(--actionbar-color);
    background-color: var(--actionbar-background-color);
    border: 1px solid var(--actionbar-border-color);
    box-shadow: var(--actionbar-shadow-color) 1px 1px 6px;
}
nav#actionbar-container .container-fluid {
    padding:0;
}
nav#actionbar-container ul.nav > li.divider {
    display: block;
    padding: 0px;
    width: 20px;
    height: 1em;
}
nav#actionbar-container ul li a {
    color: var(--actionbar-link-color);
    font-weight: normal;
    background-color: inherit;
}
nav#actionbar-container li li a, nav#actionbar-container li.dropdown-header a {
    font-size: 12px;
}
nav#actionbar-container ul li a:hover {
    color: var(--actionbar-link-hover-color);
    background-color: var(--actionbar-link-hover-background-color);
    text-decoration: none;
}
nav#actionbar-container ul.navbar-nav {
    margin: 0;
}
nav#actionbar-container > .container-fluid > ul > li {
    display: inline-block;
}

@media (max-width:767px) {
    nav#actionbar-container .container-fluid > ul > li.divider {
        display: none !important;
    }
}

#pagemenu {
    position:relative;
    width:auto;
    color: var(--pagemenu-color);
    background-color: var(--pagemenu-background-color);
    margin: 1px 0px 10px 20px;
    white-space: nowrap;
    padding: 0;
}
#pagemenu li {
    display:block;
}

#pagemenu p, #pagemenu .p, #pagemenu ul, #pagemenu > .pagemenu,
#pagemenu dl {
    position: relative;
    width: auto;
    border: 1px solid var(--pagemenu-block-border-color);
    margin: 0px;
    margin-bottom: 10px;
    padding: 2px;
    z-index: 8;
    box-shadow: var(--pagemenu-block-shadow-color) 1px 1px 6px;
}
#pagemenu dl dd {
  margin-left: 0.5em;
}
#pagemenu > table, #pagemenu > form > table,
#pagemenu > .overflow > table, #pagemenu > form > .overflow > table {
    margin-bottom: 10px !important;
}

#pagemenu .p ul {
    list-style:none;
    padding:0px;
    margin:0px;
}
#pagemenu hr, #menu-container ul ul hr {
    margin:2px 0;
}

#pagemenu p a, #pagemenu ul a {
    display:block;
    width:auto;
    font-size:100%;
    font-weight:bold;
    color: var(--pagemenu-link-color);
    background-color: var(--pagemenu-link-background-color);
    padding:3px 5px;
    text-decoration:none;
}
#pagemenu p a:hover, #pagemenu ul a:hover {
    color: var(--pagemenu-link-hover-color);
    background-color: var(--pagemenu-link-hover-background-color);
    text-decoration:none;
}
#pagemenu p a.inline {
    color: var(--pagemenu-link-color);
    background-color: var(--pagemenu-link-background-color);
    display:inline;
    padding: 2px 3px;
    margin:1px;
}
#pagemenu p a.inline:hover {
    color: var(--pagemenu-link-hover-color);
    background-color: var(--pagemenu-link-hover-background-color);
}

#pagemenu h4 {
    font-size:100%;
    margin:0px;
    padding:0px;
}

#pagemenu p.noblock {
    padding: 3px 5px;
}
#pagemenu p.noblock a {
    display:inline;
    padding: 0px;
}


/* LISTING */
#listing-add-link {
    text-align:center;
}
#listing-operations {
    background-color: var(--listing-operations-background-color);
    position: absolute;
    right: 1em;
    top: 2.5em;
    box-shadow: var(--listing-operations-shadow-color) 1px 1px 6px;
    z-index: 9999;
}
#listing-operations ul {
    list-style:none;
    padding:0px;
    padding-left: 1em;
    margin:0px;
}
#listing-operations h4 {
    margin-bottom: 0.5em;
}
#listing-operations hr {
    margin: 0.8em 0;
}


#calendar {
    height:15em;
    width:14.5em;
    border:0;
    overflow-x:hidden;
    overflow-y:hidden;
}
#breadcrumbs {
    width:100%;
    background-color: var(--breadbrumbs-background-color);
}
#breadcrumbs li {
    display: inline;
}
#breadcrumbs-content {
    font-size: 80%;
    padding: 0.5em;
}

/* TABULKY */

table tr.nostyle,
table tr th.nostyle,
table tr td.nostyle {
    font-weight: initial;
}

table.table {
    width: auto; /* override bootstrap's default 100% */
}

table.default {
    border: 1px solid var(--table-default-border-color);
    border-style: outset;
    border-collapse: collapse;
}
table.default td, table.default th {
    padding: 3px 5px;
    border: 1px solid var(--table-default-border-color);
}

table.list {
    text-align:left;
}
table.list tr:not(.nostyle) td:not(.nostyle) a {
    font-weight: normal;
}
table.list tr:not(.nostyle) th:not(.nostyle) a {
    font-weight: bold;
}
/* table.list .column-names th {
   white-space: initial;
   } */
table.nw td:not(.nostyle) {
    white-space:nowrap;
}
table.list td:not(.nostyle), table.list th:not(.nostyle) {
    border:1px solid var(--table-list-cell-border-color);
}
table.thr th {
    text-align:right;
}

table.list td:not(.nostyle), table.list th:not(.nostyle) {
    padding:2px 4px;
}
table.list td.left_action_column {
    padding: 0px 5px;
}

table.list th:not(.nostyle) {
    color: var(--table-list-header-color);
    background-color: var(--table-list-header-background-color);
    padding:3px 5px;
}
table.list th:not(.nostyle) a {
    color: var(--table-list-header-link-color);
}
table.list tr.aggregation th:not(.nostyle) a {
    color: var(--link-color);
    background-color: var(--container-background-color);
    text-decoration:None;
}
table.list tr.aggregation th:not(.nostyle) a:hover {
    color: var(--link-hover-color);
    text-decoration:underline;
}

/* .even and .odd cannot be table.list speciffic otherwise they override
   custom highlight style (row-style-func) */
table.list tr:not(.nostyle),
table.list tr:not(.nostyle).odd {
    background-color: var(--table-list-odd-row-background-color);
}
table.list tr:not(.nostyle).even {
    background-color: var(--table-list-even-row-background-color);
}
table.list tr:not(.nostyle):hover > td:not(.nostyle) {
    background-color: var(--table-list-row-hover-background-color);
}
.wrapped-table-header {
    background-color: var(--container-background-color);
}

table.table, table.uv-log {
    text-align:left;
    border:1px solid var(--table-table-border-color);
}
table.uv-log {
    background-color: var(--container-background-color);
}
table.thright tr th, table.uv-log tbody th {
    text-align:right;
}
table.table tr th, table.uv-log tr th {
    color: var(--table-table-header-color);
    background-color: var(--table-table-header-background-color);
}
table.table tr td, table.uv-log tr td {
    padding: 2px 5px;
}
table.uv-log tr td {
    white-space:normal;
    background-color: var(--container-background-color);
}
table.uv-log thead {
    font-size:80%;
}
table.uv-log thead th {
    color: var(--table-list-header-link-color);
    background-color: var(--table-list-header-background-color);
}
table.uv-log tbody tr th {
    color: var(--form-view-header-color) !important;
    background-color: var(--form-view-header-background-color) !important;
}
.nested-deleted {
    color: var(--univiews-nested-deleted-color);
}


/* HIGHLIGHTS */
.highlight-green {
    background-color: var(--highlight-green) !important;
}
.highlight-orange {
    background-color: var(--highlight-orange) !important;
}
.highlight-brown {
    background-color: var(--highlight-brown) !important;
}
.highlight-magenta {
    background-color: var(--highlight-magenta) !important;
}
.highlight-red, table.uv-log tr.highlight-red td {
    background-color: var(--highlight-red) !important;
}
.highlight-blue {
    background-color: var(--highlight-blue) !important;
}
.highlight-grey {
    background-color: var(--highlight-grey) !important;
}
.highlight-lightgrey {
    background-color: var(--highlight-lightgrey) !important;
}

/* TABLE HIGHLIGHTS */
table.list tr.highlight-green, table.list .highlight-green, table.list tr.highlight, table.list tr td.highlight {
    background-color: var(--highlight-green) !important;
}
table.list tr.highlight-orange, table.list .highlight-orange {
    background-color: var(--highlight-orange) !important;
}
table.list tr.highlight-brown, table.list .highlight-brown {
    background-color: var(--highlight-brown) !important;
}
table.list tr.highlight-red, table.list .highlight-red {
    background-color: var(--highlight-red) !important;
}
table.list tr.highlight-magenta, table.list .highlight-magenta {
    background-color: var(--highlight-magenta) !important;
}
table.list tr.highlight-blue, table.list .highlight-blue {
    background-color: var(--highlight-blue) !important;
}
table.list tr.highlight-grey, table.list .highlight-grey {
    background-color: var(--highlight-grey) !important;
}
table.list tr.highlight-lightgrey, table.list .highlight-lightgrey {
    background-color: var(--highlight-lightgrey) !important;
}
/* END TABLE HIGHLIGHTS */


/* TABLE HANDLERS */
table th .column_header {
    position:relative;
}
table th .column_header .column_title {
    overflow-x: hidden;
}
table th .column_handler {
    position:absolute;
    height:100%;
    width:11px;
    right:-12px;
    cursor:move;
}

/* END TABLE HANDLERS */

table.list td.left_action_column img.table_link {
    padding: 0;
    vertical-align: top;
}
table.list td.left_action_column input {
    margin: 0;
}

table.columns {
    width:80%;
}

table.columns td {
    vertical-align:top;
    text-align:left;
}

table.columns td.leftcolumn {
    padding-right:15px;
    /*border-right:dotted 1px #2e3192; */
}

table.columns td.rightcolumn {
    padding-left:15px;
}

table.list tr:not(.nostyle).aggregation th:not(.nostyle) {
    color: var(--root-color);
    white-space:nowrap;
    background-color: var(--container-background-color);
    border: 0px;
}
table.list tr:not(.nostyle).aggregation th.aggregation_cell {
    color: #000 !important;
    background-color: #ee9 !important;
    text-align: right !important;
    vertical-align: bottom !important;
}

form.edit table td, .edit table td, table.edit td, form table th {
    padding:0px 10px;
}
form.edit table th {
    padding: 2px 10px;
}

form.edit table td ul, .edit table td ul, table.edit td ul {
    list-style: none;
    padding: 0;
    margin: 5px;
}

form.edit table tr, .edit table tr, table.edit tr {
    background-color: var(--form-edit-background-color);
}

form.edit table th, .edit table th, table.edit th {
    background-color: var(--form-edit-header-background-color);
    text-align:right;
    border:1px solid var(--form-edit-header-border-color);
}
.uvform_table th label, form.edit th label, form.view th.label {
    float:right;
    text-align:right;
    margin: 0;
}
table table {
    margin: 4px;
}

form.edit table, form.view table, .view table,
table.view, .edit table, table.edit {
    text-align:left;
    border:1px double var(--form-border-color);
    box-shadow: var(--form-shadow-color) 1px 1px 5px;
    margin: 3px 0;
    border-radius: 4px;
}
form.edit table table, form.view table table, .view table table,
table.view table table, .edit table table, table.edit table {
    box-shadow: none;
    margin: 4px;
}
form.edit table td, .edit table td, table.edit td {
    border:1px solid var(--form-edit-border-color);
}
form.view table td, .view table td, table.view td {
    border:1px solid var(--form-view-border-color);
}
form.view table th, .view table th, table.view th {
    border:1px solid var(--form-view-header-border-color);
    text-align:right;
    background-color:inherit;
}

form.view-vertical table th, .view-vertical table th, table.view-vertical th {
    text-align:left;
    padding: 3px 5px;
}

form.view table th, .view table th, table.view th {
    background-color: var(--form-view-header-background-color);
}

form.view table td {
  min-width: 200px;
}

form.edit table tr.required th, .edit table tr.required th, table.edit tr.required th {
    color: var(--form-required-color);
}

input, textarea, select, button, a.buttonlink {
    border:1px solid var(--input-border-color);
    background-color: var(--input-background-color);
    margin:2px;
    border-radius: 2px;
}
.edit input, .edit textarea, .edit select {
    background-color: var(--form-edit-input-background-color);
}
textarea[data_format=code] {
    font-family: monospace;
}
a.buttonlink {
    padding: 2px 4px;
    color: var(--root-color);
    font-weight: normal;
    border-radius: 2px;
}
a.buttonlink:hover, input[type=button]:hover, input[type=submit]:hover,
button[type=submit]:not(.btn):hover {
    text-decoration: none;
    background-color: var(--submit-hover-background-color);
}

input.automatic, textarea.automatic, select.automatic {
    background-color: var(--input-automatic-background-color);
}

form input.button, button[type=submit]:not(.btn) {
    background-color: var(--submit-background-color);
    margin:5px 0px;
    padding:2px 4px;
    font-weight:bold;
}

#fm_files_selected {
    background-color: var(--highlight-green);
}

table.filemanager {
    font-family:monospace;
}

table tr.fm_directory {
    background-color: var(--highlight-green);
}

table tr.fm_directory * a {
    font-weight:bold;
}

table tr.fm_file * a {
    color: var(--root-color);
    font-weight:normal;
    text-decoration:none;
}
table tr.fm_file * a:hover {
    text-decoration:underline;
}

form.view table {
    max-width:100%;
    table-layout:fixed;
}
form.view table tr.uv-field td {
    padding:2px 5px;
    font-size:100%;
    background-color: var(--form-view-background-color);
    white-space:normal;
}
form.view table tr.uv-field th {
    padding:2px 5px;
}
form.view table tr.uv-field td ul {
    padding:0 1.5em;
    margin: 0;
}

/* UNIVIEWS HEADINGS */
table tr.uv-heading th, .view .uv-heading th, .edit .uv-heading th {
    font-style: italic;
    font-size: 120%;
    font-weight: normal;
    text-align: left;
    color: var(--form-structure-heading-color);
    background-color: var(--form-structure-heading-background-color);
    padding: 3px 5px;
}
table tr.uv-block-heading th, .view .uv-block-heading th, .edit .uv-block-heading th {
    font-style: normal;
    font-size: 140%;
    font-weight: bold;
    text-align: center;
    color: var(--form-structure-block-color);
    background-color: var(--form-structure-block-background-color);
    padding: 3px 5px;
}

/* UNIVIEWS NESTED TABLE LAYOUT STYLING */

form.edit select {
    max-width: 30em;
    text-overflow: ellipsis;
}

td.nostyle, th.nostyle,
table.view td.nostyle, table.edit td.nostyle,
table.view th.nostyle, table.edit th.nostyle,
form.edit table.nostyle, form.edit table tr.nostyle,
form.edit table td.nostyle, form.edit table th.nostyle,
form.view table.nostyle, form.view table tr.nostyle,
form.view table td.nostyle, form.view table th.nostyle {
    background-color: var(--container-background-color);
    border: 0;
    padding: 0px;
}
form.view table.nostyle, form.edit table.nostyle {
    border-spacing:5px;
}
.nostyle-padding {
    padding: 3px 5px !important;
}

td.nostyle input.button, #uvform_operations button {
    margin-left:5px;
    margin-right:5px;
}
/* TODO: DEPRECATED: td.submit style buttons are deprecated and should be
   removed from code; use #uvform_operation block/styling for sending forms
   instead */
td.submit, table.edit td.submit,
form.edit table.submit, form.edit table tr.submit, form.edit table td.submit,
#uvform_operations button {
    padding:5px;
}

#uvform_operations {
    background-color: var(--container-background-color) !important;
}

/* MESSAGE */

.info_message, .message_message, .error_message, .warning_message, ul.errorlist {
    width:auto;
    padding:5px 10px;
    margin-bottom: 1rem;
    font-size:100%;
}

.info_message, .message_message {
    color: var(--message-info-color);
    border:2px solid var(--message-info-border-color);
    background-color: var(--message-info-background-color);
}

.warning_message {
    color: var(--message-warning-color);
    border:2px solid var(--message-warning-border-color);
    background-color: var(--message-warning-background-color);
}

.error_message, ul.errorlist {
    color: var(--message-error-color);
    border:2px solid var(--message-error-border-color);
    background-color: var(--message-error-background-color);
}

/* NOTIFICATIONS */
table.notifications {
    border:0;
    margin-top:-1em;
    border-spacing:0 2em;
}

.notification {
    margin-bottom:2em;
    padding:0 1em;
    font-size:100%;
}

.notification .title {
    font-size:130%;
    font-weight:bold;
    text-decoration:underline;
}

.notification .subtitle {
    font-size:110%;
    font-weight:bold;
}

.notification-priority-1 {
    border:2px solid var(--message-info-border-color);
}

.notification-priority-2 {
    border:2px solid var(--message-info-border-color);
    background-color: var(--message-info-background-color);
}

.notification-priority-3 {
    border:2px solid var(--message-warning-border-color);
    background-color: var(--message-warning-background-color);
}

.notification-priority-4 {
    border:2px solid var(--message-error-border-color);
    background-color: var(--message-error-background-color);
}

/* FILTER */
#filter {
    position:relative;
    margin-bottom:0.5em;
    z-index:5;
}
#pagination > div {
    padding-top: 0.5em;
    padding-bottom: 0.5em;
}
#pagination {
    min-height: 3em;
}

.flex-wrap {
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
}
.flex-wrap div {
    margin-right: 1em;
}

/* UVBox */
.uvbox {
    float:right;
    max-width:30%;
    overflow-x:auto;
}
.uvbox h2 {
    margin-top:0px;             /* title inside state box */
}
.uvbox ul, .uvbox ol {
    padding:0em 0em 0em 1.5em;
    margin:0px;
}
.uvbox p {
    padding:0px;
    margin:0px;
    margin-top:0.5em;
}
.uvbox blockquote {
    margin:0.5em 1em;
    padding:0em;
}


/* MISC */
.dragable {
    cursor:move;
}
.topless {
    margin-top:0px !important;
}
.topless-first:first-child {
    margin-top:0px !important;
}
.hidden {
    display:none;
}

/* CENSORSHIP styles */
.censor, form.view table tr.uv-field td.censor,
input.censor, textarea.censor, select.censor {
    color: var(--root-color) !important;
    background-color: var(--root-color) !important;
}
.censor:hover, form.view table tr.uv-field td.censor:hover,
input.censor:hover, textarea.censor:hover, select.censor:hover {
    color:inherit !important;
    background-color:inherit !important;
}

.ui-autocomplete {
    z-index:9999 !important;
}

/* Positioning of captcha image in form/table when using django-simple-captcha */
table td img.captcha {
    position:relative;
    top: 3px;
    margin-bottom: 5px;
}


/* Specialities */
@keyframes blink {
    0% {
        opacity:1;
        filter: saturate(2);
    }
    50% {
        opacity:0.2;;
        filter: saturate(1);
    }
    100% {
        opacity:1;
        saturation: 2;
        filter: saturate(2);
    }
}
.blink {
    animation: blink normal 1.5s infinite ease-in-out
}

/* FIXES FOR BOOTSTRAP AND JQ BS SUBMENU PLUGIN */

/* fix for jQuery BS submenu plugin for right aligned navbar items */
@media (min-width: 768px) {
    .navbar-right .dropdown-submenu .dropdown-menu {
        position: absolute;
        right: 100%;
        left: inherit;
    }
}

label {
    margin: inherit;
}

input[type="checkbox"], input[type="radio"] {
    line-height: normal;
    margin: inherit;
}

.collapsing {
    -webkit-transition: height 0.01s;
    transition: height 0.01s;
}