.text-logo {
  font-size: 18px;
  line-height: 1;
  font-weight: 500 !important;
  color: darkred;
}
.text-true {
  color: dodgerblue;
}
.text-false {
  color: red;
}
.text-True {
  color: dodgerblue;
}
.text-False {
  color: red;
}
.text-2 {
  color: indianred;
}
.text-1 {
  color: dodgerblue;
}
.text-0 {
  color: gray;
}
.text-asset-2 {
  color: indianred;
}
.text-asset-1 {
  color: dodgerblue;
}
.text-asset-0 {
  color: gray;
}
.text-gw-status-1 {
  color: dodgerblue;
}
.text-gw-status-0 {
  color: indianred;
}
.text-gw-status-2 {
  color: white;
}
.text-map-true {
  color: blue;
}
.text-map-false {
  color: white;
}
.text-fb1 {
  color: #F5F5F5;
}
.text-fb2 {
  color: #E5E5E5;
}
.text-fb3 {
  color: #B3B3B3;
}
.text-fb4 {
  color: #808080;
}
.text-db {
  color: #00008B;
}
.text-l1 {
  font-weight: 600;
}
.text-bold {
  font-weight: 500 !important;
}
b {
  font-weight: 500 !important;
}
.text-fs-1e {
  font-size: 1em !important;
}
.text-fs-2e {
  font-size: 1.3em !important;
  font-weight: 600;
}
.text-fs-3e {
  font-size: 3em !important;
}
.text-fs-12 {
  font-size: 12px !important;
}
.text-fs-13 {
  font-size: 13px !important;
}
.text-fs-14 {
  font-size: 14px !important;
}
.text-fs-15 {
  font-size: 15px !important;
}
.text-fs-16 {
  font-size: 15px !important;
}
.text-fs-18 {
  font-size: 18px !important;
}
.text-fs-21 {
  font-size: 21px !important;
}
.text-fs-24 {
  font-size: 24px !important;
}
.text-fs-28 {
  font-size: 28px !important;
}
.text-fs-32 {
  font-size: 32px !important;
}
.text-fs-36 {
  font-size: 36px !important;
}
.text-fs-h1 {
  font-weight: 600;
  /* line-height: 26px;*/
  /* color: darkred;*/
}
.text-fs-h2 {
  font-size: 24px !important;
  font-weight: 500;
  line-height: 34px;
}
.text-tile-header {
  font-weight: 600;
}
.font-weight-400 {
  font-weight: 400 !important;
}
.font-weight-500 {
  font-weight: 500 !important;
}
.font-weight-600 {
  font-weight: 600 !important;
}
.lh-1 {
  line-height: 1.1;
}
.lh-12 {
  line-height: 1.2;
}
.text-darkblue {
  color: #00008B !important;
}
p {
  margin-top: 0;
  margin-bottom: 3px !important;
}
.text-whitesmoke {
  color: #F5F5F5 !important;
}
.gridNoTextWrap {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.text-card-header {
  font-size: 18px !important;
}
.bg-fb0 {
  background: #FFFFFF;
}
.bg-light {
  background: #f6f6f8 !important;
}
.bg-fb1 {
  background: #f6f6f8 !important;
}
.bg-fb2 {
  background: #E9E9E9;
}
.bg-fb3 {
  background: #D9D9D9;
}
.bg-fb4 {
  background: #00204d;
}
.e:hover {
  background-color: #E5E5E5;
}
.e-r:hover {
  background-color: #f5f5f5;
}
.border-light {
  border: 1px solid #F5F5F5 !important;
}
.dx-widget {
  font-family: "Sarabun", Verdana, san-serif !important;
  font-size: 16px !important;
}
.dx-treelist-header-panel .dx-datagrid-header-panel {
  padding-bottom: 0.25rem !important;
}
.dx-datagrid .dx-row > td {
  padding: 3px !important;
}
.dx-datagrid-rowsview .dx-row.dx-group-row {
  font-weight: 500 !important;
}
.dx-datagrid-content .dx-datagrid-table .dx-row .dx-command-edit {
  min-width: 50px !important;
  width: 50px !important;
}
.dx-treelist .dx-row > td {
  padding: 3px !important;
}
.dx-row.dx-data-row.dx-column-lines.dx-state-hover td {
  background: #f3f4f6 !important;
}
.dx-row.dx-data-row.dx-state-hover td {
  background: #f3f4f6 !important;
}
.dx-datagrid-headers {
  color: #001481 !important;
  font-weight: 600 !important;
}
.dx-treelist-headers {
  color: #001481 !important;
  font-weight: 600 !important;
}
.dx-datagrid {
  background-color: transparent !important;
}
.dx-datagrid-container {
  background-color: transparent !important;
}
.dx-treelist {
  background-color: transparent !important;
}
.dx-treelist-container {
  background-color: transparent !important;
}
.dx-toolbar {
  background-color: transparent !important;
}
.dx-datagrid .dx-header-filter {
  color: red !important;
}
.dx-datagrid .dx-header-filter-empty {
  color: #DDDDDD !important;
}
.dx-treelist-rowsview tr:not(.dx-row-focused) .dx-treelist-empty-space {
  color: red !important;
}
.lh-1 {
  line-height: 1.1;
}
.mh-5 {
  min-height: 5px;
}
.mh-15 {
  min-height: 15px;
}
.mh-25 {
  min-height: 25px;
}
.mh-35 {
  min-height: 35px;
}
.mh-40 {
  min-height: 40px;
}
.mh-45 {
  min-height: 40px;
}
.mh-50 {
  min-height: 50px;
}
.mh-60 {
  min-height: 60px;
}
.mh-65 {
  min-height: 65px;
}
.mh-80 {
  min-height: 80px;
}
.mh-91 {
  min-height: 91px;
}
.mh-100 {
  min-height: 100px;
}
.maxh-100 {
  max-height: 100px;
}
.mh-120 {
  min-height: 120px;
}
.mh-130 {
  min-height: 130px;
}
.mh-150 {
  min-height: 150px;
}
.mh-175 {
  min-height: 175px;
}
.mh-210 {
  min-height: 210px;
}
.mh-225 {
  min-height: 225px !important;
}
.mh-245 {
  min-height: 248px !important;
}
.mh-248 {
  min-height: 248px !important;
}
.mh-250 {
  min-height: 250px !important;
}
.mh-300 {
  min-height: 300px !important;
}
.mh-350 {
  min-height: 350px !important;
}
.mh-200 {
  min-height: 200px;
}
.mh-500 {
  min-height: 500px;
}
.mh-100v {
  min-height: 90vh;
}
.brandIcon {
  /*    position: absolute;
    top: -60px;*/
  left: 20px;
}
.img-center-cropped {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}
.img-left-icon {
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  width: 125px;
  height: 125px;
  background-color: white;
}
.img-cropped {
  object-fit: contain;
  /*  border: 1px solid #EEEEEE;*/
  /*    padding: 2px;*/
  /*    background-color: #FFFFFF;*/
}
.img-225 {
  width: 225px;
  height: 112.5px;
}
.img-140 {
  width: 140px;
  height: 140px;
}
.img-160 {
  width: 160px;
  height: 160px;
}
.img-120 {
  width: 120px;
  height: 120px;
}
.img-100 {
  width: 100px;
  height: 100px;
}
.img-80 {
  width: 80px;
  height: 80px;
}
.img-22 {
  width: 22px;
  height: 22px;
}
.img-20 {
  width: 20px;
  height: 20px;
}
.img-25 {
  width: 25px;
  height: 25px;
}
.img-30 {
  width: 30px;
  height: 30px;
}
.img-40 {
  width: 40px;
  height: 40px;
}
.img-48 {
  width: 48px;
  height: 48px;
}
.img-50 {
  width: 50px;
  height: 50px;
}
.img-60 {
  width: 60px;
  height: 60px;
}
.img-58 {
  width: 58px;
  height: 58px;
}
.img-65 {
  width: 65px;
  height: 65px;
}
.img-100p {
  width: 100%;
  height: 100%;
}
#ImageRow {
  position: absolute;
  top: 20px;
  left: 25px;
}
.image-container {
  width: 100%;
  position: relative;
}
.stretchy-image {
  width: 90%;
  /*  position: absolute;*/
}
.tile-48 {
  min-height: 48px;
  min-width: 105px;
}
html {
  overflow: scroll;
  overflow-y: scroll;
}
body {
  font-family: "Sarabun", Verdana, san-serif !important;
  font-size: 15px !important;
  text-align: left;
  direction: ltr;
  unicode-bidi: embed;
  line-height: 1.4 !important;
  background-color: #FFFFFF !important;
}
b {
  font-weight: 600 !important;
}
.container-non-responsive {
  margin-left: auto;
  margin-right: auto;
  min-width: 1280px;
  /*
    max-width: 1440px;*/
  /* padding-left: 8px;
    padding-right: 8px;*/
}
.m-1m {
  margin: -0.25rem !important;
}
.p-1m {
  padding: -0.25rem !important;
}
.truncate {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.bg-center {
  background-size: cover;
  /* <------ */
  background-repeat: no-repeat;
  background-position: center center;
  /* optional, center the image */
}
.brandIcon {
  /*    position: absolute;
    top: -60px;*/
  left: 20px;
}
.rounded-circle {
  border-radius: 50%;
}
.sb-300 {
  -ms-flex: 0 0 280px !important;
  flex: 0 0 280px !important;
  width: 280px;
}
.singleLine {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.row {
  margin-right: 0px !important;
  margin-left: 0px !important;
}
.menu-active {
  background-color: #CCCCCC !important;
}
.menu-inactive {
  background-color: #EEEEEE !important;
}
.container-fluid {
  width: 100%;
  padding-right: 0px !important;
  padding-left: 0px !important;
}
a {
  text-decoration: none !important;
  color: black !important;
}
a:hover {
  text-decoration: none !important;
  color: #0038f5 !important;
}
a:visited,
a:focus {
  text-decoration: none !important;
  color: black;
}
img {
  border: 0;
}
#navigation {
  /*position: fixed;*/
  /* Fixed Sidebar (stay in place on scroll) */
  /*top: 0;*/
  /* Stay at the top */
  /*z-index: 1;*/
  /* Stay on top */
  /*overflow-y: hidden;*/
  /*  padding: 0.5rem !important;*/
  /*background-color: white;*/
}
.sidenav {
  width: 240px;
  /* Set the width of the sidebar */
  position: fixed;
  /* Fixed Sidebar (stay in place on scroll) */
  z-index: 1;
  /* Stay on top */
  top: 0;
  /* Stay at the top */
  background-color: #fff;
  /* Black */
  /*  overflow-x: hidden;*/
  /* Disable horizontal scroll */
  /*  padding-top: 5px;*/
}
.side-nav-buttom {
  height: 100px;
  /* Full-height: remove this if you want "auto" height */
  width: 160px;
  /* Set the width of the sidebar */
  position: fixed;
  /* Fixed Sidebar (stay in place on scroll) */
  z-index: 1;
  /* Stay on top */
  bottom: 0;
  /* Stay at the top */
  background-color: #fff;
  /* Black */
  padding-top: 10px;
}
.side-nav-right-buttom {
  height: 50px;
  /* Full-height: remove this if you want "auto" height */
  width: 240px;
  /* Set the width of the sidebar */
  position: fixed;
  /* Fixed Sidebar (stay in place on scroll) */
  z-index: 1;
  /* Stay on top */
  bottom: 0px;
  /* Stay at the top */
  background-color: #fff;
  /* Black */
  padding: 4px;
}
.col-200px {
  width: 200px !important;
  /* Fixed width */
  flex: 0 0 auto;
  /* Prevents the column from growing or shrinking */
}
.col-300px {
  width: 300px !important;
  /* Fixed width */
  flex: 0 0 auto;
  /* Prevents the column from growing or shrinking */
}
.col-360px {
  width: 360px !important;
  /* Fixed width */
  flex: 0 0 auto;
  /* Prevents the column from growing or shrinking */
}
.col-50px {
  width: 50px !important;
  /* Fixed width */
  flex: 0 0 auto;
  /* Prevents the column from growing or shrinking */
}
.col-center {
  padding-top: 0rem !important;
  padding-left: 0rem !important;
  padding-right: 0rem !important;
  /*    min-height: 90vh;*/
}
.col-right {
  padding-right: 0rem !important;
}
.col-10p {
  flex: 0 0 auto;
  width: 10%;
}
.overlayLoading {
  /* argin-left: 10px;*/
  width: 1280px;
  display: none;
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 999;
  background: rgba(255, 255, 255, 0.8) url("/images/Loading/loading-progress-bar.gif") center no-repeat;
  background-size: 10% auto;
}
.p-l0 {
  padding-left: 0px !important;
  padding-right: 0px;
  color: #ff0000 !important;
}
.p-l1 {
  padding-left: 1px !important;
  padding-right: 0px;
}
.p-l2 {
  padding-left: 17px !important;
  padding-right: 0px;
}
.p-l3 {
  padding-left: 33px !important;
  padding-right: 0px;
}
.p-l4 {
  padding-left: 49px !important;
  padding-right: 0px;
}
.p-l5 {
  padding-left: 65px !important;
  padding-right: 0px;
}
.p-l6 {
  padding-left: 81px !important;
  padding-right: 0px;
}
.p-l7 {
  padding-left: 97px !important;
  padding-right: 0px;
}
.card-header {
  background-color: rgba(0, 0, 0, 0.1) !important;
  font-weight: 600;
}
.canvas-container {
  position: relative;
}
.zoom-display {
  position: absolute;
  top: 10px;
  right: 10px;
  background-color: rgba(0, 0, 0, 0.5);
  color: white;
  padding: 5px;
  border-radius: 3px;
  font-family: Arial, sans-serif;
  z-index: 999;
}
@page {
  size: A4;
  margin: 0;
}
@media print {
  html,
  body {
    width: 210mm;
    height: 297mm;
  }
  /* ... the rest of the rules ... */
}