notes.css

/* line 1 */
#note-1 {
  left: 14%;
}
#line-1 {
  left: 15.8%;
  bottom: 40%;
}
#note-2 {
  left: 19%;
}
#line-2 {
  left: 19%;
  top: 40%;
}
#dot-2 {
  left: 21.5%;
  top: 35%;
}
#note-3 {
  left: 24%;
}
#line-3 {
  left: 24%;
  top: 40%;
}
#eight-3 {
  position: absolute;
  height: 48%;
  left: 24.4%;
  top: 62%;
  border: 1px solid black;
  transform: rotate(20deg);
  border-radius: 0% 100% 0% 0%;
}
#bar-1 {
  left: 28%;
}
#note-4 {
  left: 30%;
}
#line-4 {
  left: 31.8%;
  bottom: 11%;
}
#dot-4 {
  left: 32.5%;
  bottom: 6%;
}
#note-5 {
  left: 35%
}
#line-5 {
  bottom: 22%;
  left: 36.8%
}
#bar-2 {
  left: 39%;
}
#note-6 {
  left: 41%;
}
#line-6 {
  left: 42.8%;
  bottom: 36%;
}
#note-7 {
  left: 45%;
}
#line-7 {
  left: 45%;
  bottom: -18%;
}
#note-8 {
  left: 49%;
}
#line-8 {
  left: 49%;
  bottom: -12%;
}
#note-9 {
  left: 53%;
}
#line-9 {
  left: 53%;
  bottom: -7%;
}
#bar-3 {
  left: 57%;
}
#note-10 {
  left: 59%;
}
#line-10 {
  left: 60.8%;
}
#dot-10 {
  left: 61.5%;
  bottom: 31%;
}
#bar-4 {
  right: 31%;
}