@import url("/common/css/pagebase.css");
@import url("/common/css/adminbase.css");
@import url("/common/css/top.menu.css");
@import url("/common/css/column.css");
@import url("/css/categories.css");
@import url("/css/availability.css");
@import url("/css/stage.css");

body {
  line-height: 140%;
  font-size: 0.79em;
  font-size: 0.7em;
}

body#xpage {
  margin: 0 10px 10px 10px;
  padding: 10px;
  border: 1px solid #bebebe;
}

#content {
  position: relative;
  margin: 47px 10px 10px 10px;
  padding: 10px;
  border: 1px solid #bebebe;
  z-index: 1010;
}

#topbar {
  position: fixed;
  z-index: 1020;
  top: 0;
  left: 0;
  width: 100%;
}

#topbar .fade {
  width: 100%;
  background: transparent url("/common/resources/fade.down.black25.10px.png") repeat-x;
}

body.hasheader #topbar .fade {
  box-sizing: border-box;
  padding: 10px 10px 0 10px;
}

button.page.closebox {
  position: absolute;
  z-index: 1030;
  top: 2px;
  right: 1px;
}

h1, h2, h3 { font-weight: normal }

h1 { font-size: 150%; color: black }
h2 { font-size: 140%; color: #007e80 }
h3 { font-size: 115%; color: #7f7e08 }

th { background-color: #000000; color: #FFFFFF }
/* th span { white-space: nowrap } */
th.wrap { color: #baa } /* redundant? */
div.wrap { color: #baa }

table.padded th, table.padded td { padding: 0 1em }
img.small { height: 12px; width: 12px; vertical-align: text-bottom }

input, select, textarea,
a.button:link, a.button:hover, a.button:active, a.button:visited {
  color: #134b78;
  border-color: #c3bf88;
}

a.button:link, a.button:hover, a.button:active, a.button:visited {
  background-color: #fffdfb;
  font-size: 100%;
}

a { color: #004080 }
th a { color: white }

a:hover, .editable a.show:hover, .editable a:hover,
.editable input.text, .editable textarea {
  background-color: #ddd0c7;
  background-image: none;
  color: black;
}

.odd a:hover, .odd .editable a.show:hover, .odd .editable a:hover,
.odd .editable input.text, .odd .editable textarea {
  background-color: #e9ffe9;
  background-color: #d9eed9;
}

.deleted .editable.show a.show { color: #999; text-decoration: line-through }

.even a:hover, .even .editable a.show:hover, .even .editable a:hover,
.even .editable input.text, .even .editable textarea {
  background-color: #e0f7e0;
  background-color: #d0e7d0;
}

.catback a:hover, .catback .editable a.show:hover, .catback .editable a:hover,
.catback .editable input.text, .catback .editable textarea {
  background: transparent url("/common/resources/white.70.png") top left repeat;
}

.truncate { overflow: hidden; white-space: nowrap }
.crewalloc td.truncate { white-space: normal }

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

.blacklink.disabled a, a.blacklink.disabled {
  text-decoration: line-through;
}

.blacklink a {
  border-bottom: 1px solid #999;
}

.catback .blacklink a {
  border-bottom-color: #555;
}

.blacklink a:active, .blacklink a:hover {
  background: transparent none;
  text-decoration: none;
  border-bottom-color: black;
}

.dropped {
  position: relative;
  top: 4px;
}

div.enboxed {
  margin: 0.5em 0;
  border-width: 1px;
  border-style: solid;
  border-color: #99c #669 #669 #99c;
  border-radius: 3px;
  padding: 0.5em 1em;
}

div.enboxed+div.enboxed { margin-top: 1em }
div.enboxed>h3:first-child { margin-top: 0 }

a[target=google] {
  text-decoration: none;
  white-space: nowrap;
}

/*
a[target=google]:before {
  content: url("/common/icons/map.png") !important;
  vertical-align: bottom;
}
*/

a[target=google]:hover {
  background: transparent url("/common/resources/black.10.png") !important;
  border-bottom: 2px solid red;
  text-decoration: none !important;
}

a.tristate, a.tristate:hover { color: black }

a.image {
  display: block;
  width: 16px;
  height: 16px;
}

a.image img { padding: 1px 0 0 1px }

a.tiplock {
  display: block;
  text-decoration: none;
  margin-top: 3px;
  border: none;
  border-top: 1px solid #eee;
  text-align: right;
  color: #666;
}

a.tristate.crew span,  span.tristate.crew span  {
  background-image: url("tristate.crew.png") !important;
}

a.tristate.crewreport.small span,  span.tristate.crewreport.small span  {
  background-image: url("tristate.report.png") !important;
}

input.icon:hover, a.icon:hover, a.image:hover {
  background: transparent url("/common/tristate/small-overlay.gif") top left no-repeat;
}

input.button.move {
  background-color: transparent;
  border-color: #ccc;
}

button.latch { vertical-align: top }

.editable.edit div.buttons {
  opacity: 0.9;
}

.editable a:active { background-color: transparent }

.shaded .shadable { display: none }

.blueborder {
  background-color: #FFFFFF;
  border: 1px solid #9f95b5;
}

.paleblueborder {
  background-color: #FFFFFF;
  border: 1px solid #e6e6e6;
}

.altrow {
  background-color: #fff7f0;
  border-color: #e6e6e6;
}

.subhead, .subline { background-color: #999 }

.labelled p, .labelled label, .labelled .editable { margin: 0 8px 0 16px }
.labelled p, .labelled label { margin-top: 1em }
.labelled label, .labelled br { display: block }
.labelled br { clear: left }

.labelled .editable.checkbox label, .labelled label.before, .labelled label.after {
  display: inline;
}

.labelled label.marked, .labelled .editable.marked label {
  padding-left: 16px;
  background: transparent url("/common/resources/clear-red.png") 0mm 1.5mm no-repeat;
}

.labelled .editable label, .labelled label.marked { margin-left: 0 }
.labelled .editable.marked label { margin-left: -16px }
.labelled .editable { display: block; float: none }
.labelled .editable.float { float: left; width: 40% }
.labelled .editable.float a { min-height: 1.5em }
.labelled .editable.textarea a.show { overflow: auto }
.labelled .editable textarea, .labelled .editable.textarea a.show { height: 3em }

.labelled .editable a.show,
.labelled .editable input.text, .labelled .editable textarea {
  border: 1px solid #c3bf88;
  background-image: none;
  background-color: #fffdfb;
  color: #134b78;
}

.oneliner {
  white-space: nowrap;
  overflow: hidden;
}

.twoliner { overflow: hidden }
.twoliner span { white-space: nowrap }

.heading { font-weight: bold }
div.wrapper.heading { padding-bottom: 0.5em }

#tooltipdiv .oneliner { overflow: inherit }
#tooltipdiv .disabled { color: #999 }

.popover h2 { font-size: 120%; margin-bottom: 0.5em }
.popover p { margin-top: 0.5em }
.popover b { color: red }
.popover em { font-weight: bold }

.twobox { background-color: #fcfcfc }

.twobox div {
  float: left;
  margin: 1em 0.2em;
}

.twobox div.catlist { width: 45%; margin: 0.5em 0 }
.twobox select { width: 100%; height: 9em }
#truckselectbox.twobox select { height: 18em }
.twobox .source option { background-color: #fafafa }
.twobox .value option { background-color: white }
.twobox option { font-size: smaller }

.twobox.display { padding-left: 2em }

.detail label { padding-left: 20px; padding-right: 0.5em }

.missing { color: red; font-weight: bold }

.titlelink { position: relative; top: 1.2em; left: 1.5em }

div#siteflag {
  z-index: 100;
  top: 22px;
  right: 4px;
}

.enabledname { white-space: nowrap }
.disabledname { white-space: nowrap; text-decoration: line-through }



/*
 *  menu stuff
 */

#navigate {
  position: relative;
  overflow: visible;
  min-height: 40px;
  width: 100%;
  background-color: black;
  background-color: #eefff7; /* * */
  padding: 16px 0 0 240px;
  font-size: inherit;
}

#navigate a.tristate, #navigate a.tristate:hover { color: #777 }

#loggedin {
  position: absolute;
  z-index: 200;
  overflow: hidden;
  top: 0px;
  right: 5px;
  margin: 0;
  padding: 0;
  text-align: right;
}

#loggedin>div { display: inline-block }

#loggedin>div .optionmenu {
  display: none;
  border: 1px solid #357910;
  background-color: #f3ecda;
  text-align: left;
  color: black;
}

#loggedin>div:hover .optionmenu { display: block }

#loggedin .optionmenu a.tristate {
  display: block;
  padding: 0.1em 0.2em !important;
  color: #800e00;
}

#loggedin .optionmenu a.tristate span { margin-right: 0.3em }

#loggedin .optionmenu a.tristate:hover {
  background-color: #940400 !important;
  color: white;
}

#logolink { position: absolute; top: 0px; left: 0px }
#menu, .menu { font-size: 115% }
#xmenu { top: 20px; left: 250px }
#menu { display: inline-block; position: relative }
#menuoffset { height: 20px; top: 1.1em }
#menu .menubag { padding-top: 0.5em }
#menu #menu8h .menubag { width: 250px }
#menupad { top: -30px; left: -30px; height: 600px; width: 600px }

#menubar a, #menubar input.checkbox, .menu a {
  border: 1px solid #54537B;
}

#loggedin, #loggedin a,
#menubar a, #menubar label, #menubar input.checkbox, .menu a {
  color: #ccc;
  color: #777; /* * */
}

#menubar a:hover,
#menubar a.hover:link, #menubar a.hover:visited,
#menubar a.active:link, #menubar a.active:visited,
#menubar label:hover, .menu a:hover, .menu a:active, #menu a.menuactive,
#loggedin a:hover {
  background-color: #212039;
  background: #8a9 url("/common/resources/fade.up.black100.20px.png") repeat-x; /* * */
  color: white;
}

#menubar label { padding-left: 0.5em }

#secmenu {
  display: inline-block;
  margin: 10px 10px 10px 0;
  background: #930400 url("/common/resources/fade.down.white50.20px.png") repeat-x;
  padding: 5px;
  font-size: 100%;
  text-transform: uppercase;
}

