body {
	background-color:#dfdfdf;
	font-family: sans-serif,Helvetica,Verdana,Arial;
	margin:0;
	text-align:center;
}

#app {display:inline-block;margin:.5em 0 2em 0;text-align:left}

#head {border-collapse:separate;border-spacing:.5em 0;margin:0 auto .5em auto}
#head td {height:2em;text-align:center}
#head td.num {background-color:#000;border-radius:1.7em;color:#ff4c4c;font-size:1.5em;width:4em}
#head td.num span {color:#700}
#head td.icon img {cursor:pointer;width:3em}
/*#head td.icon img {width:100%;height:100%}*/

#grid {border-collapse:collapse;border-spacing:0;margin:0 auto}
#grid td {
	background-color:#e8e8e8;
	border:1px solid #777;
	cursor:pointer;
	font-weight:bold;text-align:center;
	width:1.5em;height:1.5em
}
#grid td img {vertical-align:middle}
#grid td.unk {
	background-color:#d0d0d0;
	border-color:#555;
}
#grid td.m1 {color:#00f}
#grid td.m2 {color:#007b00}
#grid td.m3 {color:#f00}
#grid td.m4 {color:#009}
#grid td.m5 {color:#900}
#grid td.m6 {color:#099}
#grid td.m7 {color:#909}
#grid td.m8 {color:#000}
#grid td.boom {background-color:#f55}

#overlay {display:none;height:100%;width:100%;overflow:auto;position:fixed;top:0;left:0;z-index:1}

.dlg {
	background-color:#dfdfdf;
	/*border:1px solid #777;*/
	border-radius: 1em;
	box-shadow:0px 0px 2em #000;
	display:none;
	margin:2em auto 0 auto;
	max-width:30em;
	padding:1em;
	text-align:left;
}
.dlg-title {font-size:140%;margin-bottom:1em;text-align:center}

.level-list label {display:block;margin-bottom:.4em}
.level-list label:last-child {margin-bottom:0}
.level-list span {font-size:.9em;margin-left:2em;white-space:nowrap}

table.custom {margin:0 0 0 2.5em;}
table.custom td {padding:0}
table.custom td input {width:3.5em}
table.custom td:nth-child(1) {font-size:.9em;text-align:right}
table.custom td:nth-child(3) {font-size:.9em}

.note {font-size:.9em;margin:.5em 0 0 2.5em}

input.err {background-color:#fcc}

.okcancel {margin-top:2em;text-align:right}
.okcancel button {font-family:inherit;font-size:inherit;padding:.2em .7em}