.comments-area { max-width: 1140px; margin: 0 auto; padding: 2em 10%; background-color: $color__background-content; border: 1px solid rgba(197, 197, 197, 0.41); border-top: none!important; } .comment-respond { padding: 20px 0; margin-bottom: 20px; } .commentlist { padding: 0; margin: 0; } .commentlist, .commentlist ul { list-style: none; width: 100%; } .commentlist .children { padding-left: 90px; margin: 0; } .comment-content a { word-wrap: break-word; } .comment-content { margin-left: 90px; border-bottom: 1px solid $color__text-ultralight; margin-bottom: 4em; } .comment-reply a { color: $color__active; } .comment em { font-size: .7em; } .bypostauthor { display: block; } .comment-notes { font-size: .8em; } .comment-author img { max-width: 70px; width: auto; height: auto; float: left; margin-right: 20px; } .comment-author a { text-decoration: none; font-weight: 700; } .comment-date { position: relative; font-size: .8em; margin: 0 2em; color: $color__text-light; font-style: italic; } .comment-date::before, .comment-reply::before { content: ''; position: absolute; display: block; left: -1em; top: calc(50% - 2px); width: 5px; height: 5px; border-radius: 50%; background: $color__text-light; } .comment-reply::before { top: 50%; } .comment-reply { position: relative; } .comment-reply-link { text-decoration: none; font-size: .8em; } .comment-reply-link::after { content: '\f101'; font-family: fontAwesome; vertical-align: middle; padding-left: 2px; } .comment-content p { margin-top: 0.5em; font-size: .9em; padding: 0 2em; } .comment-form { position: relative; } .comment-form input:not(.button) { padding: 6px; max-width: 100%; width: 100%; height: 3em; line-height: 2em; margin-bottom: 30px; font-size: .9em; } .comment-form textarea { font-size: .9em; } .form-submit { text-align: right; } .form-submit .submit { /* max-width: 160px; */ } .form-allowed-tags { font-size: .8em; } #comment-status { font-size: .8em; } .comment-error { text-transform: capitalize; color: red; }