.ie9 #secmenu { font-size: inherit }

#secmenu a { color: #ccc } /* * */

#secmenu a:hover {
  background-color: #212039; /* * */
  background-image: url("/common/resources/fade.down.white40.10px.png");
  background-repeat: repeat-x;
}

.menu a {
  margin: 0 5px 0 5px;
  border-color: transparent;
  padding: 2px;
  text-decoration: none;
}

.menu a.selected {
  border-color: #e99;
  background-image: url("/common/resources/white.20.png");
  color: #fff;
}

h1.secmenu, h2.secmenu, div.secmenu h2 {
  display: inline-block;
  margin-top: 0;
  padding-top: 0.6em;
}

div.secmenu h2 { padding-right: 1em }

div.secmenu a, div.secmenu a.tristate {
  text-decoration: none;
  border-bottom: none;
  color: #007e80;
}

#menu .menubag ul {
  background-color: #f3ecda;
}

#menu .menubag hr {
  color: #ffccc0;
  margin: 0.3em 0.5em 0.2em 0.5em;
}

#menu .menubag div {
  border-color: #357910;
}

#menu .menubag a {
  border-style: none;
  padding-bottom: 2px;
  background-color: #f3ecda;
  color: #800e00
}

#menu .menubag a:hover {
  background-color: #940400;
  color: white;
}

