body {
  width: 100%;
  color: #484747;
  font-size: 18px;
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
  color: white;
}

h1,
.h1 {
  font-size: 30px;
}

h2,
.h2 {
  font-size: 20px;
  margin-top: 10px;
  text-transform: uppercase;
}

h3,
.h3 {
  font-size: 20px;
}

h4,
.h4 {
  font-size: 18px;
}

h5,
.h5 {
  font-size: 14px;
}

h6,
.h6 {
  font-size: 12px;
}

p {
  margin: 0 0 10px;
}

p2 {
  margin: 0 0 10px;
}

label {
  margin-bottom: 0;
  font-weight: 400;
}

div.top_row {
  position: fixed;
  top: 0px;
  display: table;
  width: 100%;
  height: 100px;
  background-color: white;
}

div.top_row_overlay {
  position: fixed;
  background-color: #4b63ae;
  top: 0px;
  display: table;
  width: 100%;
  height: 50px;
  padding-top: 15px;
  padding-left: 20px;
  padding-right: 25px;
  z-index: 4000;
}

div.top_row_col {
  display: table-cell;
  width: 33%;
  padding: 20px;
  padding-bottom: 25px;
}

div.top_row_col.top_row_col_20 {
  width: 20%;
}
div.top_row_col.top_row_col_60 {
  width: 60%;
}

div.bottom_row {
  position: fixed;
  background-color: white;
  bottom: 0px;
  width: 100%;
  height: 80px;
}

div.bottom_row_col1 {
  position: fixed;
  width: 50%;
  bottom: 16px;
  left: 20px;
}

div.bottom_row_col {
  display: table-cell;
  position: fixed;
  width: 40%;
  bottom: 20px;
  right: 20px;
  display: table-cell;
  position: fixed;
  width: 50%;
  bottom: 16px;
  right: 20px;
}

div.content {
  position: fixed;
  top: 100px;
  width: 100%;
  bottom: 80px;
  overflow: hidden;
  padding-left: 20px;
  padding-right: 20px;
  background-color: white;
}

div.contentoverlay {
  position: relative;
  top: 100px;
  width: 100%;
  overflow: hidden;
  padding: 20px;
  padding-bottom: 1px;
}

div.content_row {
  height: 10px;
  width: 100%;
}

#mainContent.servicemenu {
  background-size: 100% auto;
  background-repeat: no-repeat;
  background-position: center center;
  padding: 0;
}

.dateselectionDiv {
  height: 200px;
  width: 32%; /* Adjust width as needed */
  background-color: white;
  float: left;
  margin-right: 1%; /* Space between divs */
  box-sizing: border-box;
  overflow-y: auto;
  position: relative;
  border-radius: 5px;
}

.dateselectionDiv:last-child {
  margin-right: 0;
}

.dateheaderDiv {
  height: 30px;
  width: 32%; /* Adjust width as needed */
  color: white;
  float: left;
  margin-right: 1%; /* Space between divs */
  box-sizing: border-box;
  overflow-y: auto;
  position: relative;
  text-align: center;
}

.dateheaderDiv:last-child {
  margin-right: 0;
}

.dateswipe-wrapper::before {
  content: "";
  position: absolute;
  top: 50%;
  margin-top: -18px; /* 36px / 2 */
  height: 36px;
  left: 0;
  right: 0;
  border-top: 2px solid #8dc63f;
  border-bottom: 2px solid #8dc63f;
  pointer-events: none;
  z-index: 2;
}

.dateswipe-wrapper {
  height: 252px; /* 7 items × 36px */
  position: relative;
  width: 32%;
  float: left;
  margin-right: 1%;
  box-sizing: border-box;
}

.dateswipe-wrapper:last-child {
  margin-right: 0;
}

.dateswipe-wrapper {
  touch-action: none;
}

.swipe-container {
  -webkit-overflow-scrolling: auto !important; /* Force native scroll to act linear */
  overscroll-behavior: none !important; /* Stop rubber band effect */
}

.dateselectionDiv {
  height: 100%;
  width: 100%;
  overflow-y: auto;
  border-radius: 5px;
}

.list-group-item.spacer {
  padding: 0;
  margin: 0;
  border: none;
  height: 36px;
  visibility: hidden;
}

.dateselectionDiv .list-group-item.active,
.dateselectionDiv .list-group-item.active:hover,
.dateselectionDiv .list-group-item.active:focus {
  background-color: transparent;
  border-color: transparent;
  font-weight: bold;
  color: black;
}

div.top_row_message {
  padding-bottom: 10px;
}

div.top_row_message_col {
  display: table-cell;
  width: 33%;
  padding: 20px;
  vertical-align: bottom;
}

div.bottom_row_message {
  align-content: center;
  position: absolute;
  bottom: 25px;
  left: 0;
  right: 0;
  text-align: center;
}

