/* stylesheet for  */
* {
	margin: 0;
	border: none;
	padding: 0;
	font-family: helvetica, sans serif;
	color: #999;
	font-size: 12px;
}

form input {
	border: 1px solid #999;
}

#submitButton {
	background-color: #fff;
	padding: 4px;
}

#header {
	width: 100%;
	background-color: #999;
	padding: 4px 4px 4px 40px;
	margin-bottom: 40px;
	color: #333;
}

#header ul {
	list-style-type: none;
}

#header ul li {
	display: inline;
	margin-right: 20px;
	color: #333;
}

#header a {
	color: #333;
	text-decoration: none;
}

#main {
	width: 960px;
	margin-left: auto;
	margin-right: auto;
}

h1 {
	font-size: 300%;
}

p#artist {
	margin-bottom: 3em;
}

h2 {
	font-size: 150%;
	margin-bottom: 1em;	
}

p {
	margin-bottom: 1em;
}

#description {
	float: right;
	width: 300px;
	margin-right: 40px;
}

#footer {
	clear: both;
	margin: 40px 40px 8px 40px;
	padding-top: 40px;
	text-align: center;
	line-height: 1.8em;
}

#footer a {
	padding: 4px;
}

#footer a {
	border: 1px solid #fff;
	text-decoration: none;
}

#footer a:hover {
	border: 1px solid #999;
}

/* ----------------------  CSS representations of pieces --------------------- */

#photo {
	float: left;
	margin-left: 40px;
	width: 400px;
	height: 400px;
	position: relative;
}

div#photo a {
	text-decoration: none;
}


#bigImage {
	float: left;
	margin-left: 40px;
	width: 400px;
	height: 400px;
	position: relative;
	background-color: black;
}

#whiteSquare {
	position: absolute;
	left: 16px;
	top: 16px;
	width: 368px;
	height: 368px;
	background-color: white;
}

#registrationForm {
	margin-left: 456px;
}

textarea {
	border: 1px solid #999;
}

/* violet (purple) */
	#square1Left {
		position: absolute;
		left: 50px;
		top: 50px;
		width: 24px;
		height: 44px;
		background-color: #;
		border-top-left-radius: 3.6px;
		border-bottom-left-radius: 3.6px;
	}
	#square1Right {
		position: absolute;
		left: 72px;
		top: 50px;
		width: 22px;
		height: 44px;
		background-color: #43271c;
		border-top-right-radius: 3.6px;
		border-bottom-right-radius: 3.6px;	}
/* orange */
	#square2Left {
		position: absolute;
		left: 106px;
		top: 50px;
		width: 24px;
		height: 44px;
		background-color: #;
		border-top-left-radius: 3.6px;
		border-bottom-left-radius: 3.6px;
	}
	#square2Right {
		position: absolute;
		left: 128px;
		top: 50px;
		width: 22px;
		height: 44px;
		background-color: #ff5210;
		border-top-right-radius: 3.6px;
		border-bottom-right-radius: 3.6px;	}
/* brown */
	#square3Left {
		position: absolute;
		left: 162px;
		top: 50px;
		width: 24px;
		height: 44px;
		background-color: #;
		border-top-left-radius: 3.6px;
		border-bottom-left-radius: 3.6px;
	}
	#square3Right {
		position: absolute;
		left: 184px;
		top: 50px;
		width: 22px;
		height: 44px;
		background-color: #703314;
		border-top-right-radius: 3.6px;
		border-bottom-right-radius: 3.6px;	}
/* black */
	#square4Left {
		position: absolute;
		left: 218px;
		top: 50px;
		width: 24px;
		height: 44px;
		background-color: #;
		border-top-left-radius: 3.6px;
		border-bottom-left-radius: 3.6px;
	}
	#square4Right {
		position: absolute;
		left: 240px;
		top: 50px;
		width: 22px;
		height: 44px;
		background-color: #342f1b;
		border-top-right-radius: 3.6px;
		border-bottom-right-radius: 3.6px;	}
/* yellow */
	#square5Left {
		position: absolute;
		left: 274px;
		top: 50px;
		width: 24px;
		height: 44px;
		background-color: #;
		border-top-left-radius: 3.6px;
		border-bottom-left-radius: 3.6px;
	}
	#square5Right {
		position: absolute;
		left: 296px;
		top: 50px;
		width: 22px;
		height: 44px;
		background-color: #fdd504;
		border-top-right-radius: 3.6px;
		border-bottom-right-radius: 3.6px;	}
