body {
	background-color: #575175;
}

h1 {
	text-align: center;
	padding-top: 20px;
	color: rgba(180, 175, 206, 0.73);
	font-weight: 100;
}

table {
	/*border-width: medium;*/
	/*border-color: gray;*/
	text-align: center;
	width: 50%;
	margin: 0 auto;
}

table, th, td {
	padding: 10px;
	height: 50px;
}

tr:nth-child(1) {
	background: rgba(139, 195, 74, 0.33);
}
tr:nth-child(2) {
	background: rgba(139, 195, 74, 0.33);
}
tr:nth-child(3) {
	background: rgba(139, 195, 74, 0.33);
}

td:nth-child(1) {
	background: rgba(255, 152, 0, 0.3);
}
td:nth-child(2) {
	background: rgba(255, 152, 0, 0.3);
}
td:nth-child(3) {
	background: rgba(255, 152, 0, 0.3);
}

td:nth-child(4) {
	background: rgba(165, 165, 165, 0.23);
}
td:nth-child(5) {
	background: rgba(165, 165, 165, 0.23);
}
td:nth-child(6) {
	background: rgba(165, 165, 165, 0.23);
}

td:nth-child(7) {
	background: rgba(117, 188, 220, 0.47);
}
td:nth-child(8) {
	background: rgba(117, 188, 220, 0.47);
}
td:nth-child(9) {
	background: rgba(117, 188, 220, 0.47);
}

tr:nth-child(7) {
	background: rgba(154, 99, 141, 0.38);
}
tr:nth-child(8) {
	background: rgba(154, 99, 141, 0.38);
}
tr:nth-child(9) {
	background: rgba(154, 99, 141, 0.38);
}

.solved {
	font-size: x-large;
	color: rgba(255, 255, 255, 0.86);
	font-family: sans-serif;	
}

.unsolved {
	font-size: x-small;
	color: rgba(235, 235, 235, 0.02);
	text-align: left;
}

.solver, .unsolved {
	width: 50px;
}

.starting {
	color: #ffeb3b;
}

.error {
	color: red !important;
}

.inputNumber {
	font-size: x-large;
	color: white;
	background-color: rgba(87, 81, 117, 0.08);
	width: 50px;
	border: none;
	text-align: right;
}

#action {
	text-align: center;
}

.solveComment {
	color: rgba(255, 255, 255, 0.37);
	display: inline;
}

.sButton {
	color: #d0d0d0;
	display: inline;
	background-color: #696580;
	padding: 5px;
	margin-left: 5px;
	transition: 0.2s;
}

.sButton:hover {
	background-color: purple;
	cursor: pointer;
}

.generateAction {
	color: rgba(255, 255, 255, 0.37);
	display: inline;
	margin-left: 5px;
}