/**
* Comments
* ----------------------------------------------------------------------------
*/
.gf-comments-area {
	.comments-list {
		margin-top: 90px;
	}


	.comment-body {
		.avatar {
			border-radius: 50%;
			width: 80px;
			height: 80px;
			float: left;
			+ .comment-text {
				padding-left: 110px;
			}
		}
	}

	.comment-list {
		margin: 0;
		padding: 0;
		list-style: none;
		li.comment,
		li.pingback {
			margin-bottom: 35px;
			padding-bottom: 35px;
			border-bottom: 2px solid var(--g5-color-border);
			&:last-child {
				margin-bottom: 0;
			}
		}
		.children {
			margin: 35px 0 0 0;
			padding-top: 35px;
			border-top: 2px solid var(--g5-color-border);
			padding-left: 110px;
			list-style: none;
			li.comment:last-child,
			li.pingback:last-child{
				margin-bottom: 0;
				padding: 0;
				border-bottom: none;
			}

		}
	}

	.children .comment-body .avatar {
		width: 50px;
		height: 50px;
		+ .comment-text {
			padding-left: 80px;
		}
	}

	.children .children {
		padding-left: 80px;
	}

	.comment-meta-top {
		margin-bottom: 12px;
		.author-name {
			margin: 0;
			font-family: var(--g5-font-primary);
			font-size: 15px;
			font-weight: bold;
			font-style: normal;
			font-stretch: normal;
			line-height: 1;
			letter-spacing: normal;
			text-transform: uppercase;
		}

		.comment-meta-author {
			margin-right: auto;
		}

		.comment-meta-date {
			font-size: 15px;
			font-weight: normal;
			font-style: normal;
			font-stretch: normal;
			line-height: 1.4;
			letter-spacing: normal;
		}
	}

	.comment-meta-footer {
		margin-top: 25px;
		a {
			color: inherit;
			margin-right: 15px;
			&:last-child {
				margin-right: 0;
			}
			i {
				margin-right: 5px;
			}
			&:hover {
				text-decoration: none;
			}
		}
	}


	.comment-respond {
		margin-top: 90px;
	}

	.comment-form {
		&:after {
			content: '';
			clear: both;
			display: block;
		}
		a {
			color: inherit;
			&:hover,
			&:focus,
			&:active {
				text-decoration: none;
			}
		}
	}

	.comment-form-comment,
	.comment-form-author,
	.comment-form-email {
		float: left;
		width: 100%;
		margin-bottom: 30px;
		font-size: 0;
		label {
			display: none;
		}
		textarea,
		input {
			width: 100%;
		}
	}

	textarea {
		height: 170px;
	}

	.comment-form-author,
	.comment-form-email {
		width: 50%;

	}
	.comment-form-email {
		padding-left: 10px;
	}

	.comment-form-author {
		padding-right: 10px;
	}

	.form-submit {
		float: left;
		width: 100%;
		margin-bottom: 0;
		margin-top: 10px;
	}
}

@media (max-width: 1199px) {
	.gf-comments-area {
		.comment-body {
			.avatar {
				width: 60px;
				height: 60px;
				+ .comment-text {
					padding-left: 90px;
				}
			}
		}

		.comment-list {
			li.comment {
				margin-bottom: 30px;
				padding-bottom: 30px;
			}
			.children {
				margin: 30px 0 0 0;
				padding-top: 30px;
				padding-left: 90px;
				li.comment:last-child {
					margin-bottom: 0;
					padding: 0;
				}
			}
		}

		.children .comment-body .avatar {
			width: 40px;
			height: 40px;
			+ .comment-text {
				padding-left: 60px;
			}
		}

		.children .children {
			padding-left: 60px;
		}
	}
}

@media (max-width: 767px) {
	.gf-comments-area {
		.comment-body {
			.avatar {
				width: 50px;
				height: 50px;
				+ .comment-text {
					padding-left: 70px;
				}
			}
		}

		.comment-list {
			.children {
				padding-left: 2em;
			}
		}

		.children .comment-body .avatar {
			width: 30px;
			height: 30px;
			+ .comment-text {
				padding-left: 45px;
			}
		}
	}
}