* {
    box-sizing: border-box;
  }
  html,
  body {
    height: 100%;
  }
  body {
    margin: 0;
    display: grid;
    place-items: center;background-image: linear-gradient(to right top, #ebdfdf, #d6e9f3);
  }
  button {
    position: relative;
    overflow: hidden;
    transform: translateZ(0);
    display: grid;
    place-items: center;
    height: 84px;
    padding: 0 42px;
    border: 0;
    border-radius: 9px;
    font-family: Poppins;
    font-size: 22px;
    color:#ffffff;
    cursor: wait;
  }
  @keyframes loading {
    0% {
      transform: translateX(25px);
    }
    100% {
      transform: translateX(-20px);
    }
  }
  button > span {
    position: relative;
    z-index: 2;
  }
  button::before {
    content: "";
    position: absolute;
    z-index: 1;
    top: 0;
    left: -100%;
    width: 300%;
    height: 100%;
    background: #5b5466  repeating-linear-gradient( 60deg,transparent, transparent 10px, #000000 10px,  #313131 20px );
    animation: loading .9s infinite linear ;
  }