body {
	margin: 0;
	padding-left: 0 !important;
	padding-right: 0 !important;
	background: #fff;
	font-family: "Open Sans", sans-serif;
	color: #111;
	height: 100%;
	min-height: 110%;
	font-size: 100%;
}
body::after {
	position: absolute;
	width: 0;
	height: 0;
	overflow: hidden;
	z-index: -1;
	content: url(/images/a60.png);
}
img {
	max-width: 100%;
}
.mobileOnly {
	display: none;
}
.mobileOnlyReports {
	display: none;
}
.quantitiesRow .mobileOnlyReports {
	display: inline-block;
	font-weight: bold;
	margin-right: 3px;
}
#menuBoxes .menuBox.mobileOnly {
	display: none;
}
div.stickyHeader {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: auto;
	height: 100px;
	text-align: right;
	padding: 0 2%;
	background: #fff;
	z-index: 9999;
	transition: height 200ms linear;
	-webkit-transition: height 200ms linear;
}
div#menuButton {
	position: fixed;
	top: 0;
	text-align: center;
	right: 2%;
	z-index: 1600;
	cursor: pointer;
}
div#menuButton>i {
	font-size: 2em;
	margin-top: 10px;
	color: #0000b2;
	transition: all 200ms ease-out;
	-webkit-transition: all 200ms ease-out;
	transform: rotate(0deg);
}
div#menuButton.open>i {
	transition: all 200ms ease-out;
	-webkit-transition: all 200ms ease-out;
	transform: rotate(180deg);
	color: #d1d1d1;
}
div#menuButton.open>i:hover {
	color: #fff;
}
.menuText {
	color: #0000b2;
	font-weight: bold;
	font-size: .8em;
}
div#menuButton.open>.menuText {
	color: #d1d1d1;
}
div.stickyHeader a.menuLogo {
	float: left;
	width: 576px;
	text-align: left;
	transition: all 200ms linear;
	-webkit-transition: all 200ms linear;
	height: 80px;
	background-image: url(/images/ags-acm.png);
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
	max-height: 100%;
}
/* div.stickyHeader #mainMenu {
    margin-top: 45px;
    float: right;
    width: 72%;
    transition: margin-top 200ms linear;
    -webkit-transition: margin-top 200ms linear;
}
div.stickyHeader.affix #mainMenu {
    margin-top: 18px;
    transition: margin-top 200ms linear;
    -webkit-transition: margin-top 200ms linear;
}
*/
.stickyHeader.affix {
	height: 56px;
	transition: height 200ms linear;
	-webkit-transition: height 200ms linear;
	border-bottom: 2px solid #bbb;
}
div.stickyHeader.affix a.menuLogo {
	width: 55px;
	height: 55px;
	background-image: url(/images/a60.png);
	transition: all 200ms linear;
	-webkit-transition: all 200ms linear;
}
.notificationDiv, .errorDiv {
	transition: max-height 200ms linear;
	-webkit-transition: max-height 200ms linear;
	background: #eeff84;
	padding: 2px 2% 1px 2%;
	height: auto;
	overflow: hidden;
	color: #6c5812;
	width: 100%;
	margin-left: -2%;
}
.notificationDiv {
	background: #eeff84;
	color: #6c5812;
}
.errorDiv {
	background: #ff0000;
	color: #fff;
}
.notificationDiv.error {
	background: #ff0000;
	color: #fff;
}
.notificationDiv.hide, .errorDiv.hide {
	transition: max-height 200ms linear;
	-webkit-transition: max-height 200ms linear;
	max-height: 0px;
	border: 0 none;
	padding: 0 2%;
}
div#notification, div#error {
	font-weight: bold;
	text-align: center;
	font-size: .9em;
}
div#closeNote, div#closeError {
	float: right;
	cursor: pointer;
}
div#closeError {
	color: #fff;
}
div#closeNote {
	color: #6c5812;
}
.notificationDiv.error div#closeNote {
	color: #fff;
}
.mainWrapper {
	padding-top: 110px;
}
.mainWrapper.blurScren {
    filter: blur(4px);
}
h1#hrTitle,
h1#scheduleTitle {
	font-size: 1.7em;
	padding: 5px 2%;
	color: darkblue;
	margin-bottom: 0;
	background: #ddd;
	margin-top: 2px;
}

