/* ----------- FONT ------------- */
@font-face {
	font-family: 'FontAwesome';
	font-style: normal;
	font-weight: 900;
	font-display: block;
	src: url("../font/fa-solid-900.woff2") format("woff2"), url("../font/fa-solid-900.ttf") format("truetype");
}

/* ----------- HTML ------------- */

body {
	color: #323232;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 12px;
	margin: 0;
	background-color: #3D579D;
}

a {
	color: #323272;
	text-decoration: none;
}

a, a img, embed, object {
	/*removes border around links and objects*/
	outline: none;
	border: none;
}

ul {
	padding-left: 20px;
	margin: 5px;
}

input, select, textarea {
	/* this is global settings, but does not apply automatically to input*/
	color: #323232;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 12px;
	/* this is to enhance input box */
	border: solid thin #909090;
	padding-top: 1px;
	padding-bottom: 1px;
	padding-left: 4px;
	padding-right: 4px;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
}

input:focus {
	box-shadow: 0 0 5px #aaa;
}

input:disabled {
	border: dotted 1px #B0B0B0;
	color: #909090;
}

h1 {
	font-size: 1.5em;
	font-weight: normal;
	margin: 0px;
}

div {
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
}

table {
	border-collapse: collapse;
	empty-cells: show;
}

td {
	vertical-align: top;
	padding: 0px;
}

/* ----------- GENERAL ------------- */

#mainheader, #mainfooter {
	color: #FFFFFF;
	background-color: #3D579D;
	min-height: 50px;
}

.mainalert {
	position: absolute;
	left: 10px;
	top: 10px;
	color: #FFFFFF;
	background-color: #A0A0A0;
	font-weight: bold;
	padding: 5px;
	display: none;
	z-index: 1;
	width: 350px;
	border: solid 1px #FFFFFF;
}

#mainfooter {
	text-align: center;
	padding-top: 10px;
}

#mainfooter a {
	color: #FFFFFF;
}

.maintitle {
	font-size: 2em;
	text-align: center;
	padding: 5px;
}

.maintitle .logo {
	vertical-align: middle;
	height: 30px;
	padding-right: 20px;
}

.subtitle {
	font-size: 1.5em;
	text-align: center;
	padding: 5px;
}

.maincontent {
	background-color: #FFFFFF;
	padding-left: 15px;
	padding-right: 15px;
	padding-top: 5px;
	padding-bottom: 15px;
	min-height: 500px;
	position: relative; /*for children position absolute*/
}

.e5rightalign {
	text-align: right;
}

.e5centeralign {
	text-align: center;
}

/* ----------- TOOLBOX TABLE ------------- */

.e5tbtable {
	border: solid thin #3D579D;
	background: #FFFFFF;
}

.e5tbtable th {
	padding-left: 5px;
	padding-right: 5px;
	border-top: solid thin #83869d;
	border-left: solid thin #83869d;
	border-right: solid thin #83869d;
	vertical-align: top;
	text-align: center;
	font-weight: normal;
	font-size: 1.2em;
	white-space: nowrap;
}

.e5tbtable tr.e5tbtableeven {
	background-color: #F4F4F4;
	color: #323232;
	height: 25px;
}

.e5tbtable tr.e5tbtableodd {
	background-color: #E0E0E0;
	color: #323232;
	height: 25px;
}

.e5tbtable tr.e5tbtablefilter td {
	border-left: solid thin #83869d;
	border-right: solid thin #83869d;
	text-align: center;
}

.e5tbtable tr.e5tbtablefilter input, .e5tbtable tr.e5tbtablefilter select {
	background-color: #FFFFFF;
}

.e5tbtablefilteron, .e5tbtabledelfilters .ui-button-text {
	background-color: #CBCBE7;
}

.e5tbtable .e5tbtablecontentfromto {
	background-color: #FFFFFF;
}

.e5tbtable .e5tbtablecontentfromto label {
	margin-right: 5px;
}

.e5tbtable .e5tbtablehead th {
	white-space: nowrap;
}

.e5tbtable .e5tbtablehead th .e5tbtablecolname {
	display: inline-block;
}

.e5tbtabftnowrap {
	white-space: nowrap;
	padding-bottom: 2px;
}

.e5tbtablepage {
	display: inline-block;
	height: 25px;
	text-align: center;
	vertical-align: middle;
	padding: 5px;
	margin-left: 2px;
	margin-right: 2px;
	/*border: solid thin #a0d8ef;*/
	background-color: #A0D8EF;
	color: #323232;
}

.e5tbtablepage.active {
	/*border: solid thin #edd9af;*/
	background-color: #e6faff;
}

.e5tbtablepagetitle {
	display: inline-block;
	margin-right: 10px;
}

.e5tbtable tr.e5tbtableodd.e5tbtabledrop, .e5tbtable tr.e5tbtableeven.e5tbtabledrop {
	border: solid 2px #081F53;
}

.e5tbtable td .ui-spinner {
	width: 50px;
}

.e5tbtablecolorfilter {
	border: solid 1px #808080;
	box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.4); /*horiz verti [blur] [spread] [color] ["inset"]*/
}

.e5tbtablecolor {
	border: solid 1px #808080;
}

.e5tbtable tr.e5tbtableselectedline {
	background-color: #EBD3B2;
}

.e5tbtable tr.e5tbtablefilter .e5tbtablecontentfromto {
	display: inline-block;
	position: relative;
	border: solid thin #e8e8e8;
}

.e5tbtable tr.e5tbtablefilter .e5tbtablecontentfromto label {
	position: absolute;
	left: 2px;
	top: 1px;
	font-size: 0.8em;
	color: #909090;
}

.e5tbtable tr.e5tbtablefilter .e5tbtablecontentfromto input,
.e5tbtable tr.e5tbtablefilter .e5tbtablecontentfromto select {
	margin-left: 5px;
	margin-top: 12px;
	border: none;
}

