@font-face { 
	font-family: "RubikMoonrocks";  
	src: url("../fonts/RubikMoonrocks-Regular.ttf");
}

body {
	font-family: Arial, sans-serif;
	background-image: url("../images/splotch.svg"), url("../images/checkerboard-cross.webp");
	background-repeat: no-repeat, repeat;
}

h1 {
	font-size: 4em;
}

.to_print {
	display: none;
}

.grime {
	font-family: Arial, sans-serif;
	font-family: RubikMoonrocks;
}

.center {
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

.splotch {
	background-repeat: no-repeat;
	background-position: center;
}

#board td {
	width: 4em;
	text-align: right;
	vertical-align: bottom;
	background-color: #a4bfcc;
	border: 1px solid lightgrey;
	box-shadow: 2px 2px 1px 1px #fffaee inset, -1px -1px 1px 1px #655671 inset;
	padding: 0.5em;
}

#board tr {
	height: 4em;
}

#reference {
	margin-top: 1em;
	background: white;
	font-family: monospace;
}

#reference .ref_item {
	padding: 0.5em;
	border: dotted grey 1px;
}

#control_panel {
	position: absolute;
	right: 0px;
	bottom: 0px;
	padding: 2em;
	border-top-left-radius: 1em;
	border: solid black 1px;
	background: lightgrey;
}

#heading { 
	padding: 0.5em;
	text-align: center;
}

input, select {
	width: 5em;
}

@media print {
	.to_print { display: block; }
	.no_print { display: none; }
	#board td {
		box-shadow: none; 
		background-color: none;
	}
	@page {
		size: A4 landscape;
		max-height: 100%;
		max-width: 100%;
	}
}