body { background-color: #333; position: absolute; height: 100%; width: 100%; margin: 0; font-family: Sans; transition: background-color 500ms ease-in; } body.idle { background-color: #08D; } body.doing { background-color: #333; } body.done { background-color: #4A0; } #container { width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; } #child { max-width: 90%; text-align: center; } #text { color: white; font-size: 24em; font-weight: bold; text-align: center; white-space: nowrap; overflow: hidden; line-height: 1em; } #error { color: red; font-size: 3em; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } button { position: fixed; margin: 1em; padding: 1em; top: 0; right: 0; background-color: transparent; border: none; cursor: pointer; } button:hover { background-color: rgba(0, 0, 0, 0.4); border-radius: .2em; } button > img { height: 3em; display: block; }