/**
 * Main Colours:
 * Light light bg: #FFF6EF
 * Light brown: #EFEEEC
 * Soft highlight: #ABA29B
 * Goldy brown: #D2C4A7
 * Brown (txt): #7B7774
 * Chocolate: #45372C
 */
html {
    margin: 0px;
    padding: 0px;
}

body {
    font-family: Arial, Verdana, sans-serif;
    font-size: 12px;
    margin: 0px;
    padding: 0px;
    color: #45372C;
}

.pageBody {
    padding: 5px 10px 50px 10px;
    margin: 0;
    font-size: 12px;
    font-weight: normal;
}

h1 {
    font-size: 22px;
    text-align: left;
    margin: 0;
    padding: 5px 0 5px 0;
    color: #45372C;
}

h2 {
    font-size: 16px;
    margin: 0;
    padding: 5px 0 5px 0;
    text-align: left;
    color: #45372C;
}

h2 a,
h2 a:visited {
    text-decoration: none;
}

h2 a:hover {
    text-decoration: underline;
}

h3 {
    font-size: 14px;
    margin: 0;
    padding: 5px 0 5px 0;
    text-align: left;
    color: #45372C;
}

form {
    display: inline;
}

p {
    margin: 7px 0 7px 0;
}

td {
    font-family: Arial, Verdana, sans-serif;
    font-size: 12px;
}

li {
    padding-bottom: 3px;
}

hr {
    margin: 15px 0 15px 0;
    padding: 0px;
    border: none;
    height: 1px;
    background-color: #7B7774;
    color: #7B7774;
}

a {
    color: #6D0035;
    text-decoration: underline;
}

a:visited {
    color: #A6265B;
    text-decoration: underline;
}

a:hover {
    color: #1D7FD1;
    text-decoration: none;
}

#header {
    position: relative;
    height: 165px;
    background: transparent url(/image/header_bg.png) top left no-repeat;
    background-size: auto 85%;
    background-color: white;
}

#headerBox {
    position: absolute;
    top: 0px;
    left: 80px;
    width: 680px;
    overflow: hidden;
    height: 100%;
}

#headPhone {
    float: right;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    font-size: 200%;
}

#headerTitle {
    margin-top: 20px;
}


#environmentNotice {
    font-size: 80px;
    color: #000;
    font-weight: bold;
    position: absolute;
    left: 820px;
    top: 75px;
}

.logo {
    padding: 5px 0 0 10px;
    float: left;
    text-align: center;
    font-weight: bold;
    color: #7B7774;
}

#leftCol {
    width: 170px;
    border-right: 1px solid #ABA29B;
    background-color: #efeeec;
}

#leftCol .min {
    min-height: 100px;
    height: auto !important;
    height: 100px;
}

#leftCol .nav {
    padding-top: 20px;
}

#leftCol .nav a,
#leftCol .nav a:visited {
    display: block;
    font-weight: bold;
    font-size: 12px;
    color: #45372C;
    padding: 5px 0px 5px 0px;
    text-decoration: none;
    text-indent: 10px;
}

#leftCol .nav a:hover {
    display: block;
    color: #ABA29B;
    text-decoration: underline;
}

#leftCol .nav a.active,
#leftCol .nav a:visited.active {
    display: block;
    color: #EFEEEC;
    background-color: #45372C
}

.topNav {
    position: absolute;
    top: 118px;
    left: 240px;
}

a.lev1Nav,
a.lev1Nav:visited {
    padding: 10px 15px;
    margin-right: 1px;
    background: #7B7774 url(/image/navBtnBG.gif) top left repeat-x;
    color: white;
    font-weight: bold;
    text-align: center;
    text-decoration: none;
    border: 1px solid #CCCCCC;
    border-bottom: none;
}

a.lev1Nav:hover {
    background: #D2C4A7 url(/image/navBtnBGOver.gif) top left repeat-x;
    color: #7B7774;
    text-decoration: underline;
}

a.lev1Nav a.active,
a.lev1Nav a:visited.active {
    background: #D2C4A7 url(/image/navBtnBGOver.gif) top left repeat-x;
    border: 1px solid #FFFFFF;
    border-bottom: none;
    color: #7B7774;
}

.tabNav {
}

.tabNav a,
.tabNav a:visited {
    display: block;
    padding: 5px 10px 5px 10px;
    float: left;
    margin-right: 1px;
    background: #7B7774 url(/image/navBtnBG.gif) top left repeat-x;
    color: white;
    font-weight: bold;
    text-align: center;
    text-decoration: none;
    border: 1px solid #555555;
}

