Frontend/static/styles/noir2/style.css

/*Sugoi Noir II*/
:root {
  /*header*/
  --color36: #222; /*header*/
  --color5: #444; /*menu bar*/
  --color7: #333; /*menu bar hover*/
  --color9: #FFF; /*text menu bar*/
  --color38: #CCC; /*search text*/
  --color37: #1c1c1c; /*search background*/
  --color41: #999; /*userinfo text*/
  --color83: #1c1c1c; /*userinfo background*/
  /*general*/
  --color14: #222; /*torrent table background, torrents list 1&2, requests list 1&2, forum list*/
  --color0: #222; /*background*/
  --color82: #333; /*content background*/
  --color1: #121212; /*top posts*/
  --color42: #CCC; /*header text*/
  --color4: #999; /*text*/
  --color77: #CCC; /*text a*/
  --color44: #CCC; /*link*/
  --color70: #999; /*link hover*/
  --color60: #DDD; /*input textarea background*/
  --color61: #222; /*input textarea text*/
  /*interface elements*/
  --color64: #333; /*button, cat-selector*/
  --color65: #555;/*button hover*/
  --color67: #CCC; /*cat-selector text*/
  --color74: #333; /*bbcode_bar background*/
  --color75: #999; /*bbcode_bar text*/
  --color76: #BBB; /*brackets*/
  --color40: #999; /*tags*/
  
  --color6: #565656; /*menu & filter menu active*/
  --color79: #444; /*collage_image:hover*/
  --color19: #444; /*border request*/
  --color20: #444; /*tooltipster-content*/
  /*forum*/
  --color25: #AAA; /*quote username color*/
  --color27: #222; /*quote border*/
  --color48: #333; /*quote background*/
  --color43: #CCC; /*text coldhead*/
  --color16: #008572; /*staff forum post*/
  --color78: #FFF; /*colhead_dark .last_read & arrow*/
  --color80: #BBB; /*unread forum message*/
  /*notifications*/
  --color8: #333; /*alarm bar*/
  --color39: #DDD; /*alarm bar text*/
  --color29: #DDD; /*noty bottomRight top*/
  --color30: #444; /*noty_bottomRigh top text*/
  /*misc*/
  --color68: #000; /*unreadpm, ratio bracket*/
  --color28: #EEE; /*poll*/
  --color45: #000000; /*footer*/
  /*****************************/
  --color32: red; /*reported*/
  --color33: #C35C1C; /*snatched*/
  --color34: #BD0D0D; /*leeching*/
  --color35: #068206; /*seeding*/
  --color84: gold; /*freeleech*/
  --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*/
  /*border*/
  --color21: #333; /*general*/
  --color81: #222; /*searchbar*/
  --color31: #333; /*site debug border*/
}

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

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

table.center.group_displayname {
border: none;
}

#forums td {
    border: 1px solid var(--color21);
}
#forums td.body.valign_top {
  border: none;
}

#torrents td {
  border: none;
}
#torrents td.number_column {
  border: 1px solid var(--color21)
}

/* 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_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;
  width: 90%;
  min-width: 872px;
  overflow: hidden;
  background: var(--color82);
}

#footer {
  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: 70%;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  background-color: var(--color5);
  font-size: 10pt;
}

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

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

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

#menu ul li a img {
  vertical-align: middle;
}

#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: 90%;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  font-size: 8pt;
  background-color: var(--color83);
  /* 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 var(--color81);
}

#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(--color14);
  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(--color14);
}

#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(--color14);
  border: 1px solid var(--color21);
  margin-bottom: 10px;
}

.torrents_nomatch {
  margin-top: 10px;
}

.box2 {
  margin-bottom: 10px;
  font-size: 8pt;
  background-color: var(--color14);
  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;
}

#index .main_column {
  margin-top: 4px;
}

#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(--color14);
}

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

.colhead {
  background: var(--color1);
  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(--color1);
  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(--color14);
}

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

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

#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(--color14);
}
.torrent_table tr.group_torrent {
  background-color: var(--color14);
}
.torrent_table tr.torrent {
  background-color: var(--color14);
}

.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(--color14);
}
/*
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(--color14);
}

.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(--color14);
}

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

table.forum_post td {
  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(--color14);
}
#request_table .request:nth-of-type(even){
  background: var(--color14);
}

/* 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(--color14);
  padding: 5px;
  box-shadow: none;
}
#coverCont img {
  background-color: var(--color14);
}
.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: var(--color60);
  font-size: 13px;
  outline: none;
  transition: ease-in-out 0.12s;
}
input.inputtext:focus {
  border-bottom: 1px solid var(--color1);
}

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(--color64);
  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(--color1);
}
.tl_reported {
  color: var(--color32);
}

.tl_snatched {
  color: var(--color33);
}
.tl_leeching {
  color: var(--color34);
}
.tl_seeding {
  color: var(--color35);
}
.tl_free {
  color: var(--color84);
}

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(--color14) !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;
}