body {
	background-color: #eee;
	font: normal 100% "Helvetica Neue", Sans-Serif;
	padding: 2em 0;
}

.container { width: 40em; margin: 0 auto;}

.info {background-color: white; padding: .5em 0;}
.info p, .info h1 {padding: 0 1em;}
.box .right {text-align: right;}
.table {display: table; width: 100%;}
.box {width: 100%;}
.row {display: table-row;}
.row .description, .row .cell {display: table-cell;}
.row .score-container {display: table;}
.score-container .score, .score-container .label {display: table-cell;}
.box.footer {font-size: 75%; padding-top: 2em;}

.title {font-weight: bold; padding-top: 1em;}
.title div{font-weight: bold; padding: 1em 0;}

.row .description {width: 50%; padding: .5em 1em;}
.row .score-container {width: 100%;}

.row .score {width: 50%;}
.row .label {width: 50%; padding: .5em 0;}

.button {
	margin-top: 1em;
	width: 100%;
	font: normal 200% "Helvetica Neue", Sans-Serif;
	border: none;
	border-radius: .5em;
	background-color: #ffd633;
	color: #808080;
}
.button:hover {background-color: #ffeb99;}
.button:active {background-color: #fff5cc;}

.section.cell { width: 50%; padding: .5em 1em;}
.rift.cell, .vive.cell { width: 25%; padding: .25em 0;}

.splash div {
	padding: 2em 4em;
	color: white;
}
.splash a:link		{color:#ddd;}
.splash a:visited	{color:#ccc;}
.splash a:hover		{color:#eee;}
.splash a:active	{color:#fff;}
.splash h1 {text-align: center; font-size: 400%; margin: .5em 0;}
.splash .draw {background-color: #808080;}
.splash .rift {background-color: #1c1e20;}
.splash .vive {background-color: #00acdd;}