html, body {
height: 100%;
}
body {
padding: 0;
margin: 0;
font-size: 10vw;
font-family: Arial;
display: flex;
justify-content: center;
background:black;
color: white;
align-items: center;
}
body.running {
background: darkgreen;
}
main {
width:75%;
}
main section {
display: flex;
justify-content: center;
}
button {
font-size:0.5em;
padding:1em;
margin:0.1em;
border-radius: 0.5em;
color:white;
width:30%;
box-sizing: border-box;
}
button:not(:disabled){
cursor: pointer;
}
code {
margin: 0;
display: block;
text-align: center;
font-family: Arial;
font-weight: bold;
font-size: 2em;
}
small {
font-size: 0.2em;
text-align: center;
display: block;
}
#start {
background: blue;
}
#start:disabled {
background: lightblue;
}
#stop {
background: grey;
}
#stop:disabled {
background: darkgrey;
}
#reset {
background: red;
}
#reset:disabled {
background: lightpink;
}