* {
    -webkit-user-select: none;
     -khtml-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
}


body {
	margin: 0 5px 30px;
}


#gameOptions {
	margin: 40px 0 0 50px;
}
#gameOptions button {
	padding: 6px 12px;
	font-size: 20px;
}
#playerOptionsSelection select {
	width: 130px;
	margin: 0 5px;
}
#beginGameButton, #randomRacesGameButton {
	display: none;
	margin: 30px 10px;
}
.preview {
	display: none;
}
.hidden {
	display: none;
}





#column1 {
	width: 700px;
	display: inline-block;
}


#scoringTileTable {
	border-collapse: collapse;
	cursor: default;
	margin: 30px auto 0;
}
#scoringTileTable tr:nth-child(2) {
	background-color: #050;
	color: white;
}
#scoringTileTable tr:nth-child(3) {
	background-color: gold;
}
#scoringTileTable td {
	padding: 0 3px;
	text-align: center;
}
#scoringTileTable td:not(:first-child) {
	border-left: 1px solid black;
}
#scoringTileTable td.expired {
	background-color: #ddd;
	color: #555;
}


#terraMysticaBoard {
	margin: 15px 0 0;
}


#transformTable, #terrainTable {
	border-collapse: collapse;
	cursor: default;
	margin: 30px auto 0;
}
#transformTable td, #terrainTable td {
	padding: 0 3px;
	text-align: center;
}
#transformTable td {
	border-left: 1px solid black;
}
#transformTable td div, #terrainTable td div {
	width: 25px;
	height: 25px;
	border-radius: 50%;
	display: inline-block;
	border: 3px solid darkgoldenrod;
}
#transformTable td:nth-child(5) div, #terrainTable td:nth-child(4) div {
	width: 35px;
	height: 35px;
}


#currentOperation {
	text-align: center;
	margin: 20px 0 0;
	font-size: 26px;
}


#interactionOptions {
	text-align: center;
	margin: 30px 0 0;
}
#interactionOptions button {
	padding: 10px 20px;
	background: #ff00ff;
	color: white;
	font-size: 20px;
}
#interactionOptions button.unaffordable {
	background: #555;
	color: #ddd;
}


#playerTable {
	border-collapse: collapse;
	cursor: default;
	margin-top: 30px;
	width: 700px;
}
#playerTable tr.playerTableDivider {
	border-top: 1px solid black;
}
#playerTable tr.playerTableThickDivider {
	border-top: 4px solid black;
}
#playerTable th, #playerTable td {
	border-right: 1px solid black;
	padding: 0 3px;
	text-align: center;
	min-width: 80px;
}
#playerTable th:first-child, #playerTable td:first-child {
	text-align: right;
}
#playerTable .active {
	background-color: pink;
}
#playerTable .passed {
	color: #555;
}
#playerTable tr:nth-child(even) td {
	background-color: #eee;
}
#playerTable tr:nth-child(even) td.active {
	background-color: #faa;
}
#playerTable td div.startingMarker {
	display: inline-block;
	margin-left: 3px;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background-color: orange;
}
#playerTable span.used {
	text-decoration: line-through;
}
#playerTable span.notBuilt {
	color: #7070ff;
}
#playerTable button {
	background-color: #ff00ff;
	color: white;
}







#column2 {
	margin-left: 20px;
	vertical-align: top;
}
@media all and (min-width: 1050px) {
	#column2 {
		width: 300px;
	}
}


#cultTable {
	width: 300px;
	border-collapse: collapse;
	cursor: default;
	margin-top: 30px;
	text-align: center;
	display: inline-block;
}
#cultTable tr.cultPowerRow {
	background-color: purple;
	color: white;
}
#cultTable td {
	border: 1px solid black;
	height: 12px;
	width: 60px;
}
#cultTable tr:not(.cultPowerRow):not(.cultZero) td:nth-child(1) {
	background-color: orange;
}
#cultTable tr:not(.cultPowerRow):not(.cultZero) td:nth-child(2) {
	background-color: lightblue;
}
#cultTable tr:not(.cultPowerRow):not(.cultZero) td:nth-child(3) {
	background-color: brown;
	color: white;
}
#cultTable tr:not(.cultPowerRow):not(.cultZero) td:nth-child(4) {
	background-color: #ddd;
}
#cultTable .cultPlaceholder, #cultTable .cultMarker {
	display: inline-block;
	width: 10px;
	height: 10px;
}
#cultTable .cultMarker {
	border-radius: 50%;
	border: 1px solid black;
}
#cultTable .cultPriest {
	display: inline-block;
	width: 12px;
	height: 12px;
	border: 1px solid black;
}


#actionTables  {
	display: inline-block;
	vertical-align: top;
}
#undoButton {
	display: block;
	margin: 30px auto 0;
	padding: 6px 12px;
}
#autoEndTurnCheckbox {
	margin-top: 30px;
}
#actionTables table {
	width: 300px;
	border-collapse: collapse;
	cursor: default;
	margin-top: 30px;
	text-align: center;
}
#actionTables table .active {
	background-color: #ff00ff;
	color: white;
	border: 1px solid black;
}
#actionTables td {
	padding: 6px 3px;
	width: 140px;
}
#conversionsTable td:nth-child(2) {
	border-left: 1px solid black;
}
#powerActionTable tr {
	border-bottom: 1px solid black;
}








#tileWrapper table {
	vertical-align: top;
	display: inline-block;
	width: 200px;
	margin-left: 20px;
}
#bonusCardTable, #favourTileTable, #townTileTable {
	border-collapse: collapse;
	cursor: default;
	margin-top: 30px;
}
#bonusCardTable tr, #favourTileTable tr, #townTileTable tr {
	border-bottom: 1px solid black;
}
#bonusCardTable td:nth-child(2), #favourTileTable td:nth-child(2) {
	text-align: center;
}
#townTileTable td:nth-child(2) {
	text-align: right;
	padding-left: 10px;
}