body,
.btn,
.dropdown-menu,
.form-control,
.input-group-text {
  font-size: 14px;
  line-height: 1.42857143;
}

.Mnu_Bar a:hover, 
.Mnu_Drop:hover > .Mnu_DropBtn {
  background-color: #b14900;
}

.HeadBar {
  background-color: #d05400;
}

  .HeadBar button.btn {
    white-space: nowrap;
  }

.HeadBarCmd {
  float: right;
  margin-top: -41px;
  margin-left: auto;
  height: 40px;
  display: flex;
  flex-wrap: nowrap;
  white-space: nowrap;
  align-items: center;
}

  .HeadBarCmd > button.btn,
  .HeadBarCmd > .btn-group {
    margin-right: 5px;
  }


.HeadAlt {
  background-color: orange;
}

/*
.HeadSub {
  background-color: #ffefd1;
}
*/

.HeadBarSub {
  height: 30px;
  position: absolute;
  top: 0px;
  right: 0px;
  display: flex;
  /*align-items: baseline;*/
  align-items: flex-start;
}

  .HeadBarSub > .btn,
  .HeadBarSub > .btn-group > .btn {
    padding: 1px 8px 2px 8px;
    border-radius: 0px;
  }

  .HeadBarSub > .btn.dropdown-toggle-split {
    padding: 0px 4px 0px 4px;
  }

  .HeadBarSub > .btn-divider-ver {
    min-height: 25px;
    margin: 0px 3px 0px 0px;
  }

  .HeadBarSub > .btn-group > .dropdown-menu {
    border-radius: 0px;
  }

  .HeadBarSub > .btn,
  .HeadBarSub > .btn-group {
    min-height: 25px;
    margin-right: 3px;
  }

  .HeadBarSub > .btn-group > .dropdown-toggle::after {
    margin-bottom: -1px;
  }



.DivHead {
  /*
  display: inline-block;
  float: left;
  clear: both;
  */
  max-width: 620px;
  padding: 2px 2px 1px 12px;
  margin: 4px 4px 8px; /*บน ซ้ายขวา ล่าง*/
  border-radius: 4px 4px 0 0;
  background-color: #f2f4f7;
}

.DivHeadSide {
  padding: 0px;
  margin: 5px 5px 0px 5px;
}

  .DivHead .input-group {
    width: 100%;
  }

  .DivHead > span:first-child {
    line-height: 1.6;
    font-weight: bold;
    color: #888888;
  }

    .DivHead .SpnInfo {
      float: right;
      font-weight: normal;
      font-size: x-small;
      padding: 4px 8px 0px 0px;
      color: #9E9E9E;
    }

    .DivHead .input-group-btn > .btn > i {
      color: #777777;
    }

  .DivHead .SpnCenter,
  .DivHead .SpnEnd {
    display: table-cell;
    vertical-align: middle;
    width: 35px;
    padding: 0 8px;
    text-align: center;
    border: 1px solid #dcdcdc;
    border-left: 0;
    white-space: nowrap;
    background-color: #e9ecef;
  }

  .DivHead .SpnCenter {
    border-right: 0;
  }

  .DivHead .SpnSpace {
    display: table-cell;
    width: 1px;
  }

  .DivHead .SpnSpace2 {
    display: table-cell;
    width: 2px;
  }

  .DivHead .SpnSpace4 {
    display: table-cell;
    padding: 0px 2px;
  }

  .DivHead .SpnTail {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    border: 1px solid #ccc;
    border-left: 0;
    padding: 0px 6px 0px 6px;
    white-space: nowrap;
    width: 32px;
  }

  .DivHead .SpnTailChk {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    border: 1px solid #ccc;
    border-left: 0;
    padding: 0px 6px 0px 24px;
    white-space: nowrap;
    width: 32px;
  }

    .DivHead .SpnTailChk input[type=checkbox] {
      margin: 4px 6px 0px -18px;
      float: left;
    }

  .DivHead .SpnRight {
    display: table-cell;
    /*vertical-align: middle;*/
    width: 35px;
    text-align: center;
    border: 1px solid #ccc;
    border-right: 0;
    padding: 0px 6px;
    white-space: nowrap;
    background-color: #e9ecef;
  }

  .DivHead .SpnBtn {
    padding: 0px;
  }

    .DivHead .SpnBtn button {
      border: none;
      border-radius: initial;
      width: 100%;     
      padding: 3px 6px;
    }

  .DivHead .DivRight {    /* หากต้องการให้ input ที่อยู่ใน .DivHead มีความกว้างตามกำหนด ให้ครอบด้วย <div class="DivRight"><div> จากนั้นค่อยกำหนดความกว้างที่ div นี้ได้ทั้ง px, % */
    display: table-cell;
  }


