html, body {
	font-family: Arial, sans-serif;
}

body.content {
}

a {
	color: inherit;
	text-decoration: none;
}

a.help {
	color: revert;
	text-decoration: revert;
}

a:hover {
	color: red;
	text-decoration: underline;
}

button {
	background: linear-gradient(
		24deg,
		rgba(77,6,6,1) 0%,
		rgba(177,5,7,1) 60%,
		rgba(244,69,69,1) 83%,
		rgba(189,18,18,1) 100%
	);
	background-color: #9d0305;
	border: 1px solid #9d0305;
	border-radius: 6px;
	color: white;
	font-size: 18pt;
	font-weight: bold;
	padding: 8px 24px;
	margin: 8px 16px 4px;
}

div {
	text-align: center;
}

div.billrole {
	margin-left: 286px;
}

div.billrole > div {
	text-align: start;
}

div.box {
	background-color: #fff8f8;
	border: 1px solid #c08080;
	clear: both;
	text-align: start;
}

div.button {
	padding-bottom: 12px;
	text-align: center;
}

div.check-left,
div.check-right {
	display: inline-block;
}

div.check-left input[type="checkbox"],
div.check-right input[type="checkbox"] {
	margin: 0px;
}

div.check-left > div,
div.check-right > div {
	display: inline;
}

div.check-left > div:not(:first-child) > input[type="checkbox"] {
	margin-left: 18pt;
}

div.check-right > div:not(:last-child) > input[type="checkbox"] {
	margin-right: 18pt;
}

div.error {
	color: Red;
	font-weight: bold;
	margin: 0;
	padding: 4px;
}

div.inline {
	display: inline;
	text-align: left;
}

div.help {
	color: Green;
	font-weight: bold;
}

div.logo {
	display: table-cell;
	vertical-align: middle;
}

div.logos {
	display: table;
	margin: 0px auto;
}

div.logos > div.logo:nth-child(2) {
	width: 60px;
}

div.text {
}

div.text > p {
	margin: 12pt 2px;
}

div.text > p.indent {
	margin-left: 36pt;
}

div.title {
	font-size: 18pt;
	font-weight: bold;
	padding: 8px 4px;
}

div.warn {
	color: Red;
	font-weight: bold;
	padding: 8px 0;
}

div.warn .warn {
	color: Black;
}

div.warn > p {
	margin: 0 2px;
}

div > ol {
	margin: 0;
}

div > p {
	margin: 0;
	padding-left: 4px;
}

footer {
	margin-top: 12pt;
}

header > div {
	color: #c63442;
	display: inline-block;
	font-size: 18pt;
	font-weight: bold;
	margin: 8px;
}

header > div.flat {
	margin: 4px 6px;
}

header > img.lone {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

header.home,
header.rsvp,
header.wide {
	display: flex;
	align-items: center;
	margin-bottom: 8px;
}

header.home {
	justify-content: left;
}

header.rsvp {
	justify-content: space-between;
}

header.home > div.home {
	text-align: start;
}

input {
	font-family: "Andalé Mono", "Lucida Console", Monaco , Monospace;
	font-size: 14pt;
	max-width: 97%;
	padding: 6px;
}

input.warn,
input:required,
select:required {
	background-color: hsl(60,100%,90%);
}

input:read-only {
	color: dimgray;
}

input:read-only:not(:required) {
	background-color: revert;
}

input[type="checkbox"] {
	margin-left: 186px;
}

input[type="checkbox"] + label {
	text-align: left;
	width: auto;
}

input[type="radio"] + label {
	text-align: left;
	width: auto;
}

input[type="radio"] + label + input {
	margin-left: 24px;
}

label {
	display: inline-block;
	font-weight: bold;
	text-align: right;
	width: 184px;
}

label.auto {
	width: auto;
}

label + input[type="checkbox"] {
	margin-left: 0px;
}

p.center {
	text-align: center;
}

select {
	font-family: "Andalé Mono", "Lucida Console", Monaco , Monospace;
	font-size: 14pt;
	font-weight: bold;
	padding: 4px;
}

select > option {
	font-weight: bold;
}

td {
	margin: 0;
	vertical-align: top;
}

td.buff, th.buff, tr.buff {
	background-color: #d0d0ff;
}

td.center {
	text-align: center;
}

input.end,
th.end,
td.end {
	text-align: end;
}

td.fair, th.fair, tr.fair {
	background-color: #d0d0ff;
}

td.good, th.good, tr.good {
	background-color: #d0ffd0;
}

td.pink, th.pink, tr.pink {
	background-color: #fff0f0;
}

td.snow, th.snow, tr.snow {
	background-color: white;
}

td.left {
	text-align: left;
}

td.right {
	text-align: right;
}

td.start, th.start {
	text-align: start;
}

td.warn, th.warn, tr.warn {
	background-color: yellow;
}

.bold {
	font-weight: bold;
}

.copy {
	font-size: 10pt;
}

.red {
	color: red;
}

.strike {
	text-decoration-line: line-through;
}

.tooltip {
	color: red;
	display: none;
	font-weight: bold;
}

#logohope {
	height: 150px;
	object-fit: scale-down;
}

#logorsvp {
	width: 200px;
	object-fit: scale-down;
}
