.quantity {

	display: inline-block;
	width: auto;
	float: none;
	margin-right: 23px; 

	min-width: 120px;

	input[type="number"] {
	    -moz-appearance: textfield;
	}

	.plus-btn,
	.minus-btn {
	    // overflow: hidden;
	    position: relative;
	    cursor: pointer;
	    -webkit-backface-visibility: hidden;
	    backface-visibility: hidden;		
		min-width: 32px;
	    height: 32px;
	    line-height: 38px;	
	    background: #f5f5f5;	

	    position: relative;
	    display: inline-block;
	    // overflow: hidden;

	    border-radius: 50%;
	    text-align: center;
	    -webkit-user-select: none;
	    -moz-user-select: none;
	    -ms-user-select: none;
	    user-select: none;
	    -webkit-transition: background .3s ease,-webkit-transform .3s ease;
	    transition: background .3s ease,-webkit-transform .3s ease;
	    transition: background .3s ease,transform .3s ease;
	    transition: background .3s ease,transform .3s ease,-webkit-transform .3s ease;
	    vertical-align: top;

		i.icon {
			font-size: 16px;	
			position: absolute;
			top: calc(50% - 10px);
			left: calc(50% - 8px);
		    display: inline-block;
		    width: auto;
		    height: auto;
		    line-height: 1.2;
		    vertical-align: inherit;
		    margin-left: 0;
		}	    

		.icon-bb-plus-24:before,
		.icon-bb-minus-24:before {
			position: relative;
			z-index: 1;
			font-size: 16px;
			color: #000;	
			transition: color .4s cubic-bezier(.59,.03,.2,1);
		}	    

	    &:after {
		    content: '';
		    width: 100%;
		    height: 100%;
		    position: absolute;
		    top: 0;
		    left: 0;
		    background-color: #000;
		    -webkit-transform: scale(0);
		    transform: scale(0);
		    -webkit-transform-origin: center center;
		    transform-origin: center center;
		    transition: -webkit-transform .5s cubic-bezier(.19,1,.22,1);
		    transition: transform .5s cubic-bezier(.19,1,.22,1);
		    transition: transform .5s cubic-bezier(.19,1,.22,1),-webkit-transform .5s cubic-bezier(.19,1,.22,1);
		    border-radius: 50%;	 
		    -webkit-backface-visibility: hidden;
		    backface-visibility: hidden;			       	
	    }

	    &:hover {
			&:after {
			    -webkit-transform: scale(1);
			    transform: scale(1);			
			}
			.icon-bb-plus-24:before,
			.icon-bb-minus-24:before {
				color: #fff;	
			}
	    }


	}   


	input.custom-qty {
		vertical-align: top;
		padding: 0;
		margin: 0;
	    width: 40px;
	    border: none; 
	    display: inline-block; 
	    text-align: center;
	    font-weight: bold;
	    outline: none;
	    font-size: 20px;
	    line-height: 2;
	    // background: #eee;
	    font-weight: 400;
	    height: 30px;

		-webkit-appearance: textfield;
		-moz-appearance:    textfield;
		appearance:         textfield;            

	    &:focus {
	    	background: transparent;
	    }
	}        

}