/*** Generic Styles ***/
body {
background: #7e7472 url("/images/gradient.jpg") repeat-y fixed top left;
font-family: arial,verdana,sans-serif;
font-size: 0.8em;
margin: 0;
padding: 0;
}

h1, h2, h3, h4, h5, h6 { margin: 0; padding: 0; }
h1 { font-size: 160%; } /* FF: h1 200% h2 150% h3 120% h4 100% h5 80% h6 70% */
h2 { font-size: 140%; }

hr { border: 0; color: #000; background-color: #000; height: 1px; width: 100%; margin: 0; padding: 0; }

form { margin: 0; padding: 0; }
fieldset { border: solid #eee 1px; background: #fff; margin-bottom: 1em; padding: 1em; }
legend { font-weight: bold; padding: 0 1em 0 1em; }
label { float: left; width: 16em; text-align: right; white-space: nowrap; margin-right: 1em; }
button, input, select, .field { width: auto; font-size: 0.8em; }
span.field { font-size: 1em; }
textarea { font-family: arial,verdana,sans-serif; font-size: 0.9em; }
fieldset hr { width: 80%; color: #eee; background-color: #eee; }
area { cursor: pointer !important; }
span, .row { line-height: 1.1em; height: 1.1em; }
.checkbox { margin-left: 0 !important; padding-left: 0 !important; }

a img { border: none; }
a, a:visited {
color: blue;
text-decoration: none;
cursor: pointer;
}
a:hover { text-decoration: underline; color: blue; }

/*
rl - regular weight, left justified
rc - regular weight, center justified
rr - regular weight, right justified
bl - bold weight, left justified
bc - bold weight, center justified
br - bold weight, right justified
*/
.bold, .bl, .bc, .br { font-weight: bold; }
.bl, .rl { text-align: left; }
.bc, .rc { text-align: center; }
.br, .rr, .flrr { text-align: right; }
.fl, .flrr { float: left; }
.ruler { border-top: 1px solid #000; clear: both; }
.formFieldset { width: 40em; margin: 1.5em 0 0 0; }
.clear { clear: both; }
.clearIndividualEmpl{
clear: both;
display: none;
}
.buttons { margin-top: 0.2em; clear: both; }
.buttons button, .buttons input { margin-right: 0.6em; }

#capsLockStat { display: none; }

/*** Page Styles ***/
#pageMenu {
height: 53px;
background-color: #fff;
margin: 0;
padding: 2px 0 0 0;
}

#pageMenuSpan { width: 540px; }

#pageMenuL {
float: left;
width: 86px;
margin: 0;
padding: 0 7px 0 7px;
}

#pageMenuR {
margin: 0;
padding: 0;
}

#menuHome { left: 100px; }
#menuReports { left: 160px; }
#menuPrint { left: 220px; }
#menuFiles { left: 280px; }
#menuSettings { left: 340px; }
#menuLogout { left: 400px; }
#menuHelp { left: 460px; }

#menuHome a, #menuReports a, #menuPrint a, #menuFiles a, #menuSettings a, #menuLogout a, #menuHelp a { color: #fff; }
#menuHome li { background-color: #90b600; }
#menuReports li { background-color: #2d3d91; }
#menuPrint li { background-color: #8892a0; }
#menuFiles li { background-color: #4e4742; }
#menuSettings li { background-color: #fdb144; }
#menuLogout li { background-color: #d94223; }
#menuHelp li { background-color: #235dc0; }

.subMenu {
position: absolute;
top: 55px;
z-index: 100 !important;
clear: both;
}

.subMenu ul, .subMenu li {
list-style-type: none;
margin: 0;
padding: 0;
}

.subMenu ul {
display: none;
width: 13.6em; /* max-width: 12em; NOT supported by IE */
}

#menuReports ul { width: 9em; } /* Reports menu needs to be slightly wider. */

.subMenu li {
background: #fff;
}

.subMenu li a {
color: #fff;
text-decoration: none;
display: block;
height: 100%;
border: 0 none;
padding: 1px 5px 1px 5px;
}

.subMenu li a:hover, .subMenu li a:focus {
background: #bbb;
}

#pageBack, #pageBack_popup {
background: #7e7472 url("/images/gradient.jpg") repeat-y fixed top left;
}

