

.spinner-sprite, .spinner .decrease, .spinner .decrease[disabled], .spinner .increase, .spinner .value, .spinner .value.passive {

	background: url(../images/spinner.png) no-repeat

}

.spinner {

	height: 25px;

	width: 71px;

	overflow: hidden;

*zoom:1;

	-webkit-box-shadow: 0 3px 3px -4px #aaa;

	-moz-box-shadow: 0 3px 3px -4px #aaa;

	box-shadow: 0 3px 3px -4px #aaa; margin:12px auto;

}

.spinner button, .spinner .value {

	text-align: center;

	display: block;

	float: left;

	height: 100%;

	line-height: 25px;

	margin: 0

}

.spinner button {

	border: none;

	width: 23px;

	color: #e5312a;

	font: 22px Arial 700;

	padding: 0;

	outline: none

}

.spinner .decrease {

	background-position: 0 -50px;

	cursor: pointer;

	text-indent: -10000px

}

.spinner .decrease[disabled] {

	background-position: 0 -75px;

	cursor: default

}

.spinner .increase {

	background-position: 0 0;

	cursor: pointer;

	text-indent: -10000px

}

.spinner .value {

	background-position: 0 -100px;

	width: 24px;

	height: 27px;

	border: none;

	font-family: Arial;

	color: #fff;

	padding: 0

}

.spinner .value.passive {

	background-position: 0 -25px;

	color: #919191

}

.spinner .error, .spinner .invalid {

	background: #a00

}

@media only screen and (max-width: 960px){
	.spinner{ width:62px;}
	.spinner button{ width:20px;}
	.spinner .value{ width:22px;}
	}

