.gantt-chart .x.axis g text {
  font-size: 10px !important;
}

.gantt-chart g text {
  font-size: 10px;
}

.gantt-chart g.tick text {
  font-size: 12px;
}

.icon-offset::before {
  content: "calendar_today";
}

.panda_roster_container .sidebar-opened.roster>.alert-flash {
  margin-left: 315px;
}

.panda_roster_container .sidebar-opened.roster>.alert {
  margin-left: 315px;
}

.scrollable-group {
  margin-right: 5px;
}

.scrollable-dropdown {
  padding: 0;
}

.scrollable-ul {
  max-height: calc(80vh - 6rem);
  overflow-y: auto !important;
  overflow-x: hidden !important;
  margin: 0;
  padding: 5px 0;
}

.scrollable-ul>li {
  position: static;
}

.scrollable-ul>li>a {
  display: block;
  padding: 3px 20px;
  clear: both;
  font-weight: 400;
  line-height: 18px;
  color: #3C4754;
  white-space: nowrap;
}

.scrollable-ul.divider {
  height: 1px;
  margin: 8px 1px;
  overflow: hidden;
  background-color: #CAD2DE;
  border-bottom: 1px solid #FFFFFF;
}

.btn-toolbar {
  margin-top: 8px;
}

.pull-left>.btn-toolbar {
  margin-left: 22px;
}

.sidebar-opened .roster-toolbar .pull-left>.btn-toolbar {
  margin-left: 18rem;
}

.roster-toolbar .pull-left>.btn-toolbar {
  margin-left: 4.5rem;
}

.roster-toolbar {
  margin-top: 0;
  padding: 11px 16px;
}

.roster-toolbar .mi {
  color: #708093;
}

.roster-toolbar .send-icon.mi {
  color: #FFFFFF;
}

.roster-toolbar .save-publish-wrap {
  display: inline-block;
}

.roster-toolbar .btn-save+.btn,.roster-toolbar .btn-generate,.roster-toolbar .btn-publish,.roster-toolbar .btn-autofill {
  margin-left: 10px;
}

.roster-toolbar .btn-add {
  margin-left: 14px;
  margin-right: 15px;
}

.roster-toolbar .btn-add+.dropdown-menu {
  min-width: 140px;
}

.panda_roster_container>.alert-flash {
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  margin-top: 20px;
  margin-right: 15px;
  margin-left: 315px;
}

.panda_roster_container {
  width: 100%;
}

.panda_roster_container .dropdown-menu .hotkey_shortcut {
  float: right;
  font-size: 70%;
}

.panda_roster_container .dropdown-menu a {
  cursor: pointer;
}

.panda_roster_container.inline-display {
  margin-top: 0 !important;
}

.panda_roster_container .roster>.alert {
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  margin: 15px 15px 0 50px;
}

.panda_roster_container .panda_roster {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
}

.panda_roster_container .panda_roster .roster-block.roster-block-day-view {
  background: #F0F2F5;
}

.panda_roster_container .panda_roster .emulate-btn-inside-btn-group {
  text-shadow: none;
  background-image: none;
  border: solid 1px #CAD2DE;
  border-bottom: solid 3px #DAE0E8;
  padding: 8px 14px;
  font-size: 14px;
  line-height: 14px;
}

.panda_roster_container .panda_roster .emulate-btn-inside-btn-group:first-child {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.panda_roster_container .panda_roster .emulate-btn-inside-btn-group.active {
  border: solid 1px #2795bc;
  box-shadow: inset 0 0 7px #2384a7;
  background-color: #3FAFD7;
  color: #FFFFFF;
}

.panda_roster_container .panda_roster .emulate-btn-inside-btn-group.active .mi-lock {
  color: #FFFFFF;
}

.panda_roster_container .panda_roster .dropdown-menu.with-sub {
  overflow: visible;
}

.panda_roster_container .panda_roster .roster-date:not(.btn) {
  cursor: pointer;
}

.panda_roster_container .stat-panel+.stat-panel {
  margin-left: 5px;
}

.panda_roster_container .stat-panel.autosize {
  width: auto;
  float: left;
  line-height: 28px !important;
  margin-top: 0;
  margin-bottom: 0;
}

.panda_roster_container .stat-panel.autosize .info {
  text-align: left;
  float: left;
  padding: 2px 15px;
  border-color: #BAC5D4;
  border-top-left-radius: 3px;
  border-bottom-left-radius: 3px;
}

.panda_roster_container .stat-panel.autosize .stat {
  white-space: nowrap;
  float: right;
  padding: 2px 8px;
  border-color: #BAC5D4;
  font-size: 13px;
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
}

.panda_roster_container .stat-panel.autosize .stat>.inline-input-disabled {
  font-weight: 800;
  margin-bottom: 3px;
}

.panda_roster_container .stat-panel.autosize+.panda_roster_container .stat-panel.autosize {
  margin-left: 5px;
}

.panda_roster_container .emulate-btn-inside-btn-group {
  padding: 5px 10px;
  border: 1px solid #BAC5D4;
}

.panda_roster_container .sidebar.opened {
  -ms-transform: translateX(0);
  -webkit-transform: translateX(0);
  transform: translateX(0);
}

.panda_roster_container .sidebar {
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  -ms-transform: translateX(-217px);
  -webkit-transform: translateX(-217px);
  transform: translateX(-217px);
  border-right: 4px solid #CAD2DE;
  position: fixed;
  width: 265px;
  z-index: 500;
  top: 39px;
  bottom: 0;
}

.panda_roster_container .sidebar .open-nav {
  display: none;
}

.panda_roster_container .sidebar .closed-nav {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-direction: normal;
  -webkit-box-orient: vertical;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: end;
  -ms-flex-align: end;
  -webkit-align-items: flex-end;
  -moz-align-items: flex-end;
  align-items: flex-end;
  width: 100%;
  height: 100%;
}

.panda_roster_container .sidebar .closed-nav a,.panda_roster_container .sidebar .closed-nav a:hover,.panda_roster_container .sidebar .closed-nav a:visited,.panda_roster_container .sidebar .closed-nav a:link,.panda_roster_container .sidebar .closed-nav a:active,.panda_roster_container .sidebar .closed-nav .nav-icon-link-text {
  text-decoration: none !important;
  text-decoration-color: transparent;
}

.panda_roster_container .sidebar .closed-nav .nav-icon-container {
  cursor: pointer;
  padding-bottom: 0.8rem;
  width: 3rem;
  height: 3rem;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-direction: normal;
  -webkit-box-orient: vertical;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
}

.panda_roster_container .sidebar .closed-nav .nav-icon-container.closed-nav-filter {
  padding-bottom: 1.55rem;
}

.panda_roster_container .sidebar .closed-nav .nav-icon-container .nav-icon {
  transition: color 0.1s ease-in-out;
  font-size: 1.375rem;
  color: #8A9BAE;
}

.panda_roster_container .sidebar .closed-nav .nav-icon-container .roster-nav-text,.panda_roster_container .sidebar .closed-nav .nav-icon-container .roster-nav-beta-tag {
  hyphens: auto;
  line-height: 0.75rem;
  padding: 0.125rem 0;
  text-align: center;
  word-break: break-all;
  word-break: break-word;
}

.panda_roster_container .sidebar .closed-nav .nav-icon-container .roster-nav-text,.panda_roster_container .sidebar .closed-nav .nav-icon-container .roster-nav-beta-tag,.panda_roster_container .sidebar .closed-nav .nav-icon-container .closed-nav-filter-text {
  transition: color 0.1s ease-in-out;
  font-size: 0.75rem;
  color: #708093;
}

.panda_roster_container .sidebar .closed-nav .nav-icon-container .roster-nav-beta-tag {
  padding: 0.125rem 0.25rem;
  border-radius: 0.25rem;
  color: #FFFFFF;
  background-color: #8A9BAE;
}

.panda_roster_container .sidebar .closed-nav .nav-icon-container.roster-date-current .nav-icon,.panda_roster_container .sidebar .closed-nav .nav-icon-container.filter-active .nav-icon,.panda_roster_container .sidebar .closed-nav .nav-icon-container:not(.roster-date-current):hover:active .nav-icon {
  color: #3FAFD7;
}

.panda_roster_container .sidebar .closed-nav .nav-icon-container.roster-date-current .roster-nav-text,.panda_roster_container .sidebar .closed-nav .nav-icon-container.roster-date-current .closed-nav-filter-text,.panda_roster_container .sidebar .closed-nav .nav-icon-container.filter-active .roster-nav-text,.panda_roster_container .sidebar .closed-nav .nav-icon-container.filter-active .closed-nav-filter-text,.panda_roster_container .sidebar .closed-nav .nav-icon-container:not(.roster-date-current):hover:active .roster-nav-text,.panda_roster_container .sidebar .closed-nav .nav-icon-container:not(.roster-date-current):hover:active .closed-nav-filter-text {
  color: #329DC7;
}

.panda_roster_container .sidebar .closed-nav .nav-icon-container .closed-nav-filter-text {
  line-height: 0.75rem;
}

.panda_roster_container .sidebar .closed-nav .nav-icon-container.filter-active .closed-nav-filter-text {
  color: #3FAFD7;
  font-weight: 700;
}

.panda_roster_container .sidebar .closed-nav .nav-icon-container:not(.roster-date-current):not(.filter-active):hover .nav-icon {
  color: #536171;
}

.panda_roster_container .sidebar .closed-nav .nav-icon-container:not(.roster-date-current):not(.filter-active):hover .roster-nav-text,.panda_roster_container .sidebar .closed-nav .nav-icon-container:not(.roster-date-current):not(.filter-active):hover .closed-nav-filter-text {
  color: #3C4754;
}

.panda_roster_container .sidebar .closed-nav .nav-icon-container:not(.roster-date-current):not(.filter-active):hover .roster-nav-beta-tag {
  background-color: #3C4754;
}

.panda_roster_container .sidebar .sidebar_column {
  min-height: inherit;
  overflow-y: auto;
  overflow-x: hidden;
  height: 100%;
}

.panda_roster_container .sidebar .mi-add {
  position: relative;
  float: right;
  top: -1px;
}

.panda_roster_container .sidebar .inline-icon {
  padding-right: 0.25rem;
  color: #536171;
}

.panda_roster_container .sidebar .roster-date-current .inline-icon {
  color: #FFFFFF;
}

.panda_roster_container .sidebar .cell {
  width: 8px;
  height: 8px;
  display: inline-block;
  border: 1px solid rgba(0,0,0,0.3);
}

.panda_roster_container .sidebar h4 {
  font-weight: 700;
  font-size: 13px;
  margin-bottom: 5px;
  padding-bottom: 6px;
  border-bottom: 1px solid #CAD2DE;
  color: #3C4754;
}

.panda_roster_container .sidebar h4 span {
  text-transform: lowercase;
}

.panda_roster_container .sidebar h4 a {
  font-weight: 400;
}

.panda_roster_container .sidebar .add {
  color: #8A9BAE;
  font-size: 10px;
  float: right;
}

.panda_roster_container .sidebar .row-filter-shifts-heading {
  padding-bottom: 0;
}

.panda_roster_container .sidebar .sidebar_content {
  position: relative;
  padding-top: 17px;
}

.panda_roster_container .sidebar .accordion-group {
  border: 1px solid #BAC5D4;
  border-radius: 3px;
  background-color: #FFFFFF;
}

.panda_roster_container .sidebar .accordion-group .accordion-heading a {
  color: #3C4754;
}

.panda_roster_container .sidebar .filter-group {
  max-height: 300px;
  overflow: auto;
}

.panda_roster_container .sidebar .filter-group label {
  margin-bottom: 0;
}

.panda_roster_container .sidebar .filter-group .radio,.panda_roster_container .sidebar .filter-group .checkbox {
  line-height: 21px;
  font-size: 12px;
}

.panda_roster_container .sidebar .toggle_btn {
  background-color: #3FAFD7;
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
  box-sizing: border-box;
  height: 33px;
  margin: 6px 0 0 12px;
  padding: 6px 4px 6px 2px;
  position: absolute;
  right: -30px;
  top: 14px;
  width: 26px;
}

.panda_roster_container .sidebar .toggle_btn i {
  color: #FFFFFF;
}

.panda_roster_container .sidebar .toggle_btn:hover {
  background-color: #5EC5EB;
}

.panda_roster_container .sidebar.opened .open-nav {
  display: block;
}

.panda_roster_container .sidebar.opened .closed-nav {
  display: none;
}

.panda_roster_container .sidebar.opened .toggle_btn {
  background-color: #CAD2DE;
}

.panda_roster_container .sidebar.opened .toggle_btn i {
  color: #3C4754;
  margin-left: 0;
}

.panda_roster_container .sidebar.opened .toggle_btn:hover {
  background-color: #BAC5D4;
}

@media (max-width: 1000px) {
  .panda_roster_container .sidebar.opened .toggle_btn {
    background-color: #3FAFD7;
  }

  .panda_roster_container .sidebar.opened .toggle_btn i {
    color: #FFFFFF;
  }

  .panda_roster_container .sidebar.opened .toggle_btn:hover {
    background-color: #5EC5EB;
  }
}

.panda_roster_container .form-actions {
  margin-top: 8px;
  margin-bottom: 6px;
  border-top: 0;
}

.panda_roster_container .form-actions .help-guide {
  margin-top: 10px;
}

.table-bordered.rosters-table-no-border {
  border-top: 0;
}

.table-bordered.rosters-table-no-border th:first-child,.table-bordered.rosters-table-no-border td:first-child {
  border-left: 0;
}

.staff-view>table {
  table-layout: fixed;
}

.roster-canvas {
  overflow-y: auto;
  padding-right: 2px;
  padding-top: 0.0625rem;
  margin-top: -1px;
  padding-left: 3.25rem;
  margin-left: 5px;
}

.sidebar-opened .roster-canvas {
  padding-left: 269px;
}

@media (max-width: 1000px) {
  .sidebar-opened .roster-canvas {
    padding-left: 0;
  }
}

.roster-canvas .week-view,.roster-canvas .shifts-view {
  padding-top: 0.25rem;
}

.roster-canvas .shifts-view {
  padding-bottom: 4rem;
}

.roster-canvas .day-view {
  padding-top: 0.75rem;
}

.roster-canvas .roster-costs {
  padding-top: 2rem;
}

.roster-canvas .table-bordered.rosters-table-no-border {
  margin-left: -5px;
}

.roster-canvas .table-bordered.rosters-table-no-border th:first-child,.roster-canvas .table-bordered.rosters-table-no-border td:first-child {
  padding-left: 5px;
}

.roster-canvas .add-user-input {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  border: 1px solid #CAD2DE;
  border-radius: 3px;
}

.roster-canvas .add-user-input .add-user {
  width: 100%;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  line-height: 21px;
  flex: 1;
}

.roster-canvas .add-user-input .picker-parent {
  -webkit-box-direction: normal;
  -webkit-box-orient: vertical;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
}

@media (max-width: 1200px) {
  .roster-canvas .add-user-input .picker-parent {
    width: 1.75rem;
  }
}

.roster-canvas .add-user-input .colorPicker-picker {
  -webkit-box-flex: 1;
  -webkit-flex-grow: 1;
  -moz-flex-grow: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  -webkit-box-direction: normal;
  -webkit-box-orient: vertical;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  justify-content: center;
  border: 0;
  color: #3C4754;
  height: 100%;
  width: 2rem;
}

.roster-canvas .add-user-input .colorPicker-picker.light {
  color: #CAD2DE;
}

.roster-canvas #roster-table-area .add-user-input {
  border: none;
  border-left: 0.125rem solid #CAD2DE;
  border-bottom: 0.125rem solid #CAD2DE;
  border-bottom-left-radius: 0.25rem !important;
}

