.lbl {
	margin-left: 8px;
	margin-right: 5px;
	position: relative;
	display: block;
	height: 20px;
	width: 44px;
	background: #898989;
	border-radius: 100px;
	cursor: pointer;
	transition: all 0.3s ease;
    float: right;
}

.cbx:checked ~ label.drought {
	background: rgb(248,166,98);
}

.cbx ~ label.drought:after {
	background: rgb(248,166,98);
}

.cbx:checked ~ label.drought:after {
	left: 20px;
	background: rgb(208,126,58);
}

.cbx:checked ~ label.earthquake {
	background: rgb(204,112,91);
}

.cbx ~ label.earthquake:after {
	background: rgb(204,112,91);
}

.cbx:checked ~ label.earthquake:after {
	left: 20px;
	background: rgb(164,72,51);
}

.cbx:checked ~ label.epidemic {
	background: rgb(155,155,155);
}

.cbx ~ label.epidemic:after {
	background: rgb(155,155,155);
}

.cbx:checked ~ label.epidemic:after {
	left: 20px;
	background: rgb(115,115,115);
}

.cbx:checked ~ label.flood {
	background: rgb(93,156,210);
}

.cbx ~ label.flood:after {
	background: rgb(93,156,210);
}

.cbx:checked ~ label.flood:after {
	left: 20px;
	background: rgb(53,116,170);
}

.cbx:checked ~ label.storm {
	background: rgb(157,105,169);
}

.cbx ~ label.storm:after {
	background: rgb(157,105,169);
}

.cbx:checked ~ label.storm:after {
	left: 20px;
	background: rgb(117,65,129);
}

.cbx:checked ~ label.landslide {
	background: rgb(239,91,99);
}

.cbx ~ label.landslide:after {
	background: rgb(239,91,99);
}

.cbx:checked ~ label.landslide:after {
	left: 20px;
	background: rgb(199,51,59);
}

.lbl:after {
	position: absolute;
	left: -2px;
	top: -3px;
	display: block;
	width: 26px;
	height: 26px;
	border-radius: 100px;
	background: #fff;
	box-shadow: 0px 3px 3px rgba(0,0,0,0.05);
	content: '';
	transition: all 0.3s ease;
}

.lbl:active:after {
	transform: scale(1.15, 0.85);
}

.cbx:checked ~ label {
	background: #6fbeb5;
}

.cbx:checked ~ label:after {
	left: 20px;
	background: #179588;
}

.cbx:disabled ~ label {
	background: #d5d5d5;
	pointer-events: none;
}

.cbx:disabled ~ label:after {
	background: #bcbdbc;
}

.cntr {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.press {
	margin-bottom: 40px;
}

.hidden {
	display: none;
}
