/*...........................................................

		HTML COMMENT BOX!!!!!!!!!!!!!

..........................*/

#HCB_comment_box a[href*="rss"]{
	display: none;
}


#HCB_comment_box{
   width: 80%;
   height: auto!important;
   margin: auto;
   text-align: left!important;
}

#HCB_comment_box #comments_list{
   flex: initial!important;
}

.comment{
   margin-right: 0.75em;
}

.comment blockquote{
	max-width: 40ch;
}

.comment p{
   line-height: 1.25!important;
}

#HCB_comment_box,
.btn,
input#hcb_submit,
.hcb-comment-tb button{
	font-family: var(--body-font)!important;
}

/*..........................

	date

..........................*/

span.date{
	font-size: 0.6em!important;
}

/*..........................

	author name + decorations

..........................*/

span.author, b.author-name{
	font-size: 1.05em!important;
	font-family: var(--heading-font)!important;
	max-width: 30ch;
	display: inline-block;
}

/*..........................

	images next to author names

..........................*/

span.author::before{
	content: "";
	display: inline-block;
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
	height: 1em;
	width: 1em;
	margin-right: 0.33em;
}

.comment:nth-child(5n+1) span.author::before{
	background-image: url("/stickers/dotty/1_spring/E09.png");
}

.comment:nth-child(5n+2) span.author::before{
	background-image: url("/stickers/dotty/3_autumn/A24.png");
}

.comment:nth-child(5n+3) span.author::before{
	background-image: url("/stickers/yummy/blue/G10.png");
}

.comment:nth-child(5n+4) span.author::before{
	background-image: url("/stickers/yummy/blue/E06.png");
}

.comment:nth-child(5n) span.author::before{
	background-image: url("/stickers/yummy/orange/O05.png");
}

/*.................. styles odd comments */

/* first reply */

.comment:nth-child(odd) .comment:nth-of-type(5n+1) span.author::before{
	background-image: url("/stickers/yummy/yellow/J04.png");
}

/* second reply */

.comment:nth-child(odd) .comment:nth-of-type(5n+2) span.author::before{
	background-image: url("/stickers/yummy/pink/O07.png");
}

/* third reply */

.comment:nth-child(odd) .comment:nth-of-type(5n+3) span.author::before{
	background-image: url("/stickers/yummy/blue/H06.png");
}

/* fourth reply */

.comment:nth-child(odd) .comment:nth-of-type(5n+4) span.author::before{
	background-image: url("/stickers/dotty/3_autumn/F26.png");
}

/* fifth reply */

.comment:nth-child(odd) .comment:nth-of-type(5n) span.author::before{
	background-image: url("/stickers/yummy/orange/L04.png");
}


/*..................... styles even comments */

/* first reply */

.comment:nth-child(even) .comment:nth-of-type(5n+1) span.author::before{
	background-image: url("/stickers/dotty/3_autumn/G15.png");
}

/* second reply */

.comment:nth-child(even) .comment:nth-of-type(5n+2) span.author::before{
	background-image: url("/stickers/dotty/1_spring/I22.png");
}

/* third reply */

.comment:nth-child(even) .comment:nth-of-type(5n+3) span.author::before{
	background-image: url("/stickers/dotty/1_spring/B23.png");
}

/* fourth reply */

.comment:nth-child(even) .comment:nth-of-type(5n+4) span.author::before{
	background-image: url("/stickers/yummy/blue/H07.png");
}

/* fifth reply */

.comment:nth-child(even) .comment:nth-of-type(5n) span.author::before{
	background-image: url("/stickers/dotty/2_summer/A07.png");
}

/* teddybear fix.. */

.comment:nth-child(2) .comment:nth-of-type(5n+1) span.author::before{
	background-image: url("/stickers/dotty/3_autumn/B03.png");
}

/*..........................

	the actual comment itself

..........................*/

p.hcb-comment-body{
	font-size: 1em!important;
}

#HCB_comment_box .comment{
	margin-bottom: 1em!important;
}

#HCB_comment_box > p:last-of-type{
	margin: 1em auto;
	font-size: 1em!important;
}

/*..........................

		like/reply/flag

..........................*/

.hcb-comment-tb{
	text-align: right!important;
	max-width: initial!important;
}

.hcb-comment-tb button:first-of-type::before,
.hcb-comment-tb button:last-of-type::after
{
	content: " · ";
}


#HCB_comment_box .hcb-comment-tb button{
	font-size: 1.1svw!important;
	color: var(--red-link)!important;
}

#HCB_comment_box button.hcb-like{
	color: var(--aqua-link)!important;
}

#HCB_comment_box button.hcb-reply{
	color: var(--green-link)!important;
}

#HCB_comment_box .hcb-comment-tb button:hover{
	color: var(--purple-link)!important;
	cursor: url("/assets/web/cursor_2.ico") 2 5, pointer!important;
}

/*

#HCB_comment_box .comment:nth-child(odd) .hcb-comment-tb button{
	color: var(--blue)!important;
}

#HCB_comment_box .comment:nth-child(odd) .comment:nth-child(odd) .hcb-comment-tb button{
	color: var(--green-link)!important;
}

#HCB_comment_box .comment:nth-child(odd) .hcb-comment-tb button:hover{
	color: var(--purple)!important;
	cursor: url("/assets/web/cursor_2.ico") 2 5, pointer!important;
}

#HCB_comment_box .comment:nth-child(odd) .comment:nth-child(odd) .hcb-comment-tb button:hover{
	color: var(--purple)!important;
	cursor: url("/assets/web/cursor_2.ico") 2 5, pointer!important;
}

*/

/*..........................

		submit button

..........................*/

.btn, input#hcb_submit{
	background: var(--yellow-texture)!important;
    display: flex!important;
    	align-items: center!important;
    	justify-content: center!important;
    margin: 0 auto 0.5em auto!important;
    width: auto!important;
    height: auto!important;
    padding: 0.2em 1em 0 1em!important;
	border: var(--border-level-2)!important;
		border-radius: var(--border-radius-level-1)!important;
		border-color: var(--yellow)!important;
		border-style: outset!important;
	color: var(--black)!important;
   text-align: center;
	font-weight: bold!important;
   cursor: url("/assets/web/cursor_2.ico") 2 5, pointer;
}

.btn{
	font-size: 0.9em!important;
}

input#hcb_submit{
	font-size: 0.8em!important;
	margin: 1em 0 1.5em 0!important;
	filter: var(--simple-text-shadow);
}

/*..........................

	the forms where ppl type

..........................*/

#hcb_form_content,
#hcb_form_email,
#hcb_form_name,
#hcb_form_website{
   font-size: 1em!important;
	font-family: var(--body-font)!important;
   padding: 0.5ch 1ch 0 1ch!important;
   filter: var(--simple-text-shadow);
	line-height: 1.7;
}

#hcb_form_content{
	line-height: 1.4;
}

#hcb_form_email::placeholder,
#hcb_form_name::placeholder,
#hcb_form_website::placeholder{
   filter: var(--simple-text-shadow);
	font-size: 0.9em!important;
}

/*..........................

	hides built in title

..........................*/

#HCB_comment_box h3{
	display: none;
}

#hcb_msg{
   display: none;
}

p#no_comments{
	text-align: center!important;
}