.e5tbtable tr.e5tbtablefilter .e5tbtablecontentfromto .ui-spinner {
	margin-left: 5px;
	margin-top: 12px;
	width: 70px;
}

.e5tbtable tr.e5tbtablefilter .e5tbtablecontentfromto .ui-spinner input {
	margin: 0;
}

/* ----------- MULTISELECT ------------- */

/* here we find css difficult to put in toolbox */

.e5msselectbox:hover {
	border-bottom: solid 1px #B0B0B0 !important;
}

.e5mscheckboxes .e5msbuttons .e5msvalidate:hover {
	background-color: #5275d3 !important;
}

.e5mscheckboxes .e5msbuttons .e5mscancel:hover, .e5mscheckboxes .e5msbuttons .e5msselectall:hover,
.e5mscheckboxes .e5msbuttons .e5msselectnone:hover, .e5mscheckboxes .e5msbuttons .e5msshowinactive:hover,
.e5mscheckboxes .e5msicoclearsearch:hover {
	background-color: #B0B0B0 !important;
	color: #FFFFFF;
}

.e5mscheckboxes .e5msbox:hover {
	background-color: #636363 !important;
	color: #FFFFFF !important;
}

.e5mscheckboxes .e5msbuttons .e5msshowinactive.shown {
	color: #0075FF;
}

/* ----------- MONTHPICKER ------------- */

/* here we find css difficult to put in toolbox */

.e5tbmonthmain:hover {
	border-bottom: solid 1px #B0B0B0 !important;
}

.e5tbmonths .e5tbmonthitems .e5tbmonthitem:hover {
	background-color: #F0F0F0 !important;
}

.e5tbmonths .e5tbmonthitems .selected {
	border: solid 2px #000000;
}

.e5tbmonths .e5tbmonthbuttons .e5tbmonthvalidate:hover {
	background-color: #5275d3 !important;
}

.e5tbmonths .e5tbmonthbuttons .e5tbmonthcancel:hover {
	background-color: #B0B0B0 !important;
	color: #FFFFFF;
}

/* ----------- TOOLBOX FORM ------------- */

.e5tbform td, .e5tbform th {
	padding: 5px;
	vertical-align: middle;
	text-align: left;
}

.e5tbformrequired:after {
	font-family: FontAwesome;
	font-size: 10px;
	color: #FF0000;
	content: "\F069";
	padding-left: 5px;
}

.e5tbform td input, .e5tbform td select {
	width: 100%;
	min-width: 100px;
	max-width: 400px;
}

.e5tbform td textarea {
	width: 100%;
	min-width: 100px;
}

.e5tbform td input[type='checkbox'], .e5tbform td input[type='radio'] {
	width: 20px;
	min-width: 20px;
}

.e5tbformrbgroup, .e5tbformcbgroup {
	white-space: nowrap;
	display: inline-block;
	padding-right: 20px;
}

.e5tbformremotelist {
	padding: 2px;
	border: solid thin #555555;
	background-color: #A0A0A0;
}

.e5tbformremotelist .e5tbformremoteitem {
	padding: 5px;
}

.e5tbformremotelist .e5tbformremoteitem.e5tbformodd {
	background-color: #F4F4F4;
}

.e5tbformremotelist .e5tbformremoteitem.e5tbformeven {
	background-color: #E0E0E0;
}

.e5tbformuploadbut {
	border: solid thin #131150;
	background-color: #E6E3FF;
	display: inline-block;
	padding: 5px;
}

.e5tbformuploadlab {
	display: inline-block;
	padding: 5px;
	vertical-align: top;
}

.e5tbformuploadlab img {
	max-width: 100px;
	max-height: 100px;
}

.e5tbform td.e5tbformlabelcell {
	color: #909090;
}

/* ----------- MODAL ------------- */

.ui-dialog-buttonpane {
	/* for wait on modal dialog */
	min-height: 50px;
}

.e5tbmodalbutvalidate .ui-button-text,
.e5tbmodalbutadd .ui-button-text,
.e5tbmodalbutok .ui-button-text {
	background-color: #3D579D;
	color: #FFFFFF;
}

/* ----------- MISC ------------- */

.projcode {
	color: #aa7561;
	display: inline-block;
	font-style: italic;
}


.ui-slider {
	border: solid 1px #3D579D;
	background-color: #e6edff;
}

.ui-state-default.ui-slider-handle:hover {
	background-color: #FFFFFF;
	cursor: pointer;
}

.ui-state-default.ui-slider-handle {
	border: solid 1px #3D579D;
	background-color: #e6edff;
}

.ui-slider.ui-state-disabled {
	opacity: 0.7;
}

.ui-slider.absent {
	border: solid 1px #ab670c;
	background-color: #fff9f2;
}

.absent .ui-state-default.ui-slider-handle {
	border: solid 1px #ab670c;
	background-color: #fff9f2;
}

.absent .ui-state-default.ui-slider-handle:hover {
	background-color: #FFFFFF;
	cursor: pointer;
}

.ui-slider.taskslider {
	border: solid 1px #8D8D8D;
	background-color: #e0e0e0;
}

.taskslider .ui-state-default.ui-slider-handle {
	border: solid 1px #8D8D8D;
	background-color: #e0e0e0;
}

.taskslider .ui-state-default.ui-slider-handle:hover {
	background-color: #FFFFFF;
	cursor: pointer;
}

.e5pagebreak {
	height: 1px;
	background-color: #404040;
	margin-top: 100px;
	margin-bottom: 10px;
}

.donecheck {
	display: inline-block;
	cursor: pointer;
	background: #FFFFFF;
	border: #FFFFFF;
	border-radius: 5px;
	color: #323232;
	padding: 3px;
	margin: 0 0 0 6px;
}

.donecheck:hover {
	background: #F0F0F0;
}

.donecheck img {
	height: 20px;
	vertical-align: middle;
}

/* ----------- TOOLBARS ------------- */

.pagetoolbars {
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 10px;
}

