/* ======================== */
/* 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;

	--colYellowDark:#B68136;
	--colYellowMid:#FFD45A;
	--colYellowLight:#FFDD87;

	--colOrangeDark:#8E4120;
	--colOrangeMid:#C1592B;
	--colOrangeLight:#FF753A;
}

* {
	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(--colYellowMid);
	text-decoration:none;
}

a:hover, a:focus {
	color:var(--colYellowLight);
	text-decoration:underline 0.1em;
	text-underline-offset:0.1em;
}

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

ul {
	margin-left:24px;
}

li {
	margin:8px 0px;
}

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

sup {
	font-size:12px;
	line-height:0px;
}

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

body {
	background:url("../images/background.jpg") top repeat-x, #B1968B;
    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);
}

main {
	width:100%;
	overflow:hidden;
}

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%;
}

/* ======================== */
/* SHARED COMPONENTS        */
/* ======================== */

a.classic {
	color:var(--colOrangeMid);
	font-weight:bold;
}

a.classic:hover, a.classic:focus {
	color:var(--colOrangeLight);
}

a.classic:active {
	color:var(--colOrangeDark);
}

#return {
	position:absolute;
	top:50px;
	left:50px;
	font-size:16px;
}

#bannerGIF {
	position:absolute;
	top:30px;
	left:270px;
	width:460px;
}

.classicBanner {
	position:absolute;
	left:100px;
	background:#000000;
	padding:10px;
	font-weight:bold;
	text-transform:uppercase;
}

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

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

#copyright {
	display:flex;
	align-items:center;
	gap:16px;
	padding:16px 30px;
	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;
}