/*

  /r/whalesharks CSS Theme
  By /u/Cereal_Addict

  stolen by /u/pikachonggo for /r/hazbinhotel

  Please attribute borrowed CSS!

  - Icons from icons8.com
  - Photos from unsplash.com
  - CSS Organization Guide at 9elements.com/css-rule-order/

==============================================================================*/
*, :before, :after {
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  outline: none
}

.md { color: #fff }
.error { color: rgba(255,255,255,.5) }
.rounded { border-radius: 0 }

a,
.md a,
.tagline a { color: #ff3838 }

.md blockquote, .md del { color: rgba(255,255,255,.5) }

.md blockquote { border-left: 2px solid rgba(255,255,255,.1) }

.new-comment .md :not(pre)>code, .link .md :not(pre)>code, .usertext.border .md :not(pre)>code, .new-comment .md pre, .link .md pre, .usertext.border .md pre { background: rgba(0,0,0,.1) }

.md code, .md pre { border: 0; border-radius: 0 }

.md td, .md th { border-color: rgba(255,255,255,.1) }

h2 {
  font-weight: normal;
  color: #fff
}

.submit-page .content h1,
.stylesheet-customize-container h2 {
  margin: 0;
  border-bottom: 1px solid rgba(255,255,255,.1);
  padding: 10px;
  letter-spacing: 2px;
  font-size: 19px
}

.hover a:hover,
.tagline a:hover,
.search-result-meta a:hover,
.entry .buttons a:hover,
.help-bubble a:hover,
.domain a:hover,
div.commentNavSortType:hover { text-decoration: none }

input[type="text"],
textarea,
#search input[type="text"],
.pretty-form input[type=text],
.pretty-form textarea,
.pretty-form input[type=password],
.pretty-form input[type=number],
.roundfield textarea,
.roundfield input[type=text],
.roundfield input[type=url],
.roundfield input[type=password],
.roundfield input[type=number] {
  box-shadow: none;
  border: 0;
  background: rgba(0,0,0,.1);
  color: rgba(255,255,255,.5)
}

textarea { font-family: inherit }

div.markdownEditor-wrapper { display: flex; flex-flow: wrap; width: auto }

div.markdownEditor { order: 2; margin-top: 10px; width: 100%; border-bottom: 1px solid rgba(255,255,255,.1); padding: 10px; background: rgba(0,0,0,.1) }

div.markdownEditor .edit-btn:not(.btn-macro) {
  vertical-align: bottom;
  opacity: .5;
  border: 0;
  background: transparent url(%%editbuttons%%) no-repeat 7px 1px/18px auto
}

div.markdownEditor .btn-bold:not(.btn-macro) { background-position-y: 1px }
div.markdownEditor .btn-italic:not(.btn-macro) { background-position-y: -35px }
div.markdownEditor .btn-strike:not(.btn-macro) { background-position-y: -71px }
div.markdownEditor .btn-superscript:not(.btn-macro) { background-position-y: -107px }
div.markdownEditor .btn-link:not(.btn-macro) { background-position-y: -143px }
div.markdownEditor .btn-quote:not(.btn-macro) { background-position-y: -179px }
div.markdownEditor .btn-code:not(.btn-macro) { background-position-y: -215px }
div.markdownEditor .btn-list-unordered:not(.btn-macro) { background-position-y: -251px }
div.markdownEditor .btn-list-ordered:not(.btn-macro) { background-position-y: -287px }
div.markdownEditor .btn-table:not(.btn-macro) { background-position-y: -323px }

.res span.RESCharCounter { color: inherit }

input[type=checkbox] {
  -webkit-appearance: none;
  vertical-align: middle;
  width: 20px;
  height: 20px;
  background: url(%%checkbox%%) 0 0/20px auto
}

input[type=checkbox]:checked { background-position-y: -40px }

body {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  background: url(%%header%%) fixed center/cover;
  font-family: "Open Sans", -apple-system, BlinkMacSystemFont, "Roboto", Helvetica, Arial, "Lucida Grande", sans-serif;
  color: rgba(255,255,255,.5)
}

#header {
  -webkit-order: -1;
  -ms-flex-order: -1;
  order: -1;
  margin-bottom: 51px;
  /*box-shadow: inset 0 -5px 5px -5px rgba(0,0,0,.5);*/
  width: 100%;
  border: 0;
  background: none
}

#sr-header-area {
  margin-top: 10px;
  height: 25px;
  border: 0;
  background: none;
  line-height: 25px;
  text-transform: none;
  font-size: 12px;
  font-weight: 100;
}

div#sr-header-area>* { margin: 0; padding: 0; max-height: none }

div#RESShortcuts.sr-bar { padding: 0 }

