:root{
	--input-standard:16rem;
	--tiny-roundness:0.25rem;
	--edge-roundness:0.5rem;
	--block-roundness:1rem;
	--marg-thickness:0.25rem;
	--padd-thickness:0.25rem;
	--edge-thickness:0.125rem;
	--ridge-thickness:0.25rem;

	--biggest:2.5rem;
	--bigger:2rem;
	--big:1.5rem;
	--large:1.25rem;

	--supernormal:1.2rem;
	--normal:1rem;
	--subnormal:0.8rem;
	
	--button-fg:black;
	--button-bg:linear-gradient(#eee,#aaa);
	--button-fghl:black;
	--button-bghl:linear-gradient(#fff,#ccc);
	--button-edge:#ccc;
	--button-edgehl:#444;
	--input-fg:black;
	--input-bg:linear-gradient(#ccc,#eee);
	--input-fghl:black;
	--input-bghl:linear-gradient(#ddd,#fff);
	--blink:#00f;
	--blink-hover:#ff0;

	--shade:0px 0px 0.5rem black;
	--glow:0px 0px 0.5rem white;
}
/*
@media (aspect-ratio <= 1){:root{font-size:3.625vw;--portrait:0;}}
@media (aspect-ratio > 1){:root{font-size:1.5vw;--landscape:0;}}
*/

iframe{border:none;margin:0;padding:0;}
body{margin:0;padding:0;}
::selection{color:#ff8;background:#44a;}
section{text-align:center;padding:0;margin:0;}
@media screen and (width >= 1024px){section{margin:0 5vw;}}
article{text-align:center;display:block;border-radius:var(--block-roundness);padding:var(--padd-thickness);margin:var(--marg-thickness);}
aside{}

h1,h2,h3,h4,h5,h6{padding:var(--padd-thickness);margin:0;text-align:center;}
h2,h4,h6{text-align:left;}
h1,h2{font-size:var(--biggest);}
h3,h4{font-size:var(--bigger);}
h5,h6{font-size:var(--big);}
p{padding:var(--padd-thickness);margin:var(--marg-thickness);text-align:left;font-size:var(--large);}
a,a:visited{color:var(--blink);}
a:hover,a:visited:hover{color:var(--blink-hover);}

pre,code,same{font-family:mono;}
code{color:#ccc;background:#000;border:var(--edge-thickness) inset var(--input-edge);border-radius:var(--tiny-roundness);padding:0 var(--padd-thickness);}
var{font-style:italic;font-weight:bold;}
em{font-weight:bold;}
strong{text-decoration:underline;text-transform:uppercase;font-weight:bold;}
abbr{text-transform:uppercase;}
ul,ol{margin:0;text-align:left;padding:var(--padd-thickness) var(--large);}
ul{margin:0;text-align:center;list-style-type:none;padding:var(--padd-thickness);}
li{margin:var(--marg-thickness);}
svg,img{border:0;margin:0padding:0;}
canvas{border:var(--edge-thickness) inset var(--button-edge);width:16rem;height:9rem}
figure{
	border:var(--edge-thickness) solid black;
	border-radius:var(--edge-roundness);
	padding:0;margin:var(--marg-thickness);
	text-align:left;
	width:calc(100% - 2 * (var(--edge-thickness) + var(--padd-thickness)  ) );
	background:var(--input-bg);
}
figure img{
	width:100%;
	border-radius:var(--edge-roundness) var(--edge-roundness) 0 0;
}
figcaption{
	padding:var(--padd-thickness);
	margin:var(--marg-thickness);
	text-align:right;
	padding-top:0; margin-top:0;
}
fieldset{border:var(--ridge-thickness) groove var(--button-edge);margin:var(--marg-thickness);padding:var(--padd-thickness);border-radius:var(--block-roundness);}
legend{font-weight:bold;border:var(--ridge-thickness) groove var(--button-edge);border-radius:var(--edge-roundness);padding:var(--paddthickness);margin:var(--marg-thickness);}
details{padding:var(--padd-thickness);margin:var(--padd-thickness);display:block;user-select:none;text-align:left;border-radius:var(--block-roundness);border:var(--edge-thickness) outset var(--button-edge);}
summary{padding:var(--padd-thickness);margin:var(--padd-thickness);text-align:center;color:var(--button-fg);background:var(--button-bg);border:var(--edge-thickness) outset var(--button-edge);border-radius:var(--edge-roundness);cursor:pointer;user-select:none;display:block;}
summary:hover{color:var(--button-fghl);background:var(--button-bghl);}
summary::marker{content:'';}
cite,blockquote,q{font-size:2rem;color:#000;background:#eee;border-right:10px solid #888;border-left:10px solid #888;margin:var(--marg-thickness) 10px;padding:var(--padd-thickness) 10px;display:block;quotes:"\201C""\201D";}
cite:before,blockquote:before,q:before{float:left;color:#000;content:open-quote;font-size:var(--xxlarge);}
cite:after,blockquote:after,q:after{float:right;color:#000;content:close-quote;font-size:var(--xxlarge);}
address{font-style:normal;text-align:left;width:var(--input-standard);font-weight:bold;margin:var(--ridge-thickness);padding:var(--padd-thickness);color:var(--input-fg);background:var(--input-bg);border:var(--edge-thickness) solid var(--input-bg);border-radius:var(--tiny-roundness);display:inline-block;cursor:text;}
q{text-align:center;width:auto;display:block;}
q:before{float:none;}
q:after{float:none;}

table{border-spacing:0;border-collapse:separate;}
tr{margin:0;padding:0;border:none;}
td{margin:0;padding:0;border:none;}
form{margin:0;padding:0;display:inline-block;text-align:center;}

/*all input elements*/
select,meter,progress,textarea,input,output,input[type=text],input[type=password],input[type=search],input[type=tel],input[type=email],input[type=url],input[type=number],
input[type=time],input[type=week],input[type=month],input[type=date],input[type=datetime-local],
input[type=file],input[type=radio],input[type=checkbox],input[type=range],input[type=color],
input[type=button],input[type=submit],input[type=image],input[type=reset],select,button{
display:inline-block;
font-size:var(--normal);width:var(--input-standard);font-weight:bold;margin:var(--marg-thickness);padding:var(--padd-thickness);color:var(--input-fg);background:var(--input-bg);border:var(--edge-thickness) inset var(--button-edge);border-radius:var(--edge-roundness);display:inline-block;cursor:text;}
/*button input elements*/
button,input[type=image],input[type=color],input[type=button],input[type=submit],input[type=reset]{
padding:var(--padd-thickness);margin:var(--marg-thickness) 0.75rem;border-style:outset;color:var(--button-fg);background:var(--button-bg);cursor:pointer;text-align:center;font-size:var(--subnormal);}
/*input element fix ups*/
input[type=image]{margin:var(--marg-thickness);font-size:var(--normal);}
button{}
input[type=date],input[type=datetime-local]{font-size:var(--supernormal);}
input[type=color]{vertical-align:bottom;}
select{margin:var(--marg-thickness) 0.5rem;cursor:pointer;}
input[type=file]{font-size:var(--subnormal);cursor:pointer;}
meter,progress{height:var(--big);vertical-align:top;cursor:default;}
form meter,form progress,form select{display:block;}
textarea{font-weight:normal;vertical-align:top;display:block;}
input[type=range]{-webkit-appearance:none;cursor:pointer;vertical-align:bottom;}
input[type=range]::-webkit-slider-thumb,input[type=range]::-moz-range-thumb{appearance:none;-webkit-appearance:none;background:var(--button-bg);height:var(--large);width:var(--large);border:var(--edge-thickness) outset white;border-radius:var(--tiny-roundness);margin:0;padding:0;}
output{margin:0;}
input[type=checkbox],input[type=radio]{margin:var(--marg-thickness);padding:var(--padd-thickness);cursor:pointer;width:calc(var(--input-standard) + 1rem);margin:var(--marg-thickness) 0;text-align:center;height:var(--bigger);vertical-align:bottom;}

/*input non-button element hover*/
textarea:hover,input:hover,output:hover,input[type=text]:hover,input[type=password]:hover,input[type=search]:hover,
input[type=tel]:hover,input[type=email]:hover,input[type=url]:hover,input[type=number]:hover,
input[type=time]:hover,input[type=week]:hover,input[type=month]:hover,input[type=date]:hover,input[type=datetime-local]:hover,
select:hover,input[type=file]:hover{
color:var(--input-fghl);background:var(--input-bghl);border-color:var(--button-edgehl);}
/*input button element hover*/
input[type=radio]:hover,input[type=checkbox]:hover,
input[type=button]:hover,input[type=submit]:hover,input[type=image]:hover,input[type=reset]:hover,
input[type=color]:hover,button:hover{
color:var(--button-fghl);background:var(--button-bghl);border-color:var(--button-edgehl);}

/*input non-button element focus and active*/
input[type=range]:hover,textarea:active,input:active,output:active,input[type=text]:active,input[type=password]:active,
input[type=search]:active,input[type=tel]:active,input[type=email]:active,input[type=url]:active,
input[type=number]:active,input[type=time]:active,input[type=week]:active,input[type=month]:active,
input[type=date]:active,input[type=datetime-local]:active,select:active,input[type=file]:active
,textarea:focus,input:focus,output:focus,input[type=text]:focus,input[type=password]:focus,input[type=search]:focus,
input[type=tel]:focus,input[type=email]:focus,input[type=url]:focus,input[type=number]:focus,
input[type=time]:focus,input[type=week]:focus,input[type=month]:focus,input[type=date]:focus,input[type=datetime-local]:focus,
select:focus,input[type=file]:focus{
border-color:var(--blink);}
/*input button element active */
input[type=radio]:active,input[type=checkbox]:active,
input[type=button]:active,input[type=submit]:active,input[type=image]:active,input[type=reset]:active,
input[type=color]:active,button:active
,input[type=radio]:focus,input[type=checkbox]:focus,input[type=range]:focus,
input[type=button]:focus,input[type=submit]:focus,input[type=image]:focus,input[type=reset]:focus,
input[type=color]:focus,button:focus{
border-color:var(--blink);}
/*input non-button element disabled*/
textarea:disabled,input:disabled,output:disabled,input[type=text]:disabled,input[type=password]:disabled,
input[type=search]:disabled,input[type=tel]:disabled,input[type=email]:disabled,input[type=url]:disabled,
input[type=number]:disabled,input[type=time]:disabled,input[type=week]:disabled,input[type=month]:disabled,
input[type=date]:disabled,input[type=datetime-local]:disabled,select:disabled,input[type=file]:disabled{
background:var(--input-bg);opacity:0.5;}
/*input button element disabled */
input[type=radio]:disabled,input[type=checkbox]:disabled,input[type=range]:disabled,
input[type=button]:disabled,input[type=submit]:disabled,input[type=image]:disabled,input[type=reset]:disabled,
input[type=color]:disabled,button:disabled{
background:var(--button-bg);opacity:0.5;}

/*helpers*/
.centre{text-align:center;}
.center{text-align:center;}
.left{text-align:left;}
.right{text-align:right;}
.fleft{float:left;}
.fright{float:right;}
.block{display:block;}
.inline{display:inline;}
table.fullscape{position:fixed;left:0;top:0;right:0;bottom:0;margin:0;padding:0;width:100vw;height:100vh;text-align:center;}
