html{background:transparent;-webkit-tap-highlight-color:transparent}body,html{margin:0;padding:0}body{font-family:Arial,Helvetica,sans-serif;background-color:#e6e6e6;background:linear-gradient(#ebeff0,#ececec);overflow-x:hidden}.page{margin:0;width:100%;display:flex;flex-direction:column;justify-content:start;align-content:center;box-sizing:border-box;padding:0 0 10px;min-height:100vh;min-height:calc(var(--vh, 1vh) * 100)}@media screen and (orientation:landscape){.page{padding:0;justify-content:center}}.retry{cursor:pointer;position:absolute;right:2px;top:2px;font-weight:700;text-align:center;width:40px;height:40px;box-sizing:border-box;background-image:url(img/undo-button.svg);background-size:contain;background-color:#00679c;border:5px solid #00679c;border-radius:100%}.exercise-template{z-index:1;position:relative}.container{position:relative;border-radius:0;width:100%;max-width:1000px;margin:0 auto;min-height:50vh;padding:8px;padding-bottom:calc(2vh + 30px);box-sizing:border-box;flex:0;display:flex;flex-direction:column;justify-content:center;align-items:center;overflow:hidden}.container:before{box-sizing:border-box;pointer-events:none;content:"";position:absolute;background-color:#fff;top:8px;left:8px;width:calc(100% - 8px * 2);height:calc(100% - 8px * 2);border-radius:12px}@media (min-width:600px) and (min-height:600px){.container{padding:10px;padding-bottom:30px}}.centered-container{max-width:900px;flex:1;display:flex;justify-content:center;align-items:center;flex-wrap:wrap;width:100%;position:relative}.space-around{justify-content:space-around}.title{box-shadow:none;font-weight:700;overflow:visible;justify-self:start;background-color:#f4ce02;color:#06469c;padding:10px 18px 8px;border-radius:4px;margin:0 32px;margin-top:-6px;font-size:18px}
/*    !*border-top-right-radius: 0;*/.subtitle,.title{text-align:center;position:relative}.subtitle{padding:8px 3%;padding-bottom:10px;font-size:14px;max-width:550px}@media (min-width:600px) and (min-height:600px){.title{font-size:22px}.subtitle{font-size:18px}}div{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.page-container{background-size:100% 100%}.draggable,.draggable-infinite{border-radius:8px;background:#fff;cursor:url(img/hand.png),move;box-shadow:0 2px 4px #999}.dropLetterOver:not(.dropped){background-color:#a9f0f9}.draggable-infinite{display:block!important}.draggable-infinite[data-count="0"]{visibility:hidden;pointer-events:none}.title{background-color:#00a6b0;padding:6px 16px;padding-bottom:0}.title>img{height:36px}.oca-table{width:100%;max-width:calc(95vh - 225px);position:relative;background-position:50% 70%;background-size:cover;display:flex}.oca-table:before{content:"";display:block;padding-top:100%}.dice-container{min-width:150px;min-height:150px;margin:0;display:flex;flex-wrap:wrap;justify-content:center}#oca-timer,.dice-intro{display:flex;width:140px;text-align:center}#oca-timer{font-family:monospace;font-weight:600;color:#fff;font-size:28px;text-shadow:0 1px 2px rgba(0,0,0,.29);margin:0 auto;padding-bottom:5px;align-items:center;justify-content:center;white-space:nowrap}#oca-timer.initial{color:#fff;font-family:Arial,Helvetica,sans-serif;font-size:14px}#dice-scale{position:relative;transform:scale3d(.5,.5,.5);width:150px;height:150px}#dice-number{font-size:10px}.t-c{box-sizing:border-box;flex:1;position:relative;margin:-7.5% -3% 1.5% 0}[data-step]{width:30px;height:30px;position:absolute;border-radius:100%;margin-left:-15px;margin-top:-15px;line-height:30px;text-align:center;color:#fff;font-weight:700;opacity:1;font-size:3vh;font-family:sans-serif}.oca-around{margin-top:4px;flex-direction:column}.disabled-click{pointer-events:none!important}#dice-wrap{margin-left:-25px;margin-top:-25px}.dice-container:after{right:40px}@media (orientation:landscape){.dice-container{margin:0 20px}.dice-container:after{right:auto}.oca-around{padding-left:25px;flex-direction:row;flex-wrap:nowrap;justify-content:space-evenly}.dice-intro{margin-top:-30px;height:60px;width:100%}.oca-table{width:500px;max-width:calc(100vh - 100px)}.oca-table:before{content:"";display:block}}#success-message{position:absolute;background-color:#05984d;color:#fff;margin:auto;height:160px;padding:20px;box-sizing:border-box;top:calc(50% - 80px);width:240px;left:calc(50% - 120px);border-radius:8px;font-size:18px;line-height:26px;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:4;box-shadow:0 0 3px 2px rgba(0,0,0,.1);pointer-events:none}#success-message.hidden{display:none}#success-message button{pointer-events:all;position:relative;background-image:none;width:auto;height:auto;padding:10px 16px;margin-top:10px;font-size:16px;text-transform:uppercase;background-color:#fff;color:#036e3e;border:none;border-radius:6px}#success-message h4{font-size:20px;margin:0;margin-bottom:4px}.oca-table .pedina{width:8%;height:8%;margin-top:-4%;margin-left:-4%;position:absolute;background-color:#c81e00;border:2px solid #fff;box-sizing:border-box;box-shadow:0 0 5px rgba(0,0,0,.4);border-radius:100%}.oca-questions{z-index:3;position:fixed;top:0;left:0;display:flex;width:100%;height:100vh;pointer-events:none;justify-content:center;align-items:center}.oca-questions-modal{pointer-events:all;display:none;opacity:0;max-width:98%;width:400px;padding:16px;box-sizing:border-box;border-radius:8px;background-image:linear-gradient(#e6efff,#a1c1f9);color:#222;box-shadow:0 2px 4px 6px rgba(0,0,0,.15)}.oca-questions-list{padding:0;margin:0}.oca-questions-list li{list-style:none;padding:20px 30px;border:1px solid #739cf6;font-size:18px;line-height:22px;text-align:center;background-color:rgba(219,231,255,.75);border-bottom:0}.oca-questions-list li:first-child{border-top-left-radius:8px;border-top-right-radius:8px}.oca-questions-list li:last-child{border-bottom-left-radius:8px;border-bottom-right-radius:8px;border-bottom:1px solid #739cf6}.oca-questions-modal h2{font-size:18px;font-weight:500;margin:0;margin-bottom:10px}.oca-questions-modal.active{display:block}[data-step="0"]{top:91.1%;left:12.2%}[data-step="1"]{top:91.1%;left:29.7%}[data-step="2"]{top:91.1%;left:42.7%}[data-step="3"]{top:91.1%;left:54.2%}[data-step="4"]{top:88%;left:66.2%}[data-step="5"]{top:80.9%;left:76.3%}[data-step="6"]{top:71.7%;left:83.8%}[data-step="7"]{top:60.7%;left:87.5%}[data-step="8"]{top:49.2%;left:87.6%}[data-step="9"]{top:38.2%;left:84.6%}[data-step="10"]{top:28.2%;left:77.6%}[data-step="11"]{top:20.5%;left:67.4%}[data-step="12"]{top:17.3%;left:56.2%}[data-step="13"]{top:17.3%;left:42.8%}[data-step="14"]{top:21.5%;left:32.4%}[data-step="15"]{top:30.5%;left:24.4%}[data-step="16"]{top:41.5%;left:20.4%}[data-step="17"]{top:53.5%;left:21.4%}[data-step="18"]{top:63.5%;left:27.4%}[data-step="19"]{top:70.2%;left:36.9%}[data-step="20"]{top:73%;left:49.4%}[data-step="21"]{top:69.5%;left:60.6%}[data-step="22"]{top:60%;left:67.4%}[data-step="23"]{top:48.5%;left:68.4%}[data-step="24"]{top:39.5%;left:61.4%}[data-step="25"]{top:35.5%;left:49.4%}[data-step="26"]{top:42.5%;left:40.4%}[data-step="27"]{top:54.3%;left:49.2%}@keyframes a{0%{transform:translateZ(-100px) rotateX(0deg) rotateY(0deg) rotate(0deg)}16%{transform:translateZ(-100px) rotateX(180deg) rotateY(180deg) rotate(0deg)}33%{transform:translateZ(-100px) rotateX(1turn) rotateY(90deg) rotate(180deg)}50%{transform:translateZ(-100px) rotateX(1turn) rotateY(1turn) rotate(1turn)}66%{transform:translateZ(-100px) rotateX(180deg) rotateY(1turn) rotate(270deg)}83%{transform:translateZ(-100px) rotateX(270deg) rotateY(180deg) rotate(180deg)}to{transform:translateZ(-100px) rotateX(1turn) rotateY(1turn) rotate(1turn)}}@keyframes b{0%{transform:translateZ(0)}50%{transform:translate3d(-50px,0,0)}to{transform:translate3d(50px,0,0)}}@keyframes c{0%{transform:scaleX(1);opacity:1}50%{transform:scale3d(1.2,1.2,1.2);opacity:.9}to{transform:scaleX(1);opacity:1}}#dice-wrap.n1>#dice{transform:translateZ(-100px) rotateX(0deg) rotateY(0deg) rotate(0deg)}#dice-wrap.n2>#dice{transform:translateZ(-100px) rotateX(180deg) rotateY(270deg) rotate(270deg)}#dice-wrap.n3>#dice{transform:translateZ(-100px) rotateX(180deg) rotateY(90deg) rotate(1turn)}#dice-wrap.n4>#dice{transform:translateZ(-100px) rotateX(180deg) rotateY(270deg) rotate(1turn)}#dice-wrap.n5>#dice{transform:translateZ(-100px) rotateX(270deg) rotateY(180deg) rotate(180deg)}#dice-wrap.n6>#dice{transform:translateZ(-100px) rotateX(180deg) rotateY(1turn) rotate(0deg)}.dice-container{position:relative}.dice-container:after{pointer-events:none;z-index:2;content:"";display:block;position:absolute;bottom:-40px;height:80px;width:80px;background-image:url(img/click-hand.png);background-size:contain;transition:all .2s ease-in-out;opacity:0}.dice-container:not(.disabled-click):after{opacity:1;animation:c .9s infinite linear}#dice-wrap.roll{animation:b .4s infinite linear}#dice-wrap.roll>#dice{animation:a 1.5s infinite linear}#dice-wrap{width:100%;height:100%;transform-style:preserve-3d;perspective:700px}#dice-wrap:after{content:"";padding-top:100%;display:block}#dice{transform-style:preserve-3d}#dice,.side{position:absolute;width:200px;height:200px}.side{background:#fff;box-shadow:inset 0 0 40px #ccc;border-radius:40px}#dice .cover,#dice .inner{background:#e0e0e0;box-shadow:none}#dice .cover{border-radius:0;transform:translateZ(0)}#dice .cover.x{transform:rotateY(90deg)}#dice .cover.z{transform:rotateX(90deg)}#dice .front{transform:translateZ(100px)}#dice .front.inner{transform:translateZ(98px)}#dice .back{transform:rotateX(-180deg) translateZ(100px)}#dice .back.inner{transform:rotateX(-180deg) translateZ(98px)}#dice .right{transform:rotateY(90deg) translateZ(100px)}#dice .right.inner{transform:rotateY(90deg) translateZ(98px)}#dice .left{transform:rotateY(-90deg) translateZ(100px)}#dice .left.inner{transform:rotateY(-90deg) translateZ(98px)}#dice .top{transform:rotateX(90deg) translateZ(100px)}#dice .top.inner{transform:rotateX(90deg) translateZ(98px)}#dice .bottom{transform:rotateX(-90deg) translateZ(100px)}#dice .bottom.inner{transform:rotateX(-90deg) translateZ(98px)}.dot{position:absolute;width:46px;height:46px;border-radius:23px;background:#444;box-shadow:inset 5px 0 10px #000}.dot.center{margin:77px 0 0 77px}.dot.dtop{margin-top:20px}.dot.dleft{margin-left:134px}.dot.dright{margin-left:20px}.dot.dbottom{margin-top:134px}.dot.center.dleft{margin:77px 0 0 20px}.dot.center.dright{margin:77px 0 0 134px}