/* wrapper */
.bnet-comments { padding:0 20px }
.bnet-comments .comments-loading { padding: 100px; background: url("../images/loaders/uber-loading.gif") 50% 50% no-repeat; }
.bnet-comments .comments-error-gate { text-align: center; padding: 15px; background: #000; border-radius: 5px; }
.bnet-comments .comments-error-gate .ui-button { margin-top: 15px; }
.bnet-comments .comments-error-gate p { margin: 0; }

/* controls */
.bnet-comments .comments-controls { margin: 15px 0; }
.bnet-comments .comments-controls .ui-pagination { float: right; }

/* shared */
.bnet-comments .bnet-username { position:relative }

/* list */
.bnet-comments .comments-pages { margin: 15px 0; }
.bnet-comments .comment-tile { padding: 15px 15px 15px 100px; min-height: 66px; position: relative; background: #000; border-radius: 5px; }
.bnet-comments .comment-tile.comment-buried { padding-left: 15px !important; display: none; min-height: 15px; }
.bnet-comments .comment-tile .karma { float: right; }
.bnet-comments .comment-tile .bnet-avatar { position: absolute; top: 15px; left: 15px; }
.bnet-comments .comment-tile .bnet-avatar .avatar-outer a { display:block; height:64px; width:64px; overflow:hidden }
.bnet-comments .comment-tile .bnet-ratings { float: right; }
.bnet-comments .comment-tile .comment-head { margin-bottom: 5px; color: #5F584D; display:inline-block; white-space:nowrap }

.bnet-comments .comment-tile .comment-head .timestamp { font-size: 11px; margin-left: 10px; }
.bnet-comments .comment-tile .comment-foot { margin-top: 8px; text-align: right; }
.bnet-comments .comment-tile .comment-foot .timestamp { font-size: 11px; }
.bnet-comments .comment-tile .comment-foot .ui-button { margin-left: 6px; visibility: hidden; }
.bnet-comments .comment-tile .comment-options { float: right; font-size: 11px; display: none; }
.bnet-comments .comment-tile:hover .comment-options,
.bnet-comments .comment-tile.tile-hover .comment-options { display: block; }

.bnet-comments .comment-tile:hover .comment-foot .ui-button,
.bnet-comments .comment-tile.tile-hover .comment-foot .ui-button,
.bnet-comments .comment-tile .comment-foot.visible .ui-button,
.bnet-comments .comment-tile:hover .karma .rate-btn,
.bnet-comments .comment-tile.tile-hover .karma .rate-btn { visibility: visible; }
.bnet-comments .comments-list > li { margin: 15px 0; }

/* list - state */
.bnet-comments .comment-buried .comment-tile { display: none; }
.bnet-comments .comment-buried .comment-buried { display: block; }
.bnet-comments .comment-body { word-wrap: break-word; }
.bnet-comments .comment-blizzard .comment-body { color: #00B4FF; }
.bnet-comments .comment-blizzard .comment-head .employee-icon { float:left; margin: 4px 5px 0 0 }
.bnet-comments .comment-mvp .comment-body { color: #81B558; }

/* list - nested */
.bnet-comments .nested-reply,
.bnet-comments .comment-nested { padding-left: 100px; }
.bnet-comments .comment-nested .comment-tile { padding-left: 65px; min-height: 34px; }
.bnet-comments .comment-nested .comment-tile .bnet-avatar .avatar-outer { overflow:hidden }
.bnet-comments .comment-nested .comment-tile .bnet-avatar .avatar-outer a { display:block }
.bnet-comments .comment-nested .comment-tile .bnet-avatar .avatar-outer,
.bnet-comments .comment-nested .comment-tile .bnet-avatar .avatar-outer a,
.bnet-comments .comment-nested .comment-tile .bnet-avatar img { width: 32px; height: 32px; }

/* pulling */
.bnet-comments .comments-pull-link { padding: 5px; text-align: center; display: block; margin: 15px 0; }

/* moderator */
.bnet-comments .moderator-controls { float: right; border:1px solid #222; background-color:#000; padding:5px 10px; white-space:nowrap; }
.bnet-comments .moderator-controls .control-label { display:block; float:left; height:25px; line-height:26px; }
.bnet-comments .moderator-controls .ui-button { margin-left: 5px; }
.bnet-comments .moderator-review { font-size: 12px; float: left; border:1px solid #222; background-color:#000; padding:5px; margin-right: 3px; }

/* rating */
/* TODO: fix this style - WIP */
.bnet-comments .comment-rating { color: #F3E6D0; font-size: 17px; visibility: visible !important; }

/* form */
.bnet-comments .comments-form-wrapper { margin: 15px 0; }
.bnet-comments .comments-form { padding: 15px 15px 15px 100px; background: #000; border-radius: 5px; position: relative; }
.bnet-comments .comments-form .bnet-avatar { position: absolute; top: 15px; left: 15px; }
.bnet-comments .comments-form .text-wrapper { margin-top: 10px; }
.bnet-comments .comments-form .input-wrapper { margin-bottom: 15px; }
.bnet-comments .comments-form .input-wrapper textarea { resize: none; width: 98%; height: 100px; }
.bnet-comments .comments-form .comments-action { text-align: right; }
.bnet-comments .comments-form .comments-error-form { float: left; }
.bnet-comments .comments-form .comments-error-form li { color: red; display: none; }
.bnet-comments .comments-form .comments-throttler { text-align: right; vertical-align: middle; display: none; }
.bnet-comments .comments-form .comments-throttler .throttle-time { color: #fff; font-weight: normal; font-size: 18px; vertical-align: middle; position: relative; top: -2px; }

/* ie */
.ie6 .bnet-comments .comment-tile { zoom: 1; height: 66px; margin-bottom: 10px; }
.ie6 .bnet-comments .comment-tile.comment-buried { height: 15px; }
.ie6 .bnet-comments .comment-tile .bnet-avatar { top: 15px; left: 15px; zoom: 1; }
.ie6 .bnet-comments .comment-tile .karma { width: 200px; }
.ie6 .bnet-comments .comment-nested .comment-tile { height: 34px; }
.ie6 .bnet-comments .comments-form { margin-bottom: 10px; }
.ie6 .bnet-comments .comments-form .bnet-avatar { top: 15px; left: -85px; zoom: 1; }

/* employee icon for "Blue" posts (Shared with forums) */
.employee-icon { background-image: url(../images/icons/employee.gif); background-repeat:no-repeat; display:block; width:20px; height:13px }
.employee-icon a { display:block; overflow:hidden; width:20px; height:13px }