.button {
    margin: 10px;
    text-decoration: none;
    font: bold 1.2em 'Trebuchet MS',Arial, Helvetica; /*Change the em value to scale the button*/
    display: inline-block;
    text-align: center;
    color: #fff;    
    border: 1px solid #9c9c9c; /* Fallback style */
    border: 1px solid rgba(0, 0, 0, 0.3);
    text-shadow: 0 1px 0 rgba(0,0,0,0.4);    
    box-shadow: 0 0 .05em rgba(0,0,0,0.4);   
	width: 150px;
}

.button, 
.button span {
    -moz-border-radius: .3em;
    border-radius: .3em;
}

.button span {
    border-top: 1px solid #fff; /* Fallback style */
    border-top: 0px solid rgba(255, 255, 255, 0.5);
    display: block;
	text-align:center;
	padding-left: 3px;
	padding-right: 3px;
	padding-top: 8px;
	padding-bottom: 8px;
    background-size: 3px 3px;
}

.button:hover {
    box-shadow: 0 0 .1em rgba(0,0,0,0.4);
}

.button:active {
    /* When pressed, move it down 1px */
    position: relative;
    top: 1px;
}

.button-blue {
    background: #4477a1;
    background: -webkit-gradient(linear, left top, left bottom, from(#81a8cb), to(#4477a1) );
    background: -moz-linear-gradient(-90deg, #81a8cb, #4477a1);
    filter:  progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#81a8cb', endColorstr='#4477a1');
}

.button-blue:hover {
    background: #81a8cb;
    background: -webkit-gradient(linear, left top, left bottom, from(#4477a1), to(#81a8cb) );
    background: -moz-linear-gradient(-90deg, #4477a1, #81a8cb);
    filter:  progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#4477a1', endColorstr='#81a8cb');            
}

.button-blue:active {
    background: #4477a1;
}

.button-green {
	background: #428739;
	background: -webkit-gradient(linear, left top, left bottom, from(#c8dd95), to(#428739) );
	background: -moz-linear-gradient(-90deg, #c8dd95, #428739);
	filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#c8dd95', EndColorStr='#428739');
}

.button-green:hover {
	background: #c8dd95;
	background: -webkit-gradient(linear, left top, left bottom, from(#428739), to(#c8dd95) );
	background: -moz-linear-gradient(-90deg, #428739, #c8dd95);
	filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#428739', EndColorStr='#c8dd95');
}

.button-green:active{
	background: #428739;
}

.button-black {
	background: #141414;
	background: -webkit-gradient(linear, left top, left bottom, from(#656565), to(#141414) );
	background: -moz-linear-gradient(-90deg, #656565, #141414);
	filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#656565', EndColorStr='#141414');
}
.button-black:hover {
	background: #656565;
	background: -webkit-gradient(linear, left top, left bottom, from(#141414), to(#656565) );
	background: -moz-linear-gradient(-90deg, #141414, #656565);
	filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#141414', EndColorStr='#656565');
}

.button-black:active{
	background: #141414;
}

.button-orange {
	background: #f09c15;
	background: -webkit-gradient(linear, left top, left bottom, from(#f8c939), to(#f09c15) );
	background: -moz-linear-gradient(-90deg, #f8c939, #f09c15);
	filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#f8c939', EndColorStr='#f09c15');
}
.button-orange:hover {
	background: #f8c939;
	background: -webkit-gradient(linear, left top, left bottom, from(#f09c15), to(#f8c939) );
	background: -moz-linear-gradient(-90deg, #f09c15, #f8c939);
	filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#f09c15', EndColorStr='#f8c939');
}

.button-orange:active{
	background: #f09c15;
}

.button-red {
	background: #D82741;
	background: -webkit-gradient(linear, left top, left bottom, from(#E84B6E), to(#D82741) );
	background: -moz-linear-gradient(-90deg, #E84B6E, #D82741);
	filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#E84B6E', EndColorStr='#D82741');
}

.button-red:hover {
	background: #E84B6E;
	background: -webkit-gradient(linear, left top, left bottom, from(#D82741), to(#E84B6E) );
	background: -moz-linear-gradient(-90deg, #D82741, #E84B6E);
	filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#D82741', EndColorStr='#E84B6E');
}

.button-red:active{
	background: #D82741;
}

.button-purple {
	background: #6F50E7;
	background: -webkit-gradient(linear, left top, left bottom, from(#B8A9F3), to(#6F50E7) );
	background: -moz-linear-gradient(-90deg, #B8A9F3, #6F50E7);
	filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#B8A9F3', EndColorStr='#6F50E7');
}

.button-purple:hover {
	background: #B8A9F3;
	background: -webkit-gradient(linear, left top, left bottom, from(#6F50E7), to(#B8A9F3) );
	background: -moz-linear-gradient(-90deg, #6F50E7, #B8A9F3);
	filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#6F50E7', EndColorStr='#B8A9F3');
}

.button-purple:active{
	background: #6F50E7;
}


.button-yellow {
	background: #888739;
	background: -webkit-gradient(linear, left top, left bottom, from(#F1E723), to(#888739) );
	background: -moz-linear-gradient(-90deg, #F1E723, #888739);
	filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#F1E723', EndColorStr='#888739');
}

.button-yellow:hover {
	background: #F1E723;
	background: -webkit-gradient(linear, left top, left bottom, from(#888739), to(#F1E723) );
	background: -moz-linear-gradient(-90deg, #888739, #F1E723);
	filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#888739', EndColorStr='#F1E723');
}

.button-yellow:active{
	background: #888739;
}

.button-marine {
	background: #398188;
	background: -webkit-gradient(linear, left top, left bottom, from(#21D199), to(#398188) );
	background: -moz-linear-gradient(-90deg, #21D199, #398188);
	filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#21D199', EndColorStr='#398188');
}

.button-marine:hover {
	background: #21D199;
	background: -webkit-gradient(linear, left top, left bottom, from(#398188), to(#21D199) );
	background: -moz-linear-gradient(-90deg, #398188, #21D199);
	filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#398188', EndColorStr='#21D199');
}

.button-marine:active{
	background: #398188;
}
