body {
      font-family: "Roboto", sans-serif;
      font-weight: 400;
      overflow-x: hidden;
      font-style: normal;
      -webkit-font-smoothing: antialiased;
      -webkit-text-stroke-width: 0.2px;
      -moz-osx-font-smoothing: grayscale;
  }

  .btn-submitt {
      background: #f89728 !important;
      padding: 6px 14px;
      border-radius: 4px;
      color: #fff !important;
      font-family: "Roboto", sans-serif;
      box-shadow: 0px 8px 15px rgb(0 0 0 / 8%);
      /* font-family: "Roboto", sans-serif; */
      font-size: 15px;
      height: 36px;
      font-weight: 500;
      text-transform: uppercase;
      display: inline-block;
      width: 100%;
  }

  .wellbox {
      background-repeat: repeat-x;
      border: 1px solid #ccc;
      -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, .05), 0 1px 0 rgba(255, 255, 255, .1);
      box-shadow: inset 0 1px 3px rgba(0, 0, 0, .05), 0 1px 0 rgba(255, 255, 255, .1);
      background-image: #fff;
      width: 480px;
      margin: 0 auto;
      margin-top: 30px;
      padding: 30px;
  }

  .btn-scan {
      background: #000 !important;
      padding: 6px 14px;
      border-radius: 4px;
      color: #fff !important;
      font-family: "Roboto", sans-serif;
      box-shadow: 0px 8px 15px rgb(0 0 0 / 8%);
      /* font-family: "Roboto", sans-serif; */
      font-size: 15px;
      height: 36px;
      font-weight: 500;
      text-transform: uppercase;
      display: inline-block;
      width: 100%;
  }

  figure.tlogo {
      text-align: center;
  }

  .tlogo img {
      display: inline-block;
      width: 140px;
  }

  #qr-reader {
      position: fixed !important;
      top: 0;
      left: 0;
      width: 100vw !important;
      height: 100vh !important;
      background: #000;
      z-index: 99999;
      display: none;
  }

  .ttlpnt {
      background: #000000 !important;
      color: #fff !important;
      border-color: #000000 !important;
      width: 50%;
      text-align: center;
      font-weight: bold !important;
      font-size: 20px !important;
      margin: 0 auto;
  }

  .lblttl {
      font-size: 16px;
      text-align: center;
      color: #000;
      text-transform: uppercase;
      margin-bottom: 10px;
      display: block;
  }

  @media (max-width: 767px) {
      #qr-reader {
          position: fixed !important;
          top: 0;
          left: 0;
          width: 100vw !important;
          height: 100vh !important;
          background: #000;
          z-index: 99999;
          display: none;
      }

      .ttlpnt {
          background: #000000 !important;
          color: #fff !important;
          border-color: #000000 !important;
          width: 80% !important;
          text-align: center;
          font-weight: bold !important;
          font-size: 20px !important;
          margin: 0 auto;
      }

      .wellbox {
          width: 100%;
      }

      .tlogo img {
          display: inline-block;
          width: 140px;
          margin-bottom: 20px;
      }
  }