* {
	padding: 0;
	margin: 0;
}
html { height: 100%; }
body {
	position: fixed;
	height: 100%;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: #1c1f26;
	color: #fff;
	font: 1em Optima, Segoe, "Segoe UI", Candara, Calibri, Arial, sans-serif;
	line-height: 1;
}
button {
	background: none;
	border: none;
	color: #c0c5ce;
}
button:hover {
	cursor:pointer;
	color: #FEE699;
}
button:active {
	color: #ffffff;
}

button img {
	vertical-align: middle;
	height: 3em;
	/* Filter to #C0C5CD */
	filter: invert(95%) sepia(3%) saturate(715%) hue-rotate(183deg) brightness(87%) contrast(82%);
}
button:hover img {
	/* Filter to #FEE699 */
	filter: invert(89%) sepia(23%) saturate(723%) hue-rotate(338deg) brightness(103%) contrast(103%);
}
button:active img {
	/* Filter to #FFFFFF */
	filter: invert(93%) sepia(100%) saturate(29%) hue-rotate(126deg) brightness(107%) contrast(106%);
}

#countdown {
	position: absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	text-align: center;
	display: flex;
	justify-content: center;
	z-index: 1;
}
body.user #countdown { align-items: top; }
body.nouser #countdown { align-items: center; }
#countdown > div {
	padding: 1em;
}

#counter {
	font-size: 6em;
	font-family: Optima,Segoe,"Segoe UI",Candara,Calibri,Arial,sans-serif;
}
#counter:hover {
	cursor: pointer;
}
#control {
	margin-bottom: 1em;
}
#cfg_open { margin-right: 1em; }

#shade {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 100;
	background: #1c1f2633;
	/* Hidden normally */
	visibility: hidden;
	opacity: 0;
}
#shade > div {
	background: #343d45;
	padding: 1em;
	max-height: 100%;
	overflow-y: scroll;
}
body.settings #shade {
	visibility: visible;
	opacity: 1;
}

form {
	line-height: 1.5;
}
fieldset {
	border: none;
	min-width: 0;
	margin-bottom: 1em;
}
legend {
	font-size: 1.1em;
	line-height: 1;
	font-weight: 700;
	margin-bottom: 0.5em;
}
div.sublabel {
	margin-top: 0.5em;
}
textarea {
	display: block;
	width: 100%;
}
div.buttons {
	text-align: right;
}
#counter_test {
	vertical-align: middle;
	font-size: 2em;
}

body.noti {
	background: #fffffe;
	color: #000;
}
body.noti #shade > div {
	background: #fcfcfb;
}