styleScroll.css

@import url('https://fonts.googleapis.com/css?family=Roboto+Condensed');

body {
  font-family: "Roboto Condensed";
  background-color: #3e3e3e;
  color: #efefef;
  font-weight: bold;
  overflow: hidden;
}

#container {
  display: flex;
  flex-direction: column;
}

neck {
  display: flex;
  flex-direction: column;
  height: 100vh;
  overflow-x: scroll;
  margin: 0 0;
  display: flex;
  flex-direction: column;
     -webkit-mask-image: linear-gradient(
    to right,
    rgba(0, 0, 0, 0),
    rgba(0, 0, 0, 1),
    rgba(0, 0, 0, 0)
  );
}

select {
  background-color: #565656;
  color: #efefef;
  border: none;
  -webkit-appearance:none;
  box-shadow: 0px 10px 20px #333;
  font-family: "Roboto Condensed";
  min-height: 2.5%;
  padding: 0 2.5%;
  font-size: 1.5em;
/*   margin: 0 auto; */
}

string {
  flex: 1;
  display: flex;
  flex-direction: row;
  flex-wrap: no-wrap;
  align-items: center;

/*   height: 100%; */

}

fret {
/*   flex: 1 1 14%; */
  min-width: 14%;
  font-family: 'Roboto Condensed', sans-serif;
  vertical-align: middle;
  text-align: center;
  font-size: 1.5em;
}

fret:active {
  cursor: grabbing;
}