.ButtonBarMarkupHint {
    /* color: black; */
    font-size: 11px;
}

#DiscussionForm .ButtonBar {
    margin-bottom: -6px;
}

#DiscussionForm .ButtonBarMarkupHint {
    margin-top: -6px;
}

.BarWrap {
    background: #fafafa;
    border: 1px solid #aaa;
    margin: 0 0 -1px;
    line-height: 0.1;
}

.ButtonBar .ButtonWrap {
    background-color: white;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    border-right: 1px solid #eee;
    height: 24px;
    width: 24px;
    z-index: 50;
    display: inline-block;
}

/** This causes clearing problems when the panel is taller than the content
#DiscussionForm .TextBoxWrapper,
.CommentForm .TextBoxWrapper {
   clear: left;
}
*/
.ButtonBar .ButtonWrap:hover {
    background-color: #f8f8f8;
    cursor: pointer;
}

.ButtonBar .ButtonWrap span {
    display: none;
}

.ButtonBar .ButtonOff {
    display: none;
    cursor: auto;
    opacity: 0.3;
}

.ButtonBar .ButtonOff:hover {
    background-color: white;
}

.ButtonBar .ButtonWrap {
    background: transparent url('images/sprites.png') no-repeat 0 0;
}

.ButtonBar .ButtonBarBold {
    background-position: 0px 0px;
}

.ButtonBar .ButtonBarItalic {
    background-position: 0px -24px;
}

.ButtonBar .ButtonBarUnderline {
    background-position: 0px -48px;
}

.ButtonBar .ButtonBarStrike {
    background-position: 0px -72px;
}

.ButtonBar .ButtonBarCode {
    background-position: 0px -96px;
}

.ButtonBar .ButtonBarImage {
    background-position: 0px -120px;
}

.ButtonBar .ButtonBarUrl {
    background-position: 0px -144px;
}

.ButtonBar .ButtonBarQuote {
    background-position: 0px -168px;
}

.ButtonBar .ButtonBarSpoiler {
    background-position: 0px -192px;
}