#navigate input, #menu select { width: 150px }
#navigate input[type=text] { width: 146px }
#navigate input[type=image] { width: auto; vertical-align: -6px; border: 1px solid #fff }
#navigate input[type=image].selected { border-color: #33f }
#navigate input[type=button] { width: 100px }
#navigate input[type=submit] { width: 100px }
#navigate input.formButton { width: 100px }


/*
 *  summary heading line
 */

.limitheading .editable a { overflow: visible }
.limitheading .editable a, .limitheading .editable.jobs a span { color: #a33 }
.limitheading .editable .edit { padding-right: 0 }
.limitheading .editable.edit div.buttons { bottom: -10px }
.limitheading .editable.edit div.buttons { opacity: 0.85 }
.limitheading .editable.jobs a span { font-size: inherit }


/*
 *  event category list
 */

#custselector a.category, #catselector a.category {
  display: inline-block;
  width: 16em;
  white-space: nowrap;
  overflow: hidden;
  border-style: solid !important;
  border-width: 1px 1px 1px 6px !important;
  border-color: #ccc;
  padding-left: 2px !important;
}

#custselector .buttons, #catselector .buttons { margin-bottom: 0.5em }


/*
 *  skill list
 */

#skillselector a.skill {
  display: inline-block;
  width: 16em;
  white-space: nowrap;
  overflow: hidden;
  border-style: solid !important;
  border-width: 1px !important;
  border-color: #ccc;
  padding-left: 2px !important;
}

#skillselector .buttons { margin-bottom: 0.5em }


/*
 *  event list
 */

#eventlist { width: 100% }
#eventlist tr.hidden { display: none }
#eventlist tr.hidden .editable { display: none }

#eventlist td, #eventlist th {
  font-size: 95%;
  white-space: nowrap;
  overflow: hidden;
}

#eventlist tr>th>img { padding: 0 0 0 2px }
#eventlist tr>td>img { padding: 2px 0 0 2px }

#eventlist td.haseditable.edit { overflow: visible }
#eventlist td.haseditable.show { overflow: hidden }

#eventlist th.sortable { cursor: pointer }

#eventlist tbody.jobwrap td { white-space: normal; overflow-x: auto }
#eventlist tbody.jobwrap td.nowrap { white-space: nowrap }
#eventlist thead th { background-color: black; color: white }
#eventlist thead th { background: #8a9 url("/common/resources/fade.up.black100.20px.png") repeat-x; color: white } /* * */

#eventlist td {
  background-color: inherit;
  background-image: url("/common/resources/tlcorner.png");
  background-position: top left;
  background-repeat: no-repeat;
}

#eventlist td.edit { overflow-x: visible }
#eventlist td.edit a[target=google] { display: none }

#eventlist td.flags span {
  display: inline-block;
  margin: 2px;
  padding: 0 2px;
  text-align: center;
  text-transform: uppercase;
  font-size: 7px;
  color: transparent !important;
}

#eventlist td.flags a {
  display: inline-block;
  width: 16px;
  height: 7px;
  margin: 0 2px;
  border-style: solid;
  border-color: #666;
  border-width: 0 1px 1px 1px;
  background: transparent url("/common/resources/white.20.png") top left repeat;
  padding: 0;
  text-align: center;
  text-transform: uppercase;
  font-size: 6px;
  line-height: 7px;
  color: transparent !important;
  cursor: pointer;
  text-decoration: none;
}

#eventlist td.flags a:first-child {
  margin-top: 1px;
  border-top-width: 1px;
  -moz-border-radius-topleft: 3px;
  -webkit-border-top-left-radius: 3px;
  -khtml-border-top-left-radius: 3px;
  border-top-left-radius: 3px;
  -moz-border-radius-topright: 2px;
  -webkit-border-top-right-radius: 2px;
  -khtml-border-top-right-radius: 2px;
  border-top-right-radius: 2px;
}

#eventlist td.flags a:last-child {
  -moz-border-radius-bottomleft: 2px;
  -webkit-border-bottom-left-radius: 2px;
  -khtml-border-bottom-left-radius: 2px;
  border-bottom-left-radius: 2px;
  -moz-border-radius-bottomright: 2px;
  -webkit-border-bottom-right-radius: 2px;
  -khtml-border-bottom-right-radius: 2px;
  border-bottom-right-radius: 2px;
}

span.flag {
  display: inline-block;
  padding: 1px 2px;
  text-transform: uppercase;
  font-size: 7px;
  color: black !important;
}

#eventlist td.flags a { height: 2em }
#eventlist td.flags a.selected, #eventlist td.flags span.selected { color: black !important }
#eventlist td.flags a.new.selected, #eventlist td.flags span.new.selected, span.flag.new { background-color: green !important; color: white !important }
#eventlist td.flags a.tbc.selected, #eventlist td.flags span.tbc.selected, span.flag.tbc { background-color: yellow !important }
#eventlist td.flags a.sub.selected, #eventlist td.flags span.sub.selected, span.flag.sub { background-color: red !important; xcolor: white !important }
#eventlist td.flags a.roc.selected, #eventlist td.flags span.roc.selected, span.flag.roc { background-color: blue !important; color: white !important }

#eventlist td a:before {
  content: " ";
}

#eventlist td > div.editable a:before {
  content: " ";
}

