.mobilemaximenuck .topbar {
    margin-bottom: 14px;
    background: #666666; /* Old browsers */
    background: -moz-linear-gradient(top, #666666 0%, #3d3b3d 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#666666), color-stop(100%,#3d3b3d)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #666666 0%,#3d3b3d 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #666666 0%,#3d3b3d 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #666666 0%,#3d3b3d 100%); /* IE10+ */
    background: linear-gradient(to bottom, #666666 0%,#3d3b3d 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#666666', endColorstr='#3d3b3d',GradientType=0 ); /* IE6-9 */
}
.mobilemaximenuck div.level2.maximenuck > a {
    background:#0D4C93;
    padding: 0 10px;
}
.mobilebarmenutitleck, .mobilemaximenucktitle {
    display:none; /*added 2017*/
    font-family: 'Raleway', sans-serif;
    text-transform:uppercase;
    font-weight: bold;
    line-height: 44px;
    font-size:20px;
}
.screen {
	max-width: 100%;
	overflow: scroll;
}
.mobilemaximenuck .mobilemaximenucktitle {
    padding: 2px 0 0 20px;
}
.mobilemaximenuckitem a {
    font-family: 'Raleway', sans-serif !important;
    font-size: 18px;
    text-transform: uppercase;
}
.mobilebuttonmenuck {
    background-image:url('/images/menu.png');
    background-repeat:no-repeat;
    background-size: contain;
    padding: 8px;
    margin: 0 5px 0 0;
    pointer-events: initial;
    background-color: #000;
    background-position: center;
    border-radius: 50%;
    box-shadow: 0 0 1px #000;
	z-index: 99999;
}
div#mainMenu-mobilebarmenuck .mobilebuttonmenuck {
    display:none;
}
.mobilemaximenuck div.level1.maximenuck > a {
    /* background: url(arrow.jpg) left center no-repeat; */
    background: #0015ad;
    border-radius: 5px;
    margin: 2px 10px;
    padding-left: 45px;
}
.mobilemaximenuck {
    background:#000;
}
.userMenuItem {
    text-align: center;
}
a#login, a#signup {
    margin: 0 10px;
    background: #fff;
    color: #000;
    padding: 6px 8px 3px 8px;
    border-radius: 5px;
    text-shadow: none;
    font-weight: bold;
}
#maximenuck123-mobile {
    padding-bottom:70px;
}
.mobilemaximenuck div.level1.maximenuck > a {
    text-align: center !important;
    padding-left: 0;
    box-shadow: 0 2px 8px 1px #fff inset;
    border: 1px solid #4e4e4e;
}
.mobilemaximenuck div.level2.maximenuck > a {
    text-align: center !important;
    box-shadow: 0 2px 8px 1px #fff inset;
    border: 1px solid #4e4e4e;
    background: #0015ad;
    border-radius: 5px;
    margin: 2px 10px 2px 10px;
}
.mobilemaximenuck div.headingck>a {
    box-shadow: none !important;
    border-radius: 10px 10px 0 0 !important;
    margin-bottom: -10px !important;
    font-weight: bold;
    background: #7d95aa !important;
    background: -moz-linear-gradient(left, #7d95aa 0%, #000000 15%, #000000 87%, #7d95aa 100%) !important;
    background: -webkit-linear-gradient(left, #7d95aa 0%,#000000 15%,#000000 87%,#7d95aa 100%) !important;
    background: linear-gradient(to right, #7d95aa 0%,#000000 15%,#000000 87%,#7d95aa 100%) !important;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7d95aa', endColorstr='#7d95aa',GradientType=1 ) !important;
}
.maximenuck.item165.first.level1>a {
    color: #e4ff00 !important;
    font-size: 1.5em !important;
}
div#maximenuck123-mobile .login-greeting, div#maximenuck123-mobile .logout-button, div#maximenuck123-mobile .logout-button>input {
    font-size: 20px;
    text-align: center;
}
.mobilemaximenuck div.maximenuck {
    line-height: 36px;
}
div.stickyHeader a.menuLogo{
    margin-top: 0;
    width: 225px;
    transition: all 200ms linear;
    -webkit-transition: all 200ms linear;
}
.mainWrapper {
    /* padding-top: 10px; */
}
div.stickyHeader {
    height: 56px;
	border-bottom: 2px solid #333;
}
div#menuButtonContainer {
	display:block;
    position: fixed;
    top: 1px;
    right: 9px;
    z-index: 99999;
}
a#menuButton {
	display:block;
    font-size: 2em;
    cursor: pointer;
    color: darkblue;
}
.scheduleRow>.scheduleRowTop, .scheduleRow>.scheduleRowBottom {
    display: block;
}
.scheduleRow.readOnlyRow>.scheduleRowTop>div, .scheduleRow.readOnlyRow>.scheduleRowBottom>div, .scheduleRow>.scheduleRowTop>div, .scheduleRow>.scheduleRowBottom>div {
	width: 100%;
}
.dateRowWrapper {
    margin: 20px 5px;
}
.scheduleDateRow.dateRow .dateRowDate {
    width: 50%;
	color: #fff;
}
.scheduleDateRow.dateRow {
    background: #333;
    color: #fff;
}
span.dateRowPub.published {
    display: none;
}
div#searchFilters {
    display: block;
	text-align: center;
}
div#searchFilters>div {
    text-align: center;
    display: block;
    margin: 20px 0;
}
div#searchFilters>#sortCol {
    margin-right: 0;
    text-align: center;
    display: block;
}
div#masterFilterCol {
    background: #eee;
    padding: 10px 0;
    border: 2px solid #777;
}
.addEmpButton {
    display: none;
}
.mobilebarmenuck {
	z-index:-1;
}
div#currentFilter {
    min-width: 0;
    max-width: 90%;
    margin: 15px 0 0 0;
    text-align: center;
}
div#masterFilterCol>label {
    margin-left: 0 !important;
}
div#filtersDisplay>span {
    display: block;
    margin: 0 0 4px;
}
.employeeRow {
    display: block;
    text-align: center;
}
#projects .employeeRow>div, #contractors .employeeRow>div, #employees .employeeRow>div,  #applicants .employeeRow>div, #equipment .employeeRow>div, #architects .employeeRow>div, #vendors .employeeRow>div {
    text-align: center;
    width: 100%;
}
h3.groupAlphaIndex {
	text-align: center;
}
h3.groupAlphaIndex>span {
    margin: 0;
}
#projects .empName>a {
    font-size: 1.2em;
}
a.detailsLink>i {
    font-size: 1.6em;
    display: block;
    margin: 10px 0;
}
.projectContractor {
    font-size: 1em;
}
a.openMapIcon {
    margin: 0;
    display: inline-block;
    width: 100%;
    font-size: 1.2em;
    margin-bottom: 10px;
}
a.openMapIcon:before {
    content: 'Map: ';
    font-size: .8em;
    text-decoration: none;
}
.flexDetails {
    display: block;
    margin: 0 1%;
}
.flexDetails>div {
    display: block;
    width: auto;
}
/* .employeeDetails {
    max-height: 3000px;
} */
#contractors .flexDetails, #projects .flexDetails, #employees .flexDetails, #equipment .flexDetails {
    margin-bottom: 0;
}
select.selectRight {
    float: none;
}
.employeeDetails h4 {
    font-size: 1.2em;
}
.innerFlexBox {
    display: block;
}
.documentRow {
    display: block;
}
.documentRow>div {
    width: 100%;
}
hr.empDivide {
    height: 5px;
    background: #585858;
    margin: 0;
	border: 0 none;
}
h3.groupIndex {
    margin: 0;
    padding: 0;
    background: #585858;
    color: #fff;
}
.mobilebarmenuck {
    z-index: 999999;
    background: transparent;
}
.mobilebuttonmenuck {
    background-color: transparent;
    box-shadow: none;
}
span.mobilemaximenuckclose {
    display: none !important;
}
.mobilebuttonmenuck {
    background-image: url(/images/menu-icon.png);
}
.mobilebuttonmenuck {
    background-image: url(/images/menu-icon.png);
    margin-top: 3px;
    background-size: 36px 36px;
}
.updateUserOpenButton {
    margin-bottom: 20px;
}
.withChecked, .checkColumn {
    display: none;
}
div#safetyBoxes {
    display: block;
    margin: 0 1%;
}
div#safetyBoxes>div {
    display: block;
    width: auto;
}
.contactCol .socialLinks {
    float: none;
    text-align: center;
	display: block;
}
.contactCol .socialLink {
    display: inline-block;
    margin: 0 10px;
    font-size: 1.4em;
}
#contractors a.detailsLink>i, #equipment a.detailsLink>i {
    font-size: 1.2em;
}
.innerMultiBlock {
    display: block;
}
.innerMultiBlock .contactActions {
    float: right;
    margin-top: -20px;
}
.bigBox {
    width: 98%;
    min-height: 800px;
}
.confirmEmailsPopup.show {
	display:block;
}
.messageRow {
    display: block;
	text-align: center;
	height: auto;
}
.messageRow .empNameCol, .messageRow .msgTitleCol, .messageRow .msgBodyCol {
    width: 100%;
}
/* .newMessageButton {
    display: none;
} */
.mobilebuttonmenuck {
    position: fixed;
    right: 0;
    top: 0;
}
.noMobile {
	display:none;
}
.newMessage.bulkMailDiv {
    width: 95%;
    left: 0;
    right: 0;
    margin: 0;
}
.mobileOnly {
	display:inline-block;
}
span.previewText {
    white-space: normal;
}
.messageContactOptions {
    display: block;
}
.messageContactOptions>a {
    display: block;
    margin: 0 auto 20px auto;
}
.fieldContainer.emailTextCheckboxes {
    display: block;
    margin: 0;
}
.newMessage.bulkMailDiv .buttonContainer {
    margin-top: 20px;
}
#laborForm .fieldContainer {
    width: 96%;
}
#laborForm div#employees-container .inline, div#jobs-container .inline {
    width: 90% !important;
}
#laborForm .inputContainer textarea, .fieldContainer textarea {
    max-width: 90%;
}
#laborForm div.reportForm input#datepicker1 {
    margin: 10px 0 0 20px;
    max-width: 50%;
}
#laborForm div.reportForm {
    text-align: center;
}
#laborForm .reportForm div#fin-datepicker1>img {
    float: none;
    height: 50px;
}
#laborForm input#datepickerAlt {
    text-align: center;
}
#laborForm .inline {
    text-align: center;
}
#laborForm div#quantity-container .inline {
	width: 80%;
}
#laborForm div#employees-container>div {
    margin: 0px 0 20px;
    padding-top: 10px;
}
#laborForm .inline>.inputContainer>input, #laborForm .inline>.inputContainer>select, #laborForm .inline>.inputContainer>textarea {
    width: 80%;
    text-align: center;
	font-size: 1.2em;
}
#laborForm div.reportForm select {
    font-size: 1.3em;
}
#laborForm select#rate-day {
    margin-bottom: 20px;
}
#laborForm div#uploadPhoto>div>input {
    border-bottom: 0 none !important;
	font-size: 1.1em;
	margin-top: 10px;
}
#laborForm input#reportSubmit {
    font-size: 1.4em;
    padding: 4px 8px;
}
#laborForm textArea {
	width: 100%;
	background: #ebf9ff !important;
    border: 1px dotted #000 !important;
}
#laborForm .bottomForm .inline {
	width:80%
}
h1#hrTitle, h1#scheduleTitle {
    font-size: 1.4em;
    padding: 3px 2%;
}
body>.ui-datepicker.ui-widget.ui-widget-content.ui-helper-clearfix.ui-corner-all {
	left:50% !important;
	margin-left:-160px !important;
}
.notificationDiv, .errorDiv {
    max-height: 100px;
    font-size: 1.2em;
	border-top: 2px solid #000;
    border-bottom: 2px solid #000;
}
div#closeNote, div#closeError {
    font-size: 1.2em;
    border: 4px solid #000;
    border-radius: 50%;
    width: 32px;
    height: 32px;
    text-align: center;
}
#laborForm h4.panel-title {
    margin: 5px 10px;
}
div.laborFormButtons {
    margin: 20px 0 40px;
}
div.laborFormButtons>div.laborFormButton {
    display: block;
    margin: 20px 10px;
}
a.laborFormLink {
    width: 85%;
	margin-bottom: 10px;
}
div.laborFormButtons>div.laborFormButton.shrink {
    margin: 5px 0;
}
div#fitem-datepicker1>label {
    float: none;
}
.submitLaborResponse>h3 {
    max-width: 80%;
    margin: 30px auto 50px;
}
div.submitLaborResponse>a.clearBlueButton {
	font-size:1em;
}
.widgetAreaRow {
    display: block;
}
div.widget {
    width: 96%;
	margin: 10px auto;
}
flexFormFields {
    display: block;
    text-align: center;
}
h2#listTitle {
    text-align: center;
    margin-bottom: 5px;
}
.inlineFields.topMileageForm {
    display: block !important;
}
.inlineFields.topMileageForm>div {
	max-width: 100%;
	margin:10px 0;
}
div#vehicleSignoutLogs .col5 {
	display: none;
}
div#vehicleSignoutLogs>.dataRow.headers {
    display: none;
}
div#vehicleSignoutLogs>.dataRow {
    display: block;
	border-top:1px solid #555;
	position: relative;
}
div#vehicleSignoutLogs .dataRow>div {
    width: 100%;
}
div#vehicleSignoutLogs .delButton, div#mileageLogRows .mileDeleteField {
    width: auto !important;
    position: absolute;
    right: 2%;
    top: 0;
}
div#vehicleSignoutLogs .col1 {
	font-weight: bold;
	color: #777;
}
div#vehicleSignoutLogs .col2:before {
	content: 'Emloyee: ';
}
div#vehicleSignoutLogs .col2:before {
	content: 'Time Out: ';
}
div#vehicleSignoutLogs .col2:before {
	content: 'Time In: ';
}
#mileageLogForm .inlineFields {
	display: block;
	position: relative;
}
div#mileageLogRows>.mileageLogRow>div {
	width: auto !important;
	text-align: center !important;
}
.mileageLogRow.inlineFields.headerRow {
	display: none !important;
}
div#mileageLogRows>.mileageLogRow .mileDateField:before {
	content: 'Date: ';
}
div#mileageLogRows>.mileageLogRow .mileProjectField:before {
	content: 'Project: ';
}
div#mileageLogRows>.mileageLogRow .mileLocationField.start:before {
	content: 'Start Location: ';
}
div#mileageLogRows>.mileageLogRow .mileLocationField.end:before {
	content: 'Destination: ';
}
div#mileageLogRows>.mileageLogRow .mileOdometerField.start:before {
	content: 'Odometer Start: ';
}
div#mileageLogRows>.mileageLogRow .mileOdometerField.end:before {
	content: 'Odometer End: ';
}
div#mileageLogRows>.mileageLogRow .mileTotalField:before {
	content: 'Total Miles: ';
}
div#mileageLogFormContainer table {
    display: none;
}
.toolsSection .inputRow {
    display: block;
}
div#dbSettingsFields {
    display: block;
}
.popupForm {
	overflow: scroll;
}
.popupForm .flexFormFields {
	display: block;
}
.popupForm .fieldContainer.center>a {
	display: block;
	margin: 0 0 10px 0;
}
body.careersPage .contentArea h1 {
	font-size: 1.5em;
	display: block;
	text-align: center;
}
body.careersPage .nowHiringText {
	display: block;
	margin: 10px 0;
	margin-left: 0;
}
body.careersPage .careersRight {
	float: none;
	text-align: center;
	margin-bottom: 20px;
	display: block;
}
div.careersOpenings {
	display: block;
}
a.careersOpeningsBox {
	display: block;
	margin: 20px auto;
}
div#searchFilters.affix {
	position: inherit;
	background: transparent;
	top: auto;
	width: auto;
	height: auto;
	padding: 0 2%;
	border-bottom: 0 none;
}
div#row2filters.affix {
	position: inherit;
	background: transparent;
	top: auto;
	width: auto;
	border-bottom: 0 none;
}
div#screen.affix {
	padding-top: 0;
}
a#menuClose {
    font-size: inherit;
    float: none;
    width: auto;
    margin: initial;
}
a.menuTopIconLink.mobileOnly {
	display: inline-block;
}
div#menuTop {
    height: 110px;
    background: #656565;
    border-bottom: 2px solid #000;
    padding: 0 60px 5px 15px;
    display: block;
}
div#menuTop {
    height: auto;
    padding: 0;
}
span#menulogo {
    padding: 5px;
}
span#menuInfoMobileBlock {
    display: block;
    width: 100%;
	margin-bottom: 10px;
}
span#menuPic {
    width: 25px;
    height: 25px;
    margin-bottom: -7px;
}
span#menuInfoMobileBlock {
    font-size: .8em;
}
span#menuName {
    font-weight: normal;
}
a.menuTopIconLink {
    margin-left: 5px;
	margin-top: -5px;
}
a#dashboardLink, a#settingsLink, a#mobileMenuClose {
	margin-left: 0;
	width: auto;
	margin: 0 10px;
}
div#menuButton {
    right: 1%;
    margin-top: -5px;
}
div#tempTabs {
    display: none;
}
a.menuTopIconLink>span.menuIconText {
    display: none;
}
div#menuInfo {
    margin-bottom: 10px;
}
.mobileOnlyReports {
    display: inline-block;
    font-weight: bold;
    color: #555;
	margin-right: 4px;
}
div#compactReportHeaders, .singleReportHeaders.singleEmpReportHeaders, .singleReportHeaders.singleMgrReportHeaders, .singleReportHeaders.superReportHeaders {
	display: none;
}
div.reportRow.compact {
	display: block;
}
.hrPage.laborReports div.reportRow.compact .empReportCol, .hrPage.laborReports div.reportRow.compact .pmReportCol {
    width: 100%;
}
.hrPage .singleReport .empData .empRow, .hrPage .singleReport .pmReportData .pmReportRow, .hrPage .singleReport .superReportData .superReportRow {
	display: block;
}
.hrPage .singleReport .empData .empRow>.empCol, .hrPage .singleReport .pmReportData .pmReportRow>.pmDataCol, .hrPage .singleReport .superReportData .superReportRow>.superColData {
	width: 100%;
}
/* .singleReport {
	max-height: none;
} */
.laborReports div#reportsContainer {
    font-size: 1em;
}
div#searchFilters select {
    max-width: auto;
    width: 100% !important;
    position: relative;
}
.resultsNav {
    display: block;
    margin: 0;
}
div#selectStyle {
    float: none;
    margin: 20px 0 0 0;
}
select#numRows {
    float: none;
    display: block;
    margin: 0 auto;
}
div#selectStyle {
    float: none;
    margin: 20px auto;
    display: block;
    width: 100%;
    text-align: center;
}
span#reportTypeLabel {
    display: none;
}
div#reportTypeSelect, .laborAnalyticsPage>.detailsTopLinks {
    float: none;
    font-size: .7em;
    width: 100%;
    text-align: center;
	margin: 0;
    padding: 20px 0 10px;
	background: #ddd;
}
#editReportTable .hour.row>form {
    display: block;
    text-align: center;
}
#editReportTable .hour.row>form.updateEmpRec>div {
	width: 100%;
	max-width: inherit;
	text-align: center;
}
div#adminReportsRecord .recordRow {
    display: block;
    font-size: 1em;
}
#editReportTable .hour.row>form.updateEmpRec>div>input {
    text-align: center;
}
#editReportTable select.modernInput.changeEmpSelect {
	margin-bottom: 20px;
    font-size: .9em;
    width: 100%;
}
div#searchFilters select {
    max-width: auto;
    width: 100% !important;
	position: relative;
}
#editReportTable .empNameRow>a {
    margin: 0;
}
div#currentFilter.withFilterSearch>div {
    display: block;
	position: relative;
}
div#currentFilter.withFilterSearch>div>input {
    margin-bottom: 15px;
}
div#currentFilter.withFilterSearch {
    margin: 15px auto 0 auto;
}
.expandedRows .reportRow.compact.empRow {
	max-height: 350px;
}
.singleReportDataRow.empRow.div2.totalsRow {
    background: #fff;
}
.modernInput {
    max-width: 90%;
}
.addApplicantForm, .addContractorForm, .addEmployeeForm, .addEquipmentForm, .addArchitectForm, .addVendorForm, .popupForm, .addScheduleForm {
	max-height: none;
}
.flexFormFields {
	display: block;
}
#inventoryRequest .inlineFields, #mileageLogForm .inlineFields, .hrForm .inlineFields {
    display: block;
}
.detailsTopLinks>a {
	display: inline;
}
#employee .detailsTopLinks>a {
	display: block;
}
#employee a.detailsTopLink.currentItem {
    border-bottom: 5px solid #0099d1;
    background: #95fffb;
}
.projectAnalyticsBody .jobInfo {
    display: block;
}
.projectAnalyticsBody .jobInfo>.text {
	font-size:1.2em;
	text-align: center;
	margin:5px 0;
}
.coRatios>div {
    border-radius: 0;
}
.analyticsSection>h3 {
    font-size: 1em;
}
#laborForm div.reportForm input#datepicker1, #laborForm div.reportForm input#datepickerAlt, #laborForm div.reportForm input#datepickerAlt1_labor-forms, #laborForm div.reportForm input.datepickerAlt1 {
    text-align: center;
}
#employee .employeeRow>div {
    width: 100%;
    text-align: center;
}
#employee .contactCol {
    margin-top: 20px;
}
#employee .detailsTopLinks {
    border-top: 2px solid #000;
}
#employee .flexDetails {
    display: block;
    margin: 0 1%;
}
#employee #safetyBoxes .fieldContainer {
    padding: 5px;
	margin:3px 0;
    width: 97%;
}
span#secondReportLink {
    display: none;
}
.bulkMailDiv {
	margin:0 1%;
	width:98%;
	left: 0;
	top: 60px;
}
.newTicketButton {
	margin: 7px 2% 0 2%;
}
div#favLinks {
    max-height: 100px;
    overflow-y: scroll;
}

