/* This Source Code Form is subject to the terms of the Mozilla Public
 * License, v. 2.0. If a copy of the MPL was not distributed with this
 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */

@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");

/* ::::: formatting toolbar ::::: */

#FormatToolbar {
  background: url("chrome://global/skin/toolbar/tb-mid.gif") #C7D0D9 repeat-x top;
}

#FormatToolbar > toolbargrippy,
#FormatToolbar > .toolbar-holder {
  border-top: 1px solid #CED6DD;
  border-right: 1px solid #95A0AD;
  border-bottom: 1px solid #95A0AD;
  border-left: 1px solid #DAE3ED;
}

#FormatToolbar > toolbargrippy:hover:active {
  border-color: #67737E;
}

/* ::::: formatting buttons ::::: */

toolbarbutton.formatting-button {
  border: none !important;
  list-style-image: url("chrome://editor/skin/icons/btn2.gif");
  background-color: transparent !important;
}

#DecreaseFontSizeButton {
  -moz-image-region: rect(101px 22px 118px 0px);
}

#DecreaseFontSizeButton:hover {
  -moz-image-region: rect(101px 44px 118px 22px);
}

#DecreaseFontSizeButton:hover:active {
  -moz-image-region: rect(101px 66px 118px 44px);
}

#DecreaseFontSizeButton[disabled="true"] {
  -moz-image-region: rect(101px 88px 118px 66px) !important;
}

#IncreaseFontSizeButton {
  -moz-image-region: rect(118px 22px 135px 0px);
}

#IncreaseFontSizeButton:hover {
  -moz-image-region: rect(118px 44px 135px 22px);
}

#IncreaseFontSizeButton:hover:active {
  -moz-image-region: rect(118px 66px 135px 44px);
}

#IncreaseFontSizeButton[disabled="true"] {
  -moz-image-region: rect(118px 88px 135px 66px) !important;
}

#boldButton {
  -moz-image-region: rect(33px 54px 50px 32px);
}

#boldButton:hover {
  -moz-image-region: rect(33px 76px 50px 54px);
}

#boldButton:hover:active {
  -moz-image-region: rect(50px 22px 67px 0px );
}

#boldButton[checked="true"] {
  -moz-image-region: rect(33px 98px 50px 76px);
}

#boldButton[disabled="true"] {
  -moz-image-region: rect(50px 44px 67px 22px) !important;
}

#italicButton {
  -moz-image-region: rect(185px 86px 202px 64px);
}

#italicButton:hover {
  -moz-image-region: rect(202px 22px 219px 0px);
}

#italicButton:hover:active {
  -moz-image-region: rect(202px 66px 219px 44px);
}

#italicButton[checked="true"] {
  -moz-image-region: rect(202px 44px 219px 22px);
}

#italicButton[disabled="true"] {
  -moz-image-region: rect(202px 88px 219px 66px) !important;
}

#underlineButton {
  -moz-image-region: rect(338px 22px 355px 0px);
}

#underlineButton:hover {
  -moz-image-region: rect(338px 44px 355px 22px);
}

#underlineButton:hover:active {
  -moz-image-region: rect(338px 88px 355px 66px);
}

#underlineButton[checked="true"] {
  -moz-image-region: rect(338px 66px 355px 44px);
}

#underlineButton[disabled="true"] {
  -moz-image-region: rect(355px 22px 372px 0px) !important;
}

#ulButton {
  -moz-image-region: rect(50px 66px 67px 44px);
}

#ulButton:hover {
  -moz-image-region: rect(50px 88px 67px 66px);
}

#ulButton:hover:active {
  -moz-image-region: rect(67px 44px 84px 22px);
}

#ulButton[checked="true"] {
  -moz-image-region: rect(67px 22px 84px 0px);
}

#ulButton[disabled="true"] {
  -moz-image-region: rect(67px 66px 84px 44px ) !important;
}


#olButton {
  -moz-image-region: rect(253px 66px 270px 44px);
}

#olButton:hover {
  -moz-image-region: rect(253px 88px 270px 66px);
}

#olButton:hover:active {
  -moz-image-region: rect(270px 44px 287px 22px);
}

#olButton[checked="true"] {
  -moz-image-region: rect(270px 22px 287px 0px);
}

#olButton[disabled="true"] {
  -moz-image-region: rect(270px 66px 287px 44px) !important;
}

#outdentButton {
  -moz-image-region: rect(270px 88px 287px 66px);
}

#outdentButton:hover {
  -moz-image-region: rect(287px 22px 304px 0px);
}

#outdentButton:hover:active {
  -moz-image-region: rect(287px 44px 304px 22px);
}

#outdentButton[disabled="true"] {
  -moz-image-region: rect(287px 66px 304px 44px) !important;
}

#indentButton {
  -moz-image-region: rect(135px 22px 152px 0px);
}

#indentButton:hover {
  -moz-image-region: rect(135px 44px 152px 22px);
}

#indentButton:hover:active {
  -moz-image-region: rect(135px 66px 152px 44px);
}

#indentButton[disabled="true"] {
  -moz-image-region: rect(135px 88px 152px 66px) !important;
}

