BODY { background-color: var( --background ) !important; font-family: var(--font-family) !important; color: var( --font-color ) !important; }
BODY.page-sidebar-closed { background-color: var( --background-light ) !important; }
BODY.external { background-color: var( --background-light ) !important; }
.page-title { font-family: var(--font-family) !important; }

.page-sidebar .page-sidebar-menu .group-collapse .menu-items > li.active > a { background: var( --background-lighter ) !important; }

/* first color */
A,
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu > li.heading > h3, 
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu > li > a > i,
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu > li > a,
.page-sidebar .page-sidebar-menu > li.heading > h3,
.page-sidebar .page-sidebar-menu > li > a,
.page-sidebar .page-sidebar-menu > li > a > i,
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu > li > a > i[class^="icon-"], 
.page-sidebar .page-sidebar-menu > li > a > i[class^="icon-"], 
.page-sidebar .page-sidebar-menu > li > a > i[class*="icon-"],
.caption.breadcrumb 
{ color: var( --primary ) !important; }

.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu > li.active > a, 
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu > li.active.open > a, 
.page-sidebar .page-sidebar-menu > li.active > a, 
.page-sidebar .page-sidebar-menu > li.active.open > a
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu > li:hover > a, 
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu > li:hover.open > a, 
.page-sidebar .page-sidebar-menu > li:hover > a
{ color: var( --primary ) !important; background: var( --background-lighter ) !important; }

/* second color */
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu > li.active > a > i, 
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu > li.active.open > a > i, 
.page-sidebar .page-sidebar-menu > li.active > a > i, 
.page-sidebar .page-sidebar-menu > li.active.open > a > i,
.page-sidebar .page-sidebar-menu > li.active > a > .title, 
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu > li > a > .title
{ color: var( --secondary ) !important; }

.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu > li.active > a, 
.page-sidebar .page-sidebar-menu .group-collapse .menu-items > li.active > a,
.page-sidebar .page-sidebar-menu > li.active > a
{ border-left: 3px solid var( --secondary ) !important; }

.page-sidebar .page-sidebar-menu > li.active > a.noClientFilter,
.page-sidebar .page-sidebar-menu > li:hover > a.noClientFilter,
.page-sidebar .page-sidebar-menu > li.active > a.noClientFilter > i,
.page-sidebar .page-sidebar-menu > li:hover > a.noClientFilter > i,
.page-sidebar .page-sidebar-menu > li.active > a.noClientFilter > i[class^="icon-"],
.page-sidebar .page-sidebar-menu > li.hover > a.noClientFilter > i[class^="icon-"],
.page-sidebar .page-sidebar-menu > li.active > a.noClientFilter > .title,
.page-sidebar .page-sidebar-menu > li:hover > a.noClientFilter > .title
{ color: var( --no-client-filter-foreground ) !important; background: var( --no-client-filter-background ) !important; }

.page-sidebar .page-sidebar-menu > li > a.noClientFilter, 
.page-sidebar .page-sidebar-menu > li > a.noClientFilter > i
{ color: var( --no-client-filter-foreground ) !important; }

.page-sidebar .page-sidebar-menu > li.active > a.noClientFilter
{  border-left: 3px solid var( --no-client-filter-foreground ) !important; }

.page-sidebar .page-sidebar-menu > li.active > a.nullClientFilter,
.page-sidebar .page-sidebar-menu > li:hover > a.nullClientFilter,
.page-sidebar .page-sidebar-menu > li.active > a.nullClientFilter > i,
.page-sidebar .page-sidebar-menu > li:hover > a.nullClientFilter > i,
.page-sidebar .page-sidebar-menu > li.active > a.nullClientFilter > i[class^="icon-"],
.page-sidebar .page-sidebar-menu > li.hover > a.nullClientFilter > i[class^="icon-"],
.page-sidebar .page-sidebar-menu > li.active > a.nullClientFilter > .title,
.page-sidebar .page-sidebar-menu > li:hover > a.nullClientFilter > .title
{ color: var( --null-client-filter-foreground ) !important;  background: var( --null-client-filter-background ) !important; }

.page-sidebar .page-sidebar-menu > li > a.nullClientFilter, 
.page-sidebar .page-sidebar-menu > li > a.nullClientFilter > i
{ color: var( --null-client-filter-foreground ) !important; }

.page-sidebar .page-sidebar-menu > li.active > a.nullClientFilter
{  border-left: 3px solid var( --null-client-filter-foreground ) !important; }

/* tabbable line */
.tabbable-line > .nav-tabs > li, .portlet-title > .nav-tabs > li { border-bottom: 4px solid transparent !important; }
.tabbable-line > .nav-tabs > li.active { border-bottom-color: var( --secondary ) !important; }
.tabbable-line > .nav-tabs > li:hover { border-bottom-color: var( --secondary-light ) !important; }

/* buttons are still white */
A.btn, A.btn SPAN { color: white !important; }
A.jstree-anchor { color: var( --secondary ) !important; }
A.jstree-anchor.disabled { color: var( --disabled ) !important; }
A.jstree-anchor.published-menu { color: var( --note-success-font-color ) !important; }
A.table_header { color: var( --secondary ) !important; }
.page-breadcrumb A { color: var( --secondary ) !important; }
.page-title { color: var( --secondary ) !important; }

/* some tree colorings regarding noclientsfilter and nullclientfilter */
li.jstree-node.hasNoClientFilter > A { color: var( --tree-danger-font-color ) !important; }
li.jstree-node.hasNullClientFilter > A { color: var( --tree-warning-font-color ) !important; }

/* deletables */
A.deletable.exists, A.deletable.deleted:hover { color: var( --secondary ) !important; }
A.deletable.exists:hover, A.deletable.deleted { color: var( --danger ) !important;  }

/* button */
.modal-header A.btn.grey { color: gray !important; }

/* mark selection */
.MarkSelection.selected { background-color: var( --secondary-light ) !important; }

.input-group { width: 100%; }
.input-group SPAN.input-group-addon { display: none; }
.input-group SPAN.input-group-addon.show { display: table-cell !important; }
.input-group SPAN.input-group-addon.show:first-child { border-right: 2px solid white; }
.input-group SPAN.input-group-addon.show:last-child { border-left: 2px solid white; }

.form-group .control-label { color: var( --font-color ) !important; }
.form-group .form-control.focussed { border: 4px solid var( --danger ) !important; }
.form-group SELECT.form-control.focussed { padding: 2px !important; }
.form-group.mandatory .control-label:after { content: "\f005"; color: red; font-family: FontAwesome; font-size: 9px; margin: 5px; vertical-align: super; } 
.input-group .form-control { border: 0; border: var( --border ) !important; font-weight: bold; font-weight: 600; }
.input-group .form-control.free { border: 0 !important; border-bottom: var( --border ) !important; background-color: transparent !important; }
.note-editor.note-frame { border: 0; border: var( --border ) !important; }

::-webkit-input-placeholder { font-weight: 200 !important; }
:-ms-input-placeholder { font-weight: 200 !important; }
::placeholder { font-weight: 200 !important; }

.vakata-context .vakata-contextmenu-disabled a,
.vakata-context .vakata-contextmenu-disabled a:hover 
{
	color: var( --disabled ) !important;
	background-color: transparent;
}

.neo-form-control { background-color: var( --input-background ) !important; color: var( --input-font-color ) !important; }
.neo-table-column SPAN.content:nth-child(odd) .neo-form-control { background-color: var( --table-rows-odd ) !important; }
.neo-table-column SPAN.content:nth-child(even) .neo-form-control { background-color: var( --table-rows-even ) !important; }
.neo-table-column SPAN.content.highlight .neo-form-control { background-color: var( --table-rows-highlight ) !important; }
.neo-table-column SPAN.content.ajax .neo-form-control { background-color: var( --table-rows-balanced-background ) !important; }
.neo-table-column .tree_menu .tree_menu_table { background: var( --contextmenu-background-color ) !important; color: var( --contextmenu-foreground-color ) !important; border: 1px solid var( --lines ) !important; border-bottom: 0 !important; }
.neo-table-column .tree_menu .tree_menu_table .tree_menu_table_item { color: var( --contextmenu-foreground-color ) !important; border-bottom: 1px solid var( --lines ) !important; }
.neo-table-column .tree_menu .tree_menu_table .tree_menu_table_item:hover { background-color: var( --contextmenu-hover-background-color ) !important; color: var( --contextmenu-hover-foreground-color ) !important; }
.neo-table-column .search INPUT[disabled], .neo-table-column .search SELECT[disabled] { background-color: var( --input-disabled-background ) !important; color: var( --input-disabled-background ) !important; }
.neo-table-column DIV.colored { border: var( --border ) !important; }
.text.range .ui-slider .ui-slider-handle { color: var( --slider-range-font-color ) !important; }
.text.range .ui-slider .ui-widget-header { background: var( --slider-range-background ) !important; }
.text.range .ui-slider DIV.hours { background-color: var( --slider-range-hours-splitter ) !important; } 
.text.range.disabled .ui-slider .ui-slider-handle { color: var( --slider-range-font-color-disabled ) !important; }
.text.range.disabled .ui-slider .ui-widget-header { background: var( --slider-range-background-disabled ) !important; }
.text.range.disabled .ui-slider DIV.hours { background-color: var( --slider-range-hours-splitter-disabled ) !important; } 

.page-header.navbar { background: var( --background-light ) !important; }
.page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover, .page-sidebar { background: var( --background-light ) !important; }
.page-content-wrapper .page-content { background: var( --background-light ) !important; }
.page-bar { background-color: var( --background-lighter ) !important; }

.form-control { background-color: var( --input-background ) !important; color: var( --input-font-color ) !important; }
.form-control[disabled], fieldset[disabled] .form-control { background-color: var( --input-disabled-background ) !important; color: var( --input-disabled-font-color ) !important; }
.form-control[readonly] { cursor: text !important; }
.portlet > .portlet-title, .form .form-section, .model H3.form-section  { border-bottom-color: var( --lines ) !important; }
hr { border-top-color: var( --lines ) !important; }

.heading.NeoMenuHeading H3 { border-bottom-color: var( --lines ) !important; }
.page-header.navbar { border-bottom-color: var( --lines ) !important; }

.cancel.btn, .cancel.btn:hover, .cancel.btn:focus, .cancel.btn:active, .cancel.btn.activ { background-color: var( --button-cancel ); color: var( --button-cancel-font-color ) !important; }
.green.btn, .green.btn:hover, .green.btn:focus, .green.btn:active, .green.btn.active { background-color: var( --button-green ); color: var( --button-green-font-color ) !important; }
.blue.btn, .blue.btn:hover, .blue.btn:focus, .blue.btn:active, .blue.btn.active { background-color: var( --button-blue ); color: var( --button-blue-font-color ) !important; }
.yellow.btn, .yellow.btn:hover, .yellow.btn:focus, .yellow.btn:active, .yellow.btn.active { background-color: var( --button-yellow ); color: var( --button-yellow-font-color ) !important; }
.red.btn, .red.btn:hover, .red.btn:focus, .red.btn:active, .red.btn.active { background-color: var( --button-red ); color: var( --button-red-font-color ) !important; }
.purple.btn, .purple.btn:hover, .purple.btn:focus, .purple.btn:active, .purple.btn.active { background-color: var( --button-purple ); color: var( --button-purple-font-color ) !important; }
.grey.btn, .grey.btn:hover, .grey.btn:focus, .grey.btn:active, .grey.btn.activ { background-color: var( --button-cancel ); color: var( --button-cancel-font-color ) !important; }
.gray.btn, .gray.btn:hover, .gray.btn:focus, .gray.btn:active, .gray.btn.activ { background-color: var( --button-cancel ); color: var( --button-cancel-font-color ) !important; }

