html {
    background: #000;
    color:var(--text-color-normal);
    --text-color-normal: #ccc;
    --text-color-singer: #666;
    --text-color-chord: rgb(108, 108, 238);
    --border-color-list: #444;
    --div-control: rgba(255,255,255,.1);
  }

@font-face {
    font-family: 'GyeonggiBatang';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_one@1.0/GyeonggiBatang.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

* {
    box-sizing: border-box;
}

#list {
    padding-bottom: 100px;
}
.songHeader {
    padding-bottom: 10px;
    margin-bottom: 10px;
    border-bottom: 1px solid var(--text-color-singer);
    font-size: 1.2em;
    font-weight: 600;
}
.songTitle {
    display: inline;
}
.songSinger {
    display: inline;
    float: right;
    color:var(--text-color-singer);
}

.ssw {background: red !important;}

    .control {
        background: var(--div-control);
        position: fixed;
        bottom:0;
        width:50%;
        height:70px;
        z-index: 999;
        display: none;
    }
    #slow {
        left:0;
    }
    #fast {
        right:0;
    }
.songContent {
    padding:12px;
    padding-top: 200px;
}
.songContent p {
    margin-bottom: 40px;
}
    .songContent h1 {
        font-size:1.2em;
        margin-block-start: 1em;
        margin-block-end: 0;
    }



.chord-sheet {
    line-height: 1.2em;
}

.chord-sheet .row {
    margin-bottom: 0.8em;
}

.chord-sheet .column {
    display: inline-block;
    padding: 0;
    margin-right: 0.3em;
}

.chord-sheet .chord {
    font-size: 0.9em;
    color: var(--text-color-chord);
    font-weight: 600;
    font-family: sans-serif;
    margin-bottom: -4px;
}

.chord-sheet .lyrics {
    font-weight: 400;
    margin-right: -4px;
    
}

.chord-sheet .paragraph {
    margin-bottom: 3em;
}

.lyrics:after {
    content: '.';
    color:rgba(255,255,255,0)
}