/* #eventlist td.haseditable {
  background-image: url("/common/resources/tlcorner.edit.png");
  padding-left: 12px;
} */

#xeventlist td.haseditable .editable a:before {
  content: url("/common/resources/tlcorner.edit.png");
  content: " ";
}

#eventlist .editable.edit { width: 100% }

#eventlist .editable a span { font-size: inherit; color: #c00 }

.dateranger img { vertical-align: bottom }

#picked {
  margin: 1em 0 0.5em 0;
  border: 1px solid #700;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  -khtml-border-radius: 2px;
  border-radius: 2px;
  padding: 0.3em 0.6em;
}


/*
 *  job header bar
 */

#jobtopform { font-size: 120%; margin: 0.5em -1px 0 -1px; border: 1px outset #aaa }
#jobtopform { font-size: 120%; margin: -1px -1px 0 -1px; border: 1px outset #aaa }
#jobtopform .editable { overflow: visible; width: 100% }
#jobtopform .editable.two.column { width: 50% }
#jobtopform .editable .edit { font-size: 0.79em }
#jobtopform .editable.textarea .edit { width: 65% }
#jobtopform a { text-decoration: none }
#jobtopform span.link { font-size: smaller; opacity: 0.75 }
#jobtopform .editable a.show:hover, #jobtopform a#jobtoptrucks:hover, #jobtopform a:hover span.link {  color: black !important }
.jobtabhead .editable a.show:hover, .jobtabhead a#jobtoptrucks:hover, .jobtabhead a:hover span.link {  color: black !important }
#jobtopform a:hover { opacity: 0.75 }
#jobtopform a:hover span.link { color: black }
.jobtabhead a:hover span.link { color: black }
.jobtabhead .editable a.show:hover span { color: black !important }
#jobtopform .editable a.show span, #jobtopform span.link { color: #666 }
#jobtopform .blob { white-space: nowrap }
#jobtopform .blob:before { display: inline; content: "• "; opacity: 0.75; font-size: medium !important }
#jobtopaddress1 { display: none }
a.linklink { font-size: smaller }

#jobtopform a.closed:hover, #jobtopform a.opened:hover {
  background-position: top left;
  background-repeat: no-repeat;
  color: inherit;
}

#jobtopform a.closed:hover { background-image: url("/common/resources/openbox.png") }
#jobtopform a.opened:hover { background-image: url("/common/resources/closebox.png") }


/*
 *  job general
 */

span.mediapulse { font-style: italic }

div.stagetitle {
  box-sizing: border-box;
  font-weight: bold;
  white-space: nowrap;
  border-right: 2px solid transparent;
  overflow: hidden;
}

div.stagetitle+div.stagetitle {
  padding-left: 2px;
  border-right-width: 0;
}

div.jobstage { height: 1.6em; margin: 0 2px }
.contextmenu.jobstage a.greyed { display: block; color: #0b0 }

div.stagetitle+div.stagetitle, #calendar>.wrapper>div.column+div.column {
  border-left: 1px solid #f3f3f3;
}

#calendar>.wrapper.even>div.column+div.column { border-left: 1px solid #e3e3e3 }


/*
 *  job crew
 */

th.jobday div, .xdayhead { position: relative; height: 100%; width: 100% }
th.jobday div div, .xdayhead div { position: absolute; top: 0; left: 0; width: 100% }
th.jobday div span, .xdayhead span { position: relative; display: block; z-index: 1000 }

.icon.toleft+* { margin-left: 0.5em }
.icon.toleft+.icon.toleft { margin-left: 0 }
.icon.toright { margin-left: 0.5em; margin-right: 1em }

h2 .jobdata {
  display: inline-block;
  padding: 0.3em 0.4em;
  font-weight: normal;
  color: black;
}

