@import url('https://fonts.googleapis.com/css?family=Lato:400,700&subset=latin-ext');
body {
	font-family: 'Lato', sans-serif;
}

input[type='radio'] {
	transform: scale(1.1, 1.1);
}

#okButton {
	text-decoration: none;
	color: black;
	background-color: aquamarine;
	border: 1px solid black;
	border-radius: 10px;
	padding: 14px;
	font-size: 14px;
	text-align: center;
	display: inline-block;
	cursor: pointer;
}

#okButton:hover:enabled {
	transition-duration: 0.5s;
	background-color: cyan;
	box-shadow: 0 0 10px 4px cyan;
}

#okButton:disabled {
	transition-duration: 0.3s;
	background-color: lightgray;
}

#endTestButton {
	text-decoration: none;
	font-weight: bold;
	padding: 5px 8px 5px 8px;
	margin-top: 6px;
	color: black;
	background-color: lightblue;
	border: 1px solid red;
	border-radius: 10px;
	text-align: center;
	display: inline-block;
	cursor: pointer;
}

#endTestButton:hover {
	transition-duration: 0.5s;
	background-color: cyan;
	box-shadow: 0 0 10px 4px red;
}

.descButton {
	text-decoration: none;
	color: black;
	text-decoration: underline;
	background-color: transparent;
	border: 0px;
	text-align: center;
	display: inline-block;
	cursor: pointer;
}

.detailsButton:hover {
	transition-duration: 0.5s;
	background-color: lightblue;
}

#lifelineHintButton {
	padding-left: 10px;
	padding-right: 10px;
	height: 38px;
	width: auto;
	border: 1px solid black;
	background-color: #ffff66;
	border-radius: 10px;
	cursor: pointer;
}

#lifelineHintButton:hover {
	height: 45px;
	transition-duration: 0.5s;
	background-color: orange;
	box-shadow: 0 0 15px orange;
}

#lifelineFFButton {
	height: 38px;
	width: auto;
	border: 1px solid black;
	background-color: lightblue;
	border-radius: 10px;
	cursor: pointer;
}

#lifelineFFButton:hover {
	height: 45px;
	transition-duration: 0.5s;
	background-color: cyan;
	box-shadow: 0 0 15px cyan;
}

#questionTab {
	border-radius: 10px;
	background-color: lightsteelblue;
	padding: 8px;
	display: inline-block;
	border: 1px solid black;
	margin: 1px;
}

#questionTab:hover {
	transition-duration: 0.5s;
	background-color: darkcyan;
	box-shadow: 0 0 10px blue;
}

#tfDiv {
	display: inline-block;
	height: 30px;
	padding-left: 3px;
	padding-right: 3px;
	margin-left: 1px;
	margin-right: 1px;
	border-radius: 5px;
}

#tfDiv:hover {
	transition-duration: 0.5s;
	box-shadow: 0 0 12px 4px gray;
}

#packTab {
	vertical-align: top;
	border: 1px solid black;
	display: inline-block;
	margin-left: 5px;
	margin-right: 5px;
	margin-bottom: 5px;
	margin-top: 2px;
	padding: 6px;
	min-width: 140px;
	max-width: 200px;
}

#usernameInput {
	border: 2px solid black;
	background-color: white;
	margin-bottom: 5px;
}

#usernameInput:focus {
	transition-duration: 0.2s;
	box-shadow: 0 0 14px 1px blue;
}

#checkDiv {
	text-align: center;
	font-size: 20px;
	display: inline-block;
	width: 80vw;
	margin: auto;
	background-color: ivory;
	border: 1px solid black;
	border-width: 0px 1px 0px 1px;
}