/* I2P Theme: Camo aka Dark */
/* Description: Military Grade. */
/* Comment: Thanks to Florian Kuhlmann for the hatface images. [http://www.flickr.com/photos/floriankuhlmann/] */
/* Author: dr|z3d */

body {
     margin: 5px 0 0 0;
     padding: 0;
     text-align: center;
     background: #010 url(images/camotile.png) top left scroll;
     color: #ee9;
     font: 8.5pt/130% "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", "DejaVu Sans", Verdana, "Lucida Grande", Helvetica, sans-serif;
}

@supports (text-justify: auto) { /* Firefox 55+ */
body {
     background-attachment: fixed;
}
}

.hide, .hideme {
     display: none;
}

::selection {
     background: rgba(0,187,0,0.99) !important;
     color: #000;
     text-shadow: none;
}

::-moz-selection {
     background: #0b0 !important;
     color: #000;
     text-shadow: none;
}

.routersummary img[src$="i2plogo.png"], .routersummary h3, .confignav, *::before, *::after {
     -moz-user-select: none;
     -webkit-user-select: none;
     user-select: none;
}

div.clearer {
     clear: left;
     height: 0;
     line-height: 0;
     margin-bottom: -16px;
}

img {
     border: none;
}

a img:hover, a:focus img {
     filter: drop-shadow(0 0 1px #f60);
}

img[src="/flags.jsp?c=a1"], img[src="/flags.jsp?c=a2"] { /* more visibility for anonymous flags */
     border: 1px solid #141;
     width: 13px !important;
     height: 9px !important;
     padding-right: 0;
     margin-left: 1px;
     margin-right: 1px;
}

#profiles img[src="/flags.jsp?c=a1"], #profiles img[src="/flags.jsp?c=a1"] {
     height: 10px !important;
     margin-right: 1px;
}

pre {
     width: 98%;
     overflow-x: auto;
     text-align: left;
     font: 8.5pt "Droid Sans Mono", "Noto Mono", "Lucida Console", "DejaVu Sans Mono", monospace;
     color: #ee9;
}

/* proxy errors */

div.logo { /* proxy error "fake" sidebar */
     float: left;
     padding: 10px;
     text-align: center;
     color: #ee9;
     margin: -1px 20px 0;
     border: 1px solid #494;
     background: #000 url(images/camotile2.png);
     width: 185px;
     font-size: 10pt;
     box-shadow: inset 0 0 3px 3px #000;
}

.logo > * {
     text-align: center;
}

.logo a:link {
     display: inline-block;
     width: 100%;
     padding: 3px 0;
}

.logo a img {
     opacity: 0.6;
     filter: sepia(100%) invert(100%) hue-rotate(260deg) drop-shadow(0 0 1px #494);
     margin: 0;
     padding: 0;
     text-align: center;
}

.logo a:hover img {
     opacity: 1;
     filter: sepia(100%) invert(100%) hue-rotate(260deg) drop-shadow(0 0 2px #f60);
}

.logo a:active img {
     opacity: 1;
     filter: sepia(100%) invert(100%) hue-rotate(260deg) drop-shadow(0 0 2px #f90);
}

div.logo hr {
     color: #494;
     background: #494;
     height: 1px;
     border: 0 solid #494;
     margin: 10px -10px;
}

.logo, .warning {
     filter: drop-shadow(0 0 5px #000);
}

div.warning {
     margin: 20px 20px 20px 248px;
     padding: 10px 25px 20px 75px;
     background: #000;
     border: 1px solid #494;
     color: #ee9;
     text-align: justify;
     background: #000 url(/themes/console/images/itoopie_sm.png) 10px center no-repeat;
     background: url(/themes/console/images/itoopie_sm.png) 10px center no-repeat, url(images/camotile2.png);
     background-position: 10px calc(50% + 16px);
     box-shadow: inset 0 0 0 1px #700, inset 0 0 3px 3px #000, 0 0 0 2px #000;
     word-wrap: break-word;
     font-size: 10pt;
     min-width: 300px;
     border: 5px solid #010;
     border-image: repeating-linear-gradient(135deg, #010 0px, #010 20px, #440 20px, #440 40px, #010 40px) 5 repeat repeat;
     border-image-width: 5px;
     border-image-outset: 1px;
}

.warning p, .warning a {
     font-size: 10pt
     line-height: 130%;
}

.warning p {
     margin: 0 0 10px;
}

.warning h3 {
     font-size: 10pt;
     padding: 9px 10px 7px;
     text-align: left;
     margin: -9px -24px 15px -74px;
     border: none;
     border-bottom: 1px solid #700;
}

.warning h4 {
     font-size: 10pt;
     box-shadow: none;
     margin: 12px 0 5px;
     padding: 0 0 5px;
}

.warning hr {
     margin-top: 10px !important;
}

#jumplinks h4 {
     padding-bottom: 10px;
     margin-bottom: 10px;
}

#jumplinks a {
     display: inline-block;
     padding: 2px 0;
     line-height: 16px;
}

#jumplinks a::before {
     content: "\279F\00A0";
     font-size: 16pt;
     display: inline-block;
     padding: 3px 0;
     vertical-align: sub;
     line-height: 16px;
}

#proxyNewAddressHelper .proxyfooter {
     display: none;
}

#proxyNewAddressHelper .warning {
     padding-bottom: 0 !important;
}

#proxyNewHost {
     margin-bottom: 20px;
}

#proxyNewHost td {
     padding: 8px !important;
     font-size: 10pt !important;
}

#proxyNewHost td:first-child {
     font-weight: bold;
}

#proxyNewHost tr:last-child td:first-child {
     vertical-align: top;
}

#proxyNewHost textarea {
     white-space: pre-wrap;
     word-break: break-all;
     overflow: auto;
     border: none;
     resize: none;
     background: none !important;
     box-shadow: none !important;
     width: 100% !important;
     height: 6em;
     margin: 0 !important;
     padding: 0 !important;
}

#proxyNewHost textarea:focus {
     filter: none;
}

#proxyNewHost + hr {
     display: none;
}

.warning h4 {
     box-shadow: none !important;
     text-align: left;
     font-size: 10pt;
}

#proxyNewHost a {
     display: inline-block;
     word-break: break-all;
}

.warning p + .formaction {
     margin: 0 0 20px;
     padding: 0;
}

/* end proxy errors */

/* sidebar */

.routersummaryouter {
     float: left;
     width: 200px;
     margin: 0 0 10px 5px;
     padding: 0;
     border: 0;
     clear: left; /* fixes a bug in Opera */
     text-align: center;
     display: block;
     position: absolute; /* so no interference with /home app icons */
}

.routersummary {
     width: 184px;
     padding: 8px 10px 8px;
     text-align: center;
     border: 1px solid #494;
     background: #000 url(images/camotile2.png) left top;
     color: #ee9;
     font-size: 8pt;
     clear: left; /* fixes a bug in Opera */
     border-radius: 2px;
     float: left;
     box-shadow: 0 1px 5px #000;
     margin-bottom: 7px !important;
}

.routersummary img[src$="i2plogo.png"] {
     opacity: 0.9;
     transition: ease filter 0.3s, ease opacity 0.3s;
     margin-top: -1px;
     margin-left: -4px;
     width: 193px;
     height: auto;
}

.routersummary img[src$="i2plogo.png"]:hover {
     opacity: 1;
     transition: ease filter 0.3s, ease opacity 0.3s;
     filter: saturate(200%) drop-shadow(0 0 2px #f60);
}

.routersummary a[href="/"], .routersummary a[href="/console"] {
     outline: none !important;
}

.routersummary a[href="/"]:focus img, .routersummary a[href="/console"]:focus img {
     filter: drop-shadow(0 0 2px #f60) saturate(200%);
}

.routersummary input[type="text"] {
     text-align: right !important;
     box-shadow: inset 1px 1px 1px 0 #000;
}

.routersummary hr {
     color: #494;
     background: #494;
     height: 1px;
     margin: 9px -10px 7px -10px;
}

.routersummary h3 {
     border: none;
     font-size: 9.5pt;
     letter-spacing: 0.08em;
     margin: -7px -10px -8px -10px;
     padding: 4px 0 !important;
     text-transform: uppercase;
     border-radius: 0;
     mix-blend-mode: exclusion;
     transition: none !important;
}

.routersummary h3::after {
     content: "";
     display: inline-block;
     min-height: 15px;
     vertical-align: middle;
}

.routersummary h3 a {
     vertical-align: middle;
}

.routersummary h3:hover {
     background: #010 !important;
     box-shadow: inset 0 0 2px 2px #000;
}

.routersummary h3:hover a {
     color: #f60;
     transition: ease color 0.2s;
}

.routersummary h3:active {
     box-shadow: inset 4px 4px 3px #000;
     transition: ease box-shadow 0.1s;
}

.routersummary h4 {
     border: 0;
     border-bottom: 0 !important;
     font-size: 8pt;
     margin: -6px -9px -8px !important;
     padding: 6px 1px;
     background: #000;
     background: linear-gradient(to right, #001900, #001000 5%, #000 50%, #001000 95%, #001900);
     text-decoration: none !important;
     color: #2b2;
     line-height: 120%;
     box-shadow: inset 0 0 0 1px #121, inset 0 0 5px 2px #000;
}

.routersummary h4::after {
     content: "";
     display: inline-block;
     min-height: 16px;
     vertical-align: middle;
}

.routersummary h3 a, .routersummary h4 a {
     white-space: normal !important;
     display: inline-block;
     width: calc(100% - 5px);
}

.routersummary ul {
     text-align: left !important;
}

.routersummary table {
     border: 0;
     text-align: center !important;
     margin: -5px -7px -6px -8px !important;
     width: 200px !important;
     overflow: hidden;
     font-size: 8pt;
     background-image: none !important;
     background-color: transparent !important;
}

#sb_general, #sb_shortgeneral, #sb_advancedgeneral, #sb_bandwidth, #sb_peers, #sb_peersadvanced, #sb_tunnels, #sb_queue {
     margin-bottom: -4px !important;
}

#sb_general td::after, #sb_shortgeneral td::after, #sb_advancedgeneral td::after, #sb_bandwidth td::after,
#sb_peers td::after, #sb_peersadvanced td::after, #sb_tunnels td::after, #sb_queue td::after {
   content: "";
   display: inline-block;
   min-height: 14px;
}

#sb_general td, #sb_shortgeneral td, #sb_advancedgeneral td, #sb_peersadvanced td {
     white-space: nowrap;
}

#sb_general td:first-child, #sb_shortgeneral td:first-child,  #sb_advancedgeneral td:first-child, #sb_peersadvanced td:first-child {
     max-width: 130px;
}

#sb_localtunnels {
     margin: -4px -7px -7px -8px !important;
}

#sb_localtunnels td:first-child {
     width: 16px;
     text-align: left !important;
     padding: 1px 0;
}

#sb_localtunnels td::after {
     content: "";
     display: inline-block;
     min-height: 10px;
     vertical-align: middle;
     border-sizing: border-box;
}

#sb_localtunnels a {
     display: inline-block;
     width: 100%;
     max-width: 156px;
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
}

#sb_localtunnels td:last-child {
     text-align: right;
     padding-right: 0;
}

#sb_warning { /* check connection/firewall */
     padding: 4px 4px 4px 26px;
     background: #000;
     background: url(images/warning24x24.png) 4px center no-repeat, linear-gradient(to right, #001900, #001000 5%, #000 25%, #000 50%, #000 75%, #001000 95%, #001900);
     background-size: 22px 22px, 100% 100%;
     text-align: center;
     line-height: 120%;
}

#sb_warning + p:empty + form {
     margin-top: 11px;
     margin-bottom: -6px;
}

#sb_internals td, #sb_services td, #sb_advanced td, #sb_help td { /* color ellipsis */
     color: #595 !important;
}

#sb_services, #sb_internals, #sb_advanced, #sb_help {
     margin-top: -4px !important;
}

#sb_internals a, #sb_services a, #sb_advanced a, #sb_help a {
     padding: 1px 3px;
     display: inline-block;
     vertical-align: middle;
}

#sb_version {
     margin-top: 6px !important;
     margin-bottom: 5px !important;
}

#sb_uptime {
     margin-bottom: -5px !important;
}

#sb_services a:link, #sb_internals a:link, #sb_advanced a:link, #sb_help a:link {
     word-break: break-all;
     max-width: 192px;
     overflow: hidden;
     white-space: nowrap;
     text-overflow: ellipsis;
     line-height: 140%;
}

#sb_peersadvanced a {
     color: #ee9;
}

#sb_peersadvanced .separator td::after {
     min-height: 0;
}

.routersummary .separator hr, .routersummary .separator hr:last-child {
     display: block !important;
     color: transparent;
     background: transparent;
     border-bottom: 1px dashed #141;
     height: 1px;
     margin: 4px 0 3px !important;
}

.sb_notice {
     background: #010;
     border: 1px solid #262;
     border-radius: 2px;
     box-shadow: inset 0 0 0 1px #000;
     margin: -4px -7px -6px;
     padding: 5px 3px;
}

#sb_warning {
     border-bottom: 1px solid #494 !important;
     margin-left: -10px !important;
     margin-right: -10px !important;
}

#sb_warning + .sb_notice {
     margin-top: 11px;
}

#sb_warning + hr {
     margin-top: 7px !important;
}

p:empty + .sb_notice {
     margin-top: 9px;
}

.routersummary tr {
     background-image: none !important;
     background-color: transparent !important;
     border: 0 !important;
}

.routersummary form {
     margin: -4px -9px -6px;
}

.routersummary form:first-child {
     margin: 6px 0 -5px 0 !important;
}

.routersummary p {
     padding: 0;
}

div.refresh {
     margin-top: -10px !important;
     margin-bottom: -4px !important;
     padding: 2px 0 0 0 !important;
}

.routersummary a:link, .routersummary a:visited {
     word-spacing: 0.05em;
}

.routersummary a:hover {
     color: #f60;
}

/* "experimental" custom sidebar links for apps */
/*
#sb_services {
     width: 192px !important;
     margin: 0 !important;
     margin: -7px -10px -9px !important;
     border-collapse: collapse;
     background: url(images/camotile.png) repeat fixed left top;
}

#sb_services tr {
     padding: 0;
}

#sb_services td {
     padding: 0;
}

#sb_services a, #sb_services a:hover, #sb_services a:active {
     border-bottom: 1px solid #151 !important;
     outline: none !important;
     display: inline-block;
     width: calc(100% - 32px) !important;
}

#sb_services a:hover {
     background: #020;
}

#sb_services a:last-child {
     border-bottom: 1px solid transparent !important;
}

#sb_services a[href*="mail"], #sb_services a[href*="snark"], #sb_services a[href*="7658"], #sb_services a[href*="bote"] {
     padding: 5px 5px 5px 26px !important;
     border: 1px outset transparent;
     margin: 0 !important;
     float: left;
     text-align: left;
     text-decoration: none;
     text-transform: uppercase;
     letter-spacing: 0.1em;
     white-space: nowrap;
     text-overflow: ellipsis;
     overflow: hidden;
     clear: both;
}

#sb_services a[href*="mail"] {
     background: #000 url(images/mail.png) 5px center no-repeat;
}
#sb_services a[href*="mail"]:hover {
     background: #020 url(images/mail.png) 5px center no-repeat;
}

#sb_services a[href*="bote"] {
     background: #000 url(images/webmail.png) 5px center no-repeat;
}

#sb_services a[href*="bote"]:hover {
     background: #020 url(images/webmail.png) 5px center no-repeat;
}

#sb_services a[href*="snark"] {
     background: #000 url(images/magnet.png) 5px center no-repeat;
}

#sb_services a[href*="snark"]:hover {
     background: #020 url(images/magnet.png) 5px center no-repeat;
}

#sb_services a[href*="7658"] {
     background: #000 url(images/webserver.png) 5px center no-repeat;
}

#sb_services a[href*="7658"]:hover {
     background: #020 url(images/webserver.png) 5px center no-repeat;
}
*/
/* end custom sidebar links */

.routersummary td {
     padding: 0 2px 0 2px;
     background-image: none !important;
     border: 0 !important;
     word-spacing: -0.1em;
}

.routersummary td:first-child {
     max-width: 90px;
     overflow: hidden;
     text-transform: capitalize;
}

.routersummary hr:last-child {
     margin-top: 5px;
     margin-bottom: -5px !important;
}

/* sidebar news */

.sb_newsheadings {
     width: 192px;
     margin-left: 0;
     margin-bottom: -7px !important;
     text-align: right;
}

.sb_newsheadings table {
     margin-bottom: 3px !important;
}

.sb_newsheadings a {
     display: inline-block;
     padding: 0 3px 0 0;

}

.sb_newsheadings td {
     padding: 4px 5px 4px 24px;
     text-align: left;
     background: url(images/newsbullet_mini.png) 4px center no-repeat !important;
     border-bottom: 1px solid #131 !important;
}

.sb_newsheadings tr:last-child td {
     border-bottom: none !important;
}

/* end sidebar news */

/* mini sidebar graph */

#sb_bandwidthgraph {
     width: 100%;
     margin: -5px 0 -5px -5px;
     border-collapse: separate;
     border-spacing: 0;
     padding: 0;
     border: 1px solid #5df;
     border: 1px solid rgba(85, 221, 255, 0.5);
     box-shadow: 0 0 1px #ccf;
}

#sb_bandwidthgraph:hover {
     border: 1px solid #0f6;
     cursor: url(/themes/console/images/cursor_zoom.png), pointer;
}

a:active #sb_bandwidthgraph {
     border: 1px solid #0f3;
}

#sb_bandwidthgraph td {
     background: linear-gradient(to top, #fff 2px, rgba(255,255,255,0.0) 2px, rgba(255,255,255,0.0) 89%, #fff 93%), repeating-linear-gradient(to right, rgba(255,255,255,0.0) 10px, rgba(120,120,255,0.8) 11px, rgba(255,255,255,0.0) 11px, rgba(255,255,255,0.0) 20px), repeating-linear-gradient(to top, rgba(255,255,255,0.0) 1px, rgba(120,120,255,0.8) 2px, rgba(255,255,255,0.0) 2px, rgba(255,255,255,0.0) 10px) !important;
     padding: 0 1px;
     box-shadow: inset 0 0 0 1px #fff;
     height: 40px;
     vertical-align: top;
}

#sb_graphstats {
     display: inline-block;
     padding: 2px 8px;
     font-weight: bold;
     background: #ddf;
     background: linear-gradient(to right, #ddf, #efefff, #ddf);
     border: 1px solid #89f;
     border-top: none;
     border-radius: 0 0 3px 3px;
     box-shadow: inset 0 0 0 1px #fff, 0 0 1px #fff;
     opacity: 0;
     transition: ease opacity 0.3s;
     color: #89f;
}

#sb_graphcontainer:hover #sb_graphstats {
     opacity: 1;
     transition: ease opacity 0.3s;
}

#sb_graphcontainer {
     background-color: #000;
     background-position: left -72px top -22px !important;
     background-size: 280px 77px !important;
     background-repeat: no-repeat !important;
     margin-bottom: -7px !important;
     filter: invert(1) hue-rotate(90deg);
     background-position: left -72px top -14px !important;
     background-size: 280px 67px !important;
}

/* reduce flicker as graph image gets inverted and hue-rotated */

@keyframes graphfadein {
0% {
     filter: invert(1) hue-rotate(90deg) opacity(0);
}

30% {
     filter: invert(1) hue-rotate(90deg) opacity(0);
}

50% {
     filter: invert(1) hue-rotate(90deg) opacity(1);
}
}

#sb_graphcontainer {
     animation: graphfadein 0.3s ease-out;
}

@media screen and (min-width: 1500px) {
#sb_graphcontainer {
     background-size: 300px 77px !important;
}
}
/* end mini sidebar graph */

/* status bar */

.percentBarOuter {
     width: 194px;
     background: #000;
     background: repeating-linear-gradient(135deg, #000 1px, #000 5px, #010 6px, #010 11px);
     background: repeating-linear-gradient(to right, #000 1px, #000 2px, #010 2px, #010 4px);
     border: 1px solid #040;
     border-bottom: 1px solid #020;
     border-right: 1px solid #020;
     opacity: 1;
     box-shadow: 0 0 1px 1px rgba(0,0,0,0.8);
     margin: -3px 0 -5px -6px;
}

@media screen and (min-width: 1500px) {
.percentBarOuter {
     width: 220px;
}
}

.percentBarOuter:hover .percentBarText {
     opacity: 1;
     transition: ease opacity 0.2s;
}

.percentBarInner {
     height: 14px;
     background: #0e5f00;
     background: linear-gradient(to bottom, rgba(28, 148, 58, 0.6) 0%, rgba(9, 47, 16, 0.6) 50%, rgba(13, 39, 7, 0.6) 50%, rgba(9, 27, 5, 0.6) 50%, rgba(9, 21, 3, 0.6) 100%);
     box-shadow: inset 0 0 0 1px #000;
}

.percentBarText {
     width: 100%;
     font-weight: bold;
     text-align: center;
     vertical-align: middle;
     float: left;
     opacity: 0;
     transition: ease opacity 0.2s;
}

/* update bar */

.sb_updatestatus {
     background: #000;
     background: linear-gradient(to right, #020, #000, #020);
     margin: -6px -2px -2px;
     padding: 2px 0 4px;
     border-bottom: 1px solid #494;
}

.sb_info .percentBarOuter {
     margin: 6px -2px -18px 2px;
     box-shadow: none !important;
     background: repeating-linear-gradient(135deg, #000 1px, #000 5px, #010 6px, #010 11px);
     animation: downloadbar 3s infinite alternate;
}

.sb_info .percentBarText {
     opacity: 1;
     padding-top: 2px;
}

.sb_info .percentBarInner {
     height: 16px;
}

.sb_update {
     padding: 3px 5px 0 !important;
}

@keyframes downloadbar {
from {
     background: repeating-linear-gradient(135deg, #000 1px, #000 5px, #010 6px, #010 11px);
}

to {
     background: repeating-linear-gradient(135deg, #010 1px, #010 6px, #000 7px, #000 11px);
}
}

/* end status bar */
/* end sidebar */

/* console error messages */

img[src="/themes/console/images/i2plogo.png"] {
     margin-top: 2px !important;
     margin-left: -1px !important;
     width: 180px !important;
     filter: invert(1) sepia(100%) hue-rotate(70deg) !important;
}

img[src="/themes/console/images/i2plogo.png"]:hover,
img[src="/themes/console/images/i2plogo.png"]:focus {
     filter: invert(1) sepia(100%) hue-rotate(70deg) drop-shadow(0 0 2px #930) !important;
}

a:active img[src="/themes/console/images/i2plogo.png"] {
     filter: invert(1) sepia(100%) hue-rotate(70deg) drop-shadow(0 0 3px #f60) !important;
}

.sorry {
     margin: -1px 5px 10px 216px;
     padding: 20px 20px 20px 70px;
     background: #010;
     border: 1px solid #494;
     border-radius: 0 0 4px 4px;
     text-align: justify;
     background: url(/themes/console/images/info/errortriangle.png) 15px 45% no-repeat #010;
     box-shadow: inset 0 0 0 1px #700;
     word-wrap: break-word;
     min-width: 560px;
     color: #ee9;
     font-size: 10pt;
}

.sorry p {
     line-height: 130% !important;
}

#warning2 {
     min-width: 610px;
     margin-top: -14px;
     margin-bottom: 5px;
     background: #010;
     padding: 10px 20px 5px;
}

#warning2 h3 {
     border-width: 1px;
     border-radius: 0;
     border-left: none;
     border-right: none;
     margin: -21px -20px 0;
     padding: 10px;
     box-shadow: inset 0 0 0 1px #700;
}

#warning2 p {
     font-size: 9pt;
}

#warning2 p + h3 {
     margin-top: -5px;
}

#warning2 b {
     display: inline-block;
     min-width: 140px;
     text-align: right;
     margin-right: 5px;
     line-height: 150%;
}

.sorry hr {
     color: #ee9;
     background: #ee9;
     height: 1px;
     border-top: 1px solid #ee9;
     margin: 10px 0;
     opacity: 0.7;
}

/* main section */

.main {
     margin: -1px 5px 5px 216px;
     padding: 0 15px 5px 15px;
     text-align: left;
     color: #ee9;
     width: auto;
     border: 1px solid #494;
     border-radius: 0 0 2px 2px;
     background:  #000 url(images/camotile2.png) !important;
     min-width: 620px;
     box-shadow: 0 1px 5px #000;
     font-size: 9pt;
}

.main, .routersummary {
     background:  #000 url(images/camotile2.png) !important;
     background:  linear-gradient(to bottom, rgba(0,0,0,0.3), rgba(0,0,0,0.45)), url(images/camotile2.png) #000 !important;
     box-shadow: inset 0 0 0 1px #000, 0 1px 5px #000;
}

.main#dns {
     padding: 0 0 3px;
     min-width: 650px !important;
     background: #000;
}

.main#webmail, .main#torrents {
     padding: 0;
     margin-top: -1px;
     background: #000 !important;
}

.main#torrents {
     padding-bottom: 2px;
}