.addcrewsearch thead th { background-image: url("/common/resources/white.70.png") }
/* .addcrewsearch thead th.wrap { color: #eee }
.addcrewsearch thead.results th { background-image: none }
.addcrewsearch thead.results th.wrap { color: #baa } */
.addcrewsearch div.wrap { color: #eee }
.addcrewsearch .results div { background-image: none }
.addcrewsearch .results div.wrap { color: #baa }

.crewpicker { width: 100%; padding-top: 2px; xborder: 2px solid black; box-sizing: border-box }
.crewpicker .resultbusy { overflow: auto }
.crewpicker .hscroll { overflow: auto; box-sizing: border-box; white-space: nowrap }
.crewpicker .hscroll .headline { white-space: auto; width: 100%; box-sizing: border-box }
.crewpicker .hscroll .daycol span { white-space: normal }
.crewpicker .headline.namecol { background: black url("/common/resources/white.70.png"); border-right: 1px solid white; box-sizing: border-box }
.crewpicker .daycol { display: inline-block; border-left: 1px solid #ccc; box-sizing: border-box }
.crewpicker .headline .daycol { background: black url("/common/resources/white.70.png"); vertical-align: top; box-sizing: border-box }
.crewpicker .headline .daycol div div { position: absolute; width: 100% }
.crewpicker .headline .daycol div span { position: relative; display: block; z-index: 1000; color: white }
.crewpicker .headline .namecol a { color: white }
.crewpicker .resultbody { width: 100%; box-sizing: border-box; overflow: auto }
.crewpicker .resultnames { width: 20%; float: left; xborder: 4px solid red !important; box-sizing: border-box }
.crewpicker .resultnames .namecol { width: 100% }
.crewpicker .resultnames .namecol img { vertical-align: top }
.Xcrewpicker .resultbusy { xwidth: 80%; float: left; box-sizing: border-box }
.crewpicker .daycol { position: relative; display: inline-block; min-width: 30px; box-sizing: border-box }
.crewpicker .column>div.hscroll { margin-right: 0 }

.moreroles { display: inline-block; position: relative }
.moreroles > a { text-decoration: none; font-weight: bold; font-size: larger }
th .moreroles > a { color: white }
td .moreroles > a { color: black }

.moreroles .list {
  position: absolute;
  top: -1px;
  left: 0;
  background-color: white;
  padding-right: 16px;
}

.moreroles .list button { position: absolute; top: 1px; right: 1px }
.moreroles .suggest { width: 100% }

.addcrewsearch .scrolling { height: 400px }
.addcrewsearch .crew.column { position: relative; border: 1px solid #eee }
.addcrewsearch .crew.column h3 { position: absolute; top: -20px; margin: 0 }
.addcrewsearch .crew.column>div { padding: 0 2px }

.popover div.query { margin-top: 0.5em }

a.tristate.daylist {
  border-bottom-width: 2px !important;
  border-bottom-style: solid !important;
  padding-bottom: 2px !important;
}


/*
 *  job templates
 */

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

/* div.template + div.template { */
div#templates > div.template {
  margin-top: 0.7em;
  border-top: 1px solid #999;
  padding-top: 0.3em;
}

span.counter.value input.text { font-weight: bold }
span.counter.zero input.text { color: #999 }

div.loading {
  display: inline-block;
  padding: 0.5em 20px 0.5em 0;
  font-size: larger;
}


/*
 *  crew calendar
 */

div.freelancercalendar {
  overflow: hidden;
  box-sizing: border-box;
  width: 100%;
  font-size: 95%;
}

div.freelancercalendar.closed .month { width: 100%; max-width: 150em }
div.freelancercalendar.opened .month { width: 66.66%; float: left }
div.freelancercalendar.closed .jobs { display: none }
div.freelancercalendar.opened .jobs { width: 33.33%; float: left }

div.freelancercalendar .jobs {
  max-height: 65em;
  overflow: auto;
}

div.freelancercalendar .jobs>div { margin: 1px 0; border: 1px outset #ccc }
div.freelancercalendar .jobs>div.highlighted { border-style: inset }

div.freelancercalendar .jobs>div.highlighted,
div.freelancercalendar .jobs>div.highlighted .jobstate {
  background-image: url("/common/resources/white.50.png");
}

div.freelancercalendar .jobs>div a { display: inline-block; margin: 1px 0; padding: 1px 2px }

/*
div.freelancercalendar .jobs table { border-spacing: 0 1px }
div.freelancercalendar .jobs td { border: 1px outset #ccc }
div.freelancercalendar .jobs tr.highlighted td { border-style: inset }

div.freelancercalendar .jobs tr.highlighted {
  background-image: url("/common/resources/white.50.png");
}
*/

table.freelancercalendar { width: 100% }

table.freelancercalendar .faded {
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=25)"; /* IE8 native */
  filter: alpha(opacity=25); /* IE5-7 and IE8 in IE7 mode (must be in this order!) */
} /* IE/Win */

table.freelancercalendar .faded {
  -moz-opacity: 0.25;
  -khtml-opacity: 0.25;
  opacity: 0.25;
}

table.freelancercalendar .faded:hover {
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=75)"; /* IE8 native */
  filter: alpha(opacity=75); /* IE5-7 and IE8 in IE7 mode (must be in this order!) */
} /* IE/Win */

table.freelancercalendar .faded:hover {
  -moz-opacity: 0.75;
  -khtml-opacity: 0.75;
  opacity: 0.75;
}

table.freelancercalendar td { position: relative; border: 1px solid #ccc }
table.freelancercalendar td.day { border-color: #333 }

table.freelancercalendar div.holidaybox {
  position: relative;
  border-top: 1px solid #ccc;
  background-color: white;
  text-transform: uppercase;
  text-align: right;
  font-size: smaller;
  font-weight: bold;
}

table.freelancercalendar td.today { background-color: #fff8aa }

table.freelancercalendar td .daybar {
  background-color: #e6e6e6;
  padding-bottom: 2px;
  white-space: nowrap;
  font-size: 140%;
  color: #c00;
}

table.freelancercalendar td.today,
table.freelancercalendar td.today.available, table.freelancercalendar td.today.busy {
  background-color: #fff8aa !important;
}

table.freelancercalendar .weekhead { min-height: 9em }
span.iconbar { display: inline-block; position: absolute; top: 2px; right: 0 }

table.freelancercalendar td .statebox {
  border: 2px solid red;
  background-color: white;
  line-height: 1.5em;
  font-size: 100%;
  text-transform: uppercase;
  white-space: nowrap;
}

table.freelancercalendar td .statebox.available { display: none }

table.freelancercalendar td .statebox .notes {
  font-size: smaller;
  text-transform: none;
}

table.freelancercalendar td .statebox + * { margin-top: 2px }

table.freelancercalendar td .statebox div {
  background: transparent url("/common/resources/white.50.png");
}

table.freelancercalendar td .statebox:hover div { background-image: none }
table.freelancercalendar td .statebox a { text-decoration: none }

table.freelancercalendar a.statebox { display: block; text-decoration: none }
table.freelancercalendar a.statebox:hover { background-color: transparent }

table.freelancercalendar .editable.cropped { height: auto; max-height: 6em }
table.freelancercalendar .editable.cropped.show { white-space: normal }
table.freelancercalendar .editable.cropped.edit { height: 6em }

#jobnotes.month.notesyes .notes.door { display: block }
#jobnotes.month.notesno .notes.door { display: none }

#tooltipdiv .padded.wrapper { padding: 3px 4px }

table.freelancercalendar td .statebox.unavailable,
#tooltipdiv .unavailable, .conflict .unavailable {
  background-color: #f3e8ff;
  color: #704;
}

table.freelancercalendar td .statebox.holiday,
#tooltipdiv .holiday, .conflict .holiday {
  background-color: #fff1dd;
  color: #630;
}

table.freelancercalendar td .statebox.baseday,
#tooltipdiv .baseday, .conflict .baseday {
  background-color: #e0e3ff;
  color: #45d;
}

table.freelancercalendar td .statebox.dayoff,
#tooltipdiv .dayoff, .conflict .dayoff {
  background-color: #ffd8e0;
  color: #700;
}

table.freelancercalendar td .statebox.inlieu,
#tooltipdiv .inlieu, .conflict .inlieu {
  background-color: #ffd8e0;
  color: #700;
}

table.freelancercalendar td .statebox.homeworking {
  border-color: #9ee89e;
  background-color: #d7e8d7;
  color: #050;
}

table.freelancercalendar td .statebox.available {
  border-color: #9ee89e;
  background-color: #d7e8d7;
  color: #050;
}

table.freelancercalendar td .statebox.job {
  border-width: 2px;
  border-color: #ccc;
  font-weight: normal;
  color: black;
}

table.freelancercalendar td .statebox.job + .statebox.job { margin-top: 0 }

/*
 *  split data area
 */

#splitdata {
  position: relative; /* needed for fixed rightdata to work correctly in IE8 */
  padding-right: 10px;
}

