.comment-author {
	color: #16171e;

	a {
		color: #16171e;
	}
	.avatar {
		width: 70px;
		margin-right: 18px;
		border-radius: 50em;
	}
	.says {
		display: none;
	}
}
.comment-meta {
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.comment-metadata {
	font-size: em(14, 18);

	a {
		color: #a7a9b8;
	}
}
.comment .comment-extras,
.comment-content {
	padding-left: 93px;
}
.comment-content {
	margin-top: -18px;

	p {
		margin-bottom: 0.75em;
	}
}
.comment-extras {
	display: flex;
	align-items: center;
	justify-content: space-between;
	
	p {
		margin: 0;
	}
}
.comment-body {
	margin-bottom: 30px;
}
.comment {
	font-size: 18px; // as it is in first blog demo
	line-height: 1.3333333333em;

	.reply {

		a {
			display: inline-block;
			padding: 7px 13px;
			font-size: 10px;
			line-height: 1;
			text-transform: uppercase;
			letter-spacing: 0.1em;
			color: #181b31;
			border: 1px solid #d8dbe2;

			&:hover {
				border-color: #181b31;
				background-color: #181b31;
				color: #fff;
			}
		}
	}

	&.bypostauthor {
		
		.comment-author {

			&, a {
				color: var(--color-primary);
			}
		}
	}
}
.pingback {
	font-size: 18px;
	line-height: 1.3333333333em;
	margin-bottom: 30px;
	padding-bottom: 30px;
	border-bottom: 1px solid #d8dbe2;
	
	cite {
		flex-basis: 50%;
		padding: 0;
		margin: 0;
		flex-grow: 1;
		text-transform: none;
		letter-spacing: 0;
		font-size: 1em;

		&:before {
			content: none;
		}
	}
	time {
		margin: 0 1.5em;
	}
}
.comment-list {
	padding: 1em 0;
	margin: 2.25em 0 1em;
	
	&,
	ol.children {
		list-style: none;
	}
	ol.children {
		padding: 0;
		margin: 0;
	}
	ol.children {
		margin-left: 86px;

		.avatar {
			width: 45px;
		}
		.comment .comment-extras,
		.comment-content {
			padding-left: 68px;
		}
		.comment-content {
			margin-top: -8px;
		} 
	}

	// Reply comment form
	.comment-respond {
		background: none;
		padding: 0;

		.container {

			&,
			> .row > div {
				width: 100%;
				margin: 0;
			}
		}
	}
}

// body
.has-sidebar {

	.contents-container {

		> .comments-area,
		.comment-respond {

			> .container {

				&,
				> .row > div {
					width: 100%;
					margin: 0;
				}
			}
		}
	}
}