body {
	font-family: Arial,Helvetica,sans-serif;
}

.playground-div {
	width: 30em;
	background-color: #3333FF;
	padding: 1em;
}

.status-div {
	padding: 1em;
}

.playground-field {
	width: 4.5em;
	height: 4.5em;
	background-color: #3333FF;
	border: none;
	background-size: 4.2em;
	background-repeat: no-repeat;
}

.playground-field-empty {
	background-image: url("/connect-four-webapp/javax.faces.resource/images/stone-empty.png.xhtml");
}

.playground-field-yellow {
	background-image: url("/connect-four-webapp/javax.faces.resource/images/stone-yellow.png.xhtml");
}

.playground-field-yellow-played {
	background-image: url("/connect-four-webapp/javax.faces.resource/images/stone-yellow-played.png.xhtml");
}

.playground-field-red {
	background-image: url("/connect-four-webapp/javax.faces.resource/images/stone-red.png.xhtml");
}

.playground-field-red-played {
	background-image: url("/connect-four-webapp/javax.faces.resource/images/stone-red-played.png.xhtml");
}

.playground-field-yellow-empty {
	background-image: url("/connect-four-webapp/javax.faces.resource/images/stone-yellow-empty.gif.xhtml");
}

.playground-field-yellow-empty-played {
	background-image: url("/connect-four-webapp/javax.faces.resource/images/stone-yellow-empty-played.gif.xhtml");
}

.playground-field-red-empty {
	background-image: url("/connect-four-webapp/javax.faces.resource/images/stone-red-empty.gif.xhtml");
}

.playground-field-red-empty-played {
	background-image: url("/connect-four-webapp/javax.faces.resource/images/stone-red-empty-played.gif.xhtml");
}

.playground-field > .ui-button-text {
    display: none !important;
}

.input-div {
	padding-left: 1em;
	padding-right: 1em;
}

.menu-right .ui-menu {
	width: 16em !important;
}

.ui-panel, .input-div td {
	padding: 0.1em !important;
}

.input-stone {
	width: 3.65em;
	height: 3.65em;
	background-color: white;
	background-size: 3.65em;
	background-repeat: no-repeat;
	border: none !important;
	visibility: hidden;
}

.menu-left {
	padding: 0 1em 0 0 !important;
}

.menu-right {
	padding: 0 !important;
}

.menuitem-left {
	padding-right: 1.3em;
}

.menuitem-right {
	padding-left: 0.5em;
}

.menu-header {
	font-size: 1em;
	margin: 0 auto;
	padding: 0.3em 3%;
}

.div-menu-item {
	padding: 0.3em;
}