.dropdown.srdrop .selected,
.sr-bar a,
.flat-list li a.gold,
.sr-bar a.gold { margin: 0 0 0 20px; padding: 0; background: none; font-weight: normal; color: rgba(255,255,255,.5) }

.res #sr-header-area a.RESShortcutsCurrentSub,
.res #RESSubredditGroupDropdown .RESShortcutsCurrentSub a { color: inherit!important }

.separator, span.srSep { display: none }

#header-bottom-left { text-align: center; font-size: 12px }

#header #header-img {
  position: absolute;
  top: 125px;
  left: 50px;
  margin: 0;
  /* opacity: .5; */
  opacity: 1;
  width: 30px;
  height: 30px;
  padding-top: 30px;
  background: url(%%headerimg%%) 0/contain
}

/*.pagename {
  display: inline-block;
  margin: 30px 0 100px;
  vertical-align: top;
  letter-spacing: 5px;
  font-size: 0;
  font-variant: normal;
  font-weight: 200;
  color: #fff
}*/

/*.pagename:after {
  display: block;
  margin-top: 30px;
  width: 400px;
  height: 1px;
  background: rgba(255,255,255,.25);
  content: ""
}*/

.pagename a {
    background-image: url(%%pagename%%);
    top: 0; bottom:0; left: 0; right:0;
    margin: auto;
    padding:0;
    z-index: 300;
    font-size:0!important;
    position: relative!important;
    display: block!important;
    width: 343px;
    height: 190px;
}

/*.pagename a {
  font-size: 40px;
  color: #fff
}

.pagename a:before { content: "/r/" }*/

.side a[href*="#hdrbtn"] + a {
  position: absolute;
  z-index: 100;
  top: 180px;
  right: 1%;
  -webkit-transform: translate(-50%);
  -moz-transform: translate(-50%);
  transform: translate(-50%);
  padding: 0 20px;
  border: 1px solid rgba(255,255,255,.75);
  border-radius: 4px;
  line-height: 38px;
  text-transform: uppercase;
  color: #fff;
  transition: .3s
}

.side a[href*="#hdrbtn"] + a:hover { background: rgba(255,255,255,.075) }
.side a[href*="#hdrbtn"] + a:active { background: rgba(255,255,255,.2) }

#header:after {
  position: absolute;
  z-index: -1;
  top: 100%;
  left: 50px;
  right: 50px;
  height: 51px;
  border-bottom: 1px solid rgba(255,255,255,.1);
  background: linear-gradient(rgba(0,0,0,.2),rgba(0,0,0,.2)) scroll 0/cover, url(%%headerblur%%) fixed center/cover;
  content: ""
}

#header .tabmenu {
  position: absolute;
  margin: 0;
  top: 100%;
  left: 50px;
  text-transform: capitalize
}

#header .tabmenu li { display: inline-block; vertical-align: top; margin: 0; font-weight: normal }

#header .tabmenu li:not(:last-of-type) { border-right: 1px solid rgba(255,255,255,.1) }

#header .tabmenu li a {
  display: inline-block;
  height: 50px;
  border: 0;
  padding: 0 20px;
  background: none;
  line-height: 50px;
  color: rgba(255,255,255,.5)
}

#header .tabmenu a:hover,
#header .tabmenu li.selected a {
  background: rgba(0,0,0,.1);
  color: #fff
}

#header .tabmenu li a[href*="/rising"],
#header .tabmenu li a[href*="/controversial"],
#header .tabmenu li a[href*="/gilded"] { display: none }

#header #header-bottom-right {
  display: flex;
  top: 100%; right: 50px;
  border-radius: 0;
  padding: 0;
  background: none
}

div#userbarToggle {
  position: static;
  order: 2;
  width: 50px;
  height: 50px;
  border: 0;
  border-left: 1px solid rgba(255,255,255,.1);
  border-radius: 0;
  padding: 0;
  background: none;
  line-height: 43px;
  text-align: center;
  font-size: 35px;
  font-weight: 100
}

#header #header-bottom-right.res-userbar-toggle>.user { margin: 0 }
#header #header-bottom-right .user>a { line-height: 49px }
#header #header-bottom-right .user>a:after { font-size: 12px }

.user {
  display: inline-flex;
  order: -1;
  vertical-align: top;
  line-height: 49px;
  font-size: 12px;
  color: inherit
}

body:not(.res) .user { padding-right: 20px }

.user .gilded-icon { display: none }

.user a { color: rgba(255,255,255,.5) }

.user .userkarma { font-weight: normal }

.beta-hint { position: static; display: inline-block; vertical-align: top; height: 50px }

#openRESPrefs { vertical-align: top }

