.info { width: 30%; height: 100%; } #nowplaying { height: 100%; } #textinfo { height: 6; } #coverart { width: 100%; height: 100%; } #albumContainer { height: 100%; } #artistContainer { height: 100%; } .headerb { width: 20%; height: 1; background: #2c2e30; text-align: center; } #headerbs { height: 1; } .artistPanel { width: 20%; height: 100%; padding: 0 1; } .artistArt { height: 1fr; content-align: center middle; } .artistName { width: 100%; text-align: center; } .artistInfo { width: 1fr; height: 1.25fr; } .artistInfoArt { width: 1fr; height: 100%; content-align: center middle; } .artistInfoTextbox { width: 4fr; } .albumPanel { width: 1fr; height: 1fr; padding: 0 1; } .albumArt { height: 1fr; content-align: center middle; } .albumName { text-wrap: wrap; text-align: center; width: 100%; } .artistNameHeader { width: 100%; text-align: center; } # Player Screen #playerTrackTitleBox { padding: 1 0 0 0; } #playerArtc { align: center middle; # width: 1fr; } .playerTrackinfo { # text-align: center; # content-align: center middle; height: 1; width: auto; } .playerArt { content-align: center middle; height: 1fr; width: 0.5fr; padding: 1 0 0 0; } #progressBarWrapper { height: 3; width: 0.75fr; padding: 1 0 0 0; } .playerProgressBarTime { width: 0.1fr; text-align: center; } .playerProgressBarTotalTime { width: 0.1fr; text-align: center; } #percentage { visibility: hidden; } #eta { visibility: hidden; } .playerProgressBar { height: 3; width: 0.75fr; content-align: center middle; } .playerProgressBar #bar { width: auto; } #playerButtons { height: 0.25fr; padding-bottom: 1; align: center middle; } .playerButton { height: 5; max-width: 12; max-height: 12; } QueueScreen { align: center middle; } #queueModal { height: 75%; width: 75%; border: grey; }