.tabNav a:hover {
    background: #D2C4A7 url(/image/navBtnBGOver.gif) top left repeat-x;
    color: #7B7774;
    text-decoration: underline;
}

.tabNav a.active,
.tabNav a:visited.active {
    background: #D2C4A7 url(/image/navBtnBGOver.gif) top left repeat-x;
    border: 1px solid #555555;
    color: #7B7774;
}

.tabNav .title {
    float: left;
    font-weight: bold;
    padding: 5px 5px 0 0;
}


#footer {
    background: #7B7774 url(/image/navBtnBG.gif) top left repeat-x;
    color: #FFFFFF;
    text-align: center;
    line-height: 25px;
}

#footer a {
    color: #FFFFFF;
    text-decoration: none;
}

#footer a:visited {
    color: #FFFFFF;
    text-decoration: none;
}

#footer a:hover {
    color: #FFFFFF;
    text-decoration: underline;
}

.floatLeft {
    float: left;
    margin: 0 10px 5px 0;
}

.floatRight {
    float: right;
    margin: 0 0 5px 10px;
}

.floatRightNPad {
    float: right;
    margin: 0;
}

.strong {
    font-weight: bold;
}

.req {
    color: #ff0000;
    vertical-align: super;
}

.fld {
    font-weight: bold;
    text-align: right;
    width: 100px;
}

#pBgDark {
    background: #6C0036;
    height: 5px;
}

#pBgMid {
    background: #7B7774;
    height: 5px;
}

#pBgLight {
    background: #A31955;
    height: 5px;
}

.time, .num {
    text-align: right;
}

/****** Macromedia style buttons ********/
.btn {
    background: #fefefe url(/image/btnBG.gif) repeat-x;
    border: 4px double;
    border-color: #ABA29B #7B7774;
    padding: 0px 10px;
}

.btn:hover,
.btn:focus {
    border: 4px double;
    border-color: #EFEEEC;
}

input.btn {
    cursor: pointer !important;
    /* Used for early versions of ie. Not standard CSS */
    cursor: hand;
}

.btn.renew-notification {
    color: black;
    text-decoration: none;
}

/*********************/

.clear {
    clear: both;
}

.clearLeft {
    clear: left;
}

.clearRight {
    clear: right;
}

div.line {
    height: 1px;
    background-color: #7B7774;
}

table.data {
    border-collapse: collapse;
}

table.data, table.data td, table.data th {
    border: 1px solid #7B7774;
}

table.data th {
    background-color: #D2C4A7;
    color: #45372C;
}

table.data td img {
    border: none;
}

.addTable th,
.fld {
    font-weight: bold;
    text-align: right;
}

.fldMsg {
    font-size: 10px;
    color: #BF8383;
}

#login {
    padding: 20px 0 20px 10px;
}

#login .fld {
    text-align: left;
    font-weight: bold;
    padding-bottom: 3px;
    padding-top: 3px;
    color: #7B7774;
}

#login .title {
    font-size: 13px;
    font-weight: bold;
    color: #7B7774;
}

.userInfo {
    position: absolute;
    top: 5px;
    right: 10px;
    line-height: 20px;
    text-align: right;
    color: #000;
}

.userInfo a,
.userInfo a:visited
.userInfo a:hover {
    color: #000;
}

.usrErrMsg {
    color: #FF3333;
    font-weight: bold;
    font-size: 14px;
    padding-left: 55px;
    padding-top: 15px;
    height: 50px;
    background: url(/image/error.gif) top left no-repeat;
}

.usrAccMsg {
    color: #45372C;
    font-weight: bold;
    font-size: 14px;
    padding-left: 55px;
    padding-top: 15px;
    height: 50px;
    background: url(/image/success.gif) top left no-repeat;

}

.searchBox {
    width: 500px;
    padding: 15px;
    border: 1px solid #7B7774;
    background: #D2C4A7 url(/image/navBtnBGOver.gif) top left repeat-x;
}

.searchBox .tips {
    padding-left: 10px;
    font-size: 10px;
}

.lightTxt,
.alphaList {
    color: #AAAAAA;
}

.alphaList a,
.alphaList a:visited {
    padding: 0px 5px 0px 5px;
    text-decoration: none;
}

.alphaList a:hover {
    text-decoration: underline;
}

