body {
  direction: ltr; }
  body .typecard {
    padding: 20px;
    display: grid;
    grid-template-columns: repeat(1, 1.9fr) repeat(5, 1fr);
    gap: 4px; }
    body .typecard .typecard-item .item img {
      margin-top: -8px;
      background: #e6e4e4;
      width: 100%; }
    body .typecard .typecard-item .item h1 {
      font-size: 15px;
      margin-top: 0px;
      font-weight: bold; }
    body .typecard .functions .hex {
      /* display: flex;*/
      margin-bottom: 0px; }
      body .typecard .functions .hex h1 {
        font-size: 25px;
        margin-left: 20px;
        margin-top: 0px; }
      body .typecard .functions .hex input[type=text] {
        font-size: 25px;
        text-align: center;
        width: 95%;
        padding: 8px;
        border: solid 1px #dad4d4;
        text-transform: uppercase;
        margin-left: 20px;
        margin-right: 20px; }
    body .typecard .functions .FuncCodeGenerate {
      margin-left: 20px;
      margin-right: 7px;
      /*display: grid;*/
      /* grid-template-columns: repeat(3, 1fr);
            grid-template-rows: repeat(12,1fr);*/
      list-style: decimal-leading-zero;
      /* gap: 5px;*/
      padding: 16px;
      padding-left: 40px;
      /*grid-auto-flow: column;*/
      height: 500px;
      overflow: auto;
      max-height: 500px;
      border: 1px solid #eeeded; }
      body .typecard .functions .FuncCodeGenerate li {
        font-weight: bold; }
        body .typecard .functions .FuncCodeGenerate li input[type=checkbox] {
          margin-right: 11px; }
  body .SeletedItemOrderCode {
    padding: 25px; }
    body .SeletedItemOrderCode .Unit {
      padding-bottom: 20px; }
    body .SeletedItemOrderCode strong {
      font-weight: bold; }
    body .SeletedItemOrderCode img {
      margin-top: 5px; }
    body .SeletedItemOrderCode #swiperUnit .swiper-pagination-bullet {
      direction: ltr;
      width: 70px;
      height: 50px;
      text-align: center;
      line-height: 20px;
      font-size: 18px;
      color: #000;
      opacity: 1;
      margin: 2px !important;
      border: 1px solid #c8d6c9;
      border-radius: 5px;
      background-color: aliceblue;
      padding: 5px; }
    body .SeletedItemOrderCode #swiperUnit .swiper-pagination-bullet-active {
      color: #fff;
      background: #15b8ea; }
    body .SeletedItemOrderCode #swiperUnit .swiper-pagination {
      position: static;
      text-align: left;
      margin-bottom: 8px; }
  body #ModalHistory .modal-lg {
    width: 1200px; }
  body #ModalHistory .modal-header {
    direction: ltr; }
  body #ModalHistory #PanelHistory {
    padding: 20px; }
    body #ModalHistory #PanelHistory .OrderCode {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 10px; }
      body #ModalHistory #PanelHistory .OrderCode .item {
        grid-template-rows: auto;
        padding: 18px;
        background: #f9f9f9;
        direction: ltr; }
        body #ModalHistory #PanelHistory .OrderCode .item:hover {
          cursor: pointer;
          border: 1px solid #c0c0c0;
          box-shadow: 2px 2px 2px #dfdddd; }
        body #ModalHistory #PanelHistory .OrderCode .item strong {
          font-weight: bold; }
        body #ModalHistory #PanelHistory .OrderCode .item .code {
          float: right;
          padding-bottom: 14px; }
          body #ModalHistory #PanelHistory .OrderCode .item .code .fa-info-circle {
            padding-left: 10px;
            color: #417ebf;
            font-size: 18px; }
            body #ModalHistory #PanelHistory .OrderCode .item .code .fa-info-circle:hover {
              color: red; }
        body #ModalHistory #PanelHistory .OrderCode .item input[type=button] {
          width: 100%;
          padding: 4px;
          font-size: 16px;
          text-align: center;
          border: 1px solid #e7e7e7;
          background: #f9f9f9;
          margin-top: 10px; }
          body #ModalHistory #PanelHistory .OrderCode .item input[type=button]:hover {
            border: 1px solid #e4e0e0;
            background: #f2f1f1; }