Fix top and bottom bar on various CSS themes to have same backgroud color as page on both mobile and desktop. Change imgur links to local static links for Content Security Policy.

15 files changed, 1470 insertions, 30 deletions

diff --git a/static/OUHu2ki.jpg b/static/OUHu2ki.jpg
new file mode 100644
index 00000000..7e689a36
--- /dev/null
+++ b/static/OUHu2ki.jpg
diff --git a/static/Ua5aMb0.png b/static/Ua5aMb0.png
new file mode 100644
index 00000000..e2f3ed76
--- /dev/null
+++ b/static/Ua5aMb0.png
diff --git a/static/lainchan_header1.png b/static/lainchan_header1.png
new file mode 100644
index 00000000..2734f45b
--- /dev/null
+++ b/static/lainchan_header1.png
diff --git a/static/rRLs7q4.png b/static/rRLs7q4.png
new file mode 100644
index 00000000..a75a55ff
--- /dev/null
+++ b/static/rRLs7q4.png
diff --git a/stylesheets/8ch.cyber.css b/stylesheets/8ch.cyber.css
index 60fc5cc8..c12032a2 100644
--- a/stylesheets/8ch.cyber.css
+++ b/stylesheets/8ch.cyber.css
@@ -23,6 +23,11 @@ form table tr td {
 	background-color: #35363b;
 	border-color: #39d958;
 }
+.bar.bottom {
+  bottom: 0px;
+  border-top: 1px solid #333333;
+  background-color: #1A1A1A !important;
+}
 
     /* OPTION HIDING */
 
@@ -156,10 +161,10 @@ background-color: #2b2b2b;
         padding: 0;
         font-family: "Lucida Console", Monaco, monospace;
         font-size: 14px;