.alphaList a.active {
    text-decoration: none;
    background-color: #7B7774;
    color: #FFFFFF;
    font-weight: bold;
}

.center {
    text-align: center;
}

.searchNote {
    font-size: 11px;
    font-style: italic;
}

.quotePart {
    border: 1px solid #7B7774;
}

.quotePartAcceptCheck {
    background-color: #95FF8F;
}

.sortBy {
    float: left;
    margin-top: 5px;
    padding: 5px;
    border: 1px solid #7B7774;
    background: #D2C4A7 url(/image/navBtnBGOver.gif) top left repeat-x;
    font-size: 11px;
}

.sortBy a.active {
    font-weight: bold;
}

.data td.notes,
.data td.privNotes {
    font-size: 11px;
    background-color: #EEEEEE;
    border-bottom: 2px solid #7B7774;
}

.clientView th {
    width: 120px;
}

.icons,
.iconLinks {
    float: left;
}

.icons img,
.iconLinks img {
    border: 0;
}

a.more,
a.more:visited {
    text-decoration: none;
}

a.more:hover {
    text-decoration: underline;
}

#topIcons {
    position: absolute;
    top: 130px;
    right: 20px;
}

#topIcons img {
    border: 0;
}

#defaultPart {
    display: none;
}

.quoteStatusPending {
    background-color: #FFE87F;
}

.quoteStatusAccepted {
    background-color: #95FF8F;
}

.quoteStatusRejected {
    background-color: #FF7F84;
}

.quoteView th {
    width: 100px;
}

.quotePart .price {
    width: 100px;
    text-align: right;
    font-weight: bold;
}

.quotePart .price .treesStumps {
    font-weight: normal;
    color: #AAAAAA;
    padding-top: 5px;
}

.quotePart .siteAddress,
.quotePart .scope,
.quotePart .priceBreakdown {
    padding: 5px 0 5px 0px;
}

.quotePart .schNotes {
    padding-top: 5px;
}

.rejectReason {
    padding-left: 20px;
}

.unReject {
    background-color: #eee;
    border: 1px solid #ccc;
    padding: 3px;
    margin-right: 10px;
}

.scheduleCal {
    float: right;
    padding: 5px;
    border: 3px double #7B7774;
}

table.cal {
    border: 1px solid #7B7774;
    border-right: none;
    border-bottom: none;
}

table.cal th,
table.cal td {
    border-right: 1px solid #7B7774;
    border-bottom: 1px solid #7B7774;
}

table.cal th {
    background: #D2C4A7 url(/image/navBtnBGOver.gif) top left repeat-x;
}

table.cal th a,
table.cal th a:visited {
    text-decoration: none;
    color: #45372C;
}

table.cal th a:hover {
    text-decoration: underline;
}

table.cal tr.even,
tr.even,
div.even,
.even {
    background-color: #FFF6EF;
}

table.cal .suburb {
    font-size: 11px;
}

table.cal .time {
    width: 80px;
}

a.plus,
a.plus:visited {
    float: right;
    text-decoration: none;
    font-weight: bold;
    font-size: 14px;
    padding: 0 2px 0 2px;
}

a.plus:hover {
    text-decoration: none;
    background: #7B7774;
    color: #FFFFFF;
}

#calendarContainer {
    float: right;
    margin-top: -30px;
    padding-bottom: 5px;
}

.hidden {
    display: none;
}

.pic,
#pic {
    border: 3px double #AAAAAA;
}

.pic.staff-pic {
    max-width: 300px;
    max-height: 400px;
}

.quoteRun#calendarContainer {
    margin-top: -60px;
}

.jumpSearch {
    float: right;
    margin-right: 40px;
}

.jumpSearch input.search {
    background: #D2C4A7 url(/image/navBtnBGOver.gif) top left repeat-x;
    border: 1px inset #7B7774;
}

.fullSearch {
    text-align: right;
    padding-top: 5px;
}

.clientQuotePart td {
    font-size: 11px;
}

.jobCalJob {
    font-size: 11px;
}

#upComingAlert {
    position: absolute;
    top: 110px;
    left: 610px;
    z-index: 200;
}

.smallAutoComplete {
    font-size: 10px;
}

.overdueAlert {
    font-weight: bold;
    color: #FF0000;
    font-size: 14px;
}

.crewFld {
    margin-bottom: 5px;
}

.crewFld .crewTitle,
.crewFld .jobTitle {
    float: left;
    font-weight: bold;
    width: 40px;
    text-align: center;
    margin-right: 5px;
}

