@font-face {
	font-family: webFont
    src: url(fonts/Blend Her.otf) format("truetype");
}

body {
	padding: 0;
	margin: 0;
	font-family: 'webFont', monospace;
/*     font-family: 'Space Mono', monospace; */

	background: #2c3e50;
	font-size: small;
}

table {
	background: rgba(204, 204, 204, 1);
	border-collapse: collapse;
	
}

.on-table {
	text-align: center;
	color: rgba(255, 255, 255, 0.8);
}

/*  */
.restart-button {
	background: rgba(255, 255, 255, 0);
	color: rgba(255, 255, 255, 0.8);
	border: none;
}

.restart-button:active,
.restart-button:focus,
.restart-button:hover {
	background: rgba(255, 255, 255, 0.2);
}

.input-parameters {
	width: 3em;
	font-family: 'Space Mono', monospace;
	text-align: center;
	
	background: rgba(255, 255, 255, 0);
	border: none;
	
	color: rgba(255, 255, 255, 0.8);
}

.input-parameters:active,
.input-parameters:focus {
	outline: none !important;
	background: rgba(255,  255,  255, 0.2);
	
/* 	border-bottom: 2px solid #999999; */
}

.noselect {
	-webkit-touch-callout: none; /* iOS Safari */
	  -webkit-user-select: none; /* Safari */
	   -khtml-user-select: none; /* Konqueror HTML */
	     -moz-user-select: none; /* Firefox */
	      -ms-user-select: none; /* Internet Explorer/Edge */
	          user-select: none; /* Non-prefixed version, currently
                                    supported by Chrome and Opera */
                                  
	cursor: default;
}

/* */

.cell {
	padding: 0px;
	width: 30px !important;
	height: 30px !important;
	
	margin: 0px;
	padding: 1px;
	border: 1px solid rgba(143, 143, 143, 1);
	
/* 	line-height: 100%; */
	font-size: 25px;
	text-align: center;
	font-weight: bold;
}

.play-cell-opened {
	width: 100%;
	height: 100%;
	
	background: rgba(191, 191, 191, 1);
	outline: 0px;
}

.play-cell-closed {
	width: 100%;
	height: 100%;
	
	color: rgba(0, 0, 0, 0);
	
	background: rgba(150, 150, 150, 1);
	outline: 1px outset rgba(150, 150, 150, 1);
}

.play-cell-closed:active {
	outline: 0px;
}

.value-00 {
	color: rgba(215, 215, 215, 0);
}

.value-01 {
	color: rgb(0, 0, 255);
}

.value-02 {
	color: rgb(0, 127, 0);
}

.value-03 {
	color: rgb(255, 0, 0);
}

.value-04 {
	color: rgb(0, 0, 127);
}

.value-05 {
	color: rgb(127, 0, 0);
}

.value-06 {
	color: rgb(0, 127, 127);
}

.value-07 {
	color: rgb(0, 0, 63);
}

.value-08 {
	color: rgb(0, 63, 0);
}

.value-09 {
	color: rgb(63, 0, 0);
}

.value-mine {
	background-image: url(/img/mine.svg);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 100%;
	color: rgba(255, 255, 255, 0);
}

.value-flag {
	background-image: url(/img/flag.svg);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 100%;
	color: rgba(255, 255, 255, 0);
}