<html><head>
  <meta http-equiv="Content-type" content="text/html; charset=utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <noscript>Your browser does not support JavaScript!</noscript>
  <link rel="icon" href="data:;base64,=">
  <title>TMS Web Project</title>
  <link href="css/app.css" rel="stylesheet" type="text/css">
  <link href="https://cdnjs.cloudflare.com/ajax/libs/flag-icon-css/2.3.1/css/flag-icon.min.css" rel="stylesheet">
  <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
  <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.0/css/all.min.css" rel="stylesheet">
  <link crossorigin="anonymous" href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/css/bootstrap.min.css" rel="stylesheet">
  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/js/bootstrap.bundle.min.js" type="text/javascript"></script>
  <script   src="https://code.jquery.com/jquery-3.7.1.js"   integrity="sha256-eKhayi8LEQwp4NKxN+CfCh+3qOVUtJn3QNZ0TciWLP4="   crossorigin="anonymous"></script>
  <script type="text/javascript" src="$(ProjectName).js"></script>
  <script>
      function startSpinner() {
        //window.scrollTo(0, 0);
        document.body.style.setProperty('--spinner-top', window.scrollY+'px');
        $(".hide-scene").addClass("scene");
      }

      function endSpinner() {
        $(".hide-scene").removeClass("scene");
      }
  </script>


  <title>EM Systems webKGOrders App</title>
    <script type="text/javascript" src="$(ProjectName).js"></script>
    <style>
      /*-----svg loader styles-------*/
      :root {
          --spinner-top: 0px;
        }

      .hide-scene {
        display:none;
      }

      .scene {
        position: absolute;
        z-index: 9999999;
        top: var(--spinner-top);
        width: 100%;
        height: 100%;
        perspective: 600;
        display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        align-items: center;
        justify-content: center;
      }

      .scene svg {
        width: 165px;
        height: 165px;
        /* background-color: lavender; */
      }

      @keyframes arrow-spin {
        50% {
          transform: rotateY(360deg);
        }
      }
      /*-------------------------------------------*/
    </style>
  </head>
  <body>
  </body>
  <script type="text/javascript">
    rtl.run();
  </script>

  <div class="hide-scene">
    <svg
      version="1.1"
      id="dc-spinner"
      xmlns="http://www.w3.org/2000/svg"
      x="0px" y="0px"
      width:"38"
      height:"38"
      viewBox="0 0 38 38"
      preserveAspectRatio="xMinYMin meet">

      <circle cx="20" cy="20" r="16" fill="#D3D3D3"></circle>

      <text x="55%" y="54%" font-family="Monaco" font-size="2px" text-anchor="middle" dy=".3em" style="letter-spacing:0.6">PROCESSING
        <animate
          attributeName="opacity"
          values="0;1;0" dur="1.8s"
          repeatCount="indefinite"/>
      </text>

      <path fill="#373a42" d="M20,35c-8.271,0-15-6.729-15-15S11.729,5,20,5s15,6.729,15,15S28.271,35,20,35z M20,5.203
        C11.841,5.203,5.203,11.841,5.203,20c0,8.159,6.638,14.797,14.797,14.797S34.797,28.159,34.797,20
        C34.797,11.841,28.159,5.203,20,5.203z">
      </path>

      <path fill="#373a42" d="M20,33.125c-7.237,0-13.125-5.888-13.125-13.125S12.763,6.875,20,6.875S33.125,12.763,33.125,20
        S27.237,33.125,20,33.125z M20,7.078C12.875,7.078,7.078,12.875,7.078,20c0,7.125,5.797,12.922,12.922,12.922
        S32.922,27.125,32.922,20C32.922,12.875,27.125,7.078,20,7.078z">
      </path>

      <path fill="#2AA198" stroke="#2AA198" stroke-width="0.6027" stroke-miterlimit="10" d="M5.203,20
	    c0-8.159,6.638-14.797,14.797-14.797V5C11.729,5,5,11.729,5,20s6.729,15,15,15v-0.203C11.841,34.797,5.203,28.159,5.203,20z">

        <animateTransform
          attributeName="transform"
          type="rotate"
          from="0 20 20"
          to="360 20 20"
          calcMode="spline"
          keySplines="0.4, 0, 0.2, 1"
          keyTimes="0;1"
          dur="2s"
          repeatCount="indefinite" />
      </path>

      <path fill="#859900" stroke="#859900" stroke-width="0.2027" stroke-miterlimit="10" d="M7.078,20
        c0-7.125,5.797-12.922,12.922-12.922V6.875C12.763,6.875,6.875,12.763,6.875,20S12.763,33.125,20,33.125v-0.203
        C12.875,32.922,7.078,27.125,7.078,20z">

        <animateTransform
          attributeName="transform"
          type="rotate"
          from="0 20 20"
          to="360 20 20"
          dur="1.8s"
          repeatCount="indefinite" />
      </path>
    </svg>
  </div>

</html>