SMF2 redux

smf2_redux.css

/* SMF2 redux.
   Userstyle für SMF2 basierende Foren. Funktioniert mit www.tanelorn.net und forum.rsp-blogs.de.
 
version $Id$ 
 
*/
 
/* Testeintrag für Testvariablen. Geht derzeit noch nicht. */
 
:root {
  var-testcolor: red; 
}
 
/* Mehr Kontrast! */
 
body, td, th, tr, 
.windowbg, tr.windowbg, td.info,tr.windowbg td.lastpost, tr.windowbg 
td.smalltext, .windowbg2, tr.windowbg2 td.info, tr.windowbg2 td.lastpost,
tr.windowbg2 td.smalltext, .windowbg3, .stickybg, .stickybg2,
.lockedbg, .lockedbg2 {
  color: #000000;
  background: #ffffff;
}
 
body, .middletext, h1.forumtitle,
p.moderators, 
input, button, select, textarea,
.smalltext, tr.smalltext th {
  font-family: sans-serif; 
}
 
/* SMF verwendet <strong></strong> anstatt font-weight: bold via styles.
   Das wollen wir nicht. */
 
strong,
div.sub_boards strong a {
  font-weight: normal !important;
  /* Wer rote Schatten sieht, melde sich bitte bei mir! */
  text-shadow:
    0 0 .2em var(testcolor), 
    0 0 .2em var(testcolor);
}
 
/* Ausser in den Postings und in Previews selbst natürlich! */
 
#preview_body strong,
#personal_messages * strong,
.postarea * strong {
  font-weight: bold;
}
 
/* Leichte Einfaerbung fuer die die nicht ohne koennen. */
 
div#content_section {
  background: #eeeeee;
  border-radius: 1em 1em;
  margin-bottom: 1em;
  padding: 0 1.5em 0 1.5em;
  z-index: -1;
}

#content_section div.frame {
  padding: 0;
  background-image: none;
}

hr, .hrcolor {
  color: #eeeeee;
  background-color: #dddddd;
}

/* Header-Grafik desaturieren. Funktioniert nur in Webkit-basierenden Browsern. */
 
div#wrapper a img[src*="header"] {
  -webkit-filter: grayscale(1);
  filter: grayscale(100%);
}

#header, #header div.frame a {
    color: #ffffff;
    background-image: none;
    padding-left: 0;
  }
  
#header div.frame {
  background-image: none;
  background-color: #777;
  color: #fff;
  border-radius: 1em;
  opacity: 0.8;
  padding: 0.5em 0.5em;
  }
  
  
/* rsp-blogs: smf logo ausblenden. */
  
img#smflogo { display: none; }
  
/* Posts in Tabellenformat überführen. */

.postarea, .moderatorbar {
  margin-left: 0 !important;
}


}

.moderatorbar,  
.modified:empty,
.custom_fields_above_signatur:empty {
  width: 100%;
  margin: 0 !important;
  border: none;
}

/* tanelorn PMs */

#personal_messages form.flow_hidden {
  display: block;
  margin-top: 0;
}
#personal_messages div.poster img[alt*="line"],
#personal_messages div.poster h4 a,
#personal_messages div.poster ul li.title,
#personal_messages div.poster ul li.postgroup,
#personal_messages div.poster ul li.membergroup,
#personal_messages div.poster ul li.username,
#personal_messages div.poster ul li.profile {
  display: inline;
}
#personal_messages div[class^="windowbg"] {
  border: 1px solid #cccccc;
  box-shadow: 1px 1px 2px #aaa;
}
#personal_messages tr td:first-child {
  text-align: right;
}
#personal_messages .botslice {
  display: none;
}


.post_wrapper {
  background-image: none; 
  background-color: white;
  color: black;
  display: flex;
  flex-direction: column;
  border: 1px solid #cccccc;
  box-shadow: 1px 1px 2px #aaa;
}



.poster,
.flow_hidden,
.postarea, 
.moderatorbar {
  background-image: none; 
  background-color: white;
  width: auto;
  margin: 0;
  padding: 0;
    }
  