.pagetoolbars .e5tbtoolbarbutton {
	padding: 5px;
	font-family: FontAwesome;
	font-size: 25px;
	cursor: pointer;
	width: 35px;
	height: 35px;
	color: #FFFFFF;
}

.pagetoolbars .toolbarbuttondisable {
	background-color: #FFFFFF;
	padding: 5px;
	font-family: FontAwesome;
	font-size: 25px;
	cursor: pointer;
	width: 35px;
	height: 35px;
	color: #9D9D9D;
}

.pagetoolbars .e5tbtoolbarbutton:hover {
	opacity: 0.7;
}

#accounttoolbar {
	position: absolute;
	top: 5px;
	right: 5px;
}

#accounttoolbar #accountname {
	font: inherit;
	font-size: inherit;
	width: inherit;
	padding-top: 10px;
}

.pagetoolbars.inpage {
	position: absolute;
	top: 10px;
	left: 10px;
	background-color: #3D579D;
}

/* ----------- TIME ------------- */

#timeprevmonth, #timenextmonth {
	display: inline-block;
	vertical-align: middle;
	font-family: FontAwesome;
	font-size: 1.6em;
	margin-left: 10px;
	margin-right: 10px;
	color: #3D579D;
	cursor: pointer;
}

#timeprevmonth:hover, #timenextmonth:hover {
	opacity: 0.7;
}

#timecurmonth {
	width: 200px;
	overflow: visible;
	display: inline-block;
}

#timegroupdiv {
	display: none;
}

#timegroupdivinner {
	display: flex;
	height: 580px;
	flex-direction: column;
}

#timegroupdivinner #timegroupdivbody {
	flex: 1 1 auto;
	overflow: auto;
}

#timegroupextendbox {
	width: 15px;
}

#timegroupextend {
	width: 25px;
}

#timegroupdate {
	border: none;
	background: none;
	padding: 0 20px 0 0;
	font-weight: bold;
}

#timegrouptotaldiv {
	font-weight: bold;
	color: #009900;
	background-color: #dcf4de;
	margin: 3px 0 5px 0;
	padding: 3px 0 3px 0;
	text-align: center;
}

#timegrouptotaldiv.underhundred {
	background-color: #f0caf4;
	color: #AA00AA;
}

#timegrouptotaldiv.overhundred {
	background-color: #f0faf4;
	color: #00BB00;
}

#timegroupfiltersdiv {
	display: flex;
	align-items: center;
	padding-bottom: 5px;
}

#timegroupfiltersdiv .sep {
	flex: 1 1 auto;
}

#timegroupcommentdiv {
	width: 350px;
	text-align: center;
}

#timegroupreset, #timegroupprioritysel, #timegroupcustomersel {
	margin-right: 10px;
}

#timegroupdivtable {
	width: 100%;
	border: none;
}

#timegroupdivtable tr {
	height: 25px;
}

#timegroupdivtable td {
	vertical-align: middle;
	padding: 2px;
}

#timegroupdivtable td.label {
	text-align: right;
}

#timegroupdivtable td.value {
	text-align: left;
	white-space: nowrap;
}

#timegroupdivtable td.value .slider {
	width: 150px;
	white-space: nowrap;
	display: inline-block;
	margin-left: 10px;
	margin-right: 15px;
	margin-bottom: 3px;
}

#timegroupdivtable td.value .slider.absent {
	width: 130px;
}

#timegroupdivtable td.value .taskslider {
	height: 4px;
	border-color: #8D8D8D;
}

#timegroupdivtable td.value .slider.slideoverhundred {
	background-color: #ff0000;
	color: #ffffff;
}


#timegroupdivtable td.value .display {
	display: inline-block;
	font-size: 0.8em;
	color: #909090;
	width: 25px;
}

#timegroupdivtable td.value .sumpast {
	display: inline-block;
	color: #909090;
	font-family: FontAwesome;
	cursor: default;
}

#timegroupdivtable td.value .timecommentbut {
	display: inline-block;
	width: 20px;
	margin: 1px 0 0 5px;
}

#timegroupdivtable td.label .inbillimg {
	vertical-align: middle;
	margin-right: 5px;
}

#timegroupdivtable td.value input {
	width: 270px;
}

#timegroupdivtable td.value #timegroupextend {
	width: 30px;
}

#timegroupdivtable tr.customer td {
	padding: 5px;
	background-color: #A0A0A0;
	color: #FFFFFF;
	font-size: 1.2em;
}

#timegroupdivtable tr.customer td .custname {
	display: inline-block;
}

#timegroupdivtable tr.customer td .custcomment {
	display: inline-block;
	margin-left: 20px;
	color: #F0F0F0;
}

#timegroupdivtable .taskname {
	white-space: normal;
	padding: 3px;
	display: inline-block;
	color: #8D8D8D;
}

#timegroupdivtable tr.js-project.even, #timegroupdivtable tr.js-task.even {
	background-color: #F4F4F4;
}

#timegroupdivtable tr.js-project.odd, #timegroupdivtable tr.js-task.odd {
	background-color: #E0E0E0;
}


#timegroupdivtable .projname {
	display: inline-block;
}

#timegroupdivtable .projpriority {
	display: inline-block;
	border-radius: 2px;
	border: solid thin #C0C0C0;
	font-size: 0.8em;
	padding: 1px;
}

#timegroupdivtable .projpriority_p0 {
	background-color: #FFAAAA;
}

#timegroupdivtable .projpriority_p1 {
	background-color: #FFE0D0;
}

#timegroupdivtable .projpriority_p2 {
	background-color: #E0FFE0;
}

#timegroupdivtable .projpriority_p3 {
	background-color: #D0D0D0;
}

.calendaritem {
	min-width: 100px;
	width: 100px;
	height: 100px;
	text-align: center;
	vertical-align: middle;
	border: solid thin #B0B0B0;
	position: relative;
	cursor: pointer;
	overflow: hidden;
}