.DivHeadSideR {
  max-width: 450px;
  margin: 0px;
  padding: 2px 8px;
  border-radius: 0px;
}

  .DivHeadFoot {
    display: flex;
    padding: 8px 0px 6px;
  }


/* Custom bootstrap ============================================================*/
.form-control {
  height: 28px;
  padding: 0 0 1px 5px;
  border-radius: 0;
}

  .form-control.es-input {
    background-color: white;
  }

  .form-control[readonly]:not(.Fixread) {
    background-color: floralwhite;
  }


/* Drp -------------------------------------------------------------------------*/
div.dropdown-menu {
  max-height: 320px;
  overflow: auto;
  overflow-x: hidden;
}

div.dropdown-menu > a > i.glyphicon-ok {
  visibility: hidden;
}

div.dropdown-menu > a.selected > i.glyphicon-ok {
  visibility: visible;
  color: #607D8B;
}

div.dropdown-menu > a:active > i.glyphicon-ok {
  visibility: visible;
  color: white;
}

div.dropdown-menu .dropdown-item {
  padding: 4px 20px 4px 26px;
  /*padding: 4px 16px 4px 26px;*/
}

  .dropdown-item.chk {
    padding-right: 22px !important;
  }

div.btn-group.drop-sideleft > button.btn.dropdown-toggle-split {
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px  
}



/* input group table : from bootstratp3 ----------------------------------------*/
.DivHead .input-group {
  position: relative;
  display: table;
  margin: 1px 0;
  border-collapse: separate;
}

  .input-group-addon {
    display: table-cell;
    width: 120px;
    padding: 6px 6px 4px 8px;
    line-height: 1;
    text-align: left;
    vertical-align: top;
    white-space: nowrap;
    border: 1px solid #ccc;
    background-color: #e9ecef;
  }

    span.input-group-addon.indent {
      padding-top: 4px;
      padding-left: 16px;
      font-size: 13px;
      white-space: pre-wrap;
      text-indent: -8px;
      line-height: 1.1;
    }

    span.input-group-addon > span {
      display: block;
      padding: 4px 0px 0px 8px;
      color: #9E9E9E;
      font-size: 13px;
    }

  .input-group-btn {
    display: table-cell;
    width: 1%;
    vertical-align: top;
    border: 1px solid #ccc;
    border-left: none;
    align-self: center;
  }

  .input-group-addon:first-child {
    border-right: 0px;
  }

  div.input-group-addon {
    padding: 0px !important;
  }

  div.input-group-addon button {
    padding: 3px 2px 2px 8px;
    width: 100%;
    vertical-align: baseline;
    text-align: left;
    border: none;
    border-radius: initial;
  }

  div.input-group-addon .btn.dropdown-toggle::after {    /* caret */
    float: right;
    margin-top: 8px;
  }

  div.input-group-addon span.caret {
    float: right;
    margin: 8px 6px 2px 2px;
  }

    .addon-menu-chk > button.dropdown-toggle {
      padding-right: 26px;
    }

      .addon-menu-chk > div.addon-chk {
        display: inline-block;
        margin-left: -23px;
      }

      .addon-menu-chk > div.addon-chk > input[type=checkbox] {
        float: right;
        margin-bottom: -2px;
      }


  span.input-group-addon.input-text {
    padding: 0px 3px;
    background-color: #f8f9fa;
  }

    span.input-group-addon.input-text > input[type=text] {
      border: none;
      height: 26px;
      background-color: #f8f9fa;
    }


  .DivHead .input-group .form-control {
    display: table-cell;
    width: 100%;
  }

  .DivHead .input-group textarea.form-control {
    display: flex;
    padding-top: 2px;
  }

