Frontend/static/styles/nostalgia/style.css

/*Sugoi JPS Nostalgia*/
:root {
  /*header*/
  --color36: #D3EEFD; /*header*/
  --color5: #D3EEFD; /*menu bar*/
  --color7: #98D9FF; /*menu bar hover*/
  --color9: #222; /*text menu bar*/
  --color37: #E2F4FE; /*search background*/
  --color38: #444; /*search text*/
  --color41: #444; /*user info*/
  /*general*/
  --color0: #F6FAFD; /*background*/
  --color10: #ffffff; /*posts background*/
  --color1: #D3EEFD; /*top posts*/
  --color2: #D3EEFD; /*top posts 2*/
  --color42: #000000; /*header text*/
  --color4: #000000; /*text*/
  --color77: #003399; /*text a*/
  --color60: #ffffff; /*input textarea background*/
  --color61: #000000; /*input textarea*/
  /*interface elements*/
  --color64: #F4F4F4; /*button*/
  --color65: #F6FAFD;/*button hover*/
  --color66: #F4F4F4; /*cat-selector*/
  --color67: #000000; /*cat-selector text*/
  --color74: #ffffff; /*bbcode_bar background*/
  --color75: #222; /*bbcode_bar text*/
  --color76: #000000; /*brackets*/
  --color40: #222; /*tags*/
  
  --color6: #565656; /*menu & filter menu active*/
  --color14: #F4F4F4; /*torrent table background*/
  --color15: #F4F4F4; /*torrents list*/
  --color17: #F4F4F4; /*torrents list 2*/
  --color18: #F4F4F4; /*requests list */
  --color3: #F4F4F4; /*requests list 2*/
  --color79: #AAAAAA; /*collage_image:hover*/
  --color19: #AAAAAA; /*border request*/
  --color20: #AAAAAA; /*tooltipster-content*/
  --color81: #000000; /*torrent group hide/unhide*/
  /*forum*/
  --color50: #F4F4F4; /*forum lists*/
  --color25: #000ff; /*quote username color*/
  --color27: #666; /*quote border*/
  --color48: #ffffff; /*quote background*/
  --color43: #222; /*text coldhead*/
  --color44: #003399; /*link*/
  --color70: red; /*link hover*/
  --color16: #D3EEFD; /*staff forum post*/
  --color78: #AAAAAA; /*colhead_dark .last_read & arrow*/
  --color80: #F0BBD6; /*unread forum message*/
  /*notifications*/
  --color8: #9DDBFE; /*alarm bar*/
  --color39: #555; /*alarm bar text*/
  --color29: #D3EEFD; /*noty bottomRight top*/
  --color30: #000000; /*noty_bottomRigh top text*/
  /*misc*/
  --color68: #ECC; /*unreadpm, ratio bracket*/
  --color28: #d9e0ff; /*poll*/
  --color45: #000000; /*footer*/
  --color31: #F6FAFD; /*site debug border*/
  --color32: red; /*reported*/
  --color33: #C35C1C; /*snatched*/
  --color34: #BD0D0D; /*leeching*/
  --color35: #068206; /*seeding*/
  --color72: green; /*vote_tag_up*/
  --color73: red; /*vote_tag_down*/
  --color11: #AF2525; /*error_message background*/
  --color71: white; /*error_message text*/
  --color12: #F4E649; /*save_message background*/
  --color13: #B00D0D; /*elem_error*/
  --color21: #999; /*border*/
}

/*personal additions*/
.colhead_dark a {
	color: var(--color43);
}

.autocomplete-suggestions strong {
  font-weight: normal;
  color: #0B2593;
}

/* Layout (Torrents page) */

#site_debug td{
  border: 1px solid var(--color31);
}

/* Global */
* {
  padding: 0em;
  margin: 0em;
}

html {
  width: 100%;
}

body {
  width: 100%;
  background-color: var(--color0);
  font-family: tahoma, helvetica, sans-serif;
  font-size: 8pt;
  color: var(--color4);
  min-width: 850px;
}

/* Common elements */

.header a, h2{
  color: var(--color42);
}

a {
  text-decoration: none;
  border: none;
  color: var(--color77);
}

a:hover {
  text-decoration: underline;
}

