body {
	background-color: #222;
	margin: 0;
	padding: 0;
}
.bt1 {
	box-shadow:inset 0px 0px 15px 3px #23395e;
	background:linear-gradient(to bottom, #2e466e 5%, #415989 100%);
	background-color:#2e466e;
	border-radius:17px;
	border:1px solid #1f2f47;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:15px;
	padding:6px 13px;
	text-decoration:none;
	text-shadow:0px 1px 0px #263666;
}
.bt1:hover {
	background:linear-gradient(to bottom, #415989 5%, #2e466e 100%);
	background-color:#415989;
}
.bt1:active {
	position:relative;
	top:1px;
}
.midboard{
	margin-left: 25%;
	margin-right: 25%;
	width: 50%;
	position: absolute;
}
.midboardimg{
	z-index: 1;
	width: 100%;
	position: absolute;
}
.chessimg{
	z-index: 2;
	width: 12.5%;
	position: absolute;
	transition: margin 1s ease-in-out;
}
.inpp{
	width: 25%;
	margin-left: 0px;
	border: 5px solid #000000;
	position: absolute;
}
.outpp{
	width: 25%;
	margin-left: 75%;
	border: 5px solid #000000;
	position: absolute;
}
.inputcode{
	width: 90%;
	height: auto;
	resize: none;
	background-color: #111;
	font-family: "Comic Sans MS", cursive, sans-serif;
	font-size: 2vh;
	letter-spacing: 0px;
	word-spacing: 2px;
	color: #11ee11;
	font-weight: 700;
	text-decoration: none;
	font-style: normal;
	font-variant: small-caps;
	text-transform: none;
}
h1 {
	font-family: "Comic Sans MS", cursive, sans-serif;
	font-size: 3vh;
	letter-spacing: 0px;
	word-spacing: 2px;
	color: #FFFFFF;
	font-weight: 700;
	text-decoration: none;
	font-style: normal;
	font-variant: small-caps;
	text-transform: none;
}
input,p,label {
	display: inline;
}
p,label {
	color: white;
}
canvas,
img {
	user-select: none;
    image-rendering: crisp-edges;
    image-rendering: -moz-crisp-edges;
    image-rendering: -webkit-optimize-contrast;
    image-rendering: optimize-contrast;
	image-rendering: pixelated;
    -ms-interpolation-mode: nearest-neighbor;
	user-drag: none;
    -webkit-user-drag: none;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;