.crewFld .jobTitle {
    width: 25px;
}

#schJobs {
    border: 1px solid #7B7774;
    background-color: #FFEFF7;
    padding: 5px;
}

#schJobs .noCrewJob {
    padding-bottom: 5px;
}

#multiDayJobPrices {
    padding-top: 5px;
    font-size: 10px;
    line-height: 25px;
}

#multiDayJobPrices table td {
    border: none;
    padding-right: 50px;
}

#multiDayJobPrices input.price {
    width: 58px;
}

.crewName {
    font-weight: bold;
    color: #7B7774;
    padding-bottom: 5px;
}

table.sortable th {
    cursor: pointer;
}

.crewNotes {
    margin-top: 20px;
    padding: 5px;
    font-size: 14px;
    border: 3px solid #FF0000;
}

/**
 * Page numbering
 */
#pageNumContainer {
    width: 95%;
}

#pageNum {
    float: left;
    font-size: 10px;
    padding: 10px 0 2px 0;
}

#pageNum ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    width: auto;
}

#pageNum li {
    float: left;
    display: block;
    padding: 0;
    margin: 0;
    text-align: center;
    margin-right: 1px;
}

#pageNum li a {
    text-decoration: none;
    background-color: #45372C;
    padding: 2px 5px 2px 5px;
    border: 1px solid #7B7774;
    display: block;
    color: #FFFFFF;
}

#pageNum li a#pagePrevious,
#pageNum li a#pageNext,
#pageNum li a:hover {
    background-color: #45372C;
    color: white;
}

#pageNum li.pageTxt {
    padding: 3px 5px 3px 0;
    font-weight: bold;
    color: #45372C;
}

#pageNum li.current {
    padding: 2px 5px 2px 5px;
    background-color: #FFFFFF;
    color: black;
    border: 1px solid #7B7774;
}

#pageJump {
    font-size: 10px;
    padding-top: 5px;
}

#globalSearch {
    position: absolute;
    top: 80px;
    right: 10px;
}

#globalSearchBox {
    width: 100px;
    background-color: #D2D2D2;
}


/*****************************/
.dragRow {
    background-color: #ABA29B;
}

#qualSearchCriteria {
    margin-top: 0;
    padding-top: 0;
}

.jobPic {
    float: left;
    width: 200px;
    font-size: 11px;
}

#logSearch {
    margin-bottom: 5px;
}

.listQuoteDetail {
    padding: 3px 0;
}

.listScope {
    padding-left: 10px;
}

.staffMatrixLinks a,
.staffMatrixLinks a:visited {
    color: #45372C;
    text-decoration: none;
}

.staffMatrixLinks a:hover {
    color: #45372C;
    text-decoration: underline;
}

/******************************
 ******* Dashboard ************
 *****************************/
#dashTabsTask,
#dashTabsAlert {
    width: 590px;
    height: 200px;
    overflow: hidden;
}

#dashTabsQuoteRun {
    width: 350px;
    height: 700px;
    overflow: hidden;
}

#dashTabsQuotes {
}

#dashTabsJobs {
    width: 590px;
    height: 300px;
    overflow: hidden;
}

.dashTasks {
    height: 140px;
    overflow: auto;
}

.dashQRun {
    height: 625px;
    overflow: auto;
}

.dashQuote {
    height: 180px;
    overflow: auto;
}


.dashTabsJobs {
    height: 245px;
    overflow: auto;
}

#dashCorrespondence {
    width: 580px;
    border: 1px solid #aaaaaa;
    padding: 5px;
}

/******************************
 ******* END Dashboard ********
 *****************************/
ul#quickLinks {
    list-style-type: none;
    margin: 0;
    padding: 0;
    width: 470px;
}

#quickLinks li {
    float: left;
}

#quickLinks li a {
    display: block;
    font-size: 16px;
    background: #7B7774 url(/image/navBtnBG.gif) top left repeat-x;
    border: 1px solid #DFDFDF;
    margin-right: 5px;
    width: 100px;
    height: 66px;
    padding: 0px 5px;
    padding-top: 34px;
    color: #ffffff;
    text-align: center;
}

#dashSearches {
    text-align: right;
    background-color: #EFEFEF;
    border: 1px solid #DFDFDF;

}

.right {
    text-align: right;
}

#userSwitch {
    padding-top: 10px;
}

.actionsCol {
    width: 100px;
    white-space: nowrap;
}

