
:root {
	--light-bg-color: #000000;
	--dark-bg-color: #000000;
	--primary-fg-color: #00AA00;
	--primary-fg-shadow-color: #008000;
	--secondary-fg-color: #0037DA;
	--secondary-fg-shadow-color: #0026C9;
	--left-panel-width: 33vw;
	--left-panel-padding: 15%;
	--right-panel-width: calc(98vw - var(--left-panel-width));
	--left-column-width: 42%;
	--right-column-width: calc(98% - var(--left-column-width));
}

a {
	color: inherit;
}

body {
	margin: 0px;
	width: 100%;
	color: var(--primary-fg-color);
	background-color: var(--light-bg-color);
	font-family: monospace;
	text-shadow: 0px 0px 7px var(--primary-fg-shadow-color);
}

.panel {
	box-sizing: border-box;
	padding: 5px;
	height: 100vh;
}

#left-panel {
	float: left;
	width: var(--left-panel-width);
	padding: var(--left-panel-padding)  0;
	color: var(--secondary-fg-color);
	text-shadow: 0px 0px 7px var(--secondary-fg-shadow-color);
	background-color: var(--dark-bg-color);
}

#left-panel * {
	position: relative;
	font-size: large;
	line-height: 2.1em;
	white-space-collapse: preserve-breaks;
}

#left-panel #left-content-column {
	float: left;
	width: var(--left-column-width);
	text-align: end;
	font-weight: bolder;
}

#left-panel #right-content-column {
	float: right;
	width: var(--right-column-width);
	text-align: start;
	font-weight: 50;
}

#right-panel {
	float: right;
	width: var(--right-panel-width);
	background-color: var(--light-bg-color);
}

#right-panel .centered {
	text-align: center;
}

#right-panel h1 {
	font-size: xx-large;
	font-family: "Monaco", monospace;
	font-style: italic;
}

#right-panel p {
	margin: 10px 10%;
	text-align: start;
	text-indent: 2em;
	font-size: large;
}