a#chat {
  position: static;
  margin: 17.5px
}

#mail {border-right: 1px solid rgba(255,255,255,.2);}

.beta-hint a,
.res-accountSwitcher-dropDownStyle-alien span#RESAccountSwitcherIcon,
#mail.nohavemail, #mail.havemail,
#modmail.nohavemail, #modmail.havemail,
#new_modmail.nohavemail, #new_modmail.havemail,
a.ChatApp__reddit-icon,
a.pref-lang,
#RESSettingsButton.gearIcon,
.logout a {
  position: static;
  display: inline-block;
  vertical-align: top;
  opacity: .5;
  margin: 0;
  width: 50px;
  height: 50px;
  border-left: 1px solid rgba(255,255,255,.2);
  background: url(%%headerbottomright%%) no-repeat 13px 13px/24px auto;
  font-size: 0!important
}

.res-accountSwitcher-dropDownStyle-alien span#RESAccountSwitcherIcon { order: 2; margin-left: 20px; background-position-y: -35px }
#mail.nohavemail, #mail.havemail { background-position-y: -83px }
#modmail.nohavemail, #modmail.havemail { background-position-y: -131px }
#new_modmail.nohavemail, #new_modmail.havemail { background-position-y: -179px }
a.ChatApp__reddit-icon { background-position-y: -227px }
a.pref-lang { background-position-y: -275px }
#RESSettingsButton.gearIcon { background-position-y: -323px }
.logout a { background-position-y: -371px }

div#userbarToggle:hover,
.beta-hint a:hover,
.res-accountSwitcher-dropDownStyle-alien span#RESAccountSwitcherIcon:hover,
#mail.nohavemail:hover, #mail.havemail,
#modmail.nohavemail:hover, #modmail.havemail,
#new_modmail.nohavemail:hover, #new_modmail.havemail,
a.ChatApp__reddit-icon:hover,
a.pref-lang:hover,
#RESSettingsButton.gearIcon:hover,
.logout a:hover { opacity: 1; border-left: 1px solid rgba(255,255,255,.1); background-color: rgba(0,0,0,.1) }

.message-count {
  vertical-align: top;
  margin: 0;
  border-left: 1px solid rgba(255,255,255,.1);
  border-radius: 0;
  padding: 0 10px;
  background: none;
  line-height: 50px;
  font-size: 12px;
  font-weight: normal
}

.res span#RESAccountSwitcherIconOverlay,
#RESSettingsButton.gearIcon::after { display: none!important }

.side {
  margin: 0 50px 0 0;
  width: 300px;
  border-left: 1px solid rgba(255,255,255,.1);
  background: linear-gradient(rgba(0,0,0,.2),rgba(0,0,0,.2)) scroll 0/cover, url(%%headerblur%%) fixed center/cover
}

/*.side:before {
  display: block;
  height: 250px;
  background-image: url(%%sideimage%%);
  animation: side 2s steps(12) infinite;
  content: ""
}

@keyframes side {
  from { background-position: 0 0 }
  to { background-position: -3600px 0 }
}*/

.side .spacer { margin: 0 }

#search input[type="text"] { height: 40px; font-family: inherit }

#searchexpando { margin: 0; border-radius: 0; padding: 10px }

.infobar { border: 0; background: none }

.linkinfo {
  border: 0;
  border-radius: 0;
  padding: 10px;
  background: none
}

.linkinfo .shortlink input { border: 0 }

.ad300x250, .sponsor-300-250 { opacity: .5 }

.morelink,
.morelink:hover {
  height: 40px;
  border: 0;
  border-bottom: 1px solid rgba(255,255,255,.1);
  background: none;
  line-height: 40px;
  letter-spacing: normal;
  font-size: 13px;
  font-weight: normal
}

.morelink a { color: rgba(255,255,255,.5) }

.submit .morelink { width: 149px }

.submit-text { float: right; margin-top: -40px; border-left: 1px solid rgba(255,255,255,.1) }

.nub { display: none }

.side .titlebox { display: flex; flex-flow: wrap }

