body {
    background: #555;
    color: #ccc;
    font-family: 'Trebuchet MS', sans-serif;
    font-size: 20px;
}

select {
    background-color: rgba(1, 1, 1, 0);
    border: none;
    color: #ccc;
    outline: none;
}

#panel {
    font-size: 0.875rem;
    left: 2rem;
    position: absolute;
    top: 1.5rem;
}

#panel > div {
    padding-top: 0.5rem;
}

#song-select {
    margin: 2rem 0;
    text-align: center;
}

#songs {
    font-size: 1.5rem;
}

#song {
    padding: 2rem 0;
    text-align: center;
}

.line {
    padding: 0 0 1rem;
}

.note,
.lyric {
    display: inline-block;
    width: 100px;
}

.note {
    border-radius: 50%;
    height: 100px;
    position: relative;
    vertical-align: top;
}

.chord {
    color: #fff;
    display: inline-block;
    margin-top: 2.25rem;
    position: relative;
    text-shadow:
        -1px -1px 0 #333,  
        1px -1px 0 #333,
        -1px 1px 0 #333,
        1px 1px 0 #333;
    z-index: 10;
}

.multinote {
    left: 0;
    position: absolute;
}

.multinote:first-child {
    top: 2.5rem;
}

.multinote:nth-child(2) {
    top: 5rem;
}

.multinote:nth-child(3) {
    top: 7.5rem;
}

.v-space-1 {
    margin-bottom: 2.5rem;
}

.v-space-1 .chord {
    margin-top: 5rem;
}

.v-space-2 {
    margin-bottom: 5rem;
}

.v-space-2 .chord {
    margin-top: 7.5rem;
}

.v-space-3 {
    margin-bottom: 7.5rem;
}

.v-space-3 .chord {
    margin-top: 10rem;
}

.unique-note {
    border-radius: 50%;
    display: inline-block;
    height: 25px;
    width: 25px;
}

.lyric {
    padding: 0 0 1rem;
    text-align: center;
    vertical-align: middle;
}

.rest {
    background-color: #ccc;
}

.a {
    background-color: #4b0082;
}

.b {
    background-color: #f0f;
}

.c {
    background-color: #f00;
}

.d {
    background-color: #ffa500;
}

.e {
    background-color: #ff0;
}

.f {
    background: #7cfc00;
}

.g {
    background-color: #088;
}

.xylophone .a {
    background-color: #f00;
}

.xylophone .b {
    background-color: #b0b;
}

.xylophone .c {
    background-color: #00d;
}

.xylophone .d {
    background-color: #fff;
}

.xylophone .e {
    background-color: #070;
}

.xylophone .f {
    background: #ff7b00;
}

.xylophone .g {
    background-color: #ec0;
}