.skin-icon-box{
    .color-title{
    	font-size: 12px;
    	color:$M1;
    	margin:15px;
    }
    .color-range{
		display: block;
	   	width: 310px;
		margin: 20px auto;

	    -webkit-appearance: none;
	    -moz-appearance: none;
	    -ms-appearance: none;
	    appearance: none;

	    border-radius: 3px !important;
	    border:none;
	    outline: none;
	}
    input[type=range]::-webkit-slider-runnable-track {
		width: 300px;
		height: 20px;
		background: #ddd;
		border: none;
		border-radius: 3px;
		background: -webkit-linear-gradient(left, red, orange, yellow, green, blue, indigo, violet);
		background: -o-linear-gradient(left, red, orange, yellow, green, blue, indigo, violet);
		background: -moz-linear-gradient(left, red, orange, yellow, green, blue, indigo, violet);
		background: linear-gradient(to rightright, red, orange, yellow, green, blue, indigo, violet);
	}

	input[type=range]::-webkit-slider-thumb {
		-webkit-appearance: none;
		-moz-appearance: none;
		-ms-appearance: none;
		appearance: none;

		border: none;
		height: 20px;
		width: 8px;
		background: #fff;
    	box-shadow:2px 0px 3px rgba(0,0,0,.2);
    	border-radius:3px;
	}
	.selector-btn{
		margin-top:15px;
	}
	.check-default{
		float:left;
		margin-top: 10px;
	}
	.check-box{
		float:left;
		position:relative;
		margin-left:15px;
		span{
			display:block;
			position: absolute;
			left:0px;
			height:0px;
			width:18px;
			height:18px;
			cursor:pointer;
			background-image: url(../../../../images/components/iTalent-header/icons.png);
		}
		.un-check{
			background-position:-180px -108px;

		}
		.in-check{
			background-position:-216px -108px;
		}
	}
	.check-go{
		.un-check{
			@include opacity(0);
		}
		.in-check{
			@include opacity(1);
        	@include AniQuote(dftToCheck 0.2s $Spring forwards);
		}
	}
	.check-back{
		.un-check{
			@include opacity(1);
        	@include AniQuote(checkToDft 0.2s $Spring forwards);
		}
		.in-check{
			@include opacity(0);
		}
	}
	
	.text{
		text-indent: 40px;
		display: block;
		font-size: 12px;
		color:$M2;
		line-height: 20px;
		cursor:pointer;
	}
	.comfirm-btn-style{
		display:block;
		width:70px;
		height:34px;
		border-radius:2px;
		background-color: rgba(21, 135, 216, 1.0);
		float:right;
		color:#ffffff;
		text-align:center;
		line-height: 34px;
		margin:0 15px 15px 0;
		cursor: pointer;
		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.18);
   		@include transition((box-shadow .3s $Ease));

		&:hover{
			box-shadow: 0 3px 6px rgba(0, 0, 0, 0.2), 0 3px 6px rgba(0, 0, 0, 0.26);
   		 	@include transition((box-shadow .3s $Ease));
		}
	}
	.list-wrapper-open{
	    width:340px;
	    max-height:140px;
	}
}