#containerCadence {
    display: flex;
    flex-direction: row;
    width: 100%;
    height: 100%;
}

#PanelLeft {
    display: flex;
    overflow: scroll;
    flex-direction: column;
    width: 30%;
    border-right: 1px solid var(--Suite_separator);
}
#PanelMiddle {
    display: flex;
    width: 40%;
}
#PanelRight {
    display: flex;
    width: 30%;
    border-left: 1px solid var(--Suite_separator);
}

.PanelHeaderContainer {
    display: flex;
    height: 24px;
    width: 100%;
    border-bottom: 1px solid var(--Suite_separator);
}

.PanelBodyContainer {
    display: flex;
    width: 100%;
    height: 100%;
}

#PanelLeftLinesContainer {
    display: flex;
    width: 24px;
    min-width: 24px;
    height: 100%;
    background: red;
}

#PanelLeftSyllablesContainer {
    display: flex;
    width: 24px;
    min-width: 24px;
    height: 100%;
    background: blue;
}

#PanelLeftLyricsContainer {
    display: flex;
    width: 90%;
    height: 100%;
    background: green;
}

#PanelLeftLines,
#PanelLeftSyllables,
#PanelLeftLyrics {
    display: flex;
    overflow: hidden;
    width: 100%;
    height: 100%;
}

#PanelLeftLines {
    text-align: right;
    color: #aaaaaa;
    border-right: 1px solid var(--Suite_separator);
}

#PanelLeftSyllables {
    text-align: right;
    color: #888888;
    border-right: 1px solid var(--Suite_separator);
}