/* BSLBeam Bulletin Board Main Stylesheet /*

/**
 * Body
 *
 */

* {margin: 0px 0px 1px 0px; padding: 0;}

li {list-style: none outside none;}
ul {list-style: none outside none; margin: 0px;}

body {
  font-family: Arial,Helvetica,sans-serif;
  margin-left: 1px;
  padding:1px;
  border:0;			/* Removes border around viewport in old versions of IE */
  background:#fff;
  font-size:90%;
}

input, select {box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}

#hamburger {position: absolute; display: none; float: left; text-align: center; padding: 3px 3px 0px 3px; cursor: pointer; cursor: hand; margin: 0px 1px 1px 0px; width: 2.3em; height: 2.2em; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}
#hamburger img {width: 1.8em; height: 1.8em; margin: 0px;}

#mainLayout {width: 100%;}

div#leftBar {
  float: left;
  width: 10.1em;
  border: none;
  margin: 0;
}

div.nonMenu {
  margin-left: 10.2em;
  margin-right: 0px;
  border: 0px;
}

div.noMargin {margin: 0px}
div.noPadding {padding: 0px}
div.endColumns {height: 1px;}

.beam-info-para {background-color: white;}
.beam-info-para blockquote {margin-left: 3em;}

.ui-dialog-buttonpane {border-top: 0px !important; padding-top: 0px !important; padding-bottom: 0px !important; margin: 0px !important;}

