@charset "utf-8";

.comment-bubble {
	position: relative;
	background: #fff;
	border: 1px solid #ddd;
	border-radius: 6px;
	margin-left:15px;
}
.comment-bubble:after, 
.comment-bubble:before {
	right: 100%;
	top: 30px;
	border: solid transparent;
	content: "";
	height: 0;
	width: 0;
	border-left: 0;
	border-top: 0;
	position: absolute;
	pointer-events: none;
}
.comment-bubble:after {
	border-color: rgba(255, 255, 255, 0);
	border-right-color: #fff;
	border-width: 15px;
	margin-top: -15px;
}
.comment-bubble:before {
	border-color: rgba(221, 221, 221, 0);
	border-right-color: #ddd;
	border-width: 17px;
	margin-top: -16px;
}

.post-writer .comment-bubble {
	border: 1px solid #f6cece;
}
.post-writer .comment-bubble:before {
	border-right-color: #f6cece;
}

.comment-header {
	padding-left:15px;
}
.comment-photo img {
	width:60px;
	height:60px;
	border-radius: 50%;
}
.comment-photo-hide .profile_img {
	display:none;
}
.comment-depth-0 {
	margin-left:0;
}
.comment-depth-1 {
	margin-left:20px;
}
.comment-depth-2 {
	margin-left:40px;
}
.comment-depth-3 {
	margin-left:60px;
}
.comment-depth-4 {
	margin-left:80px;
}
.comment-depth-5 {
	margin-left:100px;
}

@media all and (max-width:767px) {
	.responsive .comment-depth-1 {
		margin-left:15px;
	}
	.responsive .comment-depth-2 {
		margin-left:30px;
	}
	.responsive .comment-depth-3 {
		margin-left:45px;
	}
	.responsive .comment-depth-4 {
		margin-left:60px;
	}
	.responsive	.comment-depth-5 {
		margin-left:75px;
	}
}