.titlebox h1.redditname { order: -3; margin: 0; width: 100%; letter-spacing: 2px; font-family: inherit }
.titlebox h1.redditname a { display: block; padding: 10px; font-weight: 100; color: #fff }
.titlebox h1.redditname a:before { content: "/r/" }

.subButtons { order: -4; width: 100% }

.titlebox .fancy-toggle-button, span.res-fancy-toggle-button { margin: 0 }

.fancy-toggle-button .option.active,
span.res-fancy-toggle-button {
  display: inline-block;
  vertical-align: top;
  width: 99.6px;
  border: 0;
  border-radius: 0;
  border-bottom: 1px solid rgba(255,255,255,.1);
  padding: 0;
  background: none;
  line-height: 25px;
  text-align: center;
  font-size: 12px;
  font-weight: normal;
  color: rgba(255,255,255,.5)
}

span.res-fancy-toggle-button { border-left: 1px solid rgba(255,255,255,.1) }

span.res-fancy-toggle-button.remove { background: none }

.titlebox .fancy-toggle-button .add {
  -webkit-animation: flash 2s ease infinite;
  -moz-animation: flash 2s ease infinite;
  animation: flash 2s ease infinite
}

@-webkit-keyframes flash {
  0% { box-shadow: inset 0 0 3px rgba(255,255,255,.5) }
  50% { box-shadow: inset 0 0 10px rgba(255,255,255,.5) }
  100% { box-shadow: inset 0 0 3px rgba(255,255,255,.5) }
}

@-moz-keyframes flash {
  0% { box-shadow: inset 0 0 3px rgba(255,255,255,.5) }
  50% { box-shadow: inset 0 0 10px rgba(255,255,255,.5) }
  100% { box-shadow: inset 0 0 3px rgba(255,255,255,.5) }
}

@keyframes flash {
  0% { box-shadow: inset 0 0 3px rgba(255,255,255,.5) }
  50% { box-shadow: inset 0 0 10px rgba(255,255,255,.5) }
  100% { box-shadow: inset 0 0 3px rgba(255,255,255,.5) }
}

body:not(.res) .titlebox h1.redditname { width: 200px }

body:not(.res) .titlebox .fancy-toggle-button {
  order: -3;
  width: 99px;
  height: auto;
  border-left: 1px solid rgba(255,255,255,.1)
}

body:not(.res) .titlebox .fancy-toggle-button .active { line-height: 42px }

.subscribers { order: -2; border-right: 1px solid rgba(255,255,255,.1) }
p.users-online { order: -1 }

.subscribers,
p.users-online {
  margin: 0;
  width: 50%;
  border-bottom: 1px solid rgba(255,255,255,.1);
  padding: 10px;
  text-align: center
}

.titlebox .word,
p.users-online:before { display: none }

.side .titlebox .number {
  display: block;
  font-size: 20px;
  font-weight: bold
}

.subscribers:after { content: "Hotel reservations" }
p.users-online:after { content: "Checked in now" }

.titlebox form.toggle {
  width: 100%;
  border-bottom: 1px solid rgba(255,255,255,.1);
  padding: 10px;
  background: none;
  font-size: 12px;
  color: rgba(255,255,255,.5)
}

form.toggle.flairtoggle+.tagline { margin: 0; width: 100%; border-bottom: 1px solid rgba(255,255,255,.1); padding: 10px 0 }

form input[type=checkbox] { margin: 0 10px 0 0; opacity: .5 }

.flairtoggle+.tagline a.author { margin: 0 10px }

.side .flairselector,
.side .flairselector.drop-choices.active {
  position: static;
  margin: 10px 0 -10px;
  box-shadow: none;
  width: 100%!important;
  border: 0;
  padding: 0!important;
  background: none;
  white-space: normal
}

.flairselector h2 {
  border: 1px solid rgba(255,255,255,.1);
  border-left: 0; border-right: 0;
  padding: 10px;
  background: none;
  text-align: left;
  font-size: 19px
}

div.flairoptionpane { margin-bottom: 5px; max-height: none }

.flairselector ul {
  display: flex;
  flex-flow: wrap;
  justify-content: center;
  max-width: 100%;
  padding: 0 5px;
  font-size: 12px
}

.side .flairselector li,
.flairselector li:hover { display: inline-block!important; flex-grow: 3; margin: 0; border: 0; padding: 5px; background: none }

.flairselector .flair { margin: 0; width: 100%; text-align: center }

.side .flairselector .author { display: none }

.flairselector form { border-top: 1px solid rgba(255,255,255,.1); padding: 10px; font-size: 12px }

div.flairremove { margin: 10px 0 }

.morelink:hover,
.fancy-toggle-button .option.active:hover,
span.res-fancy-toggle-button:hover,
.titlebox h1.redditname a:hover,
.subscribers:hover,
p.users-online:hover,
.titlebox form.toggle:hover { background: rgba(0,0,0,.1) }

.leavemoderator { display: none }

.side .md h1 {
  margin: 0;
  border-bottom: 1px solid rgba(255,255,255,.1);
  padding: 10px;
  letter-spacing: 2px;
  line-height: normal;
  font-size: 19px;
  font-weight: normal
}

.titlebox .md h1 a { color: inherit }

.side .md { font-size: 13px }

.side .md p,
.side .md ol,
.side .md ul { margin: 0 }

.side .md h1+*, .side .md h1~p { padding: 10px }

.side .md ol { padding-left: 30px }

.md hr { margin: 0; height: 1px; background: rgba(255,255,255,.1) }

/*.side .md>ul:last-of-type { list-style-type: none }

.side .md>ul:last-of-type li {
  position: relative;
  border-bottom: 1px solid rgba(255,255,255,.1);
  padding: 10px 0 10px 45px;
}

.side .md ul li:nth-of-type(1) { padding-top: 0 }
.side .md ul li:last-of-type { border: 0; padding-bottom: 0 }

.side .md>ul:last-of-type li:before {
  position: absolute;
  top: 10px;
  left: 10px;
  opacity: .5;
  width: 25px;
  height: 25px;
  background: url(%%friends%%) 0 0/25px auto;
  content: ""
}

.side .md ul li:nth-of-type(1):before { top: 0 }
.side .md ul li:nth-of-type(2):before { background-position-y: -50px }
.side .md ul li:nth-of-type(3):before { background-position-y: -100px }
.side .md ul li:nth-of-type(4):before { background-position-y: -150px }
.side .md ul li:nth-of-type(5):before { background-position-y: -200px }
.side .md ul li:nth-of-type(6):before { background-position-y: -50px }
.side .md ul li:nth-of-type(7):before { background-position-y: -250px }

.side .md ul li strong { display: block; margin-bottom: 10px }*/

.titlebox .bottom { width: 100%; border-top: 1px solid rgba(255,255,255,.1); border-bottom: 1px solid rgba(255,255,255,.1); padding: 10px; font-size: 0; color: inherit }
.titlebox .bottom:before { display: block; margin-bottom: 5px; font-size: 12px; content: "CSS by /u/Cereal_Addict" }
.titlebox .bottom .age { display: block; float: none; font-size: 12px }

.sidecontentbox .title { border-bottom: 1px solid rgba(255,255,255,.1) }

.sidecontentbox .title h1 {
  display: inline-block;
  padding: 10px;
  letter-spacing: 2px;
  font-size: 19px;
  font-weight: 100;
  text-transform: lowercase;
  color: #fff
}
.sidecontentbox .title h1:first-letter { text-transform: uppercase }

.sidecontentbox .collapse-button {
  float: right;
  margin: 0;
  width: 42px;
  height: 42px;
  border: 0;
  border-left: 1px solid rgba(255,255,255,.1);
  border-radius: 0;
  background: none;
  line-height: 40px;
  text-align: center;
  font-size: 24px;
  font-weight: 100;
  color: rgba(255,255,255,.5)
}

.sidecontentbox .content { border: 0; padding: 0 }

.create .spacer { display: none }

.icon-menu li, a.helplink~.content li { margin: 0; border-bottom: 1px solid rgba(255,255,255,.1) }
.icon-menu li:last-of-type, a.helplink~.content li:last-of-type { border: 0 }

.icon-menu a { display: block; padding: 10px; background: none; color: inherit }
.icon-menu a:hover { background: rgba(0,0,0,.1) }

.side .icon-menu a:before { display: none }

a.helplink~.content li { padding: 10px }

.sidecontentbox .more a { font-size: 12px; color: inherit }

.side .reddit-link {
  border-bottom: 1px solid rgba(255,255,255,.1);
  padding: 10px 10px 0
}

.gadget { font-size: 12px }

.gadget .midcol { margin-right: 10px; width: auto }

.gadget small { display: block; margin-top: 10px; font-size: 12px }

.gadget small .score,
.res.res-voteEnhancements-highlightScores span.score { margin: 0; font-weight: normal; color: rgba(255,255,255,.5)!important }

a[onclick="return clear_clicked_items(this)"] { display: block; padding: 10px }

.account-activity-box { font-size: 12px }
.account-activity-box a { display: block; line-height: 40px }

#search input[type="text"],
#searchexpando,
.side .linkinfo,
.ad300x250, .sponsor-300-250, #ad_main,
.titlebox h1.redditname,
.sidecontentbox .content { border-bottom: 1px solid rgba(255,255,255,.1) }

body>.content {
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  -webkit-order: -1;
  -ms-flex-order: -1;
  order: -1;
  margin: 0 0 0 50px;
  width: calc(100% - 401px);
  /*BACKGROUND GRADIENT REMOVED TO IMPROVE READABILITY AND REPLACED WITH CONSISTENT BACKGROUND COLOR.
    ####################
  background: linear-gradient(rgba(0,0,0,.05),rgba(0,0,0,.05)) scroll 0/cover, url(%%headerblur%%) fixed center/cover */
  background-color: rgba(0,0,0,.3);
}

div.res-filterline { border-bottom: 1px solid rgba(255,255,255,.1); background: none }

.menuarea {
  margin: 0;
  border-bottom: 1px solid rgba(255,255,255,.1);
  padding: 10px
}

.content .spacer { margin: 0 }

.organic-listing { margin: 0; border: 0; border-bottom: 1px solid rgba(255,255,255,.1) }
.link.promotedlink.promoted { padding: 20px; background: rgba(0,0,0,.1) }

.reddit-infobar { margin: 0; border: 0; border-bottom: 1px solid rgba(255,255,255,.1); background: none }
.reddit-infobar .md { color: inherit }

.link,
.link.last-clicked,
div#progressIndicator,
div#NERFail {
  margin: 0;
  height: auto;
  border: 0;
  border-top: 1px solid rgba(0,0,0,.5);
  border-radius: 0;
  padding: 20px;
  background: none;
}