-        background: url("https://a.pomf.se/waivbu.png") fixed repeat top #000000;
-float: left;
-margin-left: 10px;
-margin-right: 35px;
+        background: url("../static/rRLs7q4.png") fixed repeat top #000000;
+	float: left;
+	margin-left: 10px;
+	margin-right: 35px;
     }
     /*saves one pixel of space*/
     header {
@@ -193,7 +198,7 @@ margin-right: 35px;
 
     /*adds horizontal bar below subject*/
     p.intro {
-        background-image: url('https://i.imgur.com/Ua5aMb0.png');
+        background-image: "../static/Ua5aMb0.png";
         background-repeat: repeat-x;
         background-position: bottom;
         padding-bottom: 7px;
@@ -230,7 +235,6 @@ margin-right: 35px;
         display: block;
         clear: both;
         border: solid 1px #2e8b57;
-        background-color: #2b2b2b;
     }
 
     /*hovered links have underline*/
diff --git a/stylesheets/cyberpunk.css b/stylesheets/cyberpunk.css
index 12e38c28..558421ce 100644
--- a/stylesheets/cyberpunk.css
+++ b/stylesheets/cyberpunk.css
@@ -231,8 +231,6 @@ span.trip {
 }
 div.pages {
 	color: #AAAAAA;
-	background: #333333;
-	border: #33cccc 1px solid;
 	font-family: sans-serif;
 	font-size: 10pt;
 }
diff --git a/stylesheets/dark.css b/stylesheets/dark.css
index 1c56f0d2..1495c7b7 100644
--- a/stylesheets/dark.css
+++ b/stylesheets/dark.css
@@ -1,4 +1,4 @@
-/**
+/*
  * dark.css
  * For AwsumChan by Circlepuller
  */
@@ -143,11 +143,16 @@ span.trip {
 }
 div.pages {
 	
-	background: #333333;
+	background: #1E1E1E; 
 	
 	font-family: sans-serif;
 	
 }
+.bar.bottom {
+    bottom: 0px;
+    border-top: 1px solid #333333;
+    background-color: #1E1E1E;
+}
 div.pages a.selected {
 	color: #CCCCCC;
 }
@@ -158,7 +163,6 @@ hr {
 div.boardlist {
 	text-align: center;
 	color: #999999;
-    	background-color: rgba(12%, 12%, 12%, 0.10);
 }
 
 div.ban {
@@ -175,9 +179,16 @@ table.modlog tr th {
 	color: #AAAAAA;
 }
 
+div.boardlist:not(.bottom) {
+ background-color: #1E1E1E;
+
+}
+
 .desktop-style div.boardlist:not(.bottom) {
-  text-shadow: black 1px 1px 1px, black -1px -1px 1px, black -1px 1px 1px, black 1px -1px 1px;
-  background-color: #666666;
+ position:static; 
+ text-shadow: black 1px 1px 1px, black -1px -1px 1px, black -1px 1px 1px, black 1px -1px 1px;
+ color: #999999;
+ background-color: #1E1E1E;
 }
 
 
diff --git a/stylesheets/fauux.css b/stylesheets/fauux.css
index 4be3ec9b..6eee907e 100644
--- a/stylesheets/fauux.css
+++ b/stylesheets/fauux.css
@@ -184,8 +184,6 @@ span.trip {
 }
 div.pages {
 	color: #AAAAAA;
-	background: #333333;
-	border: #d2738a 1px solid;
 	font-family: sans-serif;
 	font-size: 10pt;
 }
diff --git a/stylesheets/heavy_ice.css b/stylesheets/heavy_ice.css
index cbdc9994..b5ef39aa 100644
--- a/stylesheets/heavy_ice.css
+++ b/stylesheets/heavy_ice.css
@@ -242,7 +242,7 @@ div.banner a
 }
 input[type="submit"]
 {
-	background: #333333;
+	background: #000!important;
 	border: #666 1px solid;
 	color: #CCCCCC;
 }
@@ -284,13 +284,14 @@ box-shadow: 0px 1px #d2e7e8;
 {
 	border-top: 0px solid #666;
 	border: solid  1px #d2e7e8;
+	background-color: #000!important;
 
 
 }
 div.pages
 {
 	color: #d2e7e8 ;
-	background: #333;
+	background-color: #000!important;
 	border: #666 0px solid;
 	font-family: sans-serif;
 	font-size: 10px;
diff --git a/stylesheets/lainchanjp.css b/stylesheets/lainchanjp.css
new file mode 100644
index 00000000..e5d2cc2f
--- /dev/null
+++ b/stylesheets/lainchanjp.css
@@ -0,0 +1,1412 @@
+@font-face {
+    font-family: "LoveLetter";
+    src: url("/stylesheets/fonts/lovelt-webfont.woff2") format('woff2'),
+    url("/stylesheets/fonts/lovelt-webfont.woff") format('woff'),
+    url("/stylesheets/fonts/LoveLetter.TTF") format("truetype");
+
+    font-weight: normal;
+    font-style: normal;
+}
+
+#overheader{
+background:#070707 !important;
+border-bottom:1px #282828 solid !important;
+color:#4b4b4b !important;
+display:block !important;
+font-size:12pt !important;
+font-weight:normal !important;
+padding:10px 0px 10px 0px !important;
+min-width:100% !important;
+text-align:center !important;
+text-decoration:none  !important;
+width:100% !important;
+position:fixed;
+top:0px;
+z-index:1;
+}
+
+#overheader a{
+color:#9b9b9b !important;
+text-decoration:none !important;
+}
+
+#overheader a:hover{
+color:#32dd72 !important;
+}
+
+#overheader a.lainchan{
+font-family:"LoveLetter", "Lucida Sans Typewriter", "Lucida Console", monaco, "Bitstream Vera Sans Mono", monospace !important;
+color:#32dd72 !important;
+font-size:16pt;
+}
+
+#overheader span a{
+font-size:9pt;
+text-transform:uppercase;
+font-weight:bold;
+letter-spacing:0.0625em;
+position:relative;
+top:-1px;
+}
+
+#header{
+
+}
+
+#logo{
+
+}
+
+#logo a{
+width:384px !important;
+height:128px !important;
+min-width:384px !important;
+min-height:128px !important;
+display:block !important;
+background-repeat:no-repeat !important;
+background-position:center !important;
+text-indent:-9999px !important;
+margin:79px auto 35px auto  !important;
+border:1px solid #4b4b4b !important;
+}
+
+input, textarea, select{
+background:#1f1f1f !important;
+color:#c4c4c4 !important;
+border:1px #4b4b4b solid !important;
+font-family:arial, helvetica, sans-serif !important;
+margin:0px 4px 4px 0px !important;
+font-size:10pt !important;
+}
+
+textarea{
+min-height:240px !important;
+min-width:640px !important;
+}
+
+input[type="checkbox"]{
+position:relative;
+top:2px;
+left:2px;
+}
+
+#pagewrap{
+margin:0 auto 0 auto !important;
+max-width:960px !important;
+}
+
+code.inline{
+display:inline !important;
+}
+
+code.block{
+display:block !important;
+margin:1em 0em 1em 0em;
+padding:1em !important;
+background-color:#0b0b0b !important;
+border:dotted 1px #131313 !important;
+clear:none !important;
+}
+
+code.block br:first-child{
+display:none !important;
+}
+
+span.header{
+display:block !important;
+font-size:14pt !important;
+font-weight:bold !important;
+margin:0px;
+padding:0px;
+line-height:1 !important;
+}
+
+span.bold{
+font-weight:bold !important;
+}
+
+span.italic{
+font-style:italic !important;
+}
+
+span.underline{
+text-decoration:underline !important;
+}
+
+span.strikethrough{
+text-decoration:line-through !important;
+}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+body {
+  background: #0e0e0e;
+  color: #919191;
+  font-family: arial,helvetica,sans-serif;
+  font-size: 10pt;
+  margin: 0;
+  padding: 0;
+  font-family:"Roboto",Arial,Helvetica Neue,Helvetica,sans-serif;
+}
+
+.hidden {
+  display:none;
+}
+
+a,a:visited {
+  text-decoration: none;
+  color: #c4c4c4;
+}
+
+a:hover,.intro a.post_no:hover {
+  color: #32dd72;
+}
+
+a.post_no {
+  text-decoration: none;
+  margin: 0;
+  padding: 0;
+}
+
+.intro a.post_no {
+  color: inherit;
+}
+
+.intro a.post_no,p.intro a.email,p.intro a.post_anchor {
+  margin: 0;
+}
+
+.intro a.email span.name {
+  color: inherit;
+}
+
+.intro a.email:hover span.name {
+  color: #ffffff;
+}
+
+.intro label {
+  display: inline;
+}
+
+.intro time,p.intro a.ip-link,p.intro a.capcode {
+  direction: ltr;
+  unicode-bidi: embed;
+}
+
+h2 {
+  color: #ffffff;
+  font-size: 11pt;
+  margin: 0;
+  padding: 0;
+}
+
+header {
+  margin: 30px auto 35px auto;
+}
+
+h1 {
+  font-family: "LoveLetter", "Lucida Sans Typewriter", "Lucida Console", monaco, "Bitstream Vera Sans Mono", monospace !important;
+  color:#32dd72 !important;
+  letter-spacing: -2px;
+  font-size: 20pt;
+  margin: 0;
+}
+
+header div.subtitle,h1 {
+  color: #ffffff;
+  text-align: center;
+}
+
+header div.subtitle {
+  font-size: 9pt;
+}
+
+form {
+  margin-bottom: 4em;
+}
+
+form table {
+  margin: auto;
+}
+
+form table input {
+  height: auto;
+}
+
+input[type="text"],input[type="password"],textarea {
+  border: 1px solid #a9a9a9;
+  text-indent: 0;
+  text-shadow: none;
+  text-transform: none;
+  word-spacing: normal;
+  max-width: 100%;
+}
+
+input[name="delete"]{
+  display:none;
+}
+
+#quick-reply input[type="text"], input[type="password"], #quick-reply textarea {
+  max-width: 100%;
+}
+
+textarea {
+  width: 100%;
+}
+
+form table tr td {
+  text-align: left;
+  margin: 0;
+  padding: 0;
+}
+
+form table.mod tr td {
+  padding: 2px;
+}
+
+form table tr th {
+  text-align: left;
+  padding: 0px 8px 4px 0px;
+  vertical-align:top;
+}
+
+form table tr th {
+  background: none;
+}
+
+form table tr td div.center {
+  text-align: center;
+  float: left;
+  padding-left: 3px;
+}
+
+form table tr td div input {
+  display: block;
+  margin: 2px auto 0 auto;
+}
+
+form table tr td div label {
+  font-size: 10px;
+}
+
+.unimportant,.unimportant * {
+  font-size: 10px;
+}
+
+.file {
+  float: left;
+  margin-right: 2px;
+}
+
+.file:not(.multifile) .post-image {
+  float: left;
+}
+
+.file:not(.multifile) {
+  float: none;
+}
+
+p.fileinfo {
+  display: block;
+  margin: 0 0 0 20px;
+}
+
+div.post p.fileinfo {
+  padding-left: 5px;
+}
+
+div.banner {
+  background-color: #32dd72;
+  color: #000000 !important;
+  font-size: 10pt;
+  font-weight: bold;
+  text-align: center;
+  margin: 1em auto 1em auto;
+  padding: 0.3em 0 0.3em 0;
+  width:320px;
+}
+
+div.banner,div.banner a {
+  color: #000000;
+}
+
+div.banner a:hover {
+  color: #ffffff;
+  text-decoration: none;
+}
+
+img.banner,img.board_image {
+  display: block;
+  border: 1px solid #a9a9a9;
+  margin: 12px auto 0 auto;
+}
+
+.post-image {
+  display: block;
+  float: left;
+  margin: 5px 20px 10px 20px;
+  border: none;
+}
+
+.full-image {
+  max-width: 98%;
+}
+
+div.post .post-image {
+  padding: 5px;
+  margin: 0 20px 0 0;
+}
+
+div.post img.icon {
+  display: inline;
+  margin: 0 5px;
+  padding: 0;
+}
+
+div.post i.fa {
+  margin: 0 4px;
+  font-size: 16px;
+}
+
+div.post.op {
+  margin-right: 20px;
+  margin-bottom: 5px;
+}
+
+div.post.op hr {
+  border-color: #D9BFB7;
+}
+
+.intro {
+  margin: 0.5em 0;
+  padding: 0;
+  padding-bottom: 0.2em;
+}
+
+input.delete {
+  float: left;
+  margin: 1px 6px 0 0;
+}
+
+.intro span.subject {
+  color: #c4c4c4;
+  font-weight: bold;
+}
+
+.intro span.name {
+  color: #32dd72 !important;
+  font-weight: bold;
+}
+
+.intro span.capcode,p.intro a.capcode,p.intro a.nametag {
+  color: #32dd72  !important;
+  margin-left: 0;
+}
+
+.intro a {
+  margin-left: 8px;
+}
+
+div.delete {
+  float: right;
+}
+
+div.post.reply p {
+  margin: 0.3em 0 0 0;
+}
+
+div.post.reply div.body {
+  margin-left: 1.8em;
+  margin-top: 0.8em;
+  padding-right: 3em;
+  padding-bottom: 0.3em;
+}
+
+div.post.reply.highlighted {
+  background: #393939;
+}
+
+div.post.reply div.body a {
+  color: #c4c4c4;
+}
+
+div.post {
+  line-height:1.333 !important;
+  padding-left: 20px;
+}
+
+div.post div.body {
+  word-wrap: break-word;
+  white-space: pre-wrap;
+}
+
+div.post.reply {
+  background: #1f1f1f;
+  margin: 0.2em 4px;
+  padding: 0.2em 0.3em 0.5em 0.6em;
+  border-width: 1px;
+  border-style: none solid solid none;
+  border-color: #1f1f1f;
+  display: inline-block;
+  min-width:100% !important;
+  width: 100% !important;
+}
+
+span.trip {
+  color: #228854;
+}
+
+span.quote {
+  color: #00a740;
+}
+
+span.omitted {
+  display: block;
+  margin-top: 1em;
+}
+
+br.clear {
+  clear: left;
+  display: block;
+}
+
+span.controls {
+  float: right !important;
+  clear:none !important;
+  margin: 0;
+  padding: 0;
+  font-size: 80%;
+}
+
+span.controls.op {
+  float: none;
+  margin-left: 10px;
+}
+
+span.controls a {
+  margin: 0;
+}
+
+div#wrap {
+  width: 900px;
+  margin: 0 auto;
+}
+
+div.ban {
+  background: none;
+  border: 1px solid #1f1f1f;
+  max-width: 700px;
+  margin: 30px auto;
+}
+
+div.ban p,div.ban h2 {
+  padding: 3px 7px;
+}
+
+div.ban h2 {
+  background: #1f1f1f;
+  color: black;
+  font-size: 12pt;
+}
+
+div.ban p {
+  font-size: 12px;
+  margin-bottom: 12px;
+}
+
+div.ban p.reason {
+  font-weight: bold;
+}
+
+span.heading {
+  color: #ffffff;
+  font-size: 11pt;
+  font-weight: bold;
+}
+
+span.spoiler {
+  background: black;
+  color: black;
+  padding: 0 0px;
+}
+
+div.post.reply div.body span.spoiler a {
+  color: black;
+}
+
+span.spoiler:hover,div.post.reply div.body span.spoiler:hover a {
+  color: white;
+}
+
+div.styles {
+  float: right;
+  padding-bottom: 20px;
+}
+
+div.styles a {
+  margin: 0 10px;
+}
+
+div.styles a.selected {
+  text-decoration: none;
+}
+
+table.test {
+  width: 100%;
+}
+
+table.test td,table.test th {
+  text-align: left;
+  padding: 0px 5px 5px 0px;
+}
+
+table.test tr.h th {
+  background: #1f1f1f;
+}
+
+table.test td img {
+  margin: 0;
+}
+
+fieldset{
+border:1px solid #4b4b4b !important;
+font-size:11pt;
+margin:3em auto 0px auto;
+width:640px;
+line-height:1.333 !important;
+}
+
+fieldset small{
+font-size:9pt;
+}
+
+fieldset legend{
+font-weight:bold;
+font-size:14pt;
+}
+
+fieldset label {
+  display: block;
+  border:0px
+}
+
+div.pages {
+	color: #ffffff;
+	background: none;
+	display: inline-block;
+	padding: 8px;
+	margin: 8px auto 4px auto;
+	border-right: 0px solid #1f1f1f;
+	border-bottom: 0px solid #1f1f1f;
+}
+
+div.pages.top {
+  display: block;
+  padding: 5px 8px;
+  margin-bottom: 5px;
+  position: fixed;
+  top: 0;
+  right: 0;
+  opacity: 0.9;
+}
+
+@media screen and (max-width: 800px) {
+  div.pages.top {
+    display: none!important;
+  }
+}
+
+div.pages a.selected {
+  color: #ffffff;
+  font-weight: bolder;
+}
+
+div.pages a {
+  text-decoration: none;
+}
+
+div.pages form {
+  margin: 0;
+  padding: 0;
+  display: inline;
+}
+
+div.pages form input {
+  margin: 0 5px;
+  display: inline;
+}
+
+hr {
+  border: none;
+  border-bottom: 1px solid #1f1f1f;
+  height: 0;
+  clear: left;
+  padding-top: 3em;
+}
+
+div.report {
+  color: #333;
+}
+
+table.modlog {
+  margin: auto;
+  width: 100%;
+}
+
+table.modlog tr td {
+  text-align: left;
+  margin: 0;
+  padding: 4px 15px 0 0;
+}
+
+table.modlog tr th {
+  text-align: left;
+  padding: 4px 15px 5px 5px;
+  white-space: nowrap;
+}
+
+table.modlog tr th {
+  background: #1f1f1f;
+}
+
+td.minimal,th.minimal {
+  width: 1%;
+  white-space: nowrap;
+}
+
+div.top_notice {
+  text-align: center;
+  margin: 5px auto;
+}
+
+span.public_ban {
+  display: block;
+  color: red;
+  font-weight: bold;
+  margin-top: 15px;
+}
+
+span.toolong {
+  display: block;
+  margin-top: 15px;
+}
+
+div.blotter {
+  color: red;
+  font-weight: bold;
+  text-align: center;
+}
+
+table.mod.config-editor {
+  font-size: 9pt;
+  width: 100%;
+}
+
+table.mod.config-editor td {
+  text-align: left;
+  padding: 5px;
+  border-bottom: 1px solid #1f1f1f;
+}
+
+table.mod.config-editor input[type="text"] {
+  width: 98%;
+}
+
+div.boardlist:nth-child(1) {
+  background-color: #0e0e0e;
+}
+
+.desktop-style div.boardlist:nth-child(1) {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  margin-top: 0;
+  z-index: 30;
+  box-shadow: 0 1px 2px rgba(0, 0, 0, .15);
+  border-bottom: 1px solid;
+  background-color: #0e0e0e;
+}
+
+.bar.bottom {
+  bottom: 0px;
+  border-top: 1px solid #333333;
+  background-color: #0e0e0e ;
+}
+
+.desktop-style body {
+  padding-top: 20px;
+}
+
+.desktop-style .sub {
+  background: inherit;
+}
+
+.desktop-style .sub .sub {
+  display: inline-block;
+  text-indent: -9000px;
+  width: 7px;
+  background: url('img/arrow.png') right center no-repeat;
+}
+
+.desktop-style .sub .sub:hover,.desktop-style .sub .sub.hover {
+  display: inline;
+  text-indent: 0;
+  background: inherit;
+}
+
+#attention_bar {
+  height: 1.5em;
+  max-height: 1.5em;
+  width: 100%;
+  max-width: 100%;
+  text-align: center;
+  overflow: hidden;
+}
+
+#attention_bar_form {
+  display: none;
+  padding: 0;
+  margin: 0;
+}
+
+#attention_bar_input {
+  width: 100%;
+  padding: 0;
+  margin: 0;
+  text-align: center;
+}
+
+#attention_bar:hover {
+  background-color: rgba(100%,100%,100%,0.2);
+}
+
+.intro.thread-hidden {
+  margin: 0;
+  padding: 0;
+}
+
+form.ban-appeal {
+  margin: 9px 20px;
+}
+
+form.ban-appeal textarea {
+  display: block;
+}
+
+.MathJax_Display {
+  display: inline!important;
+}
+
+fieldset code {
+  margin: 0;
+  display:inline;
+}
+
+.theme-catalog div.thread img {
+  float: none!important;
+  margin: auto;
+  max-height: 150px;
+  max-width: 200px;
+  box-shadow: 0 0 4px rgba(0,0,0,0.55);
+  border: 2px solid rgba(153,153,153,0);
+}
+
+.theme-catalog div.thread {
+  display: inline-block;
+  vertical-align: top;
+  text-align: center;
+  font-weight: normal;
+  margin-top: 2px;
+  margin-bottom: 2px;
+  padding: 2px;
+  height: 300px;
+  width: 205px;
+  overflow: hidden;
+  position: relative;
+  font-size: 11px;
+  max-height: 300px;
+  background: rgba(182,182,182,0.12);
+  border: 2px solid rgba(111,111,111,0.34);
+}
+
+.theme-catalog div.thread strong {
+  display: block;
+}
+
+.theme-catalog div.threads {
+  text-align: center;
+  margin-left: -20px;
+}
+
+.theme-catalog div.thread:hover {
+  background: #4e4e4e;
+  border-color: #1f1f1f;
+}
+
+.theme-catalog div.grid-size-vsmall img {
+  max-height: 33%;
+  max-width: 95%
+}
+
+.theme-catalog div.grid-size-vsmall {
+  min-width:90px; max-width: 90px;
+  max-height: 148px;
+}
+
+.theme-catalog div.grid-size-small img {
+  max-height: 33%;
+  max-width: 95%
+}
+
+.theme-catalog div.grid-size-small {
+  min-width:140px; max-width: 140px;
+  max-height: 192px;
+}
+
+.theme-catalog div.grid-size-large img {
+  max-height: 40%;
+  max-width: 95%
+}
+
+.theme-catalog div.grid-size-large {
+  min-width: 256px; max-width: 256px;
+  max-height: 384px;
+}
+
+.theme-catalog img.thread-image {
+  height: auto;
+  max-width: 100%;
+}
+
+@media (max-width: 420px) {
+  .theme-catalog ul#Grid {
+    padding-left: 18px;
+  }
+
+  .theme-catalog div.thread {
+    width: auto;
+    margin-left: 0;
+    margin-right: 0;
+  }
+
+  .theme-catalog div.threads {
+    overflow: hidden;
+  }
+}
+
+.compact-boardlist {
+  padding: 3px;
+  padding-bottom: 0;
+}
+
+.compact-boardlist .cb-item {
+  display: inline-block;
+  vertical-align: middle;
+}
+
+.compact-boardlist .cb-icon {
+  padding-bottom: 1px;
+}
+
+.compact-boardlist .cb-fa {
+  font-size: 21px;
+  padding: 2px;
+  padding-top: 0;
+}
+
+.compact-boardlist .cb-cat {
+  padding: 5px 6px 8px 6px;
+}
+
+.cb-menuitem {
+  display: table-row;
+}
+
+.cb-menuitem span {
+  padding: 5px;
+  display: table-cell;
+  text-align: left;
+  border-top: 1px solid rgba(0,0,0,0.5);
+}
+
+.cb-menuitem span.cb-uri {
+  text-align: right;
+}
+
+.boardlist:not(.compact-boardlist) #watch-pinned::before {
+  content: " [ ";
+}
+
+.boardlist:not(.compact-boardlist) #watch-pinned::after {
+  content: " ] ";
+}
+
+.boardlist:not(.compact-boardlist) #watch-pinned {
+  display: inline;
+}
+
+.boardlist:not(.compact-boardlist) #watch-pinned a {
+  margin-left: 3pt;
+}
+
+.boardlist:not(.compact-boardlist) #watch-pinned a:first-child {
+  margin-left: 0pt;
+}
+
+.compact-boardlist #watch-pinned {
+  display: inline-block;
+  vertical-align: middle;
+}
+
+.new-posts {
+  opacity: 0.6;
+  margin-top: 1em;
+}
+
+.new-threads {
+  text-align: center;
+}
+
+#options_handler, #alert_handler {
+  position: fixed;
+  top: 0px;
+  left: 0px;
+  right: 0px;
+  bottom: 0px;
+  width: 100%;
+  height: 100%;
+  text-align: center;
+  z-index: 9900;
+}
+
+#options_background, #alert_background {
+  background: black;
+  opacity: 0.5;
+  position: absolute;
+  top: 0px;
+  left: 0px;
+  right: 0px;
+  bottom: 0px;
+  width: 100%;
+  height: 100%;
+  z-index: -1;
+}
+
+#options_div, #alert_div {
+  background-color: #4e4e4e;
+  border: 1px solid black;
+  display: inline-block;
+  position: relative;
+  margin-top: 20px;
+}
+
+#options_div {
+  width: 620px;
+  height: 400px;
+  resize: both;
+  overflow: auto;
+}
+
+
+
+#alert_div {
+  width: 500px;
+}
+
+#alert_message {
+  text-align: center;
+  margin: 13px;
+  font-size: 110%;
+}
+
+.alert_button {
+  margin-bottom: 13px;
+}
+
+#options_div textarea {
+  max-width: 100%;
+}
+
+#options_close, #alert_close {
+  top: 0px;
+  right: 0px;
+  position: absolute;
+  margin-right: 3px;
+  font-size: 20px;
+  z-index: 100;
+}
+
+#options_tablist {
+  padding: 0px 5px;
+  left: 0px;
+  width: 90px;
+  top: 0px;
+  bottom: 0px;
+  height: 100%;
+  border-right: 1px solid black;
+}
+
+.options_tab_icon {
+  padding: 5px;
+  color: black;
+  cursor: pointer;
+}
+
+.options_tab_icon.active {
+  color: red;
+}
+
+.options_tab_icon i {
+  font-size: 20px;
+}
+
+.options_tab_icon div {
+  font-size: 11px;
+}
+
+.options_tab {
+  padding: 10px;
+  position: absolute;
+  top: 0px;
+  bottom: 10px;
+  left: 101px;
+  right: 0px;
+  text-align: left;
+  font-size: 12px;
+  overflow-y: auto;
+}
+
+.options_tab h2 {
+  text-align: center;
+  margin-bottom: 5px;
+}
+
+.mobile-style #options_div, .mobile-style #alert_div {
+  display: block;
+  width: 100%;
+  height: 100%;
+  margin-top: 0px;
+}
+
+.mentioned {
+  word-wrap: break-word;
+}
+
+.poster_id {
+  cursor: pointer;
+  display: inline-block;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  -o-user-select: none;
+  user-select: none;
+}
+.poster_id:hover {
+  color: #800000!important;
+}
+.poster_id::before {
+  content: " ID: ";
+}
+
+code{
+/* Better code tags */
+  max-width:inherit;
+  word-wrap:normal;
+  overflow:auto;
+  font-size:9pt;
+  font-family:"Roboto Mono",Lucida Console,Lucida Sans Typewriter,monaco,Bitstream Vera Sans Mono,monospace !important;
+}
+
+span.pln {
+  color:grey;
+}
+
+
+@media screen and (min-width: 768px) {
+  .intro {
+    clear: none;
+  }
+
+  div.post div.body {
+    clear: none;
+  }
+}
+
+.clearfix {
+	display: block;
+	clear: both;
+	visibility: hidden;
+	overflow: hidden;
+
+	font-size: 0px;
+	line-height: 0px;
+
+	box-sizing: border-box;
+	border: none;
+	height: 0;
+	margin: 0;
+	padding: 0;
+	width: 100%;
+	zoom: 1;
+}
+
+/* === SPECIFIC PAGES & FEATURES === */
+
+/* Board List */
+div.boardlist {
+	margin-top: 3px;
+
+	color: #89A;
+	font-size: 9pt;
+}
+div.boardlist.bottom {
+	margin-top: 12px;
+	clear: both;
+}
+div.boardlist a {
+	text-decoration: none;
+}
+
+/* Threads */
+/* Thread Footer */
+#thread-interactions {
+	margin: 8px 0;
+	clear: both;
+}
+#thread-links {
+	float: left;
+}
+#thread-links > a {
+	padding-left: none;
+	padding-right: 10px;
+}
+#thread-quick-reply {
+	display: none;
+	position: absolute;
+	left: 50%;
+	right: 50%;
+	text-align: center;
+	width: 100px;
+	margin-left: -50px;
+}
+#thread_stats {
+	float: right;
+}
+
+#post-moderation-fields {
+	float: right;
+	text-align: right;
+}
+#delete-fields {
+}
+#report-fields {
+}
+
+
+
+/* threadwatcher */
+
+#watchlist {
+	display: none;
+	max-height: 250px;
+	overflow: auto;
+	border: 1px solid;
+	border-style: none solid solid none;
+	width: 50%;
+	margin: 0 auto;
+	margin-bottom: 10px;
+}
+
+.watchlist-inner, .watchlist-controls {
+	margin: 0 auto;
+	margin-top: 10px;
+	margin-bottom: 10px;
+	text-align: center;
+}
+
+#watchlist-toggle, .watchThread, .watchlist-remove, #clearList, #clearGhosts {
+	cursor: pointer;
+}
+
+#youtube-size input {
+	width: 50px;
+}
+
+/* File selector */
+.dropzone {
+  color: #000;
+  cursor: default;
+  margin: auto;
+  padding: 0px 4px;
+  text-align: center;
+  min-height: 50px;
+  max-height: 140px;
+  transition: 0.2s;
+  background-color: rgba(200, 200, 200, 0.5);
+  overflow-y: auto;
+}
+.dropzone-wrap {
+  width: 100%;
+}
+.dropzone .file-hint {
+  color: rgba(0, 0, 0, 0.5);
+  cursor: pointer;
+  position: relative;
+  margin-bottom: 5px;
+  padding: 10px 0px;
+  top: 5px;
+  transition: 0.2s;
+  border: 2px dashed rgba(125, 125, 125, 0.4);
+}
+.file-hint:hover, .dropzone.dragover .file-hint {
+  color: rgba(0, 0, 0, 1);
+  border-color: rgba(125, 125, 125, 0.8);
+}
+.dropzone.dragover {
+  background-color: rgba(200, 200, 200, 1);
+}
+.dropzone .file-thumbs {
+  text-align: left;
+  width: 100%;
+}
+.dropzone .tmb-container {
+  padding: 3px;
+  overflow-x: hidden;
+  white-space: nowrap;
+}
+.dropzone .file-tmb {
+  height: 40px;
+  width: 70px;
+  cursor: pointer;
+  display: inline-block;
+  text-align: center;
+  background-color: rgba(187, 187, 187, 0.5);
+  background-size: cover;
+  background-position: center;
+}
+.dropzone .file-tmb span {
+  font-weight: 600;
+  position: relative;
+  top: 13px;
+}
+.dropzone .tmb-filename {
+  display: inline-block;
+  vertical-align: bottom;
+  bottom: 12px;
+  position: relative;
+  margin-left: 5px;
+}
+.dropzone .remove-btn {
+  cursor: pointer;
+  color: rgba(125, 125, 125, 0.5);
+  display: inline-block;
+  vertical-align: bottom;
+  bottom: 10px;
+  position: relative;
+  margin-right: 5px;
+  font-size: 20px
+}
+.dropzone .remove-btn:hover {
+  color: rgba(125, 125, 125, 1);
+}
+
+#thread_stats {
+  display: inline;
+  margin-left: 10px;
+  margin-right: 10px;
+}
+
+/* Fileboard */
+table.fileboard th, table.fileboard td {
+  padding: 2px;
+  text-align: center;
+}
+table.fileboard .intro a {
+  margin-left: 0px;
+}
+
+/* Gallery view */
+#gallery_images {
+  position: absolute;
+  right: 0px;
+  bottom: 0px;
+  top: 0px;
+  width: 12%;
+  background-color: rgba(0, 0, 0, 0.4);
+  overflow: auto;
+}
+#gallery_toolbar {
+  position: absolute;
+  right: 12%;
+  left: 0px;
+  bottom: 0px;
+  height: 32px;
+  background-color: rgba(0, 0, 0, 0.4);
+  text-align: right;
+}
+#gallery_images img {
+  width: 100%;
+}
+#gallery_toolbar a {
+  font-size: 28px;
+  padding-right: 5px;
+}
+#gallery_main {
+  position: absolute;
+  left: 0px;
+  right: 12%;
+  bottom: 32px;
+  top: 0px;
+  padding: 10px;
+}
+
+#gallery_images img {
+  opacity: 0.6;
+  -webkit-transition: all 0.5s;
+          transition: all 0.5s;
+}
+#gallery_images img:hover, #gallery_images img.active {
+  opacity: 1;
+}
+#gallery_images img.active {
+  -webkit-box-shadow: 0px 0px 29px 2px rgba(255,255,255,1);
+     -moz-box-shadow: 0px 0px 29px 2px rgba(255,255,255,1);
+          box-shadow: 0px 0px 29px 2px rgba(255,255,255,1);
+  z-index: 1;
+}
+#gallery_main img, #gallery_main video {
+  max-width: 100%;
+  max-height: 100%;
+  position: absolute;
+}
+.own_post {
+	font-style: italic;
+	font-weight: normal;
+	opacity: .666;
+}
+div.mix {
+	display: inline-block;
+}
diff --git a/stylesheets/mono.e.lain.css b/stylesheets/mono.e.lain.css
index 9ba0e5b0..6149aaa3 100644
--- a/stylesheets/mono.e.lain.css
+++ b/stylesheets/mono.e.lain.css
@@ -157,7 +157,7 @@ background-color: #cdcdcd;
         padding: 0;
         font-family: arial, sans-serif;
         font-size: 14px;
