body { font: 6pt Verdana, Arial, Helvetica, sans-serif !important }
a { text-decoration: none }

#topbar, #mainsearchform, #secmenu, #splitdata #rightdata, #crewlist, #joblocation,
#crewshim, img, button, input,
.popover, .noprint, .limitheading, .jobtab.deselected, .moreroles, a span.link {
  display: none;
}

#content { margin: 0 !important; border: none !important; padding: 4px !important }
#splitdata #leftdata { margin-right: 0 !important; padding-right: 0 !important }
table.fixed { table-layout: fixed }
th, td { text-align: left; vertical-align: top }
label { padding-right: 1em }
.em { color: inherit; font-style: italic }

.editable.show span { display: none }
.editable.cropped.show { height: auto; overflow-x: visible; white-space: normal }

.wrapper:after { display: block; clear: both; content: "" }
.column { float: left }
.shaded .shadable { display: none }
.nowrap { white-space: normal }

div.column.one        { width: 100% }
div.column.two        { width: 50% }
div.column.three      { width: 33.33% }
div.column.three.two  { width: 66.66% }
div.column.four       { width: 25% }
div.column.four.two   { width: 50% }
div.column.four.three { width: 75% }
div.column.five       { width: 20% }
div.column.five.two   { width: 40% }
div.column.five.three { width: 60% }
div.column.five.four  { width: 80% }
div.column.six        { width: 16.665% }
div.column.six.two    { width: 33.33% }
div.column.six.three  { width: 49.995% }
div.column.six.four   { width: 66.66% }
div.column.six.five   { width: 83.335% }

#jobtopform .editable.show, #jobtopform a { font-weight: bold }
#jobtopform .blob:before { content: "" }
#jobtopform label { font-weight: normal !important }

#jobtopform { position: relative; width: 100%; xheight: 200px }

#jobtopnumberanddate, #jobtoptrucks, #jobtopeventtype, #jobtopeventname,
#jobtoplocation, #jobtopaddress {
  display: block;
  position: absolute;
}

#jobtopnumberanddate, #jobtoptrucks, #jobtopeventtype, #jobtopeventname {
  font-weight: bold;
}

#jobtopleft { width: 100%; position: absolute; top: 0; left: 0 }
#jobtopright { width: 100%; margin-top: 70px }

#jobtopnumberanddate { top: 0; left: 0; font-size: 18px }
#jobtopnumberanddate label { display: none }

#jobtopshowjobnumber:before, #jobtopdate.blob:before {
  font-size: 16px;
  font-weight: normal;
}

#jobtopshowjobnumber:before { content: "Job No: " }
#Xjobtopshowjobnumber:after { content: url("/resources/conflict.png") }
#jobtopdate.blob:before { content: "TX Date: " }
#jobtoptrucks { top: 0; right: 0; width: 100%; font-size: 18px; text-align: right }
#jobtoptrucks label, #jobtoptimings label, #jobtopnotes label  { display: none }
#jobtopeventtype { top: 20px; left: 0; font-size: 24px }
#jobtopeventname { top: 50px; left: 0; font-size: 12px; text-transform: uppercase }
#jobtoplocation, #jobtopaddress { left: 60%; width: 40%; font-weight: bold }
#jobtoplocation { top: 22px }
#jobtoplocation:before { display: block; content: "Location:"; font-weight: normal }
#jobtopaddress { top: 44px }
#jobtopaddress1 { display: block }
#jobtoptimings { float: left; width: 60% }
#jobtoptimings .blob { display: block !important }
#jobtoptimings:before { display: block; content: "Timings:" }
#jobtopnotes { float: right; width: 40% }
#jobtopspeciality { display: block }
#jobtopnotes:before { display: block; content: "Notes:" }

.jobcrew #leftdata table { border-spacing: 0; border-collapse: collapse }
.jobcrew #leftdata thead th { margin-bottom: 1em }
.jobcrew #leftdata thead th.jobday div div { display: none }
.jobcrew #leftdata thead tr.subhead { page-break-after: avoid; font-style: italic }
.jobcrew #leftdata thead th, .jobcrew #leftdata tbody td { border: 1px solid #aaa }
.jobcrew #leftdata tbody { page-break-inside: avoid }
.jobcrew #leftdata tbody td input.icon { display: none }
.jobcrew #leftdata tbody td a.tristate.yes:before { content: 'working' }
.jobcrew #leftdata tbody td a.tristate.yes.travel:before { content: 'travelling' }
.jobcrew #leftdata tbody td a.tristate.yes.rest:before { content: 'rest day' }
.jobcrew #leftdata tbody td a.tristate.yes.dark:before { content: 'dark day' }
.Xjobcrew #leftdata tbody td a.tristate.yes:before { content: url("/common/tristate/clear-yes.png") }
.Xjobcrew #leftdata tbody td a.tristate.no:before { content: url("/common/tristate/clear-noish.png") }
.jobcrew #leftdata tbody td a.tristate span { vertical-align: top }


.jobtab .tristate.yes:before { content: ' ✓' }

.jobtab .roleline {
  overflow: hidden;
  height: 1.2em;
  white-space: nowrap;
}

.jobtab { float: left; border: 1px solid #ccc; padding: 0.5em }
.jobtab.hidden, .jobtab.deselected { display: none }
.jobtab .subhead { border: 1px solid #ccc; font-weight: bold }

.jobtabhead {
  position: relative;
  margin: 0 0 2px 0;
  xborder: 1px outset #aaa;
  padding: 2px;
  overflow: hidden;
}

.jobtab .jobtabhead { padding: 0 }
.jobtab .jobtabhead .upper { padding: 2px 2px 0 2px }
.jobtab .jobtabhead .lower { width: 194px; padding: 0 2px 2px 2px }

.jobtab .jobtabhead .daybox, .jobtab .jobtabhead .daywrap, .jobtab .daywrap .dayhead {
  height: 80px;
}

.jobtab .dayhead { margin-right: 0; text-align: center; color: white }
.jobtab .day, .jobtab .dayhead { width: 16px }
.jobtab .daywrap .dayhead { position: relative }

.jobtab .jobtabhead .daywrap {
  position: absolute;
  bottom: 0;
  right: 0;
}

.jobtabhead button.action { position: absolute; top: 1px }
.jobtabhead button.first  { right: 0px }
.jobtabhead button.second { right: 15px }

.jobtabhead .editable a.show span { color: #444 }

.jobtabhead a { color: black; text-decoration: none }

.daywrap .rotate {
  position: relative;
  top: 64px;
  left: 2px;
  -webkit-transform: rotate(270deg);	
  -moz-transform: rotate(270deg);
  -o-transform: rotate(270deg);
  white-space: nowrap;
}

.jobtab .catroles { position: relative; margin-right: 0 }

.jobtab .subhead { width: 195px }
.jobtab .role { width: 90px; overflow: hidden }
.jobtab .name { width: 106px; overflow: hidden }
.jobtab .assigned a { color: red; xfont-weight: bold; text-decoration: none }

.crewcalendar h1 { display: inline-block; margin-top: 0 }
.crewcalendar div.toright { float: right }
.crewcalendar th, .crewcalendar td { border: 1px solid #ccc }
.crewcalendar .daybar { font-weight: bold; font-size: larger }
.crewcalendar td.day.faded { color: #aaa }
