:root {
	--background-color: #dddddd;
	--text-color: #000000;
	--text-size: 18px;
}

html {
	min-width: 360px;
	height: 100%;
	background-color: var(--background-color);
	color: var(--text-color);
	font-size: var(--text-size);
	font-family: 'Andale Mono', Courier, 'Courier New', monospace;
	overscroll-behavior: none;
}

body {
	height: 100%;
	text-align: center;
	margin: 0px;
	overscroll-behavior: none;
}

.outer {
	display: table;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	overscroll-behavior: none;
}

.inner {
	display: table-cell;
	vertical-align: middle;
	overscroll-behavior: none;
}

#tabs {
	display: flex;
	flex-flow: row wrap;
	border-top: 1px solid #000;
	border-bottom: 1px solid #000;
	margin-top: calc(var(--text-size) * 10 / 9);
}

.tab {
	font-size: calc(var(--text-size) * 2);
	margin-top: 0px;
}

.tab.notif {
	background-color: #ee3;
	border: 1px solid #881;
}

.tab.finished {
	background-color: #4e4;
	border: 1px solid #181;
}

.big {
	font-size: calc(var(--text-size) * 2);
}

button, .margin, #options, #infinity_milestones, #aleph_display {
	margin: calc(var(--text-size) * 10 / 9) auto 0px auto;
}

button {
	background-color: #eee;
	color: #000;
	white-space: pre-wrap;
	border: 1px solid #888;
	border-radius: 5px;
	transition-duration: 1s;
	cursor: pointer;
}

button:hover {
	background-color: #ccc;
	border: 1px solid #444;
}

button.upgrade {
	max-width: 300px;
}

button.upgrade.small {
	height: fit-content;
}

.fade, .tab.on {
	background-color: #999 !important;
	border: 1px solid #222 !important;
	cursor: default !important;
}

button.upgrade.maxed, button.improvement.maxed {
	background-color: #4e4;
	border: 1px solid #181;
	cursor: default;
}

button.improvement {
	border-radius: 10px;
	flex-basis: 100%;
}

button.prestigeButton {
	padding: var(--text-size);
}

.ending {
	background-color: #804 !important;
	border: 5px double #fff !important;
	border-radius: 10px !important;
	color: #fff !important;
}

.ending:not(.big):not(.upgrade):hover {
	background-color: #602 !important;
}

div.milestone {
	width: 100%;
	background-color: #ccc;
	border-top: 1px solid #000;
	color: #000;
	margin: auto;
}

div.milestone.done {
	background-color: #999;
	border-top: none;
}

button, input, select, option {
	font-size: inherit;
	font-family: inherit;
}

input.color {
	max-height: calc(var(--text-size) + 8px);
}

.graph {
	border-top: 1px solid #000;
	border-bottom: 1px solid #000;
}

div.v0 {
	background-color: #444;
	color: #fff;
	font-family: 'Bradley Hand', cursive, 'Comic Sans MS', 'Brush Script MT';
}

span.v1 {
	color: #fff6cc;
}

span.v2 {
	color: #ccc;
}

span.v3 {
	color: #ffe4cc;
}

span.v4 {
	color: #f8cccc;
}

span.v5 {
	color: #d0e8e6;
}

span.v6 {
	color: #cce2f2;
}