.popup-app-label {
  font-size: 0.75rem;
  font-weight: 600;
  color: #aaa;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

div.bottom_row_message_col1 {
  position: fixed;
  width: 40%;
  bottom: 5px;
  left: 20px;
}

div.content_message {
  margin-left: 50px;
  margin-right: 50px;
  margin-bottom: 25px;
}

div.content_message_install {
  margin-left: 60px;
  margin-right: 60px;
}

#bottominfolabel1 {
  font-size: smaller;
}

span.input-group-addon.clearInputField {
  padding: 0px 11px;
  padding-top: 5px;
}

span.input-group-addon.openAddressBook {
  padding: 3px 11px;
}

span.input-group-addon.openAddressBook img {
  height: 26px;
  width: 26px;
}

.input-group-addon-width {
  width: 250px;
  text-align: left;
}

.input-group-addon-width-addressbook {
  width: 200px;
  text-align: left;
}

.table > thead > tr > th,
.table > tbody > tr > th,
.table > tfoot > tr > th,
.table > thead > tr > td,
.table > tbody > tr > td,
.table > tfoot > tr > td {
  vertical-align: middle;
  font-size: 16px;
}

.btn {
  font-size: 18px;
  height: 50px;
}

.btn-browselistbutton {
  height: 50px;
}

.btn-browselistbutton:hover,
.btn-browselistbutton:focus {
  color: #333 !important;
  text-decoration: none;
}

.extended-question-header {
  width: 70%;
  margin-top: 10px;
}

.btn-options,
.btn-group-options > .btn {
  padding: 0.5rem 1rem;
  line-height: 1.5;
  border-radius: 0.3rem;
  background-color: #4b63ae !important;
  border-color: #4b63ae !important;
  color: white !important;
  font-weight: bold;
  margin-left: 10px;
}

.btn-privacy,
.btn-group-privacy > .btn {
  padding: 0.5rem 1rem;
  line-height: 1.5;
  border-radius: 0.3rem;
  border-color: #4b63ae !important;
  background-color: #ffffff !important;

  color: #4b63ae !important;
  font-weight: bold;
  margin-left: 0;
  margin-top: 5px;
}

.btn-sm {
  font-size: 10px;
  line-height: 1;
  height: 26px;
  text-transform: uppercase;
}

.btn-privacy:hover {
  border-color: #4b63ae !important;
  background-color: #ffffff !important;

  color: #4b63ae !important;
}

.btn-privacy:active,
.btn-privacy:focus {
  border-color: #4b63ae !important;
  background-color: #ffffff !important;
  outline-color: #ffffff !important;
  color: #4b63ae !important;
  margin-top: 5px !important;
  box-shadow: none;
}

.btn-gray,
.btn-gray:focus,
.btn-group-options > .btn {
  padding: 0.5rem 1rem;
  line-height: 1.5;
  border-radius: 0.3rem;
  background-color: #eeeeee;
  border-color: #ccc;
  color: #555;
  margin-left: 10px;
}

.btn-danger,
.btn-danger:focus,
.btn-group-options > .btn {
  color: #c9302c;
  margin-left: 10px;
  background-color: #eeeeee;
  border-color: #ac2925;
}

.btn-back,
.btn-back:focus,
.btn-group-back > .btn {
  padding: 0.5rem 1rem;
  line-height: 1.5;
  border-radius: 0.3rem;
  background-color: #4b63ae;
  color: white;
  font-weight: bold;
}

.btn-scan,
.btn-scan:focus,
.btn-group-scan > .btn {
  padding: 0.5rem 1rem;
  line-height: 1.5;
  border-radius: 0.3rem;
  background-color: #8dc63f !important;
  color: white !important;
  font-weight: bold;
  margin-left: 10px;
}

.btn-message,
.btn-message:focus,
.btn-group-message > .btn {
  padding: 0.5rem 1rem;
  line-height: 1.5;
  border-radius: 0.3rem;
  background-color: #4b63ae !important;
  color: white !important;
  font-weight: bold;
  vertical-align: bottom;
}

.btn-bottom-row,
.btn-bottom-row:focus,
.btn-group-message > .btn {
  padding: 0.5rem 1rem;
  line-height: 1.5;
  border-radius: 0.3rem;
  background-color: #4b63ae !important;
  color: white !important;
  font-weight: bold;
  vertical-align: bottom;
  margin-top: 0;
  margin-bottom: 0;
  margin-left: 10px;
}

.btn-alert,
.btn-alert:focus,
.btn-group-alert > .btn {
  padding: 0.5rem 1rem;
  line-height: 1.5;
  border-radius: 0.3rem;
  background-color: #ffbc00 !important;
  color: white !important;
  font-weight: bold;
  vertical-align: bottom;
  margin-top: 25px;
  margin-bottom: 25px;
}

