/*
 * Sprite Assignment
 */

.button,
.button.big,
.button.medium {
    background-repeat: no-repeat;
    background-image: url(../images/sprite_global.png);
    _background-image: url(../images/sprite_global.gif);
    cursor: pointer;
}

/*
 * Button Normal Sized
 */

.button {
    color: #fff !important;
    font-size: 14px;
    text-decoration: none !important;
    display: inline-block;
    height: 18px;
    padding: 3px 20px 4px 8px;
    margin: 0 5px 5px 0;
    border: 1px solid transparent;
    border-bottom: 3px solid;
    background-position: right -11px;
    box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2);
    -webkit-box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2);
    transition: background-color .25s ease-in-out;
    -moz-transition: background-color .25s ease-in-out;
    -webkit-transition: background-color .25s ease-in-out;
    *display: inline;
    *border: none;
    *border-bottom: 3px solid;
}

button.button {
    height: 28px;
    padding-top: 1px;
    background-position: right -12px;
}

button.button span {
    color: #fff;
}

.button:focus,
.button:active {
    margin-top: 6px;
    margin-bottom: 0;
    border-bottom-width: 2px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
    -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

button.button:focus,
button.button:active {
    margin-top: 2px;
    margin-bottom: 3px;
}


/*
 * Button Medium Sized
 */

.button.medium {
    height: 35px;
    padding: 1px 33px 2px 5px;
    margin-bottom: 3px;
    border-bottom: 3px solid;
    background-position: right -51px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
    -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
    _height: 46px;
}

a.button.medium {
    height: 27px;
}

.button.medium span {
    color: #fff;
    white-space: nowrap;
    font-size: 14px;
    font-weight: bold;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4);
}

a.button.medium span {
    display: block;
    margin: 7px 5px 0 0;
}

.button.medium:focus,
.button.medium:active {
    margin-top: 3px;
    margin-bottom: 0;
    border-bottom-width: 2px;
    background-position: right -51px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
    -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

/* Webkit Fixes */
@media screen and/*!YUI-Compresser */(-webkit-min-device-pixel-ratio:0) {
    .button.medium:focus,
    .button.medium:active {
        margin-top: 2px;
        margin-bottom: 1px;
        height: 36px;
    }
}

/*
 * Button Big Sized
 * <button><span>text</span></button>
 */

.button.big {
    height: 46px;
    padding: 3px 33px 6px 5px;
    margin-bottom: 3px;
    border-bottom: 4px solid;
    background-position: right -47px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
    -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
    *height: 40px;
    _height: 46px;
}

.button.big span {
    color: #fff;
    white-space: nowrap;
    font-size: 18px;
    font-weight: bold;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4);
    *padding-top: 5px;
}

.button.big:focus,
.button.big:active {
    margin-top: 2px;
    margin-bottom: 0;
    border-bottom-width: 3px;
    background-position: right -46px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
    -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
    .button.big:active {
        background-position: right -47px;
    }
}

button.no-shadow {
    box-shadow: none;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
}

/*
 * Button Big Tall Sized
 */

.button.big.tall {
    height: 55px;
    padding: 3px 30px 6px 1px;
    background-position: 4px -35px;
}

/*
 * Colors
 */

.button.green {
    border-bottom-color: #71870e;
    background-color: #93af17;
}

.button.green:hover {
    background-color: #9eba17;
}

.button.grey {
    border-bottom-color: #595959;
    background-color: #8c8c8c;
}

.button.grey:hover {
    background-color: #999;
}

.button.red {
    border-bottom-color: #a33829;
    background-color: #e4533f;
}

.button.red:hover {
    background-color: #f1533f;
}

.button.blue {
    border-bottom-color: #24333b;
    background-color: #425965;
}

.button.blue:hover {
    background-color: #4e6874;
}

.button.orange {
     border-bottom-color: #c8890d;
     background-color: #f9a500;
}

.button.orange:hover {
    background-color: #ffb302;
}

/*
 * Button Big Font-Size
 */

.button.big.f-medium {
    height: 21px;
    padding: 6px 36px 5px 5px;
    background-position: right -50px;
    *display: block;
    *width: 100px;
    *padding-top: 8px;
}

.button.big.f-medium span {
    font-size: 14px;
}