/* ===== Shipping & Receiving Logs Mobile Styles ===== */
/* Search Filters Mobile Layout */
#srPage div#searchFilters {
    display: block;
    text-align: center;
}

#srPage div#searchFilters > div {
    display: block;
    margin: 15px auto;
    text-align: center;
    width: 90%;
}

#srPage div#searchFilters select,
#srPage div#searchFilters input {
    width: 100%;
    max-width: 280px;
    font-size: 1.1em;
}

#srPage div#searchFilters #searchCol {
    margin-bottom: 20px;
}

#srPage div#searchFilters #searchCol input {
    padding-left: 35px;
    background-position: 8px center;
}

/* Mobile-friendly log display */
#srPage #logsWrapper {
    margin: 0 1%;
    overflow-x: auto;
}

#srPage #logs {
    width: 100%;
}

/* Log rows mobile styling */
#srPage .logRow {
    display: block;
    border: 1px solid #ddd;
    margin: 10px 0;
    padding: 15px;
    border-radius: 8px;
    background: #f9f9f9;
    text-align: left;
}

#srPage .logRow.headers {
    display: none;
}

#srPage .logRow > div {
    width: 100%;
    margin: 8px 0;
    font-size: 1em;
    line-height: 1.4;
}

/* Add mobile labels for log data */
#srPage .logRow .logType:before {
    content: 'Type: ';
    font-weight: bold;
    color: #555;
}