-        background: url("https://i.imgur.com/OUHu2ki.jpg") fixed repeat top #000000;
+        background: url("../static/OUHu2ki.jpg") fixed repeat top #000000;
 min-width: 395px;
 margin-left: 10px;
 margin-right: 35px;
@@ -198,7 +198,7 @@ margin-left: 10px;
      
     /*adds horizontal bar below subject*/
     p.intro {
-        background-image: url('https://i.imgur.com/UebGaj5.png');
+        background-image: url('https://www.lainchan.org/static/UebGaj5.png');
         background-repeat: repeat-x;
         background-position: bottom;
         min-height: 25px;
@@ -361,4 +361,4 @@ SPAN.controls.op:before { content: '\A'; white-space:pre;  }
 
 div.post-menu
 {
-color: #ffffff;}
\ No newline at end of file
+color: #ffffff;}
diff --git a/stylesheets/poison.css b/stylesheets/poison.css
index 772e58b9..5357951b 100644
--- a/stylesheets/poison.css
+++ b/stylesheets/poison.css
@@ -26,6 +26,16 @@ body
 	background-color: #29202D!important;
 	border-color: #29202D!important;
 }
+
+div.boardlist:not(.bottom) 
+{
+	background-color:#29202D!important;
+}
+.desktop-style div.boardlist:not(.bottom) 
+{
+	background-color:#140f16;
+}
+
 .boardlist
 {
 	text-shadow: none!important;
diff --git a/stylesheets/style.css b/stylesheets/style.css
index 745e156c..8a9b0e57 100644
--- a/stylesheets/style.css
+++ b/stylesheets/style.css
@@ -62,7 +62,7 @@ img.banner, img.board_image {
   width: 100%;
   left: 0px;
   z-index: 3;
-  background-color: #333333;
+  background-color: #D6DAF0;
   border-color: #B7C5D9;
 }
 .bar > :not(script) {
@@ -78,7 +78,6 @@ img.banner, img.board_image {
 .bar.bottom {
   bottom: 0px;
   border-top: 1px solid #333333;
-  background-color: #333333 ;
 }
 
 
@@ -743,10 +742,6 @@ div.blotter {
   background-color: #D6DAF0;
 }
 
-.desktop-style body {
-  padding-top: 20px;
-}
-
 .desktop-style .sub {
   background: inherit;
 }
diff --git a/stylesheets/tsuki.css b/stylesheets/tsuki.css
index 8464a21a..710442af 100644
--- a/stylesheets/tsuki.css
+++ b/stylesheets/tsuki.css
@@ -456,8 +456,6 @@ div.pages {
 	display: inline-block;
 	padding: 8px;
 	margin: 8px 0 4px 0;
-	border-right: 1px solid #B7C5D9;
-	border-bottom: 1px solid #B7C5D9;
 }
 
 div.pages.top {
@@ -1442,10 +1440,15 @@ p.fileinfo a:hover {
 span.trip {
 	color: #AAAAAA;
 }
+.bar.bottom {
+    bottom: 0px;
+    border-top: 1px solid #333333;
+    background-color: #666666;
+}
+
 div.pages {
 	color: #AAAAAA;
-	background: #333333;
-	border: #666666 1px solid;
+	background: #666666;
 	font-family: Normal, sans-serif;
 	font-size: 16px;
 }
diff --git a/stylesheets/volafile.css b/stylesheets/volafile.css
index 5d250bf6..72584c1c 100644
--- a/stylesheets/volafile.css
+++ b/stylesheets/volafile.css
@@ -24,6 +24,14 @@ body
 	background-color: #435D78!important;
 	border-color: #486582!important;
 }
+div.boardlist:not(.bottom) 
+{
+	background-color:#395168;
+}
+.desktop-style div.boardlist:not(.bottom) 
+{
+	background-color:#395168;
+}
 .boardlist
 {
 	text-shadow: none!important;