button, input[type=button], input[type=submit] {
  background: var(--color64);
  box-shadow: none;
  color: var(--color9);
  border: 1px solid var(--color21);
}
button:hover, input[type=button]:hover, input[type=submit]:hover {
  background: var(--color65);
}
button:focus, input[type=button]:focus, input[type=submit]:focus {
  background: var(--color65);
}

.spoilerButton {
  max-width: 540px;
}

.forum_list .forum_index td:nth-of-type(2) {
  width: 20%;
}

.forum_post .body a:not([href="#"]), .rule_summary a, .wiki_article a, #actual_rules a, .news_post .pad a, .store_table a {
  text-decoration: none;
  border: 1px white;
  color: var(--color44);
}

.forum_post .body a:hover:not([href="#"]), .rule_summary a:hover, .wiki_article a:hover, #actual_rules a:hover, .news_post .pad a:hover, .store_table a:hover {
  text-decoration: underline;
  border: 1px white;
  color: var(--color70);
}

h1,h2,h3,h4 {
  margin: 5px 0px;
  font-weight: bold;
  color: var(--color42);
}

h2 {
  text-align: center;
  font-size: 12pt;
}

h4 {
  font-size: 8pt;
}

p {
  margin: 10px 5px;
}

li {
  margin: 5px 15px;
}

img {
  border: none;
}

/* Styles generated by the BBCode parser */

span.size1 { font-size:0.75em; }
span.size2 { font-size:1em; }
span.size3 { font-size:1.25em; }
span.size4 { font-size:1.5em; }
span.size5 { font-size:1.75em; }
span.size6 { font-size:2em; }
span.size7 { font-size:2.25em; }
span.size8 { font-size:2.5em; }
span.size9 { font-size:2.75em; }
span.size10 { font-size:3em; }

ul.thin { margin:0px 0px 0px 25px; padding:0px; }
ul.thin li { margin:0px 0px; padding:0px; }

/* Layout (Every page) */

#header {
  width: 100%;
  padding: 0px 0 0 0;
  background: var(--color36);
  margin-bottom: 10px;
}

#content {
  margin: auto;
  margin-top: 10px;
/*  margin-top: 100px; */
  width: 90%;
  min-width: 872px;
  overflow: hidden;
}

#footer {
/*  margin-top: 40px; */
  margin-top: 10px;
  width: 100%;
  text-align: center;
  padding: 1em 0;
  opacity: 0;
  transition: ease-in-out 0.3s;
  transition-delay: 0.7s;
  /* color: var(--color4);  */
}
#footer:hover {
  opacity: 1;
}
#footer a { 
  color: var(--color45);
}
#footer a:hover {
  text-decoration: underline;
}

#logo {
  width: 1140px;
  height: 150px;
  margin: 0 auto;
}

#logo a {
  border: none;
  width: 100%;
  height: 150px;
  display: block;
}

#logo a:hover {
  border: none;
}

#menu {
  width: 100%;
  text-align: center;
  background-color: var(--color5);
  font-size: 10pt;
}

#menu > ul {
  display: flex;
  width: 70%;
  margin: 0 auto;
}

#menu > ul > li {
  position: relative;
  height: 32px;
  display: flex;
  margin: 0;
  flex: 1 1 auto;
  font-weight: bold;
}

#menu ul > li > a {
  padding: 0.6em 0;
  display: inline-block;
  width: 100%;
  color: var(--color9);
  transition: ease-in-out 0.2s;
}

#nav_links {
  max-width: 40px;
}

#menu ul li a.active {
  background-color: var(--color6);
}

#menu ul li a:hover {
  background-color: var(--color7);
  text-decoration: none;
}

#menu .nav_dropdown {
  background: var(--color5);
  margin-top: 0;
}

.nav_dropdown > div {
  position: absolute;
  background-color: var(--color5);
  width: 100%;
  z-index: 99999;
  margin-top: 32px;
  left: 0;
}

#nav_links > #links_menu {
  width: 120px;
  margin-left: -80px;
}

.nav_dropdown > div > a {
  display: none;
  color: var(--color9);
  height: 32px;
  line-height: 32px;
}

.nav_dropdown:hover > div > a {
  display: block;
}

#filter_menu {
  width: 100%;
  text-align: center;
  background-color: var(--color5);
  font-size: 10pt;
}

#filter_menu > ul {
  display: flex;
  width: 80%;
  margin: 0 auto;
}

