*{box-sizing:border-box}body{height:100%;padding:40px 0 0 0;overflow-x:hidden;font:18px "Lucida Grande",Lucida,Arial,sans-serif;margin:0;background-color:#bbb;background-image:linear-gradient(left,rgba(238,196,135,.5) 0,rgba(243,207,154,.5) 3%,rgba(248,216,162,.5) 6%,rgba(243,207,154,.5) 6%,rgba(243,207,154,.5) 9%,rgba(241,202,136,.5) 12%,rgba(243,207,154,.5) 15%,rgba(244,208,158,.5) 17%,rgba(243,207,154,.5) 19%,rgba(243,207,154,.5) 21%,rgba(250,221,176,.5) 23%,rgba(250,221,176,.5) 25%,rgba(243,207,154,.5) 27%,rgba(238,200,138,.5) 29%,rgba(243,207,154,.5) 29%,rgba(243,207,154,.5) 32%,rgba(243,207,154,.5) 34%,rgba(243,207,154,.5) 37%,rgba(250,221,176,.5) 40%,rgba(250,221,176,.5) 43%,rgba(243,207,154,.5) 43%,rgba(243,207,154,.5) 44%,rgba(243,207,154,.5) 47%,rgba(238,200,138,.5) 49%,rgba(243,207,154,.5) 52%,rgba(250,221,176,.5) 54%,rgba(244,208,158,.5) 56%,rgba(243,207,154,.5) 59%,rgba(244,208,158,.5) 61%,rgba(250,221,176,.5) 64%,rgba(243,207,154,.5) 64%,rgba(244,208,158,.5) 66%,rgba(243,207,154,.5) 69%,rgba(248,216,162,.5) 71%,rgba(243,207,154,.5) 74%,rgba(243,207,154,.5) 76%,rgba(243,207,154,.5) 77%,rgba(243,207,154,.5) 80%,rgba(250,221,176,.5) 81%,rgba(243,207,154,.5) 83%,rgba(250,221,176,.5) 83%,rgba(250,221,176,.5) 85%,rgba(243,207,154,.5) 87%,rgba(250,221,176,.5) 89%,rgba(250,221,176,.5) 91%,rgba(243,207,154,.5) 92%,rgba(248,216,162,.5) 96%,rgba(243,207,154,.5) 97%,rgba(243,207,154,.5) 97%,rgba(243,207,154,.5) 98%,rgba(243,207,154,.5) 100%),linear-gradient(right,rgba(238,196,135,.3) 0,rgba(243,207,154,.3) 3%,rgba(248,216,162,.3) 6%,rgba(243,207,154,.3) 6%,rgba(243,207,154,.3) 9%,rgba(241,202,136,.3) 12%,rgba(243,207,154,.3) 15%,rgba(244,208,158,.3) 17%,rgba(243,207,154,.3) 19%,rgba(243,207,154,.3) 21%,rgba(250,221,176,.3) 23%,rgba(250,221,176,.3) 25%,rgba(243,207,154,.3) 27%,rgba(238,200,138,.3) 29%,rgba(243,207,154,.3) 29%,rgba(243,207,154,.3) 32%,rgba(243,207,154,.3) 34%,rgba(243,207,154,.3) 37%,rgba(250,221,176,.3) 40%,rgba(250,221,176,.3) 43%,rgba(243,207,154,.3) 43%,rgba(243,207,154,.3) 44%,rgba(243,207,154,.3) 47%,rgba(238,200,138,.3) 49%,rgba(243,207,154,.3) 52%,rgba(250,221,176,.3) 54%,rgba(244,208,158,.3) 56%,rgba(243,207,154,.3) 59%,rgba(244,208,158,.3) 61%,rgba(250,221,176,.3) 64%,rgba(243,207,154,.3) 64%,rgba(244,208,158,.3) 66%,rgba(243,207,154,.3) 69%,rgba(248,216,162,.3) 71%,rgba(243,207,154,.3) 74%,rgba(243,207,154,.3) 76%,rgba(243,207,154,.3) 77%,rgba(243,207,154,.3) 80%,rgba(250,221,176,.3) 81%,rgba(243,207,154,.3) 83%,rgba(250,221,176,.3) 83%,rgba(250,221,176,.3) 85%,rgba(243,207,154,.3) 87%,rgba(250,221,176,.3) 89%,rgba(250,221,176,.3) 91%,rgba(243,207,154,.3) 92%,rgba(248,216,162,.3) 96%,rgba(243,207,154,.3) 97%,rgba(243,207,154,.3) 97%,rgba(243,207,154,.3) 98%,rgba(243,207,154,.3) 100%),linear-gradient(left,rgba(238,196,135,.3) 0,rgba(243,207,154,.3) 3%,rgba(238,200,138,.3) 49%,rgba(243,207,154,.3) 52%,rgba(250,221,176,.3) 54%,rgba(244,208,158,.3) 56%,rgba(243,207,154,.2) 59%,rgba(244,208,158,.3) 61%,rgba(250,221,176,.3) 64%,rgba(243,207,154,.3) 64%,rgba(244,208,158,.3) 66%,rgba(243,207,154,.3) 69%,rgba(248,216,162,.3) 71%,rgba(243,207,154,.3) 74%,rgba(243,207,154,.3) 76%,rgba(243,207,154,.3) 77%,rgba(243,207,154,.3) 80%,rgba(250,221,176,.3) 81%,rgba(243,207,154,.3) 83%,rgba(250,221,176,.3) 83%,rgba(250,221,176,.3) 85%,rgba(243,207,154,.3) 87%,rgba(250,221,176,.3) 89%,rgba(250,221,176,.3) 91%,rgba(243,207,154,.3) 92%,rgba(248,216,162,.3) 96%,rgba(243,207,154,.3) 97%,rgba(243,207,154,.3) 97%,rgba(243,207,154,.3) 98%,rgba(243,207,154,.3) 100%);background-size:500px 20px,300px 20px,20px 820px;background-position:50% 50%,70% 70%,30% 30%;transition:background-size .28s ease-in-out}body.inactive{background-size:300px 20px,150px 20px,20px 220px}body.hell{background:linear-gradient(324deg,#232927 4%,transparent 4%) -70px 43px,linear-gradient(36deg,#232927 4%,transparent 4%) 30px 43px,linear-gradient(72deg,#a33 8.5%,transparent 8.5%) 30px 43px,linear-gradient(288deg,#a33 8.5%,transparent 8.5%) -70px 43px,linear-gradient(216deg,#a33 7.5%,transparent 7.5%) -70px 23px,linear-gradient(144deg,#a33 7.5%,transparent 7.5%) 30px 23px,linear-gradient(324deg,#232927 4%,transparent 4%) -20px 93px,linear-gradient(36deg,#232927 4%,transparent 4%) 80px 93px,linear-gradient(72deg,#666 8.5%,transparent 8.5%) 80px 93px,linear-gradient(288deg,#666 8.5%,transparent 8.5%) -20px 93px,linear-gradient(216deg,#666 7.5%,transparent 7.5%) -20px 73px,linear-gradient(144deg,#666 7.5%,transparent 7.5%) 80px 73px;background-color:#232927;background-size:100px 100px}body.hell.inactive{background-size:80px 80px}body.noteasy{background-color:#269;background-image:linear-gradient(white 2px,transparent 2px),linear-gradient(90deg,white 2px,transparent 2px),linear-gradient(rgba(255,255,255,.3) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.3) 1px,transparent 1px);background-size:100px 100px,100px 100px,20px 20px,20px 20px;background-position:-2px -2px,-2px -2px,-1px -1px,-1px -1px}body.noteasy.inactive{background-size:80px 80px,80px 80px,10px 10px,10px 10px}body::-webkit-scrollbar{width:15px}body::-webkit-scrollbar-track{background-color:rgba(217,217,217,.5)}body::-webkit-scrollbar-thumb{background:rgba(131,130,130,.7);box-shadow:inset 1px 1px 10px rgba(0,0,0,0.25),inset 0 -1px 3px rgba(0,0,0,0.1);border-radius:50px}a,a:active,a:visited{color:inherit;text-decoration:none;font-weight:bold;padding:0 0 4px 0;border-bottom:1px solid rgba(0,0,0,.1);transition:all .25s ease-in-out}a:hover{border-bottom-color:rgba(0,0,0,.7)}#message,#stuff,#controls,#score:before,#level:before,#mode-text:before{border:3px solid rgba(0,0,0,.2);background-color:rgba(0,0,0,.2);background-image:radial-gradient(center,ellipse cover,rgba(104,104,104,0.6) 0,rgba(23,23,23,0.7) 100%);box-shadow:inset 0 0 12px 0 rgba(0,0,0,.2),0 0 8px 2px rgba(0,0,0,.3);color:rgba(255,255,255,.6);text-align:center;backface-visibility:hidden}#message:hover a,#stuff:hover a,#controls:hover a{color:rgba(0,255,255,.8)}#message{position:fixed;z-index:-1;top:560px;padding:0 20px;margin:-60px 0 0 -15%;height:120px;width:130%;opacity:0;transform:translate(0,100%) rotate(-15deg);transition:all .2s ease-in}#message:before{content:'';display:inline-block;height:100%;vertical-align:middle;margin-right:-0.25em}#message .info-style-2{color:rgba(255,255,255,.85);text-shadow:1px 0 0 rgba(30,30,30,.6);background-color:rgba(90,90,90,1);padding:10px 18px;border-radius:20px;margin:0 10px 0 5px;box-shadow:inset 0 0 2px 2px rgba(0,0,0,.2),0 0 0 4px rgba(0,0,0,.4),0 0 10px 2px rgba(255,255,255,.3),0 0 20px 1px rgba(255,255,255,.6),0 0 25px 1px rgba(255,255,255,.6);font-weight:normal;font-size:45px;line-height:55px}#message .container{display:inline-block;vertical-align:middle;margin:0;padding:0;width:100%}#message h1,#message h2{font:italic bold 55px/55px sans-serif;margin:0;text-shadow:1px 1px 2px rgba(0,0,0,.6);color:rgba(255,255,255,.8)}#message h2{border-bottom:2px double rgba(0,0,0,.3);box-shadow:0 8px 14px -6px rgba(0,0,0,.3);margin:0 0 30px 0}#message p{margin:4px 0}#message hr,hr{border:0;height:2px;background:rgba(0,0,0,.2);border-bottom:1px solid rgba(255,255,255,.2);margin:30px 35px 15px 35px;border-radius:100%}#message hr.small{margin:15px 35px 10px 35px}#message .smiley{transform:rotate(-90deg);display:inline-block}#message.active{z-index:9999;opacity:1;transform:translate(0,0) rotate(0)}#message.win{background-color:rgba(0,150,0,.7);height:200px;margin-top:-100px}#message.lose{background-color:rgba(150,0,0,.7);height:330px;margin-top:-475px}.wrapper{position:relative;width:450px;height:450px;margin:0 auto;border-radius:50%;box-shadow:0 0 8px 4px rgba(255,255,255,.2),inset 0 0 90px 500px rgba(30,30,30,.5),0 0 12px 10px rgba(60,60,60,.7),0 0 50px 30px rgba(30,30,30,.9);transition:transform .3s ease-in-out;background:linear-gradient(27deg,#151515 5px,transparent 5px) 0 5px,linear-gradient(207deg,#151515 5px,transparent 5px) 10px 0,linear-gradient(27deg,#222 5px,transparent 5px) 0 10px,linear-gradient(207deg,#222 5px,transparent 5px) 10px 5px,linear-gradient(90deg,#1b1b1b 10px,transparent 10px),linear-gradient(#1d1d1d 25%,#1a1a1a 25%,#1a1a1a 50%,transparent 50%,transparent 75%,#242424 75%,#242424);background-color:#131313;background-size:20px 20px}.wrapper::after{position:absolute;content:'';top:50%;left:50%;margin:-250px 0 0 -250px;z-index:-1;height:500px;width:500px;border-radius:50%;background-color:#131313}.wrapper.inactive{transform:translate(0,-40px) scale(.6) rotate(15deg);filter:grayscale(80%) blur(4px);-webkit-filter:grayscale(80%) blur(4px)}#info{position:absolute;top:-40px;opacity:0;transition:all .25s ease-in-out;width:450px}#info.active{top:0;opacity:1}#score,#level,#mode-text{position:absolute;top:-10px;left:-120px;color:rgba(255,255,255,.85);text-shadow:1px 0 0 rgba(30,30,30,.6);background-color:rgba(90,90,90,1);padding:8px;border-radius:10px;box-shadow:inset 0 0 2px 2px rgba(0,0,0,.2),0 0 0 4px rgba(0,0,0,.4),0 0 10px 2px rgba(255,255,255,.3),0 0 20px 1px rgba(255,255,255,.6),0 0 25px 1px rgba(255,255,255,.6);text-align:right;transition:all .2s ease-in}.info-style{color:rgba(255,255,255,.85);text-shadow:1px 0 0 rgba(30,30,30,.6);background-color:rgba(90,90,90,1);padding:8px;border-radius:10px;margin:0 10px 0 5px;box-shadow:inset 0 0 2px 2px rgba(0,0,0,.2),0 0 0 4px rgba(0,0,0,.4),0 0 10px 2px rgba(255,255,255,.3),0 0 20px 1px rgba(255,255,255,.6),0 0 25px 1px rgba(255,255,255,.6)}#score.active,#level.active,#mode-text.active{background-color:rgba(255,255,255,.7);opacity:.4;animation:wobble .25s 1 linear}@keyframes wobble{0%,40%,80%{transform:scale(1.1) rotate(5deg)}20%,60%,100%{transform:scale(1.1) rotate(-5deg)}}#score:before,#level:before,#mode-text:before{z-index:-1;top:-5px;position:absolute;font-weight:bold}#level{left:auto;right:-40px;text-align:right}#level:before{right:-80px;content:'level ';padding:10px 10px 10px 55px;border-top-left-radius:15px;border-bottom-left-radius:15px}#score:before,#mode-text:before{left:-90px;border-top-right-radius:35px;border-bottom-right-radius:35px}#score:before{content:'score ';padding:10px 100px 10px 10px}#mode-text{top:50px}#mode-text:before{content:'mode ';padding:10px 70px 10px 10px}#controls{position:absolute;top:570px;left:50%;width:400px;margin:0 0 2em -200px;padding:1.5em;transition:top .3s ease-in-out}#controls.inactive{top:450px}.key{color:rgba(90,90,90,1);font:bold 18px "Lucida Grande",Lucida,Arial,sans-serif;min-width:40px;padding:0 10px 4px 8px;margin:0 5px 0 10px;border-radius:10px;height:40px;border:0;background-color:rgba(245,244,211,.9);background-image:linear-gradient(top,rgba(230,230,230,.5) 0,rgba(160,160,160,.7) 100%);box-shadow:inset -1px -2px 0 1px rgba(0,0,0,.4),0 0 8px 4px rgba(0,0,0,.4);transition:all .12s linear}.key.a,.key.s,.key.d,.key.f{color:rgba(30,30,30,1);text-shadow:1px 1px 1px rgba(255,255,255,.6)}.key.a{background-color:rgba(0,191,121,1)}.key.s{background-color:rgba(193,56,38,1)}.key.d{background-color:rgba(222,209,62,1)}.key.f{background-color:rgba(49,85,151,1)}.key.active,#mode input:checked+label{color:rgba(30,30,30,1);text-shadow:1px 1px 1px rgba(255,255,255,.6);background-color:rgba(190,190,190,.9);box-shadow:inset -1px -1px 0 1px rgba(0,0,0,.3),0 0 8px 4px rgba(0,0,0,.2)}#mode{display:inline-block;padding:0;margin:0;height:25px}#mode input{position:absolute;left:50%;z-index:-1;visibility:hidden}#mode label{display:inline-block;padding:7px}#stuff{position:absolute;z-index:5;top:990px;left:50%;width:650px;margin:0 0 0 -325px;padding:20px 20px}#stuff h2{margin:20px 0 0 0}span[role="hole"]{position:absolute;top:50%;left:50%;z-index:1337;margin:-125px 0 0 -125px;width:250px;height:250px;display:block;content:'';border-radius:100%;border:8px solid rgba(0,0,0,.2);transform:rotate(45deg);background-color:#e6e6e6;box-shadow:inset rgba(38,38,38,1) 0 0 0 4px,inset rgba(38,38,38,.8) 0 -1px 5px 4px,inset rgba(0,0,0,.25) 0 -1px 0 7px,inset rgba(255,255,255,.7) 0 2px 1px 7px,rgba(0,0,0,.45) 0 0 6px 4px,rgba(0,0,0,.15) 0 5px 8px 4px,rgba(0,0,0,.15) 0 -5px 8px 4px;background-image:repeating-linear-gradient(left center,rgba(255,255,255,0) 0,rgba(255,255,255,0) 6%,rgba(255,255,255,0.1) 7.5%),repeating-linear-gradient(left center,transparent 0,transparent 4%,rgba(0,0,0,0.03) 4.5%),repeating-linear-gradient(left center,rgba(255,255,255,0) 0,rgba(255,255,255,0) 1.2%,rgba(255,255,255,0.15) 2.2%),linear-gradient(-90deg,#c6c6c6 0,#e5e5e5 47%,#c6c6c6 53%,#b2b2b2 100%);background-image:radial-gradient(50% 0,8% 50%,rgba(255,255,255,.5) 0,rgba(255,255,255,0) 100%),radial-gradient(50% 100%,12% 50%,rgba(255,255,255,.6) 0,rgba(255,255,255,0) 100%),radial-gradient(0% 50%,50% 7%,rgba(255,255,255,.5) 0,rgba(255,255,255,0) 100%),radial-gradient(100% 50%,50% 5%,rgba(255,255,255,.5) 0,rgba(255,255,255,0) 100%),repeating-radial-gradient(50% 50%,100% 100%,transparent 0,transparent 3%,rgba(0,0,0,.1) 3.5%),repeating-radial-gradient(50% 50%,100% 100%,rgba(255,255,255,0) 0,rgba(255,255,255,0) 6%,rgba(255,255,255,.1) 7.5%),repeating-radial-gradient(50% 50%,100% 100%,rgba(255,255,255,0) 0,rgba(255,255,255,0) 1.2%,rgba(255,255,255,.2) 2.2%),radial-gradient(50% 50%,200% 50%,rgba(230,230,230,1) 5%,rgba(217,217,217,1) 30%,rgba(153,153,153,1) 100%)}span[role="hole"] #status{position:absolute;top:50%;left:50%;height:40px;width:80px;text-align:center;margin:-20px 0 0 -40px;transform:rotate(-45deg);font-size:35px;font-weight:bold;padding:0;color:rgba(0,0,0,.7);text-shadow:2px 0 1px rgba(255,255,255,.7),0 1px 1px rgba(255,255,255,.4);opacity:0;letter-spacing:5px;transition:all .25s linear}span[role="hole"] #status.active{opacity:1}section{margin:20px auto}section button{width:210px;height:210px;background-image:radial-gradient(center,rgba(255,255,255,0.2) 0,rgba(0,0,0,0.2) 35%,rgba(255,255,255,0.2) 80%,rgba(255,255,255,0.2) 100%);float:left;margin:0;display:inline-block;cursor:pointer;color:rgba(0,0,0,.6);font:bold 65px sans-serif;text-shadow:1px 1px 2px rgba(255,255,255,.3);border:5px solid rgba(0,0,0,.5);border-radius:7px;box-shadow:inset 0 0 1px 20px rgba(0,0,0,.2),inset 0 2px 8px 4px rgba(0,0,0,.2),inset 0 0 4px 2px rgba(0,0,0,.4);transition:all .075s ease-in-out}section button:after{background:#fff;background:linear-gradient(bottom,rgba(0,0,0,0.2) 0,rgba(255,255,255,0.2) 100%);border-radius:50%;padding:8px 30px 15px 30px;box-shadow:inset 0 0 4px rgba(0,0,0,.3)}section button.active{transform:scale(.9);backface-visibility:hidden}section button[role="one"]{background-color:rgba(0,191,121,1);margin:0 15px 15px 0;border-top-left-radius:50%;transform-origin:100% 50%}section button[role="one"]:after{content:'a'}section button[role="one"].active{background:rgba(0,191,121,.7);box-shadow:inset 0 0 3px 5px rgba(0,0,0,.2),inset 0 2px 8px 4px rgba(0,191,121,.4),inset 0 0 4px 2px rgba(0,0,0,.4),0 0 50px rgba(0,191,121,.7)}section button[role="two"]{background-color:rgba(193,56,38,1);margin:0 0 15px 15px;border-top-right-radius:50%;transform-origin:0 50%}section button[role="two"]:after{content:'s'}section button[role="two"].active{background:rgba(226,43,27,.7);box-shadow:inset 0 0 3px 5px rgba(0,0,0,.2),inset 0 2px 12px rgba(226,43,27,.4),0 0 50px rgba(226,43,27,.7)}section button[role="three"]{background-color:rgba(222,209,62,1);margin:15px 15px 0 0;border-bottom-left-radius:50%;transform-origin:100% 50%}section button[role="three"]:after{content:'d'}section button[role="three"].active{background:rgba(255,219,20,.7);box-shadow:inset 0 0 3px 5px rgba(0,0,0,.2),inset 0 2px 12px rgba(255,219,20,.4),0 0 50px rgba(255,219,20,.7)}section button[role="four"]{background-color:rgba(49,85,151,1);margin:15px 0 0 15px;border-bottom-right-radius:50%;transform-origin:0 50%}section button[role="four"]:after{content:'f';padding:10px 37px 10px 37px}section button[role="four"].active{background:rgba(96,167,242,.7);box-shadow:inset 0 0 3px 5px rgba(0,0,0,.2),inset 0 2px 12px rgba(96,167,242,.4),0 0 50px rgba(96,167,242,.7)}