@font-face {
  font-family: header;
  src: url(files/Kario39C3VarWEB-Roman.woff);
}
@font-face {
  font-family: body;
  src: url(files/OfficerSansWeb-Regular.woff);
}

:root {
	--background: #000;
	--color: #fff;
	--secondary-color: #9673ff;
	--highlight: #9673ff;

	--code-background: #333;

	--font-family: "body";
	--highlight-font-family: "header";

	--width: 900px;
	--bar-height: 40px;

	--pic-height: 300px;
}

*{margin:0;padding:0}

body {
	margin:7% auto 0;
	max-width:var(--width);
	min-height:180px;
	padding:3rem 0 1.5rem
}

html {
	background:var(--background);
	color:var(--color);
	padding: 1.5rem;
	font:12pt/22pt var(--font-family);
}

p.alert {
	color: darkred;
	font-style: italic;
	font-size: 1.1rem;
}

h1 {
	margin-bottom: 4rem;
	line-height: 110%;
	font-family: var(--highlight-font-family);
	color: var(--highlight);
}


p {
	margin: 1rem 0 2rem;
	overflow:hidden;
	text-align: justify;
	text-justify: inter-word;
}

ins{
	color:#777;
	text-decoration:none
}

a{
	border:0;
	padding: 0.1rem;
	color: var(--highlight);
	background: var(--background);
	font-family:var(--font-family);;
	text-decoration:none;
}

a:hover{
	color: var(--background);
	background: var(--highlight);
}

img{
	border:0;
	max-height: var(--pic-height);
	margin-bottom: 4rem;
	/*width: auto;*/
	width: (var(--width)/2);
}
video {
	border:0;
	max-height: var(--pic-height);
	margin-bottom: 4rem;
	/*width: auto;*/
	width: (var(--width)/2);
}

ul {
	margin-left: 2rem;
	list-style-position: inside;
	margin-bottom: 2rem;
}

ol {
	margin-left: 2rem;
	list-style-position: inside;
	margin-bottom: 2rem;
}

/* Footer */

div.footer {
	position:fixed;
	left:0px;
	bottom:0px;
	height:1.5rem;
	width:100%;
	font:1rem var(--font-family);
	color:#777;
	text-align:center;
}

/* Header */

div.header {

	position:fixed;
	left:50%-(var(--width)/2);
	top:0px;
	padding: 1rem;
	height:var(--bar-height);
	width:var(--width);
	font:2rem monospace;
	color:#777;
	background:#000;
	text-align: left;
}


p.header {
	text-indent: 0px;
	margin-top:1rem;
	margin-bottom:1rem;
}