#filter_menu > ul > li {
  position: relative;
  height: 26px;
  display: flex;
  margin: 0;
  flex: 1 1 auto;
}

#filter_menu ul > li > a {
  padding: 0.4em 0;
  display: inline-block;
  width: 100%;
  color: var(--color9);
  transition: ease-in-out 0.1s;
}

#filter_menu ul li a.active {
  background-color: var(--color6);
}

#filter_menu ul li a:hover {
  background-color: var(--color7);
  text-decoration: none;
}

#userinfo {
/*  position: absolute;
  top: 258px; */
  color: var(--color41);
  padding: 4px 0px;
  width: 100%;
  text-align: center;
  font-size: 8pt;
  /* border-bottom: 1px solid #999; */
}

#userinfo img {
  margin-top: -5px;
}

#userinfo ul {
  display: inline;
  margin: 0px 0.8%;
}

#userinfo ul li {
  display: inline;
  margin: 0 0.1em;
  line-height: 20px;
  vertical-align: middle;
  padding: 0px;
}

#userinfo a {
  color: var(--color9);
}
#userinfo a:hover {
  text-decoration: underline;
}

#userinfo b a {
  font-weight: normal;
  font-size: 0.9em;
  font-weight: bold;
}

#searchbars {
  text-align: center;
  box-sizing: border-box;
  display: flex;
  width: 60%;
  margin: 4px auto;
  min-width: 850px;
}

#searchbars > .search_form {
  flex: 1 1 auto;
  text-align: center;
  margin: 0 3px;
  border:  1px solid #CCC;
}

#searchbars input {
  position: relative;
  border: none;
  box-sizing: border-box;
  padding: 2px 2px 2px 4px;
  font-size: 0.9em;
  background-color: var(--color37);
  width: 100%;
  color: var(--color38);
}

#searchbars ul {
  margin: 0 auto;
  display: block;
  text-align: center;
}

#searchbars ul li {
  display: inline;
  margin: 0px 1px;
  list-style: none;
  position: relative;
}

#searchbars ul li ul {
  display: block;
  position: absolute;
  top: 1em;
  left: 0;
  z-index: 1000;
  background-color: var(--color10);
  width: 12em;
  margin-top: 12px;
}

#searchbars ul li ul li {
  margin: 0 0 0 0;
  padding: 0;
  display: block;
  width: 100%;
}

#searchbars ul li ul li.highlight {
  background: var(--color10);
}

#searchbars ul li form {
  display: inline;
}

#alerts {
/*  margin-top: 85px;
  margin-bottom: -85px; */
/*  padding: 10px 0px; */
  margin: 10px 0px;
}

#cat-selector ul {
  width: 100%;
}

#cat-selector ul li {
  display: inline;
  width: 12em;
  height: 1em;
  float: left;
}

.alertbar {
  border: 1px solid var(--color21);
  background-color: var(--color8);
  text-align: center;
  color: var(--color4);
  font-weight: bold;
  font-size: 0.95em;
  width: 350px;
  margin: 0 auto 0px auto;
  padding: 10px;
}
.alertbar a {
  color: var(--color39);
  text-decoration: none;
}
.alertbar a:hover {
  text-decoration: underline;
}

/* IE doesn't appear to like a simple display:none in our header. Random things start fucking up pretty badly. */
.hidden {
  position: absolute;
  left: -10000px;
}

input.hidden {
  position: absolute;
  display: none;
}

/* Layout (Any page) */


.thin {
  width: 850px;
  margin: 0px auto;
}

#userinfo_major .brackets:before {
  font-weight: bold;
}

#userinfo_major .brackets:after {
  font-weight: bold;
}

#userinfo #userinfo_minor {
  position: absolute;
  text-align: left;
}

#userinfo_minor > li > ul {
  display: none;
  position: absolute;
  padding: 5px;
  left: -5px;
  background-color: var(--color8);
  z-index: 100;
}

#userinfo_minor li {
  display: block;
}

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

.center {
  text-align: center;
}

.right {
  text-align: right;
}

.min_padding {
  padding: 0px;
  margin: 0px 0px;
}

p.min_padding {
  margin: 2px 0px;
}

.pad {
  padding: 1em;
}

.slight_margin {
  margin: 4px;
}

.vertical_space {
  margin-bottom: 10px;
}

