/* ボタンの背景画像に画像 */
#tbutton .bkimg {
  background-image: url(/images/translate.gif) !important;
}

/* IE8, IE9のみ、ボタンが押されている間のスタイル
 * IE7以下では:active疑似クラスの振る舞いが違うみたい */
#tbutton .bkimg:active {
  opacity: .50 !important;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)" !important; 
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50) !important;
  margin-top: 1px !important;
  margin-left: 1px !important;
}

/* jQueryでセットされるマウスがホバーした時のスタイル */
#tbutton .op85 {
  opacity: .85 !important;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=85)" !important; 
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=85) !important; 
}

/* jQueryでセットされるマウスが押された(mousedown)時のスタイル
 * "↓の1.2.3.にボタンを押した感じをつける"のリンクをクリックした後に使われる */
#tbutton .op50i{
  opacity: .50 !important;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)" !important; 
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50) !important;
  margin-top: 1px !important;
  margin-left: 1px !important;
}

/* input, buttonタグは背景赤にして、幅とか(padding/margin/border)をゼロに
 * 丸みをつける 
 * カーソルを指に */
#tbutton input, #tbutton button {
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  background-color: white !important;
  cursor: pointer !important;
  border-radius: 2px !important;
}

/* :hover擬似クラスによるホバーの実演。IE6だと動かない。 */
#tbutton input:hover, #tbutton button:hover {
  border-top: 1px solid yellow !important;
  border-left: 1px solid yellow !important;
}

/* imgタグの幅とか(padding/margin/border)をゼロに
 * 丸みをつける 
 * カーソルを指に */
#tbutton button img {
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  cursor: pointer !important;
  border-radius: 2px !important;
}

/* サイズを明示指定 */
#tbutton .sized {
  width: 180px !important;
  height: 20px !important;
}

/* Firefoxでbutton内imgタグの位置がずれるアドホックな対応 */
#tbutton .fixff{
  margin-left: -3px !important;
  margin-top: -1px !important;
}

/* 各ボタンの上にあるタイトル用のマージン */
#tbutton .title {
  margin-top: 10px !important;
}