.calendaritem.outmonth {
	background-image: url(../img/outmonth.png);
	background-repeat: repeat;
}

.calendaritem .day {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	background-color: #E0E0FF;
}

.calendaritem .content {
	font-size: 0.8em;
}

.calendaritem.dropday {
	font-weight: bold;
}

#timetabcal {
	position: relative;
}

#timetabcal .dragday {
	position: absolute;
	cursor: pointer;
}

#timetabcal .dragday:hover {
	opacity: 0.7;
}


#timetabcal .infoday {
	position: absolute;
	cursor: pointer;
}

#timetabcal .infoday:hover {
	opacity: 0.7;
}

#timeprojsummarytd, #timeprojsummary {
	width: 500px;
}

#timeprojsummary table.projsummary {
	width: 100%;
}

table.projsummary td {
	padding: 5px;
	border: solid thin #B0B0B0;
	color: #3D579D;
}

table.projsummary tr.absent td {
	color: #9d591a;
}

.timetablefiltersline {
	display: flex;
	margin-bottom: 10px;
}

.timetablefiltersline #timetablerazbut {
	margin-left: 10px;
}

.timetablefiltersline #timtf_customer, .timetablefiltersline #timtf_project {
	width: 100px;
}

.timetable {
	border: solid 1px #3D579D;
}

.timetable tr.odd {
	background-color: #F4F4F4;
}

.timetable tr.even {
	background-color: #EFEFEF;
}

.timetable td, .timetable th {
	padding: 10px;
}

.timetable th {
	text-align: left;
}

.timetable tr.clickable {
	cursor: pointer;
}

.timetable tr.clickable:hover {
	background-color: #DEDEDE;
}

.timetable tr.newday {
	border-top: solid 3px #000000;
}

.timetable tr.cls_T {
	color: #8D8D8D;
}

#timeotheruserdialinner {
	display: flex;
	flex-direction: column;
}

#timeotheruserdialinner .timeotherbut {
	flex: 1;
	margin: 2px;
}

#timeotheruserdialinner .timeotherbut span {
	text-align: left;
}

#timeotheruserdialinner .timeotherbut.inactive span {
	color: #909090;
}

#timeforuser {
	font-size: 1.2em;
	color: #FF0000;
}

.timeotheruser #timetabcal, .timeotheruser #timetabtable {
	background-color: #FADDDD;
}

/* ---------- RUNNING ------------*/

.runningtable {
	border: solid 1px #3D579D;
}

.runningtable tr.odd {
	background-color: #F4F4F4;
}

.runningtable tr.even {
	background-color: #EFEFEF;
}

.runningtable td, .runningtable th {
	padding: 10px;
}

.runningtable th {
	text-align: left;
}

.runningtable td.time, .runningtable td.users {
	text-align: right;
}

.runningtable .runningdetailbut {
	display: inline-block;
	font-family: FontAwesome;
	margin-left: 5px;
	cursor: pointer;
	padding: 2px 5px 2px 5px;
	border-radius: 5px;
	background-color: #FFFFFF;
	font-size: 0.8em;
}

.runningtable .runningdetailbut:hover {
	background-color: #DDDDDD;
}

.runningtable td .withfix {
	color: #FF0000;
}

.runningtable tr.newcustomer {
	border-top: solid 3px #000000;
}


.runningtable table.catfactutable {
	width: 100%;
}

.runningtable table.catfactutable td, .runningtable table.catfactutable th {
	padding: 2px;
	text-align: center;
	border: dotted 1px #909090;
}

.runningtable table.catfactutable td.real {
	text-align: right;
}

#runningline {
	display: flex;
}

#runningline #runningrazbut {
	margin-left: 10px;
}

.runningright {
	padding: 0 0 0 10px;
}

.runningright #detailtoolbar {
	display: flex;
	flex-direction: row;
	align-items: center;
}

.runningright #detailtoolbar div {
	margin-right: 10px;
	display: flex;
	flex-direction: row;
	align-items: center;
}

.runningright #detailtoolbar label {
	text-align: right;
}

#detailrun #detailruntabs {
	position: sticky;
	top: 0;
}

#detailrun table.runninguserdetail td {
	border: solid 1px #B0B0B0;
	padding: 5px;
}

#detailrun table.runninguserdetail tr.header {
	font-weight: bold;
}

#detailrun table.runninguserdetail tr.cls_T {
	background-color: #E0E0E0;
	color: #707070;
}


/* ----------- CRA ------------- */

#cracurmonth {
	width: 400px;
	overflow: visible;
	display: inline-block;
}


#crachooseuser option {
	padding: 3px;
	font-size: 1.1em;
}

#crachooseuser option:hover {
	background-color: #F0F0FF;
	cursor: pointer;
}

.cramaintable {
	width: 100%;
}

.cramaintable td {
	padding: 5px;
}

.cratable {
	width: 100%;
}

.cratable > tbody > tr > td {
	border: solid thin #B0B0B0;
	padding: 5px;
}

.cratable > tbody > tr > td .percent {
	display: inline-block;
}

.cratable > tbody > tr > td .custname {
	display: inline-block;
	font-size: 0.8em;
	color: #606060;
}

.cratable > tbody > tr > td .projtaskstitle {
	text-decoration: underline;
}

.cratable > tbody > tr > td .projtasks {
	padding-left: 20px;
	color: #8D8D8D;
}

.cratable > tbody > tr > td .projitem .sep {
	height: 1px;
	border: solid 1px #E0E0E0;
	margin: 5px 20px 5px 20px;
}

.cratable > tbody > tr.totalmonth {
	font-size: 1.2em;
	font-weight: bold;
	color: #000077;
}


#crachoosedatediv {
	text-align: center;
}

#crasummary {
	min-width: 200px;
}

#craprevmonth, #cranextmonth {
	display: inline-block;
	vertical-align: middle;
	font-family: FontAwesome;
	font-size: 1.6em;
	margin-left: 10px;
	margin-right: 10px;
	color: #3D579D;
	cursor: pointer;
}

