/* -------------------------------------- */
.cBox {
	position: relative;
	margin-bottom: 0.75em;
	
	border: 0.125em solid #DDD;
	border-radius: 0.5em;
}

.cMeat {
	position: relative;
	display: flex;
}

.cbLpane {
	position: relative;
	flex-grow: 1;
	flex-basis: 80%;
}

.cUserPic {
	position: relative;
	min-height: 75px;
	width: 17%;
}

.cUNbar {
	position: relative;
	background-color: #cce0f0;
}
	
.cUN {
	font-size: 1.1em;
	font-weight: bold;
	
	font-variant: small-caps;
	
	padding-left: 0.5em;
	padding-bottom: 0.125em;
}
.cBox .commentOP {
	background-color: rgba(var(--emphsis-color), 0.6) !important;
}

.cBoxCitemContainer .noProfile {
	background-color: rgba(128,128,128, 0.15) !important;
}

.cBox .cOPcom {
	display: none;
	position: absolute;
	z-index: 3;
	
	top: -0.50em;
	left: -0.7em;
}

.cBox .message {
	position: relative;
	display: flex;
	
	padding-left: 0.5em;
	overflow: hidden;
}

.cBox .message textarea {
	flex-grow: 1;
	height: 4em;
}

.cBox .message button {
	margin: 0.25em;
	margin-left: 0.5em;
	font-weight: bold;
	padding-left: 1em;
	padding-right: 1em;
}

.cBbar {
	position: relative;
	display: flex;
	
	justify-content: space-around;
	align-items: center;
	
	background-color: #d8e2eb;
	border-top: 1px solid #CCC;
	
	font-size: 0.8em;
	
	padding: 0.125em;
	padding-bottom: 0.0125em;
	font-family: sans-serif;
	
}

.cbtnReply {
	cursor: pointer;
}

.cbtnReply,
.cAgeStr {
	font-style: italic;
}

.cBbar li,
.cUNbar li {
	list-style-type: none;
}

.tImgFG, .tImgBG {

}

.cBox.rParent {
	margin-bottom: 0;
}

.cBox.msgReply {
	margin-left: 20px;
}

.cBoxAdd {
	position: relative;
	
	display: none;
	justify-content: space-around;
	flex-wrap: wrap;
	align-items: center;
	
	padding: 0.125em;
	margin: 0.5em auto;
	border: 2px solid #CCC;
	
	border-radius: 0.5em;
	font-variant: small-caps;
}

.cBoxAdd .cta { /* add comment call to action*/
	font-size: 1.3em;
	font-weight: bold;

	padding: 0.125em 1.5em;
	margin: 0.125em;
	
	border-radius: 0.5em;
}

.cBoxAdd .cta:hover { 
	background-color: rgba(255,255,255,0.60);
}


/*--------------------------------*/


.cLoading {
	background: #fff url("/images/loading.gif") no-repeat center;
}

/* - - - - - - - - - - - - - - - - - - */

.boxCommentOverlayContainer {
	position: relative;
	
	height: 100%;
	width: 100%;
	
	overflow-y: scroll
}

.boxCommentOverlayContainer .boxHeaderContainer {
	position: relative;
	display: flex;
	justify-content: space-between;
	
	margin: 0.33em auto;
	
	min-height: 5.5em;
	
}

.boxCommentOverlayContainer .usrThumbContainer {
	position: relative;
	flex-basis: 27%;
}

.boxCommentOverlayContainer .btnCOclose {
	width: 2em;
	height: 2em;
	
	display: flex;
	justify-content: center;
	align-items: center;
	
	margin: 0.5em;
	
	color: red;
	font-weight: bold;
	font-size: 1.5em;
	
	border: 0.025em solid grey;
	background-color: rgb(var(--main-fg-dark-color));
	
	border-radius: 7px;
}


.boxCommentOverlayContainer .cBoxCitemContainer {
	position: relative;
}

.boxCommentOverlayContainer .boxCOcaption {
	display: flex;
	
	font-style: italic;
	justify-content: center;
	align-items: center;
	
	background-color: rgba(255,255,255, 0.5);
	border-radius: 7px;
	
	flex-grow: 1;
	
	padding: 0.5em;
	margin-left: 1em;
	margin-right: 0.5em;
}

.boxCommentOverlayContainer .boxCOcomments {
	min-height: 2.5em;
}