.btn-critical,
.btn-critical:focus,
.btn-group-critical > .btn {
  padding: 0.5rem 1rem;
  line-height: 1.5;
  border-radius: 0.3rem;
  background-color: #ff0000 !important;
  color: white !important;
  font-weight: bold;
  vertical-align: bottom;
  margin-top: 25px;
  margin-bottom: 25px;
}

.btn-group-justified > .btn {
  background-color: #eeeeee;
  margin-left: 10px;
  color: #555555;
}

.btn-group-justified.active > .btn {
  background-color: #eeeeee;
  margin-left: 10px;
  color: #555555;
}

.btn-blue,
.btn-blue:focus,
.btn-group-blue > .btn {
  padding: 0.5rem 1rem;
  line-height: 1.5;
  border-radius: 0.3rem;
  background-color: #4b63ae;
  color: white;
  font-weight: bold;
  vertical-align: bottom;
  margin-top: 25px;
  margin-bottom: 25px;
}

.btn-gray,
.btn-gray:focus .btn-group-options > .btn {
  padding: 0.5rem 1rem;
  line-height: 1.5;
  border-radius: 0.3rem;
  background-color: #eeeeee;
  border-color: #ccc;
  color: #555;
  margin-top: 25px;
  margin-bottom: 25px;
}

.btn-red,
.btn-red:focus,
.btn-group-red > .btn {
  padding: 0.5rem 1rem;
  line-height: 1.5;
  border-radius: 0.3rem;
  background-color: #ff0000;
  color: white;
  font-weight: bold;
  vertical-align: bottom;
  margin-top: 25px;
  margin-bottom: 25px;
}

.btn-green,
.btn-green:focus,
.btn-group-green > .btn {
  padding: 0.5rem 1rem;
  line-height: 1.5;
  border-radius: 0.3rem;
  background-color: #8dc63f;
  color: white;
  font-weight: bold;
  vertical-align: bottom;
  margin-top: 25px;
  margin-bottom: 25px;
}

.btn-yellow,
.btn-yellow:focus,
.btn-group-yellow > .btn {
  padding: 0.5rem 1rem;
  line-height: 1.5;
  border-radius: 0.3rem;
  background-color: #ffbc00;
  color: white;
  font-weight: bold;
  vertical-align: bottom;
  margin-top: 25px;
  margin-bottom: 25px;
}

#popupMessageButton1,
#popupMessageButton2 {
  margin: 10px;
}

.w-25 {
  width: 25% !important;
}

.w-75 {
  width: 75% !important;
}

.button-image:after {
  content: "";
  width: 28px;
  height: 28px;
  display: inline-block;
  margin-left: 10px;
  vertical-align: middle;
  background-color: transparent;
  background-position: center center;
  background-repeat: no-repeat;
}

.button-image-notext:after {
  content: "";
  width: 17px;
  height: 17px;
  display: inline-block;
  vertical-align: middle;
  background-color: transparent;
  background-position: center center;
  background-repeat: no-repeat;
}

.buttonmove-image:after {
  content: "";
  width: 28px;
  height: 28px;
  display: inline-block;
  vertical-align: middle;
  background-color: transparent;
  background-position: center center;
  background-repeat: no-repeat;
}

.button-imagebefore:before {
  content: "";
  width: 28px;
  height: 28px;
  display: inline-block;
  margin-right: 10px;
  vertical-align: middle;
  background-color: transparent;
  background-position: center center;
  background-repeat: no-repeat;
}

.okButton:after {
  background-image: url("../images/icon_scan.png");
}

.exitButton:after {
  background-image: url("../images/icon_exit_white.png");
}

.btn-gray.button-image.exitButton:after {
  background-image: url("../images/icon_exit_black.png");
}

.closeappButton:after {
  background-image: url("../images/icon_exit_black.png");
}

.againButton:after {
  background-image: url("../images/icon_again_white.png");
}

.clearButton:after {
  background-image: url("../images/icon_clear.png");
}

.clearredButton:after {
  background-image: url("../images/icon_clearred.png");
}

.clearblackButton:after {
  background-image: url("../images/icon_clearblack.png");
}

.leftButton:before {
  background-image: url("../images/icon_left.svg");
}

.rightButton:after {
  background-image: url("../images/icon_right.png");
}

.optionsButton:after {
  background-image: url("../images/icon_option.png");
}

.addButton:after {
  background-image: url("../images/icon_add.png");
}

.addblackButton:after {
  background-image: url("../images/icon_add_black.png");
}

.searchButton:after {
  background-image: url("../images/icon_search.png");
  width: 17px;
  height: 17px;
}

.createButton:after {
  background-image: url("../images/icon_CreateNew.png");
  background-repeat: repeat-y;
}

.passwordresetButton:after {
  background-image: url("../images/icon_passwordreset.png");
  width: 28px;
  height: 32px;
}

.moveleftButton:after {
  background-image: url("../images/icon_moveleft.png");
}

.moverightButton:after {
  background-image: url("../images/icon_moveright.png");
}