.form-control:focus {
  border-color: #66afe9;
  outline: 0;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, 0.6);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, 0.6);
}

.device-host {
  color: #248ee3;
}

.permanent {
  color: royalblue;
}



/* input group bootstrap 4 -----------------------------------------------------*/
.input-group {
  margin: 1px 0;
}

  /*.input-group .btn {*/
  .input-group>.btn,        /* เพิ่มการกำหนดปุ่มที่ไม่ใช่ btn-default */
  .input-group .btn.btn-default {
    padding: 3px 8px;
    border: 1px solid #ccc;
    border-radius: 0px;
    white-space: nowrap;
  }

  .input-group .btn.btn-default {
    background-color: #f8f9fa;
  }

  .input-group .btn.btn-default:hover {
    background-color: #e9ecef;
  }

    .input-group > .input-group-addon + .btn.btn-default {
      padding-left: 20px;
      padding-right: 20px;
    }

  .input-group div .btn {
    width: 100%;
    min-height: 26px;
    border: none !important;
    /*border: none;*/
  }

    .input-group .dropdown-header .btn {
      border: 1px solid #ccc;
    }

.input-group-prepend,
.input-group-append {
  border: 1px solid #ccc;
}

  .input-group-prepend .btn {
    text-align: left;
  }

  .input-group-text {
    width: 100%;
    padding: 3px 7px;
    border: none;
    border-radius: 0;
    text-align: left;
    vertical-align: top;
  }

.input-group-btn > .btn {
  padding: 4px 7px 2px;
  border: none;
}

  div.input-group > span.sub1 {
    padding-left: 24px;
  }

  div.input-group > .input-group-btn > button {
    border-radius: 0;
    padding-top: 3px;
  }

  div.input-group > textarea {
    resize: vertical;
    min-height: 40px;
    /*max-height: 202px;*/
    font-size: 13px;
  }


  div.input-group > div.input-chk {
    /*display: table-cell;*/
    display: flex;
    flex-wrap: wrap;
    min-height: 28px;
    padding-bottom: 3px;
    vertical-align: top;
    border: 1px solid #ccc;
    background-color: white;
  }

    div.input-group > div.input-chk.readonly {
      background-color: floralwhite;
    }

    .input-grd.readonly tr.jqgrow td[role=gridcell] {
      background-color: floralwhite;
    }

    /*
    div.input-group > input[type=checkbox] {
      float: left;
      margin: 7px 10px 2px;
    }
    */

    div.input-group > div.input-chk > input[type=checkbox] {
      float: left;
      margin: 6px 1px 1px 7px;
    }

    div.input-group > div.input-chk > label {
      display: inline-block;
      margin: 3px 6px 0px 6px;
      vertical-align: top;
      font-weight: normal;
      white-space: nowrap;
    }

      div.input-group > div.input-chk > label > input[type=checkbox] {
        float: left;
        margin: 3px 6px 1px 1px;
      }

      div.input-group > div.input-chk > label.indent {
        margin-left: 24px;
      }

   div.input-group.input-split4 {
     height: 4px;
     color: darkgray;
   }

   div.input-group.input-split6 {
     height: 6px;
     color: darkgray;
   }

   div.input-group.input-split {
     height: 8px;
     color: darkgray;
   }


.input-group.merge {             /* merge togather */
  margin-top: -2px !important;
}

  .input-group.merge .input-group-addon {
    border-top: none;
  }




/* btn group -------------------------------------------------------------------*/
.btn {
  padding: 4px 10px;
}

.btn.dropdown-toggle > i {
  margin-right: 0px;
}

/*
.btn.dropdown-toggle {
  padding-top: 2px;
  padding-bottom: 0px;
}
*/

.btn.dropdown-toggle-split {
  padding: 0px 6px 0px 6px;
}