.main#tunnelmgr {
     background: linear-gradient(45deg, rgba(0,0,0,0.5), rgba(0,34,0,0.7)), url(images/camotile2.png) top left;
     background-size: 3px 3px, 175px 175px;
}

.main#news {
     background: #000 url(images/news.png) no-repeat scroll bottom right !important;
}

/* end main */

#news h3 {
     padding: 6px 8px 6px 10px;
     letter-spacing: 0.08em !important;
     word-spacing: normal !important;
/*     background: linear-gradient(to bottom, rgba(0,0,0,0) 50%, #000 50%), url(/themes/console/dark/images/camotile2.png), repeating-linear-gradient(to right, rgba(0,0,0,0.5) 1px, rgba(0,0,0,0.5) 2px, rgba(0,16,0,0.5) 2px, rgba(0,16,0,0.5) 4px), linear-gradient(to bottom, #003000, #000 75%) !important;
     background-blend-mode: normal, exclusion, normal, normal;*/
}

#news h3 font {
     letter-spacing: 0.2em !important;
     text-transform: none;
}

div.news h3, #newspage h3 {
     text-align: left !important;
     font-size: 10pt !important;
     letter-spacing: 0.03em;
     color: #ee9;
}

.news .newsentry:first-child {
     margin-top: -3px;
}

.main textarea {
     background: #000;
     color: #ee9;
     font: 8.5pt "Droid Sans Mono", "Noto Mono", "Lucida Console", "DejaVu Sans Mono", monospace;
     resize: none;
}

div.news {
     margin: -1px 5px 0 216px;
     padding: 6px 15px 8px;
     border: 1px solid #494;
     background: #000 url(images/news.png) no-repeat scroll bottom right;
     background: linear-gradient(to bottom, rgba(0,0,0,0.3), rgba(0,0,0,0.5)), url(images/news.png) no-repeat scroll right bottom, url(images/camotile2.png) #000 !important;
     background-blend-mode: lighten;
     color: #ee9;
     font-size: 8pt;
     text-align: right;
     box-shadow: 0 1px 5px #000;
     min-width: 620px !important;
}

/* MS Edge 14+ fix (no support for blend-mode) */
_:-ms-lang(x), div.news {
     background: #000 url(images/news.png) no-repeat scroll bottom right;
}

div.news li {
     text-align: justify;
     list-style: url(images/info_dark.png);
     list-style: none;
     margin: 0;
     padding: 5px 5px 5px 0;
     vertical-align: middle;
     word-wrap: break-word;
     color: #494;
     font-weight: bold;
     font-size: 9.5pt;
     border-bottom: 1px dotted #494;
     margin-bottom: 5px;
     text-transform: capitalize;
}

div.news h4 {
     border-bottom: 1px;
     border-bottom-style: dotted;
     border-bottom-color: #494;
     padding: 0 0 0 0;
     margin: 5px 0 10px 0;
     font-size: 10pt;
     opacity: 1;
     text-transform: capitalize;
}

div.news p, div.newscontent p {
     font-size: 9pt;
     color: #ee9;
     margin: 0 !important;
}

div.news p:nth-child(n+2), div.newscontent p:nth-child(n+2) {
     margin-top: 8px !important;
}

div.news hr {
     margin: 8px 0 5px 0;
}

#news #newsStatus {
     float: left;
     padding-top: 3px;
     padding-bottom: 1px;
}

#newsDisplay {
     white-space: nowrap;
     margin-left: 10px;
}

#news #newsDisplay, #graphopts {
     color: transparent;
}

#newsStatus, #news #newsDisplay, #news #newsDisplay a {
     display: inline-block;
}

#news #newsDisplay a, #graphopts a {
     border: 1px solid #010;
     margin: 0 -2px;
     padding: 1px 10px;
     background: #020;
     background: rgba(0,48,0,0.6);
     border-radius: 15px;
     filter: drop-shadow(0 0 1px rgba(0,16,0,0.4));
}

#news #newsDisplay a:hover, #news #newsDisplay a:focus, #graphopts a:hover, #graphopts a:focus {
     background: #030;
     background: linear-gradient(to bottom, #030 50%, #010 50%);
     border: 1px solid #020;
}

#news #newsDisplay a:active, #graphopts a:active {
     background: #020;
     box-shadow: inset 2px 2px 2px #000;
}

.news #newsDisplay, .news #newsStatus {
     margin-top: 3px !important;
     display: inline-block;
}

.newsAuthor {
     float: right;
     background: url(/themes/console/images/info/author_dark.png) left 2px center no-repeat;
     background-size: 14px 14px;
     font-size: 8pt !important;
     padding: 1px 0 0 18px;
     display: inline-block;
     opacity: 0.7;
     text-transform: none;
}

.newsDate {
     opacity: 0.9;
     font-style: italic;
     margin-right: 3px;
}

#newspage {
     margin: 18px 5px; /* positional parity with homepage news */
}

div.widescroll { /* only scroll content, not entire page eg /peers */
     overflow: auto;
}

.widescroll table {
     white-space: nowrap;
}

/* top navigation */

.confignav {
     background: url(images/header.png) repeat-x scroll center center #000;
     background: linear-gradient(to bottom, #001000, #001900 50%, #000 51%, #000) !important;
     background: linear-gradient(to bottom, #1a261a 0%, #223022 7%, #212f21 9%, #172317 21%, #091109 49%, #050d05 50%, #020602 51%, #010301 53%, #000000 56%, #000000 100%) repeat scroll 0 0%, rgba(0, 0, 0, 0) url("/themes/console/dark/images/camotile2.png") !important;
     padding: 7px 7px 8px !important;
     margin: -1px -16px 15px;
     border: 1px solid #494;
     font-weight: bold !important;
     line-height: 130% !important;
     text-align: center;
     box-shadow: inset 0 0 0 1px #000;
     background-blend-mode: exclusion, normal;
}

.tab, .tab2 {
     box-sizing: border-box;
     display: inline-block;
     border: 1px solid #494;
     margin: 0 -2px -1px -2px !important;
     padding: 1px 0;
     background: #fff;
     min-width: 60px !important;
}

.tab2 {
     background: #030;
     box-shadow: inset 0 0 0 1px #000, inset 3px 3px 2px #010;
     color: #ee9;
     padding: 5px 12px !important;
}

.tab a {
     display: inline-block;
     padding: 4px 14px !important;
}

.tab {
     background: linear-gradient(to bottom, #001900, #002900 50%, #000 50%) !important;
     box-shadow: inset 0 0 0 1px #000;
}

.tab:hover {
     background: #000 !important;
     box-shadow: inset 0 0 0 1px #914600;
}

.tab:hover a {
     color: #f60;
}

.tab:active {
     box-shadow: inset 0 0 0 1px #000, inset 3px 3px 3px 1px #5f2400;
     background: #f60 !important;
}

.tab:active a {
     color: #ee9 !important;
}

/* end topnav */

div.messages {
     padding: 20px 10px 20px 50px;
     margin: 10px 0 15px 0;
     border: 1px solid #494;
     background: #000;
     background: url(images/infohelp.png) no-repeat 12px center, url(images/scarface.jpg) right bottom no-repeat #000;
     background-size: 28px 28px, auto 90%;
     font-weight: bold;
     font-size: 9.5pt;
     color: #2b2 !important;
     box-shadow: inset 0 0 1px 0 #990 !important;
}

div.messages span.error {
     color: #d90;
}

div.messages span.notice {
     font-style: italic;
}

div.messages li {
     text-align: justify !important;
     font-weight: bold;
     list-style: none !important;
     margin: 0 5px 0 0 !important;
     padding: 0 10px 0 0 !important;
     border: 0 !important;
}

#messages, .error, .notice {
     color: #ee9;
}

div.widepanel h3 {
     text-align: left !important;
     padding: 8px 10px;
     text-transform: uppercase;
     font-size: 10.5pt;
     letter-spacing: 0.08em;
     word-spacing: 0.1em;
     border-radius: 0;
     border: 1px solid #494;
}

.main#events .messages {
     margin-top: 26px;
     margin-bottom: -13px;
     box-shadow: inset 0 0 0 1px #700 !important;
}

/* graphs */

#graphs {
     padding: 0 10px
}

#graphs .messages {
     margin: 15px 5px -5px;
}

#graphs .widepanel {
     margin: -4px 0 17px !important;
}

#graphdisplay {
     margin-top: 14px !important;
}

.graphspanel {
     padding: 0;
     margin: 15px 0 -15px 0;
     background: none;
     text-align: center;
     overflow: hidden;
     width: 100%;
}

.graphspanel form {
     text-align: left;
     padding: 0 15px 0 15px;
     margin-bottom: 25px;
}

.graphspanel a img {
     border: 1px solid #494;
     padding: 3px;
     margin: 6px 4px;
     text-align: center !important;
     opacity: 0.9;
     transition: ease all 0.3s;
}

.graphspanel a img:hover {
     border: 1px solid #f60;
     padding: 3px;
     text-align: center !important;
     opacity: 1;
     transition: ease all 0.3s;
     cursor: url(/themes/console/images/cursor_zoom.png), pointer;
}

.graphspanel img {
     border: 1px solid #333;
     background: #000;
     padding: 2px;
     vertical-align: top;
     max-width: 95%;
     max-width: calc(100% - 18px);
}

.graphspanel img:not(old) {
     background: #fff;
     border: #ccc;
     filter: invert(1);
     mix-blend-mode: lighten;
}

.graphspanel img:not(old) {
     border: 1px solid #fcf;
}

.graphspanel a img:not(old) {
     border: 1px solid #b6b;
}

.graphspanel a img:hover:not(old) {
     border: 1px solid #0099ff;
}

.graphspanel p {
     text-align: center;
     text-transform: capitalize;
     margin-top: 10px;
     border-top: 1px solid #494;
     padding: 10px 10px 15px;
}

#graphopts {
     margin: 30px -15px -5px !important;
     padding: 11px 10px 10px;
     border-top: 1px solid #494;
     text-align: center;
     background: #010;
     background: rgba(0,16,0,0.5);
}

#graphopts a {
     display: inline-block;
     filter: none;
     border: 1px solid #030;
     padding: 1px 10px;
     line-height: 130%;
     margin: 3px -1px;
     text-transform: capitalize;
}

#graphopts a:empty {
     display: none;
}

#graphopts + p {
     display: none;
}

h3#graphinfo {
     margin-top: 15px;
     border-radius: 0 !important;
}

.graphspanel p:last-child {
     display: none;
}

.formaction#graphing {
     margin: -4px -5px 5px !important;
     border-left: none;
     border-right: none;
}

/*
.main#graphs hr {
     margin: 10px -10px 8px !important;
}
*/

h3#graphinfo {
     text-transform: capitalize;
     letter-spacing: normal;
     word-spacing: normal;
}

/* new graphs optionbox */

h3#graphdisplay {
     margin: 15px 10px 10px;
}

h3#graphdisplay a {
     text-transform: capitalize;
     letter-spacing: normal;
     float: right;
     font-size: 9pt;
}

form[action="graphs"] {
     border: 1px solid #494;
     background: #000;
     margin: -11px 10px 13px;
}

#graphs form {
     padding: 0 !important;
}

#graphs form hr {
     margin: 0 -1px 8px !important;
}

#graphs form table {
     border: none;
     margin: 0;
}

.formaction#graphing {
     margin: -4px 3px 5px !important;
     padding-top: 1px;
}

#graphs tr:first-child td {
     border-top: none;
}

#graphs td:first-child {
     text-align: right;
     width: 10%;
     white-space: nowrap;
     padding: 13px 3px 13px 15px;
     font-weight: bold;
}

#graphs td:nth-child(2) {
     width: 260px;
     white-space: nowrap;
}

#graphs td.infohelp {
     border: 1px solid #131;
     border-right: none;
     border-left: none;
     background-size: 20px 20px !important;
     padding: 5px 5px 5px 40px !important;
     background-color: #000800 !important;
     text-align: left;
}

#graphs form input, #graphs form select {
     margin: 3px 5px 3px 0;
}

#graphs input[type="text"] {
     min-width: 60px;
}

.graphspanel a {
     font-size: 0;
}

/* end graphs */

table {
     border-collapse: collapse;
     width: 100%;
     border: 1px solid #494;
     padding: 1px;
     font-size: 9pt;
     background: #030;
     margin: 1px 0;
}

table hr {
     padding: 0 0;
     color: #494;
     background: #494;
     border: 0 solid #494;
     margin: 0 0;
     height: 1px;
     display: none;
}

th {
     padding: 7px 2px;
     color: #ee9;
     text-align: center;
     font-size: 9pt;
     background: #000 url(images/header.png) center center repeat-x;
     background: linear-gradient(to bottom, #002000, #000 75%) !important;
     border-top: 1px solid #494;
     border-bottom: 1px solid #494 !important;
     line-height: 110%;
}

tr {
     vertical-align: middle;
}

tr:nth-child(even) {
     background: #001000;
     vertical-align: middle;
}

tr:nth-child(odd) {
     background: #000800;
     vertical-align: middle;
}

td {
     padding: 4px 6px;
     color: #ee9;
     vertical-align: middle;
     border-top: 1px inset #131;
}

td img {
     padding: 0 1px 0 2px;
}

#udpconnections td:nth-child(2) img, #ntcpconnections td:nth-child(2) img {
     padding: 0;
}

#udpconnections tr:last-child td, #ntcpconnections tr:last-child td {
     padding-top: 6px;
     padding-bottom: 6px;
}

/* peers - sort icons */

#udpconnections th {
     vertical-align: top;
     padding-top: 3px;
}

.sortup, .sortdown, .sortupactive, .sortdownactive {
     padding: 1px 0;
     border: 1px solid #171;
     border-radius: 1px;
     opacity: 0.7;
     margin: 5px 1px 0 !important;
     vertical-align: middle;
     text-align: center;
     display: inline-block;
     width: 16px;
     height: 12px;
     background-size: 10px auto, 100% 100% !important;
}

.sortup, .sortdown {
     box-shadow: inset 0 0 0 1px #000;
}

.sortup img, .sortdown img, .sortupactive img, .sortdownactive img {
     margin: 0;
     padding: 0;
     opacity: 0;
     width: 16px;
     height: 14px;
     vertical-align: middle;
     text-align: center;
}

.sortup:hover, .sortdown:hover {
     opacity: 0.9;
     transition: ease all 0.3s;
}

.sortupactive, .sortdownactive {
     opacity: 1;
     box-shadow: inset 1px 1px 1px #000;
}

.sortup {
     background: url(images/sort_up.png) center center no-repeat, linear-gradient(to bottom, #040, #000);
}

.sortup:hover {
     background: url(images/sort_up.png) center center no-repeat, linear-gradient(to bottom, #000, #040);
     border: 1px solid #f60;
}

.sortup a:focus, .sortdown a:focus {
     background: rgba(255,255,0,0.2);
     border-radius: 1px;
     margin-top: -1px;
     height: 14px;
     width: 16px;
     display: inline-block;
}

.sortupactive {
     background: url(images/sort_up.png) center center no-repeat, #050;
}

.sortdown {
     background: url(images/sort_down.png) center center no-repeat, linear-gradient(to bottom, #040, #000);
}

.sortdown:hover {
     background: url(images/sort_down.png) center center no-repeat, linear-gradient(to bottom, #000, #040);
     border: 1px solid #f60;
}

.sortdownactive {
     background: url(images/sort_down.png) center center no-repeat, #050;
     border: 1px solid #050;
}

/* end peer sort */

tt {
     font: bold 8.5pt "Droid Sans Mono", "Noto Mono", "Lucida Console", "DejaVu Sans Mono", monospace;
     color: #FF0;
}

table tt {
     color: #990;
     font-size: 8.5pt;
}

a:link tt, a:visited tt {
     color: #494;
}

a:hover tt {
     color: #f60;
}

a:active tt {
     color: #f90;
}

div.main li {
     text-align: left;
     list-style: square;
     margin: 2px 0 2px 30px;
     padding: 2px 20px 2px 0;
     word-wrap: break-word;
}

div.main li b {
     color: #bb0 !important;
}

.tidylist {
     text-align: justify !important;
     line-height: 150%;
}

.tidylist:last-child {
     padding-bottom: 10px;
}

.tidylist code {
     text-align: left;
     font: 8.5pt "Droid Sans Mono", "Noto Mono", "Lucida Console", "DejaVu Sans Mono", monospace;
     color: #dd0;
     padding: 1px 3px;
     background: #030;
     margin: 0 2px;
     border-radius: 3px;
}

ol {
     display: inline;
     padding: 1px 0 0 20px;
}

ol li:first-child {
     margin-top: 10px !important;
}
ul {
     margin: 0;
     padding: 0;
}

code {
     text-align: left;
     font: 9pt "Droid Sans Mono", "Noto Mono", "Lucida Console", "DejaVu Sans Mono", monospace;
     color: #dd0;
}

a:link, h2 a:link, #graphopts a:visited {
     color: #494;
     text-decoration: none;
     font-weight: bold;
     word-wrap: break-word;
}

a:visited {
     color: #7b7;
     text-decoration: none;
     font-weight: bold;
     word-wrap: break-word;
}

a:hover, a:focus {
     color: #f60 !important;
     text-decoration: none;
     font-weight: bold;
     word-wrap: break-word;
     outline: none;
}

a:active {
     color: #f90 !important;
}

.links {
     text-align: justify;
     margin-top: 10px;
}

.links li {
     list-style-image: url(images/link.png) !important;
     text-align: justify !important;
     line-height: 160% !important;
}

/* welcome */

.twocol {
     -moz-columns: 2 400px;
     -webkit-columns: 2 400px;
     columns: 2 400px;
     -moz-column-gap: 0 !important;
     -webkit-column-gap: 0 !important;
     column-gap: 0 !important;
     display: block;
}

.twocol li {
     break-inside: avoid;
     page-break-inside: avoid;
     -webkit-column-break-inside: avoid;
}

.twocol li:first-child {
     margin-top: 0 !important;
}

div[lang="de"] .twocol, div[lang="pt"] .twocol, div[lang="es"] .twocol, div[lang="sv"] .twocol {
     background: rgba(0,32,0,0.3);
     border: 1px solid #000;
     border-radius: 4px;
     padding: 10px;
     margin: 10px -5px 5px !important;
}

div[lang="es"] li, div[lang="pt"] li, div[lang="sv"] li {
     list-style: none;
}

div[lang="sv"] li::first-letter {
     text-transform: uppercase !important;
}

p + .twocol, div[lang="de"] p + .twocol {
     margin: 10px 25px !important;
}

.main#console p {
   margin: 5px 20px 10px;
}

.main#console ul {
     margin-left: 10px;
     margin-right: 10px;
     line-height: 150%;
}

.main#console li {
     text-align: justify;
}

.links b {
     color: #bb0 !important;
     letter-spacing: 0.08em;
     line-height: 165%;
}

/* end welcome */

p {
     text-align: justify;
     line-height: 160%;
}

p img:first-child {
     display: none !important;
}

p:empty { /* kills empty paragraphs that are likely erroneous eg. see top of /profiles?f=1, /profiles */
     display: none;
     border: 1px dotted #f00; /* display in order to bug hunt */
}

#config_logging p {
     text-align: left;
     margin: 3px 0 5px !important;
}

h1 {
     text-align: left;
     color: #ee9;
     padding: 13px 15px;
     margin: 0 5px 0 216px !important;
     font-size: 17pt;
     font-weight: bold;
     font-style: normal;
     text-transform: uppercase;
     letter-spacing: 0.15em;
     text-shadow: 0 0 2px #010;
     white-space: normal;
     background: #000 url(images/header.png) center center;
     border: 1px solid #494;
     border-radius: 2px 2px 0 0;
     line-height: 120%;
     min-width: 620px;
     box-shadow: 0 1px 5px #000;
}

