/*
 - Comment
 - Form
 */
.comment .user-picture,
form.comment-form {
  background-color: #f5f5f5;
  border: 1px solid #ededed;
  -webkit-box-shadow: 3px 3px 7px rgba(200, 200, 200, 0.5);
  -moz-box-shadow: 3px 3px 7px rgba(200, 200, 200, 0.5);
  box-shadow: 3px 3px 7px rgba(200, 200, 200, 0.5);
}
.comment-form label {
  font-weight: 700;
}
.comment-form label.option {
  font-weight: 400;
}
.comment-form .form-wrapper,
.comment-form .form-type-item {
  margin-bottom: 2em;
}
.comment-form .filter-wrapper {
  background-color: #fff;
  border-color: #ccc;
}
.comment-form .edit-field-rating {
  margin-bottom: 0.8em;
}
.comment-form .edit-field-rating + .form-wrapper {
  margin-top: 1.2em;
}
.comment-form .edit-field-rating + .edit-field-rating {
  margin-top: 0;
}
.comment-form .edit-field-rating .form-item {
  margin-bottom: 0;
}

/********************************
 * Comment
********************************/
.indented {
  padding-left: 20px;
}
.comment {
  margin-bottom: 18px;
}

.comment + .comment-form {
	margin-top: 30px;
}

.comment {
  position: relative;
  border-bottom: 1px solid #d0d0d0;
  padding-bottom: 1em;
  margin-bottom: 2em;
}
.comment header h3 {
  float: left;
  margin-right: 9px;
  font-size: 1.2em;
  font-weight: 700;
  line-height: 1.5em;
}
.comment header .field-name-field-rating {
  float: left;
}
.comment header .field-name-field-rating .field-items {
  margin-left: 0;
}
.comment header .field-name-field-rating .fa-star {
  font-size: 1.4em;
}
.comment header .comment-submitted {
  float: right;
  color: #999;
  line-height: 2em;
}
.comment header .new,
.comment header .unpublished {
  position: absolute;
  right: 0;
  top: -12px;
  color: red;
  font-size: 11px;
  font-style: normal;
}
.comment .user-picture {
  max-width: 100px;
  float: left;
}
.comment .user-picture + div {
  margin-left: 110px;
}
.comment .field-name-comment-body {
  font-size: 1.1em;
  line-height: 1.5em;
  word-break: break-word;
  margin-bottom: .5em;
}
.comment > div > .field > .field-label {
  display: none;
}
.comment > div > .field.field-name-field-virtual-product-usage > .field-label,
.comment > div > .field.field-name-field-rating > .field-label {
  display: block;
  float: left;
  font-size: 0.9em;
}
.comment > div > .field.field-name-field-virtual-product-usage > .field-label {
  font-weight: 700;
}
.comment .field-name-field-rating .field-items {
  margin-left: 160px;
}
.comment-links ul {
  margin: 0;
  overflow: hidden;
}
.comment-links li {
  float: left;
  list-style: none;
}
.comment-links li a,
.comment_forbidden span {
  display: block;
  padding: 4px 9px;
  margin-left: -1px;
  *zoom: 1;
  background-color: #fff;
  font-size: 1.1em;
  border-bottom: 2px solid transparent;
}
.comment-links li a:hover,
.comment-links li a:focus {
  border-color: #008acc;
}
.comment-links li a:before,
.comment_forbidden span:before {
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  line-height: 1;
  font-size: inherit;
  margin-right: 10px;
}
.comment-links .comment-reply a:before,
.comment_forbidden .comment-reply span:before {
  content: "\f3e5";
}
.comment-links .comment-edit a:before,
.comment_forbidden .comment-edit span:before {
  content: "\f044";
}
.comment-links .comment-delete a:before,
.comment_forbidden .comment-delete span:before {
  content: "\f00d";
}

.comment_forbidden span > a {
  display: inline;
  padding: 0;
  margin-left: 0;
  background-color: transparent;
  border: 0;
  font-size: inherit;
}

.front-node-list .comments_icon,
.vlt-article-comments .comments_icon {
  float: left;
  width: 18px;
  height: 17px;
  background: url(/profiles/voltimum/themes/voltimum2/images/icon-comment-18.png) no-repeat 0 0;
  margin: 3px 7px 5px 0;
}

.front-node-list .comments_num,
.front-node-list .comments_label,
.vlt-article-comments .comments_num,
.vlt-article-comments .comments_label,
.vlt-article-comments .comments_be_first {
  float: left;
  color: #555555;
}

/********************************
 * Form
 ********************************/

form.comment-form {
  position: relative;
  padding: 13px 18px 0 18px;
}

.comment-reply-cancel {
  position: absolute;
  right: -1px;
  top: -45px;
}

@media all and (max-width:959px) {
  form.comment-form-reply {
    padding-bottom: 26px;
  }
  
  form.comment-form .form-item .username {
    margin-left: 0;
    padding-top: 0;
  }
}

@media all and (max-width: 414px) {
  .comment .user-picture {
    margin-right: 10px;
    margin-bottom: 5px;
  }
  .comment .user-picture + div {
    margin-left: 0;
  }
}