.dropdown-item > i {
  float: left;
  margin-top: 2px;
  margin-left: -19px;
  color: steelblue;
}

.dropdown-item:active > i,
.dropdown-item.active > i {
  color: white;
}

.dropdown-item:focus {
  outline: none;
}

.dropdown-item > input[type=checkbox] {
  float: left;
  margin: 3px 8px 0px -12px;
}

.dropdown-header {
  padding: 4px 14px;
  text-align: left;
  font-size: 13px;
}

div.dropdown-menu.show {
  padding: 6px 0px;
}



  .btn-warning:active, 
  .btn-warning.active {
    background-color: #ffc300;
    border-color: #ffbf00;
    outline: none;
  }

  .btn-warning.active:hover, 
  .btn-warning.active.hover {
    background-color: #ffab00;
    border-color: #ffca2a;
  }

  .btn-warning.active:focus, 
  .btn-warning.active.focus {
    background-color: #ffc300;
    border-color: #ffbf00;
    outline: none;
  }

  
button.btn > i + span.caret {
  margin-left: 2px;
}

/* ยังใช้ไม่ได้
*::placeholder,
*::-ms-input-placeholder,
*:-ms-input-placeholder {
  color: red;
  opacity: 0.5;
}
*/

::placeholder {
  color: silver;
  opacity: 0.6;
}
::-ms-input-placeholder {
  color: silver;
  opacity: 0.6;
}
:-ms-input-placeholder {
  color: silver;
  opacity: 0.6;
}

/* jqgrid ======================================================================*/

.grd-cellstatus {
  width: 16px;
  height: 16px;
  display: inline-block;
  margin: 0px 0px -4px 0px;
  padding: 1px;
}

.grd-cellstatus > div {
  width: 100%;
  height: 100%;
  opacity: 1;
  background-position: center;
  background-repeat: no-repeat;
}


/* card ------------------------------------------------------------------------*/

  .subgrid-data .divTxt {
    padding: 0px 0px 0px 2px;
    line-height: 16px;
    color: steelblue;
  }

  .subgrid-data .divStBox {
    min-width: 20px;
    min-height: 16px;
    line-height: 16px;
    margin-right: 1px;
    background: center no-repeat;
    color: #e7e7e7;
    text-align: center;
  }

    .subgrid-data .divStBox.Y {
      color: black;
    }

    .subgrid-data .divStBox.At { 
      background-image: url("../Images/attach16.png"); 
    }

    .subgrid-data .divStBox.Rj { 
      background-image: url("../Images/report16_error.png"); 
      cursor: pointer;
    }

    .subgrid-data .divStBox.Rj:hover {
      background-color: #ffc107;
    }

    .subgrid-data .divStBox.Cr { 
      background-image: url("../Images/critical16.png"); 
    }
    .subgrid-data .divStBox.Cm { 
      background-image: url("../Images/info16.png");
    }



/* Column ======================================================================*/
.ColNo {
  min-width: 70px;
}


/* Spl =========================================================================*/
.splitter-resizebar {
  background-color: #da7700 !important
}


/* flex-splitter ===============================================================*/
[data-flex-splitter-horizontal] > [role="separator"], 
[data-flex-splitter-vertical] > [role="separator"] {
  background-color: #da7700;
}

[data-flex-splitter-horizontal] > div, 
[data-flex-splitter-vertical] > div {
  position: relative;
}

[data-flex-splitter-horizontal] > [role="separator"] {
  width: 6px;
}

[data-flex-splitter-vertical] > [role="separator"] {
  height: 6px;
}

  [data-flex-splitter-horizontal] > [role="separator"].s4 {
    width: 4px;
  }

  [data-flex-splitter-vertical] > [role="separator"].s4 {
    height: 4px;
  }

  [data-flex-splitter-horizontal] > [role="separator"]::before, 
  [data-flex-splitter-vertical] > [role="separator"]::before {
    display: none;
  }

  [data-flex-splitter-horizontal] > [role="separator"]:hover, 
  [data-flex-splitter-vertical] > [role="separator"]:hover {
    background-color: #da7700e6;
  }