SPAN.btn,
.btn.disabled, 
.btn.disabled:hover, 
.btn.disabled:focus, 
.btn.disabled:active, 
.btn.disabled.active, 
.btn[disabled], 
.btn[disabled]:hover, 
.btn[disabled]:focus, 
.btn[disabled]:active, 
.btn[disabled].active, 
fieldset[disabled] .btn, 
fieldset[disabled] .btn:hover, 
fieldset[disabled] .btn:focus, 
fieldset[disabled] .btn:active, 
fieldset[disabled] .btn.active
{ background-color: var( --button-disabled ) !important; color: var( --button-disabled-font-color ) !important; cursor: default; }

.page-container.rare .portlet-body .actions.btn-set { background-color: var( --background-light ) !important; border-color: var( --lines ) !important; }
.neo-table-column { color: var( --font-color ) !important; } 
.neo-table-column .content A.tree_opener, .neo-table-column .content SPAN.tree_opener { color: var( --font-color ) !important; }
.neo-table-column .content .tree_action { color: var( --font-color ) !important; }
.neo-table-column .content .tree_menu .tree_menu_table { background-color: var( --background-lighter ) !important; }
.neo-table-rows, .neo-table-footer-rows, .neo-table-rows .sticky, .neo-table-footer-rows .sticky { background: repeating-linear-gradient( var( --table-rows-odd ), var( --table-rows-odd ) 36px, var( --table-rows-even ) 36px, var( --table-rows-even ) 72px ) !important; background-attachment: local !important; }
.neo-table-rows, .content.ajax { background-color: var( --table-rows-balanced-background ) !important; }
.neo-table-rows, .content.highlight { background-color: var( --table-rows-highlight ) !important; }
.neo-table-rows, .content.checked { background-color: color-mix( in srgb, var( --table-rows-highlight ) 40%, transparent) !important; }
.neo-table-footer-rows { box-shadow: 0px -12px 15px -9px var( --primary ) !important; } 
.neo-table-footer { background-color: var( --background-lighter ) !important; border-bottom-color: var( --background-light ) !important; border-top-color: var( --lines ) !important; }
.neo-table-column .search INPUT, .neo-table-column .search SELECT { background-color: var( --input-background ) !important; color: var( --input-font-color ) !important; border: 0; border: var( --border ) !important; font-weight: bold; font-weight: 600; }
.neo-table-column .content INPUT, .neo-table-column .content SELECT { border-bottom-color: var( --lines ) !important; } 
.neo-table-column .content.highlight INPUT, .neo-table-column .content.highlight SELECT { border-bottom-color: white !important; } 
.neo-table-column .content INPUT[disabled] { border-bottom-color: transparent !important; }
.neo-table .neo-table-raci > DIV, .neo-table .neo-table-raci > A { background-color: var( --background-light ) !important; }
.neo-table .neo-table-raci > DIV > DIV, .neo-table .neo-table-raci > A > SPAN { color: var( --font-color ) !important; }
.neo-table-header, .neo-table-column.header.sticky { border-bottom-color: var( --lines ) !important; background: repeating-linear-gradient( var( --background-light ), var( --background-light ) 33px, var( --background-lighter ) 33px, var( --background-lighter ) 79px ); }

/* TABLE NAVIGATION */
.neo-table-navigation { background-color: var( --background-lighter ) !important; }
.neo-table-navigation .center SPAN.number .active { color: var( --table-page-navigation-active ) !important; }
.neo-table-navigation .center SPAN.number .inactive { color: var( --table-page-navigation-inactive ) !important; }
.neo-table-navigation .left .active { color: var( --table-page-navigation-active ) !important; }
.neo-table-navigation .left .inactive { color: var( --table-page-navigation-inactive ) !important; }
.neo-table-navigation .right .active { color: var( --table-page-navigation-active ) !important; }
.neo-table-navigation .right .inactive { color: var( --table-page-navigation-inactive ) !important; }


.page-footer 
{
	background-color: var( --footer-background ) !important;
    border-top-color: var( --lines ) !important; 
    color: var( --footer-font-color ) !important;
}

.scroll-to-top > i { color: var( --primary ) !important; }
.dropdown-menu { background-color: var( --background-lighter ) !important; border-color: var( --lines ) !important; }
.bootstrap-timepicker-widget table td input { background-color: var( --background-lighter ) !important; }
.page-header.navbar .top-menu .navbar-nav > li.dropdown.open .dropdown-toggle,
.page-header.navbar .top-menu .navbar-nav > li.dropdown .dropdown-toggle:hover { background-color: var( --background-lighter ) !important; }
.page-header.navbar .top-menu .navbar-nav > li.dropdown-user > .dropdown-menu > li.title { background-color: var( --background-light ) !important; }
.modal { background-color: var( --background-dialogs ) !important; } 
.modal .modal-header { border-bottom-color: var( --lines ) !important; }
.modal .modal-footer { border-top-color: var( --lines ) !important; }
.page-header.navbar .page-logo .logo-default { filter: invert( var( --logo-invert ) ); }

/* note blocks */
.note.note-info { border-left-width: var( --note-border-width ) !important; background-color: var( --note-info-background ) !important; border-color: var( --note-info-border-color ) !important; color: var( --note-info-font-color ) !important; }
.note.note-warning { border-left-width: var( --note-border-width ) !important; background-color: var( --note-warning-background ) !important; border-color: var( --note-warning-border-color ) !important; color: var( --note-warning-font-color ) !important; }
.note.note-danger { border-left-width: var( --note-border-width ) !important; background-color: var( --note-danger-background ) !important; border-color: var( --note-danger-border-color ) !important; color: var( --note-danger-font-color ) !important; }
.note.note-success { border-left-width: var( --note-border-width ) !important; background-color: var( --note-success-background ) !important; border-color: var( --note-success-border-color ) !important; color: var( --note-success-font-color ) !important; }

/* note blocks, hr */
.note.note-info hr { border-top-color: var( --note-info-border-color ) !important; margin: 15px 0px; }
.note.note-warning hr { border-top-color: var( --note-warning-border-color ) !important; margin: 15px 0px; }
.note.note-danger hr { border-top-color: var( --note-danger-border-color ) !important; margin: 15px 0px; }
.note.note-success hr { border-top-color: var( --note-success-border-color ) !important; margin: 15px 0px; }

.form-group .bordered { border-color: var( --border ) !important; }
.modal .SearchFilter, .modal .DropDownFilter, .modal .MarkAll, .modal .DialogContent { border-color: var( --lines ) !important; }

.modal .odd { background-color: var( --table-rows-odd ) !important; }
.modal .even { background-color: var( --table-rows-even ) !important; }
.modal .highlight { background-color: var( --table-rows-highlight ) !important; }

/* progress bar */
.neo-progress { border: 1px dotted var( --progressbar-border-color ) !important; }
.neo-progress .percent { background-color: var( --progressbar-color ) !important; color: var( --progressbar-font-color ) !important; }

.mst-content { background-color: var( --background-light ) !important; }

.portlet-sortable.navigation { background-color: var( --background-lighter ) !important; color: var( --font-color ) !important; }
.portlet-sortable.navigation.danger 
{ 
	color: var( --note-danger-font-color ) !important; 
	border-color: var( --note-danger-border-color ) !important; 
	background-color: var( --note-danger-background ) !important; 
}

.portlet-sortable.navigation.warning 
{ 
	color: var( --note-warning-font-color ) !important; 
	border-color: var( --note-warning-border-color ) !important; 
	background-color: var( --note-warning-background ) !important; 
}

/* skill filter */
.skill-filter-area { border-color: var( --lines ) !important; background-color: var( --background-dialogs ) !important; }
.skill-filter-component { border-color: var( --lines ) !important; background-color: var( --background-dialogs ) !important; color: var( --primary ) !important; }

.import-profile { border: var( --border ) !important; background-color: var( --background-dialogs ) !important; color: var( --primary ) !important; }

.institution-persons { background-color: var( --background-lighter ) !important; }

.group-collapse .row { border-color: var( --background-lighter ) !important; }
.group-collapse > DIV.form-group { border-color: var( --background-lighter ) !important; }
.group-collapse .menu-items { border-color: var( --background-lighter ) !important; }
.group-header-collapse.heading:before { color: var( --primary ) !important; }


.quotation-summary { border: var( --border ) !important; background-color: var( --background-lighter ) !important; }

.neo-table-gantt.movable .aob.line.working-packages-zero SPAN.horizontal { background-color: var( --working-packages-zero-gantt-color ); }
.neo-table-gantt.movable .aob.line.working-packages-one SPAN.horizontal { background-color: var( --working-packages-one-gantt-color ); }
.neo-table-gantt.movable .aob.line.working-packages-two SPAN.horizontal { background-color: var( --working-packages-two-gantt-color ); }
.neo-table-gantt.movable .aob.line.working-packages-three SPAN.horizontal { background-color: var( --working-packages-three-gantt-color ); }
.neo-table-gantt.movable .aob.line.working-packages-four SPAN.horizontal { background-color: var( --working-packages-four-gantt-color ); }
.neo-table-gantt.movable .aob.line.working-packages-five SPAN.horizontal { background-color: var( --working-packages-five-gantt-color ); }
.neo-table-gantt.movable .aob.line.working-packages-six SPAN.horizontal { background-color: var( --working-packages-six-gantt-color ); }
.neo-table-gantt.movable .aob.line.working-packages-seven SPAN.horizontal { background-color: var( --working-packages-seven-gantt-color ); }
.neo-table-gantt.movable .aob.line.working-packages-eight SPAN.horizontal { background-color: var( --working-packages-eight-gantt-color ); }
.neo-table-gantt.movable .aob.line.working-packages-nine SPAN.horizontal { background-color: var( --working-packages-nine-gantt-color ); }
.neo-table-gantt.movable .aob.line.working-packages-ten SPAN.horizontal { background-color: var( --working-packages-ten-gantt-color ); }
.neo-table-gantt.movable .aob.line.gantt-aob-line-single-color SPAN.horizontal { background-color: var( --gantt-aob-line-single-color ); }

