/* canvas */
html {
	margin:0;
	background-color:#fcfcfc;
	}
	
body {
	margin:0.5em auto;
	border-width:3px;
	border-style:double;
	border-color:#eee #ccc #ccc #eee;
	padding:0.5em 0.5em 0.5em 1.5em;
	background-color:#f7f7f7;
	color:#000;
	/* max-width:30em; */
	width:29em;
	}
	

/* fonts and headings */
body {
	font-size:90%;
	}

* { 
	font-family:verdana,sans-serif;
	}

h1,h2 {
	font-weight:normal;
	margin:0;
	}

h1 {
	font-family:arial,sans-serif;
	font-size:1.8em;
	margin:0.5em 0 0 0;
	}
	
h2 {
	font-size:1.3em;
	margin:1em 0 0 0;
	}
	


/* info messages */
p#message {
	font-size:1em;
	font-weight:bold;
	margin:0 0 1.5em 0;
	}


/* go to links */
p.goTo {
	margin:0;
	font-size:0.9em;
	text-align:right;
	}
	
/* skip to next attempt */
p.nextAttempt {
	margin:0 0 1.5em 0;
	font-size:0.9em;
	text-align:right;
	}
	
/* offleft positioning */
.offleft {
	position:absolute;
	left:-100em;
	}
	
	
	
	

/* divisions */
div#game {
	margin:1.5em 0 0 0;
	}
	
div#next {
	margin:0 0 2em 0;
	}

div.hr {
	height:1px;
	border-width:1px;
	border-style:solid;
	border-color:#ddd #eee #eee #ddd;
	margin:0 1em 1.5em 0;
	}
	
div.hr hr {
	display:none;
	}
	
	
	
	
	
/* table of previous attempts */
table {
	margin:0 0 1.5em 0;
	background-color:#eee;
	border-width:1px;
	border-style:solid;
	border-color:#eee #ccc #ccc #eee;
	padding:0.1em;
	}
	
td,th {
	padding:0.2em 0em 0.2em 0.2em;
	text-align:left;
	vertical-align:middle;
	border-width:1px;
	border-style:solid;
	border-color:#ddd #f7f7f7 #f7f7f7 #ddd;
	}

th {
	font-weight:bold;
	padding-right:0.4em;
	}
	
caption {
	font-size:1em;
	font-weight:bold;
	text-align:left;
	margin:0 0 0.5em 0;
	white-space:nowrap;
	}
	

	

/* black/white mark images */
img.mark {
	width:1.5em;
	height:1.5em;
	border-width:1px;
	border-style:solid;
	float:left;
	margin-right:0.2em;
	}
	
img.white {
	border-color:#f7f7f7 #ccc #ccc #f7f7f7;
	}
	
img.black {
	border-color:#777 #222 #222 #777;
	}




/* trophy */
img#trophy {
	width:8.9em;
	height:8.9em;
	}






/* form for this attempt */
form {
	margin:1em 0 0 0;
	padding:0;
	}

fieldset {
	border:none;
	margin:0;
	padding:0;
	}

select {
	margin-right:0.5em;
	}

legend {
	font-size:1em;
	font-weight:bold;
	text-align:left;
	margin:0 0 0.7em 0;
	padding:0;
	position:relative;
	left:-0.7em;
	}

label, input#number {
	margin-right:0.5em;
	}

input#attempt {
	width:5em;
	}

input.submit {
	margin-left:0.2em;
	font-size:100%
	}	




/* instructions */
div#instructions {
	margin:0 0 2.5em 0;
	}
	
	
div#instructions p, dl {
	font-size:0.9em;
	}

dl {
	padding:0 0 0 1em;
	border-left:1px dotted #ddd;
	}
	
dt {
	font-weight:bold;
	}
	
dd {
	margin:0 0 1em 0;
	font-size:0.9em;
	}