:root
{
	--primary-color: #EEF2FF;
	--secondary-color: #D6DAF0;
	--tertiary-color: slategrey;

	--highlight-secondary-color: #E1B7DDED;
	--highlight-border-color: #AA889E;

	--border-color: #8495A6AD;
	--hr-color: #B7C5D9;

	--main-bg-color: var(--primary-color);
	--bar-bg-color:  var(--tertiary-color);
	--bar-text-color: white;
	--banner-color: var(--tertiary-color);
}


/*---------- General ----------*/

body
{
	background: var(--main-bg-color);
	font-family: 'Open Sans', sans-serif;
	margin: 0px;
	padding: 0px;
}

form[name="postcontrols"] {
    margin: 0px 20px;
}

hr 
{
    background-color: var(--hr-color);
    border: 0;
    height: 4px;
}

.subject
{
    font-size: 1.2em;
}

/*spoiler decoration*/
.email[href="mailto:sage"]
{
	text-decoration: none;
}

.email[href="mailto:sage"]::before 
{
    content: ' ⚓ ';
    font-size: 16px;
}

/*annoucement bar*/
.blotter a
{
	text-decoration: none;
}

div .blotter
{
	font-size: 1.2em;
}

/*nav bar(s)*/
.boardlist
{
	font-size: 12pt !important;
	height: 25px;

	background: var(--bar-bg-color) !important;
	color: var(--bar-text-color);
	border-color: var(--hr-color);
}

.boardlist a, .boardlist a:visited 
{
    color: var(--bar-text-color);
}

.boardlist a[title="Options"]
{
	line-height: 25px;
	margin-right: 10px;
}

.boardlist .sub
{
	line-height: 25px;
	margin-left: 10px;
}

/*posts*/
div.post p {
    font-size: 14px;
}

div.post.reply
{
	width: auto;
	max-width: none !important;

	background: var(--secondary-color);
	border-color: var(--hr-color);
	margin: 0.8em 4px;
	padding: 0.5em 0.3em 0.8em 0.6em;

	overflow: hidden; /*keeps float inside container*/
	display: block;
}

div.post.reply.highlighted
{
	background: var(--highlight-secondary-color);
	border-color: var(--highlight-border-color);
}

/*videos*/
.video-container .unimportant {
   	font-size: 0px;
}

.video-container .unimportant::before {
    content: "🎦";
    font-size: 12px;
}

.video-container .video-pop {
    margin-right: 10px;
}

.video-container .post-image
{
	margin-right: 0px !important;
	padding: 0px 5px;
}

/*---------- Catalog Specific ----------*/

.theme-catalog div.thread 
{
    
    background: var(--secondary-color) !important;
    border: 2px solid var(--border-color) !important;
}

.theme-catalog div.thread:hover 
{
    border: 2px solid var(--tertiary-color) !important;
}

.intro a.thread_subject_link {
    text-decoration: none;
}

/*---------- Thread Specific ----------*/

footer
{
	margin-bottom: 60px;
}

.thread
{
	margin: 20px 0px;
}

.thread br
{
	display: none !important;
}

.post-image[src*="static/spoiler.png"]
{
	min-width: 160px !important;
	min-height: 160px !important;
}

.boardlist.bottom
{
	display: none;
}

#expand-all-images
{
	float: left;
	margin-left: 5px;
}

#gallery-view
{
	float: left;
	margin: 0px 0px 1px 4px;
}

#expand-all-images + .unimportant
{
	float: right;
	margin-right: 5px;
}

div.banner /*options above post form, not image banners*/
{
	background: var(--banner-color);
}

/*bottom opitons bar*/
#thread-interactions
{
	position: fixed;
	z-index: 2;

	bottom: 0;
	left: 0;
	right: 0;
	padding: 8px;
	margin: 0px;

	background-color: var(--bar-bg-color) !important;
	border-top: 1px solid var(--border-color) !important;
	color: var(--bar-text-color);

	box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.15);
}

#thread-interactions a, #thread-interactions a:visited 
{
    color: var(--bar-text-color);
}

/*---------- Testing ----------*/

div.post.reply {
    min-width: 90% !important;
}

.video-container .post-image {
    margin-bottom: 10px !important;
}

#reveal-spoilers
{
	float: left;
	margin-left: 5px;
}

div[id*="8kun-bottom-ads"] 
{
    display: none;
}