.roster-canvas .add-vacant-user-input .btn-vacant-user {
  color: #3FAFD7 !important;
  margin-top: 5px;
  margin-left: 5px;
  font-weight: 700 !important;
  opacity: 1 !important;
  font-size: 13px !important;
}

.roster-canvas .add-vacant-user-input .btn-vacant-user:hover {
  text-decoration: none !important;
  color: #69c1e0 !important;
  cursor: pointer;
}

.roster-canvas .add-vacant-user-input .btn-vacant-user::before {
  font-family: 'Material Icons';
  font-feature-settings: "liga" 1;
  -webkit-font-feature-settings: "liga" 1;
  -ms-font-feature-settings: "liga" 1;
  font-variant-ligatures: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-style: normal;
  font-weight: 500;
  content: "add";
  margin-right: 5px;
}

.roster-canvas .empty-state {
  border-radius: 3px;
  border: 1px dashed #329DC7;
  color: #3FAFD7;
  font-size: 11px;
  padding: 3px 30px;
  margin: 10px 3px 5px;
}

.roster-canvas .empty-state.filter-day {
  background: #FAF8C8;
  border: 1px dashed #D5D16D;
  color: #BAB53D;
}

.roster-canvas .empty-state.filter-none {
  background: #F9C1C1;
  border: 1px dashed #D85252;
  color: #D74E4E;
}

.roster-canvas .empty-state.filter-none span {
  padding: 6px 0;
  font-size: 13px;
}

.roster-canvas .empty-state span {
  display: block;
  text-align: center;
  line-height: 13px;
  padding: 3px 0;
}

.roster-canvas .no-weekend .list {
  width: 20% !important;
}

.roster-canvas .roster-costs {
  padding: 40px;
  padding-top: 20px;
}

.roster-canvas .roster-costs table tr.user-cost,.roster-canvas .roster-costs table tr.date-cost {
  cursor: pointer;
}

.roster-canvas .roster-costs table th:first-child {
  min-width: 38px;
}

.roster-canvas .roster-costs table .caret.caret-right {
  float: right;
  position: relative;
  top: 7px;
}

.roster-canvas .roster-costs table .caret.caret-left {
  float: left;
  position: relative;
  top: 7px;
}

.roster-canvas .roster-costs table .caret.caret-inverted {
  border-top: none;
  border-bottom: 4px solid #000;
}

.roster-canvas .roster-costs table span.bar-span {
  width: 75%;
  height: 8px;
  margin: 6px 4px 4px;
  float: right;
  overflow: hidden;
  min-height: inherit;
}

.view {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: flex-start;
  -webkit-align-items: flex-start;
  -moz-box-align: flex-start;
  -ms-flex-align: flex-start;
  align-items: flex-start;
}

.view .list {
  padding: 0;
  border-radius: 3px;
  margin-left: 2px;
  margin-right: 2px;
  height: auto;
  background-color: #FFFFFF;
  width: calc(14.28% - 4px);
}

.view .list .day-dropdown-left {
  left: -100px;
}

.view .list .schedules {
  min-height: 25px;
}

.view .list .schedules .add-user-divider {
  height: 2px;
  width: 100%;
  display: block;
  background-color: #329DC7;
  margin: 10px 0 4px;
}

.view .list:nth-child(even) {
  background-color: #FFFFFF;
}

#d3-tooltip {
  background: #CAD2DE;
  box-shadow: 0 0 5px #8A9BAE;
  color: #3C4754;
  font-size: 12px;
  left: 130px;
  padding: 10px;
  position: absolute;
  text-align: center;
  top: 95px;
  width: 160px;
  z-index: 10;
}

.panda_roster_container {
  width: 100%;
}

.panda_roster .toolbar .space-left {
  margin-left: 40px;
}

.panda_roster .roster-toolbar.widget {
  margin-top: -17px;
  border-left: 0;
  border-right: 0;
  box-shadow: none;
}

.panda_roster .roster-tools-btn-group .dropdown-menu li span {
  display: block;
  padding: 3px 20px;
  clear: both;
  line-height: 18px;
  color: #333;
  white-space: nowrap;
}

.panda_roster .roster-tools-btn-group .dropdown-menu li span:hover {
  background-color: rgba(0,0,0,0.2) !important;
  color: #fff !important;
}

.panda .widget .block.roster-block {
  border-top: none;
}

#collapseRosterHelptext {
  margin-left: 87px;
  margin-right: 15px;
  margin-bottom: 0;
  transition: margin-left 0.3s ease-in-out;
}

.sidebar-opened #collapseRosterHelptext {
  margin-left: 304px;
}

.edit-shift-groups-link {
  color: #3FAFD7;
  font-weight: 700;
}

.edit-shift-groups-link:hover,.edit-shift-groups-link:active {
  color: #3FAFD7;
  font-weight: 700;
  text-decoration: none;
}

.custom-events-container {
  display: flex;
}

.custom-events-container .nav {
  margin-right: 0;
}

.custom-events-container .custom-event-icon-container {
  align-items: flex-end;
}

.custom-events-container span {
  padding: 0 0.01rem;
  vertical-align: middle;
}

.custom-events-container span.custom-event-icon {
  display: flex;
  align-items: center;
  color: #3FAFD7;
  font-size: 1rem;
  padding: 0 0.125rem;
  padding-top: 1px;
}

@media (max-width: 1600px) {
  .custom-events-container span.custom-event-icon {
    font-size: 0.8rem;
  }
}

.custom-events-container .discourage-time-off-icon {
  color: #536171;
  font-size: 1rem;
  padding: 0 0.125rem;
  padding-bottom: 1px;
  display: flex;
  align-items: center;
  padding-right: 0.3em;
}

@media (max-width: 1600px) {
  .custom-events-container .discourage-time-off-icon {
    font-size: 0.8rem;
  }
}

.custom-events-container .dropdown-menu {
  left: -9px;
  top: 20px;
  text-align: left;
}

.custom-events-container .dropdown-menu .menu-header {
  padding: 0 1.5em;
}

.custom-events-container .dropdown-menu .ce-item {
  display: flex;
  padding: 0.1em 0;
}

.custom-events-container .dropdown-menu .ce-item:hover {
  background-color: #3FAFD7;
}

.custom-events-container .dropdown-menu .ce-item:hover span,.custom-events-container .dropdown-menu .ce-item:hover a {
  color: #FFFFFF;
}

.custom-events-container .dropdown-menu .ce-item .discourage-time-off-icon {
  padding-left: 1.3em;
}