span.newtab {
     text-align: right;
     font-size: 8pt;
     float: right;
     letter-spacing: 0;
}

/* opera targetted hack */
x:-o-prefocus, span.newtab {
     margin-top: -25px;
}

h2, h2.welcome {
     font-size: 12pt;
     color: #ee9;
     text-shadow: 0 0 2px #010;
     letter-spacing: 0.08em;
     word-spacing: 0.1em;
     background: #000 url(images/header.png) center center ;
     padding: 10px;
     border: 1px solid #494;
     border-radius: 2px;
     vertical-align: middle;
     margin: 15px 0 12px 0 !important;
     text-transform: uppercase;
     word-wrap: break-word;
}

h2 a:visited {
     color: #191;
}

h2 a:hover {
     color: #f60;
}

h3, h3.welcome {
     border: 1px solid #494;
     border-left: 5px solid #494;
     padding: 7px 10px;
     margin: 12px 0 10px 0;
     border-radius: 0 2px 2px 0;
     background: #000 url(images/header.png) center center ;
     text-transform: uppercase;
     text-shadow: 0 0 2px #010;
     letter-spacing: 0.08em;
}

h4 {
     border-bottom: 1px;
     border-bottom-style: solid;
     border-bottom-color: #494;
     padding: 0 0 10px 0;
     margin: 5px 0 10px 0;
     font-size: 11pt;
}

h1, h2, h3:not([id*="help"]), h4.app, h4.app2, .routersummary h3 {
     background: linear-gradient(to bottom, #1a261a 0%, #223022 7%, #212f21 9%, #172317 21%, #091109 49%, #050d05 50%, #020602 51%, #010301 53%, #000000 56%, #000000 100%) !important;
     background: linear-gradient(to bottom, rgba(0,0,0,0) 50%, #000 50%), repeating-linear-gradient(to right, rgba(0,0,0,0.5) 1px, rgba(0,0,0,0.5) 2px, rgba(0,16,0,0.5) 2px, rgba(0,16,0,0.5) 4px), linear-gradient(to bottom, #005000, #000 75%) !important;
}

h2, h3, h4 {
     box-shadow: inset 0 0 0 1px #000;
}

.routersummary h3 {
     background: linear-gradient(to bottom, #1a261a 0%, #223022 7%, #212f21 9%, #172317 21%, #091109 49%, #050d05 50%, #020602 51%, #010301 53%, #000000 56%, #000000 100%) !important;
     transition: ease all 0.2s;
}

h1, h4.app, h4.app2, #news h3 {
     background: linear-gradient(to bottom, #1a261a 0%, #223022 7%, #212f21 9%, #172317 21%, #091109 49%, #050d05 50%, #020602 51%, #010301 53%, #000000 56%, #000000 100%), url(images/camotile2.png) #000 !important;
     background-blend-mode: exclusion;
     box-shadow: inset 0 0 0 1px #000;
     text-shadow: 0 1px 1px #000;
}

button::-moz-focus-inner, input::-moz-focus-inner {
     outline: none;
     border: none;
}

button, button:visited {
     font: bold 9pt "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", "DejaVu Sans", Verdana, "Lucida Grande", Helvetica, sans-serif;
     border: 1px outset #191;
     padding: 4px 2px !important;
     text-decoration: none;
     border-radius: 2px;
     font-weight: bold;
     margin: 2px 3px;
     text-align: center;
     vertical-align: middle;
     min-width: 75px;
     background: #000;
     color: #494;
     filter: drop-shadow(0 0 1px #000);
}

button:hover, button:focus {
     border: 1px solid #f60;
     box-shadow: inset 0 1px 1px 0 #ee9;
     background: #000;
     color: #f60;
     cursor: pointer;
}

button:active {
     border: 1px solid #f60;
     background: #f60;
     color: #ee9;
     box-shadow: inset 0 0 0 1px #000;
}

.routersummary button.reload, .routersummary button.stop {
     min-width: 92px;
     text-transform: capitalize;
     margin: 3px 2px;
}

.underline {
     border-bottom: 1px solid #ee9;
     padding: 5px 0 5px 0;
     margin: 0 0 10px 0;
}

.langbox {
     margin: 4px 3px 2px 5px;
     padding: 0;
     color: #ee9;
     font-size: 7pt;
     width: 400px;
     text-align: right;
     float: right;
     vertical-align: middle;
     line-height: 16px;
}

.langbox img {
     opacity: 0.7;
     padding: 0 !important;
     margin: 0 1px -2px !important;
     transition: ease opacity 0.3s;
     border: 1px solid #000;
}

.langbox img:hover, .langbox a:focus img {
     opacity: 1;
     transform: scale(1.1);
}

.langbox a:active img {
     transform: scale(1);
}

img[src*="bound"], img[src*="bound"]:hover {
     filter: sepia(100%) hue-rotate(70deg) !important;
}

hr {
     color: #494;
     background: #494;
     height: 1px;
     border: 0 solid #494;
     margin: 20px 0 10px;
}

hr:last-child {
     margin-top: 20px;
     margin-bottom: 20px;
}

.joblog hr {
     margin: 10px 0;
}

.wideload > a[href^="tunnels"] ~ hr, .wideload > a[href^="/susidns/"] ~ hr { /* tighten up /netdb (leasesets) hr */
     margin: 10px 0;
}

.sidebarlogo {
     text-align: center;
}

input {
     border: 1px outset #191;
     background: #000;
     color: #494;
     margin: 5px;
     font: bold 9pt "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", "DejaVu Sans", Verdana, "Lucida Grande", Helvetica, sans-serif;
     padding: 4px 2px;
     text-decoration: none;
     min-width: 110px;
     border-radius: 2px;
}

input:hover, input:focus {
     background: #000;
     color: #f60 !important;
     border: 1px solid #f60 !important;
     cursor: pointer;
}

input[type="submit"]:hover, input[type="reset"]:hover, input[type="submit"]:focus, input[type="reset"]:focus {
     box-shadow: inset 0 1px 1px 0 #ee9 !important;
}

input[type="submit"]:active, input[type="reset"]:active, button:active {
     box-shadow: inset 0 0 0 1px #000 !important;
     box-shadow: inset 0 0 0 1px #000, inset 3px 3px 3px #000 !important;
}

input:active {
     border: 1px solid #f60 !important;
     background: #f60 !important;
     color: #ee9 !important;
}

input[type="text"], input[type="password"] {
     background: #000;
     background: linear-gradient(to bottom, #000 0%, #010 100%);
     color: #ee9;
     margin: 5px 10px;
     padding: 5px;
     font: bold 9pt "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", "DejaVu Sans", Verdana, "Lucida Grande", Helvetica, sans-serif;
     border: 1px solid #494 !important;
     text-decoration: none;
     border-radius: 2px;
     box-shadow: inset 0 0 3px 3px #000;
     cursor: text;
}

input:invalid, input[type="file"]:invalid {
     border: 1px dotted #f00 !important;
}

input[type="text"], input[type="password"], textarea {
     color: #bb7 !important;
}

input[type="image"] {
     min-width: 0;
}

input[type="checkbox"], .optbox {
     min-width: 16px !important;
     filter: invert(100%) sepia(100%) hue-rotate(70deg) saturate(200%); /* colorize radios and checkboxes */
     vertical-align: sub;
     background: none;
}

input[type="checkbox"]:hover, .optbox:hover, input[type="checkbox"]:focus, .optbox:focus {
     outline: none;
     filter: invert(100%) sepia(100%) hue-rotate(70deg) saturate(200%) drop-shadow(0 0 3px #f60);
}

label {
     cursor: pointer;
}

.main#config_clients label[for="0"] {
     cursor: default;
}

input[type="file"] {
     box-shadow: none;
     border: none !important;
     background: #000;
     color: #ee9;
     padding: 0 !important;
     cursor: pointer;
     margin: 5px 8px;
     font-weight: normal;
}

input[type="file"]:hover, input[type="file"]:active {
     color: #f60;
}

input[name="refreshInterval"] {
     margin-right: 3px;
     width: 40px;
     text-align: right;
}

input:disabled {
     cursor: default;
}

input[type="text"]:disabled, input[type="text"]:disabled:active, input[readonly="readonly"] {
     color: #161 !important;
     border: 1px solid #373 !important;
     background: #000 !important;
}

input[class="check"] { /* nudge "check for updates" button into alignment on /configupdate */
     margin-left: 10px !important;
}

input[name="ntcphost"], input[name="udpHost1"] {
     width: 260px;
}

fieldset {
     overflow: hidden;
     position: relative;
}

select {
     -moz-appearance: none;
     -webkit-appearance: none;
     appearance: none;
     background: #000 url(images/dropdown.png) right center no-repeat !important;
     background: url(images/dropdown.png) right center no-repeat, linear-gradient(to bottom, #020 0%, #000 20%, #000 80%, #010 100%) !important;
     color: #494;
     margin: 5px 10px;
     border: 1px outset #191;
     border-radius: 2px;
     min-width: 110px;
     font: 9pt "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", "DejaVu Sans", Verdana, "Lucida Grande", Helvetica, sans-serif;
     font-weight: bold;
     padding: 3px 16px 3px 4px !important;
     cursor: pointer;
     overflow: hidden;
     text-overflow: ellipsis;
}

select option {
     font-size: 9.5pt !important;
     box-shadow: inset 0 0 20px 20px #000;
     color: #fff !important;
     background: #000 !important;
}

select option:hover, select option:checked {
     box-shadow: inset 0 0 20px 20px #f60;
     background: #000 !important;
}

select:focus, select:hover {
     color: #f60;
     border: 1px solid #f60;
}

select:hover {
     box-shadow: inset 0 1px 1px 0 #ee9;
}

select:hover, select:focus, select:active {
     background: #000 url(images/dropdown_hover.png) right center no-repeat !important;
}

select::-ms-expand {
     display: none;
}

textarea {
     background: #000;
     background: linear-gradient(to bottom, #000 0%, #010 100%) !important;
     box-shadow: inset 0 0 3px 3px #000;
     color: #ee9;
     padding: 5px;
     margin: 10px;
     border-radius: 2px;
     font: 8.5pt "Droid Sans Mono", "Noto Mono", "Lucida Console", "DejaVu Sans Mono", monospace;
     min-height: 100px;
     min-width: 97%;
     width: calc(100% - 15px);
     text-align: left;
     border: 1px solid #494;
}

textarea[cols="70"], textarea[name="levels"] {
     width: calc(100% - 20px);
}

input[type="text"]:focus, input[type="password"]:focus, textarea:focus {
     color: #ee9 !important;
     background: #000 !important;
     filter: drop-shadow(0 0 1px #880);
     transition: filter ease 0.3s;
     outline: none;
}

input[readonly]:focus {
     filter: none !important;
     color: #161 !important;
     font-weight: normal;
}

textarea#advancedsettings:focus {
     box-shadow: inset 0 0 0 1px #880;
     filter: none;
}

textarea[readonly]:focus {
     box-shadow: inset 0 0 3px 3px #000;
     font-weight: normal;
}

input[type="submit"], input[type="reset"], select, button {
     line-height: 120%;
     border: 1px solid #8b8;
     border-bottom: 1px solid #171;
     border-right: 1px solid #171;
     background: linear-gradient(to bottom, #020 0%, #000 20%, #000 80%, #010 100%);
     filter: drop-shadow(0 0 1px #131);
     font-size: 8pt;
}

input[type="submit"], input[type="reset"], button {
     padding: 5px 8px !important;
     outline: none;
}

.statusnotes {
     font-style: italic;
     font-size: 9pt;
     color: #ee9;
     text-align: center;
     border: 1px solid #494 !important;
     margin: -2px 0 5px 0;
     padding: 7px;
     background: #000;
     background: linear-gradient(to bottom, #001400, #001000 50%, #000 100%);
}

.joblog {
     border-radius: 4px 4px 0 0;
     text-align: justify !important;
     margin-top: 15px !important;
 }

.joblog h3 {
     margin-top: 10px !important;
}

.joblog br {
     margin-bottom: 5px;
}


.joblog ol {
     padding: 5px 20px 5px 0;
     -moz-column-count: 2;
     -moz-column-width: 400px;
     -moz-column-gap: 50px;
     -webkit-column-count: 2;
     -webkit-column-width: 400px;
     -webkit-column-gap: 50px;
     column-count: 2;
     column-width: 400px;
     column-gap: 50px;
}

.joblog ol li {
     break-inside: avoid;
     page-break-inside: avoid;
     -webkit-break-inside: avoid;
     display: inline-block;
     border-bottom: 1px dotted #030;
     min-width: 360px;
     width: 90%;
     width: calc(100% - 45px);
     padding-bottom: 5px !important;
     text-align: left;
}

.joblog ol li:last-child {
     border: none;
     text-align: left;
}

.joblog ol:empty {
     display: none !important;
}

div.joblog li:first-child {
     margin-top: 0;
}

div.joblog li:last-child {
     padding-bottom: 10px;
}

div.joblog ul li li li {
     margin-bottom: 10px !important;
}

div.joblog ul li li:last-child {
     margin-bottom: -30px;
}

h3#finishedjobs + ol li, h3#scheduledjobs + ol li, h3#activejobs + ol li, h3#readyjobs + ol li {
    list-style: none !important;
}

h3#activejobs + ol li:before, h3#scheduledjobs + ol li:before, h3#readyjobs + ol li:before, h3#finishedjobs + ol li:before {
     content: '\2023\00A0\00A0';
     margin-left: -20px;
     font-size: 15pt;
     font-weight: bold;
     line-height: 50%;
     vertical-align: sub;
     color: #393;
}

h3#finishedjobs + ol li:before {
     color: #3D3;
     content: '\2714\00A0';
}

h3#readyjobs + ol li:before {
     color: #dd3;
}

h3#scheduledjobs + ol li:before {
     color: #773;
}

div.joblog form:first-child {
     margin-top: 10px;
}

div.joblog table {
     margin-top: 15px;
     margin-left: 0 !important; /* removes hard-coded indentation */
     margin-bottom: 15px;
}

div.joblog table td:first-child {
     font-weight: bold;
}

div.joblog p {
     line-height: 140%;
}

div.joblog th:first-child {
     text-align: left;
     padding-left: 6px;
}

/* /jobs */

.main#jobs h2 {
     border-radius: 0;
     margin-bottom: -15px !important;
}

.main#jobs h3 + ol + h3 {
     margin-top: 10px !important;
}

#jobrunners ~ ol {
     display: block;
     margin-bottom: 5px !important;
     margin-top: -11px !important;
     border: 1px solid #494;
     width: 97%;
     width: calc(100% - 22px);
     background: #000800;
}

#jobrunners ~ ol > li:last-child {
     margin-bottom: 5px;
}

h3[id*="jobs"] {
     clear: both;
     margin-top: 25px !important;
}

table#schedjobs {
     width: 100% !important;
     margin: -6px 0 0 !important;
}

#jobstats {
     margin-bottom: 10px;
}

#jobstats th, #jobstats td {
     text-align: right;
     padding-right: 8px !important;
}

#jobstats tr:last-child {
     font-weight: bold;
}

#schedjobs th:first-child, #schedjobs td:first-child, #jobstats th:first-child, #jobstats td:first-child {
     text-align: left;
     padding-left: 10px;
     font-weight: bold;
}

table#jobstats + hr {
     display: none;
}

h3#totaljobstats {
     margin-bottom: -2px;
     margin-top: 10px !important;
}

/* end /jobs */

/* /stats */

form#statnav {
     border: 1px solid #494 !important;
     padding: 10px 10px 10px 15px;
}

h3.stats {
     border: 1px solid #494;
     border-radius: 0;
}

div.joblog li {
     word-wrap: break-word !important;
     line-height: 120% !important;
     margin: 2px 0 2px 30px;
     padding: 2px 20px 2px 0;
}

div.joblog ul {
     word-wrap: break-word !important;
     margin: 5px 0 -10px;
}

ul.statlist {
     margin: -11px 0 -31px !important;
     border: 1px solid #494;
     padding: 10px 0 0;
     background: #000;
     color: #bb7;
}

ul.statlist:last-of-type {
     margin-bottom: -10px !important;
}

ul.statlist a[name], ul.statlist b, ul.statlist li b, ul.statlist a[name]:hover {
     color: #bb3 !important;
     text-decoration: none;
     letter-spacing: normal;
}

ul.statlist li::before {
     content: "\2B26\00A0";
     font-size: 14pt;
     line-height: 50%;
     vertical-align: baseline;
     color: #bb3;
}

ul.statlist li {
     line-height: 160% !important;
     list-style: none;
     margin-left: 10px;
}

ul.statlist li li {
     margin-left: 16px;
     margin-right: -20px;
     line-height: 140% !important;
     list-style: none;
}

ul.statlist li li::before {
     content: "\279F\00A0";
     vertical-align: baseline;
     color: #994
}

ul.statlist li li:last-child {
     padding-bottom: 5px;
}

ul.statlist li li:last-child::after {
     content: "";
     display: block;
     border-bottom: 1px dotted #030;
     margin-top: 6px;
     margin-bottom: -12px;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
ul.statlist li li:last-child::after {
     margin-bottom: -6px;
}
}

li.noevents {
     margin-bottom: 5px !important;
}

li.noevents::after {
     margin-top: 6px !important;
     margin-bottom: 0 !important;
     margin-right: 20px;
}

ul.statlist li b {
     color: #994 !important;
}

ul.statlist li li:last-child::before {
     content: "\27A1\00A0";
     color: #994
}

.statlist a[href^="graph"]::before {
     content: "\27A1\00A0";
     content: "\21B3\00A0";
     color: #994;
     font-size: 14pt;
}

.statlist a[href$="true"]::before {
     display: none;
}

.nowrap {
     white-space: nowrap;
}

.statsLongName {
     color: #dd0;
     font-weight: bold;
}

.main#stats form {
     background: #000;
     border: 1px solid #494;
     padding: 10px;
     margin: -13px 0 -11px;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
ul.statlist {
     margin: -11px 0 -25px !important;
}
}

ul.statlist li li:last-child {
     margin-bottom: -20px !important;
}

li.noevents {
     padding: 0 0 20px !important;
}
}

.main#stats h3 a:hover {
     color: #ee9 !important;
}

/* end stats */

/* /eventlogs */

table#eventlog {
     margin-top: -21px;
     margin-bottom: 10px;
}

table#eventlog td {
     padding: 3px 10px;
}

form[action="events"] {
     background: #000;
}

.smallhead th {
     font-size: 8pt
}

.smallhead a:hover {
     text-decoration: none;
}

.smallhead a img:hover {
     filter: drop-shadow(0 0 1px #f60);
}

.mediumtags {
     font-size: 9pt;
}

.optbox {
     min-width: 16px !important;
     max-width: 16px !important;
     width: 16px !important;
     min-height: 16px;
     max-height: 16px;
     height: 16px;
     opacity: 1.0;
     border: 0;
     margin: 2px 4px;
     padding: 2px;
     overflow: hidden;
     position: relative;
}

.cells {
     text-align: center;
}

tr.tablefooter, .tablefooter td {
     background: #000 url(images/header.png) repeat-x center center !important;
     background: linear-gradient(to bottom, #002000, #000 75%) !important;
     border-top: 1px solid #494 !important;
     border-bottom: 1px solid #494 !important;
     line-height: 110%;
     padding: 6px 10px;
}

.formaction {
     text-align: right;
     margin-bottom: -5px;
}

h3[id$="con"] { /* peers h3 + tables */
     margin-bottom: -2px;
     border-radius: 0;
     padding: 6px 10px;
     font-size: 10pt;
     word-spacing: 0.1em;
     letter-spacing: 0.08em;
     background: #000;
     background: linear-gradient(to right, #000 0%, #001000 70%, #001300 90%);
     border: 1px solid #494;
}

h3[id="udpcon"] {
     width: auto;
}

table#udpconnections table {
     overflow-x: auto !important;
}

table#udpconnections th {
      padding: 5px 2px;
}

table#udpconnections table i {
     font-weight: bold;
     line-height: 150%;
     letter-spacing: 0.1em;
}

#udpconnections tr a img {
      margin-top: 3px !important;
}

#udpconnections tr:hover, #ntcpconnections tr:hover, #jobstats tr:hover, #schedjobs tr:hover, #netdboverview table tr:hover, #portfaq tr:hover, .tunneldisplay tr:hover {
     background: #020;
}

#udpconnections td, #ntcpconnections td, .tunneldisplay td {
     color: #bb7;
}

#udpconnections td:first-child {
     width: 50px;
     padding: 2px 4px;
     white-space: nowrap;
}

#udpconnections tr:hover td, #ntcpconnections tr:hover td, .tunneldisplay tr:hover td {
     color: #ee9;
}

#udpconnections tr.tablefooter td, #ntcpconnections tr.tablefooter td {
     color: #ee9;
     text-align: center;
}

#udpconnections tr.tablefooter td:first-child, #ntcpconnections tr.tablefooter td:first-child {
     padding-left: 6px;
     text-align: left;
}

#udpconnections tr.tablefooter:hover td {
     border-top: 1px solid #494;
}

#udpconnections tr.tablefooter td:first-child {
     padding-left: 9px;
}

#udpconnections td[class="cells"]:first-child, #ntcpconnections td[class="cells"]:first-child {
     width: 50px;
     white-space: nowrap;
     text-align: right;
}

#udpconnections td > *, #ntcpconnections td > *,
#profiles td > *, #floodfills td > * {
     vertical-align: middle !important;
}

#ntcpconnections td[class="cells"]:last-child {
     font-weight: bold !important;
     width: 100px;
}

#ntcpconnections {
     overflow-x: scroll !important;
}

#profilelist a[href^="viewprofile"] {
     display: inline-block;
     margin-bottom: 2px;
}

.backlogged {
     font-size: 14pt;
     line-height: 0;
}

pre#transports {
     border: 1px solid #494;
     padding: 15px 0 5px 15px;
     margin: 0 20px 0 0;
     background: #000;
     width: calc(100% - 17px);
}

a[name="chelp"]:hover, a[name="help"]:hover, a[name="chelp"]:active, a[name="help"]:active { /* hide /help anchorpoints */
     color: #ee9 !important;
     text-decoration: none;
     text-shadow: none;
}

#oldhome td.optionsave {
     background: none;
}

#oldhome input[type="checkbox"] {
     vertical-align: sub;
     min-width: 16px;
     min-height: 16px;
}

.homelinkedit td:first-child {
     width: 115px;
}

