html {
	line-height: 1.15;
	color: var(--text-color);
	background-color: var(--background-color);
	min-width: 360px;
	overflow-y: overlay;
	scrollbar-gutter: stable;
}

body {
    margin: 0;
    line-height: 1;

	font-family: "Arial", sans-serif;
	font-size:14px;

	margin-left:60px;
	margin-right:60px;
	margin-bottom: 60px;
	background-color: var(--body-background-color);
}

details {
    display: block;
}

summary {
    display: list-item;
}

ol, ul {
	list-style: none;
}

a {
	text-decoration: none;
	color: var(--text-color);
}

img {
	max-width: 100%;
}

/* ==================================== */

.btn {
	
}

.btn:hover {
	background-color: #ddd;
	color: black;
}

.btn.active {
	background-color: #347737;
	color: white;
}

/* ==================================== */
/* Header                               */
/* ==================================== */

header {
	background-color: #333;
	display:flex;
	flex-wrap: wrap;
}

header .spacer {
	width: 60px;
}

header .expander {
	flex-grow: 5;
}

header a {
	/* float: left; */
	/* color: #f2f2f2; */
	text-align: center;
	padding: 14px 16px;
	/* text-decoration: none; */
	font-size: 17px;
}

header a:hover {
	background-color: #ddd;
	color: black;
}

header a.active {
	background-color: #4CAF50;
	color: white;
}

header input[type=text] {
	padding: 6px;
	border: none;
	margin: 8px;
	font-size: 17px;
	/* height: 32px; */
}

.header {
	background-color: #181818;
}

/* ==================================== */
/* Footer                               */
/* ==================================== */

footer {
	padding: 6px;
	color: #ffffff29;
	background-color: #333;
	text-align: right;
}