#srPage .logRow .logPM:before {
    content: 'Project Manager: ';
    font-weight: bold;
    color: #555;
}

#srPage .logRow .logJob:before {
    content: 'Job: ';
    font-weight: bold;
    color: #555;
}

#srPage .logRow .logPO:before {
    content: 'PO #: ';
    font-weight: bold;
    color: #555;
}

#srPage .logRow .logVendor:before {
    content: 'Vendor: ';
    font-weight: bold;
    color: #555;
}

#srPage .logRow .logDeliveredBy:before {
    content: 'Delivered By: ';
    font-weight: bold;
    color: #555;
}

#srPage .logRow .logDescription:before {
    content: 'Description: ';
    font-weight: bold;
    color: #555;
}

#srPage .logRow .logNotes:before {
    content: 'Notes: ';
    font-weight: bold;
    color: #555;
}

#srPage .logRow .logDate:before {
    content: 'Date: ';
    font-weight: bold;
    color: #555;
}

#srPage .logRow .logActions:before {
    content: 'Actions: ';
    font-weight: bold;
    color: #555;
}

/* Hot item styling */
#srPage .logRow.hotItem {
    border-left: 4px solid #ff4444;
    background: #fff5f5;
}

#srPage .logRow.hotItem:before {
    content: '🔥 HOT ITEM ';
    display: block;
    color: #ff4444;
    font-weight: bold;
    margin-bottom: 10px;
    text-align: center;
    font-size: 1.1em;
}

