.bars2{
	position:absolute;
 
	top:46px;
 
}

.bars3{
bottom: 0;
 
}
.bars {
    position: absolute;
 
    width: 120px;
 
}
.bar {
   background: #ef5e5e;
    bottom: 1px;
    height: 3px;
    position: absolute;
    width: 3px;      
    animation: sound 0ms -800ms linear infinite alternate;
}

.bar.barBeyaz {
   background: #ffffff;
 
    height: 3px;
    position: absolute;
    width: 3px;      
    animation: sound 0ms -800ms linear infinite alternate;
}



@keyframes sound {
    0% {
       opacity: .35;
        height: 3px; 
    }
    100% {
        opacity: 1;       
        height: 40px;        
    }
}
.bar:nth-child(1)  { left: 1px; animation-duration: 474ms; }
.bar:nth-child(2)  { left: 5px; animation-duration: 433ms; }
.bar:nth-child(3)  { left: 9px; animation-duration: 407ms; }
.bar:nth-child(4)  { left: 13px; animation-duration: 458ms; }
.bar:nth-child(5)  { left: 17px; animation-duration: 400ms; }
.bar:nth-child(6)  { left: 21px; animation-duration: 427ms; }
.bar:nth-child(7)  { left: 25px; animation-duration: 441ms; }
.bar:nth-child(8)  { left: 29px; animation-duration: 419ms; }
.bar:nth-child(9)  { left: 33px; animation-duration: 487ms; }
.bar:nth-child(10) { left: 37px; animation-duration: 442ms; } 
.bar:nth-child(11)  { left: 41px; animation-duration: 474ms; }
.bar:nth-child(12)  { left: 45px; animation-duration: 433ms; }
.bar:nth-child(13)  { left: 49px; animation-duration: 407ms; }
.bar:nth-child(14)  { left: 53px; animation-duration: 458ms; }
.bar:nth-child(15)  { left: 57px; animation-duration: 400ms; }
.bar:nth-child(16)  { left: 61px; animation-duration: 427ms; }
.bar:nth-child(17)  { left: 65px; animation-duration: 441ms; }
.bar:nth-child(18)  { left: 69px; animation-duration: 419ms; }
.bar:nth-child(19)  { left: 73px; animation-duration: 487ms; }
.bar:nth-child(20) { left: 77px; animation-duration: 442ms; } 
.bar:nth-child(21)  { left: 81px; animation-duration: 474ms; }
.bar:nth-child(22)  { left: 85px; animation-duration: 433ms; }
.bar:nth-child(23)  { left: 89px; animation-duration: 407ms; }
.bar:nth-child(24)  { left: 93px; animation-duration: 458ms; }
.bar:nth-child(25)  { left: 97px; animation-duration: 400ms; }
.bar:nth-child(26)  { left: 101px; animation-duration: 427ms; }
.bar:nth-child(27)  { left: 105px; animation-duration: 441ms; }
.bar:nth-child(28)  { left: 109px; animation-duration: 419ms; }
.bar:nth-child(29)  { left: 113px; animation-duration: 487ms; }
.bar:nth-child(30) { left: 117px; animation-duration: 442ms; }