html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font:inherit;font-size:100%;vertical-align:baseline}html{line-height:1}ol,ul{list-style:none}table{border-collapse:collapse;border-spacing:0}caption,th,td{text-align:left;font-weight:normal;vertical-align:middle}q,blockquote{quotes:none}q:before,q:after,blockquote:before,blockquote:after{content:"";content:none}a img{border:none}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary{display:block}html.green a:hover{box-shadow:0 0 5px #b6d125;border-color:#b6d125;color:#a9be38}html.green #touchzone{background-color:#a5b83e}html.green .demo .event-name.is-active::before{border-color:#adc432;background:#c7e90d}html.green footer .love path{fill:#b6d125}html.blue a:hover{box-shadow:0 0 5px #2188d0;border-color:#2188d0;color:#3385be}html.blue #touchzone{background-color:#3984b8}html.blue .demo .event-name.is-active::before{border-color:#2d86c4;background:#098de8}html.blue footer .love path{fill:#2188d0}html.pink a:hover{box-shadow:0 0 5px #d12bcd;border-color:#d12bcd;color:#be3ebb}html.pink #touchzone{background-color:#b844b5}html.pink .demo .event-name.is-active::before{border-color:#c537c1;background:#ea12e5}html.pink footer .love path{fill:#d12bcd}div,a{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}html,body{min-width:320px;min-height:100%;font-size:62.5%;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}body{font-family:'Open Sans', Helvetica, Arial, sans-serif;color:#555;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}h1{padding:.3rem 1rem;color:#eee;font-size:4rem;font-weight:100;line-height:1.8;text-align:center;text-transform:lowercase;font-family:'Great Vibes', cursive}@media (min-width: 42.5em){h1{font-size:8rem;height:14rem}}h2,h3{color:black}h2{margin:2rem 0;font-size:2.8rem}h3{margin:1rem 0;border-bottom:1px solid #ddd;font-size:2rem;line-height:4rem}a{color:#07a;text-decoration:none}a:visited{color:#07a}a:focus{color:#07a}a:hover{color:#07a}a:active{color:#07a}a:hover{text-decoration:underline}p,li{margin:1.5rem 0;font-size:1.4rem;line-height:2.4rem;word-wrap:break-word}p+p,li+p{margin-top:2.5rem}ul{list-style:disc;margin:0 2rem}li{margin:0}code{font-size:1.4rem}blockquote::before{content:'\201F';font-size:2rem}blockquote::after{content:'\201E';font-size:2rem}strong{font-weight:700}section{padding:1rem}@font-face{font-family:"Open Sans";src:url('fonts/opensans-light.eot');src:url('fonts/opensans-light.eot?#iefix') format('eot'),url('fonts/opensans-light.woff') format('woff'), url('fonts/opensans-light.ttf') format('truetype'), url('fonts/opensans-light.svg') format('svg');font-weight:100}@font-face{font-family:"Open Sans";src:url('fonts/opensans-regular.eot');src:url('fonts/opensans-regular.eot?#iefix') format('eot'),url('fonts/opensans-regular.woff') format('woff'), url('fonts/opensans-regular.ttf') format('truetype'), url('fonts/opensans-regular.svg') format('svg');font-weight:normal}@font-face{font-family:"Open Sans";src:url('fonts/opensans-bold.eot');src:url('fonts/opensans-bold.eot?#iefix') format('eot'),url('fonts/opensans-bold.woff') format('woff'), url('fonts/opensans-bold.ttf') format('truetype'), url('fonts/opensans-bold.svg') format('svg');font-weight:700}@font-face{font-family:"Fontello";src:url('fonts/fontello.eot');src:url('fonts/fontello.eot?#iefix') format('eot'),url('fonts/fontello.woff') format('woff'), url('fonts/fontello.ttf') format('truetype'), url('fonts/fontello.svg') format('svg');font-weight:normal}[class^="icon-"]::before,[class*=" icon-"]::before{vertical-align:top;font-family:'Fontello';font-size:3.2rem;speak:none;text-decoration:inherit;margin-right:0.8rem}@media (max-width: 25em){[class^="icon-"]::before,[class*=" icon-"]::before{padding-left:1rem}}.icon-up-hand::before{content:'\261d'}.icon-code::before{content:'\e714'}.icon-firefox::before{content:'\e840'}.icon-chrome::before{content:'\e841'}.icon-opera::before{content:'\e842'}.icon-ie::before{content:'\e843'}.icon-github-repo::before{content:'\f09b'}.icon-github::before{content:'\f300'}.icon-github-circled::before{content:'\f301'}.icon-twitter::before{content:'\f309'}.icon-twitter-circled::before{content:'\f30a'}.icon-facebook::before{content:'\f30c'}.icon-facebook-circled::before{content:'\f30d'}.icon-gplus::before{content:'\f30f'}.icon-gplus-circled::before{content:'\f310'}.icon-tumblr::before{content:'\f315'}.icon-tumblr-circled::before{content:'\f316'}.icon-linkedin::before{content:'\f318'}.icon-linkedin-circled::before{content:'\f319'}.icon-spotify::before{content:'\f327'}.icon-spotify-circled::before{content:'\f328'}.icon-instagram::before{content:'\f32d'}.icon-download::before{content:'\1f4e5'}@-moz-keyframes tap{to{-moz-transform:scale(0.95, 0.95);transform:scale(0.95, 0.95);opacity:.6}}@-webkit-keyframes tap{to{-webkit-transform:scale(0.95, 0.95);transform:scale(0.95, 0.95);opacity:.6}}@-o-keyframes tap{to{-o-transform:scale(0.95, 0.95);transform:scale(0.95, 0.95);opacity:.6}}@-ms-keyframes tap{to{-ms-transform:scale(0.95, 0.95);transform:scale(0.95, 0.95);opacity:.6}}@keyframes tap{to{transform:scale(0.95, 0.95);opacity:.6}}@-moz-keyframes press{0%{-moz-transform:translateX(0%);transform:translateX(0%)}15%{-moz-transform:translateX(-25%) rotate(-5deg);transform:translateX(-25%) rotate(-5deg)}30%{-moz-transform:translateX(20%) rotate(3deg);transform:translateX(20%) rotate(3deg)}45%{-moz-transform:translateX(-15%) rotate(-3deg);transform:translateX(-15%) rotate(-3deg)}60%{-moz-transform:translateX(10%) rotate(2deg);transform:translateX(10%) rotate(2deg)}75%{-moz-transform:translateX(-5%) rotate(-1deg);transform:translateX(-5%) rotate(-1deg)}100%{-moz-transform:translateX(0%);transform:translateX(0%)}}@-webkit-keyframes press{0%{-webkit-transform:translateX(0%);transform:translateX(0%)}15%{-webkit-transform:translateX(-25%) rotate(-5deg);transform:translateX(-25%) rotate(-5deg)}30%{-webkit-transform:translateX(20%) rotate(3deg);transform:translateX(20%) rotate(3deg)}45%{-webkit-transform:translateX(-15%) rotate(-3deg);transform:translateX(-15%) rotate(-3deg)}60%{-webkit-transform:translateX(10%) rotate(2deg);transform:translateX(10%) rotate(2deg)}75%{-webkit-transform:translateX(-5%) rotate(-1deg);transform:translateX(-5%) rotate(-1deg)}100%{-webkit-transform:translateX(0%);transform:translateX(0%)}}@-o-keyframes press{0%{-o-transform:translateX(0%);transform:translateX(0%)}15%{-o-transform:translateX(-25%) rotate(-5deg);transform:translateX(-25%) rotate(-5deg)}30%{-o-transform:translateX(20%) rotate(3deg);transform:translateX(20%) rotate(3deg)}45%{-o-transform:translateX(-15%) rotate(-3deg);transform:translateX(-15%) rotate(-3deg)}60%{-o-transform:translateX(10%) rotate(2deg);transform:translateX(10%) rotate(2deg)}75%{-o-transform:translateX(-5%) rotate(-1deg);transform:translateX(-5%) rotate(-1deg)}100%{-o-transform:translateX(0%);transform:translateX(0%)}}@-ms-keyframes press{0%{-ms-transform:translateX(0%);transform:translateX(0%)}15%{-ms-transform:translateX(-25%) rotate(-5deg);transform:translateX(-25%) rotate(-5deg)}30%{-ms-transform:translateX(20%) rotate(3deg);transform:translateX(20%) rotate(3deg)}45%{-ms-transform:translateX(-15%) rotate(-3deg);transform:translateX(-15%) rotate(-3deg)}60%{-ms-transform:translateX(10%) rotate(2deg);transform:translateX(10%) rotate(2deg)}75%{-ms-transform:translateX(-5%) rotate(-1deg);transform:translateX(-5%) rotate(-1deg)}100%{-ms-transform:translateX(0%);transform:translateX(0%)}}@keyframes press{0%{transform:translateX(0%)}15%{transform:translateX(-25%) rotate(-5deg)}30%{transform:translateX(20%) rotate(3deg)}45%{transform:translateX(-15%) rotate(-3deg)}60%{transform:translateX(10%) rotate(2deg)}75%{transform:translateX(-5%) rotate(-1deg)}100%{transform:translateX(0%)}}@-moz-keyframes flick-horizontal{to{-moz-transform:rotateY(-45deg);transform:rotateY(-45deg)}}@-webkit-keyframes flick-horizontal{to{-webkit-transform:rotateY(-45deg);transform:rotateY(-45deg)}}@-o-keyframes flick-horizontal{to{-o-transform:rotateY(-45deg);transform:rotateY(-45deg)}}@-ms-keyframes flick-horizontal{to{-ms-transform:rotateY(-45deg);transform:rotateY(-45deg)}}@keyframes flick-horizontal{to{transform:rotateY(-45deg)}}@-moz-keyframes flick-vertical{to{-moz-transform:rotateX(180deg);transform:rotateX(180deg)}}@-webkit-keyframes flick-vertical{to{-webkit-transform:rotateX(180deg);transform:rotateX(180deg)}}@-o-keyframes flick-vertical{to{-o-transform:rotateX(180deg);transform:rotateX(180deg)}}@-ms-keyframes flick-vertical{to{-ms-transform:rotateX(180deg);transform:rotateX(180deg)}}@keyframes flick-vertical{to{transform:rotateX(180deg)}}[data-animation=tap]{-webkit-animation:tap 0.2s linear alternate 2;-moz-animation:tap 0.2s linear alternate 2;-ms-animation:tap 0.2s linear alternate 2;-o-animation:tap 0.2s linear alternate 2;animation:tap 0.2s linear alternate 2}[data-animation=press]{-webkit-animation:press 0.5s;-moz-animation:press 0.5s;-ms-animation:press 0.5s;-o-animation:press 0.5s;animation:press 0.5s}[data-animation=flick-horizontal]{-webkit-animation:flick-horizontal 0.2s linear alternate 2;-moz-animation:flick-horizontal 0.2s linear alternate 2;-ms-animation:flick-horizontal 0.2s linear alternate 2;-o-animation:flick-horizontal 0.2s linear alternate 2;animation:flick-horizontal 0.2s linear alternate 2}[data-animation=flick-vertical]{-webkit-animation:flick-vertical 0.2s linear alternate 2;-moz-animation:flick-vertical 0.2s linear alternate 2;-ms-animation:flick-vertical 0.2s linear alternate 2;-o-animation:flick-vertical 0.2s linear alternate 2;animation:flick-vertical 0.2s linear alternate 2}header{background-color:#2f2f2f}@media (min-width: 42.5em){section,footer{padding:1rem 4rem}}@media (min-width: 62.5em){section,footer{width:70rem;margin:0 auto;padding:1rem -webkit-calc(50% - 35rem);padding:1rem -moz-calc(50% - 35rem)}}.demo{position:relative;background-color:#2f2f2f;color:#bbb;-webkit-perspective:1500;-moz-perspective:1500;-ms-perspective:1500;-o-perspective:1500;perspective:1500;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.demo p{margin:2rem auto;width:60rem;line-height:3rem;text-align:justify}@media (min-width: 25em){.demo .events{margin:3rem 0}}@media (min-width: 62.5em){.demo .events{position:absolute;margin-left:30rem;top:5%;left:50%}}.demo .events-list{list-style:none;margin:0 4rem;font-size:0}@media (min-width: 25em){.demo .events-list{margin:0 2rem;text-align:center}}.demo .events-list li{display:inline-block;width:50%}@media (min-width: 25em){.demo .events-list li{width:auto;text-align:center}}@media (min-width: 42.5em){.demo .events-list li{height:3rem;font-size:1.8rem;font-weight:100}}@media (min-width: 62.5em){.demo .events-list li{display:block;text-align:left}}.demo .events-list .event-name::before{content:'';display:inline-block;vertical-align:middle;margin-right:.5rem;border:.1rem solid #555;background:#333;-webkit-border-radius:50%;-moz-border-radius:50%;-ms-border-radius:50%;-o-border-radius:50%;border-radius:50%;width:1rem;height:1rem}@media (min-width: 25em){.demo .events-list .event-name::before{margin-left:.5rem}}@media (min-width: 42.5em){.demo .events-list .event-name::before{margin-left:1rem}}.demo .events-list .event-name.is-active::before{border-color:#adc432;background:#c7e90d}.demo .events-list em{display:none}.actions{margin:2rem 0;-webkit-transform:translateZ(0);-moz-transform:translateZ(0);-ms-transform:translateZ(0);-o-transform:translateZ(0);transform:translateZ(0)}@media (min-width: 25em){.actions{text-align:center}}@media (min-width: 42.5em){.actions{margin:4rem 0}}.actions a{display:inline-block;border:2px solid #bbb;border-radius:5px;background:#bbb;padding:1rem;width:100%;font-size:1.6rem;color:#333;line-height:2rem;vertical-align:middle;text-decoration:none;text-shadow:1px 1px 2px #888;-webkit-transition:0.2s;-moz-transition:0.2s;-o-transition:0.2s;transition:0.2s}@media (min-width: 25em){.actions a{margin-left:1rem;width:18rem}}@media (max-width: 25em){.actions a:first-child{margin-bottom:2rem}}.actions a:hover{-webkit-box-shadow:0 0 5px #bcec4b;-moz-box-shadow:0 0 5px #bcec4b;box-shadow:0 0 5px #bcec4b;border-color:#bcec4b;background:black;color:#9ac847;text-shadow:none}#touchzone{position:relative;margin:2rem auto;border:10px solid rgba(255,255,255,0.2);background:#a5b83e;padding-top:66%;width:100%;cursor:-webkit-grab;cursor:-moz-grab;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-o-user-select:none;user-select:none}@media (min-width: 42.5em){#touchzone{padding-top:0;width:60rem;height:45rem}}#touchzone::after{content:attr(data-event)}#touchzone.grabbing{cursor:-webkit-grabbing;cursor:-moz-grabbing}#nipple{position:absolute;border:4px solid rgba(255,255,255,0.8);border-radius:100%;background:rgba(255,255,255,0.5);pointer-events:none}#nipple.tap{-webkit-animation:bounceIn 0.2s linear alternate 2;-moz-animation:bounceIn 0.2s linear alternate 2;-ms-animation:bounceIn 0.2s linear alternate 2;-o-animation:bounceIn 0.2s linear alternate 2;animation:bounceIn 0.2s linear alternate 2}.intro{background:#2f2f2f;margin:0 auto;text-align:justify;margin-bottom:4rem;padding-bottom:4rem}.intro p{margin-left:auto;margin-right:auto;font-weight:100;color:#999;font-size:1.8rem}@media (min-width: 42.5em){.intro p{font-size:2rem;line-height:3.4rem}}footer{margin-top:4rem;background:#222;color:#eee}footer a:hover{box-shadow:none !important}footer p{margin:0;padding:2rem 0;text-align:center;font-size:1.5rem;font-weight:100}@media (min-width: 25em){footer p{font-size:2rem}}footer p>*{display:block}footer .promo{position:relative;margin:4rem 0}footer .love{margin:0 5px;width:30px;height:30px;vertical-align:middle}@media (min-width: 25em){footer .love{width:40px;height:40px}}footer .love path{fill:#ef4eec}footer .avatar{display:block;position:absolute;top:50%;left:50%;border-radius:50%;-webkit-transition:all .3s ease;-webkit-filter:grayscale(100%);-webkit-transform:translate(-50%, -50%);-moz-transform:translate(-50%, -50%);-ms-transform:translate(-50%, -50%);-o-transform:translate(-50%, -50%);transform:translate(-50%, -50%)}footer .avatar:hover{-webkit-filter:grayscale(0)}footer .nickname{display:inline-block;padding-top:10px;font-size:2.5rem;color:#eee}@media (min-width: 25em){footer .nickname{font-size:3.5rem}}@media (min-width: 42.5em){footer .nickname{font-size:5rem}}footer .nickname:first-of-type{margin-right:60px}@media (min-width: 42.5em){footer .nickname:first-of-type{padding-left:19px}}footer .nickname:last-of-type{margin-left:60px}footer .links>*{display:inline-block}pre[class*="language-"]{margin:1.5rem 0;padding:1em 2em}