#craprevmonth:hover, #cranextmonth:hover {
	opacity: 0.7;
}

.cracustomerheader {
	color: #3D579D;
	border: solid 1px #3D579D;
	min-height: 50px;
	padding: 10px;
	margin-bottom: 20px;
}

.cracustomerheadertable {
	width: 100%;
}

.cracustomertitle {
	font-size: 2em;
}

.cracustomermonthtitle {
	font-size: 1.2em;
	margin-top: 5px;
}

.cracomment {
	border: solid 1px #3D579D;
	height: 200px;
	width: 250px;
	padding: 10px;
}

.crasign {
	width: 250px;
}

.crasign td {
	border: solid 1px #3D579D;
	height: 100px;
}

.crabottom {
	font-size: 0.7em;
	color: #707070;
	text-align: center;
}

/* ----------- ID LIST ------------- */

.idlistmain {
	height: 600px;
}

.idlistmain td {
	border: solid thin #D1D1D1;
	padding: 5px;
}

.idlistseldiv, .idlistitemdiv {
	border: solid 2px #F1F1F1;
	overflow: auto;
	padding: 5px;
}

.idlistseldiv {
	width: 200px;
	height: 550px;
}

.idlistseltable td {
	white-space: nowrap;
}

.idlistaddsel {
	margin-left: 5px;
}

.idlistaddsel span.ui-button-text {
	font-family: FontAwesome;
	font-size: 1.2em;
	color: #3D579D;
	padding: 3px 6px 3px 6px;
}

.idlistdelseltd {
	width: 16px;
}

.idlistdelsel {
	font-family: FontAwesome;
	font-size: 1.2em;
	color: #FF0000;
	display: inline-block;
}

.idlistitemdiv {
	width: 630px;
	height: 580px;
}

.idlistitemtable, .idlistseltable {
	width: 100%;
}

.idlistitemtable td, .idlistitemtable th, .idlistseltable td, .idlistseltable th {
	padding: 5px;
}

.idlistitemtable tr.odd, .idlistseltable tr.odd {
	background-color: #EAEAEA;
}

.idlistitemtable tr.even, .idlistseltable tr.even {
	background-color: #DADADA;
}

.idlistitemtable tr, .idlistseltable tr {
	cursor: pointer;
}

.idlistitemtable tr:hover, .idlistseltable tr:hover {
	background-color: #C5C5C5;
}

.idlistitemtable tr.checked, .idlistseltable tr.checked {
	background-color: #AAFFAA;
}

.idlistitemtable tr.checked:hover, .idlistseltable tr.checked:hover {
	background-color: #C5FFC5;
}

/* ----------- USER ------------- */

.userprojtable, .uservalidtable {
	width: 100%;
}

.userprojtable td, .userprojtable th,
.uservalidtable td, .uservalidtable th {
	padding: 5px;
}

.userprojtable tr.odd, .uservalidtable tr.odd {
	background-color: #EAEAEA;
}

.userprojtable tr.even, .uservalidtable tr.even {
	background-color: #DADADA;
}

.userprojtable tr, .uservalidtable tr {
	cursor: pointer;
}

.userprojtable tr:hover, .uservalidtable tr:hover {
	background-color: #C5C5C5;
}

.userprojtable tr.checked:hover, .uservalidtable tr.checked:hover {
	background-color: #C5FFC5;
}

.userprojtable tr.checked, .uservalidtable tr.checked {
	background-color: #AAFFAA;
}

.userprojfiltersdiv {
	display: flex;
	align-items: center;
}

#projectsformreset, #projectsformproj, #projectsformcust {
	margin-right: 5px;
}

.uservalfiltersdiv {
	display: flex;
	align-items: center;
}

#valsformreset, #valsformuser {
	margin-right: 5px;
}

/* ----------- PROJECT ------------- */

.projectusertable {
	width: 100%;
}

.projectusertable td, .projectusertable th {
	padding: 5px;
}

.projectusertable tr.odd {
	background-color: #EAEAEA;
}

.projectusertable tr.even {
	background-color: #DADADA;
}

.projectusertable tr {
	cursor: pointer;
}

.projectusertable tr:hover {
	background-color: #C5C5C5;
}

.projectusertable tr.checked:hover {
	background-color: #C5FFC5;
}

.projectusertable tr.checked {
	background-color: #AAFFAA;
}

.projectuserfiltersdiv {
	display: flex;
	align-items: center;
}

#usersformreset, #usersformuser {
	margin-right: 5px;
}

#duplicateforminner table td {
	padding: 5px;
}

.assignbuttons {
	margin-bottom: 5px;
}

.projectform #updateformusercat {
	margin-left: 10px;
}

.projectform #updateformusercat input {
	width: 35px;
	min-width: 35px;
}

.projectform table {
	width: 100%;
}

/* ----------- PROJECT ASSIGNMENTS ------------- */

#assmaintable {
	width: 100%;
}

#assmaintable > tbody > tr > td {
	padding: 10px 10px 10px 10px;
}

#assmaintable td#left, #assmaintable td#right {
	width: 50%;
}

#assmaintable td#horizsep {
	width: 1px;
	background-color: #888888;
	padding: 1px;
}

#assmaintable #searchleft .e5tbform, #assmaintable #searchright .e5tbform {
	/*height: 100px;*/
}

#assmaintable #searchleft td.e5tbformlabelcell, #assmaintable #searchright td.e5tbformlabelcell {
	width: 150px;
}

#assmaintable #searchleft td input[type="text"], #assmaintable #searchright td input[type="text"] {
	width: 180px;
	padding: 5px;
}

#assmaintable #searchright .e5tbform {
	width: inherit;
}

#assmaintable .vertisep {
	height: 20px;
}

#assmaintable #assignsave {
	background-color: #FF0000;
	color: #FFFFFF;

}

