:root {
	--bg: #ffffff;
	--text: #134686;
}

/* Base layout */
* { box-sizing: border-box; }
html,body { height: 100%; }
body {
	font-family: Arial, Helvetica, sans-serif;
	background: var(--bg);
	color: var(--text);
	line-height: 1.65;
	font-size: 18px;
}

header {
	text-align: center;
}

.title {padding-top:1rem; margin-bottom:0;}
.undertitle {margin-bottom:0rem; padding-bottom: 0rem;}
.crumb {
	color: var(--text);
	margin-top:0rem;
	font-family: 'Courier New', Courier, monospace;
	font-size: 1rem;
}

.indexroom {
	margin-top:10px;
  	width: 100%;
  	max-width: 1000px;
  	margin: 0 auto;
	margin-bottom: 10px;
	position: relative;
	image-rendering: pixelated;
  	image-rendering: -moz-crisp-edges;
	image-rendering: crisp-edges;
}

.indexroom img.background {
  width: 100%;
  display: block;
}

a.link {
  position: absolute;
  font-family: monospace;
  background-color: #134686;
  color: white;
  text-decoration-style: wavy;
}

a.link:hover {background-color: #fff; color:#134686}

img.backgrounddocument {
	width: 100%;
}

.document {
	padding-top:0;
	margin-top:-30px;;
	padding: 3%;
	max-width:700px;
	margin-left: auto;
	margin-right: auto;
}

.document h1 {
	padding-top:0;
	margin-top:0;
}


/* link posities voor index */
.infobalie       	{ bottom: 30%; left: 25%; }
.publicatietafel 	{ top: 90%; left: 43%; }
.nieuwsbord 		{ top: 46%; left: 18%; }
.zithoek     		{ top: 50%; left: 47%; }
.archief			{ top: 65%; left: 60%; }

/* link posities voor nieuwsbord */
.poster 			{top:60%; left: 17%;}
.logboek 			{top:20%; left: 64%;}
.agenda 			{top:58%; left: 58%;}

/* link posities voor infobalie */
.manifesto			{top:53%; left:8%;}

/* link posities voor zithoek */
.krabbelboek		{top: 74%; left:56%;}


a.crumblink {color:var(--text); text-decoration-style: wavy;}
a.crumblink:hover {color:white; background-color:var(--text); text-decoration-style: none;}

footer {
	text-align: center;
	font-size: 0.6rem;
	margin-top:5rem;
	padding: 0.5rem;
}



/* STANDARD STYLESHEET */

/* Headlines */
h1,h2,h3,h4 {
	color: var(--text);
	font-weight: 600;
	line-height: 1.15;
	padding-top: 1rem;
	margin: 1.1rem 0 0.4rem;
}
h1 { font-size: clamp(1.5rem, 5vw, 4rem); font-family: 'Courier New', Courier, monospace;}
h2 { font-size: clamp(1.2rem, 5vw, 3rem);font-family: 'Courier New', Courier, monospace; }
h3 { font-size: clamp(1rem, 5vw, 2rem); font-family: 'Courier New', Courier, monospace;}

.subtitle {
	font-size: 1.5rem;
	margin-bottom: 5rem;
}

/* Leading content */
p { margin: 0 0 1.05rem 0; }

.eyebrow {
	display: block;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	font-size: 0.75rem;
	color: var(--muted-2);
	margin-bottom: 0.6rem;
}


/* Images */
img { max-width: 100%; height: auto; display: block;}

/* Blockquote with permacomputing vibe: bold left rule */
blockquote {
	border-left: 4px solid var(--text);
	padding: 0.6rem 1rem;
	margin: 0 0 1rem 0;
	color: var(--muted);
	background: var(--glass);
}

/* Code and pre: high-contrast, durable for long-term reading */
code, kbd, samp, pre { font-family: Menlo, Monaco, 'Courier New', monospace; }
code {
	background: transparent;
	color: var(--text);
	padding: 0.1rem 0.35rem;
	border-radius: 3px;
	font-size: 0.95em;
}
pre {
	background: transparent;
	color: var(--accent);
	overflow:hidden;
	font-size: 0.92rem;
	line-height: 1;
}

/* Tables */
table {
	width: auto;
	border-collapse: collapse;
	margin: 1rem 0;
}
th, td {
  padding: 0.6rem 0.75rem;
  text-align: left;      /* horizontal */
  vertical-align: top;   /* vertical */
  border: 1px solid white;
  width: 500px;
}
th { font-weight: 600; }

/* Lists */
ul, ol { margin: 0 0 1rem 1.2rem; }

/* Horizontal rule */
hr { border: none; border-top: 1px solid var(--border); margin: 1.8rem 0; }

/* Footer / meta */
.meta { color: var(--muted-2); font-size: 0.9rem; margin-top: 10rem; text-align: center;
}


/* Print-friendly */
@media print {
	body { background: #fff; color: #000; }
	a::after { content: " (" attr(href) ")"; font-size: 0.85em; }
	pre { background: #fff; color: #000; border: 1px solid #000; }
	.no-print { display: none !important; }
}

/* Utility: readable caption */
.caption { font-size: 0.9rem; color: var(--muted-2); margin-top: 0.35rem; }

/* Focus outlines for accessibility */
a:focus, button:focus, input:focus { outline: 2px dashed var(--text); outline-offset: 3px; }