span.button
{
    display: inline-block;
    overflow: hidden;
    font-size:12px;
    text-decoration: none;
}
    span.button a:hover
    {
        border:0px;
        outline:0px;
        text-decoration: none;
    }
span.button.green .buttonleft, span.button.green .txtbutton, span.button.green .buttonright
{
    background-image: url(buttons/green.png);
    color: #FFFFFF;
    text-shadow:#444444 1px 1px 1px;
}
span.button.white .buttonleft, span.button.white .txtbutton, span.button.white .buttonright
{
    background-image: url(buttons/white.png);
    color: #333333;
    text-shadow:#999999 1px 1px 1px;
}
span.button.red .buttonleft, span.button.red .txtbutton, span.button.red .buttonright
{
    background-image: url(buttons/red.png);
    color: #FFFFFF;
    text-shadow:#444444 1px 1px 1px;
}

span.button .buttonleft
{
    background-position:left top;
    background-repeat: no-repeat;
    width: 10px;
    display:block;
    float:left;
    height: 30px;
    text-decoration: none;
}
span.button .txtbutton
{
    background-position: 0px -60px;
    background-repeat: repeat-x;
    line-height:30px;
    width: auto;
    float:left;
    text-align: center;
    text-decoration: none;
}
span.button .buttonright
{
    background-position: right top;
    background-repeat: no-repeat;
    width: 10px;
    display:block;
    float:left;
    height: 30px;
    text-decoration: none;
}

span.button:hover .buttonleft
{
    background-position: 0px -30px;
}
span.button:hover .txtbutton
{
    background-position: bottom;
}
span.button:hover .buttonright
{
    background-position: -62px -30px;
}


span.button input
{
    font-size:100%;
    border:0px;
    padding-bottom:8px;
    padding-top:0px;
}