.switch {
	label {
		position: relative;
		display: inline-block;
		vertical-align: top;
		width: 56px;
		height: 20px;
		padding: 3px;
		background: white;
		border-radius: 18px;
		cursor: pointer;
		box-shadow: inset 0 -1px white, inset 0 1px 1px rgba(0, 0, 0, 0.05);
		background: linear-gradient(to bottom, #eeeeee, white 25px);
		.label {
			position: relative;
			display: block;
			height: inherit;
			font-size: 10px;
			text-transform: uppercase;
			background: #eceeef;
			border-radius: inherit;
			box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.12), inset 0 0 2px rgba(0, 0, 0, 0.15);
			transition: 0.15s ease-out;
			transition-property: opacity, background;
			&:before, &:after {
				position: absolute;
				top: 50%;
				margin-top: -.5em;
				line-height: 1;
				transition: inherit;
			}
			&:before {
				content: attr(data-off);
				right: 11px;
				color: #aaa;
				text-shadow: 0 1px rgba(255, 255, 255, 0.5);
			}
			&:after {
				content: attr(data-on);
				left: 11px;
				color: white;
				text-shadow: 0 1px rgba(0, 0, 0, 0.2);
				opacity: 0;
			}
		}
		.handle {
			position: absolute;
			top: 4px;
			left: 4px;
			width: 18px;
			height: 18px;
			background: white;
			border-radius: 10px;
			box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2);
			background-image: linear-gradient(to bottom, white 40%, #f0f0f0);
			transition: left 0.15s ease-out;
			&:before {
				content: '';
				position: absolute;
				top: 50%;
				left: 50%;
				margin: -6px 0 0 -6px;
				width: 12px;
				height: 12px;
				background: #f9f9f9;
				border-radius: 6px;
				box-shadow: inset 0 1px rgba(0, 0, 0, 0.02);
				background-image: linear-gradient(to bottom, #eeeeee, white);
			}
		}
		input[type="checkbox"] {
			position: absolute;
			top: 0;
			left: 0;
			opacity: 0;
			&:checked ~ .label {
				background: #47a8d8;
				box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15), inset 0 0 3px rgba(0, 0, 0, 0.2);
			}
			&:checked ~ .label:before {
				opacity: 0;
			}
			&:checked ~ .label:after {
				opacity: 1;
			}
			&:checked ~ .handle {
				left: 40px;
				box-shadow: -1px 1px 5px rgba(0, 0, 0, 0.2);
			}
		}
	}
}