h1>i {
	margin-right: 4px;
	font-size: 0.9em;
}
.addEmpButton,
.addEquipmentButton,
.addScheduleButton,
.newMessageButton,
.schedViewOptions,
.newTicketButton {
	float: right;
	margin: 12px 2% 0 0;
}
.blueButton {
	background: #0000ff;
	padding: 3px 6px;
	font-size: 0.9em;
	color: #eee;
	cursor: pointer;
	font-weight: bold;
}
.blueButton>i {
	font-size: 0.8em;
	vertical-align: middle;
	padding-right: 4px;
}
.submitRow .blueButton {
	padding: 4px 6px 2px;
}
.orangeButton {
	background: orange;
	padding: 3px 6px;
	font-size: 0.9em;
	color: darkblue;
	cursor: pointer;
	font-weight: bold;
}
.orangeButton>i {
	font-size: 0.9em;
	padding-right: 4px;
}
.greyButton {
	background: #999;
	padding: 3px 6px;
	font-size: 0.9em;
	color: #eee;
	cursor: pointer;
	font-weight: bold;
}
.greyButton>i {
	font-size: 0.8em;
	vertical-align: middle;
	padding-right: 4px;
}
.greyButton:hover {
	opacity: 0.8;
}
.clearButton {
	background: transparent;
	padding: 3px 6px;
	font-size: 0.9em;
	color: #aaa;
	cursor: pointer;
	font-weight: bold;
	border: 3px solid #aaa;
}
.clearButton>i {
	font-size: 1em;
	margin: 0 4px 0 0;
}
.clearButton:hover {
	color: #888;
	border: 3px solid #888;
}
.redButton {
	background: #b30000;
	padding: 3px 6px;
	font-size: 0.9em;
	color: #eee;
	cursor: pointer;
	font-weight: bold;
}
div#projects a.empDocLink>i {
	margin: 0 0 0 4px;
}
.smallGreyButton {
	background: #eee;
	padding: 2px 5px;
	font-size: 0.8em;
	color: #aaa;
	cursor: pointer;
	font-weight: bold;
	border: 2px solid #aaa;
}
.smallGreyButton:hover {
	color: #888;
	border: 2px solid #888;
}
.smallGreyButton>i {
	margin-right: 4px;
}
.clearBlueButton {
	background: transparent;
	padding: 3px 6px;
	font-size: 0.9em;
	color: #0000ff;
	cursor: pointer;
	font-weight: bold;
	border: 3px solid #0000ff !important;
}
.clearBlueButton:hover {
	color: #000;
	border: 3px solid #000 !important;
}
.smallCearBlueButton {
	background: transparent;
	padding: 1px 3px;
	font-size: 0.8em;
	color: #0000ff;
	cursor: pointer;
	font-weight: bold;
	border: 2px solid #0000ff;
}
.smallCearBlueButton:hover {
	color: #000;
	border: 2px solid #000;
}
.centered {
	text-align: center;
}
.employeeRow.empActiveno .clearButton {
	color: #888;
	border: 2px solid #888;
}
.employeeRow.empActiveno .clearButton:hover {
	color: #666;
	border: 2px solid #666;
}
.addApplicantForm.hide,
.addContractorForm.hide,
.addEmployeeForm.hide,
.addEquipmentForm.hide,
.addArchitectForm.hide,
.addVendorForm.hide,
.popupForm.hide,
.addScheduleForm.hide {
	transition: all 200ms linear;
	-webkit-transition: all 200ms linear;
	max-height: 0;
	border: 0 none;
	padding: 0;
}
.addApplicantForm input,
.addApplicantForm select,
.addApplicantForm textarea,
.addContractorForm input,
.addContractorForm select,
.addContractorForm textarea,
.addVendorForm input,
.addVendorForm select,
.addVendorForm textarea,
.addArchitectForm input,
.addEmployeeForm input,
.addEmployeeForm select,
.addEmployeeForm textarea,
.popupForm input,
.popupForm select,
.popupForm textarea,
.addEquipmentForm input,
.addEquipmentForm select,
.addEquipmentForm textarea,
.addScheduleForm input,
.addScheduleForm select,
.addScheduleForm textarea {
	border-right: 0 none;
	border-top: 0 none;
	border-left: 0 none;
	border-bottom: 1px solid #333;
	background: #eee;
	max-width: 76%;
}
a#addApplicantClose,
a#addEquipmentClose,
a#addScheduleClose,
a#addUserClose,
a#terminateFormClose {
	float: right;
	color: #ff0000;
	font-size: 1.5em;
	cursor: pointer;
	margin-top: -4px;
}
.deleteOption {
	margin-left: 4px;
	color: #ff0000;
	font-size: 1em;
	cursor: pointer;
}
.flexFormFields {
	display: flex;
}
.flexFormFields>div {
	width: 100%;
}
.flexFormFields>div.fieldContainer.widthAuto {
	width: auto;
}
.width100 {
	width: 100%;
	max-width: 100%;
}
#terminateForm .width100 {
	max-width: 100%;
}
.inlineBlockFormFields {
	width: 100%;
	text-align: center;
}
.inlineBlockFormFields>div {
	display: inline-block;
	margin: 0 10px;
}
.inlineBlockFormFields>div.center {
	vertical-align: bottom;
}
.inlineBlockFormFields>div.center>a#submitProject {
	padding: 1px 6px;
}
.addEmployeeForm label,
.addEquipmentForm label,
.popupForm label,
.addScheduleForm label {
	display: block;
}
.addApplicantForm h3,
.addContractorForm h3,
.addArchitectForm h3,
.addEmployeeForm h3,
.addVendorForm h3,
.popupForm h3,
.addEquipmentForm h3,
.addScheduleForm h3 {
	margin: 0 0 10px;
	text-align: center;
}
.fieldContainer.center {
	text-align: center;
}
.addApplicantForm .flexFormFields,
.addContractorForm .flexFormFields,
.addVendorForm .flexFormFields,
.addArchitectForm .flexFormFields,
.addEmployeeForm .flexFormFields,
.popupForm .flexFormFields,
.addEquipmentForm .flexFormFields,
.addScheduleForm .flexFormFields {
	margin-bottom: 20px;
}
.lightOverlay {
	transition: opacity 500ms linear;
	-webkit-transition: opacity 500ms linear;
	z-index: -1;
	opacity: 0;
	position: fixed;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	background: rgba(255, 255, 255, .7);
}
.lightOverlay.show {
	transition: all 500ms linear;
	-webkit-transition: all 500ms linear;
	z-index: 999;
	opacity: 1;
}
.spinner {
	position: fixed;
	top: 30%;
	text-align: center;
	width: 100%;
	z-index: 99999;
	left: 0;
}
.spinnerSmall {
	text-align: center;
	width: 100%;
	z-index: 99999;
}
.spinner img {
	height: 140px;
	padding: 0 0 20px;
}
.spinnerSmall img {
	height: 60px;
	margin-top: 30px;
}
.spinner .spinnerText {
	margin: -30px auto 0;
	color: #0000ff;
	display: block;
	font-weight: bold;
	font-size: 1.2em;
}
.spinnerSmall .spinnerText {
	margin: -42px auto 0;
	color: #0000ff;
	display: block;
	font-weight: bold;
	font-size: 0.8em;
}
.spinBG {
	display: inline-block;
	background: #0b005d;
	padding: 0 10px 10px;
	border-radius: 20px;
	box-shadow: 0 0 2px #000003;
	margin-top: 5px;
}
div#pageTitleRight {
	float: right;
	margin-right: 2%;
	margin-top: 10px;
}
.modernSelect {
	padding: 2px;
	border: 1px solid #0000ff;
	font-size: 1em;
	border-radius: 10px;
	color: #0000ff;
	max-height:300px;
}
/*SCREENS#/
/*SCREEN: DASHBOARD*/
#dashboard .widgetRow i {
	font-size: 14px;
	vertical-align: top;
	margin-top: 6px;
}
#dashboard .widgetRow.titleRow i {
	font-size: 0.9em;
}
div#widgetTop {
	margin: 30px 2.5% 0;
	border: 5px solid #73b7df;
	padding: 0 0 5px;
	text-align: center;
	font-size: 1.2em;
	color: darkblue;
	border-radius: 10px;
}
div#widgetTop>p {
	padding: 0 10px;
	color: #000;
}
#dahboardCompanyName {
	display: inline-block;
	vertical-align: top;
	margin: 25px 0 0 10px;
	font-weight: bold;
	font-size: 2em;
}
div#dahboardCompany {
	margin-left: 10px;
}
div#dahboardUser {
	text-align: right;
	margin-right: 10px;
}
div#dashboardName {
	margin-top: 15px;
	font-size: 1.5em;
	font-weight: bold;
}
div#dashboardGroup {
	font-size: 1.2em;
}
#widgetArea {
	padding: 20px 2%;
}
.widgetAreaRow {
	display: flex;
}
.widget {
	border: 5px solid #73b7df;
	padding: 0 0 5px;
	width: 100%;
	margin: 5px;
	text-align: center;
	font-size: 1.1em;
	color: darkblue;
	border-radius: 10px;
	min-height: 150px;
}
h3.widgetTitle {
	font-size: 1.5em;
	font-weight: bold;
	color: #fff;
	background: #73b7df;
	margin: -1px -1px 0;
}
.widgetTitle>i {
	margin-right: 5px;
}
.widgetRow.titleRow {
	font-weight: bold;
	background: #b4e3ff;
	margin: 0;
	padding: 3px 0;
	color: #777;
}
.widgetRow {
	margin: 5px 0;
	color: #555;
}
.widgetRow span.contractorPic, .widgetRow span.architectPic {
	height: 25px;
	width: 25px;
	display: inline-block;
	background-size: contain;
	border-radius: 50%;
	margin: 0 5px -7px 0;
}
.widgetRow.subTitle {
	font-weight: bold;
	color: #999;
}
.widgetRow.topContractor, .widgetRow.topArchitect, .widgetRow.rowInScroll {
	color: #555;
	font-size: 0.9em;
	white-space: nowrap;
}
.widgetRow.nextReview {
	color: #555;
	font-size: 0.9em;
}
.widgetRow.nextReview.late {
	color: #ff0000;
	white-space: nowrap;
}
.widgetRow.recent {
	color: #ff0000;
	font-size: 0.9em;
}
.widgetRow span.empPic {
	height: 25px;
	width: 25px;
	display: inline-block;
	background-size: contain;
	border-radius: 50%;
	margin: 0 5px -7px 0;
}
.widgetRow.nextReview>a {
	color: #0000ff;
	margin-left: 4px;
}
.widgetRow a {
	cursor: pointer;
	color: #0000ff;
}
.widgetRow i {
	margin-left: 4px;
}
.widgetRow.topContractor>a>i, .widgetRow.topArchitect>a>i {
	margin-left: 4px;
}
textarea.dbTextArea {
	width: 80%;
	height: 120px;
	padding: 5px;
	margin-bottom: 5px;
	border: 3px solid #bbb;
	margin-top: 10px;
}
.widgetRow.nextReview>a>i {
	cursor: pointer;
	margin-left: 4px;
}
div.widgetScrollFrame {
	font-size: .9em;
	display: inline-block;
	padding: 5px 10px;
	max-height: 115px;
	overflow-y: scroll;
	overflow-x: hidden;
	border: 3px solid #bbb;
	width: 80%;
}
div.widgetScrollFrame .missingWidgetRow {
	font-size: .9em;
}
div#widgetOutlook .clearButton {
	margin-bottom: 5px;
	display: inline-block;
}
div#mainMenu-mobilebarmenuck {
	display: none;
}
input.nonSecure {
	box-shadow: 0 0 3px 3px #ff0000;
}
.settingField>div {
	vertical-align: top;
}
.settingsSection label {
	font-weight: bold;
	color: #777;
	font-size: 1.2em;
}
.settingField.dbBoxSettings>div {
	width: 100%;
}
#dbSettingsFields {
	display: flex;
}
div#dbBoxSubmit>input {
	min-width: auto;
}
div#dbBoxTitle {
	width: 20%;
}
div#dbBoxTitle>input {
	width: 90%;
}
div#dbBoxDesc {
	width: 73%;
}
div#dbBoxDesc>textarea {
	width: 90%;
}
div#dbBoxSubmit {
	width: 7%;
}
div#dbBoxDesc>input {
	width: 90%;
}
.charsLeft {
	font-size: 0.75em;
	color: #333;
	font-style: italic;
	margin: 0 0 0 0;
	transition: color 0.3s ease;
	display: block;
}
#dashboard .charsLeft {
	margin-top: -10px;
}
.noLink {
	display: none;
}
div#applicants .empPosition img {
	max-height: 15px;
	margin: 0 0 -2px 0;
}
a.menuTopIconLink.mobileOnly {
	display: none;
}
a.cancelSpinner {
	border: 1px solid #000;
	border-radius: 5px;
	font-size: .6em;
	color: #000;
	background: #ddd;
	padding: 0 4px;
	display: inline-block;
	margin-top: 5px;
	font-weight: normal;
	cursor: pointer;
}
.inline.fieldContainer.noShow {
	display: none !important;
}
span.requiredAsterisk {
	color: #ff0000;
	display: inline-block;
	font-size: 1.4em;
	margin: 0 0 0 4px;
}
div#requiredNotice {
	font-weight: bold;
	margin: 40px 0 20px;
	background: #fbeabb;
}
.fontSize8em {
	font-size: .8em;
}
#reportTypeSelect, #analyticsViewSelect {
	float: right;
	margin: 12px 2% 0 0;
}
a.reportType.current, a.analyticsView.current {
	color: #000;
	cursor: default;
	border-top: 4px solid #000;
}
a.reportType, a.analyticsView {
	margin-left: 10px;
	font-weight: bold;
	font-size: 1.1em;
	color: #0000ff;
	cursor: pointer;
}
select#numRows {
	float: right;
	margin-right: 2%;
	margin-top: 24px;
}
div#selectStyle {
	float: right;
	margin: 28px 2% 0;
	font-size: .9em;
}
div#selectStyle>a {
	color: #0000ff;
	margin-left: 5px;
	cursor: pointer;
}
div#selectStyle>a.selected {
	color: #bbb;
	pointer-events: none;
}
div#compactReportHeaders, div.reportRow.compact {
	display: flex;
	padding: 4px 2%;
}
div#compactReportHeaders {
	border-bottom: 2px solid #000;
	font-weight: bold;
	margin-top: 20px;
	font-size: 1.1em;
	background: #eee;
	width: 96%;
}
div#compactReportHeaders .empReportCol.col1, div.reportRow.compact .empReportCol.col1 {
	width: 6%;
}
div#compactReportHeaders .empReportCol.col2, div.reportRow.compact .empReportCol.col2 {
	width: 9%;
}
div#compactReportHeaders .empReportCol.col3, div.reportRow.compact .empReportCol.col3 {
	width: 13%;
}
div#compactReportHeaders .empReportCol.col4, div.reportRow.compact .empReportCol.col4 {
	width: 28%;
}
div#compactReportHeaders .empReportCol.col5, div.reportRow.compact .empReportCol.col5 {
	width: 17%;
}
div#compactReportHeaders .empReportCol.col6, div.reportRow.compact .empReportCol.col6 {
	width: 10%;
}
div#compactReportHeaders .empReportCol.col7, div.reportRow.compact .empReportCol.col7 {
	width: 11%;
}
div#compactReportHeaders .empReportCol.col8, div.reportRow.compact .empReportCol.col8 {
	width: 6%;
	text-align: right;
}
div#compactReportHeaders .empReportCol.col9, div.reportRow.compact .empReportCol.col9 {
	width: 5%;
}
select#numRows {
	float: right;
	margin-right: 2%;
	margin-top: 24px;
}
/* div#row2filters {
    min-height: 35px;
} */
.compactRows .reportRow.compact.empRow {
	transition: max-height 200ms linear, padding 200ms linear;
	-webkit-transition: padding 200ms linear, padding 200ms linear;
	max-height: 0px;
	padding: 0px 2%;
	overflow: hidden;
}
.expandedRows .reportRow.compact.empRow {
	transition: max-height 200ms linear, padding 200ms linear;
	-webkit-transition: padding 200ms linear, padding 200ms linear;
	max-height: 50px;
	padding: 4px 2%;
}
div#selectStyle {
	float: right;
	margin: 28px 2% 0;
	font-size: .9em;
}
div#selectStyle>a {
	color: #0000ff;
	margin-left: 5px;
	cursor: pointer;
}
div#selectStyle>a:hover {
	text-decoration: underline;
}
div#selectStyle>a.selected {
	color: #bbb;
	pointer-events: none;
}
.reportRow.rowA, .singleReport.rowA {
	background: #adf0ff;
}
.reportRow.rowB, .singleReport.rowB {
	background: #7de7ff;
}
.reportRow.compact.totalRow {
	color: #1c1c53;
}
.reportRow.compact.totalRow.open {
	font-weight: bold;
}
.reportRow.compact.empRow {
	background: #fff;
}
a.openReportButton {
	font-size: .9em;
	cursor: pointer;
	color: #0000ff;
}
#reportsContainer .singleReport {
	/* transition: height 2500ms linear;
	-webkit-transition: height 2500ms linear; */
	/* max-height: 0%; */
	overflow: hidden;
}
#reportsContainer .singleReport.open {
	/* transition: all 2500ms linear;
	-webkit-transition: all 2500ms linear; */
	/* max-height: 100%; */
	padding: 10px 2%;
	border-bottom: 2px solid #0000ff;
	border-left: 2px solid #0000ff;
	border-right: 2px solid #0000ff;
}
.singleReportHeaders, .empData>.empRow, .pmReportData>.pmReportRow {
	display: flex;
	/* font-size: .9em; */
}
/* .singleEmpReportHeaders>div, #dataSlider>.empRow>div, .empdata>.empRow>div, .pmReportData>.pmReportRow>div {
    width: 100%;
}
.singleReportDataRow.div1 .empCol, .singleEmpReportHeaders.div1 .empCol, .empRow.quantitiesRow.div1 .empCol {
	width: 6.8%;
}*/
.singleReportDataRow .empCol, .singleEmpReportHeaders .empCol, .empRow.quantitiesRow .empCol {
	width: 100%;
}
/* .singleReportDataRow.div2 .empCol, .singleEmpReportHeaders.div2 .empCol, .empRow.quantitiesRow.div2 .empCol {
	width: 7.6%;
}
.singleReportDataRow.div3 .empCol, .singleEmpReportHeaders.div3 .empCol, .empRow.quantitiesRow.div3 .empCol {
	width: 5.7%;
}
/* DIV 1
.singleReportDataRow.div1 .empCol.colName, .singleEmpReportHeaders.div1 .empCol.colName {
	width: 17%;
}
.singleReportDataRow.div1 .empCol.colDisp, .singleEmpReportHeaders.div1 .empCol.colDisp {
	width: 14%;
}
/* DIV 2
.singleReportDataRow.div2 .empCol.colName, .singleEmpReportHeaders.div2 .empCol.colName {
	width: 17%;
}
.singleReportDataRow.div2 .empCol.colDisp, .singleEmpReportHeaders.div2 .empCol.colDisp {
	width: 14%;
}
/* DIV 3
.singleReportDataRow.div3 .empCol.colName, .singleEmpReportHeaders.div3 .empCol.colName {
	width: 17%;
}
.singleReportDataRow.div3 .empCol.colDisp, .singleEmpReportHeaders.div3 .empCol.colDisp {
	width: 14%;
}
/* quantities row
.singleReportDataRow.div1 .empCol, .singleEmpReportHeaders.div1 .empCol {
	width: 6.8%;
}
.singleReportDataRow.div2 .empCol, .singleEmpReportHeaders.div2 .empCol {
	width: 7.6%;
}
.singleReportDataRow.div3 .empCol, .singleEmpReportHeaders.div3 .empCol {
	width: 5.7%;
} */
/* .empRow.quantitiesRow .empCol.colName {
	width: 17%;
} */
.reportRow.totalRow.open {
	border-top: 2px solid #0000ff;
	border-left: 2px solid #0000ff;
	border-right: 2px solid #0000ff;
}
.singleReportHeaders {
	font-weight: bold;
	border-bottom: 2px solid #6a6a6a;
}
.empRow.totalsRow {
	border-top: 1px solid #000;
	color: #333;
	font-weight: bold;
}
.textAreas {
	display: flex;
}
.textAreas>div {
	flex: 1;
	background: #fbfce5;
	margin: 3px;
	padding: 5px 10px;
	border: 1px solid #777;
}
.textAreas>div>h4 {
	margin: 0 0 10px;
}
.extraFields {
	margin: 20px -3px;
}
.gTot.dataRow {
	text-align: center;
	font-weight: bold;
	/* margin: 15px 0; */
	border-top: 1px solid #000;
	padding-top: 10px;
	margin-bottom: 15px;
}
div#printButtonContainer {
	text-align: center;
	margin-top: 20px;
}
div#printButtonContainer button.smallRedButton {
	background: #ff0000;
	color: #fff;
	font-weight: bold;
	border-radius: 5px;
	margin-left: 10px;
	cursor: pointer;
}
button#printButton {
	background: #fff;
	font-weight: bold;
	border-radius: 5px;
	cursor: pointer;
}
div.empData>div.empRow, div.pmReportData>div.pmDataRow {
	display: flex;
}
div#selectStyle>a.adminEditButton {
	background: #00b200;
	font-weight: bold;
	border: 2px solid #000;
	font-size: .9em;
	padding: 0px 6px;
	border-radius: 20px;
	color: #fff;
	text-transform: uppercase;
}
div#selectStyle>a.adminEditButton.editing {
	background: #ff0000;
}
div#selectStyle>a.adminEditButton:hover {
	background: #fff;
	color: #000;
	text-decoration: none;
}


