#boton ul.feedback,.feedback{margin:0;padding:0}.feedback{--normal:#fff;--normal-shadow:#fff;--normal-mouth:#fff;--normal-eye:#fff;--active:#fff;--active-shadow:#fff;--active-mouth:#fff;--active-eye:#fff;--active-tear:#fff;--active-shadow-angry:#fff;list-style:none;display:flex}.feedback li{position:relative;border-radius:50%;border:4px solid #fff;transition:background .4s,box-shadow .4s,transform .3s;-webkit-tap-highlight-color:transparent;margin-right:26px!important}body .dribbble,body .twitter{position:fixed;display:block}.feedback li:hover{border:4px solid #cad9f0}.feedback li:not(:last-child){margin-right:20px}.feedback li div{width:40px;height:40px;position:relative;transform:perspective(240px) translateZ(4px)}.feedback li div svg,.feedback li div:after,.feedback li div:before{display:block;position:absolute;left:var(--l,9px);top:var(--t,13px);width:var(--w,8px);height:var(--h,2px);transform:rotate(var(--r,0deg)) scale(var(--sc,1)) translateZ(0)}.feedback li div svg{fill:none;stroke:var(--s);stroke-width:4px;stroke-linecap:round;stroke-linejoin:round;transition:stroke .4s}.feedback li div svg.eye{--s:var(--e, var(--normal-eye));--t:17px;--w:7px;--h:4px}.feedback li div svg.eye.right{--l:23px}.feedback li div svg.mouth{--s:var(--m, var(--normal-mouth));--l:11px;--t:23px;--w:18px;--h:7px}.feedback li div:after,.feedback li div:before{content:"";z-index:var(--zi,1);border-radius:var(--br,1px);background:var(--b,var(--e,var(--normal-eye)));transition:background .4s}.feedback li.angry{--step-1-rx:-24deg;--step-1-ry:20deg;--step-2-rx:-24deg;--step-2-ry:-20deg}.feedback li.angry div:before{--r:20deg;display:none}.feedback li.angry div:after{--l:23px;--r:-20deg;display:none}.feedback li.angry div svg.eye{stroke-dasharray:4.55;stroke-dashoffset:8.15;display:none}.feedback li.angry.active{-webkit-animation:1s linear angry;animation:1s linear angry}.feedback li.angry.active div:before{--middle-y:-2px;--middle-r:22deg;-webkit-animation:.8s linear forwards toggle;animation:.8s linear forwards toggle}.feedback li.angry.active div:after{--middle-y:1px;--middle-r:-18deg;-webkit-animation:.8s linear forwards toggle;animation:.8s linear forwards toggle}.feedback li.sad{--step-1-rx:20deg;--step-1-ry:-12deg;--step-2-rx:-18deg;--step-2-ry:14deg}.feedback li.sad div:after,.feedback li.sad div:before{--b:var(--active-tear);--sc:0;--w:5px;--h:5px;--t:15px;--br:50%}.feedback li.sad div:after{--l:25px}.feedback li.sad div svg.eye{--t:16px}.feedback li.sad div svg.mouth{--t:24px;stroke-dasharray:9.5;stroke-dashoffset:33.25}.feedback li.sad.active div:after,.feedback li.sad.active div:before{-webkit-animation:.6s linear forwards tear;animation:.6s linear forwards tear}.feedback li.ok{--step-1-rx:4deg;--step-1-ry:-22deg;--step-1-rz:6deg;--step-2-rx:4deg;--step-2-ry:22deg;--step-2-rz:-6deg}.feedback li.ok div:before{--l:12px;--t:17px;--h:4px;--w:4px;--br:50%;box-shadow:12px 0 0 var(--e,var(--normal-eye));display:none}.feedback li.ok div:after{--l:13px;--t:26px;--w:14px;--h:4px;--br:1px;--b:var(--m, var(--normal-mouth))}.feedback li.ok.active div:before{--middle-s-y:.35;-webkit-animation:.2s linear forwards toggle;animation:.2s linear forwards toggle}.feedback li.ok.active div:after{--middle-s-x:.5;-webkit-animation:.7s linear forwards toggle;animation:.7s linear forwards toggle}.feedback li.good{--step-1-rx:-14deg;--step-1-rz:10deg;--step-2-rx:10deg;--step-2-rz:-8deg}.feedback li.good div:before{--b:var(--m, var(--normal-mouth));--w:5px;--h:5px;--br:50%;--t:22px;--zi:0;opacity:.5;box-shadow:16px 0 0 var(--b);filter:blur(2px)}.feedback li.good div:after{--sc:0;display:none}.feedback li.good div svg.eye{--t:15px;--sc:-1;stroke-dasharray:4.55;stroke-dashoffset:8.15;display:none}.feedback li.good div svg.mouth{--t:22px;--sc:-1;stroke-dasharray:13.3;stroke-dashoffset:23.75}.feedback li.good.active div svg.mouth{--middle-y:1px;--middle-s:-1;-webkit-animation:.8s linear forwards toggle;animation:.8s linear forwards toggle}.feedback li.happy div{--step-1-rx:18deg;--step-1-ry:24deg;--step-2-rx:18deg;--step-2-ry:-24deg}.feedback li.happy div:before{--sc:0}.feedback li.happy div:after{--b:var(--m, var(--normal-mouth));--l:11px;--t:23px;--w:18px;--h:8px;--br:0 0 8px 8px}.feedback li.happy div svg.eye{--t:14px;--sc:-1}.feedback li.happy.active div:after{--middle-s-x:.95;--middle-s-y:.75;-webkit-animation:.8s linear forwards toggle;animation:.8s linear forwards toggle}.feedback li:not(.active){cursor:pointer}.feedback li:not(.active):active{transform:scale(.925)}.feedback li.active{--sb:var(--active);--sh:var(--active-shadow);--m:var(--active-mouth);--e:var(--active-eye)}.feedback li.active div{-webkit-animation:.8s linear forwards shake;animation:.8s linear forwards shake}.feedback li.good div:after,.feedback li.good div:before{background:0 0}@-webkit-keyframes shake{30%{transform:perspective(240px) rotateX(var(--step-1-rx,0deg)) rotateY(var(--step-1-ry,0deg)) rotateZ(var(--step-1-rz,0deg)) translateZ(10px)}60%{transform:perspective(240px) rotateX(var(--step-2-rx,0deg)) rotateY(var(--step-2-ry,0deg)) rotateZ(var(--step-2-rz,0deg)) translateZ(10px)}100%{transform:perspective(240px) translateZ(4px)}}@keyframes shake{30%{transform:perspective(240px) rotateX(var(--step-1-rx,0deg)) rotateY(var(--step-1-ry,0deg)) rotateZ(var(--step-1-rz,0deg)) translateZ(10px)}60%{transform:perspective(240px) rotateX(var(--step-2-rx,0deg)) rotateY(var(--step-2-ry,0deg)) rotateZ(var(--step-2-rz,0deg)) translateZ(10px)}100%{transform:perspective(240px) translateZ(4px)}}@-webkit-keyframes tear{0%{opacity:0;transform:translateY(-2px) scale(0) translateZ(0)}50%{transform:translateY(12px) scale(.6,1.2) translateZ(0)}20%,80%{opacity:1}100%{opacity:0;transform:translateY(24px) translateX(4px) rotateZ(-30deg) scale(.7,1.1) translateZ(0)}}@keyframes tear{0%{opacity:0;transform:translateY(-2px) scale(0) translateZ(0)}50%{transform:translateY(12px) scale(.6,1.2) translateZ(0)}20%,80%{opacity:1}100%{opacity:0;transform:translateY(24px) translateX(4px) rotateZ(-30deg) scale(.7,1.1) translateZ(0)}}@-webkit-keyframes toggle{50%{transform:translateY(var(--middle-y,0)) scale(var(--middle-s-x,var(--middle-s,1)),var(--middle-s-y,var(--middle-s,1))) rotate(var(--middle-r,0deg))}}@keyframes toggle{50%{transform:translateY(var(--middle-y,0)) scale(var(--middle-s-x,var(--middle-s,1)),var(--middle-s-y,var(--middle-s,1))) rotate(var(--middle-r,0deg))}}html{box-sizing:border-box;-webkit-font-smoothing:antialiased}*,:after,:before{box-sizing:inherit}body{min-height:100vh;display:flex;font-family:Roboto,Arial;justify-content:center;align-items:center;flex-direction:column;background:#f9f9fc}body .dribbble{right:20px;bottom:20px}body .dribbble img{display:block;height:28px}body .twitter{right:64px;bottom:14px}body .twitter svg{width:32px;height:32px;fill:#1da1f2}#boton .feedback li{margin-right:0!important;border:0}#boton .feedback li:hover{border:0}