.box {
  font-size: 8pt;
  background-color: var(--color10);
  border: 1px solid var(--color21);
  margin-bottom: 10px;
}

.torrents_nomatch {
  margin-top: 10px;
}

.box2 {
  margin-bottom: 10px;
  font-size: 8pt;
  background-color: var(--color10);
  border: 1px solid var(--color21);
}

.pad h3, .pad h4, .padbox h3, .padbox h4 {
  margin-top: 0px;
  padding-top: 0px;
  color: var(--color42);
}

.sidebar {
  float: right;
  width: 245px;
}

.head {
  padding: 4px;
  border-bottom: 1px solid var(--color21);
  /* background: #E1E1E1; */
  background: var(--color1);
  color: var(--color9);
}

.head a {

text-decoration: none;
border: none;
color: var(--color9);
}

.head a:hover  {
text-decoration: underline;
color: var(--color9);
}

.body {
  padding: 3px 10px 10px 10px;
}

.main_column {
  width: 592px;
}

#user .main_column table {
  margin-bottom: 10px;
}

/*
These 3 #artist styles extend the width to ensure .sidebar does not steal width from .main_column
and result in it only being 592px, which despite looking ok for the news items on the main page
and other areas, it is just too thin for any torrent table.
*/
#artist .main_column {
  width: 845px;
}

#artist .thin {
  width: 1100px;
}

body#artist {
  min-width: 1225px;
}

.tags {
  padding: 0px 0px 0px 20px;
  font-style: italic;
}

.tags a {
  color: var(--color40);
}

.tags a:hover {
  text-decoration: underline;
}

.noborder {
  border: none;
}

ul.nobullet, ul.nobullet li {
  list-style-type: none;
}

table {
  width: 100%;
  border-collapse: collapse;
  border: 1px solid var(--color21);
}

tr {
  background-color: var(--color10);
}

td, th {
  /* border: 1px solid var(--color21); */
  padding: 5px;
  text-align: left;
  border: 1px solid var(--color21);
}

.colhead {
  background: var(--color2);
  font-weight: bold;
  color: var(--color9);
}

td.colhead, .colhead td, .colhead th {
  padding-left: 10px;
  padding-right: 10px;
}

.colhead a {

text-decoration: none;
border: none;
color: var(--color9);
}

.colhead a:hover  {
text-decoration: underline;
color: var(--color9);
}
.colhead .sign, .colhead_dark .sign {
  padding: 0px 8px 0px 8px;
  vertical-align: middle;
  text-align: center;
  font-size: 12pt;
  font-weight: bold;
}


.colhead .sign {
  padding: 0px 8px 0px 8px;
  font-size: 12pt;
  font-weight: bold;
}

.colhead_dark {
  background: var(--color2);
  color: var(--color9);
}
.staff_post .colhead_dark {
  background: var(--color16);
}

td.label {
  font-weight: bold;
  text-align: right;
  width: 180px;
}

.label_annotate {
  font-weight: normal;
  text-align: right;
  margin: 0px;
}

table.slice {
  margin-top: -1px;
}

.error_message {
  border: 1px solid var(--color22);
  padding: 3px 0px 3px 0px;
  background-color: var(--color11);
  text-align: center;
  color: var(--color71);
  font-weight: bold;
}

.save_message {
  border: 1px solid var(--color22);
  padding: 3px 0px 3px 0px;
  background-color: var(--color12);
  text-align: center;
  color: var(--color24);
  font-weight: bold;
}

.elem_error {
  border: 3px solid var(--color13);
}

.hidden {
  display: none;
}

ul.nobullet {
  display: inline-block;
}


/* Layout (home page) */

ul.stats li {
  padding: 0px 0px 1px 0px;
}

ul.poll li {
  padding: 0px 0px 0px 10px;
  margin: 0px;
  clear: left;
}

ul.poll li.graph {
  margin-bottom: 3px;
  padding-left: 20px;
}

/* Layout (Torrents page) */

.show_torrents {
  width: 21px;
  height: 28px;
  background: url('images/show2.png') no-repeat center center;
}

.hide_torrents {
  width: 21px;
  height: 28px;
  background: url('images/hide2.png') no-repeat center center;
}

.show_torrents_link {
  border: none;
  width: 28px;
  height: 28px;
  display: block;
  cursor: pointer;
}

.filter_torrents {
  width: 750px;
  margin: auto;
  background: var(--color10);
}

