body { width: fit-content; font-family: sans-serif; margin: 0 auto; padding: 2rem 1rem; display: flex; flex-direction: column; gap: 2rem; } /* Index */ .g-Songs { display: flex; flex-direction: column; gap: 0.5rem; margin: 0; } /* Back button */ .g-Back { margin-bottom: 0; } /* Title */ .g-Title { margin-top: 0; margin-bottom: 0.5rem; font-size: 150%; } .g-Subtitle { margin-top: 0; margin-bottom: 1.5rem; font-size: 130%; } .g-Author { font-style: italic; } /* Parts */ .g-Parts { display: flex; flex-direction: column; gap: 1.5rem; } .g-Part { display: flex; flex-direction: column; gap: 0.5rem; } .g-Part__Title { margin: 0; padding: 0 0.25rem; border-radius: 0.25rem; font-size: 110%; font-weight: normal; font-family: monospace; color: #851616; border: 1px solid #851616; width: fit-content; padding: 0.25rem; } /* Chords */ .g-Chords__Tonality { display: flex; align-items: center; gap: 0.5rem; height: 1.5rem; } .g-Chords__Section { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; } .g-Chords__Table { border-collapse: collapse; margin-top: 0.5rem; width: 100%; } .g-Chords__Cell { width: 4rem; text-align: center; border-left: 0.25rem solid #333; border-right: 0.25rem solid #333; padding: 0.5rem 1rem; white-space: nowrap; } .g-Chords__Chord { display: inline-flex; gap: 0.5rem; align-items: baseline; } .g-Chords__Rhythm { height: 1.3rem; } .g-Chords__Chord:not(:last-child):after { display: block; content: ""; margin-left: 0.5rem; margin-right: 1rem; background-color: #88b57e; width: 0.25rem; height: 0.8em; transform: rotate(20deg); } .g-Chords__Multiplier { font-weight: bold; border-bottom: 0.125rem solid #181a87; color: #181a87; } .g-Chords__Multiplier::before { content: "× "; } /* Lyrics */ .g-Lyrics__Paragraph { display: flex; flex-direction: column; gap: 0.125rem; } .g-Lyrics__Paragraph emph { background-color: #88b57e; color: white; }