.neo-table-gantt.movable .aob.line.working-packages-zero SPAN.vertical { background-color: var( --working-packages-zero-gantt-color ); }
.neo-table-gantt.movable .aob.line.working-packages-one SPAN.vertical { background-color: var( --working-packages-one-gantt-color ); }
.neo-table-gantt.movable .aob.line.working-packages-two SPAN.vertical { background-color: var( --working-packages-two-gantt-color );  }
.neo-table-gantt.movable .aob.line.working-packages-three SPAN.vertical { background-color: var( --working-packages-three-gantt-color ); }
.neo-table-gantt.movable .aob.line.working-packages-four SPAN.vertical { background-color: var( --working-packages-four-gantt-color ); }
.neo-table-gantt.movable .aob.line.working-packages-five SPAN.vertical { background-color: var( --working-packages-five-gantt-color ); }
.neo-table-gantt.movable .aob.line.working-packages-six SPAN.vertical { background-color: var( --working-packages-six-gantt-color ); }
.neo-table-gantt.movable .aob.line.working-packages-seven SPAN.vertical { background-color: var( --working-packages-seven-gantt-color ); }
.neo-table-gantt.movable .aob.line.working-packages-eight SPAN.vertical { background-color: var( --working-packages-eight-gantt-color ); }
.neo-table-gantt.movable .aob.line.working-packages-nine SPAN.vertical { background-color: var( --working-packages-nine-gantt-color ); }
.neo-table-gantt.movable .aob.line.working-packages-ten SPAN.vertical { background-color: var( --working-packages-ten-gantt-color ); }
.neo-table-gantt.movable .aob.line.gantt-aob-line-single-color SPAN.vertical { background-color: var( --gantt-aob-line-single-color ); }

.neo-table-gantt.movable .aob.line.working-packages-zero SPAN.arrow-left { border-color: transparent var( --working-packages-zero-gantt-color ) transparent transparent; }
.neo-table-gantt.movable .aob.line.working-packages-one SPAN.arrow-left { border-color: transparent var( --working-packages-one-gantt-color ) transparent transparent; }
.neo-table-gantt.movable .aob.line.working-packages-two SPAN.arrow-left { border-color: transparent var( --working-packages-two-gantt-color ) transparent transparent; }
.neo-table-gantt.movable .aob.line.working-packages-three SPAN.arrow-left { border-color: transparent var( --working-packages-three-gantt-color ) transparent transparent; }
.neo-table-gantt.movable .aob.line.working-packages-four SPAN.arrow-left { border-color: transparent var( --working-packages-four-gantt-color ) transparent transparent; }
.neo-table-gantt.movable .aob.line.working-packages-five SPAN.arrow-left { border-color: transparent var( --working-packages-five-gantt-color ) transparent transparent; }
.neo-table-gantt.movable .aob.line.working-packages-six SPAN.arrow-left { border-color: transparent var( --working-packages-six-gantt-color ) transparent transparent; }
.neo-table-gantt.movable .aob.line.working-packages-seven SPAN.arrow-left { border-color: transparent var( --working-packages-seven-gantt-color ) transparent transparent; }
.neo-table-gantt.movable .aob.line.working-packages-eight SPAN.arrow-left { border-color: transparent var( --working-packages-eight-gantt-color ) transparent transparent; }
.neo-table-gantt.movable .aob.line.working-packages-nine SPAN.arrow-left { border-color: transparent var( --working-packages-nine-gantt-color ) transparent transparent; }
.neo-table-gantt.movable .aob.line.working-packages-ten SPAN.arrow-left { border-color: transparent var( --working-packages-ten-gantt-color ) transparent transparent; }
.neo-table-gantt.movable .aob.line.gantt-aob-line-single-color SPAN.arrow-left { border-color: transparent var( --gantt-aob-line-single-color ) transparent transparent; }

.neo-table-gantt.movable .aob.line.working-packages-zero SPAN.arrow-right { border-color: transparent transparent transparent var( --working-packages-zero-gantt-color ); }
.neo-table-gantt.movable .aob.line.working-packages-one SPAN.arrow-right { border-color: transparent transparent transparent var( --working-packages-one-gantt-color ); }
.neo-table-gantt.movable .aob.line.working-packages-two SPAN.arrow-right { border-color: transparent transparent transparent var( --working-packages-two-gantt-color ); }
.neo-table-gantt.movable .aob.line.working-packages-three SPAN.arrow-right { border-color: transparent transparent transparent var( --working-packages-three-gantt-color ); }
.neo-table-gantt.movable .aob.line.working-packages-four SPAN.arrow-right { border-color: transparent transparent transparent var( --working-packages-four-gantt-color ); }
.neo-table-gantt.movable .aob.line.working-packages-five SPAN.arrow-right { border-color: transparent transparent transparent var( --working-packages-five-gantt-color ); }
.neo-table-gantt.movable .aob.line.working-packages-six SPAN.arrow-right { border-color: transparent transparent transparent var( --working-packages-six-gantt-color ); }
.neo-table-gantt.movable .aob.line.working-packages-seven SPAN.arrow-right { border-color: transparent transparent transparent var( --working-packages-seven-gantt-color ); }
.neo-table-gantt.movable .aob.line.working-packages-eight SPAN.arrow-right { border-color: transparent transparent transparent var( --working-packages-eight-gantt-color ); }
.neo-table-gantt.movable .aob.line.working-packages-nine SPAN.arrow-right { border-color: transparent transparent transparent var( --working-packages-nine-gantt-color ); }
.neo-table-gantt.movable .aob.line.working-packages-ten SPAN.arrow-right { border-color: transparent transparent transparent var( --working-packages-ten-gantt-color ); }
.neo-table-gantt.movable .aob.line.gantt-aob-line-single-color SPAN.arrow-right { border-color: transparent transparent transparent var( --gantt-aob-line-single-color ); }

.neo-table-actions.aob I.fa.working-packages-zero { color: var( --working-packages-zero-gantt-color ); }
.neo-table-actions.aob I.fa.working-packages-one { color: var( --working-packages-one-gantt-color ); }
.neo-table-actions.aob I.fa.working-packages-two { color: var( --working-packages-two-gantt-color ); }
.neo-table-actions.aob I.fa.working-packages-three { color: var( --working-packages-three-gantt-color ); }
.neo-table-actions.aob I.fa.working-packages-four { color: var( --working-packages-four-gantt-color ); }
.neo-table-actions.aob I.fa.working-packages-five { color: var( --working-packages-five-gantt-color ); }
.neo-table-actions.aob I.fa.working-packages-six { color: var( --working-packages-six-gantt-color ); }
.neo-table-actions.aob I.fa.working-packages-seven { color: var( --working-packages-seven-gantt-color ); }
.neo-table-actions.aob I.fa.working-packages-eight { color: var( --working-packages-eight-gantt-color ); }
.neo-table-actions.aob I.fa.working-packages-nine { color: var( --working-packages-nine-gantt-color ); }
.neo-table-actions.aob I.fa.working-packages-ten { color: var( --working-packages-ten-gantt-color ); }

.neo-table-gantt.summary.working-packages-zero, .neo-table-gantt.movable.working-packages-zero, .project-plan-arrangement .working-packages-zero { border: 1px solid var( --working-packages-zero-gantt-color ); background-image: linear-gradient(to bottom, var( --working-packages-zero-gantt-color-gradient ), var( --working-packages-zero-gantt-color ) ) }
.neo-table-gantt.summary.working-packages-one, .neo-table-gantt.movable.working-packages-one, .project-plan-arrangement .working-packages-one { border: 1px solid var( --working-packages-one-gantt-color ); background-image: linear-gradient(to bottom, var( --working-packages-one-gantt-color-gradient ), var( --working-packages-one-gantt-color ) ) }
.neo-table-gantt.summary.working-packages-two, .neo-table-gantt.movable.working-packages-two, .project-plan-arrangement .working-packages-two { border: 1px solid var( --working-packages-two-gantt-color ); background-image: linear-gradient(to bottom, var( --working-packages-two-gantt-color-gradient ), var( --working-packages-two-gantt-color ) ) }
.neo-table-gantt.summary.working-packages-three, .neo-table-gantt.movable.working-packages-three, .project-plan-arrangement .working-packages-three { border: 1px solid var( --working-packages-three-gantt-color ); background-image: linear-gradient(to bottom, var( --working-packages-three-gantt-color-gradient ), var( --working-packages-three-gantt-color ) ) }
.neo-table-gantt.summary.working-packages-four, .neo-table-gantt.movable.working-packages-four, .project-plan-arrangement .working-packages-four { border: 1px solid var( --working-packages-four-gantt-color ); background-image: linear-gradient(to bottom, var( --working-packages-four-gantt-color-gradient ), var( --working-packages-four-gantt-color ) ) }
.neo-table-gantt.summary.working-packages-five, .neo-table-gantt.movable.working-packages-five, .project-plan-arrangement .working-packages-five { border: 1px solid var( --working-packages-five-gantt-color ); background-image: linear-gradient(to bottom, var( --working-packages-five-gantt-color-gradient ), var( --working-packages-five-gantt-color ) ) }
.neo-table-gantt.summary.working-packages-six, .neo-table-gantt.movable.working-packages-six, .project-plan-arrangement .working-packages-six { border: 1px solid var( --working-packages-six-gantt-color ); background-image: linear-gradient(to bottom, var( --working-packages-six-gantt-color-gradient ), var( --working-packages-six-gantt-color ) ) }
.neo-table-gantt.summary.working-packages-seven, .neo-table-gantt.movable.working-packages-seven, .project-plan-arrangement .working-packages-seven { border: 1px solid var( --working-packages-seven-gantt-color ); background-image: linear-gradient(to bottom, var( --working-packages-seven-gantt-color-gradient ), var( --working-packages-seven-gantt-color ) ) }
.neo-table-gantt.summary.working-packages-eight, .neo-table-gantt.movable.working-packages-eight, .project-plan-arrangement .working-packages-eight { border: 1px solid var( --working-packages-eight-gantt-color ); background-image: linear-gradient(to bottom, var( --working-packages-eight-gantt-color-gradient ), var( --working-packages-eight-gantt-color ) ) }
.neo-table-gantt.summary.working-packages-nine, .neo-table-gantt.movable.working-packages-nine, .project-plan-arrangement .working-packages-nine { border: 1px solid var( --working-packages-nine-gantt-color ); background-image: linear-gradient(to bottom, var( --working-packages-nine-gantt-color-gradient ), var( --working-packages-nine-gantt-color ) ) }
.neo-table-gantt.summary.working-packages-ten, .neo-table-gantt.movable.working-packages-ten, .project-plan-arrangement .working-packages-ten { border: 1px solid var( --working-packages-ten-gantt-color ); background-image: linear-gradient(to bottom, var( --working-packages-ten-gantt-color-gradient ), var( --working-packages-ten-gantt-color ) ) }

