/* mvl code below is from HelperStylings.less in ERPULL */

.flex-container-row {
  display: flex;
  flex-direction: row;
}
.flex-container-column {
  display: flex;
  flex-direction: column;
}
.erpull-normal-font {
  font-family: "Open Sans";
  font-weight: 300;
}
.erpull-bold-font {
  font-family: "Open Sans";
  font-weight: 600;
}
.button-style3 {
  background-color: #FFFFFF;
  border: 1px solid #109FE9;
  color: #109FE9;
  border-radius: 5px;
  box-shadow: 1px 2px 2px #0000001A;
}
.button-style3 i {
  color: #109FE9;
}
.button-style3:hover {
  background-color: #E5F4FC;
  border: 1px solid #109FE9;
  color: #109FE9;
}
.button-style3:hover i {
  color: #109FE9;
}
.button-style3:active {
  background-color: #109FE9;
  border: none;
  color: #FFFFFF;
}
.button-style3:active i {
  color: #FFFFFF;
}
.border-white {
  border: 1px solid white;
}
.border-lightgray {
  border: 1px solid lightgray;
}
.sethover {
  background-color: #dddddd;
  cursor: pointer;
}
.setbluehover {
  background-color: #4fb8ed;
  cursor: pointer;
}
.setgreenhover {
  cursor: pointer;
  background-color: #13f076;
}
.setredhover {
  cursor: pointer;
  background-color: #df4360;
}
.sethovernotallowed {
  cursor: not-allowed;
}
.setborder {
  border: 0;
  border-radius: 5px;
}
.setbordershadow {
  box-shadow: 0px 3px 6px #00000029;
  border: 1px solid #109FE9;
  border-radius: 5px;
  color: #109FE9;
}
.time-now-pointer-container {
  width: 0;
  height: 0;
  z-index: 200;
}
.time-now-pointer-container .time-now-pointer {
  color: #0ECB62;
}
.time-now-pointer-container .time-now-pointer .time-now {
  border: 1px solid #0ECB62;
  margin-left: 7px;
  height: 80px;
}
.shift span,
.shift-unavailable span {
  font-family: 'Open Sans' !important;
}
.worker-schedule {
  display: flex;
  flex-direction: row;
  margin-left: 10px;
  width: 0;
}
.worker-schedule .shift-container {
  height: 52px;
  flex: 0 0 78px;
  background-color: #F5F5F5;
  border-right: 1px solid white;
  display: flex;
  flex-direction: row;
}
.worker-schedule .shift-container:last-of-type {
  flex: 0;
  border-right: 0;
}
.worker-schedule .shift {
  height: 52px;
  flex: auto;
}
.worker-schedule .shift-unavailable {
  background-color: #919191;
  height: 52px;
  flex: auto;
}
.shift-pause-container {
  width: 0;
  z-index: 100;
}
.shift-pause-container .shift-pause {
  height: 62px;
  background-color: #B5344C;
  opacity: 0.7;
}
.worker-shifts-machine {
  width: 0;
}
.worker-shifts-machine .flex-row {
  display: flex;
  flex-direction: row;
}
.worker-shifts-machine .flex-row .work-duration,
.worker-shifts-machine .flex-row .pjq-label {
  margin: 2px;
}
.worker-shifts-machine .flex-row .work-duration {
  margin-left: auto;
}
.worker-shifts-machine .work-state-label,
.worker-shifts-machine .machine-label {
  margin: 2px;
}
.ziek,
.vrij {
  color: #B5344C;
}
.section-header {
  font-family: "Open Sans";
  font-weight: 600;
  color: #109FE9;
  line-height: 30px;
  padding-top: 5px;
}
.list-top-bar-container .search {
  margin-top: 2px;
}
.list-content-empty {
  padding-left: 10px;
}
#cntAlternativeMenu {
  display: flex;
  position: relative;
  transition: width 0.2s linear;
  box-shadow: 2px 0px 9px 0px rgba(0, 0, 0, 0.2);
}
#cntAlternativeMenu .alternative-menu {
  flex: 1;
  background-color: #CFECFB;
  display: flex;
  flex-direction: column;
}
#cntAlternativeMenu .alternative-menu-header {
  background-color: #4D4274;
  color: #FFFFFF;
  height: 30px;
  line-height: 30px;
  padding-left: 10px;
  position: sticky;
  top: 0px;
}
#cntAlternativeMenu .alternative-menu-button {
  background-color: #FFFFFF;
  color: #000000;
  line-height: 30px;
  margin-bottom: 1px;
  cursor: pointer;
  padding-left: 10px;
}
#cntAlternativeMenu .alternative-menu-button.selected {
  background-color: #0ECB62;
  color: #FFFFFF;
}
#cntMenuController {
  display: flex;
  flex-direction: column;
  background-color: #CFECFB;
  color: #109FE9;
  overflow: hidden;
  width: 30px;
}
#cntMenuController .alternative-menu-sidebar {
  display: flex;
  flex-direction: row;
  position: relative;
  top: 0;
  left: 0;
  float: left;
  transform-origin: 15px 15px;
  transform: rotate(90deg);
  height: 30px;
  line-height: 30px;
  width: 200px;
}
#cntMenuController .alternative-menu-sidebar-button {
  display: flex;
  position: relative;
  padding-left: 10px;
  cursor: pointer;
}
#cntMenu {
  background-color: #CFECFB;
  position: relative;
  width: 200px;
  height: 100%;
  box-shadow: 2px 0px 9px 0px rgba(0, 0, 0, 0.2);
  z-index: 100;
  overflow-x: hidden;
  overflow-y: auto;
  transition: width 0.2s linear;
}
#cntMenu .cntMenu-header {
  background-color: #4D4274;
  color: white;
  line-height: 20px;
  padding: 5px 10px 5px 10px;
  position: sticky;
  top: 0;
  z-index: 200;
}
#cntMenu .cntMenu-item {
  display: block;
  min-height: 46px;
  padding-left: 44px;
  color: black;
  position: relative;
  border-bottom: 2px solid #CFECFB;
  padding-top: 7px;
  padding-bottom: 6px;
  cursor: pointer;
  text-decoration: none;
  background-color: white;
}
#cntMenu .cntMenu-item > i.fa {
  position: absolute;
  left: 5px;
  top: 14px;
  width: 32px;
  text-align: center;
  opacity: 0.8;
  color: #4D4274;
  font-size: 17px;
}
#cntMenu .cntMenu-item .cntMenu-item-label {
  padding-top: 6px;
  margin-bottom: -4px;
}
#cntMenu .cntMenu-item:hover,
#cntMenu .cntMenu-item--active {
  background-color: #0ECB62;
  color: white;
}
#cntMenu .cntMenu-item:hover i.fa,
#cntMenu .cntMenu-item--active i.fa {
  color: white;
  opacity: 1;
}
#cntMenu .cntMenu-item--deactivated,
#cntMenu .cntMenu-item--deactivated:hover {
  -webkit-user-select: none;
  /* Safari */
  -moz-user-select: none;
  /* Firefox */
  -ms-user-select: none;
  /* Internet Explorer/Edge */
  user-select: none;
  /* Non-prefixed version, currently */

  color: darkgray;
  cursor: default;
  text-decoration: line-through;
}
#cntMenu .cntMenu-item--deactivated:hover,
#cntMenu .cntMenu-item--deactivated:hover:hover {
  background-color: white;
}
#cntMenu .cntMenu-item--deactivated i.fa,
#cntMenu .cntMenu-item--deactivated:hover i.fa {
  color: darkgray;
  opacity: 1;
}
#cntMenu .outsourcingErrorIcon {
  position: absolute;
  left: 27px;
  top: 2px;
  color: red;
  cursor: pointer;
}
#layout_content {
  margin: 0;
  display: flex;
  font-size: 0;
}
#layout_content div,
#layout_content input,
#layout_content textarea,
#layout_content select,
#layout_content a/* mvl include a for when it is made a block level element*/ {
  box-sizing: border-box;
}
#layout_content input,
#layout_content textarea,
#layout_content select {
  font-family: "Open Sans";
  font-size: 12px;
}
#layout_content #cntMenu {
  flex: 0 0 200px;
  transition: flex 0.2s linear;
}
#layout_content #cntTightList {
  flex: 0 0 200px;
}
#layout_content #cntContent {
  flex: 1 1 auto;
}
div,
span,
td {
  font-family: "Open Sans";
  font-size: 13px;
}
.standard-button {
  /* mvl looks like a blue button with a background */
  cursor: pointer;
  padding: 5px 10px 5px 7px;
  border-radius: 5px;
  border: 1px solid #109FE9;
  display: inline-block;
  color: white;
  user-select: none;
  background-color: #109FE9;
  vertical-align: top;
  margin-right: 10px;
  box-shadow: 1px 2px 2px #0000001A;
}
.standard-button:hover {
  background-color: #0C7CB6;
  border: 1px solid #0C7CB6;
}
.standard-button:active {
  background-color: #09618E;
  border: 1px solid #09618E;
}
.standard-button.disabled {
  background-color: #B6E1F8;
  border: 1px solid #B6E1F8;
}
.standard-button > span {
  padding-left: 3px;
}
.standard-button.blue-lined {
  background-color: #FFFFFF;
  border: 1px solid #109FE9;
  color: #109FE9;
}
.standard-button.blue-lined:hover {
  background-color: #0C7CB6;
  border: 1px solid #0C7CB6;
  color: #FFFFFF;
}
.standard-button.grey-filled {
  background-color: #DDDDDD;
  border: 1px solid #DDDDDD;
  color: #707070;
}
.standard-button.grey-filled:hover {
  background-color: #c6c6c6;
  border: 1px solid #c6c6c6;
}
.standard-button.green-filled {
  background-color: #0ECB62;
  border: 1px solid #0ECB62;
}
.standard-button.green-filled:hover {
  background-color: #0CB557;
  border: 1px solid #0CB557;
}
.standard-button.green-filled:active {
  background-color: #0BA14E;
  border: 1px solid #0BA14E;
}
.standard-button.green-filled.disabled {
  background-color: #B5EFCF;
  border: 1px solid #B5EFCF;
}
.standard-button.white-filled {
  background-color: white;
  border: 1px solid white;
  color: #109FE9;
  /*&:active {
        background-color: @erpullIntenseGreenActive;
        border: 1px solid @erpullIntenseGreenActive;
    }

    &.disabled {
        background-color: @erpullIntenseGreenDisabled;
        border: 1px solid @erpullIntenseGreenDisabled;
    }*/

}
.standard-button.white-filled:hover {
  background-color: #ebebeb;
  border: 1px solid #ebebeb;
}
.standard-button.white-filled > .fa {
  color: #109FE9 !important;
}
.standard-button.red-filled {
  background-color: #B5344C;
  border: 1px solid #B5344C;
}
.standard-button.red-filled:hover {
  background-color: #A23247;
  border: 1px solid #A23247;
}
.standard-button.red-filled:active {
  background-color: #84293A;
  border: 1px solid #84293A;
}
.standard-button.red-lined {
  background-color: white;
  border: 1px solid #B5344C;
  color: #B5344C;
}
.standard-button.red-lined:hover {
  background-color: #F5E7EA;
}
.standard-button.red-lined:active {
  background-color: #B5344C;
  color: white;
}
.icon-button {
  /* mvl useful for a single fa icon */
  cursor: pointer;
  padding: 5px 5px 5px 0px;
  user-select: none;
  vertical-align: top;
  color: #109FE9;
}
.icon-button:hover {
  color: #0C7CB6;
}
.icon-button.white-text {
  color: white;
}
.icon-button.white-text:hover {
  color: lightgrey;
}
.warning-label {
  cursor: default;
  padding: 5px 10px 5px 7px;
  border-radius: 5px;
  border: 1px solid darkgoldenrod;
  display: inline-block;
  color: white;
  user-select: none;
  background-color: darkorange;
  vertical-align: top;
}
.warning-label:hover {
  background-color: darkgoldenrod;
}
.warning-label > span {
  padding-left: 3px;
}
.button-disabled {
  background-color: #828282;
  cursor: not-allowed;
  border: 1px solid #828282;
}
.button-disabled:hover {
  background-color: #828282;
}
.button-inactive {
  border: 1px solid white;
  background-color: white;
  user-select: none;
  color: darkgray;
  cursor: default;
  text-decoration: line-through;
}
.button-inactive:hover {
  background-color: white;
}
.button-delete {
  background-color: white;
  border: 1px solid #B5344C;
  color: #B5344C;
  float: right;
}
.button-delete:hover {
  background-color: #F5E7EA;
  border: 1px solid #B5344C;
  color: #B5344C;
}
.button-delete:active {
  background-color: #B5344C;
  border: 1px solid #B5344C;
  color: white;
}
.button-delete_Left {
  background-color: white;
  border: 1px solid #B5344C;
  color: #B5344C;
  float: left;
}
.button-delete_Left:hover {
  background-color: #F5E7EA;
  border: 1px solid #B5344C;
  color: #B5344C;
}
.button-delete_Left:active {
  background-color: #B5344C;
  border: 1px solid #B5344C;
  color: white;
}
.button-reactivate {
  float: right;
}
.link-button {
  cursor: pointer;
  color: #109FE9;
  padding-left: 10px;
  padding-right: 10px;
  line-height: 30px;
  display: inline-block;
}
.link-button:hover {
  text-decoration: underline;
}
.filters-list-view {
  display: flex;
  flex-direction: row;
  position: relative;
  flex: 0 0 221px;
  background-color: #CFECFB;
  box-shadow: 2px 0px 9px 0px rgba(0, 0, 0, 0.2);
  border-left: 1px solid #CFECFB;
}
.filters-list-view .filter-container {
  flex: 1;
  box-shadow: 2px 0px 9px 0px rgba(0, 0, 0, 0.2);
}
.filters-list-view .filter-container .filter-header {
  color: white;
  padding: 6px 10px;
  background-color: #4D4274;
  height: 30px;
}
.filters-list-view .filter-container .filter-header .filter-title {
  margin-left: 10px;
}
.filters-list-view .filter-container .filter-header .filter-reset-default-button {
  position: absolute;
  top: 0;
  right: 0;
}
.filters-list-view .filter-container .filter-list {
  display: flex;
  flex-direction: column;
  background-color: white;
}
.filters-list-view .filter-container .filter-list .select2-container--default .select2-selection--single {
  border: none;
}
.filters-list-view .filter-container .filter-list .filter-row {
  display: flex;
  flex-direction: row;
  flex: 0 0 30px;
}
.filters-list-view .filter-container .filter-list .filter-row .filter-row-cell_label,
.filters-list-view .filter-container .filter-list .filter-row .filter-row-cell_value {
  border-bottom: 1px solid #EBEBEB;
}
.filters-list-view .filter-container .filter-list .filter-row .filter-row-cell_label {
  font-family: "Open Sans";
  font-weight: 600;
  text-align: right;
  color: #109FE9;
  flex: 0 0 110px;
  border-right: 1px solid #EBEBEB;
  padding: 7px;
}
.filters-list-view .filter-container .filter-list .filter-row .filter-row-cell_value {
  display: flex;
  justify-content: center;
  flex-direction: column;
  flex: 1 0 90px;
  font-size: 13px !important;
  margin-top: 1px;
}
.filters-list-view .filter-container .filter-list .filter-row .filter-row-cell_value select {
  width: 100%;
}
.filters-list-view .filter-container .filter-list .filter-row .filter-row-cell_value .numberFilter {
  width: 100%;
  height: 100%;
  flex: 1;
  border: 2px solid white;
  padding-left: 7px;
}
.filters-list-view .filter-container .filter-list .filter-row .filter-row-cell_value .numberFilter--incorrect {
  border: 2px solid #ffa500;
  background-color: #ffc354;
}
.columns-list-view {
  display: flex;
  flex-direction: column;
  flex: 1;
  overflow-y: auto;
}
.columns-list-view .list {
  border: none;
  overflow: auto;
  background-color: white;
  width: 100%;
  position: relative;
}
.columns-list-view .list.list-collapsible {
  cursor: pointer;
}
.columns-list-view .list .collapse-list-container {
  flex: 0 0 24px;
}
.columns-list-view .list-row {
  display: flex;
  flex-direction: row;
  font-family: "Open Sans";
  font-weight: 300;
  flex: 1 100%;
  flex-flow: row nowrap;
  justify-content: space-between;
}
.columns-list-view .list-row .list-row-cell {
  padding: 4px 7px 4px 10px;
  border-bottom: 1px solid white;
  display: inline-block;
  word-break: break-word;
}
.columns-list-view .list-row .list-row-cell ~ .list-row-cell {
  padding-left: 7px;
}
.columns-list-view .list-row .list-row-cell a i.fa {
  color: black;
}
.columns-list-view .list-header {
  display: flex;
  flex-direction: row;
  font-family: "Open Sans";
  font-weight: 600;
  background-color: #CFECFB;
  position: sticky;
  top: 0px;
  z-index: 6;
  color: black;
  font-size: 14px;
  line-height: 14px;
  cursor: pointer;
}
.columns-list-view .list-header .list-row-cell {
  padding: 7px 7px;
  align-self: end;
}
.columns-list-view .list-header .list-row-cell .fa-sort-alpha-up,
.columns-list-view .list-header .list-row-cell .fa-sort-alpha-down {
  display: none;
}
.columns-list-view .list-header .list-row-cell .fal {
  float: right;
}
.columns-list-view .list-header .orderDescending .fa-sort {
  display: none !important;
}
.columns-list-view .list-header .orderDescending .fa-sort-alpha-up {
  display: inline !important;
}
.columns-list-view .list-header .orderAscending .fa-sort {
  display: none !important;
}
.columns-list-view .list-header .orderAscending .fa-sort-alpha-down {
  display: inline !important;
}
.columns-list-view .list-header .collapse-list-container {
  cursor: pointer;
}
.columns-list-view .list-header .collapse-list-container .collapse-list-icon {
  text-align: center;
  width: 100%;
  cursor: pointer;
}
.columns-list-view .list-content {
  background-color: #F5F5F5;
}
.columns-list-view .list-content .list-row {
  cursor: pointer;
}
.columns-list-view .list-content .list-row:hover {
  background-color: #DBF1FC;
}
.columns-list-view .list-content .list-row--selected,
.columns-list-view .list-content .list-row--selected:hover {
  background-color: #CEEEFE;
}
.columns-list-view .list-content .list-row-cell--moveUp,
.columns-list-view .list-content .list-row-cell--moveDown,
.columns-list-view .list-content .list-row-cell--delete {
  -webkit-user-select: none;
  /* Safari */
  -moz-user-select: none;
  /* Firefox */
  -ms-user-select: none;
  /* Internet Explorer/Edge */
  user-select: none;
  /* Non-prefixed version, currently */

  flex: 0 0 30px;
  padding-top: 9px;
}
.columns-list-view .list-content .list-row-cell--moveUp,
.columns-list-view .list-content .list-row-cell--moveDown {
  background-color: #cfecfb;
}
.columns-list-view .list-content .list-row-cell--moveUp .fa,
.columns-list-view .list-content .list-row-cell--moveDown .fa {
  color: white;
}
.columns-list-view .list-content .list-row-cell--delete {
  color: #B5344C;
  cursor: pointer;
}
.columns-list-view .list-row--add_row input {
  border: 1px solid #ECECEC;
  height: 30px;
  color: #959595;
  line-height: 30px;
  padding: 0px 7px;
  color: black;
}
.columns-list-view .list-row--add_row input:hover,
.columns-list-view .list-row--add_row input:focus {
  color: #000000;
  border-color: #EBEBEB;
}
.columns-list-view .list-row--add_row select {
  border: 1px solid #ECECEC;
  height: 30px;
  color: #959595;
  line-height: 30px;
  padding: 0px 7px;
  color: black;
  -moz-appearance: menulist;
  -webkit-appearance: menulist;
}
.columns-list-view .list-row--add_row select:hover,
.columns-list-view .list-row--add_row select:focus {
  color: #000000;
  border-color: #EBEBEB;
}
.columns-list-view .list-row--add_row select::-ms-expand {
  display: inline-block;
}
.columns-list-view .list-row--add_row .action-add {
  margin-left: 0;
  margin-top: 6px;
  visibility: hidden;
}
.columns-list-view .list-row--add_row .action-add--disabled {
  color: gray;
  cursor: pointer;
}
.columns-list-view .list-row--add_row:hover {
  background-color: #f2fafe;
}
.columns-list-view .list-row--add_row:hover .action-add {
  visibility: visible;
}
.columns-list-view .list-row--focused .action-add {
  visibility: visible;
}
.columns-list-view .list-row--focused--add_row select,
.columns-list-view .list-row--focused--add_row input {
  border-color: #109FE9;
}
.columns-list-view .list-row--focused--add_row select:focus,
.columns-list-view .list-row--focused--add_row input:focus,
.columns-list-view .list-row--focused--add_row select:hover,
.columns-list-view .list-row--focused--add_row input:hover {
  border-color: #109FE9;
}
.columns-list-view .list-row-cell-date {
  display: flex;
  flex-direction: row;
  flex: 1 0 auto;
  justify-content: flex-end;
}
.columns-list-view .list-row-cell-date .list-row-cell-date-day {
  text-align: right;
}
.columns-list-view .list-row-cell-date .list-row-cell-date-date {
  margin-left: 7px;
  text-align: right;
}
.default-list-style {
  display: flex;
  flex-direction: column;
  flex: 1;
  overflow-y: auto;
}
.default-list-style .list {
  border: none;
  overflow: auto;
  background-color: white;
  width: 100%;
  position: relative;
}
.default-list-style .list.list-collapsible {
  cursor: pointer;
}
.default-list-style .list .collapse-list-container {
  flex: 0 0 24px;
}
.default-list-style .list-row {
  display: flex;
  flex-direction: row;
  font-family: "Open Sans";
  font-weight: 300;
  flex: 1 100%;
  flex-flow: row nowrap;
  justify-content: space-between;
}
.default-list-style .list-row .list-row-cell {
  padding: 4px 7px 4px 10px;
  border-bottom: 1px solid white;
  display: inline-block;
  word-break: break-word;
}
.default-list-style .list-row .list-row-cell ~ .list-row-cell {
  padding-left: 7px;
}
.default-list-style .list-row .list-row-cell a i.fa {
  color: black;
}
.default-list-style .list-header {
  display: flex;
  flex-direction: row;
  font-family: "Open Sans";
  font-weight: 600;
  background-color: #CFECFB;
  position: sticky;
  top: 0px;
  z-index: 6;
  color: black;
  font-size: 14px;
  line-height: 14px;
  cursor: pointer;
}
.default-list-style .list-header .list-row-cell {
  padding: 7px 7px;
  align-self: end;
}
.default-list-style .list-header .list-row-cell .fa-sort-alpha-up,
.default-list-style .list-header .list-row-cell .fa-sort-alpha-down {
  display: none;
}
.default-list-style .list-header .list-row-cell .fal {
  float: right;
}
.default-list-style .list-header .orderDescending .fa-sort {
  display: none !important;
}
.default-list-style .list-header .orderDescending .fa-sort-alpha-up {
  display: inline !important;
}
.default-list-style .list-header .orderAscending .fa-sort {
  display: none !important;
}
.default-list-style .list-header .orderAscending .fa-sort-alpha-down {
  display: inline !important;
}
.default-list-style .list-header .collapse-list-container {
  cursor: pointer;
}
.default-list-style .list-header .collapse-list-container .collapse-list-icon {
  text-align: center;
  width: 100%;
  cursor: pointer;
}
.default-list-style .list-content {
  background-color: #F5F5F5;
}
.default-list-style .list-content .list-row {
  cursor: pointer;
}
.default-list-style .list-content .list-row:hover {
  background-color: #DBF1FC;
}
.default-list-style .list-content .list-row--selected,
.default-list-style .list-content .list-row--selected:hover {
  background-color: #CEEEFE;
}
.default-list-style .list-content .list-row-cell--moveUp,
.default-list-style .list-content .list-row-cell--moveDown,
.default-list-style .list-content .list-row-cell--delete {
  -webkit-user-select: none;
  /* Safari */
  -moz-user-select: none;
  /* Firefox */
  -ms-user-select: none;
  /* Internet Explorer/Edge */
  user-select: none;
  /* Non-prefixed version, currently */

  flex: 0 0 30px;
  padding-top: 9px;
}
.default-list-style .list-content .list-row-cell--moveUp,
.default-list-style .list-content .list-row-cell--moveDown {
  background-color: #cfecfb;
}
.default-list-style .list-content .list-row-cell--moveUp .fa,
.default-list-style .list-content .list-row-cell--moveDown .fa {
  color: white;
}
.default-list-style .list-content .list-row-cell--delete {
  color: #B5344C;
  cursor: pointer;
}
.default-list-style .list-row--add_row input {
  border: 1px solid #ECECEC;
  height: 30px;
  color: #959595;
  line-height: 30px;
  padding: 0px 7px;
  color: black;
}
.default-list-style .list-row--add_row input:hover,
.default-list-style .list-row--add_row input:focus {
  color: #000000;
  border-color: #EBEBEB;
}
.default-list-style .list-row--add_row select {
  border: 1px solid #ECECEC;
  height: 30px;
  color: #959595;
  line-height: 30px;
  padding: 0px 7px;
  color: black;
  -moz-appearance: menulist;
  -webkit-appearance: menulist;
}
.default-list-style .list-row--add_row select:hover,
.default-list-style .list-row--add_row select:focus {
  color: #000000;
  border-color: #EBEBEB;
}
.default-list-style .list-row--add_row select::-ms-expand {
  display: inline-block;
}
.default-list-style .list-row--add_row .action-add {
  margin-left: 0;
  margin-top: 6px;
  visibility: hidden;
}
.default-list-style .list-row--add_row .action-add--disabled {
  color: gray;
  cursor: pointer;
}
.default-list-style .list-row--add_row:hover {
  background-color: #f2fafe;
}
.default-list-style .list-row--add_row:hover .action-add {
  visibility: visible;
}
.default-list-style .list-row--focused .action-add {
  visibility: visible;
}
.default-list-style .list-row--focused--add_row select,
.default-list-style .list-row--focused--add_row input {
  border-color: #109FE9;
}
.default-list-style .list-row--focused--add_row select:focus,
.default-list-style .list-row--focused--add_row input:focus,
.default-list-style .list-row--focused--add_row select:hover,
.default-list-style .list-row--focused--add_row input:hover {
  border-color: #109FE9;
}
.default-list-style .list-row-cell-date {
  display: flex;
  flex-direction: row;
  flex: 1 0 auto;
  justify-content: flex-end;
}
.default-list-style .list-row-cell-date .list-row-cell-date-day {
  text-align: right;
}
.default-list-style .list-row-cell-date .list-row-cell-date-date {
  margin-left: 7px;
  text-align: right;
}
.waiterView {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
  display: flex;
  background-color: #F5F5F5;
  opacity: 0.3;
  z-index: 100;
}
.waiterView > div {
  margin: auto;
  font-size: 50px;
}
.fullOptionsWidth {
  width: 170px !important;
}
#cntFilter {
  height: calc(100% - 49px);
}
#cntList {
  height: calc(100% - 49px);
  margin-left: 15px;
  margin-top: 5px;
}
#cntEdit {
  height: calc(100% - 49px);
  flex: 1;
  overflow: auto;
  margin-left: 15px;
  padding-right: 10px;
}
#layout_content {
  position: absolute;
  width: 100%;
  height: calc(100% - 73px);
}
#layout_content #cntContent {
  display: flex;
  flex-direction: row;
  padding-bottom: 0;
}
#layout_content {
  margin: 0;
  display: flex;
  flex-direction: row;
  font-size: 0;
}
#layout_content div,
#layout_content input,
#layout_content textarea,
#layout_content select,
#layout_content a/* mvl include a for when it is made a block level element*/ {
  box-sizing: border-box;
}
#layout_content #cntContent {
  flex: 1;
}
#layout_content #cntContent #cntList .actions {
  background-color: #dddddd;
  overflow: hidden;
  position: fixed;
  bottom: 0;
  height: 50px;
  padding: 10px;
  padding-left: 15px;
  left: 200px;
  right: 0;
  transition: left 0.2s linear;
}
#layout_content .planning-button {
  cursor: pointer;
  padding: 4px 7px 0 7px;
  height: 30px;
  color: black;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  border: 1px solid #109FE9;
  display: inline-block;
  color: white;
  background-color: #109FE9;
  vertical-align: top;
  -webkit-user-select: none;
  /* Safari */
  -moz-user-select: none;
  /* Firefox */
  -ms-user-select: none;
  /* Internet Explorer/Edge */
  user-select: none;
  /* Non-prefixed version, currently */

}
#layout_content .planning-button i {
  margin-right: 3px;
}
#layout_content .planning-button:hover {
  background-color: #0C7CB6;
}
#layout_content .planning-button:active {
  background-color: #09618E;
}
#planning_tabbar {
  height: 32px;
  background-color: #109FE9;
  background-position: left bottom;
  background-repeat: repeat-x;
  margin: -1px 0px 10px 0px;
  margin: -1px 0px 0px 0px;
  padding-left: 190px;
}
#planning_tabbar .tabitem {
  font-family: "Open Sans";
  font-weight: 600;
  float: left;
  height: 27px;
  width: 148px;
  padding-top: 5px;
  margin-left: 10px;
  margin-top: 0px;
  text-align: center;
  font-size: 90%;
  line-height: 23px;
  color: #ffffff;
  cursor: pointer;
  text-decoration: none;
  border-top-left-radius: 2px;
  border-top-right-radius: 2px;
}
#planning_tabbar .tabitem:hover {
  text-decoration: underline;
}
#planning_tabbar .hometab {
  height: 27px;
  width: 40px;
}
#planning_tabbar .tabitem_active,
#planning_tabbar .tabitem_active:hover {
  float: left;
  background-color: white;
  text-decoration: none;
  color: black;
  cursor: pointer;
}
#planning_tabbar .tabitem_active .fa-home,
#planning_tabbar .tabitem_active:hover .fa-home {
  color: #109FE9;
}
#cntContent {
  padding: 0 !important;
}
#cntContent .start-page-container {
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 100%;
}
#cntContent .start-page-container .workers-header {
  flex: 0 0 28px;
  background-color: #4d4274;
  color: white;
  line-height: 28px;
  padding-left: 15px;
  border-left: 1px solid white;
}
#cntContent .start-page-container .actions-button {
  width: 140px;
  margin: 5px 10px;
}
#cntContent .start-page-container .workers-start-container {
  width: 100%;
  overflow: auto;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(208px, 1fr));
}
#cntContent .start-page-container .workers-start-container .worker-photo-container {
  margin: 10px;
  height: 240px;
  width: 180px;
}
#cntContent .start-page-container .workers-start-container .worker-photo-container .employee-name {
  font-size: 15px !important;
  color: #109fe9;
  text-align: center;
  margin-top: 4px;
}
#cntContent .start-page-container .workers-start-listStyle {
  width: 100%;
  overflow: auto;
  display: flex;
  flex-flow: column wrap;
}
#cntContent .start-page-container .workers-start-listStyle .worker-list-container {
  margin: 10px;
  height: 30px;
  width: 180px;
}
#cntContent .start-page-container .workers-start-listStyle .worker-list-container .employee-name {
  font-size: 15px !important;
  color: #109fe9;
  text-align: center;
  margin-top: 4px;
}
#cntContent .timer-container {
  flex: 0 0 30px;
  font-size: 15px !important;
  color: #B5344C;
}
#cntContent .timer-container .timer-seconds {
  font-size: 17px !important;
}
#cntContent .back-to-list {
  border: 0;
  border-radius: 5px;
  width: 180px;
  flex: 0 0 30px;
  color: white;
  background-color: #109FE9;
  box-shadow: 1px 2px 2px #0000001A;
}
#cntContent .back-to-list:hover {
  background-color: #4fb8ed;
  cursor: pointer;
}
.employee-thumbnail-container {
  margin: 0 auto;
  display: block;
}
.employee-thumbnail-container:hover {
  cursor: pointer;
}
.employee-thumbnail {
  display: block;
  border: 1px solid white;
}
.birthday-thumbnail {
  position: relative;
  left: 1px;
}
.select-employee-thumbnail {
  height: 15px;
  width: 12px;
  border: 1px solid white;
  margin: 5px 15px 0 0;
}
.shift-text-block {
  display: flex;
  flex-direction: row;
  font-family: 'Open Sans' !important;
  flex: 1;
}
.shift-text-block .end-reason {
  font-style: italic;
  margin: 0 5px;
}
.confetti-container {
  display: flex;
  flex-direction: row;
  position: fixed;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.page-content-container {
  display: flex;
  flex-direction: row;
  height: 100%;
  width: 100%;
}
.page-content-container .far {
  float: left;
  margin: 3px 0 0 3px;
}
.page-content-container .page-workers-container {
  display: flex;
  flex-direction: column;
  background-color: #F5F5F5;
  padding: 5px 0 0 5px;
}
.page-content-container .page-workers-container .workers-title {
  color: #109FE9;
  font-size: 15px !important;
  margin: 10px;
}
.page-content-container .page-workers-container .workers-container {
  width: 265px;
  overflow: auto;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(68px, 1fr));
  height: 50%;
}
.page-content-container .page-workers-container .workers-container .worker-photo-container {
  margin: 10px;
  height: 110px;
  width: 70px;
}
.page-content-container .page-workers-container .workers-container .worker-photo-container .employee-name {
  text-align: center;
}
.page-content-container .page-active-worker-container {
  display: flex;
  flex-direction: column;
  flex: 1 0 1120px;
  margin-top: 20px;
}
.page-content-container .page-active-worker-container .page-active-worker-content {
  display: flex;
  flex-direction: column;
  margin-left: 20px;
}
.page-content-container .page-active-worker-container .active-worker-title,
.page-content-container .page-active-worker-container .active-worker-subtitle {
  color: #109FE9;
  font-size: 15px !important;
  margin: 15px 0;
}
.page-content-container .page-active-worker-container .active-worker-title .active-worker-startday,
.page-content-container .page-active-worker-container .active-worker-subtitle .active-worker-startday,
.page-content-container .page-active-worker-container .active-worker-title .active-worker-startmachine,
.page-content-container .page-active-worker-container .active-worker-subtitle .active-worker-startmachine {
  font-size: 17px !important;
}
.page-content-container .page-active-worker-container .worker-schedule-container {
  height: 120px;
  overflow: auto;
  position: relative;
}
.page-content-container .page-active-worker-container .worker-schedule-time,
.page-content-container .page-active-worker-container .worker-container {
  display: flex;
  flex-direction: row;
}
.page-content-container .page-active-worker-container .worker-container {
  margin-left: 4px;
}
.page-content-container .page-active-worker-container .worker-schedule-time .shift {
  flex: 0 0 78px;
  padding-top: 8px;
}
.page-content-container .page-active-worker-container .worker-schedule-time .shift-unavailable {
  flex: 0 0 78px;
  padding-top: 8px;
}
.page-content-container .page-active-worker-container .worker-schedule-time .shift:last-of-type,
.page-content-container .page-active-worker-container .worker-schedule-time .shift-unavailable:last-of-type {
  flex: 0;
}
.page-content-container .page-active-worker-container .worker-schedule-time .time-pointer {
  margin-left: 12px;
}
.page-content-container .shift-pauses-start-container {
  margin-top: 50px;
  display: flex;
  flex-direction: row;
}
.page-content-container .shift-pauses-start-container .shift-pauses-container {
  display: flex;
  flex-direction: column;
  flex: 0 0 100px;
}
.page-content-container .shift-pauses-start-container .shift-pauses-container .shift-pause-header {
  color: #109FE9;
  margin-bottom: 10px;
}
.page-content-container .shift-pauses-start-container .shift-pauses-container .shift-pause {
  color: #9F9F9F;
}
.page-content-container .shift-start-container,
.page-content-container .shift-signedin-container {
  height: 90px;
  flex: 1;
  padding: 7px;
  box-shadow: 0px 0.75px 6px #00000029;
}
.page-content-container .shift-signedin-container {
  display: flex;
  flex-direction: column;
  height: 150px;
  border: 1px solid #0ECB62;
  background-color: #E5F9EE;
  color: #0ECB62;
  flex: 0 0 1000px;
}
.page-content-container .shift-start-container {
  display: flex;
  flex-direction: column;
  height: 150px;
  border: 1px solid #B5344C;
  background-color: #F7E9EC;
  flex: 0 0 1000px;
}
.page-content-container .input-remark {
  flex: 2;
  resize: none;
}
.page-content-container .shift-start-block {
  display: flex;
  flex-direction: row;
  color: #B5344C;
  font-family: 'Open Sans' !important;
  flex: 1;
}
.page-content-container .shift-start-block .current-time,
.page-content-container .shift-start-block .first-shift-start,
.page-content-container .shift-start-block .last-shift-end {
  font-size: 17px !important;
  margin: -3px 5px 0 5px;
}
.page-content-container .shift-start-buttons,
.page-content-container .shift-end-buttons {
  display: flex;
  flex-direction: row;
}
.page-content-container .button-footer-container {
  display: flex;
  flex-direction: row;
  background-color: #DDDDDD;
  margin-top: auto;
  flex: 0 0 72px;
  width: 100%;
  padding: 24px 19px;
}
.page-content-container .button-footer-container .button-footer-container-left {
  flex: 1;
}