:root {
    --link-color: #000066;
    --link-decoration: underline;
    --main-color: black;
    --background-color: white;
    --half-faded-color: #888888;
    --some-faded-color: #666666;
    --lots-faded-color: #aaaaaa;
    --sn-x: yellow;
    --goodhost: #80ff80;
    --badhost: #ff8080;
}

body { color: var(--main-color); background: var(--background-color) }

.link { color: var(--link-color);
        text-decoration: var(--link-decoration);
        cursor:pointer;
      }

.center { text-align: center; }

.bold { font-weight: bold; }

.halfsize { font-size: 50% }

.twothirdsize { font-size: 67% }

.threeqsize { font-size: 75% }

.emmarginleft { margin-left: 1em }

.emmargintop { margin-top: 1em }

div.hbox { display: flex;
           flex-direction: row;
           min-width: 0;
           min-height: 0;
         }
div.vbox { display: flex;
           flex-direction: column;
           min-width: 0;
           min-height: 0; }

div.borderbox { margin: 1ex; padding: 1ex; border: 2px solid var(--main-color) }

tab.inputlayout { border: none; padding: none; margin: none }
tab.inputlayout tr { padding-top: 0.5ex; padding-bottom: 0.5ex }
tab.inputlayout td { padding-left: 0.5ex; padding-right: 0.5ex }

div.snimg { border: 2px solid var(--main-color);
            padding: 1ex;
            margin: 1ex;
            display: inline-block;
          }

div.snimg p { margin-left: auto; margin-right: auto }
div.snimg div.wrapper { position: relative; display: inline-block; }
div.snimg div.wrapper img { position: absolute; top: 0; left: 0;
                            display: block; width: 100%; height: 100%;
                            image-rendering: pixelated;
                            z-index: 0 }
div.snimg div.wrapper svg { position: absolute; top: 0; left: 0; width: 100%; height: 100%;
                            z-index: 1 } 
div.snimg div.wrapper svg line.sn { stroke: var(--sn-x); fill: none; stroke-width: 0.5px; }
div.snimg div.wrapper svg circle.goodhost { stroke: var(--goodhost); fill: none; stroke-width: 0.5px; }
div.snimg div.wrapper svg circle.badhost { stroke: var(--badhost); fill: none; stroke-width: 0.5px; }