.neo-table-gantt.movable.progress.working-packages-zero { background-image: linear-gradient( 45deg, rgba( 255, 255, 255, 0.5 ) 25%, transparent 25%, transparent 50%, rgba( 255, 255, 255, 0.5 ) 50%, rgba( 255, 255, 255, 0.5 ) 75%, transparent 75%, transparent ), linear-gradient( to bottom, var( --working-packages-zero-gantt-color-gradient ), var( --working-packages-zero-gantt-color ) ) }
.neo-table-gantt.movable.progress.working-packages-one { background-image: linear-gradient( 45deg, rgba( 255, 255, 255, 0.5 ) 25%, transparent 25%, transparent 50%, rgba( 255, 255, 255, 0.5 ) 50%, rgba( 255, 255, 255, 0.5 ) 75%, transparent 75%, transparent ), linear-gradient( to bottom, var( --working-packages-one-gantt-color-gradient ), var( --working-packages-one-gantt-color ) ) }
.neo-table-gantt.movable.progress.working-packages-two { background-image: linear-gradient( 45deg, rgba( 255, 255, 255, 0.5 ) 25%, transparent 25%, transparent 50%, rgba( 255, 255, 255, 0.5 ) 50%, rgba( 255, 255, 255, 0.5 ) 75%, transparent 75%, transparent ), linear-gradient( to bottom, var( --working-packages-two-gantt-color-gradient ), var( --working-packages-two-gantt-color ) ) }
.neo-table-gantt.movable.progress.working-packages-three { background-image: linear-gradient( 45deg, rgba( 255, 255, 255, 0.5 ) 25%, transparent 25%, transparent 50%, rgba( 255, 255, 255, 0.5 ) 50%, rgba( 255, 255, 255, 0.5 ) 75%, transparent 75%, transparent ), linear-gradient( to bottom, var( --working-packages-three-gantt-color-gradient ), var( --working-packages-three-gantt-color ) ) }
.neo-table-gantt.movable.progress.working-packages-four { background-image: linear-gradient( 45deg, rgba( 255, 255, 255, 0.5 ) 25%, transparent 25%, transparent 50%, rgba( 255, 255, 255, 0.5 ) 50%, rgba( 255, 255, 255, 0.5 ) 75%, transparent 75%, transparent ), linear-gradient( to bottom, var( --working-packages-four-gantt-color-gradient ), var( --working-packages-four-gantt-color ) ) }
.neo-table-gantt.movable.progress.working-packages-five { background-image: linear-gradient( 45deg, rgba( 255, 255, 255, 0.5 ) 25%, transparent 25%, transparent 50%, rgba( 255, 255, 255, 0.5 ) 50%, rgba( 255, 255, 255, 0.5 ) 75%, transparent 75%, transparent ), linear-gradient( to bottom, var( --working-packages-five-gantt-color-gradient ), var( --working-packages-five-gantt-color ) ) }
.neo-table-gantt.movable.progress.working-packages-six { background-image: linear-gradient( 45deg, rgba( 255, 255, 255, 0.5 ) 25%, transparent 25%, transparent 50%, rgba( 255, 255, 255, 0.5 ) 50%, rgba( 255, 255, 255, 0.5 ) 75%, transparent 75%, transparent ), linear-gradient( to bottom, var( --working-packages-six-gantt-color-gradient ), var( --working-packages-six-gantt-color ) ) }
.neo-table-gantt.movable.progress.working-packages-seven { background-image: linear-gradient( 45deg, rgba( 255, 255, 255, 0.5 ) 25%, transparent 25%, transparent 50%, rgba( 255, 255, 255, 0.5 ) 50%, rgba( 255, 255, 255, 0.5 ) 75%, transparent 75%, transparent ), linear-gradient( to bottom, var( --working-packages-seven-gantt-color-gradient ), var( --working-packages-seven-gantt-color ) ) }
.neo-table-gantt.movable.progress.working-packages-eight { background-image: linear-gradient( 45deg, rgba( 255, 255, 255, 0.5 ) 25%, transparent 25%, transparent 50%, rgba( 255, 255, 255, 0.5 ) 50%, rgba( 255, 255, 255, 0.5 ) 75%, transparent 75%, transparent ), linear-gradient( to bottom, var( --working-packages-eight-gantt-color-gradient ), var( --working-packages-eight-gantt-color ) ) }
.neo-table-gantt.movable.progress.working-packages-nine { background-image: linear-gradient( 45deg, rgba( 255, 255, 255, 0.5 ) 25%, transparent 25%, transparent 50%, rgba( 255, 255, 255, 0.5 ) 50%, rgba( 255, 255, 255, 0.5 ) 75%, transparent 75%, transparent ), linear-gradient( to bottom, var( --working-packages-nine-gantt-color-gradient ), var( --working-packages-nine-gantt-color ) ) }
.neo-table-gantt.movable.progress.working-packages-ten { background-image: linear-gradient( 45deg, rgba( 255, 255, 255, 0.5 ) 25%, transparent 25%, transparent 50%, rgba( 255, 255, 255, 0.5 ) 50%, rgba( 255, 255, 255, 0.5 ) 75%, transparent 75%, transparent ), linear-gradient( to bottom, var( --working-packages-ten-gantt-color-gradient ), var( --working-packages-ten-gantt-color ) ) }

.neo-table-gantt.summary .left.working-packages-zero { border-left: 6px solid var( --working-packages-zero-gantt-color ); } 
.neo-table-gantt.summary .left.working-packages-one { border-left: 6px solid var( --working-packages-one-gantt-color ); } 
.neo-table-gantt.summary .left.working-packages-two { border-left: 6px solid var( --working-packages-two-gantt-color ); } 
.neo-table-gantt.summary .left.working-packages-three { border-left: 6px solid var( --working-packages-three-gantt-color ); } 
.neo-table-gantt.summary .left.working-packages-four { border-left: 6px solid var( --working-packages-four-gantt-color ); } 
.neo-table-gantt.summary .left.working-packages-five { border-left: 6px solid var( --working-packages-five-gantt-color ); } 
.neo-table-gantt.summary .left.working-packages-six { border-left: 6px solid var( --working-packages-six-gantt-color ); } 
.neo-table-gantt.summary .left.working-packages-seven { border-left: 6px solid var( --working-packages-seven-gantt-color ); } 
.neo-table-gantt.summary .left.working-packages-eight { border-left: 6px solid var( --working-packages-eight-gantt-color ); } 
.neo-table-gantt.summary .left.working-packages-nine { border-left: 6px solid var( --working-packages-nine-gantt-color ); } 
.neo-table-gantt.summary .left.working-packages-ten { border-left: 6px solid var( --working-packages-ten-gantt-color ); } 

.neo-table-gantt.summary .right.working-packages-zero { border-right: 6px solid var( --working-packages-zero-gantt-color ); } 
.neo-table-gantt.summary .right.working-packages-one { border-right: 6px solid var( --working-packages-one-gantt-color ); } 
.neo-table-gantt.summary .right.working-packages-two { border-right: 6px solid var( --working-packages-two-gantt-color ); } 
.neo-table-gantt.summary .right.working-packages-three { border-right: 6px solid var( --working-packages-three-gantt-color ); } 
.neo-table-gantt.summary .right.working-packages-four { border-right: 6px solid var( --working-packages-four-gantt-color ); } 
.neo-table-gantt.summary .right.working-packages-five { border-right: 6px solid var( --working-packages-five-gantt-color ); } 
.neo-table-gantt.summary .right.working-packages-six { border-right: 6px solid var( --working-packages-six-gantt-color ); } 
.neo-table-gantt.summary .right.working-packages-seven { border-right: 6px solid var( --working-packages-seven-gantt-color ); } 
.neo-table-gantt.summary .right.working-packages-eight { border-right: 6px solid var( --working-packages-eight-gantt-color ); } 
.neo-table-gantt.summary .right.working-packages-nine { border-right: 6px solid var( --working-packages-nine-gantt-color ); } 
.neo-table-gantt.summary .right.working-packages-ten { border-right: 6px solid var( --working-packages-ten-gantt-color ); } 

.neo-table-column .content.info { background-color: color-mix(in srgb, var(--note-info-background) 20%, transparent) !important; color: var( --note-info-font-color ) !important; }
.neo-table-column .content.warning { background-color: color-mix(in srgb, var(--note-warning-background) 20%, transparent) !important; color: var( --note-warning-font-color ) !important; }
.neo-table-column .content.danger { background-color: color-mix(in srgb, var(--note-danger-background) 20%, transparent) !important; color: var( --note-danger-font-color ) !important; }
.neo-table-column .content.attention { color: var( --note-danger-font-color ) !important; }
.neo-table-column .content.line-through { color: var( --note-danger-font-color ) !important; text-decoration: line-through !important; }

.neo-table-column .content .marker.working-packages-zero { border-left: 1px solid var( --working-packages-zero-gantt-color ); background: linear-gradient(to right, var( --working-packages-zero-gantt-color-gradient ), var( --working-packages-zero-gantt-color ) ) }
.neo-table-column .content .marker.working-packages-one { border-left: 1px solid var( --working-packages-one-gantt-color ); background: linear-gradient(to right, var( --working-packages-one-gantt-color-gradient ), var( --working-packages-one-gantt-color ) ) }
.neo-table-column .content .marker.working-packages-two { border-left: 1px solid var( --working-packages-two-gantt-color ); background: linear-gradient(to right, var( --working-packages-two-gantt-color-gradient ), var( --working-packages-two-gantt-color ) ) }
.neo-table-column .content .marker.working-packages-three { border-left: 1px solid var( --working-packages-three-gantt-color ); background: linear-gradient(to right, var( --working-packages-three-gantt-color-gradient ), var( --working-packages-three-gantt-color ) ) }
.neo-table-column .content .marker.working-packages-four { border-left: 1px solid var( --working-packages-four-gantt-color ); background: linear-gradient(to right, var( --working-packages-four-gantt-color-gradient ), var( --working-packages-four-gantt-color ) ) }
.neo-table-column .content .marker.working-packages-five { border-left: 1px solid var( --working-packages-five-gantt-color ); background: linear-gradient(to right, var( --working-packages-five-gantt-color-gradient ), var( --working-packages-five-gantt-color ) ) }
.neo-table-column .content .marker.working-packages-six { border-left: 1px solid var( --working-packages-six-gantt-color ); background: linear-gradient(to right, var( --working-packages-six-gantt-color-gradient ), var( --working-packages-six-gantt-color ) ) }
.neo-table-column .content .marker.working-packages-seven { border-left: 1px solid var( --working-packages-seven-gantt-color ); background: linear-gradient(to right, var( --working-packages-seven-gantt-color-gradient ), var( --working-packages-seven-gantt-color ) ) }
.neo-table-column .content .marker.working-packages-eight { border-left: 1px solid var( --working-packages-eight-gantt-color ); background: linear-gradient(to right, var( --working-packages-eight-gantt-color-gradient ), var( --working-packages-eight-gantt-color ) ) }
.neo-table-column .content .marker.working-packages-nine { border-left: 1px solid var( --working-packages-nine-gantt-color ); background: linear-gradient(to right, var( --working-packages-nine-gantt-color-gradient ), var( --working-packages-nine-gantt-color ) ) }
.neo-table-column .content .marker.working-packages-ten { border-left: 1px solid var( --working-packages-ten-gantt-color ); background: linear-gradient(to right, var( --working-packages-ten-gantt-color-gradient ), var( --working-packages-ten-gantt-color ) ) }

