body {
margin: 0;
padding: 0;
background-image: url(background.jpg);
background-size: cover;
background-repeat: no-repeat;
}

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

.bar {
width: 20px;
height: 50px;
margin: 0 12px;
border-radius: 50px;
float: left;
}

.bar:nth-child(1) {
	background-color: #333333;
	animation: up 1.9s infinite ease-in-out;
	}
	
.bar:nth-child(2) {
	background-color: #008000;
	animation: down 1.5s infinite ease-in-out;
	}
	
.bar:nth-child(3) {
	background-color: #008000;
	animation: up 1.7s infinite ease-in-out;
	}
	
.bar:nth-child(4) {
	background-color: #333333;
	animation: down 1.8s infinite ease-in-out;
	}
	
.bar:nth-child(5) {
	background-color: #333333;
	animation: up 1.6s infinite ease-in-out;
	}
.bar:nth-child(6) {
	background-color: #008000;
	animation: down 1.9s infinite ease-in-out;
	}
	
.bar:nth-child(7) {
	background-color: #333333;
	animation: up 1.7s infinite ease-in-out;
	}
	
.bar:nth-child(8) {
	background-color: #008000;
	animation: down 1.5s infinite ease-in-out;
	}
	
.bar:nth-child(9) {
	background-color: #008000;
	animation: up 1.8s infinite ease-in-out;
	}
	
.bar:nth-child(10) {
	background-color: #333333;
	animation: down 2s infinite ease-in-out;
	}
.bar:nth-child(11) {
	background-color: #333333;
	animation: up 1.9s infinite ease-in-out;
	}
	
.bar:nth-child(12) {
	background-color: #008000;
	animation: down 1.5s infinite ease-in-out;
	}
	
.bar:nth-child(13) {
	background-color: #008000;
	animation: up 1.7s infinite ease-in-out;
	}
	
.bar:nth-child(14) {
	background-color: #333333;
	animation: down 1.8s infinite ease-in-out;
	}
	
.bar:nth-child(15) {
	background-color: #008000;
	animation: up 1.6s infinite ease-in-out;
	}
.bar:nth-child(16) {
	background-color: #008000;
	animation: down 1.9s infinite ease-in-out;
	}
	
.bar:nth-child(17) {
	background-color: #333333;
	animation: up 1.7s infinite ease-in-out;
	}
	
.bar:nth-child(18) {
	background-color: #008000;
	animation: down 1.5s infinite ease-in-out;
	}
	
.bar:nth-child(19) {
	background-color: #333333;
	animation: up 1.8s infinite ease-in-out;
	}
	
.bar:nth-child(20) {
	background-color: #008000;
	animation: down 2s infinite ease-in-out;
	}
.bar:nth-child(21) {
	background-color: #333333;
	animation: up 1.9s infinite ease-in-out;
	}
	
.bar:nth-child(22) {
	background-color: #333333;
	animation: down 1.5s infinite ease-in-out;
	}
	
.bar:nth-child(23) {
	background-color: #008000;
	animation: up 1.7s infinite ease-in-out;
	}
	
.bar:nth-child(24) {
	background-color: #008000;
	animation: down 1.8s infinite ease-in-out;
	}
	
.bar:nth-child(25) {
	background-color: #333333;
	animation: up 1.6s infinite ease-in-out;
	}
 
 @keyframes up {
	 0% { transform: translateY(-75px); background-color: #ff0066; }
	 25% {background-color:; } 
	 50% { transform: translateY(75px); background-color: #cc0099;}
	 75% {background-color: #0099ff;}
	 100% { transform: translateY(-75px); background-color: #0000cc;}
 }
 
  @keyframes down {
	 0% { transform: translateY(75px); background-color: #6699ff;}
	 25% {background-color: #ff0066; } 
	 50% { transform: translateY(-75px); background-color: #33cccc;}
	 75% {background-color: #cc0066; } 
	 100% { transform: translateY(75px); background-color: #cc0099;}
 }