:root {
	--background: #C0C0C0;
	--alt : #B0B0B0;
	--text: #000000;
	--primary: #00005E;
	--accent: #B4D5F4;
	--divider: #D5D1C9;
}

body {
	margin: 0;

	background: url("../media/images/background.png");
	background-size: cover;
	background-position: left top;

	font-family: "Kosugi Maru", "Microsoft Sans", "Tahoma", "Sans";
}

.button {
	display: inline-block;
	padding: 5px;
	margin: 5px;
	color: var(--text);
	background: var(--background);
	border: solid 2px;
	border-color: #fff #000 #000 #fff;

	cursor: pointer;
	user-select: none;
	text-decoration: none;
}

.button:active {
	border-color: #000 #fff #fff #000;
}

.button.disabled {
	color: var(--alt);
	text-shadow: 1px 1px #fff;
}

.button.disabled:active {
	border-color: #fff #000 #000 #fff;
}

.window {
	padding: 5px;
	border: solid 2px;
	border-color: #fff #000 #000 #fff;
	background: var(--background);
}

.window > .titlebar {
	padding: 2px;
	background: linear-gradient(to right, var(--primary), var(--accent));
	color: var(--background);
}

.window > .titlebar > * {
	display: inline;
	width: fit-content;
	margin: 0;
	padding: 0;
}

.window > .titlebar > a {
	float: right;
	height: 18px;
	width: 18px;
	text-align: center;
	font-size: 15px;
}

@font-face {
	font-family: "Kosugi Maru";
	font-style: normal;
	font-weight: 400;
	src: url(media/fonts/KosugiMaru-Regular.ttf) format(font/ttf);
}