/* 1. Zeile */  
      
.poster {
  order: 0;
  display: inline-flex;
  flex-direction: row;
  align-items: baseline;
  margin: .25em 0 .25em .25em;
}

/* offline/online Markierung für User durch Farbfelder ersetzen. */
 
img[alt="Offline"],
img[alt="Online"] {
  display: inline;
  width: 0;
  height: 0;
  border: .5em solid #cccccc;
  border-radius: 0.25em;
  }
 
img[alt="Online"] {
  border: .5em solid #77cc77;
} 

/* Username normal gross anzeigen. */

.poster h4 {
  margin: 0 .25em 0 0;
  font: bold 100%/130% sans-serif;
}

/* Extra-Informationen */

.poster ul {
  display: inline-flex;
  flex-direction: row;
  align-content: flex-start;
}

/* Extra-Informationen ausblenden ... */
.poster ul[id$="extra_info"] li { display: none; }

/* ... und einzeln wieder einblenden. */
.poster ul[id$="extra_info"] li.title,
.poster ul[id$="extra_info"] li.postgroup,
.poster ul[id$="extra_info"] li.membergroup,
.poster ul[id$="extra_info"] li.username,
.poster ul[id$="extra_info"] li.profile {
  padding-right: 1em;
  display: inline;
  font-size: normal; 
}

li.title:before { content: "Titel:\a0"; }

li.membergroup:before { content: "Rolle:\a0"; }

li.postgroup:before { content: "Stufe:\a0"; }

.poster ul[id$="extra_info"] li.profile ul,
.poster ul[id$="extra_info"] li.profile ul li {
  display: inline;
  height: 1em;
  width: 1em;
  font-style: normal;
} 

/* 2. Zeile */

.flow_hidden {
  order: 1;
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  background-color: #dddddd;
}

/*message icon */

/*Betreff*/

h5[id*="subject"] { display: inline; }

/* Zeitstempel */

h5[id*="subject"] + div.smalltext {
  display: inline-flex;
  flex-direction: row;
}

h5[id*="subject"] + .smalltext > strong:before,
h5[id*="subject"] + .smalltext > strong:after {
  content: "\a0";
}

/* Quick Buttons */

ul.quickbuttons {
  font: bold smaller sans-serif; 
  display: inline;
  margin: 0 1em 0 auto;
}

/* 3. Zeile */

.postarea {
  order: 2;
}

/* Verschiedene padding/margin Einstellungen der
   verschachtelten CSS Klassen auf eine Variante und
   eine Definition umstellen. */

.post {
  padding: 0;
  margin: .25em 0 .25em .25em;
}    
   
.inner {
  border-top: none;
  padding: 0;
}

/* 4. Zeile */

.moderatorbar {
  order: 3;
}

/* Signaturen-Formatierung vereinheitlichen. */

#personal_messages .signature,
#forumposts .signature,
.custom_fields_above_signature {
  margin: 0;
  padding: .25em 0 .25em .25em;
  border-top: 1px solid #dddddd;
  max-width: 100%;
}

/* Hier endet die Neuformatierung der Diskussionsbeiträge. */

/* Menü-Einstellungen für #main_menu und #admin_menu. */
 
.dropmenu li a.firstlevel span.firstlevel {
  margin: 0;
  padding-left: 1em;
  padding-right: 1em;
}
 
.dropmenu,
.dropmenu li a.active,
.dropmenu li a.active:hover,
.dropmenu li a.firstlevel:hover,
.dropmenu li:hover a.firstlevel,
.dropmenu li a.active span.firstlevel,
.dropmenu li a.active:hover span.firstlevel
.dropmenu li a.firstlevel:hover span.firstlevel, 
.dropmenu li:hover a.firstlevel span.firstlevel,
.dropmenu li li:hover a,
.dropmenu li li > a:hover {
  background-image: none;
}
    
.dropmenu * a:hover {
  text-shadow: 0px 1px 1px #77cc77;
}

