body {
	background-image: url(images/background-2.jpg);
	background-size : cover;
}

/*body {
	position: absolute;
	top: 0; bottom: 0; left: 0; right: 0;
	height: 100%;
}
body:before {
	content         : "";
	position        : absolute;
	background-image: url(images/background-1.jpg);
	background-size : cover;
	z-index         : -1;
	height          : 20%;
	width           : 20%;
	transform       : scale(5);
	transform-origin: top left;
	filter          : blur(1px);
}*/

.game {
	margin-top        : 100px;
	background-color  : #D1DDD9;
	font-family       : 'Sriracha';
	border            : 20px solid #8c5434;
	box-shadow        : 5px 5px 5px 1px black;
	border-image      : linear-gradient(to bottom, #8c5434 , #50311f);
	border-image-slice: 1;
}
.game-form{
	padding-bottom: 15px;
}

.other-host:hover {
	cursor: pointer;
}

th{
	font-family: 'Shojumaru';
	font-size: 1.5rem;
}
td {
	font-family: 'Shojumaru';
	border-top: 1px solid #DDD !important;

}
tr {
	background-color: #e5f1ed;
}
table {
	border: 1px solid #CCC;
}

.score-container {
	font-size         : 2rem;
	font-family       : 'Shojumaru';
	background        : #FFF;
	border            : 10px solid #8c5434;
	box-shadow        : 5px 5px 5px 1px black;
	width             : 80%;
	margin-left       : auto;
	margin-right      : auto;
	margin-bottom     : 10px;
	padding           : 5px;
	border-image      : linear-gradient(to bottom, #8c5434 , #50311f);
	border-image-slice: 1;
	margin-top        : 10px;
}

.score-message {
	font-family: 'Sriracha';
	font-size  : 1.2rem;
}
.marks {
	height: 30px;
}
.calculate {
	background-color: #3AB54B;
	font-size: 3rem;
}
@media only screen and (max-width: 600px) {
	.marks {
		height: 20px !important;
	}

	th, td {
		font-size: 75% !important;
	}

	.score-container {
		font-size: 20px !important;
	}

	.score-message {
		font-size: 10pt;
	}

	.game {
		border: 10px solid #8c5434  !important;
	}
	.main-container {
		margin: auto !important;
	}
}