#align-left-button {
  -moz-image-region: rect(236px 44px 253px 22px);
}

#align-left-button:hover {
  -moz-image-region: rect(236px 66px 253px 44px);
}

#align-left-button:hover:active {
  -moz-image-region: rect(253px 22px 270px 0px);
}

#align-left-button[checked="true"] {
  -moz-image-region: rect(236px 88px 253px 66px);
}

#align-left-button[disabled="true"] {
  -moz-image-region: rect(253px 44px 270px 22px) !important;
}

#align-center-button {
  -moz-image-region: rect(67px 88px 84px 66px);
}

#align-center-button:hover {
  -moz-image-region: rect(84px 22px 101px 0px);
}

#align-center-button:hover:active {
  -moz-image-region: rect(84px 66px 101px 44px);
}

#align-center-button[checked="true"] {
  -moz-image-region: rect(84px 44px 101px 22px);
}

#align-center-button[disabled="true"] {
  -moz-image-region: rect(84px 88px 101px 66px) !important;
}

#align-right-button {
  -moz-image-region: rect(287px 88px 304px 66px);
}

#align-right-button:hover {
  -moz-image-region: rect(304px 22px 321px 0px);
}

#align-right-button:hover:active {
  -moz-image-region: rect(304px 66px 321px 44px);
}

#align-right-button[checked="true"] {
  -moz-image-region: rect(304px 44px 321px 22px);
}

#align-right-button[disabled="true"] {
  -moz-image-region: rect(304px 88px 321px 66px) !important;
}

#align-justify-button {
  -moz-image-region: rect(219px 22px 236px 0px);
}

#align-justify-button:hover {
  -moz-image-region: rect(219px 44px 236px 22px);
}

#align-justify-button:hover:active {
  -moz-image-region: rect(219px 88px 236px 66px);
}

#align-justify-button[checked="true"] {
  -moz-image-region: rect(219px 66px 236px 44px);
}

#align-justify-button[disabled="true"] {
  -moz-image-region: rect(236px 22px 253px 0px) !important;
}

#AlignPopupButton {
  -moz-image-region: rect(0px 22px 17px 0px);
}

#AlignPopupButton:hover {
  -moz-image-region: rect(0px 44px 17px 22px);
}

#AlignPopupButton[open="true"] {
  -moz-image-region: rect(0px 66px 17px 44px) !important;
}

#AlignPopupButton[disabled="true"] {
  -moz-image-region: rect(0px 88px 17px 66px) !important;
}

#InsertPopupButton {
  -moz-image-region: rect(152px 22px 169px 0px);
}

#InsertPopupButton:hover {
  -moz-image-region: rect(152px 44px 169px 22px);
}

#InsertPopupButton[open="true"] {
  -moz-image-region: rect(152px 66px 169px 44px) !important;
}

#InsertPopupButton[disabled="true"] {
  -moz-image-region: rect(152px 88px 169px 66px) !important;
}

#smileButtonMenu {
  -moz-image-region: rect(321px 22px 338px 0px);
}

#smileButtonMenu:hover {
  -moz-image-region: rect(321px 44px 338px 22px);
}

#smileButtonMenu[open="true"] {
  -moz-image-region: rect(321px 66px 338px 44px) !important;
}

#smileButtonMenu[disabled="true"] {
  -moz-image-region: rect(321px 88px 338px 66px) !important;
}

/* ::::: menuitem icons ::::: */

/* ..... align menu ..... */

#AlignPopup > menuitem {
  list-style-image: url("chrome://editor/skin/icons/btn2.gif");
}

#AlignLeftItem {
  -moz-image-region: rect(17px 80px 33px 64px);
}

#AlignLeftItem:hover {
  -moz-image-region: rect(17px 96px 33px 80px);
}

#AlignCenterItem {
  -moz-image-region: rect(17px 16px 33px 0px);
}

#AlignCenterItem:hover {
  -moz-image-region: rect(17px 32px 33px 16px);
}

#AlignRightItem {
  -moz-image-region: rect(33px 16px 49px 0px);
}

#AlignRightItem:hover {
  -moz-image-region: rect(33px 32px 49px 0px);
}

#AlignJustifyItem {
  -moz-image-region: rect(17px 48px 33px 32px);
}

#AlignJustifyItem:hover {
  -moz-image-region: rect(17px 64px 33px 48px);
}

/* ..... insert menu ..... */

#InsertPopup > menuitem {
  list-style-image: url("chrome://editor/skin/icons/btn2.gif");
}

#InsertLinkItem {
  -moz-image-region: rect(185px 16px 201px 0px);
}

#InsertLinkItem:hover {
  -moz-image-region: rect(185px 32px 201px 16px);
}

#InsertAnchorItem {
  -moz-image-region: rect(169px 16px 185px 0px);
}

#InsertAnchorItem:hover {
  -moz-image-region: rect(169px 32px 185px 16px);
}

#InsertImageItem {
  -moz-image-region: rect(169px 80px 185px 64px);
}

#InsertImageItem:hover {
  -moz-image-region: rect(169px 96px 185px 80px);
}

#InsertHRuleItem {
  -moz-image-region: rect(169px 48px 185px 32px);
}

