<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">

<?if($LEVEL$>=1)?>  
<div class="wid-comm-bc otvet-com">  
  <div class="wid-comm-ava"><a href="$PROFILE_URL$"><?if($USER_AVATAR_URL$)?><img src="$USER_AVATAR_URL$"><?else?><img src="https://www.cominet.ml/noavatar.gif"><?endif?></a></div>  
  <div class="wid-comm-inf">  
  <div class="wid-comm-us"><a href="$PROFILE_URL$">$USERNAME$ </a><?if($MODER_PANEL$)?>$MODER_PANEL$<?endif?></div>  
  <div class="wid-comm-text">  
  $MESSAGE$  
  </div>  
  <div class="wid-comm-fot">  
  <ul>  
  <li><i class="fa fa-calendar" aria-hidden="true"></i> $DATE$</li>  
  <?if($IS_OWN$)?><?else?><li><a href="$ANSWER_URL$"><i class="fa fa-sign-in" aria-hidden="true"></i> Ответить</a></li><?endif?>  
  </ul>  
  <span>  
   
<?if($BAD_COMMENT_URL$)?><a href="$BAD_COMMENT_URL$"><i class="fa fa-thumbs-down" aria-hidden="true"></i></a><?endif?>  
<?if($COMMENT_RATING$<0)?><b style="color:#FF2828;">$COMMENT_RATING$ <i class="fa fa-star" aria-hidden="true"></i></b><?else?>  
<?if($COMMENT_RATING$=0)?><b class="c_ziro">0</b><?else?><b class="c_plus">$COMMENT_RATING$ <i class="fa fa-star" aria-hidden="true"></i></b><?endif?><?endif?>  
<?if($GOOD_COMMENT_URL$)?><a href="$GOOD_COMMENT_URL$"><i class="fa fa-thumbs-up" aria-hidden="true"></i></a><?endif?>  
  </span>  
  <div id="clr"></div>  
  </div>  
  <div class="wid-comm-soc"></div>  
   
  </div>  
</div>  

<?else?>  

<div class="wid-comm-bc">  
  <div class="wid-comm-ava"><a href="$PROFILE_URL$"><?if($USER_AVATAR_URL$)?><img src="$USER_AVATAR_URL$"><?else?><img src="https://www.cominet.ml/noavatar.gif"><?endif?></a></div>  
  <div class="wid-comm-inf">  
  <div class="wid-comm-us"><a href="$PROFILE_URL$"><i class="fa fa-pencil-square-o" aria-hidden="true"></i> $USERNAME$ </a><span style="<?if($COMMENT_RATING$<0)?>color:#FF2828;<?endif?>">$COMMENT_RATING$ <i class="fa fa-star" aria-hidden="true"></i></span><?if($MODER_PANEL$)?>$MODER_PANEL$<?endif?></div>  
  <div class="wid-comm-text">  
  $MESSAGE$
  </div>  
  <div class="wid-comm-fot">  
  <ul>  
  <li><i class="fa fa-calendar" aria-hidden="true"></i> <font style="font-size:12px;">$DATE$</font></li>  
  <li><a href="javascript://" onclick="$('.wid-comm-soc$NUMBER$').slideToggle('slow');"> <i class="fa fa-random" aria-hidden="true"></i> Поделится</a> </li>  
  <?if($IS_OWN$)?><?else?><li> <a href="$ANSWER_URL$"><i class="fa fa-comments" aria-hidden="true"></i> Комментировать</a></li><?endif?>  
  </ul>  
  <span>  
<?if($BAD_COMMENT_URL$)?><a href="$BAD_COMMENT_URL$"><font style="font-size:17px;"><font color="red"><i class="fa fa-thumbs-down" aria-hidden="true"></i></font></font></a><?endif?>
   
<?if($GOOD_COMMENT_URL$)?><a href="$GOOD_COMMENT_URL$"><font style="font-size:17px;"><font color="#18741a"><i class="fa fa-thumbs-up" aria-hidden="true"></i></font></font></a><?endif?>
  </span>  
  <div id="clr"></div>  
  </div>  
  <div class="wid-comm-soc wid-comm-soc$NUMBER$">  
  <!-- uSocial --><br><script src="//yastatic.net/es5-shims/0.0.2/es5-shims.min.js"></script>
<script src="//yastatic.net/share2/share.js"></script>
<div class="ya-share2" data-services="vkontakte,facebook,odnoklassniki,moimir,gplus,twitter,lj" data-size="s"></div><!-- /uSocial -->  
  </div>  
  </div>  
</div>  
<?endif?>  
</div>

#clr {clear: both;}  
.wid-comm-bc {  
  background: #FFFFFF;  
  border-top: 1px solid #D8D8D8;  
  padding: 15px;  
  overflow: hidden;  
  position: relative;  
  margin-top: 0px;  
}  

.wid-comm-ava {  
  width: 60px;  
  height: 60px;  
  float: left;  
  overflow: hidden;  
  background: #FFF;  
}  
.wid-comm-ava img {  
  width: 50px;  
  height: 50px;  
  object-fit: cover;  
  border-radius: 50px;
  border: 3px solid #CACACA;
}  

.wid-comm-inf {  
  margin-left: 70px;  
}  

.wid-comm-us a {  
  font-size: 15px;  
  color: #6A6D72;  
  font-weight: 700;  
}  

.wid-comm-us span {  
  float: right;  
  color: #50B780;  
  font-size: 18px;  
}  

.wid-comm-text {  
  color: #6A6D72;  
  font-size: 12px;  
  line-height: 22px;  
  font-weight: 100;  
}  

.wid-comm-fot {  
  padding: 0px 0;  
}  
.wid-comm-fot ul {  
  list-style: none;  
  padding: 0px;  
}  
.wid-comm-fot ul li {  
  float: left;  
}  

.wid-comm-fot ul li a {  
  padding: 7px 10px;  
  font-size: 12px;  
  color: #626669;  
}  
.wid-comm-fot ul li a:hover {  
  color: #85A5B2;  
}  

.wid-comm-fot span {  
  float: right;  
  color: #878787!important;  
}  
.wid-comm-fot span i {margin: 0px 10px;}  

.otvet-com {  
  border-top: 1px solid #D7D7D7;  
  margin-top: 0px;  
  margin-left: 50px;  
}  

.wid-comm-soc {  
  display: none;  
}