.fsp-pane-visible {
  flex-grow: 1;
}


.Spl-Hide1 > [role="separator"],        /* for hide pane, 1=left or top, 2=right or bottom  */
.Spl-Hide1 > div:nth-child(1), 
.Spl-Hide2 > [role="separator"],
.Spl-Hide2 > div:nth-child(3) {
  display: none !important;
}



/* nav-tabs ====================================================================*/
.nav-tabs {
  height: 41px;
}

  div.tab-content.t41 {
    top: 41px;
  }

  /*
  .nav-tabs + div.tab-content {
    top: 41px;
  }
  */

.nav-tabs-sm {
  height: 31px;
}

  .nav-tabs.nav-tabs-sm .nav-link {
    min-height: 31px;
    padding: 4px 15px;
  }

  .nav-tabs.nav-tabs-sm + div.tab-content {
    top: 31px;
  }

.nav-tabs.h31 {
  height: 31px;
}

  div.tab-content.t31 {
    top: 31px;
  }


.nav-bar.h41 {
  margin-top: -41px;
  padding: 5px 6px 0px 0px;
  display: flex;
  white-space: nowrap;
  /*overflow: hidden; มองไม่เห็นเมนู dropdown*/
}
  .nav-bar > .btn {
    margin-left: 6px;
    min-width: 70px;
  }

  .nav-bar .btn-divider-ver {
    height: auto;
  }

.nav-bar.h31 {
  margin-top: -31px;
  padding: 2px 6px 0px 0px;
}

  .nav-bar.h31 > .btn-group > .btn {
    height: 25px;
    padding-top: 1px;
  }



/* AwTab ======================================================================*/
/*
.AwTab .TabBtns > button.Active {
  background-color: orange;
}
*/


/* Nav ========================================================================*/
.Nav {
  list-style: none;
  padding-left: 12px;
}

/* Images =====================================================================*/
.ImgBg16Node {
  background-position: 2px center;
  background-repeat: no-repeat;
  padding-left: 22px !important;
}

.ImgBg16Node.ImgBg16_Report {
  background-image: url('../Images/report16.png');
}

.ImgBg16Node.ImgBg16_Photo {
  background-image: url('../Images/photo16.png');
}

.ImgBg16Node.ImgBg16_DocPrefer {
  background-image: url('../Images/Config/docprefer16.png');
}

.ImgBg24Node {
  float: left;
  margin-left: -8px;
  padding: 8px 12px 8px 38px !important;
  background-position: 8px center;
  background-repeat: no-repeat;
}

  .ImgBg24_Users {
    background-image: url('../Images/user24.png');
  }

  .ImgBg24_Usergroup {
    background-image: url('../Images/usergroup24.png');
  }

.TreNav li a.ImgBg24Node.selected {
  font-weight: 600;
  border-radius: 4px;
}

i.Icon {
  display: inline-block;
  width: 16px;
  height: 16px;
  margin: 0px -3px -3px -3px;
  background-repeat: no-repeat;
  background-position: center;
}

i.QuadScr {
  background-image: url('../Images/pregnant16.png');
}

.Img-jpg16          { background-image: url('../Images/jpg16.png'); }
.Img-report16_down  { background-image: url('../Images/report16_down.png'); }


/* Modal =======================================================================*/




/* AwEcn : Exceptional Condition ==============================================*/

.AwEcn .modal-dialog {
  min-width: 800px;
}

.AwEcn .modal-body {
  padding: 10px;
  /*overflow: auto; เซ็ตไม่ได้ เพราะจะไม่เห็น dropdown ตัวเลือก test, ไม่ว่าเซ็ต overflow แบบไหนก็ขึ้น scroll หมด*/  
}

.AwEcn .DivHead {
  float: none;
  margin: 0px;
}

.AwEcn .DivHead div.input-group {
  width: 320px;
}

.AwEcn .input-group-addon {
  width: 86px;
}