.filter_torrents .submit {
  text-align: right;
  padding-top: 5px;
}

.filter_torrents .ft_cat_list {
  border-top: 1px solid var(--color10);
  border-bottom: 1px solid var(--color10);
}

#content form.search_form + .torrent_table {
  margin-top: 20px;
}

#content form.search_form .submit {
  text-align: center;
}

.cat_list tr td {
  border: none;
}

.torrent_table tr {
  /* vertical-align: top; */
  vertical-align: middle;
  border: 1px solid var(--color21);
}

h3 a {
  color: white;
}

.torrent_table .number_column {
  text-align: center;
}

.torrent_table, .torrent_table td {
  border: 1px solid var(--color21);
}

.torrent_table tr.torrent, .torrent_table tr.group {
  font-weight: bold;
}

.torrent_table tr.group {
  background-color: var(--color17);
}
.torrent_table tr.group_torrent {
  background-color: var(--color10);
}
.torrent_table tr.torrent {
  background-color: var(--color10);
}

.torrent_table tr.group td.center:first-child {
  padding: 3px;
  width: 21px;
}
.torrent_table tr.torrent:nth-child(2n) {
  background-color: var(--color14);
}
.torrent_table tr.torrent:nth-child(2n-1) {
  background-color: var(--color15);
}
/*
It is not possible to .addClass() nth-child so a new style must be created with
the same css attributes as the nth-child lines above.
Also defining an extra style class with nth-child also does not work so an extra
css block is needed for .rowlight and .rowdark*/
.torrent_table tr.torrent.rowlight {
  background-color: var(--color14);
}
.torrent_table tr.torrent.rowdark {
  background-color: var(--color15);
}

.torrent_table div.tags {
  font-weight: normal;
  max-width: 500px;
}

.torrent_table tr .center, #collage_table td {
  vertical-align: middle;
  text-align: center;
}

.group_torrent span {
  float: right;
}

.torrent span {
  font-weight: normal;
  float: right;
}

.nobr {
  white-space: nowrap;
}

/* Layout (Forums) */

.last_read {margin-left: 5px; fill: var(--color78);}
.colhead_dark .last_read {fill: var(--color78);}

