/* I2PSnark theme "Vanilla" by dr|z3d */
/* Now with 100% more chocolate */

html {
     height: 100%;
}

body {
     font: 9pt "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Lucida Grande", "Bitstream Vera Sans", Verdana, sans-serif;
     color: #2f1500;
     background: #2f231a;
     background: repeating-linear-gradient(to bottom, #9f948b 1px, #6f5b4c 1px, #bfa285 3px);
}

/* preload top navigation mouseovers */
body:not(old) {
     background: repeating-linear-gradient(to bottom, #6f5b4c 1px, #9f948b 1px, #bfa285 4px),
     url(images/button_snark_hover.png) no-repeat,
     url(images/button_snark_active.png) no-repeat,
     url(images/button_tracker_hover.png) no-repeat,
     url(images/button_tracker_active.png) no-repeat,
     url(images/button_forum_hover.png) no-repeat,
     url(images/button_forum_active.png) no-repeat !important;
     background-size: 100% 100%, 0 0, 0 0, 0 0, 0 0, 0 0, 0 0 !important;
}

body.iframed {
     background: transparent !important;
     margin: 6px 0 !important;
}

body.iframed:not(old) {
     background: url(images/button_snark_hover.png) no-repeat,
     url(images/button_snark_active.png) no-repeat,
     url(images/button_tracker_hover.png) no-repeat,
     url(images/button_tracker_active.png) no-repeat,
     url(images/button_forum_hover.png) no-repeat,
     url(images/button_forum_active.png) no-repeat !important;
     background-size: 0 0, 0 0, 0 0, 0 0, 0 0, 0 0 !important;
}

* {
     outline: none;
}

form {
     margin-bottom: 0;
}

p {
     line-height: 150%;
}

hr {
     color: #6f533e;
     background:#6f533e;
     height: 1px;
     border: none;
     width: 0%;
     margin: 5px 0 7px 0;
     text-align: center;
}

::selection {
     background: #900 !important;
     color: white;
}

::-moz-selection {
     background: #800 !important;
     color: white;
}

input[type="submit"], input[type="reset"], button, a:link, input[type="checkbox"], input[type="radio"], select, label {
     cursor: pointer;
}

.page {
     background: #dfdccb url(images/tile2.png);
     background: repeating-linear-gradient(to bottom, #ecebdd 1px, #efebdd 2px, #ebe5d5 5px);
     color: #310;
     min-width: 900px !important;
     margin: 5px 0 0 0;
     padding: 10px 10px 0 10px;
     border-radius: 2px;
     border: 1px solid #101;
     font-size: 9pt !important;
     line-height: 160% !important;
     box-shadow: inset 0 0 3px 0 #a08160, 0 0 1px 0 #4f3d36;
     text-align: center;
}

.iframed .page {
     background: none;
     border: none;
     box-shadow: none;
     padding: 0;
}

a:link, a:visited {
     text-decoration: none;
}

.snarkCommentInfo th a:link, td a:link {
     color: #9f0b00;
     text-decoration: none;
     font-weight: bold;
     word-wrap: break-word;
}

th a:visited, td a:visited {
     color: #9f0b00 !important;
}

th a:hover, th a:visited:hover, th a:focus, th a:visited:focus,
td a:hover, td a:visited:hover, td a:focus, td a:visited:focus {
     color: #df0067 !important;
     filter: none;
}

th a:active, th a:visited:active, td a:active, td a:visited:active {
     color: #ff2f85 !important;
}

.toggleview, .snarkConfigTitle, .snarknavbar, img, input[type="image"] {
     -moz-user-select: none;
     -webkit-user-select: none;
     -ms-user-select: none;
     user-select: none;
}

/* top nav */

.snarknavbar {
     margin: -11px 0 10px 0 !important;
     padding: 13px 10px 12px;
     min-width: 900px;
     width: 70%;
     border: 1px solid #2f1b0c;
     border-radius: 0 0 2px 2px;
     box-shadow: inset 0 0 0 1px #fff5ef, 0 0 1px 0 #4f3d36;
     box-shadow: inset 0 0 0 1px #fff5ef, 0 0 0 1px rgba(111, 96, 90, 0.3), 0 0 1px 1px rgba(79, 61, 54, 0.5);
     background: #efefef;
     background: linear-gradient(to bottom, #efefef 50%, #cfc7c2 53%);
     text-align: center;
     transition: ease width 0.5s 0.5s;
}

.iframed .snarknavbar {
     margin: -6px 0 !important;
     padding-top: 12px;
     position: static;
     width: auto;
     border-radius: 0;
     box-shadow: 0 0 2px 0 #fff inset, 0 0 1px 0 #4f3d36;
     background: linear-gradient(to bottom, #efefef 49%, #cfc7c2 52%);
}

.snarkNav:link, .snarkNav:visited {
     margin: -3px -4px -4px 0 !important;
     padding: 4px 10px 4px 28px !important;
     display: inline-block;
     position: relative;
     z-index: 30;
     line-height: 130%;
     font: bold 10pt "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Lucida Grande", "Bitstream Vera Sans", Verdana, sans-serif;
     color: #3f271b;
     text-shadow: 0 0 1px #fff5ef;
     text-decoration: none !important;
     text-transform: uppercase !important;
     letter-spacing: 0.08em;
     border: 1px solid #2f1b0c;
     border-radius: 0;
     box-shadow: inset 0 0 0 1px #efe6e0, inset 0 0 0 rgba(0,0,0,0), 0 0 0 1px rgba(77, 69, 62, 0.1);
     background-size: 17px auto, 100% 100%, 100% 100% !important;
     background-position: 12px center, center center, center center !important;
     background-repeat: no-repeat !important;
     transition: ease border 0.1s;
}

_:-ms-lang(x), .snarkNav:link, .snarkNav:visited {
     padding-top: 1px !important;
     margin-right: -5px !important;
}

.snarkNav:hover, .snarkNav:focus {
     z-index: 10;
     color: #930 !important;
     text-decoration: none !important;
     text-shadow: none !important;
     box-shadow: inset 0 0 0 1px #fff5ef, inset 0 0 0 rgba(0,0,0,0), 0 0 0 1px rgba(77, 69, 62, 0.1);
     filter: drop-shadow(0 0 1px rgba(200,60,0,0.2));
     transition: ease border 0.1s;
}

.snarkNav:active {
     text-shadow: none !important;
     box-shadow: inset 0 0 0 1px #efe6e0, inset 2px 2px 3px 1px #59513b, 0 0 0 1px rgba(77, 69, 62, 0.1);
     filter: none;
     transition: ease box-shadow 0.05s;
}

.nav_main:link {
     background: #fff7ef url(images/button_snark.png) 11px center no-repeat !important;
     background: url(images/button_snark.png) 11px center no-repeat, linear-gradient(to bottom, #fff7ef 47%, rgba(207, 193, 181, 0.6) 50%), repeating-linear-gradient(45deg, #75604e 1px, #a09286 1px, #bfafa2 2px) !important;
     background-size: 18px auto, 100% 100%, 100% 100% !important;
}

.nav_forum:link {
     background: #fff7ef url(images/button_forum.png);
     background: url(images/button_forum.png), linear-gradient(to bottom, #fff7ef 47%, rgba(207, 193, 181, 0.6) 50%), repeating-linear-gradient(45deg, #75604e 1px, #a09286 1px, #bfafa2 2px);
}

.nav_tracker:link {
     background: #fff7ef url(images/button_tracker.png);
     background: url(images/button_tracker.png), linear-gradient(to bottom, #fff7ef 47%, rgba(207, 193, 181, 0.6) 50%), repeating-linear-gradient(135deg, #75604e 1px, #a09286 1px, #bfafa2 2px);
     background-size: 18px auto, 100% 100%, 100% 100% !important;
}

.nav_main:hover, .nav_main:focus {
     background: #ffeadf url(images/button_snark_hover.png) 11px center no-repeat !important;
     background: url(images/button_snark_hover.png) 11px center no-repeat, linear-gradient(to bottom, #ffeadf 47%, #cfb6a8 50%) !important;
     background-size: 18px auto, 100% 100%, 100% 100% !important;
}

.nav_forum:hover, .nav_forum:focus {
     background: #ffeadf url(images/button_forum_hover.png);
     background: url(images/button_forum_hover.png), linear-gradient(to bottom, #ffeadf 47%, #cfb6a8 50%);
}

.nav_tracker:hover, .nav_tracker:focus {
     background: #ffeadf url(images/button_tracker_hover.png);
     background: url(images/button_tracker_hover.png), linear-gradient(to bottom, #ffeadf 47%, #cfb6a8 50%);
}

.nav_main:active {
     background: #dfb899 url(images/button_snark_active.png) 11px center no-repeat !important;
     background: url(images/button_snark_active.png) 11px center no-repeat, linear-gradient(to bottom, #dfb899 47%, #af9178 50%) !important;
     background-size: 18px auto, 100% 100%, 100% 100% !important;
}

.nav_forum:active {
     background: #dfb899 url(images/button_forum_active.png);
     background: url(images/button_forum_active.png), linear-gradient(to bottom, #dfb899 47%, #af9178 50%);
}

.nav_tracker:active {
     background: #dfb899 url(images/button_tracker_active.png);
     background: url(images/button_tracker_active.png), linear-gradient(to bottom, #dfb899 47%, #af9178 50%);
}

.snarkNav:last-child {
     border-radius: 0 2px 2px 0;
}

.snarkNav:first-child {
     border-radius: 2px 0 0 2px;
     padding-left: 30px !important;
}

.snarkNav:last-child[href="/i2psnark/"] {
     border-radius: 2px;
     margin: -2px 0 -4px !important;
}

.snarkNav:hover, .snarkNav:visited:hover {
     color: #930 !important;
}

.snarkNav:active, .snarkNav:visited:active {
     color: #eee !important;
     transition: ease box-shadow 0.1s;
}

/* end topnav */

/* screenlog */

.snarkMessages {
     font: bold 8.5pt "Droid Sans Mono", "Noto Mono", "DejaVu Sans Mono", "Lucida Console", monospace !important;
     text-align: left;
     margin: 0 0 10px;
     padding: 0 3px;
     border: 1px solid #6f533e;
     border-radius: 2px;
     box-shadow: inset 0 0 6px 0 #3f2307;
     color: #cfc7c2;
     overflow: hidden;
     height: 56px;
     width: auto;
     background: #3f3833;
     background-size: auto 105%, 100% 100%;
}

.snarkMessages:hover, .snarkMessages:focus {
     overflow: auto;
}

.snarkMessages:focus {
     box-shadow: inset 0 0 6px 0 #3f2307, 0 0 1px #df0067;
     filter: drop-shadow(0 0 2px rgba(200, 80, 0, 0.3));
}

.snarkMessages ul {
     margin: 0;
     padding: 0 0 0 16px;
     list-style: none;
}

.snarkMessages li {
     margin-left: -15px;
}

.snarkMessages li::before {
     content: "";
     display: inline-block;
     background: url(images/bullet.png) left 2px no-repeat;
     width: 13px;
     height: 11px;
     background-size: 9px 9px;
}

.snarkMessages a:link:not([href*="action=Clear"]) {
     mix-blend-mode: exclusion;
     color: #f60 !important;
}

.snarkMessages a:link:hover:not([href*="action=Clear"]) {
     mix-blend-mode: normal;
}

.snarkMessages a:visited {
     color: #d30;
}

.snarkMessages a:hover, .snarkMessages a:visited:hover {
     color: #f60 !important;
}

.snarkMessages a:link:active, .snarkMessages a:visited:active  {
     color: #f30 !important;
}

.snarkMessages img {
     float: right;
     margin: -1px -3px 4px 4px;
     opacity: 1 !important;
     position: sticky;
     top: -1px;
     mix-blend-mode: luminosity;
     background: #cfbda8;
     padding: 2px 2px 1px;
     width: 10px;
     height: 10px;
}

.snarkMessages img:hover, .snarkMessages a:focus img {
     mix-blend-mode: normal;
     filter: drop-shadow(0 0 1px #f60);
}

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

/* end screenlog */

/* pagenav */

#pagenav {
     vertical-align: middle;
     padding: 3px 2px 2px;
     font-size: 9pt;
}

#pagenav img {
     border: 1px solid #541;
     border-radius: 2px;
     margin-right: -3px;
     padding: 3px 4px;
     filter: sepia(100%) hue-rotate(340deg) drop-shadow(0 0 1px #999);
     background: linear-gradient(to bottom, #ffeadf 51%, #cfb6a8 52%);
     box-shadow: inset 0 0 0 1px #fff;
     mix-blend-mode: luminosity;
}

#pagenav img:hover, #pagenav a:focus img {
     mix-blend-mode: normal;
}

#pagenav a:active img {
     mix-blend-mode: normal;
     box-shadow: inset 0 0 0 1px #fff, inset 3px 3px 3px #3f362f !important;
}

#pagenav img.disable, #pagenav img.disable:hover {
     mix-blend-mode: luminosity;
     opacity: 0.2;
     margin-right: 1px;
}

/* end pagenav */

table {
     margin: 0 0 10px 0;
     border: 1px solid #6f533e;
     padding: 0;
     border-spacing: 0;
     border-collapse: collapse;
     color: #2f1500;
     width: 100%;
     opacity: 1 !important;
     font-size: 8.5pt !important;
}

th {
     padding: 4px 2px;
     font-size: 8pt;
     border-top: 1px solid #6f533e;
     border-bottom: 1px solid #6f533e;
     color: #2f1500;
}

td {
     padding: 2px 4px;
     color: #2f1500 !important;
     vertical-align: middle;
}

thead, tfoot {
     background: #efefef;
     background: linear-gradient(to bottom, #efefef, #cfc7c2);
     font-weight: bold;
     color: #2f1500;
}

thead a img, thead img {
     opacity: 0.9;
     filter: sepia(100%) hue-rotate(340deg);
     max-height: 20px;
}

thead a:hover img, thead a:focus img {
     opacity: 1;
     mix-blend-mode: normal;
     filter: drop-shadow(0 0 1px #f60);
}

thead a:active img {
     transform: scale(0.9);
     filter: drop-shadow(0 0 1px #f30);
}

th br {
     display: none;
}

th:first-child {
     text-align: left !important;
     padding-left: 3px;
}

tfoot td:first-child {
     text-align: left !important;
     padding-left: 0;
}

tfoot tr:first-child th {
     vertical-align: middle;
     font-weight: bold;
     color: #2f1500 !important;
}

.headerstatus {
     text-align: left;
}

.headerpriority {
     text-align: center;
     padding: 5px;
}

.headerpriority br {
     display: none;
}

.ParentDir {
     background: #fff4ef;
     background: linear-gradient(to right, #efe6e0, #dfd6d1 70%);
     text-align: left !important;
     padding: 4px 0 4px 4px;
}

.ParentDir img {
     filter: sepia(100%) hue-rotate(340deg);
}

/* main torrents listing */

.snarkTorrents {
     margin: 0;
     border: 1px solid #6f533e;
     background: #e8e5dc;
     border-collapse: separate;
     border-spacing: 0;
     border-radius: 2px;
}

.snarkTorrents thead th {
     border-top: 0;
     border-bottom: 1px solid #6f533e;
}

.snarkTorrents tfoot th {
     border-bottom: none !important;
     white-space: normal !important;
     font-weight: normal;
}

.snarkTorrents tfoot tr:first-child {
     background: linear-gradient(to bottom, #efefef, #cfc7c2);
}

.snarkTorrents tfoot tr:first-child th {
     font-weight: bold !important;
}

.snarkTorrents tfoot tr:first-child th::after {
     content: "";
     display: inline-block;
     min-height: 24px;
     vertical-align: middle;
}

.snarkTorrents tfoot th:nth-child(n+2) {
     white-space: nowrap;
}

.snarkTorrents tfoot th br {
     display: block !important;
}

.snarkTorrents tfoot tr:first-child th {
     vertical-align: middle;
}

.snarkTorrents thead th:nth-child(3) {
     text-align: center;
     padding-right: 0;
}

.snarkTorrents td[colspan="4"], .snarkTorrents td[colspan="10"] {
     text-align: left;
}

.snarkTorrents td[colspan="10"] {
     white-space: normal;
}

.snarkGraphicStatus, .snarkTorrentStatus {
     padding: 2px;
     white-space: nowrap;
     width: 1%;
}

.snarkGraphicStatus {
     text-align: center !important;
     width: 1%;
     white-space: nowrap;
}

.snarkGraphicStatus::after {
     content: "";
     display: inline-block;
     min-height: 20px !important;
     vertical-align: middle;
}

th.snarkTorrentStatus {
     text-align: center !important;
}

.snarkTorrentStatus {
     padding-right: 5px !important;
     text-align: left;
     padding-left: 0;
}

.snarkTorrentName {
     padding-left: 5px !important;
     line-height: 110%;
}

.snarkTrackerDetails, .snarkTorrentDetails, .snarkCommentDetails {
     width: 16px !important;
     text-align: center !important;
     font-weight: bold;
     padding-left: 0 !important;
     padding-right: 0 !important;
}

.snarkTrackerDetails img, .snarkTorrentDetails img, .snarkCommentDetails img, .snarkDirInfo td:first-child img {
     padding: 3px !important;
     border: 1px solid transparent !important;
     margin: 0 !important;
}

.snarkDirInfo td:first-child img {
     margin: 0 2px !important;
}

.snarkTrackerDetails a:hover img, .snarkTrackerDetails a:focus img,
.snarkTorrentDetails a:hover img, .snarkTorrentDetails a:focus img,
.snarkCommentDetails a:hover img, .snarkCommentDetails a:focus img,
.snarkDirInfo td:first-child a:hover img, .snarkDirInfo td:first-child a:focus img {
     border: 1px solid #f60 !important;
     border-radius: 2px;
     box-shadow: 0 0 1px #f60;
     background: #ffeadf;
     background: linear-gradient(to bottom, #ffeadf 50%, #cfb6a8 50%);
     filter: none !important;
}

.snarkTrackerDetails a:active img, .snarkTorrentDetails a:active img, .snarkCommentDetails a:active img, .snarkDirInfo td:first-child a:active img {
     box-shadow: inset 2px 2px 3px 1px #59513b;
     transform: scale(0.9);
     transition: none !important;
}

.snarkTorrentETA, .snarkTorrentUploaded, .snarkTorrentRateDown, .snarkTorrentRateUp {
     width: 5%;
     min-width: 70px;
     white-space: nowrap;
}

.snarkTorrentETA {
     font-weight: bold;
     font-style: italic;
     color: #505 !important;
     line-height: 120%;
}

.snarkTorrentRateUp, .snarkTorrentRateDown, .snarkTorrentDownloaded, .snarkTorrentUploaded {
     font-weight: bold;
     padding: 0 7px;
}

.snarkTorrentDownloaded {
     text-align: right !important;
     padding: 2px;
     vertical-align: middle;
}

.snarkTorrentRateDown, .snarkTorrentDownloaded {
     color: #439 !important;
}

.snarkTorrentUploaded, .snarkTorrentRateUp {
     color: #626 !important;
}

.snarkTorrentUploaded {
     padding-left: 10px;
}

.snarkTorrentAction {
     padding: 1px 2px 1px 1px !important;
     margin: 0 !important;
     text-align: center;
     width: 1%;
     white-space: nowrap;
}

.snarkTorrentAction input[type="image"], .snarkTorrents th:last-child input[type="image"] {
     filter: drop-shadow(0 0 1px rgba(127, 108, 95, 0.6));
     border: 1px solid #4d453e;
     border-radius: 2px;
     padding: 3px !important;
     background: linear-gradient(to bottom, #fff7ef 51%, #cfc1b5 52%, #cfc1b5);
     box-shadow: inset 0 0 0 1px #efe6e0;
     vertical-align: middle;
     mix-blend-mode: normal;
     opacity: 1 !important;
     max-height: 10px;
}

.snarkTorrentAction input[type="image"]:hover, .snarkTorrents th:last-child input[type="image"]:hover,
.snarkTorrentAction input[type="image"]:focus, .snarkTorrents th:last-child input[type="image"]:focus  {
     background: linear-gradient(to bottom, #ffeadf 51%, #cfb6a8 52%);
     border: 1px solid #930 !important;
     box-shadow: inset 0 0 0 1px #fff;
     filter: drop-shadow(0 0 1px #f30);
}

.snarkTorrentAction input[type="image"]:active, .snarkTorrents th:last-child input[type="image"]:active {
     box-shadow: inset 0 0 0 1px #efe6e0, inset 3px 3px 3px #4d453e;
     mix-blend-mode: multiply;
     filter: sepia(100%) hue-rotate(340deg);
}

.snarkTorrents th:empty + th:empty, .snarkTorrents td:empty + td:empty, .snarkTorrentAction:empty {
     width: 0 !important;
}

.snarkTorrents thead th:nth-child(n+2) img {
     display: none;
}

.snarkTorrents thead th a img, .snarkTorrents thead th input[type="image"] {
     display: inline-block !important;
}

.snarkTorrents tt {
     background: #7f654f;
     color: #fff;
     padding: 2px 3px;
     border-radius: 2px;
     opacity: 0.8;
     letter-spacing: 0.1em;
}

.peerinfo tt {
     margin: 0 1px;
}

.snarkTorrents th:empty + th:empty, .snarkTorrents td:empty + td:empty, .snarkTorrentETA:empty,
.snarkTorrentRateDown:empty, .snarkTorrentRateUp:empty, .snarkTorrentAction:empty {
     width: 0 !important;
     min-width: 0 !important;
}

.snarkTorrentNoneLoaded, .snarkTorrentNoneLoaded:hover td {
     background: #5f4e41 !important;
}

.mainsection .snarkTorrentNoneLoaded td {
     font-weight: bold;
     text-align: center !important;
     color: #cfc7c2 !important;
     padding: 10px !important;
}

.snarkTorrentNoneLoaded i::before {
     content: url(images/bullet.png);
     display: inline-block;
     vertical-align: top;
     margin: 1px 3px 0 0;
}

/* end main torrents listing */

.snarkTorrentEven {
     background: #dfd6d1;
}

.snarkTorrentOdd {
     background: #efe6e0;
}

.snarkTorrentOdd td, .snarkTorrentEven td, .snarkTorrentInfo td, .ParentDir {
     border-top: 1px outset #fff5ef !important;
     border-bottom: 1px outset #efe8e0 !important;
}

_:-ms-lang(x), .snarkTorrentOdd td, .snarkTorrentEven td, .snarkTorrentInfo td, .ParentDir {
     border-top: 1px solid #fff5ef !important;
     border-bottom: 1px solid #efe8e0 !important;
}

.snarkTorrentOdd:last-child td, .snarkTorrentEven:last-child td {
     border-bottom: none !important;
}

.snarkTorrents tbody tr:hover, .snarkDirInfo tbody tr:hover {
     background: #f9efcf !important;
     background: linear-gradient(to right, rgba(119, 0, 0, 0.7) 3px, #f9efcf 3px) !important;
}

tr:hover .percentBarText {
     opacity: 1;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
.snarkTorrents tbody tr:hover, .snarkDirInfo tbody tr:hover {
     background: #f9efcf !important;
}
}

_:-ms-lang(x), .snarkTorrents tbody tr:hover, .snarkDirInfo tbody tr:hover {
     background: #f9efcf !important;
}

.snarkDirInfo tr:hover .snarkFileStatus img {
     mix-blend-mode: normal;
}

.snarkTorrentEven + .snarkTorrentEven:nth-child(even), .snarkTorrentOdd + .snarkTorrentOdd:nth-child(even) {
     background: linear-gradient(to right, #998e88 3px, #e8dfda 3px);
}

.snarkTorrentEven + .snarkTorrentEven:nth-child(odd), .snarkTorrentOdd + .snarkTorrentOdd:nth-child(odd) {
     background: linear-gradient(to right, #72665f 3px, #e0d9d5 3px);
}

@media screen and (-webkit-min-device-pixel-ratio:0) { /* chrome fix - gradient otherwise applied to each td */
.snarkTorrentEven + .snarkTorrentEven:nth-child(even), .snarkTorrentOdd + .snarkTorrentOdd:nth-child(even) {
     background: #e8dfda;
}

.snarkTorrentEven + .snarkTorrentEven:nth-child(odd), .snarkTorrentOdd + .snarkTorrentOdd:nth-child(odd) {
     background: #e0d9d5;
}
}

.peerinfo td[colspan="4"], .debuginfo td[colspan="10"] {
     padding-left: 0;
}

.snarkFileIcon {
     width: 16px;
     text-align: left !important;
}

.snarkFileIcon img, .snarkFileIcon img:hover {
     filter: none;
     opacity: 0.6;
}

.snarkFileIcon a img, .snarkFileIcon a:hover img {
     opacity: 1;
}

.snarkFileIcon:first-child {
     text-align: center;
}

.snarkFileName {
     padding: 4px 0 !important;
     text-align: left !important;
     font-size: 8pt !important;
     font-weight: bold;
}

.snarkFileSize {
     padding: 4px 2px;
     font-weight: bold;
     color: #727 !important;
     width: 1%;
     white-space: nowrap;
}

.snarkFileStatus {
     padding: 4px 5px;
     text-align: center;
     font-style: italic;
     font-size: 8pt;
     text-align: left;
     white-space: nowrap;
     width: 140px;
     overflow: hidden;
     text-overflow: ellipsis;
}

.snarkTorrentInfo img {
     max-height: 16px !important;
     margin: 1px 2px 2px 2px !important;
}

.mainsection .snarkTorrentInfo td {
     text-align: left !important;
     vertical-align: middle !important;
     background: #efe6e0;
     padding: 4px 3px 4px 1px;
}

.snarkTorrentInfo tr:nth-child(even) td {
     background: #dfd6d1;
}

.snarkTorrentInfo th {
     text-align: left;
     background: linear-gradient(to bottom, #efefef, #cfc7c2);
     padding: 7px 4px 7px 0;
}

.snarkTorrentInfo th:first-child {
     background: url(images/file.png) left 7px center no-repeat, linear-gradient(to bottom, #efefef, #cfc7c2);
     background-size: auto 16px, 100% 100%;
     background-blend-mode: luminosity;
}

.snarkTorrentInfo th:first-child, .snarkTorrentInfo td:first-child {
     width: 20px;
     text-align: left;
     padding-left: 5px !important;
     padding-right: 3px !important;
}

.snarkTorrentInfo {
     margin-bottom: 2px !important;
     border-collapse: separate;
}

.snarkTorrentInfo tr:first-child th {
     border-top: none;
}

.snarkTorrentInfo b {
     margin-right: 3px;
}

#infohash {
     color: #050;
     -moz-user-select: all;
     -webkit-user-select: all;
     -ms-user-select: all;
     user-select: all;
}

#torrentInfoControl {
     border-top: 1px solid #6f533e;
}

#torrentInfoControl td, #torrentOrderControl td {
     border-bottom: none !important;
     background: linear-gradient(to bottom, #efefef, #cfc7c2);
     text-align: right !important;
     padding-right: 8px !important;
}

#torrentOrderControl td {
     background: #cfc7c2;
}

#enableInOrder {
     margin-left: 8px;
     margin-right: 20px;
}

.snarkDirInfo {
     margin-top: 10px !important;
     margin-bottom: 0;
     border-collapse: separate;
}

.snarkDirInfo tr:first-child th {
     border-top: none !important;
}

.snarkDirInfo thead th:nth-child(n+2) {
     text-align: center;
}

.snarkDirInfo thead img {
     margin: 0 -1px 0 0 !important;
     padding: 0 3px !important;
}

.snarkTorrentInfo, .snarkDirInfo, .resourceError, .snarkTorrents {
     box-shadow: 0 0 2px 1px rgba(77, 69, 62, 0.3);
}

thead img.disable, img.disable:hover {
     opacity: 0.4;
}

.snarkDirInfo td {
     min-width: 0 !important;
}

.snarkDirInfo td:first-child::before {
     content: "";
     display: inline-block;
     min-height: 22px;
     vertical-align: middle !important;
}

.snarkDirInfo .ParentDir a, .snarkDirInfo .snarkFileName a, .snarkTorrents .snarkTorrentName a {
     display: inline-block;
     width: 100%;
     padding: 2px 0;
}

.snarkDirInfo .ParentDir a img {
     padding-right: 3px;
}

.snarkDirInfo .headerpriority {
     text-align: center !important;
     vertical-align: middle;
     padding: 5px !important;
     width: 160px;
}

#setPriority .headerpriority {
     text-align: right !important;
     padding: 5px !important;
     border-bottom: none;
}

#setPriority .headerpriority, #torrentInfoControl td {
     box-shadow: inset 0 0 0 1px #efe8e0;
     border-top: 1px solid #6f533e !important;
}

#torrentInfoStats td {
     border-bottom: none !important;
}

#setPriority input.disabled, #setPriority a.controld {
     display: none;
}

/* download bars */

.snarkTorrentDownloaded {
     width: 130px !important;
     text-align: right !important;
}

.snarkDirInfo .snarkFileStatus img {
     float: left;
     margin: 1px 10px 0 7px;
}

.snarkDirInfo .snarkFileStatus img[src$="tick.png"] {
     margin-top: 0;
}

.percentBarOuter, .percentBarText {
     width: 130px;
}

.snarkDirInfo .percentBarText, .snarkDirInfo .percentBarOuter {
     width: 90px;
}

.percentBarOuter {
     display: inline-block;
     margin: 0;
     border: 1px solid #998;
     border-bottom: 1px solid #776;
     border-right: 1px solid #776;
     border-radius: 2px;
     box-shadow: none;
     opacity: 1;
     background: #fff7ef;
     background: repeating-linear-gradient(135deg, #fff7ef 1px, #fff7ef 5px, #efdfd1 6px, #efdfd1 11px);
}

.snarkTorrentDownloaded .percentBarOuter {
     margin-left: 5px;
}

.peerinfo .percentBarOuter, .peerinfo .percentBarText {
     width: 70px;
}

.peerinfo .percentBarText {
     padding: 1px;
     color: #3f3927;
}

.snarkDirInfo .percentBarOuter {
     float: left;
}

.percentBarInner {
     height: 100%;
     height: 16px;
     vertical-align: middle;
     border: none;
     border-radius: 2px;
     box-shadow: inset 0 0 0 1px #efe6e0;
     background: #cfc1b5;
     background: linear-gradient(to bottom, rgba(255, 247, 239, 0.8) 50%, rgba(207, 193, 181, 0.9) 50%, rgba(207, 193, 181, 1));
}

.snarkTorrentDownloaded .percentBarInner {
     background: linear-gradient(to bottom, rgba(255, 247, 239, 0.75) 50%, rgba(207, 193, 181, 0.8) 50%, rgba(207, 193, 181, 0.9)), linear-gradient(to right, rgba(255, 100, 0, 0.5) 37px, rgba(255, 255, 0, 0.5) 74px, rgba(0, 255, 0, 0.5));
}

.snarkDirInfo .percentBarInner {
     background: linear-gradient(to bottom, rgba(255, 247, 239, 0.75) 50%, rgba(207, 193, 181, 0.8) 50%, rgba(207, 193, 181, 0.9)), linear-gradient(to right, rgba(255, 100, 0, 0.5) 30px, rgba(255, 255, 0, 0.5) 60px, rgba(0, 255, 0, 0.5));
}

.peerinfo .percentBarInner {
     background: linear-gradient(to bottom, rgba(255, 247, 239, 0.75) 50%, rgba(207, 193, 181, 0.8) 50%, rgba(207, 193, 181, 0.9)) !important;
}

.percentBarText, .percentBarOuter {
     text-align: center;
     vertical-align: middle;
}

.percentBarText {
     text-align: center;
     font-weight: bold;
     white-space: nowrap;
     color: #919;
     opacity: 0;
     transition: ease opacity 0.2s;
     vertical-align: middle;
}

.snarkTorrentDownloaded .percentBarText {
     line-height: 16px;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
.peerinfo .snarkTorrentDownloaded .percentBarText {
     line-height: normal;
}
}

.snarkDirInfo .percentBarText {
     padding: 1px 0;
}

.percentBarText:hover, .percentBarText:focus {
     opacity: 0.9;
     transition: ease opacity 0.2s;
     filter: none;
}

.iframed .percentBarText, .iframed .percentBarText:hover, .iframed .percentBarText:focus {
     transition: none;
}

/* end download bars */

.choked {
     color: #a00000 !important;
}

.unchoked {
     color: #008000 !important;
}

.thumb {
     transition: ease all 0.2s;
     max-width: 16px;
}

.thumb:hover {
     margin: -3px 0 -2px 2px !important;
     max-width: 80px;
     max-height: 80px;
     box-shadow: none !important;
     background: #fff !important;
     transition: ease all 0.3s 0.1s;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
.thumb:hover {
     margin: -3px 0 -2px -1px !important;
}
}

.snarkNewTorrent {
     font-size: 9pt;
}

.snarkAddInfo {
     display: inline-block;
     margin-top: 7px;
     background: url(images/infocircle.png) left center no-repeat;
     background-size: 14px auto;
     padding-left: 20px;
     min-height: 16px;
}

.snarkAddInfo code {
     font-size: 9pt;
}

#trackerselect {
     margin: 10px 0 5px 0;
     width: 100% !important;
     width: calc(100% - 202px) !important;
     border: 1px solid #6f533e;
     margin-left: 5px;
     border-collapse: separate;
     border-spacing: 0;
     border-radius: 2px;
     box-shadow: 0 0 2px 1px rgba(77, 69, 62, 0.3);
}

#trackerselect tr:first-child td {
     font-weight: bold;
     padding-top: 7px;
     padding-bottom: 7px;
}

#trackerselect td {
     white-space: nowrap !important;
     text-align: center;
}

#trackerselect tr:nth-child(n+2) td {
     border-right: 1px solid #6f533e;
     border-right: 1px solid rgba(111, 83, 62, 0.5);
}

#trackerselect tr:nth-child(n+2) td:last-child {
     border-right: none;
}

#trackerselect td:first-child, #trackerselect td:last-child {
     width: 30% !important;
}

#trackerselect td:nth-child(2), #trackerselect td:nth-child(3) {
     min-width: 60px !important;
     max-width: 200px !important;
}

.trackerconfig tr:first-child {
     font-weight: bold;
     filter: drop-shadow(0 0 1px #aaa);
}

#trackerselect tr:first-child td {
     background: linear-gradient(to bottom, #efefef, #cfc7c2);
     border-bottom: 1px solid #6f533e;
}

#trackerselect tr:nth-child(n+2):hover td {
     background: #f9efcf !important;
}

#trackerselect td:first-child, #trackerselect td:last-child {
     font-weight: normal;
     width: 20%;
}

#trackerselect input[type="radio"], #trackerselect input[type="checkbox"] {
     margin: 4px !important;
}

input[type="submit"], .trackerconfig input[type="submit"], input[name="savepri"], select[name="theme"] {
     text-transform: capitalize;
}

/* panel titles */

.snarkConfigTitle, .toggleview, .configsectionpanel .snarkConfigTitle:hover, .configsectionpanel .snarkConfigTitle:active {
     font: bold 11pt "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Lucida Grande", "Bitstream Vera Sans", Verdana, sans-serif;
     font-variant: small-caps !important;
     padding: 4px 1px 2px;
     margin: 0 0 -3px !important;
     letter-spacing: 0.1em;
     border: 1px solid #111;
     border-top: 0;
     background: #fff7ef;
     background: linear-gradient(to bottom, #fff7ef 50%, rgba(207, 193, 181, 0.6) 50%), repeating-linear-gradient(135deg, #75604e 1px, #a09286 1px, #bfafa2 2px);
     color: #444039 !important;
     box-shadow: 0 0 2px #4d453e, inset 0 0 0 1px #efe6e0;
     display: inline-block;
     min-width: 280px;
     vertical-align: middle;
     text-shadow: 0 0 1px #fff5ef;
}

.snarkConfigTitle:hover, .toggleview:hover, input.toggle_input:focus + .toggleview {
     background: #ffeadf;
     background: linear-gradient(to bottom, #ffeadf 50%, #cfb6a8 50%);
     color: #930 !important;
     transition: ease all 0.1s;
}

input.toggle_input:focus + .toggleview img, .snarkConfigTitle a:focus {
     mix-blend-mode: normal;
}

.snarkConfigTitle a:focus img {
     filter: drop-shadow(0px 0 1px #7f6c5f);
}

.snarkConfigTitle:active, .toggleview:active {
     box-shadow:  0 0 2px #4d453e, inset 0 0 0 1px #fff, inset 2px 2px 3px 1px #59513b;
}

.snarkConfigTitle {
     padding-top: 3px !important;
}

.configsectionpanel .snarkConfigTitle, .configsectionpanel .snarkConfigTitle:hover,
.configsectionpanel .snarkConfigTitle:active, .configsectionpanel .snarkConfigTitle:focus {
     background: #f2eeed !important;
     background: radial-gradient(circle at left bottom, #f9f8f2, #cfc7c2 400px) !important;
     display: block;
     margin: 0 -11px !important;
     border-radius: 2px 2px 0 0;
     padding: 5px 8px 3px !important;
     font-variant: normal;
     text-transform: uppercase;
     font-size: 11pt !important;
     box-shadow: inset 0 0 0 1px #efe6e0;
     text-align: left;
     letter-spacing: 0.15em !important
}

.iframed .configsectionpanel .snarkConfigTitle, .iframed .configsectionpanel .snarkConfigTitle:hover, .iframed .configsectionpanel .snarkConfigTitle:active {
     border-radius: 0;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
.snarkConfigTitle, .toggleview, .configsectionpanel .snarkConfigTitle, .snarkConfigTitle a, .snarkConfigTitle a:hover,
.configsectionpanel .snarkConfigTitle:hover, .configsectionpanel .snarkConfigTitle:active {
     font-size: 12pt !important;
}
}

/* MS Edge fix */
_:-ms-lang(x), .snarkConfigTitle, .snarkConfigTitle a, .toggleview,
.configsectionpanel .snarkConfigTitle, .configsectionpanel .snarkConfigTitle:hover {
     padding: 3px 15px 4px;
     font-size: 12pt !important;
}

.snarkConfigTitle a {
     display: inline-block;
     width: 100%;
}

.snarkConfigTitle a, .toggleview {
     color: #3f271b !important;
     text-shadow: 0 0 1px #fff5ef;
}

.snarkConfigTitle a:hover, .snarkConfigTitle a:visited:hover, .toggleview:hover, .snarkConfigTitle a:focus, .toggleview:focus {
     color: #930 !important;
}

.snarkConfigTitle a:active, .snarkConfigTitle a:visited:active, .toggleview:active {
     color: #603110 !important;
}

.snarkConfigTitle img, .toggleview img {
     margin: 1px -2px 3px 0;
     filter: drop-shadow(0 0 1px #7f6c5f) !important;
     mix-blend-mode: luminosity;
}

.snarkConfigTitle:hover img, .toggleview:hover img, .snarkConfigTitle:focus img, .toggleview:focus img {
     mix-blend-mode: normal;
}

/* end panel titles */

.snarkConfig {
     font-size: 8pt;
     width: 100%;
}

/* buttons & inputs */

.script {
     display: inline-block;
     vertical-align: top !important;
}

a.control, input[type="submit"], input[type="reset"] {
     font: 8pt "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", Verdana, Helvetica, sans-serif;
     font-weight: bold;
     background-size: 14px 14px, 100% 100% !important;
     box-shadow: inset 0 0 0 1px #efe6e0, 0 0 1px 0 #4d453e;
     box-shadow: inset 0 0 0 1px #efe6e0, 0 0 1px 0 rgba(77, 69, 62, 0.7);
     display: inline-block;
}

a.control, a.controld {
     background: linear-gradient(to bottom, #eeecea 50%, #ded9d5 50%);
     background-size: 100% 100% !important;
     border: 1px solid #4F3927;
     border-radius: 2px;
     color: #2f1500;
     font-weight: bold;
     margin: 2px 4px 2px 3px !important;
     padding: 5px 6px 5px 2px;
     white-space: nowrap;
     display: inline-block;
}

a.controld {
     color: #f60;
     font-weight: normal;
}

a.control:hover, a.control:focus {
     color: #930 !important;
     background: linear-gradient(to bottom, #fff7ef 51%, #cfc1b5 52%);
     filter: drop-shadow(0px 0 1px #f60);
}

a.control img, a.controld img {
     height: 14px;
     width: 14px;
     vertical-align: top;
     mix-blend-mode: normal !important;
     filter: none !important;
}

a.control:active {
     color: #f30 !important;
}

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

input {
     font-size: 8pt;
     font-weight: bold;
     text-align: left;
     padding: 5px 4px !important;
     border-radius: 2px;
     border: 1px solid #2f1500;
     background: #efe6e0;
     color: #2f1500;
     margin: 2px 4px;
     font-family: "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Lucida Grande", "Bitstream Vera Sans", Verdana, sans-serif;
}

input.r {
     text-align: right;
     background: #efe6e0;
}

input.r, input[type="text"], select {
     min-width: 120px;
}

input[name="nofilter_commentsName"] {
     width: 250px;
}

input[type=submit] {
     color: #2f1500;
     border: 1px solid #4f3927;
     background-blend-mode: luminosity;
}

input[type=submit]:hover, input[type=submit]:focus, a.control:hover {
     color: #930 !important;
     border: 1px solid #2f1a09;
     box-shadow: inset 0 0 0 1px #fff5ef, 0 0 1px 0 #4d453e;
     background-blend-mode: normal;
     filter: drop-shadow(0 0 1px #930);
}

input[type=submit]:active, a.control:active {
     color: #603110 !important;
     box-shadow: inset 0 0 0 1px #efe6e0, inset 2px 2px 2px 1px #3f362f;
}

input[type=image] {
     padding: 0 !important;
     border: medium none;
     margin: 0 2px;
     opacity: 0.8 !important;
}

input[type=image]:hover {
     opacity: 1 !important;
}

input[type=text], input.r, textarea, input[name="nofilter_dataDir"]  {
     vertical-align: middle;
     padding: 2px 4px;
     box-shadow: inset 0 0 0 1px #f9f5f2, 0 0 0 1px rgba(186, 160, 143, 0.6);
}

input[type=text]:focus, input[type=text]:focus, input.r:focus, textarea:focus, input[name="nofilter_dataDir"]:focus {
     background: #fffcdf;
     color: #5f1227;
     text-shadow: none;
     transition: ease filter 0.3s 0s;
}

input[type=radio] {
     padding: 2px;
     margin: 0 3px 0 8px;
     vertical-align: bottom;
     background: none;
}

input.default {
     width: 1px;
     height: 1px;
     visibility: hidden;
     display: none;
}

input.disabled, input.disabled:hover, input.disabled:focus, input.disabled:active, a.controld, a.controld:hover, a.controld:focus, a.controld:active {
     font-weight: normal;
     opacity: 0.6;
     color: #2f1500 !important;
     box-shadow: none;
     cursor: not-allowed;
     background-blend-mode: luminosity !important;
     filter: none;
}

a.controld img, a.controld:hover img, a.controld:focus img, a.controld:active img {
     mix-blend-mode: luminosity !important;
}

input.accept, input.disabled[name="savepri"] {
     background: url(images/accept.png) no-repeat 5px center, linear-gradient(to bottom, #eeecea 50%, #ded9d5 50%);
     padding: 5px 5px 5px 21px !important;
}

input.accept:hover, input.accept:focus {
     background: url(images/accept.png) no-repeat 5px center, linear-gradient(to bottom, #fff7ef 51%, #cfc1b5 52%);
}

input.add {
     background: url(images/add.png) no-repeat 5px center, linear-gradient(to bottom, #eeecea 50%, #ded9d5 50%);
     padding: 5px 5px 5px 21px !important;
}

input.add:hover, input.add:focus {
     background: url(images/add.png) no-repeat 5px center, linear-gradient(to bottom, #fff7ef 51%, #cfc1b5 52%);
}

input.cancel {
     background: url(images/cancel.png) no-repeat 5px center, linear-gradient(to bottom, #eeecea 50%, #ded9d5 50%);
     padding: 5px 5px 5px 21px !important;
}

input.cancel:hover, input.cancel:focus {
     background: url(images/cancel.png) no-repeat 5px center, linear-gradient(to bottom, #fff7ef 51%, #cfc1b5 52%);
}

input.create {
     background: url(images/create.png) no-repeat 5px center, linear-gradient(to bottom, #eeecea 50%, #ded9d5 50%);
     padding: 5px 5px 5px 21px !important;
}

input.create:hover, input.create:focus {
     background: url(images/create.png) no-repeat 5px center, linear-gradient(to bottom, #fff7ef 51%, #cfc1b5 52%);
}

input.delete {
     background: url(images/nuke.png) no-repeat 5px center, linear-gradient(to bottom, #eeecea 50%, #ded9d5 50%);
     padding: 5px 5px 5px 21px !important;
}

input.delete:hover, input.delete:focus {
     background: url(images/nuke.png) no-repeat 5px center, linear-gradient(to bottom, #fff7ef 51%, #cfc1b5 52%);
}

input.reload {
     background: url(images/restore.png) no-repeat 5px center, linear-gradient(to bottom, #eeecea 50%, #ded9d5 50%);
     padding: 5px 5px 5px 21px !important;
}

input.reload:hover, input.reload:focus {
     background: url(images/restore.png) no-repeat 5px center, linear-gradient(to bottom, #fff7ef 51%, #cfc1b5 52%);
}

input.reload[name="recheck"], input.disabled[name="recheck"] {
     background: url(images/recheck.png) no-repeat 5px center, linear-gradient(to bottom, #eeecea 50%, #ded9d5 50%);
     padding: 5px 5px 5px 21px !important;
     margin: 6px 2px;
}

input.reload[name="recheck"]:hover, input.reload[name="recheck"]:focus {
     background: url(images/recheck.png) no-repeat 5px center, linear-gradient(to bottom, #fff7ef 51%, #cfc1b5 52%);
}

input.starttorrent {
     background: url(images/next.png) no-repeat 5px center, linear-gradient(to bottom, #eeecea 50%, #ded9d5 50%);
     padding: 5px 5px 5px 18px !important;
     margin: 6px;
}

input.starttorrent:hover, input.starttorrent:focus {
     background: url(images/next.png) no-repeat 5px center, linear-gradient(to bottom, #fff7ef 51%, #cfc1b5 52%);
}

input.stoptorrent {
     background: url(images/btn_stop.png) no-repeat 5px center, linear-gradient(to bottom, #eeecea 50%, #ded9d5 50%);
     padding: 5px 5px 5px 21px !important;
     margin: 4px 5px;
}

input.stoptorrent:hover, input.stoptorrent:focus {
     background: url(images/btn_stop.png) no-repeat 5px center, linear-gradient(to bottom, #fff7ef 51%, #cfc1b5 52%);
}

input[name^="action_"] {
     border-radius: 3px;
     filter: sepia(100%) hue-rotate(340deg);
     max-width: 40px;
     margin-left: 1px;
}

input[name^="action_"]:hover, input[name^="action_"]:focus {
     filter: sepia(100%) hue-rotate(340deg) saturate(120%) drop-shadow(0 0 1px #f60);
     opacity: 1;
     box-shadow: 0 0 1px 0 #f60;
}

select {
     background: #efe6e0 url(images/dropdown.png) right center no-repeat !important;
     color: #2f1500;
     font: 8pt "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Lucida Grande", "Bitstream Vera Sans", Verdana, sans-serif;
     font-weight: bold;
     padding: 5px 14px 5px 5px;
     border-radius: 2px;
     border: 1px solid #2f1500;
     margin: 2px 0 2px 4px;
     -moz-appearance: none;
     -webkit-appearance: none;
     box-shadow: inset 0 0 0 1px #f9f5f2, 0 0 0 1px rgba(186, 160, 143, 0.6);
}

select option {
     font-weight: bold;
}

select:focus {
     background: #fffcdf url(images/dropdown_hover.png) right center no-repeat !important;
     color: #5f1227 !important;
}

@-moz-document url-prefix() {
select option {
     background: #fffcdf;
     box-shadow: inset 0 0 20px 20px #fffcdf;
     color: #5f1227;
}

select option:hover, select option:checked {
     box-shadow: inset 0 0 20px 20px #5f1227;
     background: #f60;
}
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
select {
     padding: 4px;
}
}

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

textarea, input[name="nofilter_dataDir"] {
     background: #efe6e0;
     font-weight: bold;
     padding: 2px 4px;
     border-radius: 2px;
     border: 1px solid #2f1500;
     font-size: 8pt;
     margin-left: 4px;
     font-family: "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Lucida Grande", "Bitstream Vera Sans", Verdana, sans-serif;
     width: 70%;
}

textarea[name="i2cpOpts"] {
     overflow: hidden;
}

textarea[name="i2cpOpts"]:focus, .r:focus, input[type="text"]:focus, select:focus, input[name="nofilter_dataDir"]:focus, input[type="checkbox"]:focus, input[type="radio"]:focus {
     box-shadow: 0 0 1px rgba(223, 0, 103, 0.6);
     transition: ease box-shadow 0.3s 0s, ease filter 0.3s 0s;
}

textarea {
     resize: none;
     height: 26px;
     padding: 4px;
     color: #2f1500;
     font-size: 8pt;
     margin-top: 2px;
}

/* end buttons & inputs */

img {
     border: none;
     margin: 0 2px;
     vertical-align: middle;
     opacity: 1.0;
     line-height: 100%;
     filter: drop-shadow(0 0 1px rgba(117, 114, 106, 0.6));
}

img:hover {
     border: none;
     opacity: 1;
     line-height: 100%;
}

a:hover img, a:focus img {
     filter: drop-shadow(0 0 1px #df0067);
     mix-blend-mode: normal;
}

img[src$="details.png"] {
     mix-blend-mode: luminosity;
}

.snarkFileStatus img {
     mix-blend-mode: luminosity;
}

.snarkFileStatus img[src*="clock"] {
     mix-blend-mode: normal !important;
}

@keyframes fade-in {
0% {
     filter: opacity(0);
}

100% {
     filter: opacity(1);
}
}

.addtorrentsection table, .newtorrentsection table {
      animation: fade-in 0.2s ease-in;
}

.snarkAddInfo code {
      animation: fade-in 0.5s linear;
}

.newtorrentsection, .addtorrentsection, .configsection, .configsectionpanel, .section, .mainsection {
     background: #dfd7d1;
     background-blend-mode: luminosity;
     margin: 0 0 10px 0;
     padding: 0 10px;
     border: 1px solid #1f1400;
     border-radius: 2px;
     box-shadow: inset 0 0 0 1px  #efe6e0, 0 0 1px 0 #4f3d36;
     color: #ddd;
     text-align: center;
     word-wrap: break-word;
}

.section, .mainsection {
     padding: 10px;
     background: #dfd7d1;
     background: linear-gradient(to bottom, #dfd7d1, #cfc7c2);
}

.newtorrentsection {
     background: #dfd7d1 url(images/snark_create.png) no-repeat scroll right center;
     background: url(images/snark_create.png) no-repeat scroll right center, linear-gradient(to bottom, #dfd7d1, #cfc7c2);
     background-size: 80px 80px, 100% 100%;
}

.addtorrentsection {
     background: #dfd7d1 url(images/snark_add.png) no-repeat scroll right 10px center;
     background: url(images/snark_add.png) no-repeat scroll right 10px center, linear-gradient(to bottom, #dfd7d1, #cfc7c2);
     background-size: 61px 61px, 100% 100%;
}

.configsection {
     padding: 0 10px 13px 10px;
     background: url(images/configuration.png) 102% center no-repeat, linear-gradient(to bottom, #dfd7d1, #cfc7c2);
     background-size: 84px 82px, 100% 100%;
}

.configsectionpanel {
     background: #dfd7d1 url(/themes/snark/ubergine/images/configuration.png) no-repeat scroll right center;
     background: url(/themes/snark/ubergine/images/configuration.png) no-repeat scroll right center, linear-gradient(to bottom, #dfd7d1, #cfc7c2);
     background-size: 84px 82px, 100% 100%;
}

.configsectionpanel table {
     margin-bottom: 8px;
}

.configsectionpanel td, .snarkNewTorrent td, select, select option, input, textarea, input[name="nofilter_dataDir"], .configsectionpanel th {
     font-family: "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Lucida Grande", "Bitstream Vera Sans", Verdana, sans-serif;
     font-size: 9pt !important;
}

.iframed .mainsection, .iframed .newtorrentsection, .iframed .addtorrentsection, .iframed .configsection, .iframed .configsectionpanel {
     border-radius: 0;
     box-shadow: inset 0 0 2px 0 #fff, 0 0 1px 0 #4f3d36;
}

.iframed .newtorrentsection, .iframed .addtorrentsection, .iframed .configsection, .iframed .configsectionpanel {
     margin-top: -11px;
}

.addtorrentsection table, .newtorrentsection table, .configsectionpanel table {
     border: none;
}

.addtorrentsection td:first-child, .newtorrentsection td:first-child {
     width: 120px;
     font-weight: bold;
     text-align: right;
}

.addtorrentsection tr:first-child td:last-child {
     white-space: nowrap;
}

.addtorrentsection input[type="text"], .newtorrentsection input[type="text"] {
     width: 75%;
     width: calc(100% - 200px);
}

.snarkConfig tr:nth-last-child(4) td, .trackerconfig tr:nth-last-child(4) td {
     padding-bottom: 10px;
}

.snarkConfig tr:nth-last-child(2) td, .trackerconfig tr:nth-last-child(2) td {
     border-top: 1px solid #6f533e !important;
     padding-top: 10px;
}

.configsectionpanel tr:nth-last-child(2) td:last-child {
     padding-right: 0;
}

.configsectionpanel tr:last-child td, .snarkConfig tr:nth-last-child(3) {
     display: none;
}

.configsectionpanel tr:nth-last-child(2) input {
     float: right;
}

.newtorrentsection form, .configsection form, .addtorrentsection form {
     color: #ddd !important;
}

code, tt {
     font-size: 8.5pt;
     color: #313;
     padding: 0 1px;
     font-weight: bold;
     font-family: "DejaVu Sans Mono", "Droid Sans Mono", "Lucida Console", monospace;
     -moz-user-select: all;
     -webkit-user-select: all;
     -ms-user-select: all;
     user-select: all;
}

.routerdown {
     color: #7f4c0f;
}

.trackerconfig {
     margin-top: 11px; 
     text-align: left !important;
     border-collapse: separate;
     border-spacing: 0;
}

.trackerconfig th {
     background: linear-gradient(to bottom, #efefef 51%, #cfc7c2 52%);
}

.trackerconfig th:first-child {
     border-radius: 2px 0 0 2px;
     border-left: 1px solid #6f533e;
     background: url(/themes/console/images/buttons/delete.png) center right 8px no-repeat, linear-gradient(to bottom, #efefef 51%, #cfc7c2 52%);
}

.trackerconfig th:last-child {
     border-radius: 0 2px 2px 0;
     border-right: 1px solid #6f533e;
}

.trackerconfig th:nth-child(n+4), .trackerconfig th:nth-child(n+5), .trackerconfig td:nth-child(n+4), .trackerconfig td:nth-child(n+5) {
     text-align: center !important;
}

.trackerconfig th, .trackerconfig td, .trackerconfig th:last-child, .trackerconfig td:last-child {
     text-align: left !important;
}

.trackerconfig td:first-child {
     text-align: right !important;
}

.trackerconfig tr:nth-child(2) td {
     padding-top: 10px;
}

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

.trackername {
     width: 100px;
}

.trackerhome {
     width: 200px;
}

.trackerannounce {
     width: 230px;
}

.optbox, input[type="radio"], input[type="checkbox"] {
     min-width: 16px !important;
     min-height: 16px !important;
     opacity: 0.8;
     background: none;
     filter: sepia(50%) invert(80%) hue-rotate(150deg);
}

.optbox:hover, input[type="radio"]:hover, input[type="checkbox"]:hover, .optbox:focus, input[type="radio"]:focus, input[type="checkbox"]:focus {
     outline: none;
     opacity: 1;
     filter: sepia(50%) invert(80%) hue-rotate(150deg) drop-shadow(0 0 2px #df0067);
}

/* toggle create/add panel view */

input.toggle_input { /* hide checkbox and use label as faux panel heading */
      position: absolute;
      opacity: 0;
      z-index: -1;
}

.toggleview:hover {
     color: #f90;
     cursor: pointer;
}

#toggle_addtorrent:not(checked) + label + hr + table, #toggle_createtorrent:not(checked) + label + hr + table {
     display: none;
}

#toggle_addtorrent:checked + label + hr + table, #toggle_createtorrent:checked + label + hr + table {
     display: table;
}

/* display panels by default on webkit based browsers (midori fix) */
/*
@media screen and (-webkit-min-device-pixel-ratio:0) {
#toggle_addtorrent:not(checked) + label + hr + table, #toggle_createtorrent:not(checked) + label + hr + table {
     display: table;
}

#toggle_addtorrent:checked + label + hr + table, #toggle_createtorrent:checked + label + hr + table {
     display: none;
}
}
*/

/* display by default in iframe to avoid overflow issue */

.iframed #toggle_addtorrent:not(checked) + label + hr + table, .iframed #toggle_createtorrent:not(checked) + label + hr + table {
     display: table;
}

.iframed #toggle_addtorrent:checked + label + hr + table, .iframed #toggle_createtorrent:checked + label + hr + table {
     display: none;
}

.toggleview, .snarkConfigTitle a:visited {
     color: #930;
}

.toggleview img:hover, .toggleview:hover img, .snarkConfigTitle a:hover img {
     color: #f90;
     filter: drop-shadow(0 0 1px #f60);
}

.toggleview:active, .snarkConfigTitle a:active {
     color: #603110 !important;
}

.toggleview img:active, .toggleview:active img, .snarkConfigTitle a:active img {
     transform: rotate(90deg);
     transition: ease transform 0.3s 0s;
}

/* end panels toggle */

/* debug */

.debuginfo b {
     text-transform: capitalize;
     font-family: "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", Verdana, "Lucida Grande", Helvetica, sans-serif;
}

/*

.from, .to {
     font-family: sans-serif;
     font-size: 12pt;
     margin: -1px 0 0 0;
     display: inline-block;
}

.debugConnStat {
     display: inline-block;
     white-space: nowrap;
     font-family: "Droid Sans Mono", "Lucida Console", "DejaVu Sans Mono", monospace !important;
     margin-right: 5px;
}

.debugConnstat b {
     color: #2f1500;
}

.debugConnStat, .debugRequests {
     color:#5F3117;
     font-weight: bold;
}

.debugRequests {
     font-family: "Droid Sans Mono", "Lucida Console", "DejaVu Sans Mono", monospace !important;
     margin-left: 4px;
}

.debugConnection {
     display: inline-block;
     line-height: 100%;
     color: #030;
     font-weight: bold;
     margin: 2px 3px !important;
}

*/

.dhtDebug th {
     padding: 0 10px 10px;
     background: #fff;
     background: repeating-linear-gradient(to bottom, #ecebdd 1px, #efebdd 2px, #ebe5d5 5px);
     word-break: break-all;
}

hr.debug {
     width: 100%;
     height: 1px;
     margin: 5px 0;
     background: linear-gradient(to right, #6f533e 40%, #9f8877);
     border-bottom: 1px solid #fff;
}

@-moz-document url-prefix() {
hr.debug {
     height: 2px;
}
}

hr.debug + hr {
     margin-bottom: -1px;
}

hr.debug:first-of-type {
     background: transparent;
     border: none;
     margin-top: 10px;
     margin-bottom: -5px;
}

hr.debug:nth-child(n+7) {
     margin: 4px 0;
}

hr.debug:last-child {
     background: transparent;
     border: none;
     margin-bottom: 5px !important;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
hr.debug:first-of-type {
     background: transparent;
     margin-top: -5px;
     margin-bottom: -5px;
}

hr.debug:nth-child(n+7) {
    margin: -10px 0 4px;
}

hr.debug:last-child {
     background: transparent;
     margin-bottom: 0 !important;
}
}

/* debug panel */

#dhtdebugPanel {
     background: linear-gradient(to bottom, #efefef, #cfc7c2);
     border: 1px solid #212;
     border-top: none;
     border-radius: 0 0 2px 2px;
     box-shadow: 0 0 0 1px #efe6e0 inset, 0 0 1px 0 #4f3d36;
     text-align: center;
     padding-bottom: 13px;
}

#dhtDebugInner {
     text-align: left;
     margin: -24px 0 -13px;
     padding: 0 8px 1px;
     background: #efefef;
     border-radius: 0 0 2px 2px;
}

.dhtDebug th b:first-of-type, .dhtDebug th b:first-of-type + br + hr.debug {
     display: none;
}

/* toggle debug view */

input#toggle_debug:not(checked) + label {
     padding-bottom: 2px;
}

input#toggle_debug:not(checked) + label > img {
     margin-right: -2px !important;
}

input#toggle_debug:not(checked) + label + #dhtDebugInner {
     display: block;
}

input#toggle_debug:checked + label + #dhtDebugInner {
     display: none;
}

.iframed input#toggle_debug:not(checked) + label + #dhtDebugInner {
     display: block;
}

.iframed input#toggle_debug:checked + label + #dhtDebugInner {
     display: none;
}

/* end debug panel */
/* end debug */

.peerinfo td:first-child {
     background: url(images/peer.png) center center no-repeat;
}

.peerinfo td, .debuginfo td {
     padding-top: 5px !important;
     padding-bottom: 5px !important;
}

#totals {
     display: inline-block;
     margin: 2px 0 2px 6px;
     font-weight: bold;
}

#totals span, #ourDest {
     white-space: nowrap;
}

#totals tt {
     line-height: 170%;
}

/* Resource Errors */

.resourceError {
     border: 1px solid #6f533e;
     margin-bottom: 0;
}

.resourceError th {
     background: url(/themes/console/images/info/errortriangle.png) left 10px center no-repeat, linear-gradient(to bottom, #efefef, #cfc7c2);
     background-size: 24px auto, 100% 100%;
     padding: 10px 10px 10px 40px;
}

.mainsection .resourceError td {
     padding: 10px !important;
     font-size: 10pt !important;
}

.resourceError tr:nth-child(odd), #trackerselect tr:nth-child(odd) {
     background: #dfd6d1;
}

.resourceError tr:nth-child(even), #trackerselect tr:nth-child(even) {
     background: #efe6e0;
}

#DoesNotExist {
     margin-top: 10px;
}

/* end Resource Errors */

.priority {
     font-size: 8pt;
     vertical-align: middle;
     text-align: center;
     white-space: nowrap;
     width: 2%;
}

.priority::after {
     content: "";
     display: inline-block;
     min-height: 30px;
     vertical-align: middle;
}

.priority input[type="radio"] {
     text-align: left;
     margin: 3px;
}

.priorityHigh, .priorityNormal, .prioritySkip {
     padding: 0;
     display: inline-block;
     width: 50px;
     font-size: 0;
     text-align: left;
     vertical-align: middle;
     color: transparent;
     overflow: hidden;
}

.priorityHigh {
     background: url(/i2psnark/.resources/icons/clock_red.png) left 24px center no-repeat;
}

.priorityNormal {
     background: url(/i2psnark/.resources/icons/clock.png) left 24px center no-repeat;
}

.prioritySkip {
     background: url(/i2psnark/.resources/icons/cancel.png) left 22px center no-repeat;
}

/* configs */

#configs {
     border-collapse: separate;
}

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

#configs td:first-child {
     min-width: 240px !important;
     width: 25%;
     font-weight: bold;
     text-align: right;
}

#configs tr:nth-last-child(2) td, .trackerconfig tr:nth-last-child(2) td {
     border-top: 1px solid #efe6e0 !important;
}

#configs tr:nth-last-child(4) td, .trackerconfig tr:nth-last-child(4) td {
     border-bottom: 1px solid #4f3d36 !important;
}

#configs input:disabled, #configs input:disabled:hover, #configs input:disabled:focus {
     cursor: not-allowed;
     filter: sepia(50%) invert(80%) hue-rotate(150deg) !important;
     box-shadow: none;
}

td#bwHelp {
     background: url(images/infocircle.png) left 10px center no-repeat;
     background-size: 14px auto;
     padding-left: 28px !important;
     width: 90%;
     line-height: 100%;
}

td#bwHelp a {
     display: inline-block;
     white-space: nowrap;
     font-style: normal;
     margin-left: 4px;
}

/* end configs */

.knownTracker input[type="radio"], .knownTracker input[type="radio"]:hover {
     opacity: 0.3;
     cursor:default;
     filter: sepia(50%) invert(80%) hue-rotate(150deg) !important;
}

.knownTracker input[type="radio"]:checked, .knownTracker input[type="radio"]:checked:hover {
     opacity: 0.5;
}

#filecheck {
     display: inline-block;
     margin: 5px 0;
     background: url(images/progressbar.gif) left center no-repeat;
     padding-left: 22px;
}

#filecheck a {
     margin: 8px;
}

#torrentInfoStats td {
     text-align: left !important;
}

#torrentInfoStats img, .snarkTorrentInfo td:first-child img {
     margin: 1px 3px 2px 2px !important;
     mix-blend-mode: luminosity;
}

.snarkTorrentInfo a:hover img {
     mix-blend-mode: normal !important;
}

#torrentInfoStats b {
     margin-left: 1px;
}

#torrentInfoStats span {
     white-space: nowrap;
     display: inline-block;
     vertical-align: middle;
     margin-right: 8px;
}

/* Comments Section */

#snarkCommentSection {
     filter: drop-shadow(0 0 2px rgba(77, 69, 62, 0.5)) !important;
}

.snarkCommentInfo, .snarkComments {
     margin: 10px 0 0 !important;
     border: 1px solid #6f533e;
     border-top: none;
     border-bottom: none;
     border-collapse: separate;
}

.snarkComments {
     margin-top: 0 !important;
}

.snarkCommentInfo td:first-child, .snarkComments td:first-child {
     text-align: right;
}

.snarkCommentInfo tr:last-child td, .snarkComments tr:last-child td {
     border-bottom: 1px solid #6f533e;
}

.snarkCommentInfo tr:first-child th {
     border-top: 1px solid #6f533e;
}

.snarkComments tr:first-child td {
     border-top: 1px solid #6f533e;
     border-top: 1px outset #fff5ef;
}

.snarkCommentInfo th, .snarkComments th {
     background: linear-gradient(to bottom, #efefef, #cfc7c2);
     padding: 8px 5px;
}

.snarkCommentInfo th {
     background: url(images/comment.png) 8px center no-repeat, linear-gradient(to bottom, #efefef, #cfc7c2);
     padding-left: 28px !important;
}

.snarkCommentInfo th:last-child {
     text-align: right;
}

.snarkCommentInfo tr:nth-child(even), .snarkComments tr:nth-child(odd) {
     background: #dfd6d1;
}

.snarkCommentInfo tr:nth-child(odd), .snarkComments tr:nth-child(even) {
     background: #efe6e0;
}

.snarkCommentInfo th {
     padding: 8px 5px;
}

.snarkCommentInfo td, .snarkComments td {
     padding: 8px 5px;
     border-bottom: 1px outset #efe8e0;
     border-top: 1px outset #fff5ef;
}

.snarkCommentInfo td:first-child {
     white-space: nowrap;
}

.snarkCommentInfo td:first-child {
     font-weight: bold;
}

.snarkCommentInfo td:first-child::after, .snarkComments td:first-child::after {
     content: "";
     display: inline-block;
     min-height: 32px;
     vertical-align: middle;
}

.snarkCommentInfo input.accept {
     float: right;
     margin-right: 5px !important;
}

.snarkCommentInfo textarea {
     width: 100%;
     min-height: 64px;
     height: 64px;
     resize: vertical;
     font-weight: normal;
}

.snarkComments th {
     text-align: left;
}

.commentRating, .commentAuthor {
     width: 1%;
}

#nameRequired {
     float: right;
     margin-right: 5px;
}

.commentRating {
     padding-right: 10px !important;
}

.commentRating img {
     margin: 0 0 3px;
     padding: 0;
     font-size: 14pt;
     color: #ff7200;
     text-shadow: 0 0 1px #900;
     filter: drop-shadow(0 0 1px rgba(153, 0, 0, 0.4));
     width: 16px;
     height: 16px;
}

.commentDate {
     width: 100px;
     background: url(images/clock.png) left center no-repeat;
     padding-left: 20px !important;
}

.snarkCommentInfo td:first-child, .snarkComments td:first-child {
     width: 160px !important;
     padding-right: 2px;
}

.snarkComments td {
     white-space: nowrap;
}

.commentAuthorName {
     background: url(images/author.png) left center no-repeat;
     padding-left: 20px;
}

.commentAuthorName:empty {
     display: none;
}

.commentText {
     white-space: normal !important;
     padding-right: 0;
}

.commentText:empty + .commentDelete {
     background: none;
}

.commentWrapper {
     border: 1px solid #6f533e;
     margin: 4px 2px;
     padding: 8px 10px 8px 26px;
     border-radius: 2px;
     box-shadow: 0 0 0 1px #fff inset, 0 0 1px 0 rgba(77, 69, 62, 0.7);
     background: url(images/comment.png) 6px center no-repeat #fff6df;
     background-blend-mode: luminosity;
}

#commentsConfig .optbox {
     vertical-align: middle;
     margin-left: 0;
}

.snarkComments select {
     margin-right: 0 !important;
}

#commentDeleteAction {
     background: linear-gradient(to bottom, #efefef, #cfc7c2);
     box-shadow: inset 0 0 0 1px #efe8e0;
     border: 1px solid #6f533e;
}

#commentDeleteAction td {
     box-shadow: 0 0 0 1px #efe8e0 inset;
     padding-right: 6px;
}

.commentdelete, .commentAction {
     width: 1%;
     white-space: nowrap;
}

.commentAction input[type="submit"] {
     margin-top: 5px;
     margin-bottom: 5px;
}

.snarkComments .commentDelete {
     background: url(../ubergine/images/nuke.png) 6px center no-repeat;
     text-align: left;
     padding: 5px 6px 5px 24px !important;
}

#newRating td {
     padding-top: 10px !important;
     padding-bottom: 10px !important;
     text-align: center;
}

#newRating td:first-child {
     padding-right: 0 !important;
}

#newRating select {
     width: 90%;
     width: calc(100% - 10px);
     margin-left: 8px;
     text-overflow: ellipsis;
}

#addCommentText {
     padding-left: 0;
}

#myRating td:empty {
     padding: 0 !important;
     border-top: none !important;
     border-bottom: none !important;
}

#myRating td:empty::after { /* hides My Ratings row when Ratings disabled  */
     min-height: 0 !important;
     padding: 0 !important;
}

/* end Comments section */

/* MS Edge fix */
_:-ms-lang(x), * {
     filter: none !important;
}

_:-ms-lang(x), input[type="radio"], input[type="checkbox"] {
     filter: sepia(50%) invert(80%) hue-rotate(150deg) !important;
}

/* end Edge fix */

/* responsive layout */

@media screen and (max-width: 1000px) {
.snarkNav:link {
     padding: 4px 8px 4px 24px !important;
     background-size: 15px auto, 100% 100%, 100% 100% !important;
     background-position: 8px center, center center, center center !important;
}

.nav_main:link {
     padding: 4px 8px 4px 23px !important;
     background-position: 6px center, center center, center center !important;
}

.nav_tracker:link {
     padding: 4px 8px 4px 20px !important;
     background-position: 5px center, center center, center center !important;
}

.snarkTorrents td[colspan="10"] {
     white-space: normal;
}

th.snarkTorrentStatus {
     text-align: right !important;
}

td.snarkTorrentStatus {
     white-space: nowrap;
     font-weight: bold;
}

.snarkTorrentStatus b {
     display: none;
}

b.alwaysShow {
     display: inline;
}

.lowersection .snarkConfigTitle, .lowersection .snarkConfigTitle:hover,  .toggleview, .snarkConfigTitle a {
     font-size: 11pt !important;
}

.configsectionpanel .snarkConfigTitle {
     font-size: 10.5pt !important;
}

td.snarkGraphicStatus img {
     max-height: 16px;
}

/*
.from, .to {
     font-size: 11pt !important;
}
*/

.snarkTorrentOdd td, .snarkTorrentEven td {
     padding-top: 3px;
     padding-bottom: 3px; 
}

.percentBarOuter, .percentBarText, .snarkTorrentDownloaded {
     width: 130px !important;
}

.snarkFileStatus .percentBarText {
     font-size: 8pt;
}

.percentBarOuter, .percentBarInner {
     height: 14px;
}

.percentBarText {
     line-height: 15px !important;
}

.snarkDirInfo .percentBarText {
     line-height: 14px !important;
}

.snarkTorrentDownloaded .percentBarInner {
     background: linear-gradient(to bottom, rgba(255, 247, 239, 0.75), rgba(255, 247, 239, 0.75) 50%, rgba(207, 193, 181, 0.8) 50%, rgba(207, 193, 181, 0.9)), linear-gradient(to right, rgba(255, 100, 0, 0.5) 33px, rgba(255, 255, 0, 0.5) 66px, rgba(0, 255, 0, 0.5));
}

.snarkDirInfo .percentBarInner {
     background: linear-gradient(to bottom, rgba(255, 247, 239, 0.75), rgba(255, 247, 239, 0.75) 50%, rgba(207, 193, 181, 0.8) 50%, rgba(207, 193, 181, 0.9)), linear-gradient(to right, rgba(255, 100, 0, 0.5) 23px, rgba(255, 255, 0, 0.5) 47px, rgba(0, 255, 0, 0.5));
}

.snarkDirInfo .percentBarText, .snarkDirInfo .percentBarOuter, .peerinfo .percentBarOuter, .peerinfo .percentBarText {
     width: 70px !important;
}

.snarkFileStatus {
     width: 120px;
}

.snarkTorrents tt {
     background: none;
     color: #030;
}

.snarkDirInfo thead img {
     max-height: 18px;
}

.snarkDirInfo td:first-child::before {
     min-height: 18px;
}

.knownTracker a, #trackerselect td a {
     display: inline-block;
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
     max-width: 200px !important;
}

#trackerselect td a {
     max-width: 350px !important;
}
}

@media screen and (-webkit-min-device-pixel-ratio:0) and (max-width: 1000px) {
.snarkConfigTitle, .toggleview, .configsectionpanel .snarkConfigTitle, .snarkConfigTitle a, .snarkConfigTitle a:hover,
.configsectionpanel .snarkConfigTitle:hover, .configsectionpanel .snarkConfigTitle:active {
     font-size: 12pt !important;
     letter-spacing: 0.1em !important;
}
}

@media screen and (max-width: 1200px) {
.snarknavbar {
     width: calc(100% - 22px);
     transition: ease width 0.5s 0.5s;
}

.snarkTorrentAction input[type="image"], .snarkTorrents th:last-child input[type="image"] {
     max-height: 9px;
     margin-top: 2px;
     margin-bottom: 2px;
}

_:-ms-lang(x), .snarkNav:link, .snarkNav:visited {
     padding-top: 3px !important;
}

.peerinfo td, .debuginfo td {
     padding-top: 2px !important;
     padding-bottom: 2px !important;
}

.snarkTorrentETA {
     padding-right: 10px !important;
}

.dirInfoComplete {
     display: none;
}

#pagenav img {
     height: 14px;
}

.snarkTorrentDownloaded .percentBarOuter {
     margin-left: 0;
}

.snarkTorrents tfoot tr:first-child th {
     padding-top: 2px;
     padding-bottom: 2px;
     line-height: 120%;
}

.snarkDirInfo td:first-child::before {
     min-height: 20px;
}

.snarkCommentInfo td, .snarkComments td {
     padding: 5px !important;
}

.snarkComments .commentDate {
     padding-left: 20px !important;
}
}

@media screen and (max-width: 1500px) {
#dhtDebugInner {
     margin-top: -21px !important;
     padding-top: 15px;
}
}

@media screen and (-webkit-min-device-pixel-ratio:0) and (max-width: 1200px) {
.snarkConfigTitle, .toggleview, .configsectionpanel .snarkConfigTitle, .snarkConfigTitle a, .snarkConfigTitle a:hover,
.configsectionpanel .snarkConfigTitle:hover, .configsectionpanel .snarkConfigTitle:active {
     font-size: 11pt !important;
     letter-spacing: 0.1em !important;
}

.peerinfo .snarkTorrentDownloaded .percentBarText {
     line-height: normal;
}
}

@media screen and (min-width: 1000px) {
body, .snarkTorrents td, .snarkAddInfo, th, td, .snarkFileName, a.control, input[type="submit"], input[type="reset"], select, button {
     font-size: 9pt !important;
}

.snarkNav:link {
     font-size: 11pt;
     padding: 4px 8px 4px 26px !important;
     background-position: 8px center, center center, center center !important;
}

.nav_main:link {
     background-position: 7px center, center center, center center !important;
}

.nav_tracker:link {
     padding-left: 23px !important;
     background-position: 5px center, center center, center center !important;
}

.snarkTorrentOdd td, .snarkTorrentEven td {
     padding-top: 3px !important;
     padding-bottom: 3px !important;
}

.snarkTorrents tfoot tr:first-child th {
     padding-top: 4px;
     padding-bottom: 4px;
     line-height: 150%;
}

.peerinfo tt {
     display: inline-block;
     margin: 0 3px;
}

.snarkTorrentName {
     padding-left: 1px;
}

.snarkTorrentStatus {
     white-space: nowrap;
}

.snarkTorrentStatus b {
     margin-right: 3px;
}

.snarkTorrentDownloaded .percentBarText {
     line-height: 17px;
}

.peerinfo .snarkTorrentDownloaded .percentBarText {
     line-height: 14px;
}
}

@media screen and (min-width: 1200px) {
.snarkTorrentOdd td, .snarkTorrentEven td {
     padding-top: 4px !important;
     padding-bottom: 4px !important;
}

.snarkNav:link {
     padding: 4px 8px 4px 26px !important;
     background-size: 16px auto, 100% 100%, 100% 100% !important;
     background-position: 8px center, center center, center center !important;
}

.nav_main:link {
     padding: 4px 8px 4px 27px !important;
     background-position: 8px center, center center, center center !important;
     background-size: 18px auto, 100% 100%, 100% 100% !important;
}

.percentDownloaded {
     pointer-events: none; /* hide tooltip */
}

.snarkGraphicStatus::after {
     min-height: 20px;
     vertical-align: middle;
}

.snarkTorrentStatus {
     padding-right: 10px !important;
}

#totals {
     word-spacing: 0.15em;
}

thead a img, thead img {
     max-height: 21px;
}

.mainsection .snarkCommentInfo td, .mainsection .snarkComments td {
     padding: 8px 5px !important;
}

.mainsection .snarkComments .commentDelete {
     padding-left: 24px !important;
}

.mainsection .snarkComments .commentDate {
     padding-left: 20px !important;
}
}

@media screen and (-webkit-min-device-pixel-ratio:0) and (min-width: 1200px) {
.snarkConfigTitle, .toggleview, .configsectionpanel .snarkConfigTitle, .snarkConfigTitle a, .snarkConfigTitle a:hover,
.configsectionpanel .snarkConfigTitle:hover, .configsectionpanel .snarkConfigTitle:active {
     font-size: 13pt !important;
     letter-spacing: 0.1em !important;
}
}

@media screen and (min-width: 1500px) {
body, .snarkTorrents td, .snarkAddInfo, th, td, .snarkFileName, a.control, input[type="submit"], input[type="reset"], select, button, code, #pagenav {
     font-size: 10pt !important;
}

textarea {
     font-size: 9pt !important;
}

tt, .snarkTorrents tt, .snarkMessages {
     font-size: 8.5pt !important;
}

.snarkAddInfo, .configsectionpanel td, .snarkNewTorrent td, .configsectionpanel th,
.configsectionpanel td, .snarkNewTorrent td, select, select option, input, textarea, input[name="nofilter_dataDir"] {
     font-size: 10pt !important;
}

.snarkNav:link {
     font-size: 11.5pt;
     background-size: 17px auto, 100% 100%, 100% 100% !important;
}

.nav_main:link, .nav_forum:link {
     padding-left: 27px !important;
}

.nav_forum:link {
     background-position: 9px center, center center, center center !important;
}

.nav_tracker:link {
     padding-left: 25px !important;
     background-position: 7px center, center center, center center !important;
}

select {
     padding-top: 4px;
     padding-bottom: 4px;
}

.snarkTorrents thead th {
     padding-top: 5px;
     padding-bottom: 5px;
}

.snarkGraphicStatus::after {
     min-height: 22px;
}

.snarkTorrentName:hover a, .snarkFileName:hover a {
     margin: -2px 0 0 -2px;
     padding: 3px 3px 3px 5px !important;
     background: rgba(207, 193, 181, 0.4);
     border-radius: 2px 20px 20px 2px;
     box-shadow: inset 2px 2px 2px rgba(64,52,31,0.3);
}

.snarkFileName:hover a {
     padding-right: 0;
}

.snarkTorrentName:active a, .snarkFileName:active a {
     border: 1px solid #ff2f85;
     box-shadow: inset 4px 4px 4px rgba(64,52,31,0.3);
}

.snarkTorrentDownloaded {
     white-space: nowrap;
}

.snarkTorrentUploaded {
     padding-left: 5px;
}

.snarkTorrentRateUp {
     padding-right: 15px !important;
}

thead a img, thead img {
     max-height: 22px;
}

.snarkTorrentAction input[type="image"], .snarkTorrents th:last-child input[type="image"] {
     padding: 4px !important;
     margin: 2px !important;
}

.snarkConfigTitle, .snarkConfigTitle:hover, .configsectionpanel .snarkConfigTitle,
.configsectionpanel .snarkConfigTitle:hover, .configsectionpanel .snarkConfigTitle:active, .toggleview {
     min-width: 300px !important;
     font-size: 12pt !important;
}

.snarkConfigTitle a {
     padding: 1px 0;
}

.mainsection td, .peerinfo td {
     padding-top: 2px !important;
     padding-bottom: 2px !important;
}

.peerinfo tt {
     margin: 1px 4px;
}

.snarkTorrentStatus b, .dirInfoComplete {
     margin-right: 4px;
}

.mainsection .snarkTorrentInfo td {
     padding-top: 4px !important;
     padding-bottom: 4px !important;
}

.snarkDirInfo td:nth-child(n+2) {
     padding-left: 10px;
     padding-right: 10px;
}

tr#torrentInfoStats td {
     padding-top: 5px !important;
     padding-bottom: 5px !important;
}

.debugConnection {
     margin: 0 4px;
     padding: 2px 3px;
     font-family: "Droid Sans Mono", "Noto Mono", "Lucida Console", "DejaVu Sans Mono", monospace;
     font-weight: bold;
     background: #967158;
     color: #fff;
     border-radius: 2px;
     display: inline-block;
     vertical-align: middle;
}
}

@media screen and (-webkit-min-device-pixel-ratio:0) and (min-width: 1500px) {
.snarkConfigTitle, .toggleview, .configsectionpanel .snarkConfigTitle, .snarkConfigTitle a, .snarkConfigTitle a:hover,
.configsectionpanel .snarkConfigTitle:hover, .configsectionpanel .snarkConfigTitle:active {
     font-size: 14pt !important;
     letter-spacing: 0.1em !important;
}
}

@media screen and (min-width: 1600px) {

tt, .snarkTorrents tt, .snarkMessages {
     font-size: 9pt !important;
}

.snarkNav:link {
     font-size: 12pt;
     background-size: 18px auto, 100% 100%, 100% 100% !important;
}
}

/* mini-mode */

@media screen and (max-width: 800px) {
.page, .snarknavbar {
     min-width: 650px !important;
}

.snarkNav:link, .snarkNav:visited, #configs td, #configs input, #configs select {
     font-size: 8pt !important;
}

th.snarkTorrentStatus a img, .snarkTorrentETA a img, .snarkTrackerDetails a img {
     display: none !important;
}

.snarkGraphicStatus {
     max-width: 12px !important;
     padding-left: 3px !important;
}

.snarkGraphicStatus img {
     max-width: 18px;
}

.snarkTorrents th img {
     max-height: 18px;
}

.snarkTorrents th:nth-child(2) img {
     display: none !important;
}

.snarkTorrentName a {
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis !important;
     max-width: 360px;
}

.snarkTorrentUploaded, .snarkTorrentRateUp, .peerinfo, .debuginfo {
     display: none;
}

.snarkTorrentStatus, .snarkTorrentETA, .snarkTrackerDetails {
     font-size: 0;
     max-width: 0 !important;
     min-width: 0 !important;
     width: 0 !important;
     padding: 0;
}

.snarkCommentDetails {
     padding-left: 5px !important;
     padding-right: 0 !important;
}

.snarkTorrentName {
     padding-left: 2px !important;
}

#configs td:first-child {
     min-width: 150px !important;
}

.trackerconfig a, .trackerconfig input[type="text"] {
     max-width: 150px !important;
}

.trackerconfig, form + form > .configsectionpanel, .addtorrentsection tr:last-child, .snarkTorrentInfo tr:nth-child(n+2) {
     display: none;
}

#trackerselect td a {
     max-width: 200px !important;
}

.snarkTorrentInfo {
     border-bottom: none !important;
     margin-bottom: -11px !important;
     position: relative;
     z-index: 10;
}

.snarkTorrentInfo th {
     padding-top: 8px;
     padding-bottom: 8px;
}

.snarkFileStatus {
     font-size: 0;
     text-align: center;
}

.snarkDirInfo .snarkFileStatus img {
     float: none;
}

.snarkFileStatus img[src*="clock"] {
     float: left;
}

#configs #bwhelp {
     background: none !important;
     font-size: 0 !important;
}

#configs tr:nth-child(n+17) {
     display: none;
}

#configs tr:nth-last-child(2) {
     display: table-row !important;
}

#configs tr, #configs tr:nth-last-child(2) td {
     border: none !important;
}