.btn.working-packages-zero { background: linear-gradient(to bottom, var( --working-packages-zero-gantt-color-gradient ), var( --working-packages-zero-gantt-color ) ) }
.btn.working-packages-one { background: linear-gradient(to bottom, var( --working-packages-one-gantt-color-gradient ), var( --working-packages-one-gantt-color ) ) }
.btn.working-packages-two { background: linear-gradient(to bottom, var( --working-packages-two-gantt-color-gradient ), var( --working-packages-two-gantt-color ) ) }
.btn.working-packages-three { background: linear-gradient(to bottom, var( --working-packages-three-gantt-color-gradient ), var( --working-packages-three-gantt-color ) ) }
.btn.working-packages-four { background: linear-gradient(to bottom, var( --working-packages-four-gantt-color-gradient ), var( --working-packages-four-gantt-color ) ) }
.btn.working-packages-five { background: linear-gradient(to bottom, var( --working-packages-five-gantt-color-gradient ), var( --working-packages-five-gantt-color ) ) }
.btn.working-packages-six { background: linear-gradient(to bottom, var( --working-packages-six-gantt-color-gradient ), var( --working-packages-six-gantt-color ) ) }
.btn.working-packages-seven { background: linear-gradient(to bottom, var( --working-packages-seven-gantt-color-gradient ), var( --working-packages-seven-gantt-color ) ) }
.btn.working-packages-eight { background: linear-gradient(to bottom, var( --working-packages-eight-gantt-color-gradient ), var( --working-packages-eight-gantt-color ) ) }
.btn.working-packages-nine { background: linear-gradient(to bottom, var( --working-packages-nine-gantt-color-gradient ), var( --working-packages-nine-gantt-color ) ) }
.btn.working-packages-ten { background: linear-gradient(to bottom, var( --working-packages-ten-gantt-color-gradient ), var( --working-packages-ten-gantt-color ) ) }

.neo-table-gantt.movable .legend.working-packages-zero, .project-plan-arrangement .working-packages-zero .working-package { color: var( --working-packages-zero-font-color ); } 
.neo-table-gantt.movable .legend.working-packages-one, .project-plan-arrangement .working-packages-one .working-package { color: var( --working-packages-one-font-color ); } 
.neo-table-gantt.movable .legend.working-packages-two, .project-plan-arrangement .working-packages-two .working-package { color: var( --working-packages-two-font-color ); } 
.neo-table-gantt.movable .legend.working-packages-three, .project-plan-arrangement .working-packages-three .working-package { color: var( --working-packages-three-font-color ); } 
.neo-table-gantt.movable .legend.working-packages-four, .project-plan-arrangement .working-packages-four .working-package { color: var( --working-packages-four-font-color ); } 
.neo-table-gantt.movable .legend.working-packages-five, .project-plan-arrangement .working-packages-five .working-package { color: var( --working-packages-five-font-color ); } 
.neo-table-gantt.movable .legend.working-packages-six, .project-plan-arrangement .working-packages-six .working-package { color: var( --working-packages-six-font-color ); } 
.neo-table-gantt.movable .legend.working-packages-seven, .project-plan-arrangement .working-packages-seven .working-package { color: var( --working-packages-seven-font-color ); } 
.neo-table-gantt.movable .legend.working-packages-eight, .project-plan-arrangement .working-packages-eight .working-package { color: var( --working-packages-eight-font-color ); } 
.neo-table-gantt.movable .legend.working-packages-nine, .project-plan-arrangement .working-packages-nine .working-package { color: var( --working-packages-nine-font-color ); } 
.neo-table-gantt.movable .legend.working-packages-ten, .project-plan-arrangement .working-packages-ten .working-package { color: var( --working-packages-ten-font-color ); } 

.neo-table-gantt.movable .aob.dragger { background-color: var( --working-packages-aob-dragger-color ) !important; }
.neo-table-gantt.movable .aob.dropper {  border-color: var( --working-packages-aob-dropper-color ) !important;  }

/* CALENDAR */
.calendar .start { background-color: var( --background-lighter ) !important; }
.calendar .day.weekdays { background-color: var( --background-lighter ) !important; }
.calendar .day.weekday { background-color: var( --background-light ) !important; }
.calendar .day.weekend { background-color: var( --background-lighter ) !important; }

/* Session CSS Class */
.session-header { background-color: var( --background-lighter ) !important; }
.session-row { background-color: var( --background-light ) !important; }

/* Tender Quotation Overview CSS Class */ 
TABLE.quotation-overview TH  { border-bottom: var( --border ) !important; }
TABLE.quotation-overview TD.summary { border-top-color: var( --lines ) !important; }
TABLE.quotation-overview TD.gross { background-color: var( --background-lighter ) !important; }
TABLE.quotation-overview TD.totals { background-color: var( --background-lighter ) !important; }
TABLE.quotation-overview TD.odd { background-color: var( --table-rows-odd ) !important; }
TABLE.quotation-overview TD.highlight { background-color: var( --table-rows-highlight ) !important; }
TABLE.quotation-overview TD.even { background-color: var( --table-rows-even ) !important; }
TABLE.quotation-overview TD.bordered { border-left: var( --border ) !important; }
TABLE.quotation-overview TH.bordered { border-left: var( --border ) !important; }
TABLE.quotation-overview TR.bordered { border-left: var( --border ) !important; }

.quotation-overview-scrollable::-webkit-scrollbar { background: var( --scroll-webkit-scrollbar ) !important; }
.quotation-overview-scrollable::-webkit-scrollbar-track { background: var( --scroll-webkit-scrollbar-track ) !important; }
.quotation-overview-scrollable::-webkit-scrollbar-thumb { background: var( --scroll-webkit-scrollbar-thumb ) !important; }
.quotation-overview-scrollable::-webkit-scrollbar-thumb:hover { background: var( --scroll-webkit-scrollbar-thumb-hover ) !important; }

/* Dialog Buttons */
.portlet > .portlet-title > .nav-tabs > LI.help > A { color: var( --help ) !important; }
.portlet > .portlet-title > .nav-tabs > LI.help > A > I { color: var( --help ) !important; }
.portlet > .portlet-title > .nav-tabs > LI.help:hover { border-bottom-color: var( --help ) !important; }
.portlet > .portlet-title > .nav-tabs > LI.help > SPAN { color: var( --help-disabled ) !important; }

.caption.breadcrumb .disabled { color: var( --font-color ) !important; }
.portlet-title.tabbable-line.second { background: var( --background-lighter ) !important; }

/* Dashboard Table */
TABLE.dashboard-table TH { border-bottom-color: var( --lines ) !important; }
TABLE.dashboard-table TD { border-bottom-color: var( --lines ) !important; }

/* Annotations CSS Class */
.annotations-task-section { border-color: var( --lines ) !important;  }

/* TASK SUBTASK */
ul.subtask-section li { border-bottom-color: var( --lines ) !important; }

/* releases */
.releases A.versions { color: var( --font-color ) !important; }

/* datepickers */
.datepicker table tr td.disabled, .datepicker table tr td.disabled:hover, .datepicker table td, .datepicker table th { color: var( --font-color ) !important; }
.datepicker .clear { background-color: var( --button-cancel ); color: var( --button-cancel-font-color ) !important; }
.datepicker table tr td.today, 
.datepicker table tr td.today:hover,
.datepicker table tr td.today.disabled,
.datepicker table tr td.today.disabled:hover 
{
	background-color: transparent !important; 
	border: var( --border ) !important; 
}
.datepicker table tr td.today:hover,
.datepicker table tr td.today:hover:hover,
.datepicker table tr td.today.disabled:hover,
.datepicker table tr td.today.disabled:hover:hover,
.datepicker table tr td.today:focus,
.datepicker table tr td.today:hover:focus,
.datepicker table tr td.today.disabled:focus,
.datepicker table tr td.today.disabled:hover:focus,
.datepicker table tr td.today:active,
.datepicker table tr td.today:hover:active,
.datepicker table tr td.today.disabled:active,
.datepicker table tr td.today.disabled:hover:active,
.datepicker table tr td.today.active,
.datepicker table tr td.today:hover.active,
.datepicker table tr td.today.disabled.active,
.datepicker table tr td.today.disabled:hover.active,
.open .dropdown-toggle.datepicker table tr td.today,
.open .dropdown-toggle.datepicker table tr td.today:hover,
.open .dropdown-toggle.datepicker table tr td.today.disabled,
.open .dropdown-toggle.datepicker table tr td.today.disabled:hover 
{
	 background-color: #eeeeee !important;
	 border: var( --border ) !important; 
}

/* dashboard table */
TABLE.dashboard-table{ background: repeating-linear-gradient( var( --table-rows-odd ), var( --table-rows-odd ) 26px, var( --table-rows-even ) 26px, var( --table-rows-even ) 56px ) !important; }

/* placeholder */
.placeholders DIV.row:nth-child(even) { background-color: var( --table-rows-odd ) !important; }
.placeholders DIV.row:nth-child(odd) { background-color: var( --table-rows-even ) !important; }
.placeholders { border: var( --border ) !important; }

.additionals-container { background-color: var( --background-lighter ) !important; border-color: var( --background-lighter ) !important; }
.additionals-container .placeholder { background-color: var( --secondary ) !important; }
.additionals-block { background-color: var( --background ) !important; border-color: var( --background-lighter ) !important; }
.additionals-block .active { background-color: var( --background-lighter ) !important; }

/***********************************************/
/* default context menu ************************/
/* default theme is blue ***********************/
/***********************************************/
.contextmenu .dropdown-toggle, 
.contextmenu A, 
.contextmenu A I 
{ 
	background-color: var( --contextmenu-background-color ) !important; 
	color: var( --contextmenu-foreground-color ) !important;  
} 

.contextmenu .dropdown-toggle[disabled],
.contextmenu A[disabled]
{
	background-color: var( --contextmenu-disabled ) !important; 
	color: var( --contextmenu-disabled-font-color ) !important; cursor: default;
}

.contextmenu .dropdown-toggle:hover,
.contextmenu A:hover,
.contextmenu A:hover I
{
	background-color: var( --contextmenu-hover-background-color ) !important; 
	color: var( --contextmenu-hover-foreground-color ) !important;
}

/***********************************************/
/* save context menu ***************************/
/* default theme is green **********************/
/***********************************************/
.contextSavemenu .dropdown-toggle, 
.contextSavemenu A, 
.contextSavemenu A I 
{ 
	background-color: var( --button-green ) !important; 
	color: var( --button-green-font-color ) !important;  
} 

.contextSavemenu .dropdown-toggle[disabled],
.contextSavemenu A[disabled]
{
	background-color: var( --button-disabled ) !important; 
	color: var( --button-disabled-font-color ) !important; cursor: default;
}

.contextSavemenu .dropdown-toggle:hover,
.contextSavemenu A:hover,
.contextSavemenu A:hover I
{
	background-color: var( --button-green ) !important; 
	color: var( --button-green-font-color ) !important;
}

/***********************************************/
/* delete context menu ***************************/
/* default theme is red **********************/
/***********************************************/
.contextDeleteMenu .dropdown-toggle, 
.contextDeleteMenu A, 
.contextDeleteMenu A I 
{ 
	background-color: var( --button-red ) !important; 
	color: var( --button-red-font-color ) !important;  
} 

.contextDeleteMenu .dropdown-toggle[disabled],
.contextDeleteMenu A[disabled]
{
	background-color: var( --button-disabled ) !important; 
	color: var( --button-disabled-font-color ) !important; cursor: default;
}