.btnNext {cursor: pointer; cursor: hand; font-weight: normal; float: right; padding: 0.02em 0.5em; margin-left: 10px; margin-top: -1px; background: #60E222;}
.clear-width {clear: both !important; width: auto !important;}

.one-em-image {float: left; height: 1em; padding: 2px;}
/***********
* Sections
************/
/* #SectionTitle {margin: 0px 0px 1px 0px;} */
.pagetitle, .beam-section-header {min-height: 38px;box-sizing: border-box;font-size: 18pt !important;padding: 0.15em 1px 0.15em 5px !important;clear: both;}
/*.pagetitle span:first-child {float: left;}*/
.beam-subsection-header {margin: 0px 0px 1px 0px; height: auto; padding: 2px 2px 2px 4px; float: none !important;}
.ui-widget-content {padding: 5px 5px 5px 5px;}

.beam-icon {margin-top: 0px !important;}

/***********
* Title
************/
.startIcon {margin-left: 20px; width: 20px; height: 1em; float: left;} /*use in a span around the icon*/
.indent20 {margin-left: 20px; float: left; clear: both;}
.infoIcon {cursor: pointer; cursor: hand; width: 28px; height: 28px;}
.infoIcon img {width: 28px; height: 28px;}
/****************
 * Forms
****************/
.inputMissing {border: 3px solid red; background: #FFE0E0;}

/**
 * Banners
 *
**/
div.banner p {font-size: 24pt; margin: 6px;}
div.bottomBanner {font-size: 10pt;margin: 0px;clear: both;float: left;z-index: 0;width: 100%;box-sizing: border-box;}

/**
 * Menu
 *
**/
div.menu {margin: 1px;}
div.menu li{margin-top: 2px; margin-bottom: 0px; cursor: pointer !important; cursor: hand !important;}
li.menu-top-level {margin-top: 0px;}
div.menu div a {text-decoration: none; padding-left: 20px;}
div.menu div li {text-decoration: none; padding-left: 20px;}
.beam-menu-subitem li{border: 1px solid transparent;}
div.menu div {margin-top: -1px;}
.beam-menuitem-hidden {display: none;}
#menu a div {width: 134px;}
.ui-menu li.ui-menu-item {display:inherit;}  /* Fixes spacing bug in jQuery menu with Chrome and Vivaldi browsers */

/**
 * Quotes
 *
 **/

blockquote {width: 80%;}
blockquote.ol

/**
 * Profile
 *
 **/

#Profile .label {width: 300px; float: left;}
#Profile .btnNext {display: none;}
/* #profileForm .item, #profileGeneral div {min-width: 530px; width: 600px;} */
.profileTitle {float: left;}
#profileGeneral >div >div {clear: both;}
#profileGeneral div div:first-of-type {width: 8em; float: left;}
#workRegions div:first-of-type {width: 1em;float: none !important;}
#profileGeneral div div.profileRegionLabels {float: left; width: 20px; min-width: 20px; margin-left: 37px;}
#profileGeneral #profileTemplates div {width: 118px; min-width: 100px; float: left; clear: both;}
#profileTemplates select {float: left;}
.regionRadio {margin-left: 0px; margin-right: 40px;}
#profileUsers div div div {float: left; cursor: pointer; cursor: hand; box-sizing: border-box;}
#inactive-users-header {height: 1.7em; margin-bottom: 2px;}
#profileContacts div div {width: 6em; float: left;}
.contact-value {float: left;}
.contact-delete {margin-top: 1px; margin-left: 2px; float: right;}
#profileContacts input, #profileContacts textarea {width: 248px;}
#profilePayment {width: 440px;}
#profilePayment div div {width: 150px; float: left;}
#profilePayment input, #profilePayment textarea {width: 248px;}
.payment-label {clear: both;}

#profileATW div {width: 29.5em;}
#profileATW label {float:left;}
#profileATW div div {width: 160px; float: left;}
#profileATW div input[type=text], #profileATW div select {max-width: 18em;}
#profileQualifications #Regs, #profileGeneral #workRegions {width: auto; float: none; clear: both;}
#profileQualifications #Regs div {margin-left: 8em; clear: both;}
#profileQualifications #Regs label, #profileGeneral #workRegions label {display:block;max-width:370px;float: left;}
#profileQualifications #Regs input, #profileGeneral #workRegions input {float:left;display:block;margin:3px 7px 0 0;padding:0;width:13px;height:13px;}
#profileQualifications .qual:first-child {width: 150px; float: left;}
#profileQualifications .qual-long:first-child {float: left;}
.qual-group-values {border-color: transparent;margin-left: 2px;background-color: transparent;overflow: hidden;}
.qual-delete {float: right; cursor: pointer; cursor: hand;}
#LSPDetailsShown {clear: both; width: auto !important;}

#profileFilters .label {float:left; width: 10em;}
/**
 * Table
 *
 */
table th {text-align: left;}

#MonthTabs {margin: 0px 1px 0px 0px; padding: 0px; border: none;}
.ui-tabs-nav {padding-left: 16px !important;}
.ui-tabs-tab {border-radius: 10px 10px 0px 0px; margin-left: -16px !important;}
.ui-tabs-anchor {padding: .3em 1em;}
#MonthTabs .ui-tabs-panel {margin: -2px 0px 0px 0px; padding: 0px; border: 0px;}
#MonthTabs .ui-tabs-panel ul {margin: 0px; padding: 1px;}
#MonthTabs .month >li {clear: both;}
#MonthTabs .month, #MonthTabs .month > li {margin-right: 0px;}
#MonthTabs .ui-tabs-anchor {padding: .3em 1em; cursor: pointer; cursor: hand;}
.year-tab {background: #E0E0E0 !important;}

/* Double child tabs */
#tabs > div {padding: 0px;}

.month-row {cursor:pointer; cursor:hand; position: relative}

div.filled, li.filled, ul.filled {background:#77FF77;}
div.overFilled, li.overFilled, ul.overFilled {background:red;}
div.notFilled, li.notFilled, ul.notFilled, td.notFilled, th.notFilled {background: #f5f9fd;}
div.beamLoading {background: #85c1ff; margin-top: 3px;} 
div.notApproved, li.notApproved, ul.notApproved {background: lightblue;}
div.notLive, li.notLive, ul.notLive {background: silver;}
div.notSubmitted, li.notSubmitted, ul.notSubmitted {opacity: 0.2; background: #E0E0E0;}
div.rowChanged, div.rowChanged div, li.rowChanged, ul.rowChanged li {background: rgb(249, 173, 123) !important;}
div.fullRow {float: left; width: 100%;}
.ui-datepicker {z-index: 9999 !important;}
.DatePicker {float: left;}

/*Bulletin Board widths (main bb and edit item*/
.month > div > div > div {padding: 0px; float: left; overflow: hidden; }
.agency-wrapmiddle {float: left; width: 100%; margin: 0px;}
.agency-middle {margin-right:414px; margin-left:12em;}
.agency-left {float: left; width: 12em; margin-left: -100%;}
.agency-right {float: left; width: 412px; margin-left: -412px;}

.month .date {width: 13%; min-width: 8em;}
.month .start {width: 10%;}
.month .end {width: 10%;}
.month .id {width: 4em;}
.month .summary {width: 100%; word-break: break-word;}
.month .LSPs {width: 100%;}
.month .LSPsTypes {width: 45%;}
.month .agent {width: 100%;/* margin-left: 7em; */position: relative;}
.month .agent-data {float: left; padding-right: 1.3em;}
.month .bookings {width: 100%; position: relative;/* margin-left: 7em; */}
.month .commentsIcon {float: left;}
.month .field {float: left; padding-right: 1.3em;}
.month .reminders:empty {padding: 0px !important;}
.month .Fields {padding-left: 0; float: left; clear: both;}
.fields-col-4 {min-height: 1.5em;}
.month .fields-col-6 {clear: none;}
.month .field >div {float: left; padding-left: 3px;}
.month .field >div:first-child {padding-left: 0px;}
.month .summaryIcons {clear: both; float: left;}
.month .options {width: 18%;}
.month .summaryText {float: left;}
.beam-row-hover {background-color: #5AADD0 !important;}

/*Comments*/
.comments img {margin-left: 0; vertical-align: middle; float: left;}
.comments span {vertical-align: middle;}
.hiddenComments {display: none;}
.hiddenComments > span {float: left; clear: both;}
.hiddenComments img {margin-left: 1.5em;}

/*Filter section in the Agency Bulletin Board*/
#filters .actions {display: none;}
#filters * {float: left;}
#filters .actions {margin-top: 0.5em; width: 100%;}
#filters .actions > span {margin-left: 1em;}
#filters .actions > span > span {width: 4.2em;}
#filters div, #filters select {cursor: pointer; cursor: hand;}
#filters #ShowMonths label {padding: 0.3em 1em;}
#filters input, #filters select, #filters .label {height: 1.7em;}

/*Editing in Agency Bulletin Board */
#MonthTabs input[type="text"], #MonthTabs select {height: 1.4em;}
#MonthTabs .row-field {display: none; float: right;}
#MonthTabs .row-field:disabled {display: none; background: transparent; border: none; text-align: right; color: #333333; pointer-events: none;}
select.row-field:disabled::-ms-expand {display: none;} /* This is to remove the arrow of select element in IE */
select.row-field:disabled {appearance: none; -webkit-appearance: none;}
#MonthTabs .field-separator {clear: both; float: left;}
#MonthTabs .field-container {float: right; margin-right: 3px; padding: 3px;}
#MonthTabs .bookings > .field-container ~ .field-container {background-color: #dbdbdb;}
#MonthTabs .bookings > .field-container ~ .field-container ~ .field-container {background-color: inherit;}
#MonthTabs .bookings > .field-container ~ .field-container ~ .field-container ~ .field-container {background-color: #dbdbdb;}
#MonthTabs .field-container label {display: none;}

@media only screen and (max-width: 17.3em){
  ul.lsp-month .date {width: auto !important;}
  ul.lsp-month .date br {display: block !important;}
  ul.lsp-month .details-time {margin-left: 0 !important;}
}
@media only screen and (min-width: 17.3em) and (max-width: 492px){
  ul.lsp-month .date {width: 8em !important;}
  ul.lsp-month .id {width: 8em !important; margin-left: 1.2em;}
  ul.lsp-month .details-booker {margin-right: 0.6em;}
  ul.lsp-month .details-ref {width: 3.1em;display: block;float: left;}
  ul.lsp-month .details-notes {margin-left: 0em !important;}
  ul.lsp-month .id br {display: none;}
  ul.lsp-month .LSPs {width: 7.8em !important;}
  #MonthTabs .middle {margin-right: 0;margin-left: 9em;}
}
@media only screen and (max-width: 492px){
  body {zoom: 80%;}
}
@media only screen and (max-width: 300px){
  .agency-middle {margin-left: 0;}
  .agency-wrapmiddle {margin-top: 2.3em;}
  .agency-middle .Fields {margin-left: 0 !important;}
  #MonthTabs .ui-tabs-panel div:first-of-type .agency-wrapmiddle {margin-top: 1.3em;}
  .agency-right .agent {width: 100% !important;}
  
  #DateTable .month .LSPsTypes {clear: both}
  #DateTable .left-col {width: 19.3em !important;}
  #DateTable .options {margin-left: 0 !important; clear: both;}
  ul.lsp-month >li >ul {display: table; width: -webkit-fill-available;}
  ul.lsp-month .left {clear: both; margin-left: 0px !important; display: table-header-group; float: none !important; width: auto !important;}
  ul.lsp-month .details-time {margin-left: 0.5em;}
  ul.lsp-month .id {clear: both; margin-left: 0.8em !important; width: auto !important;}
  ul.lsp-month .id br {display: none;}
  ul.lsp-month .details-ref {margin-left: 0.3em !important;}
  ul.lsp-month .middle {margin-left: 0.8em !important;}
  ul.lsp-month .wrapmiddle {display: table-row-group; float: none !important; width: auto !important;}
  ul.lsp-month .notes {clear: both;}
  ul.lsp-month .summary {width: auto !important;}
  ul.lsp-month .summary div {white-space: pre-wrap;}
  #MonthTabs .ui-tabs-nav a {padding: 0.2em 0.7em;}
  ul.lsp-month .monthHeaders .LSPs:after {content: "" !important;}
}
@media only screen and (max-width: 700px){
  /* Mobile screens portrait */
  .agency-middle {margin-right: 1px;overflow: visible !important;}
  .agency-right {clear: both;margin-right: 0px;margin-left: 0px;width: 100%;}
  .agency-right .agent {width: auto;}
  .agency-right .LSPs {width: 12em;}
/*  .agency-middle .Fields {margin-left: -12em;} */
  .agency-middle .summaryTextBlock {min-height: 2.1em;}
  .agency-right .bookings {width: 100%;}
  .agency-right .bookings .addLSP {float: left !important;}
  .fields-col-6 {padding-top: 0.4em; padding-left: 0.3em !important;}
  
  .agency-right .lspStatus {width: 12em;}
  
  #MonthTabs .right {clear: both; margin-right: 0px; margin-left: 0px; width: auto; margin-left: 1.2em;}
  #MonthTabs .middle {margin-right: 0;}
  .details-notes br {display: none;}
  /*ul.lsp-month .LSPs {margin-left: 0.4em; margin-right: -0.4em;}*/
  ul.lsp-month .notes {margin-left: 0.1em;}
  ul.lsp-month .LSPs:after {content: " "; white-space: pre;}
  ul.lsp-month .monthHeaders .LSPs:after {content: " & ";}
}

@media only screen and (min-width: 493px) and (max-width: 800px){
  #DateTable .month .LSPsTypes {clear: both}
  #DateTable .left-col {width: 19.3em !important;}
  #DateTable .options {margin-left: 19.3em !important;}
}

@media only screen and (min-width: 701px) and (max-width: 800px){
  #MonthTabs .right {width: 14em;margin-left: -14em;}
  #MonthTabs .middle {margin-right: 14em;} 
  .lsp-month details-notes {width: 100%}
  .lsp-month details-lsps {width: 100%}
}

@media only screen and (min-width: 701px) and (max-width: 900px){
  /* tablet screens portrait*/
  .agency-middle {margin-right: 12em;}
  .agency-right {margin-right: 0px; margin-left: -12em; width: 12em;}
  .agency-right .bookings {clear: both;}
}
@media only screen and (max-width: 1000px){
  /* Cutover to hide the menu */
  #leftBar.show-hamburger {display: block !important;} /* if hamburger selected, show left bar */
  div.nonMenu.show-hamburger {display: none !important;}  /* if hamburger selected, don't show content */
  #leftBar {display: none;}
  #hamburger {display: block !important; z-index: 1;}
  div.nonMenu {margin-left: 0px;}
  #SectionTitle {margin-left: 1.71em;}
  /*.errors {margin-left: 2.88em;}*/
  div#leftBar {width: 100%}
  #HideMenu {display: block;}
}
@media only screen and (min-width: 901px) and (max-width: 1200px) {
  /* Wider screens */
  .agency-middle {margin-right: 15.3em;}
  .agency-right {width: 15.3em;margin-left: -15.3em;}
}
@media only screen and (max-width: 1200px){
  .month div.month .LSPs {width: 8em;}
  .month div.month .agent {width: 4em;}
}
@media only screen and (min-width: 1201px) and (max-width: 1400px) {
  /* Wider screens */

  /*LSP*/
  ul.lsp-month .LSPs {width: 250px;}

  /*Agency*/
  .month div.LSPs {width: 12em;}
  .month div.middle {margin-right:562px;}
  .month div.right {width: 562px; margin-left: -562px;}
  .month .bookings {width: 15.9em;margin-left: 0;position: relative;}
  .month .agent {margin-left: 0; position: relative; width: 15.9em;}
  .agency-middle {margin-right:27.9em;}
  .agency-right {width: 27.9em; margin-left: -27.9em;}
  
  .month-headers .bookings {margin-left: 12em;}
}

/*@media only screen and (max-width: 1250px) {
   Assignment Details change from 2 columns to 1 below 1250px 
  #Assignment .col1, #Assignment .col2, #Assignment .col3 {clear: left; float: left; width: 100% !important;}
  #Assignment .col1 .marge, #Assignment .col2 .marge {margin-right: 0px !important;}
}*/

@media only screen and (min-width: 1401px) {
  /* Even wider screens */
  /*LSP*/
  ul.lsp-month .LSPs {width: 16em !important;}
  .middle {margin-right:27em !important;}
  .right {width: 27em !important; margin-left: -27em !important;}
  ul.lsp-month .notes {width: 11em !important;}

  /*Agency*/
  .month div.LSPs {width: 12em;}
  .month div.bookings {width: 16em;margin-left: 0;}
  .month .agent {width: 7.5em;margin-left: 0;position: relative;}
  .agency-middle {margin-right: 35.7em;}
  .agency-right {width: 35.7em;margin-left: -35.7em;}
}


/**
 * Dialog
 *
 **/
/*
       @media only screen and (max-width: 1000px) {
               .ui-dialog {width: 100% !important; left: 0px !important; top: 0px !important; height: 100% !important;}		
       }
*/
/**
 * Assignment Outline
 *
 **/
#DateTable .dragDate {cursor: default; position: relative;}
#DateTable .dragDate.error .dropDate {background-color: pink !important;}
#DateTable .dragDate img {cursor:pointer; cursor:hand;}
#DateTable .dragDate input {cursor: text;}
#DateTable ul li ul li {padding: 4px 2px 1px 3px;}
#DateTable ul li.DatesTitles ul li {padding: 1px 2px 1px 3px;}
.edited {border-color: rgb(255, 163, 0); border-width: 2px; background-color: rgb(255, 202, 150) !important;}

/**
 * Add LSP dialog
 *
 **/
#chooseLSP span {float: left;}
#chooseLSP input[type='text'] {width: 5em;}
#chooseLSP .label {width: 2.5em;}
#chooseLSP .label2 {width: 3.5em; margin-left: 1em; float: right;}
#chooseLSP .travel {float: right;}

/**
 * LSP Bulletin Board
 *
 **/

ul.pending {background: orange}
ul.rejected {background: silver}
ul.lsp-month > li {cursor:pointer;cursor:hand;}

ul.lsp-month .wrapmiddle {float: left; width: 100%; margin: 0px;}
ul.lsp-month .middle {margin-right:20.7em; margin-left:12.5em;}
ul.lsp-month .left {float: left; width: 12.5em; margin-left: -100%;}
ul.lsp-month .right {float: left; width: 20.7em; margin-left: -20.7em;}
ul.lsp-month .monthHeaders {background-color: white;}

ul.lsp-month .tick {width: 1.2em; margin-left: 0px;padding-top: 0.2em;}
ul.lsp-month .right .tick {display: none;} 
ul.lsp-month .date {width: 7em;}
/*
        ul.lsp-month .start {width: 10%;}
        ul.lsp-month .end {width: 10%;}
*/
ul.lsp-month .id {width: 4.2em; cursor: pointer; cursor: hand;}
ul.lsp-month .LSPs {width: 11.2em;}
ul.lsp-month .LSPsTypes {width: 45%;}
ul.lsp-month .notes {width: 9.5em;}
ul.lsp-month ul li {float: left; margin-left: 0px;}
ul.lsp-month ul {padding: 0; margin: 0px;}
ul.lsp-month .summary {width: 100%; float: left; padding-right: 10px;}
ul.lsp-month .agent {width: 7%;}
ul.lsp-month .bookings {width: 18%;}
ul.lsp-month .options {width: 18%;}
ul.lsp-month .fields .label {float: left; margin-right: 0.3em;}
ul.lsp-month .fields .value {float: left; margin-right: 0.5em;}
ul.lsp-month li ul li {overflow: hidden;}
ul.lsp-month li.extra-height {height:3.7em;}
ul.lsp-month li ul li div {overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}

ul.lsp-month .highlight-row {border: 2px solid red;}

.lspStatus img, .addFile img {float: left; width: 1.3em; height: 1.3em; vertical-align: baseline; margin: 2px;}
.regionSelector {float: left;}
.lspStatus .lspName {float: none; margin-left: 28px; margin-top: 0px;margin-bottom: 0px;padding-top: 4px;padding-bottom: 1px;}
.lspStatus .drag {box-sizing: border-box;}
.badge-bottom-right {width: 14px !important;height: 14px !important;left: -12px !important;position: relative !important;top: 6px !important; margin-right: -12px !important; vertical-align: super;}
/* li.name div {padding-left: 2px; padding-right: 2px;}*/
/*Status Response*/
.response0 {border: 1px solid #77D5F7; color: white; background-color: #0078AE;}
.response1 {border: 1px solid #77D5F7; color: white; background-color: #0078AE;}
.response2 {border: 1px solid #77D5F7; color: white; background-color: #FF9502;}
.response3 {border: 1px solid #77D5F7; color: white; background-color: #007A0E;}
.response4 {border: 1px solid #77D5F7; color: white; background-color: #DDDDDD; color:#444;}
.response5 {border: 1px solid #77D5F7; color: white; background-color: #DDDDDD; color:#444;}
.coworkers .response3 {padding-bottom: 0.1em;}


/*Search*/
#Search .btnNext {display: none;}
div.timeBox {padding-left: 1px !important;}
div.timeBox label {margin-left: -1px !important;} 
div.timeBox span {padding: 0px 3px 3px 3px;}
.ui-checkboxradio-icon {display: none;}
div.search {cursor:pointer; cursor:hand; margin: 0px; clear: both;}
div.search div {padding: 0; margin: 2px; float: left; overflow: hidden;}
div.search > div {clear: both; float: none;}
.search-result-env > div {float: none !important; clear: both;}
/*Search request table*/
div.search .date {width: 7em;}
div.search .date input {width: 100%;}
div.search .time {width: 8em;}
div.search .region {width: 10.5em;}
div.search .options {width: 25em;}
div.search input, div.search select {margin-top: 3px;}
/*Search results table*/
div.search .dateTime {width: 22%;}
div.search .name {width: 20%;}
div.search .registration {width: 20%;}
.search-fade {opacity: .2;}
.result-header {background: #83C2DC;margin: 1px;height: auto;font-size: 1em;padding: 5px 1em !important;}
.lspInfoIcon {width: 1em; height: 1em; margin-left: 0.2em; marg: 1px; vertical-align: top; cursor:pointer; cursor:hand;}
div.search .recent {background: #DFFFD6;}
div.search .old {background: #FFE9B2;}
div.search .oldest {background: #FFE0E0;}
div.search .recent-selected {background: lightblue;}
div.search .old-selected {background: lightblue;}
div.search .oldest-selected {background: lightblue;}

#Search .time label {padding: 0px 0.3em 0.2em 0px;}

/* LSP Assignment Details */
.LSPAssignmentDetails, .LSPAssignmentDetails ul {padding: 0px;}
.LSPAssignmentDetails li {float: left;}
.LSPAssignmentDetails > li {clear: both;}
.LSPAssignmentDetails > li li:FIRST-CHILD {width: 130px;}
/**
 * Agency groups
 *
 */

div.groups {margin: 0px; margin-top: 0px;}
div.groups > li {float: left; width: 100%;}
div.groups > div {float: left !important; width: 100%;}
div.groups .drag {float: left;}
div.groups .drag, div.groups .summary img {cursor:pointer; cursor:hand;}
div.groups .drag:first-of-type {clear: both;}
div.groups > div div {padding: 2px; margin: 0px 0px 1px 0px;}
div.groups .summary {width: 100%; cursor:pointer; cursor:hand;}
div.groups .name {margin: 0px; padding: 8px;}
div.groups .normal {background:#77FF77;}
div.groups .blocked {background:#FF5050;}
.group {margin: 0px 1px 1px 0px;}
.group >div div {float: left; }
.search-section {margin: 0; padding: 0; border: 0 !important; float: left; }
.search-section div {padding: 2px 1em 2px 2px; float: left;}
#LSPSearch {border: none; padding: 2px;}
#DateSearch {border: none;}
#SendGroup {padding: 5px; float: none; margin: 0px; min-height: 4em;}
div.groups #subjectLine {padding: 5px;}
div.groups #templateLine {padding: 5px;}
div.groups .left-column {padding: 2px; float: left; clear: both; width: 8em;}
div.groups #templateLine .recordMessage {display: none;}
#add-group span {float: left;}
div.groups .group-buttons {box-sizing: border-box;}
div.groups div#group0 {clear: both;}
.LSPResults {float: left; clear: both; width: 100%;}

div[data-page="agentGroups"] .permissions {width: 100%; box-sizing: border-box;}
div[data-page="agentGroups"] .add-permission {padding: 8px; background: #E8F8FF;}
div[data-page="agentGroups"] .permission.live {background: #E8F8FF; padding-bottom: 0px; margin-right: 4px;}
div[data-page="agentGroups"] .permission.live .permission-body {padding-bottom: 0px;}

/**
*
*	ATW Form
*
**/

#ATWList {min-width: 651px; box-sizing: border-box;}
#ATWList div {box-sizing: border-box;}
#ATWList > div {float: left;clear: both;width: 100%; cursor:pointer; cursor:hand;}
#ATWList > div div {float: left;}
#ATWList .formListRow {clear: both; cursor:pointer; cursor:hand; width: 100%;}
#ATWList .date {width: 9em;}
#ATWList .form {width: 10em;}
#ATWList .claimant {width: 12em;}
#ATWList .from {width: 6em;}
#ATWList .to {width: 6em;}

#atwClaim div, #atwClaim span, #atwClaim form  {float: left; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}
#atwClaim .atwForm > div {float: left; clear: both; position: relative; width: 29.8em;}
#atwClaim .atwForm >div >span:first-of-type {width: 12em;}
#atwClaim .atwForm >div input {width: 15em; }
#atwClaim input[name=employerName] {clear: both;}
#atwClaim #btnSelectAll {margin-left: 0px;}
#atwClaim .clickable {margin-right: 2px;}
#atwClaim .droppable {margin-right: 1px; min-height: 5em; min-width: 10em;}
#atwClaim .draggable {cursor: pointer; border: black solid 1px;}
#atwClaim .staff {width: 50%; overflow-y: scroll;}
#atwClaim .LSP {border: silver solid 1px; float: inherit !important;}
#atwClaim .LSP div {background: none !important; border: silver !important;}
#atwClaim .staff .droppable div:first-child {float: none;}
#atwClaim .staff-title {border: none; font-weight: bold; background: none;}
#atwClaim .invoices .staff-title {clear: both;}
#atwClaim .invoices {width: 50%; overflow-y: scroll;}
#atwClaim .invoices > div {display: inline-block;}
#atwClaim .calc {clear: both; width: 100%;}
#atwClaim .calc table {width: 100%; border-collapse: collapse; border: silver solid 3px;}
#atwClaim .calc table tr:nth-child(n+3) {border-top: silver solid 3px;}
#atwClaim .calc table td {border: silver solid 1px; padding: 0px 2px;}
#atwClaim .calc table td:first-child span {height: 1em; overflow: hidden;}
#atwClaim .calc table td:nth-child(n+6) {text-align: right;}
#atwClaim .calc table td:nth-child(4n+6), #atwClaim .calc table th:nth-child(2n+6) {background: #f5f9fd;}
#atwClaim .calc table td:nth-child(4n+7) {background: #f5f9fd;}
#atwClaim .calc table td:nth-child(2n+4), #atwClaim .calc table th:nth-child(2n+4) {border-left: silver solid 2px !important;}
#atwClaim .calc table th {padding: 0px 2px;}
#atwClaim .calc table input {width: 4em; border: none; background: none; float: right; text-align: right;}
#atwClaim .calc .total-row {border: silver solid 3px; font-weight: bold;}
#atwClaim .calc .total-row span {float: right; width: 4em;}
#atwClaim .border {border: silver solid 1px;}
#atwClaim .calc-error {background: pink !important;}
#AtwMultiForm {display: none;}

.travelHeader, .travelData, .travelTotal  {clear: both; float: none !important;}
.travelDate {width: 12em;}
.travelDate input {width: 8em !important; margin-left: 0px !important;}
.travelAmount {width: 10.1em;  margin-left: 0px;}
.travelAmount input {width: 8em !important; margin-left: 0px !important;}
.travelData input, .travelAmount input {width: 10em;}
.travelData .incomplete {background: red;}

#atwClaim #loading, #atwClaim #loading > * {float: none;}
.claimInfo, .claimInfo div {float: none !important; width: auto !important;}
.claimInfo div {padding: 0.2em 0.5em;}

/**
 * Send message
 *
 */
#sendMail .message li {display: none}
#sendMail .message li:first-of-type {display: block;}

#emailForm {overflow: hidden; margin: 0px; padding: 0px; clear: both;}
#emailForm ul {margin: 1px; padding: 0px;}
#emailForm li {margin: 1px; padding: 0px;}

#message {clear: both;}
#emailForm .message {cursor:pointer; cursor:hand; margin: 0px; margin-top: 3px;}
#message0 .group {float: left; clear: none; width: auto; cursor: pointer; cursor: hand;}
#message0 .group .drag {display:none;}
#message0 {clear: both !important;}
.message .recipients div {float: left;}
.message .recipient {padding-bottom: 11px; padding-top: 11px; margin-right: 2px;}
.message ul {padding: 0px; border: none !important;}
.message li {padding: 0px; border: none !important;}
.send-name {margin: 3px; padding: 3px !important;}
.message .recipients {width: 100%; }
.message .recipients li {float: left;}
.message .recipients li ul li {width: auto; float: left; padding: 2px;}
.message .recipientrows > li, .message .recipientrows input {float: none !important;}
.second {width: 100%; }
.second li {float: none;}
.second li ul li {float: left;}
.second div {margin-bottom: 2px;}
.second input {border: none; }
.lsps li {width: 100%;}
ul.message input {width: 95%;}
ul.message .start {width: 14%; margin-left: 2px;}
ul.message .end {width: 14%;}
ul.message .event {width: 40%;}
ul.message .location {width: 30%;}
li.sendFiles ul {padding-bottom: 2px;}
.message .files {float: left;}
.message select {padding: 5px 5px 5px 0px;}
.message .showForm {margin-top: 3px; margin-left: 3px; display: none; cursor: pointer; cursor: hand;}
.message .showForm:not(:first-of-type) {margin-left: -10px;} 
#emailSection .message {border: none; padding: 0px;}

#ConfEmail {clear: both;}
#ConfEmail > ul .label {float: left;}
#ConfEmail > ul .input {margin-left: 5.1em;}
#ConfEmail > ul input, #ConfEmail > ul select {float: none; position: relative; width: 100%;}
#ConfEmail span {float: left; clear: both; width: 5em; position: absolute;}
#ConfEmail textarea {width: 100%; border:0;}
#ConfEmail .dialogError {display: none;}
#ConfEmail #body_ifr {height: 29em !important;}

#subjectLine {margin: 0px; padding: 0px;}
#subjectLine input {width: 80%;}
#subjectLine div, #templateLine * {float: left;}
#subjectLine div, #templateLine div {width: 6em;}

.delete-message-div {width: 1em; float: left;}
.message-headers-div {margin-left: 1.2em;}

/**
 * LSP link
 *
 */
table.lspStatus {cursor:pointer; cursor:hand; border: 0 none;}
table.lspStatus tr {background: transparent;}
table.lspStatus td {border: 0 none;}
table.lspStatus tr:hover {background: #069; color: #FFF;}

tr.lsp {background: transparent;}
.lspStatus {float: left; width: 100%}
.lspWithdrawn {display: none; font-style: normal; color:#444;}
.lspReq {color:#55F; text-decoration: none;}
.lspIReq {color:#55F; text-decoration: none;}
.lspInfo {display: none; color:#55F; text-decoration: none;}
.lspHold {font-style: normal; color:orange; text-decoration: none;}
.lspYes {color:#005500;}
.lspNo {display: none; color:#444;}
.lspCanc {display: none; color:#444;}

.needsAction {background-color: #FFFFFF;}


/**
 * LSP boxes
 *
 */

.lsp-box {float:left; cursor:pointer; cursor:hand; margin-right: 1px;}
.lsp-box > ul {padding: 0px;}
.lsp-box > ul > li {padding: 4px !important;}

.lsp-box > div {padding: 4px;}

/**
 * LSP info
 *
 */

#lspInfo {min-height: 320px;}
#lspInfo img {height: 100%; width: 100%; object-fit: contain;}
#lspInfo .img-container, .ui-dialog-content .img-container {height: 300px; width: 250px; max-height: 300px; max-width: width: 250px; float: left;}
.ui-dialog-content .img-container img {max-height: inherit; max-width: inherit;}
/**
 * Floating Div
 *
 */
#layer2 {
  position: relative;
  width: 400px;
  left: 0px;
  top: 0px;
  background-color: #ccc;
  border: 1px solid #000;
  padding: 10px;
}

#close {
  float: right;
}

/**
 * Debugging
 *
 */

#xdebug-var-dump {
  background:#333
}


/**
 * Centre Box
 *
 **/
div.centreBox
{
  display: table;
  position: absolute;
  top: 0px;
  left: 0px;
  height: 100%;
  width: 100%;
  z-index: 100;
  padding: 5px;
  background-color: transparent;
  border: transparent;
}
div.centreBox div {
  display: table-cell;
  background-color: transparent;
  text-align: center;
  vertical-align: middle;
}

div.centreBox div p{
  background-color: white;
  line-height: 75px;
  border-style: ridge;
}


/**
 * Files
 *
 **/

/* New uploader */
.qq-gallery .qq-delete-icon {background: url(/flaticons/trash.svg) !important; width: 1.5em !important; height: 1.5em !important;}
.qq-gallery .tickbox-ticked, .qq-gallery .tickbox-blank {width: 1.4em !important; height: 1.4em !important; background-size: 1.4em;}


/*old stuff */

ul.files {cursor:pointer; cursor:hand; margin: 0px; margin-top: 3px;}
ul.files ul {padding: 0; margin: 2px;}
ul.files ul li {padding: 2px; width: 15%; float: left;}
/*Bulletin Board widths (main bb and edit item*/
ul.files .id {width: 5%;}
ul.files .upload {width: 15%;}
ul.files .filename {width: 28%;}
ul.files .description {width: 48%;}

#fileList {cursor:default; margin: 0px; margin-top: 3px; width: 99%;}
#fileupload .span7 .btn {float: left;}
#fileupload .span7 .btn.start, #fileupload .span7 .btn.cancel {height: 37px; margin-top: 2px}
#fileupload .span7 .btn.start span, #fileupload .span7 .btn.cancel span {padding: 0px;}
#fileupload .span7 .btn.start span span, #fileupload .span7 .btn.cancel span span {margin: 6.33px 15.8px 6.33px 15.8px}
#fileupload .span5 {float: left; width: 50%;}
#fileupload .fileupload-loading {clear: both;}
#pic-info {width: auto;}
#fileList div {float: left; width: 99.6%; }
#fileList .files .template-download {float: left; background: #DFFFD6;}
#filesPage .template-download {clear: both;}
#AssignmentEdit #fileList .files .template-download {float: left; clear: none; background: #DFFFD6; width: auto;}
#fileList .files .template-upload {background: #FFE9B2;}
#fileList button {border: none; width: 18px; height: 18px; margin-top: 2px; cursor:pointer; cursor:hand;}
#fileList .actions {width: 38px;}
#fileList .delete button {background: url('/flaticons/cross.svg') no-repeat; float: left; width: 1.5em; height: 1.5em;}
#fileList .cancel button {background: url('/flaticons/cross.svg') no-repeat; float: left; width: 1.5em; height: 1.5em;}
#fileList .activate img {width: 18px; height: 18px;}
/*	#fileList .edit {background: url('/flaticons/pencil.svg') no-repeat; float: left;}  */
#fileList .edit {display: none;}  /*** delete when line above is reinstated */
#fileList .preview {width: 82px;}
#fileList .summary {min-width: 85px; width: 15%;}
#fileList .upload {width: 15%;}
#fileList .name {min-width: 150px; width: 20%;}
#fileList .icon {min-width: 32px; width: 32px;}
#fileList .icon img {vertical-align: text-top;}
#fileList .description {width: 320px;}
#fileList .size {width: 90px;}
#fileList .error {width: 200px;}
#fileList .progress-class {width: 99%;}
#fileList .start {display: none;}
#fileList input {width: 200px;}
.fileupload-buttonbar {clear: both !important;}


.fileinput-button {
  position: relative;
  overflow: hidden;
  float: left;
  margin-right: 5px;
}
.fileinput-button input {
  position: absolute;
  top: 0;
  right: 0;
  margin: 0;
  border: solid transparent;
  border-width: 0 0 100px 200px;
  opacity: 0;
  filter: alpha(opacity=0);
  -moz-transform: translate(-300px, 0) scale(4);
  direction: ltr;
  cursor: pointer;
}
/* Fix for IE 6: */
*html .fileinput-button {margin-right: -2px;}
*html .fileinput-button .ui-button-text {line-height: 24px;}
*html .fileupload-buttonbar .ui-button {margin-left: 3px;}

/* Fix for IE 7: */
*+html .fileinput-button {margin-right: 1px;}
*+html .fileinput-button .ui-button-text {line-height: 24px;}
*+html .fileupload-buttonbar .ui-button {margin-left: 3px;}

@media (max-width: 480px) {
  .files .preview * {width: 40px;}
  .files .name * {
    width: 80px;
    display: inline-block;
    word-wrap: break-word;
  }
  .files .progress {width: 20px;}
  .files .delete {width: 60px;}
}

/* Fix for Webkit (Safari, Chrome) */
@media screen and (-webkit-min-device-pixel-ratio:0) {
  .fileinput-button {margin-top: 2px;}
}


/**
 * Bulletin Board Agency Edit Item
 *
 **/

#AssignmentEdit {overflow: hidden; height:100%; clear: both;}
#Files ul {margin: 0px; padding: 0px;}
#Files li {padding: 2px; float: left;}
#Files input {border: none;}

#DateTable {margin-top: 5px;overflow: visible;border: none;padding: 0px;}
#DateTable .left-col {float: left; width: 32.7em; overflow: hidden;}
#DateTable .left-col input,#DateTable .left-col select, #DateTable .options input, #DateTable .options select, #DateTable .fields input, #DateTable .fields select {height: 1.8em; padding-left: 2px;}
#DateTable .fields {width: 100%; }
#DateTable .fields input, #DateTable .fields select {width: 100% !important;}
#DateTable .fields div {width: 100% !important;}
#DateTable .fields img {margin-top: 2px; margin-bottom: 0px;}
.dragDate > div > div > div, .DatesTitles > div > div > div {float: left;}
#DateTable .date {width: 6.3em; min-width: 6.3em;}
#DateTable .date input {width: 6.3em;}
#DateTable .start, #DateTable .end {width: 3.3em;}
#DateTable .start input, #DateTable .end input {width: 100%;}
#DateTable .validateTime {width: 3.3em;}
#DateTable .month .LSPsTypes {width: 19.5em; float: left;}
#DateTable .month .LSPsTypes input {float: inherit; width: 2em;}
.dragDate .LSPsTypes select {width: 17em !important;}
#DateTable .options {float: none; margin-left: 32.7em; overflow: hidden; width: auto;}
#DateTable .options > div:first-child {min-height: 1.8em; margin-right: 0.5em}
#DateTable .options .fields {float: left;}
#DateTable .options .fields > div {float: left;;}
#DateTable .options .field {float: left; padding-left: 10px;}
#DateTable .options .field:last-child {padding-left: 0;}
#DateTable .options .field >div {float: left; padding-left: 3px; width:auto;}
#DateTable .options .field >div:last-child {padding-left: 0px;}

#AssignmentTabs {overflow: hidden;}
#AssignmentTabs .marge {overflow: hidden;}

#AssignmentTabs .ui-tabs-panel {margin-top: 5px; padding: 0px !important;}
#DateTable .month > div:last-of-type {margin-top: 5px;}
#Details input, #Details select, #Details textarea {box-sizing: border-box; width: 100%; max-width: 30em;}
#Details #addDate {width: 11em;}
#moreDetails input, #moreDetails select, #moreDetails textarea {box-sizing: border-box; width: 100%; max-width: 23.4em;}
#btnNewDate {float: left;}
.FormButtonsParent {background: white; z-index: 1000}

#CommentTable {margin-top: 5px;overflow: visible;border: none;padding: 0px;}
#CommentTable .left-col {float: left;width: 21.3em;overflow: hidden;margin-left: -100%;}
#CommentTable .left-col input,#CommentTable .left-col select, #CommentTable .options input, #CommentTable .options select {height: 1.8em;}
#CommentTable .right-col {float: left;width: 4em;margin-left: -4em;}
#CommentTable .right-col img {float: right; margin-left: 0.2em;}
#CommentTable .type {float: left; width: 1.4em;}
#CommentTable .type input {width: 2.8em;}
#CommentTable .date {float: left; width: 8.3em;}
#CommentTable .date input {width: 6.3em;}
#CommentTable .comment-group {float: left; width: 6em;}
#CommentTable .comment-group select {width: 5.6em;}
#CommentTable .createdBy {float: left;width: 5.3em;}
#CommentTable .createdBy input {width: 8.3em;}
#CommentTable .comment {margin-right: 4em;margin-left: 21.3em;}
#CommentTable .comment textarea {width: 100%; min-width: 100%; height: 1.5em; max-height: 10em; box-sizing: border-box;}
#CommentTable .comment-row  {position: relative;}


#Files {margin-top: 5px; padding: 0px;}
#addFiles ul {margin: 0px; padding: 0px; }
#addFiles li {padding: 2px; float: left;}
#addFiles input {border: none; width: auto;}
#addFiles ul, #addFiles input {cursor: pointer; cursor: hand;}
.sendFiles input {width: auto;}
.sendFiles div {float: left;}

#fileResults .draggable {width: auto; float: left;}
#attachFiles .draggable {float: left}

#AssignmentEdit p {margin: 0px; float: left;}

#Assignment .marge {margin: 0px;}
#Details .col1 {clear: left; float: left; width: 50%;}
#Details .col2 {float: left; width: 50%;}
#Assignment .col1 .marge {margin-right: 1px;}
#moreDetails .col1 {clear: left; float: left; width: 34%;}
#moreDetails .col2, #moreDetails .col3 {float: left; width: 33%;}
#Assignment .label {width: 150px; float: left; clear: both;}
#Assignment .option input {margin-right: 0.1em;}
#Assignment .data {margin-left: 150px; float: left; clear: both;}
#Assignment >div input, #Assignment >div select, #Assignment >div .radioSet, #AssignmentTabs textarea {float: left;}
#AssignmentTabs textarea {height: 5em;}
#Assignment #saveDetails {background: #77FF77;}
#Assignment #saveDetails:hover {background: lightgreen;}
#Assignment .participants {clear: none; margin-right: 0.2em;}

div.otherRegions ul {padding: 0px;margin: 0px;}
.otherRegionsLabel {display: none;} 

/**
 * Clone stuff
 *
**/
.beam-buttons {float: right; margin-right: 1em; margin-bottom: 0.5em;}
.beam-buttons .yes-button {margin-right: 0.4em;}

/**
 * LSP Offer Form
 *
 **/
#OffersForm .offer-item-header {}
#OffersForm .offer-item-header img {margin: 5px 0px 0px 4px; position: absolute;}
#OffersForm .offer-item-header li {margin-left: 1.4em;}
#OffersForm ul {margin: 0px; padding: 0px;}
#OffersForm li {margin: 2px 0px; padding: 2px;}
#OffersForm .ui-widget-header {margin: 2px; padding: 2px;}
#OffersForm .offer-date-row * {float: left; vertical-align: middle;}
#OffersForm .offer-date-row div span {padding: 0.4em 0.2em 0.4em 1em;}
#OffersForm .offer-date-row input {margin: 0.25em 0em 0.4em 0em;}
#OffersForm .offer-date-row > span:first-of-type {padding: 0.4em 1em 0.4em 0em;}
#OffersForm textarea {width: 100%; box-sizing: border-box;}


/* Formatting for smaller screens */

@media only screen and (max-width: 820px){
  .offer-fee {clear: both; padding-left: 0px;}
}

/**
 * Calendar
 *
 **/

#beam-calendar-iframe {width: 100%; height: 90vh; border: none;}

.cal-background {background-color: #E8F8FF; background-image: none;}
span.cal-time-rule {position: absolute; width: 100%;}
hr.cal-time-rule {height: 1px; border-width: medium medium 1px; border-style: none none dotted; border-color: transparent -moz-use-text-color black;}
span.cal-time-label {float: right; margin-right: 3px; background: #E8F8FF none no-repeat right top;}



/**
 * LSP Availability table
 *
 **/
#LSPAvailTabs {padding: 0;}
#LSPAvailTabs .ui-tabs-panel {padding: 0;}
.availability {margin: 0px;border: 0 !important;padding: 0px 1px;top: -1px;}
.availability ul {background: #F2F2F2;}
.availability .title {margin-bottom: 1px; background: #FFFFFF;}
.availability .Sat {background: #F7FFF7;}
.availability .Sun {background: #F7FFF7;}
.availability ul li {padding: 2px; width: 15%; float: left;}
.availability .date {width: 180px; padding-top: 4px;}
.availability .am, .availability .pm {width: 40px; padding-top: 0.3em;}
.availability .eve {width: 50px; padding-top: 0.3em;}
.availability .notes {max-width: 400px; width: 100%; padding-left: 5px; margin-left: -5px;}
.avail-row {overflow: hidden;cursor:pointer;cursor:hand;}

@media only screen and (max-width: 356px){
  .availability .am {clear: both}
  .availability .notes {width: 9em;}
}

/**
 * Requests table
 *
 **/
#requests {cursor:pointer; cursor:hand; margin: 0px;}
#requests ul {padding: 0; margin: 2px;}
#requests ul li {padding: 2px; width: 15%; float: left;}
#requests .date {width: 90px;}
#requests .id {width: 65px;}
#requests .summary {width: 250px;}
#requests .details {width: auto; position: relative; left: 0px;}
#requests .detailDate {width: 90px;}
#requests .detailTime {width: 130px;}
#requests .detailLSPs {width: auto; float: right;}
#requests .detailRegion {width: auto; float: right;}
#requests .unactioned {background: #F2F2F2;}
#requests .accepted {background:#77FF77;}
#requests .rejected {background: silver;}
#requests .mixed {background: lightblue;}
#requests .nodates {background:red;}

/**
 *	Invoices
 *
 **/
#Invoices > div {clear: both;}
#Invoices > div div {float: left;}
#Invoices #options {display: none;}
#Invoices #loading div, #Invoices .beam-error div {float: none;}
#Invoices .basicDiv {display: none;}
#Invoices .left-col {width: 9em;}

/**
 * Previous invoices
 *
 **/
#previous-invoices
#previous-invoices div {padding: 1px; margin: 0px;}
#previous-invoices > div {clear: both; float: none; cursor: pointer; position: relative;}
#previous-invoices > div div {cursor: default;}
#previous-invoices >div >div >div {padding-left: 5px;}
#previous-invoices .date {width: 4.6em; float: left;}
#previous-invoices .payee {width: 13em; float: left;} 
#previous-invoices .amount {width: 4em; text-align: right; padding-right: 1em; float: left;}
#previous-invoices .dates {margin-left: 23.1em;}
#previous-invoices .invoice-list-date {padding: 0 0.5em 0 0; float: left; cursor: pointer;}

/**
 * ATW New LSP
 *
 **/
#atwNewLSP li {padding: 1px; margin: 0px;}
#atwNewLSP ul {padding: 0px; margin: 0px;}
#atwNewLSP li ul li {padding-left: 5px; float: left;}
#atwNewLSP .subtitle {margin: 1px; padding-left: 5px;}
#atwNewLSP .date {width: 100px;}
#atwNewLSP .user {width: 200px;}
#atwNewLSP .user select {width: 195px;}
/*	#atwNewLSP .actions {width: *;}	*/

/**
 * Profile
 *
 **/

#profileForm .deleted, #profileUsers .deleted {background: silver;}
#profileForm .live, #profileUsers .live {background: #E8F8FF;}
.user-permission {display: none;}
.user-permission .permission {margin-right: 1px;}
.perm-item {font-size: 0.9em !important;float: left;margin-top: 1px !important;margin-left: 2px !important;width: 23px;height: 24px;padding: 3px 2px 0px 1px !important;text-align: center; box-sizing: border-box}
.perm-item-selected {background: rgb(119, 255, 119);}
.perm-item-deselected {background: silver;}
.perm-item-owner {background: orange;}
.perm-item-parent {background: orange;}
.perm-title {margin-right: 3px;padding: 2px 0px 0px 0px;}
.permission, #profileUsers .live, #profileUsers .user-deactivated, #inactive-users-header {cursor: hand; cursor: pointer;}
.permission-delete {margin-left: 5px; float: right;}
#edit-permissions select {float: right; width: 162px;}
.permission-body {float: right;}

/**
 * Registration form
 *
 **/

.registration-form .deleted {background: silver;}
.registration-form .live, .pass-reset-form .live {background: #E8F8FF;}
.display-company, .display-indiv, .display-lsp {display: none;}
.registration-work-regions label {float: left;}
.registration-quals label {margin-top: -1.1em; margin-left: 2em; float: left; clear: both; cursor: pointer; cursor: hand;}
.registration-quals input {float: left; margin-top: 0.4em; margin-left: 0.8em;}
.registration-work-regions input {float: left;}
.registration-quals-section {clear: both; font-weight: bold;}
.registration-quals div {clear: both;}
/**
 * Admin Fields
 *
 **/
ul.fields { margin: 0px; margin-top: 3px;}
ul.fields input {float:left;}
ul.fields img, ul.fields select {cursor:pointer; cursor:hand;}
ul.fields input, ul.fields select {width: 99%;}
ul.fields ul {padding: 0; margin: 2px;}
ul.fields ul li {padding: 2px; width: 20%; float: left; overflow: hidden; }
ul.fields .header {font-weight: bold;}
ul.fields .actions {width: 2.3em;}
ul.fields .name {width: 8em;}
ul.fields .type {width: 8.5em;}
ul.fields .width {width: 3.4em;}
ul.fields .datatype {width: 5em;}
ul.fields .usage {width: 7em;}
ul.fields .lsp {width: 6em;}
ul.fields .location {width: 6em;}
ul.fields .description {width: auto; float: none;}
ul.fields .mandatory {width: 10%;}
ul.fields li li input, ul.fields li li select {height: 1.4em;}
.deselected {-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=20)";filter: alpha(opacity=20);opacity: 0.2;}

/**
 * News
 *
 **/
ul.news {background: none; margin: 0px; padding: 0px;}
.news h1 {font-size: 125%;}
.news .start-date {float: right; margin-left: 0.7em;}

/**
 * Reminders
 *
 **/
.remindersIcon {float: left; margin-left: 2px; margin-bottom: 0px;}
#remindersForm .remindersIcon {margin-right: 4px;}
.liveReminder {background: lightgreen;}
.completedReminder {background: silver;}
ul.addReminder {border: 0px;}
.editableReminder {cursor:pointer; cursor:hand;}
.delReminder {cursor:pointer; cursor:hand;}
ul.reminders {float: left;}
#AssignmentEdit .reminders {display: none;}
#remindersForm #addSection [name="days"] {float: left;height: 1.5em; margin-bottom: 0.5em;}
#remindersForm #addSection [name="type"] {float: left;height: 1.5em; margin-bottom: 0.5em; margin-right: 0.5em;}
#remindersForm #confirmAdd {clear: both;}

#alerts {margin: 0px 0px 0.5em 0px; float: left;}
#alerts span {padding: 2px 4px;} 
#alerts label {margin-left: -1px;margin-right: 0px;}
/**
 * Contact Us
 *
 **/ 
#contactus {margin: 0px; padding: 0px;}
#contactus div {margin: 0px 0px 1px 0px; padding: 2px;}
#contactus div div:first-of-type {width: 10em;float: none;margin-left: 0px;position: absolute;}
#contactus div div {float: left;margin-left: 10em;}
#contactus div div p {}

/**
* Prep
*
**/
#prepRequired {width: 48%;float: left;}
#prepRequired .files {float: left;}

#filesForAllDates {display: none;}
#filesForAllDates li {width: 100%;}

#prepFiles {width: 48%; float: right; margin-bottom: 1px;}
#AssignmentEdit #prepFiles {width: auto; float: none; margin-bottom: 1px;}
#AssignmentEdit #fileList {clear: both;}
#prepFiles div div {float: left; clear: none; cursor: pointer; cursor: hand; margin-top: 0px; width: auto;min-width: 100px;}
#prepFiles #fileList .template-download {clear: none;}
#prepFiles div {clear: both; margin-top: 2px;}
#prepFiles .addFile {vertical-align: middle; vertical-align: -webkit-baseline-middle;}
#prepFiles .actions {width: 18px;}
.prepList {display: none; min-width: 130px; position: absolute; background-color: pink; border: 2px; border-color: violet; padding: 2px; z-index: 1000; min-height: 32px;}

#prepareChangePrep ul { margin: 0px; margin-top: 3px;}
#prepareChangePrep li {float: left;}
#prepareChangePrep li ul {vertical-align: middle; padding-left: 0px;}
#prepareChangePrep .icon {width: 28px;}
#prepareChangePrep .date {width: 90px;}
#prepareChangePrep .time {width: 200px;}
#prepareChangePrep .name {width: 170px;}
#prepRequired .actions {width: 170px;}
#prepareChangePrep img {width: 24px; height: 24px;}
#prepareChangePrep .actions img {cursor: pointer; cursor: hand;}
#prepareChangePrep .actions img.badge-bottom-right {left: -18px !important; margin-right: -24px !important;}

.prepReqIcon {float: left;}

.prepNull {background: pink;}
.prepNotReq {background: lightgreen;}
.prepReq {background: pink;}
.prepSent {background: lightgreen;}
.prepOver {background: lightblue !important;}

#divEmailButton {clear: both;}
#btnEmail {margin-top: 2px; float: left;}
#btnSendEmail {margin-top: 2px; background: url('images/greenButton.png') repeat-x scroll 50% 50% #60E222; float: left; display: none;}
#divEmail {display: none; clear: both; margin-top: 2px;}

/**
* Icons
*
**/
.beam-icon-standard {width: 1em; height: 1em;}
.tickbox-blank {background: url('../flaticons/square.svg') no-repeat; background-size: 1em; float: left; cursor: pointer; cursor: hand; margin-bottom: 0;}
.tickbox-ticked {background: url('../flaticons/checkbox.svg') no-repeat; background-size: 1em; float: left; cursor: pointer; cursor: hand;  margin-bottom: 0;}
.resizeIcon24 {width: 24px; height: 24px;}
.resizeIcon28 {width: 28px; height: 28px;}
.resizeIcon1em {width: 1em; height: 1em;}
.resizeIcon12em {width: 1.2em; height: 1.2em;}
.resizeIcon13em {width: 1.3em; height: 1.3em;}
.resizeIcon15em {width: 1.5em; height: 1.5em;}
.resizeIcon2em {width: 2em; height: 2em;}
.removeIcon {width: 16px; height: 16px; top: -16px; position: relative; left: -12px; cursor: pointer; cursor: hand;}
#OffersForm .removeIcon {width: 16px;height: 16px;top: 4px;position: relative;left: 3px;cursor: pointer;cursor: hand;}
.liveIcon {float: left;margin: 2px;}
.month-row .approveIcon {float: left; display: none;}
.inlineIcon {margin-right: 3px;}
.groupIcon {cursor: pointer; cursor: hand; font-size: 0.9em; float: left; margin: 1px; width: 1.3em; height: 1.3em; line-height: 1.3em; padding: 0px; background: none no-repeat scroll left top; text-align: center; border-color: #AAAAAA; border-width: 3px;}
#MonthTabs .groupIcon.deselected, #MonthTabs .reminderIcon.deselected {display: none;}
.rowChanged .groupIcon.deselected, .rowChanged .reminderIcon.deselected {display: inline;}
.prepIcon {float: left; margin-bottom: 0px;}
.subIcon {width: 0.5em; height: 0.5em; margin-left: -0.5em; vertical-align: top;}
.switchingBullet {float: left; margin-right: 0.25em; width: 1em; height: 1em; cursor: pointer; cursor: hand;}
.switchingBulletSmall {float: left; margin-right: 0.25em; width: 0.8em; height: 1em; cursor: pointer; cursor: hand;}
.shrinkIcon {float: left; margin-right: 5px; cursor: pointer; cursor: hand;}

/**
* bits and pieces
*
**/
.dialogInfoSelector {float: right; margin-right: 20px; cursor: pointer; margin-top: -5px; margin-bottom: 5px;}
.dialog-para {padding: 5px 0px;}
.foreignGroup {border: 3px solid forestgreen;}
.fingerPointer {cursor: pointer; cursor: hand;}
.overlaySpinner {display: none; position: absolute; border: 0; width: 100%; background: none;}
.fullSpinner {position: relative; width: 100%; height: 100%; background: white; /*z-index: 100000;*/}
.spinner {display: block; border: 0; margin-left: auto !important; margin-right: auto; position: relative;}
.beam-overlay {display: none; border: 0; position: absolute; width: 100%; height: 100%; opacity: 0.3; background: repeating-linear-gradient(45deg,#AAAAAA,#AAAAAA 10px,#000000 10px,#000000 20px);}
.beam-overlay-sizing {position: absolute; height: 100%; top: 0; left: 0; z-index: 1;}
#ui-datepicker-div {display: none;}
a:-webkit-any-link {cursor: pointer; cursor: hand;}
.user-deactivated {display: none; text-decoration:line-through;}
.clickable, select {cursor: pointer; cursor: hand; float: left;}
.strikeout {text-decoration: line-through;}
option:disabled {color: grey; background-color: silver;}
.ui-tabs-loading em {background: red;}
#loadTime {display: none;} 
div.space-paras p {margin-top: 0.5em;}
.full-width {width: 100%; clear: both;}
.ui-sortable-handle {cursor: pointer; cursor: hand;}
.option-deactivated {display: none;}
.ui-helper-hidden-accessible {width: 1px !important;}
.allowOverflow {overflow: visible !important;}
.highlight {background: #77D5F7; min-height: 3em;}
.hide {display: none !important;}
.ui-tooltip {background: #FFE9B2;}
.hatch {background: repeating-linear-gradient(45deg,#AAAAAA, #AAAAAA 10px, #FFFFFF 10px, #FFFFFF 20px) !important;}
.beam-no-rows {display: none;}
div[data-page] {position: relative;}
.filter-white {filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(195deg) brightness(102%) contrast(101%);}

/***
* IE hacks
* 
***/

/* style for IE6 + IE5.5 + IE5.0 */
body.ie6 #dialog * { height: 0; }
body.ie6 #prepFiles div div.fileupload-buttonbar, body.ie6 #fileList .files {width: 100%; clear: both;} /* span around file upload controls */
body.ie6 .span7 button {width: 150px;}
body.ie6 #sendMail li, body.ie6 #sendMail ul {height: 1%;}
body.ie6 .beam-overlay {filter: alpha(opacity = 75); zoom: 1;}

/* style for IE7 */
body.ie7 #dialog * { zoom: 1; }
body.ie7 #prepFiles div div.fileupload-buttonbar, body.ie7 #fileList .files {width: 100%; clear: both;} /* span around file upload controls */
body.ie7 .span7 button {width: 150px;}
body.ie7 #fileList .files div {width: auto; float: left; clear: none; min-width: 100px;}

body.ie7 #DateTable .month div.month li ul {z-index: 2000;}
body.ie7 #DateTable .month div.month {z-index: 2000;}
body.ie7 #DateTable .month div.month span.prepList {z-index: 1000;}
body.ie7 #AssignmentTabs  {z-index: 2000;}
body.ie7 #sendMail li, body.ie7 #sendMail ul {height: 1%;}
body.ie7 .beam-overlay {filter: alpha(opacity = 75); zoom: 1;}

/* style for IE8 */
body.ie8 .beam-overlay {filter: alpha(opacity = 75); zoom: 1;}

/***
* Checkboxes
* 
***/

.month-row input[type=checkbox] {
  -webkit-appearance: none;
  background-color: white;
  border: 1px solid #cacece;
  box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05);
  padding: 0.6em;;
  border-radius: 3px;
  display: inline-block;
  position: relative;
}
.month-row input[type=checkbox]:active, .month-row input[type=checkbox]:checked:active {
  box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px 1px 3px rgba(0,0,0,0.1);
}

.month-row input[type=checkbox]:checked {
  border: 1px solid #adb8c0;
  box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05), inset 15px 10px -12px rgba(255,255,255,0.1);
  color: #99a1a7;
}
.month-row input[type=checkbox]:checked:after {
  content: '\2714';
  font-size: 1.2em;
  position: absolute;
  top: -0.25em;
  left: 3px;
  color: #333333;
}
.month-row input[type=checkbox]:disabled {background-color: transparent; box-shadow: none;}

/* size change function */
iframe.size-change-monitor {
  width: 100%;
  display: block;
  border: 0;
  height: 0;
  margin: 0;
}

/* HELP pages */
[data-page^="help"] .help-left {width: 7em; float: left; clear: both}
[data-page^="help"] .help-right {float: left;}
[data-page^="help"] .ui-corner-all:not(.beam-subsection-header):not(.pagetitle) p {padding-bottom: 0.3em;}

/* Error bars */
.beam-error, #dialogError {width: 100%; clear: both;}
.beam-error > div, #dialogError > div, #dialogError > div > div {width: 100%; box-sizing: border-box;}
.beam-error p, #dialogError p {float: left;display: contents;}
.beam-error div {padding-left: 0.5em !important; float: left;}

/* Booking forms */
.getEntriesForForm label {position: absolute;}
.beam-form-entries {margin-left: 14em;}

/* Booking Information dialog*/
.beam-booking-info-row {margin: 1px 1px 3px 1px; clear: both; float: left; width: 100%; box-sizing: border-box; padding-left: 0.2em; }
.beam-booking-info-row input[type='checkbox'] {float: left;box-sizing: border-box;margin: 0.2em 0.2em 0em 0em;}
.beam-booking-info-row div {padding-right: 0.7em;}
.beam-booking-info-lsp {padding-left: 0.2em; overflow: hidden; margin-left: 1px;}
.beam-booking-info-withdrawn {opacity: 30%;}
.beam-booking-info-withdrawn input[type='checkbox'] {visibility: hidden;}