@font-face {
  font-family: 'BitstreamVeraSans';
  src: url('./../fonts/vera.ttf');
}

html,
body {
  height: 100%;
  overflow: hidden;
}

.container-fixed {
  bottom: 0;
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
}

.container-fixed .col {
  height: 100%;
  overflow: auto;
}

.row-xs-12 {
  height: 100%;
}

.row-xs-11 {
  height: 91.66666666666666%;
}

.row-xs-10 {
  height: 83.33333333333334%;
}

.row-xs-9 {
  height: 75%;
}

.row-xs-8 {
  height: 66.66666666666666%;
}

.row-xs-7 {
  height: 58.333333333333336%;
}

.row-xs-6 {
  height: 50%;
}

.row-xs-5 {
  height: 41.66666666666667%;
}

.row-xs-4 {
  height: 33.33333333333333%;
}

.row-xs-3 {
  height: 25%;
}

.row-xs-2 {
  height: 16.666666666666664%;
}

.row-xs-1 {
  height: 8.333333333333332%;
}

#headercontainer {
  position: absolute;
  left: 0%;
  top: 0%;
  width: 100%;
  height: 3.5em;
  overflow: auto;
}

#grideditcontainer {
  position: absolute;
  left: 0%;
  top: 3.5em;
  width: 50%;
  height: calc(100% - 3.5em);
  overflow: auto;
}

#gridedit {
  background-color: #ffffff;
}

#imagecontainer {
  position: absolute;
  left: 50%;
  top: 3.5em;
  width: 50%;
  height: calc(100% - 3.5em - 11em);
  overflow: auto;
}

#controlscontainer {
  position: absolute;
  left: 50%;
  top: calc(100% - 11em);
  width: 50%;
  height: 11em;
  overflow: auto;
}

.myTable {
  width: 100%;
  border-collapse: collapse;
  background-color: var(--bs-white); /* #fdfeff; */
  color: var(--bs-black);
}

.myTable td,
.myTable th {
  border: 1px solid var(--bs-gray-400); /* #dbe0e5; */
  line-height: 1.5em;
}

.myTable th, 
.myTable tr td:first-child {
  background-color: var(--bs-gray-100); /* #f1f3f5; */
  font-weight: bold;
}

.myTable th,
.myTable td {
  line-height: 2em;
  padding: 3px;
}

.myTable tr td:nth-child(1) {
  width: 5em;
}

.myTable tr td:nth-child(2) {
  width: 4em;
}

.myTable tr td:nth-child(3),
.myTable tr td:nth-child(4),
.myTable tr td:nth-child(5) {
  width: 8em;
}

.myTable tr td:nth-child(6) {
  -bero-dummy: none;
}

.myTable tr td:nth-child(7) {
  width: 6em;
}

#contextMenu {
  position: absolute;
}

#contextMenu .disabled {
  color: #C0C0C0;
  background: none;
}

#contextMenu li a {
  cursor: pointer;
}

div.subtotal-label {
  width: 99%;
  text-align: right;
}

td.handle {
  background: #efefef;
}

td.handle {
  padding: 0 !important;
  vertical-align: middle !important;
  margin: 0;
  background: rgb(231, 231, 231);
  width: 26px;
  cursor: hand;
  cursor: pointer;
  min-width: 26px;
}

td.handle div {
  width: 0;
}

td.handle div span {
  display: block;
  width: 14px;
  height: 1px;
  background-color: rgb(182, 182, 182);
  margin: 3px;
  margin-left: 5px;
}

ul.dropdown-menu {
  list-style: none;
  background: #f1f3f5;
  padding: 5px;
  border: 1px solid #dbe0e5;
  color: #101316;
}

ul.dropdown-menu li {
  padding: 3px;
}

ul.dropdown-menu li:hover {
  background: #bec7d0;
}

ul.dropdown-menu li a {
  text-decoration: none !important;
  color: var(--bs-dropdown-color) !important;
  cursor: default;
}

ul.dropdown-menu td {
  height: 1em;
}

ul.dropdown-menu li.divider {
  border-bottom: 1px solid #101316;
}

@media (max-device-width: 120px) {
  body {
    zoom: 0.125;
  }
}

@media (min-device-width: 120px) and (max-device-width: 240px) {
  body {
    zoom: 0.25;
  }
}

@media (min-device-width: 240px) and (max-device-width: 480px) {
  body {
    zoom: 0.3275;
  }
}

@media only screen and (min-device-width: 480px) and (max-device-width: 768px) {
  body {
    zoom: 0.5;
  }
}

@media only screen and (min-device-width: 768px) and (max-device-width: 992px) {
  body {
    zoom: 0.625;
  }
}

@media only screen and (min-device-width: 992px) and (max-device-width: 1200px) {
  body {
    zoom: 0.75;
  }
}

@media only screen and (min-device-width: 1200px) and (max-device-width: 1600px) {
  body {
    zoom: 0.825;
  }
}

@media only screen and (min-device-width: 1600px) and (max-device-width: 2400px) {
  body {
    zoom: 1.0;
  }
}

@media only screen and (min-device-width: 2400px) and (max-device-width: 2800px) {
  body {
    zoom: 1.5;
  }
}

@media only screen and (min-device-width: 2800px) {
  body {
    zoom: 2.0;
  }
}
