div#john-chamber{
	user-select:none;
}
div#john-chamber {
	/* Shared */
	#the_form,
	#auto_interval,
	#salt_level {
		text-align: center;
	}


	div#output {
		user-select: all;
	}

	#back,
	#auto {
		background-repeat: no-repeat;
		background-position: center center;
		background-color: #505;
		text-align: center;
		color: white;
	}

	.status-button.active {
		color: white;
	}

	#submit {
		color: white;
	}

	#status_lose.active {
		background-color: #900;
	}

	#status_win.active {
		background-color: #090;
	}

	#auto.active {
		background-color: #590;
	}

	#count {
		padding-left: 5px;
		color: white;
	}

	h1, h2, h3 {
		margin: 3px;
		padding: 0;
	}

	a {
		color: #09F;
		text-decoration: none;
	}

		a:hover {
			color: #5DF;
		}

	.add_btn {
		color: gray;
		/*cursor: pointer;*/
	}

		.add_btn:hover {
			color: black;
		}

	option.off {
		background-color: #FFCCCC;
	}

	.button {
		display: inline-block;
		width: 120px;
		border-radius: 3px;
		user-select: none;
		-webkit-user-select: none;
		-moz-user-select: none;
	}

	#submit {
		width: 200px;
		margin: 5px;
		padding: 6px 20px;
		font-size: 18pt;
		font-weight: bold;
		background-color: #909;
	}

		#submit:hover {
			background-color: #c4c;
		}

	#back,
	#auto {
		width: 50px;
		padding: 0;
		height: 40px;
		font-size: 14pt;
		font-weight: bold;
	}

		#back:hover,
		#auto:hover {
			background-color: #737;
		}

	#back {
		position: relative;
	}

	#autojohn {
		display: inline-block;
		position: relative;
		top: 8px;
		width: 50px;
		line-height: 0;
		text-align: center;
	}

		#autojohn input {
			width: 100%;
			height: 16px;
			margin: 0;
			padding: 0;
			border: 0;
			border-bottom-left-radius: 3px;
			border-bottom-right-radius: 3px;
		}

	#auto {
		height: 25px;
		margin: 0;
		background-size: auto 80%;
		border-bottom-left-radius: 0;
		border-bottom-right-radius: 0;
	}

	.stat-buttons .status-button {
		display: inline-block;
		width: 80px;
		margin: 3px;
		padding: 2px 5px;
		border-radius: 3px;
		/*cursor: pointer;*/
		font-size: 20px;
		font-weight: bold;
		font-family: calibri, tahoma;
		color: #000;
		background-color: #DDD;
	}

		.stat-buttons .status-button:hover {
			background-color: gold;
		}

		.stat-buttons .status-button:active {
			background-color: goldenrod;
			color:white;
		}

		.stat-buttons .status-button.active {
			color: white;
		}

	div#end_buttons button#submit.button:active {
		background-color: rebeccapurple;
	}

	div#end_buttons button#back.button:active {
		background-color: #404;
	}

	#buttons .salt-button {
		margin: 3px 2px;
		padding: 3px;
		color: #000;
		background-color: #ddd;
		font-weight: bold;
	}

		#buttons .salt-button:hover {
			background-color: aquamarine;
		}

		#buttons .salt-button:active {
			background-color: mediumaquamarine;
			color:#fff;
		}

		#buttons .salt-button.active {
			/*border: 0;*/
			border-radius: 2px;
			font-weight: bold;
			color: white;
			background-color: #09F;
		}

	#credit {
		margin-top: 3px;
		margin-bottom: -3px;
		font-size: 8pt;
		font-family: monospace;
		color: #555;
		text-align: center;
	}

		#credit span {
			color: #977;
		}

	.rip,
	.nopad {
		margin: 0;
		padding: 0;
	}

	.rip {
		color: #333;
	}

	hr {
		max-width: 420px;
		height: 1px;
		border: 0;
		background-color: #777;
	}

	@media (max-width:380px) {
		div#outbox {
			width: 100%;
		}
	}

	.header {
		margin-top: 20px;
		font-family: monospace;
	}

	.title {
		font-size: 20pt;
		font-weight: bold;
		font-family: monospace;
		border-radius: 5px;
	}

	.stat-buttons {
		margin-top: 5px;
	}

	#outbox {
		display: table;
		width: 350px;
		height: 80px;
		margin: auto;
		margin-top: 10px;
		text-align: center;
		background-color: white;
	}

	#output {
		display: table-cell;
		width: inherit;
		height: inherit;
		margin: auto;
		padding: 10px;
		vertical-align: middle;
		text-align: center;
		font-size: 18pt;
		font-weight: bold;
		color: black;
		background-color: #F0F0F0;
	}

	#count-box {
		display: table-row;
		text-align: left;
		font-size: 10pt;
		font-family: monospace;
		color: #666;
		background-color: #222;
	}

	#outbox:hover #count-box {
		font-weight: bold;
		color: white;
		background-color: #444;
	}
}