<!DOCTYPE html>
<!-- Copyright 2017-8 Cameron Kaiser. All rights reserved. -->
<!-- If this filename changes, change it in agate.js also. -->
<html>
<head>
<meta charset="utf-8">
<script src="jasper.js"></script>
<style>
<!--

body {
	font-family: monospace;
}

div#prog {
	background: -moz-default-background-color;
	text-align: center;
	width: 90%;
	margin: 0px;
	padding: 5px;
	position: fixed;
	z-index: 1;
	top: 0px;
	left: 0px;
	opacity: 0.8;
}

progress#prog_b {
	width: 90%;
}

div#data {
	display: grid;
	grid-template-columns: 0fr 1fr;
}

div.itype {
	display: flex;
	font-size: 1.5em;
	text-align: center;
	justify-content: center;
	align-items: center;
}
div.itype a { border: 0px; text-decoration: none !important; }

div.ds {
	display: flex;
	text-align: left;
	align-items: center;
}

div.fds {
	border: 1px solid;
	border-radius: 3px;
	padding: 4px;
	margin: 4px;
}
-->
</style>
</head>
<body>
<div id="prog">
<progress id="prog_b" max="100"></progress>
</div>
<h1 id="title"></h1>
<div id="data">
</div>
<pre id="pre">
</pre>
</body>
</html>