.contextDeleteMenu .dropdown-toggle:hover,
.contextDeleteMenu A:hover,
.contextDeleteMenu A:hover I
{
	background-color: var( --button-red ) !important; 
	color: var( --button-red-font-color ) !important;
}

/***********************************************/
/* add context menu ****************************/
/* default theme is blue ***********************/
/***********************************************/
.contextAddMenu .dropdown-toggle, 
.contextAddMenu A, 
.contextAddMenu A I 
{ 
	background-color: var( --button-blue ) !important; 
	color: var( --button-blue-font-color ) !important; 
	text-align: left; 
} 

.contextAddMenu .dropdown-toggle[disabled],
.contextAddMenu A[disabled]
{
	background-color: var( --button-disabled ) !important; 
	color: var( --button-disabled-font-color ) !important; cursor: default;
	text-align: left;
}

/* disabled command link entry */
.contextAddMenu SPAN 
{
	background-color: var( --button-disabled ) !important; 
	color: var( --button-disabled-font-color ) !important; cursor: default; 
	text-align: left !important; display: block !important;
	padding: 5px 30px 5px 10px !important; margin: 0 !important;
}

.contextAddMenu .dropdown-toggle:hover,
.contextAddMenu A:hover,
.contextAddMenu A:hover I
{
	background-color: var( --button-blue ) !important; 
	color: var( --button-blue-font-color ) !important;
	text-align: left;
}

/***********************************************/
/* more context menu ****************************/
/* default theme is purple ***********************/
/***********************************************/
.contextMoreMenu .dropdown-toggle, 
.contextMoreMenu A, 
.contextMoreMenu A I 
{ 
	background-color: var( --button-purple ) !important; 
	color: var( --button-purple-font-color ) !important;
	text-align: left !important; 
} 

.contextMoreMenu .dropdown-toggle[disabled],
.contextMoreMenu A[disabled]
{
	background-color: var( --button-disabled ) !important; 
	color: var( --button-disabled-font-color ) !important; cursor: default; 
	text-align: left !important; 
} 

/* disabled command link entry */
.contextMoreMenu SPAN 
{
	background-color: var( --button-disabled ) !important; 
	color: var( --button-disabled-font-color ) !important; cursor: default; 
	text-align: left !important; display: block !important;
	padding: 5px 30px 5px 10px !important; margin: 0 !important;
}

.contextMoreMenu .InputMessageInfo { /* must explicit have info color */ color: var( --note-info-font-color ) !important; margin-top: -15px !important; text-wrap: auto !important; }
.contextMoreMenu .InputMessageWarning { /* must explicit have warning color */ color: var( --note-warning-font-color ) !important; margin-top: -15px !important; text-wrap: auto !important; }
.contextMoreMenu .InputMessageDanger { /* must explicit have danger color */ color: var( --note-danger-font-color ) !important; margin-top: -15px !important; text-wrap: auto !important; }

.contextMoreMenu .dropdown-toggle:hover,
.contextMoreMenu A:hover,
.contextMoreMenu A:hover I
{
	background-color: var( --button-purple ) !important; 
	color: var( --button-purple-font-color ) !important;  
}

/***********************************************/
/* more context menu ***************************/
/* default theme is yellow *********************/
/***********************************************/
.contextExportMenu .dropdown-toggle, 
.contextExportMenu A, 
.contextExportMenu A I 
{ 
	background-color: var( --button-yellow ) !important; 
	color: var( --button-yellow-font-color ) !important; 
	text-align: left; 
} 

.contextExportMenu .dropdown-toggle[disabled],
.contextExportMenu A[disabled]
{
	background-color: var( --button-disabled ) !important; 
	color: var( --button-disabled-font-color ) !important; cursor: default;
	text-align: left;
}

/* disabled command link entry */
.contextExportMenu SPAN 
{
	background-color: var( --button-disabled ) !important; 
	color: var( --button-disabled-font-color ) !important; cursor: default; 
	text-align: left !important; display: block !important;
	padding: 5px 30px 5px 10px !important; margin: 0 !important;
}

.contextExportMenu .dropdown-toggle:hover,
.contextExportMenu A:hover,
.contextExportMenu A:hover I
{
	background-color: var( --button-yellow ) !important; 
	color: var( --button-yellow-font-color ) !important;
	text-align: left;
}

/***********************************************/
/* filter context menu *************************/
/* default theme is yellow *********************/
/***********************************************/
.contextFilterMenu .dropdown-toggle, 
.contextFilterMenu A, 
.contextFilterMenu A I 
{ 
	background-color: var( --button-cancel ) !important; 
	color: var( --button-cancel-font-color ) !important; 
	text-align: left; 
} 

.contextFilterMenu .dropdown-toggle[disabled],
.contextFilterMenu A[disabled]
{
	background-color: var( --button-disabled ) !important; 
	color: var( --button-disabled-font-color ) !important; cursor: default;
	text-align: left;
}

/* disabled command link entry */
.contextFilterMenu SPAN 
{
	background-color: var( --button-disabled ) !important; 
	color: var( --button-disabled-font-color ) !important; cursor: default; 
	text-align: left !important; display: block !important;
	padding: 5px 30px 5px 10px !important; margin: 0 !important;
}

.contextFilterMenu .dropdown-toggle:hover,
.contextFilterMenu A:hover,
.contextFilterMenu A:hover I
{
	background-color: var( --button-cancel ) !important; 
	color: var( --button-cancel-font-color ) !important;
	text-align: left;
}

.contextFilterMenu .InputMessageInfo { /* must explicit have info color */ color: var( --note-info-font-color ) !important; margin-top: -15px !important; text-wrap: auto !important; }
.contextFilterMenu .InputMessageWarning { /* must explicit have warning color */ color: var( --note-warning-font-color ) !important; margin-top: -15px !important; text-wrap: auto !important; }
.contextFilterMenu .InputMessageDanger { /* must explicit have danger color */ color: var( --note-danger-font-color ) !important; margin-top: -15px !important; text-wrap: auto !important; }

/* project plan settings */
.project-plan-arrangement { background-color: var( --background-lighter ) !important; border-color: var( --background-lighter ) !important; }

.portlet-title .navigation li.active { border-bottom-color: var( --secondary ) !important; }
.portlet-title .navigation li.sub-menu:last-child { background-image: linear-gradient( to right, transparent 0, var( --background-light ) 2em ); }
.portlet-title .navigation-dropdown { background-color: var( --background-lighter ) !important; border-color: var( --secondary ) !important; }

/******** PROJECT CALCULATIONS ***************/
.project-calculations-scrollable::-webkit-scrollbar, .tender-calculations-scrollable::-webkit-scrollbar { background: var( --scroll-webkit-scrollbar ) !important; }
.project-calculations-scrollable::-webkit-scrollbar-track, .tender-calculations-scrollable::-webkit-scrollbar-track { background: var( --scroll-webkit-scrollbar-track ) !important; }
.project-calculations-scrollable::-webkit-scrollbar-thumb, .tender-calculations-scrollable::-webkit-scrollbar-thumb { background: var( --scroll-webkit-scrollbar-thumb ) !important; }
.project-calculations-scrollable::-webkit-scrollbar-thumb:hover, .tender-calculations-scrollable::-webkit-scrollbar-thumb:hover { background: var( --scroll-webkit-scrollbar-thumb-hover ) !important; }

TABLE.project-calculations TH.bordered, TABLE.tender-calculations TH.bordered { border-left: var( --border ) !important; }
TABLE.project-calculations TD.bordered, TABLE.tender-calculations TD.bordered { border-left: var( --border ) !important; }
TABLE.project-calculations TD.bordered-top, TABLE.tender-calculations TD.bordered-top { border-top: var( --border ) !important; }
TABLE.project-calculations TD.resource-header, TABLE.tender-calculations TD.resource-header { background-color: var( --background-lighter ) !important; }
TABLE.project-calculations TR.end-total, TABLE.tender-calculations TR.end-total { background-color: var( --background-lighter ) !important; }
TABLE.project-calculations TD.odd, TABLE.tender-calculations TD.odd { background-color: var( --table-rows-odd ) !important; }
TABLE.project-calculations TD.even, TABLE.tender-calculations TD.even { background-color: var( --table-rows-even ) !important; }
TABLE.project-calculations TD.highlight, TABLE.tender-calculations TD.highlight { background-color: var( --table-rows-highlight ) !important; }
TABLE.project-calculations TR.bordered, TABLE.tender-calculations TR.bordered { border-left: var( --border ) !important; }
TABLE.project-calculations TR.bordered-bottom, TABLE.tender-calculations TR.bordered-bottom { border-bottom: var( --border ) !important; }
TABLE.project-calculations TR.odd, TABLE.tender-calculations TR.odd { background-color: var( --table-rows-odd ) !important; }
TABLE.project-calculations TR.even, TABLE.tender-calculations TR.even { background-color: var( --table-rows-even ) !important; }
TABLE.project-calculations TR.highlight, TABLE.tender-calculations TR.highlight { background-color: var( --table-rows-highlight ) !important; }
SELECT.project-calculations { border-bottom-color: var( --border ) !important; }
SELECT.project-calculations OPTION { background-color: var( --background-light ) !important; }
SELECT OPTION[disabled] { color: var( --disabled ) !important; }
INPUT.project-calculations { border-bottom-color: var( --border ) !important; }
HR.project-calculations, HR.tender-calculations { border-top-color: var( --border ) !important; }

DIV.row DIV.border-right { border-right-color: var( --border ) !important; }

/********* JOURNAL *********/
TABLE.journal-signature TD, TABLE.journal-packages TD { border-bottom: var( --border ) !important; }

.project-configuration-fields { border: var( --border ) !important; background-color: var( --background-lighter ) !important; }

/********* INPUT SUBLINES ********/
.InputMessageInfo { color: var( --note-info-font-color ) !important; }
.InputMessageWarning { color: var( --note-warning-font-color ) !important; }
.InputMessageDanger { color: var( --note-danger-font-color ) !important; }

/**********************************/
/************ VSM *****************/
/**********************************/
.vsm > DIV.dragger { background-color: var( --disabled ) !important; }
.vsm > DIV.dragger.ui-draggable-dragging { background-color: var( --note-danger-border-color ) !important; }
.vsm > DIV#VsmNavigation { background-color: var( --vsm-navigation-background-color ) !important; }
.vsm-spinner { border-color: var( --vsm-navigation-spinner-background-color ) !important; border-top-color: var( --vsm-navigation-spinner-color ) !important; }
.vsm > DIV#VsmResources .link .text { color:  var( --font-color ) !important; }
.vsm > DIV#VsmResources .link .badge { color: var( --button-red-font-color ) !important; background-color: var( --button-red ) !important; }
.vsm-navigation-focus{ color: var( --vsm-navigation-text-color ) !important; }

