body {
	height: 100%;
	width: 100%;

	-webkit-user-select: none;
	-ms-user-select: none;
	user-select: none;

	overflow-x: hidden;

	font-family: Verdana, Geneva, Tahoma, sans-serif;
	text-align: center;

	background-color: #9bff9c;
	color: #009400;
}

/* Info */
.infobox {
	width: 95%;
	padding-bottom: 10px;
	border: 3px solid #009400;
	text-align: center;
	font-size: 20px;
}

/* Links */
a {
	color: #009400;
}

/* The progress bar */
.lvlprog {
	width: 95%;
	border: 3px solid black;
}

::-webkit-progress-bar {
	background-color: #b5ffb3;
}

/* The math problem */
.question {
	display: inline-block;
	font-size: 20px;
	text-align: center;
}

.questionin {
	text-align: right;
}

/* The answer input box */
.anstxt {
	border: 3px solid #009400;
	width: 50px;

	color: #009400;
	text-align: right;
	font-size: 20px;
}

.anstxt:focus {
	border: 3px solid #006e00;
	width: 50px;

	font-size: 20px;
	color: #009400;

	outline: none !important;
}

.holidayboxcont {
	border: 3.7px dashed darkgreen;
	background-color: darkred;
	width: 150px;

	display: inline-block;
}

.holidaybox {
	border: 3px solid #00d200;
	background-color: #00d200;
	color: #009400;

	font-size: 13px;
}

/* Buttons */
.anssub {
	cursor: pointer;

	width: 111px;

	border: 3px solid black;
	background-color: white;
}

.anssub:hover {
	cursor: pointer;

	border: 3px solid black;
	background-color: #ebebeb;
}

.anssub:active {
	cursor: pointer;

	border: 3px solid black;
	background-color: #d6d6d6;
}

.ansskip {
	cursor: pointer;

	width: 40px;

	border: 3px solid black;
	background-color: white;
}

.ansskip:hover {
	cursor: pointer;

	border: 3px solid black;
	background-color: #ebebeb;
}

.ansskip:active {
	cursor: pointer;

	border: 3px solid black;
	background-color: #d6d6d6;
}

.anseasy {
	cursor: pointer;
	padding-left: .5px;
	padding-right: .2px;
	font-size: 13px;

	border: 3px solid black;
	background-color: white;
}

.anseasy:hover {
	cursor: pointer;

	border: 3px solid black;
	background-color: #ebebeb;
}

.anseasy:active {
	cursor: pointer;

	border: 3px solid black;
	background-color: #d6d6d6;
}

.play {
	cursor: pointer;
	width: 147px;

	border: 3px solid black;
	background-color: white;
}

.play:hover {
	cursor: pointer;

	border: 3px solid black;
	background-color: #ebebeb;
}

.play:active {
	cursor: pointer;

	border: 3px solid black;
	background-color: #d6d6d6;
}

.nosnow {
	cursor: pointer;

	width: 90px;

	border: 3px solid black;
	background-color: white;
}

.nosnow:hover {
	cursor: pointer;

	border: 3px solid black;
	background-color: #ebebeb;
}

.nosnow:active {
	cursor: pointer;

	border: 3px solid black;
	background-color: #d6d6d6;
}

/* Archive */
.archiveitem {
	display: inline-block;
	border: 3px solid darkgreen;
	background-color: #9aff9b;
}

.closearchive {
	cursor: pointer;
	color: darkgreen;

	font-size: 30px;
}

#archive {
	position: absolute;
  display: none;
	
	top: 100px;

	background-color: white;
	height: 80%;
	width: 97%;
	padding: 10px;

	text-align: left;
}

.archivebtn {
	cursor: pointer;

	width: 90px;

	display: inline-block;
	margin-left: 6px;

	border: 3px solid black;
	background-color: white;
}

.archivebtn:hover {
	cursor: pointer;

	border: 3px solid black;
	background-color: #ebebeb;
}

.archivebtn:active {
	cursor: pointer;

	border: 3px solid black;
	background-color: #d6d6d6;
}

/* Messages */
.msg {
	width: 95%;
	margin-bottom: 10px;

	z-index: 100;

	border: 3px solid black;

	display: none;
}

.msgclose {
	color: #ffca00;

	-webkit-text-stroke: 1.2px;
	padding-left: 20px;

	z-index: 100;

	cursor: pointer;
}

/* The math problem line ---- */
.line {
	width: 58px;
	height: 3px;

	background-color: #009400;
}

/* News */
.newsblock {
	border: 3px solid #009400;

	color: #009400;
	text-align: left;
	font-size: 17px;
	padding: 10px;
}

.date {
	background-color: green;
	color: lightgreen;
	display: inline-block;
	padding: 5px;
	margin-right: 10px;
	border-radius: 5px;
}

/* Status */
.maintblock {
	color: gold;
	border: 3px dashed gold;
	background-color: black;

	padding: 10px;
	display: none;

	text-align: center;
	font-size: 15px;
}

.goodblock {
	color: green;
	border: 3px solid green;
	background-color: lightgreen;

	padding: 10px;
	display: none;

	text-align: center;
	font-size: 15px;
}

/* Quizzes */
.badge {
	background-color: green;
	color: lightgreen;
	display: inline-block;

	font-size: 16px;

	padding: 5px;
	margin-right: 3px;
	border-radius: 5px;
}

.quizqbox {
	display: inline-block;
	text-align: center;
}

.btn {
	cursor: pointer;

	border: 3px solid black;
	background-color: white;
}

.btn:hover {
	cursor: pointer;

	border: 3px solid black;
	background-color: #ebebeb;
}

.btn:active {
	cursor: pointer;

	border: 3px solid black;
	background-color: #d6d6d6;
}

#questnum {
	width: 95%;
	border: 3px solid black;
}

.progbar {
	width: 95%;
	border: 3px solid darkgreen;
	background-color: #b5ffb3;
}

#name {
	font-size: 35px;
	padding: 5px;
}

#qinfo {
	border: 3px solid darkgreen;

	padding-top: 10px;
	padding-bottom: 10px;
}

.qcont {
	padding: 10px;

	font-size: 20px;

	display: inline-block;
}

.qboxin {
	text-align: right;
}

.wordprobtxt {
	text-decoration-thickness: 3px;
}

.qblockco {
	display: inline-block;
	margin: 3px;

	text-align: center;

	border: 3px solid darkgreen;
	padding-bottom: 10px;
	width: 300px;

	background-color: limegreen;
}

.qblockin {
	display: inline-block;

	text-align: center;

	border: 3px solid #720209;
	padding-bottom: 10px;
	width: 300px;

	color: #ee0404;

	background-color: #9f0000;
}

.selectblock {
	display: inline-block;
	margin: 3px;

	text-align: center;

	border: 3px solid darkgreen;
	padding-bottom: 10px;
	width: 250px;

	background-color: limegreen;
}