@import url('https://fonts.googleapis.com/css?family=Poppins:200,300,400,500,600,700,800,900&display=swap');
*
{
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: 'Poppins', sans-serif;
}
body
{
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  height: 100vh;
  overflow: hidden;
  background: #191919;
}
label
{
    position: relative;
    width: 240px;
    height: 80px;
    cursor: pointer;
    margin: 20px 0;
}
label input
{
    opacity: 0;
}
.check
{
    position: absolute;
    top: 0;
    left: 0;
    cursor: pointer;
    width: 100%;
    height: 100%;
    background: #101010;
    border-radius: 40px;
    box-shadow: 0 0 0 4px #101010;
}
.check:before
{
	content: '';
	position: absolute;
	top: calc(50% - 4px);
	left: -30px;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #f00;
    transition: 0.5s;
	box-shadow: 0 0 5px #f00,
				0 0 10px #f00,
				0 0 20px #f00,
				0 0 40px #f00,
				0 0 80px #f00;
}
label input:checked ~ .check:before
{
	background: #101010;
	box-shadow: none;
}
.check:after
{
	content: '';
	position: absolute;
	top: calc(50% - 4px);
	right: -30px;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #101010;
	box-shadow: none;
    transition: 0.5s;
}
label input:checked ~ .check:after
{
	background: rgb(44, 58, 44);
	box-shadow: 0 0 5px #0f0,
				0 0 10px #0f0,
				0 0 20px #0f0,
				0 0 40px #0f0,
				0 0 80px #0f0;
}
.btn
{
	position: absolute;
	top: 0;
	left: 0;
	width: 120px;
	height: 80px;
	border-radius: 40px;
	background: #333333;
    box-shadow: inset 0 -20px 15px #292929,
				inset 0 20px 15px #292929;
	transition: 0.5s;
}
.btn:before
{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 52px;
	height: 80px;
	background: #252525;
	/*background: linear-gradient(0deg,#191919,#2f2f2f);*/
	border-top-left-radius: 80px;
	border-bottom-left-radius: 80px;
	filter: blur(2px);
	box-shadow: inset -5px -5px 15px rgba(0,0,0,.3);
}
.btn:after
{
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	width: 52px;
	height: 80px;
	background: #252525;
	/*background: linear-gradient(0deg,#191919,#2f2f2f);*/
	border-top-right-radius: 80px;
	border-bottom-right-radius: 80px;
	filter: blur(2px);
	box-shadow: inset 5px -5px 15px rgba(0,0,0,.3);
}
label input:checked ~ .btn
{
	left: 50%;
}