* {box-sizing:border-box; -webkit-text-size-adjust:none; -webkit-tap-highlight-color:transparent;}
body {margin:0px 10px; font-family:Nunito;
	background-attachment:fixed; background-size:cover; background-position:top center;
	background-color: hsl(342,100%,27%);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%' height='100%' viewBox='0 -8 1600 1080'%3E%3Cg stroke='none' %3E%3Ccircle cx='800' cy='416' r='829' fill='hsl(345.3,93%,31%)' /%3E%3Ccircle cx='800' cy='384' r='732' fill='hsl(348.5,88%,34%)' /%3E%3Ccircle cx='800' cy='352' r='635' fill='hsl(351.8,84%,38%)' /%3E%3Ccircle cx='800' cy='320' r='538' fill='hsl(355,81%,41%)' /%3E%3Ccircle cx='800' cy='288' r='441' fill='hsl(358.3,78%,45%)' /%3E%3Ccircle cx='800' cy='256' r='344' fill='hsl(1.5,75%,49%)' /%3E%3Ccircle cx='800' cy='224' r='247' fill='hsl(4.8,80%,52%)' /%3E%3Ccircle cx='800' cy='192' r='150' fill='hsl(8,91%, 56%)' /%3E%3C/g%3E%3C/svg%3E");
/*
	background-color: hwb(342 0% 46%);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%' height='100%' viewBox='0 -8 1600 1080'%3E%3Cg stroke='none' %3E%3Ccircle cx='800' cy='416' r='829' fill='hwb(345.3 2% 40.8%)' /%3E%3Ccircle cx='800' cy='384' r='732' fill='hwb(348.5 4% 35.5%)' /%3E%3Ccircle cx='800' cy='352' r='635' fill='hwb(351.8 6% 30.3%)' /%3E%3Ccircle cx='800' cy='320' r='538' fill='hwb(355 8% 25%)' /%3E%3Ccircle cx='800' cy='288' r='441' fill='hwb(358.3 10% 19.8%)' /%3E%3Ccircle cx='800' cy='256' r='344' fill='hwb(1.5 12% 14.5%)' /%3E%3Ccircle cx='800' cy='224' r='247' fill='hwb(4.8 14% 9.3%)' /%3E%3Ccircle cx='800' cy='192' r='150' fill='hwb(8 16% 4%)' /%3E%3C/g%3E%3C/svg%3E");
*/
}
.selectable {-webkit-user-select:text; -moz-user-select:text; -ms-user-select:text; user-select:text; cursor:auto;}
body, #content {-webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none; cursor:default;}
#content  {width:672px; margin:0px auto; position:relative;}
.ptitle, .ltitle {font-family:'Oleo Script'; color:white; position:absolute;}
h1        {font-family:'Oleo Script'; margin:0px;}
#foot     {opacity:0.8}
#foot a       {color:hsl(8,100%,70%); text-decoration:none; cursor:pointer;}
#foot a:hover {color:hsl(8,100%,70%); text-decoration:underline;}
a, .link  {color:hsl(336,100%,34%); text-decoration:none; cursor:pointer;}
a:hover, .link:hover {text-decoration:underline;}
.litetext       {color:hsl(336,100%,70%)}
.litelink       {color:hsl(336,100%,70%); cursor:pointer;}
.litelink:hover {color:hsl(336,100%,60%); text-decoration:underline;}
.dim {opacity:0.4}
.hi:hover, .lit {background-color:hsl(10,100%,94%)}
b {font-weight:700}

.text, .menulabel, .menu {font-family:Nunito; outline:none; border:2px hsl(336,100%,80%) solid; background-color:white; color:black; resize:none; box-sizing:border-box;}
textarea {display:block}
.widgetspace {display:inline-block; margin:2px 0px; white-space:nowrap; cursor:default;}
.checkbox {display:inline-block; border:2px hsl(336,100%,80%) solid; background-color:white; border-radius:12px; margin-right:3px;}
.radio    {display:inline-block; border:2px hsl(336,100%,80%) solid; background-color:white; border-radius:99px; margin:-1px 2px -1px -1px;}
.checkbox polyline {stroke:hsl(336,80%,34%); fill:none; stroke-width:6px; stroke-linecap:round; stroke-linejoin:round;}
.radio circle      {stroke:none; fill:hsl(336,80%,34%);}
.menulabel {position:absolute; top:0px; left:0px; width:100%;}
.menu {opacity:0}
.menuspace {position:relative; display:inline-block; vertical-align:1px;}
.menuwidget {position:absolute; right:0px; top:0px; height:100%; fill:hsl(336,80%,34%); stroke:hsl(336,80%,34%); stroke-width:2px; stroke-linejoin:round;}
#alert, .alert {background-color:hsl(60,100%,82%); text-align:center; cursor:default;}

.icon {position:absolute; top:4px; cursor:pointer;}
.icon:hover .iconglow {opacity:0.35}
.iconglow {opacity:0}
.scrollfoot  {text-align:center; padding:40px 0px 4px;}
.fixfoot     {position:fixed; bottom:4px; left:0px; right:0px; z-index:-1;}
.fixfoot div {width:644px; margin:0px auto; text-align:center;}