.link:nth-of-type(1) { border: 0 }

.RES-keyNav-activeThing,
.link.last-clicked { background: rgba(0,0,0,.1)}

.new-comment .usertext-body {
    background: none;
    border: none;
}

div.top-matter {background-color: transparent}

.res .entry.res-selected, .res .entry.res-selected .md-container { background-color: transparent !important}

div.RES-keyNav-activeElement { background-color: none!important }

.rank { display: none }

.midcol { margin: 0 20px 0 0; overflow: visible }
html body>.content .link .midcol { position: relative; margin: 0 20px 0 60px; width: 25px }

.arrow.up,
.arrow.down,
.arrow.upmod,
.arrow.downmod {
  opacity: .5;
  width: 25px;
  height: 25px;
  background: url(%%arrows%%) 0 0/25px auto
}

.arrow.up { margin: 0; background-position-y: 0 }
.arrow.down { margin-top: 10px; background-position-y: -50px }
.arrow.upmod { margin: 0; background-position-y: -100px }
.arrow.downmod { margin-top: 10px; background-position-y: -150px }

.midcol .score {
  position: absolute;
  top: 15px;
  left: -60px;
  width: 40px;
  line-height: 30px;
  color: rgba(255,255,255,.5)
}

.link .score.likes, .link .score.dislikes { color: inherit }

