*{padding:0;margin:0;border:0}*,:after,:before{box-sizing:border-box}body,html{height:100vh;width:100%;min-width:100%;position:relative;margin:0;padding:0;font-family:Libre Franklin,sans-serif;color:var(--black)}a{text-decoration:none}li{list-style:none}.wrapper{overflow:hidden;height:100%;margin:0 auto;background-image:url(./img/main.jpg);background-position:50%;background-repeat:no-repeat;background-size:cover;scroll-behavior:smooth;flex-wrap:wrap;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column}.header,.wrapper{width:100%;display:-webkit-box;display:flex}.header{height:100px;margin-bottom:10px;position:relative}.header span{-webkit-box-pack:start;justify-content:flex-start;font-size:24px;font-family:Nobile,sans-serif;font-weight:600;margin:30px 0 10px 100px;color:rgba(0,23,148,.61);text-shadow:3px 3px 20px #c9e5ef,-3px -3px 20px #c9e5ef}.header span,.level{display:-webkit-box;display:flex;position:relative}.level{-webkit-box-orient:horizontal;-webkit-box-direction:reverse;flex-direction:row-reverse;margin-left:100px;width:300px;border:1px solid #b7b7de;box-sizing:border-box;background-image:-webkit-gradient(linear,left top,right top,from(#168278),color-stop(#64d2c8),to(#d9fffb));background-image:linear-gradient(90deg,#168278,#64d2c8,#d9fffb)}.level input{display:none}.level labeL{display:-webkit-box;display:flex;cursor:pointer;width:50px;height:35px;-webkit-box-pack:center;justify-content:center;-webkit-box-align:center;align-items:center;-webkit-transition:all .5s ease;transition:all .5s ease;background-color:#dde1ea;color:rgba(18,21,59,.42);font-size:20px;font-weight:600;border-right:1px solid #b7b7de}input[type=radio]:checked~label,input[type=radio]:hover~label{background:transparent}.column{-webkit-box-flex:0;flex:0 0 32%;max-width:320%;display:-webkit-box;display:flex;-webkit-box-orient:vertical;flex-direction:column}.column,.row{-webkit-box-direction:normal}.row{-webkit-box-orient:horizontal;flex-direction:row}.btns-container{display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;-webkit-box-pack:center;justify-content:center;margin:40px auto 0;text-align:center;text-align:-webkit-center}.btn{width:200px;padding:8px 30px;font-size:22px;font-weight:500;font-family:Nobile,sans-serif;background-color:rgba(195,236,254,.56);border:1px solid rgba(83,121,144,.29);border-radius:15px;color:#537990;text-shadow:1px 1px 12px #add8e6;cursor:pointer;outline:none;-webkit-transition:all .5s ease;transition:all .5s ease;margin-top:20px;box-shadow:.5px .5px 8px rgba(0,0,0,.23)}.btns-container button:first-child.speakPls{width:340px;background-color:rgba(47,183,243,.56);color:#f0f8ff}.btns-container button:first-child{position:relative;width:310px;text-align:left;padding:15px 40px}.btns-container button:first-child:before{position:absolute;content:"";width:59px;height:50px;top:0;right:10px;background-image:url(./img/img_fon_icon/btn.png);background-size:cover;background-position:50%}.btn:hover{background-color:#f7ffff;box-shadow:1px 1px 5px rgba(0,0,0,.1),-1px -1px 5px rgba(0,0,0,.1)}.right{display:grid;grid-template-columns:1fr 1fr;grid-gap:40px 0;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content}.translation{margin:10px 0 2px;line-height:27px;height:30px;text-align:center;display:block;font-size:20px}.header button.log_out_main{position:absolute;top:-55px;right:5px;width:90px!important;height:40px;color:#e60000;font-size:15px;font-weight:700;border-radius:15px;background-color:rgba(90,23,23,.88);border:none;box-shadow:1px 1px 8px rgba(245,222,179,.71)}.check_answer{border-radius:8px;cursor:pointer}.check_answer.dismissed{color:#a7a7a7;cursor:not-allowed}.check_answer.hidden{display:none}.continue,.newGame{display:inline-block}.continue.dismissed,.newGame.dismissed{display:none}.idontKnow{background-image:url(./img/idn.png);background-size:contain;height:80px!important;width:120px!important;background-repeat:no-repeat;background-position:0}.idontKnow.dismissed{display:none}
.pop,.win{display:-webkit-box;display:flex;position:fixed;top:0;left:0;width:100%;height:100vh;background-image:url(./img/fon.jpg);background-repeat:no-repeat;background-size:cover;background-position:50%;z-index:12}.title{position:absolute;width:100%;display:inline-block;text-align:center;-webkit-box-pack:center;justify-content:center;margin-top:100px}.title button{padding:10px 30px;font-size:22px;font-weight:600;background-color:#a8b291;border:1px solid #6e8679;border-radius:8px;color:#dbe3d2;cursor:pointer;outline:none;-webkit-transition:padding .5s ease;transition:padding .5s ease}.hide{display:none}.title button:hover{padding:10px 60px}.pop h1{font-size:55px;font-weight:300;text-transform:uppercase}.pop h1,.pop p{font-family:Libre Franklin,sans-serif;color:#2e3c45;text-shadow:1px 1px 3px #5b7268;letter-spacing:2px;padding-bottom:20px}.pop p{font-size:16px}.pop.activePop{display:block}.autoriz{display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;max-width:300px;width:100%;margin:0 auto}.input-mail,.input-pass,.input-text{padding:10px 5px;font-size:22px;font-weight:600;background-color:#a8b291;border-radius:8px;color:#dbe3d2;cursor:text;margin-bottom:15px;box-shadow:1px 1px 15px hsla(0,0%,50.2%,.56);outline:none;position:relative}input::-webkit-input-placeholder{color:rgba(51,73,62,.54);font-size:18px}input:-ms-input-placeholder{color:rgba(51,73,62,.54);font-size:18px}input::-ms-input-placeholder{color:rgba(51,73,62,.54);font-size:18px}input::placeholder{color:rgba(51,73,62,.54);font-size:18px}p.first-log{color:#cecca6}form .error{outline:2px solid red}form.hide{display:none}.win{display:-webkit-box;display:flex;background-image:none;z-index:20;background-color:#14191c}.win img{width:100%;-o-object-fit:contain;object-fit:contain;-webkit-animation-name:shownUp;animation-name:shownUp;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;-webkit-animation-duration:.7s;animation-duration:.7s}.win.hidden{display:none}@-webkit-keyframes shownUp{0%{top:-320px;opacity:0}to{top:0;opacity:1}}@keyframes shownUp{0%{top:-320px;opacity:0}to{top:0;opacity:1}}
.gameboard-cont{display:block;width:860px;height:400px;margin:0 auto;position:relative;box-shadow:2px 2px 10px hsla(0,0%,100%,.47),-2px -2px 10px hsla(0,0%,100%,.47)}.guessed_phrases_board{background-image:url(./img/fonK.jpg);background-size:cover;background-repeat:no-repeat}.gameboard-cont .guessed{height:40px;width:100%;display:-webkit-box;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row;justify-content:space-around;-webkit-box-align:center;align-items:center}.gameboard-cont .guessed span{padding:9px;border:none;background-color:rgba(238,252,247,.178);font-size:18px;font-weight:600;font-family:monospace;width:100%;text-align:center}.gameboard{position:absolute;bottom:-38%;width:100%;padding:70px 0;margin:0 auto}.phrase{width:100%;margin:40px auto;text-align:center}.translation-text{background-color:rgba(240,248,255,.45);color:#395239;text-shadow:1px 1px 8px #788e8c;line-height:38px;font-size:25px;width:-webkit-max-content;width:max-content;margin:0 auto;padding:0 80px;border-radius:5px;border-bottom:4px solid rgba(183,183,222,.58)}.audio-transl{background-color:rgba(240,248,255,.43);border-radius:50%;padding:5px;cursor:pointer}.audio-transl.hidden{display:none}.translation-text.visibilityHid{visibility:hidden}.word-container:not(.input-res){border:2px solid #000;margin-bottom:10px;display:-webkit-box;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row;justify-content:space-around}.word-container span{padding:15px;border:1px solid #000;background-color:rgba(151,204,186,.57);font-size:18px;font-weight:600;width:100%;text-align:center;font-family:monospace;cursor:move}.answ-wrapper{position:absolute;bottom:0;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%);width:100%;text-align:center}.input-res{display:-webkit-box;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row;justify-content:space-around;min-width:200px;background-color:rgba(151,204,186,.81);text-align:center;min-height:60px;border:3px solid rgba(19,62,58,.46);border-radius:7px}.input-res span.wrong{color:#ffcbcb;background-color:rgba(244,67,54,.22)}.dragging{opacity:.5}.select{border:1px solid #b7b7de;width:90px;padding:3px 15px;font-size:22px;color:#009688;text-shadow:2px 2px 18px #81a29f;background-color:#dde1ea;outline:none;margin:0 0 0 88px;cursor:pointer}.column.row button img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.row button{border-radius:40%;width:60px;height:59px;margin:63px 10px 0 0;font-size:22px;color:#009688;text-shadow:2px 2px 18px #81a29f;background-color:#fff;outline:none;text-align:center;overflow:hidden;cursor:pointer}.row button.clicked{opacity:.4}.row.footer{margin:180px auto 0;display:-webkit-box;display:flex;-webkit-box-align:center;align-items:center}.row.footer button{width:-webkit-max-content;width:max-content;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;padding:8px 10px;margin:0 10px;background-color:#dde1ea}.statistic{justify-self:right;margin-left:40px!important;width:auto;padding:5px;background-image:url(./img/stat.jpg);background-size:contain;background-repeat:no-repeat;background-position:50%;border-radius:50%;width:60px!important;height:60px!important}
.results_pop.hidden{display:none}.results_pop{z-index:10;top:0;left:0;width:100%;height:100vh;background-image:url(./img/statbg.jpg);background-size:cover;background-repeat:no-repeat;background-position:50%;position:fixed;overflow:auto;margin:0 auto}.results_block{position:absolute;z-index:11;background-color:rgba(247,254,255,.82);border-radius:10px;margin:0 auto;padding:50px;min-width:700px;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;text-align:center;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);-webkit-animation-name:shownUp;animation-name:shownUp;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;-webkit-animation-duration:.7s;animation-duration:.7s;text-align:left}@-webkit-keyframes shownUp{0%{top:-320px;opacity:0}to{top:0;opacity:1}}@keyframes shownUp{0%{top:-320px;opacity:0}to{top:0;opacity:1}}.static-phrase{padding:10px;font-size:20px;display:-webkit-box;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row}.static-phrase img{width:28px;-o-object-fit:contain;object-fit:contain;cursor:pointer}.static-phrase p{margin-left:20px}.results_block h4{font-family:Nobile,sans-serif;font-size:17px;color:#b53f80;text-transform:uppercase;padding-bottom:10px;display:inline-block}.err,.succ{display:inline-block;background-color:rgba(243,83,72,.35);border:1px solid rgba(230,132,132,.5);width:22px;height:22px;border-radius:50%;font-size:10px;font-weight:700;color:#673ab7;line-height:20px;text-align:center;margin-left:40px;margin-bottom:5px}.succ{background-color:rgba(127,222,131,.71);border:1px solid #4caf50;color:#348437}.result_btns button{padding:7px 5px;font-size:21px;font-weight:600;background-color:rgba(26,26,116,.74);border-radius:8px;color:#d8b8d3;text-shadow:none;cursor:pointer;margin-bottom:15px;box-shadow:1px 1px 15px hsla(0,0%,50.2%,.56);outline:none;position:relative;margin-right:30px}.item_result{display:-webkit-box;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row;min-height:50px;border:0;margin:0;padding:0 0 0 50px;position:relative}.icon_audio{position:absolute;top:-3px;left:10px;width:34px;height:34px}.icon_audio svg{width:34px;height:34px;color:rgba(14,30,37,.7)}.item_result p{font-family:Nobile,sans-serif;color:#0e1e25;font-size:22px;padding:0 5px;margin:0}