.assigntable {
	width: 100%;
}

.assigntable td, .assigntable th {
	padding: 5px;
}

.assigntable tr.odd {
	background-color: #EAEAEA;
}

.assigntable tr.even {
	background-color: #DADADA;
}

.assigntable tr {
	cursor: pointer;
}

.assigntable tr:hover {
	background-color: #C5C5C5;
}

.assigntable tr.checked:hover {
	background-color: #C5FFC5;
}

.assigntable tr.checked {
	background-color: #AAFFAA;
}

/* ----------- UPDATE DATA ------------- */

.updateform {
	display: none;
}

/* ----------- REPORT ------------- */

.reptable {
	border: solid 1px #3D579D;
	min-width: 800px;
}

.reptable tr.odd {
	background-color: #F4F4F4;
}

.reptable tr.even {
	background-color: #EFEFEF;
}

.reptable td, .reptable th {
	padding: 10px;
}

.reptable td.label, .reptable th.label {
	text-align: left;
}

.reptable td.valueright, .reptable th.valueright {
	text-align: right;
}

.reptable tr.newcustomer {
	border-top: solid 3px #000000;
}

.reptable tr.total {
	font-weight: bold;
}

.reptable tr.total.customer {
	border-top: dashed 2px #A0A0A0;
}

.reptable tr.total.general {
	border-top: solid 3px #000000;
	background-color: #C0C0C0;
}

.reptable td.newproject {
	border-top: solid 1px #000000;
}

.reptable td.userdetail {
	font-style: italic;
	color: #808080;
	white-space: nowrap;
}

.reptable td.userdetail .clickableuser {
	cursor: pointer;
	color: #3D579D;
}

.reptable .reportdetailbut {
	display: inline-block;
	font-family: FontAwesome;
	margin-left: 5px;
	cursor: pointer;
	padding: 2px 5px 2px 5px;
	border-radius: 5px;
	background-color: #FFFFFF;
	font-size: 0.8em;
}

.reptable .reportdetailbut:hover {
	background-color: #DDDDDD;
}

.reptable .withfix {
	color: #FF0000;
}

.reptable .reportcatfactutr {
	height: 50px;
}

.reptable .reportusercatfactutable td, .reptable .reportusercatfactutable th {
	padding: 2px;
	text-align: center;
	border: dotted 1px #909090;
}

.reptable .reportusercatfactutable td.real {
	text-align: right;
}

.reptable .reportusercatfactuchange, .reptable .reportusercatfactuclose {
	font-family: FontAwesome;
}

.reptable img.inbillimg {
	vertical-align: middle;
	margin-left: 5px;
}

.reptabletip td {
	padding: 3px;
	border: solid 1px #808080;
}

#reportform input[type="text"] {
	width: 40px;
}

#reportform #repf_customer, #reportform #repf_project {
	width: 100px;
}

#reportline {
	display: flex;
}

#reportline #reportrazbut {
	margin-left: 10px;
}

#reportform .userbut {
	font-family: FontAwesome;
	font-size: 1.6em;
	cursor: pointer;
	display: inline-block;
}

#reportform .usercnt {
	display: inline-block;
	padding: 0 5px 5px 0;
}

#customerrep .formerror {
	font-size: 1.2em;
	color: #FF0000;
}

.reportright {
	padding: 0 0 0 10px;
}

.reportright #detailtoolbar {
	display: flex;
	flex-direction: row;
	align-items: center;
}

.reportright #detailtoolbar div {
	margin-right: 10px;
	display: flex;
	flex-direction: row;
	align-items: center;
}

.reportright #detailtoolbar label {
	text-align: right;
}

#detailrep #detailreptabs {
	position: sticky;
	top: 0;
}

#detailrep table.reportuserdetail td {
	border: solid 1px #B0B0B0;
	padding: 5px;
}

#detailrep table.reportuserdetail tr.header {
	font-weight: bold;
}

#detailrep table.reportuserdetail tr.cls_T {
	background-color: #E0E0E0;
	color: #707070;
}

table#fixreport td, table#fixreport th {
	border: solid 1px #B0B0B0;
	padding: 5px;
}

table#fixreport td.monthname {
	background-color: #EFEFEF;
}

table#fixreport td.value {
	text-align: right;
}

table#fixreport td.summonth, table#fixreport td.sumuser {
	text-align: right;
}

table#fixreport td.summonth {
	font-weight: bold;
}

table#fixreport td.updator {
	font-style: italic;
	color: #808080;
	font-size: 0.9em;
}

#repuserfixtitle {
	text-align: center;
	font-size: 1.4em;
	font-weight: bold;
	border-bottom: solid thin #B0B0B0;
	padding-bottom: 3px;
	margin-bottom: 10px;
}

#repuserfixtitle .prevmonth {
	color: #FF0000;
}

table#repuserfixtable {
	width: 100%;
}

table#repuserfixtable td, table#repuserfixtable th {
	border: solid 1px #B0B0B0;
	padding: 5px;
}

table#repuserfixtable .fixprojs {
	width: 350px;
}

table#repuserfixtable input.value {
	text-align: right;
	width: 40px;
}

table#repuserfixtable input.comment {
	width: 270px;
}

table#repuserfixtable td.totalvalue {
	text-align: right;
	padding-right: 10px;
}

table#repuserfixtable td.totalvalue.alert {
	color: #FF0000;
	font-size: 1.2em;
	font-weight: bold;
}

table#repuserfixtable td.totalvalue.balance {
	color: #006600;
}

table#repuserfixtable td.deletecol {
	text-align: center;
}

table#repuserfixtable .deletebut, table#repuserfixtable #addbut {
	font-family: FontAwesome;
	font-size: 1.2em;
	cursor: pointer;
	display: inline-block;
	padding: 3px;
}

table#repuserfixtable .deletebut:hover, table#repuserfixtable #addbut:hover {
	background-color: #EFEFEF;
}

table#repuserfixtable .deletebut {
	color: #FF0000;
}