.alertDateCol {
    width: 100px;
}

.mobPhoto {
    float: left;
    border: 1px solid #AAAAAA;
    margin-right: 2px;
}

.mobCap {
    padding: 5px;
    text-align: center;
    background-color: #EFF5FF;
}

.cancelInvoice,
.cancelJob {
    background-color: #eee;
    border: 1px solid #ccc;
    padding: 3px;
    margin-left: 80px;
}

.cancelInvoice {
    margin-left: 0;
}

tr.onHold,
.onHold {
    background-color: #FF9999;
}

div.onHold a,
div.onHold a:visited,
div.onHold a:hover {
    text-decoration: none;
    color: #000;
}

.min100w {
    min-width: 100px;
}

#emailForm input {
    margin-bottom: 5px;
}

/*
Pending Job Highlighting
*/

.age_0_weeks {
    background-color: #83ff59;
}

.age_1_weeks {
    background-color: #83ff59;
}

.age_2_weeks {
    background-color: #e3ff59;
}

.age_3_weeks {
    background-color: #ffba59;
}

.age_4_weeks {
    background-color: #ff5959;
}

#ageFilterKey {
    margin: 2px;
    padding: 0;
}

#ageFilterKey li {
    list-style-type: none;
    width: 70px;
    padding: 3px;
}

/******************************
 *******  Job Run DnD  ********
 *****************************/
#rSDatePicker {
}

table#resourceCal {
    border-collapse: collapse;
    border-spacing: 0;
    min-width: 400px;
    table-layout: fixed;
}

#resourceCal td, #resourceCal th {
    border: 1px solid #ccc;
    width: 150px;
}

#resourceCal td {
    position: relative;
}

#resourceCon {
    margin-right: 10px;
    width: 100%;
}

#resourceCon .wrap {
    height: 150px;
    float: left;
    width: 330px;
    margin-right: 5px;
    overflow-y: auto;
    border: 1px solid #ddd;
}

#staffAbsent {
    width: 180px !important;
}

.staffDrag, .equipmentDrag, .eventDrag {
    float: left;
    padding: 3px;
    margin: 0 2px 2px 0;
    width: 145px;
    height: 18px;
    overflow: hidden;
}

.staffDrag, .equipmentDrag {
    white-space: nowrap;
}

.staffDrag, .equipmentDrag, .eventDrag h2 {
    cursor: move;
}

.eventDrag h2 {
    font-size: 1em;
    font-weight: normal;
    color: #fff;
    padding: 0;
    margin: 0;
}

.staffDrag {
    background-color: #E1E1E1;
    position: relative;
}

.equipmentDrag {
    background-color: #DBFDFF;
}

.eventDrag {
    background-color: #516A78;
    color: #fff;
    height: 18px;
    border: 1px solid black;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 999;
}

.calTs .eventDrag {
    width: 94%;
    position: absolute;
}

#jobCon .eventDrag {
    position: relative;
}

.eventMisc {
    background-color: rgb(219, 210, 0);

}

.eventMisc h2 {
    color: #000000;
}

.runWrap {
    width: 100px;
}

th.resourceTitle {
    text-align: right;
    width: 80px;
}

th.timeslot {
    text-align: right;
}

td.calTs {
    height: 25px !important;
}

.odd {
    background: #EFF2FF;
}

.staffCon, .equipmentCon {
    height: 120px;
    overflow-y: auto;
    overflow-x: hidden;
}

.eventTime {
    color: #FAFFC5;
    padding-top: 5px;
}

.eventDuration {
    font-size: 9px;
    padding-left: 5px;
    color: #FAFFC5;
}

.eventError {
    background-color: red;
}

.eventInitials {
    font-weight: bold;
    padding-left: 5px;
    colour: #000;
}

.evDivisionIndicator {
    display: inline-block;
    width: 4px;
    border-radius: 2px;
}

.evPrivate,
.evDivision1 {
    margin-right: 5px;
    background-color: #0AF98E;
}

.evCouncil,
.evDivision2 {
    margin-right: 5px;
    background-color: #D369FF;
}

.evCorporate,
.evDivision3 {
    margin-right: 5px;
    background-color: #CB0037;
}

.evGovernment,
.evDivision4 {
    margin-right: 5px;
    background-color: #FF7F00;
}

.evLandscape,
.evDivision5 {
    margin-right: 5px;
    background-color: #a5d6f8;
}