/***** KANBAN *****/
.kanban-header > DIV, .kanban-container > DIV { background-color: var( --background-lighter ) !important; }
.kanban-items { background-color: var( --background-light ) !important; }
.kanban-items-container.active { border-color: var( --primary ) !important; background-color: var( --kanban-container-active ) !important; }
.kanban-header { background-color: var( --background-light ) !important; }
.kanban-status-slider-tooltip { color: var( --primary ) !important; }
.kanban-items .responsibility-bubble { background-color: var( --background-lighter ) !important; }
.kanban-items .next-step { background-color: var( --note-danger-background ) !important; color: var( --note-danger-font-color ) !important; }
.kanban-items .resources { background-color: var( --note-danger-background ) !important; color: var( --note-danger-font-color ) !important; }
.kanban-items .resources.done { background-color: var( --note-success-background ) !important; color: var( --note-success-font-color ) !important;  }
.kanban-items .workflow-status.done { background-color: var( --note-success-background ) !important; color: var( --note-success-font-color ) !important;  }
.kanban-items .workflow-status.in-progress { background-color: var( --note-info-background ) !important; color: var( --note-info-font-color ) !important; }
.kanban-items .disabled { background-color: var( --note-warning-background ) !important; color: var( --note-warning-font-color ) !important; }
.kanban-status-slider.ui-slider { background-color: var( --kanban-slider ) !important; }
.kanban-status-slider .ui-slider-range { background-color: var( --kanban-slider-range ) !important; }
.kanban-status-slider .ui-slider-handle { background-color: var( --kanban-slider-handle ) !important; }
.kanban-status-slider-tooltip { color: var( --kanban-slider-tooltip ) !important; }
.legend{ color: var( --note-danger-font-color ) !important; }
A.vsm-role { color: var( --note-danger-font-color ) !important; }

.workflow.step, .workflow.step.decision .rhombus, i.workflow.arrow  { border-color: var( --lines ) !important; }
.workflow.step, .workflow.step.decision .rhombus { background-color: var( --background-light ) !important; }
.workflow.step.highlight { background-color: var( --workflow-step-highlight ) !important; }
.workflow.step.selected, .workflow.starter.selected, .workflow.step.decision.selected .rhombus { border-color: var( --workflow-selected-color ) !important;  box-shadow: 0 0 20px 0px var( --workflow-selected-color ) !important; }
.workflow.step.focussed { border-color: var( --button-yellow ) !important; }
.workflow.step.decision { background-color: transparent !important; box-shadow: none !important; }
.workflow.line { background-color: var( --lines ) !important; }
.workflow.step.end { background-color: var( --lines ) !important; }
.workflow.line.intersection { border-color: var( --lines ) !important; }
.workflow.line.selected, .workflow.line.planned.selected { background-color: var( --workflow-selected-color ) !important; border-color: var( --workflow-selected-color ) !important; }
.workflow.arrow.selected, .workflow.arrow.planned.selected { border-color: var( --workflow-selected-color ) !important; }
.workflow.connection { background-color: var( --workflow-dragger-color ) !important; border-color: var( --workflow-dragger-color ) !important; } 
.workflow.connection.endpoint { border-color: var( --lines ) !important; }
.workflow.connection.dragger { background-color: var( --workflow-dragger-color ) !important; }
.worflow.droppable{ background-color: var( --workflow-droppable-color ) !important; }
.workflow.line.processed { background-color: var( --vsm-protospot-workflow-connector-processed ) !important; }
.workflow.line.planned { background-color: var( --vsm-protospot-workflow-connector-planned ) !important; }
.workflow.arrow.processed { border-color: var( --vsm-protospot-workflow-connector-processed ) !important; }
.workflow.arrow.planned { border-color: var( --vsm-protospot-workflow-connector-planned ) !important; }
.workflow.line.disabled.horizontal
{ 
	background: repeating-linear-gradient( 90deg, var( --vsm-protospot-workflow-connector-planned ) 0px, var( --vsm-protospot-workflow-connector-planned ) 5px, var( --vsm-protospot-workflow-connector-planned ) 5px, transparent 5px, transparent 10px ) !important;
}
.workflow.line.disabled.vertical
{ 
	background: repeating-linear-gradient( 0deg, var( --vsm-protospot-workflow-connector-planned ) 0px, var( --vsm-protospot-workflow-connector-planned ) 5px, var( --vsm-protospot-workflow-connector-planned ) 5px, transparent 5px, transparent 10px ) !important;
}
.workflow.step .outdated{ color: var( --workflow-selected-color ) !important; }
.workflow.step.status_processed, .workflow.step.decision .rhombus.status_processed { border-color: var( --vsm-protospot-workflow-connector-processed ) !important; box-shadow: 0 0 20px 0px var( --vsm-protospot-workflow-connector-processed ) !important; }

.page-content.rare DIV.neo-dashboard-section { background-color: var( --background-light ) !important; }

.dashboard-widget { background-color: var( --background-light ) !important;  }
.dashboard-widget-content { border: var( --border ) !important; }
.dashboard-widget-content > .dashboard-widget-settings > SPAN.dropdown > UL.dropdown-menu > LI.has-border { border-bottom: var( --border ) !important; }

.layout-report-issue { border-color: var( --primary ) !important; }
.layout-report-issue > i { color: var( --primary ) !important; }

.bookable-timeslot.timeslot-odd { background-color: var( --table-rows-odd ) !important; }
.bookable-timeslot.timeslot-even { background-color: var( --table-rows-even ) !important; }
.bookable-timeslot.timeslot-highlight { background-color: var( --table-rows-highlight ) !important; }

/**********************************/
/********* STRIPED TABLE **********/
/**********************************/
DIV.sales:nth-child( odd ){ background-color: var( --table-rows-odd ) !important; }
DIV.sales:nth-child( even ) { background-color: var( --table-rows-even ) !important; }
DIV.sales.line { border-top-color: var( --lines ) !important; border-top: 1px solid; }
DIV.sales.bottom-line { border-bottom-color: var( --lines ) !important; border-bottom: 1px solid; }
DIV.sales.highlight { background-color: var( --table-rows-highlight ) !important; }
DIV.sales.current.positive { background-color: var( --table-rows-positive-background ) !important; color: var( --table-rows-positive-foreground ) !important; }
DIV.sales.current.negative { background-color: var( --table-rows-negative-background ) !important; color: var( --table-rows-negative-foreground ) !important; }
DIV.sales.current.balanced { background-color: var( --table-rows-balanced-background ) !important; color: var( --table-rows-balanced-foreground ) !important; }

TABLE.sales TD.actions { border-top-color: var( --lines ) !important; }
TABLE.sales TBODY:nth-child( odd ){ background-color: var( --table-rows-odd ) !important; }
TABLE.sales TBODY:nth-child( even ) { background-color: var( --table-rows-even ) !important; }
TABLE.sales .warning { color: var( --note-warning-font-color ) !important; }
TABLE.sales .highlite { color: var( --note-danger-font-color ) !important; }
TABLE.sales .line { border-top-color: var( --lines ) !important; border-top: 1px solid; }
TABLE.sales .current.positive { background-color: var( --table-rows-positive-background ) !important; color: var( --table-rows-positive-foreground ) !important; }
TABLE.sales .current.negative { background-color: var( --table-rows-negative-background ) !important; color: var( --table-rows-negative-foreground ) !important; }
TABLE.sales .current.balanced { background-color: var( --table-rows-balanced-background ) !important; color: var( --table-rows-balanced-foreground ) !important; }

/**********************************/
/********* BENEFITS TABLE *********/
/**********************************/
TABLE.benefits TR.odd { background-color: var( --table-rows-odd ) !important; }
TABLE.benefits TR.even { background-color: var( --table-rows-even ) !important; }
TABLE.benefits TR.highlight { background-color: var( --table-rows-highlight ) !important; }

/*************************************/
/************* SHOP ******************/
/*************************************/
DIV.shop-container { background-color: var( --background-lighter ) !important; }
DIV.shop-container.category-tree { background-color: var( --background-light ) !important; }
DIV.shop-container A.shop-item { background-color: var( --background-light ) !important; }

/**********************************/
/********* Category Media *********/
/**********************************/
.media-thumbnail-container { background-color: var( --background-light ) !important; }
.media-thumbnail { background-color: var( --background-lighter ) !important;}
.media-thumbnail DIV DIV  { background-color: var( --background-lighter ) !important; }
.page-content.rare .media-thumbnail-footer { border-bottom-color: var( --background-lighter ) !important; }
.media-thumbnail-footer { border-bottom-color: var( --background-light ) !important;  border-top-color: var( --lines ) !important; background-color: var( --background-lighter ); }
DIV.neo-uploader-progress { background-color: var( --progressbar-color ) !important; }
.neo-media-thumbnail.dropover DIV.dropper, DIV.upload-blocker { background-color: var( --disabled ) !important; }

/* THUMBNAIL NAVIGATION */
.neo-thumbnail-navigation { background-color: var( --background-lighter ) !important; }
.neo-thumbnail-navigation .center SPAN.number .active { color: var( --table-page-navigation-active ) !important; }
.neo-thumbnail-navigation .center SPAN.number .inactive { color: var( --table-page-navigation-inactive ) !important; }
.neo-thumbnail-navigation .left .active { color: var( --table-page-navigation-active ) !important; }
.neo-thumbnail-navigation .left .inactive { color: var( --table-page-navigation-inactive ) !important; }
.neo-thumbnail-navigation .right .active { color: var( --table-page-navigation-active ) !important; }
.neo-thumbnail-navigation .right .inactive { color: var( --table-page-navigation-inactive ) !important; }

/* MEMBERSHIP STATUS */
DIV.membership-status DIV.membership-status-details,
DIV.membership-status DIV.membership-status-benefits,
DIV.membership-status DIV.membership-status-benefits-text { border-color: var( --lines ) !important; }

SPAN.cms.status I { color: var( --font-color ) !important; }
SPAN.cms.status.warning I{ color: var( --note-warning-font-color ) !important; }
SPAN.cms.status.danger I{ color: var( --note-danger-font-color ) !important; }
SPAN.cms.status.success I{ color: var( --note-success-font-color ) !important; }

/* no client filter main menus */

/********* VSM RESOURCES *********/
DIV.resource-header > DIV.header, DIV.resource-container > DIV.resource-category { background-color: var( --background-lighter ) !important; }
DIV.resource-container UL.dropdown-menu.resource-category-actions > LI { border-bottom-color: var( --lines ) !important; }

.jstree-node .jstree-roles I { color: var( --note-danger-font-color ) !important; }

/**********************************/
/********* TABLE IN DIALOGS *********/
/**********************************/
.neo-table-dialog-rows 
{ 
	background: repeating-linear-gradient( var( --table-rows-even ), var( --table-rows-even ) 36px, var( --table-rows-odd ) 36px, var( --table-rows-odd ) 72px ) !important; 
	background-attachment: local !important; 
}
.neo-table-dialog-footer { background-color: var( --background-lighter ) !important; border-bottom-color: var( --background-light ) !important; border-top-color: var( --lines ) !important; }
.neo-table-dialog-column { color: var( --font-color ) !important; } 
.neo-table-dialog .neo-table-dialog-rows.neo-table-dialog-scrollbar::-webkit-scrollbar { background: var( --scroll-webkit-scrollbar ) !important; }
.neo-table-dialog .neo-table-dialog-rows.neo-table-dialog-scrollbar::-webkit-scrollbar-track { background: var( --scroll-webkit-scrollbar-track ) !important; }
.neo-table-dialog .neo-table-dialog-rows.neo-table-dialog-scrollbar::-webkit-scrollbar-thumb { background: var( --scroll-webkit-scrollbar-thumb ) !important; }
.neo-table-dialog .neo-table-dialog-rows.neo-table-dialog-scrollbar::-webkit-scrollbar-thumb:hover { background: var( --scroll-webkit-scrollbar-thumb-hover ) !important; }