#splitdata #leftdata {
  margin-right: 34%;
  padding-right: 20px;
}

#splitdata #rightdata {
  position: fixed;
  z-index: 1010;
  top: 20em;
  right: 10px;
  width: 33%;
  border: 1px solid #bebebe;
  -moz-border-radius-topleft: 4px;
  -webkit-border-top-left-radius: 4px;
  -khtml-border-top-left-radius: 4px;
  border-top-left-radius: 4px;
  background-color: white;
  padding: 5px;
}

#splitdata .tablayout > a { vertical-align: text-bottom }

#splitdata.hide #rightdata {
  -moz-border-radius-bottomleft: 4px;
  -webkit-border-bottom-left-radius: 4px;
  -khtml-border-bottom-left-radius: 4px;
  border-bottom-left-radius: 4px;
}

#splitdata #rightdata .header {
  position: absolute;
  top: 0;
  right: 10px;
  padding-top: 4px;
}

#splitdata #rightdata .header a, a.header { text-decoration: none; color: black }
#splitdata #rightdata .header a { position: relative; z-index: 100 }
#splitdata #rightdata .header a img, a.header img { vertical-align: bottom }
#splitdata #rightdata .header a img { position: relative; top: -4px; vertical-align: top }

#splitdata #rightdata .header a.pause, #splitdata #rightdata .header a.resume {
  display: inline-block;
  height: 8px;
  width: 8px;
  vertical-align: middle;
  background-image: url("/common/resources/transport.8.png");
  background-repeat: no-repeat;
}

#splitdata #rightdata .header a.pause:hover,
#splitdata #rightdata .header a.resume:hover { background-color: transparent }

#splitdata #rightdata .header a.pause        { background-position:  0px  0px }
#splitdata #rightdata .header a.pause:hover  { background-position: -8px  0px }
#splitdata #rightdata .header a.resume       { background-position:  0px -8px }
#splitdata #rightdata .header a.resume:hover { background-position: -8px -8px }

#splitdata.hide #leftdata { /* width: 95% */ width: 100% }

#splitdata.hide #rightdata {
/*  width: 5%; */
  width: auto;
  height: auto !important;
}

#splitdata.hide #rightdata.content, #splitdata.hide #rightdata .tablayout,
#splitdata.hide #rightdata .header {
  display: none;
}

#splitdata #rightdata .restore { display: none }
#splitdata.hide #rightdata .restore { display: inherit }


/*
 *  sidebar content
 */

div.sidebar {
  height: 100%;
  overflow: auto;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
}

div.sidebar .jobline { white-space: nowrap; overflow-x: hidden }

div.sidebar .jobstate {
  position: absolute;
  top: 0;
  right: 0;
  height: 1.5em;
  padding-left: 16px;
}

div.sidebar.jobwrap .jobline { white-space: normal; overflow-x: auto }
div.sidebar.jobwrap .jobstate { position: static; float: right }

div.sidebar a {
  display: block;
  margin: 2px 4px 2px 0;
  border: 1px outset #aaa;
  padding: 2px;
  font-size: smaller;
  color: black;
  text-decoration: none;
  line-height: 1.4em;
}

div.sidebar a:hover {
  border-style: inset;
  background-image: url("/common/resources/white.70.png") !important;
  color: black !important;
}

div.sidebar a.selected {
  border-width: 2px 2px 2px 7px;
  border-style: inset;
  background-image: url("/common/resources/white.50.png");
  color: black !important;
}

div.jobline a.otherjob {
  background-image: url("/common/resources/white.20.png");
  backround-position: top left;
  background-repeat: repeat;
}


/* #splitdata #rightdata > div > div.tab (layout) > div.sidebar (main)
 */

/*
 *  main search results popover
 */

#mainsearchform {
  display: inline-block;
  color: white;
  padding-bottom: 4px;
}

#mainsearchform input { background-color: white; color: #333 }

#mainsearchresults { width: 80% }

#mainsearchresults div.results {
  max-height: 500px;
  overflow: auto;
}

#mainsearchresults div.results img { vertical-align: bottom }

