.checkbox-switch {
	text-transform: uppercase;
	cursor: pointer;
	padding: 0px !important;
	float: left;
	overflow: hidden;
	position: relative;
	text-align: left;
	width: 80px;
	height: 30px;
	line-height: 1.3;
}

.checkbox-switch input.input-checkbox {
	font: 700 15px Roboto !important;
	position: absolute;
	left: 0;
	top: 0;
	width: 80px;
	height: 30px;
	padding: 0;
	margin: 0;
	opacity: 0;
	z-index: 2;
	cursor: pointer;
}

.checkbox-switch .checkbox-animate {
	position: relative;
	width: 80px;
	height: 30px;
	background-color: #C8443A;
	box-shadow: inset 0 1px 0 #FF9D95, inset 0 -1px 0 #FF9D95, inset 0 0 0 1px #FF9D95, 0 2px 4px rgba(0, 0, 0, 0.2);
	-webkit-transition: background 0.25s ease-out 0s;
	transition: background 0.25s ease-out 0s;
}

.checkbox-switch .checkbox-animate:before {
	content: "";
	display: block;
	position: absolute;
	width: 32px;
	height: 30px;
	background-color: #870c03;
	box-shadow: inset 0 2px 0 #A8251A, inset 0 -2px 0 #390400, inset 0 0 0 2px #610700, 0 2px 4px rgba(0, 0, 0, 0.2);
	top: 0px;
	left: 0px;
	 -webkit-transition: left 0.3s ease-out 0.05s;
	transition: left 0.3s ease-out 0.05s;
	z-index: 10;
}

.checkbox-switch input.input-checkbox:checked + .checkbox-animate {
	background-color: #72AA50;
	box-shadow: inset 0 1px 0 #C6E7B3, inset 0 -1px 0 #C6E7B3, inset 0 0 0 1px #C6E7B3, 0 2px 4px rgba(0, 0, 0, 0.2);
}

.checkbox-switch input.input-checkbox:checked + .checkbox-animate:before {
	left:47px;
	background-color: #326612;
	box-shadow: inset 0 2px 0 #4F892D, inset 0 -2px 0 #0E2600, inset 0 0 0 2px #1A4401, 0 2px 4px rgba(0, 0, 0, 0.2);
}

.checkbox-switch .checkbox-off,
.checkbox-switch .checkbox-on {
	float: left;
	font-weight: 700;
	padding-top: 3px;
	 -webkit-transition: all 0.3s ease-out 0.3s;
	transition: all 0.3s ease-out 0.3s;
}

.checkbox-switch .checkbox-off {
	position: absolute;
	margin-left: 35px;
	text-shadow: rgba(57,4,0,0.6) -1px 0, rgba(57,4,0,0.4) 0 -1px, rgba(255,255,255,0.8) 0 1px, rgba(57,4,0,0.8) -1px -2px;
	color: #870c03;
	right: 8%;
	opacity: 1;
}

.checkbox-switch .checkbox-on {
	position: absolute;
	display: none;
	text-shadow: rgba(14,38,0,0.6) -1px 0, rgba(14,38,0,0.4) 0 -1px, rgba(255,255,255,0.8) 0 1px, rgba(14,38,0,0.8) -1px -2px;
	color: #326612;
	left: 8%;
	opacity: 0;
}

.checkbox-switch input.input-checkbox:checked + .checkbox-animate .checkbox-off {
	display: none;
	opacity: 0;
}

.checkbox-switch input.input-checkbox:checked + .checkbox-animate .checkbox-on {
	display: block;
	opacity: 1;
}