.AwEcn .EcnDivBtn {
  position: absolute;
  display: grid;
  left: 366px;
  bottom: 20px;
}

  .AwEcn .EcnDivBtn button {
    padding: 4px 6px;
    font-size: smaller;
  }

  .AwEcn .EcnDivBtn #EcnBtnAdd {
    margin-bottom: 16px;
  }

.AwEcn .EcnDivList {
  position: absolute;
  top: 10px;
  left: 442px;
  bottom: 10px;
  width: 340px;
}

  .AwEcn .btnRefresh {
    margin-right: auto;
  }

  .AwEcn div.grlist {
    display: inline-block;
    margin-right: 40px;
  }

    .AwEcn .grlist input[type=radio] {
      float: left;
      margin-top: 3px;
      margin-right: 7px;
    }

    .AwEcn .grlist label {
      margin-right: 12px;
      margin-bottom: 2px;
    }


  div.input-group.AwEcn textarea:read-only {
    background-color: white;
  }

  div.input-group.AwEcn button.btn-default {
    margin-left: 0;
  }

.AwEcn .EcnInfo {
  height: 90px;
  background-image: url(../Images/Info/ecninfo1.png);
  background-position: center;
  background-repeat: no-repeat;
  border-top: solid 1px gray;
  opacity: 0.7;
}


/* PassDlg =====================================================================*/
.PassDlg .modal-header {    
  padding: 6px 12px 4px 16px;
}

.PassDlg .modal-body {    
  padding: 6px 8px 2px 2px;
  background-color: whitesmoke;
}

  .PassDlg .modal-text {    
    margin: 4px 0px 6px 4px;
    color: #607D8B;
    text-align: center;
  }

  .PassDlg .DivHead {
    float: none;
    width: 100%;
    margin: 0px;
    border-radius: 0px;
  }

  .PassDlg .input-group-addon {
    width: 90px;
  }

.PassDlg .modal-footer {
  padding: 6px;
}

  

/* PatDlg ======================================================================*/
.PatDlg .modal-header .input-group {    
  width: 220px;
}

.PatDlg .modal-body {    
  height: 416px;
}

.PatDlg .modal-body > .ui-jqgrid {    
  margin: -1px 6px;
}


/* CellStatus */
.cellstatus {
  display: inline-block;
  width: 14px;
  height: 14px;
  margin: 2px 0px -2px 0px;
  padding: 0px;
}