div#compactReportHeaders .pmReportCol.col1, div.reportRow.compact .pmReportCol.col1 {
	width: 10%;
}
div#compactReportHeaders .pmReportCol.col2, div.reportRow.compact .pmReportCol.col2 {
	width: 10%;
}
div#compactReportHeaders .pmReportCol.col3, div.reportRow.compact .pmReportCol.col3 {
	width: 20%;
}
div#compactReportHeaders .pmReportCol.col4, div.reportRow.compact .pmReportCol.col4 {
	width: 17%;
}
div#compactReportHeaders .pmReportCol.col5, div.reportRow.compact .pmReportCol.col5 {
	width: 20%;
}
div#compactReportHeaders .pmReportCol.col6, div.reportRow.compact .pmReportCol.col6 {
	width: 7%;
}
div#compactReportHeaders .pmReportCol.col7, div.reportRow.compact .pmReportCol.col7 {
	width: 15%;
	text-align: right;
}
.reportRowDivider {
	background: #5e5e5e;
	height: 12px;
	text-align: center;
}
span.reportRowDivText {
	font-size: 12px;
	color: #fff;
	font-weight: bold;
	margin: -3px 0 0 0;
	text-transform: uppercase;
	display: inline-block;
	text-shadow: 2px 1px 1px #000;
	vertical-align: top;
}
.grandTotal {
	text-align: center;
	margin-top: 5px;
	font-weight: bold;
	color: #555;
}
.superReportHeaders {
	font-size: .9em;
}
.superReportRow {
	display: flex;
	font-size: .9em;
}
.superColRecord {
	width: 6%;
}
.superColJobId {
	width: 7%;
}
.superColJobName {
	width: 11%;
}
.superColData {
	width: 5.7%;
	height: 15px;
}
.singleReportDataRow.rowA {
	background: #ededed;
}
.singleReportDataRow.rowB {
	background: #dddddd;
}
.pmDataCol.col1 {
	width: 6%;
}
.pmDataCol.col2 {
	width: 20%;
}
.pmDataCol.col3 {
	width: 14%;
}
.pmDataCol.pmReportDataCol {
	width: 8%;
}
form.updateJobRecord input.modernInput {
	max-width: 90%;
}
form.updateJobRecord.editSuperReportJobs>div {
	width: 6%;
}
div#editReportsContainer>h3.note {
	text-align: center;
	background: lightblue;
}
a.openImg.laborPhotosIcon {
	color: #0000ff;
	margin-left: 12px;
	display: inline-block;
	font-size: .9em;
	cursor: pointer;
}
.uploadHolder {
	display: none;
}
div#photoFrame {
	position: fixed;
	width: 80%;
	height: 80%;
	margin-left: 20%;
	top: 100px;
	background: #000;
	overflow-y: auto;
}
#subScreenContainer.slideUpContainer.reportPhotos {
	background: #fff;
	text-align: center;
	overflow-y: scroll;
}
#subScreenContainer.slideUpContainer.reportEditContainer {
	background: #fff;
	overflow-y: scroll;
}
div.hrPage.affix {
	padding-top: 103px;
}
/* .laborReports input#datepickerAlt1 {
	display: none;
} */
.resultsNav {
	display: inline-block;
	margin-left: 50px;
}
.resultsNav>a {
	margin: 0 10px;
	color: #0000ff;
	opacity: .7;
	cursor: pointer;
}
.resultsNav>a {
	opacity: 1;
}
.resultsNav>a.hideIcon {
	color: #ccc;
	pointer-events: none;
	cursor: not-allowed;
}
#adminReportsRecord {
	margin: 10px 2%;
}
div#adminReportsRecord .recordRow {
	display: flex;
	font-weight: bold;
	font-size: 1.4em;
	color: #7a7a7a;
}
div#adminReportsRecord .recordCol {
	width: 100%;
	text-align: center;
}
div#adminReportsRecord .recordRow.deleteRow {
	width: 100%;
	display: block;
	text-align: center;
	margin-top: 20px;
	font-size: 1em;
}
p.editWarn {
	font-weight: bold;
	color: #b80000;
	font-style: italic;
}
h4#empRecordsTitle {
	text-align: center;
	border-top: 5px solid #777;
	color: #777;
	font-size: 1.1em;
}
div#empReportRecords, div#jobReportRecords {
	margin: 10px 2%;
}
#adminReportsRecord input#datepickerAltEditReport {
	font-size: 1em;
	font-weight: bold;
	color: #7a7a7a;
}
#adminReportsRecord select#changeJobSelect, #adminReportsRecord select#changeSuperSelect, #adminReportsRecord select.changeEmpSelect {
	font-size: 1em;
	font-weight: bold;
	color: #7a7a7a;
}
#adminReportsRecord img.ui-datepicker-trigger {
	height: 26px;
}
div#labor-reports-edit #searchFilters {
	display: none !important;
}
div#labor-reports-edit div#screen.affix {
	padding-top: 0;
}
a#addReportEmp {
	display: inline-block;
}
div#empReportRecords .addEmpRow {
	text-align: center;
}
.fieldContainer.addNewEmpHourRow {
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: left;
}
.fieldContainer.addNewJobHourRow {
	display: flex;
	align-items: center;
	justify-content: space-around;
	text-align: left;
}
.fieldContainer.addNewEmpHourRow>div {
	overflow: hidden;
}
.addReportEmpRow .fieldContainer {
	margin: 20px 0;
	font-size: .9em;
}
.addReportEmpRow .fieldContainer>div {
	max-width: 7.5%;
}
.addReportEmpRow .fieldContainer>div.selectNewEmp {
	max-width: 100%;
}
.addReportEmpRow {
	text-align: center;
}
#editReportTable h4#empRecordsTitle {
	text-align: center;
	border-top: 5px solid #777;
	color: #777;
	font-size: 1.1em;
}
#editReportTable div#empReportRecords, #editReportTable div#jobReportRecords {
	margin: 10px 2%;
}
#editReportTable .empNameRow {
	font-weight: bold;
	text-align: center;
	margin-bottom: 20px;
	color: #555;
}
#editReportTable .empNameRow>a {
	padding: 0 6px;
	font-size: .8em;
	margin-left: 20px;
}
#editReportTable select.modernInput.changeEmpSelect {
	font-size: 1em;
	font-weight: bold;
	color: #555;
}
#editReportTable .hour.row>form {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	font-size: .9em;
}
#editReportTable .hour.row>form.updateEmpRec>div {
	max-width: 7.5%;
}
#editReportTable .hour.row {
	/* background: #eee; */
	margin: 20px 0;
	padding: 15px 0;
}
#editReportTable .reportRecords>form {
	display: flex;
	align-items: center;
	justify-content: center;
}
#editReportTable h4#noResults {
	text-align: center;
}
#editReportTable div#empReportRecords .modernInput {
	max-width: 90%;
}
form#addEmpForm .submitButton {
	padding-bottom: 40px;
}
#editReportTable .empBlock {
	border-top: 5px solid #005f00;
	border-bottom: 5px solid #005f00;
	text-align: center;
	background: #ddd;
	margin: 20px 0;
}
#editReportTable h3.empDate {
	text-align: center;
	background: #eee;
	margin: 10px 0;
}
#editReportTable .empBlock>.headers, #editReportTable .empBlock>.dataRow {
	display: flex;
}
div#editReportTable {
	margin-top: 75px;
}
div#editReportTable>h3 {
	text-align: center;
	background: #b2d4ff;
	color: darkblue;
}
.clearRedButton {
	background: transparent;
	padding: 3px 6px;
	color: #ff0000;
	cursor: pointer;
	font-weight: bold;
	border: 3px solid #ff0000 !important;
}
.clearRedButton:hover {
	color: #000;
	border: 3px solid #000;
}
a#removeSearchIcon {
	float: right;
	width: 20px;
	font-size: 1.2em;
	color: #ff0000;
	margin-left: -25px;
	cursor: pointer;
}
#payrollReportInfo {
	text-align: center;
	font-size: 1.4em;
	font-weight: bold;
	color: #999;
	margin: 30px 0 20px;
}
#allPayrollReportInfo {
	text-align: center;
	font-size: 1em;
	font-weight: bold;
	color: #999;
	margin: 30px 0 20px;
}
#payrollLaborContainer .empBlock {
	border-top: 7px solid #619ffb;
	text-align: center;
	background: #fff;
	margin: 20px 0;
}
#payrollLaborContainer h2.empTitle {
	background: #eee;
	text-align: center;
	margin: 0;
}
#payrollLaborContainer h3.empDate {
	text-align: center;
	margin: 10px 0;
}
#payrollLaborContainer .empBlock>.headers {
	border-bottom: 1px solid #000;
	font-weight: bold;
}
#payrollLaborContainer .empBlock>.headers, #payrollLaborContainer .empBlock>.dataRow {
	display: flex;
}
#payrollLaborContainer .empTotal {
	font-weight: bold;
	color: #0083b5;
	margin: 10px 0 5px;
}
#payrollLaborContainer .empBlock>.headers>div, #payrollLaborContainer .empBlock>.dataRow>div {
	width: 100%;
}
#payrollLaborContainer .col.emp_total.dayTotal {
	border-top: 1px solid #999;
}
div#allPayrollReportInfo>.divider {
	color: #000;
	font-size: 1.3em;
}
div#currentFilter.withFilterSearch>div {
	display: flex;
	position: absolute;
}
div#currentFilter.withFilterSearch>div>input {
	max-height: 22px;
	margin-right: 10px;
}
span.requiredAsterisk {
	color: #ff0000;
	display: inline-block;
	font-size: 1.4em;
	margin: 0 0 0 4px;
	vertical-align: top;
}
div#requiredNotice {
	font-weight: bold;
	margin: 40px 0 20px;
	background: #fbeabb;
}
.fontSize8em {
	font-size: .8em;
}
.superColJobId.superColData {
	width: 17%;
	overflow: hidden;
}
.laborReports div#reportsContainer {
	font-size: .9em;
}
.tab {
	background: #eee;
	margin: 0 3px;
	border-radius: 5px 5px 0 0;
	padding: 2px 6px;
	cursor: pointer;
	display: inline;
	transition: background 1000ms ease-out;
}
.tab:hover {
	background: #ddd;
}
.tab.currentTab {
	background: #ddd;
}
div#tabs {
	padding: 0 2%;
	white-space: nowrap;
}
.scrollable {
	overflow-x: auto;
}
.tabLinkFn {
	padding: 0 0 0 5px;
	color: #999;
}
a.tabLinkFn:hover {
	color: #333;
}
div.tab .tabLinkFn.tabLinkRefresh {
	display: none;
}
div.tab.currentTab .tabLinkFn.tabLinkRefresh {
	display: inline-block;
}
.emp1099Logo {
	font-weight: bold;
	border: 5px solid #7a7a7a;
	display: inline-block;
	padding: 0 4px;
	border-radius: 50%;
	color: #667;
	vertical-align: top;
	margin: -4px 0 0 10px;
}
.emp1099Logo.hide {
	display: none;
}
.inactiveScreen {
	display: none;
}
.laborDiscrepencies div#dateFilters {
	margin: 10px 0 0 2%;
	float: none;
	background: #eee;
	padding: 10px;
	border: 1px solid #ccc;
	border-radius: 4px;
}
.laborDiscrepencies div#dateFilter {
	text-align: center;
	margin: 0 auto;
}
.laborDiscrepencies div#dateFilter>div {
	display: inline-block;
}
.laborDiscrepencies div#dateFilter>div>label {
	vertical-align: top;
	margin-top: 4px;
	display: inline-block;
}
input#datepickerAlt1discrepancies, input#datepickerAlt2discrepancies {
	border: 0 none;
	font-weight: bold;
	pointer-events: none;
	max-width: 100px;
	margin-right: 10px;
	background: transparent;
	vertical-align: top;
	margin-top: 8px;
}
div#searchFilters.inlineFilters {
	justify-content: flex-end;
}
div#searchFilters.inlineFilters>div {
	flex-grow: 0;
}
select#selectDiscrepencyType {
	margin: 0 30px 0 5px;
}
div#currentWeekWrapper {
	background: #aad8ff;
	text-align: center;
	padding: 5px 0;
}
div#discrepencyResults {
	text-align: center;
	margin-top: 30px;
	font-size: .9em;
}

div#filtersDisplay>span#currentWeek {
	margin: 0;
	background: #fff;
	display: inline;
	padding: 0;
}
#missingHours .noMissingHours {
	padding: 5px 2%;
	display: block;
	background: #a7ffa7;
}
div#discrepencyResults {
	text-align: center;
	margin-top: 30px;
	font-size: .9em;
}
div#discrepencyResults>div {
	vertical-align: top;
}
div#missingHours>h4 {
	text-align: center;
}
div#currentWeekWrapper {
	background: #aad8ff;
	text-align: center;
	padding: 5px 0;
}
div#dateFilter {
	text-align: center;
	margin: 0 auto;
}
div#dateFilter>div {
	display: inline-block;
}
a.goDateButton {
	border: 2px solid #389ed7;
	padding: 1px 4px;
	font-weight: bold;
	border-radius: 4px;
	color: #389ed7;
	cursor: pointer;
}
a.goDateButton:hover {
	border: 2px solid #0000ff;
	color: #0000ff;
}
div#dateFilter>div>label {
	vertical-align: top;
	margin-top: 4px;
	display: inline-block;
}
.goButton {
	vertical-align: top;
	margin-top: 4px;
}
input#datepickerAlt1discrepancies, input#datepickerAlt2discrepancies {
	border: 0 none;
	font-weight: bold;
	pointer-events: none;
	max-width: 100px;
	margin-right: 10px;
	background: transparent;
	vertical-align: top;
	margin-top: 8px;
}
div#discrepencyResults .missingEmpRow, div#empHoursResults .empRow {
	display: flex;
	background: #eee;
	border: 1px solid #999;
	width: 96%;
	margin: 0 2%;
}
div#discrepencyResults .missingEmpRow.headers, div#empHoursResults .empRow.headers {
	border-bottom: 2px solid #333;
	font-weight: bold;
}
div#discrepencyResults .missingEmpRow>div {
	width: 20%;
	text-align: left;
	padding: 5px 10px;
}
div#empHoursResults .empRow>div {
	width: 25%;
}
div#discrepencyResults .missingEmpRow>div.mgrCol {
	width: 40%;
}
select.bottomHoursSelect {
	margin: 20px auto 0;
	display: block;
	font-weight: bold;
	font-size: 1em;
	color: #0f96e1;
	border-radius: 4px;
	border: 2px solid #47a8de;
}
#dailyHoursFilter {
	text-align: center;
	margin-top: 20px;
}
div#dateFilters {
	margin: 10px 0 0 2%;
	float: left;
	background: #eee;
	padding: 10px;
	border: 1px solid #ccc;
	border-radius: 4px;
}
div#searchFilters.inlineFilters>div {
	flex-grow: 0;
}
div#searchFilters.inlineFilters div#currentFilter {
	min-width: auto;
	text-align: left;
	margin: 0 40px 0 20px;
}
div#searchFilters.inlineFilters div#filtersDisplay>span {
	margin: 0 10px;
}
div#searchFilters.inlineFilters {
	justify-content: flex-end;
}
div#searchFilters.inlineFilters div#filtersDisplay {
	min-width: 200px;
}
div.missingEmpRow a.managerItem {
	font-size: .9em;
	border: 1px solid #0000ff;
	border-radius: 8px;
	padding: 0 4px;
	text-decoration: none;
	display: inline-block;
	margin: 2px 4px;
}
div.missingEmpRow a.managerItem>i {
	margin-left: 3px;
}
a.managerItem.fmMgr, .headers .fmMgr {
	background: #bfffb4;
}
a.managerItem.superMgr, .headers .superMgr {
	background: #ecff9d;
}
a.managerItem.otherMrgCol, .headers .otherMgrCol {
	background: #f9e3cb;
}
select#selectDiscrepencyType {
	margin: 0 30px 0 5px;
}
hr.sectionDivider {
	height: 5px;
	background: #555;
	margin: 30px 0 30px;
}
div#empHoursResults {
	text-align: center;
	margin-top: 30px;
	font-size: .9em;
}
div#filtersDisplay>span#currentWeek {
	margin: 0;
	background: #fff;
	display: inline;
	padding: 0;
}
#missingHours .noMissingHours {
	padding: 5px 2%;
	display: block;
	background: #a7ffa7;
}
div#discrepencyResults {
	text-align: center;
	margin-top: 30px;
	font-size: .9em;
}
div#discrepencyResults>div {
	vertical-align: top;
}
div#missingHours>h4 {
	text-align: center;
}
div#currentWeekWrapper {
	background: #aad8ff;
	text-align: center;
	padding: 5px 0;
}
div#dateFilter {
	text-align: center;
	margin: 0 auto;
}
div#dateFilter>div {
	display: inline-block;
}
a.goDateButton {
	border: 2px solid #389ed7;
	padding: 1px 4px;
	font-weight: bold;
	border-radius: 4px;
	color: #389ed7;
	cursor: pointer;
}
a.goDateButton:hover {
	border: 2px solid #0000ff;
	color: #0000ff;
}
div#dateFilter>div>label {
	vertical-align: top;
	margin-top: 4px;
	display: inline-block;
}
.goButton {
	vertical-align: top;
	margin-top: 4px;
}
input#datepickerAlt1discrepancies, input#datepickerAlt2discrepancies {
	border: 0 none;
	font-weight: bold;
	pointer-events: none;
	max-width: 100px;
	margin-right: 10px;
	background: transparent;
	vertical-align: top;
	margin-top: 8px;
}
div#discrepencyResults .missingEmpRow, div#empHoursResults .empRow {
	display: flex;
	background: #eee;
	border: 1px solid #999;
	width: 96%;
	margin: 0 2%;
}
div#discrepencyResults .missingEmpRow.headers, div#empHoursResults .empRow.headers {
	border-bottom: 2px solid #333;
	font-weight: bold;
}
div#discrepencyResults .missingEmpRow>div {
	width: 20%;
	text-align: left;
	padding: 5px 10px;
}
div#empHoursResults .empRow>div {
	width: 25%;
}
div#discrepencyResults .missingEmpRow>div.mgrCol {
	width: 40%;
}
select.bottomHoursSelect {
	margin: 20px auto 0;
	display: block;
	font-weight: bold;
	font-size: 1em;
	color: #0f96e1;
	border-radius: 4px;
	border: 2px solid #47a8de;
}
#dailyHoursFilter {
	text-align: center;
	margin-top: 20px;
}
div#dateFilters {
	margin: 10px 0 0 2%;
	float: left;
	background: #eee;
	padding: 10px;
	border: 1px solid #ccc;
	border-radius: 4px;
}
div#searchFilters.inlineFilters>div {
	flex-grow: 0;
}
div#searchFilters.inlineFilters div#currentFilter {
	min-width: auto;
	text-align: left;
	margin: 0 40px 0 20px;
}
div#searchFilters.inlineFilters div#filtersDisplay>span {
	margin: 0 10px;
}
div#searchFilters.inlineFilters {
	justify-content: flex-end;
}
div#searchFilters.inlineFilters div#filtersDisplay {
	min-width: 200px;
}
div.missingEmpRow a.managerItem {
	font-size: .9em;
	border: 1px solid #0000ff;
	border-radius: 8px;
	padding: 0 4px;
	text-decoration: none;
	display: inline-block;
	margin: 2px 4px;
}
div.missingEmpRow a.managerItem>i {
	margin-left: 3px;
}
a.managerItem.fmMgr, .headers .fmMgr {
	background: #e1ffdc;
}
a.managerItem.superMgr, .headers .superMgr {
	background: #f0f9cb;
}
a.managerItem.otherMgrCol, .headers .otherMgrCol {
	background: #f0f9cb;
}
select#selectDiscrepencyType {
	margin: 0 30px 0 5px;
}
hr.sectionDivider {
	height: 5px;
	background: #555;
	margin: 30px 0 30px;
}
div#empHoursResults {
	text-align: center;
	margin-top: 30px;
	font-size: .9em;
}
#subScreenContainer.projectAnalyticsContainer {
	background: #fff;
	overflow-y: scroll;
}
.projectAnalyticsBody {
	margin: 100px 2% 10px;
}
/* project analytics copied from agsadmin template */

