@charset "utf-8";

/* Button Reset */
.button,
.button a,
.button button,
.button input { position:relative;margin:0;display:-moz-inline-stack;display:inline-block;text-decoration:none !important;border:0;font-size:12px;white-space:nowrap;background:url(/common/images/bg/btn_middle_blackBg.png) no-repeat;background-size:cover;overflow:visible;color:#fff}
.button {height:23px;padding:0;vertical-align:middle;margin-right:2px;background-position:left top}
.button a,
.button button,
.button input{ left:2px;vertical-align:top;cursor:pointer}

/* Button Size */
.button.large { height:34px;background-position:left 0}
.button.middle { height:27px;background-position:left 0}
.button.xLarge { height:43px;background-position:left 0}
.button.small { height:22px;background-size:auto 22px}
.button a,
.button button,
.button input { height:23px;padding:0 10px 0 8px;font-size:12px;line-height:23px;background-position:right top}
.button.middle a,
.button.middle button,
.button.middle input {height:27px;padding:0 12px 0 8px;font-size:12px;color:#fff;line-height:27px;letter-spacing:-1px;background-position:right 0}
.button.large a,
.button.large button,
.button.large input { height:34px;padding:0 40px 0 40px;font-weight:bold;font-size:14px;color:#fff;line-height:33px;letter-spacing:0px;background-position:right 0}
.button.xLarge a,
.button.xLarge button,
.button.xLarge input { height:43px;padding:0 20px 0 18px;font-size:20px;line-height:40px;background-position:right 0}
.button.small a,
.button.small button,
.button.small input { height:22px;padding:0 8px 0 6px;font-size:12px;line-height:22px;background-position:right 0}


/* Button Text Color */
.button *:hover,
.button *:active,
.button *:focus{color:#ccc}
.button.white,
.button.white a,
.button.white button,
.button.white input { background-image:url(../images/btn_middle_whiteBg.png);color:#333}
.button.white *:hover,
.button.white *:active,
.button.white *:focus{ color:#000}
.button.brown,
.button.brown a,
.button.brown button,
.button.brown input { background-image:url(/images/btn_brownBg.png);color:#fff}
.button.brown *:hover,
.button.brown *:active,
.button.brown *:focus{ color:#fff}
.button.red,
.button.red a,
.button.red button,
.button.red input { background-image:url(/images/btn_redBg.png);color:#fff}
.button.red *:hover,
.button.red *:active,
.button.red *:focus{ color:#ff0}
.button.blue,
.button.blue a,
.button.blue button,
.button.blue input { background-image:url(/images/btn_blueBg.png);color:#fff}
.button.blue *:hover,
.button.blue *:active,
.button.blue *:focus{ font-weight:bold;background-image:url(/images/btn_grayBg.png);color:#f3f3f3}
.button.skyblue,
.button.skyblue a,
.button.skyblue button,
.button.skyblue input {font-weight:bold;background-image:url(/images/btn_skyblueBg.png);color:#fff}
.button.skyblue *:hover,
.button.skyblue *:active,
.button.skyblue *:focus{ color:#baf1ff}

.button.gray,
.button.gray a,
.button.gray button,
.button.gray input {font-weight:bold;background-image:url(/images/btn_grayBg.png);color:#fff}
.button.gray *:hover,
.button.gray *:active,
.button.gray *:focus{ color:#eee}

.button.black,
.button.black a,
.button.black button,
.button.black input {font-weight:bold;background-image:url(/images/btn_blackBg.png);color:#fff}
.button.black *:hover,
.button.black *:active,
.button.black *:focus{ font-weight:bold;background-image:url(/images/btn_grayBg.png);color:#f3f3f3}

/* Button Text Strong */
.button.strong * { font-weight:bold !important}