.evLandClearing,
.evDivision6 {
    margin-right: 5px;
    background-color: #913E08;
}

.evContractor {
    display: inline-block;
    height: 100%;
    margin-right: 2px;
    background-color: #0021D8;
    vertical-align: top;
}

.evFirstAider {
    position: absolute;
    display: block;
    width: 16px;
    height: 16px;
    margin-right: 5px;
    background-image: url(/image/red-cross.png);
    right: 0;
    top: 4px;
}

.staffCon .evFirstAider {
    display: none;
}

.jobRunNote.jobRunNote-FA {
    background-color: #ECD3A4;
}

.jobRunNote h3 {
    font-style: underline;
}

.fa-stuff {
    padding: 0 10px;
    text-align: left;
}

.evIndicator {
    margin-right: 5px;
}

.evDriver {
    background-image: url(/image/car.png);
    background-position: right top;
    background-repeat: no-repeat;
}

/*
    PMIIPLS-260: ensure driver names can't get wide enough to overlap driver icon.
*/
.staffNameWrap {
    display: inline-block;
    height: 100%;
}

.evDriver .staffNameWrap {
    width: 131px;
    overflow: hidden;
}

/*
    PMIIPLS-260: See https://grack.com/blog/2015/01/09/abusing-css3-selectors/ for the technique used here.
    We're essentially creating a selector that allows styling children of an element when there are a specific
    number of children. Each selector in the set only works for a specific child count, so we duplicate it to
    account for a range of children from 5 to 10.
*/
.staffCon .evDriver:nth-child(1):nth-last-child(5),
.staffCon :nth-child(1):nth-last-child(5) ~ .evDriver,
.staffCon .evDriver:nth-child(1):nth-last-child(6),
.staffCon :nth-child(1):nth-last-child(6) ~ .evDriver,
.staffCon .evDriver:nth-child(1):nth-last-child(7),
.staffCon :nth-child(1):nth-last-child(7) ~ .evDriver,
.staffCon .evDriver:nth-child(1):nth-last-child(8),
.staffCon :nth-child(1):nth-last-child(8) ~ .evDriver,
.staffCon .evDriver:nth-child(1):nth-last-child(9),
.staffCon :nth-child(1):nth-last-child(9) ~ .evDriver,
.staffCon .evDriver:nth-child(1):nth-last-child(10),
.staffCon :nth-child(1):nth-last-child(10) ~ .evDriver,
.staffCon .evDriver:nth-child(1):nth-last-child(11),
.staffCon :nth-child(1):nth-last-child(11) ~ .evDriver,
.staffCon .evDriver:nth-child(1):nth-last-child(12),
.staffCon :nth-child(1):nth-last-child(12) ~ .evDriver,
.staffCon .evDriver:nth-child(1):nth-last-child(13),
.staffCon :nth-child(1):nth-last-child(13) ~ .evDriver,
.staffCon .evDriver:nth-child(1):nth-last-child(14),
.staffCon :nth-child(1):nth-last-child(14) ~ .evDriver,
.staffCon .evDriver:nth-child(1):nth-last-child(15),
.staffCon :nth-child(1):nth-last-child(15) ~ .evDriver,
.staffCon .evDriver:nth-child(1):nth-last-child(16),
.staffCon :nth-child(1):nth-last-child(16) ~ .evDriver,
.staffCon .evDriver:nth-child(1):nth-last-child(17),
.staffCon :nth-child(1):nth-last-child(17) ~ .evDriver,
.staffCon .evDriver:nth-child(1):nth-last-child(18),
.staffCon :nth-child(1):nth-last-child(18) ~ .evDriver,
.staffCon .evDriver:nth-child(1):nth-last-child(19),
.staffCon :nth-child(1):nth-last-child(19) ~ .evDriver,
.staffCon .evDriver:nth-child(1):nth-last-child(20),
.staffCon :nth-child(1):nth-last-child(20) ~ .evDriver {
    background-position: 118px top;
}

