@-webkit-keyframes flipCard{0%{-webkit-transform:translateY(-7%) scale(0.95) rotateY(0deg);transform:translateY(-7%) scale(0.95) rotateY(0deg)}50%{-webkit-transform:translateY(0) scale(1.1) rotateY(180deg);transform:translateY(0) scale(1.1) rotateY(180deg)}100%{-webkit-transform:translateY(0) scale(1) rotateY(180deg);transform:translateY(0) scale(1) rotateY(180deg)}}@keyframes flipCard{0%{-webkit-transform:translateY(-7%) scale(0.95) rotateY(0deg);transform:translateY(-7%) scale(0.95) rotateY(0deg)}50%{-webkit-transform:translateY(0) scale(1.1) rotateY(180deg);transform:translateY(0) scale(1.1) rotateY(180deg)}100%{-webkit-transform:translateY(0) scale(1) rotateY(180deg);transform:translateY(0) scale(1) rotateY(180deg)}}@-webkit-keyframes flipCardScale{0%{-webkit-transform:translateY(-7%) scale(0.95);transform:translateY(-7%) scale(0.95)}50%{-webkit-transform:translateY(0) scale(1.1);transform:translateY(0) scale(1.1)}100%{-webkit-transform:translateY(0) scale(1);transform:translateY(0) scale(1)}}@keyframes flipCardScale{0%{-webkit-transform:translateY(-7%) scale(0.95);transform:translateY(-7%) scale(0.95)}50%{-webkit-transform:translateY(0) scale(1.1);transform:translateY(0) scale(1.1)}100%{-webkit-transform:translateY(0) scale(1);transform:translateY(0) scale(1)}}@-webkit-keyframes flipCardFaceOver{0%{-webkit-transform:rotateY(0deg);transform:rotateY(0deg)}50%{-webkit-transform:rotateY(-180deg);transform:rotateY(-180deg)}100%{-webkit-transform:rotateY(-180deg);transform:rotateY(-180deg)}}@keyframes flipCardFaceOver{0%{-webkit-transform:rotateY(0deg);transform:rotateY(0deg)}50%{-webkit-transform:rotateY(-180deg);transform:rotateY(-180deg)}100%{-webkit-transform:rotateY(-180deg);transform:rotateY(-180deg)}}@-webkit-keyframes flipCardFaceBack{0%{-webkit-transform:rotateY(180deg);transform:rotateY(180deg)}50%{-webkit-transform:rotateY(0deg);transform:rotateY(0deg)}100%{-webkit-transform:rotateY(0deg);transform:rotateY(0deg)}}@keyframes flipCardFaceBack{0%{-webkit-transform:rotateY(180deg);transform:rotateY(180deg)}50%{-webkit-transform:rotateY(0deg);transform:rotateY(0deg)}100%{-webkit-transform:rotateY(0deg);transform:rotateY(0deg)}}@-webkit-keyframes click{0%{-webkit-transform:scale(1);transform:scale(1)}50%{-webkit-transform:scale(0.95);transform:scale(0.95)}75%{-webkit-transform:scale(0.75);transform:scale(0.75)}100%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes click{0%{-webkit-transform:scale(1);transform:scale(1)}50%{-webkit-transform:scale(0.95);transform:scale(0.95)}75%{-webkit-transform:scale(0.75);transform:scale(0.75)}100%{-webkit-transform:scale(1);transform:scale(1)}}@-webkit-keyframes swayCard{0%,10%{-webkit-transform:translateX(-10%) rotate(-5deg);transform:translateX(-10%) rotate(-5deg)}90%,100%{-webkit-transform:translateX(10%) rotate(5deg);transform:translateX(10%) rotate(5deg)}}@keyframes swayCard{0%,10%{-webkit-transform:translateX(-10%) rotate(-5deg);transform:translateX(-10%) rotate(-5deg)}90%,100%{-webkit-transform:translateX(10%) rotate(5deg);transform:translateX(10%) rotate(5deg)}}@-webkit-keyframes swayPointer{0%,10%{-webkit-transform:translateX(-100%);transform:translateX(-100%)}90%,100%{-webkit-transform:translateX(100%);transform:translateX(100%)}}@keyframes swayPointer{0%,10%{-webkit-transform:translateX(-100%);transform:translateX(-100%)}90%,100%{-webkit-transform:translateX(100%);transform:translateX(100%)}}@-webkit-keyframes swayOverlayRight{50%{opacity:0}90%,100%{opacity:1}}@keyframes swayOverlayRight{50%{opacity:0}90%,100%{opacity:1}}@-webkit-keyframes swayOverlayLeft{0%,10%{opacity:1}50%{opacity:0}}@keyframes swayOverlayLeft{0%,10%{opacity:1}50%{opacity:0}}@-webkit-keyframes swipeDemoPointer{0%,10%{-webkit-transform:translateX(-100%) rotate(-15deg);transform:translateX(-100%) rotate(-15deg)}90%,100%{-webkit-transform:translateX(100%) rotate(15deg);transform:translateX(100%) rotate(15deg)}}@keyframes swipeDemoPointer{0%,10%{-webkit-transform:translateX(-100%) rotate(-15deg);transform:translateX(-100%) rotate(-15deg)}90%,100%{-webkit-transform:translateX(100%) rotate(15deg);transform:translateX(100%) rotate(15deg)}}@-webkit-keyframes shake{4%,8%,12%,16%{-webkit-transform:translateX(-2%);transform:translateX(-2%)}2%,6%,10%,14%,18%{-webkit-transform:translateX(2%);transform:translateX(2%)}20%{-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes shake{4%,8%,12%,16%{-webkit-transform:translateX(-2%);transform:translateX(-2%)}2%,6%,10%,14%,18%{-webkit-transform:translateX(2%);transform:translateX(2%)}20%{-webkit-transform:translateX(0);transform:translateX(0)}}@-webkit-keyframes rock{0%,100%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}25%{-webkit-transform:rotate(-5deg);transform:rotate(-5deg)}75%{-webkit-transform:rotate(5deg);transform:rotate(5deg)}}@keyframes rock{0%,100%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}25%{-webkit-transform:rotate(-5deg);transform:rotate(-5deg)}75%{-webkit-transform:rotate(5deg);transform:rotate(5deg)}}@-webkit-keyframes cardGood{0%{-webkit-transform:translateY(-5%) rotate(-2deg);transform:translateY(-5%) rotate(-2deg)}100%{-webkit-transform:translateY(5%) rotate(2deg);transform:translateY(5%) rotate(2deg)}}@keyframes cardGood{0%{-webkit-transform:translateY(-5%) rotate(-2deg);transform:translateY(-5%) rotate(-2deg)}100%{-webkit-transform:translateY(5%) rotate(2deg);transform:translateY(5%) rotate(2deg)}}@-webkit-keyframes cardBad{0%{-webkit-transform:translateX(-5%) rotate(-2deg);transform:translateX(-5%) rotate(-2deg)}100%{-webkit-transform:translateX(5%) rotate(2deg);transform:translateX(5%) rotate(2deg)}}@keyframes cardBad{0%{-webkit-transform:translateX(-5%) rotate(-2deg);transform:translateX(-5%) rotate(-2deg)}100%{-webkit-transform:translateX(5%) rotate(2deg);transform:translateX(5%) rotate(2deg)}}*{margin:0;padding:0;border:none}*{-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:rgba(0,0,0,0)}*:active,*:focus{outline:none}body{color:#333;font-size:12px;text-align:center}p{line-height:1.2em}a{color:#4596da}a:hover{text-decoration:none}button,input,select,textarea{font:inherit}.page,.card-face{-webkit-transition:background .4s ease-out;transition:background .4s ease-out}*,*:before,*:after{box-sizing:border-box}html,body{position:relative;width:100%;height:100%;overflow:hidden}body{background:#e0dddd center center;-webkit-transition:background .3s;transition:background .3s}body:before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:center center no-repeat;opacity:0;visibility:hidden;-webkit-transition:opacity .3s, visibility .3s;transition:opacity .3s, visibility .3s}body.splash:before{opacity:1;visibility:visible}.vcenter{display:table;width:100%;height:100%;text-align:center}.vcenter-inner,.vcenter>.inner{display:table-cell;vertical-align:middle}#progress .step,#game,#results,#intro,#story,#description,.card,.card.done{opacity:0;visibility:hidden;-webkit-transition:opacity .3s, visibility .3s;transition:opacity .3s, visibility .3s}.ingame #progress .step,#game.in,#intro.in,#story.in,#results.in,#description.in,.card.current,.card.next{opacity:1;visibility:visible}.hide{display:none !important}#page{width:100%;height:100%}#page .wrapper{padding-top:50px;-webkit-transition:padding .2s ease-out;transition:padding .2s ease-out}#footer{position:absolute;z-index:6;bottom:0;left:0;width:100%;background:#fff;color:#242d7f;font-size:12px;text-align:left;box-shadow:0 0 5px rgba(0,0,0,0.1);-webkit-transform:translateY(100%);transform:translateY(100%);-webkit-transition:-webkit-transform .3s;transition:-webkit-transform .3s;transition:transform .3s;transition:transform .3s, -webkit-transform .3s}.splash #footer{-webkit-transform:translateY(0);transform:translateY(0)}#footer .wrapper{max-width:360px;padding:10px;margin:0 auto;text-align:center;overflow:hidden}#footer img{float:left;width:40px;height:auto;margin-right:1em}#footer p{line-height:40px}#footer .sep{display:inline-block;font:0/0 a;height:20px;margin:0 2px;border-left:1px solid;vertical-align:middle}html,body{-webkit-overflow-scrolling:auto}body[data-correct="0"]{background-color:#f99}body[data-correct="1"]{background-color:#9f9}body.showing-interrupt{background-color:#FFD688}#navigation{position:absolute;top:0;left:0;width:100%;padding:10px 0}#navigation a{color:#333;text-decoration:none}.ingame #navigation{display:none}#progress{position:absolute;top:50px;left:0;width:100%;margin-top:-36px;padding:0 10px;display:none}#progress .step{position:relative;float:left;height:36px}#progress .dot{position:relative;display:block;width:14px;height:14px;margin:0 auto;background:#fff center center no-repeat;box-shadow:0 0 0 1px #333;border-radius:50%}#progress .correct.completed .dot{background-image:url(../img/correct.png)}#progress .incorrect.completed .dot{background-image:url(../img/incorrect.png)}body[data-reaction="1"] #progress .current .face{background-position:-100% 0}body[data-reaction="2"] #progress .current .face,body[data-emotion="happy"] #progress .current .face{background-position:-200% 0}body[data-reaction="-2"] #progress .current .face,body[data-emotion="sad"] #progress .current .face{background-position:0 0}.ingame #progress{display:-webkit-box;display:flex;-webkit-box-pack:center;justify-content:center}#game,#results{position:relative}#game{z-index:2;width:230px;height:230px;margin:0 auto;-webkit-transition:opacity .3s, visibility .3s, -webkit-transform .3s ease-out;transition:opacity .3s, visibility .3s, -webkit-transform .3s ease-out;transition:opacity .3s, visibility .3s, transform .3s ease-out;transition:opacity .3s, visibility .3s, transform .3s ease-out, -webkit-transform .3s ease-out;margin-top:30px}#game.in{-webkit-transform:scale(1);transform:scale(1)}#cards{position:absolute;top:0;left:0;width:100%;height:100%}#intro,#story{position:absolute;z-index:3;left:50%;width:230px;margin-left:-120px;padding-top:20px;padding-bottom:20px;-webkit-transform:scale(0);transform:scale(0);-webkit-transform-origin:70%, -55px;transform-origin:70%, -55px;-webkit-transition:opacity .3s, visibility .3s, border-radius .3s ease-out, -webkit-transform .3s ease-out;transition:opacity .3s, visibility .3s, border-radius .3s ease-out, -webkit-transform .3s ease-out;transition:opacity .3s, visibility .3s, transform .3s ease-out, border-radius .3s ease-out;transition:opacity .3s, visibility .3s, transform .3s ease-out, border-radius .3s ease-out, -webkit-transform .3s ease-out;height:calc(100% - 80px - 230px - 30px);display:-webkit-box;display:flex;-webkit-box-align:center;align-items:center}#intro.in,#story.in{-webkit-transform:scale(1);transform:scale(1)}#intro a,#story a{font-weight:bold}#intro .frame,#story .frame{top:0;left:0;width:100%;max-height:100%;background:#fff;border:20px solid transparent;border-bottom-width:0;border-radius:20px;font-size:1.1rem;overflow:auto;border:5px solid #333;margin:0 auto;max-width:420px}#intro .frame .vcenter-inner,#intro .frame .vcenter .inner,#story .frame .vcenter-inner,#story .frame .vcenter .inner{padding:20px 10px}#intro .content,#intro .more,#story .content,#story .more{margin:0 auto}#intro .content .button,#story .content .button{background:#fff;color:#333;margin:10px 0 0}#intro .content .button:hover,#story .content .button:hover{color:#fff;background:#333}#intro .more,#story .more{display:none}#intro .more:hover,#story .more:hover{color:#fff;background:#333}#intro.for-result .more,#story.for-result .more{background:#fff;color:#333}#intro.has-citation .more,#story.has-citation .more{display:block;margin-top:10px}.pickedupcard #intro,.pickedupcard #story{z-index:1}body[data-correct="0"] #intro,body[data-correct="0"] #intro a,body[data-correct="1"] #intro,body[data-correct="1"] #intro a,body.showing-interrupt #intro,body.showing-interrupt #intro a,body[data-correct="0"] #story,body[data-correct="0"] #story a,body[data-correct="1"] #story,body[data-correct="1"] #story a,body.showing-interrupt #story,body.showing-interrupt #story a{color:#fff}body[data-correct="0"] #intro:before,body[data-correct="1"] #intro:before,body.showing-interrupt #intro:before,body[data-correct="0"] #story:before,body[data-correct="1"] #story:before,body.showing-interrupt #story:before{top:-66px}body[data-correct="0"] #intro:before,body[data-correct="0"] #story:before{background-position:-200% 0}body[data-correct="0"] #intro .frame,body[data-correct="0"] #story .frame{background:#db3939;border-color:#7e1717}body[data-correct="1"] #intro:before,body[data-correct="1"] #story:before{background-position:-100% 0}body[data-correct="1"] #intro .frame,body[data-correct="1"] #story .frame{background:#66bb46;border-color:#335f23}body.showing-interrupt #intro:before,body.showing-interrupt #story:before{background-position:-300% 0}body.showing-interrupt #intro .frame,body.showing-interrupt #story .frame{color:#FFFFFF;border-color:#173b41;background:#2b6a73}#intro{height:calc(100% - 50px - 230px - 60px - 30px)}#intro .frame{-webkit-transform:scale(0);transform:scale(0);-webkit-transform-origin:113px, 2px;transform-origin:113px, 2px;-webkit-transition:opacity .2s, visibility .2s, -webkit-transform .2s ease-out;transition:opacity .2s, visibility .2s, -webkit-transform .2s ease-out;transition:opacity .2s, visibility .2s, transform .2s ease-out;transition:opacity .2s, visibility .2s, transform .2s ease-out, -webkit-transform .2s ease-out}.splash #intro .frame{-webkit-transform:scale(1);transform:scale(1);-webkit-transition-delay:1s;transition-delay:1s;font-weight:bold}.dismissing #intro .frame{-webkit-transform:scale(0);transform:scale(0);-webkit-transition-delay:0s;transition-delay:0s}#results{font-size:20px;margin:0 20px;-webkit-transform:scale(0);transform:scale(0);-webkit-transition:opacity .3s, visibility .3s, -webkit-transform .3s ease-out;transition:opacity .3s, visibility .3s, -webkit-transform .3s ease-out;transition:opacity .3s, visibility .3s, transform .3s ease-out;transition:opacity .3s, visibility .3s, transform .3s ease-out, -webkit-transform .3s ease-out}#results .graphic{position:relative;display:block;width:140px;height:140px;border-radius:50%;box-shadow:inset -20px -20px 0 0 rgba(0,0,0,0.1),0 0 0 5px #333;background-color:#fff;margin:0 auto 15px;-webkit-animation:rock 2s linear infinite;animation:rock 2s linear infinite;background:#fff center center no-repeat;background-size:cover}#results .title{font-size:1.5em;font-weight:bold;margin:0 0 15px}#results .breakdown{list-style:none;margin:0 0 10px}#results .breakdown .count{display:inline-block;width:50px;height:50px;border-radius:10px;border:5px solid;margin:0 5px;color:#333;font-weight:bold;line-height:40px}#results .breakdown .count-correct{background:#ddffd0;border-color:#68cd41}#results .breakdown .count-incorrect{background:#ff9999;border-color:#f15959}#results.in{-webkit-transform:scale(1);transform:scale(1)}#results.in .breakdown-count{-webkit-transform:rotateY(0);transform:rotateY(0)}#results .next{display:none}#results .button.next,#results .button.reset{padding:15px 40px}#results.has-newround .next{display:inline-block}#results.has-newround .reset{display:none}#description{display:none;width:250px;font-size:1em;margin:0 auto}#description .content{height:3.6em}.panel{position:absolute;z-index:5;background:#fff;border:20px solid #fff;box-shadow:0 0 0 5px #333,-8px 8px 0 5px rgba(0,0,0,0.25);border-radius:20px;border-bottom:none;padding-bottom:5px;margin-bottom:-5px;font-size:1rem;text-align:center;-webkit-transition:-webkit-transform .3s ease-out;transition:-webkit-transform .3s ease-out;transition:transform .3s ease-out;transition:transform .3s ease-out, -webkit-transform .3s ease-out;-webkit-transform:translateY(100%);transform:translateY(100%);visibility:hidden;top:0;left:0;bottom:0;right:0;margin:auto;max-width:500px;max-height:600px;width:90%;height:90%}.panel .close{position:absolute;top:0;right:0;width:40px;height:40px;font:0/0 a;margin:-35px -35px 0 0;border:3px solid #333;background:#fff;box-shadow:-4px 4px 0 0 rgba(0,0,0,0.25);border-radius:50%;padding:0;cursor:pointer;-webkit-transition:background .2s, color .2s, -webkit-transform .3s ease-out;transition:background .2s, color .2s, -webkit-transform .3s ease-out;transition:transform .3s ease-out, background .2s, color .2s;transition:transform .3s ease-out, background .2s, color .2s, -webkit-transform .3s ease-out;-webkit-transform:scale(0);transform:scale(0)}.panel .close:after{content:'\00d7';font:20px/35px sans-serif;display:block}.panel .close:hover{color:#fff;background:#4596da}.panel .graphic{display:block;width:150px;height:150px;margin:0 auto 30px;border-radius:50%;box-shadow:inset -10px -10px 0 0 rgba(0,0,0,0.1);background:center center no-repeat;background-size:cover}.panel .title{font-size:2em;font-weight:bold;margin:0 0 .5em}.panel .title:empty{display:none}.panel .frame{position:absolute;top:0;left:0;width:100%;height:100%;overflow:auto}.panel .content,.panel .buttons{margin:0 0 1em}.panel.in{visibility:inherit;-webkit-transform:translateY(0) scale(1);transform:translateY(0) scale(1);visibility:visible}.panel.in .close{-webkit-transform:scale(1);transform:scale(1)}.button{display:inline-block;background:#333;color:#fff;font-size:1em;line-height:1em;padding:.55em .75em .45em;border:none;border-radius:.5em;text-decoration:none;cursor:pointer;margin:0 .2em .5em;box-shadow:-3px 3px 0 0 rgba(0,0,0,0.1);vertical-align:middle;-webkit-transition:background .2s;transition:background .2s}.button:hover,.button:active,.button[type="submit"]{background:#4596da}.visuallyhidden{position:absolute !important;height:1px;width:1px;overflow:hidden;clip:rect(1px 1px 1px 1px);clip:rect(1px, 1px, 1px, 1px);white-space:nowrap}#claim{background:#246AA5;display:block;width:100%;max-width:305px;padding:10px 20px;border-radius:10px;text-decoration:none;color:white;text-align:center;margin:20px auto}#claim:hover,#claim:focus{background:#1b4f7b}.share-list{margin:20px auto;display:-webkit-box;display:flex;-webkit-box-pack:center;justify-content:center;-webkit-box-align:center;align-items:center;list-style:none}.share-list h3{margin-bottom:1rem}.share-list li{margin:0 5px}.share-list a{display:-webkit-box;display:flex;width:48px;height:48px;border-radius:20px;background-color:white;-webkit-box-pack:center;justify-content:center;-webkit-box-align:center;align-items:center}.share-list a svg{display:block}.share-list a:hover,.share-list a:focus{box-shadow:inset 0 0 0 3px #333}form.panel .content{white-space:normal}.field{display:block;position:relative;margin:0 0 20px}.field .label,.field .input{display:block;width:100%;margin:0;padding:10px;font-size:1em;line-height:1.4em;border:none;border-radius:10px}.field .label{position:absolute;top:0;left:0;border:4px solid transparent}.field .input{position:relative;z-index:1;border:2px solid #333;background:transparent}.field .input:active,.field .input:focus{border-color:#4596da}.field .input:active,.field .input:focus,.field .input.filled{background:#fff}#about .frame{padding-bottom:20px}#about p{margin:0 0 1.4em;text-align:left}.bubbles{font-size:14px;list-style:none;text-align:center;margin:0 auto;max-width:250px}.bubbles li{display:inline-block;margin:0 5px 10px;cursor:pointer;font-weight:bold;-webkit-transition:color .2s;transition:color .2s}.bubbles li:hover{color:#4596da}.bubbles li:hover .graphic{border-color:#4596da}.bubbles .graphic{position:relative;display:block;width:80px;height:80px;margin:0 auto 5px;border:3px solid #333;-webkit-transition:border .2s;transition:border .2s}#share .title{font-size:20px}#share p{font-size:12px;margin:0 0 1em}.card{position:absolute;z-index:1;top:0;left:0;width:100%;height:100%;cursor:pointer;will-change:transform, opacity;-webkit-transition:opacity .3s, visibility .3s, -webkit-transform .1s ease-out;transition:opacity .3s, visibility .3s, -webkit-transform .1s ease-out;transition:transform .1s ease-out, opacity .3s, visibility .3s;transition:transform .1s ease-out, opacity .3s, visibility .3s, -webkit-transform .1s ease-out;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.card .title{font-size:20px;font-weight:bold}.card-wrapper,.card-inner{width:100%;height:100%}.card-face{position:absolute;top:0;bottom:0;left:0;right:0;background:#f5f0e2;border:5px solid #333;border-radius:30px}.card-face.front{z-index:2;box-shadow:0 0 0 0 rgba(0,0,0,0);-webkit-transition:box-shadow .15s;transition:box-shadow .15s}.card-face.back{z-index:1;background:center center no-repeat;background-size:contain}.card-content{position:relative;z-index:1;width:100%;height:100%;background:#f5f0e2;border-radius:25px}.card-content .title{position:absolute;bottom:0;left:0;width:100%;padding:20px 24px;text-align:left}.card-content .vcenter-inner{padding:30px}.card-graphic{position:absolute;top:0;left:0;width:100%;height:100%;background:0 0 no-repeat;background-size:cover;border-radius:25px}.card-graphic.sprite-full{background-size:400% 100%}.card-graphic.sprite-result{background-size:200% 100%}.card[data-direction="left"] .card-graphic.sprite-full{background-position:33.3333333333% 0}.card[data-direction="right"] .card-graphic.sprite-full{background-position:66.6666666667% 0}.result .card-graphic.sprite-full,.result .card-graphic.sprite-result{background-position:100% 0}.card-face.back .card-content{display:none}.card.setup .card-wrapper,.card.setup .card-inner,.card.setup .card-face{will-change:transform;-webkit-transition:-webkit-transform .15s ease-out;transition:-webkit-transform .15s ease-out;transition:transform .15s ease-out;transition:transform .15s ease-out, -webkit-transform .15s ease-out}.card.setup .card-inner{-webkit-perspective:1000px;perspective:1000px;-webkit-transform:translateY(-7%) scale(0.95);transform:translateY(-7%) scale(0.95)}.card.setup .card-face{-webkit-backface-visibility:hidden;backface-visibility:hidden}.card.setup .card-face.front{-webkit-transform:rotateY(180deg);transform:rotateY(180deg)}.card.current{z-index:3}.card.current .card-inner{-webkit-transform:translateY(0) scale(1);transform:translateY(0) scale(1);-webkit-animation:flipCardScale 1.5s ease-in-out both;animation:flipCardScale 1.5s ease-in-out both}.card.current .card-face.front{-webkit-transform:rotateY(0deg);transform:rotateY(0deg);-webkit-animation:flipCardFaceBack 1.5s ease-in-out both;animation:flipCardFaceBack 1.5s ease-in-out both}.card.current .card-face.back{-webkit-transform:rotateY(180deg);transform:rotateY(180deg);-webkit-animation:flipCardFaceOver 1.5s ease-in-out both;animation:flipCardFaceOver 1.5s ease-in-out both}.card.current .card-face.front{box-shadow:-5px 5px 0 0 rgba(0,0,0,0.2)}.card.next{z-index:2}.card.active,.card.out{z-index:4}.card.out,.card.out .card-wrapper,.card.out .card-inner{-webkit-transition:.5s;transition:.5s}.card.done,.card.done .card-face{-webkit-transition-duration:0;transition-duration:0}.card .card-overlay{position:absolute;z-index:2;visibility:visible;opacity:1;-webkit-transition:opacity .2s, visibility .2s;transition:opacity .2s, visibility .2s}.card .overlay-left,.card .overlay-right{top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);width:80px;height:80px;border-radius:50%;border:5px solid #333;background:white;padding:10px}.card .overlay-left .title,.card .overlay-right .title{position:relative;display:inline-block;font-size:18px;line-height:1em;text-align:center;padding:0;white-space:normal;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.card .overlay-left{right:0;margin-right:-40px}.card .overlay-right{left:0;margin-left:-40px}.card.dragging .card-face.front{box-shadow:-15px 15px 0 0 rgba(0,0,0,0.1)}.card#welcome .card-content .title{font-size:14px;line-height:1.2em;text-align:center;color:#02838F;padding:20px 10px}.card.survey.current .card-wrapper{-webkit-animation:rock 1s ease-in-out alternate infinite;animation:rock 1s ease-in-out alternate infinite}.card.survey.active .card-wrapper,.card.survey.dragging .card-wrapper{-webkit-animation:none;animation:none}.card#instructions:after{content:'';position:absolute;top:75%;left:50%;width:97px;height:126px;margin:-69px 0 0 -48px;background:url(../img/pointer.png) 0 0 no-repeat;background-size:100%;opacity:0;visibility:hidden;-webkit-transition:opacity .2s, visibility .2s;transition:opacity .2s, visibility .2s}.card.result .overlay-left{opacity:1}.card.current{-webkit-animation:swayCard 2s .375s ease-in-out alternate infinite;animation:swayCard 2s .375s ease-in-out alternate infinite}.card.current#instructions:after{opacity:1;visibility:visible;-webkit-animation:swayPointer 2s .375s ease-in-out alternate infinite;animation:swayPointer 2s .375s ease-in-out alternate infinite}.card.current.result{-webkit-animation:none;animation:none}.card.current.choice{-webkit-animation:rock 2s 5s linear infinite;animation:rock 2s 5s linear infinite}.card.current.choice h2{display:none}.card.current.choice .overlay-left,.card.current.choice .overlay-right{-webkit-animation:none;animation:none}.card.choice .title,.card.result .title,.card.slide .title{text-shadow:1px 1px 3px #fff, 1px -1px 3px #fff, -1px 1px 3px #fff, -1px -1px 3px #fff}.card.result .card-content .title:before{content:'';float:left;width:1em;height:1em;box-shadow:0 0 0 2px #333;border-radius:50%;background:#fff center center no-repeat;margin:0.1em .5em 0 0}body[data-correct="0"] .card.result .card-content .title:before{background-image:url(../img/incorrect.png)}body[data-correct="1"] .card.result .card-content .title:before{background-image:url(../img/correct.png)}.card.result .more{position:absolute;top:0;right:0;width:60px;height:60px;background:#333;color:#fff;border:none;border-radius:50%;font-size:36px;font-weight:bold;margin:20px;cursor:pointer;box-shadow:-5px 5px 0 0 rgba(0,0,0,0.25);opacity:0;visibility:hidden;-webkit-transition:background .2s, opacity .2s, visibility .2s;transition:background .2s, opacity .2s, visibility .2s;-webkit-animation:rock 1s ease-in-out alternate infinite;animation:rock 1s ease-in-out alternate infinite}.card.result .more:hover{background:#4596da}.card.result.current .more{opacity:1;visibility:visible;-webkit-transition-delay:0s, .5s, .5s;transition-delay:0s, .5s, .5s}.card.active,.card.active:after,.card.active .card-wrapper,.card.active .card-overlay,.card.dragging,.card.dragging:after,.card.dragging .card-wrapper,.card.dragging .card-overlay{-webkit-animation:none !important;animation:none !important}.card.active#instructions:after,.card.dragging#instructions:after{opacity:0;visibility:hidden}.card.dragging{-webkit-transition:none !important;transition:none !important}@media screen and (max-width: 419px){#story,#intro{left:0;width:100%;margin-left:0}#story .frame,#intro .frame{width:85%}#story .more,#intro .more{width:150px;height:35px}}@media screen and (max-width: 419px) and (max-height: 590px){#results{margin-top:-70px}}@media screen and (min-width: 320px) and (min-height: 690px){#game{width:230px;height:230px}#results .graphic{width:200px;height:200px}#welcome .title{font-size:14px}#welcome .vcenter-inner{padding:15px}}@media screen and (min-width: 320px) and (min-height: 530px){#progress{top:60px}#page .wrapper{padding-top:80px}#intro{height:calc(100% - 80px - 230px - 60px - 30px)}#welcome .card-content .title{font-size:16px}}@media screen and (min-width: 370px) and (min-height: 660px){#game{width:280px;height:280px}#story,#intro{height:calc(100% - 50px - 280px - 25px - 30px)}#intro{height:calc(100% - 50px - 280px - 90px - 30px)}.bubbles .graphic{width:100px;height:100px}#prizes ul{font-size:14px;max-width:300px}#welcome .title{font-size:14px}}@media screen and (min-width: 420px){#progress,#story,#intro{left:50%;width:420px;margin-left:-210px}body{font-size:14px}}@media screen and (min-width: 768px) and (min-height: 700px){body,input,textarea{font-size:16px}#game{width:360px;height:360px}#page{display:table}#page .wrapper{display:table-cell;vertical-align:middle;padding-top:110px;padding-bottom:290px}#story,#intro{height:calc(100% - 50px - 280px - 140px - 30px);bottom:auto;width:360px;margin-left:-180px;-webkit-box-align:start;align-items:flex-start}#story .frame,#intro .frame{position:relative;max-height:none}#intro{height:calc(100% - 20px - 360px - 170px - 30px)}#welcome{width:75%;height:75%;margin:12.5%}#welcome .title{font-size:16px}#intro{margin-top:0}.card .overlay-left,.card .overlay-right{width:108px;height:108px;padding:15px}.card .overlay-left{margin-right:-54px}.card .overlay-right{margin-left:-54px}}@media screen and (min-width: 600px) and (min-height: 600px){.panel{-webkit-transition:-webkit-transform .2s ease-out;transition:-webkit-transform .2s ease-out;transition:transform .2s ease-out;transition:transform .2s ease-out, -webkit-transform .2s ease-out;-webkit-transform:scale(0);transform:scale(0)}.panel.in{-webkit-transform:scale(1);transform:scale(1)}#share{width:300px;height:200px;margin-left:-150px;margin-top:-100px}}@media screen and (min-width: 768px) and (min-height: 800px){#results .graphic{width:320px;height:320px;padding:0}#progress{top:100px}#progress .dot{width:20px;height:20px}#game{width:420px;height:420px}#story,#intro{height:calc(100% - 50px - 420px - 100px - 30px);width:420px;margin-left:-210px}#intro{height:calc(100% - 50px - 420px - 145px - 30px)}.card .card-content .title,#welcome .card-content .title{font-size:20px}#welcome .title{font-size:24px}}@media screen and (min-width: 1024px) and (min-height: 768px){#buttons{bottom:80px}}
/*# sourceMappingURL=game.css.map */