@import url(https://fonts.googleapis.com/css?family=Roboto);@keyframes wiggle{0%{transform:rotate(0deg)}50%{transform:rotate(0deg)}75%{transform:rotate(2deg)}95%{transform:rotate(-2deg)}to{transform:rotate(0deg)}}@-webkit-keyframes wiggle{0%{transform:rotate(0deg)}50%{transform:rotate(0deg)}75%{transform:rotate(2deg)}95%{transform:rotate(-2deg)}to{transform:rotate(0deg)}}@keyframes hint{50%{transform:scale(1.1)}}@-webkit-keyframes hint{50%{transform:scale(1.1)}}@keyframes blinker{50%{opacity:0}}@-webkit-keyframes blinker{50%{opacity:0}}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg)}to{-webkit-transform:rotate(1turn)}}@keyframes blink-border{25%{border-color:#e9e9e9}75%{border-color:#e9e9e9}}@-webkit-keyframes blink-border{25%{border-color:#e9e9e9}75%{border-color:#e9e9e9}}*{font-family:Roboto,sans-serif}button:focus{outline:0!important}body{display:-webkit-flex;display:flex;-webkit-flex-direction:column;flex-direction:column}main{-webkit-flex:1;flex:1}.flex-center{align-items:center}.flex-center,.flex-center-horizontal{display:flex;justify-content:center}#box-game{position:relative;max-width:400px;max-height:500px;height:calc(100% - 5px);width:100%;box-shadow:0 0 10px 2px #888;background-color:#fff;margin-top:5px}button:focus{outline:none}.ripple{position:relative;overflow:hidden;transform:translateZ(0)}.ripple:after{content:"";display:block;position:absolute;width:100%;height:100%;top:0;left:0;pointer-events:none;background-image:radial-gradient(circle,#000 10%,transparent 10.01%);background-repeat:no-repeat;background-position:50%;transform:scale(10);opacity:0;transition:transform .5s,opacity 1s}.ripple:active:after{transform:scale(0);opacity:.2;transition:0s}#react-body{width:100%}#react-body,.box{position:relative;height:100%}.box{display:inline}.game-page{height:100%;width:100%}.game-view{width:calc(100% - 20px);border:2px solid #00ccc9;border-radius:10px;padding:2px;display:block;margin:10px;height:calc(100% - 90px);position:absolute}.game-page-body{height:calc(100% - 60px);display:flex;flex-direction:column}.game-controller{padding:5px;margin:10px;white-space:nowrap;position:absolute;bottom:0;width:calc(100% - 20px);height:50px}.game-controller-btn{width:33.33333333%;display:inline-block;font-size:30px}.game-message{padding:1px 5px;text-align:center;padding-bottom:10%;color:#74736e}.game-image{padding:5px}.game-image img{height:50px;transform:translate(-50%);position:relative;left:50%}.game-description{background-color:#eee;flex:1;overflow:auto}.game-description p{line-height:25px;padding:5px;text-align:center}.low-opacity-web{opacity:.2;cursor:not-allowed}.new-word{border:1px solid #483734;background-color:#ddf;border-radius:3px;padding:1px;margin:0 2px}.game-mcq{height:calc(100% - 60px);overflow:auto}.mcq-question{min-height:20%;text-align:center;padding:10px}.mcq-options{height:60%;padding:10px}.mcq-option{border-radius:3px;padding:10px;height:25%;color:#000}.mcq-option:enabled:hover{background-color:gray}.mcq-option label{font-weight:400;margin:0}.correct{background-color:lime}.correct,.wrong{display:inline-block;padding:1px;color:#fff}.wrong{background-color:red}.mcq-submit{height:20%;padding:10px}.mcq-submit button{margin-top:10px}.controller{transform:translate(-50%);position:relative;left:50%;color:#006e6c}.btn-custom-primary{color:#fff;background-color:#00ccc9;outline:none}.modal-content{border:2px solid #28ae97}.initial-modal-footer{padding:15px;text-align:center}.modal-word{box-shadow:1px 1px 5px;width:auto;height:100px;text-align:center}.modal-word .word-text{font-size:2em;color:#006e6c;height:30%}.modal-word-meaning{text-align:center;color:#483734;font-size:1.5em}.button-popup:after{content:"";position:absolute;border-width:8px 3px;border-color:#f3c854 transparent transparent;border-style:solid;top:100%;left:10px}.button-link{border-color:transparent;font-size:14px;background-color:transparent;-webkit-box-shadow:none;box-shadow:none;color:#006e6c}.button-popup{color:#000;width:175px;bottom:calc(100% + 10px);padding:5px 15px;line-height:1.15}.button-popup,.demo-tooltip{background-color:#f3c854;position:absolute;white-space:normal;font-size:12px;height:auto;word-spacing:0;border-radius:5px}.demo-tooltip{text-align:center;color:#483734;width:125px;padding:5px 10px;line-height:1;left:calc(50% - 62.5px);top:calc(100% + 8px);z-index:1;font-weight:100;box-sizing:border-box;box-shadow:0 0 5px 0 #f0f0f0}.tooltip-top{top:0}.tooltip-left{top:0;left:20px}.tooltip-bottom:after{border-width:16px 5px;border-color:transparent transparent #f3c854;top:-30px;left:calc(50% - 8px)}.tooltip-bottom:after,.tooltip-left:after{content:"";position:absolute;border-style:solid}.tooltip-left:after{border-width:5px 20px;border-color:transparent #f3c854 transparent transparent;top:0;left:-35px;transform:rotate(30deg)}.tooltip-top:after{border-width:8px 3px;border-color:#f3c854 transparent transparent;left:50%;bottom:0;top:100%;bottom:-11px}.tooltip-right:after,.tooltip-top:after{content:"";position:absolute;border-style:solid;width:0;height:0}.tooltip-right:after{border-width:5px 8px;border-color:transparent transparent transparent #f3c854;top:calc(50% - 2.5px);left:100%}.game-conversation{background-color:#eee;width:100%;overflow:auto}.conversation{width:100%;display:inline-flex;border-bottom:2px solid #fff}.conversation .speaker{width:20%;display:inline;padding:10px;position:relative;color:#888;font-size:14px}.conversation .message{width:80%;display:inline-block;padding:10px}.modal.in .modal-dialog{transform:translate(-50%,-50%)}.modal-dialog{width:50%;position:fixed;top:50%;left:50%;width:calc(100% - 40px);max-width:380px;margin:0;padding:10px}.score-modal{padding:10px}.score-card{font-size:90px;font-size:4em;color:#f3c854;text-align:center}.quiz-page{height:calc(100% - 10px);width:calc(100% - 10px);margin:5px;position:absolute;left:0}.phrase-box,.quiz-page{display:flex;flex-direction:column;display:-webkit-flex;-webkit-flex-direction:column}.phrase-box{position:relative;padding:10px;height:40%;width:100%;box-shadow:0 0 10px 2px #888}.quiz-controller-btn{color:#006e6c;top:40%;left:50%;transform:translate(-50%)}.quiz-controller-text{width:inherit;font-size:14px;height:15%;text-align:center}.quiz-options{width:inherit;height:100%}.flex-box{flex:1;display:flex;flex-direction:column;-webkit-flex:1;display:-webkit-flex;-webkit-flex-direction:column;-ms-flex:1;height:100%}.quiz-wordlist{float:left}.quiz-points,.quiz-wordlist{display:inline;color:#006e6c}.quiz-points{float:right;font-size:15px;font-weight:700}.phrase-heading{height:40%;margin:5px;width:calc(100% - 10px);color:#006e6c;font-size:150%;font-weight:700}.phrase-heading,.quiz-option{text-align:center;position:relative}.quiz-option{color:#555;height:calc(25% - 10px);margin-bottom:10px;box-shadow:0 0 5px 0 #888;border-radius:5px;padding:10px;display:flex;display:-webkit-flex;font-size:14px}.shake{animation-name:wiggle;animation-duration:.1s;animation-timing-function:ease;animation-iteration-count:3}.quiz-wrong{background-color:red;border-radius:10px;color:#fff}.quiz-correct{background-color:green;color:#fff}.phrase-hint{position:relative;height:30%;color:#ff4723;text-align:center}.hint-animation{font-size:70%;animation:hint 2s linear 1s 1}#volume-btn{width:50%;-webkit-appearance:none!important}#volume-btn:focus::-webkit-slider-runnable-track{background:#00ccc9}#volume-btn::-webkit-slider-runnable-track{width:100%;height:3px;background:#00ccc9;border:none;border-radius:3px}#volume-btn:focus{outline:none}#volume-btn::-webkit-slider-thumb{-webkit-appearance:none;height:30px;width:30px;border:none;border-radius:50%;margin-top:-14px;background-image:url("https://storage.googleapis.com/web.cs.speaktribe.com/assets/es/speaker.png");background-color:transparent;background-size:contain}.listen-speak{height:100%;padding:5px;display:inline-flex;width:100%}.flex-item{display:flex;display:-webkit-flex}.volume-ctrl{display:flex;width:50%;height:100%;position:relative;color:#00ccc9}.option-disable{pointer-events:none}.volume-ctrl-web{display:inline;width:50%;height:100%;position:relative;color:#00ccc9;opacity:.2;cursor:not-allowed}.vertical-center{position:relative;top:50%;transform:translateY(-50%);display:block}.center{width:100%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.microphone{border-radius:50%;border:1px solid #00ccc9;width:30px;height:30px;background-color:#00ccc9;color:#fff;padding:1px;animation:blinkMic 1s linear infinite;-webkit-animation:blinkMic 1s linear infinite}.microphone-small{width:20px;height:20px}.zoom-out{-webkit-transition:all .2s ease-in;-webkit-transform:scale(.9);-ms-transition:all .2s ease-in;-ms-transform:scale(.9);-moz-transition:all .2s ease-in;-moz-transform:scale(.9);transition:all .2s ease-in;transform:scale(.9)}.quiz-noOptions{top:50%;position:absolute;left:50%;right:0;display:table;transform:translate(-50%,-50%)}.quiz-noOptions button{top:50%;left:50%;position:relative;border-radius:0;transform:translate(-50%,50%)}.blink,.quiz-noOptions div{color:#888}.blink{font-size:14px;animation:blinker 1s linear infinite}.word-list-heading{color:#888;background-color:#efe;text-align:center;padding:5px}.user-word-row{width:100%;height:100%;display:inline-flex;background-color:#fcfbf0;border-bottom:1px solid #e1e1e1}.volume-column{position:relative}.volume-column,.word-column{width:40%;height:100%;display:inline}.speaker-column{display:inline;height:100%;width:20%;position:relative}.mic-volume{position:relative;transform:translateY(50%)}.volume-column #volume-btn{width:70%;position:absolute}.microphone-on{width:30px;height:30px;color:#ddd;padding:1px;border-radius:0;border:none;background-color:initial}.volume-column #volume-btn::-webkit-slider-thumb{width:20px;height:20px;margin-top:-9px}.loader-microphone{border:2px solid transparent;border-radius:50%;border-top:2px solid #006e6c;width:30px;height:30px;transform:translate(-50%,-50%);left:calc(50% - 15px);top:calc(50% - 15px);position:absolute;-webkit-animation:spin 2s linear infinite;animation:spin 2s linear infinite}.loader-small{width:20px;height:20px;left:calc(50% - 10px);top:calc(50% - 10px)}.answer-box{position:relative;top:50%;transform:translateY(-50%);text-align:center;font-weight:700;font-size:20px;color:#483734}.progress{width:100%;height:6px;border-radius:0}.progress-wrap{background:#bbb;margin-bottom:0}.progress-wrap .progress-bar{background:#4e9e91}.no-border{border:none;text-align:center}.no-border>button{-webkit-appearance:none;background-color:transparent;color:#006e6c;border-color:transparent;float:right!important}.no-border>button:active{outline:none}.no-border>button:active,.no-border>button:hover{background-color:#ddd!important;color:#006e6c!important;border-color:transparent!important}.jamie-conversation{width:100%;padding:10px 5px;height:100%;display:flex;flex-direction:column}.jamie-message{width:calc(100% - 60px);box-shadow:0 0 5px 0 #888;border-radius:25px 25px 25px 0;padding:10px;font-size:18px;line-height:1.25;margin:30px 30px 20px;text-align:center;white-space:pre-wrap}.jamie-photo{width:calc(100% - 30px);height:calc(100% - 70px);margin-bottom:50px;margin-left:30px;margin-top:10px;overflow:hidden;max-height:40%;position:relative}.jamie-photo img{position:relative;max-width:100%;max-height:100%}.jamie-next{width:calc(100% - 10px);position:absolute;bottom:5px;height:35px}.bottom-alert{bottom:-100px;transform:translate(-50%)}.bottom-alert,.bottom-alert-lesson{position:fixed;background-color:#f3c854;padding:5px;z-index:500;white-space:nowrap}.bottom-alert-lesson{bottom:50px;left:50%;transform:translate(-50%,-50%)}.slide-left{left:-105%;-webkit-transition:left .9s ease-in-out;-moz-transition:left .9s ease-in-out;-o-transition:left .9s ease-in-out;transition:left .9s ease-in-out}@media only screen and (max-device-width:480px){.quiz-controller-text{font-size:9pt}}.hint-play-ctrl-box{height:10%;display:inline-flex;position:relative}.hint-play-ctrl{color:#006e6c;display:inline;top:50%;position:absolute;transform:translateY(-50%);text-shadow:1px 1px 1px #888}.hint-play-ctrl.right{right:15%}.hint-play-ctrl.left{left:15%}.hint-play-word{font-size:2em;font-weight:700;font-style:italic;color:#f3c854}.hint-play-meaning,.hint-play-word{text-align:center;padding:10px 20px}.hint-play-meaning{color:#888;font-size:1.5em}.hint-play-photo,.hint-play-photo img{height:100%;width:100%}.hint-play-photo img{max-height:100%;max-width:100%}.hint-play-means{text-align:center;font-style:italic;font-size:10px}.hint-play-start-btn{font-size:14px;font-style:italic;outline:none;box-shadow:1px 1px 3px 0 #888}header{padding:2em 3em 1em 7em!important;background:#00ccc9;box-shadow:0 0 10px 2px #888}body{display:block!important;background-color:#e9e9e9}main{width:100%}.level-hierarchy{padding:5px;width:100%}.level-title{width:100%;text-align:center;color:#006e6c;font-weight:700;height:auto;padding:10px}.level-row{width:100%;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex}.lesson-col{min-width:33.33%;display:inline-block;position:relative}.level-game{height:auto;padding:10px;display:inline-block;cursor:pointer}.level-game.lock{pointer-events:none;cursor:not-allowed}.level-game-points{color:#006e6c;font-size:60%;padding:10px;text-align:center}.col-3{width:33.33%}.col-2,.col-3{display:inline;position:relative}.col-2{width:50%}.col-1{width:100%;display:inline;position:relative}.task-block{border-radius:10px;margin:5px;padding:5px;width:87px;height:calc(100% - 10px);text-align:center;position:relative;box-sizing:border-box;display:inline-block;align-items:center;justify-content:center;cursor:pointer}.task-current{border:2px solid #28ae97;animation:blink-border 1s linear infinite;-webkit-animation:blink-border 1s linear infinite}.task-icon{width:100%}.task-lock .task-icon:after{content:"\F023"}.task-complete .task-icon:after,.task-lock .task-icon:after{position:absolute;top:0;color:#f3c854;font-family:FontAwesome;font-weight:400;font-style:normal;text-decoration:none}.task-complete .task-icon:after{content:"\F00C"}.task-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:82.5%;padding:5px 0}.task-min-score{font-size:10px;text-align:center}.lock-modal{line-height:1.5;font-size:95%}.user-rank{padding:10px;width:100%}.rank-title{color:#32aa76;font-size:100%}.user-rank .rank{color:#006e6c;font-weight:700;padding:10px 0;font-size:150%}.alert-not-loggedIn{text-align:center}.alert-not-loggedIn div{display:inline}.alert-not-loggedIn>i{color:red;font-size:16px;padding:5px}.modal-footer{padding:5px!important;border:none!important}.modal-footer>button{background-color:transparent!important;color:#006e6c!important;border-color:transparent!important;float:right!important}.modal-footer>button:active,.modal-footer>button:hover{background-color:#ddd!important;color:#006e6c!important;border-color:transparent!important}