.homelinkedit th:nth-child(3), .homelinkedit th:last-child {/* /confighome */
     text-align: left !important;
     text-transform: none !important;
     padding-left: 5px;
}

.homelinkedit input[type="text"] {
     margin-left: 0;
}

.homelinkedit tr:nth-last-child(1) td:first-child {
     text-align: right;
}

#config_homepage input.delete {
     float: left;
}

.formaction#homesites {
     margin-bottom: -2px !important;
}

.formaction#homeapps, .formaction#homesites, .formaction#tunnelconfigsave, .formaction#homesearch, .formaction#sidebardefaults {
     border: 1px solid #494;
     padding: 5px;
     background: #000;
     margin-top: -2px;
}

.formaction#themeui {
     border: 1px solid #494;
     padding: 5px;
     margin: 5px -8px -1px;
}

.formaction#homesearch {
     margin-bottom: -2px !important;
}

tr#addnew, tr#addnew:hover {
     border-top: 1px solid #494;
     background: #000800;
}

/* /configui lang selection boxes + theme selection */

.themechoice {
     background: #000;
     background: linear-gradient(to bottom, #010 0%, #000 100%);
     width: 120px;
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
     border: 1px solid #262;
     float: left;
     text-align: center;
     padding: 0 4px;
     margin: 4px;
     border-radius: 2px;
}

.themechoice:hover {
     border: 1px solid #f60;
     background: #000;
}

.themechoice object {
     opacity: 0.6;
}

.themechoice .optbox:checked + object {
     filter: none;
     opacity: 1;
}

.themechoice:hover object {
     filter: drop-shadow(0 0 1px #f60);
     transition: ease transform 0.05s;
}

.themechoice:hover .themelabel {
     border-top: 1px solid #f60 !important;
     background: #000;
}

.themechoice:active .themelabel {
     background: #f60 !important;
     color: #ee9 !important;
     box-shadow: inset 0 0 0 1px #000 !important;
}

.themechoice .optbox:checked + object, .themechoice .optbox:checked + img {
     transform: scale(0.9);
}

.themechoice .optbox:hover + object ~ .themelabel {
     color: #f60;
}

.themechoice .optbox:checked + object ~ .themelabel {
     background: #030 !important;
     color: #ee9;
     font-weight: bold;
     box-shadow: none !important
}

.themechoice .optbox:focus + object ~ .themelabel {
     color: #f60 !important;
     box-shadow: inset 0 0 10px 3px #000 !important;
}

.themechoice .optbox:active + object ~ .themelabel {
     color: #ee9 !important;
     box-shadow: inset 0 0 0 1px #000 !important;
}

.themechoice .optbox {
     min-width: 124px !important;
     min-height: 80px !important;
     outline: 1px !important; /* placement guide */
     opacity: 0; /* hide the radio icon so we can use thumbnail img instead */
     margin-left: -38px;
     z-index: 999;
     position: absolute;
}

.themechoice object {
     padding: 3px 0;
}

.themechoice img {
     padding: 3px 0;
}

@-moz-document url-prefix() { /* fixes weird height variation */
.themechoice img {
     padding-bottom: 0 !important;
}
}

#themeoptions {
     clear: both;
     border-top: 1px solid #494;
     margin: 0 -7px 5px;
     position: relative;
     top: 8px;
     padding: 5px 10px 8px 5px;
}

#themeoptions br {
     display: none;
}

#themeoptions label {
     white-space: nowrap;
     margin: 4px 10px 4px 0 !important;
     display: inline-block;
}

p#helptranslate {
     position: relative;
     top: 8px;
     margin: 0 -7px;
     padding: 15px 10px 15px 50px !important;
     text-align: left !important;
     border-top: 1px solid #494;
     border-bottom: 1px solid #494;
     background: url(/themes/console/images/info/notice.png) left 14px center no-repeat, #000;
     background-size: 28px 28px;
}

#themeoptions input {
     margin: 1px 5px;
}

#themeoptions input[type="checkbox"] {
     min-height: 16px;
}

.themelabel {
     border-top: 1px solid #262 !important;
     margin-left: -4px;
     margin-right: -4px;
     padding: 4px 2px 5px;
     background: #001000;
     background: linear-gradient(to bottom, #001000, #001900 50%, #000 51%, #000);
     color: #bb7;
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
}

h3#themeheading, h3#langheading, h3#passwordheading {
     border-radius: 0;
     border: 1px solid #494;
     padding: 8px 10px;
     font-size: 10.5pt;
     word-spacing: 0.1em;
     letter-spacing: 0.08em;
     margin-bottom: 0;
     background: #000;
     background: linear-gradient(to right, #000 0%, #001000 70%, #001300 90%);
}

#themesettings {
     clear: both;
     border: 1px solid #494;
     padding: 8px 7px 0;
     margin: -1px 0;
     background: #000;
}

#themesettings hr {
     display: none;
}

td#themeselect {
     clear: both;
     border: 1px solid #494;
     padding: 8px 7px 0;
     margin: -1px 0;
}

.langselect { /* containing box for lang selection */
     background: #000;
     background: linear-gradient(to bottom, #010 0%, #000 80%);
     width: 120px;
     float: left;
     margin: 4px;
     text-align: center;
     border: 1px solid #262;
     padding: 8px 4px 0;
     border-radius: 2px;
}

.langselect:hover {
     border: 1px solid #f60;
     background: #000;
}

/* can we use the flags as the radio icon? */

.langselect img {
     border: 1px solid #002000;
     margin-bottom: 2px !important;
     margin-top: -2px !important;
}

.langselect .optbox {
     opacity: 0;
     outline: 1px dotted !important;
     min-width: 124px !important;
     margin: -7px 0 -34px -2px;
     min-height: 66px;
     vertical-align: text-bottom;
     text-align: center;
     z-index: 999;
}

.langselect img {
     border: 1px solid #002000;
     margin-bottom: 0;
     margin-left: -71px;
     margin-top: 7px !important;
     position: absolute;
}

.langselect img[src="/flags.jsp?c=a1"] {
     width: 16px !important;
     height: 11px !important;
}

.langselect input + img {
     opacity: 0.6;
     transition: ease all 0.3s;
}

.langselect input:hover + img {
     box-shadow: 0 0 2px 1px #f60;
     transition: ease all 0.3s;
     opacity: 1;
}

.langselect input:hover + img + div.ui_lang {
     color: #f60;
     border-top: 1px solid #f60;
     background: #000;
}

.langselect input:focus + img + div.ui_lang {
     color: #f60 !important;
     box-shadow: inset 0 0 10px 3px #000 !important;
}

.langselect input:active + img + div.ui_lang {
     color: #ee9 !important;
     box-shadow: inset 0 0 0 1px #000 !important;
}

.langselect:hover .ui_lang {
     border-top: 1px solid #f60;
     background: #000;
     color: #f60;
}

.langselect:active .ui_lang {
     background: #f60 !important;
     color: #ee9 !important;
     box-shadow: inset 0 0 0 1px #000;
}

.langselect input[name="lang"]:checked + img, .langselect input[name="lang"]:checked + #config_ui img[src="/flags.jsp?c=a1"] {
     width: 19px !important;
     height: 13px !important;
     border: 1px solid #f60;
     box-shadow: 0 0 1px #f30;
     margin-top: 6px !important;
     margin-left: -72px;
}

.langselect input[name="lang"]:checked + img + div.ui_lang {
     background: #030 !important;
     color: #ee9;
     font-weight: bold;
}

/* large flags */

.langselect img {
     width: 40px;
     height: 40px;
     border: none !important;
     margin-top: -6px !important;
     margin-left: -82px;
     position: absolute;
     box-shadow: none;
     opacity: 0.6;
     filter: drop-shadow(0 0 1px #000);
}

.langselect input[name="lang"]:checked + img, .langselect input[name="lang"]:checked + #config_ui img[src="/flags.jsp?c=a1"] {
     width: 32px !important;
     height: 32px !important;
     border: none !important;
     margin-left: -78px;
     margin-top: -2px !important;
     margin-bottom: 0;
     box-shadow: none !important;
     opacity: 1;
}

.langselect input:hover + img {
     box-shadow: none !important;
     transition: none !important;
     filter: drop-shadow(0 0 1px #f60);
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
.langselect img {
     margin-left: -19px !important;
     margin-top: -31px !important;
}

.langselect input[name="lang"]:checked + img, .langselect input[name="lang"]:checked + #config_ui img[src="/flags.jsp?c=a1"] {
     margin-left: -15px !important;
     margin-top: -27px !important;
}
}

/* end large flags */

/* end flag as radio icons */

div.ui_lang { /* lang text label */
     text-align: center;
     background: #001000;
     background: linear-gradient(to bottom, #001000, #001900 50%, #000 51%, #000);
     padding: 3px 2px 4px;
     overflow: hidden;;
     text-overflow: ellipsis;
     white-space: nowrap;
     margin: 10px -4px 0 !important;
     border-top: 1px solid #262;
     border-radius: 0 0 2px 2px;
     text-transform: capitalize;
     color: #bb7;
}

p#helptranslate {
     clear: both;
     padding: 6px 10px 10px;
     text-align: right;
}

h3#langheading {
     margin-bottom: 0;
}

div#langsettings {
     border: 1px solid #494;
     padding: 8px 7px 12px;
     margin-top: -1px;
     margin-bottom: -12px;
     background: #000;
}

#langsettings hr {
     display: none;
}

.formaction#langui {
     margin: 7px -8px -15px;
     padding: 5px;
     border: 1px solid #494;
     background: #000;
}

/* console password layout */

h3#passwordheading {
     margin-top: 25px;
     margin-bottom: -2px;
}

table#consolepass th:nth-child(2) {
     text-align: left;
}

table#consolepass td:first-child {
     width: 100px;
     white-space:nowrap;
}

table#consolepass th {
     padding: 5px;
}

table#consolepass td {
     padding: 2px 3px;
}

table#consolepass td {
     border-bottom: 1px solid #494;
     padding: 5px 10px;
}

table#consolepass input {
     margin: 5px;
}

table#consolepass td#pw_adduser {
     padding: 5px 10px;
     background: #000;
}

td#pw_adduser input {
     margin: 5px 20px 5px 5px !important;
}

table#consolepass input[name="name"] {
     margin-right: 20px;
}

table#consolepass input[type="password"] {
     width: 200px;
}

.formaction#consolepass {
     margin-bottom: -2px !important;
     margin-top: -2px;
     border: 1px solid #494;
     padding: 5px;
     background: #000;
}

#consolepass input[name="name"], #externali2cp input[name="user"] {
     background: #000 url(/themes/console/images/buttons/user.png) 5px center no-repeat;
     background: url(/themes/console/images/buttons/user.png) 5px center no-repeat, linear-gradient(to bottom, #000 0%, #010 100%);
     padding: 4px 5px 4px 26px !important;
     background-size: 16px 16px, 100% 100% !important;
}

#consolepass input[name="name"]:focus, #externali2cp input[name="user"]:focus {
     background: #000 url(/themes/console/images/buttons/user.png) 5px center no-repeat !important;
}

#consolepass input[name="nofilter_pw"], #externali2cp input[name="nofilter_pw"] {
     background: #000 url(/themes/console/images/buttons/password.png) 3px center no-repeat;
     background: url(/themes/console/images/buttons/password.png) 3px center no-repeat, linear-gradient(to bottom, #000 0%, #010 100%);
     padding: 4px 5px 4px 22px !important;
     background-size: 16px 16px, 100% 100% !important;
}
#consolepass input[name="nofilter_pw"]:focus, #externali2cp input[name="nofilter_pw"]:focus {
     background: #000 url(/themes/console/images/buttons/password.png) 3px center no-repeat !important;
}

/* end /configui mods */

form[action="/createreseed"] > h3 {
     border-radius: 0;
     border: 1px solid #494;
     padding: 10px;
     font-size: 10.5pt;
     word-spacing: 0.1em;
     letter-spacing: 0.08em;
     background: linear-gradient(to right, #000 0%, #001000 70%, #001300 90%);
     margin-bottom: -13px;
}

table#configclient {
     margin-top: -11px !important;
}

/* configfamily */

table#newfamily, #leavefamily {
     margin-bottom: 10px !important;
}

#exportfamily tr:nth-child(2) td:first-child {
     background: #000 url(/themes/console/images/info/export_key.png) 12px center no-repeat;
     padding: 15px 15px 15px 50px;
     background-size: 28px 28px;
}

#leavefamily {
     margin-top: 14px !important;
}

#leavefamily tr:last-child td:first-child {
     background: #000 url(/themes/console/images/info/leave_family.png) 12px center no-repeat;
     padding: 15px 15px 15px 50px;
     background-size: 28px 28px;
}

/* configreseed */

table#reseedconfig input[type="text"], table#reseedconfig input[type="password"] {
     width: 170px;
}

#reseedconfig input, #reseedconfig textarea {
     margin-left: 0;
}

#reseednow {
     margin-top: -16px !important;
}

.formaction#resetreseed {
     margin: -4px -5px 0 0;
}

table#reseedconfig textarea, #i2pupdates textarea {
     width: 100%;
     resize: none;
}

#reseedconfig tr:nth-child(2) br {
     display: none;
}

#reseedconfig tr:nth-child(2) label {
     white-space: nowrap;
     margin-right: 10px;
}

#reseedconfig td:first-child {
     line-height: 120%;
}

.formaction#shutdown, .formaction#restart, .formaction#systray, .formaction#runonstart, .formaction#dumpthreads, .formaction#browserstart {
     border: 1px solid #494;
     padding: 5px;
     background: #000;
     margin-top: -11px;
     margin-bottom: 8px;
}

ul#banlist {
     margin-top: -2px;
}

#profiles #banlist {
     border: none;
     margin: 0;
}

/* /confignet */

h3#iptransport {
     margin-bottom: 11px;
}

p#defaultswork {
     margin-bottom: 11px !important;
}

p#upnpconfig, p#ipchange, p#ipv6config, p#tcpconfig, p#confignotes, p#defaultswork {
     padding: 10px;
     border: 1px solid #494;
     margin-bottom: -13px;
     margin-top: -12px;
}

p#defaultswork {
     padding: 15px 10px 15px 45px !important;
}

p#confignotes {
     margin-bottom: -21px;
     padding: 15px 15px 15px 50px;
     background: url(images/infohelp.png) 12px center no-repeat;
}

p#ipconfig, p#ipv4config, p#udpconfig, p#externaltcp {
     border: 1px solid #494;
     border-bottom: none;
     padding: 10px;
     background: #001000;
}

table#bandwidthconfig {
     margin-bottom: 1px;
}

table#bandwidthconfig td:first-child {
     width: 200px;
     white-space: nowrap;
}

table#bandwidthconfig {
     padding: 5px 10px !important;
}

table#bandwidthconfig input, table#bandwidthconfig select {
     margin-right: 3px;
}

/* confignet tidyup */

#netconfig .optbox {
     margin: 10px 6px 2px !important;
     display: inline-block !important;
     vertical-align: sub !important;
}

#netconfig .optbox:first-child {
     margin-top: 6px !important;
     margin-bottom: 6px !important;
}

#netconfig .optbox:last-child, #netconfig .optbox[value="only"], #netconfig .optbox[name="disableUDP"], #netconfig .optbox[value="disabled"] {
     margin-bottom: 6px !important;
}

#netconfig input[type="text"] + br + .optbox, #netconfig .optbox[name="ntcpAutoPort"] {
     margin-top: 3px !important;
}

#netconfig input[name*="ost"] {
     width: 250px !important;
}

/* end confignet tidyup */
/* end /confignet */

/* /events */

div.eventspanel {
     margin-top: -10px;
}

form[action="events"] {
     border: 1px solid #494;
     margin-top: -11px;
     padding: 10px 20px 10px;
     margin-bottom: 20px;
}

form[action="events"] > br {
     display: none;
}

form[action="events"] > .formaction {
     margin-bottom: -11px !important;
     margin-right: -21px;
     margin-left: -21px;
}

.eventspanel th {
     text-align: left;
     padding-left: 10px;
     font-size: 10pt;
     text-transform: uppercase;
     letter-spacing: 0.08em;
     word-spacing: 0.1em;
}

.eventspanel table {
     font-size: 9pt;
}

.eventspanel table tr:hover {
     background: #002000;
}

.eventspanel table td {
     padding: 5px 10px;
}

table#addkeyring td:first-child {
     width: 170px;
     white-space: nowrap;
     font-weight: bold;
     padding-right: 0;
}

table#addkeyring tr:last-child {
     border-top: 1px solid #494;
     background: #000;
}

table#addkeyring tr:last-child td {
     padding-right: 6px;
}

#addkeyring textarea, #addkeyring input[type="text"] {
     width: 95%;
     width: calc(100% - 15px);
}

p#keyringhelp, p#webappconfig, p#availableplugins, p#pluginconfigtext, p#clientdefaultshelp, p#bwshare, p#editclients, p#upnpstatus, p#gatherstats {
     background: #000 url(images/infohelp.png) 12px center no-repeat;
     border: 1px solid #494;
     padding: 15px 15px 15px 50px;
}

p#gatherstats {
     margin-bottom: 28px !important;
}

#webappconfig th:first-child {
     text-align: right;
}

#webappconfig th, #clientconfig th {
     text-align: center;
}

.configtable#webappconfig tr:last-child, .configtable#clientconfig tr:last-child {
     border-top: 1px inset #131;
}

p#availableplugins {
     margin: 12px 0 -1px;
}

p#webappconfig + p, p#pluginconfigtext {
     margin-bottom: -1px;
}

#pluginconfig th:first-child, #pluginconfig td:first-child {
     text-align: right;
     width: 100px;
     white-space: nowrap;
     padding-right: 50px;
}

#pluginconfig td:last-child table {
     padding: 5px;
     margin: 5px 15px 5px 5px !important;
     width: 99%;
     width: calc(100% - 8px);
}

#pluginconfig table {
     border: 1px solid #151;
     filter: drop-shadow(0 0 3px #000);
}

#pluginconfig table td:first-child {
     width: 70px !important;
     white-space: nowrap;
     padding-right: 5px;
}

/* /advanced */

input[name="ff"] + br {
     display: none;
}

input[name="ff"] + br + input[name="ff"] + br {
     display: none;
}

.wideload > form > input[type="hidden"] + table  + p + hr + .formaction {
     border-left: none;
     border-right: none;
}

input[type="hidden"] + p {
     border: 1px solid #494;
     padding: 10px;
     margin-bottom: -21px;
     background: #000;
}

form[action="configclients"]:first-child > input[type="hidden"] + p {
     border: 1px solid #494;
     padding: 10px;
     margin-top: -1px !important;
     margin-bottom: -21px;
     background: #000;
}

input[type="hidden"] + p + p {
     border: 1px solid #494;
     padding: 10px;
     margin-top: 20px;
     margin-bottom: -21px;
     background: #001000;
}

h3#exploratorytunnels {
     margin-top: 15px;
}

h3.tabletitle + .statusnotes, table.tunneldisplay {
     margin-top: -1px;
}

.tunnels_client th:first-child, .tunnels_client td:first-child {
     width: 4%;
}

.tunnels_client th:nth-child(2), .tunnels_client th:nth-child(3),
.tunnels_client td:nth-child(2), .tunnels_client td:nth-child(3) {
     width: 7%;
     white-space: nowrap;
}

.statusnotes + .statusnotes {
     margin-top: -6px;
}

.statusnotes:last-child {
     margin-bottom: 10px;
}

form > table {
     font-size: 9pt;
}
/* configtunnels */

table#tunnelconfig td:first-child {
     font-weight: bold;
}

.formaction#tunnelconfigsave {
     margin-top: -32px !important;
}

/* end /configtunnels */

/* /configupdate */

#i2pupdates {
     margin-top: 11px;
     margin-bottom: 10px;
}

#i2pupdates td:first-child {
     width: 15%;
     white-space: nowrap;
     padding-left: 10px;
     line-height: 120%;
}

#i2pupdates td {
     padding: 2px 3px;
}

#i2pupdates td:first-child::before {
     content: "";
     display: inline-block;
     min-height: 32px;
     vertical-align: middle;
}

#i2pupdates .optbox {
     margin-left: 10px;
}

#i2pupdates input[name*="URL"], #i2pupdates textarea {
     width: 98%;
     width: calc(100% - 17px);
}

#i2pupdates tr:last-child td {
     padding-right: 6px;
     background: #000 !important;
}

/* /configlogging */

input[name="logfilename"], input[name="logformat"], input[name="logdateformat"], input[name="logfilesize"], select[name="defaultloglevel"], select[name="newloglevel"] {
     width: 125px;
}

table#loggingoptions td {
     padding: 6px;
}

table#loggingoptions td:first-child {
     padding-right: 3px;
}

#loggingoptions td:nth-child(2) {
     width: 170px;
}

#loggingoptions tr:nth-last-child(2) {
     white-space: nowrap;
}

#loggingoptions input[type="text"], #loggingoptions select, #loggingoptions textarea {
     min-width: 170px !important;
     margin: 3px;
}

#loggingoptions textarea {
     width: 99%;
     width: calc(100% - 8px);
     margin-bottom: 8px;
     resize: none;
}

#loggingoptions select[name="newlogclass"] {
     width: calc(100% - 185px);
}

/* configsidebar */


#config_summarybar .configtable td:not(.optionsave) {
     padding-left: 45px;
     background: url(/themes/console/images/info/interval.png) 12px center no-repeat #000;
     background-size: 28px 28px;
}

table#sidebarconf {
     margin-top: -1px;
}

#sidebarconf tr:hover, .homelinkedit tr:hover {
     background: #002000;
}

#sidebarconf + .formaction {
     margin-bottom: -3px !important;
}

#sidebarconf button {
     margin: 5px 3px !important;
     padding: 5px 4px !important;
     min-width: 0;
     display: inline-block !important;
}

#sidebarconf button img {
     width: 12px;
     height: auto;
}

#sidebarconf th:nth-child(1) {
     text-align: center;
}

#sidebarconf th:nth-child(2) {
     text-align: left;
}

#sidebarconf td:first-child {
     width: 60px;
}

#sidebarconf td:nth-child(3), #sidebarconf td:nth-child(4) {
     width: 1%;
     padding: 0;
     white-space: nowrap;
}

#sidebarconf td:nth-child(3) {
     padding-left: 0;
}

#sidebarconf td:nth-child(4) {
     text-align: left;
     padding-right: 5px;
}

#sidebarconf tr:last-child {
     background: #000;
     border-top: 1px solid #494;
}