.block {padding:20px 36px; border-radius:18px; position:relative; color:black; background-color:white; box-shadow:0px 0px 0px 8px hsl(8,100%,70%,0.35);}
.qbtn, .qbtnlit, .qbtndim, .qbtnunlit {margin:8px 0px; position:relative; font-weight:600;}
.qbtn, .qbtnlit, .qbtnunlit, .halo {box-shadow:0px 0px 0px 8px hsl(10,100%,94%)}
.btn:hover, .mbtn:hover, .qbtn:hover, .qbtnlit {background-color:hsl(340,100%,44%) !important; text-decoration:none;}
.btn, .btndim, .mbtn, .qbtn, .qbtnlit, .qbtndim, .qbtnunlit {background-color:hsl(336,80%,34%); color:white; cursor:pointer;}
.qbtndim, .btndim {color:hsl(0,0%,100%,0.5) !important}
.btn, .btndim, .mbtn {text-align:center; text-decoration:none; font-weight:700;}
.btn, .btndim {display:block;}
.mbtn {padding:5px 12px 7px; margin:2px 2px; display:inline-block; white-space:nowrap;}
.btngap {margin-left:6px}
.btnwrap {padding:8px; margin:0px auto; background-color:hsl(8,100%,70%,0.35)}

.qcircle, .qsquare {position:absolute; background-color:hsl(336,70%,43%);}
.qsquare {left:11px; top:11px; width:26px; height:26px; border-radius:7px;}
.qcircle {left:11px; top:11px; width:26px; height:26px; border-radius:99px;}
.qbtn:hover .qcircle, .qbtn:hover .qsquare, .qbtnlit .qcircle, .qbtnlit .qsquare {background-color:hsl(10,100%,94%)}

/* these over superseded by stylemini.css */
#contentsize {padding-top:74px}
.ptitle, .ltitle {font-size:40px; line-height:49px; top:10px; left:80px;}
.ttitle {position:absolute; top:18px; left:36px;}
h1 {font-size:30px; line-height:34px; margin:0px 0px 11px;}
#content, .normal {font-weight:250; font-size:22px; line-height:30px;}
.btn, .btndim, .mbtn, .qbtn, .qbtnlit, .qbtndim, .qbtnunlit, .mbtn {border-radius:12px;}
.btnwrap {border-radius:20px}
.qbtn, .qbtnlit, .qbtndim, .qbtnunlit {font-size:22px; line-height:24px; padding:12px 12px 12px 52px;}
.btn, .btndim, .mbtn {font-size:24px; line-height:24px;}
.btn, .btndim {padding:10px 14px 12px;}
.mbtn {height:36px}
.small, #foot {font-weight:300; font-size:19px; line-height:26px; letter-spacing:-0.3px;}
.text, .menulabel, .menu {font-size:22px; line-height:28px; border-radius:12px; border-width:2px; padding:2px 4px 2px 10px; margin:2px 0px; height:36px;}
.checkbox {border-width:2px; vertical-align:-8px; height:36px; width:36px; border-radius:12px; margin-right:4px;}
.radio    {border-width:2px; vertical-align:-8px; height:38px; width:38px; margin:-1px 3px -1px 1px;}
.label {padding-top:5px}
#alert, .alert {border-radius:12px; padding:3px 10px 7px;}
p {margin:20px 0px 0px 0px}
.small p {margin:14px 0px 0px 0px}

.hide   {display:none !important}
.show   {visibility:visible}
.spacer {visibility:hidden}
/* set class to accordion (no rule, just indicator) or accordionclosed; do not set accordiontrans */
.accordiontrans  {overflow:hidden; transition:height .2s ease;}
.accordionclosed  {overflow:hidden; height:0px; display:none;}
.right {text-align:right !important}
.center {text-align:center}
.justify {text-align:justify}
.middle {vertical-align:middle}
table {border-spacing:0px; border-collapse:separate; vertical-align:top;}
tbody {vertical-align:inherit; border:inherit;}
tr {vertical-align:inherit; padding:0px; border:inherit;}
td {background-color:inherit; padding:inherit; vertical-align:inherit;}
.wrap {white-space:normal !important}
.nowrap {white-space:nowrap}
.rel {position:relative}
sub {line-height:10px}

/* Diagnostic */
.log {position:fixed; background-color:black; white-space:pre; overflow:auto; word-wrap:normal; word-break:normal; cursor:text; -webkit-overflow-scrolling:touch;}
.log, .log h1, .log h2, .log h3 {font-family:Arial; font-size:11px; line-height:13px; -webkit-user-select:text; -moz-user-select:text; -ms-user-select:text; user-select:text;}
.log h1, .log h2, .log h3 {display:inline; font-weight:normal; margin:0px;}
#serverlog {left:0px; bottom:0px; width:75%; height:50%; padding:10px 20px; color:#999999;}
#clientlog {right:0px; bottom:0px; width:25%; height:50%; padding:10px; color:white;}
.log h1 {color:white}
.log h2, .log a {color:hsl(60,100%,50%)}
.log h3 {color:#999999}
.log p {margin:6px 0px 0px 0px}
.log::selection {background-color:hsl(210,100%,40%)}