.iconTrash:after {
  background-image: url("../images/icon_trash.png");
}

.overlay {
  position: fixed;
  display: none;
  overflow: auto;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #4b63ae;
  z-index: 3000;
  cursor: pointer;
  touch-action: auto;
}

.overlay2 {
  position: fixed;
  display: none;
  overflow: auto;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(255, 255, 255, 0.1);
  z-index: 3000;
  cursor: pointer;
  touch-action: auto;
}

.overlay .closebtn {
  position: fixed;
  top: 30px;
  right: 25px;
  font-size: 60px;
  color: #fff;
}

.overlay .cancelbtn {
  position: fixed;
  top: 30px;
  right: 85px;
  font-size: 60px;
  color: #fff;
}

.overlay .title {
  position: absolute;
  top: 20px;
  left: 125px;
  font-size: 60px;
}

.message_black {
  position: fixed;
  display: none;
  overflow: auto;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.8);
  z-index: 1002;
}

.config_screen {
  position: fixed;
  display: none;
  overflow: auto;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: white;
  z-index: 1001;
}

.create_screen {
  position: fixed;
  display: none;
  overflow: auto;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: white;
  z-index: 1002;
}

.message_white {
  width: 90%;
  height: 90%;
  background-color: white;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;

  max-width: 100%;
  max-height: 100%;
  overflow: auto;
  border-radius: 0.3rem;
}

.message_white .title .h2 {
  position: absolute;
  top: 20px;
  left: 125px;
  font-size: 60px;
}

.message_scancomplete {
  width: 80%;
  height: 80%;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;

  max-width: 100%;
  max-height: 100%;
  overflow: auto;
}

.message_scancomplete .title .h2 {
  position: absolute;
  top: 20px;
  left: 125px;
  font-size: 60px;
}

h2purple,
.h2purple {
  font-family: inherit;
  font-weight: 500;
  line-height: 1.1;
  color: #4b63ae;
}

h2orange,
.h2orange {
  font-family: inherit;
  font-weight: 500;
  line-height: 1.1;
  color: #ffbc00;
}

h2red,
.h2red {
  font-family: inherit;
  font-weight: 500;
  line-height: 1.1;
  color: #ff0000;
}

.message .closebtn {
  position: absolute;
  top: 10px;
  right: 30px;
  font-size: 60px;
  color: #fff;
}

.list-group-lg {
  height: 46px;
  padding: 10px 16px;
  font-size: 18px;
  line-height: 1.3333333;
  border-radius: 6px;
  margin-bottom: 20px;
}

.element,
.outer-container {
  width: 200px;
  height: 200px;
}

.outer-container {
  border: 5px solid purple;
  position: relative;
  overflow: hidden;
}

.inner-container {
  position: absolute;
  left: 0;
  overflow-x: hidden;
  overflow-y: scroll;
}

.inner-container::-webkit-scrollbar {
  display: none;
}

.SharePoint {
  background-image: url("SharePoint_logo.png");
}

.exit {
  position: absolute;
  right: 20px;
  top: 20px;
}

pwhite,
.pwhite {
  color: white;
}

.question-breadcrumb {
  font-size: 16px;
  height: 36px;
  padding: 5px 15px;
  color: white;
  margin-bottom: -1px;
  display: none;
}

#question-input-field-clear {
  background-image: url("../images/icon_clear555_round.png");
  width: 20px;
  height: 20px;
  background-repeat: no-repeat;
}

active {
  color: white;
}

active {
  background-color: #666;
}

.divShortInfo {
  color: white;
  margin-top: 5px;
  margin-bottom: 5px;
  padding-left: 2px;
  padding-right: 2px;
  display: none;
}

.btn-primary.active,
.btn-primary:active:hover,
.btn-primary.active:hover,
.open > .dropdown-toggle.btn-primary:hover,
.btn-primary:hover:active,
.btn-primary.hover.active,
.open > .dropdown-toggle.btn-primary:hover,
.btn-primary:active:focus,
.btn-primary.active:focus,
.open > .dropdown-toggle.btn-primary:focus,
.btn-primary:active.focus,
.btn-primary.active.focus,
.open > .dropdown-toggle.btn-primary:focus {
  color: #fff !important;
  background-color: #8dc63f;
  border: none !important;
  outline: none !important;
}

.btn-group > .btn:hover,
.btn-group-vertical > .btn:hover,
.btn-group > .btn:focus,
.btn-group-vertical > .btn:focus,
.btn-group > .btn:active,
.btn-group-vertical > .btn:active,
.btn-group > .btn:active,
.btn-group-vertical > .btn:active {
  z-index: 2;
  color: #fff !important;
  background-color: #8dc63f !important;
  border: none !important;
  outline: none !important;
}

.btn-primary,
.btn-primary:hover,
.btn-group > .btn-primary:hover {
  background-color: #eeeeee !important;

  color: #555555 !important;
  border: none !important;
  outline: none !important;
}