#pageBackCorner {
background-image: url("/images/gtlc.gif");
background-repeat: no-repeat !important;
height: 14px;
width: 10px;
}

#pageBody {
background-color: #fff;
margin-left: 10px;
}

#pageTitle {
background-image: url("/images/tlc.gif");
background-position: top left;
background-repeat: no-repeat !important;
border-bottom: 1px solid #000;
}

#pageTitleL {
float: left;
width: 30em;
}

#pageTitleSL {
float: left;
width: 25px;
}

#pageTitleSC, #pageTitleSC_popup {
float: left;
text-transform: uppercase;
text-align: right;
vertical-align: middle;
padding: 0 2em 0 1em;
}

#pageTitle, #pageTitleL, #pageTitleR, #pageTitleS, #pageTitleSL, #pageTitleSC, #pageTitleSC_popup, #pageTitleSR {
line-height: 1.5em;
height: 1.5em;
}

#pageTitleOFF { display: none; }

/* DO NOT ALTER THIS BLOCK */

#pageContents {
vertical-align: top;
min-height: 320px;
padding: 1em 0 1em 2em;
}
/* use one bug to fix another (IE) */
/*\*/
* html #pageContents {
height: 320px;
}
/**/

/* END BLOCK */


#pageBottom {
background-image: url("/images/blc.gif");
background-position: bottom left;
background-repeat: no-repeat !important;
background-color: #fff;
line-height: 10px;
height: 10px;
}

#pageFooter, #pageFooter_popup {
font-size: x-small;
text-align: center;
line-height: 4em;
height: 4em;
vertical-align: top;
margin: 0;
padding: 0;
}
.bottompage {
        text-align: center;
        padding: 0em;
        margin-top:2em;
}

#bottompageimg{
        text-align:right;
        font-size: x-small;
        margin-right: 2em;
}

#pageFooter, #pageFooter a, #pageFooter a:visited, #pageFooter a:active, #pageFooter a:hover { color: #fff; }