.jobInfo {
	display: flex;
}
.jobInfo>div {
	width: 100%;
	font-weight: bold;
	font-size: 1.7em;
	margin: 0 15px;
}
.text.left {
	text-align: left;
}
.text.center {
	text-align: center;
}
.text.right {
	text-align: right;
}
.topBlock.searchBlock {
	max-width: 25%;
}
.coStatsBlock, .dispStatsBlock {
	/* background: #222; */
	border: 1px solid #444;
	padding: 0 10px 10px;
	margin: 10px 0;
}
.coStatsBlock .statTop, .coStatsBlock .statNumbers, .coStatsBlock .individualRecs {
	background: #fff;
	padding: 10px;
	border: 1px solid #3a3a3a;
	display: flex;
	margin: 10px 0;
}
#ratiosTotalsBlock {
	/* background: #222; */
	border: 1px solid #444;
	padding: 0 10px 10px;
	margin: 10px 0;
}
#ratiosTotals {
	background: #fff;
	padding: 10px;
	border: 1px solid #3a3a3a;
	margin: 0;
}
.ratiosTotalsRow {
	background: #dfe7ff;
	margin: 10px 0;
}
.ratiosTotalsDataRow {
	display: flex;
	width: 100%;
	text-align: center;
}
.ratiosTotalsDataRow>div {
	width: 100%;
}
h4.ratiosTotalsRowTitle {
	text-align: center;
	font-size: 1.5em;
	margin: 5px 0;
	color: #5c5c5c;
}
.dispAnalytics .individualRecs {
	/* background: #111; */
	padding: 10px 0 0 0;
	border: 1px solid #3a3a3a;
	margin: 10px 0;
}
.coStatsBlock .individualRecs {
	display: block;
	border-top: 1px solid #000;
}
.coStatsBlock .statTop>div, .coStatsBlock .statNumbers>div, .projectAnalyticsBody .ratiosTotalsRow>div {
	width: 100%;
	text-align: center;
}
.projectAnalyticsBody span.statValue {
	display: block;
	font-size: 1.5em;
	color: #a1a1a1;
	font-weight: bold;
}
.nameRow>div {
	display: inline-block;
}
.nameRow>.nameLeft {
	width: 30%;
	margin-left: 5px;
	margin-right: -5px;
}
.nameRow>.nameLeft>span.nameHrs {
	float: right;
}
.nameRow>.nameBar {
	/* border-radius: 0 50% 50% 0; */
	/* box-shadow: 0 0 0 2px #000 inset; */
	background: rgb(14, 212, 208);
	background: -moz-linear-gradient(left, rgba(14, 212, 208, 1) 0%, rgba(75, 191, 237, 1) 100%);
	background: -webkit-linear-gradient(left, rgba(14, 212, 208, 1) 0%, rgba(75, 191, 237, 1) 100%);
	background: linear-gradient(to right, rgba(14, 212, 208, 1) 0%, rgba(75, 191, 237, 1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0e0c26', endColorstr='#4bbfed', GradientType=1);
}
.coRatios {
	display: flex;
	margin-top: 30px;
}
.coRatios>div {
	background: #fff;
	display: inline-block;
	border-radius: 50%;
	padding: 31px 0;
	text-align: center;
	width: 100%;
	margin: 10px;
	border: 1px solid #3a3a3a;
}
.coRatios>div h4 {
	font-size: 1.5em;
	margin: 0;
}
.projectAnalyticsBody a, .projectAnalyticsBody a:link, .projectAnalyticsBody a:visited {
	color: #0041d5;
	cursor: pointer;
}
.horizView.analyticsBody a.analRow:hover, .individualRecs a.nameRow:hover {
	background: #eee;
}
.individualRecs .nameRow {
	display: block;
	border-bottom: 1px solid #080f2e;
}
.nameRow .crossLink {
	/* background: #000; */
	margin: 0 0 0 10px;
	border-radius: 6px;
	color: #aaa;
	padding: 1px 4px;
	border: 1px solid #aaa;
	font-size: .7em;
}
.nameRow .crossLink:hover {
	color: #fff;
	border: 1px solid #fff !important;
	background: #00aad7;
}
.headers span.hrsRank {
	color: #777;
}
a span.hrsRank {
	color: #8fb0ff;
}
.coStatsBlock {
	background: #b5cccf;
}
div#tempTabs {
	text-align: left;
	margin: 32px 60px 0 50px;
}
.projectLink>a {
	cursor: pointer;
}
.ui-sortable-placeholder.tab {
	position: absolute;
	background: #0000ff;
}
.userGroupDetails2 {
	vertical-align: top;
	margin-top: 2px;
}
#schedulePage div#contactArea {
	position: fixed;
	width: 150px;
	background: #000;
	left: 50%;
	margin-left: -75px;
	z-index: 99;
	border-radius: 5px;
	padding: 2px 0;
	top: 122px;
}
div#contactArea>a {
	cursor: pointer;
}
#schedulePage div#contactArea a.closeContact {
	color: #ff0000;
	position: absolute;
	right: 4px;
	top: 2px;
	cursor: pointer;
}
#schedulePage div#contactArea a.contactButton {
	color: #0000ff;
	margin: 0 0 0 11px;
	font-size: 1.7em;
}
.userGroup12 #schedulePage div#contactArea a.contactButton.forDirectory {
	display: none;
}
#widgetMessages .empPic {
	width: 25px;
	height: 25px;
}
div#slideUpToggle.closed {
	box-shadow: 0 0 0 0;
}
.settingField.catDisplay .headerRow {
	font-weight: bold;
	border-bottom: 1px solid #000;
}
.catDisplay .dataRow {
	display: flex;
	justify-content: space-between;
	width: 100%;
	border-bottom: 1px solid #ccc;
	padding: 3px 0;
}
.catDisplay .dataRow>div {
	width: 100%;
}
.settingField.catDisplay .catID.readOnly {
	border: 0 none;
	background: transparent;
	width: 10%;
}
.settingField.catDisplay .colID {
	width: 10%;
}
div#empReportTotal {
	text-align: center;
	border-top: 1px solid #000;
	font-size: 1.1em;
}
.deleteReportEmp {
	float: right;
	color: #ff0000;
	font-size: 1em;
	cursor: pointer;
}
.addEmployee {
	text-align: center;
	margin: 5px 0;
}
#widgetArea h3.widgetTitle.ui-sortable-handle {
	cursor: move;
}
.settingsPage #progressBar {
	width: 0;
	display: inline-block;
	background: #0000ff;
	height: 3px;
	margin: 0 auto;
	transition: width 1000ms linear
}
.reportForm .openEmployeeIcon {
	float: right;
	color: #0000ff;
	margin-left: 10px;
	cursor: pointer;
	font-size: 1.1em;
	margin-top: -1px;
}
.reportForm .panel-body {
	max-height: 2000px;
	transition: max-height 500ms linear;
}
.reportForm .panel-body.closed {
	transition: max-height 500ms linear;
	max-height: 0px;
	overflow: hidden;
}
.reportForm .openEmployeeIcon {
	transition: transform 500ms linear, webkit-transform 500ms linear;
}
.reportForm .openEmployeeIcon.closed {
	transform: rotate(180deg);
	-moz-transform: rotate(180deg);
	-webkit-transform: rotate(180deg);
	-o-transform: rotate(180deg);
	-ms-transform: rotate(180deg);
	transition: transform 500ms linear, webkit-transform 500ms linear;
}
a.openImg.laborPhotosIcon>i {
	margin-right: 4px;
}
div#addNewCatRow {
	background: #fff;
	margin: 20px 0;
	border: 1px solid #000;
	padding: 5px;
	width: 99%;
	text-align: center;
}
span.rowDivType {
	font-size: .7em;
	font-weight: bold;
	border: 1px solid #999;
	color: #999;
	display: inline-block;
	margin: 0 2px;
	text-align: center;
	width: 20px;
}
.laborDiscrepencies div#dateFilter>div {
	display: inline-block;
	margin: 0 20px;
	font-weight: bold;
}
.laborDiscrepencies div#dateFilter input {
	font-size: 1.5em;
}
p.analyticsNote {
	text-align: center;
	margin: 5px 0;
	font-style: italic;
}
.addScheduleButton>.dateSelect {
	font-size: 1.2em;
	margin: 0 15px 0 0;
}
div#searchFilters select#selectDiscrepencyType {
	max-width: none;
}
.exportRight {
	margin-left: 5px;
}
div#exportContainer {
	text-align: center;
	margin: 10px 0;
	background: #f7ffb6;
	padding: 10px 0;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
}
div#exportNotes>p {
	color: #000;
	text-align: center;
	background: #eee;
	padding: 5px 0;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
}
#employee div.detailsLink {
	font-size: 1.5em;
	font-weight: bold;
	color: #777;
}
#employee .flexDetails {
	margin: 20px 2%;
	display: flex;
	justify-content: center;
}
#employee .flexDetails>div {
	max-width: 600px;
}
.fieldContainer.benefitContact a {
	display: inline-block;
	text-decoration: none;
	font-size: .9em;
	border: 1px solid #0000ff;
	margin: 0 5px;
	padding: 0 4px;
	border-radius: 6px;
	background: #eee;
}
#employee .employeeDetails .fieldContainer>label {
	font-weight: bold;
}
#logoutWarning {
	background: #aaa;
	width: 300px;
	position: fixed;
	top: 30%;
	z-index: 99999;
	left: 50%;
	margin-left: -160px;
	text-align: center;
	border: 10px solid #888;
	padding: 5px 10px;
}
span#logoutSeconds {
	display: block;
	color: #555;
	font-size: 1.2em;
	font-weight: bold;
}
.projectAnalyticsBody a.smallGreyButton {
	font-size: .6em;
	padding: 0px 5px;
	font-weight: normal;
	vertical-align: top;
	margin-top: 6px;
	display: inline-block;
}
span.usedMobileIcon {
	margin-left: 3px;
	font-size: .9em;
	color: #777;
}
span.usedMobileIcon i.fa-brands.fa-apple {
	font-size: 1.25em;
}
span.usedMobileIcon i.fa-brands.fa-google {
	font-size: .9em;
}
div#widgetTop img {
	height: 150px;
}
.userGroup12 #addUser {
	display: none;
}
div#categoryEstimateInputsLabel {
	font-weight: bold;
}
.categoryEstimateInput {
	font-size: .9em;
	margin: 5px 0;
}
div.greyedOut input {
	background-color: #eee;
}
.catCol {
	display: none;
}
.company-directory .contactCol {
	font-size: .9em;
}
.pointsRow {
	display: flex;
	justify-content: space-between;
	border-top: 1px solid #999;
	padding: 0 6px;
}
.pointsRow.header {
	font-weight: bold;
	color: #555;
	border-top: 0 none;
	border-bottom: 1px solid #555;
}
.pointsRow.pointsInitial {
	background-color: #eee;
}
.pointsRow.pointsDeposit {
	background-color: #b8e5ca;
}
.pointsRow.pointsWithdrawal {
	background-color: #ffb2b2;
}
.pointsRow.pointsCashOut {
	background-color: #ff6060;
}
.pointsRow.pointsTotal {
	background-color: #84aaff;
	font-weight: bold;
	color: #555;
}
a.smallGreyButton.exportPointsButton {
	float: right;
	margin: 7px 0 0 0;
}
.pointsArea .documents {
	margin-top: 20px;
}
span#secondReportLink {
	margin-left: 40px;
}
span#secondReportLink>a {
	color: #039538;
	cursor: pointer;
}
div#storeItemTable {
	margin: 2%;
	background: #eee;
	border: 1px solid #ccc;
}
div#storeItemTable .dataRow {
	display: flex;
	padding: 4px 10px;
}
div#storeItemTable .dataRow>div {
	padding: 4px 1%;
}
div#storeItemTable .headerRow.dataRow {
	border-bottom: 2px solid #777;
	font-weight: bold;
}
div#storeItemTable .col1 {
	width: 15%;
}
div#storeItemTable .col2 {
	width: 10%;
}
div#storeItemTable .col3 {
	width: 15%;
}
div#storeItemTable .col4 {
	width: 20%;
}
div#storeItemTable .col5 {
	width: 0;
}
div#storeItemTable .col6 {
	width: 14%;
}
div#storeItemTable .col7 {
	width: 14%;
	text-align: right;
	display: flex;
	align-items: self-start;
	justify-content: space-between;
}
div#storeItemTable>form {
	background: #fbfbfb;
	margin: 10px 1%;
	border: 1px solid #999;
	border-radius: 4px;
}
div#storeItemTable>div {
	margin: 0 1%;
}
div#storeItemTable h4 {
	margin: 30px 0 0 0;
}
div#storeItemTable input {
	max-width: 80%;
}
span.storeAdminCurrentPhoto {
	width: 80px;
	height: 80px;
	display: inline-block;
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
}
div#storeItemTable .uploadPhotoLink {
	vertical-align: top;
	margin: 0 0 0 20px;
	display: inline-block;
	background: #eee;
	padding: 1px 4px;
	border: 2px solid #bbb;
	border-radius: 6px;
	font-size: .9em;
}
div#storeItemTable .col3 select {
/* Enhanced discussion styling */
.responses-container {
    max-height: 300px;
    overflow-y: auto;
    padding: 10px;
    background: #f9f9f9;
    border-radius: 5px;
    border: 1px solid #e0e0e0;
    margin-bottom: 10px;
}