.custom-events-container .dropdown-menu .ce-item a {
  padding: 0;
  width: 115px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.add-user {
  min-height: 30px;
}

.colorPicker-palette {
  min-width: 156px;
  position: absolute;
  padding: 0;
  background: #fff;
  border-radius: 3px;
  height: auto;
  border: 1px solid #ccc;
  max-height: 250px;
  overflow: hidden;
  z-index: 998;
}

.colorPicker-palette .list-wrap {
  max-height: 221px;
  overflow-y: auto;
}

.colorPicker-palette .colorPicker-item {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  cursor: pointer;
}

.colorPicker-palette .colorPicker-item.disabled {
  cursor: not-allowed;
  background-color: #cecece;
  color: #4d4d4d;
}

.colorPicker-palette .colorPicker-item.disabled:hover {
  background-color: none;
}

.colorPicker-palette .colorPicker-item.highlight {
  background-color: #3095d2;
}

.colorPicker-palette .colorPicker-item.highlight .colorPicker-swatch-title {
  color: #fff;
}

.colorPicker-palette .colorPicker-swatch,.colorPicker-palette .colorPicker-rates {
  height: auto;
  min-height: 25px;
  margin: 0;
  border: 0;
  border-right: 1px solid #cecece;
  background: #F9F9F9;
  box-sizing: border-box;
  padding: 8px 0px;
}

.colorPicker-palette .colorPicker-swatch {
  min-width: 33px;
  width: 30px;
  color: #353535;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-direction: normal;
  -webkit-box-orient: vertical;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  justify-content: center;
  -webkit-align-content: center;
  -moz-align-content: center;
  -ms-flex-line-pack: center;
  align-content: center;
}

.colorPicker-palette .colorPicker-swatch.light {
  color: #d8d8d8;
}

.colorPicker-palette .colorPicker-swatch .icon {
  margin: 0 auto;
}

.colorPicker-palette .colorPicker-rates {
  padding-top: 6px;
  font-size: 10px;
  color: #666666;
  width: 38px;
  min-width: 38px;
  text-align: center;
}

.colorPicker-palette .base-rate {
  font-weight: bold;
  padding-top: 3px;
  display: inline-block;
}

.colorPicker-palette .colorPicker-swatch-title {
  padding-left: 5px;
  width: 100%;
  font-size: 10px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-direction: normal;
  -webkit-box-orient: vertical;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  justify-content: center;
  -webkit-align-content: center;
  -moz-align-content: center;
  -ms-flex-line-pack: center;
  align-content: center;
}

.colorPicker-palette .colorPicker-seperator {
  cursor: default;
  background-color: #f9f9f9;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  padding: 5px 0px 5px 13px;
}

.colorPicker-palette .colorPicker-seperator.location-icon:before {
  font-family: 'Material Icons';
  font-feature-settings: "liga" 1;
  -webkit-font-feature-settings: "liga" 1;
  -ms-font-feature-settings: "liga" 1;
  font-variant-ligatures: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-style: normal;
  font-weight: 500;
  content: "place";
  font-size: 13px;
  margin-right: 10px;
}

.colorPicker-palette .search-picker {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 0;
}

.colorPicker-palette .search-picker .add-on {
  border-radius: 0 !important;
  border-left: 0 !important;
  width: 32px !important;
  min-width: 25px;
  height: 20px;
  border-top: 1px solid transparent !important;
}

.colorPicker-palette .search-picker .search-picker-input {
  width: 100%;
  height: 21px !important;
  border-radius: 0 !important;
  border-right: 0 !important;
  border-top: 1px !important;
}

@media print {
  #dev-widget-bar {
    display: none;
  }

  .panda_roster_container .list-day-group {
    text-shadow: none !important;
    color: #000 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .panda_roster_container .list-day-group * {
    text-shadow: none !important;
    color: #000 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .panda_roster_container .panda-schedule {
    text-shadow: none !important;
    color: #000 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .panda_roster_container .add-user-divider {
    text-shadow: none !important;
    color: #000 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .panda_roster_container .boxed-time {
    text-shadow: none !important;
    color: #000 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .panda_roster_container .boxed-time * {
    text-shadow: none !important;
    color: #000 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .panda_roster_container .roster-costs .costs-by-day {
    text-shadow: none !important;
    color: #000 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .panda_roster_container .roster-costs .costs-by-day * {
    text-shadow: none !important;
    color: #000 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  #selector {
    display: none !important;
  }@  page {
    margin: 10mm 2mm 2mm 2mm;
  }

  .roster-canvas .roster-costs {
    padding: 0px;
  }

  .list-day-group {
    margin-left: 10px;
  }

  .list-day-group * {
    border: none;
  }

  .list-day-group .special-header-link {
    display: none;
  }

  .list-day-group .list-day-header:last-of-type {
    border: none;
  }

  .sidebar-opened .list-day-group {
    padding-left: 0px;
  }

  .list-day-group.is-day-view .list-day-header {
    display: none;
  }

  .list-day-group.is-day-view .list-day-header.active-day {
    display: flex;
    border: none;
  }

  .roster-block,.roster-canvas {
    position: static;
    max-width: 100% !important;
    min-height: calc(100% - 100px) !important;
    max-height: none !important;
    will-change: auto;
    margin-top: 3px;
    margin-right: 0px !important;
    padding-right: 0px !important;
    overflow: visible !important;
  }

  .sidebar-opened .roster-block,.sidebar-opened .roster-canvas {
    padding-left: 0px;
  }

  * ::-webkit-scrollbar {
    display: none;
  }

  * {
    -ms-overflow-style: -ms-autohiding-scrollbar;
  }

  .sidebar.opened {
    display: none;
  }

  .roster-block>.roster-canvas {
    padding: 0;
  }

  .page_roster.subtle {
    margin-bottom: 0;
  }

  .panda-schedule {
    break-inside: avoid;
    background-color: transparent;
    border: none !important;
    margin: 0 !important;
    padding: 0.125rem;
  }

  .panda-schedule .main {
    border: 1px solid #ccc;
    border-left: none;
    border-bottom-right-radius: 3px;
    border-top-right-radius: 3px;
  }

  .panda-schedule .boxed {
    border: none !important;
  }

  .panda-schedule .errors {
    display: none !important;
  }

  .panda-schedule .pencil-dropdown {
    display: none;
  }

  .panda-schedule .mi-free-breakfast {
    display: none !important;
  }

  .panda-schedule .employee-name {
    height: 14px;
  }

  .panda-schedule .employee-name>.caret {
    display: none;
  }

  .panda-schedule .inputboxes {
    line-height: 12px;
    margin: 0;
    margin-top: -1px;
    margin-bottom: -3px;
  }

  .panda-schedule .inputbox .boxed-time.finish {
    margin-right: 0;
  }

  .panda-schedule .boxed.boxed-time {
    width: 30px;
    padding: 0px;
  }

  .panda-schedule .shift-ident .colorPicker-picker {
    width: auto;
    padding: 0 2px;
  }

  .week-view .schedules {
    margin: 0 !important;
  }

  .add-vacant-user-input {
    display: none;
  }

  .no-weekend>.list {
    min-width: calc(20% - 8px) !important;
  }

  .add-user-input {
    display: none !important;
  }

  .btn-vacant-user {
    display: none !important;
  }

  .add-vacant-user-day-view {
    display: none;
  }

  .day-view-hr {
    display: none !important;
  }

  .div-td {
    font-size: 10px;
    line-height: 10px;
  }

  .div-td.col-blank {
    display: none;
  }

  .schedule-row-js {
    break-inside: avoid;
    border-bottom: 2px solid #777;
  }

  .col-blank.div-th.title-row {
    display: none;
  }

  .roster-canvas .div-thead .info-wrapper,.roster-canvas .div-thead .grid-wrapper {
    background-color: #707c8b !important;
  }

  .roster-canvas .div-thead * {
    color: #fff !important;
  }

  .dropdown.dropdown-cog {
    display: none;
  }

  .list-day-header .dropdown-container {
    display: none !important;
  }

  .list-day-header .day-tab-container {
    justify-content: center;
  }

  .date-and-icons {
    padding: 0 !important;
    min-height: 0 !important;
  }

  .date-and-icons>.roster-date {
    position: absolute;
    top: 1rem;
    left: 1rem;
  }

  .div-td.BREAK,.div-th.BREAK {
    background-color: #FB8C00 !important;
  }

  .div-td.BREAK.TRUNCSTART,.div-th.BREAK.TRUNCSTART {
    background: linear-gradient(to right, #fff 0%, #fff 50%, #FB8C00 50%, #FB8C00 100%) !important;
  }

  .div-td.BREAK.TRUNCFINISH,.div-th.BREAK.TRUNCFINISH {
    background: linear-gradient(to left, #fff 0%, #fff 50%, #FB8C00 50%, #FB8C00 100%) !important;
  }

  .div-td.WORKING,.div-th.WORKING {
    background-color: #93C732 !important;
  }

  .div-td.WORKING.TRUNCSTART,.div-th.WORKING.TRUNCSTART {
    background: linear-gradient(to right, #fff 0%, #fff 50%, #93C732 50%, #93C732 100%) !important;
  }

  .div-td.WORKING.TRUNCFINISH,.div-th.WORKING.TRUNCFINISH {
    background: linear-gradient(to left, #fff 0%, #fff 50%, #93C732 50%, #93C732 100%) !important;
  }

  .div-td.OVERNIGHT,.div-th.OVERNIGHT {
    background-color: #759e28 !important;
  }

  .div-td.OVERNIGHT.TRUNCSTART,.div-th.OVERNIGHT.TRUNCSTART {
    background: linear-gradient(to right, #fff 0%, #fff 50%, #759e28 50%, #759e28 100%) !important;
  }

  .div-td.OVERNIGHT.TRUNCFINISH,.div-th.OVERNIGHT.TRUNCFINISH {
    background: linear-gradient(to left, #fff 0%, #fff 50%, #759e28 50%, #759e28 100%) !important;
  }

  #proj-table-area {
    display: block !important;
  }

  .proj-controls {
    opacity: 0;
  }

  .proj-controls-container {
    display: none !important;
  }

  .proj-table {
    display: block !important;
    margin-left: 0;
  }

  .proj-table .info-wrapper {
    width: 20%;
  }

  .proj-table .grid-wrapper {
    width: 80%;
  }

  .proj-table .rr-edit,.proj-table .rr-new-data-streams {
    display: none;
  }

  .proj-table .rr-edit,.proj-table .rr-new-data-streams,.proj-table .col-cognitive-config,.proj-table .col-cognitive-creator {
    display: none !important;
  }

  .div-td.col-rostering-ratio {
    display: none;
  }

  .div-td.col-rostering-ratio.rr-edit-js.rr-edit {
    display: flex;
    outline: none;
  }

  .roster-toolbar {
    position: absolute;
    height: 0;
    padding: 0;
    min-height: 0 !important;
    max-height: 0;
  }

  .roster-toolbar .roster-stats {
    position: absolute;
    top: -2.825rem;
    right: 1rem;
  }

  tr.week {
    break-inside: avoid;
  }

  .col-team.sorting.div-th.title-row {
    padding-left: 0.5rem;
  }

  .special-header-link {
    display: none;
  }

  .table.rosters-table-no-border th .dropdown-cog {
    display: none;
  }

  .table.rosters-table-no-border th .holiday-icon-wrap {
    padding-left: 4px;
  }

  td.shift-details {
    width: 8rem;
  }

  tr.user-cost {
    break-inside: avoid;
  }

  .day-view-data-container {
    display: block;
  }

  .day-view-data-container .day-view-graph-table-toggle,.day-view-data-container .day-view-hours-slider,.day-view-data-container .day-view-data-manage,.day-view-data-container .day-view-graph,.day-view-data-container .day-view-demand-data,.day-view-data-container .day-view-actions-toolbar {
    display: none !important;
  }
}

@media print and (color) {
  .roster-canvas * {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
}

@media only screen and (max-width: 1350px) {
  .day-tab-container .holiday-icon-wrap {
    display: none;
  }

  .holiday-color-indicator {
    background-color: #d3e9a9 !important;
  }

  .holiday-color-indicator .day-tab-container strong {
    color: #669533;
  }
}

.holiday-icon-wrap {
  padding-left: 4px;
}

.holiday-icon-wrap span {
  color: #93C732;
  vertical-align: top;
  padding: 0 0.05rem;
}

.panda_roster_container .show-only-when-small {
  display: none;
}

@media (min-width: 1100px) and (max-width: 1300px) {
  .panda_roster_container .sidebar-opened .weekpicker-helptext {
    line-height: 6px;
  }

  .panda_roster_container .sidebar-opened .weekpicker-helptext .show-only-when-small {
    display: none;
  }

  .panda_roster_container .sidebar-opened .weekpicker-helptext .tooltip {
    font-size: 13px;
    line-height: 18px;
  }
}

@media (max-width: 1300px) {
  .panda_roster_container .sidebar-opened .toolbar .space-left {
    margin-left: 10px;
  }

  .panda_roster_container .sidebar-opened .btn-toolbar .stat-panel .info {
    display: none;
  }

  .panda_roster_container .sidebar-opened .btn-toolbar .stat-panel .stat {
    border-left: 1px solid #ccc;
    border-radius: 3px;
  }
}

@media (max-width: 1599px) {
  .panda_roster_container .hide-when-small {
    display: none !important;
  }

  .panda_roster_container .show-only-when-small {
    display: inline;
  }

  .panda_roster_container .panda_roster .toolbar .space-left {
    margin-left: 5px !important;
  }

  .panda_roster_container .btn-toolbar .stat-panel .info {
    display: none;
  }

  .panda_roster_container .btn-toolbar .stat-panel .stat {
    border-left: 1px solid #ccc;
    border-radius: 3px;
  }
}

@media (max-width: 1650px) {
  .panda_roster_container .btn-toolbar .stat-panel .info {
    padding-left: 5px;
    padding-right: 5px;
  }
}

@media screen and (max-width: 1750px) {
  .panda_roster_container .panda_roster.widget .roster-toolbar {
    margin-left: 0;
    margin-right: 0;
  }

  .panda_roster_container .panda_roster.widget .roster-toolbar .btn-save+.btn,.panda_roster_container .panda_roster.widget .roster-toolbar .btn-generate,.panda_roster_container .panda_roster.widget .roster-toolbar .btn-publish,.panda_roster_container .panda_roster.widget .roster-toolbar .btn-autofill {
    margin-left: 5px;
  }

  .panda_roster_container .panda_roster.widget .roster-toolbar .btn-add {
    margin-left: 0;
    margin-right: 0;
  }

  .panda_roster_container .toolbar .space-left {
    margin-left: 5px;
  }
}

@media (max-width: 1170px) {
  .panda_roster_container .weekpicker-helptext .show-only-when-small,.panda_roster_container .weekpicker-helptext.emulate-btn-inside-btn-group .show-only-when-small {
    display: none;
  }

  .panda_roster_container .weekpicker-helptext .tooltip,.panda_roster_container .weekpicker-helptext.emulate-btn-inside-btn-group .tooltip {
    font-size: 13px;
    line-height: 18px;
  }
}

.panda_roster_container .send-icon {
  display: none;
}

@media (max-width: 1000px) {
  .panda_roster_container .weekpicker-previous,.panda_roster_container .weekpicker-next,.panda_roster_container .send-text {
    display: none;
  }

  .panda_roster_container .send-icon {
    display: inline;
  }
}

.popover.leave-popover {
  padding: 0;
  border: 0.0625rem solid #F7F8FA;
}

.popover.leave-popover .btn-default {
  padding: 0.3125rem;
  width: 70%;
  margin: 0 auto;
}

.popover.leave-popover .popover-title {
  padding: 0.3125rem 0.625rem;
  min-width: 12.5rem;
  color: #FFFFFF;
  display: inline-block;
  width: 100%;
  box-sizing: border-box;
}

.popover.leave-popover .popover-title h4 {
  text-align: center;
  color: #FFFFFF;
  margin: 0;
  padding: 0;
  margin-bottom: 0.3125rem;
}

.popover.leave-popover .popover-title i {
  color: #FFFFFF;
  display: inline;
  margin-right: 0.3125rem;
}

.popover.leave-popover .popover-title p {
  display: inline;
}

.popover.leave-popover .popover-title .dates {
  width: 65%;
  display: inline-block;
  float: left;
  text-align: left;
}

.popover.leave-popover .popover-title .hours {
  width: 35%;
  display: inline-block;
  float: right;
}

.popover.leave-popover .popover-title a {
  color: #FFFFFF;
}

.popover.leave-popover .popover-content {
  padding: 0.625rem;
  color: #FFFFFF;
  background-color: #F7F8FA;
}

.popover.leave-popover .popover-content .leave-type {
  padding: 0.125rem 0.3125rem;
  border-radius: 0.125rem;
  display: inline-block;
  margin-bottom: 0.625rem;
  font-size: 0.625rem;
  float: left;
  max-width: 5rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.popover.leave-popover .popover-content .approved-at {
  display: inline-block;
  color: #8A9BAE;
  font-size: 0.5625rem;
  font-style: italic;
  float: right;
  margin-left: 0.3125rem;
  margin-top: 0.25rem;
}

.popover.leave-popover .popover-content .created-at {
  display: inline-block;
  color: #8A9BAE;
  font-size: 0.5625rem;
  font-style: italic;
  float: left;
  margin-left: 0.3125rem;
  margin-top: 0.25rem;
}

.popover.leave-popover .popover-content a {
  display: block;
  text-align: center;
  clear: both;
}

.popover.leave-popover .leave-popover-overflow {
  overflow: hidden;
  max-height: 4rem;
  position: relative;
}

.popover.leave-popover .leave-popover-overflow::after {
  content: '';
  display: block;
  background: linear-gradient(transparent, #F7F8FA);
  position: absolute;
  top: 3.375rem;
  left: 0;
  right: 0;
  height: 0.625rem;
}

.popover.approved .popover-title {
  background-color: #93C732;
}

.popover.approved .popover-content .leave-type {
  background-color: #84b32d;
}

.popover.pending .popover-title {
  background-color: #FB8C00;
}

.popover.pending .popover-content .leave-type {
  background-color: #e27e00;
}

.popover.unavailability .popover-title {
  background-color: #536171;
}

.popover.unavailability .popover-title .dates {
  width: 50%;
  display: inline-block;
  float: left;
  text-align: left;
}

.popover.unavailability .popover-title .hours {
  width: 50%;
  display: inline-block;
  float: left;
}

.popover.unavailability .popover-content .leave-type {
  background-color: #485462;
}

.inputboxes {
  float: left;
  margin-top:0.1875rem;
  margin-right: 0.75rem;
  /*margin-left:-22px;*/
}

.inputboxes .inputbox {
 display: inline
}



.boxed.boxed-time {
  width: 2.500rem;
  margin-bottom: 2px;
  margin-right: 0.125rem;
  box-shadow: none;
  text-align: center;
  border-radius: 4px;
  padding: 0;
  font-size: 0.7875rem;
  height: 1rem;
  line-height: 1rem;
  border: 0.0625rem #BAC5D4 solid;
}

.panda_roster_container .popover-title {
  padding: 0;
}

.panda_roster_container .leave-days {
  color: #3C4754;
  font-size: 0.625rem;
}

.panda_roster_container .leave-div {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-direction: normal;
  -webkit-box-orient: horizontal;
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: stretch;
  -ms-flex-align: stretch;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  align-items: stretch;
  background-color: #F0F2F5;
  box-sizing: border-box;
  border-radius: 2px;
  border: 0.0625rem solid #BAC5D4;
  font-size: 0.6875rem;
  min-height: 2rem;
  margin-bottom: 0.125rem;
  overflow: hidden;
  position: relative;
  user-select: none;
  width: 100%;
}

.panda_roster_container .leave-div.pending,.panda_roster_container .leave-div.approved,.panda_roster_container .leave-div.unavail {
  cursor: pointer;
}

.panda_roster_container .leave-div.pending {
  border-color: #FFA526;
  background: repeating-linear-gradient(-45deg, #FFF3E0, #FFF3E0 15px, #FFDFB3 15px, #FFDFB3 30px);
}

.panda_roster_container .leave-div.pending:hover {
  background: repeating-linear-gradient(-45deg, #FFDFB3, #FFDFB3 15px, #FFCA80 15px, #FFCA80 30px);
}

.panda_roster_container .leave-div.approved {
  background-color: #ECFCCA;
  border-color: #A6D63E;
}

.panda_roster_container .leave-div.unavail {
  border-color: #BAC5D4;
  background-color: #F0F2F5;
}

.panda_roster_container .leave-div.approved:hover {
  background-color: #E0FAA7;
}

.panda_roster_container .leave-div.unavail:hover {
  background-color: #DAE0E8;
}

.panda_roster_container .leave-div:focus,.panda_roster_container .leave-div:active {
  background-color: #F7F8FA;
}

.panda_roster_container .leave-div .time-off-bar {
  background-color: #536171;
  width: 0.35rem;
  border-radius: 0.125rem 0 0 0.125rem;
}

.panda_roster_container .leave-div .time-off-bar.pending {
  background-color: #FFA526;
}

.panda_roster_container .leave-div .time-off-bar.approved {
  background-color: #81B528;
}

.panda_roster_container .leave-div .time-off-icon {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: left;
  -ms-flex-pack: left;
  -webkit-justify-content: left;
  -moz-justify-content: left;
  justify-content: left;
  color: #3C4754;
  font-size: 0.875rem;
  opacity: 0.87;
  pointer-events: none;
  padding: 0.2rem 0.25 0 1rem;
}

.panda_roster_container .leave-div .time-off-details {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-direction: normal;
  -webkit-box-orient: vertical;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  flex-grow: 1;
  pointer-events: none;
}

.panda_roster_container .leave-div .time-off-title {
  align-items: center;
  color: #3C4754;
  display: flex;
  font-size: 0.75rem;
  line-height: 0.675rem;
  min-height: 1.25rem;
  font-weight: 700;
  padding-top: 0.2rem;
}

.panda_roster_container .leave-div .time-off-times {
  color: #3C4754;
  font-size: 0.675rem;
  line-height: 1rem;
}

.panda_roster_container .shift-dragging,.panda_roster_container .shift-dragging .employee-name,.panda_roster_container .shift-dragging .colorPicker-picker,.panda_roster_container .shift-dragging .boxed-time,.panda_roster_container .shift-dragging .edit-button,.panda_roster_container .shift-dragging .errors {
  cursor: url(https://payauspics.s3-ap-southeast-2.amazonaws.com/web/cursor-grab-close.png) 7 6,default !important;
}

.panda_roster_container .main {
  min-width: 0;
  max-width: calc(100% - 1.9rem);
  width: 100%;
  flex: 1;
}

@media (max-width: 1200px) and (min-width: 1001px) {
  .panda_roster_container .main {
    max-width: calc(100% - 2.2rem);
  }
}

.panda_roster_container .main[errorflag] .employee-name {
  width: 73%;
}

.panda-schedule {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  background-color: #F7F8FA;
  border: 0.0625rem solid #BAC5D4;
  border-radius: 0.1875rem;
  margin-bottom: 0.3125rem;
  max-width: 25rem;
  /*max-height: 2.4375rem;*/
  position: relative;
  width: 109px;
  transition: box-shadow 200ms, opacity 200ms;
}

@media (max-width: 1400px) {
  .panda-schedule {
    max-height: none;   
  }
}

.panda-schedule.shift-dragging {
  box-shadow: 0 0.5rem 0.75rem -0.25rem rgba(34,43,53,0.3);
}

.panda-schedule.overnight .boxed-time.finish {
  color: #1F77A6;
  border: 0.0625rem #1F77A6 solid;
  background: #EDFAFF;
}

.panda-schedule .break-icon {
  opacity: 0.6;
}

.panda-schedule:last-child {
  margin-bottom: 0.5625rem;
}

.panda-schedule .dropdown.open .mi-edit {
  opacity: 1;
}

.panda-schedule .dropdown .mi-edit {
  color: #222B35;
  opacity: 0.4;
}

.panda-schedule .dropdown .mi-edit:hover {
  opacity: 1;
}

.panda-schedule.dullify {
  opacity: 0.4;
}

.panda-schedule .schedule-tools {
  background-color: rgba(0,0,0,0.85);
  border: 0;
  min-width: 3.125rem;
  border-radius: 0.1875rem;
  padding: 0.1875rem 0;
  top: -0.1875rem !important;
  left: 0.5rem !important;
  cursor: default;
  z-index: 998;
}

.panda-schedule .schedule-tools::before {
  content: "";
  position: absolute;
  top: 0%;
  margin-top: 0.3125rem;
  left: -0.875rem;
  border: solid 0.4375rem transparent;
  border-right-color: rgba(0,0,0,0.85);
  z-index: 1;
}

.panda-schedule .schedule-tools a {
  color: #FFFFFF;
  padding: 0 0.5625rem;
  font-size: 0.6875rem;
  cursor: pointer;
}

.panda-schedule .schedule-tools-left {
  background-color: rgba(0,0,0,0.85);
  border: 0;
  min-width: 3.125rem;
  border-radius: 0.1875rem;
  padding: 0.1875rem 0;
  top: -0.1875rem !important;
  left: -6.25rem !important;
}

.panda-schedule .schedule-tools-left::before {
  content: "";
  position: absolute;
  top: 0%;
  margin-top: 0.3125rem;
  right: -0.875rem;
  border: solid 0.4375rem transparent;
  border-left-color: rgba(0,0,0,0.85);
  z-index: 1;
}

.panda-schedule .schedule-tools-left a {
  color: #FFFFFF;
  padding: 0 0.5625rem;
  font-size: 0.6875rem;
  cursor: pointer;
}

.panda-schedule .main {
  overflow: inherit;
  position: relative;
  padding-left: 0.25rem;
  /*padding-right: 22px;*/
  width:100%;
  display: initial;
  flex-direction: column;
  justify-content: space-between;
}


@media  (min-width: 1200px) {
  .closesapn {
   margin-right:-32px;
   color:red;
  }
}

@media (max-width: 1000px) {
  .panda-schedule .main {
    padding-left: 0;
  }
}
.panda-schedule .name-txt {
  width: 100%;
  box-sizing: border-box;
}

.panda-schedule .ellipsis {
  display: none;
}

.panda-schedule .caret {
  opacity: 0.3;
  top: 0.4rem;
  right: 0.1875rem;
  position: absolute;
}

.panda-schedule .caret:hover {
  opacity: 1;
}

.panda-schedule .employee-name {
  clear: both;
  display: block;
  font-weight: 600;
  font-size:12px;
  margin: 0;
  /*margin-left:-9px;*/
  text-decoration: none;
  cursor: pointer;
  line-height: 1.5;
  position: relative;
  max-height: 2.5rem;
  width: 99%;
  text-overflow: ellipsis;
  box-sizing: border-box;
  padding:3px 0.1875rem;
  padding-right: 0.2rem;
  word-break: break-all;
  overflow: hidden;
  white-space: nowrap;
  text-align: center;
}

@media print {
  .panda-schedule .employee-name {
    text-overflow: clip;
  }
}

.panda-schedule .employee-name:hover {
  background-color: rgba(0,0,0,0.05);
}

.panda-schedule .employee-name.picker-active .caret {
  opacity: 1;
}

.panda-schedule .employee-name:hover .caret {
  opacity: 1;
}

.panda-schedule .add-user {
  min-height: 1.875rem;
}

.panda-schedule .edit-button {
  background-color: transparent;
  background-clip: padding-box;
  background-origin: padding-box;
  border-radius: 0 0.1875rem;
  opacity: 0.7;
  padding: 0.0625rem;
  position: absolute;
  right: 0;
  top: 0;
  cursor: default;
}

.panda-schedule .count {
  position: absolute;
  left: -0.5625rem;
  top: 0.4375rem;
  color: #FFFFFF;
  font-weight: 700;
  font-size: 0.625rem;
}

.panda-schedule .errors {
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 0 1.4375rem 1.4375rem;
  border-color: transparent transparent #C42D2D;
  position: absolute;
  bottom: 0;
  right: 0;
  display: none;
  cursor: default;
}

.panda-schedule .errors:hover {
  border-color: transparent transparent #C42D2D;
}

.panda-schedule:not(.read-only):hover {
  cursor: url(https://payauspics.s3-ap-southeast-2.amazonaws.com/web/cursor-grab-open.png) 8 9,default;
}

.panda-schedule:not(.read-only):active {
  cursor: url(https://payauspics.s3-ap-southeast-2.amazonaws.com/web/cursor-grab-close.png) 7 6,default !important;
}

.panda-schedule.read-only,.panda-schedule.new-record {
  cursor: not-allowed !important;
  opacity: 0.5;
}

.panda-schedule.read-only .employee-name:hover,.panda-schedule.new-record .employee-name:hover {
  background: none;
}

.panda-schedule.read-only .employee-name .caret,.panda-schedule.new-record .employee-name .caret {
  display: none;
}

.panda-schedule.read-only .colorPicker-picker,.panda-schedule.new-record .colorPicker-picker {
  cursor: not-allowed;
}

.panda-schedule.schedule-with-error .employee-name {
  width: 85%;
}

.panda-schedule.in-focus {
  box-shadow: 0 0 0.3rem #5EC5EB;
  border: 0.0625rem solid #5EC5EB;
}

.panda-schedule.in-focus .employee-name.picker-active {
  background-color: rgba(0,0,0,0.07);
}

.panda-schedule[errorflag].schedule-with-info .errors {
  display: block;
  border-color: transparent transparent #A1B0C2;
}

.panda-schedule[errorflag] .errors {
  display: block;
  border-color: transparent transparent #C42D2D;
}

.panda-schedule[errorflag=unavailable] .errors,.panda-schedule[invalid-user-unavailable] .errors {
  display: block;
  border-color: transparent transparent #C42D2D;
}

.colorPicker-item {
  line-height: 0.8125rem;
}

.employee-traffic-light {
  font-family: 'Material Icons';
  font-feature-settings: "liga" 1;
  -webkit-font-feature-settings: "liga" 1;
  -ms-font-feature-settings: "liga" 1;
  font-variant-ligatures: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-style: normal;
  font-weight: 500;
  font-size: 0.8125rem;
}

.employee-traffic-light.red-traffic-light {
  color: #C42D2D;
}

.employee-traffic-light.red-traffic-light::before {
  content: "error";
}

.employee-traffic-light.orange-traffic-light {
  color: #FB8C00;
}

.employee-traffic-light.orange-traffic-light::before {
  content: "remove_circle";
}

.employee-traffic-light.green-traffic-light {
  color: #93C732;
}

.employee-traffic-light.green-traffic-light::before {
  content: "check_circle";
}

.shift-ident {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: stretch;
  -ms-flex-align: stretch;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  align-items: stretch;
  -webkit-box-direction: normal;
  -webkit-box-orient: vertical;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  border-right: 0.0625rem solid #BAC5D4;
}

.shift-ident .picker-parent {
  -webkit-box-flex: 1;
  -webkit-flex-grow: 1;
  -moz-flex-grow: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-direction: normal;
  -webkit-box-orient: vertical;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}

.shift-ident .colorPicker-picker {
  -webkit-box-flex: 1;
  -webkit-flex-grow: 1;
  -moz-flex-grow: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  -webkit-box-direction: normal;
  -webkit-box-orient: vertical;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  justify-content: center;
  border: 0;
  color: #222B35;
  height: 100%;
  width: 2rem;
  font-size: 0.6875rem;
}

.shift-ident .colorPicker-picker.light {
  color: #F7F8FA;
}

.shift-ident .no-shift-detail .shift-detail-picker {
  display: none;
}

.shift-ident .no-shift-detail .colorPicker-picker {
  width: 2.5rem;
}

@media (max-width: 1600px) and (min-width: 1201px) {
  .shift-ident .shift-detail-picker .colorPicker-picker {
    width: 100%;
    font-size: 0.5625rem;
  }

  .shift-ident .team-picker .colorPicker-picker {
    width: 1.5rem;
  }
}

@media (max-width: 1200px) {
  .shift-ident {
    -webkit-box-direction: normal;
    -webkit-box-orient: vertical;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
  }

  .shift-ident .no-shift-detail .shift-detail-picker {
    display: none;
  }

  .shift-ident .no-shift-detail .colorPicker-picker {
    width: 2.5rem;
  }

  .shift-ident .shift-detail-picker .colorPicker-picker {
    width: 1.75rem;
  }
}

@media (max-width: 1400px) {
  .shift-ident .colorPicker-picker {
    width: 1.75rem;
  }
}

.location-shortcode {
  font-weight: 500;
  font-size: 0.5625rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-height: 0.8125rem;
}

.no-shift-detail .location-shortcode {
  min-height: 0;
}

.team-shortcode-combined {
  min-height: 0.8125rem;
}

.no-shift-detail .team-shortcode-combined {
  min-height: 0;
}

/*.sidebar {
  background-color: #F7F8FA;
}

.sidebar .empty-state {
  color: #708093;
  text-align: center;
  font-size: 12px;
  padding: 15px;
  margin-top: 0;
  margin-bottom: 5px;
}

.sidebar .empty-state .empty-error {
  font-size: 13px;
  font-weight: 700;
  width: 100%;
  display: inline-block;
}

.sidebar .empty-state a.btn {
  color: #FFFFFF;
  background-color: #93C732;
  background-image: none;
  border: none;
  border-bottom: solid 3px #759e28;
  padding: 8px 14px;
  font-size: 14px;
  margin: 18px 0;
}

.sidebar .empty-state a.btn:hover {
  color: #FFFFFF;
  background-color: #9fd043;
}

.sidebar .empty-state .empty-desc {
  color: #8A9BAE;
  font-size: 11px;
  line-height: 16px;
  display: inline-block;
}

.sidebar .empty-state .empty-desc a {
  display: inline;
}

.sidebar .filter-group {
  margin-left: 27px;
}

.sidebar .filter-group label {
  font-weight: 700;
}

.sidebar .checkbox {
  margin: 2px;
}

.sidebar .sublabel-one {
  margin-left: 18px;
}

.sidebar .sublabel-two {
  margin-left: 53px;
  font-style: italic;
}

.sidebar .roster-department-group-group .sublabel-two {
  margin-left: 40px;
  font-style: italic;
}

.sidebar .sublabel-three {
  margin-left: 80px;
  font-style: italic;
}

.sidebar .employment-type {
  padding-left: 10px;
}

.sidebar .award-tags-filter {
  display: inline-block;
}

.sidebar .btn.no-bottom-border {
  width: 162px;
}

.sidebar .clear-space {
  display: block;
  height: 25px;
}

.sidebar .locations-teams-content {
  padding: 10px 10px 0;
}

.sidebar .sidebar-content {
  background-color: #F7F8FA;
  padding: 10px 10px 0;
  margin-top: 5px;
}

.sidebar .sidebar-content .view-switcher .btn {
  font-size: 11px;
  padding: 0.375rem 0.5rem;
  max-width: 60px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.sidebar .sidebar-content .view-switcher .extra-dropdown.btn {
  padding: 0.375rem;
}

.sidebar .sidebar-title {
  color: #3C4754;
  font-size: 11px;
  padding: 7px 7px 7px 12px;
  background-color: #E6E9ED;
  display: block;
}

.sidebar .sidebar-title .mi-keyboard-arrow-down {
  color: #708093;
  font-size: 8px;
  margin-left: 5px;
}

.sidebar .sidebar-title.roster-views {
  margin-top: 3px;
}

.sidebar .sidebar-title.roster-views:hover {
  cursor: default;
}

.sidebar .sidebar-title:hover {
  cursor: pointer;
}

.sidebar .sidebar-title hr.small-margin {
  margin: 3px;
}

.sidebar .sidebar-title .dropdown-menu {
  width: 80px;
}

.sidebar .sidebar-title .dropdown-menu>li>a {
  padding: 3px 10px;
}

.sidebar .sidebar-title .mi-visibility {
  color: #708093;
  font-size: 13px;
  margin-right: 5px;
}

.sidebar .sidebar-title .mi-settings {
  color: #708093;
}

.sidebar .sidebar-title .mi-settings:hover {
  color: #3C4754;
  cursor: pointer;
}

.sidebar .sidebar-title .title-icon {
  width: 20px;
  margin-right: 5px;
  max-height: 10px;
}

.sidebar .sidebar-title .title-icon-small {
  width: 15px;
  margin-right: 5px;
  max-height: 10px;
}

.sidebar .roster-location-group {
  margin-bottom: 10px;
  border-top: 0;
}

.sidebar .location-name-container {
  border: 1px solid #CAD2DE;
  background-color: #F0F2F5;
  overflow: hidden;
  position: relative;
}

.sidebar .location-teams-container {
  border: 1px solid #CAD2DE;
  border-top: 0;
  background: #FFFFFF;
}

.sidebar .location-teams-container .inner {
  padding-bottom: 5px;
  padding-top: 5px;
}

.sidebar .location-collapse {
  display: inline-block;
  width: 25px;
  background-color: #F0F2F5;
  height: 120%;
  position: absolute;
  right: 0;
  top: 0;
}

.sidebar .location-collapse::after {
  font-family: 'Material Icons';
  font-feature-settings: "liga" 1;
  -webkit-font-feature-settings: "liga" 1;
  -ms-font-feature-settings: "liga" 1;
  font-variant-ligatures: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-style: normal;
  font-weight: 500;
  content: "keyboard_arrow_up";
  color: #708093;
  margin-left: 6px;
  margin-top: 6px;
  position: absolute;
}

.sidebar .location-collapse:hover {
  cursor: pointer;
  background-color: #E6E9ED;
}

.sidebar .location-collapse.collapsed::after {
  transform: rotate(180deg);
}

.sidebar .location-collapse .collapse-icon {
  text-align: center;
  vertical-align: middle;
  position: absolute;
  left: 9px;
  top: 9px;
  font-size: 8px;
}

.sidebar .checked .location-name-container {
  background-color: #3FAFD7;
  color: #FFFFFF;
  border-color: #3FAFD7;
}

.sidebar .checked .location-teams-container {
  border-color: #3FAFD7;
}

.sidebar .checked .location-name {
  font-weight: 400;
}

.sidebar .checked .location-collapse {
  background-color: #3FAFD7;
}

.sidebar .checked .location-collapse::after {
  color: #FFFFFF;
}

.sidebar .checked .location-collapse:hover {
  background-color: #329DC7;
}

.sidebar .checked hr.no-margin {
  border-top-color: #CAEFFC;
}

.sidebar .location-name-checkbox {
  padding: 3px;
  display: inline-block;
}

.sidebar .location-name {
  font-weight: 600;
  font-size: 13px;
  padding: 5px 0;
}

.sidebar .location-name .name {
  display: inline-block;
  max-width: 130px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: bottom;
}

.sidebar .location-name .shortcode {
  display: inline-block;
}

.sidebar .location-name::before {
  font-family: 'Material Icons';
  font-feature-settings: "liga" 1;
  -webkit-font-feature-settings: "liga" 1;
  -ms-font-feature-settings: "liga" 1;
  font-variant-ligatures: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-style: normal;
  font-weight: 500;
  content: "place";
  font-size: 13px;
  margin-right: 5px;
}

.sidebar .roster-team-group {
  margin-bottom: 3px;
}

.sidebar .cell {
  width: 9px !important;
  height: 10px !important;
  display: inline-block;
  border: 1px solid rgba(0,0,0,0.3);
  margin-top: 4px;
}*/

.roster-canvas .hours-summary .fortnightly-top-row-cell {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  font-size: 0.65rem;
  line-height: 1rem;
  float: left;
}

.roster-canvas .hours-summary .fortnightly-top-row-cell:not(:last-of-type) {
  margin-right: 0.5rem;
}

.roster-canvas .hours-summary .fortnightly-top-row-cell-title {
  color: #999;
}

.roster-canvas .hours-summary .fortnightly-top-row-cell-hours {
  margin-left: 3px;
}

.roster-canvas .hours-summary .fortnightly-bottom-row {
  clear: both;
}

.weather-wrap>img {
  padding-right: 7px;
  opacity: 0.7;
}

.weather-wrap>img:hover {
  opacity: 1;
  cursor: pointer;
}

.weather-wrap .popover.popover-weather {
  width: 200px;
  border: 1px solid #cecece;
  box-shadow: 0 2px 30px rgba(0,0,0,0.2);
}

.weather-wrap .popover.popover-weather .arrow {
  border-bottom-color: #cecece;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  margin-left: -14px;
}

.weather-wrap .popover.popover-weather .arrow::after {
  border-bottom-color: #F7F7F7;
  top: 2px;
}

.weather-wrap .popover.popover-weather .popover-title {
  display: block !important;
  text-align: center;
  padding: 5px 0;
  font-size: 10px;
  color: #8E8E8E;
}

.weather-wrap .popover.popover-weather .popover-content {
  display: inline-block;
  padding: 9px 14px;
  margin: 0;
}

.weather-wrap .popover.popover-weather .popover-content img {
  width: 30%;
  float: left;
  padding-top: 5px;
}

.weather-wrap .popover.popover-weather .popover-content .figures {
  display: inline-block;
  font-size: 14px;
  width: 70%;
  margin: 0;
  float: left;
  padding: 0 0 0 15px;
  box-sizing: border-box;
}

.weather-wrap .popover.popover-weather .popover-content .figures h3 {
  display: inline-block;
  float: left;
  width: 100%;
  margin: 0 0 5px;
  padding: 0;
  box-sizing: border-box;
  font-size: 14px;
  color: #555;
}

.weather-wrap .popover.popover-weather .popover-content .figures h3::first-letter {
  text-transform: capitalize;
}

.weather-wrap .popover.popover-weather .popover-content .figures .temp {
  display: block;
  font-size: 12px;
  line-height: 16px;
  font-weight: 400;
}

.weather-wrap .popover.popover-weather .popover-content .figures .temp.thigh {
  color: #AF0303;
}

.weather-wrap .popover.popover-weather .popover-content .figures .temp.tlow {
  color: #1FA2D2;
}

.blue-bg {
  background: #1da6d0 !important;
}

.panda .text-uppercase {
  text-transform: uppercase;
}

.panda .btn.btn-clean {
  background: #FFFFFF;
  cursor: pointer;
  padding: 5px 10px;
  border: 1px solid #BAC5D4;
  border-radius: 3px;
}

.panda input {
  margin-bottom: 0;
}

.panda .widget {
  background-color: #FFFFFF;
  margin-top: 15px;
  margin-bottom: 20px;
  border: 1px solid #BAC5D4;
  border-radius: 3px;
  -webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.05);
  box-shadow: 0 1px 1px rgba(0,0,0,0.05);
}

.panda .widget .title {
  float: left;
  padding: 15px;
}

.panda .widget .title .image {
  margin-right: 10px;
}

.panda .widget .title .image img {
  width: 50px;
  height: 50px;
  background-color: #ecf0f1;
  border: 1px solid #cfd9db;
}

.panda .widget .title .info {
  padding: 5px;
}

.panda .widget .title .info p {
  margin: 0 !important;
}

.panda .widget .datepicker_container {
  float: right;
  margin-top: 12px;
  padding: 15px;
}

.panda .widget .block {
  background-color: #fff;
  border-top: 1px solid #dde4e6;
  float: left;
}

.panda .widget .bg-grey {
  background-color: #F7F8FA;
}

.panda .widget .bg-grey h4 {
  padding-top: 5px;
}

.panda .widget .block.breakdown {
  padding: 20px 0px 20px 0px;
}

.panda .widget .block.empty {
  padding-bottom: 87px;
  padding-top: 80px;
  display: none;
}

.panda .widget .block.empty .iconbox {
  width: 250px;
  margin: 0 auto;
}

.panda .widget .block.empty div {
  text-align: center;
  width: 80%;
  margin: 0 auto;
}

.panda .widget .block.empty div h1 {
  color: #555;
}

.panda .widget .block.empty div p {
  color: #555;
  font-size: 16px;
}

.panda .chart:not(svg) {
  position: relative;
  display: block;
  width: 110px;
  height: 110px;
  margin: 0 auto;
  text-align: center;
  margin: 0 auto;
  float: none;
}

.panda .chart canvas {
  position: absolute;
  top: 0;
  left: 0;
}

.panda .chart .percent {
  display: inline-block;
  line-height: 94px !important;
  z-index: 2;
  font-weight: 600 !important;
  font-size: 36px !important;
  font-weight: normal;
  color: #3FAFD7;
  margin: 9px 0;
}

.panda .stat-panel {
  line-height: 40px;
  margin-top: 15px;
  margin-bottom: 5px;
}

.panda .stat-panel .info {
  background-color: #F0F2F5;
  white-space: nowrap;
  overflow: hidden;
  border: 1px solid #cfd9db;
  -webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.05);
  box-shadow: 0 1px 1px rgba(0,0,0,0.05);
  overflow: hidden;
  border-right: 0;
  padding-left: 0;
  padding-right: 0;
  text-align: center;
  color: #8A9BAE !important;
  font-weight: 600;
  font-size: 13px;
}

.panda .stat-panel .stat {
  white-space: nowrap;
  overflow: hidden;
  background-color: #ffffff;
  border: 1px solid #cfd9db;
  -webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.05);
  box-shadow: 0 1px 1px rgba(0,0,0,0.05);
  border-left: 0;
  font-weight: bold;
  font-size: 16px;
  padding: 0;
  text-align: center;
  padding-left: 1px;
  margin-left: 0;
}

.panda .clean-table table {
  width: 100%;
}

.panda .clean-table.table {
  margin-bottom: 0;
}

.panda .clean-table .bottom {
  border-top: 1px solid #CCCCCC;
  padding-left: 20px;
  padding-right: 20px;
  margin-top: 10px;
  padding-top: 10px;
}

.panda .clean-table .bottom {
  position: relative;
}

.panda .clean-table .bottom .dataTables_info {
  position: absolute;
  bottom: 0px;
  padding-left: 9px;
}

.panda .clean-table .dataTables_wrapper .bottom {
  height: auto;
  padding-bottom: 4px;
  display: inline-block;
  width: 100%;
  box-sizing: border-box;
  min-height: 80px;
}

.panda .clean-table .dataTables_length label {
  padding-top: 10px;
  padding-left: 10px;
  font-weight: normal !important;
}

.panda .clean-table .dataTables_paginate {
  margin-top: 7px;
}

.panda .clean-table .paginate_button.previous,.panda .clean-table .paginate_button.next {
  float: left;
  cursor: pointer;
  padding: 4px 12px;
  line-height: 18px;
  text-decoration: none;
  background-color: white;
  border: 1px solid #dddddd;
}

.panda .clean-table .paginate_button.next {
  border-left-width: 0;
  -webkit-border-top-right-radius: 4px;
  -moz-border-radius-topright: 4px;
  border-top-right-radius: 4px;
  -webkit-border-bottom-right-radius: 4px;
  -moz-border-radius-bottomright: 4px;
  border-bottom-right-radius: 4px;
}

.panda .clean-table .paginate_button.previous {
  -webkit-border-top-left-radius: 4px;
  -moz-border-radius-topleft: 4px;
  border-top-left-radius: 4px;
  -webkit-border-bottom-left-radius: 4px;
  -moz-border-radius-bottomleft: 4px;
  border-bottom-left-radius: 4px;
}

.panda .clean-table .paginate_button.previous:hover,.panda .clean-table .paginate_button.next:hover {
  text-decoration: underline;
}

.panda .clean-table .paginate_button.previous.disabled,.panda .clean-table .paginate_button.next.disabled {
  text-decoration: none;
}

.panda .clean-table .bottom .disabled {
  background-color: #F1F1F1 !important;
}

.panda .clean-table a.paginate_button.previous.disabled,.panda a.paginate_button.disabled {
  color: #A7A7A7 !important;
}

.panda .clean-table .shiftTime {
  padding: 5px;
}

.panda .clean-table.nobordertop table caption+thead tr:first-child th,.panda .clean-table.nobordertop table caption+thead tr:first-child td,.panda .clean-table.nobordertop table colgroup+thead tr:first-child th,.panda .clean-table.nobordertop table colgroup+thead tr:first-child td,.panda .clean-table.nobordertop table thead:first-child tr:first-child th,.panda .clean-table.nobordertop table thead:first-child tr:first-child td {
  border-top: 0;
}

.panda .datepicker {
  background: #fff;
  cursor: pointer;
  padding: 5px 10px;
  border: 1px solid #ccc;
  border-radius: 3px;
  display: inline-block;
}

.panda .datepicker i.mi.mi-date-range {
  margin-left: 4px;
  margin-right: 3px;
}

.panda .datepicker b.caret {
  margin-top: 7px;
}

.panda .ui-datepicker {
  padding-bottom: 5px !important;
  background: #fff !important;
  width: 436px !important;
  height: auto;
  margin: 5px auto 0;
  font: 9pt Arial, sans-serif;
  -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.2);
  -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.2);
  box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.2);
  display: block;
  font-size: 1.33em;
  border: 1px solid #777777;
  border-top-color: #898989;
  border-bottom-width: 0;
  -webkit-border-radius: 5px 5px 0 0;
  -moz-border-radius: 5px 5px 0 0;
  border-radius: 5px 5px 0 0;
}

.panda .ui-datepicker-header {
  background: transparent !important;
  border: 0 !important;
  color: #e0e0e0 !important;
  font-weight: bold !important;
  line-height: 30px !important;
}

.panda .ui-datepicker td {
  padding: 0px !important;
}

.panda span.ui-datepicker-month {
  font-size: 1.33em;
  color: #000;
}

.panda span.ui-datepicker-year {
  color: #999999;
  font-size: .8em;
  font-style: italic;
}

.panda .ui-datepicker td span,.panda .ui-datepicker td a {
  text-align: center !important;
}

.panda .ui-state-default {
  cursor: pointer;
  color: #000000;
  background: transparent;
  border: 1px solid transparent;
  box-shadow: none;
  padding-left: 8px;
  padding-right: 8px;
}

.panda .ui-state-highlight {
  cursor: pointer !important;
  color: #000000 !important;
  background: #b1dcfb !important;
  border: 1px solid transparent !important;
}

.panda .ui-state-hover {
  color: #000000;
  background: #b1dcfb;
  border: 1px solid transparent;
}

.panda .sidebar .widget {
  float: left;
  margin-left: 0;
}

.panda .sidebar .widget .title {
  padding: 0 15px 0 15px;
}

.panda .sidebar .widget .title .info p {
  line-height: 30px;
}

.users-page .clean-table .bottom .dataTables_info {
  bottom: 0px;
}

.loading-spinner.mi {
  margin-left: 5px;
}

.tanda-signup {
  background: #228cc5;
  background: linear-gradient(150deg, #5ed6eb, #228cc5 80%, #228cc5);
  z-index: -99;
}

.signup-logo {
  padding: 15px 0 30px 0;
}

@media (max-width: 1200px) {
  .signup-logo {
    padding: 10px 0 15px 0;
  }
}

.signup-prompt {
  margin-left: auto;
  margin-right: auto;
}

.signup-prompt a {
  color: #FFFFFF;
}

.benefits-of-tanda {
  max-width: 600px;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}

@media (max-width: 1200px) and (min-width: 1001px) {
  .benefits-of-tanda {
    max-width: 500px;
  }
}

@media (max-width: 1000px) and (min-width: 801px) {
  .benefits-of-tanda {
    max-width: 400px;
  }

  .benefits-of-tanda h2 {
    font-size: 1.5rem;
  }
}

.benefits img {
  width: 55px;
  height: auto;
}

@media (max-width: 1000px) and (min-width: 801px) {
  .benefits img {
    width: 35px;
  }
}

.benefits span {
  font-size: 1.2rem;
  padding-left: 5px;
}

@media (max-width: 1000px) and (min-width: 801px) {
  .benefits span {
    font-size: 1rem;
  }
}

form label.error {
  color: #C42D2D;
}

.signup-form-container {
  background: #FFFFFF;
  border-radius: 0.25rem;
  box-shadow: 0 11px 32px rgba(31,119,166,0.7);
  padding: 20px;
  box-sizing: border-box;
  width: 100%;
  max-width: 450px;
  margin-left: auto;
  margin-right: auto;
}

.signup-form-container .pw-show-button {
  padding: 5px 10px;
  right: 0;
  border-radius: 2px;
  border: none;
  user-select: none;
  transition: color 200ms, background 200ms;
}

.signup-form-container .pw-show-button.pw-hidden {
  color: #8A9BAE;
}

.signup-form-container .pw-show-button.pw-shown {
  color: #5EC5EB;
}

.signup-form-container .pw-show-button:hover {
  color: #3FAFD7;
  cursor: pointer;
  background: #EDFAFF;
}

.signup-form-container h4 {
  font-size: 0.9rem;
}

.signup-form-container .intl-tel-input {
  display: block;
}

.signup-form-container .input-group {
  margin-top: 1.3rem;
}

.signup-form-container label {
  color: #3C4754;
}

.signup-form-container .error {
  color: #C42D2D;
}

.signup-form-container input:not([type="submit"]):not([type="checkbox"]) {
  padding: 10px 16px;
  box-sizing: border-box;
  font-size: 16px;
  line-height: 1.33;
  border: solid 1px #ccc;
  width: 100%;
  height: 3rem;
  outline: none;
  border-radius: 0;
}

.signup-form-container input:not([type="submit"]):not([type="checkbox"]):focus {
  background-color: #f4fbfd;
  box-shadow: 0 0 5px #3FAFD7;
  border: 1px solid #3FAFD7;
  outline-offset: -4px;
}

.signup-form-container input:not([type="submit"]):not([type="checkbox"]).phone-number {
  padding-left: 53px;
}

.signup-form-container select {
  padding: 10px 16px;
  box-sizing: border-box;
  font-size: 16px;
  line-height: 1.33;
  border: solid 1px #ccc;
  width: 100%;
  height: 3rem;
  outline: none;
}

.signup-form-container input[type="submit"] {
  width: 100%;
}

.signup-form-container .phone-number input {
  padding-left: 52px;
}

.signup-form-container .form-button {
  padding: 15px;
  font-size: 1rem;
}

.signup-form-container .checkbox-holder input[type="checkbox"] {
  margin-right: 5px;
  margin-top: 0;
}

.signup-form-container .intl-tel-input .selected-flag .iti-flag {
  margin: 0;
  top: 18px;
}

.signup-form-container .intl-tel-input .selected-flag .iti-arrow {
  margin: 0;
  top: 21px;
}

.signup-form-heading {
  font-size: 1.5rem;
}

.form-signup {
  box-sizing: border-box;
}

.customer-testimonials {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: distribute;
  -webkit-justify-content: space-around;
  -moz-justify-content: space-around;
  justify-content: space-around;
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
}

@media (max-width: 1200px) {
  .customer-testimonials {
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    width: 100%;
  }
}

.customer-testimonials .testimonal-details {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  -webkit-justify-content: flex-end;
  -moz-justify-content: flex-end;
  justify-content: flex-end;
  text-align: right;
  color: #FFFFFF;
  margin-top: 20px;
  font-weight: 300;
}

.customer-testimonials .testimonal-details .photo img {
  width: 60px;
  min-width: 60px;
  height: 60px;
  float: left;
  margin-left: 10px;
}

.customer-testimonials .testimonal-details .logo img {
  max-width: 70px;
  margin-bottom: 5px;
  height: auto;
  padding: 0;
}

.bubble {
  background: rgba(255,255,255,0.2);
  border-radius: 12px;
  width: 275px;
  padding: 18px 20px;
  color: #FFFFFF;
  position: relative;
  font-size: 15px;
  line-height: 18px;
  font-weight: 300;
}

@media (max-width: 1200px) {
  .bubble {
    width: 350px;
    font-size: 14px;
  }
}

.bubble::before {
  content: "";
  display: block;
  position: absolute;
  width: 0;
  height: 0;
  right: 1.5rem;
  bottom: -0.75rem;
  border-right: 0.5rem solid rgba(255,255,255,0.2);
  border-top: 0.5rem solid transparent;
  border-bottom: 0.5rem solid transparent;
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  transform: rotate(-90deg);
}

@media (max-width: 800px) {
  .row-fluid .span5,.row-fluid .span7 {
    width: 100%;
  }
}

.form-box {
  padding: 0;
  background: #FFFFFF;
  border: 1px solid #C0C0C0;
  background: #f5f5f5;
  padding: 20px;
  -moz-box-shadow: 0 0 2px 2px rgba(0,0,0,0.1);
  -webkit-box-shadow: 0 0 2px 2px rgba(0,0,0,0.1);
  box-shadow: 0 0 2px 2px rgba(0,0,0,0.1);
  color: #666;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}

.social-signin-container {
  width: 100%;
  max-width: 450px;
  margin-left: auto;
  margin-right: auto;
}

.social-signin-container .separator {
  text-transform: uppercase;
  font-size: 11px;
}

.social-signin-container a {
  color: #666666;
}

.social-signin-container a:hover {
  text-decoration: none;
}

.sub-login-options {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
}

.social-signin {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
  border-radius: 4px;
  background: #FFFFFF;
  box-shadow: 0 2px 2px 0 rgba(0,0,0,0.05),0 3px 1px -2px rgba(0,0,0,0.05),0 1px 5px 0 rgba(0,0,0,0.05);
  padding: 15px;
  position: relative;
}

.social-signin:hover {
  cursor: pointer;
  -webkit-transition: 0.2s;
  -moz-transition: 0.2s;
  -ms-transition: 0.2s;
  -o-transition: 0.2s;
  transition: 0.2s;
  box-shadow: 0 2px 2px 0 rgba(0,0,0,0.1),0 3px 1px -2px rgba(0,0,0,0.1),0 1px 5px 0 rgba(0,0,0,0.1);
  box-shadow: 0 5px 15px rgba(12,109,161,0.5);
}

.social-signin .logo {
  height: 50px;
  position: absolute;
  top: 0;
}

.social-signin .text {
  font-size: 16px;
  text-align: center;
  width: 100%;
}

form a {
  text-decoration: none;
}

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

.form-row {
  margin-bottom: 1em;
}

.form-row input.text,.form-row textarea {
  width: 92%;
  border: solid 1px #C9C9C9;
  padding: 0.7rem 4%;
  font-size: 1em;
  font-weight: 400;
  background: #FFFFFF;
  color: #333;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: inset 5px 5px 5px  #f3f3f3;
  -webkit-box-shadow: inset 5px 5px 5px  #f3f3f3;
  box-shadow: inset 5px 5px 5px  #f3f3f3;
}

.form-row .intl-tel-input {
  width: 100%;
}

.form-row .intl-tel-input input {
  width: 100%;
  padding: 4px 4%;
  box-sizing: border-box;
  padding-left: 50px;
}

.form-row .intl-tel-input input.text {
  height: 43px;
}

.form-row .intl-tel-input .flag-dropdown {
  max-height: 50px;
}

.form-row input.text {
  height: 1.6rem;
}

.form-row select,.form-row .chosen-choices {
  width: 100%;
  color: #333;
  font-size: 13px;
  padding: 1.0em 4%;
  margin-bottom: 0;
  height: 45px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: inset 5px 5px 5px  #f3f3f3;
  -webkit-box-shadow: inset 5px 5px 5px  #f3f3f3;
  box-shadow: inset 5px 5px 5px  #f3f3f3;
}

.form-row .chosen-choices {
  padding: 1.0em 1% !important;
}

.form-row input.btn-blue,.form-row button.btn-blue {
  -webkit-appearance: none;
  border: 0;
  padding: 1em 1.5em;
  font-size: 17px;
  letter-spacing: 0.5px;
  border: solid 1px #226eac;
  color: #FFFFFF;
  text-shadow: 0px -1px rgba(0,0,0,0.2);
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  text-decoration: none;
  background: #1da6d0;
  margin-top: 15px;
}

.form-row input.btn-blue:hover,.form-row input.btn-blue:focus,.form-row button.btn-blue:hover,.form-row button.btn-blue:hover {
  -webkit-appearance: none;
  background: #20C3F5;
}

.form-row input.btn-wide,.form-row button.btn-wide {
  -webkit-appearance: none;
  width: 100%;
  padding-left: 0;
  padding-right: 0;
}

.form-row label {
  font-size: 1em;
  color: #111;
  display: block;
  font-weight: 700;
  text-transform: uppercase;
}

.form-row label span.required {
  color: red;
}

.shadow {
  background-size: 90% 100%;
  height: 20px;
}

.meta a {
  text-decoration: none;
}

#success,#error {
  display: none;
  background: #f9f9f9;
  border: solid 1px #ccc;
  margin-bottom: 1em;
  padding: 1em;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  color: #777;
}

#success p,#error p {
  padding: 0;
  margin: 0;
}

#success {
  border-color: #77b054;
}

#error {
  border-color: #e65445;
}

#success span p {
  color: #77b054;
  font-weight: 400;
  padding: 0;
  margin: 0;
}

#error span p {
  color: #e65445;
  font-weight: 400;
  margin: 0;
  padding: 0;
}

.subscribe {
  margin-top: 2em;
}

#subscribe {
  position: relative;
}

#subscribe label.error {
  background: #FFFFFF;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  padding: 1em 1.3em .5em;
  position: absolute;
  top: -3.5em;
  left: -1.4em;
  right: -1.4em;
}

.section {
  padding: 20px;
}

.does_scroll {
  position: relative !important;
  min-height: 100vh !important;
}

.pandaOnboard {
  display: none;
}

.pandaOnboard .menu {
  position: fixed;
  top: 0;
  float: left;
  width: 50%;
  z-index: 1000;
}

.pandaOnboard .menu .section {
  padding-left: 0;
}

.pandaOnboard .menu .logo {
  margin-right: 10px;
  float: left;
  padding: 11px;
}

.pandaOnboard .menu .logo img {
  float: left;
}

.pandaOnboard .nav-pills {
  float: left;
}

.pandaOnboard .nav-pills li a {
  color: #FFFFFF;
}

.pandaOnboard .nav-pills li a.active {
  background: transparent !important;
}

.pandaOnboard .nav-pills li a:hover {
  color: white;
  background-color: #F9AA1E;
}

.pandaOnboard .menu .menu_content {
  text-align: left;
  width: 60%;
  margin: 0 auto;
  margin-top: 5px;
  height: 38px;
  border-bottom: 1px solid rgba(255,255,255,0.2);
  padding-left: 20px;
}

.pandaOnboard.utility-page {
  display: block;
}

body.layout-simple {
  background: #3fafd7;
}

body.layout-simple .center-column {
  color: #777 !important;
  float: right;
  width: 100%;
  position: fixed;
  z-index: 750;
  top: 0;
  right: 0;
  bottom: 0;
}

body.layout-simple .center-column .section {
  margin: 85px auto 0;
  width: 90%;
  max-width: 470px;
}

body.layout-simple .center-column .section .form-box {
  padding: 20px;
}

body.layout-simple .center-column .section .form-box img {
  display: block;
  margin: 0 auto;
  padding: 5px 0 20px;
}

body.layout-simple .btn-orange {
  padding: 11px 20px;
  background: #F9AA1E;
  font-weight: 500;
  text-shadow: none;
  text-transform: uppercase;
  color: #333;
  font-size: 14px;
}

body.layout-simple .btn-orange:hover {
  background: #FFBF4E;
}

body.layout-simple .half {
  width: 48%;
  float: left;
  padding: 0 2%;
}

body.layout-simple .half:first-child {
  padding-left: 0;
}

body.layout-simple .half:last-child {
  padding-right: 0;
}

body.layout-simple .form-row.row-button {
  margin-top: 15px;
  display: inline-block;
  width: 100%;
}

body.layout-simple .form-row.row-button #submit {
  display: table;
  margin: 0 auto;
}

