﻿.greenButton
{
    background-color: #7D9459;
    background-image: url(/app_themes/lead2lease/backimages/title_bg.gif);
    border: 1px solid black;
    font-family: verdana;
    font-size: 11px;
    font-weight: bold;
    color: White;
    padding-top: 3px;
    padding-bottom: 3px;
    padding-left: 3px;
    padding-right: 3px;
    cursor: pointer;
}

.darkGreenButton
{
    color: #ffffff;
    background-color: #388832;
    background-image: url(/app_themes/lead2lease/backimages/chrome_darkgreen.png);
    background-position: left top;
    background-repeat: repeat-x;
    border: 1px solid black;
    font-family: verdana;
    font-size: 11px;
    font-weight: bold;
    color: White;
    padding-top: 3px;
    padding-bottom: 3px;
    padding-left: 3px;
    padding-right: 3px;
    cursor: pointer;
}

.darkBlueButton
{
    color: #ffffff;
    background-color: #5266a8;
    background-image: url(/app_themes/lead2lease/backimages/chrome_darkblue.png);
    background-position: left top;
    background-repeat: repeat-x;
    border: 1px solid black;
    font-family: verdana;
    font-size: 11px;
    font-weight: bold;
    color: White;
    padding-top: 3px;
    padding-bottom: 3px;
    padding-left: 3px;
    padding-right: 3px;
    cursor: pointer;
}

.blackButton
{
    color: #ffffff;
    background-color: #2f2f2f;
    background-image: url(/app_themes/lead2lease/backimages/chrome_black.png);
    background-position: left top;
    background-repeat: repeat-x;
    border: 1px solid black;
    font-family: verdana;
    font-size: 11px;
    font-weight: bold;
    color: White;
    padding-top: 3px;
    padding-bottom: 3px;
    padding-left: 3px;
    padding-right: 3px;
    cursor: pointer;
}

.btnBlack, .btnBlack:hover
{
    color: #ffffff;
    background-color: #2f2f2f;
    background-image: url(/app_themes/lead2lease/backimages/chrome_black.png);
    background-position: left top;
    background-repeat: repeat-x;
    border: 1px solid black;
    font-family: verdana;
    font-size: 11px;
    font-weight: bold;
    color: White;
    padding-top: 3px;
    padding-bottom: 3px;
    padding-left: 3px;
    padding-right: 3px;
    cursor: pointer;
}

.btnGreen, .btnGreen:hover
{
    padding: 3px;
    background-color: #7D9459;
    background-image: url('/app_themes/lead2lease/backimages/title_bg.gif');
    border: 1px solid black;
    font-family: verdana;
    font-size: 11px;
    font-weight: bold;
    color: White;
    cursor: pointer;
    height: 0px;
}

.btnDarkGreen, .btnDarkGreen:hover
{
    color: #ffffff;
    background-color: #388832;
    background-image: url(/app_themes/lead2lease/backimages/chrome_darkgreen.png);
    background-position: left top;
    background-repeat: repeat-x;
    border: 1px solid black;
    font-family: verdana;
    font-size: 11px;
    font-weight: bold;
    color: White;
    padding-top: 3px;
    padding-bottom: 3px;
    padding-left: 3px;
    padding-right: 3px;
    cursor: pointer;
}

.btnDarkBlue, .btnDarkBlue:hover
{
    color: #ffffff;
    background-color: #5266a8;
    background-image: url(/app_themes/lead2lease/backimages/chrome_darkblue.png);
    background-position: left top;
    background-repeat: repeat-x;
    border: 1px solid black;
    font-family: verdana;
    font-size: 11px;
    font-weight: bold;
    color: White;
    padding-top: 3px;
    padding-bottom: 3px;
    padding-left: 3px;
    padding-right: 3px;
    cursor: pointer;
}

.btnOrange
{
    font-size: 13px;
    padding: 3px 10px 3px;
    font-weight: bold;
    line-height: 1;
    text-shadow: 0 -1px 1px rgba(0,0,0,0.25); /*  display: inline-block; */
    color: #fff;
    background-color: #ffb515;
    text-decoration: none;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
    -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
    text-shadow: 0 -1px 1px rgba(0,0,0,0.25);
    border-bottom: 1px solid rgba(0,0,0,0.25); /*   position: relative;  */
    cursor: pointer; /*  float: right; */
    text-rendering: optimizelegibility;
}

    .btnOrange:hover
    {
        font-size: 13px;
        padding: 3px 10px 3px;
        background-color: #fc9200;
        text-decoration: none;
        color: #fff;
        display: inline-block;
        line-height: 1;
        text-shadow: 0 -1px 1px rgba(0,0,0,0.25);
    }

    .btnOrange:active
    {
        top: 1px;
    }

button::-moz-focus-inner
{
    border: 0;
}
/**
Types: minimal, clean-gray, cupid-green, cupid-blue, blue-pill, thoughtbot, punch, purple-candy, shiny-blue, download-itunes, skip, minimal-indent, webkit-badge, webkit-seal, webkit-check
**/

/* minimal
*******************************************************************************/
.button_minimal
{
    background: #e3e3e3;
    border: 1px solid #bbb;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px;
    -webkit-box-shadow: inset 0 0 1px 1px #f6f6f6;
    -moz-box-shadow: inset 0 0 1px 1px #f6f6f6;
    -ms-box-shadow: inset 0 0 1px 1px #f6f6f6;
    -o-box-shadow: inset 0 0 1px 1px #f6f6f6;
    box-shadow: inset 0 0 1px 1px #f6f6f6;
    color: #333;
    font: bold 12px "helvetica neue", helvetica, arial, sans-serif;
    line-height: 1;
    padding: 8px 0 9px;
    text-align: center;
    text-shadow: 0 1px 0 #fff;
    width: 150px;
}

    .button_minimal:hover
    {
        background: #d9d9d9;
        -webkit-box-shadow: inset 0 0 1px 1px #eaeaea;
        -moz-box-shadow: inset 0 0 1px 1px #eaeaea;
        -ms-box-shadow: inset 0 0 1px 1px #eaeaea;
        -o-box-shadow: inset 0 0 1px 1px #eaeaea;
        box-shadow: inset 0 0 1px 1px #eaeaea;
        color: #222;
        cursor: pointer;
    }

    .button_minimal:active
    {
        background: #d0d0d0;
        -webkit-box-shadow: inset 0 0 1px 1px #e3e3e3;
        -moz-box-shadow: inset 0 0 1px 1px #e3e3e3;
        -ms-box-shadow: inset 0 0 1px 1px #e3e3e3;
        -o-box-shadow: inset 0 0 1px 1px #e3e3e3;
        box-shadow: inset 0 0 1px 1px #e3e3e3;
        color: #000;
    }