.response {
    margin-bottom: 12px;
    padding: 10px;
    border-radius: 8px;
    position: relative;
    max-width: 85%;
    box-shadow: 0 1px 2px rgba(0,0,0,0.1);
}

.admin-response {
    background-color: #e3f2fd;
    margin-left: auto;
    margin-right: 5px;
    border-bottom-right-radius: 2px;
}

.user-response {
    background-color: #f5f5f5;
    margin-right: auto;
    margin-left: 5px;
    border-bottom-left-radius: 2px;
}

.response-sender {
    font-weight: bold;
    margin-bottom: 5px;
    font-size: 0.9em;
    color: #555;
}

.response-message {
    line-height: 1.4;
    word-break: break-word;
}

.response-time {
    font-size: 0.75em;
    color: #888;
    text-align: right;
    margin-top: 5px;
}

.response-form {
    margin-top: 10px;
    padding: 10px;
    background: #f0f0f0;
    border-radius: 5px;
    border: 1px solid #e0e0e0;
}

.response-form button {
    margin-top: 8px;
    padding: 6px 12px;
    background: #0078d7;
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
}

.response-form button:hover {
    background: #0063b1;
}

.toggle-responses {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.toggle-responses i {
    font-size: 14px;
}

.has-responses {
    position: relative;
}

.has-responses:after {
    content: '';
    position: absolute;
    top: -3px;
    right: -3px;
    width: 8px;
    height: 8px;
    background: #ff5722;
    border-radius: 50%;
}

.no-responses {
    text-align: center;
    color: #888;
    padding: 20px;
}

.no-responses i {
    font-size: 24px;
    margin-bottom: 10px;
    display: block;
}

.response-timestamp {
    text-align: center;
    font-size: 0.75em;
    color: #aaa;
    margin-top: 10px;
    padding-top: 5px;
    border-top: 1px dashed #ddd;
}

.new-content {
    animation: highlight 1s ease-out;
}

@keyframes highlight {
    0% { background-color: #fff9c4; }
    100% { background-color: #f9f9f9; }
}
	min-width: 150px;
}
div#storeItemTable .col7 a {
	color: #ff0000;
	cursor: pointer;
}
span.storeAdminCurrentPhoto.missing {
	font-size: 3em;
	color: #999;
	margin-top: -12px;
}
.smallBlueButton {
	background: #0000ff;
	color: #fff;
	border-radius: 6px;
	border: 1px solid #000;
	padding: 4px 8px;
	cursor: pointer;
}
#products select.modernInput {
	max-width: 80%;
}
.newTicket .blueButton, .editTicket .blueButton {
	margin: 20px 0 0 0;
	display: inline-block;
}
.newTicket .fieldContainer.centered, .editTicket .fieldContainer.centered {
	text-align: center;
	display: inline-block;
	margin: 10px 0;
}

/* Edit Ticket Modal Styling */
.editTicket {
	position: fixed;
	top: 120px;
	left: 50%;
	transform: translateX(-50%);
	background: #fff;
	border: 2px solid #0000ff;
	border-radius: 10px;
	padding: 20px;
	box-shadow: 0 4px 20px rgba(0,0,0,0.3);
	z-index: 1001;
	max-width: 500px;
	width: 90%;
	max-height: calc(100vh - 140px);
	overflow-y: auto;
}

.editTicket h4 {
	margin: 0 0 20px 0;
	color: #0000ff;
	text-align: center;
	font-size: 1.3em;
	border-bottom: 2px solid #eee;
	padding-bottom: 10px;
}

.editTicket .fieldContainer {
	margin: 15px 0;
}

.editTicket .fieldContainer label {
	display: block;
	font-weight: bold;
	color: #333;
	margin-bottom: 5px;
}

.editTicket .modernInput {
	width: 90%;
	max-width: 100%;
	padding: 8px 12px;
	border: 1px solid #ddd;
	border-radius: 5px;
	font-size: 14px;
	transition: border-color 0.3s ease;
}

.editTicket .modernInput:focus {
	outline: none;
	border-color: #0000ff;
	box-shadow: 0 0 5px rgba(0,0,255,0.3);
}

.editTicket select.modernInput {
	height: 38px;
	background: white;
	cursor: pointer;
}

.editTicket .buttonContainer {
	text-align: center;
	margin-top: 25px;
	padding-top: 15px;
	border-top: 1px solid #eee;
}

.editTicket .blueButton {
	background: #0000ff;
	color: white;
	border: none;
	padding: 10px 20px;
	border-radius: 5px;
	font-size: 14px;
	font-weight: bold;
	cursor: pointer;
	transition: background-color 0.3s ease;
}

.editTicket .blueButton:hover {
	background: #0000cc;
}

#closeEditTicket {
	position: absolute;
	top: 10px;
	right: 15px;
	color: #ff0000;
	font-size: 1.5em;
	cursor: pointer;
	z-index: 1002;
}

#closeEditTicket:hover {
	color: #cc0000;
}

.status-edit-row {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
}

.status-edit-row select {
	flex: 1;
	min-width: 120px;
}

.edit-ticket-link {
	background: #f0f0f0;
	color: #666;
	padding: 3px 8px;
	border-radius: 4px;
	text-decoration: none;
	font-size: 12px;
	border: 1px solid #ddd;
	transition: all 0.2s ease;
	white-space: nowrap;
	cursor: pointer;
}

.edit-ticket-link:hover {
	background: #e0e0e0;
	color: #333;
	text-decoration: none;
}

.edit-ticket-link i {
	margin-right: 3px;
	font-size: 11px;
}
/* Support Tickets Filter Section - Scoped */
.screen.support-tickets #ticketFilters {
	padding: 15px 20px;
	background: #f5f5f5;
	border-bottom: 1px solid #ddd;
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
}

.screen.support-tickets #ticketFilters label {
	margin-right: 10px;
	font-weight: 600;
	color: #333;
}

.screen.support-tickets #ticketFilters select {
	min-width: 200px;
	padding: 8px 12px;
	border: 1px solid #0000ff;
	border-radius: 10px;
	font-size: 1em;
	color: #0000ff;
	background: white;
	cursor: pointer;
	transition: all 0.3s ease;
}

.screen.support-tickets #ticketFilters select:hover {
	background: #f0f0ff;
}

.screen.support-tickets #ticketFilters select:focus {
	outline: none;
	box-shadow: 0 0 0 3px rgba(0, 0, 255, 0.1);
}

@media (max-width: 768px) {
	.screen.support-tickets #ticketFilters {
		flex-direction: column;
		align-items: stretch;
		padding: 10px 15px;
	}
	
	.screen.support-tickets #ticketFilters label {
		margin-right: 0;
		margin-bottom: 5px;
	}
	
	.screen.support-tickets #ticketFilters select {
		width: 100%;
		min-width: auto;
	}
}

.ticketArea {
	margin: 10px 2% 30px 2%;
	border: 1px solid #000;
	padding: 10px 20px;
	border-radius: 10px;
}
div.ticketArea h3 {
	margin: 0 0 5px;
}
.ticketArea .dataRow {
	display: flex;
	padding: 5px 10px;
}
div.ticketArea .col1 {
	width: 5%;
}
div.ticketArea .col2 {
	width: 14%;
}
div.ticketArea .col3 {
	width: 35%;
}
div.ticketArea .col4 {
	width: 14%;
}
div.ticketArea .col5 {
	width: 8%;
}
div.ticketArea .col6 {
	width: 9%;
}
div.ticketArea .col7 {
	width: 10%;
	/* text-align: right; */
}
div.ticketArea .col8 {
	width: 0;
}
a.ticketScreenshot {
	width: 50px;
	height: 50px;
	display: inline-block;
	border: 2px solid #0000ff;
	border-radius: 4px;
	background-position: center;
	background-size: contain;
	cursor: pointer;
}
.ticketArea .dataRow {
	display: flex;
	padding: 5px 10px;
}
.ticketArea .ticketRow {
	border: 1px solid #999;
	margin: 5px 0;
}
.ticketArea .headerRow {
	font-weight: bold;
	border-bottom: 2px solid #555;
}
form#submitTicketForm input, #submitTicketForm select, #submitTicketForm textarea, form#contactHrForm input, #contactHrForm select, #contactHrForm textarea {
	max-width: 90%;
}
form#submitTicketForm .charsLeft {
	display: block;
	margin-bottom: 10px;
	margin-top: -17px;
}
div#contactWrapper {
	text-align: center;
}
form#contactHrForm {
	margin: 10px 2% 10px 2%;
	border: 1px solid #000;
	padding: 10px 20px;
	border-radius: 10px;
	display: inline-block;
	text-align: center;
}
form#contactHrForm label {
	vertical-align: top;
}
form#contactHrForm .fieldContainer {
	background: #eee;
	margin: 34px 0;
	display: block;
	padding: 10px;
	border-radius: 5px;
}
form#contactHrForm h3 {
	margin: 10px 0 5px;
	color: #555;
}
#hrDocumentUploads, #expenseReports {
	margin: 10px 2% 10px 2%;
	border: 1px solid #000;
	padding: 10px 20px;
	border-radius: 10px;
}
div#hrDocumentUploads h3, #expenseReports h3 {
	margin: 0;
}
#hrDocumentUploads .dataRow, #expenseReports .dataRow {
	display: flex;
	padding: 5px 10px;
}
div#hrDocumentUploads .col1 {
	width: 20%;
}
div#hrDocumentUploads .col2 {
	width: 30%;
}
div#hrDocumentUploads .col3 {
	width: 25%;
}
div#hrDocumentUploads .col4 {
	width: 25%;
}
#expenseReports .dataRow>div {
	width: 100%;
}
#expenseReports .dataRow.expenseItem>div {
	width: auto;
}
#hrDocumentUploads .hrDocRow, #expenseReports .hrDocRow {
	border: 1px solid #999;
	margin: 5px 0;
}
#expenseReports .hrDocRow {
	background: #ddd;
}
.headerRow {
	font-weight: bold;
	border-bottom: 2px solid #555;
}
#hrDocumentUploads a {
	font-size: .8em;
	border-radius: 6px;
	padding: 1px 6px;
	text-decoration: none;
	color: #fff;
}
#hrDocumentUploads a.blueActionLink {
	background: #0000ff;
	margin-right: 5px;
}
#hrDocumentUploads a.redActionLink {
	background: #ff0000;
	margin-left: 15px;
	cursor: pointer;
}
a.linkToTickets {
	color: darkblue;
	cursor: pointer;
	font-size: .9em;
}
.dbStorePic {
	background-size: cover;
	background-position: center;
	height: 50px;
	width: 50px;
}
.dbStoreItems {
	text-align: center;
}
.dbStoreItem {
	display: inline-block;
	font-size: 0.8em;
	margin: 0px;
	text-align: center;
	width: 30%;
}
p#dbStoreLink>a {
	text-decoration: underline;
	font-size: .9em;
	cursor: pointer;
}
.dbStorePic {
	display: inline-block;
}
.dbStoreItem>h4 {
	margin: 20px 0 0 0;
}
div.tab {
	transition: background 500ms linear;
}
.analyticsCatDiscrepancy {
	width: 80%;
	text-align: center;
	margin: 20px 0 0 10%;
}
.analyticsCatDiscrepancy>p {
	color: #ff0000;
	font-weight: bold;
}
.projectAnalyticsBody .analyticsDetailsLink {
	float: right;
	margin-right: 15px;
}
.analCatRow {
	display: flex;
	border-bottom: 1px solid #080f2e
}
.analCatRow .rowTextName {
	white-space: nowrap;
	overflow: hidden;
	margin-left: 5px;
	margin-right: 5px;
	width: 30%;
}
.catHours {
	background: #eee;
	border-left: 2px solid #999;
	border-right: 2px solid #999;
	padding: 0 5px;
	margin: 0 10px;
	border-radius: 0 0 10px 10px;
}
.projectAnalyticsContainer .rowTextName {
	margin-right: 0;
}
.projectAnalyticsContainer div#categoryAnalyticsBlock .analRow {
	border-top: 0 none;
	border-bottom: 1px solid #080f2e;
	margin: 0;
}
.expenseUpload.clearGreyButton {
	color: #0000ff;
	border: 1px solid #0000ff;
	text-decoration: none;
	padding: 2px 8px;
	margin: 5px;
	border-radius: 6px;
	background: #bbb;
	font-weight: bold;
	font-size: .9em;
	display: inline-block;
}
#expenseReports .dataRow.expenseDetails {
	display: block;
}
.expenseItem {
	display: flex;
	margin: 10px 0;
	padding: 5px 10px;
	border-radius: 4px;
	border: 1px solid #ccc;
}
.expenseItem h4 {
	margin: 0 0 10px;
	border-bottom: 1px solid #999;
}
.expenseItemLeft, .expenseItemRight {
	flex: 1;
}
.expenseUpload.clearGreyButton i {
	margin: 0 4px;
}
.expenseUpload.clearGreyButton a.delete>i {
	color: #ff0000;
	cursor: pointer;
}
.expenseUpload.clearGreyButton i {
	opacity: 0.7;
}
.expenseUpload.clearGreyButton i:hover {
	opacity: 1;
}
a.deleteItem {
	margin: 0 0 0 5px;
	opacity: .7;
	cursor: pointer;
}
a.deleteItem.notAvailable {
	color: #aaa;
	pointer-events: none;
}
a.deleteItem.available {
	color: #ff0000;
}
a.deleteItem.available:hover {
	opacity: 1;
}
.closeExpenseItem {
	margin-left: 5px;
	cursor: pointer;
}
.expenseItemLeft h4>select {
	font-weight: bold;
	font-size: 1em;
	margin: 0 0 0 9px;
	color: #0000ff;
}
.removeExpenseFilters {
	text-align: center;
	margin-top: 20px;
}
select#expenseStatusFilter {
	font-weight: bold;
	font-size: 1em;
	color: #0000ff;
}
span.expenseItemAmount {
	background: #bde0ff;
	margin: 5px 10px;
	display: inline-block;
	padding: 2px 10px;
	border: 1px solid #b1b1ff;
}
span.expenseItemTotal {
	background: #f5d474;
	margin: 5px 10px;
	display: inline-block;
	padding: 2px 10px;
	border: 1px solid #b1b1ff;
}
h4.totalExpensesRow {
	display: inline-block;
	background: #ff8787;
	padding: 2px 10px;
	margin: 10px;
}
.toolsSection h3 {
	margin-top: 5px;
}
div#storeItemTable>form.storeItemEdit.dataRow.unpublished {
	background: #ffe59a;
}
div#ipAddressNotice {
    display: block;
    text-align: center;
    font-size: .7em;
    margin-top: 50px;
}
#colUpload {
	text-align: center;
	display: flex;
}
/* Style for the file icon (when a file exists) */
#colUpload a.fileIcon {
	color: #111; /* Dark grey */
	cursor: pointer;
	margin: 0 5px;
	display: inline-block;
}

