/* POST PREVIEW */
p.disclaimer {
	font-size: 0.8em;
}
@media only screen and (min-width: 817px) {
	.postDisplay.flex {
		justify-content: flex-start;
	}
}
.postDisplay:last-of-type {
	margin-bottom: 1rem;
}
.post {
	border: 2px solid var(--color8);
	border-radius: var(--windowCorner);
	
	flex-basis: 250px;
	max-width: 250px;
}
.post>a>.preview {
	width: 100%;
	height: 100%;
	position: relative;
}
.post>a>.preview>h5, .post>a>.preview>h6 {
	border-radius: 0;
	color: var(--color5);
	text-align: center;
	margin: 0;
}
.post>a>.preview>h5 {
	max-height: 20px;
	white-space: nowrap;
	text-overflow: ellipsis;
}
.post>a>.preview>h6 {
	border-top: 1px solid var(--color6);
}
.post>a>.preview>p {
	font-style: italic;
	padding: 0.5em;
	margin: 0;
	
	height: 100px;
}
.post>a>.preview>h5, .post>a>.preview>p {
	overflow: hidden;
}
.post>a>.preview>p:before {
	width: 100%;
	height: 100%;
	content: "";
	font-size: 0.8em;
	position: absolute;
	left: 0;
	bottom: 0;
	background: linear-gradient(180deg, rgba(245,222,173,0) 50%, rgba(245,222,173,1) 100%);
}
.post>ul.tags {
	background-color: var(--color8);
	color: var(--color5);
	font-size: 0.8em;
	margin: 0;
	text-align: center;
}
.post>ul.tags, h5>ul.tags {
	list-style: none;
	padding: 0;
}
.post>ul.tags:before, h5 > ul.tags:before {
	content: "Tags: ";
}
.post>ul.tags>li {
	display: inline-block;
	font-style: italic;
	margin: 0;
}
.post>ul.tags>li:not(:only-child):not(:last-child):after {
	content: ",";
}
/* ON POST */
#blogTitle+h5 {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
h5>span:not(#postDate) {
	
}
h5>ul.tags {
	display: block;
	margin: 0;
	padding: 0;
	text-align: right;
}
h5>ul.tags>li {
	border-radius: 0.5em;
	display: inline-block;
	font-size: 0.9em;
	font-weight: normal;
	margin: 0.1em;
	padding: 0.2em 0.4em;
	background-color: var(--color6);
	color: var(--color9);
}

/* POST-SPECIFIC SHIT */
figure.exampleImg {
	margin-top: 0;
	margin-bottom: 0;
}
figure.exampleImg.right {
	float: right;
	margin-right: 0;
	margin-left: 0.6rem;
}
figure.exampleImg.left {
	float: left;
	margin-left: 0;
	margin-right: 0.6rem;
}
figure.exampleImg img {
	position: relative;
	left: 50%;
	transform: translateX(-50%);
}
.discord, .twitterDM {
	margin: 0.5rem 0;
	padding: 0.5rem;
	border-radius: var(--windowCorner);
	
	background-color: var(--color8);
}
.discord .channelName {
	padding: 0.2rem;
	background-color: var(--color9);
	border-radius: var(--windowCorner);
	text-decoration: none;
}
.discord img, .resizeImg, .comment img {
	max-width: 250px;
	max-height: 800px;
	border-radius: var(--windowCorner);
}
.discord h3 {
	padding: 0;
	background-color: transparent;
}
.discord ul {
	margin-bottom: 0;
	padding: 0.5rem;
	list-style: none;
	background-color: var(--color9);
	border-radius: var(--windowCorner);
}
.discord ul h3 {
	margin-bottom: 0.2rem;
	font-size: 1rem;
}
.discord .timePost {
	padding-left: 0.5rem;
	color: var(--color6);
	font-size: 0.8rem;
	font-weight: normal;
}

.twitterDM>div {
	max-width: 600px;
	padding: 0.2rem 0.5rem;
	border-radius: var(--windowCorner);
}
.twitterDM>div>p:not(:last-child) {
	margin-bottom: 0.5rem;
}
.twitterDM>div>p:last-child {
	margin-bottom: 0;
}
.twitterDM>div+div {
	margin-top: 0.5rem;
}
.twitterDM>.left {
	background-color: var(--color9);
}
.twitterDM>.right {
	background-color: var(--color9);
	margin-left: auto;
}
.twitterDM>.time, .twitterDM>.user {
	font-size: 0.8rem;
	display: block;
}
.twitterDM>.right+.time, .twitterDM>.user.R {
	text-align: right;
}
.twitterDM>.user {
	font-style: italic;
}