.cellstatus > i {
  /*
  width: 12px;
  height: 12px;
  */
  width: 14px;
  height: 14px;
  display: block;
  float: left;
  margin: 1px 0px 0px 1px;
  background-repeat: no-repeat;
  opacity: 0.7;
}

  .cs-orq-NW { background-color: #f1f1f1; }
  .cs-orq-ED { background-color: #ff5722; }
  .cs-orq-PA,
  .cs-orq-PR { background-color: #ead401; }
  .cs-orq-SD { background-color: #ead401; }
  .cs-orq-CK { background-color: #2abf30; }
  .cs-orq-RJ { background-color: #909090; }
  .cs-orq-DL { background-color: #535353; }
  .cs-orq-RC { background-color: #ff2222; }
  .cs-orq-AL { background-color: #caca00; }
  .cs-orq-HR,
  .cs-orq-PT { background-color: #5feaea; }
  .cs-orq-CP { background-color: #0080ff; }     /*#00bfff*/
                               
  .cs-orq-PA > i,
  .cs-orq-PR > i { 
    background-image: url('../Images/orq_status/PA.png'); 
    margin: 4px 0px 0px 7px;
  }

  .cs-orq-DL > i { 
    background-image: url('../Images/delete9.png'); 
    margin: 6px 0px 0px 7px;
    opacity: 0.8;
  }

  .cs-orq-SD > i { 
    background-image: url('../Images/orq_status/SD1.png'); 
    margin: 5px 0px 0px 5px;
  }


/* Order =======================================================================*/

  /*
  .orq-cl-NW { background-color: #f1f1f1; }
  .orq-cl-ED { background-color: #ff5722; }
  .orq-cl-SD { background-color: #ead401; }
  .orq-cl-CK { background-color: #2abf30; }
  .orq-cl-RJ { background-color: #909090; }
  .orq-cl-CP { background-color: #00bfff; }
  */
  
  /*
  .orq-bk-NW { background-image: url('../Images/orq_status/NW.png'); }
  .orq-bk-ED { background-image: url('../Images/orq_status/ED.png'); }
  .orq-bk-SD { background-image: url('../Images/orq_status/SD.png'); }
  .orq-bk-CK { background-image: url('../Images/orq_status/CK.png'); }
  .orq-bk-RJ { background-image: url('../Images/orq_status/RJ.png'); }
  */

  /* QuadScr ===================================================================*/
  .qsc-cl-RQ { background-color: #FF5722; }
  .qsc-cl-RD { background-color: #FF5722; }
  .qsc-cl-SD { background-color: #FF5722; }
  .qsc-cl-RS { background-color: #FF5722; }

  .qsc-bk { background-image: url('../Images/pregnant16.png'); }

  .qsc-bk-NW { background-image: url('../Images/qsc_status/NW.png'); }
  .qsc-bk-ED { background-image: url('../Images/qsc_status/ED.png'); }
  .qsc-bk-VD { background-image: url('../Images/qsc_status/VD.png'); }
  .qsc-bk-RD { background-image: url('../Images/qsc_status/RD.png'); }
  .qsc-bk-SD { background-image: url('../Images/qsc_status/SD.png'); }
  .qsc-bk-RS { background-image: url('../Images/qsc_status/RS.png'); }
  .qsc-bk-RV { background-image: url('../Images/qsc_status/RV.png'); }
  .qsc-bk-CP { background-image: url('../Images/qsc_status/CP.png'); }
  .qsc-bk-PS { background-image: url('../Images/qsc_status/PS.png?v=1'); }

  .qsc-risk-prepos {
    color: #ff9800 !important;
  }

  .qsc-risk-positive {
    color: red !important;
  }

    @keyframes qsc-risk-prepos-icon {
      0%  { background-color: none;  }
      30% { background-color: #ff9800a8;  }
    }

    @keyframes qsc-risk-positive-icon {
      0%  { background-color: none;  }
      30% { background-color: #ff0000a8;  }
    }

    tr.qsc-risk-prepos td[aria-describedby$='f_qscstatus'] > div {  
      border-radius: 8px;
      animation-name: qsc-risk-prepos-icon;
      animation-duration: 1s;
      animation-iteration-count: infinite;
    }

    tr.qsc-risk-positive td[aria-describedby$='f_qscstatus'] > div,
    div.qsc-risk-positive-icon {
      border-radius: 8px;
      animation-name: qsc-risk-positive-icon;
      animation-duration: 1s;
      animation-iteration-count: infinite;
    }

  .img-check16 { background-image: url('../Images/check16.png'); }


/* AwTree Nav ==================================================================*/

  /* ระบุไม่ได้เพราะ icon default เพี้ยนไปเนื่องจากมีการอ้างอิง position
  .AwTree i.jstree-themeicon-custom {
    background-position: center;
  }
  */

  /* ใช้ orq กับ lrq และอื่นๆ ด้วย */
  .ico-orq  { background: url('../Images/req16.png') center no-repeat !important; }
  .ico-osp  { background: url('../Images/sample_r16.png') center no-repeat !important; }
  .ico-ospc { background: url('../Images/sample_b16.png') center no-repeat !important; }
  .ico-ots  { background: url('../Images/test16.png') center no-repeat !important; }

  .st-RJ {  
    background-color: #696868cf !important;
    border-radius: 4px !important;
  }

  .st-DL {  
    background-color: rgb(34 34 34 / 0.81) !important;
    border-radius: 4px !important;
  }

/* Res Flag ====================================================================*/
  
  span.bgFlag {
    float: left;
    width: 100%;
    line-height: 18px;
  }

    span.bgFlag.Lo {
      background-color: #ffffcce6;
    }

    span.bgFlag.Hi {
      background-color: #ccefffe6;
    }

    span.bgFlag.Cr {
      background-color: #ffcccce6;
    }