body {
	margin: 0;
	padding: 0;
	background-color: #29832f;
}

#container {
   width: 500px;
   height: 500px;
   padding-top: 80px;
   margin: 0 auto;
   }

.dot {
	width: 20px;
	height: 20px;
	margin: 30px auto;
	border-radius: 50px;
    }
	
.dot:nth-child(1) {
  background-color: #333333;
  animation: left 1s infinite ease-in-out; 
  }
	
.dot:nth-child(2) {
  background-color: #333333;
   animation: right 1.1s infinite ease-in-out;
  }
	
.dot:nth-child(3) {
  background-color: #333333;
  animation: left .9s infinite ease-in-out;
  }
	
.dot:nth-child(4) {
  background-color: #333333;
  animation: right 1.2s infinite ease-in-out;
  }
  
  .dot:nth-child(5) {
  background-color: #333333;
  animation: left 1.2s infinite ease-in-out;
  }
   
@keyframes right {
	0% { transform: translate(-25px);}
	50% { transform: translate(
	25px);}
	100% {transform: translate(-25px);}
    }
	
@keyframes left {
    0% { transform: translate(25px);}
    50% { transform: translate(-25px);}
    100% { transform: translate(25px);}
    }