.comments-area {
  margin: 0px 1%;
}
.response-count-number,
.response-count-text{
  color: #444;
  
}
.current_post_title {
  color: #4f4f4f;
  align-self: flex-end;
}
.comments-title span {
  display: flex;
  margin: auto 5px;
  align-items: center;
}
.main-comments-title-holder {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.comment-list{
  border-top: 1px solid #d7d7d7;
  padding-top:20px;
  margin-top: 20px;
}
.comments-title {
  color: #484848;
  display: flex;
  /*! border-bottom: 5px solid #d7d7d7; */
  font-weight: normal;
  font-style: italic;
  font-size: 18px;
  padding: 5px 0px;
  text-transform: capitalize;
}
.response-count-number svg {
  width: 20px !important;
  height: 20px !important;
  display: inline-block;
}
.comment {
  /*! margin: 10px 0px; */
  position: relative;
}
.depth-2,
.depth-3,
.depth-4,
.depth-5{
  margin-left:3%;
}
.comment-inner-wrap {
  flex-grow: 5;
  position: relative;
  flex-basis: 80%;
}
.comment-edit-wrap {
  /*! width: 100%; */
  margin-left: 55px;
}
.comment-attachment-btn-wrap {
  width: 30px;
  height: 18px;
  border-radius: 4px;
  border: 1px solid white;
  position: absolute;
  right: 23px;
  top: 1px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #fff;
  font-size: 14px !important;
  padding-right: 3px;
  padding-bottom: 2px;
  /*! border: 1px solid #dfdfdf; */
  height: 22px;
  background-color: #34a5c8;
}

.comment-attachment-btn-wrap svg {
  height: 18px !important;
  width: 16px !important;
  fill: white !important;
}
.comment-attachment-btn-wrap svg .attachment-st0 {
  fill: none !important;
  stroke: white !important;
  stroke-width: 80 !important;
}
.comment-attachment-btn-wrap:hover {
border: 1px solid grey;
  background-color: #b0e0e8;
}
.comment-number-sytem {
  width: 20px;
  height: 20px;
  border-radius: 4px;
  border: 1px solid #00aeca;
  position: absolute;
  right: 2px;
  top: 2px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #34a5c8;
  color: white;
  font-size: 14px !important;
}
.voting-block {
  border: 1px solid #f0f0f000;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 4px;
  height: fit-content;
  /*! padding: 5px 8px; */
  flex-wrap: wrap;
  /*! border-top-right-radius: 0px; */
  /*! border-bottom-right-radius: 0px; */
  /*! box-shadow: 0px 0px 3px 0px #8080807d; */
  width: fit-content;
  flex-direction: column;
  width: fit-content;
}
.voting-block:hover {
  border: 1px solid #52b1ce94;
}
  .overall-vote-count {
    color: #535353;
    /*! padding-top: 10px; */
    /*! padding-bottom: 15px; */
    /*! font-weight: bold; */
    font-size: 13px;
    text-align: center;
    cursor: default;
    display: flex;
    align-items: center;
    height: 16px;
    justify-content: center;
    line-height: 16px;
  }
  .vote-icon-class{
    cursor: pointer;
    fill: #62626252;
  }
  .vote-icon-class:hover{
    fill:  #4d4d4dd1 !important;
  }
  .down-vote {
    width: fit-content;
    overflow: hidden;
    height: fit-content;
    /*! border: 1px solid #eee; */
    border-radius: 4px;
    padding: 0px 5px;
  }
  .up-vote {
    width: fit-content;
    overflow: hidden;
    height: 20px;
    /*! border: 1px solid #eee; */
    border-radius: 4px;
    padding: 0px 5px;
  }
  .voting-block-button svg {
    width: 20px !important;
    height: 20px !important;
  }
  .vote-indicating-class svg .vote-icon-class{
    fill: rgba(37, 135, 240, 0.73);
  }
  .comment-voting-stystem {
    flex-shrink: 5;
    /*! flex-grow: 1; */
    max-width: 40px;
    justify-content: center;
    display: flex;
    /*! min-width: 40px; */
    /*! padding-right: 5px; */
    position: absolute;
    left: 18px;
    top: 60px;
    z-index: 1;
  }
  .media-body {
    display: flex;
    padding: 5px;
    border: 1px solid #bbb;
    border-radius: 4px;
    box-shadow: 0px 0px 5px 0px #a2a2a2;
    flex-wrap: wrap;
    position: relative;
    margin: 5px auto;
  }
.has_children::before {
  border-left: 2px solid #c8c8c8;
  border-bottom: 2px solid #c8c8c8;
  border-bottom-left-radius: 10px;
  width: 28px;
  position: absolute;
  content: '';
  bottom: -32px;
  height: 30px;
  left: 11px;
  z-index: -1;
}
  .media-body-comment-approved-shade-green{
    background-color: #00ff8721;
  }
  .media-body-comment-reported-shade-red{
    background-color: #ff00000f;
  }
  .approve-comment {
    /*! display: inline-flex; */
    /*! margin: 0px 2px; */
    /*! border: 1px solid #168da84f; */
    /*! border-radius: 4px; */
    /*! padding: 3px; */
    /*! font-style: italic; */
    /*! color: #797979; */
    /*! cursor: pointer; */
    /*! background-color: white; */
    /*! font-size: 12px; */
    /*! height: 24px; */
    /*! width: 83px; */
    /*! justify-content: center; */
  }
  .comment-approved {
    /*! border: 1px solid #16a8344f; */
    color: #d20000;
    background-color: #f2c5c5;
  }
  .comment-approved-not-discussion-author{
    color: #fff;
    background-color: #03b090;
  }
  .comment-approve-text{
    padding: 0px 5px;
  }
  .report-comment {
    display: inline-flex;
    margin: 0px 10px;
    /*! border: 1px solid #168da84f; */
    border-radius: 4px;
    padding: 0px 4px;
    font-style: italic;
    color: #797979;
    cursor: pointer;
    /*! background-color: white; */
    align-items: center;
    font-size: 11px;
    height: 24px;
    width: fit-content;
    /*! min-width: 89px; */
    justify-content: center;
  }
  .report-disabled,
  .approve-disabled{
    background-color: rgb(239, 239, 239) !important;
    color: white !important;
  }
  .comment-reported{
    border: 1px solid #16a8344f;
    color: #d20000;
    background-color: #f2c5c5;
  }
  .comment-reported-not-discussion-author{
    color: red;
    background-color: #ffe0e0;
    border: 1px solid #ff000078;
  }
  .comment-report-text{
    padding: 0px 5px;
    display: none;
  }
  .reply-to-wrap-button{
    display: inline-flex;
    /*! min-width: 89px; */
    margin: 0px 2px;
    /*! border: 1px solid #168da84f; */
    border-radius: 4px;
    padding: 0px 5px;
    font-style: italic;
    color: #797979;
    cursor: pointer;
    /*! background-color: white; */
    justify-content: center;
    align-items: center;
    height: 24px;
  }
  .reply-to-wrap-button:hover{
    color: #fff;
    background-color: #b4e6ff !important;;
    border: 1px solid #07d1ff4f;
  }
  .reply-to-wrap-button:hover a{
    color: white;
  }
  .approve-comment:hover {
    color: #fff;
    background-color:#b4e6ff;
  border: 1px solid #07d1ff4f;
  }  
  .comment-reply-link {
    display: block;
    text-decoration: none;
    width: fit-content;
    color: #797979;
  }
  
::first-letter {
  text-transform: uppercase;

}
::first-letter {
  text-transform: uppercase;

}
.comment-reply-login {
  display: block;
  text-decoration: none;
  min-width: fit-content;
  font-size: 10px;
  /*! line-height: 11px; */
  color: #3a8fc1;
  width: fit-content;
  text-wrap: nowrap;
}
  .list-inline {
    padding: 0px 0px;
    display: flex;
    justify-content: space-between;
    /*! border-bottom: 1px dotted #8080804f; */
    margin-left: 0px;
    font-size: 13px;
    align-items: center;
    min-height: 43px;
    /*! border-top: 1px solid #f0f0f0; */
    /*! background-color: #ececec; */
    flex-wrap: wrap;
    margin-left: 60px;
  }
  .comment-author-name-online-status-indicator {
    display: flex;
    /*! width: 100%; */
    justify-content: left;
    align-items: center;
    background-color: white;
    border-radius: 15px;
    padding: 0px 10px;
    background-color: #e8e8e8;
  }
.comment-author-information {
  flex-grow: 1;
}
.time-post-link {
  text-decoration: none;
  font-size: 11px !important;
  position: absolute;
  right: 0px;
  top: 29px;
}
  .profile-pic-name-online-status {
    display: flex;
    /*! border: 1px solid #00000038; */
    padding: 2px 5px;
    border-radius: 4px;
    align-items: center;
    margin-top: 9px;
  }
  .comment-author-online-status-indicator {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    display: inline-block;
    left: 5px;
  }
  .user-is-offline{
      background-color: #ffffff7a;
      box-shadow: 0px 0px 5px #adadad;
  }
  .user-is-online{
    background-color: #03cca6;
  }
  .comment-text-and-attachment {
    display: flex;
    flex-wrap: wrap;
    align-items: start;
    margin-left: 59px;
    border-top: 1px solid #dfdfdf;
  }
  .comment-content {
    padding: 10px 0px;
    /*! background-color: #8080800a; */
    /*! margin: 0px 5px; */
    /*! border: 1px solid #168da81a; */
    /*! border-radius: 4px; */
    font-size: 13px;
    flex-grow: 1;
    /*! padding-left: 5px; */
    /*! margin-left: 55px; */
  }
  .comment-media-attachment {
    display: none;
    width: 100%;
    height: fit-content;
    max-height: 75vw;
    background-color: #000000;
    overflow-y: auto;
    text-align: center;
  }
  .delete-comment-image-attachment {
    position: absolute;
    background-color: white;
    padding: 5px;
    border-radius: 4px;
    margin: 5px;
    border: 1px solid #797979;
    padding-right: 9px;
  }
  .delete-comment-image-attachment:hover .delete-st0{
    fill:rgb(255, 0, 85);
  }
  .delete-comment-image-attachment:hover{
    border: 1px solid rgb(255, 0, 85);
  }
.comment-attachment_photo {
  display: inline-block;
  object-fit: cover;
  height: auto;
  width: 100%;
}
  .comment-metadata {
    display: flex;
    justify-content: left;
    align-items: center;
    flex-wrap: wrap;
    /*background-color: #4d4d4dd1;*/
    /*! border-bottom: 1px solid #fbfbfb; */
    /*! background-color: #ececec; */
    color: #171717 !important;
  }
  .comment-metadata a time {
    text-decoration: none;
    color: #7d7d7d;
    font-size: 11px;
    align-self: end;
    padding: 0px 3px;
    font-style: italic;
  }
  .media-left {
    /*! border: 1px solid #00000038; */
    margin: 0px 5px;
  }
  .media-object svg {
    border-radius: 50% !important;
    width: 40px !important;
    height: 40px !important;
  }
  .comment-author-profile-photo {
    width: 48px;
    height: 48px;
    object-fit: cover;
    border-radius: 50%;
    border: 1px solid #eeeeee2e;
  }
  .avatar {
    object-fit: cover;
    border-radius: 50%;
    border: 1px solid gray;
    width: 48px;
    height: 48px;
  }
  .comment-author-name {
    margin: 0px 5px;
    font-size: 13px !important;;
    color: #34a5c8;
    padding: 0px;
    display: inline-block;
    cursor: pointer;
  }

  
.reply-to-box {
  /*! border-bottom: 1px dotted #80808096; */
  display: flex;
  align-items: center;
  margin-left: 59px;
  background-color: #fafafa;
}
.reply-to {
  color: grey;
  font-size: 12px !important;
  font-style: italic;
  font-size: 11px !important;
  /*! display: none; */
  content: "";
}
.reply-to-target {
  display: flex;
  align-items: center;
}
.reply-to-target .avatar,
.reply-to-target .reply-to-image {
  border-radius: 50%;
  width: 30px !important;
  height: 29px !important;
  border: 1px solid grey;
  margin: 2px 5px !important;
}
.reply-to-name {
  font-size: 11px;
  color: grey;
  font-style: italic;
}
#respond {
  box-shadow: 0px 0px 10px 0px #8e8e8e;
}
.reported-response-msg {
  color: red;
  text-align: center;
  background-color: white;
  font-style: italic;
  font-size: 13px !important;
  width: 100%;
  /*! margin-left: 5%; */
}

  .child-comments-wrap-default{
    display: none;
  }
  .toggle-children {
    /*! border-left: 1px dotted black; */
    /*! border-bottom: 1px dotted black; */
    /*! border-bottom-left-radius: 10px; */
    /*! width: 25px; */
    /*! position: relative; */
    margin-bottom: 20px;
    display: flex;
    justify-content: unset;
    /*! top: 3px; */
    padding-top: 10px;
    left: 0px;
    padding-left: 40px;
  }
  .inner-button{
    /*! position: absolute; */
    min-width: 100px;
    width: fit-content;
    padding: 0px 10px;
    height: 33px;
    left: 39px;
    display: inline-block;
    top: -5px;
    background-color: #fbfbfb;
    border-radius: 10px;
    border: 1px solid #7c7b7b66;
    cursor: pointer;
  }
