#wrapper{margin:40px auto 0}#wheel,#wrapper{width:300px;position:relative}#wheel{height:300px;border-radius:50%;overflow:hidden;border:8px solid #4ce7ff;box-shadow:0 0 0 11px #1e2638,0 3px 0 rgba(0,0,0,.05);transform:rotate(18deg)}#wheel:before{content:"";position:absolute;border:8px solid rgba(0,0,0,.1);width:284px;height:284px;border-radius:50%;z-index:1000}#inner-wheel{width:100%;height:100%;transition:all 10s cubic-bezier(0,.99,.44,.99)}#inner-wheel.spinning{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}#wheel div.sec{position:absolute;width:0;height:0;border-color:#19c transparent;border-style:solid;border-width:153px 50px 0;transform-origin:50px 153px;left:93px;top:-11px;opacity:1;text-align:center;color:#fff}#wheel div.sec:first-child{transform:rotate(36deg);-webkit-transform:rotate(36deg);-moz-transform:rotate(36deg);-o-transform:rotate(36deg);-ms-transform:rotate(36deg);border-color:#466dab transparent}#wheel div.sec:nth-child(2){transform:rotate(72deg);-webkit-transform:rotate(72deg);-moz-transform:rotate(72deg);-o-transform:rotate(72deg);-ms-transform:rotate(72deg);border-color:#4699ab transparent}#wheel div.sec:nth-child(3){transform:rotate(108deg);-webkit-transform:rotate(108deg);-moz-transform:rotate(108deg);-o-transform:rotate(108deg);-ms-transform:rotate(108deg);border-color:#466dab transparent}#wheel div.sec:nth-child(4){transform:rotate(144deg);-webkit-transform:rotate(144deg);-moz-transform:rotate(144deg);-o-transform:rotate(144deg);-ms-transform:rotate(144deg);border-color:#4699ab transparent}#wheel div.sec:nth-child(5){transform:rotate(180deg);-webkit-transform:rotate(180deg);-moz-transform:rotate(180deg);-o-transform:rotate(180deg);-ms-transform:rotate(180deg);border-color:#466dab transparent}#wheel div.sec:nth-child(6){transform:rotate(216deg);-webkit-transform:rotate(216deg);-moz-transform:rotate(216deg);-o-transform:rotate(216deg);-ms-transform:rotate(216deg);border-color:#4699ab transparent}#wheel div.sec:nth-child(7){transform:rotate(252deg);-webkit-transform:rotate(252deg);-moz-transform:rotate(252deg);-o-transform:rotate(252deg);-ms-transform:rotate(252deg);border-color:#466dab transparent}#wheel div.sec:nth-child(8){transform:rotate(288deg);-webkit-transform:rotate(288deg);-moz-transform:rotate(288deg);-o-transform:rotate(288deg);-ms-transform:rotate(288deg);border-color:#4699ab transparent}#wheel div.sec:nth-child(9){transform:rotate(324deg);-webkit-transform:rotate(324deg);-moz-transform:rotate(324deg);-o-transform:rotate(324deg);-ms-transform:rotate(324deg);border-color:#466dab transparent}#wheel div.sec:nth-child(10){transform:rotate(1turn);-webkit-transform:rotate(1turn);-moz-transform:rotate(1turn);-o-transform:rotate(1turn);-ms-transform:rotate(1turn);border-color:#4699ab transparent}#wheel div.sec .fa{margin-top:-128px;position:relative;z-index:10000000;display:block;font-size:13px;margin-left:-34px;width:65px;text-align:center;font-weight:700}.spin{width:60px;height:60px;margin:-30px 0 0 -30px;box-shadow:0 3px 0 rgba(0,0,0,.1);z-index:1000;background:orange;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-o-user-select:none;user-select:none}#inner-spin,.spin{position:absolute;top:50%;left:50%;border-radius:50%}#inner-spin{width:54px;height:54px;margin:-27px 0 0 -27px;background:red;z-index:999;box-shadow:inset 0 -2px 0 #fff,inset 0 2px 0 #fff,0 0 5px rgba(0,0,0,.4);background:#fff;background:-moz-radial-gradient(center,ellipse cover,#fff 0,#eaeaea 100%);background:-webkit-gradient(radial,center center,0,center center,100%,color-stop(0,#fff),color-stop(100%,#eaeaea));background:-webkit-radial-gradient(center,ellipse cover,#fff 0,#eaeaea 100%);background:-o-radial-gradient(center,ellipse cover,#fff 0,#eaeaea 100%);background:-ms-radial-gradient(center,ellipse cover,#fff 0,#eaeaea 100%);background:radial-gradient(ellipse at center,#fff 0,#eaeaea 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#eaeaea",GradientType=1)}.spin:active #inner-spin{box-shadow:inset 0 0 5px rgba(0,0,0,.4)}.spin:active:after{font-size:15px}#shine{width:300px;height:300px;position:absolute;top:0;left:0;background:-webkit-gradient(radial,center center,0,center center,100%,color-stop(0,#fff),color-stop(1%,hsla(0,0%,100%,.99)),color-stop(9%,hsla(0,0%,100%,.91)),color-stop(100%,hsla(0,0%,100%,0)));background:-webkit-radial-gradient(center,ellipse cover,#fff 0,hsla(0,0%,100%,.99) 1%,hsla(0,0%,100%,.91) 9%,hsla(0,0%,100%,0) 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#00ffffff",GradientType=1);opacity:.5}@-webkit-keyframes hh{0%,to{transform:rotate(0deg);-webkit-transform:rotate(0deg)}50%{transform:rotate(7deg);-webkit-transform:rotate(7deg)}}@keyframes hh{0%,to{transform:rotate(0deg);-webkit-transform:rotate(0deg)}50%{transform:rotate(7deg);-webkit-transform:rotate(7deg)}}.spinActive{-webkit-animation:hh .1s;animation:hh .1s}