div.ribbonbar{
}

.spacer{
    width:5px;
    display:inline-block;
    cursor:default;
}
a.button {
    background-color:transparent;
    background-image: url( '../images/buttons/default/btn_right.png' );
    background-repeat:no-repeat ;
    background-position:top right;
    color: #fff;
    display:inline-block;
    font: normal 13px arial, sans-serif;
    height: 32px;
    margin-right: 0px;
    padding-right: 10px;
    text-decoration: none;
}

a.button span {
    background-color:transparent;
    background-image: url( '../images/buttons/default/btn.png' );
    background-repeat:no-repeat ;
    display: block;
    line-height: 21px;
    padding: 3px 0 8px 10px;
}

a.button span img{
    margin-left:-5px;
    margin-top:-2px;
    padding-right:5px;
}

/*HOVER*/
a.button:hover, a.button.selected {
    background-image: url( '../images/buttons/default/btn_hover_right.png' );
    color: #fff;
    outline: none;
}

a.button:hover span, a.button.selected span {
    background-image:url( '../images/buttons/default/btn_hover.png');
}

/*SPECIAL*/
a.special {
		background-image: url( '../images/buttons/special/btn_right.png' );
}
a.special span {
    background-image: url( '../images/buttons/special/btn.png' );
}

a.special:hover {
    background-image: url( '../images/buttons/special/btn_hover_right.png' );
}
a.special:hover span {
    background-image: url( '../images/buttons/special/btn_hover.png' );
}
/*ORANGE*/
a.orange {
    background-image: url( '../images/buttons/orange/btn_right.png' );
}
a.orange span {
    background-image: url( '../images/buttons/orange/btn.png' );
}

a.orange:hover {
    background-image: url( '../images/buttons/orange/btn_hover_right.png' );
}
a.orange:hover span {
    background-image: url( '../images/buttons/orange/btn_hover.png' );
}