/* Smooth */
/*------------------------------------------------------------------------------------------------------------------------------------
Fixes
------------------------------------------------------------------------------------------------------------------------------------*/
button.simpleBTN::-moz-focus-inner, input.simpleBTN::-moz-focus-inner{border:none; padding:0}/*Remove extra padding in firefox*/
/*------------------------------------------------------------------------------------------------------------------------------------
UNIVERSAL PROPERTIES
------------------------------------------------------------------------------------------------------------------------------------*/
.simpleBTN{
    /*Prepare Button*/
    cursor:pointer;
    display:block; /*Compatability*/
    display:inline-block;
    margin:0px;
    outline:none;
    position:relative;
    padding:6px 12px;
    text-align:center;
    text-decoration:none;
    overflow:visible; /*IE 6,7  padding fix*/
    white-space:nowrap;
/*------------------------------------------------------------------------------------------------------------------------------------
BUTTON STYLE (Normal)
------------------------------------------------------------------------------------------------------------------------------------*/
    /*Text*/
    color:#FFF; /*Compatability*/
    font-size:14px;
    font-family:Verdana, Geneva, sans-serif;
    font-weight:bold;
    text-shadow:#555 -1px -1px 0px; /*rgba color causes chrome to have jagged text*/
    
    /*Border*/
    border:1px solid;
    border-color:#333; /*Compatability*/
    border-color:rgba(0, 0, 0, .4);
    
    /*Shadow and Highlights*/   
    -moz-box-shadow:
        0px 1px 2px rgba(0, 0, 0, .2), /*Shadow*/
    ;
    -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, .2); /*Safari 4 & Chrome 5 compatability issue ('inset')*/
    -webkit-box-shadow:
        0px 1px 2px rgba(0, 0, 0, .2), /*Shadow*/
    ;
    box-shadow:
        0px 1px 1px rgba(0, 0, 0, .2), /*Shadow*/
    ;
    
    /*IE Gradient*/
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#55ffffff', endColorstr='#00ffffff');
}
/*------------------------------------------------------------------------------------------------------------------------------------
GRADIENTS / COLORS
------------------------------------------------------------------------------------------------------------------------------------*/
/*-------------------- GREEN --------------------*/
.simpleBTN.green{   
    /*Button Color*/
    background: -moz-linear-gradient(top, #8dd300, #368200) no-repeat;
    background: -webkit-gradient(linear, center top, center bottom, from(#8dd300), to(#368200)) no-repeat;  
    background-color:#3ba100;/*Compatability*/
    color: white;
}
.simpleBTN.green:hover{
    /*Button Color*/
    background: -moz-linear-gradient(top, #8dd300, #409900) no-repeat;
    background: -webkit-gradient(linear, center top, center bottom, from(#8dd300), to(#409900)) no-repeat;
    background-color:#40af00;/*Compatability*/
}
.simpleBTN.green:active{
    /*Button Color*/
    background:#447e00;
}
/*-------------------- RED --------------------*/
.simpleBTN.red{
    background: -moz-linear-gradient(top, #f05c00, #ab0000) no-repeat;
    background: -webkit-gradient(linear, center top, center bottom, from(#f05c00), to(#ab0000)) no-repeat;  
    background-color:#c10000;
    color: white !important;
}
.simpleBTN.red:hover{
    background: -moz-linear-gradient(top, #f05c00, #c50000) no-repeat;
    background: -webkit-gradient(linear, center top, center bottom, from(#f05c00), to(#c50000)) no-repeat;
    background-color:#d00000;
}
.simpleBTN.red:active{
    background:#8d0000;
}
/*-------------------- ORANGE --------------------*/
.simpleBTN.orange{
    background: -moz-linear-gradient(top, #efb400, #d45800) no-repeat;
    background: -webkit-gradient(linear, center top, center bottom, from(#efb400), to(#d45800)) no-repeat;  
    background-color:#e07800;
    color: white !important;
}
.simpleBTN.orange:hover{
    background: -moz-linear-gradient(top, #efb400, #e47b00) no-repeat;
    background: -webkit-gradient(linear, center top, center bottom, from(#efb400), to(#e47b00)) no-repeat;
    background-color:#e47b00;
}
.simpleBTN.orange:active{
    background:#b56600;
}
/*-------------------- PURPLE --------------------*/
.simpleBTN.purple{
    background: -moz-linear-gradient(top, #d000fa, #6d00ba) no-repeat;
    background: -webkit-gradient(linear, center top, center bottom, from(#d000fa), to(#6d00ba)) no-repeat;  
    background-color:#8000d0;
    color: white !important;
}
.simpleBTN.purple:hover{
    background: -moz-linear-gradient(top, #d000fa, #8a00cf) no-repeat;
    background: -webkit-gradient(linear, center top, center bottom, from(#d000fa), to(#8a00cf)) no-repeat;
    background-color:#8a00e0;
}
.simpleBTN.purple:active{
    background:#6f00a2;
}
/*-------------------- PINK --------------------*/
.simpleBTN.pink{
    background: -moz-linear-gradient(top, #ef36b9, #a7007e) no-repeat;
    background: -webkit-gradient(linear, center top, center bottom, from(#ef36b9), to(#a7007e)) no-repeat;  
    background-color:#c1009a;
    color: white !important;
}
.simpleBTN.pink:hover{
    background: -moz-linear-gradient(top, #ef36b9, #c70096) no-repeat;
    background: -webkit-gradient(linear, center top, center bottom, from(#ef36b9), to(#c70096)) no-repeat;
    background-color:#ce00a4;
}
.simpleBTN.pink:active{
    background:#a20072;
}
/*-------------------- BLUE --------------------*/
.simpleBTN.blue{
    background: -moz-linear-gradient(top, #00a9e1, #0049af) no-repeat;
    background: -webkit-gradient(linear, center top, center bottom, from(#00a9e1), to(#0049af)) no-repeat;  
    background-color:#006ebd;
    color: white !important;
}
.simpleBTN.blue:hover{
    background: -moz-linear-gradient(top, #00a9e1, #0067cb) no-repeat;
    background: -webkit-gradient(linear, center top, center bottom, from(#00a9e1), to(#0067cb)) no-repeat;
    background-color:#0077cc;
}
.simpleBTN.blue:active{
    background:#005094;
}
/*-------------------- TEAL --------------------*/
.simpleBTN.teal{
    background: -moz-linear-gradient(top, #00bfbf, #006c7d) no-repeat;
    background: -webkit-gradient(linear, center top, center bottom, from(#00bfbf), to(#006d77)) no-repeat;  
    background-color:#007e97;
    color: white !important;
}
.simpleBTN.teal:hover{
    background: -moz-linear-gradient(top, #00bfbf, #007d88) no-repeat;
    background: -webkit-gradient(linear, center top, center bottom, from(#00bfbf), to(#007d88)) no-repeat;
    background-color:#008ba6;
}
.simpleBTN.teal:active{
    background:#005f72;
}
/*-------------------- BLACK --------------------*/
.simpleBTN.black{
    background: -moz-linear-gradient(top, #555555, #222222) no-repeat;
    background: -webkit-gradient(linear, center top, center bottom, from(#555555), to(#222222)) no-repeat;  
    background-color:#333333;
    color: white !important;
    /*Color Specific*/
    text-shadow:none;
}
.simpleBTN.black:hover{
    background: -moz-linear-gradient(top, #555555, #333333) no-repeat;
    background: -webkit-gradient(linear, center top, center bottom, from(#555555), to(#333333)) no-repeat;
    background-color:#444444;
}
.simpleBTN.black:active{
    background:#111111;
}
/*-------------------- GREY --------------------*/
.simpleBTN.grey{
    background: -moz-linear-gradient(top, #999999, #444444) no-repeat;
    background: -webkit-gradient(linear, center top, center bottom, from(#999999), to(#444444)) no-repeat;  
    background-color:#666666;
    color: white !important;
}
.simpleBTN.grey:hover{
    background: -moz-linear-gradient(top, #999999, #666666) no-repeat;
    background: -webkit-gradient(linear, center top, center bottom, from(#999999), to(#666666)) no-repeat;
    background-color:#777777;
}
.simpleBTN.grey:active{
    background:#555555;
}
/*-------------------- GRAY --------------------*/
.simpleBTN.gray{
    background: -moz-linear-gradient(top, #999999, #444444) no-repeat;
    background: -webkit-gradient(linear, center top, center bottom, from(#999999), to(#444444)) no-repeat;  
    background-color:#666666;
    color: white !important;
}
.simpleBTN.gray:hover{
    background: -moz-linear-gradient(top, #999999, #666666) no-repeat;
    background: -webkit-gradient(linear, center top, center bottom, from(#999999), to(#666666)) no-repeat;
    background-color:#777777;
}
.simpleBTN.gray:active{
    background:#555555;
}
/*-------------------- WHITE --------------------*/
.simpleBTN.white{
    background: -moz-linear-gradient(top, #f1f1f1, #c1c1c1) no-repeat;
    background: -webkit-gradient(linear, center top, center bottom, from(#f1f1f1), to(#c1c1c1)) no-repeat;  
    background-color:#dddddd;
    /*Color Specific*/
    color:#333 !important;
    text-shadow:#EEE 1px 1px 0px;
}
.simpleBTN.white:hover{
    background: -moz-linear-gradient(top, #f1f1f1, #d1d1d1) no-repeat;
    background: -webkit-gradient(linear, center top, center bottom, from(#f1f1f1), to(#d1d1d1)) no-repeat;
    background-color:#eeeeee;
    /*Color Specific*/
    color:#333 !important;
}
.simpleBTN.white:active{
    background:#999999;
    /*Color Specific*/
    color:#333 !important;
}
/*------------------------------------------------------------------------------------------------------------------------------------
BUTTON STYLE (Hover / Active)
------------------------------------------------------------------------------------------------------------------------------------*/
.simpleBTN:hover{
    /*Text*/
    color:#FFF; /*Compatability*/
    
    /*Border*/
    border-color:#111; /*Compatability*/
    border-color:rgba(0, 0, 0, .5);

    /*Shadow and Inner Glow*/   
    -moz-box-shadow:
        0px 1px 4px rgba(0, 0, 0, .5), /*Shadow*/
        0px 0px 0px 2px rgba(255, 255, 255, .2) inset /*Inner Glow*/
    ;
    -webkit-box-shadow: 0px 1px 4px rgba(0, 0, 0, .5); /*Safari 4 & Chrome 5 compatability issue('inset')*/
    -webkit-box-shadow:
        0px 1px 4px rgba(0, 0, 0, .5), /*Shadow*/
    ;
    box-shadow:
        0px 1px 1px rgba(0, 0, 0, .8), /*NOTE: shadow doesn't render correcty until clicked (Opera)*/
    ;
}
.simpleBTN:active{
    /*Position*/
    top:1px;

    /*Text*/
    color:#EEE; /*Compatability*/   
    text-shadow:none;
    
    /*Border*/
    border-color:#111 #222 #444 #222; /*Compatability*/
    border-color:rgba(0, 0, 0, .8) rgba(0, 0, 0, .6) rgba(255, 255, 255, .2) rgba(0, 0, 0, .6);
    
    /*Shadow*/
    -moz-box-shadow: 0px 2px 4px rgba(0, 0, 0, .6) inset;
    -webkit-box-shadow: 0px 2px 4px rgba(0, 0, 0, .6) inset; /*Safari 4 issue('inset')*/
    box-shadow: 0px 2px 4px rgba(0, 0, 0, .6) inset;
    
    /*IE Gradient*/
    filter:none;
}
/*------------------------------------------------------------------------------------------------------------------------------------
Round Corner Adjust / Chrome 5 ['inset' + round corner] fix
------------------------------------------------------------------------------------------------------------------------------------*/
.simpleBTN.round{
    /*OVERWRITE*/
    
    -webkit-box-shadow: 0px 1px 1px rgba(0, 0, 0, .2);
}
.simpleBTN.round:hover{
    -webkit-box-shadow: 0px 1px 3px 1px rgba(0, 0, 0, .7);
}
.simpleBTN.round:active{
    -webkit-box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
}
/*------------------------------------------------------------------------------------------------------------------------------------
Size Adjust
------------------------------------------------------------------------------------------------------------------------------------*/
.simpleBTN.tiny{font-size:11px; padding:6px 8px;}
.simpleBTN.small{font-size:12px; padding:6px 10px;}
.simpleBTN.large{font-size:16px; padding:8px 14px;}
.simpleBTN.xlarge{font-size:18px; padding:10px 16px;}
/*------------------------------------------------------------------------------------------------------------------------------------
Span Text
------------------------------------------------------------------------------------------------------------------------------------*/
.simpleBTN span{display:block; font-weight:normal; font-size:11px; text-shadow:#666 -1px -1px 0px;}
.simpleBTN.white span{text-shadow:#CCC 1px 1px 0px;}
.simpleBTN:active span{text-shadow:none;}