/* red */
	#square6Left {
		position: absolute;
		left: 50px;
		top: 106px;
		width: 24px;
		height: 44px;
		background-color: #;
		border-top-left-radius: 3.6px;
		border-bottom-left-radius: 3.6px;
	}
	#square6Right {
		position: absolute;
		left: 72px;
		top: 106px;
		width: 22px;
		height: 44px;
		background-color: #db1900;
		border-top-right-radius: 3.6px;
		border-bottom-right-radius: 3.6px;	}
/* green */
	#square7Left {
		position: absolute;
		left: 106px;
		top: 106px;
		width: 24px;
		height: 44px;
		background-color: #;
		border-top-left-radius: 3.6px;
		border-bottom-left-radius: 3.6px;
	}
	#square7Right {
		position: absolute;
		left: 128px;
		top: 106px;
		width: 22px;
		height: 44px;
		background-color: #1e591f;
		border-top-right-radius: 3.6px;
		border-bottom-right-radius: 3.6px;	}
/* blue */
	#square8Left {
		position: absolute;
		left: 162px;
		top: 106px;
		width: 24px;
		height: 44px;
		background-color: #;
		border-top-left-radius: 3.6px;
		border-bottom-left-radius: 3.6px;
	}
	#square8Right {
		position: absolute;
		left: 184px;
		top: 106px;
		width: 22px;
		height: 44px;
		background-color: #282a43;
		border-top-right-radius: 3.6px;
		border-bottom-right-radius: 3.6px;	}
/* yellow orange */
	#square9Left {
		position: absolute;
		left: 218px;
		top: 106px;
		width: 24px;
		height: 44px;
		background-color: #;
		border-top-left-radius: 3.6px;
		border-bottom-left-radius: 3.6px;
	}
	#square9Right {
		position: absolute;
		left: 240px;
		top: 106px;
		width: 22px;
		height: 44px;
		background-color: #ff6412;
		border-top-right-radius: 3.6px;
		border-bottom-right-radius: 3.6px;	}
/* yellow green */
	#square10Left {
		position: absolute;
		left: 274px;
		top: 106px;
		width: 24px;
		height: 44px;
		background-color: #;
		border-top-left-radius: 3.6px;
		border-bottom-left-radius: 3.6px;
	}
	#square10Right {
		position: absolute;
		left: 296px;
		top: 106px;
		width: 22px;
		height: 44px;
		background-color: #29a708;
		border-top-right-radius: 3.6px;
		border-bottom-right-radius: 3.6px;	}
/* white */
	#square11Left {
		position: absolute;
		left: 50px;
		top: 162px;
		width: 24px;
		height: 44px;
		background-color: #;
		border-top-left-radius: 3.6px;
		border-bottom-left-radius: 3.6px;
	}
	#square11Right {
		position: absolute;
		left: 72px;
		top: 162px;
		width: 22px;
		height: 44px;
		background-color: #fefce3;
		border-top-right-radius: 3.6px;
		border-bottom-right-radius: 3.6px;	}
/* red violet */
	#square12Left {
		position: absolute;
		left: 106px;
		top: 162px;
		width: 24px;
		height: 44px;
		background-color: #;
		border-top-left-radius: 3.6px;
		border-bottom-left-radius: 3.6px;
	}
	#square12Right {
		position: absolute;
		left: 128px;
		top: 162px;
		width: 22px;
		height: 44px;
		background-color: #821703;
		border-top-right-radius: 3.6px;
		border-bottom-right-radius: 3.6px;	}
/* red orange */
	#square13Left {
		position: absolute;
		left: 218px;
		top: 162px;
		width: 24px;
		height: 44px;
		background-color: #;
		border-top-left-radius: 3.6px;
		border-bottom-left-radius: 3.6px;
	}
	#square13Right {
		position: absolute;
		left: 240px;
		top: 162px;
		width: 22px;
		height: 44px;
		background-color: #fe2305;
		border-top-right-radius: 3.6px;
		border-bottom-right-radius: 3.6px;	}
/* carnation pink */
	#square14Left {
		position: absolute;
		left: 274px;
		top: 162px;
		width: 24px;
		height: 44px;
		background-color: #;
		border-top-left-radius: 3.6px;
		border-bottom-left-radius: 3.6px;
	}
	#square14Right {
		position: absolute;
		left: 296px;
		top: 162px;
		width: 22px;
		height: 44px;
		background-color: #ff4766;
		border-top-right-radius: 3.6px;
		border-bottom-right-radius: 3.6px;	}
/* blue violet */
	#square15Left {
		position: absolute;
		left: 50px;
		top: 218px;
		width: 24px;
		height: 44px;
		background-color: #;
		border-top-left-radius: 3.6px;
		border-bottom-left-radius: 3.6px;
	}
	#square15Right {
		position: absolute;
		left: 72px;
		top: 218px;
		width: 22px;
		height: 44px;
		background-color: #2f2820;
		border-top-right-radius: 3.6px;
		border-bottom-right-radius: 3.6px;	}