#adm_submenus .dropmenu li a.active span.firstlevel,
#adm_submenus .dropmenu li a.firstlevel:hover,
#adm_submenus .dropmenu li:hover a.firstlevel,
#admin_menu .dropmenu li a.active span.firstlevel,
#admin_menu .dropmenu li a.firstlevel:hover,
#admin_menu .dropmenu li:hover a.firstlevel {
  color: #000000;
}
 
#main_menu * li a.firstlevel:link,
#main_menu * li a.firstlevel:visited,
#main_menu * li a.firstlevel:hover {
  color: #ffffff;
}
 
/* Pseudobuttons */
 
.buttonlist ul li a:visited,
.buttonlist ul li a:link {
  background: #cccccc none;
  color: #000000;
  border: 1px solid #cccccc;
}
    
div.catbg, tr.catbg td, tr.catbg th,    
tr.catbg th a:link, tr.catbg th a:visited,
div.catbg2, tr.catbg2 td, tr.catbg2 th,
tr.catbg2 td a:link, tr.catbg2 td a:visited,
.description, .description_board, .plainbox,
.dropmenu li ul {
  background: #cccccc none;
  color: #000000;
}

.dropmenu li ul {
  border-radius: .25em;
  box-shadow: 0 .2em .3em .2em #aaaaaa;
 }
 
.description#topic_icons,
 div#footer_section {
  display: none;
}
 
h3.catbg a:hover, h4.catbg a:hover, .table_list tbody.header td a:hover,
h3.catbg a:link, h3.catbg a:visited, h4.catbg a:link, h4.catbg a:visited,
h3.catbg, .table_list tbody.header td, .table_list tbody.header td a {
  color: #000000;
}
 
h3.catbg[style] { 
  color: #000000 !important; 
}
 
#content_section {
  background: #ffffff;
}
 
 
#top_section[style] {
margin-right: 4.5em !important;
}
 
/* Die Vorschau ist schwarz auf hellgrau und mit Punkten abgesetzt. */
 
#preview_body {
  background-image: none;
  background-color: #cccccc;
  color: #000000;
  padding: 1em;
  border: 1px dotted #000000;
  border-radius: .25em .25em;
} 
 
/* Pseudobuttons wollen auch schick aussehen. */
 
 
input[type='submit']:hover {
  background: #cccccc;
}
  
.button_submit {
  background: #cccccc;
  border: 1px solid #aaaaaa;
  color: #000000;
}
  
.buttonlist ul li a span {
  background-image: none;
}
 
.buttonlist ul li a {
  border-radius: 2px 2px; 
  }  
 
.buttonlist ul li a.active:link {
  background: #cccccc none;
  border: 1px solid #cccccc;
  color: #000000;
  font-weight: normal;
}
 
.buttonlist ul li a.active:hover {
  background: #cccccc none;
  color: #000000;
  border: 1px solid #000000;
}
    
.buttonlist ul li a:link {
  background: #cccccc none;
  color: #000000;
  border: 1px solid #cccccc;
}
 
.buttonlist ul li a.active span,
.buttonlist ul li a:hover span {
  background: #cccccc;
}

.buttonlist ul li a:hover {
  background: #cccccc;
  color: #000000;
  border: 1px solid #000000;
}
 
/* Die Box überm Logo auch in schwarz-weiss */
 
div.frame.user {
  font-size: smaller;
  line-height: 1.5;
}
 
/* Beiträge in schlichtem schwarz/weiss. Jetzt mit Schatten! */
 
.windowbg span.botslice,
.windowbg2 span.botslice {
  background-image: none;
  background-color: transparent;
  width: 0;
  height: .25em;
}
 
.windowbg span.topslice,
.windowbg2 span.topslice {
  display: none;
}
  
.bbc_link:link, .bbc_link:visited, .bbc_link:hover,
a:link, a:visited, a:hover {
 color: #000000;
}
 
.poster h4, .poster h4 a {
  color: #000000;
}
 
#preview_body .bbc_link:link,
#preview_body .bbc_link:visited,
#preview_body a:link, 
#preview_body a:visited,
.post .bbc_link:link,
.post .bbc_link:visited,
.post a:link, 
.post a:visited,
.signature .bbc_link:link,
.signature .bbc_link:visited,
.signature a:link, 
.signature a:visited {
  text-decoration: none;
  border-bottom: 1px dotted #666666;
}
 