#InsertHRuleItem:hover {
  -moz-image-region: rect(169px 64px 185px 48px);
}

#InsertTableItem {
  -moz-image-region: rect(185px 48px 201px 32px);
}

#InsertTableItem:hover {
  -moz-image-region: rect(185px 64px 201px 48px);
}

/* ..... smiley menu ..... */

.insert-smile {
  list-style-image: url("chrome://communicator/skin/icons/smileys/smiley-smile.png");
}

.insert-frown {
  list-style-image: url("chrome://communicator/skin/icons/smileys/smiley-frown.png"); 
}

.insert-wink {
  list-style-image: url("chrome://communicator/skin/icons/smileys/smiley-wink.png");
}

.insert-tongue {
  list-style-image: url("chrome://communicator/skin/icons/smileys/smiley-tongue.png");
}

.insert-laughing {
  list-style-image: url("chrome://communicator/skin/icons/smileys/smiley-laughing.png"); 
}

.insert-embarrassed {
  list-style-image: url("chrome://communicator/skin/icons/smileys/smiley-embarrassed.png");
}

.insert-undecided {
  list-style-image: url("chrome://communicator/skin/icons/smileys/smiley-undecided.png"); 
}

.insert-surprise {
  list-style-image: url("chrome://communicator/skin/icons/smileys/smiley-surprise.png"); 
}

.insert-kiss {
  list-style-image: url("chrome://communicator/skin/icons/smileys/smiley-kiss.png"); 
}

.insert-yell {
  list-style-image: url("chrome://communicator/skin/icons/smileys/smiley-yell.png"); 
}

.insert-cool {
  list-style-image: url("chrome://communicator/skin/icons/smileys/smiley-cool.png"); 
}

.insert-money {
  list-style-image: url("chrome://communicator/skin/icons/smileys/smiley-money.png"); 
}

.insert-foot {
  list-style-image: url("chrome://communicator/skin/icons/smileys/smiley-foot.png"); 
}

.insert-innocent {
  list-style-image: url("chrome://communicator/skin/icons/smileys/smiley-innocent.png"); 
}

.insert-cry {
  list-style-image: url("chrome://communicator/skin/icons/smileys/smiley-cry.png"); 
}

.insert-sealed {
  list-style-image: url("chrome://communicator/skin/icons/smileys/smiley-sealed.png"); 
}

/* ::::: fg/bg color picker ::::: */

.color-button {
  margin: 2px;
  border: 1px inset #5B7693;
  padding: 0px;
  width: 14px;
  height: 12px;
}

.color-button:hover {
  border: 1px solid #ffffff;
}

#TextColorButton {
  margin-top: 2px;
  margin-bottom: 9px;
  margin-inline-start: 2px;
  margin-inline-end: 9px;
}

#TextColorButton[color="mixed"] {
  background-image: url("chrome://editor/skin/icons/multicolor.png");
  background-size: cover;
}

#BackgroundColorButton {
  margin-top: 9px;
  margin-bottom: 2px;
  margin-inline-start: 9px;
  margin-inline-end: 2px;
}

#HighlightColorButton > .toolbarbutton-icon {
  margin-inline-end: 0px ! important ;
}

#HighlightColorButton {
  -moz-image-region: rect(355px 44px 372px 22px);
  margin: 4px;
  border: 1px inset #5B7693;
  padding: 0px;
  width: 20px; height: 17px;
}

#HighlightColorButton:hover {
  -moz-image-region: rect(355px 66px 372px 44px);
}

#HighlightColorButton:hover:active {
  -moz-image-region: rect(355px 88px 372px 66px);
}


#HighlightColorButton[disabled="true"],
#HighlightColorButton[disabled="true"]:hover,
#HighlightColorButton[disabled="true"]:hover:active {
  -moz-image-region: rect(372px 22px 389px 0px);
}

#absolutePositionButton {
  -moz-image-region: rect(372px 44px 389px 22px);
}

#absolutePositionButton:hover {
  -moz-image-region: rect(372px 66px 389px 44px);
}

#absolutePositionButton:hover:active {
  -moz-image-region: rect(372px 88px 389px 66px);
}

#absolutePositionButton[checked="true"]{
  -moz-image-region: rect(389px 22px 406px 0px);
}

#absolutePositionButton[checked="true"]:hover {
  -moz-image-region: rect(389px 44px 406px 22px);
}

#absolutePositionButton[checked="true"]:hover:active {
  -moz-image-region: rect(389px 66px 406px 44px);
}

#absolutePositionButton[disabled="true"] {
  -moz-image-region: rect(389px 88px 406px 66px) !important;
}

#increaseZIndexButton {
  list-style-image: url("chrome://editor/content/images/bringtofront.gif");
}

#increaseZIndexButton[disabled="true"] {
  list-style-image: url("chrome://editor/content/images/bringtofront-disabled.gif");
}

#decreaseZIndexButton {
  list-style-image: url("chrome://editor/content/images/sendtoback.gif");
}

#decreaseZIndexButton[disabled="true"] {
  list-style-image: url("chrome://editor/content/images/sendtoback-disabled.gif");
}