.button_minimalhome
{
    background: #d3ffd3;
    border: 1px solid #bbb;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px;
    -webkit-box-shadow: inset 0 0 1px 1px #f6f6f6;
    -moz-box-shadow: inset 0 0 1px 1px #f6f6f6;
    -ms-box-shadow: inset 0 0 1px 1px #f6f6f6;
    -o-box-shadow: inset 0 0 1px 1px #f6f6f6;
    box-shadow: inset 0 0 1px 1px #f6f6f6;
    color: #333;
    font: bold 12px "helvetica neue", helvetica, arial, sans-serif;
    line-height: 1;
    padding: 8px 0 9px;
    text-align: center;
    text-shadow: 0 1px 0 #fff;
    width: 150px;
}

    .button_minimalhome:hover
    {
        background: #ddffdd;
        -webkit-box-shadow: inset 0 0 1px 1px #eaeaea;
        -moz-box-shadow: inset 0 0 1px 1px #eaeaea;
        -ms-box-shadow: inset 0 0 1px 1px #eaeaea;
        -o-box-shadow: inset 0 0 1px 1px #eaeaea;
        box-shadow: inset 0 0 1px 1px #eaeaea;
        color: #222;
        cursor: pointer;
    }



    .button_minimalhome:active
    {
        background: #d0d0d0;
        -webkit-box-shadow: inset 0 0 1px 1px #e3e3e3;
        -moz-box-shadow: inset 0 0 1px 1px #e3e3e3;
        -ms-box-shadow: inset 0 0 1px 1px #e3e3e3;
        -o-box-shadow: inset 0 0 1px 1px #e3e3e3;
        box-shadow: inset 0 0 1px 1px #e3e3e3;
        color: #000;
    }


.button_replynow
{
    background: #efffef;
    border: 1px solid #bbb;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px;
    -webkit-box-shadow: inset 0 0 1px 1px #f6f6f6;
    -moz-box-shadow: inset 0 0 1px 1px #f6f6f6;
    -ms-box-shadow: inset 0 0 1px 1px #f6f6f6;
    -o-box-shadow: inset 0 0 1px 1px #f6f6f6;
    box-shadow: inset 0 0 1px 1px #f6f6f6;
    color: #333;
    font: bold 12px "helvetica neue", helvetica, arial, sans-serif;
    line-height: 1;
    padding: 8px 0 9px;
    text-align: center;
    text-shadow: 0 1px 0 #fff;
    width: 150px;
}

    .button_replynow:hover
    {
        background: #d9d9d9;
        -webkit-box-shadow: inset 0 0 1px 1px #eaeaea;
        -moz-box-shadow: inset 0 0 1px 1px #eaeaea;
        -ms-box-shadow: inset 0 0 1px 1px #eaeaea;
        -o-box-shadow: inset 0 0 1px 1px #eaeaea;
        box-shadow: inset 0 0 1px 1px #eaeaea;
        color: #222;
        cursor: pointer;
    }

    .button_replynow:active
    {
        background: #d0d0d0;
        -webkit-box-shadow: inset 0 0 1px 1px #e3e3e3;
        -moz-box-shadow: inset 0 0 1px 1px #e3e3e3;
        -ms-box-shadow: inset 0 0 1px 1px #e3e3e3;
        -o-box-shadow: inset 0 0 1px 1px #e3e3e3;
        box-shadow: inset 0 0 1px 1px #e3e3e3;
        color: #000;
    }



.button_minimal_small
{
    background: #e3e3e3;
    border: 1px solid #bbb;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px;
    -webkit-box-shadow: inset 0 0 1px 1px #f6f6f6;
    -moz-box-shadow: inset 0 0 1px 1px #f6f6f6;
    -ms-box-shadow: inset 0 0 1px 1px #f6f6f6;
    -o-box-shadow: inset 0 0 1px 1px #f6f6f6;
    box-shadow: inset 0 0 1px 1px #f6f6f6;
    color: #333;
    font: bold 10px "helvetica neue", helvetica, arial, sans-serif;
    line-height: 1;
    padding: 3px 10px 4px 10px;
    text-align: center;
    text-shadow: 0 1px 0 #fff;
}

    .button_minimal_small:hover
    {
        background: #d9d9d9;
        border: 1px solid #bbb;
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        -ms-border-radius: 3px;
        -o-border-radius: 3px;
        border-radius: 3px;
        -webkit-box-shadow: inset 0 0 1px 1px #f6f6f6;
        -moz-box-shadow: inset 0 0 1px 1px #f6f6f6;
        -ms-box-shadow: inset 0 0 1px 1px #f6f6f6;
        -o-box-shadow: inset 0 0 1px 1px #f6f6f6;
        box-shadow: inset 0 0 1px 1px #eaeaea;
        color: #222;
        font: bold 10px "helvetica neue", helvetica, arial, sans-serif;
        line-height: 1;
        padding: 3px 10px 4px 10px;
        text-align: center;
        text-shadow: 0 1px 0 #fff;
        cursor: pointer;
        text-decoration: none;
    }

    .button_minimal_small:active
    {
        background: #d0d0d0;
        -webkit-box-shadow: inset 0 0 1px 1px #e3e3e3;
        -moz-box-shadow: inset 0 0 1px 1px #e3e3e3;
        -ms-box-shadow: inset 0 0 1px 1px #e3e3e3;
        -o-box-shadow: inset 0 0 1px 1px #e3e3e3;
        box-shadow: inset 0 0 1px 1px #e3e3e3;
        color: #000;
    }
    
    
    
