:root {
	--dark-grey: #d0d0d0;
	--light-grey: #f0f0f0;
	--black: #000000;
	--pale-red: #ffdddd;
	--pale-green: #ddffdd;
	font-family: sans-serif;
}



body {
  max-width: 900px;
}

dt {
	padding-left: 1em;
	font-weight: bold;
}

dd {
	padding-left: 1em;
	margin-bottom: 1em;
}

summary {
	font-weight: bold;
	font-size: 18px;
}

input, label, select {
	margin: 5px;
}

table {
	border-collapse: collapse;
	border: 1px solid black;
	margin-right: 30px;
}

textarea {
	margin-right: 30px;
	font-size: 14px;
}

th {
	font-weight: bold;
}

td {
	text-align: left;
	vertical-align: middle;
}

button {
	margin-right: 5px;
}

a:visited {
	color: blue;
}

a:hover {
	color: white;
	background: blue;
}

*:read-only {
	background: var(--light-grey);
}

.small {
	width: 50px;
}

.medium {
	width: 100px;
}

.large {
	width: 200px;
}

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

.col {
	padding-right: 0.5em;
}

.one {
	flex: 1;
}

.two {
	flex: 2;
}

.three {
	flex: 3;
}

/* Hide number tickers */
/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

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