.btn-primary.active,
.btn-primary.active:hover,
.btn-group > .btn-primary.active:hover {
  color: #fff !important;
  background-color: #8dc63f !important;
}

.list-group-item.active,
.list-group-item.active:hover,
.list-group-item.active:focus {
  background-color: #8dc63f !important;
  border-color: #8dc63f !important;
}

.list-group-item.gray,
.list-group-item.gray:hover,
.list-group-item.gray:focus {
  background-color: #eeeeee !important;
  border-color: #ccc !important;
}

.list-group-item.preselect,
.list-group-item.preselect:hover,
.list-group-item.preselect:focus {
  background-color: #aaa;
  border-color: #aaa;
}

.list-group {
  font-size: 18px;
}

.form-control {
  display: block;
  width: 100%;
  height: 36px;
  padding: 6px 16px;
  font-size: 14px;
  line-height: 1.42857143;
  color: #555555;
  background-color: #fff;
  background-image: none;
  border: 1px solid #ccc;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  -webkit-transition:
    border-color ease-in-out 0.15s,
    box-shadow ease-in-out 0.15s;
  -o-transition:
    border-color ease-in-out 0.15s,
    box-shadow ease-in-out 0.15s;
  -webkit-transition:
    border-color ease-in-out 0.15s,
    -webkit-box-shadow ease-in-out 0.15s;
  transition:
    border-color ease-in-out 0.15s,
    -webkit-box-shadow ease-in-out 0.15s;
  transition:
    border-color ease-in-out 0.15s,
    box-shadow ease-in-out 0.15s;
  transition:
    border-color ease-in-out 0.15s,
    box-shadow ease-in-out 0.15s,
    -webkit-box-shadow ease-in-out 0.15s;
  font-size: 16px;
  height: 36px;
}

fieldset[disabled] .btn-primary,
.btn-primary.disabled:hover,
.btn-primary[disabled]:hover,
fieldset[disabled] .btn-primary:hover,
.btn-primary.disabled:focus,
.btn-primary[disabled]:focus,
fieldset[disabled] .btn-primary:focus,
.btn-primary.disabled:active,
.btn-primary[disabled]:active,
fieldset[disabled] .btn-primary:active,
.btn-primary.disabled.active,
.btn-primary[disabled].active,
fieldset[disabled] .btn-primary.active {
  background-color: #eeeeee;
  border-color: #ccc;
}

.btn-primary.disabled,
.btn-primary[disabled] {
  cursor: not-allowed;
  filter: alpha(opacity=65);
  opacity: 0.65;
  -webkit-box-shadow: none;
  box-shadow: none;
  border: none !important;
  outline: none !important;
}

.btn-primary.active.disabled,
.btn-primary.active[disabled] {
  color: #fff;
  background-color: #8dc63f;
}

.swipe-container {
  overflow-y: scroll;
  position: relative;
  scrollbar-width: none;
}

.swipe-container::-webkit-scrollbar {
  display: none;
}

.swipe-item {
  width: 100%;
}

.no-select {
  user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
}

.faxentry {
  position: relative;
  top: 10px;
  background-color: white;
}

.testclass {
  height: 10px;
  width: 100%;
  position: absolute;
  left: 10px;
  top: 10px;
  background-color: orange;
  padding-left: 4px;
  visibility: hidden;
}

.col-xs-1,
.col-sm-1,
.col-md-1,
.col-lg-1,
.col-xs-2,
.col-sm-2,
.col-md-2,
.col-lg-2,
.col-xs-3,
.col-sm-3,
.col-md-3,
.col-lg-3,
.col-xs-4,
.col-sm-4,
.col-md-4,
.col-lg-4,
.col-xs-5,
.col-sm-5,
.col-md-5,
.col-lg-5,
.col-xs-6,
.col-sm-6,
.col-md-6,
.col-lg-6,
.col-xs-7,
.col-sm-7,
.col-md-7,
.col-lg-7,
.col-xs-8,
.col-sm-8,
.col-md-8,
.col-lg-8,
.col-xs-9,
.col-sm-9,
.col-md-9,
.col-lg-9,
.col-xs-10,
.col-sm-10,
.col-md-10,
.col-lg-10,
.col-xs-11,
.col-sm-11,
.col-md-11,
.col-lg-11,
.col-xs-12,
.col-sm-12,
.col-md-12,
.col-lg-12 {
  position: relative;
  min-height: 1px;
}

.col-sm-1,
.movecol {
  width: 18%;
  padding-right: 0px;
  padding-left: 0px;
}

.col-sm-5,
.col-md-6,
.col-sm-6,
.collinksrechts {
  width: 41%;
  padding-left: 0px;
  padding-right: 0px;
}

.dual-list .list-group {
  margin-top: 8px;
}

.list-left li,
.list-right li {
  cursor: pointer;
}

