.button {
	-webkit-background-clip: padding-box;
	-webkit-border-radius: .5em;
	   -moz-border-radius: .5em;
	        border-radius: .5em;
	-webkit-box-shadow: 0 2px 4px rgba(0,0,0,.5);
	   -moz-box-shadow: 0 2px 4px rgba(0,0,0,.5);
	        box-shadow: 0 2px 4px rgba(0,0,0,.5);
	cursor: pointer;
	display: inline-block;
	font: 14px/100% "Helvetica Neue", Arial, sans-serif;
	letter-spacing: .4px;
	outline: none;
	padding: .5em 2em .55em 2em;
	position: relative;
	text-align: center;
	text-decoration: none;
	text-shadow: 0 1px 1px rgba(0,0,0,.3);
}

.button:hover {
	text-decoration: none;
	color: #fff; 
}

.button:active {
	position: relative;
	top: 1px;
}

.big {
	-webkit-border-radius: .25em;
	   -moz-border-radius: .25em;
	        border-radius: .25em;
	font-size: 28px;
	padding: .5em 2.9em .55em 1em;
}

.medium {
	font-size: 12px;
	padding: 0.4em 1.5em 0.42em;
}

.small {
	font-size: 11px;
	padding: 0.2em 1em 0.275em;
}

.big_rounded, /* deprecated, use .big and .rounded */
.rounded {
	-webkit-border-radius: 2em;
	   -moz-border-radius: 2em;
	        border-radius: 2em;
}


/* button arrows */

.forward {
	padding-left: 1em;
	padding-right: 2.2em;
}

.back {
	padding-left: 2.2em;
	padding-right: 1em;
}

.button span.arrow {
	display: inline-block;
	height: 12px;
	width: 14px;
	background: url('/css/i/sprite.png') no-repeat;
	-webkit-background-clip: padding-box;
	position: absolute;
}

.button span.arrow.right {
	background-position: -13px -1px;
	margin: 0 0 0 10px;
	right: 10px;
	top: 8px;
}

.button.medium span.arrow.right {
	right: 5px;
	top: 5px;
}

.button span.arrow.left {
	background-position: 2px -1px;
	margin: 0 10px 0 10px;
	left: 0;
	top: 8px;
}

.big span.arrow.right {
	background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACwAAADICAMAAACkj/OnAAAAA3NCSVQICAjb4U/gAAAAY1BMVEX///////+1tbXk8Pbk8Paa4qJrtnI8ikEMXBDk8Pbk8Pbk8Pb///9ugmHk8Pb////H3/JafTkZfB/k8Pbk8Pbk8PahuML////39/fn5ubW1ta64Lqtxpegu4V+xH6Kqmpwlk0PpkQMAAAAIXRSTlMAEREzRERERERVZneIiJmqqqq7zN3u7v////////////+n1273AAAACXBIWXMAAAsSAAALEgHS3X78AAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M1cbXjNgAAABV0RVh0Q3JlYXRpb24gVGltZQA4LzEwLzExefxESgAAAbFJREFUaIHt1dmWwiAMAFCYLtKK45SqdFP5/68cErpQwDk+euYkT4rXGNKATBzKgr0bhAkTJkyYMGHChAkTJkyY8AfirJJS1vkbuDrrJc41/xNXF72L42vMzzqMS/YCZ+7zfjJGGTP1+K6rk9jZwSglXDQjrvwkMMc8D0u3Ok8drJUxhnq7RgkuvR6UUMu1DHE9Wya1/t7419Wu30SAoWdPKEHuW4Y7Oe0xJB6wXOmasD7Ab5fax1CxUWzFWrd823i/x7Di+rDgtXTI0/g4twsTJvbwXHplX9x9DMKICOtL7uqYQtwksK0FSxxDrJJYC8BDlJklcP9USZyouZvsqEQ1QzfuER5xqqJuzJ3f4cFOilhL9B9KuxYt12LdjiFPp6LZGLcniMVu27ntMZ+Hy304NusRwKlr9rPBjpCvQGxPllgsb3GjAcaB7uG98E4W2k6Fw884nreK+ZGBtaMbYVZ03lzi111jHvhD4b3htG4lnJK8nm8cZ+Mbqeh1GP3Sl/iuE7duR712p27Rw2PL3t/V1sPklSuEMhOEaTz68f8phAkTJkyYMGHChAkTJkz4X+NfwqBJltO5yuEAAAAASUVORK5CYII=) no-repeat right center;
	display: inline-block;
	height: 100%;
	position: absolute;
		right: 10px;
		top: 0;
	width: 44px;
}