/* clean gray
*******************************************************************************/
.button_clean-gray
{
    background-color: #eeeeee;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #eeeeee), color-stop(100%, #cccccc));
    background-image: -webkit-linear-gradient(top, #eeeeee, #cccccc);
    background-image: -moz-linear-gradient(top, #eeeeee, #cccccc);
    background-image: -ms-linear-gradient(top, #eeeeee, #cccccc);
    background-image: -o-linear-gradient(top, #eeeeee, #cccccc);
    background-image: linear-gradient(top, #eeeeee, #cccccc);
    border: 1px solid #ccc;
    border-bottom: 1px solid #bbb;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px;
    color: #333;
    font: bold 11px "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    line-height: 1;
    padding: 8px 0;
    text-align: center;
    text-shadow: 0 1px 0 #eee;
    width: 150px;
}

    .button_clean-gray:hover
    {
        background-color: #dddddd;
        background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #dddddd), color-stop(100%, #bbbbbb));
        background-image: -webkit-linear-gradient(top, #dddddd, #bbbbbb);
        background-image: -moz-linear-gradient(top, #dddddd, #bbbbbb);
        background-image: -ms-linear-gradient(top, #dddddd, #bbbbbb);
        background-image: -o-linear-gradient(top, #dddddd, #bbbbbb);
        background-image: linear-gradient(top, #dddddd, #bbbbbb);
        border: 1px solid #bbb;
        border-bottom: 1px solid #999;
        cursor: pointer;
        text-shadow: 0 1px 0 #ddd;
    }

    .button_clean-gray:active
    {
        border: 1px solid #aaa;
        border-bottom: 1px solid #888;
        -webkit-box-shadow: inset 0 0 5px 2px #aaaaaa, 0 1px 0 0 #eeeeee;
        -moz-box-shadow: inset 0 0 5px 2px #aaaaaa, 0 1px 0 0 #eeeeee;
        -ms-box-shadow: inset 0 0 5px 2px #aaaaaa, 0 1px 0 0 #eeeeee;
        -o-box-shadow: inset 0 0 5px 2px #aaaaaa, 0 1px 0 0 #eeeeee;
        box-shadow: inset 0 0 5px 2px #aaaaaa, 0 1px 0 0 #eeeeee;
    }

/* cupid green (inspired by okcupid.com)
*******************************************************************************/
.button_cupid-green
{
    background-color: #7fbf4d;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #7fbf4d), color-stop(100%, #63a62f));
    background-image: -webkit-linear-gradient(top, #7fbf4d, #63a62f);
    background-image: -moz-linear-gradient(top, #7fbf4d, #63a62f);
    background-image: -ms-linear-gradient(top, #7fbf4d, #63a62f);
    background-image: -o-linear-gradient(top, #7fbf4d, #63a62f);
    background-image: linear-gradient(top, #7fbf4d, #63a62f);
    border: 1px solid #63a62f;
    border-bottom: 1px solid #5b992b;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px;
    -webkit-box-shadow: inset 0 1px 0 0 #96ca6d;
    -moz-box-shadow: inset 0 1px 0 0 #96ca6d;
    -ms-box-shadow: inset 0 1px 0 0 #96ca6d;
    -o-box-shadow: inset 0 1px 0 0 #96ca6d;
    box-shadow: inset 0 1px 0 0 #96ca6d;
    color: #fff;
    font: bold 11px "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    line-height: 1;
    padding: 7px 0 8px 0;
    text-align: center;
    text-shadow: 0 -1px 0 #4c9021;
    width: 150px;
}

    .button_cupid-green:hover
    {
        background-color: #76b347;
        background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #76b347), color-stop(100%, #5e9e2e));
        background-image: -webkit-linear-gradient(top, #76b347, #5e9e2e);
        background-image: -moz-linear-gradient(top, #76b347, #5e9e2e);
        background-image: -ms-linear-gradient(top, #76b347, #5e9e2e);
        background-image: -o-linear-gradient(top, #76b347, #5e9e2e);
        background-image: linear-gradient(top, #76b347, #5e9e2e);
        -webkit-box-shadow: inset 0 1px 0 0 #8dbf67;
        -moz-box-shadow: inset 0 1px 0 0 #8dbf67;
        -ms-box-shadow: inset 0 1px 0 0 #8dbf67;
        -o-box-shadow: inset 0 1px 0 0 #8dbf67;
        box-shadow: inset 0 1px 0 0 #8dbf67;
        cursor: pointer;
    }

    .button_cupid-green:active
    {
        border: 1px solid #5b992b;
        border-bottom: 1px solid #538c27;
        -webkit-box-shadow: inset 0 0 8px 4px #548c29, 0 1px 0 0 #eeeeee;
        -moz-box-shadow: inset 0 0 8px 4px #548c29, 0 1px 0 0 #eeeeee;
        -ms-box-shadow: inset 0 0 8px 4px #548c29, 0 1px 0 0 #eeeeee;
        -o-box-shadow: inset 0 0 8px 4px #548c29, 0 1px 0 0 #eeeeee;
        box-shadow: inset 0 0 8px 4px #548c29, 0 1px 0 0 #eeeeee;
    }

/* cupid blue (inspired by okcupid.com)
*******************************************************************************/
.button_cupid-blue
{
    background-color: #d7e5f5;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #d7e5f5), color-stop(100%, #cbe0f5));
    background-image: -webkit-linear-gradient(top, #d7e5f5, #cbe0f5);
    background-image: -moz-linear-gradient(top, #d7e5f5, #cbe0f5);
    background-image: -ms-linear-gradient(top, #d7e5f5, #cbe0f5);
    background-image: -o-linear-gradient(top, #d7e5f5, #cbe0f5);
    background-image: linear-gradient(top, #d7e5f5, #cbe0f5);
    border-top: 1px solid #abbbcc;
    border-left: 1px solid #a7b6c7;
    border-bottom: 1px solid #a1afbf;
    border-right: 1px solid #a7b6c7;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    -ms-border-radius: 12px;
    -o-border-radius: 12px;
    border-radius: 12px;
    -webkit-box-shadow: inset 0 1px 0 0 white;
    -moz-box-shadow: inset 0 1px 0 0 white;
    -ms-box-shadow: inset 0 1px 0 0 white;
    -o-box-shadow: inset 0 1px 0 0 white;
    box-shadow: inset 0 1px 0 0 white;
    color: #1a3e66;
    font: normal 11px "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    line-height: 1;
    padding: 6px 0 7px 0;
    text-align: center;
    text-shadow: 0 1px 1px #fff;
    width: 150px;
}

    .button_cupid-blue:hover
    {
        background-color: #ccd9e8;
        background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ccd9e8), color-stop(100%, #c1d4e8));
        background-image: -webkit-linear-gradient(top, #ccd9e8, #c1d4e8);
        background-image: -moz-linear-gradient(top, #ccd9e8, #c1d4e8);
        background-image: -ms-linear-gradient(top, #ccd9e8, #c1d4e8);
        background-image: -o-linear-gradient(top, #ccd9e8, #c1d4e8);
        background-image: linear-gradient(top, #ccd9e8, #c1d4e8);
        border-top: 1px solid #a1afbf;
        border-left: 1px solid #9caaba;
        border-bottom: 1px solid #96a3b3;
        border-right: 1px solid #9caaba;
        -webkit-box-shadow: inset 0 1px 0 0 #f2f2f2;
        -moz-box-shadow: inset 0 1px 0 0 #f2f2f2;
        -ms-box-shadow: inset 0 1px 0 0 #f2f2f2;
        -o-box-shadow: inset 0 1px 0 0 #f2f2f2;
        box-shadow: inset 0 1px 0 0 #f2f2f2;
        color: #163659;
        cursor: pointer;
    }

    .button_cupid-blue:active
    {
        border: 1px solid #8c98a7;
        -webkit-box-shadow: inset 0 0 4px 2px #abbccf, 0 0 1px 0 #eeeeee;
        -moz-box-shadow: inset 0 0 4px 2px #abbccf, 0 0 1px 0 #eeeeee;
        -ms-box-shadow: inset 0 0 4px 2px #abbccf, 0 0 1px 0 #eeeeee;
        -o-box-shadow: inset 0 0 4px 2px #abbccf, 0 0 1px 0 #eeeeee;
        box-shadow: inset 0 0 4px 2px #abbccf, 0 0 1px 0 #eeeeee;
    }

/* blue pill (inspired by iTunes)
*******************************************************************************/
.button_blue-pill
{
    background-color: #a5b8da;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #a5b8da), color-stop(100%, #7089b3));
    background-image: -webkit-linear-gradient(top, #a5b8da, #7089b3);
    background-image: -moz-linear-gradient(top, #a5b8da, #7089b3);
    background-image: -ms-linear-gradient(top, #a5b8da, #7089b3);
    background-image: -o-linear-gradient(top, #a5b8da, #7089b3);
    background-image: linear-gradient(top, #a5b8da, #7089b3);
    border-top: 1px solid #758fba;
    border-right: 1px solid #6c84ab;
    border-bottom: 1px solid #5c6f91;
    border-left: 1px solid #6c84ab;
    -webkit-border-radius: 18px;
    -moz-border-radius: 18px;
    -ms-border-radius: 18px;
    -o-border-radius: 18px;
    border-radius: 18px;
    -webkit-box-shadow: inset 0 1px 0 0 #aec3e5;
    -moz-box-shadow: inset 0 1px 0 0 #aec3e5;
    -ms-box-shadow: inset 0 1px 0 0 #aec3e5;
    -o-box-shadow: inset 0 1px 0 0 #aec3e5;
    box-shadow: inset 0 1px 0 0 #aec3e5;
    color: #fff;
    font: bold 11px "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    line-height: 1;
    padding: 8px 0;
    text-align: center;
    text-shadow: 0 -1px 1px #64799e;
    text-transform: uppercase;
    width: 150px;
}

    .button_blue-pill:hover
    {
        background-color: #9badcc;
        background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #9badcc), color-stop(100%, #687fa6));
        background-image: -webkit-linear-gradient(top, #9badcc, #687fa6);
        background-image: -moz-linear-gradient(top, #9badcc, #687fa6);
        background-image: -ms-linear-gradient(top, #9badcc, #687fa6);
        background-image: -o-linear-gradient(top, #9badcc, #687fa6);
        background-image: linear-gradient(top, #9badcc, #687fa6);
        border-top: 1px solid #6d86ad;
        border-right: 1px solid #647a9e;
        border-bottom: 1px solid #546685;
        border-left: 1px solid #647a9e;
        -webkit-box-shadow: inset 0 1px 0 0 #a5b9d9;
        -moz-box-shadow: inset 0 1px 0 0 #a5b9d9;
        -ms-box-shadow: inset 0 1px 0 0 #a5b9d9;
        -o-box-shadow: inset 0 1px 0 0 #a5b9d9;
        box-shadow: inset 0 1px 0 0 #a5b9d9;
        cursor: pointer;
    }

    .button_blue-pill:active
    {
        border: 1px solid #546685;
        -webkit-box-shadow: inset 0 0 8px 2px #7e8da6, 0 1px 0 0 #eeeeee;
        -moz-box-shadow: inset 0 0 8px 2px #7e8da6, 0 1px 0 0 #eeeeee;
        -ms-box-shadow: inset 0 0 8px 2px #7e8da6, 0 1px 0 0 #eeeeee;
        -o-box-shadow: inset 0 0 8px 2px #7e8da6, 0 1px 0 0 #eeeeee;
        box-shadow: inset 0 0 8px 2px #7e8da6, 0 1px 0 0 #eeeeee;
    }

/* thoughtbot (inspired by thoughtbot.com)
*******************************************************************************/
.button_thoughtbot
{
    background-color: #ee432e;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ee432e), color-stop(50%, #c63929), color-stop(50%, #b51700), color-stop(100%, #891100));
    background-image: -webkit-linear-gradient(top, #ee432e 0%, #c63929 50%, #b51700 50%, #891100 100%);
    background-image: -moz-linear-gradient(top, #ee432e 0%, #c63929 50%, #b51700 50%, #891100 100%);
    background-image: -ms-linear-gradient(top, #ee432e 0%, #c63929 50%, #b51700 50%, #891100 100%);
    background-image: -o-linear-gradient(top, #ee432e 0%, #c63929 50%, #b51700 50%, #891100 100%);
    background-image: linear-gradient(top, #ee432e 0%, #c63929 50%, #b51700 50%, #891100 100%);
    border: 1px solid #951100;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    border-radius: 5px;
    -webkit-box-shadow: inset 0px 0px 0px 1px rgba(255, 115, 100, 0.4), 0 1px 3px #333333;
    -moz-box-shadow: inset 0px 0px 0px 1px rgba(255, 115, 100, 0.4), 0 1px 3px #333333;
    -ms-box-shadow: inset 0px 0px 0px 1px rgba(255, 115, 100, 0.4), 0 1px 3px #333333;
    -o-box-shadow: inset 0px 0px 0px 1px rgba(255, 115, 100, 0.4), 0 1px 3px #333333;
    box-shadow: inset 0px 0px 0px 1px rgba(255, 115, 100, 0.4), 0 1px 3px #333333;
    color: #fff;
    font: bold 20px "helvetica neue", helvetica, arial, sans-serif;
    line-height: 1;
    padding: 12px 0 14px 0;
    text-align: center;
    text-shadow: 0px -1px 1px rgba(0, 0, 0, 0.8);
    width: 150px;
}

    .button_thoughtbot:hover
    {
        background-color: #f37873;
        background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f37873), color-stop(50%, #db504d), color-stop(50%, #cb0500), color-stop(100%, #a20601));
        background-image: -webkit-linear-gradient(top, #f37873 0%, #db504d 50%, #cb0500 50%, #a20601 100%);
        background-image: -moz-linear-gradient(top, #f37873 0%, #db504d 50%, #cb0500 50%, #a20601 100%);
        background-image: -ms-linear-gradient(top, #f37873 0%, #db504d 50%, #cb0500 50%, #a20601 100%);
        background-image: -o-linear-gradient(top, #f37873 0%, #db504d 50%, #cb0500 50%, #a20601 100%);
        background-image: linear-gradient(top, #f37873 0%, #db504d 50%, #cb0500 50%, #a20601 100%);
        cursor: pointer;
    }

    .button_thoughtbot:active
    {
        background-color: #d43c28;
        background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #d43c28), color-stop(50%, #ad3224), color-stop(50%, #9c1500), color-stop(100%, #700d00));
        background-image: -webkit-linear-gradient(top, #d43c28 0%, #ad3224 50%, #9c1500 50%, #700d00 100%);
        background-image: -moz-linear-gradient(top, #d43c28 0%, #ad3224 50%, #9c1500 50%, #700d00 100%);
        background-image: -ms-linear-gradient(top, #d43c28 0%, #ad3224 50%, #9c1500 50%, #700d00 100%);
        background-image: -o-linear-gradient(top, #d43c28 0%, #ad3224 50%, #9c1500 50%, #700d00 100%);
        background-image: linear-gradient(top, #d43c28 0%, #ad3224 50%, #9c1500 50%, #700d00 100%);
        -webkit-box-shadow: inset 0px 0px 0px 1px rgba(255, 115, 100, 0.4);
        -moz-box-shadow: inset 0px 0px 0px 1px rgba(255, 115, 100, 0.4);
        -ms-box-shadow: inset 0px 0px 0px 1px rgba(255, 115, 100, 0.4);
        -o-box-shadow: inset 0px 0px 0px 1px rgba(255, 115, 100, 0.4);
        box-shadow: inset 0px 0px 0px 1px rgba(255, 115, 100, 0.4);
    }

/* punch
*******************************************************************************/
.button_punch
{
    background: #4162a8;
    border-top: 1px solid #38538c;
    border-right: 1px solid #1f2d4d;
    border-bottom: 1px solid #151e33;
    border-left: 1px solid #1f2d4d;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 10px 1px #5c8bee, 0px 1px 0 #1d2c4d, 0 6px 0px #1f3053, 0 8px 4px 1px #111111;
    -moz-box-shadow: inset 0 1px 10px 1px #5c8bee, 0px 1px 0 #1d2c4d, 0 6px 0px #1f3053, 0 8px 4px 1px #111111;
    -ms-box-shadow: inset 0 1px 10px 1px #5c8bee, 0px 1px 0 #1d2c4d, 0 6px 0px #1f3053, 0 8px 4px 1px #111111;
    -o-box-shadow: inset 0 1px 10px 1px #5c8bee, 0px 1px 0 #1d2c4d, 0 6px 0px #1f3053, 0 8px 4px 1px #111111;
    box-shadow: inset 0 1px 10px 1px #5c8bee, 0px 1px 0 #1d2c4d, 0 6px 0px #1f3053, 0 8px 4px 1px #111111;
    color: #fff;
    font: bold 20px "helvetica neue", helvetica, arial, sans-serif;
    line-height: 1;
    margin-bottom: 10px;
    padding: 10px 0 12px 0;
    text-align: center;
    text-shadow: 0px -1px 1px #1e2d4d;
    width: 150px;
    -webkit-background-clip: padding-box;
}

    .button_punch:hover
    {
        -webkit-box-shadow: inset 0 0px 20px 1px #87adff, 0px 1px 0 #1d2c4d, 0 6px 0px #1f3053, 0 8px 4px 1px #111111;
        -moz-box-shadow: inset 0 0px 20px 1px #87adff, 0px 1px 0 #1d2c4d, 0 6px 0px #1f3053, 0 8px 4px 1px #111111;
        -ms-box-shadow: inset 0 0px 20px 1px #87adff, 0px 1px 0 #1d2c4d, 0 6px 0px #1f3053, 0 8px 4px 1px #111111;
        -o-box-shadow: inset 0 0px 20px 1px #87adff, 0px 1px 0 #1d2c4d, 0 6px 0px #1f3053, 0 8px 4px 1px #111111;
        box-shadow: inset 0 0px 20px 1px #87adff, 0px 1px 0 #1d2c4d, 0 6px 0px #1f3053, 0 8px 4px 1px #111111;
        cursor: pointer;
    }

    .button_punch:active
    {
        -webkit-box-shadow: inset 0 1px 10px 1px #5c8bee, 0 1px 0 #1d2c4d, 0 2px 0 #1f3053, 0 4px 3px 0 #111111;
        -moz-box-shadow: inset 0 1px 10px 1px #5c8bee, 0 1px 0 #1d2c4d, 0 2px 0 #1f3053, 0 4px 3px 0 #111111;
        -ms-box-shadow: inset 0 1px 10px 1px #5c8bee, 0 1px 0 #1d2c4d, 0 2px 0 #1f3053, 0 4px 3px 0 #111111;
        -o-box-shadow: inset 0 1px 10px 1px #5c8bee, 0 1px 0 #1d2c4d, 0 2px 0 #1f3053, 0 4px 3px 0 #111111;
        box-shadow: inset 0 1px 10px 1px #5c8bee, 0 1px 0 #1d2c4d, 0 2px 0 #1f3053, 0 4px 3px 0 #111111;
        margin-top: 58px;
    }

/* purple candy
*******************************************************************************/
.button_purple-candy
{
    background-color: #9e76e8;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #9e76e8), color-stop(50%, #7038e0), color-stop(50%, #6021de), color-stop(100%, #6224de));
    background-image: -webkit-linear-gradient(top, #9e76e8 0%, #7038e0 50%, #6021de 50%, #6224de 100%);
    background-image: -moz-linear-gradient(top, #9e76e8 0%, #7038e0 50%, #6021de 50%, #6224de 100%);
    background-image: -ms-linear-gradient(top, #9e76e8 0%, #7038e0 50%, #6021de 50%, #6224de 100%);
    background-image: -o-linear-gradient(top, #9e76e8 0%, #7038e0 50%, #6021de 50%, #6224de 100%);
    background-image: linear-gradient(top, #9e76e8 0%, #7038e0 50%, #6021de 50%, #6224de 100%);
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px;
    color: #fff;
    font: bold 12px "helvetica neue", helvetica, arial, sans-serif;
    line-height: 1;
    padding: 10px 0 12px 0;
    text-align: center;
    text-shadow: 0px -1px 1px #473569;
    width: 150px;
    -webkit-background-clip: padding-box;
}

    .button_purple-candy:hover
    {
        background-color: #8d69cf;
        background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #8d69cf), color-stop(50%, #6332c7), color-stop(50%, #551dc4), color-stop(100%, #561fc4));
        background-image: -webkit-linear-gradient(top, #8d69cf 0%, #6332c7 50%, #551dc4 50%, #561fc4 100%);
        background-image: -moz-linear-gradient(top, #8d69cf 0%, #6332c7 50%, #551dc4 50%, #561fc4 100%);
        background-image: -ms-linear-gradient(top, #8d69cf 0%, #6332c7 50%, #551dc4 50%, #561fc4 100%);
        background-image: -o-linear-gradient(top, #8d69cf 0%, #6332c7 50%, #551dc4 50%, #561fc4 100%);
        background-image: linear-gradient(top, #8d69cf 0%, #6332c7 50%, #551dc4 50%, #561fc4 100%);
        -webkit-background-clip: padding-box;
        cursor: pointer;
    }

    .button_purple-candy:active
    {
        background: #4a1aab;
        background: -moz-radial-gradient(50% 31% 0deg, circle cover, rgba(38, 76, 153, 0.4), rgba(11, 23, 46, 0.4)), -moz-linear-gradient(top, #7b5cb5 0%, #572bad 50%, #4a1aab 50%, #4b1bab 100%);
        background: -webkit-gradient(radial, 50% 20%, 75, 50% 50%, 0, from(rgba(38, 76, 153, 0.4)), to(rgba(11, 23, 46, 0.4))), -webkit-gradient(linear, 0 0, 0 100%, color-stop(0, #7b5cb5), color-stop(0.5, #572bad), color-stop(0.5, #4a1aab), color-stop(1, #4b1bab));
        color: #ddd;
        -webkit-background-clip: padding-box;
    }

/* shiny blue (inspired by rdio iphone interface)
*******************************************************************************/
.button_shiny-blue
{
    background-color: #759ae9;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #759ae9), color-stop(50%, #376fe0), color-stop(50%, #1a5ad9), color-stop(100%, #2463de));
    background-image: -webkit-linear-gradient(top, #759ae9 0%, #376fe0 50%, #1a5ad9 50%, #2463de 100%);
    background-image: -moz-linear-gradient(top, #759ae9 0%, #376fe0 50%, #1a5ad9 50%, #2463de 100%);
    background-image: -ms-linear-gradient(top, #759ae9 0%, #376fe0 50%, #1a5ad9 50%, #2463de 100%);
    background-image: -o-linear-gradient(top, #759ae9 0%, #376fe0 50%, #1a5ad9 50%, #2463de 100%);
    background-image: linear-gradient(top, #759ae9 0%, #376fe0 50%, #1a5ad9 50%, #2463de 100%);
    border-top: 1px solid #1f58cc;
    border-right: 1px solid #1b4db3;
    border-bottom: 1px solid #174299;
    border-left: 1px solid #1b4db3;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 0 2px 0 rgba(57, 140, 255, 0.8);
    -moz-box-shadow: inset 0 0 2px 0 rgba(57, 140, 255, 0.8);
    -ms-box-shadow: inset 0 0 2px 0 rgba(57, 140, 255, 0.8);
    -o-box-shadow: inset 0 0 2px 0 rgba(57, 140, 255, 0.8);
    box-shadow: inset 0 0 2px 0 rgba(57, 140, 255, 0.8);
    color: #fff;
    font: bold 12px "helvetica neue", helvetica, arial, sans-serif;
    padding: 3px 4px 3px 4px;
    text-shadow: 0 -1px 1px #1a5ad9;
}

    .button_shiny-blue:hover
    {
        text-decoration: none;
        background-color: #5d89e8;
        background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #5d89e8), color-stop(50%, #2261e0), color-stop(50%, #044bd9), color-stop(100%, #0d53de));
        background-image: -webkit-linear-gradient(top, #5d89e8 0%, #2261e0 50%, #044bd9 50%, #0d53de 100%);
        background-image: -moz-linear-gradient(top, #5d89e8 0%, #2261e0 50%, #044bd9 50%, #0d53de 100%);
        background-image: -ms-linear-gradient(top, #5d89e8 0%, #2261e0 50%, #044bd9 50%, #0d53de 100%);
        background-image: -o-linear-gradient(top, #5d89e8 0%, #2261e0 50%, #044bd9 50%, #0d53de 100%);
        background-image: linear-gradient(top, #5d89e8 0%, #2261e0 50%, #044bd9 50%, #0d53de 100%);
        color: #fff;
        font: bold 12px "helvetica neue", helvetica, arial, sans-serif;
        padding: 3px 4px 3px 4px;
        text-shadow: 0 -1px 1px #1a5ad9;
        cursor: pointer;
    }

    .button_shiny-blue:active
    {
        border-top: 1px solid #1b4db3;
        border-right: 1px solid #174299;
        border-bottom: 1px solid #133780;
        border-left: 1px solid #174299;
        color: #fff;
        font: bold 12px "helvetica neue", helvetica, arial, sans-serif;
        padding: 3px 4px 3px 4px;
        text-shadow: 0 -1px 1px #1a5ad9;
        -webkit-box-shadow: inset 0 0 5px 2px #1a47a0, 0 1px 0 #eeeeee;
        -moz-box-shadow: inset 0 0 5px 2px #1a47a0, 0 1px 0 #eeeeee;
        -ms-box-shadow: inset 0 0 5px 2px #1a47a0, 0 1px 0 #eeeeee;
        -o-box-shadow: inset 0 0 5px 2px #1a47a0, 0 1px 0 #eeeeee;
        box-shadow: inset 0 0 5px 2px #1a47a0, 0 1px 0 #eeeeee;
    }

/* download itunes
   I wrote a blog post about creating this button:
   http://robots.thoughtbot.com/post/2718077289/make-css3-buttons-like-a-boss
*******************************************************************************/
.button_download-itunes
{
    background-color: #52a8e8;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #52a8e8), color-stop(100%, #377ad0));
    background-image: -webkit-linear-gradient(top, #52a8e8, #377ad0);
    background-image: -moz-linear-gradient(top, #52a8e8, #377ad0);
    background-image: -ms-linear-gradient(top, #52a8e8, #377ad0);
    background-image: -o-linear-gradient(top, #52a8e8, #377ad0);
    background-image: linear-gradient(top, #52a8e8, #377ad0);
    border-top: 1px solid #4081af;
    border-right: 1px solid #2e69a3;
    border-bottom: 1px solid #20559a;
    border-left: 1px solid #2e69a3;
    -webkit-border-radius: 16px;
    -moz-border-radius: 16px;
    -ms-border-radius: 16px;
    -o-border-radius: 16px;
    border-radius: 16px;
    -webkit-box-shadow: inset 0 1px 0 0 #72b9eb, 0 1px 2px 0 #b3b3b3;
    -moz-box-shadow: inset 0 1px 0 0 #72b9eb, 0 1px 2px 0 #b3b3b3;
    -ms-box-shadow: inset 0 1px 0 0 #72b9eb, 0 1px 2px 0 #b3b3b3;
    -o-box-shadow: inset 0 1px 0 0 #72b9eb, 0 1px 2px 0 #b3b3b3;
    box-shadow: inset 0 1px 0 0 #72b9eb, 0 1px 2px 0 #b3b3b3;
    color: #fff;
    font: normal 11px "lucida grande", sans-serif;
    line-height: 1;
    padding: 3px 5px;
    text-align: center;
    text-shadow: 0 -1px 1px #3275bc;
    width: 112px;
    -webkit-background-clip: padding-box;
}

    .button_download-itunes:hover
    {
        background-color: #3e9ee5;
        background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #3e9ee5), color-stop(100%, #206bcb));
        background-image: -webkit-linear-gradient(top, #3e9ee5 0%, #206bcb 100%);
        background-image: -moz-linear-gradient(top, #3e9ee5 0%, #206bcb 100%);
        background-image: -ms-linear-gradient(top, #3e9ee5 0%, #206bcb 100%);
        background-image: -o-linear-gradient(top, #3e9ee5 0%, #206bcb 100%);
        background-image: linear-gradient(top, #3e9ee5 0%, #206bcb 100%);
        border-top: 1px solid #2a73a6;
        border-right: 1px solid #165899;
        border-bottom: 1px solid #07428f;
        border-left: 1px solid #165899;
        -webkit-box-shadow: inset 0 1px 0 0 #62b1e9;
        -moz-box-shadow: inset 0 1px 0 0 #62b1e9;
        -ms-box-shadow: inset 0 1px 0 0 #62b1e9;
        -o-box-shadow: inset 0 1px 0 0 #62b1e9;
        box-shadow: inset 0 1px 0 0 #62b1e9;
        cursor: pointer;
        text-shadow: 0 -1px 1px #1d62ab;
        -webkit-background-clip: padding-box;
    }

    .button_download-itunes:active
    {
        background: #3282d3;
        border: 1px solid #154c8c;
        border-bottom: 1px solid #0e408e;
        -webkit-box-shadow: inset 0 0 6px 3px #1657b5, 0 1px 0 0 white;
        -moz-box-shadow: inset 0 0 6px 3px #1657b5, 0 1px 0 0 white;
        -ms-box-shadow: inset 0 0 6px 3px #1657b5, 0 1px 0 0 white;
        -o-box-shadow: inset 0 0 6px 3px #1657b5, 0 1px 0 0 white;
        box-shadow: inset 0 0 6px 3px #1657b5, 0 1px 0 0 white;
        text-shadow: 0 -1px 1px #2361a4;
        -webkit-background-clip: padding-box;
    }

button[disabled].download-itunes, button[disabled].download-itunes:hover, button[disabled].download-itunes:active
{
    background-color: #dadada;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #dadada), color-stop(100%, #f3f3f3));
    background-image: -webkit-linear-gradient(top, #dadada, #f3f3f3);
    background-image: -moz-linear-gradient(top, #dadada, #f3f3f3);
    background-image: -ms-linear-gradient(top, #dadada, #f3f3f3);
    background-image: -o-linear-gradient(top, #dadada, #f3f3f3);
    background-image: linear-gradient(top, #dadada, #f3f3f3);
    border-top: 1px solid #c5c5c5;
    border-right: 1px solid #cecece;
    border-bottom: 1px solid #d9d9d9;
    border-left: 1px solid #cecece;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    -ms-box-shadow: none;
    -o-box-shadow: none;
    box-shadow: none;
    color: #8f8f8f;
    cursor: not-allowed;
    text-shadow: 0 -1px 1px #ebebeb;
}

.button_download-itunes::-moz-focus-inner
{
    border: 0;
    padding: 0;
}

/* skip (inspired by okcupid iphone interface)
*******************************************************************************/
.button_skip
{
    background-color: #8c9cbf;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #8c9cbf), color-stop(50%, #546a9e), color-stop(50%, #36518f), color-stop(100%, #3d5691));
    background-image: -webkit-linear-gradient(top, #8c9cbf 0%, #546a9e 50%, #36518f 50%, #3d5691 100%);
    background-image: -moz-linear-gradient(top, #8c9cbf 0%, #546a9e 50%, #36518f 50%, #3d5691 100%);
    background-image: -ms-linear-gradient(top, #8c9cbf 0%, #546a9e 50%, #36518f 50%, #3d5691 100%);
    background-image: -o-linear-gradient(top, #8c9cbf 0%, #546a9e 50%, #36518f 50%, #3d5691 100%);
    background-image: linear-gradient(top, #8c9cbf 0%, #546a9e 50%, #36518f 50%, #3d5691 100%);
    border: 1px solid #172d6e;
    border-bottom: 1px solid #0e1d45;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    border-radius: 5px;
    -webkit-box-shadow: inset 0 1px 0 0 #b1b9cb;
    -moz-box-shadow: inset 0 1px 0 0 #b1b9cb;
    -ms-box-shadow: inset 0 1px 0 0 #b1b9cb;
    -o-box-shadow: inset 0 1px 0 0 #b1b9cb;
    box-shadow: inset 0 1px 0 0 #b1b9cb;
    color: #fff;
    font: bold 16px "helvetica neue", helvetica, arial, sans-serif;
    padding: 7px 0 8px 0;
    text-decoration: none;
    text-align: center;
    text-shadow: 0 -1px 1px #000f4d;
    width: 150px;
}

    .button_skip:hover
    {
        background-color: #7f8dad;
        background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #7f8dad), color-stop(50%, #4a5e8c), color-stop(50%, #2f477d), color-stop(100%, #364c80));
        background-image: -webkit-linear-gradient(top, #7f8dad 0%, #4a5e8c 50%, #2f477d 50%, #364c80 100%);
        background-image: -moz-linear-gradient(top, #7f8dad 0%, #4a5e8c 50%, #2f477d 50%, #364c80 100%);
        background-image: -ms-linear-gradient(top, #7f8dad 0%, #4a5e8c 50%, #2f477d 50%, #364c80 100%);
        background-image: -o-linear-gradient(top, #7f8dad 0%, #4a5e8c 50%, #2f477d 50%, #364c80 100%);
        background-image: linear-gradient(top, #7f8dad 0%, #4a5e8c 50%, #2f477d 50%, #364c80 100%);
        cursor: pointer;
    }

    .button_skip:active
    {
        -webkit-box-shadow: inset 0 0 20px 0 #1d2845, 0 1px 0 white;
        -moz-box-shadow: inset 0 0 20px 0 #1d2845, 0 1px 0 white;
        -ms-box-shadow: inset 0 0 20px 0 #1d2845, 0 1px 0 white;
        -o-box-shadow: inset 0 0 20px 0 #1d2845, 0 1px 0 white;
        box-shadow: inset 0 0 20px 0 #1d2845, 0 1px 0 white;
    }

/* minimal indent (inspired by okcupid iphone interface)
*******************************************************************************/
div.indent
{
    background-color: #e2e2e2;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #e2e2e2), color-stop(100%, #fafafa));
    background-image: -webkit-linear-gradient(top, #e2e2e2, #fafafa);
    background-image: -moz-linear-gradient(top, #e2e2e2, #fafafa);
    background-image: -ms-linear-gradient(top, #e2e2e2, #fafafa);
    background-image: -o-linear-gradient(top, #e2e2e2, #fafafa);
    background-image: linear-gradient(top, #e2e2e2, #fafafa);
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    -ms-border-radius: 8px;
    -o-border-radius: 8px;
    border-radius: 8px;
    margin: 50px auto 0;
    padding: 10px 0;
    width: 170px;
}

.button_minimal-indent
{
    background-color: #f3f3f3;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f3f3f3), color-stop(50%, #dddddd), color-stop(50%, #d2d2d2), color-stop(100%, #dfdfdf));
    background-image: -webkit-linear-gradient(top, #f3f3f3 0%, #dddddd 50%, #d2d2d2 50%, #dfdfdf 100%);
    background-image: -moz-linear-gradient(top, #f3f3f3 0%, #dddddd 50%, #d2d2d2 50%, #dfdfdf 100%);
    background-image: -ms-linear-gradient(top, #f3f3f3 0%, #dddddd 50%, #d2d2d2 50%, #dfdfdf 100%);
    background-image: -o-linear-gradient(top, #f3f3f3 0%, #dddddd 50%, #d2d2d2 50%, #dfdfdf 100%);
    background-image: linear-gradient(top, #f3f3f3 0%, #dddddd 50%, #d2d2d2 50%, #dfdfdf 100%);
    border-right: 1px solid #dfdfdf;
    border-bottom: 1px solid #b4b4b4;
    border-right: 1px solid #dfdfdf;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    border-radius: 5px;
    -webkit-box-shadow: inset 0 1px 0 0 white, 0 1px 0 0 #d5d5d5, 0 -1px 2px 1px #efefef;
    -moz-box-shadow: inset 0 1px 0 0 white, 0 1px 0 0 #d5d5d5, 0 -1px 2px 1px #efefef;
    -ms-box-shadow: inset 0 1px 0 0 white, 0 1px 0 0 #d5d5d5, 0 -1px 2px 1px #efefef;
    -o-box-shadow: inset 0 1px 0 0 white, 0 1px 0 0 #d5d5d5, 0 -1px 2px 1px #efefef;
    box-shadow: inset 0 1px 0 0 white, 0 1px 0 0 #d5d5d5, 0 -1px 2px 1px #efefef;
    color: #666;
    font: bold 16px "helvetica neue", helvetica, arial, sans-serif;
    margin: 0;
    padding: 7px 0;
    text-shadow: 0 1px 1px #fff;
    width: 150px;
}

    .button_minimal-indent:hover
    {
        background-color: #e5e5e5;
        background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #e5e5e5), color-stop(50%, #d1d1d1), color-stop(50%, #c4c4c4), color-stop(100%, #b8b8b8));
        background-image: -webkit-linear-gradient(top, #e5e5e5 0%, #d1d1d1 50%, #c4c4c4 50%, #b8b8b8 100%);
        background-image: -moz-linear-gradient(top, #e5e5e5 0%, #d1d1d1 50%, #c4c4c4 50%, #b8b8b8 100%);
        background-image: -ms-linear-gradient(top, #e5e5e5 0%, #d1d1d1 50%, #c4c4c4 50%, #b8b8b8 100%);
        background-image: -o-linear-gradient(top, #e5e5e5 0%, #d1d1d1 50%, #c4c4c4 50%, #b8b8b8 100%);
        background-image: linear-gradient(top, #e5e5e5 0%, #d1d1d1 50%, #c4c4c4 50%, #b8b8b8 100%);
        -webkit-box-shadow: inset 0 1px 0 0 #f2f2f2, 0 1px 0 0 #c9c9c9, 0 -1px 2px 1px #e3e3e3;
        -moz-box-shadow: inset 0 1px 0 0 #f2f2f2, 0 1px 0 0 #c9c9c9, 0 -1px 2px 1px #e3e3e3;
        -ms-box-shadow: inset 0 1px 0 0 #f2f2f2, 0 1px 0 0 #c9c9c9, 0 -1px 2px 1px #e3e3e3;
        -o-box-shadow: inset 0 1px 0 0 #f2f2f2, 0 1px 0 0 #c9c9c9, 0 -1px 2px 1px #e3e3e3;
        box-shadow: inset 0 1px 0 0 #f2f2f2, 0 1px 0 0 #c9c9c9, 0 -1px 2px 1px #e3e3e3;
    }

    .button_minimal-indent:active
    {
        -webkit-box-shadow: inset 0 0 30px 0 #999999, 0 1px 0 0 white;
        -moz-box-shadow: inset 0 0 30px 0 #999999, 0 1px 0 0 white;
        -ms-box-shadow: inset 0 0 30px 0 #999999, 0 1px 0 0 white;
        -o-box-shadow: inset 0 0 30px 0 #999999, 0 1px 0 0 white;
        box-shadow: inset 0 0 30px 0 #999999, 0 1px 0 0 white;
    }

/* webkit badge
*******************************************************************************/
.button_webkit-badge
{
    background: -webkit-gradient(linear, 0 0, 0 100%, color-stop(0, #ee432e), color-stop(0.5, #c63929), color-stop(0.5, #b51700), color-stop(1, #891100));
    color: #fff;
    font-family: "hoefler text", georgia, serif;
    font-size: 30px;
    font-style: italic;
    font-weight: lighter;
    height: 88px;
    line-height: 1;
    padding: 0;
    text-align: center;
    text-shadow: 0px -1px 1px #3d0700;
    width: 150px;
    -webkit-mask-image: url("../images/badge.png");
    -webkit-mask-position: left top;
    -webkit-mask-repeat: no-repeat;
}

    .button_webkit-badge:hover
    {
        background: -webkit-gradient(linear, 0 0, 0 100%, color-stop(0, #f37873), color-stop(0.5, #db504d), color-stop(0.5, #cb0500), color-stop(1, #a20601));
        cursor: pointer;
    }

    .button_webkit-badge:active
    {
        background: -webkit-gradient(linear, 0 0, 0 100%, color-stop(0, #d43c28), color-stop(0.5, #ad3224), color-stop(0.5, #9c1500), color-stop(1, #700d00));
    }

/* webkit seal
*******************************************************************************/
.button_webkit-seal
{
    background: -webkit-gradient(linear, 0 0, 0 100%, color-stop(0, #9e76e8), color-stop(1, #6224de));
    color: #fff;
    height: 90px;
    color: #fff;
    font-family: "helvetica neue", helvetica, arial, sans-serif;
    font-size: 13px;
    font-weight: bold;
    line-height: 1;
    padding: 0;
    text-align: center;
    text-shadow: 0px -1px 1px #473569;
    width: 150px;
    -webkit-mask-image: url("../images/seal.png");
    -webkit-mask-position: center center;
    -webkit-mask-repeat: no-repeat;
}

    .button_webkit-seal:hover
    {
        background: -webkit-gradient(linear, 0 0, 0 100%, color-stop(0, #8d69cf), color-stop(1, #561fc4));
        cursor: pointer;
    }

    .button_webkit-seal:active
    {
        background: -webkit-gradient(radial, 50% 50%, 40, 50% 50%, 0, from(rgba(38, 76, 153, 0.2)), to(rgba(11, 23, 46, 0.2))), -webkit-gradient(linear, 0 0, 0 100%, color-stop(0, #7b5cb5), color-stop(1, #4b1bab));
    }

/* webkit check
*******************************************************************************/
.button_webkit-check
{
    background: -webkit-gradient(linear, 0 0, 0 100%, color-stop(0, #779be9), color-stop(1, #2463de));
    color: #fff;
    height: 88px;
    line-height: 1;
    padding: 0;
    text-align: center;
    text-indent: -9999px;
    text-shadow: 0px -1px 1px #3d0700;
    width: 150px;
    -webkit-mask-image: url("../images/check.png");
    -webkit-mask-position: center center;
    -webkit-mask-repeat: no-repeat;
}

    .button_webkit-check:hover
    {
        background: -webkit-gradient(linear, 0 0, 0 100%, color-stop(0, #6989cf), color-stop(1, #1d55c4));
        cursor: pointer;
    }

    .button_webkit-check:active
    {
        background: -webkit-gradient(linear, 0 0, 0 100%, color-stop(0, #5c78b5), color-stop(1, #1b4bab));
    }

/* disabled button styles
   works with this markup: <button disabled="disabled">Submit</button>
*******************************************************************************/
button[disabled], button[disabled]:hover, button[disabled]:active
{
    background: #999;
    border: 0;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    -ms-box-shadow: none;
    -o-box-shadow: none;
    box-shadow: none;
    color: #aaa;
    cursor: not-allowed;
    text-shadow: none;
}

.button-collection
{
    border-top: 2px solid #ccc;
    margin: 24px 0 36px 0;
    padding: 4px 0 12px 0;
}

.button-info
{
    float: left;
    margin: 0 40px 0 0;
    width: 245px;
}

    .button-info h2
    {
        color: #222;
        font-size: 22px;
        font-weight: normal;
        margin: 10px 0 6px 0;
    }

    .button-info p
    {
        font-size: 14px;
    }

button
{
    margin-top: 60px;
}

.button_webkit-badge
{
    margin-top: 32px;
}

.button_webkit-check
{
    margin-top: 30px;
}

.button_webkit-seal
{
    margin-top: 30px;
}

.button_cupid-green
{
    margin-top: 62px;
}

.button_cupid-blue
{
    margin-top: 64px;
}

.button_blue-pill
{
    margin-top: 62px;
}

.button_thoughtbot
{
    margin-top: 54px;
}

.button_punch
{
    margin-top: 54px;
}

.button_fat-letters
{
    margin-top: 20px;
}

.button_download-itunes
{
    margin-top: 62px;
}

/* Clear Floated Elements
------------------------------------------------------------------------------*/
.column:after, .button-collection:after, .clearfix:after
{
    clear: both;
    content: ' ';
    display: block;
    font-size: 0;
    line-height: 0;
    visibility: hidden;
    width: 0;
    height: 0;
}