.unread_locked_sticky{background: url(https://sugoimusic.me/static/styles/sugoi/images/locked_sticky_unread.png) no-repeat center center;}
.read_locked_sticky{background: url(https://sugoimusic.me/static/styles/sugoi/images/locked_sticky_read.png) no-repeat center center;}
.read_sticky{background: url(https://sugoimusic.me/static/styles/sugoi/images/sticky_read.png) no-repeat center center;}
.unread_sticky{background: url(https://sugoimusic.me/static/styles/sugoi/images/sticky_unread.png) no-repeat center center;}
.unread_locked{background: url(https://sugoimusic.me/static/styles/sugoi/images/locked_unread.png) no-repeat center center;}
.read_locked{background: url(https://sugoimusic.me/static/styles/sugoi/images/locked_read.png) no-repeat center center;}
.unread{background: url(https://sugoimusic.me/static/styles/sugoi/images/unread.png) no-repeat center center;}
.read{background: url(https://sugoimusic.me/static/styles/sugoi/images/read.png) no-repeat center center;}
strong.quoteheader {color: var(--color25);}

tr.row:nth-of-type(odd) {
  background-color: var(--color50);
}

table.forum_post {
  margin: 10px 0px;
}

table.forum_post td {
  /* border: 1px solid var(--color22); */
  border: none;
}

table.forum_unread {
  border: 2px solid  var(--color80);
}

td.avatar {
  width: 150px;
  padding: 0px;
}

.box_description > div:not(.head) {
  max-height: 400px;
  overflow-y: scroll;
}
.box_description, table.forum_post td.body {
  word-break: break-word;
  word-wrap: break-word;
  display: inline-block;
}
.box_description {
  width: 100%;
}
.thin > table.forum_post td.body {
  width: 690px;
}
#torrent_comments table.forum_post td.body {
  width: 422px;
}

blockquote {
  margin: 10px;
  padding: 10px;
  /* border: 1px dashed var(--color22); */
  border: 1px dashed var(--color27);
  background: var(--color48);
}


/* Layout (Inbox) */


tr.unreadpm {
  background-color: var(--color68);
}

/* Layout (Permission Page) */

.permission_head {
  width: 400px;
  margin-left: auto;
  margin-right: auto;
}

.permissions {
  width: 930px;
  margin-left: auto;
  margin-right: auto;
}

.permission_container {
  float: left;
  width: 300px;
  padding: 5px;
}
.permission_container input {
  margin: 0px 3px 5px 0px;
  vertical-align: top;
}

.submit_container {
  clear: both;
  text-align: right;
}

/* Layout (Invite tree) */

ul .invitetree {
  margin: 0px 0px 0px 25px;
}

.invitetree li {
  list-style: none;
  margin: 10px 2px;
}

/* Layout (User options) */

.user_options .options_list li {
  margin: 0;
}

/* Layout (MISC) */

.left_poll {
  display: none;
  width: 2px;
  height: 9px;
  float: left;
  margin: 0px;
  padding: 0px;
}

.center_poll {
  height: 9px;
  background: var(--color28);
  border-radius: 4px;
  float: left;
  margin: 0px;
  padding: 0px;
}

.right_poll {
  display: none;
  width: 2px;
  height: 9px;
  float: left;
  margin: 0px;
  padding: 0px;
}

.curtain {
  position: fixed;
  top: 0%;
  left: 0%;
  width: 100%;
  height: 100%;
  background-color: black;
  z-index: 1001;
  -moz-opacity: 0.8;
  opacity: .80;
  filter: alpha(opacity=80);
}

.lightbox {
  position: fixed;
  text-align: center;
  top: 5%;
  left: 5%;
  width: 90%;
  height: 90%;
  padding: 0px;
  z-index: 1002;
  overflow: auto;
}

.center {
  text-align: center;
}

.spellcheck {
  margin: 25px 0;
  font-size: 1.25em;
  font-weight: bold;
}

tr.torrent .bookmark > a:before {
  color: black;
}
tr.torrent .bookmark > a:after {
  color: black;
}

.field_div {
  margin-bottom: 10px;
}

.edit_changelog textarea {
  width: 600px;
}

.brackets {
  font-weight: normal;
  color: var(--color76);
}

div[class~=tooltipster-content] > a {
  color: var(--color20);
}

.post_id {
  font-weight: normal;
  margin-bottom: 5px;  /* Hack to allow forum thread head column to look OK even if user has no displayed badges */
}

.vote_tag_up, .vote_artist_up, .vote_album_up, .small_upvote, .small_upvoted {
  color: var(--color72);
}

.vote_tag_down, .vote_artist_down, .vote_album_down, .small_downvote, .small_downvoted {
  color: var(--color73);
}

/* get rid of extraneous padding in the Top Contributors box */
#request_top_contrib {
  border: none;
}
#request_top_contrib tr:first-child th {
  border-top: 0;
}
#request_top_contrib tr:last-child td {
  border-bottom: 0;
}
#request_top_contrib tr td:first-child,
#request_top_contrib tr th:first-child,
#request_top_contrib tr td:nth-child(2),
#request_top_contrib tr th:nth-child(2) {
  border-left: 0;
  border-top: 0;
}
#request_top_contrib tr td:last-child,
#request_top_contrib tr th:last-child {
  border-right: 0;
}

#requests table.layout.cat_list {
  border-bottom: 1px solid var(--color19);
  border-top: 1px solid var(--color19);
}
#requests tr#media_list {
  border-bottom: 1px solid var(--color19);
  border-top: 1px solid var(--color19);
}
#request_table {
  margin-bottom: 5px;
  border: 1px solid var(--color21);
}
#request_table .request:nth-of-type(odd){
  background: var(--color3);
}
#request_table .request:nth-of-type(even){
  background: var(--color18);
}

/* workaround for calendar display issue */
div.sidebar #event_div {
  margin-left: -232px;
}

ol {
  margin-left: 1em;
}

#forum_search_cat_list {
  border: none;
}

#coverCont {
  background-color: var(--color18);
  padding: 5px;
  box-shadow: none;
}
#coverCont img {
  background-color: var(--color18);
}
.torrent_info {
  font-size: 100%;
  font-weight: 100;
}
.group_info > a:last-of-type {
  text-decoration: underline;
}
.group_image {
  padding-right: 1em;
}

.recent_snatches_images, .recent_uploads_images {
  position: relative;
}

.edit_tags_votes {
  padding-left: 5px;
}

.row_hl {
  background-color: var(--color68);
}

input.inputtext {
  border: none;
  border-bottom: 1px solid var(--color21);
  background-color: rgba(0, 0, 0, 0);
  font-size: 13px;
  outline: none;
  transition: ease-in-out 0.12s;
}
input.inputtext:focus {
  border-bottom: 1px solid var(--color2);
}

input, textarea {
  background-color: var(--color60);
  padding: 5px 5px;
  color: var(--color61);
  outline: none;
  border: 1px solid var(--color21);
}

select {
  padding: 5px 5px;
  background-color: var(--color66);
  color: var(--color67);
  border-radius: 0px;
  outline: 1px solid var(--color21);
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: none;
}

.bbcode_bar {
  background: var(--color74);
  border-bottom: none;
  color: var(--color75);
}
.collage_images .collage_image {
  margin: 1px;
  width: 121px;
  display: inline-block;
}

.box, .border, .alertbar, .artist_table, .request_table, .forum_index, #userinfo_minor > li > ul, .permissions table {
  box-shadow: none;
}
#userinfo {
  box-shadow: none;
}