#colUpload a.fileIcon i {
	font-size: 1.2em; /* Increased size for better visibility */
}

/* Style for the upload icon (for uploading/replacing) */
#colUpload a.uploadIcon {
	color: #999; /* Medium grey */
	cursor: pointer;
	margin: 0 5px;
	display: inline-block;
}

#colUpload a.uploadIcon i {
	font-size: 1.2em; /* Increased size for better visibility */
}

/* Hover effects to maintain usability */
#colUpload a.fileIcon:hover {
	color: #1a1a1a; /* Slightly darker grey on hover */
}

#colUpload a.uploadIcon:hover {
	color: #4d4d4d; /* Slightly darker medium grey on hover */
}

/* Popup styles */
#filePopup {
	position: fixed;
	top: 20%;
	left: 50%;
	transform: translateX(-50%);
	width: 300px;
	z-index: 1000;
}

#filePopup h3 {
	margin-top: 10px;
}

#filePopup .blueButton, #filePopup .orangeButton {
	padding: 5px 15px;
	font-size: 1em;
}

#filePopupClose {
	color: #ff0000;
	font-size: 1.5em;
	cursor: pointer;
	position: absolute;
	top: 5px;
	right: 5px;
}
.reportRowDivider .usedMobileIcon {
	color: #fff;
	margin-left: 10px;
}
/* PM Report Columns */
.singleMgrReportHeaders,
.pmReportData > .pmReportRow {
	display: flex;
	width: 95%;
	padding-right: 5%;
}

.pmDataCol {
	flex: 1; /* Distribute available space equally among visible columns */
	text-align: left;
	display: none; /* Hidden by default, shown via PHP-generated CSS */
}

.pmDataCol.col2,
.pmDataCol.ssTotal {
	flex: 1.5; /* Slightly wider for Record#, Project, and Total columns */
}
.pmDataCol.col2 {
	margin-right: 10px;
}

/* Super Report Columns */
.superReportHeaders,
.superReportData > .superReportRow {
	display: flex;
	width: 100%;
}

.superColData {
	flex: 1; /* Distribute available space equally among visible columns */
	text-align: left;
	display: none; /* Hidden by default, shown via PHP-generated CSS */
}

.superColJobId.superColData {
	flex: 2; /* Wider for Project column */
}

.superColData.ssTotal {
	flex: 1.5; /* Slightly wider for Total column */
}

/* Ensure mobile labels are styled consistently */
.pmDataCol .mobileOnlyReports,
.superColData .mobileOnlyReports {
	display: none;
}

/* Override specific widths for quantities row to maintain consistency */
.empRow.quantitiesRow .empCol {
	flex: 1;
	text-align: left;
	word-break: break-all;
	overflow-wrap: break-word;
}

/* Ensure totals row and grand total maintain consistent styling */
.empRow.totalsRow,
.gTot.dataRow {
	display: flex;
	width: 100%;
	justify-content: space-between;
	padding-right: 5%;
}
/* Styles for ticket responses */
.ticketResponses {
	margin: 10px 0;
	padding: 10px;
	background: #f9f9f9;
	border: 1px solid #ddd;
	border-radius: 5px;
	max-height: 200px;
	overflow-y: auto;
}
.ticketResponses .response {
	margin-bottom: 10px;
	padding: 8px;
	border-radius: 5px;
	max-width: 70%;
}
.ticketResponses .userResponse {
	background: #e6f3ff;
	margin-right: 20%;
	margin-left: 5%;
}
.ticketResponses .adminResponse {
	background: #d4edda;
	margin-left: 20%;
	margin-right: 5%;
	text-align: right;
}
.ticketResponses .responseSender {
	font-weight: bold;
	font-size: 0.9em;
	color: #333;
}
.ticketResponses .responseMessage {
	margin: 5px 0;
	font-size: 0.9em;
	color: #555;
}
.ticketResponses .responseTime {
	font-size: 0.8em;
	color: #999;
}
.responseForm {
	margin: 10px 0;
	padding: 10px;
	background: #eee;
	border: 1px solid #ccc;
	border-radius: 5px;
}
.responseForm textarea {
	width: 100%;
	max-width: 100%;
	border: 1px solid #aaa;
	border-radius: 4px;
	padding: 5px;
	font-size: 0.9em;
	resize: vertical;
}
.responseForm .submitResponse {
	margin-top: 5px;
	padding: 5px 10px;
	font-size: 0.9em;
}
.appStoreIcons {
	text-align: center;
	margin-top: 20px;
	margin-bottom: 20px;
}

.appStoreLink {
	display: inline-block;
	margin: 0 10px;
}

.appStoreBadge {
	width: 150px;
	height: auto;
	max-height: 50px;
	transition: opacity 0.3s;
}

.appStoreLink:hover .appStoreBadge {
	opacity: 0.8;
}

/* .appStoreLink.disabled .appStoreBadge {
	opacity: 0.5;
	cursor: not-allowed;
} */

@media (max-width: 600px) {
	.appStoreBadge {
		width: 120px;
	}

	.appStoreLink {
		margin: 5px;
	}
}

#invitationCodeDialog {
	font-family: Arial, sans-serif;
	line-height: 1.5;
	padding: 15px;
}
#invitationCodeDialog h3 {
	margin-top: 0;
	font-size: 1.2em;
}
#invitationCodeDialog p {
	margin: 10px 0;
	font-size: 0.9em;
}
#invitationCodeDialog .appStoreButton {
	display: inline-block;
	padding: 10px 20px;
	background-color: #f28c38; /* Matches orangeButton */
	color: white;
	text-decoration: none;
	border-radius: 5px;
	margin-top: 10px;
	font-size: 0.9em;
}
#invitationCodeDialog .appStoreButton:hover {
	background-color: #d97a30; /* Darker shade for hover */
}

.settingField >div#abmCodesContainer {
	font-family: Arial, sans-serif;
	margin: 20px 0;
	width: 100%;
}

.abm-codes-stats {
	margin-bottom: 30px;
	width: 100%;
}
    
.stats-grid {
	display: flex;
	gap: 20px;
	width: 100%;
	justify-content: space-between;
}
    
.stat-box {
	background-color: #f5f5f5;
	border-radius: 8px;
	padding: 15px;
	text-align: center;
	flex: 1;
}
    
.stat-box.available {
	background-color: #e8f5e9;
}
    
.stat-box.used {
	background-color: #e3f2fd;
}
    
.stat-number {
	display: block;
	font-size: 24px;
	font-weight: bold;
	margin-bottom: 5px;
}
    
.stat-label {
	color: #666;
}
    
.abm-codes-tables {
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
	width: 100%;
}
    
.abm-codes-table {
	flex: 1 1 100%;
	min-width: 300px;
}
    
.abm-codes-table table {
	width: 100%;
	border-collapse: collapse;
	margin-bottom: 30px;
}
    
.abm-codes-table th, .abm-codes-table td {
	padding: 10px;
	text-align: left;
	border-bottom: 1px solid #ddd;
}
    
.abm-codes-table th {
	background-color: #f2f2f2;
}
    
.no-codes {
	text-align: center;
	color: #999;
	padding: 20px 0;
}
    
.copy-code-btn, .copy-link-btn {
	background-color: #f0f0f0;
	border: none;
	padding: 5px 10px;
	margin-right: 5px;
	border-radius: 4px;
	cursor: pointer;
}
    
.copy-code-btn:hover, .copy-link-btn:hover {
	background-color: #e0e0e0;
}
    
/* Media queries for responsive design */
@media (min-width: 992px) {
	.abm-codes-table {
		flex: 0 0 48%;
	}
}

.mark-used-btn {
	background-color: #8e8ec5;
	color: white;
	border: none;
	padding: 5px 10px;
	border-radius: 4px;
	cursor: pointer;
}

.mark-used-btn:hover {
	background-color: #2f4dd3;
}
.ui-dialog {
	max-width: 100%;
}
.labor-reports2 #secondReportLink {
	display: none;
}
.labor-reports2 div#printButtonContainer>button.smallRedButton {
	display: none;
}
.labor-reports div#printButtonContainer>span#noEditNote {
	display: none;
}
.labor-reports2 div#printButtonContainer>span#noEditNote {
	display: inline-block;
	margin-left: 5px;
	font-style: italic;
}
.viewTabs {
	display: flex;
	margin-bottom: 20px;
	border-bottom: 1px solid #ddd;
	padding-left: 2%;
}

#tasksTab {
	display: none;
}

.userGroup8 #tasksTab {
	display: block;
}

.viewTabs .tab {
	padding: 10px 20px;
	cursor: pointer;
	border: 1px solid #ddd;
	border-bottom: none;
	border-radius: 5px 5px 0 0;
	margin-right: 5px;
	background-color: #f5f5f5;
	margin-top: 10px;
}

.viewTabs .tab.active {
	background-color: #fff;
	border-bottom: 1px solid #fff;
	margin-bottom: -1px;
	font-weight: bold;
}

.ticketsView, .tasksView {
	width: 100%;
}

.taskRow {
	/* You can style task rows differently if desired */
	border-left-color: #4a90e2 !important;
}


/* ===== Ticket Grid Container ===== */
.tickets-container {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
	gap: 20px;
	margin-bottom: 30px;
}

/* ===== Individual Ticket Card ===== */
.ticket-card {
	background: #fff;
	border-radius: 8px;
	border: 1px solid #e0e0e0;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	height: 100%;
	transition: all 0.3s ease;
	box-shadow: 0 2px 5px rgba(0,0,0,0.05);
}

.ticket-card:hover {
	transform: translateY(-3px);
	box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}

.ticket-card[data-status="closed"] {
	background-color: #f9f9f9;
	opacity: 0.8;
}

/* ===== Card Header ===== */
.ticket-header {
	padding: 15px;
	background: #f8f9fa;
	border-bottom: 1px solid #eaeaea;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 10px;
	flex-wrap: wrap;
}

.ticket-card.ticketStatus2>.ticket-header {
	background: linear-gradient(to bottom, #b3ffb3, #f8f9fa);
}

.ticket-title-row {
	flex: 1;
	display: flex;
	gap: 10px;
	min-width: 200px;
}

.ticket-title {
	margin: 0;
	font-size: 16px;
	font-weight: 600;
	color: #333;
	min-height: 40px;
}

.urgency-badge {
	display: inline-block;
	min-width: 28px;
	height: 28px;
	border-radius: 14px;
	color: #333;
	font-weight: bold;
	text-align: center;
	line-height: 28px;
	font-size: 14px;
	flex-shrink: 0;
}

/* ===== Card Meta Information ===== */
.ticket-meta {
	padding: 12px 15px;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
	gap: 10px;
	background: #fcfcfc;
	border-bottom: 1px solid #f0f0f0;
	font-size: 0.9em;
}

.meta-item {
	display: flex;
	align-items: center;
	gap: 5px;
	color: #666;
}

.meta-item i {
	color: #999;
}

/* ===== Card Actions ===== */
.ticket-actions {
	padding: 12px 15px;
	display: flex;
	justify-content: space-between;
	border-top: 1px solid #f0f0f0;
	background: #f8f9fa;
	gap: 10px;
	flex-wrap: wrap;
}

.screenshot-btn {
	background: #e0e8ff;
	padding: 6px 12px;
	border-radius: 4px;
	color: #2c6df9;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	gap: 5px;
	text-decoration: none;
	font-size: 13px;
	transition: all 0.2s;
}

.screenshot-btn:hover {
	background: #d0d8ef;
	text-decoration: none;
}

.convertTypeBtn {
	background: #4a6cf7;
	color: white;
	border: none;
	border-radius: 4px;
	padding: 6px 12px;
	font-size: 13px;
	cursor: pointer;
	transition: background 0.2s;
	white-space: nowrap;
}

.convertTypeBtn:hover {
	background: #2a4bd7;
}

/* ===== Status Dropdown ===== */
.ticket-header select {
	padding: 5px 8px;
	border-radius: 4px;
	border: 1px solid #ddd;
	font-size: 13px;
	background: white;
	cursor: pointer;
	min-width: 120px;
}

div#closedTicketsArea, div#closedTasksArea {
	background: #ddd;
}

.workingOnSelected {
	background: #fff565 !important;
}

.ticket-responses {
	margin-top: 15px;
	padding-top: 15px;
	border-top: 1px solid #eee;
}

.responses-container {
	max-height: 300px;
	overflow-y: auto;
	margin-bottom: 15px;
	padding: 10px;
	background: #f9f9f9;
	border-radius: 5px;
}

.response {
	margin-bottom: 10px;
	padding: 10px;
	border-radius: 5px;
	background: #fff;
	box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}

.user-response {
	border-left: 3px solid #4a90e2;
}

.admin-response {
	border-left: 3px solid #50e3c2;
}

/* Add these styles */
.toggle-responses {
	background: #4a6cf7; /* Default blue */
	color: white;
	border: none;
	border-radius: 4px;
	padding: 6px 12px;
	font-size: 13px;
	cursor: pointer;
	transition: all 0.2s;
	white-space: nowrap;
}

.toggle-responses.has-responses {
	background: #4CAF50; /* Green for tickets with responses */
}

.toggle-responses:hover {
	opacity: 0.9;
}

