body {
    max-width: 500px;
    font-family: serif;
}
h2 {
    margin: 1em 0 0.5em;
}
form {
    display: grid;
    padding: 0 1em 1em 1em;
    background: #eee;
    border: 1px solid #ccc;
    margin-top: 1em;
}
input, select {
    background: #fff;
    border: 1px solid #999;
    padding: 0.5em;
}
input[type="button"] {
    background: #eee;
}
input[type="button"]:hover {
    background: #ddd;
}
input[type="submit"] {
    margin-top: 0.5em;
}
input[type="submit"]:hover {
    background: #f6f6f6;
}
label {
    padding: 0.5em 0.5em 0.5em 0;
}
#status {
    margin-bottom: 1em;
}
#overrides {
    display: grid;
    grid-template-columns: 1fr 30px;
    margin-top: -0.4em;
}
#schedules {
    display: grid;
    grid-template-columns: 5em 1fr;
    margin-top: -0.4em;
}
#overrides span, #schedules span {
    margin: 0.5em 0;
}

@media (min-width: 400px) {
    form {
        grid-template-columns: 50px 1fr;
        grid-gap: 2px;
        padding: 1em;
    }
    form label {
        grid-column: 1 / 2;
        text-align: right;
    }
    form input, form select {
        grid-column: 2 / 3;
    }
}