/* blue green */
	#square16Left {
		position: absolute;
		left: 106px;
		top: 218px;
		width: 24px;
		height: 44px;
		background-color: #;
		border-top-left-radius: 3.6px;
		border-bottom-left-radius: 3.6px;
	}
	#square16Right {
		position: absolute;
		left: 128px;
		top: 218px;
		width: 22px;
		height: 44px;
		background-color: #29303a;
		border-top-right-radius: 3.6px;
		border-bottom-right-radius: 3.6px;	}
/* violet red */
	#square17Left {
		position: absolute;
		left: 162px;
		top: 218px;
		width: 24px;
		height: 44px;
		background-color: #;
		border-top-left-radius: 3.6px;
		border-bottom-left-radius: 3.6px;
	}
	#square17Right {
		position: absolute;
		left: 184px;
		top: 218px;
		width: 22px;
		height: 44px;
		background-color: #a00000;
		border-top-right-radius: 3.6px;
		border-bottom-right-radius: 3.6px;	}
/* scarlet */
	#square18Left {
		position: absolute;
		left: 218px;
		top: 218px;
		width: 24px;
		height: 44px;
		background-color: #;
		border-top-left-radius: 3.6px;
		border-bottom-left-radius: 3.6px;
	}
	#square18Right {
		position: absolute;
		left: 240px;
		top: 218px;
		width: 22px;
		height: 44px;
		background-color: #e81500;
		border-top-right-radius: 3.6px;
		border-bottom-right-radius: 3.6px;	}
/* indigo */
	#square19Left {
		position: absolute;
		left: 274px;
		top: 218px;
		width: 24px;
		height: 44px;
		background-color: #;
		border-top-left-radius: 3.6px;
		border-bottom-left-radius: 3.6px;
	}
	#square19Right {
		position: absolute;
		left: 296px;
		top: 218px;
		width: 22px;
		height: 44px;
		background-color: #282924;
		border-top-right-radius: 3.6px;
		border-bottom-right-radius: 3.6px;	}
/* green yellow */
	#square20Left {
		position: absolute;
		left: 50px;
		top: 274px;
		width: 24px;
		height: 44px;
		background-color: #;
		border-top-left-radius: 3.6px;
		border-bottom-left-radius: 3.6px;
	}
	#square20Right {
		position: absolute;
		left: 72px;
		top: 274px;
		width: 22px;
		height: 44px;
		background-color: #d3e304;
		border-top-right-radius: 3.6px;
		border-bottom-right-radius: 3.6px;	}
/* gray */
	#square21Left {
		position: absolute;
		left: 106px;
		top: 274px;
		width: 24px;
		height: 44px;
		background-color: #;
		border-top-left-radius: 3.6px;
		border-bottom-left-radius: 3.6px;
	}
	#square21Right {
		position: absolute;
		left: 128px;
		top: 274px;
		width: 22px;
		height: 44px;
		background-color: #484c4b;
		border-top-right-radius: 3.6px;
		border-bottom-right-radius: 3.6px;	}
/* dandelion */
	#square22Left {
		position: absolute;
		left: 162px;
		top: 274px;
		width: 24px;
		height: 44px;
		background-color: #;
		border-top-left-radius: 3.6px;
		border-bottom-left-radius: 3.6px;
	}
	#square22Right {
		position: absolute;
		left: 184px;
		top: 274px;
		width: 22px;
		height: 44px;
		background-color: #fa9602;
		border-top-right-radius: 3.6px;
		border-bottom-right-radius: 3.6px;	}
/* cerulean */
	#square23Left {
		position: absolute;
		left: 218px;
		top: 274px;
		width: 24px;
		height: 44px;
		background-color: #;
		border-top-left-radius: 3.6px;
		border-bottom-left-radius: 3.6px;
	}
	#square23Right {
		position: absolute;
		left: 240px;
		top: 274px;
		width: 22px;
		height: 44px;
		background-color: #101652;
		border-top-right-radius: 3.6px;
		border-bottom-right-radius: 3.6px;	}
/* apricot */
	#square24Left {
		position: absolute;
		left: 274px;
		top: 274px;
		width: 24px;
		height: 44px;
		background-color: #;
		border-top-left-radius: 3.6px;
		border-bottom-left-radius: 3.6px;
	}
	#square24Right {
		position: absolute;
		left: 296px;
		top: 274px;
		width: 22px;
		height: 44px;
		background-color: #ff8f39;
		border-top-right-radius: 3.6px;
		border-bottom-right-radius: 3.6px;	}