table#repuserfixtable #addbut {
	color: #3D579D;
}


/* ----------- VACREPORT ------------- */

#vacrepcurmonth {
	width: 400px;
	overflow: visible;
	display: inline-block;
}

#vacrepheader {
	display: flex;
	flex-direction: row;
	align-items: center;
}

#vacrepshownow {
	font-size: 1.2em;
	font-weight: bold;
	padding: 0 0 0 20px;
}

#vachistshowdiff {
	margin: 0 0 0 20px;
}

#vacreptable table td, #vacreptable table th {
	border: solid thin #B0B0B0;
	padding: 5px;
}

#vacreptable table td.value {
	text-align: right;
	max-width: 50px;
	width: 50px;
}

#vacreptable table td.value.date {
	text-align: left;
	max-width: 60px;
	width: 60px;
}

#vacreptable table td.value.date.old {
	color: #FF0000;
}

#vacreptable table td.value.absentitem {
	background-color: #F0F0FF;
}

#vacreptable table td.value.empty {
	color: #FF0000;
}

#vacreptable table tr:hover, #vacreptable table tr:hover td.value.absentitem {
	background-color: #D0D0D0
}

#vacreptable tr.inactive {
	color: #909090;
}

#vacreptable td.name {
	white-space: nowrap;
	cursor: context-menu;
}

#vacreptable td.name .inactiveicon {
	display: inline-block;
	vertical-align: middle;
	font-family: FontAwesome;
	padding-left: 5px;
	color: #A05050;
}

#vacrepchoosedatediv {
	text-align: center;
}

#vacrepprevmonth, #vacrepnextmonth {
	display: inline-block;
	vertical-align: middle;
	font-family: FontAwesome;
	font-size: 1.6em;
	margin-left: 10px;
	margin-right: 10px;
	color: #3D579D;
	cursor: pointer;
}

#vacrepprevmonth:hover, #vacrepnextmonth:hover {
	opacity: 0.7;
}

#vacdiffdialinner {
	margin: 10px;
}

#vacdifftable td, #vacdifftable th {
	border: solid thin #B0B0B0;
	padding: 5px;
}

#vacdifftable .username {
	font-weight: bold;
	background-color: #E0E0E0;
	text-align: center;
}

#vacdifftable .jh {
	text-align: right;
}

/* ---------- SCHEDULED ------------*/

#schedtaskfilter {
	background-color: #F0F0FF;
}

#schedtaskfilter table {
	margin-left: auto;
	margin-right: auto;
}

#e5tbtabft_tsk_id_project {
	max-width: 300px;
}

#schedtasks {
	border: solid thin #3D579D;
}

.schedtaskstab {
	width: 100%;
	font-size: 1em; /*chrome extends font size in table!*/
}

.schedtaskstab td, .schedtaskstab th {
	padding: 2px 5px 2px 5px;
	border-bottom: solid thin #F0F0F0
}

.schedtaskstab tr:hover {
	background-color: #F0F0F0;
}

.schedtaskstab th {
	text-align: left;
}

.schedtaskstab .actionth {
	width: 20px;
}

.schedtaskstab td .actiondel {
	font-family: FontAwesome;
	font-size: 1.2em;
	vertical-align: middle;
	cursor: pointer;
}

.schedtaskstab td .actiondel {
	color: #AA0000;
}

.schedtaskstab td .taskid {
	background-color: #F0F0F0;
	border: solid 1px #A0A0A0;
	color: #808080;
	border-radius: 10px;
	padding-left: 5px;
	padding-right: 5px;
	font-size: 0.9em;
	margin-top: 2px;
	text-align: center;
}

#schedtaskstoolbar {
	float: left;
}

#schedtaskstoolbar .e5tbtoolbarbutton {
	font-family: FontAwesome;
	font-size: 1.6em;
	vertical-align: middle;
	cursor: pointer;
	color: #3D579D;
	margin-left: 10px;
}

#schedtaskstoolbar .e5tbtoolbarbutton:hover {
	opacity: 0.7;
}

.schedtaskstab input.taskname {
	width: 300px;
}

.schedtaskstab textarea.taskcomment {
	width: 300px;
	height: 60px;
}

.schedtaskstab .authdisable {
	background-color: #F0F0F0;
}

.schedtaskstab select.authdisable {
	color: #808080;
}

.schedtaskstab input.taskjhinit, .schedtaskstab input.taskjhremain {
	width: 50px;
}

.schedtaskstab input.taskdelivdate {
	width: 80px;
}

.schedtaskstab tr.selectedtask {
	background-color: #FF0000;
}

#schedassign {
	border: solid thin #3D579D;
}

#schedends table {
	font-size: 1em; /*chrome extends font size in table!*/
}

#schedends td, #schedends th {
	padding: 5px;
}

#schedends th {
	text-align: left;
}

#schedends td.emptycol {
	width: 15px;
}

#schedends td .delivicon {
	font-family: FontAwesome;
	font-size: 1.6em;
	vertical-align: middle;
	margin-left: 20px;
}

#schedends tr {
	border: solid thin #D3DEFD;
}

#schedends tr:hover {
	background-color: #F0F0F0;
}

#schedtip {
	width: 400px;
	height: 200px;
	background-color: #FFFFFF;
	border: solid 2px #808080;
	padding: 10px;
	border-radius: 10px;
	display: none;
	position: absolute;
	left: 0px;
	top: 0px;
	overflow: hidden;
}

#scheddatestoolbar {
	float: left;
}

#scheddatestoolbar .e5tbtoolbarbutton {
	font-family: FontAwesome;
	font-size: 1.6em;
	vertical-align: middle;
	cursor: pointer;
	color: #3D579D;
	margin-left: 10px;
}

#scheddatestoolbar .e5tbtoolbarbutton:hover {
	opacity: 0.7;
}

/* ---------- TEAM VIEW ------------*/

#teamviewtable .teamviewtop {
	background: #F0F0F0;
}

