Bonar Gati

.comment-segment {
margin-top: 10px;
margin-right: 10px;
}
.comment-level-0 {
margin-left: 10px;
}
.comment-level-1 {
margin-left: 25px;
}
.comment-level-2 {
margin-left: 40px;
}
.comment-level-3 {
margin-left: 55px;
}
.comment-level-gt3 {
margin-left: 70px;
}
.blog-author-comment {
background-color: #F0F0BE;
border: 1px solid #FFFF99;
}
.blog-nonauthor-comment {
background-color: #B4C8F0;
border: 1px solid #7296E2;
}
.deleted-comment {
color: gray; font-STYLE: italic
}
.delete-comment-icon {
background: url("http://www.blogblog.com/rounders3/icon_delete13.gif")
no-repeat;
}
.comment-time {
font-size: 80%;
margin: inherit;
padding-left: 10px;
padding-bottom: 10px;
}
.reply-guide {
background-color: #FFFFFF;
border: #076a93 1px dotted;
display: none;
padding-right: 10px;
padding-left: 10px;
padding-bottom: 0.75em;
padding-top: 5px;
margin-right: 10px;
margin-bottom: 10px;
}
.reply-guide-header {
color: #076a93;
padding-top: 10px;
}
.reply-guide-list {
list-style: none;
padding-left: 2px;
margin-left: 2px;
}
.reply-guide-example {
font-size: 85%;
margin-right: 5px;
margin-bottom: 10px;
float: right;
border: 1px dotted #076a93;
padding: 5 5 5 5;
}

<b:includable id='comments' var='post'>
<div class='comments' id='comments'>
<a name='comments'/>
<b:if cond='data:post.allowComments'>
<h4>
<b:if cond='data:post.numComments == 1'> 1 <data:commentLabel/>:
<b:else/><data:post.numComments/><data:commentLabelPlural/>:
</b:if>
</h4>

<b:if cond='data:post.numComments > 0'>
<!-- Include a post comment link before rendering the comments -->
<p class='comment-footer'>
<b:if cond='data:post.embedCommentForm'>
<b:include data='post' name='comment-form'/>
<b:else/>
<b:if cond='data:post.allowComments'>
<a expr:href='data:post.addCommentUrl'
expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
</b:if>
</b:if>
</p>
</b:if>

<!-- Loop through the comments adding the comment bodies in a hidden div -->
<b:loop values='data:post.comments' var='comment'>
<div style="display: none;" expr:id='"comment-body-" + data:comment.id' >
<data:comment.body/>
</div>
</b:loop>
<!-- Now create the comment using our javascript -->
<script type="text/javascript">
// USE THIS if YOU Have multiple Authors adding them in a comma separated form after removing the '//' from the next line
// var BLOG_AUTHORS = ['http://www.blogger.com/profile/firstauthor', 'http://www.blogger.com/profile/secondauthor', 'http://www.blogger.com/profile/thirdauthor'];
// Use this if you have just one author like this blog :)
var BLOG_AUTHOR = 'http://www.blogger.com/profile/10301627897367423203';
var BLOG_POST_COMMENT_LINK = '<data:post.addCommentUrl/>';

var eCommentDelete = false;
var eAuthorUrl = '';
<b:loop values='data:post.comments' var='comment'>
eCommentDelete = false;
eAuthorUrl = '';
<b:if cond='data:comment.authorUrl'>
eAuthorUrl = "<data:comment.authorUrl/>";
</b:if>
<b:if cond='data:comment.isDeleted'>
eCommentDelete = true;
</b:if>

buildComment("<data:comment.author/>", eAuthorUrl,
"<data:comment.id/>", "<data:comment.timestamp/>", eCommentDelete,
"<data:comment.deleteUrl/>", "<data:top.deleteCommentMsg/>",
document.getElementById('comment-body-<data:comment.id/>').innerHTML);
</b:loop>
// <![CDATA[
var eCommentTemplate = '' +
'<div class="comment-segment comment-level-${COMMENT.LEVEL} ${BLOG.AUTHOR} ${COMMENT.DELETED.STYLE}" >' + 'n' +
' <a name="comment-${COMMENT.ID}"></a>' + 'n' +
' <span style="float: right; margin-right: 5px; " >' + 'n' +
' <a href="#" ' + 'n' +
' onclick="toggleElementDisplays(this, ' +
'['comment-${COMMENT.ID}-body', 'comment-${COMMENT.ID}-footer', 'reply-guide-${COMMENT.ID}'], ' +
'['both', 'both', 'hide']); return false;" >[hide]</a>' + 'n' +
' </span>' + 'n' +
' <span class="comment-author" >' +
'${COMMENT.AUTHOR.URL.EXISTS.START}' +
'<a href="${COMMENT.AUTHOR.URL}" rel="nofollow">' +
'${COMMENT.AUTHOR.URL.EXISTS.END}' +
'${COMMENT.AUTHOR.NAME}' +
'${COMMENT.AUTHOR.URL.EXISTS.START}' +
'</a>' +
'${COMMENT.AUTHOR.URL.EXISTS.END}</span>' + 'n' +
' said... ' + 'n' +
' <div id="comment-${COMMENT.ID}-body" class="comment-body" ><p>${COMMENT.BODY}</p></div>' + 'n' +
' <span class="comment-time">on ${COMMENT.TIMESTAMP}</span>' + 'n' +
' <div id="reply-guide-${COMMENT.ID}" class="reply-guide comment-level-0 " >' + 'n' +
' <span style="float: right;" ><a href="#" onclick="hideElement('reply-guide-${COMMENT.ID}'); return false;" >[hide]</a></span>' + 'n' +
' <h4 class="reply-guide-header">How to Reply to this comment</h4>' + 'n' +
' <span>' + 'n' +
' To reply to this comment please ensure that <b>one</b> of the following lines: ' + 'n' +
' <ul class="reply-guide-list">' + 'n' +
'<li>@${COMMENT.ID}</li>' + 'n' +
'<li>@${COMMENT.AUTHOR.NAME}</li>' + 'n' +
' </ul>' + 'n' +
' is the <b>first line</b> of your comment. ' + 'n' +
' <br />' + 'n' +
' <a href="${BLOG.POST.COMMENT.LINK}"' + 'n' +
' >Click here to enter your reply</a>' + 'n' +
' </span>' + 'n' +
' </div>' + 'n' +
' <div id="comment-${COMMENT.ID}-footer" class="comment-footer">' + 'n' +
' <span><a ' +
'href="#" onclick="showElement('reply-guide-${COMMENT.ID}'); return false;" >Reply</a></span> ' + 'n' +
' <span><a href="#comment-${COMMENT.ID}">Permalink</a></span> ' + 'n' +
' <span><a href="${COMMENT.DELETE.URL}" title="${COMMENT.DELETE.TEXT}" style="text-decoration: none;" ><span class="delete-comment-icon"> </span></a></span>' + 'n' +
' </div>' + 'n' +
'</div>' + 'n';

applyCommentTemplate(eCommentTemplate);
// ]]>
</script>
<p class='comment-footer'>
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
</p>
</b:if>
<div id='backlinks-container'>
<div expr:id='data:widget.instanceId + "_backlinks-container"'>
<b:if cond='data:post.showBacklinks'>
<b:include data='post' name='backlinks'/>
</b:if>
</div>
</div>
</div>
</b:includable>