text: import React from 'react';
  import ReactDOM from 'react-dom';
  import './index.css';
  import App from './App';
  import reportWebVitals from './reportWebVitals';
  // import $ from 'jquery';
  
  ReactDOM.render(
    <React.StrictMode>
      <App />
    </React.StrictMode>,
    document.getElementById('root')
  );
  
  // If you want to start measuring performance in your app, pass a function
  // to log results (for example: reportWebVitals(console.log))
  // or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
  reportWebVitals();
  // *********************************************************************************************************
  //move up button
      //Get the button
      var mybutton = document.getElementById("topButton");
      
      // When the user scrolls down 20px from the top of the document, show the button
      window.onscroll = function() {scrollFunction()};
      
      function scrollFunction() {
        if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
          mybutton.style.display = "block";
        } else {
          mybutton.style.display = "none";
        }
      }
      
      // When the user clicks on the button, scroll to the top of the document
      mybutton.onclick=function(){
        document.body.scrollTop = 0;
        document.documentElement.scrollTop = 0;
    }
    // *************************************************************************************************
  
  // Create page start engine forms
  
  // var startengine = document.getElementById('startengine');
  // startengine.onclick = function() {
  //   var theFormItself = document.getElementById('form1');
  //   $( theFormItself ).fadeOut( 2000 );
  //   var theFormItself2 = document.getElementById('form2');
  //   $( theFormItself2).fadeIn( 5000 );
  // }
  
  // display 3rd form and hide 2nd
  // var auto = document.getElementById('form2autobutton');
  // auto.onclick = function() {
  //   var theFormItself = document.getElementById('form2');
  //   $( theFormItself ).fadeOut( 2000 );
  //   var theFormItself2 = document.getElementById('form3');
  //   $( theFormItself2).fadeIn( 5000 );
  
  // }
  //*********************************************************************************************************** 
  // Typing text
  const typedTextSpan = document.querySelector(".typed-text");
  const cursorSpan = document.querySelector(".cursor");
  
  const textArray = ["Innovation","Technology","Automation"];
  const typingDelay = 200;
  const erasingDelay = 100;
  const newTextDelay = 2000; // Delay between current and next text
  let textArrayIndex = 0;
  let charIndex = 0;
  
  document.getElementById('menuicon').addEventListener("focus", function() { 
    if(textArray.length) setTimeout(type, newTextDelay + 250);
  });
  
  window.addEventListener("DOMContentLoaded", function() { // On DOM Load initiate the effect
    if(textArray.length) setTimeout(type, newTextDelay + 250);
  });
  
  
  
  function type() {
    if (charIndex < textArray[textArrayIndex].length) {
      if(!cursorSpan.classList.contains("typing"))
        cursorSpan.classList.add("typing");
      typedTextSpan.textContent += textArray[textArrayIndex].charAt(charIndex);
      charIndex++;
      setTimeout(type, typingDelay);
    } 
    else {
      cursorSpan.classList.remove("typing");
    	setTimeout(erase, newTextDelay);
    }
  }
  
  function erase() {
  	if (charIndex > 0) {
      if(!cursorSpan.classList.contains("typing")) cursorSpan.classList.add("typing");
      typedTextSpan.textContent = textArray[textArrayIndex].substring(0, charIndex-1);
      charIndex--;
      setTimeout(erase, erasingDelay);
    } 
    else {
      cursorSpan.classList.remove("typing");
      textArrayIndex++;
      if(textArrayIndex>=textArray.length) textArrayIndex=0;
      setTimeout(type, typingDelay + 1100);
    }
  }
  
  
  