body.layout-simple .form-row.row-button #submit.btn-light-opacity {
  opacity: 0.5;
}

body.layout-simple .one #submit {
  max-width: 165px;
}

body.layout-simple .two #submit {
  max-width: 190px;
}

body.layout-simple .reasons {
  padding: 30px 10px 40px;
  display: inline-block;
  width: 100%;
}

body.layout-simple .reasons h2,body.layout-simple .reasons h3 {
  color: #FFFFFF !important;
}

body.layout-simple .reasons h2 {
  font-size: 21px !important;
}

body.layout-simple .reasons h3 {
  font-size: 17px !important;
}

body.layout-simple .reasons i {
  width: 35px;
  text-align: center;
}

body.layout-simple .reasons .logos {
  width: 100%;
  text-align: center;
}

body.layout-simple .reasons .logos img {
  padding: 0 10px;
}

body.layout-simple .menu.hide {
  display: none !important;
}

@media (max-width: 1000px) {
  body.layout-simple .narrow {
    margin-top: 0 !important;
  }
}

@media (max-width: 767px) {
  body.layout-simple .half {
    width: 100% !important;
    float: left;
    padding: 0 !important;
  }

  body.layout-simple .reasons {
    display: none !important;
  }
}

.wslink {
  border-radius: 6px;
  width: 100%;
  max-width: 450px;
  margin-left: auto;
  margin-right: auto;
}

