html body {
    min-height:150vh 
}

.sound-circle:nth-child(1) { position: relative; top: 1000px; left: 1350px; } 
.sound-circle:nth-child(2) { position: relative; top: 400px; left: 1400px; } 
.sound-circle:nth-child(3) { position: relative; top: 900px; left: 1380px; } 
.sound-circle:nth-child(4) { position: relative; top: 290px; left: 1000px; } 
.sound-circle:nth-child(5) { position: relative; top: -20px; left: 0px; } 
.sound-circle:nth-child(6) { position: relative; top: 777px; left: 777px; } 
.sound-circle:nth-child(7) { position: relative; top: 140px; left: 20px; } 
.sound-circle:nth-child(8) { position: relative; top: 14px; left: 230px; } 
.sound-circle:nth-child(9) { position: relative; top: 140px; left: 1230px; } 
.sound-circle:nth-child(10) { position: relative; top: 890px; left: 20px; } 
.sound-circle:nth-child(11) { position: relative; top: 200px; left: 200px; } 
.sound-circle:nth-child(12) { position: relative; top: 410px; left: 980px; } 
.sound-circle:nth-child(13) { position: relative; top: 320px; left: 220px; } 
.sound-circle:nth-child(14) { position: relative; top: 660px; left: -300px; } 
.sound-circle:nth-child(15) { position: relative; top: 260px; left: 380px; } 
.sound-circle:nth-child(16) { position: relative; top: 560px; left: 500px; }

.sound-circle {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background-color: #007bff;
    cursor: pointer;
    display: inline-block;
    border: 2px solid #000;
    box-shadow: 0 0 10px rgba(0,0,0,.25);
}