a[href$=new] {
  border: 0 none;
}
  
/* Zitate grau in grau. */
 
blockquote.bbc_standard_quote {
  background: #dddddd;
  color: #000000;
  border-top: 1px solid #aaaaaa;
  border-bottom: 1px solid #aaaaaa;
}
 
blockquote.bbc_alternate_quote {
  background: #ffffff;
  color: #333333;
  border-top: 1px solid #aaaaaa;
  border-bottom: 1px solid #aaaaaa;
}
 
/* [code-Blöcke] */
 
code.bbc_code {
  background: #dddddd;
}
 
/* Betreff-Zeilen fett markieren. */
 
a.subject {
   color: #000000;
    font-weight: bold;
}
 
/* Runde Rahmen sind rund. */
 
.roundframe {
  background-image: none;
  border-radius: 1em 1em;
}
 
.roundframe[style] {
  margin: 1em 0 1em 0 !important;
}
 
div.roundframe div.cat_bar,
div.cat_bar, .cat_bar,
div.roundframe div.cat_bar h3.catbg {
  background-image: none;
  background: #cccccc;
  border-radius: .25em .25em;
  padding-left: 1em;
}
 
/* Tabellen wollen massiert werden. */
 
table {
  border-collapse: collapse;
  border: none;
}
 
#boardindex_table {
 background-color: transparent; 
}
 
tbody.header td,
tbody.header td tr {
  border: none;
  background-color: transparent;
}
 
.table_list tbody.content td.info a.subject {
  color: #000000;
}
 
td {
  border: 1px solid #cccccc;
}

td.subject {
  background-image: none;
}
 
tbody.divider tr td {
  background-color: #eeeeee;
  border: none;
 }
 
td.icon {
  background-color: #eeeeee;
  border: none;
}

tr.catbg th.first_th,
tr.catbg th.last_th {
  background-image: none;
  background-color: #cccccc;
}
 
h3.catbg {
  background: #cccccc;
  color: #000000;
}
 
div.title_bar, div.title_barIC, div.title_barIC h4.titlebg {
  background: #cccccc none;
  color: #000000;
  border-radius: 0.25em 0.25em;
}
 
 
/* redundantes sticky-gif und locked-gif ausblenden. */
.topic_table td.stickybg2, 
.topic_table td.stickybg,
.topic_table td.lockedbg,
.topic_table td.lockedbg2 {
  background-image: none;
}
 
/* Instant Messenger links ausblenden. */
a.icq, a.msn, a.aim, a.yim {
  display:none;
}  
 
/* Einige Icons ausblenden, deren Funktion ich nie benutze. */
 
td.icon a img,
td.icon2 a img,
div#posting_icons,
img[src$="modify_inline.gif"] {
  display:none;
}

/* "Melden"-Knopf und IP-Adress-Info ausblenden. */ 


div.reportlinks {
 display: none;
}

/* PM Dateianhänge-Liste. */

tr.titlebg th {
background-image: none;
}

tr.titlebg th a:link,
tr.titlebg th a:visited,
tr.titlebg th a:hover {
  color: #000000;
}

/* Rahmen um Eingabefelder und Buttons. */
 
input, textarea, button, select, 
input:hover, textarea:hover, button:hover, select:hover,
.button_submit:hover, .button_reset:hover,
input:focus, textarea:focus, button:focus, select:focus {
  border-color: #33aa33;
}
 
/* Header für Themen aufbereiten. */
 
#forumposts h3.catbg {
  display: inline-flex;
  flex-direction: row;
  margin: 0;
  padding: 0;
}

#forumposts h3.catbg img {
  width: 4em;
  text-align: right;
}

#forumposts h3.catbg span#author {
  display: none;
}
 
/* Platz fuer die UTF8-Symbole reservieren. */
 
.catbg img,
.floatleft img {
  font-weight: normal;
  padding-right: 1em;    
}
 
