/* ----------- Images Used for this Theme ------------
Board Mascot.png		= https://media.8ch.net/edgy/src/1455037076682-0.png
Cursor Alt.png			= https://media.8ch.net/edgy/src/1455037093196-0.png
Cursor Default.png		= https://media.8ch.net/edgy/src/1455037093196-1.png
Dividing Line.png		= https://media.8ch.net/edgy/src/1455037111188-0.png
OP Background Image.png		= https://media.8ch.net/edgy/src/1455037076705-1.png
Reply Border.png		= https://media.8ch.net/edgy/src/1455037111188-1.png
Reply Border Highlighted.png	= https://media.8ch.net/edgy/src/1455037111189-2.png
Thread Background.png		= https://media.8ch.net/edgy/src/1455037076706-2.png
------------------------------------------------------ */

/* Fonts */

@import url(https://fonts.googleapis.com/css?family=Special+Elite);
@import url(https://fonts.googleapis.com/css?family=Rum+Raisin);
@import url(https://fonts.googleapis.com/css?family=Asul);

div.body span.heading {
  font-family: 'Special Elite', cursive;
  font-size:20px;
  line-height:27px;
}

div.post.reply div.body span.heading {
  font-family: 'Asul', cursive;
  font-size:15px;
}

p.intro {
  font-family: 'Rum Raisin', cursive;
  font-size:15px;
}

/* Reply Font Stuff */

div.body {
  color:#C5C8C6;
}

div.post.reply div.body {
  color: #fff;
  font-size:13px;
  line-height:16px;
}

div.post.reply div.body span.heading {
  font-size:15px;
}

.poster_id {
  cursor: pointer;
  color:#fff;
  text-shadow: none;
}

.poster_id:hover {
  cursor: pointer;
  color:#fff;
  text-shadow: 0px 0px 1px #f00;
}

p.intro:hover {
  color:#fff;
}

div.post.reply div.body a {
  color: #f00;
}
div.post.reply div.body a:hover {
  color: #fff;
  text-shadow: 0px 0px 1px #f00;
}

/* Cursors */

html, *, hover {cursor: url(https://media.8ch.net/edgy/src/1455037093196-1.png), default;}
a:hover, label, img, .options_tab_icon, i, input[type="submit"] {cursor: url(https://media.8ch.net/edgy/src/1455037093196-0.png), progress !important;}

/* Rules Page */

div.ban {
  border:#555 0px solid;
  -webkit-border-radius:5px; -khtml-border-radius:5px; -moz-border-radius:5px; border-radius:5px;
  font-family: "monospace";
  background-color:  rgba(0, 0, 0, 0.1);
  background: url('https://media.8ch.net/edgy/src/1455037076705-1.png') center no-repeat,
              url('https://media.8ch.net/edgy/src/1455037076706-2.png') repeat;
  color: #f00;
  text-shadow: 1px 1px 0px #000, -1px 1px 0px #000, 1px -1px 0px #000, -1px -1px 0px #000, 0px 1px 0px #000, 0px -1px 0px #000, -1px 0px 0px #000, 1px 0px 0px #000, 2px 2px 0px #000, -2px 2px 0px #000, 2px -2px 0px black, -2px -2px 0px black, 0px 2px 0px black, 0px -2px 0px black, -2px 0px 0px black, 2px 0px 0px black, 1px 2px 0px black, -1px 2px 0px black, 1px -2px 0px black, -1px -2px 0px black, 2px 1px 0px black, -2px 1px 0px black, 2px -1px 0px black, -2px -1px 0px black;
  text-align: center;
  vertical-align: middle;
}

/* Change the alignment of the header text in the rules page. */

div.ban h2 {text-align: center; vertical-align: middle; background-color: rgba(0, 0, 0, 0.1);}

/** Edgy Theme **/

body {
  background: #1d1f21;
  color: #C5C8C6;
  background-image: url('https://media.8ch.net/edgy/src/1455037076682-0.png');
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-position: right bottom; 
}
.thread {
  text-shadow: 2px 2px 2px rgba(0, 0, 0, 1);
}

/* OP Image Background */

div.thread {
  background: url("https://media.8ch.net/edgy/src/1455037076705-1.png") no-repeat scroll 0% 0% rgba(0, 0, 0, 0.1);
  background-position: 280px 50px; 
}

/* Board Header and Subtitle Text */

h1,div.subtitle {
  color:#f00!important;
  text-shadow: 1px 1px 0px #000, -1px 1px 0px #000, 1px -1px 0px #000, -1px -1px 0px #000, 0px 1px 0px #000, 0px -1px 0px #000, -1px 0px 0px #000, 1px 0px 0px #000, 2px 2px 0px #000, -2px 2px 0px #000, 2px -2px 0px black, -2px -2px 0px black, 0px 2px 0px black, 0px -2px 0px black, -2px 0px 0px black, 2px 0px 0px black, 1px 2px 0px black, -1px 2px 0px black, 1px -2px 0px black, -1px -2px 0px black, 2px 1px 0px black, -2px 1px 0px black, 2px -1px 0px black, -2px -1px 0px black;
  text-align: center;
  vertical-align: middle;
}

/* Links */

a:link,a:visited,p.intro a.email span.name {
  color:#B00;
}
a:link:hover {
  color: #FFF;
  text-shadow: 0px 0px 4px #b00;
}
a.post_no {
  color:#B00;
}
a.post_no:hover {
  color: #FFF;
  text-shadow: 0px 0px 4px #b00;
}

/* Reply Stuff */

div.banner {
  background-color: rgba(0, 0, 0, 0.5);
}
div.post.reply {
  background-color: rgba(0, 0, 0, 0.8);
  border:1px solid #181a1e;
  margin-bottom:13px;
  margin-left:16px;
  margin-top:13px;
  border-radius:2px;
  border-top-left-radius:2px;
  border-image-source: url("https://media.8ch.net/edgy/src/1455037111188-1.png");
  border-image-slice: 25%;
  border-image-width: 16px 16px 16px 16px;
  border-image-outset: 16px;
  border-image-repeat: repeat;
}
div.post.reply.highlighted {
  background-color: rgba(0, 0, 5, 0.9);
  border:1px solid #181a1e;
  margin-bottom:13px;
  margin-left:16px;
  margin-top:13px;
  border-radius:2px;
  border-top-left-radius:2px;
  border-image-source: url("https://media.8ch.net/edgy/src/1455037111189-2.png");
  border-image-slice: 25%;
  border-image-width: 16px 16px 16px 16px;
  border-image-outset: 16px;
  border-image-repeat: repeat;
}
div.post.reply div.body a {
  color:#81a2be
}
div.post.reply div.body a:hover {
  color:#5F89AC
}
div.post.reply.post-hover {
  background-color: rgba(0, 0, 5, 1.0);
  box-shadow: none!important;
  border:5px solid #00f;
  margin-bottom:13px;
  margin-left:16px;
  margin-top:13px;
  border-radius:2px;
  border-top-left-radius:2px;
  border-image-source: url("https://media.8ch.net/edgy/src/1455037111189-2.png");
  border-image-slice: 25%;
  border-image-width: 16px 16px 16px 16px;
  border-image-outset: 16px;
  border-image-repeat: repeat;
}

/* Catalog */

.theme-catalog div.thread:hover {
  background-color:#1d1f21;
  border-color:#111
}

/* More colourization of text */

p.intro span.subject {
  color:#b294bb
}
p.intro span.name {
  color:#C5C8C6
}
span.quote {
  color: #78FF22;
  text-shadow: 1px 1px 0px #222, -1px 1px 0px #222, 1px -1px 0px #222, -1px -1px 0px #222, 0px 1px 0px #222, 0px -1px 0px #222, -1px 0px 0px #222, 1px 0px 0px #222;
}
span.heading {
  color:#F20
}

/* Post submission table */

form table tr th, body tbody tr:nth-of-type(2n) {
  background:rgba(0, 0, 0, 0.2);
  border:1px solid rgba(0, 0, 0, 0.0);
  padding: 2px 4px;
  color:#C5F8C6;
  font-family: 'Rum Raisin', cursive;
  font-size:15px;
  text-align: right;
  font-variant: small-caps;
}

form tr, body tbody tr:nth-of-type(2n) {
  color: #C5C8C6;
  background-image: url('https://media.8ch.net/edgy/src/1455037076706-2.png');
  background-repeat: repeat;
  background-attachment: fixed;
  background-position: right bottom;
}
input, textarea {
  background-color: rgba(0, 0, 0, 0.3);
  border:1px solid #666;
  color: #fff;
}
input[type="text"], input[type="password"], textarea {
  border:1px solid rgba(0, 0, 0, 0.0);
  padding: 4px 4px;
}
textarea#body {
  margin-top: 0px;
  margin-bottom: 0px;
  width: 303px;
}
input[name="post"] {
  height: 27px;
  border:1px solid #111;
}
table.post-table {
  border:#444 3px solid;
  -webkit-border-radius:5px; -khtml-border-radius:5px; -moz-border-radius:5px; border-radius:5px;
}

/* Rules page again */

div.ban h2 {
  background:rgba(0, 0, 0, 0.1);
  color:#fff;
  text-shadow: 0px 0px 4px #B00;
}
div.ban {
  border-color:#800
}
div.ban p {
  color:#fff
}

/* Pages */

div.pages {
  background:#1d1f21;
  border-color:#1d1f21
}
div.pages a.selected {
  color:#81a2be;
  font-weight:700
}
div.boardlist {
  background-color:#282a2e!important;
  color:#C5C8C6
}
div.boardlist:nth-of-type(1) {
  border-bottom:1px solid #111!important;
  box-shadow:0 0 3px 0 #111
}
div.boardlist a {
  color:#b7ff2c;
}
div.boardlist a:hover {
  color:#f0f;
  text-shadow: 0px 0px 4px #B00, 0px 0px 4px #B00, 0px 0px 4px #B00, 0px 0px 4px #B00, 0px 0px 4px #B00;
}

/* Dividing Line */

hr {
  background-color:rgba(0, 0, 0, 1.0);
  border:0;
  height:24px;
  background:url("https://media.8ch.net/edgy/src/1455037111188-0.png") repeat-x scroll 0% 0% rgba(0, 0, 0, 0.0);
   -webkit-border-radius: 24px;
   -khtml-border-radius: 24px;
   -moz-border-radius: 24px;
   border-radius: 24px;
}

/* Options */

div#options_div {
  background-color:#282a2e;
}
div.options_tab_icon {
  color:#AAA;
}
div.options_tab_icon:hover {
  background-color:#222;
  text-shadow: 0px 0px 4px #B00, 0px 0px 4px #B00, 0px 0px 4px #B00;
}
div.options_tab_icon.active {
  color:#FFF;
  text-shadow: 0px 0px 4px #B00, 0px 0px 4px #B00, 0px 0px 4px #B00, 0px 0px 4px #B00, 0px 0px 4px #B00;
}

/* MOTD and Rules Section */

div.blotter {
  color:#fff;
  text-shadow: 0px 0px 4px #b00;
}
div.blotter a {
  color:#b00;
  text-shadow: 0px 0px 1px #000;
}

/* I forget what this is */

span.omitted {
  color:#707070;
}
p.intro a,span.omitted a {
  text-decoration:none;
}

/* Quick reply box */

form#quick-reply {
  padding-right:1px;
  border: 1px solid #111;
}

/* The ## Board Owner thing */

span.capcode {
  background-color: #000;
  padding:2px 5px;
  border-radius: 10px;
}

/* Watchlist */

div#watchlist,div#alert_div {
  border:1px solid #111;
  background-color: rgba(20, 20, 60, 0.8);
}
div#watchlist a,a.watchThread {
  color:#a00;
  text-decoration:none;
}
div#watchlist a:hover,a.watchThread:hover {
  color: #FFF;
  text-shadow: 0px 0px 4px #b00;
}

/* Keep small thumbnails in replies */

.post.reply a:not([data-expanded="true"]) .post-image{
  width:auto!important;
  height:auto!important;
  max-height:160px;
  max-width:160px;
}

.modlog tr:nth-child(even), .modlog th {
  background-color: #282A2E;
}

/* Flags background */

img.flag, img.flag_preview {
  background: rgba(0, 0, 0, 1);
  padding: 1px;
  border:1px solid #666;
  border-radius: 16px;
  margin-bottom: -4px;
}

img.flag:hover {
  border:1px solid #F66;
}

/* Spin Script that makes the flags spin when you hover over them. */
p.intro img.flag:hover, img.flag:focus, img.flag:active {
  animation:flaghover 1.5s linear 0s infinite;
  -o-animation:flaghover 1.5s linear 0s infinite;
  -moz-animation:flaghover 1.5s linear 0s infinite;
  -webkit-animation:flaghover 1.5s linear 0s infinite;
}
@keyframes flaghover {
  10% {transform: translateZ(0);}
  20% {transform: rotate(-360deg);}
  60% {transform: rotate(-180deg);}
}
@-o-keyframes flaghover {
  10% {transform: translateZ(0);}
  20% {transform: rotate(-360deg);}
  60% {transform: rotate(-180deg);}
}
@-moz-keyframes flaghover {
  10% {transform: translateZ(0);}
  20% {transform: rotate(-360deg);}
  60% {transform: rotate(-180deg);}
}
@-webkit-keyframes flaghover {
  10% {transform: translateZ(0);}
  20% {transform: rotate(-360deg);}
  60% {transform: rotate(-180deg);}
}