.thumbnail { margin-right: 20px; width: 60px; height: 60px; opacity:1; /* opacity: .5 */ }
.thumbnail img { width: auto; height: 60px }

.link p.title { margin-bottom: 10px }

.thing .title { color: #fff }

.thing.visited .title,
.thing .title:visited,
.thing a.title.visited { color: rgba(255,255,255,.3) }

body .expando-button { margin: 0 10px 0 0 }

.expando-button.collapsed.selftext, .expando-button.collapsed.selftext:hover,
.expando-button.expanded.selftext, .expando-button.expanded.selftext:hover,
.expando-button.collapsed.video, .expando-button.collapsed.video:hover,
.expando-button.expanded.video, .expando-button.expanded.video:hover,
body .expando-button.image, body .expando-button.image.collapsed,
body .expando-button.video-muted, body .expando-button.video-muted.collapsed,
body .expando-button.expanded {
  opacity: .5;
  width: 32px;
  height: 32px;
  max-width: none;
  max-height: none;
  border: 1px solid rgba(255,255,255,.2);
  background: url(%%expandos%%) no-repeat 5px 5px/20px auto
}

.expando-button.collapsed.video,
.expando-button.collapsed.video:hover { background-position: 5px -35px }

body .expando-button.image.collapsed,
body .expando-button.image.collapsed:hover { background-position: 5px -75px }

body .expando-button.video-muted.collapsed,
body .expando-button.video-muted.collapsed:hover { background-position: 5px -155px }

body .expando-button.expanded,
body .expando-button.expanded:hover,
.expando-button.expanded.selftext,
.expando-button.expanded.selftext:hover,
.expando-button.expanded.video, .expando-button.expanded.video:hover { background-position: 5px -195px }

body .expando-button:hover { background-color: rgba(0,0,0,.1)!important }

.domain,
.domain a,
.tagline,
.entry .buttons li a,
span.redditSingleClick::after,
.gadget small { color: rgba(255,255,255,.5); font-size: 12px; font-weight: normal }

a.voteWeight { background: none!important }

.nsfw-stamp { margin-right: 10px; color: inherit }

.entry .buttons,
.toggle .option.active { font-size: 12px }

.flair,
.link .flair,
.linkflairlabel {
  border: 0;
  border-radius: 0;
  padding: 4px;
  background: rgba(0,0,0,.1);
  font-size: inherit;
  color: rgba(255,255,255,.5)
}

.flair-blue { box-shadow: 0 0 3px rgba(103,176,209,1) }
.flair-green { box-shadow: 0 0 3px rgba(97,205,156,1) }
.flair-yellow { box-shadow: 0 0 3px rgba(235,201,94,1) }
.flair-red { box-shadow: 0 0 3px rgba(232,115,82,1) }
.flair-purple { box-shadow: 0 0 3px rgba(117,140,225,1) }

.linkflairlabel { margin: 0 5px 0 0 }

.res .RES-keyNav-activeElement .md-container { background: none!important }

.link .usertext-body .md { border: 0; padding: 5px 0; background: none }

.comments-page .link { border-bottom: 1px solid rgba(255,255,255,.1) }

.panestack-title { margin: 0; border-bottom: 1px solid rgba(255,255,255,.1); padding: 10px }

.commentarea .menuarea {
  margin: 0;
  padding: 10px;
  color: inherit
}

.commentarea>.usertext { margin: 0; border-top: 1px solid rgba(255,255,255,.1); padding: 10px }
.usertext-edit { margin-top: 0 }

div.commentingAs, span.RESMacroWrappingSpan { margin-top: 0 }

.dropdown.lightdrop .selected { padding: 0; background: none; text-decoration: none; color: inherit }
.dropdown.lightdrop .selected:after { content: " ?" }

span.RESSubscriptionButton { border: 1px solid rgba(255,255,255,.1); background: none; color: inherit }

.commentarea .menuarea .toggle a { font-size: 12px; font-weight: normal; color: inherit }

div.commentarea .menuarea>.spacer { float: none }
div#REScommentNavToggle { margin-top: 10px }

div.commentNavSortType,
div.commentNavSortType + .commentNavSortType { border: 0; font-weight: normal }

div.commentNavSortTypeDisabled { color: rgba(255,255,255,.2) }

.linklisting .md,
.commentarea .md { margin-top: 0 }

.link .usertext .md { padding: 0 }

.gold-accent { border: 1px solid rgba(255,255,255,.1); background: none }
.gold-accent.comment-visits-box { margin: 10px; padding: 10px; color: rgba(255,255,255,.5) }

#noresults { margin: 0 10px }

.comment,
.res.res-commentBoxes .comment,
.res.res-commentBoxes.res-commentBoxes-rounded .comment {
  margin: 0!important;
  border: 1px solid rgba(255,255,255,.1)!important;
  border-right: 0!important;
  border-bottom: 0!important;
  border-radius: 0!important;
  padding: 20px 0 0 20px!important
}

.commentarea>.sitetable>.comment,
.res.res-commentBoxes .commentarea>.sitetable>.comment,
.res.res-commentBoxes.res-commentBoxes-rounded .commentarea>.sitetable>.comment { border-left: 0!important }

.res.res-commentBoxes .comment .comment,
.res.res-commentBoxes .comment .comment .comment,
.res.res-commentBoxes .comment .comment .comment .comment,
.res.res-commentBoxes .comment .comment .comment .comment .comment,
.res.res-commentBoxes .comment .comment .comment .comment .comment .comment,
.res.res-commentBoxes .comment .comment .comment .comment .comment .comment .comment,
.res.res-commentBoxes .comment .comment .comment .comment .comment .comment .comment .comment,
.res.res-commentBoxes .comment .comment .comment .comment .comment .comment .comment .comment .comment,
.res.res-commentBoxes .comment .comment .comment .comment .comment .comment .comment .comment .comment .comment { background: none!important }

.res.res-commentBoxes .comment .comment.RES-keyNav-activeThing,
.res.res-commentBoxes .comment .comment .comment.RES-keyNav-activeThing,
.res.res-commentBoxes .comment .comment .comment .comment.RES-keyNav-activeThing,
.res.res-commentBoxes .comment .comment .comment .comment .comment.RES-keyNav-activeThing,
.res.res-commentBoxes .comment .comment .comment .comment .comment .comment.RES-keyNav-activeThing,
.res.res-commentBoxes .comment .comment .comment .comment .comment .comment .comment.RES-keyNav-activeThing,
.res.res-commentBoxes .comment .comment .comment .comment .comment .comment .comment .comment.RES-keyNav-activeThing,
.res.res-commentBoxes .comment .comment .comment .comment .comment .comment .comment .comment .comment.RES-keyNav-activeThing,
.res.res-commentBoxes .comment .comment .comment .comment .comment .comment .comment .comment .comment .comment.RES-keyNav-activeThing { background: rgba(0,0,0,.1)!important }

.comment .child { margin: 20px 0 0 0 }

/* submit page */

.submit.content { margin: 0 }

ul.tabmenu.formtab { margin: 0; border-bottom: 1px solid rgba(255,255,255,.1); padding: 0 }

.tabmenu.formtab a {
  display: inline-block;
  border: 0;
  border-right: 1px solid rgba(255,255,255,.1);
  background: none;
  line-height: 30px;
  font-size: 12px
}

.tabmenu.formtab .selected a {
  border-right: 1px solid rgba(255,255,255,.1);
  background: rgba(0,0,0,.1);
  font-size: inherit
}

.formtabs-content { width: 100%; border: 0; padding: 0 }

.formtabs-content .infobar { border-bottom: 1px solid rgba(255,255,255,.1); padding: 20px }

.submit-page form .spacer+.spacer { margin: 0 }

.roundfield {
  width: auto;
  border-bottom: 1px solid rgba(255,255,255,.1);
  border-radius: 0;
  padding: 20px;
  background: none
}

.roundfield .usertext-edit { width: auto; max-width: none }
.roundfield .md { max-width: none }
.roundfield textarea, .roundfield input[type=text], .roundfield input[type=url] { width: 100% }

body #newlink-with-image-upload .image-upload-drop-target { border-color: rgba(255,255,255,.1); background: none }

.c-form-group { margin: 0 }

.content.submit .info-notice { border: 0; border-bottom: 1px solid rgba(255,255,255,.1); padding: 20px; background: none }

#items-required { padding-left: 20px }

.submit-page .btn[name="submit"] { margin-left: 20px }

.linefield { background: none }

div#RESStyleSheetTipPane { margin: 0; border: 0; border-bottom: 1px solid rgba(255,255,255,.1); width: 100% }

div#RESStyleSheetTipPane-header { border: 0 }

span.RESCloseButton { border: 0; background: rgba(0,0,0,.1); font-size: 16px; color: rgba(255,255,255,.5) }

.sheets { margin: 10px 10px 0 }

.sheets .col>div { margin: 0 }

#image-upload~.error { border-bottom: 1px solid rgba(255,255,255,.1); padding: 10px }

ul.image-preview-list { display: flex; flex-flow: wrap; margin: 0 }

ul.image-preview-list li {
  margin: 0;
  width: 50%;
  height: auto;
  border-bottom: 1px solid rgba(255,255,255,.1);
  padding: 10px
}

ul.image-preview-list li:nth-of-type(even) { border-right: 1px solid rgba(255,255,255,.1) }

ul.image-preview-list .description pre { color: inherit }

.footer-parent {
  /*box-shadow: inset 0 5px 5px -5px rgba(0,0,0,.5);*/
  width: 100%;
  padding: 150px 0 350px;
  background: url(%%footer%%) no-repeat center bottom -50px
}

.footer {
  margin: 0 auto 50px;
  /*box-shadow: 0 0 5px rgba(0,0,0,.5);*/
  border: 0;
  border-radius: 0;
  padding: 0;
  background: linear-gradient(rgba(0,0,0,.2),rgba(0,0,0,.2)) scroll 0/cover, url(%%headerblur%%) fixed center/cover
}

.footer .col { margin: 0; border-left: 1px solid rgba(255,255,255,.1); padding: 20px }

.flat-vert.title { font-family: inherit; color: #fff }

.bottommenu { font-size: 12px; color: rgba(255,255,255,.5) }
.bottommenu a, .bottommenu .updated { color: inherit }

.debuginfo { margin-top: -25px; width: 100% }

/* Additional Fixes by Kezika */

.usertext.border .usertext-body {
	background-color:#C00;
}
.comment.spam>.child {
	background-color: #C00;
}
.comment.spam>.child p {
    color:#000;
}
/* Moderator Toolbox fixes */
div.tb-popup *, div.reason-popup * {
    color:#000;
}
/* Crossposts */
.crosspost-preview {
    background-color: #FAA; }
.crosspost-preview-header *, .crosspost-preview-content div { 
    color:#000; }
    .crosspost-preview-header .text-content .title { 
        color:#F00;}
    .crosspost-preview-tagline > a, .crosspost-preview-content .usertext-body a { 
        color:#C00; }
        
div.reason.popup-content input.reason-check { color:#000 !important; }

li.reported-stamp { color:#000; }

ul.report-reasons li { color:#000; }

div.reason-popup input.reason-check, div.reason-popup #buttons input {
	appearance:auto;
	background-color:rgb(250, 250, 250);
	background-image:none;
	color:#000000;
	cursor:default;
	display:inline-block;
}
	

π Rendered by PID 173325 on reddit-service-r2-loggedout-54b74d8cb5-shjvx at 2025-11-15 11:26:28.826071+00:00 running 9839b1b country code: JP.