.button {
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    padding: 12px 24px;
    border: 1px solid #b37700;
    border-radius: 8px;
    background: #ffea00;
    background: -webkit-gradient(linear, left top, left bottom, from(#ffea00), to(#b3b300));
    background: -moz-linear-gradient(top, #ffea00, #b3b300);
    background: linear-gradient(to bottom, #ffea00, #b3b300);
    -webkit-box-shadow: #ffff00 0px 0px 40px 0px;
    -moz-box-shadow: #ffff00 0px 0px 40px 0px;
    box-shadow: #ffff00 0px 0px 40px 0px;
    text-shadow: #ffff00 1px 1px 1px;
    font: normal normal bold 15px arial;
    color: #111111;
    text-decoration: none;
}
.button:hover,
.button:focus {
    border: 1px solid #e99b00;
    background: #ffff00;
    background: -webkit-gradient(linear, left top, left bottom, from(#ffff00), to(#d7d700));
    background: -moz-linear-gradient(top, #ffff00, #d7d700);
    background: linear-gradient(to bottom, #ffff00, #d7d700);
    color: #111111;
    text-decoration: none;
}
.button:active {
    background: #b3a400;
    background: -webkit-gradient(linear, left top, left bottom, from(#b3a400), to(#b3b300));
    background: -moz-linear-gradient(top, #b3a400, #b3b300);
    background: linear-gradient(to bottom, #b3a400, #b3b300);
}
.button:before{
    content:  "\0000a0";
    display: inline-block;
    height: 24px;
    width: 24px;
    line-height: 24px;
    margin: 0 4px -6px -4px;
    position: relative;
    top: 0px;
    left: 0px;
    background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAACXBIWXMAAA7EAAAOxAGVKw4bAAABRUlEQVRIie2VvUoDURCFP2IIYm0hqYNY5CFSiMIiil0KsU6ZSvICIj5AShGxTCGkDbJVsE5pI/ayGDshhFjMWVjC/syupBA8MOzl3jPnzP0ZFv46tpy8BnAMDIBzYAm861sZ20AA3AMRsFqLT+ABOAF2qoh+pIhmReQx65cUzTPrx6K1hMEZsOvdahWEwJQNHlGoiNFVckj2JYcad707SBpMgFegjj3TALhTBJqrizOpYvAFDB15Q3FTUctawM5y7jCYY8+7tMEb0HYYtLGuLjT4VsQYA0fAfo74gThjRyHsKWI0sac6W5tPrs/EaXoM0tDBLjACrrHXE2gcaa1TVRys8hHZDTbiF9VfYs20AJ6AHnCo6GluIc5FWfErVfgMtHJ4LXFWynHhFPuRPGLdWoSGuEvlFuIWeHGKJ02mwE2JnH8YfgDr3H5jv9dI+gAAAABJRU5ErkJggg==") no-repeat left center transparent;
    background-size: 100% 100%;
}



.buttonPro {
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    padding: 12px 24px;
    border: 1px solid #d90000;
    border-radius: 8px;
    background: #ff0000;
    background: -webkit-gradient(linear, left top, left bottom, from(#ff0000), to(#d90000));
    background: -moz-linear-gradient(top, #ff0000, #d90000);
    background: linear-gradient(to bottom, #ff0000, #d90000);
    -webkit-box-shadow: #ff0000 0px 0px 40px 0px;
    -moz-box-shadow: #ff0000 0px 0px 40px 0px;
    box-shadow: #ff0000 0px 0px 40px 0px;
    text-shadow: #800000 1px 1px 1px;
    font: normal normal bold 15px arial;
    color: #ffffff;
    text-decoration: none;
}
.buttonPro:hover,
.buttonPro:focus {
    border: 1px solid #ff0000;
    background: #ff0000;
    background: -webkit-gradient(linear, left top, left bottom, from(#ff0000), to(#ff0000));
    background: -moz-linear-gradient(top, #ff0000, #ff0000);
    background: linear-gradient(to bottom, #ff0000, #ff0000);
    color: #ffffff;
    text-decoration: none;
}
.buttonPro:active {
    background: #d90000;
    background: -webkit-gradient(linear, left top, left bottom, from(#d90000), to(#d90000));
    background: -moz-linear-gradient(top, #d90000, #d90000);
    background: linear-gradient(to bottom, #d90000, #d90000);
}
.buttonPro:before{
    content:  "\0000a0";
    display: inline-block;
    height: 24px;
    width: 24px;
    line-height: 24px;
    margin: 0 4px -6px -4px;
    position: relative;
    top: 0px;
    left: 0px;
    background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAACXBIWXMAAA7EAAAOxAGVKw4bAAABgklEQVRIie3Tv0tVYRzH8Vd5aTAJkTs5NDmIkIqUQ7goEoJjDRH0D4iDg4M0uPs3hFCIgzQ1hEKENEjDVVAkkEQIxMHigiiYUqHDcy4eHs/pXq+3IegD3+E85zzv74/z+fJfDVIzxrGNl+hsFLgFE9jFWSpOsYC+64AnsReB4/iJdxioFdyKKXyvAs6KjxjBzSxwG6brBMdRwhMUKvAJlBsAjuMz+pqwhdvowa1aZ1lFq9jEl/ThXbwWfly9Ve/gmTCeMQxnZe/F4hXBZWHUzSlObgLCqB5hrQr4CDMouuyeMQxnWgpv0YVBPMfX6P0vvMI9wZ7vBSdWVMAoHud1UEoq3MZTF4tXFharF/1Yxu/k22Lqfit+YL9agrS3h4QZd+JNClyJYsToRkdBtr5Fz/eFMawm1cd2PsRJdDaCg7wOilhRm4P28TCD8QGzeQkkVb6Qv+WnmEd7zv1PmLvxpwyJ7gjtPkg6Oxa2dMlld6W1ga1aEtSrHaz/zQRdQrf/uM4BPeC2RnDBi8UAAAAASUVORK5CYII=") no-repeat left center transparent;
    background-size: 100% 100%;
}


.buttonPu {
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    padding: 12px 24px;
    border: 1px solid #0000e6;
    border-radius: 8px;
    background: #0000ff;
    background: -webkit-gradient(linear, left top, left bottom, from(#0000ff), to(#0000e6));
    background: -moz-linear-gradient(top, #0000ff, #0000e6);
    background: linear-gradient(to bottom, #0000ff, #0000e6);
    -webkit-box-shadow: #0000ff 0px 0px 40px 0px;
    -moz-box-shadow: #0000ff 0px 0px 40px 0px;
    box-shadow: #0000ff 0px 0px 40px 0px;
    text-shadow: #000080 1px 1px 1px;
    font: normal normal bold 15px arial;
    color: #ffffff;
    text-decoration: none;
}
.buttonPu:hover,
.buttonPu:focus {
    border: 1px solid #0000ff;
    background: #0000ff;
    background: -webkit-gradient(linear, left top, left bottom, from(#0000ff), to(#0000ff));
    background: -moz-linear-gradient(top, #0000ff, #0000ff);
    background: linear-gradient(to bottom, #0000ff, #0000ff);
    color: #ffffff;
    text-decoration: none;
}
.buttonPu:active {
    background: #0000e6;
    background: -webkit-gradient(linear, left top, left bottom, from(#0000e6), to(#0000e6));
    background: -moz-linear-gradient(top, #0000e6, #0000e6);
    background: linear-gradient(to bottom, #0000e6, #0000e6);
}
.buttonPu:before{
    content:  "\0000a0";
    display: inline-block;
    height: 24px;
    width: 24px;
    line-height: 24px;
    margin: 0 4px -6px -4px;
    position: relative;
    top: 0px;
    left: 0px;
    background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAACXBIWXMAAAsTAAALEwEAmpwYAAADTElEQVRIic2VTWhcVRTHf+ee+2YmmZlkJg1NnWcanAYTLLgoUgMV68p9QQwIgqIrXQiCXdQKFRdV1IqLbCRmEaotbiJUSTSNH11omtqKYkpJatOB1MaEjCGTaZrOzHsuJubNpEkm+AEeODx499z/751zz7kP/mOTrRYffGi//0/Ef/5hTGytoNP9fdy8OcPc3Ayzs3Ncz2T4I5sF4ODBxzh27HWWnfmqPTvbY8jcbgBqAlzXJZFI0Nrqks/fYt++Jaanp7l06Ufi8Tie522539QCbGTJZBNdXV00NDQSidT9+wCAaDRKKnUPrpv6+4DWfKkmKJ1Oo1ZRR7GOxToW1UB2S8Chq78wcvR4zTqrGqy1qFWso5jtAtTzSPX28O2LhykWCpvHWcU6Bmc1C1XdHgDg4Qc62T98hgvPvMBKfnnt/cmTH5FIJNcAai02VPbKDCxAvzq5UKkQWy8eKhXA82jfkyb20wW+ePo5Uu+/A+Fyd3d0dNLd/SShekWtYoxBRHDCynIlQHzfdu/dC7ZiLIwBz4OZGZidZVc6zaFrVxl49nmKrx1lYOBTzp//nhMn3sOJ2HLtDSCCOsEFESgWi/jj42x2nGZykoa2Np7KZPjk1SN88Na7a2uRmMVaRYwBARsOAEGxlpZYABaA7KovVHgWmM9kcFyXx/M5iq+8zK2FXFlEDUa13E1aLtXdGSwukgWKm2QA0CFC4cYNztZHkTfepD4RB0CtYOwqyIAJmqgCcPs2e6LRu0Rz+Ty/Ae1Azvc5E4sjx99m5/1tQRlCoLbsRgUNrQP4IsVThaJHofr7HTBPiJD2fWaBkXiCxp4ewi1NABVtSjkDC6qCUb8acC796A42mIkD184tr5QKTIvhu+QO3L4+ws0NJJNNrKzcYWhokFwuhzQajAlcZB2gd3LkzkY1P6AOl8Uw3pKi8/TH7Eq3kcstMjo6ysTEJBfnP8dLFHGc8jWhahAjiPGqAZuZD1zefR+PDA1ScoSxsTGmpqY4O9WP53vYOsVoJBAWQQSQbQKuNKd46ZsRJq7/yvBXw1zMfoYYwYYUow6mQhgq/r9+cMpbAr68twV3cICvf+8FA3XNf+VVPY7+umfZorUBnsCHfafWgv+X9ie6CflHyA3wTAAAAABJRU5ErkJggg==") no-repeat left center transparent;
    background-size: 100% 100%;
}