#sidebarconf tr:last-child td:last-child {
     padding: 0;
     text-align: center;
}

#sidebarconf select {
     margin-left: 0;
     width: 100%;
}

#sidebarconf th:nth-child(1), .homelinkedit th:first-child, #consolepass th:first-child {
     text-align: center;
     background: url(/themes/console/images/buttons/delete.png) center center no-repeat, linear-gradient(to bottom, #001000, #001900 50%, #000 51%, #000) !important;
     background: url(/themes/console/images/buttons/delete.png) center center no-repeat, linear-gradient(to bottom, #002000, #000 75%) !important;
     text-indent: -99999px;
}

/* end configsidebar */

/* /configservice */

h3#shutdownrouter, h3#restartrouter, h3#servicedebug, h3#browseronstart, h3#rononstartup, h3#systray {
     margin-bottom: -6px;
}

h3#shutdownrouter + p, h3#restartrouter + p, h3#servicedebug + p, h3#browseronstart + p, h3#runonstartup + p, h3#systray + p { /* info paragraphs */
     border-bottom: none;
     margin: 5px 0 -20px !important;
}

h3#servicedebug + p + p {
     padding: 10px;
     border: 1px solid #494;
     border-bottom: none;
     margin-bottom: -21px;
     background: #001000;
     margin-top: 20px;
}

h3#servicedebug a, h3#graphinfo a {
     float: right;
     font-size: 9pt;
     text-transform: none;
     letter-spacing: normal;
}

/* end /configservice */

/* /tunnels */

.main#tunnels h3 {
     padding-right: 5px;
}

.main#tunnels h3 a {
     float: right;
}

.main#tunnels h3 a:not(old), #criticallogs + h3.tabletitle a:not(old) {
     font-size: 0;
}

.main#tunnels h3 a[href^="/configtunnels#"]::after, #criticallogs + h3.tabletitle a::after {
     content: url(/themes/console/images/buttons/configure.png);
     float: right;
     padding: 0;
}

.main#tunnels h3 a[href^="/configtunnels#"]:hover, h3.tabletitle a:hover::after,
.main#tunnels h3 a[href^="/configtunnels#"]:focus, h3.tabletitle a:focus::after {
     filter: drop-shadow(0 0 1px #f60);
}

/* end /tunnels */

/* configclients */

table#clientconfig th:first-child {
     text-align: right;
     padding-right: 5px;
}

table#clientconfig th:last-child {
     text-align: left;
     padding-left: 5px;
}

.formaction#clientsconfig, .formaction#webappconfigactions, .formaction#pluginconfigactions {
     border: 1px solid #494;
     padding: 5px;
     background: #000;
     margin-bottom: -1px;
}

.formaction#webappconfigactions, .formaction#pluginconfigactions {
     margin-top: -2px;
}

#webappconfig th:last-child {
     text-align: left;
}

table#externali2cp {
     margin-bottom: 4px !important;
}

.infohelp#clientconf {
     margin-bottom: -2px;
}

/* end /configclients */

/* /help */

.main#help h3 {
    padding: 7px 10px;
    font-size: 11pt;
}

#volunteer, #legal, #sidebarhelp, #volunteer, #reachabilityhelp, #configurationhelp, #advancedsettings, #faq {
     border: 1px solid #494;
     padding: 0 20px;
     margin: 10px 0 15px;
     background: #000;
}

#volunteer {
     background: #000 url(images/scarface.jpg) right bottom no-repeat;
     background-size: auto 75%;
}

#advancedsettings {
     padding: 0 15px 10px;
}

.main#help h2 {
     font-size: 12pt;
}

#legal h2, #sidebarhelp h2, #volunteer h2, #reachabilityhelp h2, #configurationhelp h2, #advancedsettings h2, #faq h2 {
     padding: 10px;
     text-transform: uppercase;
     font-size: 11pt;
     text-align: left;
     letter-spacing: 0.08em;
     word-spacing: 0.1em;
     border-radius: 0;
     margin: -1px -21px 10px !important;
     background: linear-gradient(to right, #000 0%, #001000 70%, #001300 90%);
}

#advancedsettings h2 {
          margin: -1px -16px 15px !important;
}

table#configinfo {
     border: none !important;
     margin: 0 auto 0;
     width: 99%;
     width: calc(100% - 20px);
}

#configinfo th {
     text-align: left;
     padding: 5px 0;
     color: #dd0;
     letter-spacing: 0.05em;
     background: #000 !important;
     border: none;
     border-bottom: 1px solid #131 !important;
     font: 9pt "Droid Sans Mono", "Noto Mono", "Lucida Console", "DejaVu Sans Mono", monospace;
}

#configinfo td {
     padding: 5px 15px;
     line-height: 140%;
     background: #000;
     text-align: justify;
}

.main#help h2 a:hover {
     color: #ee9 !important;
}

#sidebarhelp h3, #faq h3 {
     padding: 10px;
     text-transform: uppercase;
     font-size: 10.5pt;
     text-align: left;
     letter-spacing: 0.08em;
     word-spacing: 0.1em;
     border-radius: 0;
     margin: 0 -21px 10px !important;
     background: linear-gradient(to right, #000 0%, #001000 70%, #001300 90%);
     border: 1px solid #494;
}

#changelog h2 {
     padding: 10px;
     text-transform: uppercase;
     font-size: 11pt;
     text-align: left;
     letter-spacing: 0.08em;
     word-spacing: 0.1em;
     border-radius: 0;
     margin: 0 0 -11px !important;
}

#changelog pre {
     padding: 10px 10px 10px 20px;
     max-height: 600px;
     overflow-y: scroll;
     width: calc(100% - 32px);
     border-left: 1px solid #494;
     border-right: 1px solid #494;
     margin-top: 11px;
     background: #000;
}

p#fullhistory {
     text-align: right;
     margin-top: -12px;
     margin-bottom: 11px;
     border: 1px solid #494;
     padding: 6px 10px;
     background: #000;
     position: relative;
     z-index: 999;
}

ul#upnphelp li:last-child, #legal ul li:last-child {
     padding-bottom: 0;
}

.main#help td.infohelp, .main#help td.infowarn {
     background-size: 24px 24px !important;
     padding-left: 46px !important;
}

.main#help #configinfo .infowarn {
     border: none;
     border-bottom: 1px solid #000;
     box-shadow: none;
     background-size: 20px 20px !important;
     padding: 7px 10px 7px 36px !important;
}

#help li {
     text-align: justify;
     line-height: 150%;
}

#help li:last-child {
     padding-bottom: 10px;
}

#help #faq li:last-child {
     padding-bottom: 0;
}

/* mini faq */

#faq h3 {
     padding-left: 35px !important;
     background: url(/themes/console/images/info/question.png) 10px center no-repeat, linear-gradient(to bottom, #1a261a 0%, #223022 7%, #212f21 9%, #172317 21%, #091109 49%, #050d05 50%, #020602 51%, #010301 53%, #000000 56%, #000000 100%) !important;
     background-size: 18px 18px, 100% 100% !important;
     text-transform: none;
     font-size: 10.5pt !important;
     letter-spacing: 0;
     word-spacing: 0;
}

#faq p.infohelp {
     margin: -1px -11px 9px;
}

#portfaq {
     margin: 9px -10px 10px;
     width: auto;
}

#portfaq td, #portfaq th {
     padding-top: 10px !important;
     padding-bottom: 10px !important;
}

#portfaq th:first-child, #portfaq td:first-child {
     font-weight: bold;
     text-align: right;
}

#portfaq .infohelp {
     padding-top: 15px !important;
     padding-bottom: 15px !important;
}

#portfaq th {
     text-align: left;
     padding: 8px 5px !important;
}

#portfaq th[colspan="3"] {
     text-align: left;
     font-size: 10.5pt !important;
     letter-spacing: 0.08em;
     word-spacing: 0.1em;
     padding: 8px 10px !important;
}

#portfaq td[colspan="3"] {
     font-weight: normal;
}

#portfaq td:nth-child(2) {
     white-space: nowrap;
}

#portfaq td:first-child {
     padding-left: 10px;
}

#portfaq td:last-child, #portfaq td[colspan="3"] {
     text-align: justify;
     padding-right: 10px;
}

#faq ul {
     margin-bottom: 15px;
}

#faq code {
     user-select: all;
     -moz-user-select: all;
     -webkit-user-select: all;
}

#faq li code {
     margin-left: 10px;
}

/* end mini faq */
/* end help */

/* netdb (main section) */

table#netdboverview {
     margin-bottom: 10px;
}

#netdboverview td {
     padding: 0;
}

#netdbversions, #netdbtransports, #netdbcountrylist {
     border: 1px solid #131 !important;
     margin-bottom: 0;
}

#netdbcountrylist img {
     margin-right: 5px;
     text-align: right;
}

#netdbtransports {
     border-left: 1px solid transparent !important;
     border-right: 1px solid transparent !important;
}

#netdbtransports th, #netdbtransports td {
     padding-left: 10px !important;
     padding-right: 10px !important;
}

#netdbversions th, #netdbtransports th, #netdbcountrylist th {
     border-top: 1px solid transparent !important;
     padding: 3px 5px;
     line-height: 150%;
}

#netdbversions td, #netdbtransports td, #netdbcountrylist td {
     padding: 5px;
}

table[cellspacing="30"] > tbody > tr > th[colspan="3"] { /* netdb header */
     padding: 10px;
     text-transform: uppercase;
     font-size: 11pt;
     letter-spacing: 0.08em;
     word-spacing: 0.1em;
}

table[cellspacing="30"] > tbody > tr > td {
     padding: 8px;
}

table[cellspacing="30"] > tbody > tr > td > table > tbody > tr > th:first-child {
     text-align: left;
     padding: 5px;
}

table[cellspacing="30"] > tbody > tr > td:first-child > table > tbody > tr > th:first-child {
     text-align: center;
}

/* /netdb - Sybil */

th > img[src^="/imagegen"] { /* scale down header images */
     height: 24px;
     width: 24px;
     margin: -1px;
     border-left: 1px solid #494;
}

/* Advanced lookup */

#netdblookup {
     margin-bottom: -4px;
}

#netdblookup th {
     text-align: left;
     font-size: 11pt;
     letter-spacing: 0.08em;
     padding: 10px;
     text-transform: uppercase;
}

#netdblookup td:first-child {
     text-align: right;
     width: 100px;
     white-space: nowrap;
     font-weight: bold;
}

#netdblookup td:nth-child(2) {
     width: 100px;
     padding-left: 0;
}

.subheading {
     text-align: left !important;
     background: #000;
     padding: 10px;
     border: 1px solid #494;
}

.subheading b {
     font-size: 10pt !important;
}

#netdblookup .optbox {
     margin: 10px ;
}

#netdblookup .optionsave {
     padding: 10px !important;
}

#netdb .tabletitle {
     margin-bottom: -2px !important;
}

.sybil_distance th {
     text-align: left;
     padding: 5px;
}

.sybil_distance th:last-child, .sybil_distance td:last-child {
     text-align: right;
}

.sybil_distance tr:nth-child(n+2):hover {
     background: #000;
}

.sybil_distance:last-child {
     margin-bottom: 8px;
}

/* leasesets */

.netdb_leases, .netdb_leases li, .netdb_leases li:first-child {
     margin: 0 !important;
}

.netdb_leases {
     columns: auto 420px !important;
     column-rule: 1px solid #131;
     column-gap: 1em;
}

.netdb_leases li {
     list-style: none;
     display: inline-block;
     padding: 1px 20px 1px 0;
     margin: 1px 0;
     min-width: 400px;
}

.netdb_leases li b:first-child {
     display: inline-block;
     min-width: 80px !important;
     text-align: right;
     margin: 0 !important;
     padding: 0 !important;
}

.netdb_gateway {
     margin-left: 0 !important;
     margin-right: -10px !important;
     vertical-align: bottom;
}

.netdb_tunnel {
     display: inline-block;
     background: #030;
     padding: 2px 4px;
     margin-left: 3px;
     margin-right: -3px;
     border-radius: 2px;
}

.netdb_leases .tunnel_id {
     min-width: 74px;
}

.netdb_leases .tunnel_peer, .tunneldisplay .tunnel_peer {
     min-width: 64px;
}

.netdb_leases .tunnel_peer tt, .netdb_leases .tunnel_peer tt a {
     font-size: 8.5pt !important;
     font-weight: bold !important;
}

.netdb_leases .tunnel_peer tt, .netdb_leases .tunnel_peer a {
     letter-spacing: 0.1em !important;
     margin: 0 !important;
     padding: 0 !important;
}

.main li .netdb_expiry {
     font-weight: normal;
     text-transform: lowercase;
     font-style: italic;
}

img.unknownflag {
     opacity: 0.8;
}

/* end leasesets */
/* end netdb */

/* logs */

#logs pre, #logs li {
     font-weight: bold;
}

#criticallogs ul { /* tidy router logs ul */
     border: 1px solid #494;
     margin: -6px -11px !important;
}

#criticallogs ul:empty {
     display: none;
}

#enviro, #criticallogs, #routerlogs, #eventlogs, #wrapperlogs {
     margin-top: -11px;
}

#bugreports {
     margin-top: 15px;
}

#bugreports td {
     background: url(images/infohelp.png) 12px center no-repeat !important;
     padding: 15px 10px 15px 50px;
}

#enviro:hover {
     -moz-user-select: all;
     --webkit-user-select: all;
     user-select: all;
     cursor: text;
}

#enviro:hover td {
     background: #010;
     border-top: 1px inset transparent;
     border-bottom: 1px inset transparent;
     color: #ff0;
}

#enviro td {
     font-weight: normal !important;
     padding: 5px 10px;
}

#enviro td:first-child {
     width: 1%;
     text-align: right;
     padding-right: 0;
     white-space: nowrap;
}

#criticallogs td , #routerlogs td, #eventlogs td, #wrapperlogs td {
     font-weight: normal !important;
     padding: 5px 10px;
     border-top: 1px solid #494;
}

table#criticallogs tr:first-child {
     display: none;
}

table[id$="logs"] tr:nth-child(odd){
     background: #010;
}

table[id$="logs"] tr:nth-child(even){
     background: #000;
}

table[id$="logs"] ul {
     margin: -6px 12px -5px -18px !important;
}

#wrapperlogs {
     width: 100%;
     table-layout: fixed;
     margin-bottom: 10px;
}

#wrapperlogs tr:last-child td {
     padding: 0 !important;
}

#wrapperlogs pre {
     margin-bottom: 0 !important;
     white-space: pre-wrap;
     width: 99%;
     width: calc(100% - 5px);
     resize: none;
     max-height: 600px;
     padding: 0 0 0 5px !important;
}

.logtable ul li {
     list-style: none !important;
     margin-left: 15px;
}

#logs li {
     list-style: none;
     font: bold 8.5pt "Droid Sans Mono",  "Lucida Console", "DejaVu Sans Mono", monospace;
     line-height: 120%;
     text-align: left;
     display: inline-block;
     width: 100%;
     word-break: break-all;
}

#criticallogs li {
     width: auto;
     width: calc(100% - 15px);
     margin: 2px -10px 2px 7px;
}

#logs li::after {
     content: "";
     display: block;
     border-top: 1px dashed #001000;
     width: 100%;
     margin: 3px 0 -6px;
}

#logs li:last-child::after {
     border: none;
     margin: 0;
}

#logs font[color^="#"]::before {
     content: "";
     display: inline-block;
     width: 6px;
     height: 6px;
     margin-left: 0;
     margin-right: 5px;
     border-radius: 50%;
     vertical-align: calc(1px);
}

font[color="#cc0000"] {
     color: #900 !important;
}

#logs li font[color="#cc0000"]::before {
     background: #900;
}

font[color="#006600"] {
     color: #ee7 !important;
}

#logs li font[color="#006600"]::before {
     background: #ee7;
}

font[color="#ff3300"] {
     color: #990 !important;
}

#logs li font[color="#ff3300"]::before {
     background: #990;
}

font[color="#bf00df"] {
     color: #880 !important;
}

#logs li font[color="#bf00df"]::before {
     background: #880;
}

font[color="#000099"] {
     color: #660 !important;
}

#logs li font[color="#000099"]::before {
     background: #660;
}

/* end logs */

/* /profiles */

#profilelist tr:hover, table#floodfills tr:hover {
     background: #030;
}

#profilelist tr:hover td, table#floodfills tr:hover td {
     color: #ee9;
}

#profilelist td:last-child {
     text-align: center !important;
}

#profilelist th, #profilelist td {
     text-align: right;
     padding-left: 5px;
}

#profilelist td {
     color: #bb7;
}

#profilelist td:nth-child(2), #profilelist th:nth-child(2) {
     text-align: left;
}

#profilelist td:first-child, #profilelist th:first-child {
     width: 40px;
}

#profilelist td:first-child {
     text-align: right !important;
     padding-left: 3px !important;
}

#profilelist td:first-child, #profilelist th:first-child, #profilelist td:nth-last-child(2), #profilelist th:nth-last-child(2) {
     white-space: nowrap;
     text-align: center;
}

#profilelist td:nth-child(3) {
     letter-spacing: 0.1em;
}

#profilelist th:last-child {
     padding-right: 10px;
}

#profilelist td:last-child {
     text-align: right;
     width: 60px;
     white-space: nowrap;
}

#profilelist td[colspan="9"] { /* profile class separator */
     background: #040;
     padding: 1px;
     border: 1px inset #000;
}

a[href^="configpeer?peer"] {
     font-size: 0;
     filter: drop-shadow(0 0 1px #777);
}

a[href^="configpeer?peer"]::after {
     content: url(/themes/console/images/buttons/edit.png);
     vertical-align: bottom;
     margin-left: 4px;
}

a[href^="configpeer?peer"]:hover {
     filter: drop-shadow(0 0 1px #f60);
}

table#profile_defs, table#thresholds {
     margin-top: -1px;
     margin-bottom: 10px;
}

table#profile_defs td, table#thresholds td {
     padding: 5px;
}

#profile_defs td:first-child {
     width: 5% !important;
     white-space: nowrap;
     text-align: right;
}

#profile_defs td:last-child {
     white-space: normal;
     line-height: 120%;
}

#thresholds th, #thresholds td {
     text-align: center;
}

#capabilities_key td {
     padding: 0 !important;
}

#capabilities_key table {
     margin: 0 !important;
     border: none;
     border-top: 1px solid #373;
     border-bottom: 1px solid #373;
}

#capabilities_key table td {
     padding: 3px 5px !important;
}

#capabilities_key table td:nth-child(even) {
     width: 16px;
}

#capabilities_key b {
     text-transform: none !important;
     display: inline-block;
     min-width: 16px;
     background: #002000;
     text-align: center;
     text-shadow: 0 1px 1px #000;
     border-radius: 2px;
     padding: 1px 2px;
}

#profile_defs b {
     text-transform: capitalize;
}

#capabilities_key b {
     text-transform: none !important;
}

table#profile_defs + hr {
     display: none;
}

table#floodfills {
     margin-bottom: 10px;
}

table#floodfills + hr {
     display: none;
}

table#floodfills th {
     text-align: center;
     max-width: 55px;
     white-space: normal;
     padding: 3px 6px;
}

table#floodfills td {
     color: #bb7;
     padding: 3px 4px !important;
     vertical-align: middle;
     text-align: right !important;
     white-space: nowrap;
}

table#floodfills th:first-child, table#floodfills td:first-child {
     width: 52px;
     white-space: nowrap;
     padding: 3px 3px 3px 0 !important;
}

.wideload h2 {
     border-radius: 0;
}

table#viewprofile {
     margin-top: -14px;
     margin-bottom: 10px;
}

table#viewprofile td {
     padding: 10px 15px 0;
}

#viewprofile pre {
     margin-bottom: 0;
     white-space: pre-wrap;
}

h3#bannedpeers {
     margin-top: 15px;
}

ul#banlist {
     border: 1px solid #494;
     background: #000;
     padding: 10px 5px 10px 0;
     margin: -1px 0 13px;
     -moz-column-count: auto;
     -moz-column-width: 280px;
     -moz-column-gap: 5px;
     -moz-column-rule: 1px dotted #494;
     -webkit-column-count: auto;
     -webkit-column-width: 280px;
     -webkit-column-gap: 5px;
     -webkit-column-rule: 1px dotted #494;
     column-count: auto;
     column-width: 280px;
     column-gap: 5px;
     column-rule: 1px dotted #151;
}

#banlist li {
     list-style: none !important;
     border-bottom: 1px dotted #151;
     margin: 0 8px 3px;
     padding-top: 3px;
     min-width: 250px;
     width: 88%;
     padding-bottom: 5px;
     break-inside: avoid;
     page-break-inside: avoid;
     -webkit-break-inside: avoid;
     display: inline-block;
}

#banlist li:first-child, .joblog ol li:first-child {
     margin-top: 0 !important;
}

ul#banlist li:last-child {
     margin-bottom: 0;
}

ul#banlist + hr {
     display: none;
}

#banlist img {
     margin-bottom: -1px;
}

#banlist a[href^="configpeer?"] {
     float: right;
     margin-right: -20px;
     margin-top: -8px;
}

/* /configpeers banlist */

#bannedips {
     margin-bottom: 10px;
}

#bannedips table {
     margin-bottom: -1px !important;
}

#bannedips td {
     vertical-align: top;
     padding: 0;
     width: 50%;
}

#bannedips table td {
     text-align: center;
     padding: 4px 2px;
}

#bannedips table tr:last-child {
     border-bottom: 1px solid #494;
}

#permabanned, #banneduntilrestart {
     margin-top: -1px !important;
     border: none;
}

#permabanned td:first-child {
     border-left: 1px solid #494;
     text-align: right;
     padding-right: 10px;
     width: 49%;
}

#permabanned td:nth-child(2) {
     width: 2%;
}

#permabanned td:last-child {
     text-align: left;
     padding-left: 10px;
     width: 49%;
}

#banneduntilrestart td {
     border-right: 1px solid #494;
     text-align: center !important;
}

#ipv4, #ipv6, #permabanned tr:nth-child(2) {
     background: #000 url(images/header.png) center center repeat-x;
     background: linear-gradient(to bottom, #002000, #000 75%) !important;
     border-top: 1px solid #494;
     border-bottom: 1px solid #494;
}

/* end /configpeers banlist */

.footnote {
     text-align: right;
     color: #494;
     font-size: 8pt;
     margin-bottom: 5px !important;
}

.footnote hr {
     margin: 10px 0 5px 0 !important;
     color: #494;
     background: #494;
     height: 1px;
     border: 0 solid #494;
}

