input,
textarea,
select {
	background-color: var(--background-color);
	border: 1px solid #888;
	border-radius: 4px;
	padding: 6px 8px 2px 8px;
	box-sizing: border-box;
	outline: none;
	vertical-align: baseline;
	font-size: inherit;
}
input:not(:disabled):hover,
input:not(:disabled):focus,
textarea:not(:disabled):focus,
textarea:not(:disabled):hover,
select:not(:disabled):focus,
select:not(:disabled):hover {
	outline: 1px solid #888;
	box-shadow: 0 0 10px #3333;
}
input:disabled,
textarea:disabled,
select:disabled {
	background-color: #eee;
	border-color: #aaa;
	color: #aaa;
}
form.invalid input:invalid,
form.invalid textarea:invalid,
form.invalid select:invalid {
	border-color: #b44;
	outline-color: #b44;
	background-color: #fffafa;
}

textarea {
	font-family: inherit;
	height: 250px;
}

select {
	font-family: inherit;
}

label.optional::after {
	content: " (optional)";
	font-weight: lighter;
}
input[type="submit"] {
	background-color: var(--text-color);
	color: var(--background-color);
	border: none;
	cursor: pointer;
}
input[type="submit"]:not(:disabled):hover,
input[type="submit"]:not(:disabled):focus {
	outline: none;
	background-color: #888;
}
input[type="submit"]:disabled {
	outline: none;
	background-color: #d3d3d3;
	cursor: default;
}