body{
	font-family: helvetica;
	color:#A39A39;
	text-align: center;
	background-color: #A39D5A;
}

.morpionbutton{
	background-color: #635F2D;
	box-shadow: 1px 1px 5px black;
	width: 110px;
	line-height: 1.5em;
	margin: 0 auto;
}

.morpionbutton a{
	color: #a39a39;
	font-size: 0.75em;
}

.content{
	max-width: 800px;
	width: 100%;
	margin: auto;
	background-color: #575327;
	padding: 15px;
	position: absolute;
	 top: 0; left: 0; bottom: 0; right: 0;
}

article{
	max-width: 400px;
	width: 100%;
	height: 400px;
	background-color: #A39D5A;
	margin: 20px auto;
	box-shadow: 1px 1px 10px black;
	padding: 5px;
	position: relative;
}

.joueur1{
	width: 30px;
	height: 30px;
	background-color: #635F2D;
	box-shadow: 1px 1px 5px black;
	position: absolute;
	top: 19px;
	left: 440px;	
}

.joueur1 p{
	width: 140px;
	line-height: 0.2em;
}

.joueur2{
	width: 30px;
	height: 30px;
	background-color: #635228;
	box-shadow: 1px 1px 5px black;
	position: absolute;
	top: 62px;
	left: 440px;	
}

.joueur2 p{
	width: 140px;
	line-height: 0.2em;
}

.bloc{
	width: 123px;
	height: 123px;
	background-color: #E3D866;
	margin: 20px;
	box-shadow: 1px 1px 5px black;
	position: absolute;
}

.bloc:hover{
	opacity: .9;
}

.p1{
	width: 123px;
	height: 123px;
	background-color: #635F2D;
	margin: 20px;
	box-shadow: 1px 1px 5px black;
	position: absolute;
	z-index: 1;
}

.p2{
	width: 123px;
	height: 123px;
	background-color: #635228;
	margin: 20px;
	box-shadow: 1px 1px 5px black;
	position: absolute;
	z-index: 1;
}

.a1{
	top: 0px;
	left: 0px;
}

.b1{
	top: 0px;
	left: 0px;
}

.c1{
	top: 0px;
	left: 0px;
}

.a2{
	top: 0px;
	left: 123px;
}

.b2{
	top: 0px;
	left: 123px;
}

.c2{
	top: 0px;
	left: 123px;
}

.a3{
	top: 0px;
	left: 246px;
}

.b3{
	top: 0px;
	left: 246px;
}

.c3{
	top: 0px;
	left: 246px;
}

.a4{
	top: 123px;
	left: 0px;
}

.b4{
	top: 123px;
	left: 0px;
}

.c4{
	top: 123px;
	left: 0px;
}

.a5{
	top: 123px;
	left: 123px;
}

.b5{
	top: 123px;
	left: 123px;
}

.c5{
	top: 123px;
	left: 123px;
}

.a6{
	top: 123px;
	left: 246px;
}

.b6{
	top: 123px;
	left: 246px;
}

.c6{
	top: 123px;
	left: 246px;
}

.a7{
	top: 246px;
	left: 0px;
}

.b7{
	top: 246px;
	left: 0px;
}

.c7{
	top: 246px;
	left: 0px;
}

.a8{
	top: 246px;
	left: 123px;
}

.b8{
	top: 246px;
	left: 123px;
}

.c8{
	top: 246px;
	left: 123px;
}

.a9{
	top: 246px;
	left: 246px;
}

.b9{
	top: 246px;
	left: 246px;
}

.c9{
	top: 246px;
	left: 246px;
}