.topness {
     font-size: 8pt;
     text-align: right;
     margin-top: 0 !important;
     margin-bottom: -5px;
     margin-right: 5px;
}

#proof p {
     margin: 15px;
     padding: 30px 5px 0;
     border: 1px solid #000;
     border-radius: 2px;
     box-shadow: inset 0 0 0 1px #020, 0 0 1px #000;
     background: url(/themes/console/images/info/rosette.png) right 8px top 8px no-repeat #001900;
     background: url(/themes/console/images/info/rosette.png) right 8px top 8px no-repeat rgba(0,32,0,0.4);
     background-blend-mode: color-burn;
}

#proof textarea {
     line-height: 160%;
     font-size: 9pt;
     overflow: hidden;
     word-break: break-all;
     white-space: pre-wrap;
     height: 200px;
}

#proof textarea:focus {
     outline: none;
}

#oldconsole p {
     margin: 15px 0 10px;
     padding: 10px 20px;
     line-height: 200%;
     border: 1px solid #000;
     border-radius: 2px;
     box-shadow: inset 0 0 0 1px #020, 0 0 1px #000;
     background: #001900;
     background: rgba(0,32,0,0.4);
}

#oldconsole b {
     display: inline-block;
     min-width: 120px;
     margin-right: 8px;
     text-align: right;
}

/* begin home page */

#home .welcome h2 {
     margin: 12px -5px !important;
}

#home .welcome .langbox {
     margin-right: -2px !important;
}

#homepanel {
     margin: 0 -8px;
}

h4.app, h4.app2 {
    background: url(images/header.png) center center repeat-x;
    border: 1px solid #449944;
    font-size: 10.5pt;
    font-variant: small-caps;
    margin: 11px -8px -9px;
    padding: 7px 8px 7px;
    text-transform: uppercase;
    text-align: left;
    letter-spacing: 0.08em;
    word-spacing: 0.1em;
    border-radius: 0;
}

h4.app2 {
     clear: left;
}

div.ag2 {
     margin: 0 0 10px;
     padding: 0;
}

div.app {
     float: left;
     padding: 2px 0 0 !important;
     min-width: 70px;
     border: 1px solid #494;
     background: #000;
     background: linear-gradient(to bottom, #010 0%, #000 100%);
     border-radius: 2px;
     margin: 2px 3px 5px;
     text-align: center !important;
     padding-top: 4px;
     opacity: 0.9;
     box-shadow: 0 1px 3px #000;
}

.app a:link, .app a:visited {
     color: #494;
     padding: 2px;
     display: inline-block;
}

div.app:hover {
    opacity: 1;
    border: 1px solid #f60;
    background: #000;
    box-shadow: none;
    color: #f60 !important;
}

div.app:active .applabel {
     background: #f60 !important;
     box-shadow: inset 0 0 0 1px #000;
}

div.app:active .applabel a {
     color: #ee9 !important;
}

div.app a:link, div.app a:hover, div.app a:active {
     text-decoration: none;
     outline: none;
}

div.app:hover a:link, div.app:hover a:visited {
    color: #f60;
}

div.app:last-child {
     margin-bottom: 10px;
}

div.appgroup {
     margin: 0 0 10px;
     padding: 16px 0;
     width: auto;
}

div.search {
     margin: 0;
     padding: 8px 8px 0 8px;
     width: auto;
}

form[action="/search.jsp"] {
     margin: 0;
}

table.search {
     background: none;
     width: 80%;
     margin-left: auto;
     margin-right: auto;
     margin-top: -9px;
}

.search tr {
     background: #000 url(images/header.png) center center repeat-x;
     background: linear-gradient(to bottom, #001000, #001900 50%, #000 51%, #000) !important;
}

.search td {
     padding: 4px;
     text-align: center;
}

.search td:nth-child(2) {
     width: 50px;
     padding: 4px 0 4px 20px;
}

.search td:last-child {
     text-align: left !important;
     width: 50px;
     padding-right: 10px;
}

input.search {
     background: #000 url(/themes/console/images/buttons/search.png) 4px center no-repeat;
     background: url(/themes/console/images/buttons/search.png) 4px center no-repeat, linear-gradient(to bottom, #000 0%, #010 100%);
     padding: 4px 3px 4px 24px;
     vertical-align: middle;
     width: 100%;
     box-shadow: inset 0 0 3px 3px #000;
}

input.search:focus {
     background: #000 url(/themes/console/images/buttons/search.png) 4px center no-repeat !important;
}

.search select {
     width: 90%;
}

button.search {
     white-space: nowrap;
}

.appimg {
     height: 32px;
     padding: 0 0 6px;
}

.app img {
     height: 32px;
     width: auto;
     max-height: 32px;
     max-width: 32px;
     padding: 10px 52px 38px;
     margin: -4px 0 1px;
/*     filter: sepia(100%) hue-rotate(70deg); enable for green-tinted app icons */
}

div.app:hover.app img, a:focus .app img {
     filter: drop-shadow(0 0 1px #f60) saturate(200%);
     opacity: 1;
     transition: filter ease 0.3s;
}

.app table {
     background: none;
     border: 0;
     margin: auto;
     width: auto;
}

.app tr {
     background: none;
     border: 0;
     margin: 0;
}

.app td {
     background: none;
     border: none;
     margin: 0;
     padding: 3px 0 0;
}

.applabel {
     font-size: 8pt;
     margin: 2px 0 0;
     padding: 3px 2px 4px;
     text-align: center;
     vertical-align: bottom;
     line-height: 95%;
     text-transform: lowercase;
     border: none;
     width: 136px;
     min-width: 72px;
     background: #001000;
     background: linear-gradient(to bottom, #001000, #001900 50%, #000 50%);
     border-radius: 0 0 2px 2px;
     border-top: 1px solid #494;
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis; /* ellipsize overlong app labels */
     color: #494;
}

.applabel:hover {
     background: #000;
     border-top: 1px solid #f60;
     color: #f60;
}

.applabel a {
     max-width: 116px;
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
     padding: 3px 2px !important;
     display: inline-block;
}

.applabel a, .applabel a:hover {
     text-decoration: none !important;
     outline: none;
}

div.app:hover .applabel {
     border-top: 1px solid #f60 !important;
     background: #000;
     color: #f60;
}

/* end home page */

iframe.iframed {
     margin: 15px 0 0;
}

#susimailframe, #i2psnarkframe {
     margin: 0;
}

#susidnsframe {
     margin: 0 0 -3px;
}

#i2psnarkframe {
     margin-bottom: -2px !important;
     background: linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,0.7)), url(images/camotile2.png);
     background-size: 100% 100%, 175px 175px;
}

#i2ptunnelframe {
     margin: 0 0 -5px;
}

/* Fixes for when app is not started and console error loads inside iframe */

body.iframed {
     background: transparent url(/themes/console/images/transparent.gif) !important;
}

.iframed .routersummaryouter {
     display: none !important;
}

.iframed h1 {
     margin: 0 5px 0 5px !important;
}

.iframed div.sorry {
     margin: -1px 5px 10px 5px !important;
}

/* end iframed console fixes */

/* global overrides */

h3[id*="job"] {
     border: 1px solid #494;
     padding: 6px;
     margin: 12px 0 10px 0;
     border-radius: 0;
     text-transform: uppercase;
     text-shadow: 0 0 2px #010;
     letter-spacing: 0.08em;
}

/* netdb */

span#distance {
     color: #dd0 !important;
}

table.netdbentry th {
     font-weight: normal;
     text-align: left;
     padding: 5px 6px;
}

table.netdbentry th:last-child {
     text-align: right;
     padding: 5px;
     white-space: nowrap;
     width: 50px;
}

table.netdbentry th:first-child {
     white-space: nowrap;
}

table.netdbentry td:first-child {
     width: 80px;
}

table.netdbentry td:nth-child(2) {
     word-wrap: break-word;
}

.netdbentry img {
     margin: 1px 0 0 0;
}

.netdbentry tr:last-child code {
     color: #bb7;
}

table.netdbentry, table.leaseset {
     width: 100% !important;
     margin-bottom: 10px;
}

table.netdbentry td, table.leaseset td, table#leasesetdebug td, .sybil_routerinfo td {
     color: #bb7 !important;
}

table.netdbentry td b, table.leaseset td b, table#leasesetdebug td b, .sybil_routerinfo td b {
     color: #ee9 !important;
}

a.viewfullentry:not(old), a[href^="viewprofile"]:not(old) {
     font-size: 0;
}

a.viewfullentry::after, a[href^="viewprofile"]::after {
     content: url(/themes/console/images/buttons/fullview.png);
     vertical-align: text-top;
}

a.viewfullentry:hover {
     filter: drop-shadow(0 0 1px #f60);
}

table#leasesetdebug th a:not(old), table#leasesetsummary th a:not(old) {
     font-size: 0;
}

table#leasesetdebug th a::after, table#leasesetsummary th a::after {
     content: url(/themes/console/images/buttons/floodfill.png);
     vertical-align: text-top;
     padding-right: 0;
}

table#leasesetdebug th a:hover, table#leasesetsummary th a:hover {
     filter: drop-shadow(0 0 1px #f60);
}

.main#certs {
     padding-top: 3px;
}

.main#certs h3 {
     margin-bottom: -16px !important;
}

.main#certs h4 {
     padding: 5px;
     margin: 15px 0 0;
     border: 1px solid #494;
     letter-spacing: 0.05em;
     font-size: 10pt;
     background: linear-gradient(to right, #000 0%, #020 100%);
}

.main#certs h3 + p {
     margin-top: 15px;
}

.main#certs p {
     margin-top: -1px;
     padding: 10px;
     border: 1px solid #494;
     background: #000;
}

.main#certs p + p:empty + h4 {
     margin-top: -13px !important;
}

.main#certs textarea {
     margin: -1px 0 11px 0;
     width: 100%;
}

.main#proof {
     padding: 0;
}

.main#proof textarea, .main#proof textarea:focus {
     padding: 5px 20px;
     margin: 0;
     width: 100%;
     border: none;
     background: none !important;
     box-shadow: none;
     color: #ee9 !important;
     filter: none;
}

#leasesetdebug, #leasesetsummary {
     margin-bottom: 14px;
}

.leaseset th {
     font-weight: normal;
     padding: 5px;
     text-align: left;
}

.leaseset th:last-child, .leaseset td:nth-child(2) {
     text-align: right;
     padding-right: 5px;
}

.addtobook {
     text-align: right;
}

.addtobook a:not(old) {
     font-size: 0;
}

.addtobook a::after {
     content: url(/themes/console/images/buttons/add_address.png);
}

.addtobook a:hover {
     filter: drop-shadow(0 0 1px #f60);
}

#leasesetdebug th, #leasesetsummary th {
     font-weight: bold;
     text-transform: uppercase;
     font-size: 10pt;
     letter-spacing: 0.08em;
     word-spacing: 0.1em;
     padding: 5px 5px 5px 10px;
}

#leasesetdebug th a, #leasesetsummary a {
     font-size: 9pt;
     text-transform: capitalize;
     letter-spacing: normal;
     word-spacing: normal;
}

#leasesetsummary td:first-child {
     width: 100px;
     white-space: nowrap;
     padding-left: 10px;
}

#leasesetdebug th:first-child, #leasesetsummary th:first-child {
     text-align:left;
     white-space: nowrap;
}

#leasesetdebug th:last-child, #leasesetsummary th:last-child {
     text-align:right;
     white-space: nowrap;
}

#leasesetdebug td:nth-child(odd) {
     width: 200px;
     white-space: nowrap;
     text-align: right;
     border-right: 1px inset #131;
}

#leasesetdebug td:nth-child(even) {
     text-align: left;
     white-space: nowrap;
}

#leasesetdebug td:nth-child(2) {
     width: 10px;
}

#noleasesets, #notinitialized, .netdbnotfound {
     background: #000 url(images/infohelp.png) 12px center no-repeat;
     padding: 15px 15px 15px 50px;
     border: 1px solid #494;
     margin-bottom: 10px;
     text-align: left;
}

#sybilnav, #sybils_summary {
     border: 1px solid #494;
     padding: 10px;
     margin-bottom: 10px;
     line-height: 160%;
     background: #000;
}

#sybilnav {
     -moz-columns: 4 200px;
     -webkit-columns: 4 200px;
     columns: 4 200px;
     padding: 10px;
}

#sybilnav li {
     break-inside: avoid;
     page-break-before: right;
     -webkit-column-break-inside: avoid;
}

#sybilnav ul li {
     list-style: none;
     padding-left: 0;
     margin-left: 0;
     margin-bottom: 5px;
     min-width: 110px;
     white-space: nowrap;
     border: 1px solid #151;
     border-radius: 2px;
     background: linear-gradient(to right, #000 0%, #010 80%);
     box-shadow: inset 0 0 0 1px #000;
}

#sybilnav ul li:hover {
     border: 1px solid #f60;
}

#sybilnav a {
     display: inline-block;
     width: 100%;
}

#sybilnav ul li:hover a {
     color: #f60;
}

#sybilnav ul li a {
     padding-right: 30%;
     box-sizing: border-box;
}

#sybilnav ul li::before {
     content: url(/themes/console/images/buttons/show.png);
     mix-blend-mode: luminosity;
     margin-right: 5px;
     font-size: 16pt;
     line-height: 50%;
     vertical-align: middle;
     padding-left: 5px;
}

#sybilnav ul li:first-child {
     margin-top: 0;
}

#sybilnav ul li:last-child {
     margin-bottom: -10px;
     padding-bottom: 2px;
}

.sybil_routerinfo {
     margin-bottom: 10px;
}

.sybil_routerinfo th {
     padding: 1px 1px 1px 6px !important;
}

.sybil_routerinfo th:first-child {
     text-align: left;
     white-space: nowrap;
}

.sybil_routerinfo:first-of-type th {
     padding: 8px 6px !important;
}

.sybil_routerinfo th:nth-last-child(2) {
     text-align: right !important;
     padding-right: 0 !important;
}

.sybil_routerinfo th:last-child {
     width: 20px;
}

.sybil_routerinfo td:first-child {
     width: 50px;
     white-space: nowrap;
}

.sybil_routerinfo code {
     margin-left: 5px;
     font-size: 9pt;
}

p.sybil_info, p.family, p.threatpoints, p.hashdist, p#sybil_totals, p.notfound {
     border: 1px solid #494;
     padding: 5px 5px 5px 30px;
     margin: 3px 0;
     color: #cc0;
     font-weight: bold;
     background: url(images/eye.png) 8px center no-repeat;
     background: url(images/eye.png) 8px center no-repeat, linear-gradient(to right, #000 0%, #001000 80%, #002000 100%);
     background-blend-mode: luminosity;
     box-shadow: inset 0 0 0 1px #300;
}

p#sybil_totals {
     font-weight: normal;
}

p.family + p.family, p.sybil_info + p.sybil_info {
     margin-top: -4px;
}

p#sybilinfo {
     line-height: 140%;
}

p.sybil_info + a[name] + table.sybil_routerinfo, p.hashdist + a[name] + table.sybil_routerinfo {
     margin-top: 10px !important;
}

.threatpoints + ul {
     background: #000;
     border: 1px solid #494;
     padding: 5px 5px 0;
     margin: -4px 0 10px;
}

.threatpoints + ul li:last-child {
     margin-bottom: 5px;
}

.sybil_routerinfo + .threatpoints + ul + a[name] + table {
     margin-top: -11px;
}

h3#known {
     margin-bottom: 0 !important;
}

h3#pairs {
     margin-bottom: 11px !important;
}

/* end netdb */

/* /confignet, /configadvanced */

h3#iptransport a, th#upnpconfig a, h3#bwlimiter a, #config_stats h3 a, #config_logging h3 a, h3#graphdisplay a, #logs h3 a, h3#advancedconfig a, .h3navlinks {
     float: right;
     font-size: 9pt;
     text-transform: none;
     letter-spacing: normal;
}

.h3navlinks a {
     text-transform: capitalize;
     letter-spacing: normal;
     margin-left: 5px;
}

.h3navlinks a:hover {
     color: #f60;
}

h3#iptransport a:not(old), h3#advancedconfig a:not(old) {
     font-size: 0;
}

h3#iptransport a::after, h3#advancedconfig a::after {
     content: url(images/help.png);
     padding: 0;
     margin: 0;
     vertical-align: text-top;
     cursor: help;
}

h3#iptransport a:hover, h3#advancedconfig a:hover {
     filter: drop-shadow(0 0 1px #f60);
}

table.configtable {
     margin-top: -1px;
     margin-bottom: -2px !important;
}

table.configtable tr:last-child {
     border-top: 1px solid #494;
}

table#netconfig th, table#externali2cp th, table#plugininstall th, table#plugininstall2 th, .configtable th, th.th_title {
    text-align: left;
    padding: 5px 10px !important;
    text-transform: uppercase;
    font-size: 10pt;
    letter-spacing: 0.08em;
    word-spacing: 0.1em;
}

.configtable td {
     padding: 6px 10px;
     background: #000;
     line-height: 180%;
}

.configtable td.tabletextarea {
     padding: 0 !important;
}

textarea#advancedsettings {
     margin: 0 !important;
     padding-top: 3px;
     width: 100%;
     resize: none;
     overflow-x: hidden;
     white-space: pre-wrap;
     border: 0 none transparent;
     border-radius: 0;
     word-break: break-all;
}

.configtable td.infohelp, p.infohelp, td.infohelp, p.infowarn, td.infowarn, p#debugmode, p#sybilinfo {
     background: #000 url(images/infohelp.png) 12px center no-repeat !important;
     padding: 15px 15px 15px 50px !important;
     text-align: justify;
     line-height: 130% !important;
     border-bottom: 1px solid #494;
     border-top: 1px solid #494;
     white-space: normal !important;
     font-weight: normal !important;
     background-size: 28px 28px !important;
}

table.logtable, #enviro {
     margin-top: -1px !important;
}

p.infohelp, p#debugmode, p#sybilinfo {
     border: 1px solid #494;
}

p.infowarn, td.infowarn {
     background: #000 url(images/infowarn.png) 12px center no-repeat !important;
     border: 1px solid #494;
     box-shadow: inset 0 0 0 1px #300;
     padding: 15px 15px 15px 50px;
     background-size: 28px 28px !important;
}

.infowarn#clientconf {
     margin: 0 0 -2px;
}

td.optionsave {
     text-align: right;
     border-top: 1px solid #494;
     padding: 5px !important;
     white-space: nowrap;
/*     width: 50px;*/
     background: #000;
}

#floodfillconfig form, #plugininstall form, #plugininstall2 form, #updateplugins form, .configtable form {
     margin-bottom: 0;
}

h3.tabletitle, h3#i2pclientconfig, h3#advancedclientconfig, h3#webappconfig, h3#pconfig, h3#pluginfromurl, h3#pluginfromfile,
h3#updateplugins, h3#pluginmanage, h3#bannedpeers, h3.ptitle, h3#transports, h3#upnpstatus, h3.sybils, #certs h3 {
     margin-bottom: 0 !important;
     border-radius: 0;
     border: 1px solid #494;
     text-transform: uppercase;
     letter-spacing: 0.08em;
     padding: 8px 10px;
}

h3#pluginmanage {
     margin-bottom: -13px !important;
}

h3.sybils {
     margin-bottom: 10px !important;
}

h3.tabletitle a {
     text-transform: lowercase;
     letter-spacing: normal;
}

h3.sybils + div, h3.sybils + a[name] + table {
     margin-top: -1px;
}

h3#transports {
     margin-bottom: -1px !important;
}

h3#upnpstatus {
     margin-bottom: 7px !important;
}

h3#upnp {
     border: 1px solid #494;
}

#upnpscan {
     border: 1px solid #494;
     margin: -11px 0 10px;
     padding: 0 15px 5px;
     background: #000;
}

h3.ptitle {
     margin-bottom: -6px !important;
}

p#webappconfigtext {
     margin: 1px 0 -2px 0;
}

table#pluginconfig, #i2pupdates, table.homelinkedit, table#peerdefs {
     margin-top: -1px;
}

#peerdefs img {
     padding-left: 0;
     margin-left: 0;
}

#peerdefs img[width="12"] {
     margin-right: 3px;
     margin-left: 2px;
}

#peerdefs td {
     line-height: 140%;
}

h3#i2pclientconfig, h3#pconfig, h3#pluginfromurl, h3#pluginfromfile, h3#webappconfig {
     margin-bottom: -14px !important;
}

table#advconf {
     margin-bottom: 9px !important;
}

p#javaclienthelp {
     border: 1px solid #494;
     background: url(images/infohelp.png) 12px center no-repeat !important;
     padding: 10px 10px 10px 50px !important;
}

div#clientsconfig {
     margin-top: -2px;
}

table#externali2cp th {
     text-align: left;
}

#tunnelconfig th {
     padding: 6px 10px;
}

#tunnelconfig th img {
     margin-bottom: -2px;
}

#tunnelconfig td:nth-child(n+2) {
     text-align: left;
}

th.th_title {
     padding: 8px 10px !important;
     text-align: left;
     background: linear-gradient(to bottom, #1a261a 0%,#223022 7%,#212f21 9%,#172317 21%,#091109 49%,#050d05 50%,#020602 51%,#010301 53%,#000000 56%,#000000 100%) !important;
}

input#hideme {
     display: none;
}

#plugininstall input[type="text"] {
     width: 50%;
     min-width: 400px;
}

#plugininstall input.cancel {
     display: none;
}

#pluginupdater {
     border: 1px solid #494;
     padding: 15px 5px 15px 50px;
     margin-top: -11px;
     margin-bottom: 10px !important;
     background: url(/themes/console/images/info/update.png) 12px center no-repeat, #000;
     background-size: 28px 28px;
}

#pluginupdater form {
     margin-bottom: 0;
}

.formaction#tunnelconfigsave, .formaction#homeapps, .formaction#browserstart {
     margin-bottom: -2px !important;
}

h4.embeddedtitle#updateplugins {
     padding: 5px 10px;
     background: #000 url(images/header.png) center center repeat-x;
     background: linear-gradient(to bottom, #002000, #000 75%) !important;
     border: 1px solid #494;
     text-align: left;
     text-transform: uppercase;
     font-size: 10pt;
     letter-spacing: 0.08em;
     word-spacing: 0.1em;
     margin-top: -13px;
}

#manualreseed input[type="text"] {
     width: 50%;
     width: calc(100% - 300px);
}