#mainsearchresults div.results div.searchhead {
  margin: 0.5em 0 0.1em 0;
  border-bottom: 1px solid #999;
  background-color: transparent;
  color: #007e80;
}

#mainsearchresults div.results div.wrapper {
  padding: 2px 0;
}

#mainsearchresults a { color: black }
#mainsearchresults .found, #mainsearchresults a.found, #tooltipdiv .found { color: #c70 }
#mainsearchresults .deleted { text-decoration: line-through }

#mainsearchresults a:hover {
  background-color: #ddd;
}


/*
 *  freelancer report
 */

#crewevents { position: relative; margin-top: 1em; margin-left: 252px; font-size: 80% }
#crewevents .popover { font-size: inherit }
#crewevents .editable input.button { font-size: 100% }

#crewlist {
  position: fixed;
  z-index: 1000;
  top: 130px;
  left: 20px;
  width: 250px;
  overflow: auto;
  border: 1px solid #ccc;
  background-color: white;
}

#crewshim {
  position: fixed;
  z-index: 1000;
  top: 130px;
  left: 0;
  width: 20px;
  background: transparent url("/common/resources/fade.left.white100.10px.png") right top repeat-y;
}

.crewevent { margin: 2px 0 2px 2px; border: 1px outset #aaa }
.crewevent.selected { border-style: inset }
.crewevent.hidden { display: none }

.crewevent.selected, .crewevent.selected a {
  background-image: url("/common/resources/white.70.png");
  color: black !important;
}

.crewevent a {
  display: block;
  text-decoration: none;
}

.crewevent a:hover {
  background-image: url("/common/resources/white.20.png");
  background-color: inherit;
  color: #004080 !important;
}

.crewevent.selected a:hover {
  background-image: url("/common/resources/white.50.png");
}

.jobtab {
  float: left;
  border: 1px solid white;
  background-color: white;
  padding: 2px;
}

.jobtab.hidden, .jobtab.deselected { display: none }

.jobtab .subhead { cursor: pointer }

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

.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 .dayhead { position: relative }
.jobtab .dayhead div { position: absolute; left: 0; width: 100% }
.jobtab .dayhead span { display: inline-block; position: relative; z-index: 10 }

.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 }

.jobtab .dayhead div.rotate {
  position: relative;
  top: 63px;
  left: 1px;
  -webkit-transform: rotate(270deg);	
  -moz-transform: rotate(270deg);
  -o-transform: rotate(270deg);
  -ms-transform: rotate(270deg);
  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; text-decoration: none }

span.elsewhere { display: block; clear: both; overflow: hidden }
span.elsewhere img { float: left }

a.tristate.elsewhere:link, a.tristate.elsewhere:visited, a.tristate.elsewhere:hover,
a.tristate.elsewhere:active, span.tristate.elsewhere {
  border-style: solid !important;
  border-width: 1px !important;
  border-color: red black black red;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  -khtml-border-radius: 2px;
  border-radius: 2px;
}


/*
 *  audit log window
 */

body.auditlog h2 { margin: 0.1em 0 0.7em 0 }
body.auditlog h2 a { text-decoration: none; color: #007e80 }
body.auditlog #topbar h2 { color: #c70803 }

body.auditlog #updated {
  position: absolute;
  z-index: 100000;
  top: 20px;
  right: 20px;
  color: #c70803;
  font-size: 120%;
}


/*
 *  truck list
 */

span.taglist { display: inline-block; width: 10em }

#fieldaddtype.editable a.show span {
  font-size: inherit;
  color: #007e80;
}


/*
 *  location list
 */

#locationsform { position: relative; border: 1px solid transparent }

#locationhead {
  position: fixed;
  top: auto;
  left: 22px;
  right: 22px;
  width: auto;
  background: transparent url("/common/resources/white.75.png") top left repeat;
}

#locationhead input.text { background-color: white }
#locationhead a.tristate { white-space: nowrap }

#locationhead .four.column > * {
  background: url("/common/resources/white.50.png") top left repeat;
}

#locationbody { margin-top: 17.5em }

.location { height: 1.5em }

.column>.cathead, .column>.catbody {
  margin-right: 0;
  white-space: nowrap;
}

.column>.cathead {
  height: 16em;
}

.cathead>div, .catbody>div {
  border: 1px solid white;
  text-align: center;
  box-sizing: border-box;
  min-width: 2em;
}

.cathead>div {
  position: relative;
  height: 16em;
  background: url("/common/resources/white.20.png") top left repeat;
}

.catbody>div {
  height: 1.5em;
}

.catbody.odd>div  { background: url("/common/resources/white.90.png") top left repeat }
.catbody.even>div { background: url("/common/resources/white.75.png") top left repeat }

.cathead>div>div:first-child {
  display: inline-block;
  width: 1em;
  position: relative;
  top: 12em;
  left: 4px;
  -webkit-transform: rotate(270deg);	
  -moz-transform: rotate(270deg);
  -o-transform: rotate(270deg);
  -ms-transform: rotate(270deg);
  transform: rotate(270deg);
  white-space: nowrap;
}

.cathead>div>div+div {
  position: absolute;
  bottom: 4px;
  left: 0;
  width: 100%;
}

.cathead>div>div+div>div {
  display: inline-block;
  background: url("/common/resources/white.70.png") top left repeat;
}

.popoverform { min-width: 350px }

.popoverform h2.titlebar {
  font-size: 120%;
  margin-bottom: 0.5em;
}

