.comment-content a {
	word-wrap: break-word;
}
.bypostauthor {
	display: block;
}

.comments-area{
    .comments-title{
        text-align: center;
        padding: 20px 0;
    }
    h3{
        text-align: center;
    }
    .comment-list{
        padding: 0 0 50px 0;
        margin: 0;
        list-style: none;
        li{
            .comment-body{
                margin-top: 30px;
                background-color: #f8f8f9;
                position: relative;
                box-sizing: border-box;
                padding: 30px 30px 15px 120px;
                .comment-meta{
                    img{
                        border-radius: 50%;
                        float: left;
                        margin-left: -80px;
                        width: 60px;
                        height: 60px;
                    }
                    b{
                        display: block;
                        a{
                            color: #3b3f4a;
                            &:hover{
                                color: $color__skin-main-theme;
                            }
                        }
                    }
                    .says{
                        display: none;
                    }
                    .comment-metadata{
                        font-size: 0.8rem;
                    }
                }
                .reply{
                    text-align: right;
                    margin-bottom: 10px;
                    a{
                        color: #3b3f4a;
                        font-weight: bold;
                        font-size: 0.8rem;
                        &:before{
                            content: '\f112';
                            padding-right: 5px;
                            font-family:FontAwesome;
                        }
                        &:hover{
                            color: $color__skin-main-theme;
                        }
                    }
                }
                @media all and (max-width: 400px) {
                    padding: 20px;
                    text-align: center;
                    img{
                        float: none !important;
                        margin: 0 auto 20px auto !important;
                        display: block;
                    }
                }
            }
            &:first-child{
                .comment-body{
                    margin: 0;
                }
            }
            .children{
                margin-left: 5%;
                list-style: none;
                li{
                    .comment-body{
                        margin-top: 20px;
                    }
                }
                @media all and (max-width: $media-2) {
                    margin-left: 15px;
                    padding-left: 0;
                }
                @media all and (max-width: 400px) {
                    margin-left: 0;
                }
            }
        }
    }
    .comment-reply-title{
        text-align: center;
        small{
            display: block;
            a{
                position: relative;
                &:before {
                    display: block;
                    position: absolute;
                    top: 25%;
                    right: -20px;
                    width: 10px;
                    font: normal normal normal 10px/1 FontAwesome;
                    content: "\f00d";
                }
            }
        }
    }
}