/****** VSM NAVIGATION CSS ******/
SVG.vsm-svg { background-color: var( --vsm-navigation-background-color ) !important; }
RECT.vsm-dummy-rect { fill: var( --vsm-navigation-background-color ) !important; }

/** System 1 **/
PATH.vsm-s1-arc 
{ 
	fill: var( --vsm-navigation-system1-background-color ) !important; 
	stroke: var( --vsm-navigation-system1-border-color ) !important;
}
TEXT.vsm-s1-arc { fill: var( --vsm-navigation-system1-text-color ) !important; }

/** System 3 **/
CIRCLE.vsm-s3-dummy-circle { fill: var( --vsm-navigation-system3-background-color ) !important; }
PATH.vsm-s3-arc { fill: var( --vsm-navigation-system3-background-color ) !important;  }
CIRCLE.vsm-s3-groups { fill: var( --vsm-navigation-system3-groups-background-color ) !important; }
TEXT.vsm-s3-groups { fill: var( --vsm-navigation-system3-groups-text-color ) !important; }

/** Spot Slides **/
PATH.vsm-spotslide-arc 
{ 
	fill: var( --vsm-navigation-organs-background-color ) !important; 
	stroke: var( --vsm-navigation-organs-border-color ) !important;
}
TEXTPATH.vsm-spotslide-arc, TEXT.vsm-spotslide-counter { fill: var( --vsm-navigation-text-color ) !important; }
CIRCLE.draggable-spot 
{
	fill: var( --vsm-navigation-spots-normal-background-color ) !important; 
	stroke: var( --vsm-navigation-spots-border-color ) !important;
}
CIRCLE.draggable-spot.overdue { fill: var( --vsm-navigation-spots-warning-background-color ) !important; }

/** outside systems **/
RECT.vsm-organs { fill: var( --vsm-navigation-background-color ) !important; }
TEXT.vsm-organs { fill: var( --vsm-navigation-text-color ) !important; }
TEXT.vsm-organs.overdue { fill: var( --vsm-navigation-warning-text-color ) !important; }

/** PARENT/MOTHER **/
CIRCLE.vsm-navigate-parent
{
	fill: var( --vsm-navigation-system-focused-background-color ) !important; 
	stroke: var( --vsm-navigation-system-focused-border-color ) !important;
}
TEXT.vsm-navigate-parent { fill: var( --vsm-navigation-system-focused-text-color ) !important; }

/** dummy shapes **/
CIRCLE.vsm-s3-dummy
{
	fill: var( --vsm-navigation-system3-background-color ) !important; 
	stroke: var( --vsm-navigation-system3-border-color ) !important;
}
CIRCLE.vsm-s1-dummy
{
	fill: var( --vsm-navigation-system1-background-color ) !important; 
	stroke: var( --vsm-navigation-system1-border-color ) !important;
}

/****** HIGHLIGHT EFFECTS ******/
PATH.vsm-s1-arc.droppable-area.active, PATH.vsm-s1-arc.hovered { fill: var( --vsm-navigation-system1-highlight-background-color ) !important; }
CIRCLE.vsm-s3-groups.droppable-area.active, CIRCLE.vsm-s3-groups.hovered { fill: var( --vsm-navigation-system3-groups-highlight-background-color ) !important; }
RECT.vsm-organs.droppable-area.active, RECT.vsm-organs.hovered { fill: var( --vsm-navigation-organs-highlight-color ) !important; }
CIRCLE.vsm-navigate-parent.hovered { fill: var( --vsm-navigation-system-focused-highlight-background-color ) !important; }

/****** RESOURCES EFFECTS ******/
A.resource.btn.default SPAN { color: var( --input-font-color ) !important; }
A.resource.btn.default { background-color: var(--background-light); }

/****** DASHBOARD WIDGETS ******/
.page-content.dashboard { background-color: var( --background ) !important; }
.page-content.dashboard .portlet { background-color: var(--background-light) !important; }
.page-content.dashboard SPAN.widget-title { color: var( --secondary ) !important; }

/* birthdays today widgets */
.page-content.dashboard .portlet DIV.birthdays-container DIV.birthdays-items { background-color: var(--dashboard-birthdays-background ) !important; }

.page-content.dashboard .portlet DIV.birthdays-container DIV.birthdays-items A { color: var(--dashboard-birthdays-font-color ) !important;  }

/* dashboard date filter */
.page-content.dashboard .portlet A.btn-sm.active 
{ 
	background-color: var( --dashboard-date-filter-background ) !important; 
	color: var( --dashboard-date-filter-font-color ) !important;
}

/* event ratings */
DIV.event-ratings-container { border: var( --border ) !important; }


/****** U18 DETAILS SIGNITURE ******/
IMG.u18-signature{ border-color: var( --border ) !important; }

/****** JQUERY UI DIALOG ***********/
.ui-dialog.ui-widget .ui-widget-header { background-color: var( --primary ) !important; border: 0; }
.table-column-dialog .property.columns-highlight{ border-color: var( --danger ) !important; color: var( --danger ) !important; }

/*********************************/
/********* EVENT WIDGETS *********/
/*********************************/
.event-widget .widget-title { color: var( --secondary ) !important; }
TABLE.cashier-summary TR.odd { background-color: var( --table-rows-odd ) !important; }
TABLE.cashier-summary TR.even { background-color: var( --table-rows-even ) !important; }

.form-control.btn.red { background-color: var( --button-red ) !important; }

/*********************************/
/*************** TAG *************/
/*********************************/
.tag .dropdown-menu .btn.btn-sm.yellow { background: var(--button-yellow) !important; }
.tag .dropdown-menu .btn.btn-sm.gray { background: var(--button-cancel) !important; }
.tag .dropdown-menu .btn.btn-sm.red { background: var(--button-red) !important; }
.tag .dropdown-menu .btn.btn-sm.green { background: var(--button-green) !important; }

/*********************************/
/******** ACCOUNTS IBAN **********/
/*********************************/
.form-control.iban.valid { border-color: var( --note-success-border-color ) !important; color: var( --note-success-font-color ) !important; }
.form-control.iban.invalid { border-color: var( --note-danger-border-color ) !important; color: var( --note-danger-font-color ) !important; }
.form-control.iban.background.valid { background-color: var( --note-success-background ) !important; }
.form-control.iban.background.invalid { background-color: var( --note-danger-background ) !important; }

/*********************************/
/******** CLASSIC TOP-MENU *******/
/*********************************/
/* Restore Metronic header dropdown chrome — client.css theme vars + global A { --primary } only. */

BODY:not( .neo-layout-modern ) .page-header.navbar .top-menu .navbar-nav > li.dropdown .dropdown-menu
{
	background-color: #FFFFFF !important;
	border-color: rgba( 0, 0, 0, 0.15 ) !important;
}

BODY:not( .neo-layout-modern ) .page-header.navbar .top-menu .navbar-nav > li.dropdown.open .dropdown-toggle,
BODY:not( .neo-layout-modern ) .page-header.navbar .top-menu .navbar-nav > li.dropdown .dropdown-toggle:hover
{
	background-color: #EEEEEE !important;
}

BODY:not( .neo-layout-modern ) .page-header.navbar .top-menu .navbar-nav > li.dropdown-user > .dropdown-menu > li.title
{
	background-color: #EFEFEF !important;
}

BODY:not( .neo-layout-modern ) .page-header.navbar .top-menu .navbar-nav > li.dropdown .dropdown-menu > li > a,
BODY:not( .neo-layout-modern ) .page-header.navbar .top-menu .navbar-nav > li.dropdown .dropdown-menu > li > a:focus
{
	color: #555555 !important;
}

BODY:not( .neo-layout-modern ) .page-header.navbar .top-menu .navbar-nav > li.dropdown .dropdown-menu > li > a:hover
{
	color: #555555 !important;
	background-color: #F6F6F6 !important;
}

/*********************************/
/******** LAYOUT MODE TOGGLE *****/
/*********************************/
/* Profile dropdown — always loaded (classic + modern); see modern.css §54 for shell chrome */

.page-header.navbar .top-menu .navbar-nav > li.dropdown-user .dropdown-menu > li.neo-layout-toggle-item > A.neo-layout-toggle
{
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 10px !important;
	width: 100% !important;
	box-sizing: border-box !important;
	padding: 8px 16px !important;
	cursor: pointer !important;
	text-decoration: none !important;
	white-space: nowrap !important;
}

.page-header.navbar .top-menu .navbar-nav > li.dropdown-user .dropdown-menu > li.neo-layout-toggle-item > A.neo-layout-toggle:hover,
.page-header.navbar .top-menu .navbar-nav > li.dropdown-user .dropdown-menu > li.neo-layout-toggle-item > A.neo-layout-toggle:focus
{
	text-decoration: none !important;
}

.neo-layout-toggle-item > A.neo-layout-toggle > I.fa-columns
{
	flex: 0 0 16px !important;
	width: 16px !important;
	margin: 0 !important;
	display: block !important;
	text-align: center !important;
	opacity: 0.75 !important;
}

.neo-layout-toggle-item > A.neo-layout-toggle .neo-layout-toggle__text
{
	flex: 1 1 auto !important;
	min-width: 0 !important;
}

.neo-layout-toggle-item > A.neo-layout-toggle .neo-layout-toggle__switch
{
	flex: 0 0 36px !important;
	position: relative !important;
	width: 36px !important;
	height: 20px !important;
	border-radius: 999px !important;
	background: #D1D5DB !important;
	transition: background 0.15s ease !important;
}

.neo-layout-toggle-item > A.neo-layout-toggle .neo-layout-toggle__knob
{
	position: absolute !important;
	top: 2px !important;
	left: 2px !important;
	width: 16px !important;
	height: 16px !important;
	border-radius: 50% !important;
	background: #FFFFFF !important;
	box-shadow: 0 1px 2px rgba( 0, 0, 0, 0.18 ) !important;
	transition: transform 0.15s ease !important;
	transform: translateX( 0 ) !important;
}

.neo-layout-toggle-item > A.neo-layout-toggle.neo-layout-toggle--on .neo-layout-toggle__switch
{
	background: #6BAB3C !important;
}

.neo-layout-toggle-item > A.neo-layout-toggle.neo-layout-toggle--on .neo-layout-toggle__knob
{
	transform: translateX( 16px ) !important;
}

.neo-layout-toggle-item > A.neo-layout-toggle.neo-layout-toggle--off .neo-layout-toggle__switch
{
	background: #D1D5DB !important;
}

.neo-layout-toggle-item > A.neo-layout-toggle.neo-layout-toggle--off .neo-layout-toggle__knob
{
	transform: translateX( 0 ) !important;
}