:root[data-theme=theme-dark]{--bg:#202020;--bg-start: #101010;--bg-end: #808080;--fg: white;--hover: rgb(255,200,0);--hover-start: #000050;--hover-end: #0000f0;--help-bg: wheat;--help-fg: black;--help-fontweight: bold;--help-fontsize: normal;--menubutton-fg: white;--menubutton-alert: red;--toolbutton-fg: rgb(202, 192, 230);--toolbutton-alert: red;--gradient: linear-gradient(45deg, var(--bg-start), var(--bg-end));--gradient-hover: linear-gradient(223deg, var(--hover-start), var(--hover-end));--button: linear-gradient(45deg, #95a5db, #02015c);--button-hover: linear-gradient(45deg, #dbda95, #df0d0d);--button-active: linear-gradient(45deg, #021403, #2cb809);--button-disabled: linear-gradient(45deg, #0c0c0c, #202020);--button-text: white;--button-hover-text: black;--gradient-heading: linear-gradient(45deg, #d7e421, #2e0000);--fg-heading: var(--fginv);--strong-color: orange;--svg-color: rgb(0, 204, 255);--dark-color: rgb(116, 75, 0);--faint-color: #9c9b9b;--disabled-color: rgb(85, 82, 82);--outline: 0.1rem solid white;--outline-hover: 0.14rem solid yellow;--outline-active: 0.14rem solid red;--outline-disabled: 0.1rem solid black;--overlay-background: rgba(255, 255, 255, 0.2)}:root[data-theme=theme-light]{--bg:#c0c0c0;--bg-start: #808080;--bg-end: #ffffff;--fg: black;--hover: rgb(104, 83, 7);--hover-start: #000050;--hover-end: #0000f0;--help-bg: wheat;--help-fg: black;--help-fontweight: bold;--help-fontsize: normal;--menubutton-fg: rgb(244, 243, 247);--menubutton-alert: red;--toolbutton-fg: rgb(34, 10, 107);--toolbutton-alert: red;--gradient: linear-gradient(45deg, var(--bg-start), var(--bg-end));--gradient-hover: linear-gradient(223deg, var(--hover-start), var(--hover-end));--button: linear-gradient(45deg, #95a5db, #02015c);--button-hover: linear-gradient(45deg, #dbda95, #df0d0d);--button-active: linear-gradient(45deg, #021403, #2cb809);--button-disabled: linear-gradient(45deg, #5c5c5a, #202020);--button-text: white;--button-hover-text: black;--gradient-heading: linear-gradient(45deg, #1a5aa3, #0a0122);--fg-heading: var(--fginv);--strong-color: rgb(25, 0, 255);--svg-color: rgb(0, 204, 255);--dark-color: rgb(64, 65, 136);--faint-color: #7c6542;--disabled-color: gray;--outline: 0.1rem solid white;--outline-hover: 0.14rem solid yellow;--outline-disabled: 0.1rem solid black;--outline-active: 0.14rem solid red;--overlay-background: rgba(255, 255, 255, 0.2)}body{background:var(--bg);color:var(--fg)}footer{background:var(--gradient-heading);color:var(--fg-heading)}footer a{color:var(--bg)}.black{background-color:#000}.red{background-color:red}.darkred{background-color:darkred}.green{background-color:green}.blue{background-color:blue}.orange{background-color:orange}#menutoggler{background:var(--button);box-shadow:16px 14px 16px #000;box-shadow:var(--shadow)}.menu input{background:var(--gradient)}.menu input[type=button],input[type=submit]{background:var(--button)}form{background:var(--gradient);outline:var(--outline)}form hr{color:var(--line-color)}form button,form input{background:var(--button);color:var(--button-text);outline:var(--outline)}form button:hover,form input:hover{background:var(--button-hover);color:var(--button-hover-text);outline:var(--outline-hover)}form button:disabled,form input:disabled{color:var(--disabled-color-text)}form button:focus,form button:active,form input:active,form input:focus{background:var(--button-hover);color:var(--button-hover-text)}form input[type=url]:-moz-read-only, form input[type=number]:-moz-read-only, form input[type=password]:-moz-read-only, form input[type=email]:-moz-read-only, form input[type=text]:-moz-read-only{background:var(--button-disabled);color:var(--faint-color);outline:var(--outline-disabled)}form input[type=url]:read-only,form input[type=number]:read-only,form input[type=password]:read-only,form input[type=email]:read-only,form input[type=text]:read-only{background:var(--button-disabled);color:var(--faint-color);outline:var(--outline-disabled)}form button[type=submit],form button[type=button],form input[type=button],form input[type=submit]{background:var(--button)}form input[type=password]:focus,form input[type=button]:focus{background:var(--button-hover);outline:var(--outline-hover);color:var(--button-hover-text)}form button[type=submit]:hover,form button[type=button]:hover,form input[type=button]:hover,form input[type=submit]:hover{background:var(--button-hover);color:var(--button-hover-text);outline:var(--outline-hover)}form th{color:var(--strong-color)}.pop input{background:var(--gradient);outline:var(--outline-active)}.pop input:hover{background:var(--gradient-hover);outline:var(--outline-hover)}.pop .error{background:red;color:wheat}.edit input[type=button]:hover{background:var(--button-hover);outline:var(--outline-hover)}.enabled{outline:var(--outline) !important;border-radius:2px}.text a{color:var(--strong-color)}section strong{color:var(--strong-color)}.audio figcaption{color:var(--strong-color)}.spotify figcaption{color:var(--strong-color)}.toolbar .toolitem:hover{outline:var(--outline-hover);background:var(--gradient)}.disable-toolitem{background-color:#333 !important}.image figcaption{color:var(--strong-color)}svg{border-radius:0;border-radius:initial;outline:medium none currentcolor;outline:initial;border:medium none currentcolor;border:initial;width:28px;height:auto}.std-btn{fill:var(--svg-color);stroke:var(--svg-color)}.image-btn,.heading-btn,.audio-btn,.video-btn{fill:var(--strong-color)}.spotify-btn,.save-btn{fill:green}.reset-btn{fill:#ff0}.youtube-btn,.exit-btn{fill:red}.menu-visible{display:flex !important;flex-direction:row;flex-wrap:wrap;margin:0 0 0 2em}.menu-hidden{display:none !important}#topmenu{flex-flow:column;margin-top:1rem}#topmenu div{max-width:60vw;max-width:var(--page-width)}#topmenu button{padding:.5rem 1rem;border-radius:.4rem;cursor:pointer;outline:var(--outline);background:var(--button);color:var(--button-text);border:none;font-size:1rem;max-width:-moz-fit-content;max-width:fit-content;margin:4px}#topmenu button:hover{cursor:pointer;color:var(--button-text-hover);background:var(--button-hover);outline:var(--outline-hover);font-weight:bold}#topmenu button.group-btn{background:#854a02 !important}#topmenu button.page-btn{background:#094e03 !important}#topmenu button.page-btn{background:#04703a}#topmenu .sub{max-width:60vw;max-width:var(--page-width);flex-direction:row;flex-wrap:wrap;margin-left:2rem}#topmenu .submenu{display:flex;flex-direction:row;font-style:italic;margin:4px}#topmenu .theme-switcher .page{margin:4px}select{height:2rem;border-radius:0.8rem;border-radius:var(--border-radius);box-shadow:16px 14px 16px #000;box-shadow:var(--shadow);background-color:var(--bg);color:var(--fg);font-weight:bold}@media screen and (max-width: 480px){#topmenu{margin-top:.4em}#topmenu div{margin-left:.4em}}.outline-btn{position:absolute;width:24px;height:24px;background:var(--bg);border:none;border-radius:50%;cursor:pointer;opacity:0;display:flex;align-items:center;justify-content:center;transition:opacity .5s, transform .15s;padding:4px;outline:2px solid var(--fg)}section:hover .outline-btn{opacity:1}section:hover .outline-btn:hover{opacity:1;transform:scale(1.2);outline:2px solid var(--strong-color)}.up-btn{top:-12px;left:-12px;fill:var(--fg);stroke:var(--fg)}.edit-btn{top:-12px;right:-12px;fill:#025e02 !important}.down-btn{top:auto !important;top:initial !important;bottom:-12px;left:-12px;fill:var(--fg)}.delete-btn{top:auto !important;top:initial !important;bottom:-12px;right:-12px;fill:red}.adder{display:flex;flex-direction:column;align-items:center;outline:var(--outline)}.adder div{width:-webkit-fill-available}.adder span{display:flex;margin-bottom:.3em;flex-direction:column}.adder button{border:none;margin:1em;color:var(--fg);height:2em;display:inline-flex;flex-direction:row;justify-content:start;align-items:center;font-weight:bold;font-size:1.1em;font-size:var(--font-size)}.adder button svg{border-radius:0;border-radius:initial;outline:medium none currentcolor;outline:initial;border:medium none currentcolor;border:initial;width:28px;height:auto;margin-right:2em}.adder button .std-btn{fill:var(--fg);stroke:rgba(0,0,0,0)}.adder button .spotify-btn{fill:green;stroke:rgba(0,0,0,0)}.adder button .cancel-btn,.adder button .youtube-btn{fill:red;stroke:rgba(0,0,0,0)}.adder button:hover{cursor:pointer;background:var(--button-hover);color:var(--fg)}section{display:block;width:inherit;margin:10px;border-radius:0.8rem;border-radius:var(--border-radius);outline:none;min-height:2rem}section .edit{display:flex;flex-direction:column}section .content{width:-webkit-fill-available;padding:.5em;overflow:hidden}section .comment{margin:1em;text-align:center;color:var(--strong-color)}.prewelcome{color:var(--fg);text-align:left}.welcome{color:var(--strong-color);text-align:left}.disabled{outline:var(--outline-disabled);border-radius:2px;pointer-events:none;opacity:.6;cursor:not-allowed;pointer-events:none}.enabled{border-radius:.4em;padding:1em}.content{display:block}@media screen and (max-width: 480px){section{width:auto;width:initial;margin:0px}}.toolbar{display:flex;height:24px;height:var(--tb-button-size);z-index:210;z-index:var(--toolbar-zindex);margin-bottom:.5em;margin-top:.1em;justify-content:space-evenly}.tbgroup{flex-flow:row;outline:var(--outline);margin:-4px 4px 0px 10px;border-radius:6px;padding:4px;height:32px;background:var(--button)}.toolbar button{width:2em !important;box-shadow:4px 6px 5px #000;margin:.1em;background:inherit;border:none;margin:2px;border-radius:4px;height:2em !important}.toolbar button:hover{scale:1.2;box-shadow:16px 14px 16px #000;box-shadow:var(--shadow)}.floating-toolbar{display:inline-flex;position:relative;z-index:1000;align-items:baseline;flex-direction:column;background:var(--bg);padding:.5em;border-radius:0.8rem;border-radius:var(--border-radius);box-shadow:16px 14px 16px #000;box-shadow:var(--shadow);outline:var(--outline);font-weight:bold}.toolbar-btn{background:var(--button);color:var(--button-text);font-weight:bold;height:1.5rem;line-height:1rem;margin:.4rem;border-radius:4px;border:none;box-shadow:16px 14px 16px #000;box-shadow:var(--shadow);width:-moz-max-content;width:max-content;padding-right:1em}.toolbar-btn:hover{background:var(--button-hover);color:var(--button-hover-text);outline:var(--outline-hover)}.btnNone{background:rgba(0,0,0,0);outline:none;border:none;box-shadow:none}.icon{font-size:1.2em;margin-right:.5em;font-weight:bold;color:var(--strong-color)}.help{display:block;outline:var(--outline);background:var(--help-bg);color:var(--help-fg);font-size:var(--help-fontsize);font-weight:var(--help-fontweight);position:fixed;left:.5em;top:20em;width:calc((100vw - 60vw)/2.1);width:calc((100vw - var(--page-width))/2.1)}.helpitem{display:flex;flex-direction:column;justify-content:center;background:var(--bg-end);margin:.2em;padding-top:1em}.helpitem div{display:flex;flex-wrap:wrap;align-items:baseline}.helpitem svg{width:32px;height:auto;align-self:center;background:var(--bg);box-shadow:8px 6px 8px #000;box-shadow:var(--near-shadow);outline:var(--outline);border-radius:4px;margin-bottom:.2em}.helpitem p{display:inline;margin:4px}.pageEditor{display:grid;grid-template-rows:1fr 1fr;grid-template-columns:1fr 1fr 1fr 1fr;justify-content:space-between;height:calc(97vh/1.8);height:calc(var(--bodyheight)/1.8);width:60vw;width:var(--page-width)}.pageContainer{width:calc(60vw/4 - 1rem);width:calc(var(--page-width)/4 - 1rem)}.pageEditor select{width:inherit}.pageContainer button{width:inherit;min-width:0;min-width:initial}.pageContainer button:disabled{background:var(--button-disabled)}.pageClose{min-width:0;min-width:initial;width:calc(60vw/4 - 1rem);width:calc(var(--page-width)/4 - 1rem)}.edit-container{outline:var(--outline-active) !important;border-radius:0.8rem;border-radius:var(--border-radius);padding:1em}.comment{background-color:rgba(0,0,0,0);text-align:center;font-style:italic;font-weight:bold;color:var(--strong-color);border:none}.comment:hover{outline:var(--outline-hover)}.comment:focus{outline:var(--outline-active)}.plusfigure{outline:var(--outline);border-radius:0.8rem;border-radius:var(--border-radius)}.plusfigure:hover{outline:var(--outline-hover)}.plusfigure:active{outline:var(--outline-active)}.plus{font-size:xx-large;font-weight:bolder}.edit{z-index:220;z-index:var(--edit-zindex);position:relative;border-radius:.4em;outline:var(--outline-active) !important}section{position:relative;outline:1px solid var(--outline);padding:20px;margin-bottom:20px;border-radius:6px}.debugger{display:block;width:18vw;height:auto;background:#000;color:green;outline:2px solid red;border-radius:12px;z-index:99999;position:fixed;left:.1vw;top:6vh;font-size:.8em;font-weight:normal;padding:1em}.overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:var(--overlay-background);backdrop-filter:var(--overlay-blur);z-index:200;z-index:var(--overlay-zindex)}.border-img{background:var(--bg);display:block;background-color:#000;outline:var(--outline)}.border-img:hover{display:block;outline:var(--outline-hover)}.heading-wrapper{display:block}h1{background:var(--gradient-heading);color:var(--bg);outline:var(--outline);font-weight:bold;font-size:2em}h2{background:var(--gradient-heading);color:var(--bg);outline:var(--outline);font-weight:bold;font-size:1.5em}h3{background:rgba(0,0,0,0);color:var(--fg);outline:none;font-size:1.1em;padding:.2em !important}h1,h2,h3{border-radius:0.8rem;border-radius:var(--border-radius);box-shadow:16px 14px 16px #000;box-shadow:var(--shadow);text-align:center;padding:.4em}@media screen and (max-width: 480px){h1,h2,h3{font-size:inherit;padding:.2em}}.text-wrapper{display:block}.text-wrapper a{cursor:pointer}.text-wrapper strong{font-weight:bold}.left{grid-area:left;display:block}.left button{display:flex;justify-content:flex-start;align-items:center;height:2em;border:none;color:var(--button-text);font-size:1.2em;background:var(--button);outline:var(--outline);font-size:large;font-weight:bold;margin:.5em;width:-webkit-fill-available}.left button:hover{cursor:pointer;background:var(--button-hover);color:var(--fg)}.left svg{border-radius:0;border-radius:initial;outline:medium none currentcolor;outline:initial;border:medium none currentcolor;border:initial;width:28px;height:auto;margin-right:1em}.image-wrapper{display:flex;flex-flow:wrap;justify-content:center;overflow:hidden !important}.image-wrapper figure{height:auto;display:flex;flex-flow:column;justify-content:center;align-items:center;overflow:auto;padding:1rem}.image-wrapper canvas{width:90%;height:auto;margin:1rem;border-radius:0.8rem;border-radius:var(--border-radius)}.image-wrapper canvas:hover{outline:var(--outline-hover);cursor:pointer}.image-toolbox{background:#222;background:var(--theme-bg, #222);color:#fff;color:var(--theme-fg, #fff);padding:12px;border-radius:8px;box-shadow:0 4px 12px rgba(0,0,0,.4);display:flex;flex-direction:column;gap:8px;font-size:14px}.image-toolbox label{display:flex;flex-direction:column;gap:4px}.image-toolbox button{padding:6px 10px;cursor:pointer;border-radius:4px;border:none;background:#444;color:#fff}.selectedImage{outline:var(--outline-active)}.sliderpop{display:flex;position:absolute}.image-slider{display:block}.image-slider .r{background:red}.image-slider .g{background:green}.image-slider .b{background:blue}.slider-r{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:10px;background:#d3d3d3;border-radius:5px;outline:none}.slider-r::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;background:red;border-radius:50%;cursor:pointer}.slider-rslider::-moz-range-thumb{width:20px;height:20px;background:red;border-radius:50%;cursor:pointer}.slider-g{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:10px;background:#d3d3d3;border-radius:5px;outline:none}.slider-g::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;background:lime;border-radius:50%;cursor:pointer}.slider-gslider::-moz-range-thumb{width:20px;height:20px;background:lime;border-radius:50%;cursor:pointer}.slider-b{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:10px;background:#d3d3d3;border-radius:5px;outline:none}.slider-b::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;background:blue;border-radius:50%;cursor:pointer}.slider-bslider::-moz-range-thumb{width:20px;height:20px;background:blue;border-radius:50%;cursor:pointer}.fullscreen{display:flex;position:fixed;top:0;left:0;width:100vw;height:100vh;background:rgba(0,0,0,.9);align-items:center;justify-content:center;cursor:zoom-out;z-index:9999}@media screen and (max-width: 480px){.image{display:grid;grid-template-columns:100%;flex-flow:wrap;justify-content:center}}audio{width:-moz-available;width:-webkit-fill-available;background:rgba(0,0,0,0);border-radius:0.8rem;border-radius:var(--border-radius)}.audio-wrapper{display:block}.audio-wrapper figcaption{font-style:italic}.audio-toolbox{display:flex;position:relative;z-index:10000;flex-direction:row;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;margin:-0.5em 0em 1em 0em;background:var(--fg);padding:.3em;outline:var(--outline)}.audio-toolbox button{background:var(--button);color:var(--button-text);height:2em;width:-moz-fit-content;width:fit-content;font-weight:bold}.audio-toolbox button:hover{background:var(--button-hover);color:var(--button-hover-text)}.video-wrapper{display:block;justify-content:center;width:-moz-available;max-width:100%;max-height:100%;margin:auto}.video-wrapper figure{margin:0}.video-wrapper figure video{width:-webkit-fill-available;width:-moz-available;width:stretch}.video-wrapper figure figcaption{text-align:center;font-style:italic;color:var(--strong-color);margin-top:1em}@media screen and (max-width: 480px){.video-wrapper{width:80vw}}.spotify-wrapper{display:block;text-align:center;aspect-ratio:16/1}.spotify-wrapper figcaption{margin-top:1em;position:relative}.spotify-wrapper iframe{width:-webkit-fill-available;outline:none;border:none;height:153px}@media screen and (max-width: 480px){.spotify-wrapper figcaption{margin-top:5em}}.youtube-wrapper{display:flex;justify-content:center;text-align:center;flex-direction:column;position:relative;width:100%;margin:0 0 1em 0;aspect-ratio:16/9}.youtube-wrapper iframe{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;border:0}@media screen and (max-width: 480px){.youtube figcaption{margin-top:5em}}.user{display:flex}.user-btn{padding:.5rem 1rem;border-radius:.4rem;background:var(--button);color:var(--button-text);margin:4px;border:none;outline:var(--outline);font-size:1rem;max-width:-moz-fit-content;max-width:fit-content}.user-btn:hover{cursor:pointer;outline:var(--outline-hover);background:var(--button-hover);color:var(--button-hover-text);font-weight:bold}.user-add{background:orange;color:var(--bg);font-weight:bold;outline:var(--outline);margin:4px;height:3em;text-align:left;width:-moz-fit-content;width:fit-content}.user-add:hover{cursor:pointer;background:var(--button-hover)}.login{display:flex}@media screen and (max-width: 480px){.user-btn{max-width:-moz-fit-content;max-width:fit-content;font-size:small;padding:.5em 0 .1em 0em}}.toolbox{display:flex;position:fixed;z-index:10000;flex-direction:row;flex-wrap:wrap;justify-content:flex-start;align-items:flex-start;margin:-0.5em 0em 1em 0em;background:var(--bg);padding:.3em;outline:var(--outline);box-shadow:16px 14px 16px #000;box-shadow:var(--shadow)}.toolbox button{width:38px;height:32px;background:rgba(0,0,0,0);outline:none;border:none;opacity:.8;border-radius:2px;margin:4px}.toolbox button:hover{cursor:pointer;opacity:1;scale:1.4}.toolbox button:disabled{cursor:not-allowed;background:rgba(0,0,0,0);color:var(--disabled-color);opacity:.8;scale:1}.toolbox button:disabled svg{fill:#000 !important;stroke:#000 !important}.toolbox .active{outline:var(--outline-active);scale:1.2;fill:#ff0;stroke:#ff0}.toolbox .active{outline:var(--outline-active);scale:1.2;background:#ff0}.toolbox .active svg{fill:#000 !important;stroke:#000 !important}form{display:flex;flex-direction:column;z-index:500;border-radius:0.8rem;border-radius:var(--border-radius);padding:.7rem;margin-top:0rem;position:fixed;top:50%;left:50%;transform:translate(-50%, -50%);max-width:calc(.6*60vw);max-width:calc(.6*var(--page-width));background:var(--bg);outline:var(--outline);width:-moz-min-content;width:min-content}form .buttons{display:flex;flex-flow:nowrap;justify-content:space-evenly;flex-direction:column}form hr{margin:12px}form .listbox{display:inline}form .listbox select{width:100%}form iframe{width:auto;height:200px}form .content{display:flex;flex-flow:column}form button,form input{font-weight:bold;height:1.5rem;line-height:1rem;margin:4px;border-radius:4px;border:none;box-shadow:16px 14px 16px #000;box-shadow:var(--shadow);width:auto;min-width:20rem;min-width:var(--min-input-width)}form button[type=submit],form button[type=button],form input[type=button],form input[type=submit]{height:2em;border-radius:8px;cursor:pointer}form input[type=password]:focus,form input[type=button]:focus{font-weight:bold}form button[type=submit]:hover,form button[type=button]:hover,form input[type=button]:hover,form input[type=submit]:hover{font-weight:bold}form input[type=checkbox]{height:20px;width:20px}form .inputDiv{display:grid !important;grid-template-columns:40% 60%;grid-gap:.7rem;gap:.7rem;margin:.7rem}form table{display:inline-table;width:56vw}form th{text-align:left;font-weight:bold}form td{font-weight:inherit;font-size:small}.formcontainer{display:flex;justify-content:center;flex-direction:column}.logviewer{display:flex;flex-direction:column;position:fixed;left:50%;min-width:60vw !important;min-width:var(--page-width) !important}.logviewer table{width:100%;border-collapse:collapse;border:1px solid var(--color-gray)}.logviewer th,.logviewer td{padding:.5rem;text-align:left;border-bottom:1px solid var(--color-gray)}.logviewer .timestamp{width:20%}.logviewer .type{width:10%}.logviewer .message{width:70%}.logitem{display:flex;justify-content:space-between;align-items:center;padding:.5rem 1rem;background-color:var(--color-primary);color:var(--color-white)}.btn-clear-log{background-color:var(--color-danger);font-size:1.2rem;font-weight:bold}.btn-exit-log{background-color:var(--color-gray);padding:1rem;max-height:400px;overflow-y:auto}.btn-logviewer{display:flex;justify-content:center;align-items:center;height:2em;border:none;color:var(--button-text);font-size:1.2em;background:var(--button);outline:var(--outline)}.btn-logviewer:hover{cursor:pointer;background:var(--button-hover);color:var(--fg)}:root{--font-size: 1.1em;--font-family: Verdana, Geneva, Tahoma, sans-serif;--bodyheight: 97vh;--headerheight: 6vh;--min-input-width: 20rem;--max-input-width: 40rem;--page-width: 60vw;--border-radius: 0.8rem;--tb-button-size: 24px;--shadow: 16px 14px 16px #000;--near-shadow: 8px 6px 8px #000;--edit-zindex: 220;--toolbar-zindex: 210;--overlay-zindex: 200}*{transition:background .3s ease, color .3s ease;border-radius:0.8rem;border-radius:var(--border-radius)}body{font-size:1.1em;font-size:var(--font-size);font-family:Verdana, Geneva, Tahoma, sans-serif;font-family:var(--font-family);display:grid;height:97vh;height:var(--bodyheight);grid-template-columns:1.1fr 4fr 1fr;grid-template-rows:2fr 30fr 1fr;grid-template-areas:"header header header" "left page right" "footer footer footer";grid-gap:10px;gap:10px;padding:10px}figcaption{text-align:center;font-style:italic;color:var(--strong-color)}.hidden{display:none !important}.data{display:none}.shadow{box-shadow:16px 14px 16px #000;box-shadow:var(--shadow)}.right{grid-area:right;display:flex;flex-direction:column;justify-content:flex-start}.mid{width:60vw;width:var(--page-width);position:absolute;left:calc((100vw - 60vw)/2);left:calc((100vw - var(--page-width))/2);top:0vh}nav{grid-area:header;height:6vh;height:var(--headerheight);display:flex;justify-content:space-between}main{display:flex;flex-flow:column;margin-top:1em}footer{font-size:small;font-style:italic;display:flex;position:fixed;justify-content:space-between;align-items:center;border-radius:8px;width:inherit;bottom:8px;box-shadow:16px 14px 16px #000;box-shadow:var(--shadow);padding-left:4px;padding-right:4px;color:var(--bg);font-weight:bold}.version{color:var(--fg)}.sitename{color:var(--bg)}a{color:var(--button-text)}.listbox{display:flex;flex-direction:column;gap:.5rem}@keyframes fadeInOut{0%{opacity:0}20%{opacity:1}80%{opacity:1}100%{opacity:0}}.selector{display:flex;flex-direction:column;padding:.5em;z-index:1000;background:var(--button);color:var(--bg);font-size:1.1em;font-size:var(--font-size);height:auto}.theme-switcher{padding:.5rem 1rem;border-radius:.4rem;cursor:pointer;background:var(--button);color:var(--button-text);border:none;font-size:1rem}.theme-switcher:hover{background:var(--button-hover);color:var(--button-hover-text)}#hamburger{border-radius:4px;font-size:xx-large;cursor:pointer;height:36px;text-align:center;width:40px;margin-left:8px;margin-top:1rem;background-color:var(--dark-color);line-height:1em}#sitetitle{font-weight:bold;align-content:center;font-size:xx-large}#sitelogo{margin-right:8px;margin-top:8px}.logo{width:64px !important;height:64px !important}.theme{display:flex;background:rgba(0,0,0,0);flex-direction:column;align-items:center}.theme-selectors{display:flex;background:rgba(0,0,0,0);flex-direction:row}.theme-red{background:linear-gradient(45deg, rgb(255, 81, 28), rgb(255, 0, 0)) !important;border-radius:50%;width:24px;height:24px;border-radius:50%;margin-top:1em}.theme-dark{background:linear-gradient(45deg, rgb(126, 126, 126), black) !important;border-radius:50%;width:24px;height:24px;border-radius:50%;margin-top:1em}.theme-light{background:linear-gradient(45deg, rgb(92, 91, 91), rgb(214, 213, 213)) !important;border-radius:50%;width:24px;height:24px;border-radius:50%;margin-top:1em}.theme-blue{background:linear-gradient(45deg, rgb(114, 234, 250), rgb(8, 2, 88)) !important;border-radius:50%;width:24px;height:24px;border-radius:50%;margin-top:1em}.theme-green{background:linear-gradient(45deg, rgb(111, 230, 81), rgb(6, 41, 1)) !important;border-radius:50%;width:24px;height:24px;border-radius:50%;margin-top:1em}.theme-orange{background:linear-gradient(45deg, rgb(247, 162, 66), rgb(92, 49, 0)) !important;border-radius:50%;width:24px;height:24px;border-radius:50%;margin-top:1em}.theme-container{height:2em;width:80%;display:flex;justify-content:space-around;margin-left:10%;margin-bottom:2%;background:rgba(0,0,0,0)}.theme-item{width:1.5em;margin-left:.5em;border-radius:8px;box-shadow:16px 14px 16px #000;box-shadow:var(--shadow);height:1.5em;border-radius:50%;margin-top:.2em}.viewport{overflow:hidden;width:100%}.pages{display:flex;transition:transform 300ms ease}.page{flex:0 0 100%;display:grid;justify-content:start}.pop{font-weight:bold;margin:20px;border-radius:8px;top:50%;left:50%;position:fixed;box-shadow:16px 14px 16px #000;box-shadow:var(--shadow);transform:translate(-50%, -50%);z-index:600;display:flex;flex-direction:column}.pop div{display:flow-root;text-align:center}.pop input{color:var(--fg);font-weight:bold;height:1.5rem;width:-moz-max-content;width:max-content;line-height:1rem;margin:4px;border-radius:4px;border:none;box-shadow:16px 14px 16px #000;box-shadow:var(--shadow);min-width:20rem;min-width:var(--min-input-width);max-width:40rem;max-width:var(--max-input-width)}.pop .message{position:relative}.pop .error{background:red;color:wheat;position:relative}.userEditor{display:flex;z-index:10;position:fixed;left:20vw;top:2vh;padding:10px;border-radius:0.8rem;border-radius:var(--border-radius);width:25rem;gap:1rem 1rem;flex-direction:column}.userEditor select{height:2rem;border-radius:0.8rem;border-radius:var(--border-radius);box-shadow:16px 14px 16px #000;box-shadow:var(--shadow)}.userEditor div{display:flex;flex-flow:column;gap:1rem 1rem}.userEditor input[type=checkbox]{outline:none;background:rgba(0,0,0,0);color:rgba(0,0,0,0);box-shadow:none}@media screen and (max-width: 480px){body{font-size:.8em;gap:7px;padding:0px;height:96vh;grid-template-columns:0fr 1fr 0fr}main{width:90vw;margin-left:6px}.mid{left:0;width:auto;width:initial}#sitetitle{font-size:medium}footer{font-size:.5em;width:88%;margin-left:2%}#menutoggler{height:28px;width:28px;line-height:28px;margin-top:4px}#sitelogo{width:14vw;margin-top:2px;margin-right:5px}form{margin-left:5% !important;width:80%;max-height:none !important;max-height:initial !important}#login{display:none}.logo{width:42px !important;height:42px !important}.theme-dark,.theme-light,.theme-blue,.theme-green,.theme-orange,.theme-red{width:10px;height:10px;margin-top:1em;margin-left:.5em}}@media screen and (max-width: 480px){#sitetitle{font-size:large;margin-top:.7em}.logo{width:32px !important;height:32px !important;margin-top:.7em}#sitelogo{margin-right:0px}#hamburger{font-size:x-large;height:28px;width:32px}footer{font-size:.6em}main{margin-top:3em}.theme-switcher{margin-left:.3em}.right{align-items:flex-end;z-index:210;z-index:var(--toolbar-zindex)}}