.wslink .header {
  box-shadow: 0 3px 8px 0 rgba(0,0,0,0.08);
  background-color: #886FD8;
  padding: 12px;
  text-align: center;
  border-radius: 6px 6px 0 0;
}

.wslink .header p {
  color: #FFFFFF;
  font-size: 24px;
  font-weight: 500;
  line-height: 26px;
  margin-bottom: 0;
  text-align: center;
  text-transform: uppercase;
}

.wslink .body {
  padding: 24px 32px;
  background-color: #FFFFFF;
  background: url("https://s3-ap-southeast-2.amazonaws.com/payauspics/web/wslink-bg.png") no-repeat center;
  background-size: cover;
  border-radius: 0 0 6px 6px;
}

.wslink .body .icons {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
}

.wslink .body p {
  font-size: 16px;
  color: #303235;
  letter-spacing: 0.34px;
  line-height: 21px;
}

.wslink .body a {
  text-transform: uppercase;
}

.known {
  margin-top: 6rem;
}

@media screen and (max-width: 1000px) {
  .pandaOnboard {
    padding: 0 !important;
  }

  .pandaOnboard #industry_award {
    position: relative !important;
  }

  .pandaOnboard #splash_screen {
    display: none;
  }

  .pandaOnboard .quote {
    display: none;
  }

  .pandaOnboard .modal {
    left: 0;
  }

  .pandaOnboard .menu {
    width: 100% !important;
    position: relative !important;
  }

  .pandaOnboard .menu .section {
    width: 100% !important;
  }

  .pandaOnboard .menu .menu_content {
    width: 100% !important;
    float: left;
  }

  .pandaOnboard .narrow {
    width: 100% !important;
    margin-top: -50px;
  }

  .pandaOnboard .left {
    width: 100%;
    float: left;
    display: block;
    position: relative;
  }

  .pandaOnboard .left.does_scroll {
    min-height: inherit !important;
  }

  .pandaOnboard .left .section {
    width: 95%;
    margin-top: 60px !important;
  }

  .pandaOnboard .right {
    width: 100%;
    float: left;
    display: block;
    position: relative;
    margin-top: -70px;
    border-radius: 10px;
    margin-bottom: 30px;
  }

  .pandaOnboard .right .section {
    margin-top: 7px !important;
  }

  .pandaOnboard .one .promo_feature {
    display: none;
  }

  .pandaOnboard .one .left {
    margin-bottom: 50px;
  }

  .pandaOnboard .one .company_logos {
    display: none;
  }

  .pandaOnboard .three #example_text,.pandaOnboard .three #example_roster {
    display: none !important;
  }

  .pandaOnboard .three .does_scroll {
    padding-bottom: 75px;
  }

  .pandaOnboard .three .left {
    margin-bottom: 0px;
  }

  .pandaOnboard .three #example_roster {
    height: 300px;
    overflow: hidden;
    max-width: none !important;
    margin-bottom: 100px;
  }

  .pandaOnboard .four .clockin_device {
    display: none;
  }

  .pandaOnboard .four .clockins .clockin {
    display: block;
    float: left;
  }

  .pandaOnboard .four .left {
    margin-bottom: 80px;
  }

  .pandaOnboard .four .does_scroll {
    min-height: inherit;
  }

  .pandaOnboard .section {
    margin-top: 0px !important;
  }

  .pandaOnboard .section h1 {
    font-size: 2em;
  }

  .pandaOnboard .section h3 {
    font-size: 1.2em;
    padding-right: 15px;
  }
}