.last_edited {
  font-size: 10px;
  opacity: 0.7;
}

#comm_badge_tr .badge_icon, #user_badge_edit_tr .badge_icon {
  margin-right: 1em;
  margin-left: 2px;
}

.store_table .badge_icon {
  display: inline-block;
}

.store_table .badge_icon img {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.hnr-yes {
  color: red;
}
.hnr-no {
  color: green;
}

.webm {
  max-width: 100%;
}

.point_gift_box p {
  margin: 7px 2px 0px;
}
.point_gift_box input[type="text"], .point_gift_box textarea {
  width: 100%;
  box-sizing: border-box;
}
.dead {
  opacity: 0.6;
}
.search_warning {
  fill: var(--color2);
}
.tl_reported {
  color: var(--color32);
}

.tl_snatched {
  color: var(--color33);
}
.tl_leeching {
  color: var(--color34);
}
.tl_seeding {
  color: var(--color35);
}
caption {
  border-bottom: 1px solid var(--color27);
  font-weight: bold;
}

#noty_bottomRight_layout_container li {
	background-color:var(--color29) !important;
	color: var(--color30) !important;
	border: 1px solid var(--color21) !important;
}

.noty_buttons {
	background-color: var(--color10) !important;
	border: 1px solid var(--color21) !important;
}


.tag_parody {
	color: #e08e00 !important;
}
.tag_character {
	color: #099809 !important;
}
.tag_female {
	color: #d51b8a !important;
}
.tag_male {
	color: #0000ff !important;
}

.collage_image:hover {
  box-shadow: none;
  position: relative;
}


/* table border fix */

.group_displayname,
.group_displayname td{
/* Removes Border around torrent name and category on details page*/
  border:none;
}

.box .torrent_table,
.box .torrent_table tr{
  border:none;
}

.box .torrent_table tr.colhead>td,
.box .torrent_table tr.colhead_dark>td{
  border-top:none;
}

#artist .box .torrent_table tr.colhead>td,
#artist .box .torrent_table tr.colhead_dark>td{
  border: 1px solid var(--color21);
}

.box .torrent_table tr:last-of-type>td{
  border-bottom:none !important; 
 }


.box .torrent_table tr:nth-last-of-type(2)>td{
   /*
 remove bottom border of second last row;
 needed for table on torrent details, since the last row there can be hidden
 */
  border-bottom:none !important; 
 }
 
 .box .torrent_table td:first-of-type{
   border-left:none !important;
 }
 
 .box .torrent_table td:last-of-type{
   border-right:none !important;
 } 

 /* table border fix end */
 
/* Hide/Unhide torrent group icon */
.hide_torrents, .show_torrents {
  position: relative;
  cursor: pointer;
}

.hide_torrents>.show_torrents_link:after, .show_torrents>.show_torrents_link:after {
  content: "";
  position: absolute;
  width: 19px;
  height: 3px;
  top: 13px;
  left: 1px;
  border-radius: 2px;
  background-color: var(--color81);
}

.show_torrents>.show_torrents_link:before {
  content: "";
  position: absolute;
  width: 3px;
  height: 19px;
  top: 5px;
  left: 9px;
  border-radius: 2px;
  background-color: var(--color81);
}