body {
    margin-top: 0;
    font-family: 'Roboto', sans-serif;
    background-color: #616161;
}

button.number {
    width: 2em;
}

button.inverse {
    background-color: #fff;
    color: #003539;
}

button, input {
    font-family: inherit;
    font-size: 100%;
    color: #fff;
}

button {
    background-color: #003539;
    width: 12em;
    border: 0;
    border-radius: 0.125em;
}

input {
    background: transparent;
    border: 0;
    border-bottom: 1px solid #999;
}

input:not([type]), input[type=text] {
    width: 12em;
}

.card > header {
    padding: 0.5em;
    padding-bottom: 0;
    font-weight: bold;
    background-color: #002171;
    color: #ffffff;
}

.card > .content {
    padding: 0.5em;
    background-color: #0d47a1;
    color: #ffffff;
}

.card > .alternate {
    padding: 0.5em;
    border-top: solid 0.25em #005f63;
    background-color: #5472d3;
    color: #ffffff;
}

#scorepad {
    max-width: 960px;
    margin: auto;
    padding: 1em;
}

label {
    margin-right: 0.5em;
}

.round-button {
    background-color: #003539;
    display: inline-block;
    border-radius: 50%;
    border-width: 0;
    width: 1.5em;
    height: 1.5em;
    margin: 0.25em;
}

.normal {
    background-color: #018786;
    color: #fff;
}

.undo {
    float: right;
    border: 0;
    background: transparent;
}