/* Styles used exclusively by the Hanjie puzzle solver. */

button {
	margin: 0 1em;
}

#stepchanges {
	background-color: lightgrey;
	font-size: smaller;
	height: 6.5em;
	overflow: auto;
}

table#puzzle {
	border-style: solid;
	border-width: 0 medium medium 0;
	border-color: #333;
	border-spacing: 0;
	margin-top: 1em;
}

table#puzzle td {
	width: 1.5em;
	height: 1.5em;
	padding: 0;
	text-align: center;
	vertical-align: middle;
	border-style: solid;
	border-width: thin 0 0 thin;
	border-color: #333;
	background-color: lightgrey;
}

table#puzzle th {
	width: 1.5em;
	height: 1.5em;
	padding: 0;
	text-align: center;
	vertical-align: middle;
	border-style: solid;
	border-width: thin 0 0 thin;
	border-color: #333;
	color: black;
	background-color: yellow;
}

table#puzzle td[colspan] {
	border-top-width: 0;
}

table#puzzle td.row_5, table#puzzle th.row_5
{
	border-top-width: medium;
}

table#puzzle td.col_5, table#puzzle th.col_5
{
	border-left-width: medium;
}

table#puzzle td.filled
{
	background-color: black;
}

table#puzzle td.dot
{
	background-color: white;
}

@media screen {
	table#puzzle td.highlight0, #stepchanges span.highlight0 {
		border: medium solid orange;
		font-size: 40%;
	}
	table#puzzle td.highlight1, #stepchanges span.highlight1 {
		border: medium solid magenta;
		font-size: 40%;
	}
	table#puzzle td.highlight2, #stepchanges span.highlight2 {
		border: medium solid cyan;
		font-size: 40%;
	}
	table#puzzle td.highlight3, #stepchanges span.highlight3 {
		border: medium solid green;
		font-size: 40%;
	}
	table#puzzle td.highlight4, #stepchanges span.highlight4 {
		border: medium solid pink;
		font-size: 40%;
	}
	table#puzzle td.highlight5, #stepchanges span.highlight5 {
		border: medium solid yellow;
		font-size: 40%;
	}
}