:root {
	--litetext:    hsl(55,5%,50%);  /* lite text */
	--litertext:   hsl(55,5%,60%);  /* liter text */
	--background2: hsl(55,5%,75%);  /* background dots svg */
	--background:  hsl(55,5%,80%);  /* page background */
	--lbtnlit:     hsl(55,5%,86%);  /* menu lit level btn */
	--foreground:  hsl(55,5%,94%);  /* box background "foreground" */

	--ctext:       hsl(30,60%,45%);  /* text link */
	--btntext:     hsl(30,45%,50%);  /* button text */
	--hilite:      hsl(30,90%,63%);  /* highlight link,btn,icon */
	--inputborder: hsl(30,90%,75%);  /* input border */
	--pale:        hsl(30,100%,96%);  /* pale hilite */
}

body {background-color:var(--background); color:black;}
.wallpaper {position:fixed; top:0px; left:0px; bottom:0px; right:0px; z-index:-1;
	background-image:url(bg_halftone.svg); background-attachment:scroll; background-repeat:repeat-x; background-size:auto 900px;}
.wallpaper div {position:absolute; background-color:var(--background2); top:899px; bottom:0px; left:0px; right:0px;}
.font, #content, .text, .menulabel, .menu, .mbtn {font-family:'Fira Sans'; font-weight:300;}
b, .mbtn {font-weight:500;}
h1, h2, h3, .smbtn {font-family:'Fira Sans'; font-weight:900; font-width:75%; font-style:italic; line-height:100%; margin:0px;}
h1, h2 {text-align:center}
#content  {line-height:130%;}
.subtitle {line-height:130%; text-align:center; margin:18px 0px -8px; font-style:italic;}
.defn     {line-height:130%; text-align:center; margin-bottom:40px;}
.subhead {font-size:120%; padding-top:4px;}
.pct {font-size:13px; vertical-align:5px; line-height:1px;}
sub {line-height:1px}

.link, .darktext {color:var(--ctext)}
.litelink, .litetext {color:var(--litetext)}
.footlink, .foot {color:white}
.link:hover, .litelink:hover, .footlink:hover, .btn:hover {color:var(--hilite)}
.link:hover, .litelink:hover, .footlink:hover {border-radius:6px; padding:2px 4px; margin:-2px -4px;}
.link:hover, .litelink:hover {background-color:white}
.footlink:hover {background-color:var(--foreground)}
.link, .litelink, .footlink {cursor:pointer}
.dim {opacity:0.4}
.icon       {filter:drop-shadow(0px 0px 4px var(--background));}
.icon:hover {filter:none}
.icon:hover .iconhover {fill:var(--hilite); stroke:var(--hilite);}

.block {background-color:var(--foreground); border:5px solid var(--foreground); box-shadow:inset 0px 0px 0px 3px white;}
.sign  {background-color:white; border:5px solid white; box-shadow:inset 0px 0px 0px 3px var(--foreground); border-radius:24px/50%;}
.cell  {background-color:white; text-align:left;}
.tquest {background-color:white; padding:10px 12px 10px 16px; min-height:52px;}
.btn {background-color:white; color:var(--btntext); text-align:center; cursor:pointer;}
.mbtn {padding:4px 12px 0px; margin:2px 2px;}

.dbtn, .smbtn, .mbtn {background-color:var(--btntext); color:white;}
.dbtn:hover, .smbtn:hover, .mbtn:hover {background-color:var(--hilite)}
.qhi, .qkey {color:var(--btntext); background-color:white;}
.qhi:hover  {color:var(--hilite)}
.hhi        {background-color:var(--btntext); color:white;}
.hhi:hover  {background-color:var(--hilite)}
.qlit       {color:white; background-color:var(--btntext);}
.qdim       {color:var(--litertext); background-color:white;}

.ra {background-image:url(face_s_angry_r.svg)}
.ya {background-image:url(face_s_angry_y.svg)}
.ga {background-image:url(face_s_angry_g.svg)}
.rh {background-image:url(face_s_happy_r.svg)}
.yh {background-image:url(face_s_happy_y.svg)}
.gh {background-image:url(face_s_happy_g.svg)}

/* below may be superseded by stylemini_a1.css */

.block, .cell, .art {border-radius:18px}
.btn, .dbtn, .smbtn, .qbtn, .tquest, .a, .b, .alert, #alert, .mbtn {border-radius:12px}
.hbtn {border-radius:0px 12px 12px 0px}
.text, .menulabel, .menu, .checkbox {border-radius:9px}
h1 {font-size:60px}
h2 {font-size:39px}
h3 {font-size:30px}
.defn {font-size:26px}
#content, .normal, .font, .mbtn {font-size:21px; line-height:140%;}
.reg, .foot {font-size:17px; line-height:140%;}
.subtitle {font-size:16px}
.text, .menulabel, .menu {font-size:24px; line-height:28px; padding:2px 4px 2px 10px; margin:2px 0px; height:36px; border-width:2px;}
.checkbox {vertical-align:-10px; height:36px; width:36px; border:2px var(--inputborder) solid;}
.radio    {vertical-align:-10px; height:38px; width:38px; border:2px var(--inputborder) solid; margin:-1px;}
.label {padding-top:5px}
.mbtn {height:36px}
.btn, .dbtn {height:56px; padding:9px 16px 0px;}
.qbtn {height:56px; padding-top:9px;}
.hbtn {height:56px; width:74px; padding:9px 18px 0px 0px;}
.fbtn {right:56px}
.smbtn {font-size:28px; height:40px; padding:6px 20px 0px;}
.qspace {height:68px}
#alert, .alert {padding:5px 10px;}
p {margin:20px 0px 0px 0px}
.reg p {margin:14px 0px 0px 0px}
.gapsign, .gapsignart {margin-top:100px !important}
.gapblock {margin-top:76px}