.beingedited { border: 1px solid #ffa500 }
.odd .beingedited { background-color: #fff6e6 }
.even .beingedited { background-color: #faf0e0 }


/*
 *  skills and roles
 */

.skillbox {
  border: 1px solid #ca9;
  background-color: #fff7f0;
  padding: 2px;
}

.crewmenu input.button {
  position: relative;
  top: -2px;
  width: 8em;
  margin-left: 1em;
  text-align: center;
  cursor: pointer;
}

.vaped, .vaped a { color: #999 !important }


/*
 *  edit person
 */

#c2 div.deleted {
  margin: 2em 1em;
  border: 1px solid red;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  -khtml-border-radius: 3px;
  border-radius: 3px;
  padding: 0.5em 1em;
  font-weight: bold;
}

.vnumberbox+div {
  float: left;
  overflow: hidden;
  box-sizing: border-box;
  margin: 0.5em 0 0.5em 16px;
  border: 1px solid #999;
  padding: 0.2em 0.5em;
}

.vnumberbox+div { padding: 0.5em 0 }
.vnumberbox+div+* { clear: left }
.vnumberbox+div>div>div { width: 10em }
.vnumberbox+div .editable label { display: inline-block; width: 30%; margin-top: 0 }
.vnumberbox+div .editable .edit ,edit { width: 50% }
.vnumberbox+div select { margin: 0.5em 0.5em 0 0; float: right }

/*
 *  calendar grid
 */

body.hasheader.crewgrid #topbar .fade { height: 2.5em; padding-top: 0 }
body.crewgrid #content { padding: 4.2em 0 0 0; border-top: none }

#gridhead {
  position: relative;
  top: 10px;
  border: 1px solid #bebebe;
  background: transparent url("/common/resources/white.90.png") repeat;
}

#gridhead, #gridhead a.tristate { font-style: italic }
#gridhead .tag { font-weight: bold; font-style: normal }
#gridhead>div:first-child { height: 1.7em }

#gridoptions blockquote {
  border-width: 1px;
  border-style: solid;
  border-color: #999 #ddd #ddd #999;
  padding: 0.5em 1em;
}

div.departmentname {
  border-style: none;
  padding-bottom: 2px;
  background: #940400 url("/common/resources/fade.down.black25.20px.png") repeat-x;
  color: white;
  opacity: 0.65;
}

div.departmentname a.tristate { color: white; opacity: 0.5 }
div.departmentname a.tristate:hover { opacity: 1 }

div.gridrow {
  overflow: hidden;
  box-sizing: border-box;
  width: 100%;
}

div.gridrow>div { height: 1.3em !important }
div.gridrow.rows2>div:first-child { height: 2.6em !important }
div.gridrow.rows3>div:first-child { height: 3.9em !important }
div.gridrow.rows4>div:first-child { height: 5.2em !important }
div.gridrow.rows5>div:first-child { height: 6.5em !important }

#content div.gridrow.odd, #content div.gridrow.even { border-top: 1px solid #dcc }
#content div.gridrow:hover { background-color: #edd }

div.gridrow>div {
  position: relative;
  float: left;
  border-left: 1px solid #dcc;
  box-sizing: border-box;
  text-align: center;
  white-space: nowrap;
}

body.highlight_travel div.gridrow>div.travel {
  background-image: url("/common/resources/fade.up.grey100.20px.png");
  background-position: bottom left;
  background-repeat: repeat-x;
}

body.highlight_baseprep div.gridrow>div.baseprep {
  background-image: url("/common/resources/fade.down.white100.20-10px.png");
  background-position: top left;
  background-repeat: repeat-x;
}

div.gridrow>div.cont { border-left: none }

div.gridrow>div:first-child {
  width: 16.3%;
  border-left: none;
  padding: 0 4px;
  text-align: left;
}

#gridhead div.gridrow>div:first-child+div { border-left: none }

form>div.gridrow>div:first-child { padding: 0; overflow: hidden }

form>div.gridrow>div:first-child input {
  box-sizing: border-box;
  margin-right: -1px;
  border-width: 1px 1px 0 0;
  border-color: #bebebe;
  background-color: white;
  width: 100%;
}

div.gridrow>div.we, div.gridrow>div.bh {
  background-image: url("/common/resources/fade.right.black25.20px.png");
  background-repeat: repeat-y;
}

div.gridrow>div.we.nojob { background-color: #ddd }
div.gridrow>div.bh.nojob { background-color: #edd }

div.gridrow>div>span.av {
  position: absolute;
  top: 1px;
  left: 0;
  display: block;
  box-sizing: border-box;
  height: 1.5em;
  border: 1px solid red;
  border-radius: 2px;
  background: transparent url("/common/resources/white.70.png") top left repeat;
  opacity: 0.7;
  line-height: 110%;
  color: black;
  font-size: smaller;
  text-transform: uppercase;
  overflow: hidden;
  z-index: 10001;
}

div.gridrow>div>span.av.available { border-color: green }

div.gridrow>div.grid {
  height: 1.4em;
  border-style: solid;
  border-width: 2px 0;
  border-color: transparent;
}

div.gridrow>div>div.gridlabel {
  position: absolute;
  top: -2px;
  left: 0;
  z-index: 10000;
  opacity: 0.85;
}

div.gridrow>div>div.gridlabel>div {
  display: none;
  width: 100%;
  text-align: left;
  white-space: nowrap;
  overflow: hidden;
}

body.category div.gridrow>div>div.gridlabel>div.category,
body.name div.gridrow>div>div.gridlabel>div.name,
body.location div.gridrow>div>div.gridlabel>div.location { display: block }

#gridlabel { position: relative; top: -4px }

xdiv.gridav { 
  border-color: #c00;
  background-color: #f99;
}

div.gridav.available { 
  border-color: #0a0;
  background-color: #8e8;
}