.utility-page {
  overflow: inherit;
}

.utility-page .menu {
  width: 100% !important;
  float: none !important;
  position: relative !important;
}

.utility-page .alert.alert-info {
  background-color: #fff;
  border-color: #fff;
  color: #555;
  text-align: center;
  margin: 0 auto;
  box-sizing: border-box;
  padding: 0.5rem 0.875rem !important;
}

.utility-page .alert.alert-info b {
  color: #222;
  font-size: 0.875rem;
  padding: 0.1875rem 0 0.625rem;
  display: inline-block;
}

.utility-page .alert.alert-info a {
  text-decoration: underline;
}

.utility-page .alert a {
  color: #337ab7;
  text-decoration: none;
  font-style: normal;
}

.utility-page .remember_me label {
  text-transform: none !important;
}

.utility-page .login_messages {
  margin: 2.5rem auto 1.25rem;
  float: none;
  color: #fff;
}

.utility-page .login-submit {
  background: #F9AA1E;
  border-color: rgba(0,0,0,0.15) rgba(0,0,0,0.15) rgba(0,0,0,0.25);
  text-transform: uppercase;
  color: #333;
  font-size: 0.875rem;
  font-weight: 500;
  text-shadow: none;
}

.utility-page .login-submit:hover {
  background: #FFBA40;
}