/* @group green */

.green {
	background: #319434;
	background: -webkit-gradient( linear, left top, left bottom,  from(#29ac29),           to(#2e7b14) );
	background: -moz-linear-gradient( top,                             #29ac29,               #2e7b14  );
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#29ac29', endColorstr='#2e7b14' );
	-webkit-background-clip: padding-box;
	border: solid 1px #fff;
	color: #fff !important;
}

green:visited {
	color: #fff !important;
}

.green:hover {
	background: #319434;
	background: -webkit-gradient( linear, left top, left bottom,  from(#1ba21b),           to(#1f6701) );
	background: -moz-linear-gradient( top,                             #1ba21b,               #1f6701  );
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1ba21b', endColorstr='#1f6701' );
	-webkit-background-clip: padding-box;
	color: #fff !important;
}

.green:active {
	background: -webkit-gradient( linear, left top, left bottom,  from(#1f6701),           to(#1ba21b) );
	background: -moz-linear-gradient( top,                             #1f6701,               #1ba21b  );
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1f6701', endColorstr='#1ba21b' );
	-webkit-background-clip: padding-box;
	color: #fff;
	outline: none;
}

/* @end */


/* @group gray */

.gray {
	background: #6e6e6e;
	background: -webkit-gradient( linear, left top, left bottom,  from(#888888),           to(#575757) );
	background: -moz-linear-gradient( top,                             #888888,               #575757  );
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#888888', endColorstr='#575757' );
	-webkit-background-clip: padding-box;
	border: solid 1px #555;
	color: #e9e9e9;
}

.gray:hover {
	background: #616161;
	background: -webkit-gradient( linear, left top, left bottom,  from(#757575),           to(#4b4b4b) );
	background: -moz-linear-gradient( top,                             #757575,               #4b4b4b  );
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#757575', endColorstr='#4b4b4b' );
	-webkit-background-clip: padding-box;
}

.gray:active {
	background: -webkit-gradient( linear, left top, left bottom,  from(#575757),           to(#888888) );
	background: -moz-linear-gradient( top,                             #575757,               #888888  );
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#575757', endColorstr='#888888' );
	-webkit-background-clip: padding-box;
	color: #afafaf;
}

/* @end */

/* @group white */

.white {
	background: #fff;
	background: -webkit-gradient( linear, left top, left bottom,  from(#ffffff),           to(#ededed) );
	background: -moz-linear-gradient( top,                             #ffffff,               #ededed  );
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed' );
	-webkit-background-clip: padding-box;
	border: solid 1px #b7b7b7;
	color: #606060;
}

.white:hover {
	background: #ededed;
	background: -webkit-gradient( linear, left top, left bottom,  from(#ffffff),           to(#dcdcdc) );
	background: -moz-linear-gradient( top,                             #ffffff,               #dcdcdc  );
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#dcdcdc' );
	-webkit-background-clip: padding-box;
}

.white:active {
	background: -webkit-gradient( linear, left top, left bottom,  from(#ededed),           to(#ffffff) );
	background: -moz-linear-gradient( top,                             #ededed,               #ffffff  );
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ededed', endColorstr='#ffffff' );
	-webkit-background-clip: padding-box;
	color: #999;
}

/* @end */

/* @group blue */

.blue {
	background: #0095cd;
	background: -webkit-gradient( linear, left top, left bottom,  from(#00adee),           to(#0078a5) );
	background: -moz-linear-gradient( top,                             #00adee,               #0078a5  );
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00adee', endColorstr='#0078a5' );
	-webkit-background-clip: padding-box;
	border: solid 1px #0076a3;
	color: #d9eef7;
}

.blue:hover {
	background: #007ead;
	background: -webkit-gradient( linear, left top, left bottom,  from(#0095cc),           to(#00678e) );
	background: -moz-linear-gradient( top,                             #0095cc,               #00678e  );
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0095cc', endColorstr='#00678e' );
	-webkit-background-clip: padding-box;
}

.blue:active {
	background: -webkit-gradient( linear, left top, left bottom,  from(#0078a5),           to(#00adee) );
	background: -moz-linear-gradient( top,                             #0078a5,               #00adee  );
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0078a5', endColorstr='#00adee' );
	-webkit-background-clip: padding-box;
	color: #80bed6;
}

/* @end */

/* @group orange */

.orange {
	background: #f78d1d;
	background: -webkit-gradient( linear, left top, left bottom,  from(#faa51a),           to(#f47a20) );
	background: -moz-linear-gradient( top,                             #faa51a,               #f47a20  );
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#faa51a', endColorstr='#f47a20' );
	-webkit-background-clip: padding-box;
	border: solid 1px #da7c0c;
	color: #fef4e9;
}

.orange:hover {
	background: #f47c20;
	background: -webkit-gradient( linear, left top, left bottom,  from(#f88e11),           to(#f06015) );
	background: -moz-linear-gradient( top,                             #f88e11,               #f06015  );
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f88e11', endColorstr='#f06015' );
	-webkit-background-clip: padding-box;
}

.orange:active {
	background: -webkit-gradient( linear, left top, left bottom,  from(#f47a20),           to(#faa51a) );
	background: -moz-linear-gradient( top,                             #f47a20,               #faa51a  );
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f47a20', endColorstr='#faa51a' );
	-webkit-background-clip: padding-box;
	color: #fcd3a5;
}

/* @end */


/* @group IE-specific rules */

.ie6 div.button, .ie6 p.button, .ie6 h3.button,
.ie7 div.button, .ie7 p.button, .ie7 h3.button {
	display: inline;
	zoom: 1;
}

.ie6 .big span.arrow.right,
.ie7 .big span.arrow.right {	
	background: url(/css/i/sprite.png) no-repeat -268px -12px;
}

/* SVG background for IE9 buttons */
.ie9 .button {
	background: url(i/bg_button_gradients.svg) no-repeat 0 0;
	background-size: 300% 500%;
	filter: none;
}

	.ie9 .button:hover {
		background-position: 50% 0;
	}
	
	.ie9 .button:active {
		background-position: 100% 0;
	}

.ie9 .green         { background-position:    0    0; }
.ie9 .green:hover   { background-position:  50%    0; }
.ie9 .green:active  { background-position: 100%    0; }
.ie9 .gray          { background-position:    0  25%; }
.ie9 .gray:hover    { background-position:  50%  25%; }
.ie9 .gray:active   { background-position: 100%  25%; }
.ie9 .white         { background-position:    0  50%; }
.ie9 .white:hover   { background-position:  50%  50%; }
.ie9 .white:active  { background-position: 100%  50%; }
.ie9 .blue          { background-position:    0  75%; }
.ie9 .blue:hover    { background-position:  50%  75%; }
.ie9 .blue:active   { background-position: 100%  75%; }
.ie9 .orange        { background-position:    0 100%; }
.ie9 .orange:hover  { background-position:  50% 100%; }
.ie9 .orange:active { background-position: 100% 100%; }

/* @end */