table#loggingoptions, table#addkeyring {
     margin-bottom: -3px !important;
     margin-top: -1px;
}

table#permabanned {
     margin-top: -1px;
     margin-bottom: 9px;
}

#permabanned th, #banneduntilrestart th {
     padding: 5px 10px !important;
}

.main#config_stats h3 a, .main#config_logging h3 a {
     float: right;
     letter-spacing: normal;
     font-size: 9pt;
     text-transform: none;
}

table#configstats {
     margin-bottom: -2px;
}

#configstats th {
     padding: 8px 10px !important;
     text-align: left;
}

#configstats tr.tablefooter td {
     padding: 5px 10px !important;
}

#configstats th a {
     float: right;
     font-size: 9pt;
}

#configstats th b {
     text-transform: uppercase;
     font-size: 10pt;
     letter-spacing: 0.08em;
     word-spacing: 0.1em;
}

#configstats td {
     padding: 6px 5px;
}

#configstats td:first-child {
     width: 1%;
     white-space: nowrap;
     padding: 8px;
}

#configstats td:first-child:empty + td > label { /* remove pointer from inert labels */
     cursor: default;
}

#configstats td:last-child {
     border-right: 1px solid #494;
}

#configstats tr {
     border-top: 1px inset #131;
}

/*
#configstats .tablefooter b:not(old) {
     font-size: 0;
}

#configstats .tablefooter b::after {
     content: url(images/chart.png);
     vertical-align: bottom;
     filter: sepia(100%) hue-rotate(70deg) !important;
}
*/

#configstats .tablefooter:last-child td {
     background: #000 !important;
     text-align: right;
}

#configstats td {
    color: #bb7;
    border: none;
}

#configstats td b {
    color: #ee9;
}

#configstats input.optbox {
     margin: 0;
     padding: 0;
}

#configstats tr.tablefooter td {
     padding: 5px 10px;
}

p#enablefullstats {
     margin-top: 5px;
     padding: 5px 10px;
     border: 1px solid #494;
}

#peerdefs td:first-child {
     width: 40px;
     white-space: nowrap;
     border: 1px inset #131;
     text-align: right;
}

/* infohelp/warn overrides and misc ornamentation */

table#bugreports td.infohelp {
     background: url(/themes/console/images/info/bugreport.png) 12px center no-repeat !important;
     padding: 15px 15px 15px 50px;
     background-size: 28px 28px !important;
}

p#debugmode {
     padding: 15px 15px 15px 50px;
     background: url(/themes/console/images/info/debug.png) 12px center no-repeat !important;
     background-size: 28px 28px !important;
}

p#sybilinfo {
     padding: 15px 15px 15px 50px;
     background: url(/themes/console/images/info/experimental.png) 12px center no-repeat !important;
     background-size: 28px 28px !important;
}

#bandwidthconfig tr:first-child .infohelp {
     background: url(/themes/console/images/info/bandwidth.png) 12px center no-repeat !important;
     padding: 15px 15px 15px 50px;
     background-size: 28px 28px !important;
}

#addkeyring td.infohelp {
     background: #000 url(/themes/console/images/info/keys.png) 12px center no-repeat !important;
     padding: 15px 15px 15px 50px;
     background-size: 28px 28px !important;
}

#joinfamily tr:nth-child(3) td:first-child {
     background: #000 url(/themes/console/images/info/key.png) 12px center no-repeat !important;
     padding: 15px 15px 15px 50px;
     background-size: 28px 28px !important;
}

#newfamily tr:last-child td:first-child {
     background: #000 url(/themes/console/images/info/label.png) 12px center no-repeat !important;
     padding: 15px 15px 15px 50px;
     background-size: 28px 28px !important;
}

#oldhome td:first-child {
     background: url(/themes/console/images/info/home.png) 12px center no-repeat !important;
     padding: 15px 15px 15px 50px;
     background-size: 28px 28px !important;
}

#oldhome input[type="checkbox"], #enablefullstats input[type="checkbox"] {
     vertical-align: middle;
}

#floodfillconfig tr:first-child .infohelp {
     background: #000 url(/themes/console/images/info/floodfill_32x32.png) 12px center no-repeat !important;
     padding: 15px 15px 15px 50px;
     background-size: 28px 28px !important;
}

#floodfillconfig tr:nth-child(2) td {
     padding: 8px 10px 8px 18px;
}

#floodfillconfig tr:nth-child(2) b {
     margin-right: 10px;
}

p#clientconf.infohelp, p#webappconfigtext.infohelp {
     background: #000 url(/themes/console/images/info/java_edit.png) 12px center no-repeat !important;
     padding: 15px 15px 15px 50px;
     background-size: 28px 28px !important;
}

p#pluginconfigtext {
     background: #000 url(/themes/console/images/info/plugin_edit.png) 12px center no-repeat !important;
     padding: 15px 15px 15px 50px;
     background-size: 28px 28px !important;
}

#plugininstall .infohelp {
     background: #000 url(/themes/console/images/info/plugin_link.png) 12px center no-repeat !important;
     padding: 15px 15px 15px 50px;
     background-size: 28px 28px !important;
}

#manualreseed tr:nth-last-child(2) td.infohelp {
     background: #000 url(/themes/console/images/info/box.png) 12px center no-repeat !important;
     padding: 15px 15px 15px 50px;
     background-size: 28px 28px !important;
}

#config_peers tr:nth-child(3) td.infohelp {
     background: #000 url(/themes/console/images/info/blocked.png) 12px center no-repeat !important;
     padding: 15px 15px 15px 50px;
     background-size: 28px 28px !important;
}

h3#shutdownrouter + p.infohelp {
     background: #000 url(/themes/console/images/info/power.png) 12px center no-repeat !important;
     padding: 15px 15px 15px 50px;
     background-size: 28px 28px !important;
}

h3#restartrouter + p.infohelp, #config_family .infohelp.needrestart {
     background: #000 url(/themes/console/images/info/reboot.png) 12px center no-repeat !important;
     padding: 15px 15px 15px 50px;
     background-size: 28px 28px !important;
}

h3#systray + p.infohelp {
     background: #000 url(/themes/console/images/info/systray.png) 12px center no-repeat !important;
     padding: 15px 15px 15px 50px;
     background-size: 28px 28px !important;
}

h3#servicedebug + p.infohelp {
     background: #000 url(/themes/console/images/info/debug.png) 12px center no-repeat !important;
     padding: 15px 15px 15px 50px;
     background-size: 28px 28px !important;
}

h3#browseronstart + p.infohelp {
     background: #000 url(/themes/console/images/info/launch_browser.png) 12px center no-repeat !important;
     padding: 15px 15px 15px 50px;
     background-size: 28px 28px !important;
}

.main#config_reseed p.infohelp {
     background: #000 url(/themes/console/images/info/connect.png) 12px center no-repeat !important;
     padding: 15px 15px 15px 50px;
     background-size: 28px 28px !important;
}

p#enablefullstats, p#gatherstats {
     background: #000 url(/themes/console/images/info/statistics.png) 12px center no-repeat !important;
     padding: 15px 15px 15px 50px;
     background-size: 28px 28px !important;
}

#config_family .infohelp {
      background: #000 url(/themes/console/images/info/family.png) 12px center no-repeat !important;
      padding: 15px 15px 15px 50px;
      background-size: 28px 28px !important;
}

#consolepass tr:first-child td {
     background: #000 url(/themes/console/images/info/user_add.png) 12px center no-repeat;
     background-size: 28px 28px;
     padding: 15px 15px 15px 50px;
}

form[action="events"] {
     padding: 10px 10px 10px 50px;
     background: #000 url(/themes/console/images/info/logs.png) 12px center no-repeat;
     background-size: 28px 28px;
}

#plugininstall tr:nth-child(3) td:nth-last-child(2), #manualreseed tr:nth-child(3) td:nth-last-child(2) {
     background: #000 url(/themes/console/images/info/url.png) 12px center no-repeat;
     padding: 15px 15px 15px 50px;
     background-size: 28px 28px;
}

#manualreseed tr:nth-child(5) td:nth-last-child(2), #plugininstall2 tr:nth-child(2) td:nth-last-child(2) {
     background: #000 url(/themes/console/images/info/from_file.png) 12px center no-repeat;
     padding: 15px 15px 15px 50px;
     background-size: 28px 28px;
}

/* responsive layout */

/* responsive /profiles & /peers */

@media screen and (max-width: 1060px) {

table#floodfills, #profiles ul#banlist, table#profile_defs {
     margin-bottom: 5px;
}

table#floodfills td {
     font-size: 8pt;
     border-right: 0 outset transparent !important;
}

#floodfills tr:hover td:nth-child(n+2){
     transform: scale(1.1);
     text-align: center !important;
}
}

@media screen and (max-width: 1240px) {
.main#profiles, .main#peers {
     padding: 5px 5px 0;
}

#profiles .confignav {
     margin: -6px -6px 5px;
}

p#upnpstatus, .main#peers .infohelp {
     margin: 0;
}

#upnpscan {
     margin-bottom: 5px;
}

.main#peers h3, #profiles h3, .main#peers .infohelp {
     margin-top: 5px !important;
}

p#profiles_overview {
     margin: 5px 0;
}

#profiles #thresholds + h3 {
     margin-top: -5px !important;
}
}

/* end profiles/peers */

/* network status */

.routersummary h4 a {
     width: auto !important;
     vertical-align: middle;
     display: inline;
}

.routersummary .error, .routersummary .warn, .routersummary .testing, .routersummary .hidden,
.routersummary .running, .routersummary .firewalled, .routersummary .vmcomm, .routersummary .clockskew, .tunnelBuildStatus {
     display: inline-block;
     vertical-align: middle;
     border: 1px solid #316f30;
     box-sizing: border-box;
     border: 1px solid rgba(49, 111, 48, 0.6);
     padding: 6px 3px;
     width: 100%;
     margin: -5px 0;
     box-shadow: inset 0 0 0 1px #000;
     text-shadow: 0 1px 1px #000;
}

.routersummary .firewalled {
     border: 1px dotted #316f30;
     border: 1px dotted rgba(49, 111, 48, 0.6);
}

.routersummary .error {
     border: 1px solid #900;
     border: 1px solid rgba(153, 0, 0, 0.6);
}

.routersummary .warn, .routersummary .clockskew {
     border: 1px solid #aa0;
     border: 1px solid rgba(170, 170, 0, 0.6);
}

.routersummary .testing {
     border: 1px solid #fa0;
     border: 1px solid rgba(255, 170, 0, 0.6);
}

.routersummary .hidden, .routersummary .vmcomm {
     border: 1px dotted #777;
     border: 1px solid rgba(119, 119, 119, 0.6);
}

.routersummary .running {
     border: 1px solid #316f30;
     border: 1px solid rgba(49, 111, 48, 0.6);
}

.routersummary .error::before, .routersummary .warn::before, .routersummary .testing::before, .routersummary .hidden::before,
.routersummary .running::before, .routersummary .firewalled::before, .routersummary .vmcomm::before, .routersummary .clockskew::before {
     margin-right: 2px;
     vertical-align: middle;
     display: inline-block;
     filter: drop-shadow(0 0 1px rgba(192,192,192,0.5));
     transform: scale(0.8);
}

.routersummary .error::before, .routersummary .clockskew::before {
     content: url(/themes/console/images/info/network_status/network_error.png);
}

.routersummary .warn::before {
     content: url(/themes/console/images/info/network_status/network_warning.png);
}

.routersummary .testing::before {
     content: url(/themes/console/images/info/network_status/network_testing.png);
}

.routersummary .hidden::before {
     content: url(/themes/console/images/info/network_status/network_hidden.png);
     margin-right: 3px;
}

.routersummary .running::before {
     content: url(/themes/console/images/info/network_status/network_ok.png);
}

.routersummary .firewalled::before {
     content: url(/themes/console/images/info/network_status/network_firewalled.png);
     filter: drop-shadow(0 1px 1px rgba(255,120,120,0.8));
     margin-right: 4px;
     opacity: 0.7;
}

.routersummary .vmcomm::before {
     content: url(/themes/console/images/info/network_status/network_vm.png);
}

.routersummary .clockskew::before {
     content: url(/themes/console/images/info/network_status/network_clockskew.png);
}

/* end network status */

/* /tunnels */

tt a, img + tt {
     letter-spacing: 0.1em;
}

.tunnel_cap {
     margin: 1px 2px 1px 8px;
     padding: 0 2px;
     display: inline-block;
     min-width: 12px;
     color: #bb7;
     border: 1px solid rgba(0,64,0,0.2);
     border-radius: 2px;
     text-align: center !important;
     text-shadow: 0 1px 1px #555;
     background: rgba(0,96,0,0.3);
}

.tunnel_cap:empty {
     border: none;
}

.tunnel_id {
     display: inline-block;
     min-width: 78px;
     text-align: right;
}

.tunnel_id:empty {
     min-width: 0;
}

.tunnel_id:empty + .tunnel_cap {
     margin-left: 12px !important;
     display: inline-block;
}

.tunnel_peer {
     display: inline-block;
     min-width: 56px;
     text-align: right;
}

.tunnel_peer img {
     margin-right: 2px;
}

.tunnel_peer tt {
     margin-left: 0;
}

.tunnel_local {
     font-size: 8pt;
     text-transform: lowercase;
     background: rgba(0,96,0,0.3);
     border-radius: 2px;
     text-align: center;
     padding: 2px 0;
     margin-left: -4px;
     margin-right: 4px;
}

.tunnel_peer:empty {
     vertical-align: top;
}

#tunnel_defs {
     margin-top: -1px;
     margin-bottom: 10px;
}

#tunnel_defs td:first-child, #tunnel_defs td:nth-child(even) {
     width: 1%;
     white-space: nowrap;
}

@media screen and (max-width: 1100px) {
.tunnel_id, .tunnel_peer {
     min-width: 0 !important;
     text-align: center !important;
}

.tunnel_local {
     margin-right: 5px;
     margin-left: 2px;
     padding: 2px 4px;
}

.tunnel_peer:empty {
     vertical-align: middle;
}

.tunnel_peer:empty::before {
     margin: 1px 6px 1px 2px;
}

.tunnel_cap {
     margin-left: 5px !important;
}
}

@media screen and (max-width: 1200px) {
#tunnel_defs {
     margin-bottom: 5px;
}
}

@media screen and (min-width: 1500px) {
.tunnel_cap {
     margin-left: 10px;
     padding: 0 1px;
     min-width: 14px;
}

.tunnel_id:empty {
     margin-right: -10px;
}
}

/* end tunnels */

/* /peers */

#ntcpconnections th:nth-child(6), #ntcpconnections th:nth-child(7), #ntcpconnections th:nth-child(8), #ntcpconnections th:nth-child(9), #ntcpconnections th:nth-child(10),
#ntcpconnections td:nth-child(6), #ntcpconnections td:nth-child(7), #ntcpconnections td:nth-child(8), #ntcpconnections td:nth-child(9), #ntcpconnections td:nth-child(10),
#udpconnections td:nth-child(6), #udpconnections td:nth-child(7), #udpconnections td:nth-child(9), #udpconnections td:nth-child(10), #udpconnections td:nth-child(11),
#udpconnections td:nth-child(13), #udpconnections td:nth-child(14), #udpconnections td:nth-child(15), #udpconnections td:nth-child(16) {
     text-align: right;
     white-space: nowrap;
}

#ntcpconnections .tablefooter td:nth-child(3), #ntcpconnections .tablefooter td:nth-child(4), #ntcpconnections .tablefooter td:nth-child(5), #ntcpconnections .tablefooter td:nth-child(6),
#udpconnections .tablefooter td:nth-child(3), #udpconnections .tablefooter td:nth-child(4), #udpconnections .tablefooter td:nth-child(7), #udpconnections .tablefooter td:nth-child(8),
#udpconnections .tablefooter td:nth-child(10), #udpconnections .tablefooter td:nth-child(11), #udpconnections .tablefooter td:nth-child(12), #udpconnections .tablefooter td:nth-child(13) {
     text-align: right;
}

#udpconnections .tablefooter td:nth-child(9) {
     text-align: center !important;
}

#ntcpconnections td:nth-child(4), #ntcpconnections td:nth-child(5), #udpconnections td:nth-child(4),
#udpconnections td:nth-child(5), #udpconnections td:nth-child(8), #udpconnections td:nth-child(12) {
     white-space: nowrap;
}

#udpconnections .tablefooter td, #ntcpconnections .tablefooter td {
     padding-left: 5px;
     padding-right: 5px;
}

#ntcpconnections th:nth-child(6), #ntcpconnections th:nth-child(7), #ntcpconnections th:nth-child(8), #ntcpconnections th:nth-child(9), #ntcpconnections th:nth-child(10) {
     text-align: right;
}

#udpconnections th:nth-child(6), #udpconnections th:nth-child(7), #udpconnections th:nth-child(n+9) {
     text-align: right;
}

#udpconnections th:nth-child(12) {
     text-align: center;
}

.peersort {
     text-align: center;
     display: inline-block;
}

.right {
     text-align: right;
     margin: 0 1px;
     display: inline-block;
     width: 40%
}

.left {
     text-align: left;
     margin: 0 1px;
     display: inline-block;
     width: 40%
}

.peeripv6:empty {
     padding: 0;
     width: 0;
}

.cwnd .left, .cwnd .right {
     width: auto;
}

#udpconnections th:nth-child(n+13), #udpconnections .tablefooter th:nth-child(n+10),
#udpconnections td:nth-child(n+13), #udpconnections .tablefooter td:nth-child(n+10) {
     padding-right: 1% !important;
}

/* end peers */

/* netdb router address info */

.leasesets_container {
     -moz-columns: 680px 2;
     -webkit-columns: 680px 2;
     columns: 680px 2;
     -moz-column-gap: 10px;
     -webkit-column-gap: 10px;
     column-gap: 10px;
}

th code {
     -moz-user-select: all;
     -webkit-user-select: all;
     user-select: all;
}

@media screen and (min-width: 1634px) {
.leasesets_container {
     margin-bottom: 8px;
}

th code {
     font-size: 9pt !important;
}
}

.leasesets_container table:first-child {
     margin-top: 0;
}

.leasesets_container table {
     break-inside: avoid;
     page-break-inside: avoid;
     -webkit-column-break-inside: avoid;
}

.netdb_addresses {
     line-height: 150%;
}

.netdb_addresses br:first-child, .sybil_routerinfo tr:last-child td br:first-child {
     display: none;
}

.netdbentry th:first-child::after {
     content: "";
     display: inline-block;
     min-height: 20px;
     vertical-align: middle;
}

.netdbentry th:last-child > *, .sybil_routerinfo th:nth-child(2) > * {
     display: inline-block;
     vertical-align: middle !important;
}

.netdbentry th a img {
     display: inline-block;
     vertical-align: middle;
     margin-right: 1px;
     margin-bottom: 2px;
}

.netdbentry a.viewfullentry::after {
     display: inline-block;
     vertical-align: middle !important;
     margin-left: 3px;
}

.netdbentry td:first-child {
     text-align: right;
     min-width: 100px;
     padding-right: 5px !important
}

b.netdb_transport {
     display: inline-block;
     width: 50px;
     text-align: right;
     margin-right: 5px;
}

#netdb code {
    font-weight: normal !important;
}

.netdb_name {
     color: #bb3;
     text-transform: capitalize;
     font-weight: bold;
}

.netdb_info {
     margin-right: 1px;
}

.netdb_expiry {
     margin-left: 5px;
}

.sybil_routerinfo th img[src^="/flags"] {
     height: 11px;
     width: 16px;
     margin-right: 5px;
}

.sybil_routerinfo b.netdb_transport {
     margin-left: -13px;
     margin-right: 0;
}

.sybil_routerinfo td:first-child, .netdbentry td:first-child {
     text-align: right !important;
     padding-right: 0;
}

.sybil_routerinfo td[colspan="3"] {
     white-space: normal;
}

.sybil_container {
     -moz-columns: 680px 2;
     -webkit-columns: 680px 2;
     columns: 680px 2;
     margin: 10px 0;
}

.sybil_container p {
     break-inside: avoid;
     page-break-inside: avoid;
     -webkit-column-break-inside: avoid;
}

.sybil_container p:first-child {
     margin-top: 0;
}

.sybil_container p:last-child {
     margin-bottom: 0;
}

/* end netdb router address */

/* sybils */

.leaseset th:last-child, .leaseset td:last-child, .sybil_routerinfo th:last-child, .sybil_routerinfo td:last-child {
     border-right: 1px solid #494 !important;
}

.sybil_routerinfo table td:last-child {
     border-right: none !important;
}

.sybilinfo_params {
     padding: 0;
     border-bottom: 1px solid #494
}

.sybilinfo_container {
     columns: 240px auto;
     -moz-columns: 240px auto;
     -webkit-columns: 240px auto;
     -moz-column-gap: 0;
     -webkit-column-gap: 0;
     column-gap: 0;
     background: #010;
     padding: 4px 5px;
}

.sybilinfo_container b {
     color: #bb3;
}

.sybil_routerinfo tr:last-child {
     border-top: none;
}

.sybil_routerinfo p {
     margin: 0;
     padding: 0;
     line-height: 140%;
     break-inside: avoid;
     page-break-inside: avoid;
     -webkit-column-break-inside: avoid;
}

.sybilinfo_familyname {
     display: inline-block;
     vertical-align: top;
     max-width: 150px;
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
}

.sybil_addresses td:first-child {
     max-width: 155px;
     font-weight: bold;
     padding-right: 9px;
}

.sybil_addresses table {
     width: 100%;
     margin: 0;
}

.sybil_addresses {
     padding: 0;
     border-bottom: 1px solid #494
}

.sybil_addresses table, .sybil_addresses td {
     border: none;
}

.threatpoints + ul {
     -moz-columns: auto 600px;
     -webkit-columns: auto 600px;
     columns: auto 600px;
     -moz-column-rule: 1px solid #2a5f29;
     -webkit-column-rule: 1px solid #2a5f29;
     column-rule: 1px solid #2a5f29;
     padding-top: 3px;
     padding-bottom: 3px;
}

.threatpoints + ul li:first-child {
     margin-top: 0 !important;
}

.threatpoints + ul li:last-child {
     margin-bottom: 0 !important;
}

.threatpoints + ul li {
     list-style: none;
     margin-left: 5px;
     line-height: 100%;
     break-inside: avoid !important;
     page-break-inside: avoid !important;
     -webkit-column-break-inside: avoid !important;
}