.addtorrentsection input[type="text"], .newtorrentsection input[type="text"] {
     width: 60% !important;
}

.addtorrentsection td:first-child, .newtorrentsection td:first-child {
     width: 100px;
}

.snarkCommentInfo td:first-child, .snarkComments td:first-child {
     width: 100px !important;
}

.snarkComments .commentDate {
     width: 70px;
}

.snarkComments .commentDelete {
     background: none !important;
     padding-left: 0 !important;
}

#dhtDebugInner {
     margin-top: -24px !important;
}
}

/* end mini-mode */

/* end responsive layout */

.info_tracker, .info_tracker a {
     color: #3f271b !important;
}

.info_tracker {
     margin: 0 4px 0 2px;
     padding: 1px 6px 1px 18px;
     display: inline-block;
     vertical-align: middle;
     background: #e8e8e8 url(images/button_tracker.png) left 3px center no-repeat;
     background-size: 14px auto;
     max-width: 155px;
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
     box-shadow: 0 0 0 1px #cfc6c0;
     border-radius: 3px;
}

.info_tracker:hover, .info_tracker:hover a {
     color: #930 !important;
}

.info_tracker:hover {
     box-shadow: 0 0 0 1px #bfb6b0;
     background: url(images/button_tracker_hover.png) left 3px center no-repeat, linear-gradient(to bottom, #efefef 50%, #cfc7c2 50%);
     background-size: 14px auto;
}

.info_tracker:active, .info_tracker:active a {
     color: #fff !important;
}

.info_tracker:active {
     color: #fff;
     box-shadow: inset 3px 3px 3px #310;
     background: #f60 url(images/button_tracker_active.png) left 3px center no-repeat;
     background-size: 14px auto;
}