/* File popup mobile styling */
/* #srPage #filePopup {
    position: fixed !important;
    top: 10% !important;
    left: 5% !important;
    right: 5% !important;
    width: auto !important;
    max-height: 80vh;
    overflow-y: auto;
    z-index: 1001;
    border-radius: 10px;
    transform: none !important;
    margin-left: 0 !important;
}

#srPage #filePopup .flexFormFields {
    display: block;
    text-align: center;
}

#srPage #filePopup .fieldContainer {
    margin: 15px 0;
    width: 100%;
}

#srPage #filePopup .blueButton,
#srPage #filePopup .orangeButton {
    display: block;
    width: 80%;
    margin: 10px auto;
    padding: 12px;
    font-size: 1.1em;
} */

/* Add log form mobile enhancements */
#srPage .addEmployeeForm h3 {
    font-size: 1.2em;
    text-align: center;
}

#srPage .addEmployeeForm h3 input {
    display: block;
    width: 100%;
    margin-top: 10px;
    text-align: center;
    font-size: 1.1em;
    font-weight: bold;
}

/* Upload section mobile styling */
#srPage .fieldContainer.center {
    text-align: center;
    padding: 20px 0;
}

#srPage .fieldContainer.center input[type="file"] {
    display: block;
    margin: 15px auto;
    width: 100%;
    max-width: 280px;
}

/* Mobile filter adjustments */
#srPage .modernResetBlue {
    display: block;
    margin: 20px auto;
    padding: 12px 20px;
    font-size: 1.1em;
    text-align: center;
}

/* Action buttons in logs */
#srPage .logActions {
    text-align: center;
    margin-top: 15px;
}

#srPage .logActions a {
    display: inline-block;
    margin: 5px;
    padding: 8px 12px;
    font-size: 0.9em;
}

/* Responsive improvements for very small screens */
@media (max-width: 480px) {
    #srPage h1#hrTitle {
        font-size: 1.2em;
    }
    
    #srPage div#searchFilters > div {
        width: 95%;
    }
    
    #srPage .logRow {
        margin: 5px 0;
        padding: 12px;
    }
    
    #srPage .addEmployeeForm .flexFormFields.srPageRow1,
    #srPage .addEmployeeForm .flexFormFields.srPageRow2 {
        margin-bottom: 10px;
    }
    
    #srPage .fieldContainer.center input[type="file"] {
        font-size: 0.9em;
    }
}