.video {
	aspect-ratio: 16/9;
	border: 0;
	border-radius: var(--windowCorner);
	
	display: block;
	margin: 0 auto 10px;
	
	width: 100%;
	max-width: 30rem;
}

/* Page-specific */

/* MAY 2023 */
.bananaShowcase img {
	display: block;
	width: initial;
	height: initial;
	max-height: 100px;
	margin: 0 auto 0.2rem;
}

/* FEB 2024 */
.noiseCase, .pt64Case {
	justify-content: flex-start;
}
.noiseCase>figure {
	max-width: 400px;
}
div.pt64Case>figure, figure.pt64Case {
	max-width: 500px;
}
figure.pt64Case {
	margin: 0;
}

/* HTMLCommentBox */
.comment {
	margin-bottom: 1rem !important;
	border-left: var(--borderSize) solid var(--color6);
	padding-left: 0.3rem;
}
#HCB_comment_box {
	margin-top: 0.7rem;
}
#HCB_comment_box blockquote {
	border-left: 0;
	padding-left: 0;
	font-style: initial;
}
#HCB_comment_box blockquote:first-child {
	margin-top: 0;
}
#HCB_comment_box .comment .likes {
	position: initial !important;
}

#HCB_comment_box, #HCB_comment_box #hcb_form_content, #HCB_comment_box #hcb_form_email, #HCB_comment_box #hcb_form_name, #HCB_comment_box #hcb_form_website, #HCB_comment_box #hcb_submit, #hcb_file_label a {
	font-family: inherit !important; /* Adjust the value depending on wanted text size */
	font-size: inherit !important;
}
button .btn .btn-secondary, #HCB_comment_box .hcb-comment-tb button {
	visibility: hidden;
	position: relative !important;
}
button .btn .btn-secondary, #HCB_comment_box .hcb-comment-tb button, #HCB_comment_box #hcb_submit {
	height: 2rem;
	top: 0;
}
button .btn .btn-secondary:active, #HCB_comment_box .hcb-comment-tb button:active, #HCB_comment_box #hcb_submit:active {
	height: 1.9rem;
	top: 0.1rem;
}
#hcb_file_label, button .btn .btn-secondary:after, #HCB_comment_box .hcb-comment-tb button:after, #HCB_comment_box #hcb_submit {
	content: "base";
	visibility: visible;
	display: inline-block;
	position: absolute;
	top: 0;
	left: 0;
	
	padding: 0.3rem !important;
	min-width: 2rem !important;
	
	font-size: inherit !important;
	font-weight: inherit !important;
	text-align: center;
	color: var(--color9) !important;
	
	background-color: var(--color7) !important;
	
	border-radius: var(--windowCorner);
	border: 0 !important;
	border-bottom: var(--borderSize) solid var(--color6) !important;
	
	cursor: pointer !important;
}
#HCB_comment_box .date {
	color: var(--color6) !important
}
#HCB_comment_box #hcb_submit, #hcb_file_label {
	position: relative;
}
#HCB_comment_box .hcb-comment-tb {
	height: 2rem;
	
	display: flex;
	gap: 0.3rem;
}
#HCB_comment_box .hcb-comment-tb button {
	padding: 0 !important;
	font-weight: initial !important;
}
.hcb-like {
	margin-right: 0.2rem !important;
}
.hcb-like:after {
	content: "Like" !important;
}
.hcb-reply, .hcb-flag {
	margin-right: 0 !important;
}
.hcb-reply:after {
	content: "Reply" !important;
}
.hcb-flag:after {
	content: "Flag" !important;
}

#hcb_file_label:hover, #HCB_comment_box #hcb_form .btn:hover, #HCB_comment_box #HCB_comment_form_box .btn:hover{
	background-color: var(--color8) !important;
	color: var(--color10) !important;
}
#hcb_file_label a:hover{
	color: var(--color10) !important;
}
#hcb_file_label:active, button .btn .btn-secondary:active{
	background-color: var(--color6) !important;
	height: 0.9rem;
}
#hcb_file_label a {
	padding: 0 !important;
	margin-right: 0 !important;
	border: 0 !important;
	color: inherit !important;
	font-size: inherit !important;
	background-color: transparent !important;
}

#HCB_comment_box #hcb_form .home-desc a, #HCB_comment_box .home-desc a:visited {
	color: var(--color6) !important;
	text-decoration: underline dashed var(--color6) auto !important;
}
#HCB_comment_box #hcb_form .home-desc a:hover, #HCB_comment_box .home-desc a:visited:hover {
	color: var(--color7) !important;
}