.comment-container {
  box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
  transition: 0.3s;
  padding: .5em;
  margin-bottom: 10px;
  border-radius: .5em;
}

.comment-container hr {
    margin: .5em 0;
}

.comment-body {
    margin: .5em 0;
}

.comment-footer {
    display: flex;
}

.comment-footer .liked {
    color: rgb(0, 143, 226);
}

.comment-footer .disliked {
    color:rgb(255, 47, 47)
}

.comment-footer{
    color: rgb(160, 160, 160);
}

.comment-footer .icon-like:hover{
    color: rgb(0, 110, 255);
    cursor: pointer;
}

.comment-footer .icon-dislike:hover{
    color: rgb(211, 0, 0);
    cursor: pointer;
}

.comment-footer .icon-reply:hover{
    color: rgb(39, 39, 39);
    cursor: pointer;
}

.comment-footer .left {
    text-align: left;
    font-size: 1em;
    display: flex;
    text-transform: uppercase;
    width: 100%;
    gap: 1em;
}

.comment-footer .right {
    text-align: right;
    color: gray;
    font-size: .8em;
    text-transform: capitalize;
    width: 100%;
}

.comment-pagination ul {
    display: flex;
    gap: .5em
}

.comment-pagination .current {
    color:rgb(114, 206, 255)
}

.reply-form-group {
    width: 100%;
    display: flex;
    flex-direction: row;
    gap: 5px;
}

.reply {
    width: 100%;
    border: solid 1px #eee;
}