.list-arrows {
  padding-top: 100px;
}

.list-arrows button {
  margin-bottom: 20px;
}

.container {
  width: 100%;
  padding-left: 0px;
  padding-right: 0px;
}

.input-group-lg > .form-control,
.input-group-lg > .input-group-addon,
.input-group-lg > .input-group-btn > .btn {
  padding: 6px 16px;
  text-align: left;
}

.iXwareLogo {
  position: absolute;
  top: 20px;
  left: 20px;
  height: 50px;
  width: 155px;
  background-image: url("../images/Logo_iXware.png");
  visibility: visible;
}

#header-application-logo {
  display: block;
  height: 50px;
  width: auto;
  max-height: 50px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.input-group-lg > .input-group-addon {
  font-size: 16px;
  height: 36px;
}

.input-group-lg > .form-control,
.input-group-lg > .input-group-addon,
.input-group-lg > .input-group-btn > .btn {
  font-size: 16px;
  height: 36px;
}

.list-group-item {
  font-size: 16px;
  height: 36px;
  padding: 5px 15px;
}

.browselist {
  font-size: 16px;
  height: 54px;
  padding: 5px 15px;
}

#PrivacyStatementFrame {
  height: 280px;
  width: 100%;
  background-color: white;
  border: 0;
}

#PrivacyStatementButton {
  margin-top: 5px;
  margin-bottom: 5px;
}

#Version {
  z-index: 4000;
}

#PrivacyStatement {
  z-index: 4001;
}

#tableAccountSummaryInfo {
  width: 80%;
  background-color: rgb(238, 238, 238);
}

#AccountActivationSummary_before_text {
  text-align: center;
  margin-bottom: 20px;
  margin-left: 40px;
  margin-right: 40px;
}

#AccountActivationSummary_after_text {
  text-align: center;
  margin-top: 20px;
  margin-left: 40px;
  margin-right: 40px;
}

#divAppInfo {
  width: 80%;
}

.rowAppInfo {
  width: 100%;
  overflow: hidden;
}

.columnAppInfoName {
  width: 40%;
  font-weight: bold;
  padding: 2px 10px;
  float: left;
  text-align: left;
}

.columnAppInfoValue {
  width: 60%;
  font-weight: normal;
  padding: 2px 10px;
  float: left;
  text-align: left;
}

.columnAppInfoName.firstRow {
  padding-top: 10px;
}

.columnAppInfoValue.firstRow {
  padding-top: 10px;
}

.columnAppInfoName.lastRow {
  padding-bottom: 10px;
}

.columnAppInfoValue.lastRow {
  padding-bottom: 10px;
}

#billboardMain {
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

#billboardHeader {
  width: 100%;
  height: 100px;
  background-color: transparent;
}

#billboardLogo,
#billboardExit {
  display: inline-block;
  height: 100%;
}

#billboardLogo {
  padding-top: 20px;
  padding-left: 20px;
}

#billboardLogoLabel {
  height: 100%;
  width: auto;
  display: inline-block;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}

#billboardLogoImage {
  height: 100%;
  max-height: 100px;
  width: auto;
}

#billboardExit {
  padding-top: 15px;
  padding-right: 15px;
  float: right;
}

#billboardExitButton {
  height: 60px;
  width: 60px;
  display: inline-block;
}

#billboardContent {
  width: 100%;
  height: calc(100% - 100px);
  padding-top: 10px;
}

#billboardContentHeader {
  width: 100%;
  height: auto;

  padding: 20px;
}

#billboardTitle {
  font-size: 48px;
  font-weight: bold;
}

#billboardBodyText {
  font-size: 18px;
  float: left;
  width: calc(100% - 300px);
}

#billboardBodyImage {
  float: left;
  width: 300px;
}

#billboardContentBody {
  width: 100%;
  height: auto;

  padding: 20px;
  overflow: hidden;
}

#billboardImage {
  width: 100%;
  max-width: 300px;
  height: auto;
  float: right;
}

span.answer-list-text {
  float: left;
}

span.answer-list-trash {
  float: right;
  text-align: right;
}

img.trash-icon {
  margin-right: 5px;
}

.scanCollectProgress {
  background-color: white;
  position: fixed;
  border-color: black;
  border-style: solid;
  height: 90px;
  width: 50%;
  top: 50%;
  left: 30%;
  z-index: 1000;
  visibility: visible;
}

.scancollectinforow {
  color: white;
}

.scancollectoptions {
  padding: 2px;
  margin: 20px;
}

.buttonspan {
  width: 30px;
}

.selectedtaggbutton {
  font-size: larger;
  padding-left: 5px;
  padding-right: 5px;
  margin-left: 5px;
  height: 35px;
  border-radius: 5px;
}

.buttondelete {
  padding-left: 2px;
  padding-right: 2px;
}

.list-group-addbutton {
  background-color: aqua;
  border-color: #ccc;
  padding-left: 5px;
}

