/* shared/button */
a.button.bordered.download
{
 color: #FFFFFF;
 background-image: linear-gradient(to bottom, #50D040, #40A030);
 background-color: #40A030;
 white-space: nowrap;
}
a.button.download:hover:not([disabled]), a.button.download:focus
{
 border-color: #00C600;
 background-image: linear-gradient(to bottom, #50D040, #40A030);
 background-color: #40A030;
}
a.button.download:hover:not([disabled])
{
 box-shadow: 0px 1px 1px #00E000;
}
a.button.download:hover:not([disabled]):active
{
 box-shadow: inset 0px 1px 1px #00E000;
}

a.button.bordered.install
{
 color: #FFFFFF;
 background-image: linear-gradient(to bottom, #4050D0, #3040A0);
 background-color: #3040A0;
 white-space: nowrap;
}
a.button.install:hover:not([disabled]), a.button.install:focus
{
 border-color: #0000C6;
 background-image: linear-gradient(to bottom, #4050D0, #3040A0);
 background-color: #3040A0;
}
a.button.install:hover:not([disabled])
{
 box-shadow: 0px 1px 1px #0000E0;
}
a.button.install:hover:not([disabled]):active
{
 box-shadow: inset 0px 1px 1px #0000E0;
}

@media all and (max-width: 32em)
{
 body > h1 + h3 + div > a.button.bordered.ei + span.clumpBox
 {
  margin-left: 3em;
 }
}

a.button.ei.download span.ii, a.button.ei.install span.ii, span.button.bordered.ei span.ii
{
 /* filter: brightness(0) invert(1); */
 font-size: 200%;
 display: table-cell;
 vertical-align: middle;
}
span.ii.img
{
 filter: unset !important;
}
span.button.bordered.ei.disabled span.ii img
{
 filter: grayscale(1);
}

a.button.ei.download span.action, a.button.ei.install span.action, span.button.bordered.ei span.action
{
 padding-left: 1em;
 display: table-cell;
 white-space: normal;
 vertical-align: middle;
}
a.button.ei.download.addendum span.action, a.button.ei.install.addendum span.action, span.button.bordered.ei.addendum span.action
{
 padding-left: 0;
}
a.button.ei span.action span.fileInfo, span.button.bordered.ei span.action span.fileInfo
{
 display: block;
 text-align: center;
 margin-top: 0.15em;
}

/* shared/fontstyle */
.bold
{
 font-weight: bold;
}
.italic
{
 font-style: italic;
}
.underline
{
 text-decoration: underline;
}
.caps
{
 font-variant: small-caps;
}

/* global/style */
html.loading body
{
 display: none;
}
body
{
 font-family: serif;
 font-size: 125%;
 margin: 8px;
}
@media only screen and (max-width: 336px)
{
 body:not(.outputBox)
 {
  margin-left: 0px;
  margin-right: 0px;
 }
}
h1, h2, h3
{
 font-family: serif;
}
h1 > img
{
 vertical-align: middle;
 margin-right: 0.5em;
 width: 48px;
 height: 48px;
}
a, a:visited
{
 text-decoration: none;
}
a:hover
{
 text-decoration: underline;
}
a[target=_blank]:not([class]):not([id])
{
 background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 12 12"><path fill="gray" d="M6 1h5v5L8.86 3.85 4.7 8 4 7.3l4.15-4.16L6 1ZM2 3h2v1H2v6h6V8h1v2a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1Z"/></svg>');
 background-position: top right;
 background-repeat: no-repeat;
 background-size: 0.7em;
 padding-right: 0.8em;
}
.button, button, input[type="radio"].rbox + label
{
 display: inline-block;
 outline: 0;
 font-family: sans-serif;
 font-size: 80%;
 font-style: normal;
 padding: 0.47em 0.63em;
 margin: 0px 0.5em 0.15em;
 border-radius: 2px;
 border-width: 1px;
 border-style: solid;
 text-indent: 0;
 line-height: 1.23em;
 text-align: inherit;
 white-space: normal;
 cursor: pointer;
 cursor: hand;
 min-height: 1.22em;
 -webkit-user-select: none;
 -moz-user-select: none;
 -ms-user-select: none;
 user-select: none;
}
.button.addendum, button.addendum, input[type="radio"].rbox.addendum + label
{
 margin-left: calc(-0.5em + 1px);
}
span.button, a.button[disabled], button[disabled], input[type="radio"].rbox + label[disabled]
{
 color: #808080;
 cursor: default;
}
a.button[disabled], button[disabled], input[type="radio"].rbox + label[disabled]
{
 color: #808080;
 cursor: not-allowed;
}
a.button, button, input[type="radio"].rbox + label
{
 text-decoration: none;
}
a.button:not(.bordered)
{
 border-color: transparent;
}
.bordered[disabled] > img, button[disabled] > img, .bordered[disabled] > .ii, button[disabled] > .ii
{
 opacity: 0.7;
 filter: grayscale(100%);
}
button::-moz-focus-inner
{
 border: 0;
}
select
{
 border-width: 1px;
 border-style: solid;
}
input[type="radio"].rbox
{
 position: absolute;
 width: 1px;
 height: 1px;
 margin: -1px;
 padding: 0px;
 overflow: hidden;
 border: 0px none;
 clip-path: inset(50%);
 clip: rect(0px, 0px, 0px, 0px);
}
input[type="radio"].rbox + label.value
{
 width: 3em;
 text-align: right;
 text-decoration: line-through;
}
input[type="radio"].rbox + label.custom
{
 width: 8.7em;
 text-align: center;
 text-decoration: line-through;
}
input[type="radio"].rbox:checked + label
{
 font-weight: bold;
 text-decoration: none;
}
.clumpBox
{
 display: inline-block;
 white-space: nowrap;
}
.outputBox .clumpBox label.kv
{
 display: inline-block;
 min-width: 7em;
}
body > p.prodInfo, body > form > p.prodInfo
{
 margin-left: 2em;
}
.indent1
{
 text-indent: 1em;
}
.indent2
{
 text-indent: 2em;
}
.pad2
{
 padding-left: 2em !important;
}
h3 + div
{
 padding-left: 1em !important;
}
.fileInfo
{
 font-size: 90%;
}
.supports
{
 font-style: italic;
 font-size: 70%;
}
.avResult.precircled
{
 font-size: 85%;
}
.avResult.circled
{
 background-color: #FFFFFF;
 font-size: 65%;
 border-radius: 1em;
 display: inline-block;
 width: 1.5em;
 height: 1.5em;
 text-align: center;
}
div.supports
{
 margin-left: 2em;
}
div.donate
{
 display: table;
 text-align: center;
 border: 1px solid;
 padding: 0.5em;
 margin-left: auto;
 margin-right: auto;
/* font-size: 125%; */
 font-family: sans-serif;
 color: #FFFFFF;
 background-color: #000048;
 z-index: 0;
 position: relative;
}
div.donate .progress
{
 display: inline-block;
 vertical-align: top;
 max-width: 20em;
}
div.donate .donors
{
 display: inline-block;
 vertical-align: top;
 text-align: left;
 padding-left: 2em;
}
div.donate .support
{
 display: block;
 margin-top: 1em;
 margin-bottom: 0.5em;
}
div.donate .donors + .support
{
 margin-top: 1.5em;
}
div.donate .donors li
{
 font-family: monospace;
 word-wrap: break-word;
 word-break: break-all;
}
div.donate a
{
 color: #FFFF60;
}
div.donate .fund
{
 margin-top: 1em;
 vertical-align: top;
 font-size: 50%;
 display: inline-block;
}
div.donate progress,
div.donate span.progressBar
{
 margin-left: 1em;
 margin-right: 1em;
 margin-top: 0.5em;
 width: calc(100% - 6em);
}
div.donate span.progressBar
{
 display: inline-block;
 height: 1em;
 border: 1px solid #909090;
 border-radius: 3px;
 background-color: #DDDDDD;
 background-image: linear-gradient(90deg, rgba(0, 0, 0, 0.1), transparent 20%, transparent 80%, rgba(0, 0, 0, 0.1)),
                   linear-gradient(180deg, hsla(0, 0%, 100%, 0.6) 25%, rgba(0, 0, 0, 0.05) 35%, rgba(0, 0, 0, 0.05) 90%, hsla(0, 0%, 100%, 0.2) 95%);
 box-shadow: inset 0 0 2px #FFFFFF,
             0 0 2px #AAAAAA;
 text-align: left;
 overflow: visible;
 white-space: nowrap;
}
div.donate span.progressBar span
{
 display: inline-block;
 height: 100%;
 background-image: linear-gradient(90deg, rgba(0, 0, 0, 0.2), transparent 20%, transparent 80%, rgba(0, 0, 0, 0.2)),
                   linear-gradient(180deg, hsla(0, 0%, 100%, 0.6) 30%, rgba(0, 0, 0, 0.05) 0, rgba(0, 0, 0, 0.05) 90%, hsla(0, 0%, 100%, 0.2) 95%);
 box-shadow: inset 0 0 1px #FFFFFF;
 overflow: visible;
 vertical-align: top;
}
div.donate span.progressBar span.pb_0{width: 0%;}
div.donate span.progressBar span.pb_1{width: 1%;}
div.donate span.progressBar span.pb_2{width: 2%;}
div.donate span.progressBar span.pb_3{width: 3%;}
div.donate span.progressBar span.pb_4{width: 4%;}
div.donate span.progressBar span.pb_5{width: 5%;}
div.donate span.progressBar span.pb_6{width: 6%;}
div.donate span.progressBar span.pb_7{width: 7%;}
div.donate span.progressBar span.pb_8{width: 8%;}
div.donate span.progressBar span.pb_9{width: 9%;}
div.donate span.progressBar span.pb_10{width: 10%;}
div.donate span.progressBar span.pb_11{width: 11%;}
div.donate span.progressBar span.pb_12{width: 12%;}
div.donate span.progressBar span.pb_13{width: 13%;}
div.donate span.progressBar span.pb_14{width: 14%;}
div.donate span.progressBar span.pb_15{width: 15%;}
div.donate span.progressBar span.pb_16{width: 16%;}
div.donate span.progressBar span.pb_17{width: 17%;}
div.donate span.progressBar span.pb_18{width: 18%;}
div.donate span.progressBar span.pb_19{width: 19%;}
div.donate span.progressBar span.pb_20{width: 20%;}
div.donate span.progressBar span.pb_21{width: 21%;}
div.donate span.progressBar span.pb_22{width: 22%;}
div.donate span.progressBar span.pb_23{width: 23%;}
div.donate span.progressBar span.pb_24{width: 24%;}
div.donate span.progressBar span.pb_25{width: 25%;}
div.donate span.progressBar span.pb_26{width: 26%;}
div.donate span.progressBar span.pb_27{width: 27%;}
div.donate span.progressBar span.pb_28{width: 28%;}
div.donate span.progressBar span.pb_29{width: 29%;}
div.donate span.progressBar span.pb_30{width: 30%;}
div.donate span.progressBar span.pb_31{width: 31%;}
div.donate span.progressBar span.pb_32{width: 32%;}
div.donate span.progressBar span.pb_33{width: 33%;}
div.donate span.progressBar span.pb_34{width: 34%;}
div.donate span.progressBar span.pb_35{width: 35%;}
div.donate span.progressBar span.pb_36{width: 36%;}
div.donate span.progressBar span.pb_37{width: 37%;}
div.donate span.progressBar span.pb_38{width: 38%;}
div.donate span.progressBar span.pb_39{width: 39%;}
div.donate span.progressBar span.pb_40{width: 40%;}
div.donate span.progressBar span.pb_41{width: 41%;}
div.donate span.progressBar span.pb_42{width: 42%;}
div.donate span.progressBar span.pb_43{width: 43%;}
div.donate span.progressBar span.pb_44{width: 44%;}
div.donate span.progressBar span.pb_45{width: 45%;}
div.donate span.progressBar span.pb_46{width: 46%;}
div.donate span.progressBar span.pb_47{width: 47%;}
div.donate span.progressBar span.pb_48{width: 48%;}
div.donate span.progressBar span.pb_49{width: 49%;}
div.donate span.progressBar span.pb_50{width: 50%;}
div.donate span.progressBar span.pb_51{width: 51%;}
div.donate span.progressBar span.pb_52{width: 52%;}
div.donate span.progressBar span.pb_53{width: 53%;}
div.donate span.progressBar span.pb_54{width: 54%;}
div.donate span.progressBar span.pb_55{width: 55%;}
div.donate span.progressBar span.pb_56{width: 56%;}
div.donate span.progressBar span.pb_57{width: 57%;}
div.donate span.progressBar span.pb_58{width: 58%;}
div.donate span.progressBar span.pb_59{width: 59%;}
div.donate span.progressBar span.pb_60{width: 60%;}
div.donate span.progressBar span.pb_61{width: 61%;}
div.donate span.progressBar span.pb_62{width: 62%;}
div.donate span.progressBar span.pb_63{width: 63%;}
div.donate span.progressBar span.pb_64{width: 64%;}
div.donate span.progressBar span.pb_65{width: 65%;}
div.donate span.progressBar span.pb_66{width: 66%;}
div.donate span.progressBar span.pb_67{width: 67%;}
div.donate span.progressBar span.pb_68{width: 68%;}
div.donate span.progressBar span.pb_69{width: 69%;}
div.donate span.progressBar span.pb_70{width: 70%;}
div.donate span.progressBar span.pb_71{width: 71%;}
div.donate span.progressBar span.pb_72{width: 72%;}
div.donate span.progressBar span.pb_73{width: 73%;}
div.donate span.progressBar span.pb_74{width: 74%;}
div.donate span.progressBar span.pb_75{width: 75%;}
div.donate span.progressBar span.pb_76{width: 76%;}
div.donate span.progressBar span.pb_77{width: 77%;}
div.donate span.progressBar span.pb_78{width: 78%;}
div.donate span.progressBar span.pb_79{width: 79%;}
div.donate span.progressBar span.pb_80{width: 80%;}
div.donate span.progressBar span.pb_81{width: 81%;}
div.donate span.progressBar span.pb_82{width: 82%;}
div.donate span.progressBar span.pb_83{width: 83%;}
div.donate span.progressBar span.pb_84{width: 84%;}
div.donate span.progressBar span.pb_85{width: 85%;}
div.donate span.progressBar span.pb_86{width: 86%;}
div.donate span.progressBar span.pb_87{width: 87%;}
div.donate span.progressBar span.pb_88{width: 88%;}
div.donate span.progressBar span.pb_89{width: 89%;}
div.donate span.progressBar span.pb_90{width: 90%;}
div.donate span.progressBar span.pb_91{width: 91%;}
div.donate span.progressBar span.pb_92{width: 92%;}
div.donate span.progressBar span.pb_93{width: 93%;}
div.donate span.progressBar span.pb_94{width: 94%;}
div.donate span.progressBar span.pb_95{width: 95%;}
div.donate span.progressBar span.pb_96{width: 96%;}
div.donate span.progressBar span.pb_97{width: 97%;}
div.donate span.progressBar span.pb_98{width: 98%;}
div.donate span.progressBar span.pb_99{width: 99%;}
div.donate span.progressBar span.pb_100{width: 100%;}
div.donate span.progressBar span.required
{
 background-color: #E6DF1B;
}
div.donate span.progressBar span.optional
{
 background-color: #0BD82C;
}
div.donate span.progressBar span.extra
{
 background-color: #DE0000;
 animation: 3.5s linear 0s 1 forwards stretch;
}
@keyframes stretch
{
 0%{width: 0%;}
 86%{width: 0%;} /* 3 / 3.5 */
 100%{}
}
div.donate span.progressBar.overlimit span.extra
{
 animation: 3.5s linear 0s 1 forwards stretch, 300ms linear 3.5s infinite forwards struggle;
}
@keyframes struggle
{
 0%{padding-right: 0px;}
 100%{padding-right: 3px;}
}

div.donate span.progressBar.dual span.required
{
 background-image: linear-gradient(90deg, rgba(0, 0, 0, 0.2), transparent 20%),
                   linear-gradient(180deg, hsla(0, 0%, 100%, 0.6) 30%, rgba(0, 0, 0, 0.05) 0, rgba(0, 0, 0, 0.05) 90%, hsla(0, 0%, 100%, 0.2) 95%);
}
div.donate span.progressBar.dual.blast span.extra::before
{
 content: "\1F4A5";
 position: relative;
 font-size: 400%;
 display: inline-block;
 top: -0.5em;
 left: -0.4em;
 transform-origin: 0.25em center;
 animation: 3.2s linear 0s 1 forwards burst, 33ms linear 3s infinite alternate flicker;
 z-index: -1;
 font-family: 'TossFace', sans-serif !important;
}
@keyframes burst
{
 0%{transform: scale(0);}
 94%{transform: scale(0);} /* 3 / 3.2 */
 100%{transform: scale(1);}
}
@keyframes flicker
{
 0%{opacity: 0.5}
 100%{opacity: 1}
}
div.donate span.progressBar.dual span.optional
{
 background-image: linear-gradient(90deg, transparent 80%, rgba(0, 0, 0, 0.2)),
                   linear-gradient(180deg, hsla(0, 0%, 100%, 0.6) 30%, rgba(0, 0, 0, 0.05) 0, rgba(0, 0, 0, 0.05) 90%, hsla(0, 0%, 100%, 0.2) 95%);
}
div.donate span.progressBar.dual span.extra
{
 background-image: linear-gradient(90deg, transparent 80%, rgba(0, 0, 0, 0.2)),
                   linear-gradient(180deg, hsla(0, 0%, 100%, 0.6) 30%, rgba(0, 0, 0, 0.05) 0, rgba(0, 0, 0, 0.05) 90%, hsla(0, 0%, 100%, 0.2) 95%);
}
div.donate .goal
{
 margin-top: 1em;
 vertical-align: bottom;
 font-size: 50%;
 display: inline-block;
}
div.donate .goal.blast
{
 text-shadow: 1px 1px 2px #000000;
 animation: 800ms ease-out 3s 1 forwards blast;
}
@keyframes blast
{
 0%{transform: rotate(0deg) translate(0, 0) scale(1);}
 15%{transform: rotate(0deg) translate(0, 0) scale(1);}
 100%{transform: rotate(690deg) translate(2em, 3em) scale(1.75); color: #FFCC00;}
}
@media only screen and (max-width: 500px)
{
 div.donate
 {
  margin-left: 0.5em;
  margin-right: 0.5em;
 }
 div.donate progress
 {
  margin-left: 0.5em;
  margin-right: 0.5em;
  width: calc(100% - 5em);
 }
 div.donate .donors ul
 {
  margin-left: -30px;
 }
}
@media only screen and (max-width: 1280px)
{
 div.donate .progress
 {
  display:block;
 }
 div.donate .donors
 {
  display: block;
  margin-top: 2em;
  padding-left: 1em;
 }
 div.donate span.progressBar.dual span.extra
 {
  max-width: 35%;
 }
}
@media only screen and (min-width: 1830px)
{
 h1 + h3 + div + div > .supportList
 {
  max-width: 42em;
 }
 h1 + h3 + div + div + p + hr.small + div.donate
 {
  position: absolute;
  top: 9em;
  right: 1.5em;
 }
 h1 + h3 + div + div + div + p + hr.small + div.donate
 {
  position: absolute;
  top: 4.5em;
  right: 0.5em;
 }
 h1 + h3 + div + div ~ p + hr.small + div.donate + hr.small
 {
  display: none;
 }
}
.needHelp, .notice
{
 font-weight: bold;
}
code.block
{
 display: block;
}
label
{
 white-space: nowrap;
}
.maxW
{
 width: 100%;
}
.alignC
{
 text-align: center;
}
.alignR
{
 text-align: right;
}
form label
{
 font-size: 90%;
}
form input[type="text"], form input[type="password"], form input[type="number"], form textarea
{
 max-width: 100%;
 margin-top: 0.5em;
 margin-bottom: 0.5em;
 border-width: 1px;
 border-style: solid;
}
form input[type="text"], form input[type="password"]
{
 min-width: 9em;
 width: 100%;
 max-width: 20em;
 margin-top: 0.5em;
 margin-bottom: 0.5em;
}
form input[type="number"]
{
 min-width: 5em;
 max-width: 5em;
 margin-top: 0.5em;
 margin-bottom: 0.5em;
}
form textarea
{
 min-width: 12em;
 width: 100%;
 max-width: 23em;
 margin-top: 0.5em;
 margin-bottom: 0.5em;
}
abbr
{
 cursor: help;
}
span.hr
{
 margin-left: 6em;
 margin-right: 6em;
 display: block;
}
hr, span.hr
{
 border: 0;
 height: 2px;
 background-image: linear-gradient(to right, transparent 0%, #8c8b8b 10%, #8c8b8b 90%, transparent 100%);
}
hr.small, span.hr.small
{
 border: 0;
 height: 1px;
 background-image: linear-gradient(to right, transparent 0%, #8c8b8b 25%, #8c8b8b 75%, transparent 100%);
}
img
{
 border: 0;
 image-rendering: crisp-edges;
}
h2 > img
{
 width: 1.333em;
 margin-right: 0.5em;
 vertical-align: top;
}
.bordered > img, button > img
{
 width: 1.25em;
 height: auto;
 margin-right: 1em;
 vertical-align: top;
}
.bordered.addendum > img, button.addendum > img
{
 margin-right: 0;
}
.clumpBox > img.supp, .clumpBox > img.req
{
 vertical-align: text-top;
 width: 16px;
 height: 16px;
}
@keyframes shake
{
 0% {transform: rotate(0deg);}
 15% {transform: rotate(-15deg);}
 20% {transform: rotate(15deg);}
 25% {transform: rotate(-15deg);}
 30% {transform: rotate(15deg);}
 35% {transform: rotate(-15deg);}
 40% {transform: rotate(15deg);}
 45% {transform: rotate(-15deg);}
 50% {transform: rotate(0deg);}
 100%{transform: rotate(0deg);}
}
.bordered:hover:not([disabled]) > img, button:hover:not([disabled]) > img
{
 animation: shake 1s ease-in-out;
}
.ii
{
 display: inline-block;
 transform: rotate(0deg);
 vertical-align: top;
 font-size: 125%;
}
.bordered:hover:not([disabled]) > .ii, button:hover:not([disabled]) > .ii, input.rbox[type="radio"] + label:hover:not([disabled]) > .ii
{
 animation: shake 1s ease-in-out;
}
.bordered.br > img, button.br > img
{
 position: absolute;
 margin: 0;
}
.bordered.br > img + span, button.br > img + span
{
 display: inline-block;
 margin-left: 2.25em;
 text-align: center;
}
.stars
{
 display: inline-block;
 -webkit-user-select: none;
 -moz-user-select: none;
 -ms-user-select: none;
 user-select: none;
 cursor: default;
 color: #FFD700;
}
.halfStar
{
 position: absolute;
 clip-path: inset(0px 0.95ex 0px 0px);
 clip: rect(0px, 0.9ex, 1.5em, 0px);
}
div.fullNoteLB
{
 position: fixed;
 top: 0;
 left: 0;
 bottom: 0;
 right: 0;
 background-color: rgba(0, 0, 0, 0.5);
 text-shadow: none;
}
div.fullNoteLB > div.fullNote
{
 min-width: 40%;
 max-width: 25em;
 max-height: 40%;
 margin-top: 7%;
 margin-left: auto;
 margin-right: auto;
 padding: 3%;
 border: 2px solid #808080;
 color: #000000;
 background-color: #FFFFFF;
 text-align: center;
 font-family: sans-serif;
 font-size: 125%;
 box-shadow: 2px 2px 3px #000000;
 overflow-y: auto;
}
div.fullNoteLB > div.fullNote > div > a
{
 display: inline-block;
 min-width: 8em;
 padding: 0.5em;
 border: 1px solid #000000;
 margin: 0.5em;
 cursor: pointer;
}
div.fullNoteLB > div.fullNote > div > a:hover
{
 text-decoration: none;
 transform: translate(-1px, -1px);
}
div.fullNoteLB > div.fullNote > div > a:focus
{
 outline: 2px solid #000000;
}
div.fullNoteLB > div.fullNote > div > a:active
{
 text-decoration: none;
 transform: translate(1px, 1px);
 outline: 0;
}
div.fullNoteLB > div.fullNote > div > span > a
{
 color: #000060;
}
div.fullNoteLB > div.fullNote > div > label
{
 font-size: 60%;
}
.errBox
{
 font-size: 90%;
 position: fixed;
 top: 1em;
 width: auto;
 right: 1em;
 color: black;
 background-color: red;
 border: 1px dashed yellow;
 padding: 1em 1em 0 1em;
 text-shadow: none;
 animation: hideMe 1.5s ease-in 30s forwards;
 max-width: 42em;
 max-height: 7em;
 overflow-y: auto;
 z-index: 1000;
}
@keyframes hideMe
{
 from {opacity: 1;}
 to {opacity: 0; visibility: hidden;}
}
.errBox + .fatalBox
{
 top: 9.5em;
 max-height: none;
 overflow-y: visible;
}
.errBox h2
{
 margin: 0;
 padding: 0;
 text-align: center;
}
.errBox ul
{
 margin: 0;
 list-style-type: none;
 padding-left: 0.5em;
}
.errTitle
{
 display: inline-block;
 margin-top: 1em;
 font-family: serif;
 font-weight: bold;
 margin-bottom: 0.5em;
}
.errMsg
{
 display: inline-block;
 font-family: monospace;
 border-left: 1px solid yellow;
 padding-left: 0.5em;
}
#footNav
{
 text-align: center;
 white-space: nowrap;
}
#footNav #footNavBox
{
 display: inline-block;
 white-space: normal;
 max-width: calc(100% - 3em);
 vertical-align: middle;
}
#footer
{
 font-style: italic;
 text-align: right;
}
#footer > div
{
 display: inline-block;
 text-align: center;
}
#footer > div > a.button
{
 margin-left: 1em;
 margin-right: 1em;
}
#footer fieldset
{
 display: inline-block;
 float: left;
 max-width: none;
 text-align: center;
}
#footer > hr
{
 display: none;
}
#footer .styleBox
{
 vertical-align: middle;
 cursor: pointer;
 cursor: hand;
 border-width: 1px;
 border-style: solid;
 margin: 0px 0.5em 0.25em;
 width: 1.5em;
 height: 1.5em;
 display: inline-block;
}
#footer .styleBox:hover
{
 border-style: outset;
}
#footer .styleBox.active
{
 border-width: 2px;
 border-style: inset;
}
#footer .styleBox[theme="scenery"]
{
 background-color: #FFEE66;
 background-image: linear-gradient(to top, #001030 0%, #50A0A0 20%, #B0C0A0 30%, rgba(0, 0, 0, 0) 35%, rgba(128, 0, 0, 0) 50%, #8090B0 75%, #FFFFFF 90%, #C0E0F0 100%),
                   linear-gradient(to right, #E08040 0%, #FFD080 50%, #E08040 100%);
}
#footer .styleBox[theme="softblue"]
{
 background-color: #C3C8F5;
 background-image: linear-gradient(to right, #C3C8F5, #FFFFFF);
}
#footer .styleBox[theme="black"]
{
 background-color: #000000;
}
#footer .styleBox[theme="static"]
{
 background-color: #404040;
}
#footer .styleBox[theme="9x"]
{
 background-color: #00787F;
}
#footer .styleBox[theme="white"]
{
 background-color: #FFFFFF;
}
#footer .styleBox[theme="nature"]
{
 background-color: #305030;
}
#footer .styleBox[theme="teahouse"]
{
 background-color: #B2D0C8;
}
#footer .styleBox[theme="teahouse"].t12a
{
 background-color: #425059;
}
#footer .styleBox[theme="teahouse"].t2a
{
 background-color: #1F2B1F;
}
#footer .styleBox[theme="teahouse"].t4a
{
 background-color: #413C42;
}
#footer .styleBox[theme="teahouse"].t6a
{
 background-color: #E2D994;
}
#footer .styleBox[theme="teahouse"].t8a
{
 background-color: #F6F0BC;
}
#footer .styleBox[theme="teahouse"].t10a
{
 background-color: #FDFBDD;
}
#footer .styleBox[theme="teahouse"].t6p
{
 background-color: #F1C074;
}
#footer .styleBox[theme="teahouse"].t8p
{
 background-color: #7D7988;
}
#footer .styleBox[theme="teahouse"].t10p
{
 background-color: #4B493A;
}
#footer .styleBox img
{
 width: 1.5em;
 height: 1.5em;
}
#footer #contact
{
 display: none;
}
@media only screen and (max-width: 1400px)
{
 #footer fieldset
 {
  max-width: 12em;
 }
}
@media only screen and (max-width: 1080px)
{
 #footer
 {
  text-align: center;
 }
 #footer fieldset
 {
  float: none;
  max-width: none;
 }
 #footer .styleBox.begin
 {
  margin-left: 0;
 }
 #footer .styleBox.end
 {
  margin-right: 0;
 }
 #footer > hr
 {
  display: block;
 }
}
@media print
{
 #footNav, #footer
 {
  display: none !important;
 }
}
#teaHeader, #teaFooter, #fadeBox, #shadeBox
{
 display: none;
}


/* global/emoji */
@font-face
{
 font-family: 'TossFace';
 font-style: normal;
 font-weight: 400;
 font-display: swap;
 src: url(/style/fonts/TossFace.otf) format('opentype');
 unicode-range: U+200D, U+21A9, U+2600-27FF, U+FE0F, U+1F170-1FAFF;
}
.ei .ii,
.clumpBox .ej,
.ei.circled
{
 font-family: 'TossFace', sans-serif !important;
}

/* shared/slideshow */
h3 + div
{
 display: table-cell;
 padding-right: 1.5em !important;
 vertical-align: top;
 border-top-right-radius: 0px !important;
}
h3 + div + div
{
 display: table-cell;
 vertical-align: top;
 border-top-right-radius: 0.5em;
}
@media(max-width: 660px)
{
 h3 + div
 {
  display: block;
  border-top-right-radius: 0.5em !important;
  margin-bottom: 1em;
 }
 h3 + div + div
 {
  display: block;
  text-align: center;
  border-top-right-radius: 0px;
 }
}
.slideBox
{
 height: 200px;
 width: 320px;
 display: inline-block;
 text-align: right;
 overflow: hidden;
 font-size: 16px;
}
.slideBox > span
{
 display: none;
}
.imgBox
{
 width: 1600px;
 height: 200px;
 clear: both;
 position: relative;
 transition: left 2s;
 animation: 30s autoslide infinite; 
}
@keyframes autoslide
{
 0% { left: 0%; }
 20% { left: 0%; }
 25% { left: -100%; }
 45% { left: -100%; }
 50% { left: -200%; }
 70% { left: -200%; }
 75% { left: -300%; }
 95% { left: -300%; }
 100% { left: -400%; }
}
.imgBox img
{
 width: 320px;
 height: 200px;
}
.slideImg
{
 float: left;
 margin: 0px;
 padding: 0px;
 position: relative;
}
#ssImg1:target ~ .imgBox
{
 left: 0px;
 animation: none;
}
#ssImg2:target ~ .imgBox
{
 left: -100%;
 animation: none;
}
#ssImg3:target ~ .imgBox
{
 left: -200%;
 animation: none;
}
#ssImg4:target ~ .imgBox
{
 left: -300%;
 animation: none;
}
#cmdImg1
{
 animation: 30s autobutton1 infinite; 
}
@keyframes autobutton1
{
 0% { background-color: #0060DD; }
 20% { background-color: #0060DD; }
 25% { background-color: #222222; }
 95% { background-color: #222222; }
 100% { background-color: #0060DD; }
}
#cmdImg2
{
 animation: 30s autobutton2 infinite; 
}
@keyframes autobutton2
{
 0% { background-color: #222222; }
 20% { background-color: #222222; }
 25% { background-color: #0060DD; }
 45% { background-color: #0060DD; }
 50% { background-color: #222222; }
 100% { background-color: #222222; }
}
#cmdImg3
{
 animation: 30s autobutton3 infinite; 
}
@keyframes autobutton3
{
 0% { background-color: #222222; }
 45% { background-color: #222222; }
 50% { background-color: #0060DD; }
 70% { background-color: #0060DD; }
 75% { background-color: #222222; }
 100% { background-color: #222222; }
}
#cmdImg4
{
 animation: 30s autobutton4 infinite; 
}
@keyframes autobutton4
{
 0% { background-color: #202020; }
 70% { background-color: #202020; }
 75% { background-color: #0060DD; }
 95% { background-color: #0060DD; }
 100% { background-color: #202020; }
}
.slideBox > span:target ~ .cmdBox .cmdSlide
{
 animation: none !important;
}
#ssImg1:target ~ .cmdBox #cmdImg1
{
 background-color: #0060DD;
}
#ssImg2:target ~ .cmdBox #cmdImg2
{
 background-color: #0060DD;
}
#ssImg3:target ~ .cmdBox #cmdImg3
{
 background-color: #0060DD;
}
#ssImg4:target ~ .cmdBox #cmdImg4
{
 background-color: #0060DD;
}
.cmdBox
{
 position: relative;
 top: -20px;
 right: 0px;
 display: inline-block;
 padding: 0px 5px;
 background-color: rgba(255, 255, 255, 0.4);
 border-radius: 6px;
 cursor: default;
}
.cmdSlide
{
 display: inline-block;
 height: 8px;
 width: 8px;
 border-radius: 4px;
 background-color: #000000;
 border: 1px solid #000000;
 outline: none;
}
.cmdSlide:hover, .cmdSlide:focus
{
 background-color: #0080FF !important;
}
.cmdSlideAnim
{
 text-shadow: 2px 0px 0px #000000, -1px -2px 0px #000000, -1px 2px 0px #000000;
 display: inline-block;
 height: 10px;
 width: 10px;
 font-size: 10.5pt;
 text-decoration: none;
 color: #00D000;
 outline: none;
 margin-right: 0.5em;
}
.slideBox > span:target ~ .cmdBox .cmdSlideAnim
{
 color: #007000;
}
.cmdSlideAnim:hover, .cmdSlideAnim:focus
{
 color: #FFFFFF !important;
 text-decoration: none;
}

/* shared/comments */
.commenter
{
 font-weight: bold;
}
.commenterr
{
 font-weight: bold;
 text-decoration: none !important;
}
.commenter::before
{
 border: 1px solid #000000;
 /* background: #A4A4A4 url(//realityripple.com/images/anon.png) top left no-repeat; */
}
.commenterr::before
{
 content: url(//realityripple.com/images/ico.png);
 border-radius: 8px;
}
@media only screen and (min-resolution: 1.1dppx)
{
 .commenterr::before
 {
  content: url(//realityripple.com/images/ico32.png);
  border-radius: 16px;
 }
}
@media only screen and (min-resolution: 2.1dppx)
{
 .commenterr::before
 {
  content: url(//realityripple.com/images/ico48.png);
  border-radius: 24px;
 }
}
.commenter::before, .commenterr::before
{
 width: 16px;
 height: 16px;
 line-height: 0;
 margin-right: 0.5em;
 vertical-align: top;
 box-shadow: 2px 2px 1px;
 display: inline-block;
 /*
  image-rendering: -moz-crisp-edges;
  image-rendering: -o-crisp-edges;
  image-rendering: -webkit-optimize-contrast;
  image-rendering: crisp-edges;
  -ms-interpolation-mode: nearest-neighbor;
 */
}
@media only screen and (min-resolution: 1.1dppx)
{
 .commenter::before, .commenterr::before
 {
  width: 32px;
  height: 32px;
  margin-top: -8px;
  margin-right: 0;
  transform: scale(0.5);
 }
}
@media only screen and (min-resolution: 2.1dppx)
{
 .commenter::before, .commenterr::before
 {
  width: 48px;
  height: 48px;
  margin-top: -16px;
  margin-right: 0;
  transform: scale(0.333);
 }
}
body > .commenter, body > .commenterr, .commentReplyBox > .commenter, .commentReplyBox > .commenterr, .replyReplyBox > .commenter, .replyReplyBox > .commenterr
{
 display: inline-block;
}
body > .commentTime, .commentReplyBox > .commentTime, .replyReplyBox > .commentTime
{
 text-indent: 2.5em;
 display: inline-block;
}
body > .commentReply, .commentReplyBox > .commentReply, .replyReplyBox > .commentReply
{
 margin-bottom: 1.5em;
 padding-left: 0.5em;
}
.commentReply > input[type="radio"]
{
 display:none;
}
.commentReplyForm
{
 display:none;
 margin-left: 1em;
}
.commentFlex
{
 display: flex;
 flex-direction: row;
 max-width: calc(21em + 16px);
 margin-right: 0.5em;
}
.commentFlex label
{
 flex-grow: 1;
 flex-shrink: 1;
 flex-basis: 4.5em;
}
.commentFlex input[type="text"]
{
 flex-grow: 4;
 flex-shrink: 4;
 flex-basis: 16em;
}
.commentFlex textarea
{
 flex-grow: 4;
 flex-shrink: 4;
 flex-basis: calc(16.5em + 16px);
}
.commentReply > input[type="radio"].show:checked + label
{
 display: none;
}
.commentReply > input[type="radio"].show:not(checked) + label
{
 margin-bottom: 1em;
}
.commentReply > input[type="radio"].show:checked ~ .commentReplyForm
{
 display:block; 
}
.commentReply > input[type="radio"].hide:checked + label
{
 display: none;
}
.commentReply > input[type="radio"].hide:checked ~ .commentReplyForm
{
 display:none;
}
p.commentSeeAll
{
 margin-bottom: 0.5em;
 padding-bottom: 1.5em;
 padding-left: 0.5em;
}
a.commentSeeMore
{
 font-size: 60%;
}
a.commentSeeMore span.count
{
 font-weight: bold;
}
.commentTime
{
 font-style: italic;
}
.comment
{
 padding-top: 0.5em;
 padding-left: 1em;
 margin-bottom: 0.5em;
 word-wrap: break-word;
 white-space: pre-wrap;
}
.commentReplyBox
{
 margin-top: 1em;
 margin-left: 1em;
}
.replyReplyBox
{
 margin-left: 1em;
}
.comment + hr.small, .commentReplyBox + hr.small
{
 margin-bottom: 1.5em;
}
form.commentSend label
{
 display: inline-block;
 margin-top: 0.5em;
 vertical-align: top;
 min-width: 4.5em;
}
form.commentSend button
{
 margin-left: 7em;
 margin-top: 1em;
 margin-bottom: 3em;
}
.commentReplyForm form.commentSend button, .replyReplyForm form.commentSend button
{
 margin-bottom: 1em;
}
img.imgPreview
{
 width: 16px;
 height: 16px;
 margin: 0.5em 0 0.5em 0.5em;
}
span.commentCaptcha
{
 border: 1px solid #808080;
 padding: 0.5em;
 margin: 0.5em;
 display: inline-block;
}
.paginate
{
 float: right;
 font-size: 90%;
}