.topic_table .icon1 {
  width: 4em;
  text-align: right;
}
 
/* Die folgenden CSS-Regeln funktionieren nur wenn man eine Schriftart installiert hat,
   die die Symbole ersetzen kann. Gegebenenfalls muss fuer diese Schriftart noch eine
   font-family gesetzt werden. Ohne die richtige Schrift verschwinden Funktionen aus dem
   Sichtfeld! */
 
/* Zitat/Löschen/Ändern/Antworten-Quickbuttons ersetzen. */      
 
ul.quickbuttons li.quote_button,
ul.quickbuttons li.modify_button,
ul.quickbuttons li.remove_button,
ul.quickbuttons li.reply_button{
  background: none;
}

li.quote_button a:before {
  content: "❠\a0";
}
 
li.reply_button a:before,
li.modify_button a:before {
  content: "✍\a0";
}
      
li.remove_button a:before {
  content: "✗\a0";
}
 
/* Bilder verstecken. */

img[src*="clip"],
img[src*="poll"],
img[src$="search.gif"],
img[src$="selected.gif"],
img[src$="arrow.gif"],
img[src$="expand.gif"],
img[src$="collapse.gif"],
img[src$="question.gif"],
img[src$="lamp.gif"],
img[src$="thumbup.gif"],
img[src$="thumbdown.gif"],
img[src$="exclamation.gif"],
img[src$="smiley.gif"],
img[src$="angry.gif"],
img[src$="cheesy.gif"],
img[src$="grin.gif"],
img[src$="sad.gif"],
img[src$="wink.gif"],
img[src$="recycled.gif"],
img[src$="moved.gif"],
img[src*="change_menu"],
img[src$="/ip.gif"],
img[src$="/upshrink.png"],
img[src$="/upshrink2.png"],
img[src$="/xx.gif"],
img[src$="/sort_down.gif"],
img[src$="/sort_up.gif"],
img[src$="quick_lock.gif"],
img[src$="quick_sticky.gif"],
img[src$="/normal_post.gif"],
img[src$="/topic/hot_post.gif"],
img[src$="/veryhot_post.gif"],
img[src$="/normal_post_sticky.gif"],
img[src$="/hot_post_sticky.gif"],
img[src$="/veryhot_post_sticky.gif"],
img[src$="/normal_post_locked.gif"],
img[src$="/hot_post_locked.gif"],
img[src$="/very_post_locked.gif"],
img[src$="/normal_post_locked_sticky.gif"],
img[src$="/hot_post_locked_sticky.gif"],
img[src$="/veryhot_post_locked_sticky.gif"],
img[src$="/topic/my_normal_post.gif"],
img[src$="/my_hot_post.gif"],
img[src$="/my_veryhot_post.gif"],
img[src$="/my_normal_post_sticky.gif"],
img[src$="/my_hot_post_sticky.gif"],
img[src$="/my_veryhot_post_sticky.gif"],
img[src$="profile_sm.gif"],
img[src*="pm_replied"],
img[src$="pm_read.gif"],
img[src$="www_sm.gif"],
li.stars img[src*="star"],
img[alt="Zukünftige Ereignisse"],
img[alt="Forumstatistiken"],
img[alt="Benutzer Online"],
img[alt="Private Mitteilung (Offline)"],
img[alt="Private Mitteilung (Online)"],
img[alt="Profil anzeigen"],
img[alt="E-Mail"],
img.gender[alt="Weiblich"],
img.gender[alt="Männlich"],
img[alt="Letzter Beitrag"],
img[alt="Neu"],
img.new_posts {
  /* Bild verstecken. */
  height: 0;
  width: 0;
  /* fake content verstecken. */
  color: transparent;
  /* Pseudo-Elemente müssen absolut positioniert werden. */
  position: relative;
  content: "fake";
}
 
/* Ersatz-Inhalte sichtbar machen. */
 
img:before,
img:after {
  top:0;
  left:0;    
  font-weight: normal;
  color: #000000;
}

img[src*="clip"]:before {
  content: "📎";
}

img[src$="search.gif"]:before {
  content: "🔎";
}

