* {
  margin: 0;
  padding: 0;
}

html {
  background-color: blue;
  
}


div {
  width: 100px;
  height: 100px;
  background: white;
  position: absolute;
  animation: myfirst 2s ;
  animation-iteration-count: infinite;
}

@keyframes myfirst {
  0%   {left: 0px; top: 0px;}
  25%  {left: 200px; top: 0px;}
  50%  {left: 200px; top: 200px;}
  75%  {left: 0px; top: 200px;}
  100% {left: 0px; top: 0px;}
}

.one {
  margin-left: 0vw;
}

.two {
  margin-left: 20vw;
}

.three {
  margin-left: 40vw;
}

.four {
  margin-left: 60vw;
}

.five {
  margin-left: 80vw;
}

.onee {
  margin-left: 0vw;
  margin-top: 0;
}

.twoo {
  margin-left: 0vw;
}

.threee {
  margin-left: 40vw;
}

.fourr {
  margin-left: 60vw;
}

.fivee {
  margin-left: 80vw;
}