.utility-page .bottom-form-links {
  text-decoration: none;
  text-align: center;
  margin-top: 0.5rem;
  color: #CAD7DF;
}

.utility-page .main-section {
  margin-top: 1.875rem;
}

@media screen and (max-width: 1000px) {
  .utility-page {
    margin-top: -3.125;
  }

  .utility-page .narrow {
    margin-top: 1.875rem !important;
  }

  .utility-page .section,.utility-page .narrow {
    margin-top: 0 !important;
    display: inline;
  }

  .utility-page .login_messages {
    width: 100% !important;
  }

  .utility-page .menu .menu_content {
    padding-left: 0 !important;
  }
}

.utility-page-content {
  margin: 0 auto;
  float: none;
}

.utility-page-content input.text {
  font-size: 1rem;
}

.utility-page-content h1 {
  color: #fff;
  text-align: center;
  font-size: 1.5rem;
}

.utility-page-content h4 {
  margin-top: 0;
}

.utility-page-content form {
  margin: 0;
}

.known-user {
  margin-top: 6rem;
}

.login-details {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-direction: normal;
  -webkit-box-orient: vertical;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
}

.login-details img.avatar {
  background-color: #FFFFFF;
  border-radius: 50%;
  border: solid 5px #ffffff;
  box-shadow: 0 9px 12px -5px #B3B3B3;
  height: 150px;
  margin-top: -100px;
  max-height: 150px;
  object-fit: cover;
  object-position: 50% 50%;
  width: 150px;
}

.login-details .personal-details {
  padding-bottom: 20px;
  text-align: center;
}

.login-details .personal-details .not-you {
  color: #3FAFD7;
  font-size: 0.8rem;
  position: absolute;
  left: 0;
  right: 0;
  margin-left: auto;
  margin-right: auto;
  width: 100px;
}

.login-details .personal-details .email {
  font-size: 1.2rem;
  color: #8A9BAE;
  position: relative;
}
.btn-default.btn-on.active{background-color:var(--main-color) !important;color: white;}
.btn-default.btn-off.active{background-color: var(--main-color) !important;color: white;}