/* Global CSS styles across every theme */

/* Make images upscale crispy */
* {
  image-rendering: -moz-crisp-edges;
  image-rendering: -o-crisp-edges;
  image-rendering: -webkit-optimize-contrast;
  image-rendering: crisp-edges;
  image-rendering: pixelated;
  -ms-interpolation-mode:nearest-neighbor;
  }

/* Make all links bold and not underlined by default */
a:link,a:visited,a:active,a:hover{text-decoration:none;font-weight:bold;}

/* Mostly legacy thing from when IE had a blue border around link images */
img { border:none; }
.center	{text-align:center}
.right	{text-align:right}

/* Make code blocks slightly less likely to go haywire, since apparently
   "don't stretch the entire gat dang page" is not possible in HTML, lol */
.code pre {
	max-width: 100%;
	width: 100%;
	overflow-x: auto;
	white-space: pre-wrap;
}

/* "Fix" for auto-generated <br> tags in <pre> blocks */
pre br { display: none; }

/* Make radio buttons look not terrible */
input[type=radio] { color: black; background: white; }

/* Spoiler tag code */
.pstspl1 {opacity:0;}
.pstspl1:hover {opacity:1;}
.pstspl2 {background:#000;color:#FFF;display:block;}

/* Stop avatars from being huge */
.avatar	{
	max-width:	200px;
	}

/* On mobile, make avatars smaller */
.mobile-avatar {
	float:	left;
	height:	50px;
	width:	50px;
	padding: 2px;
	text-align:	center;
}
.mobile-avatar > .avatar {
	max-height:	100%;
	max-width:	100%;
}

.spoiler-label:after { content: 'Spoiler'; color: white; background: black; font-style: italic; font-weight: bold; margin: 0 .2em; padding: 0.1em 0.4em; font-size: 80%; vertical-align: 10%; }
.spoiler > input[type="checkbox"] { display: none; }
.spoiler > .hidden { background: rgba(128, 128, 128, .5); }
.spoiler > input[type="checkbox"]:checked + .hidden {
  background: unset;
}

.spoiler-b > .spoiler-label:after { width: 100%; display: block; margin: 0; vertical-align: unset; padding: 0.25em 1em; box-sizing: border-box; content: 'Spoiler content - click to show/hide'; }

.spoiler-label:hover:after { background: #444; }
.spoiler-label:hover + input[type="checkbox"]:checked ~ .hidden { background: rgba(128, 128, 128, .5); }

.spoiler > .hidden > * {
  visibility: hidden;
}
.spoiler > input[type="checkbox"]:checked + .hidden > * {
  visibility: visible;
}

.imgtag { max-width: 100%; }

.post { position: relative; }