#tagglistitemsSelectedDiv {
  height: 45px;
}

.selectedTaggInTaggList {
  background-color: green;
}

.waitOverlay {
  position: fixed;
  top: 100px;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: transparent;
  z-index: 9999;
}

.wait-image-container {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -112px;
  margin-left: -32px;
  width: 64px;
  height: 64px;
  background-image: url("../images/Blocks-1s-64px-2.gif");
  background-size: cover;
}

/* Loading overlay */
.loadingOverlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.45);
  z-index: 10000;
}

.loading-box {
  width: 90%;
  height: 90%;
  background-color: #ffffff;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  max-width: 100%;
  max-height: 100%;
  overflow: hidden;
  -webkit-border-radius: 0.3rem;
  border-radius: 0.3rem;
}

.loading-center {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 320px;
  margin-left: -160px;
  margin-top: -60px;
  text-align: center;
}

.loading-title {
  font-size: 1.1rem;
  font-weight: 600;
  color: #333;
  margin-bottom: 6px;
}

.loading-app-label {
  font-size: 1.3rem;
  font-weight: 700;
  color: #4B63AE;
  margin-bottom: 6px;
  min-height: 1.5rem;
}

.loading-subtitle {
  font-size: 0.9rem;
  color: #666;
}

.loading-bar-bottom {
  position: absolute;
  bottom: 24px;
  left: 24px;
  right: 24px;
}

.loading-bar-track {
  position: relative;
  width: 100%;
  height: 8px;
  background-color: #e0e0e0;
  overflow: hidden;
  -webkit-border-radius: 4px;
  border-radius: 4px;
}

.loading-bar-fill {
  position: absolute;
  top: 0;
  left: -45%;
  width: 45%;
  height: 100%;
  background-color: #4B63AE;
  -webkit-animation: loadingBarSlide 1.4s linear infinite;
  animation: loadingBarSlide 1.4s linear infinite;
}

@-webkit-keyframes loadingBarSlide {
  0%   { left: -45%; }
  100% { left: 100%; }
}
@keyframes loadingBarSlide {
  0%   { left: -45%; }
  100% { left: 100%; }
}

.registrationfaults {
  position: relative;
  left: 45px;
  text-align: center;
  vertical-align: central;
  top: 400px;
  height: 60px;
  width: 90%;
  color: black;
  background-color: gray;
  border-style: solid;
  border-radius: 10px;
  border-color: black;
  z-index: 6000;
}

.statusmessage {
  position: fixed;
  width: 100%;
  top: 50%;
  align-content: center;
}

.noscroll {
  overflow-x: hidden;
  overflow-y: hidden;
}

.textlabels {
  font-size: small;
}

.highontop {
  z-index: 3000;
}

.topmessage {
  z-index: 4000;
}

.answerListDiv {
  width: 100%;
  max-height: 176px;
  overflow-x: hidden;

  border-radius: 6px;
  background-color: white;
}

.listselectionDiv {
  width: 100%;
  max-height: 320px;
  overflow-x: hidden;
  overflow-y: hidden;
  border-radius: 6px;
}

.optionsSelectionDiv {
  width: 100%;
  max-height: 326px;
  overflow-x: hidden;
  overflow-y: hidden;
}

.loginAnnouncement {
  font-size: 30px;
}

.onboardingmenu {
  display: table;
  margin: 0 auto 0 auto; /* Start 80px from the top and center horizontally */
  /*height: calc(100vh - 80px); /* Subtract 80px from the total viewport height for vertical centering */
  height: 250px;
  top: 160px !important;
  padding: 0;
  /*padding-top:80px;*/
}

.onboardingmenuitem {
  display: table-cell;
  text-align: center; /* Centers text horizontally */
  /*vertical-align: middle; /* Centers content vertically */
  padding: 20px; /* Adds spacing between items */
  /* background-color:#c9302c; */
}

.onboardingmenuimage {
  display: block;
  margin: 0 auto; /* Centers the image horizontally */
  width: 168px; /* Adjust the image size as needed */
}

.onboardingmenuinfo {
  margin: 0 auto; /* Centers the image horizontally */
  width: 168px; /* Adjust the image size as needed */
  padding-top: 20px;
}

#AccountActivationSummary_questions {
  display: table;
  width: 80%;
  border-collapse: collapse;
  background-color: rgb(238, 238, 238);
  margin: 0 auto;
}

.accountSummaryRow {
  display: table-row;
}

.columnAppInfoName,
.columnAppInfoValue {
  display: table-cell;
  padding: 6px;
  vertical-align: top;
}

.firstRow .columnAppInfoName,
.firstRow .columnAppInfoValue {
  font-weight: bold;
}

.lastRow .columnAppInfoName,
.lastRow .columnAppInfoValue {
  border-bottom: none;
}

