/* ======================== */
/* FONT DEFINITIONS         */
/* ======================== */

@font-face {
	font-weight:normal;
	src:url(/fonts/dejavu-sans.woff2) format("woff2");
	font-family:"DejaVu Sans";
}

@font-face {
	font-weight:bold;
	src:url(/fonts/dejavu-sans-bold.woff2) format("woff2");
	font-family:"DejaVu Sans";
}

@font-face {
	src:url(/fonts/inconsolata.woff2) format("woff2");
	font-family:"Inconsolata";
}

/* ======================== */
/* GENERIC STYLING          */
/* ======================== */

:root {
	--fontGeneric:"DejaVu Sans", sans-serif;
	--fontCode:"Inconsolata", monospace;

	--contentWidth:1000px;

	--colDark:#A8A8A8;
	--colMid:#C9C9C9;
	--colLight:#FFFFFF;
}

* {
	box-sizing:border-box;
	margin:0px;
	border:0px;
	padding:0px;
}

html {
	scroll-behavior:smooth;
}

h1, h2 {
	display:none;
}

p {
	margin-bottom:10px;
}

p:last-of-type {
	margin-bottom:unset;
}

a {
    color:var(--colMid);
    text-decoration:underline 0.1em;
	text-underline-offset:0.1em;
}

a:hover, a:focus {
	color:var(--colLight);
}

a:active {
	color:var(--colDark);
}

code {
    border-radius:3px;
    background:rgba(0, 0, 0, 0.15);
    padding:2px 4px;
    font-size:16px;
    font-family:var(--fontCode);
}

/* ======================== */
/* PAGE SKELETON            */
/* ======================== */

body {
	background:#000000;
    color:var(--colMid);
	font-size:15px;
	line-height:1.35em;
	font-family:var(--fontGeneric);
	text-shadow:0px 2px 3px #000000;
	-webkit-text-size-adjust:none;
}

body, section, section>div {
	min-width:var(--contentWidth);
}

section {
	background-position:top center;
	background-repeat:no-repeat;
}

section>div {
	position:relative;
	margin:0px auto;
	background-position:top center;
	width:var(--contentWidth);
	height:100%;
}

/* ======================== */
/* COPYRIGHT                */
/* ======================== */

#footer {
	background:url("../images/sectionFooter.jpg") top center repeat-y;
}

#copyright {
	display:flex;
	align-items:center;
	gap:16px;
	padding:16px;
	color:#A7AFAF;
	font-weight:bold;
    font-size:13px;
    line-height:1.2em;
}

#copyright a:hover, #copyright a:focus {
	filter:brightness(1.15);
}

#copyright a:active {
	filter:brightness(0.85);
}

#copyright img {
	width:100px;
}