html { font-family: sans-serif; background: #eee; padding: 1rem; }
body { max-width: 960px; margin: 0 auto; background: white; }
h1 { font-family: serif; color: #377ba8; margin: 1rem 0; }
h2 { font-family: serif; color: #377ba8; margin: 1rem 0; }
a { color: #377ba8; }
nav { background: lightgray; display: flex; align-items: center;
padding: 0 0.5rem; }
nav h1 { flex: auto; margin: 0; }
nav ul { display: flex; list-style: none; margin: 0; padding: 0; }
nav ul li a, nav ul li span, header { display: block; padding: 0.5rem; }
button { margin: 0.5rem; }
details { margin: 0.5rem; }

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input[type=number]{
    -moz-appearance: textfield;
}

.row {
    display: flex;
    flex-direction: row;
    align-items: center;
}

.padding {
    padding: 0.5rem;
}

.margin {
    margin: 0.5rem;
}

.error {
    background-color: #ffb8b7;
}

.warning {
    background-color: #feda9b;
}

.success {
    background-color: #b8f7c5;
}

.info {
    background-color: #b4e7f5;
}

.content {
	padding: 10px;
}

.review-rendered {
    border: 1px solid #ccc;
    border-radius: 4px;
    padding: 0.75rem 1rem;
    background: #fafafa;
    max-width: 700px;
    overflow-wrap: break-word;
}

.review-rendered h1, .review-rendered h2, .review-rendered h3 {
    color: #377ba8;
    margin: 0.5rem 0;
}

.review-rendered ul, .review-rendered ol {
    padding-left: 1.5rem;
}

.review-rendered blockquote {
    border-left: 3px solid #377ba8;
    margin: 0.5rem 0;
    padding: 0.25rem 0.75rem;
    color: #555;
}