/*
    Additional fix to ensure that a person with a long name who holds equipment doesn't ever the driver icon
*/
.staffCon .evDriver:nth-child(1):nth-last-child(5) .staffNameWrap,
.staffCon :nth-child(1):nth-last-child(5) ~ .evDriver .staffNameWrap,
.staffCon .evDriver:nth-child(1):nth-last-child(6) .staffNameWrap,
.staffCon :nth-child(1):nth-last-child(6) ~ .evDriver .staffNameWrap,
.staffCon .evDriver:nth-child(1):nth-last-child(7) .staffNameWrap,
.staffCon :nth-child(1):nth-last-child(7) ~ .evDriver .staffNameWrap,
.staffCon .evDriver:nth-child(1):nth-last-child(8) .staffNameWrap,
.staffCon :nth-child(1):nth-last-child(8) ~ .evDriver .staffNameWrap,
.staffCon .evDriver:nth-child(1):nth-last-child(9) .staffNameWrap,
.staffCon :nth-child(1):nth-last-child(9) ~ .evDriver .staffNameWrap,
.staffCon .evDriver:nth-child(1):nth-last-child(10) .staffNameWrap,
.staffCon :nth-child(1):nth-last-child(10) ~ .evDriver .staffNameWrap,
.staffCon .evDriver:nth-child(1):nth-last-child(11) .staffNameWrap,
.staffCon :nth-child(1):nth-last-child(11) ~ .evDriver .staffNameWrap,
.staffCon .evDriver:nth-child(1):nth-last-child(12) .staffNameWrap,
.staffCon :nth-child(1):nth-last-child(12) ~ .evDriver .staffNameWrap,
.staffCon .evDriver:nth-child(1):nth-last-child(13) .staffNameWrap,
.staffCon :nth-child(1):nth-last-child(13) ~ .evDriver .staffNameWrap,
.staffCon .evDriver:nth-child(1):nth-last-child(14) .staffNameWrap,
.staffCon :nth-child(1):nth-last-child(14) ~ .evDriver .staffNameWrap,
.staffCon .evDriver:nth-child(1):nth-last-child(15) .staffNameWrap,
.staffCon :nth-child(1):nth-last-child(15) ~ .evDriver .staffNameWrap,
.staffCon .evDriver:nth-child(1):nth-last-child(16) .staffNameWrap,
.staffCon :nth-child(1):nth-last-child(16) ~ .evDriver .staffNameWrap,
.staffCon .evDriver:nth-child(1):nth-last-child(17) .staffNameWrap,
.staffCon :nth-child(1):nth-last-child(17) ~ .evDriver .staffNameWrap,
.staffCon .evDriver:nth-child(1):nth-last-child(18) .staffNameWrap,
.staffCon :nth-child(1):nth-last-child(18) ~ .evDriver .staffNameWrap,
.staffCon .evDriver:nth-child(1):nth-last-child(19) .staffNameWrap,
.staffCon :nth-child(1):nth-last-child(19) ~ .evDriver .staffNameWrap,
.staffCon .evDriver:nth-child(1):nth-last-child(20) .staffNameWrap,
.staffCon :nth-child(1):nth-last-child(20) ~ .evDriver .staffNameWrap {
    max-width: 114px;
}

#duplicateJobRun,
#deleteJobRun {
    padding-left: 70px;
}

ul#jobRunLegend {
    margin: 0;
    padding: 10px 0;
    list-style-type: none;
}

ul#jobRunLegend li {
    float: left;
    margin: 0;
    padding: 0;
    padding-left: 10px;
}

.jobRunNote {
    position: absolute;
    padding: 10px;
    min-height: 100px;
    background-color: #FFFF73;
    border: 1px solid #ccc;
    z-index: 999;
}

/******************************
 ****** End Job Run DnD *******
 *****************************/

/******************************
 ****** Timesheets ************
 *****************************/
.timesheetName {
    font-size: 140%;
}

.tsTitle, .tsTitle td {
    font-weight: bold;
}

.tsClassification {
    font-size: 80%;
    font-weight: normal;
}

/******************************
 ****** End Timesheets ********
 *****************************/


/* Leave classes need to be after job run otherwise staffDrag overwrites it */
.upcomingLeave {
    background-color: #FFF58F;
}

.onLeave {
    background-color: #FF6F75;
}

/* PMIIPLS-260 additional fix: ensure person with long name who holds equipment doesn't overlap the driver icon. */
.equipHighlight {
    display: inline-block;
    background-color: #FF6FCC;
}

.field-supervisor {
    background-color: #99ff99;
}

.field-supervisor-in-charge:before {
    content: 'FS ';
    font-size: 10px;
    font-weight: 900;
}

.hl {
    background-color: #FFFF73;
}

#hazardFrm {
    font-size: 14px;
}

#hazardFrm input, #hazardFrm textarea {
    margin-bottom: 10px;
}

#hazardFrm textarea {
    width: 600px;
    height: 150px;
}