.ticket-responses {
	margin-top: 15px;
	padding-top: 15px;
	border-top: 1px solid #eee;
}

.responses-container {
	max-height: 300px;
	overflow-y: auto;
	margin-bottom: 15px;
	padding: 10px;
	background: #f9f9f9;
	border-radius: 5px;
}

.response {
	margin-bottom: 10px;
	padding: 10px;
	border-radius: 5px;
	background: #fff;
	box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}

.user-response {
	border-left: 3px solid #4a90e2;
}

.admin-response {
	border-left: 3px solid #50e3c2;
}

.response-form {
	display: flex;
	gap: 10px;
}

.response-form .smallBlueButton {
	background: #999;
	height: 25px;
 }



/* Response Styling */
.ticket-responses {
	margin-top: 15px;
	padding-top: 15px;
	border-top: 1px solid #eee;
}

.response {
	margin-bottom: 15px;
	padding: 12px;
	border-radius: 8px;
	position: relative;
}

.admin-response {
	background-color: #e3f2fd;
	border-left: 3px solid #1976d2;
	margin-left: 20%;
}

.user-response {
	background-color: #f5f5f5;
	border-left: 3px solid #9e9e9e;
	margin-right: 20%;
}

.response-header {
	display: flex;
	align-items: center;
	margin-bottom: 8px;
}

.response-avatar {
	width: 24px;
	height: 24px;
	border-radius: 50%;
	/* margin-right: 10px; */
	overflow: hidden;
	background: #ddd;
	display: flex;
	align-items: center;
	justify-content: center;
}

.response-avatar img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.response-avatar i {
	font-size: 14px;
	color: #777;
}

.response-sender {
	font-weight: bold;
	font-size: 0.95em;
	margin-left: 5px;
}

.response-message {
	line-height: 1.5;
	margin-bottom: 5px;
}

.response-time {
	font-size: 0.8em;
	color: #777;
	text-align: right;
}

/* Show More button */
.show-more-container {
	text-align: center;
	margin: 15px 0;
}

.show-more-btn {
	color: #1976d2;
	cursor: pointer;
	font-size: 0.9em;
}

.show-more-btn i {
	margin-right: 5px;
}

/* Always-visible response form */
.response-form {
	margin-top: 15px;
	padding: 15px;
	background: #f9f9f9;
	border-radius: 8px;
	border: 1px solid #eee;
}

.responses-chronological {
	display: flex;
	flex-direction: column;
}

.responses-chronological .response {
	order: 1; /* Default order for all responses */
}

.responses-chronological .response:last-child {
	order: 2;
	margin-top: 15px;
	border-top: 1px solid #eee;
	padding-top: 15px;
}

* Collapsible descriptions */
.ticket-description {
	max-height: 3.6em;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	line-clamp: 3;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	transition: max-height 0.3s ease;
}

.ticket-description.expanded {
	max-height: none;
	line-clamp: unset;
	-webkit-line-clamp: unset;
}

.read-more, .show-less {
	color: #0066cc;
	font-weight: bold;
	margin-left: 5px;
	cursor: pointer;
}
.screenshotFrame .screenshot-viewer {
	position: relative;
	max-width: 90vw;
	max-height: 60vh;
}

.screenshotFrame .screenshot-image {
	max-width: 100%;
	max-height: 80%;
	object-fit: contain;
	transition: transform 0.3s ease;
}

.screenshotFrame .screenshot-image.zoomed {
	transform: scale(2);
}

.screenshotFrame .viewer-controls {
	position: absolute;
	top: 8px;
	right: 8px;
	display: flex;
	gap: 8px;
}

.screenshotFrame .viewer-controls a {
	color: #fff;
	font-size: 1.5em;
	cursor: pointer;
	text-decoration: none;
}

.screenshotFrame .zoom-btn, .screenshotFrame .close-btn {
	background: rgba(0,0,0,0.5);
	color: white;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
}

.response-screenshot a {
	cursor: pointer;
}


/* Improved reply form */
.reply-box {
	margin-top: 10px;
}

.reply-input-container {
	display: flex;
	border: 1px solid #ddd;
	border-radius: 20px;
	padding: 8px 15px;
	transition: all 0.3s ease;
}

.reply-input-container.expanded {
	border-radius: 10px;
	padding: 15px;
}

.reply-input-container textarea {
	flex: 1;
	border: none;
	resize: none;
	min-height: 24px;
	max-height: 120px;
	overflow-y: auto;
	padding: 0;
	margin: 0;
}
.reply-input-container textarea:focus-visible {
	outline: none;
	border: 0 none;
}

.reply-actions {
	display: flex;
	align-items: center;
	margin-left: 10px;
}

.attach-button {
	cursor: pointer;
	color: #666;
	font-size: 18px;
	margin-right: 10px;
	transition: color 0.2s;
}

.attach-button:hover {
	color: #000;
}

/* Screenshot preview */
.screenshot-preview {
	margin-top: 10px;
	display: none;
}

.screenshot-preview img {
	max-width: 100px;
	max-height: 100px;
	border-radius: 5px;
	border: 1px solid #ddd;
	margin-right: 10px;
}

.screenshot-preview .remove-screenshot {
	color: #ff0000;
	cursor: pointer;
	margin-left: 5px;
}



.ticket-description {
	overflow: hidden;
	position: relative;
	transition: max-height 0.3s ease;
	padding:5px 8px;
	color: #444;
	font-size: 14px;
	min-height: 80px;
}

.ticket-description.expanded {
	max-height: none;
}

.read-more, .show-less {
	color: #0066cc;
	font-weight: bold;
	margin-left: 5px;
	cursor: pointer;
}

.screenshotFrame {
	display: none;
	position: fixed;
	top: 0; left: 0; right: 0; bottom: 0;
	background: rgba(0,0,0,0.8);
	z-index: 1000;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: auto;
}

.firldContainer.withSearch select, .inputContainer.withSearch select {
	position: relative;
	max-height: 200px;
}

input.searchDropdown {
	vertical-align:top;
	padding:2px 4px;
}

.reportForm input.searchDropdown {
	margin: 2px 0 8px;
}

/* ===== Mobile Optimization ===== */
@media (max-width: 768px) {
	.tickets-container {
		grid-template-columns: 1fr;
	}
    
	.ticket-header {
		flex-direction: column;
		align-items: stretch;
		gap: 15px;
	}
    
	.ticket-title-row {
		margin-bottom: 0;
	}
    
	.ticket-meta {
		grid-template-columns: 1fr;
	}
    
	.ticket-actions {
		flex-direction: column;
	}
    
	.ticket-actions > * {
		width: 100%;
		text-align: center;
	}
    
	.ticket-header select {
		align-self: flex-start;
	}
}

/* Support Widget Styling */
.completedTicket {
    margin-bottom: 8px;
    padding: 8px;
    background-color: #f9f9f9;
    border-left: 3px solid #28a745;
    border-radius: 3px;
}

.completedTicket .ticketTitle {
    font-weight: bold;
    color: #333;
    margin-bottom: 4px;
    font-size: 14px;
}

.completedTicket .ticketDesc {
    color: #666;
    font-size: 12px;
    line-height: 1.4;
}

.widgetScrollFrame .completedTicket:last-child {
    margin-bottom: 0;
}

/* ===== Shipping & Receiving Page Specific Styles ===== */
#srPage .addEmployeeForm .flexFormFields.srPageRow1,
#srPage .addEmployeeForm .flexFormFields.srPageRow2 {
    display: flex;
    margin-bottom: 15px;
}

#srPage .addEmployeeForm .flexFormFields.srPageRow1 .fieldContainer,
#srPage .addEmployeeForm .flexFormFields.srPageRow2 .fieldContainer {
    width: 100%;
    margin-right: 15px;
    position: relative;
}

#srPage .addEmployeeForm .flexFormFields.srPageRow1 .fieldContainer:last-child,
#srPage .addEmployeeForm .flexFormFields.srPageRow2 .fieldContainer:last-child {
    margin-right: 0;
}

/* Special styling for the Hot Item checkbox field */
#srPage .addEmployeeForm .fieldContainer.srPageHotItem {
    max-width: 120px;
    flex-shrink: 0;
}

#srPage .addEmployeeForm .fieldContainer.srPageHotItem label {
    white-space: nowrap;
}

/* Ensure required asterisks have enough space */
#srPage .addEmployeeForm .fieldContainer label {
    display: block;
    margin-bottom: 5px;
    padding-right: 20px;
}

/* Adjust input and select widths to accommodate asterisks */
#srPage .addEmployeeForm .fieldContainer input,
#srPage .addEmployeeForm .fieldContainer select,
#srPage .addEmployeeForm .fieldContainer textarea {
    max-width: calc(100% - 25px);
}

/* Style the required asterisks specifically for SR page */
#srPage .addEmployeeForm .fieldContainer .requiredAsterisk {
    position: absolute;
    top: 25px;
    color: #ff0000;
    font-size: 1.4em;
    font-weight: bold;
}

/* Special positioning for textarea asterisks */
#srPage .addEmployeeForm .fieldContainer textarea + .requiredAsterisk {
    top: 30px;
}

/* Mobile responsive adjustments */
@media (max-width: 768px) {
    #srPage .addEmployeeForm .flexFormFields.srPageRow1,
    #srPage .addEmployeeForm .flexFormFields.srPageRow2 {
        flex-direction: column;
    }
    
    #srPage .addEmployeeForm .flexFormFields.srPageRow1 .fieldContainer,
    #srPage .addEmployeeForm .flexFormFields.srPageRow2 .fieldContainer {
        margin-right: 0;
        margin-bottom: 15px;
    }
    
    #srPage .addEmployeeForm .fieldContainer.srPageHotItem {
        max-width: none;
    }
}

/* ===== Inventory PO2 Screen Responsive Styles ===== */
/* Scoped to .inventoryRequestPage to prevent inheritance by other screens */
/* Only mobile-specific overrides, preserving desktop layout */

/* Mobile Responsive Styles - Only apply on mobile to avoid desktop layout issues */
@media (max-width: 768px) {
  /* Tab container adjustments */
  .inventoryRequestPage .tabContainer {
    margin: 10px 5px;
  }
  
  .inventoryRequestPage .tabButtons {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  
  .inventoryRequestPage .tabContent {
    padding: 15px 10px !important;
  }
  
  /* Form sections responsive */
  .inventoryRequestPage .greyFormSection {
    padding: 15px 10px;
    margin: 10px 0;
  }
  
  /* Main form fields - stack on mobile */
  .inventoryRequestPage .inlineFields {
    flex-direction: column !important;
  }
  
  .inventoryRequestPage .inlineFields > div {
    width: 100% !important;
    margin-bottom: 15px;
  }
  
  /* Materials boxes mobile layout */
  .inventoryRequestPage #materialsBoxes {
    display: block !important;
    text-align: center;
  }
  
  .inventoryRequestPage .materialsBox {
    width: calc(100% - 20px) !important;
    margin: 10px 0 15px 0 !important;
    display: block !important;
    vertical-align: top !important;
  }
  
  .inventoryRequestPage .materialsBox input,
  .inventoryRequestPage .materialsBox textarea,
  .inventoryRequestPage .materialsBox select {
    max-width: 100% !important;
    width: 100% !important;
  }
  
  /* PO Log table - convert to cards on mobile */
  .inventoryRequestPage .dataTable {
    display: block;
    font-size: 0.9em;
  }
  
  .inventoryRequestPage .dataTable thead {
    display: none;
  }
  
  .inventoryRequestPage .dataTable tbody,
  .inventoryRequestPage .dataTable tr,
  .inventoryRequestPage .dataTable td {
    display: block;
    width: 100%;
  }
  
  .inventoryRequestPage .dataTable tr {
    background: #fff;
    border: 1px solid #ddd;
    margin-bottom: 15px;
    padding: 15px;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
  }
  
  .inventoryRequestPage .dataTable td {
    padding: 8px 0;
    border-bottom: none;
    position: relative;
    padding-left: 120px;
  }
  
  .inventoryRequestPage .dataTable td::before {
    content: attr(data-label) ": ";
    position: absolute;
    left: 0;
    top: 8px;
    font-weight: bold;
    color: #495057;
    width: 110px;
  }
  
  .inventoryRequestPage .dataTable td:last-child {
    padding-left: 0;
    text-align: center;
    margin-top: 10px;
  }
  
  .inventoryRequestPage .dataTable td:last-child::before {
    display: none;
  }
}

/* Tablet specific adjustments */
@media (max-width: 1024px) and (min-width: 769px) {
  /* Make material boxes stack on tablet */
  .inventoryRequestPage .materialsBox {
    width: calc(100% - 20px) !important;
    margin-right: 0 !important;
  }
  
  /* Make table more compact on tablet */
  .inventoryRequestPage .dataTable {
    font-size: 0.95em;
  }
  
  /* Optionally hide less critical columns on tablet */
  .inventoryRequestPage .dataTable th:nth-child(7),
  .inventoryRequestPage .dataTable td:nth-child(7) {
    display: none;
  }
}

/* Small mobile adjustments */
@media (max-width: 480px) {
  .inventoryRequestPage .tabButton {
    font-size: 0.9em;
    padding: 12px 15px;
  }
  
  .inventoryRequestPage .materialsBox {
    padding: 12px;
  }
}
form#inventoryRequest label, form#inventoryRequest input {
	display: block;
}
form#inventoryRequest .fieldContainer {
	text-align: left;
	width: 98%;
	margin-right: 2%;
}
form#inventoryRequest .fieldContainer select {
	vertical-align: top;
}

/* ================================================================
   GALLERY MANAGER STYLES
   ================================================================ */

/* Container & Layout */
.gallery-manager-2 #galleryManagerContainer {
	padding: 20px 0;
    width: 96%;
    margin: 0 auto;
}

.gallery-manager-2 #galleryManagerContainer .galleryManagerRow {
	background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
	margin-bottom: 24px;
	transition: all 0.2s ease;
    overflow: hidden;
}

.gallery-manager-2 #galleryManagerContainer .galleryManagerRow:not(:first-child)::before {
	content: '';
	display: block;
	height: 1px;
	background: linear-gradient(to right, transparent, #e5e7eb 50%, transparent);
	margin-bottom: 16px;
}

.gallery-manager-2 #galleryManagerContainer .galleryManagerRow:hover {
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.08);
	border-color: #cbd5e0;
	background: #fff;
}

.gallery-manager-2 #galleryManagerContainer .galleryManagerRow.rowLight {
	background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
}

.gallery-manager-2 #galleryManagerContainer .galleryManagerRow.rowDark {
	background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%);
}