.threatpoints + ul li a {
     white-space: nowrap;
}

/* end sybils */

/* debug */

#debug {
     line-height: 140%;
     padding-bottom: 0;
}

#debug table {
     margin-top: -13px;
}

#debug th, #debug td {
     text-align: left;
     padding: 5px 10px;
}

#debug th {
     padding: 7px 10px;
}

#debug th:last-child, #debug td:last-child {
     text-align: right;
}

#debug td:last-child {
     vertical-align: top;
}

#debug h2, #debug h3 {
     border-radius: 0;
}

#debug h2 {
     padding: 8px 10px;
     font-size: 11.5pt;
     background: url(/themes/console/images/info/debug.png) right 5px center no-repeat, linear-gradient(to bottom, #1a261a 0%, #223022 7%, #212f21 9%, #172317 21%, #091109 49%, #050d05 50%, #020602 51%, #010301 53%, #000000 56%, #000000 100%) !important;
     background: url(/themes/console/images/info/debug.png) right 5px center no-repeat, linear-gradient(to bottom, rgba(0,0,0,0) 50%, #000 50%), repeating-linear-gradient(to right, rgba(0,0,0,0.5) 1px, rgba(0,0,0,0.5) 2px, rgba(0,16,0,0.5) 2px, rgba(0,16,0,0.5) 4px), linear-gradient(to bottom, #005000, #000 75%) !important;
     background-size: 20px 20px, 100% 100%, 100% 100%, 100% 100% !important;
     background-blend-mode: luminosity, normal, normal, normal;
}

#debug h2 + hr, .buckets hr {
     display: none;
}

#debug h3 {
     border-width: 1px !important;
     padding: 5px 10px !important;
     font-size: 10pt;
}

.debug_container {
     margin-top: -11px;
     border: 1px solid #494;
     padding: 10px 15px;
     background: #000800;
}

.debug_container:empty::after {
     content: "None";
     display: inline-block;
     font-style: italic;
}

.buckets {
     margin-top: -13px;
     margin-bottom: 15px;
     max-height: 600px;
     overflow: auto;
     word-break: break-all;
}

.debug_container + h3, .debug_outboundsessions {
     margin-top: -1px;
}

#debug h2 + h3, .buckets {
     margin-top: -13px;
}

#debug ul, #debug li {
     margin: 0 !important;
     text-align: left !important;
}

#debug li:last-child {
     padding-bottom: 2px;
}

#debug li {
     display: inline-block;
     padding: 2px 0 !important;
     min-width: 400px !important;
}

#debug ul, .debug_targetinfo {
     columns: 400px 2;
     column-rule: 1px solid #131;
     column-gap: 30px;
}

.debug_targetinfo {
     line-height: 140%;
}

.debug_targetinfo b {
     margin-right: 3px;
}

#debug h3.debug_outboundsessions, #debug h3.debug_inboundsessions {
     padding: 6px 10px 8px 28px !important;
     background-blend-mode: luminosity, normal, normal, normal;
}

#debug h3.debug_outboundsessions {
     margin-top: -2px !important;
     background: url(/themes/console/images/outbound.png) 6px center no-repeat, linear-gradient(to bottom, #1a261a 0%, #223022 7%, #212f21 9%, #172317 21%, #091109 49%, #050d05 50%, #020602 51%, #010301 53%, #000 56%) !important;
     background: url(/themes/console/images/outbound.png) 6px center no-repeat, linear-gradient(to bottom, rgba(0,0,0,0) 50%, #000 50%), repeating-linear-gradient(to right, rgba(0,0,0,0.5) 1px, rgba(0,0,0,0.5) 2px, rgba(0,16,0,0.5) 2px, rgba(0,16,0,0.5) 4px), linear-gradient(to bottom, #005000, #000 75%) !important;
}

#debug h3.debug_inboundsessions {
     background: url(/themes/console/images/inbound.png) 6px center no-repeat, linear-gradient(to bottom, #1a261a 0%, #223022 7%, #212f21 9%, #172317 21%, #091109 49%, #050d05 50%, #020602 51%, #010301 53%, #000 56%) !important;
     background: url(/themes/console/images/inbound.png) 6px center no-repeat, linear-gradient(to bottom, rgba(0,0,0,0) 50%, #000 50%), repeating-linear-gradient(to right, rgba(0,0,0,0.5) 1px, rgba(0,0,0,0.5) 2px, rgba(0,16,0,0.5) 2px, rgba(0,16,0,0.5) 4px), linear-gradient(to bottom, #005000, #000 75%) !important;
}

.debug_version {
     color: #aa0;
     font-weight: bold;
}

#portmapper td:first-child {
     font-weight: bold;
}

#portmapper th:last-child, #portmapper td:last-child {
     text-align: left !important;
}

/* end debug */

/* jardump */

#jardump {
     overflow: auto !important;
     padding: 0;
     min-width: 650px !important;
}

#jardump table {
     margin: -1px 0 0;
     border: 0;
     border-collapse: collapse;
     font-size: 8pt;
     color: #bb7;
}

#jardump th {
     padding: 9px 5px;
}

#jardump th:nth-child(4), #jardump th:nth-child(5) {
     white-space: nowrap !important;
}

#jardump th {
     border-right: none;
     border-left: none;
}

#jardump th, #jardump td {
     vertical-align: middle !important;
     text-align: center !important;
}

#jardump th:first-child, #jardump td:first-child {
     text-align: left !important;
}

#jardump td {
     border-right: 1px inset #131;
     padding: 2px 5px 3px;
     color: #bb7;
}

#jardump td:first-child, #jardump tr:hover td:first-child {
     padding-left: 24px;
     padding-right: 0 !important;
     background-image: url(/themes/console/images/info/box.png) !important;
     background-position: 6px center;
     background-repeat: no-repeat;
     background-size: 16px 16px;
}

#jardump td:first-child {
     color: #eea;
}

#jardump td:first-child b {
     display: inline-block;
     padding: 4px;
     border-radius: 2px;
     margin-right: 4px;
}

#jardump td:nth-child(2) {
     text-align: right !important;
     font-style: italic;
}

#jardump td:last-child {
     word-break: break-all;
     text-align: left !important;
     border-right: none;
     padding: 0;
}

#jardump tr:hover td {
     background: #020;
     color: #ee9;
     border: 1px solid #151;
     border-left: 1px solid transparent;
     border-right: 1px solid transparent;
}

#jardump tr:hover .unsignedmod:not(:empty) {
     background: #600;
     color: #fff;
     border-radius: 2px;
}

#jardump tr:hover td:first-child b {
     background: #030;
     border: 1px solid #010;
     margin-right: 0;
     box-shadow: 0 0 1px 0 #010;
     width: 95%;
     width: calc(100% - 10px);
}

#jardump tr:hover hr {
     background: transparent;
}

#jardump tr:hover td:first-child {
     padding-left: 26px !important;
     padding-right: 0 !important;
}

#jardump tt {
     letter-spacing: -0.03em;
}

#jardump font[color="red"] {
     color: #d00;
}

@media screen and (-webkit-min-device-pixel-ratio:0) { /* fixes column wrapping on webkit */
#jardump td {
     word-break: break-word !important;
     word-break: break-all !important;
     max-width: 230px;
}
}

.revision, .sha256, .unsignedmod {
     display: inline-block;
     -moz-user-select: all;
     -webkit-user-select: all;
     user-select: all;
}

.unsignedmod {
     padding: 2px 2px 2px 4px;
     margin: 0;
}

#jardump hr {
     margin: 1px 0;
     width: 100%;
     height: 1px;
     background: #131;
     display: block !important;
}

#jardump .subheading {
     padding-top: 6px !important;
     padding-bottom: 6px !important
}

.subheading.routerfiles {
     background: url(/themes/console/images/eepsite.png) right 5px center no-repeat, linear-gradient(to right, #000, #001000 40%) !important;
     background-size: 16px auto, 100% 100% !important;
     background-blend-mode: luminosity, normal;
}

.subheading.pluginfiles {
     background: url(/themes/console/images/plugin.png) right 5px center no-repeat, linear-gradient(to right, #000, #001000 40%) !important;
     background-size: 16px auto, 100% 100% !important;
     background-blend-mode: luminosity, normal;
}

.unsignedmod {
     display: inline-block;
     word-break: break-all;
}

@media screen and (max-width: 1400px) {
.revision, .sha256 {
     display: inline-block;
     max-width: 100px !important;
     overflow: hidden;
     text-overflow: ellipsis
}

.revision:hover, .sha256:hover {
     overflow: auto;
     text-overflow: clip;
}
}
/* end jardump */

/* responsive layout */

@media screen and (max-width: 900px) {
#ntcpconnections th:last-child:not(old) {
     font-size: 0;
}

#ntcpconnections th:last-child::before {
     content: url(/themes/console/images/info/backlogged.png) !important;
}

#ntcpconnections td:last-child {
     width: 24px !important;
     white-space: nowrap;
}

th {
     font-size: 8pt;
}

.tunneldisplay .cells {
     padding: 4px 2px !important;
}

.langbox {
     line-height: 15px;
}
}

@media screen and (max-width: 1200px) {
.tab, .tab2 {
     padding: 1px 0;
     min-width: 50px !important;
}

.tab2 {
     padding: 3px 12px;
}

.tab a {
     padding: 2px 14px;
}

#plugininstall input[type="text"] {
     min-width: 200px !important;
}

#i2pupdates td:first-child {
     white-space: normal;
     width: 30%;
}

td.optionsave {
     white-space: normal;
}

.main#tunnels {
     padding: 0 5px;
     min-width: 640px;
}

.main#tunnels h3 {
     margin-top: 6px;
}

.statusnotes:last-child {
     margin-bottom: 6px;;
}

#portfaq td:nth-child(2) {
     white-space: normal;
}

#faq h3 {
     font-size: 10pt !important;
}

#udpconnections .cells {
     border: 1px inset #131;
}
}

@media screen and (max-width: 1220px) {
#udpconnections tr:nth-last-child(n+3):hover td:nth-child(n+2) {
     transform: scale(1.05);
     text-align: center !important;
}

.main#peers .widescroll td.cells {
     font-size: 8pt !important;
}

.main#help h3, #faq h3 {
     font-size: 10pt !important;
}
}

@media screen and (max-width: 1500px) {
#sb_general td::after, #sb_shortgeneral td::after, #sb_advancedgeneral td::after, #sb_bandwidth td::after,
#sb_peers td::after, #sb_peersadvanced td::after, #sb_tunnels td::after, #sb_queue td::after {
   min-height: 12px;
}

#banlist + h3 {
     margin-bottom: -2px !important;
}

.tunnels_client th:first-child:not(old) {
     font-size: 0;
}

.tunnels_client th:first-child::after {
     content: "\21E9\21E7";
     font-size: 12pt;
     line-height: 0;
     vertical-align: middle;
     letter-spacing: -0.25em;
}

.app img {
     padding: 10px 50px 40px;
}

.applabel {
     margin-top: 8px;
}

.main#help h3, #faq h3 {
     font-size: 10.5pt !important;
}
}

@media screen and (min-width: 1400px) {
#profiles #banlist {
     border: none;
     margin: -15px -15px -5px;
     padding: 10px 5px;
}

.main#help #changelog pre:not(old) {
     columns: 550px auto;
     column-gap: 40px;
     column-rule: 1px dotted #151;
     margin-left: 0;
     padding-left: 10px;
     width: calc(100% - 22px) !important;
     overflow-y: hidden;
}

#help .confignav, #debug .confignav {
     position: sticky;
     top: 0;
}
}

@media screen and (min-width: 1460px) {
input[type="submit"], input[type="reset"], select, button {
     font-size: 9pt;
}
}

@media screen and (min-width: 1500px) {
body, .main, .main td, .news p, #news p, textarea, .main textarea, code, tt, #changelog pre,
ul.statlist a[name], ul.statlist b, ul.statlist li b, ul.statlist a[name]:hover, .confignav, th, #configinfo th {
     font-size: 10pt !important;
}

.cells tt, #profilelist tt, #floodfills tt {
     font-size: 9pt !important;
     letter-spacing: 0.07em;
     margin-left: 2px !important;
     margin-right: 2px !important;
}

.main button, .main input, select, textarea, div.news {
     font-size: 10pt !important;
}

.main, .news, h1 {
     margin-left: 242px !important;
}

pre, #logs li, .smallhead th {
     font-size: 9pt !important;
}

.routersummary {
     width: 210px !important;
}

.routersummary table[id^="sb_"] {
     width: 226px !important;
}

.routersummary td, .routersummary a, .routersummary button, .routersummary h4, .routersummary h4 a,
#floodfill th, .applabel a, #jardump td, .statusnotes {
     font-size: 9pt !important;
}

.routersummary button {
     font-size: 10pt !important;
}

div.app {
     min-width: 138px;
}

.appimg {
     height: 35px;
     padding: 5px 0 8px;
}

.app img {
     margin-top: -8px;
     padding: 10px 58px 38px;
}

.applabel {
     width: 150px !important;
}

.applabel a {
     max-width: 148px;
     font-size: 10pt !important;
}

code, tt {
     font-size: 9pt !important;
}

table#floodfills th:first-child, table#floodfills td:first-child {
     width: 58px;
     padding-right: 3px !important;
}

h3, .routersummary h3 a, th.th_title, #leasesetdebug th, #leasesetsummary th, .netdbentry th {
     font-size: 11pt !important;
}

select {
     padding: 3px 16px 3px 2px;
}

h3#pluginmanage {
     margin-bottom: -15px !important;
}

h4#updateplugins {
     margin-top: -15px !important;
}

.sorry {
     margin-left: 242px !important;
}

div.joblog h3 {
     margin-top: 7px !important;
     padding-top: 7px !important;
}

#certs.main p + p:empty + h4 {
     margin-top: -15px !important;
}

.routersummary button.reload, .routersummary button.stop {
    min-width: 101px;
}

.subheading b {
     font-size: 10.5pt !important;
}

p#fullhistory {
     text-align: right;
     margin-top: -13px;
}

.routersummary img[src$="i2plogo.png"] {
     margin-left: -8px;
     transform: none;
     width: 225px;
     margin-top: -6px;
}

.routersummary h3::after {
     min-height: 19px;
}

#sb_services a:link, #sb_internals a:link, #sb_advanced a:link, #sb_help a:link {
     max-width: 216px !important;
}

#banlist + h3.tabletitle {
     margin-bottom: -2px !important;
}

table#permabanned {
     margin-top: -3px;
}

#udpconnections td[class="cells"]:first-child, #ntcpconnections td[class="cells"]:first-child {
     width: 55px;
     padding-right: 8px;
}

.main#jobs h2 {
     margin-bottom: 10px !important;
}

.footnote, .topness {
     font-size: 9pt !important;
}

.main[id^="config_"] th, h4#updateplugins {
    font-size: 10.5pt !important;
}

.langbox {
     margin: 4px 4px 2px 5px;
     line-height: 17px !important;
}

.langbox img {
     margin-bottom: -1px;
}

#help .confignav {
     padding: 0 !important;
     position: sticky;
     top: -1px;
     z-index: 999;
}

#help .tab {
     margin-top: -1px !important;;
}

.newsAuthor {
     font-size: 9pt !important;
     background-size: 15px 15px !important;
     padding-left: 19px !important;
}

table#reseedconfig input[type="text"], table#reseedconfig input[type="password"] {
     width: 250px;
}

.themechoice, .langselect {
     width: 140px;
}

.themechoice .optbox {
     min-width: 144px !important;
     margin-left: -48px !important;
}

.langselect .optbox {
     min-width: 144px !important;
}

.langselect img {
     margin-left: -81px !important;
}

.langselect input[name="lang"]:checked + img {
     margin-left: -82px !important;
}

ul#banlist {
     -moz-column-width: 300px;
     -webkit-column-width: 300px;
     column-width: 300px;
}

img[src="/themes/console/images/i2plogo.png"] {
     margin-top: 3px !important;
     width: 200px !important;
}
}

@media screen and (-webkit-min-device-pixel-ratio:0) and (min-width: 1500px) {
.langselect img, .langselect input[name="lang"]:checked + img {
     margin-left: -20px !important;
     margin-top: -31px !important;
}

.langselect input[name="lang"]:checked + img {
     margin-left: -16px !important;
     margin-top: -27px !important;
}
}

@media screen and (min-width: 1840px) {
div[id^="config_"] .confignav {
     display: flex;
     flex-direction: row;
     flex-wrap: wrap;
     align-content: space-evenly;
     justify-content: center;
     padding: 4px 4px 5px 3px !important;
}

div[id^="config_"] .tab, div[id^="config_"] .tab2 {
     flex: auto;
     flex-basis: content;
     flex-grow: 0.06;
     margin: 0 -1px -1px 0 !important;
     white-space: nowrap;
     min-width: 70px !important;
}

div[id^="config_"] .tab2 {
     padding: 5px 6px;
}

div[id^="config_"] .tab a {
     padding: 4px 6px;
}

div[id^="config_"] .confignav {
     padding: 0 !important;
}

div[id^="config_"] .tab, div[id^="config_"] .tab2 {
     margin-top: -1px !important;
}

div[id^="config_"] .tab:first-child {
     margin-left: -1px !important;
}
}

/* proxy errors */

@media screen and (max-width: 800px) {
.warning {
     margin-left: 20px !important;
     margin-top: 130px !important;
     background: url(images/camotile2.png) !important;
     padding: 5px 15px 15px !important;
}

.warning h3 {
     margin: -4px -14px 10px;
}

.logo {
     position: absolute;
     top: 20px;
     width: calc(100% - 62px) !important;
     z-index: 999;
     min-width: 330px;
}

.logo a {
     width: auto !important;
     padding: 2px 5px !important;
}
.logo a img {
     padding: 0 !important;
     margin-top: -2px;
     margin-bottom: -4px;
}
}

@media screen and (min-height: 700px) {
.proxyfooter {
     position: absolute;
     bottom: 0;
     right: 0;
     padding: 0 20px 0 0;
     text-align: right;
     background: #030;
     width: 100%;
     opacity: 0.7;
     border-top: 1px solid #000;
}

.proxyfooter p {
     text-align: right;
     line-height: 130% !important;
     margin: 5px 0;
}

.warning {
     margin-bottom: 30px;
}
}

@media screen and (max-height: 700px) {
.proxyfooter {
     display: none;
}
}
/* end proxy errors */
/* end responsive layout */

/* Edge/IE tweaks */

_:-ms-lang(x), .tunnels_client th:first-child::after {
     letter-spacing: -0.05em;
     font-weight: normal;
}

/* end Edge/IE tweaks */

/* TODO: can we simplify sidebar element positioning by getting a handle on the #xhr div? */
/*
#xhr {
     width: 204px;
     background: rgba(255,255,0,0.1);
     margin: 0 0 0 -10px;
     text-align: center !important;
}

.routersummary table, #sb_localtunnels {
     width: 200px !important;
     margin-left: 2px !important;
     margin-right: 2px !important;
}

.routersummary h4 {
     width: 198px !important;
     margin: 0 0 0 2px; !important;
     display: inline-block;
}

.routersummary h3, .routersummary hr {
     width: 100% !important;
     margin-left: 0 !important;
     margin-right: 0 !important;
}
*/

/* TO DO: Merge with main classes */

.optionlist {
     columns: 500px auto;
     padding-bottom: 1px;
}

.optionlist label {
     min-width: 300px;
     break-inside: avoid;
     page-break-inside: avoid !important;
     -webkit-column-break-inside: avoid;
}

th.options, table#externali2cp th {
     padding: 7px 10px !important;
}

.options input[type="checkbox"], #i2pupdates .options .optbox {
     margin: 0 3px 0 0;
}

#i2pupdates textarea {
      min-height: 76px !important;
      height: 76px !important;
      margin: 6px 0 6px 10px !important;
      padding: 3px 5px;
}

#reseedconfig textarea {
      min-height: 76px !important;
      height: 76px !important;
      margin: 6px 10px 6px 0 !important;
      padding: 3px 5px;
}

#manualreseed {
     margin-bottom: 10px !important;
}

#resetreseed {
     padding: 5px 5px 0 0;
}

/* /configui */

#passwordheading {
     margin-top: 0 !important;
}

#langsettings {
     margin-bottom: 10px !important;
}

/* end /configui */

#pluginconfigtext + form {
     float: right;
     margin: -42px 6px 0 0;
}

#externaltcp .nowrap:first-child {
     margin: 5px 0 -18px !important;
     display: inline-block;
}

#cputype {
     display: inline-block;
     margin: -2px 2px -2px 0;
     padding: 2px 5px;
     font-weight: bold;
     text-transform: uppercase;
     border-radius: 2px;
     background: #030;
}

#wrapperlogs pre {
     height: 300px;
     resize: vertical;
}

/* graphs */

#graphs td:first-child {
     font-weight: normal;
     text-align: left;
     padding: 5px 0 0;
}

@media screen and (min-width: 1060px) {
#graphs td:first-child {
     padding: 5px 0;
}
}

#graphs td b {
     min-width: 150px;
     text-align: right;
     display: inline-block;
     margin-right: 5px;
}

#graphs .nowrap {
     line-height: 300%;
     display: inline-block;
}

/* end graphs */

.buckets br + br {
     line-height: 5px;
}

.routerid {
     margin: 0;
     padding: 0 2px;
     display: inline-block;
     min-width: 50px;
     border: 1px solid #020;
     background: #020;
     text-align: center;
}

.routerid tt, .routerid a {
     letter-spacing: 0.2em !important;
}

.routerid img {
    margin: 1px 0 -1px;
}

.routerid tt, .routerid a {
     margin-top: -3px !important;
     display: inline-block;
}

.tunneldisplay .routerid {
     min-width: 64px;
     margin-right: 6px !important;
     box-sizing: border-box;
     border-radius: 2px;
}

.tunneldisplay .routerid, .tunnel_cap {
     box-shadow: 0 0 0 1px #010;
}

.tunnel_cap:empty {
     box-shadow: none;
}

#plugininstall, #plugininstall2, #reseedconfig, #oldhome {
     margin-bottom: 10px !important;
}

#reseedconfig td {
     width: 50%;
}

#reseedconfig td .optbox {
     margin: 6px 5px 6px 10px;
}

#reseedconfig td .nowrap b {
     margin-right: 8px;
     min-width: 120px;
     text-align: right;
     display: inline-block;
}

.configtable th {
     text-transform: none !important;
     letter-spacing: 0 !important;
     word-spacing: 0 !important;
}