.inner-button:hover {
  border: 1px solid #2fa9ff;
}
.inner-button:hover span {
  color: #2fa9ff;
}
.replies-text {
  color: grey;
  font-size: 13px;
  font-style: italic;
  padding: 5px 10px;
}

.icon-holder-arrow {
  color: grey;
}
@media screen and (max-width:700px){
  .comment-action-button,
  .comment-action-button,
    .report-comment,
  .edits-left-info,
  .comment-edit_holder{
    margin:2px 2px !important;
  }
}
@media screen and (max-width:400px){

  .media-body {
    border: 1px solid #80808000;
    box-shadow: unset;
    border-top: 1px solid #e7e7e7;
    border-radius: 0px;
  }
  .toggle-children {
    padding-left: 70px;
  }
  .has_children::before {
    border-left: 2px solid #c8c8c8;
    border-bottom: 2px solid #c8c8c8;
    border-bottom-left-radius: 10px;
    width: 28px;
    position: absolute;
    content: '';
    bottom: -32px;
    height: calc(100% - 96px);
    left: 34px;
    z-index: -1;
  }
  .comment-voting-stystem {
    max-width: 100%;
    justify-content: center;
    padding: 1px;
  }
  .voting-block {
    justify-content:space-between;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
    border-top-right-radius: 4px;
    padding: 0px 0px;
  }
}