img[src$="selected.gif"]:before,
img[src$="arrow.gif"]:before {
  content: "▹\a0"; 
}
 
 
img[src$="expand.gif"]:before {
  content: "➕"; 
}
 
img[src$="collapse.gif"]:before {
  content: "➖"; 
}
 
img[src$="change_menu.png"]:before {
  content: "⏪"; /* ⏩ */
  font-weight: bold;
}

img[src$="change_menu2.png"]:before {
  content: "⏩";
  font-weight: bold;
}

img[alt="Neu"]:before,
img.new_posts:before {
  content: "neu";
  color: #007700;
  font-size: smaller;
}
 
img[alt="Private Mitteilung (Offline)"]:before {
  content: "💬";
  font-weight: bolder;
  color: #777777;
}
 
img[alt="Private Mitteilung (Online)"]:before {
  content: "💬";
  font-weight: bolder;
  color: #007700;
}
 
img[src$="profile_sm.gif"]:before,
img[alt="Profil anzeigen"]:before {
  content: "👤";
}

img[src*="pm_replied"]:before {
  content: "↩✉";
}

img[src*="pm_read"]:before {
  content: "✉";
}

img.gender[alt="Männlich"]:before {
  content: "♂";
  font-size: 140%;
  font-weight: bold;
}
 
img.gender[alt="Weiblich"]:before {
  content: "♀";
  font-size: 140%;
  font-weight: bold;
}
 
img[alt="E-Mail"]:before {
  content: "📧";
  padding-bottom: -.5em;
}
 
img[src$="www_sm.gif"]:before {
  content: "🔗";
}
 
li.stars img[src*="star"]:before {
  content: "★";
}

img[src$="/starmodtechsupport.png"]:before {
  color: #00ff00;
  text-shadow:
    0 0 1px #00aa00,
    0 0 1px #00aa00;
}
 
img[src$="/starmoddungeonkeeper.png"]:before {
  color: #ff0000;
  text-shadow:
    0 0 1px #aa0000,
    0 0 1px #aa0000;
}
 
img[src$="/star.gif"]:before {
  color: #ffcc77;
  text-shadow:
    0 0 1px #ffcc00,
    0 0 1px #ffcc00;}
 
img[src$="/starmodmasterofkeys.png"]:before {
  color: #4466FF;
  text-shadow:
    0 0 1px #0000ff,
    0 0 1px #0000ff;
}
 
img[src$="/starmodchallengeteam.png"]:before {
  color: #C982C9;
  text-shadow:
    0 0 1px #770077,
    0 0 1px #770077;
}

img[src$="/starmodgamemaster.png"]:before {
  color: #4DD5D7;
  text-shadow:
    0 0 1px #00aaaa,
    0 0 1px #00aaaa;
}
 
img[src$="quick_sticky.gif"]:before {
  content: "📌";
}
img[src$="quick_lock.gif"]:before {
  content: "🔒";
}
  
img[src*="/upshrink"]:before {
  content: "▲";
  color: #ffffff;
  text-shadow:
     0 0 .1em #444444,
     0 0 .1em #444444;
  position: relative;
  top: 1em;
  z-index: 10000;
}
 
img[src$="/upshrink2.png"]:before,
img[src$="/sort_down.gif"]:before {
  content: "▼";
}
 
img[src$="/sort_up.gif"]:before {
  content: "▲";
}      
      
a.collapse img:before,
img#lastfiveupshrink,
img#newsupshrink,
img#upshrink,
img#upshrink_ic {
  margin: 0 !important;
}
 
#top_section img#upshrink {
  float: none;
}  
 
table.table_list a.collapse {
	margin: 0 0 0 1em;
}
 
img#lastfiveupshrink {
  padding-right: 1em;
  font-weight: normal;
}
 
img[src$="/ip.gif"]:before {
  content: "💻";
}
 
/* Thread-Typen (unvollständig). */
 
img[src$="question.gif"]:before {
  content: "⁇";
}
 
img[src$="exclamation.gif"]:before {
  content: "‼";
}
 
