.switch{display:block;background-color:#000;width:150px;height:195px;box-shadow:0 0 10px 2px rgba(0,0,0,.2),0 0 1px 2px #000,inset 0 2px 2px -2px #fff,inset 0 0 2px 15px #47434c,inset 0 0 2px 22px #000;border-radius:5px;padding:20px;perspective:700px}.switch input{display:none}.switch input:checked+.button{transform:translateZ(20px) rotateX(25deg);box-shadow:0 -10px 20px #ff1818}.switch input:checked+.button .light{animation:flicker .2s .3s infinite}.switch input:checked+.button .shine{opacity:1}.switch input:checked+.button .shadow{opacity:0}.switch .button{display:block;transition:all .3s cubic-bezier(1,0,1,1);transform-origin:center center -20px;transform:translateZ(20px) rotateX(-25deg);transform-style:preserve-3d;background-color:#9b0621;height:100%;position:relative;cursor:pointer;background:linear-gradient(#980000,#6f0000 30%,#6f0000 70%,#980000);background-repeat:no-repeat}.switch .button:before{background:linear-gradient(hsla(0,0%,100%,.8) 10%,hsla(0,0%,100%,.3) 30%,#650000 75%,#320000) 50% 50%/97% 97%,#b10000;background-repeat:no-repeat;transform-origin:top;transform:rotateX(-90deg);top:0}.switch .button:after,.switch .button:before{content:"";width:100%;height:50px;position:absolute}.switch .button:after{background-image:linear-gradient(#650000,#320000);transform-origin:top;transform:translateY(50px) rotateX(-90deg);bottom:0;box-shadow:0 50px 8px 0 #000,0 80px 20px 0 rgba(0,0,0,.5)}.switch .light{opacity:0;animation:light-off 1s;background-image:radial-gradient(#ffc97e,#ff1818 40%,transparent 70%)}.switch .dots,.switch .light{position:absolute;width:100%;height:100%}.switch .dots{background-image:radial-gradient(transparent 30%,rgba(101,0,0,.7) 70%);background-size:10px 10px}.switch .characters{position:absolute;width:100%;height:100%;background:linear-gradient(#fff,#fff) 50% 20%/5% 20%,radial-gradient(circle,transparent 50%,#fff 52%,#fff 70%,transparent 72%) 50% 80%/33% 25%;background-repeat:no-repeat}.switch .shine{opacity:.3;background:linear-gradient(#fff,transparent 3%) 50% 50%/97% 97%,linear-gradient(hsla(0,0%,100%,.5),transparent 50%,transparent 80%,hsla(0,0%,100%,.5)) 50% 50%/97% 97%;background-repeat:no-repeat}.switch .shadow,.switch .shine{transition:all .3s cubic-bezier(1,0,1,1);position:absolute;width:100%;height:100%}.switch .shadow{opacity:1;background:linear-gradient(transparent 70%,rgba(0,0,0,.8));background-repeat:no-repeat}@keyframes flicker{0%{opacity:1}80%{opacity:.8}to{opacity:1}}@keyframes light-off{0%{opacity:1}80%{opacity:0}}