#file-selection { background: rgba(81, 125, 185, 0.1); height: 100vh; width: 16vw; min-width: 10em; display: flex; flex-direction: column; } #file-selection p { height: 2em; display: flex; align-items: center; margin: 0; border-bottom: 0.1em solid rgba(0, 0, 0, 0.3); padding: 0.25em; } #file-selection h3 { font-size: 1.15em; margin: 1em 0 0.25em 0; } #file-selection ul { padding: 0; margin: 0; list-style: none; border: 0.1em solid rgba(0, 0, 0, 0.15); border-radius: 0.15em; width: 100%; height: 100%; overflow: auto; } #file-selection li:nth-of-type(even) { background: rgba(0, 0, 0, 0.05); } #file-selection li:nth-of-type(odd) { background: rgba(0, 0, 0, 0.1); } #file-selection li.selected { background: rgba(34, 13, 185, 0.2); } #file-selection li { cursor: pointer; } #file-selection li:hover { background: rgba(0, 0, 0, 0.15); } #file-selection button { height: 3em; } #results { width: 84vw; } #results h3 { margin: 0; padding: 0; font-size: 1.35em; height: 1.5em; display: flex; align-items: center; } #transcription { height: 96vh; background: rgba(0, 0, 0, 0.1); overflow-y: auto; padding: 0.25em; }