/* Gallery Row Top (Clickable Header) */
.gallery-manager-2 #galleryManagerContainer .galleryManagerRowTop {
	background: #f8f9fa; /* Slight background color */
	padding: 8px 12px; /* Reduced padding */
	display: flex;
	align-items: center;
	gap: 12px; /* Reduced gap */
	cursor: pointer;
	color: #2d3748;
	transition: background 0.2s ease;
}

.gallery-manager-2 #galleryManagerContainer .galleryManagerRowTop:hover {
	background: #edf2f7; /* Slightly darker on hover */
}

/* Cover Image */
.gallery-manager-2 #galleryManagerContainer .galleryCoverImage {
	width: 50px; /* Reduced size */
	height: 50px; /* Reduced size */
	border-radius: 6px;
	overflow: hidden;
	flex-shrink: 0;
	border: 1px solid #e2e8f0;
	background: #f7fafc;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
	transition: all 0.2s ease;
}

.gallery-manager-2 #galleryManagerContainer .galleryCoverImage:hover {
	transform: translateY(-1px);
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.12);
}

.gallery-manager-2 #galleryManagerContainer .galleryCoverImage img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.2s ease;
}

.gallery-manager-2 #galleryManagerContainer .galleryCoverImage:hover img {
	transform: scale(1.05);
}

.gallery-manager-2 #galleryManagerContainer .galleryCoverImage img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.gallery-manager-2 #galleryManagerContainer .galleryCoverImage.placeholder {
	color: #cbd5e0;
	font-size: 1.2rem;
}

/* Cover Count Badge - for galleries with multiple covers needing cleanup */
.gallery-manager-2 #galleryManagerContainer .coverCountBadge {
	position: absolute;
	top: -5px;
	right: -5px;
	background: #ff6b6b;
	color: white;
	font-size: 0.65rem;
	font-weight: 700;
	min-width: 18px;
	height: 18px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 2px solid white;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
	z-index: 1;
}

/* Make parent container relative for badge positioning */
.gallery-manager-2 #galleryManagerContainer .galleryCoverImage {
	position: relative;
}

/* Site Icons */
.gallery-manager-2 #galleryManagerContainer .projectGallerySiteIcons {
	display: flex;
	gap: 6px;
	align-items: center;
    min-width: 60px;
}

.gallery-manager-2 #galleryManagerContainer .siteIcon {
	width: 24px; /* Reduced size */
	height: 24px; /* Reduced size */
	object-fit: contain;
}

/* Gallery Name & Info */
.gallery-manager-2 #galleryManagerContainer .projectGalleryName {
	flex: 1;
	font-size: 1rem; /* Reduced font size */
	font-weight: 600;
	color: #2b6cb0; /* Blue */
    text-decoration: none;
}

.gallery-manager-2 #galleryManagerContainer .projectGalleryName:hover {
    color: #2c5282;
    text-decoration: underline;
}

.gallery-manager-2 #galleryManagerContainer .projectGalleryImageCount {
	display: flex;
	align-items: center;
	gap: 4px;
	background: #edf2f7;
    color: #4a5568;
	padding: 4px 8px; /* Reduced padding */
	border-radius: 16px;
	font-size: 0.75rem; /* Reduced font size */
	font-weight: 600;
    white-space: nowrap;
}

.gallery-manager-2 #galleryManagerContainer .projectGalleryImageCount i {
	font-size: 0.85rem;
    color: #718096;
}

.gallery-manager-2 #galleryManagerContainer .projectGalleryCompleted {
	display: flex;
	gap: 4px; /* Reduced gap */
	flex-wrap: wrap;
    justify-content: flex-end;
    max-width: 45%;
}

/* Completion Indicators */
.gallery-manager-2 #galleryManagerContainer .completedField {
	background: linear-gradient(135deg, #d4f4e2 0%, #c6f6d5 100%);
	color: #166534;
	padding: 3px 6px; /* Reduced padding */
	border-radius: 4px;
	font-size: 0.7rem; /* Reduced font size */
	font-weight: 600;
	display: inline-flex;
	align-items: center;
	gap: 3px;
    border: 1px solid #86efac;
    box-shadow: 0 1px 2px rgba(0,0,0,0.05);
    white-space: nowrap;
    /* max-width: 120px; */
    overflow: hidden;
    text-overflow: ellipsis;
    transition: all 0.2s ease;
}

.gallery-manager-2 #galleryManagerContainer .completedField:hover {
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.gallery-manager-2 #galleryManagerContainer .completedField i {
    font-size: 0.75rem;
}

.gallery-manager-2 #galleryManagerContainer .nonCompletedField {
	background: linear-gradient(135deg, #fee2e2 0%, #fed7d7 100%);
	color: #991b1b;
	padding: 3px 6px; /* Reduced padding */
	border-radius: 4px;
	font-size: 0.7rem; /* Reduced font size */
	font-weight: 600;
	display: inline-flex;
	align-items: center;
	gap: 3px;
    border: 1px solid #fca5a5;
    box-shadow: 0 1px 2px rgba(0,0,0,0.05);
    white-space: nowrap;
    /* max-width: 120px; */
    overflow: hidden;
    text-overflow: ellipsis;
    transition: all 0.2s ease;
}
.gallery-manager-2 #galleryManagerContainer .nonCompletedField.optionalField {
	background: linear-gradient(135deg, #e7e7e7 0%, #b1b1b1 100%);
	color: #1a1a1a;
}

.gallery-manager-2 #galleryManagerContainer .nonCompletedField:hover {
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.gallery-manager-2 #galleryManagerContainer .nonCompletedField i {
    font-size: 0.75rem;
}

/* Edit Section (Expandable) */
.gallery-manager-2 #galleryManagerContainer .galleryManagerRowBottom {
	background: #f8fafc;
	padding: 25px;
	border-top: 1px solid #e2e8f0;
}

/* Form Styles */
.gallery-manager-2 #galleryManagerContainer .formRow {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
	gap: 20px;
	margin-bottom: 20px;
}

.gallery-manager-2 #galleryManagerContainer .formField {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.gallery-manager-2 #galleryManagerContainer .formField label {
	font-weight: 600;
	color: #4a5568;
	font-size: 0.9rem;
}

.gallery-manager-2 #galleryManagerContainer .modernInput {
	padding: 10px 12px;
	border: 1px solid #cbd5e0;
	border-radius: 6px;
	font-size: 0.95rem;
	transition: all 0.2s ease;
	background: #fff;
    color: #2d3748;
}

.gallery-manager-2 #galleryManagerContainer .modernInput:focus {
	outline: none;
	border-color: #3182ce;
	box-shadow: 0 0 0 3px rgba(66, 153, 225, 0.15);
}

/* Site Selection Radio Group */
.gallery-manager-2 #galleryManagerContainer .radioGroup {
	display: flex;
	gap: 15px;
    align-items: center;
    height: 100%;
}

.gallery-manager-2 #galleryManagerContainer .radioGroup label {
    font-weight: normal;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 6px;
}

/* Image Management */
.gallery-manager-2 #galleryManagerContainer .imageManagementSection {
	margin-top: 30px;
    border-top: 1px solid #e2e8f0;
    padding-top: 20px;
}

.gallery-manager-2 #galleryManagerContainer .imageManagementSection h3 {
	color: #2d3748;
	margin-bottom: 15px;
	font-size: 1.1rem;
	font-weight: 600;
}

/* Upload Controls */
.gallery-manager-2 #galleryManagerContainer .upload-controls {
	display: flex;
	gap: 10px;
	align-items: center;
	margin-bottom: 20px;
	background: #f1f5f9;
	padding: 15px;
	border-radius: 8px;
	border: 1px solid #e2e8f0;
}

.gallery-manager-2 #galleryManagerContainer .upload-controls input[type="file"] {
	flex: 1;
	padding: 8px;
	background: #fff;
	border: 1px solid #cbd5e0;
	border-radius: 4px;
}

.gallery-manager-2 #galleryManagerContainer .upload-controls .blueButton {
	white-space: nowrap;
	padding: 10px 20px;
	border-radius: 6px;
	background: #3182ce;
	color: white;
	border: none;
	cursor: pointer;
	font-weight: 600;
	transition: background 0.2s;
}

.gallery-manager-2 #galleryManagerContainer .upload-controls .blueButton:hover {
	background: #2c5282;
}

/* Image Grid */
.gallery-manager-2 #galleryManagerContainer .image-grid-wrapper {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
	gap: 12px;
}

.gallery-manager-2 #galleryManagerContainer .image-grid-item {
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 6px;
	overflow: hidden;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.gallery-manager-2 #galleryManagerContainer .image-grid-item:hover {
	transform: translateY(-1px);
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.gallery-manager-2 #galleryManagerContainer .image-thumbnail-wrapper {
    height: 90px;
    width: 100%;
    background: #edf2f7;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    cursor: pointer;
}

.gallery-manager-2 #galleryManagerContainer .gallery-thumbnail {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.2s ease;
}

.gallery-manager-2 #galleryManagerContainer .image-grid-item:hover .gallery-thumbnail {
	transform: scale(1.02);
}

/* Image Controls */
.gallery-manager-2 #galleryManagerContainer .image-controls {
	padding: 6px 8px;
	display: flex;
	align-items: center;
	justify-content: space-between;
    background: #fff;
    border-top: 1px solid #e2e8f0;
}

.gallery-manager-2 #galleryManagerContainer .cover-checkbox-label {
	display: flex;
	align-items: center;
	gap: 4px;
	color: #4a5568;
	font-size: 0.7rem;
	font-weight: 600;
    cursor: pointer;
}

.gallery-manager-2 #galleryManagerContainer .delete-image-btn {
	background: transparent;
	color: #e53e3e;
	border: 1px solid #e53e3e;
	padding: 2px 6px;
	border-radius: 4px;
	cursor: pointer;
	font-size: 0.7rem;
	transition: all 0.2s ease;
}

.gallery-manager-2 #galleryManagerContainer .delete-image-btn:hover {
	background: #e53e3e;
    color: #fff;
}

/* Submit Button */
.gallery-manager-2 #galleryManagerContainer .formField.submit {
	margin-top: 20px;
    text-align: right;
}

.gallery-manager-2 #galleryManagerContainer .formField.submit a {
	background: #2b6cb0;
	color: #fff;
	padding: 12px 24px;
	border-radius: 6px;
	font-size: 1rem;
	font-weight: 600;
	cursor: pointer;
	transition: background 0.2s ease;
    display: inline-block;
    text-decoration: none;
	max-width: 100px;
	text-align: center;
	margin: 0 auto;
}

.gallery-manager-2 #galleryManagerContainer .formField.submit a:hover {
	background: #2c5282;
}

/* Responsive Design */
@media (max-width: 768px) {
	.gallery-manager-2 #galleryManagerContainer .galleryManagerRowTop {
		flex-direction: column;
		align-items: stretch;
		gap: 16px;
		padding: 16px;
	}

	.gallery-manager-2 #galleryManagerContainer .projectGallerySiteIcons {
		justify-content: center;
		min-width: auto;
	}

	.gallery-manager-2 #galleryManagerContainer .projectGalleryName {
		width: 100%;
		text-align: center;
		order: 3;
	}

	.gallery-manager-2 #galleryManagerContainer .projectGalleryImageCount {
		order: 2;
	}

    .gallery-manager-2 #galleryManagerContainer .projectGalleryCompleted {
        max-width: 100%;
        justify-content: center;
		flex-wrap: wrap;
		gap: 4px;
		order: 4;
    }

	.gallery-manager-2 #galleryManagerContainer .galleryCoverImage {
		width: 64px;
		height: 64px;
		align-self: center;
		order: 1;
	}

	.gallery-manager-2 #galleryManagerContainer .image-grid-wrapper {
		grid-template-columns: repeat(auto-fill, minmax(80px, 1fr));
		gap: 12px;
	}

	.gallery-manager-2 #galleryManagerContainer .formRow {
		grid-template-columns: 1fr;
		gap: 16px;
	}

	.gallery-manager-2 #galleryManagerContainer .radioGroup {
		flex-direction: column;
		gap: 8px;
	}
	
	.gallery-manager-2 #galleryManagerContainer .upload-controls {
		flex-direction: column;
		align-items: stretch;
	}
	
	.gallery-manager-2 #galleryManagerContainer .upload-controls .blueButton {
		width: 100%;
	}
}
/* Enhanced Gallery Image Popup Overrides */
.gallery-manager-2 #imagePopup {
	z-index: 10000 !important;
}

.gallery-manager-2 #imagePopup .image-popup-overlay {
	background: rgba(15, 23, 42, 0.95) !important;
	backdrop-filter: blur(8px) !important;
}

.gallery-manager-2 #imagePopup .image-popup-content {
	max-width: 95vw !important;
	max-height: 95vh !important;
	width: auto !important;
	height: auto !important;
	animation: fadeInScale 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
	padding: 20px !important;
}

@keyframes fadeInScale {
	from {
		opacity: 0;
		transform: scale(0.7) translateY(-20px);
	}
	to {
		opacity: 1;
		transform: scale(1) translateY(0);
	}
}

.gallery-manager-2 #imagePopup #popupImage {
	border-radius: 16px !important;
	box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(255, 255, 255, 0.05) !important;
	max-width: calc(100vw - 40px) !important;
	max-height: calc(100vh - 120px) !important;
	width: auto !important;
	height: auto !important;
	cursor: zoom-in;
	transition: transform 0.3s ease !important;
}

.gallery-manager-2 #imagePopup #popupImage:active {
	cursor: zoom-out;
	transform: scale(1.1);
}

.gallery-manager-2 #imagePopup .image-popup-close {
	font-size: 2.2rem !important;
	width: 52px !important;
	height: 52px !important;
	border-radius: 50% !important;
	background: rgba(255, 255, 255, 0.25) !important;
	backdrop-filter: blur(12px) !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	transition: all 0.25s ease !important;
	top: -26px !important;
	right: -26px !important;
	border: 2px solid rgba(255, 255, 255, 0.2) !important;
}

.gallery-manager-2 #imagePopup .image-popup-close:hover {
	background: rgba(255, 255, 255, 0.35) !important;
	transform: rotate(90deg) scale(1.05) !important;
	border-color: rgba(255, 255, 255, 0.4) !important;
	color: #fefefe !important;
	box-shadow: 0 8px 25px rgba(0, 0, 0, 0.3) !important;
}

.gallery-manager-2 #imagePopup #popupCaption {
	font-size: 1.15rem !important;
	color: #f1f5f9 !important;
	background: rgba(15, 23, 42, 0.9) !important;
	padding: 16px 24px !important;
	border-radius: 12px !important;
	margin-top: 20px !important;
	max-width: 90% !important;
	backdrop-filter: blur(12px) !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3) !important;
}