#teamviewtable table td.username {
	padding: 3px 20px 3px 3px;
	font-size: 1.1em;
}

#teamviewtable table td.day {
	width: 15px;
	height: 23px;
}

#teamviewtable table td.day .barwork {
	background-color: #8EDA8E;
}

#teamviewtable table td.day .barover {
	background-color: #E1FFE1FF;
}

#teamviewtable table td.day .barover::before {
	content: "*";
	color: #FF0000;
	padding-left: 5px;
}

#teamviewtable table td.day .barabsent {
	background-color: #A0A0A0;
}

#teamviewtable table td.day .barempty {
	background-color: #FF0000;
}


#teamviewtable table td {
	border: solid 1px #C0C0C0;
}

#teamviewtable table td.firstofmonth {
	border-left: solid 1px #909090;
}

#teamviewtable table td.weekend {
	background: repeating-linear-gradient(
		-45deg,
		#FFFFFF,
		#FFFFFF 5px,
		#C0C0C0 8px
	);
}

#teamviewtable table tr:hover {
	background: #F5F5F5;
}

#teamviewtable table td.daynumber {
	font-size: 0.8em;
	text-align: center;
}

.teamviewmonthname {
	position: absolute;
	border-left: solid 1px #000000;
	padding-left: 3px;
	white-space: nowrap;
}

.teamviewtoday {
	position: absolute;
	z-index: 1;
	width: 1px;
	height: 1px;
	overflow: visible;
	font-family: FontAwesome;
	font-size: 1.6em;
	cursor: default;
}

.teamviewcontrol {
	text-align: center;
}

#teamviewprevmonth, #teamviewnextmonth {
	display: inline-block;
	vertical-align: middle;
	font-family: FontAwesome;
	font-size: 1.6em;
	margin-left: 10px;
	margin-right: 10px;
	color: #3D579D;
	cursor: pointer;
}

#teamviewprevmonth:hover, #teamviewnextmonth:hover {
	opacity: 0.7;
}


#teamviewfilter {
	display: inline-block;
	vertical-align: middle;
}

#teamviewfilter .e5tbformlabelcell {
	display: none;
}

#teamviewlist table td {
	padding: 3px;
	border: solid 1px #C0C0C0;
}

#teamviewlist table td.lefthead, #teamviewlist table td.righthead {
	text-align: center;
	font-weight: bold;
}

#teamviewlist table .username {
	border: solid 1px #C0C0C0;
	padding: 5px;
	background-color: #E0E0E0;
}


/* ---------- VACANT VIEW ------------*/

.vacantusertitle {
	font-size: 1.3em;
	text-decoration: underline;
	font-weight: bold;
	margin-top: 20px;
}

.vacantprojecttitle {
	font-size: 1.2em;
	font-weight: bold;
	margin-top: 20px;
}

.vacanttotaljh {
	font-weight: bold;
	font-size: 1.2em;
}

#vacantrejectcomment {
	width: 300px;
}

#vaccurmonth {
	width: 400px;
	overflow: visible;
	display: inline-block;
}

#vacchooseuser option {
	padding: 3px;
	font-size: 1.1em;
}

#vacchooseuser option:hover {
	background-color: #F0F0FF;
	cursor: pointer;
}

#vacchoosedatediv {
	text-align: center;
}

#vacprevmonth, #vacnextmonth {
	display: inline-block;
	vertical-align: middle;
	font-family: FontAwesome;
	font-size: 1.6em;
	margin-left: 10px;
	margin-right: 10px;
	color: #3D579D;
	cursor: pointer;
}

#vacprevmonth:hover, #vacnextmonth:hover {
	opacity: 0.7;
}

.vacmaintable > tbody > tr > td {
	padding: 10px;
}

#vacviewtable {
	min-width: 400px;
}

#vacviewtable .vacanttabsep {
	background-color: #A0A0A0;
	width: 10px;
}

#vacviewtable .vacanttab td, .vacanttab th {
	padding: 3px;
	text-align: center;
	border: solid 1px #C0C0C0;
}

#vacviewtable .vacanttab tr.deleted {
	font-style: italic;
	color: #808080;
	text-decoration: line-through;
	background-color: #F0F0F0;
}

#vacviewtable .vacanttab tr.validated {
	background-color: #F0FFF0;
}

#vacviewtable .vacanttab tr.rejected {
	background-color: #FFF0F0;
}

#vacviewtable .vacanttab td.others {
	text-align: left;
}

/* ---------- VACANT DOCUMENTS ------------*/

#vacdocupdateforminner .e5tbformlabelcell {
	width: 100px;
}

#vacdocupdateforminner #upvd_startdate, #vacdocupdateforminner #upvd_enddate {
	width: 150px;
}

/* ---------- PROFILE ------------*/

#profileform, #profilepassform {
	display: none;
}

#profilechangepassbut {
	margin-top: 20px;
}

#profileforminner td.e5tbformlabelcell {
	min-width: 100px;
	height: 20px;
}

#profileforminner td.e5tbformvaluecell {
	width: 300px;
}

/* ---------- LOCK ------------*/

#locktable td {
	padding: 10px;
}

.lockmonthname {
	height: 40px;
	width: 200px;
	padding: 5px;
	margin: 2px;
	font-size: 1.2em;
	border: solid 1px #909090;
	text-align: center;
	display: inline-block;
	border-radius: 5px;
	background-color: #CCFFCC;
}

.lockmonthname.limit {
	border: solid 3px #880000;
	color: #880000;
	font-weight: bold;
}

.lockmonthname.locked {
	background-color: #FFCCCC;
}

.lockmonthname div {
	padding-top: 6px;
}

.lockmonthname.clickable span {
	padding: 0;
}

.lockmonthname.clickable:hover {
	background-color: #FFEAEA;
}

#lockemptyusers {
	margin: 10px;
	padding: 10px;
	border: solid 1px #A0A0A0;
}