.buttons { margin: 6px 0; }
.buttons.opposite { float: right; margin: 0; }
.buttons a, .buttons button { display: block; float: left; margin: 0 7px 0 0; background-color: #FFF; border: 1px solid #999; border-top: 1px solid #CCC; border-left: 1px solid #CCC; text-decoration: none; color: #565656; cursor: pointer; padding: 5px 10px 6px 7px; }
.buttons a { font-size: 90%; }
.buttons span { display: block; float: left; margin: 0 7px 0 0; background: #DDD; border: 1px solid #999; border-top: 1px solid #CCC; border-left: 1px solid #CCC; text-decoration: none; font-weight: bold; color: #333; padding: 5px 10px 6px 7px; }
.buttons button { width: auto; overflow: visible; padding: 4px 10px 3px 7px; }
.buttons button[type] { padding: 5px 10px 5px 7px; line-height: 17px; }
.buttons.opposite a { margin: 0; }
.buttons button img, .buttons a img, .buttons span img { margin: 0 3px -3px 0 !important; padding: 0; border: none; width: 16px; height: 16px; }

/* STANDARD */
button: hover, .buttons a: hover { background-color: #dff4ff; border: 1px solid #c2e1ef; color: #336699; text-decoration: none; }
.buttons a: active { background-color: #6299c5; border: 1px solid #6299c5; color: #fff; }

/* POSITIVE */
button.positive, .buttons a.positive { color: #529214; text-decoration: none; }
.buttons a.positive: hover, button.positive: hover { background-color: #E6EFC2; border: 1px solid #C6D880; color: #529214; }
.buttons a.positive: active { background-color: #529214; border: 1px solid #529214; color: #fff; }

/* NEGATIVE */
.buttons a.negative, button.negative { color: #d12f19; text-decoration: none; padding: 5px 10px 7px 7px; }
.buttons a.negative: hover, button.negative: hover { background: #fbe3e4; border: 1px solid #fbc2c4; color: #d12f19; }
.buttons a.negative: active { background-color: #d12f19; border: 1px solid #d12f19; color: #fff; }