img[src$="lamp.gif"]:before {
  content: "💡";
text-shadow:
       0  1px  #aaaa00,
       0  1px  #aaaa00,
       0  1px  #aaaa00,
       0  1px  #aaaa00;
}
 
img[src$="thumbup.gif"]:before {
  content: "👍";
}

img[src$="thumbdown.gif"]:before {
  content: "👎";
}

img[src$="smiley.gif"]:before { content: "😊";}
img[src$="angry.gif"]:before { content: "😠";}
img[src$="cheesy.gif"]:before { content: "😃";}
img[src$="grin.gif"]:before { content: "😁"; }
img[src$="sad.gif"]:before {content: "😞";}
img[src$="wink.gif"]:before {content: "😉";}

img[src$="moved.gif"]:before {
  content: "↪";
}
 
img[src$="recycled.gif"]:before {
  content: "♻";
}
 
img[src$="/xx.gif"]:before {
  content: "📖";
}
 
/* Alle poll-Icons ersetzen. Blaue Farbe um nicht gedeckte
   Fälle zu sehen */
 
img[src*="poll"]:before {
  content: "☑";
}
 
/* Normale Themen. */
 
img[src*="post_"]:before,
img[src*="_post"]:before {
  content: "📰";
}
 
/* Gesperrte Themen. */
 
img[src*="locked"]:before {
  content: "🔒📰";
}
  
/* Gepinnte Themen. */
 
img[src*="post_sticky"]:before {
  content: "📌📰";
}
  
/* Gesperrte und Gepinnte Themen. */
 
img[src*="post_locked_sticky"]:before {
  content: "📌🔒📰";
}
 
/* Themen, in denen der User selbst Beiträge verfasst hat. */
 
img[src*="my_"]:before { content: "📝"; }
 
/* Gepinnte Themen, in denen der User selbst Beiträge verfasst hat. */
 
img[src*="my_normal_post_sticky"]:before { content: "📌📝"; }
 
img[src$="my_hot_post_sticky.gif"]:before { content: "📌📝"; }
 
img[src$="my_veryhot_post_sticky.gif"]:before { content: "📌📝";}
 
/* TODO: Gesperrte und gepinnte Themen, in denen der User selbst Beiträge verfasst hat */
 
/* TODO: Gesperrte Themen, in denen der User selbst Beiträge verfasst hat */
 
/* Icon für die Aktivitätsstufen. */
 
img[src*="veryhot"]:after { color: #77cc77 !important; }
img[src*="hot"]:after { content: "🔥";  color: #aaaaaa; }
 
/* Foreninformationen. */
 
img[alt="Zukünftige Ereignisse"]:before {
  content: "📆";
  margin-left: -1em;
}
 
img[alt="Forumstatistiken"]:before {
  content: "📊";
  margin-left: -1em;
}
 
img[alt="Benutzer Online"]:before {
  content: "🔌";
  margin-left: -1em;
}
 
img[alt="Letzter Beitrag"]:before {
  content: "➔";
  margin-left: -1em;
}

/* Statistiken */

.activity_stats li div.bar div {
  background-color: #cccccc;
}
  
.profile_pie {
   -webkit-filter: grayscale(1);
   filter: grayscale(100%);
}
    
.statsbar div.bar div {
  background: #cccccc;
  border-radius: .25em;
}

/* rsp-blogs: rss-icon grau. */

img[src*="rss"] {
  -webkit-filter: grayscale(1);
  filter: grayscale(100%);
}
  
/* Vorhergehende Postings beim Verfassen eines neuen Beitrags. */
  
div#recent {
    flex-direction: column;
    order: 4;
  }
  
div#recent > * {
  width: 100%;
  text-align: left;
}

form#postmodify .roundframe {
  padding: 0 .25em;
}
  
span.upperframe, span.lowerframe {
    display: none;
  }
  
 /* Organisation der Anzeige beim Verfassen eines neuen Beitrags. */
  
form#postmodify.flow_hidden {
  flex-direction: column;
}
  
form#postmodify.flow_hidden div.cat_bar {
    width: 100%;
}