.colorHome { background-color: #90b600; color: #fff; font-weight: bold; }
.colorReports { background-color: #2d3d91; color: #fff; font-weight: bold; }
.colorPrint { background-color: #8892a0; color: #fff; font-weight: bold; }
.colorFiles { background-color: #4e4742; color: #fff; font-weight: bold; }
.colorSettings { background-color: #fdb144; color: #fff; font-weight: bold; }
.colorLogout { background-color: #d94223; color: #fff; font-weight: bold; }
.colorHelp { background-color: #235dc0; color: #fff; font-weight: bold; }

#ifDollars, #ifValue { text-align: right; }

#ifDollars { width: 6em; }
#ifCents { width: 3em; }
#ifValue { width: 6em; }

#UnderConstruction {
position: absolute;
top: 18em;
left: 16.5em;
background-color: #ccf;
font-size: 2em;
font-weight: bold;
padding: .5em;
}

/*** Relational Styles ***/
/* report.html */
.totals { border-top: 1px solid #000; }
.subtotals, .notes { background-color: #eee; }
.subtotals, .notes, .labor, .signatures, .details, .note { display: none; }
.totals, .subtotals, .notes, .signatures, .details, .note { clear: both; }
.signatures { margin-bottom: 1em; }
.totals { margin: 1px 0 1em 0; }

.punchGrandTotalHeader {border-top: 1px solid #CCC; }
.punchHeader, .subtotals, .totals  .extraInput { font-weight: bold; }
.punchHeader, .punchFlagsON, .punchFlagsOFF { clear: both; }
.punchHeader, .punchFlagsON, .punchFlagsOFF, .subtotals, .totals { line-height: 1.1em; height: 1.1em; }.punchHeader { border-top: 1px solid #000; border-bottom: 1px solid #000; }

.punchEmployee, .punchDepartment, .punchNotePSIN, .punchNotePSOUT, .punchNotePS, .punchDow, .punchTimeHDOUT, .punchTimeHDIN, .punchTimeHD, .punchTime, .punchFlagsIN, .punchFlagsOUT, .punchFlags, .punchLunch, .punchADJ, .punchHRS, .punchVAC, .punchSIC, .punchPER, .punchHOL, .punchSTD, .punchOT1, .punchOT2, .punchLaborDS, .punchLabor, .punchCalcs, .punchAddIn, .punchAddOut, .punchNoteIn, .punchNoteOut, .punchTotals, .punchTotals2, .punchReportInput { float: left; line-height: 1.1em; height: 1.1em; }

.punchEmployee, .punchDepartment { overflow: hidden; white-space: nowrap; }

.punchNotePSIN , .punchNotePSOUT, .punchNotePS, .punchFlagsIN, .punchFlagsOUT, .punchFlags, .punchTime, .punchLunch, .punchADJ, .punchHRS, .punchVAC, .punchSIC, .punchPER, .punchHOL, .punchSTD, .punchOT1, .punchOT2, .punchLaborDS, .punchLabor, .punchReportInput { text-align: right; }

.sigLoft { line-height: 3em; height: 3em; }
.sigTitle, .sigLine { float: left; line-height: 1.1em; height: 1.1em; }
.sigTitle { text-align: right; }
.sigLine  { border-bottom: 1px solid #000; }

.punchReportInput {
	text-transform: uppercase;
}

.punchCameraIcon {
	width: 1em;
    float: left;	

}


#punchScope {
display: none;
position: absolute;
top: 9.5em;
left: 2.8em;
background-color: #fff;
border: 1px solid #000;
width: 21em;
z-index: 100 !important;
}

#punchScopeEmployee { display: none; }

.punchScopeLH, .punchScopeRH {
line-height: 1.4em;
height: 1.4em;
float: left;
width: 9em;
padding-left: 1em;
}

.punchScopeLH {
border-right: 1px solid #ddd;
}

.punchScopeMID {
width: 20em;
padding: .5em 0 0 1em;
}

.punchScopeRow, .punchScopeHR, .punchScopeSubmit { clear: both; }

.punchScopeHR {
border-top: 1px solid #ddd;
margin: 0;
padding: 0;
}

.punchScopeSubmit { margin: .5em 0 .5em 0; }
.punchScopeSubmit input { margin-left: 1em; }

/* see dispdep.css and hidedep.css */

.punchIn, a.punchIn, a.punchIn:visited, a.punchIn:hover { color: #0b0; }
.punchOut, a.punchOut, a.punchOut:visited, a.punchOut:hover { color: #f00; }
a.punchIn:hover div, a.punchOut:hover div, a.punchIn:active div, a.punchOut:active div { text-decoration: underline !important; }
a.punchIn:hover, a.punchOut:hover, a.punchIn:active, a.punchOut:active { text-decoration: underline !important; }

/* prefsdisp.inc (preferences.html, employee.html) */
.prefs {
overflow: auto;
}

.prefsHeader {
line-height: 1.6em;
height: 1.6em;
border-bottom: 1px solid #000;
font-weight: bold;
}

.prefsHeader, .prefsRowNote {
padding-bottom: 2px;
clear: both;
}

.prefsRow {
line-height: 1.6em;
height: 1.6em;
clear: both;
}

.payrollItemSpacer {
text-align: right;
margin-right: 1em;
width: 5em;
overflow: hidden;
float: left;
}

.payrollItem{
margin-left: 8em;
}

.payrollSubItem {
margin-left: 10em;
padding-left: 1em;
padding-top: .5em;
margin-top: .5em;
padding-bottom: .5em;
margin-bottom: .5em;
border-bottom: 1px solid #000;
width: 30em;
}




.prefsHeader, .prefsRow, .prefsKey, .prefsVal, .prefsMet, .prefsNote, .prefsDate { overflow: hidden; }

.prefsKey { margin-right: 1em; }
.prefsMet span { margin: 0; margin-right: 1em; z-index: 300 !important; }
.prefsMet span.error { color: #f00; padding: 0; }
.prefsKey { text-align: right; }
.prefsKey, .prefsVal, .prefsNote { float: left; }
.prefsNote, .prefsDate { margin: 0 1em 0 1em; }

.prefsKey { width: 16em; }
.prefsVal { width: 9em; }
.prefsNote { width: 30em; } /* 15+12=27 */
.prefsRL, .prefsRR { width: 10em; }
.prefsRR, .prefsDT, .prefsOrder { text-align: right; }
.prefsDT { width: 5em; }
.prefsOrder { width: 3em; }

/* punch.html */
#punchLunch, #intAdjustment  { width: 3em; }
#punchDate, #punchTime, #reportDate, #reportDateThru, #reportTime, #reportTimeThru, #scopeFrom, #scopeTo { width: 5em; }
#punchTimeDisp, #punchSpacerDisp, #punchLunchDisp, #punchAdjDisp, #punchInputDiv { display: none; }
#scopeFrom, #scopeTo { margin: 0 1em 0 0.5em; }
#punchInput { width: 8em; }
#punchInputDiv { padding-top: 0.5em; }


/* roster.html */
.rosterHeader {
font-weight: bold;
line-height: 2.2em;
height: 2.2em;
border-top: 1px solid #000;
border-bottom: 1px solid #000;
clear: both;
}

.rosterEmployeeOFF, .rosterDepartmentOFF, .detailsEmployee, .detailsDepartment { display: none; clear: both; }
.rosterEmployee, .rosterDepartment, .rosterClock, .rosterDaily, .rosterWeekly, .rosterConsecutive, .rosterDailyN, .rosterWeeklyN, .rosterConsecutiveN, .rosterLinks, .rosterTimeRemaining , .webonrosterTimeRemaining, .rosterWPFlag{ line-height: 1.1em; height: 1.1em; }
.rosterEmployee, .rosterDepartment, .rosterClock, .rosterDaily, .rosterWeekly, .rosterConsecutive, .rosterDailyN, .rosterWeeklyN, .rosterConsecutiveN, .rosterWPFlag { float: left; }
.rosterLinks { font-weight: bold; text-align: right; }

.rosterTimeRemaining { width: 37em; text-align: right; }
.webonrosterTimeRemaining { width: 44em; text-align: right; }

.rosterEmployee {width: 16.0em;}
.rosterDaily, .rosterWeekly, .rosterConsecutive, .rosterDailyN, .rosterWeeklyN, .rosterConsecutiveN { width: 6em; text-align: right; }
.rosterConsecutive, .rosterConsecutiveN { width: 11em; }
.rosterDailyN, .rosterWeeklyN, .rosterConsecutiveN { color: #f00; }
.rosterWPFlag {width: 7.0em; text-align: center; }
.rosterEmployee, .rosterDepartment, .rosterClock { overflow: hidden; white-space: nowrap; }


/* accrualreport.html */
.accrualHeader {
font-weight: bold;
line-height: 1.1em;
height: 1.1em;
border-top: 1px solid #000;
border-bottom: 1px solid #000;
clear: both;
}

.accrualEmployeeName{
width: 10em;
}

.accrualName{
width: 10em;
}

.accrualAmountAvailable{
width: 10em;
}

.accrualAmountUsed{
width: 10em;
}

.accrualName, .accrualAmountAvailable, .accrualAmountUsed { overflow: hidden; white-space: nowrap; }
.accrualName, .accrualAmountAvailable, .accrualAmountUsed { line-height: 1.1em; height: 1.1em; }
.accrualName,.accrualAmountAvailable, .accrualAmountUsed { float: left; }
.accrualAmountAvailable, .accrualAmountUsed { text-align: right; }



.accrualRowOn{
line-height: 1.1em;
height: 1.1em;
}

.accrualEmployee
{

}

.accrualEmployeeOFF
{
  display: none;
  clear: both;
}

/*
.rosterEmployeeOFF, .rosterDepartmentOFF, .detailsEmployee, .detailsDepartment { display: none; clear: both; }
.rosterEmployee, .rosterDepartment, .rosterClock, .rosterDaily, .rosterWeekly, .rosterConsecutive, .rosterDailyN, .rosterWeeklyN, .rosterConsecutiveN, .rosterLinks, .rosterTimeRemaining { line-height: 1.1em; height: 1.1em; }
.rosterEmployee, .rosterDepartment, .rosterClock, .rosterDaily, .rosterWeekly, .rosterConsecutive, .rosterDailyN, .rosterWeeklyN, .rosterConsecutiveN { float: left; }
.rosterLinks { font-weight: bold; text-align: right; }

.rosterTimeRemaining { width: 31em; text-align: right; }
.rosterEmployee { width: 10em; }
.rosterDaily, .rosterWeekly, .rosterConsecutive, .rosterDailyN, .rosterWeeklyN, .rosterConsecutiveN { width: 6em; text-align: right; }
.rosterConsecutive, .rosterConsecutiveN { width: 10em; }
.rosterDailyN, .rosterWeeklyN, .rosterConsecutiveN { color: #f00; }

.rosterEmployee, .rosterDepartment, .rosterClock { overflow: hidden; white-space: nowrap; }

*/

/* tab menu */
.tabNav {
border-bottom: 1px solid #ccc;
margin: 0;
padding: 1px 0 0 10px;
}

.tabNav ul, .tabNav li {
display: inline;
list-style-type: none;
}

.tabNav a:link, .tabNav a:visited {
background: #E8EBF0;
border: 1px solid #ccc;
color: #666;
font-size: 1em;
font-weight: normal;
margin-right: 8px;
padding: 0 10px 0 10px;
text-decoration: none;
}

.tabNav a:link.active, .tabNav a:visited.active {
background: #fff;
border-bottom: 1px solid #fff;
color: #000;
}

.tabNav a:hover {
color: #000;
}

.tabNav0 .tabNav li.nav0 a,
.tabNav1 .tabNav li.nav1 a,
.tabNav2 .tabNav li.nav2 a,
.tabNav3 .tabNav li.nav3 a,
.tabNav4 .tabNav li.nav4 a {
background: #fff;
border-bottom: 1px solid #fff;
color: #000;
}

.tabNav ul a:hover {
color: #000 !important;
}

.tabNav0,
.tabNav1,
.tabNav2,
.tabNav3,
.tabNav4 {
width: 38em;
overflow: auto;
}

#tabBody {
background: #fff;
border: 1px solid #ccc;
border-top: none;
margin: 0;
}

#tabMenu0 { display: none; }
#tabMenu1 { display: none; }
#tabMenu2 { display: none; }
#tabMenu3 { display: none; }
#tabMenu4 { display: none; }

/* alerts.html */
.alrtSet, .alrtSetShort {
overflow: auto;
border: 2px solid #000;
padding: 2px 0 2px 0;
}

.alrtSetHeader {
line-height: 1em;
height: 1.6em;
border-bottom: 1px solid #000;
font-weight: bold;
margin-bottom: 2px;
clear: both;
}

.alrtSetRow {
line-height: 1.6em;
height: 1.6em;
clear: both;
}

.alrtSetTitle { text-align: right; margin-right: 1em; }
.alrtSetBool { border-right: 1px dashed #000; }
.alrtSetTitle, .alrtSetLife, .alrtSetLifeShort, .alrtSetEmail, .alrtSetAddr { overflow: hidden; }
.alrtSetTitle, .alrtSetLife, .alrtSetEmail { float: left; padding: 0; }

.alrtSet { width: 60em; }
.alrtSetShort { width: 25em; }
.alrtSetBool { width: 2em; float: left; text-align: center; }
.alrtSetTitle { width: 15em; }
.alrtSetLife { width: 7em; }
.alrtSetEmail { width: 8em; }
.alrtSetAddr input { width: 20em; }

/* index.html (alerts) */
.alrtHomeHeader {
font-weight: bold;
line-height: 1.1em !important;
height: 1.1em !important;
}

.alrtHomeHeader {
border-top: 1px solid #000;
border-bottom: 1px solid #000;
}

.alrtHomeON, .alrtHomeOFF { line-height: 1.4em; height: 1.4em; }
.alrtHomeHeader, .alrtHomeON, .alrtHomeOFF { clear: both; }
.alrtHomeOFF { display: none; }

.alrtHomeIgnore, .alrtHomeDate, .alrtHomeLink { float: left; }
.alrtHomeIgnore { width: 5em; }
.alrtHomeDate { width: 12em; }

#alrtHomeSort {
display: none;
position: absolute;
top: 17em;
left: 2.8em;
background-color: #fff;
border: 1px solid #000;
width: 5.5em;
z-index: 100 !important;
margin: 0;
padding: 0.5em 0 0.5em 0;
}

.alrtHomeSortRow {
clear: both;
margin: 0;
padding: 0 1em 0 1em;
}

/* departments */
.depts {
width: 42em;
overflow: auto;
border: 2px solid #000;
padding-bottom: 5px;
}

.deptsHeader {
border-bottom: 1px solid #000;
font-weight: bold;
}

.deptsHeader, .deptsRowNote {
line-height: 1.1em;
height: 1.1em;
padding-bottom: 2px;
clear: both;
}

.deptsRow {
line-height: 1.6em;
height: 1.6em;
clear: both;
}

.deptsHeader, .deptsRow, .deptsKey, .deptsVal, .deptsMet, .deptsNote, .deptsDate { overflow: hidden; }

.deptsMet span { margin: 0; padding-right: 1em; }
.deptsMet span.error { color: #f00; padding: 0; }
.deptsKey, .deptsVal, .deptsNote, .deptsMet, .deptsEmployeeInput { float: left; }
.deptsKey, .deptsNote, .deptsDate, .deptsVal, .deptsEmployeeInput { padding: 0 1em 0 1em; }

.deptsKey { width: 11em; }
.deptsVal { width: 5em; }
.deptsEmployeeInput {
  /*  margin-left: 300px; */
	width: 11em;
	text-transform: uppercase;
}
.deptsNote { width: 30em; } /* 15+12=27 */
.deptsRL, .deptsRR { width: 10em; }
.deptsRR, .deptsDT, .deptsOrder { text-align: right; }
.deptsDT { width: 5em; }
.deptsOrder { width: 3em; }
.deptsWage { width: 5em; text-align: right; }

/* report menu row */
/*.reportMenu { font-weight: bold; margin-bottom: 1px; width: 66em; }*/
.reportMenu { font-weight: bold; margin-bottom: 1px; width: 100%; }
.reportFromTo, .reportMenuL { float: left; }
.reportMenuL, .reportMenuR { line-height: 1.3em !important; height: 1.3em !important; }
.reportMenuR { text-align: right; }
.reportFromToOFF { display: none; }

#pleaseWait {
display: none;
position: absolute;
top: 8em;
left: 8em;
font-weight: bold;
background-color: #eee;
border: 2px solid #000;
width: 20em;
z-index: 100 !important;
padding: 1em;
}

#delPunch, #delPunch0, #delPunch1, #delPunch2 { display: none; }
#delPunch0 div, #delPunch1 div, #dnlFile div { width: 20em; margin-bottom: 1em; float: left; }
#delPunch0, #delPunch1, #dnlFile { clear: both; }

.spinner { vertical-align: middle; }

table.accrual
      {
        text-align: center;
                border-collapse: collapse;
        font-weight: normal;
      }

     table.accrual td
      {
                border-left: 0.1em #000 solid;
                border-right: 0.1em #000 solid;
      }

      table.accrual th
      {
                  border-bottom: 0.1em #000 solid;
                  border-top: 0.2em #000 solid;
                  border-left: 0.1em #000 solid;
                  border-right: 0.1em #000 solid;
                  padding:0.25em;
      }


      table.user
      {
        text-align: center;
        font-family: Verdana, Geneva, Arial, Helvetica, sans-serif ;
        font-weight: normal;
        font-size: 11px;
        color: #000;
        background-color: #fff;
        border: 0px;
        border-collapse: collapse;
        border-spacing: 0px;

      }

      table.user tr#d0
      {
        background-color: #dfd;
        padding: 2px;
      }

      table.user tr#d1
      {
        background-color: #fff;
      }

      table.user td
      {
        color: #000;
        
        text-align: left;
        border: 1px #000 solid;
      }

      table.user td#non-edit
      {
        text-align: right;
      }

      table.user td#editable
      {
        text-align: center;
      }


      table.user td#spacer
      {
        background-color: #999;
        color: #000;
        
        text-align: left;
        border: 0px #000 solid;
      }

      table.user th#spacer
      {
        background-color: #fff;
        color: #fff;
        
        text-align: left;
        border-bottom: 1px #000 solid;
        font-size: 12px;
        font-weight: bold;
      }

      table.user th
      {
        background-color: #fff;
        color: #000;
        
        text-align: center;
        vertical-align: bottom;
        border-bottom: 1px #000 solid;
        
        font-size: 13px;
        font-weight: bold;
      }
table.guide td{
        font-family: arial,verdana,sans-serif;
        font-size: 1.0em;
        padding: 2px;
}