/* Remove focus outline from all elements, especially divs and buttons */
div:focus,
button:focus,
.keyboardbutton:focus {
  outline: none !important;
  box-shadow: none !important;
}

.serviceapp-buttonbar {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  background: #f9f9f9;
  padding: 15px 15px;
  text-align: center;
  box-sizing: border-box;
  box-shadow: none /*0 -2px 8px rgba(0, 0, 0, 0.07)*/;
  z-index: 999;
  height: 80px;
}

.serviceapp-menuitem,
.serviceapp-arrow {
  display: inline-block;
  margin: 0 5px;
  height: 50px;
  min-width: 80px;
  text-align: center;
  vertical-align: middle;
  box-shadow: none;
  box-sizing: border-box;
  border: none;
  padding: 0 10px;
  line-height: 50px; /* Zorgt voor verticale centrering */
  border-radius: 0.3rem;
  background-color: #4b63ae;
  color: white;
  font-weight: bold;
  font-size: 18px;
  word-break: break-word;
  white-space: normal;
  overflow: hidden;
}

/* Voor tekst op 2 regels, overschrijf line-height als nodig */
.serviceapp-menuitem span {
  display: inline-block;
  vertical-align: middle;
  line-height: normal;
  white-space: normal;
  word-break: break-word;
  font-size: 18px;
}

.serviceapp-arrow {
  min-width: 40px;
  width: 40px;
}

.serviceapp-arrow:disabled {
  background: #bbb;
}

.serviceapp-information-section {
  width: 100%;
  height: 100%;
  display: block;
  padding-top: 30px;
}

.serviceapp-information-upper {
  display: block;
  width: 100%;
  padding: 10px 0 0 10px;
}

.serviceapp-information-row {
  display: block;
  margin-bottom: 8px;
}

.serviceapp-information-label {
  font-weight: bold;
  color: #222;
  min-width: 200px;
  margin-right: 8px;
  display: inline-block;
}

.serviceapp-information-value {
  color: #444;
  display: inline-block;
  text-align: right;
  width: 50%;
}

.serviceapp-information-lower {
  display: block;
  width: 100%;
  text-align: center;
  margin-top: 0;
}

.serviceapp-information-lower-flex {
  display: block;
  width: 100%;
  margin-top: 0;
  text-align: left;
  padding-top: 20px;
}

.serviceapp-supply-group {
  display: inline-block;
  vertical-align: top;
  margin-right: 20px;
  margin-left: 0;
  text-align: center;
}

.serviceapp-information-bar-label {
  margin-bottom: 6px;
  font-weight: bold;
  color: #222;
  text-align: center;
}

/* Supply bars */
.serviceapp-supply-bars-row {
  display: block;
  width: auto;
  height: 80px; /* minder hoog zodat ze niet uit beeld lopen */
  margin-top: 0;
  margin-bottom: 0;
  text-align: center;
}

.serviceapp-supply-bar-holder {
  width: 20px;
  height: 80px; /* minder hoog zodat ze niet uit beeld lopen */
  background: #fff;
  border: 2px solid #000;
  border-radius: 5px;
  margin: 0 4px;
  position: relative;
  display: inline-block;
  vertical-align: bottom;
}

.serviceapp-contact-section {
  height: 100%;
  width: 100%;
  display: table;
}

.serviceapp-contact-header-row {
  display: table-row;
  height: 20%;
}

.serviceapp-contact-header-cell {
  display: table-cell;
  vertical-align: top;
  text-align: center;
}

/*
.serviceapp-contact-header-cell h2 {
  margin: 0;
  font-size: 1.3em;
  color: #005fa3;
}
*/

.serviceapp-contact-image-row {
  display: table-row;
  height: 40%;
}

.serviceapp-contact-image-cell {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
}

.serviceapp-contact-image {
  max-width: 90%;
  /*max-height: 120px;*/
  margin-bottom: 16px;
  display: inline-block;
}

.serviceapp-contact-info-row {
  display: table-row;
  height: 40%;
}

.serviceapp-contact-info-cell {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
  padding: 0 5%;
}

.serviceapp-contact-info-item {
  margin: 10px 0;
}

.serviceapp-contact-info-label {
  font-weight: bold;
  color: #222;
}

.serviceapp-contact-info-value {
  margin-left: 4px;
  color: #222;
}

.serviceapp-maincontent-table {
  width: 100%;
  height: 100%;
  display: table;
  table-layout: fixed;
}

.serviceapp-maincontent-cell {
  display: table-cell;
  width: 50%;
  height: 100%;
  vertical-align: top;
  padding: 0;
}

h2#serviceappheadertext {
  text-align: center;
  margin: 15px;
}

#mainexit {
  fill: #4b63ae;
  cursor: none;
}

/* Keyboard button style for pincode and fax keyboards */
.keyboard-btn-style {
  text-align: center;
  vertical-align: middle;
  height: 48px;
  line-height: 48px;
}