<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus porro officia, quae, explicabo deleniti quasi molestias dolorum non ad pariatur. Illo, inventore at. Odio iure adipisci quisquam, molestias impedit quo.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Doloribus unde, quis. Natus quasi, eveniet corporis facere laboriosam voluptatem ad blanditiis, temporibus, laborum voluptate possimus beatae illo. Illo molestiae, iure blanditiis.</p>
<div class="square"></div>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Harum sit aperiam odit libero soluta delectus voluptatibus saepe laboriosam maiores, quas, fuga vitae. Suscipit eum assumenda hic sunt, debitis voluptatum odit.</p>

.square {
  height: 100px;
  width: 100px;
  background-color: #3d9970;
  display: flex;
  text-align: center;
  justify-content: center;
  align-content: center;
  color: white;
  padding: 5px;
  -webkit-animation: shimmy 3s infinite;
          animation: shimmy 3s infinite;
  -webkit-animation-direction: alternate;
          animation-direction: alternate;
}

@-webkit-keyframes shimmy {
  0% {
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0);
  }
  100% {
    -webkit-transform: translate(20px, 50px);
            transform: translate(20px, 50px);
  }
}

@keyframes shimmy {
  0% {
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0);
  }
  100% {
    -webkit-transform: translate(20px, 50px);
            transform: translate(20px, 50px);
  }
}