#hazardFrm fieldset {
    border: none;
    width: 600px;
}

#hazardFrm legend {
    font-size: 18px;
    margin: 0px;
    padding: 10px 0px;
    font-weight: bold;
    text-transform: uppercase;
}

#hazardFrm .prev,
#hazardFrm .next {
    background-color: #EFEEEC;
    padding: 5px 10px;
    color: #000;
    text-decoration: none;
}

#hazardFrm .prev:hover,
#hazardFrm .next:hover {
    background-color: #EFEEEC;
    text-decoration: none;
}

#hazardFrm .next {
    float: right;
}

#hazardFrm input[type=checkbox] {
    width: 20px;
    height: 20px;
    margin: 0;
    vertical-align: middle;
}

#hazardFrm .form-control {
    margin-bottom: 10px;
}

#treeDetails {
    padding: 0;
}

#treeDetails label {
    font-size: 12px;
}

#treeDetails input,
#treeDetails label {
    width: 95px;
    margin-right: 10px;
    display: inline-block;
}

#treeDetails li {
    list-style: none
}

#hazard-steps {
    list-style: none;
    width: 100%;
    overflow: hidden;
    margin: 0px;
    padding: 0px;
}

#hazard-steps li {
    font-size: 24px;
    float: left;
    padding: 10px;
    color: #b0b1b3;
    cursor: pointer;
}

#hazard-steps li span {
    font-size: 11px;
    display: block;
}

#hazard-steps li.current {
    color: #000;
}

#job-requirements h4 {
    margin-top: 30px;
    margin-bottom: 10px;
}

.job-requirement {
    margin-left: 20px;
}

#hazardTbl-summary {
    max-width: 800px;
}

#hazardTbl-summary th {
    width: 10%;
}

#hazardTbl-summary td {
    width: 40%;
}

table.hazardTbl th {
    font-size: 12px;
    background-color: #fff;
    text-align: left;
}

.hazardYesMsg {
    padding-bottom: 10px;
    font-style: italic;
    color: #BF8383;
}

#emailContacts {
    position: absolute;
    left: 480px;
    height: 180px;
    overflow-y: auto;
    overflow-x: hidden;
}

#emailContacts .title {
    font-weight: bold;
}

#emailContacts ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    width: 450px;
}

#emailContacts li {
    background-color: #F6FFD3;
    border: 1px solid #ccc;
    margin: 0;
    padding: 3px;
    margin-bottom: 1px;
}

#emailContacts li:hover {
    cursor: pointer;
}

.toolboxBody {
    width: 50%;
}

body.staging {
    background-color: #d6ffc2;
}

body.local {
    background-color: #ff9ca1;
}

.client-file {
    margin: 20px 0px;
}

.multi-src {
    display: none;
}

.alert {
    padding: 0.5em 0.8em;
    border-radius: 3px;
    margin-bottom: 10px;
    color: white;
    font-weight: bold;
    display: inline-block;
}

.alert .fa {
    padding-right: 0.3em;
}

.alert-info {
    background-color: #4FC1E9;
}

.alert-warning {
    background-color: #FC6E51;
}

.collapsable-text {

}

.collapsable-text .exp-btn {
    display: none;
    margin-top: 5px;
    background-color: #AAB2BD;
    color: #fff;
    text-decoration: none;
    padding: 3px 5px;
    border-radius: 3px;
    cursor: pointer;
}

.collapsable-text.collapsed .exp-btn {
    display: inline-block;
}

.collapsable-text .text-body {
    text-overflow: ellipsis;
    overflow: hidden;
    line-height: 1.4em;
}

.collapsable-text.collapsed .text-body {
    max-height: 63px;
}


#quote-ajax-form > table.data th.log {
    width: 15%;
}

.error_message {
    padding: 15px;
    background-color: #f44336;
    color: white;
    margin-bottom: 15px;
    display: block;
    border-radius: 5px;
    width: 40%;
    font-size: 16px;
}

.inactive-qualification-row {
    background-color: grey;
    color: white;
}

.inactive-qualification-row .fldMsg {
    color: white;
}

.expired-qualification-row {
    background-color: red;
    color: white;
}

.expired-qualification-row .fldMsg {
    color: white;
}

a.download-spreadsheet img {
    vertical-align: middle;
}

.require-certification-row {
    background-color: #ffb241;
    color: white;
}

.require-certification-row .fldMsg {
    color: white;
}

.ajax-loading {
    width: 100%;
    text-align: center;
}