@charset "utf-8";
@import url(/static/css/pkpk-colors.css);
@import url(/dialog/style.css);

.webizz,.webizz *{box-sizing:border-box;}
.webizz{font:400 16px/1.5 "Segoe UI",sans-serif;position:relative;margin:0;padding:0;color:#515352;--color-main:var(--color-webizz);background:#fff;}

dialog.gl.dialog-webizz{max-width:1200px;}

body.webizz #cookieMsgDiv{background-color:#4c65a7;background-color:var(--color-main);}


.webizz div.nick{max-width:400px;width:82.8vw;margin:0 auto;text-align:center;color:#4f5251;font-size:8vmin;line-height:1.25;padding-top:22vmin;font-weight:600;}
.webizz div.nick [name=nick]{display:block;width:100%;text-align:left;height:8.75vh;margin:6vmin 0 0;padding:0 1em;outline:none;background:transparent;border:1px solid #97bed4;}
.webizz div.nick [name=accept]{display:block;margin:7vmin auto 0;}
.webizz div.nick p.error-msg{margin:0;font-weight:200;font-size:3vmin;color:#c2373c;text-align:left;text-indent:0;}
/*
.webizz div.nick{display:block;margin:0 auto;font-size:2rem;transition:opacity .5s,height .3s .5s;height:8em;width:20em;max-width:100%;padding:5rem 2rem 3rem;white-space:nowrap;}
.webizz div.nick.nick-hidden{opacity:0;height:0;}
.webizz div.nick input[type=text]{display:inline-block;margin:0;width: calc(100% - 4rem);padding:.5em 1em;font-size:2rem;line-height:1em;border:2px solid #4c65a7;border-color:var(--color-main);border-right:none;border-radius:.6rem 0 0 .6rem;transition:box-shadow .2s;height:4rem;}
.webizz div.nick input[type=button]{display:inline-block;margin:0;width:4rem;padding:.5em 0;font-size:2rem;line-height:.7em;border:2px solid #4c65a7;border-color:var(--color-main);border-left:none;border-radius:0 .6rem .6rem 0;transition:box-shadow .2s;height:4rem;vertical-align:top;cursor:pointer;background:#4c65a7;background-color:var(--color-main);color:#fff;text-align:center;}
.webizz div.nick input:hover,div.nick input:focus,div.nick input:active{outline:none;box-shadow:0 0 50px #4166ad60;vertical-align:top;}
*/

.webizz{border:none;width:100%;min-height:100%;margin:0;padding:0;background:#fff;z-index:10;}

.webizz.webizz-aside{padding-right:300px;}
.webizz.webizz-aside aside{position:absolute;inset:20px 20px 20px auto; width:260px;}

.webizz>header,dialog.gl.webizz>header{position:relative;height:83px;background:#4c65a7;background-color:var(--color-main);padding:10px 118px 10px 50px;line-height:63px;text-align:center;overflow:visible;z-index:1;user-select:none;}
.webizz>header .epolish-logo{position:absolute;left:50px;top:49px;height:58px;width:148px;border-radius:9px;background:#fff url(img/logo.epolish.png) bottom 20% center no-repeat;background-size:78%;z-index:1;border:1px solid #dadce8;}
.webizz>header .webizz-logo{display:inline-block;vertical-align:middle;margin:-3px 10px 0;height:28px;width:28px;background:url(img/icon28.webizz.png);}
.webizz>header h6{display:inline;font-size:20px;font-weight:700;color:#fff;}
.webizz>header button[name=close],dialog.gl.webizz>header button[name=close]{position:absolute;margin:0;padding:0;right:0;top:0;border:none;background:none;bottom:0;width:56px;cursor:pointer;text-indent:-9999px;font-family:Arial,sans-serif;outline:none;}
.webizz>header button[name=close]:disabled{}
.webizz>header button[name=close]:enabled:hover,dialog.gl header button[name=close]:enabled:focus,dialog.gl header button[name=close]:enabled:active{}
.webizz>header button[name=close]::before{content:"×";position:absolute;top:11px;right:18px;display:block;width:24px;height:24px;border-radius:50%;text-indent:0;text-align:center;border:2px solid #ffffff3f;color:#ffffff3f;line-height:20px;font-size:20px;transition:.3s color,.3s border-color;box-sizing:border-box;}
.webizz>header button[name=close]::before,dialog.gl.webizz>header button[name=close]::before{width:29px;height:29px;right:23px;top:27px;line-height:26px;font-size:32px;font-weight:400;}
.webizz>header button[name=close]:enabled:focus::before,.webizz>header button[name=close]:enabled:hover::before,.webizz>header button[name=close]:enabled:active::before{border-color:#ffffff7f;color:#ffffff7f;}

.webizz>section,dialog.gl.webizz>section{margin:0;display:flex;justify-content:center;align-items:stretch;height:100vh;padding:49px 15px 33px;background:#f4f4f4 url(img/background.png) 35% 25px no-repeat;}

div.webizz{background:#f4f4f4 url(img/background.png) 35% 25px no-repeat;background-size:90%;padding:49px 15px 33px;}
div.webizz.webizz-start{position:relative;background-color:#f4f4f4;background-image:url(img/start.png),url(img/background.png);background-repeat:no-repeat,no-repeat;background-position:center 100px,35% 25px;background-size:105%,90%;}

.webizz>header+section,dialog.gl.webizz>header+section{height:calc(100% - 83px);}
dialog.webizz>section,dialog.gl.webizz>section{overflow:hidden auto;}
@media only screen and (max-height:900px){
    .webizz>section{background-position:center;background-size:contain;}
}
@media only screen and (max-height:900px) and (orientation: landscape) {
    .webizz>section{background-size:auto 80%;}
}

body.webizz>header+section{min-height:calc(100vh - 83px);}
.webizz>section>div{position:relative;max-width:1071px;min-width:600px;width:72vw;margin-left:2.56vw;}
.webizz>section>aside{position:relative;max-width:235px;min-width:150px;width:16vw;margin-left:8.97vw;padding:0 0 50px;position:relative;}

.webizz>section>div{display:flex;flex-direction:column;}

@media only screen and (max-width:800px) {
    .webizz>section{flex-direction:column;}
    .webizz>section>div{max-width:100%;min-width:0;width:100%;margin:0;}
}

.webizz div.content{transition:opacity .5s;height:100%;}
.webizz div.content.hidding{position:absolute;pointer-events:none;opacity:0;}

.webizz.webizz-start>section{padding:0 183px 0 218px;position:relative;max-height:996px;}
/*.webizz.webizz-start>section::before{content:url(img/start.png);position:absolute;pointer-events:none;top:2.778vh;left:0;margin:0 -60px 0 -68px;max-width:110%;}*/
/*
.webizz.webizz-start>section::before,.webizz.webizz-start::before{content:"";position:absolute;margin:0;pointer-events:none;top:4.5vh;width:100vw;height:28.7vw;background:url(img/start.png);background-size:contain;}
*/
.webizz.webizz-start>section>div{display:block;max-width:1519px;margin:0 auto;width:100%;}
dialog.webizz.webizz-start>section>div{min-height:800px;}

.webizz.webizz-start button[name="next"]{display:block;min-width:151px;height:34px;border:none;background:#4c65a7;background-color:var(--color-main);border-radius:17px;text-transform:uppercase;color:#fff;font-weight:600;margin:0 auto;}

.webizz ol.podium{position:absolute;width:1432px;height:1432px;top:-233px;left:-1400px;right:-1400px;margin:0 auto;padding:0;list-style:none;color:#4c65a7;color:var(--color-main);transform-origin:50% 233px;transform:scale(0.5);}
body.learning-mode-small.webizz div.question.msg-wait.msg-start ol.podium{top:-150px;}
.webizz ol.podium::before{content:url(img/podium.png);mix-blend-mode:multiply;}
.webizz ol.podium>li{position:absolute;width:200px;height:202px;text-align:center;padding:159px 0 0;font-weight:600;font-size:21px;line-height:1.5;}
.webizz ol.podium>li:nth-child(1){left:618px;top:631px;}
.webizz ol.podium>li:nth-child(2){left:336px;top:700px;}
.webizz ol.podium>li:nth-child(3){left:894px;top:722px;}
.webizz ol.podium>li img,.webizz ol.podium>li span.img{position:absolute;width:147px;height:147px;border-radius:50%;left:0;top:0;right:0;margin:0 auto;background:#e2ebf2;}
.webizz ol.podium>li span.img{background:#e2ebf2 url(img/user-none-large.png) no-repeat center;}

body.learning-mode-small.webizz ol.podium+strong{z-index:1;}


.webizz.webizz-start div.time{min-height:43px;color:#515352;line-height:43px;font-size:16px;text-align:left;width:100%;max-width:396px;margin:0 auto 25px;}

.webizz.webizz-start div.time span.input-time{display:inline-block;vertical-align:middle;position:relative;border:1px solid #a9c2d6;width:95px;height:43px;margin:-4px 6px 0;background:#fff url(img/icon.clock.png) 11px center no-repeat;}
.webizz.webizz-start div.time span.input-time::before{content:"";position:absolute;width:2px;top:7px;bottom:7px;left:33px;background-size:1px 5px;background-image:linear-gradient(0,transparent 0%,transparent 50%,#a9c2d6 60%,#a9c2d6 100%);}
.webizz.webizz-start div.time span.input-time>input{border:none;width:100%;height:100%;background:transparent;padding:0 8px 0 40px;outline:none;text-align:right;}

.webizz p.webizz-title{margin:0 0 28vw;padding:8px 0 0 122px;font-size:30px;font-weight:700;line-height:1.5;height:68px;position:relative;background:url(img/logo.webizz.png) left top no-repeat;color:#4f66a8;flex-shrink:0;position:relative;z-index:1;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;}
.webizz p.webizz-title::before{content:"";position:absolute;width:2px;height:47px;top:8px;left:103px;background-size:1px 5px;background-image:linear-gradient(0,transparent 0%,transparent 50%,#a9c2d6 60%,#a9c2d6 100%);}

.webizz.webizz-start ol.users,.webizz.webizz-finish ol.users{min-height:157px;border:6px dotted #a9c2d6;background:#ffffff7f;padding:7px 0;padding-left:16px;padding-right:11px;margin:0 auto 25px;width:100%;max-width:396px;position:relative;z-index:1;}


@media only screen and (max-width:1600px){
    .webizz.webizz-finish ol.users{right:15px;}
}
@media only screen and (max-width:1300px){
    .webizz.webizz-finish ol.users{position:relative;left:0;right:0;top:0;bottom:0;margin:0 auto;}
/*    .webizz ol.podium{margin-top:-570px;transform:scale(.5);transform-origin:50% 570px;margin-left:-356px;}*/
}

.webizz ol.users[data-empty-msg]:empty{background:transparent;}
.webizz ol.users[data-empty-msg]:empty::before{content:attr(data-empty-msg);display:block;color:#a9c2d6;text-align:center;font-size:28px;line-height:37px;padding:23px 0;}
.webizz.webizz-start ol.users>li::before{display:none;}
.webizz.webizz-finish ol.users>li::before{background:#f1ce09;}

.webizz.webizz-finish>section>div{z-index:1;}

.webizz div.qr-code{max-width:396px;margin:37.963vh auto 0;}
.webizz div.qr-code{max-width:396px;margin:0 auto 25px;background:#ffffff7f;padding:0 0 .7em;}
.webizz div.qr-code img{max-width:100%;display:block;margin:0 auto;mix-blend-mode:multiply;}
.webizz div.qr-code span{display:block;text-align:center;margin:-27px 0 0;user-select:all;font-size:20px;font-weight:700;position:relative;z-index:1;}


@media only screen and (min-width:1200px){
.webizz .panel-lr{display:flex;justify-content:center;}
.webizz .panel-lr .panel-l{margin:0 50px;}
.webizz .panel-lr .panel-l div.qr-code{margin-bottom:0;}
.webizz .panel-lr .panel-r{display:flex;flex-direction:column;width:320px;flex:0 0 320px;}
.webizz .panel-lr .panel-r div.time{}
.webizz .panel-lr .panel-r button[name="next"]{margin:0 0 0 auto;}
.webizz .panel-lr .panel-r span.space{flex-grow:1;}
}

/*
@media only screen and (min-width:1600px){
.webizz{height:100%;}
.webizz.webizz-start ol.users,.webizz.webizz-finish ol.users{position:absolute;width:267px;top:19.62vh;right:0;max-height:310px;z-index:1;}
.webizz.webizz-finish ol.users{top:17.62vh;right:-214px;}
.webizz div.qr-code{position:absolute;left:0;right:0;bottom:45px;}
.webizz.webizz-start button[name="next"]{position:absolute;bottom:42px;right:0;margin:0;}
.webizz.webizz-start div.time{position:absolute;bottom:37px;right:195px;text-align:right;}
.webizz ol.users[data-empty-msg]:empty::before{padding-right:40px;padding-left:40px;}
}
*/

.webizz div.instruction{padding:0 0 0 77px;margin:0 0 36px;position:relative;min-height:40px;}
.webizz div.instruction span.counter{display:block;position:absolute;width:26px;height:26px;border-radius:50%;background:#4c65a7;text-align:center;line-height:26px;margin:0;padding:0;font-wegiht:600;color:#fff;top:10px;left:-2px;}
.webizz div.instruction span.counter+span.counter{background:#a9c2d6;left:37px;}
.webizz div.instruction span.counter+span.counter::before{content:"";position:absolute;width:1px;height:23px;background:#a9c2d6;top:3px;left:-7px;transform:rotate(18deg);border-radius:1px;}
.webizz div.instruction p{margin:0;padding:0 0 0 21px;position:relative;font-size:30px;}
.webizz div.instruction p::before{content:"";position:absolute;width:2px;height:47px;top:-2px;left:0;background-size:1px 5px;background-image:linear-gradient(0,transparent 0%,transparent 50%,#a9c2d6 60%,#a9c2d6 100%);}
.webizz div.question{flex-grow:1;margin:0 0 36px;}
.webizz div.spacer{flex-grow:1;}

.webizz del.answer,.webizz em.answer{display:block;text-align:center;font-size:34px;}
.webizz del.answer,.webizz del.inline-answer{color:#c12141;text-decoration:line-through;font-weight:600;font-style:normal;}
.webizz em.answer,.webizz em.inline-answer{color:#308412;font-weight:600;text-decoration:none;font-style:normal;}
.webizz .content div.question{margin:4vh 0 3vh;font-size:24px;}

.webizz div.question.content{display:flex;flex-direction:column;justify-content:space-between;}

.webizz ul.sort-words{margin:0;padding:0;list-style:none;text-align:center;}
.webizz ul.sort-words li{display:inline-block;background:#ffffff3f;margin:0 10px 15px;border-radius:.2em;border:6px dotted #a9c2d6;border-width:6px;border-image:url(img/frame.svg);border-image-slice:33%;border-image-repeat:repeat;height:83px;line-height:60px;padding:0 26px;font-size:52px;font-weight:600;}

.webizz div.buttons{width:1071px;width:auto;counter-reset:letter;min-height:238px;}
.webizz div.buttons{padding:0;border:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:45px;grid-auto-rows:107px;row-gap:24px;bottom:45px;line-height:1.1;}
@media only screen and (max-width:800px) {
    .webizz div.buttons{grid-template-columns:100%;}
}
.webizz div.buttons.buttons-one-letter{display:block;}
.webizz div.buttons>button{width:auto;height:auto;margin:0;padding:0 120px;position:relative;color:#515350;outline:none;border:none;font-size:2.5rem;}
.webizz div.buttons>button:enabled{cursor:pointer;}
.webizz div.buttons>button::before{content:counter(letter,upper-alpha);position:absolute;top:0;left:0;bottom:0;width:107px;border-radius:50%;counter-increment:letter;text-align:center;color:#fff;line-height:107px;font-weight:700;font-size:72px;}
body.webizz:not(.learning-mode-board) div.buttons>button::before{display:none;}
.webizz div.buttons>button.disabled::before{color:#ffffff7f;}
.webizz div.buttons>button.selected::after{content:"✔";position:absolute;top:16px;right:16px;width:75px;height:75px;border-radius:50%;color:white;line-height:75px;font-size:60px;}
.webizz div.buttons>button:nth-child(1){background:#ffcf007f;border-radius:54px;}
.webizz div.buttons>button:nth-child(2){background:#ec89007f;border-radius:54px;}
.webizz div.buttons>button:nth-child(3){background:#ec68a67f;border-radius:54px;}
.webizz div.buttons>button:nth-child(4){background:#34b5ea7f;border-radius:54px;}
.webizz div.buttons>button:nth-child(1)::before{background:#ffcf00;}
.webizz div.buttons>button:nth-child(2)::before{background:#ec8900;}
.webizz div.buttons>button:nth-child(3)::before{background:#ec68a6;}
.webizz div.buttons>button:nth-child(4)::before{background:#34b5ea;}

.webizz div.buttons>button.selected:nth-child(1)::after{background:#ffcf00;}
.webizz div.buttons>button.selected:nth-child(2)::after{background:#ec8900;}
.webizz div.buttons>button.selected:nth-child(3)::after{background:#ec68a6;}
.webizz div.buttons>button.selected:nth-child(4)::after{background:#34b5ea;}

.webizz div.buttons>button.one-letter{width:33.44vmin;height:33.44vmin;text-shadow:none;margin:0 .94vmin 1.88vh;font-size:25vmin;font-weight:700;border-radius:50%!important;color:#fff;outline:none;padding:0;}
.webizz div.buttons>button.one-letter::before{display:none;}
.webizz div.buttons>button.one-letter:hover,.webizz div.buttons>button.one-letter:focus{animation:hover .6s forwards;}

@media only screen and (orientation: landscape) {
    .webizz div.buttons>button.one-letter{width:30vmin;height:30vmin;margin:0 .90vmin 1.88vh;font-size:21vmin;}
}


.webizz div.answers{min-height:238px;padding:204px 0 0;text-align:center;line-height:34px;}
.webizz div.answers.answers-valid{background:url(img/wow.png) center top 30px no-repeat;}
.webizz div.answers.answers-error{background:url(img/ups.png) center top 30px no-repeat;}

.webizz .content>div.answers{background:none;min-height:0;padding-top:15px;}


.webizz table.dialog{font-size:24px;}
.webizz table.dialog td,.webizz table.dialog th{text-align:left;font-weight:normal;vertical-align:top;}
.webizz table.dialog td{padding:0;}
.webizz table.dialog td.cont{text-align:center;}
.webizz table.dialog th{text-align:right;font-style:italic;padding:0 .5em 0 0;}
.webizz table.dialog td:before{display:none;}


/* TMP */
/*
dialog.webizz{overflow:hidden;}
dialog.webizz::before{content:url(img/___TMP_1.jpeg);position:absolute;top:0;left:0;opacity:.3;filter:grayscale(.2);pointer-events:none;z-index:99;}
*/
/*
body.test.webizz.learning-mode-small::before{content:url(img/___TMP_sp_6.jpeg);position:absolute;top:0;left:0;opacity:.3;filter:grayscale(.2);pointer-events:none;z-index:99;}
*/
/*
dialog.webizz.test,body{overflow:hidden;}
dialog.webizz.test::before{content:url(img/___TMP_start.webp);position:absolute;top:0;left:0;opacity:.3;filter:grayscale(.2);pointer-events:none;z-index:99;}
*/
/*
dialog.webizz.test,body{overflow:hidden;}
dialog.webizz.test::before{content:url(img/___TMP_finish.webp);position:absolute;top:0;left:0;opacity:.3;filter:grayscale(.2);pointer-events:none;z-index:99;}
*/
/*
dialog.webizz,body{overflow:hidden;}
dialog.webizz::before{content:url(img/___TMP_online_1.jpeg);position:absolute;top:0;left:0;opacity:.3;filter:grayscale(.2);pointer-events:none;z-index:99;}
*/
/* TMP */
/*
.webizz:not(dialog) aside{width:230px;}
.webizz:not(dialog) aside{position:absolute;background:#fff;right:30px;top:65px;bottom:0;width:230px;padding:49px 0 0;}
*/
.webizz aside div.EpolishAudio{width:100%;}
.webizz aside>.audio{padding:0 0 62px;}
.webizz aside ul.chart{margin:0 0 35px;white-space:nowrap;}

.webizz aside>.counters{padding:0 0 50px;text-align:left;}
.webizz aside>.counters div.count-answers{display:inline-block;vertical-align:top;}
.webizz aside>.counters div.timer{display:inline-block;vertical-align:top;margin:5px 12px 0;}
.webizz button[name="next"],.webizz .button{min-width:151px;height:34px;border:none;background:#4c65a7;border-radius:17px;text-transform:uppercase;color:#fff;font-weight:600;outline:none;}
.webizz button[name="next"]:enabled,.webizz .button:enabled{cursor:pointer;}
.webizz button[name="next"]::after{content:"▶";margin:0 0 0 10px;font-size:90%;position:relative;top:-1px;color:#ffffff7f;}
body.webizz button[name="next"]::after{display:none;}
.webizz aside button[name="next"]{position:absolute;bottom:0;right:0;}


.webizz ol.users{list-style:none;margin:0;padding:0;counter-reset:users;text-align:left;color:#4c65a7;font:600 15px/17px "Segoe UI",sans-serif;user-select:none;}
.webizz ol.users>li{height:51px;position:relative;margin:0;padding:0 36px 0 57px;counter-increment:users;}
.webizz ol.users>li::before{content:counter(users);content:attr(data-seq);position:absolute;display:block;width:26px;height:26px;top:-1px;left:0;border-radius:50%;background:#a9c2d6;color:#fff;text-align:center;line-height:26px;z-index:1;}
body.webizz:not(.learning-mode-board) ol.users>li::before{display:none;}
.webizz ol.users>li:first-child::before,.webizz ol.users>li[data-seq="1"]::before{background-color:#4c65a7;}
.webizz ol.users>li[data-score]::after{content:attr(data-score);position:absolute;display:block;right:0;top:0;width:36px;height:36px;border-radius:50%;text-align:center;line-height:36px;background:#edf2f6;color:#515352;font-weight:400;}
.webizz ol.users>li img,.webizz ol.users>li span.img{position:absolute;top:0;left:15px;width:36px;height:36px;background:#e2ebf2;border-radius:50%;}
.webizz ol.users>li span.img{background:#e2ebf2 url(img/user-none.png) no-repeat center;}
.webizz ol.users>li span.name{display:block;position:relative;width:100%;height:100%;padding:1px 9px;}
.webizz ol.users>li span.name::before{content:"";position:absolute;width:2px;height:36px;top:0;left:0;background-size:1px 5px;background-image:linear-gradient(0,transparent 0%,transparent 50%,#a9c2d6 60%,#a9c2d6 100%);}

.webizz ul.chart{list-style:none;margin:0;padding:0 0 44px;text-align:center;line-height:131px;height:175px;counter-reset:letters;user-select:none;}
.webizz ul.chart>li{display:inline-block;vertical-align:bottom;position:relative;width:25px;margin:0 7px;background:#4c65a7;border-radius:12px;max-height:131px;min-height:25px;counter-increment:letters;}
.webizz ul.chart>li[data-count="0"]{min-height:0;height:0;background:none;}
.webizz ul.chart>li span.valid{position:absolute;display:block;left:0;right:0;height:5px;background:#30970a;bottom:-44px;border-radius:3px;}
.webizz ul.chart>li::before{content:counter(letters, upper-alpha);display:block;position:absolute;bottom:-32px;left:0;right:0;line-height:30px;height:30px;text-align:center;font-weight:700;text-align:center;}
.webizz ul.chart>li[data-count]::after{content:attr(data-count);position:absolute;left:0;right:0;bottom:0;height:25px;line-height:25px;text-align:center;font-size:15px;}
.webizz ul.chart>li[data-count]:not([data-count="0"])::after{color:#fff;}
.webizz ul.chart>li:nth-child(1){background-color:#ffcf00;color:#ffcf00;}
.webizz ul.chart>li:nth-child(2){background-color:#ec8900;color:#ec8900;}
.webizz ul.chart>li:nth-child(3){background-color:#ec68a6;color:#ec68a6;}
.webizz ul.chart>li:nth-child(4){background-color:#34b5ea;color:#34b5ea;}

.webizz div.timer{width:85px;height:85px;text-align:center;line-height:85px;color:#4c65a7;font-size:24px;font-weight:600;position:relative;user-select:none;}
.webizz div.timer>svg{position:absolute;width:100%;height:100%;left:0;top:0;}
.webizz div.timer>svg>circle{fill:none;stroke:#a9c2d6;stroke-width:1;stroke-linecap:round;stroke-dasharray:0 1.89;}
.webizz div.timer>svg>circle+circle{stroke:#4c65a7;}

.webizz div.count-answers{position:relative;width:120px;height:103px;text-align:center;color:#a9c2d6;padding:67px 0 0;line-height:18px;user-select:none;}
.webizz div.count-answers>strong{display:block;position:absolute;width:48px;height:48px;margin:0 auto;top:0;left:0;right:0;background:#a9c2d6;color:#fff;border-radius:50%;line-height:48px;font-weight:600;font-size:24px;}
.webizz div.count-answers>strong::after{content:"";position:absolute;left:0;right:0;height:2px;bottom:-12px;background-size:5px 1px;background-image:linear-gradient(90deg,transparent 0%,transparent 50%,#a9c2d6 60%,#a9c2d6 100%);}

.webizz button[name=next]{}

body.epolish2 dialog.webizz{z-index:99999;animation:none;position:fixed;top:0;left:0;}
body.board dialog.gl.webizz{animation:none;}

body.learning-mode-small.webizz{}
body.learning-mode-small.webizz header{height:32vh;padding:17vh 0 0;box-shadow:none;}
@media (orientation: landscape) { body.learning-mode-small.webizz header{height:16vh;padding:9vh 0 0;box-shadow:none;}}
body.learning-mode-small.webizz header h6{display:none;}
body.learning-mode-small.webizz header button[name=close]{display:none;}
body.learning-mode-small.webizz header .epolish-logo{position:absolute;left:16vw;top:auto;bottom:2vh;margin:0;height:10.833vh;width:27.708vh;border-radius:1.25vh;background:#e6eff6 url(/dialog/exercise/logo.png) bottom 20% center no-repeat;background-size:75%;z-index:1;}
body.learning-mode-small.webizz header .webizz-logo{position:absolute;right:18.5vw;top:auto;bottom:4vh;margin:0;height:5.83vh;width:5.83vh;/*border-radius:50%;*/background-size:cover;z-index:0;}
body.learning-mode-small.webizz .content{padding:0;position:relative;width:75vmin;}
body.learning-mode-small.webizz header>div.content{height:15vh;background:#0000001f;}
body.learning-mode-small.webizz section{min-height:0;height:68vh;padding-top:0;}
@media (orientation: landscape) { body.learning-mode-small.webizz section{height:84vh;}}
body.learning-mode-small.webizz section:first-child{height:100vh;}
body.learning-mode-small.webizz section>div.content{height:76.56vmin;background:#4166ad1f;min-height:0;}
body.learning-mode-small.webizz div.question{position:static;background:none;padding:5.63vmin 0 .31vmin;text-align:center;border:none;margin:0 auto;}
body.learning-mode-board.webizz div.question.msg-wait{position:static;background:none;padding:5.63vmin 0 .31vmin;text-align:center;border:none;margin:0 auto;}
body.learning-mode-small.webizz div.question>button.one-letter{width:33.44vmin;height:33.44vmin;text-shadow:none;margin:0 .94vmin 1.88vh;font-size:25vmin;font-weight:700;border-radius:50%!important;color:#fff;outline:none;}
body.learning-mode-small.webizz div.question div.answers>button.one-letter:hover,body.learning-mode-small div.question div.answers>button.one-letter:focus{animation:hover .6s forwards;}
body.learning-mode-small.webizz div.question div.answers>button:hover{filter:none;}
body.learning-mode-small.webizz div.question.msg-wait strong{color:#4f5251;font-size:8vmin;line-height:1.25;padding-top:15.5vmin;font-weight:600;}
body.learning-mode-board.webizz div.question.msg-wait strong{color:#4f5251;font-size:8vmin;line-height:1.25;padding-top:15.5vmin;font-weight:600;}
body.learning-mode-small.webizz div.question.msg-wait.msg-start strong{padding-top:20.4vmin;}
@media (orientation: landscape) {body.learning-mode-small.webizz div.question.msg-wait.msg-start strong{padding-top:10vmin;}}
body.learning-mode-small.webizz div.question.msg-valid,body.learning-mode-small div.question.msg-error{padding:42vmin 1em 0;}
body.learning-mode-small.webizz div.question.msg-valid{background:url(img/wow.png) center top 5vmin no-repeat;background-size:36vmin;}
body.learning-mode-small.webizz div.question.msg-error{background:url(img/ups.png) center top 5vmin no-repeat;background-size:36vmin;}

body.learning-mode-small.webizz div.question.msg-valid,body.learning-mode-small.webizz div.question.msg-error,
body.learning-mode-small.webizz div.question.msg-valid strong,body.learning-mode-small.webizz div.question.msg-error strong,
body.learning-mode-small.webizz div.question.msg-valid small,body.learning-mode-small.webizz div.question.msg-error small{color:#4f5251;font-size:8vmin;line-height:1.25;}
body.learning-mode-small.webizz div.question.msg-valid strong{color:#009800;font-weight:600;}
body.learning-mode-small.webizz div.question.msg-error strong{color:#e32b48;font-weight:600;}
body.learning-mode-small.webizz div.content.question.hidding{position:absolute;}
body.learning-mode-small.webizz>section>aside{display:none;}
body.learning-mode-small.webizz>section>div{max-width:none;min-width:0;width:100%;margin:0;}


form[name="form-webizz-online"]{margin:0;}
.modal-body form[name="form-webizz-online"]{height:100%;}
.modal-body form[name="form-webizz-online"] .panel-body{height:100%;}

.webizz .question-grammar{text-align:center;}
.webizz .question-grammar span.word{display:block;background:#ffffff3f;margin:0 10px 15px;border-radius:.2em;border:6px dotted #a9c2d6;border-width:6px;border-image:url(img/frame.svg);border-image-slice:33%;border-image-repeat:repeat;height:83px;line-height:60px;padding:0 26px;font-size:52px;font-weight:600;margin:0 auto 23px;}
.webizz .question-grammar div>span.word{display:inline-block;}
.webizz .question-grammar span.arrow{display:block;height:36px;width:40px;overflow:hidden;color:transparent;text-indent:-999px;margin:0 auto 21px;background:url(img/grammar-arrow-down.png) no-repeat center;}
.webizz .question-grammar span.form{display:block;text-transform:uppercase;font-weight:600;margin:0 auto 25px;}
.webizz .question-grammar span.person{display:block;position:absolute;left:-98px;top:4px;width:68px;height:68px;border-radius:50%;text-align:center;line-height:68px;color:#4f5251;background:#a9c2d67f;font-style:italic;font-weight:400;font-size:26px;}
.webizz .question-grammar span.blank{display:block;background:#ffffff3f;margin:0 10px 15px;border-radius:.2em;border:6px dotted #a9c2d6;border-width:6px;border-image:url(img/frame.svg);border-image-slice:33%;border-image-repeat:repeat;height:83px;line-height:65px;padding:0 26px;font-size:50px;font-weight:700;line-height:65px;color:#a9c2d6;width:258px;margin:0 auto;position:relative;}


.webizz p.sort-letters{text-align:center;}
.webizz p.sort-letters span.letter{display:inline-block;vertical-align:top;text-align:center;margin:10px;width:99px;height:99px;line-height:80px;border-radius:50%;border:6px dotted #a9c2d6;font-weight:700;font-size:42px;}

.webizz div.timer{position:absolute;top:0;left:-100px;}
@media only screen and (max-width:1700px) {
    .webizz div.timer{left:auto;right:-100px;}
}
@media only screen and (max-width:800px) {
    .webizz div.timer{right:0;}
}

/*
body.learning-mode-board.webizz>section, dialog.gl.webizz>section{overflow:hidden;}
body.learning-mode-board.webizz div.question.msg-wait strong{z-index:1;padding-top:0;}
body.learning-mode-board.webizz>section>div ol.podium{position:absolute;margin-left:auto;margin-top:-20vmin;margin-right:auto;display:block;transform-origin:50% 0;z-index:0;}
*/

.webizz div.webizz-question{margin:.4em 0;text-align:center;font-size:52px;}
.webizz ul.webizz-answers{list-style:none;margin:1em auto 0;padding:0;max-width:1200px;font-size:36px;counter-reset:answers;}
.webizz ul.webizz-answers>li{display:inline-block;width:50%;text-align:center;padding:15px;}
.webizz ul.webizz-answers>li::before{content:counter(answers, upper-alpha);counter-increment:answers;display:block;font-size:50%;background:#0002;width:1.5em;height:1.5em;border-radius:50%;margin:-5px auto 0;text-align:center;line-height:1.5em;}
.webizz ul.webizz-answers>li:nth-child(1){background:#f0e68c;color:#54511a;}
.webizz ul.webizz-answers>li:nth-child(2){background:#a3f08c;color:#3a562c;}
.webizz ul.webizz-answers>li:nth-child(3){background:#de8cf0;color:#402e3f;}
.webizz ul.webizz-answers>li:nth-child(4){background:#8cc9f0;color:#323b52;}
.webizz p.instruction{margin:0;width:100%;text-align:center;font:400 14px sans-serif;color:#00529b;}
.webizz ul.sort-words{margin:0;padding:0;}
.webizz ul.sort-words li{list-style:none;display:inline-block;background:#fff;margin:.2em;padding:.1em .4em;border-radius:.2em;box-shadow:0 0 0.5em #0003;font-size:85%;}
.webizz ul.sort-words li:nth-child(5n){transform:rotate(2deg);}
.webizz ul.sort-words li:nth-child(5n+1){transform:rotate(-3deg);}
.webizz ul.sort-words li:nth-child(5n+2){transform:rotate(1deg);}
.webizz ul.sort-words li:nth-child(5n+3){transform:rotate(-2deg);}
.webizz ul.sort-words li:nth-child(5n+4){transform:rotate(.5deg);}
.webizz ul.webizz-answers>li{display:inline-block;width:50%;text-align:center;padding:15px;position:relative;}
.webizz ul.webizz-answers>li::before{content:counter(answers, upper-alpha);counter-increment:answers;display:block;font-size:50%;background:#0002;width:1.5em;height:1.5em;border-radius:50%;margin:-5px auto 0;text-align:center;line-height:1.5em;}
.webizz ul.webizz-answers>li span.valid{position:absolute;right:10px;top:5px;font-size:64px;text-shadow:2px 2px 5px #0003;}
.webizz ul.webizz-chart{list-style:none;padding:32px 0;text-align:center;}
.webizz ul.webizz-chart>li{width:41px;min-height:3px;display:inline-block;margin:0 15px 0 0;vertical-align:bottom;font-size:30px;position:relative;text-align:center;box-shadow:2px 2px 10px #0003;text-shadow:2px 2px 5px #0003;}
.webizz ul.webizz-chart>li:nth-child(1){background:#f0e68c;color:#f0e68c;}
.webizz ul.webizz-chart>li:nth-child(2){background:#a3f08c;color:#a3f08c;}
.webizz ul.webizz-chart>li:nth-child(3){background:#de8cf0;color:#de8cf0;}
.webizz ul.webizz-chart>li:nth-child(4){background:#8cc9f0;color:#8cc9f0;}
.webizz ul.webizz-chart>li::before{content:attr(data-count);font-size:18px;position:absolute;left:0;right:0;top:-1.4em;}
.webizz ul.webizz-chart>li::after{content:attr(title);font-size:18px;position:absolute;left:0;right:0;bottom:-1.6em;}
.webizz p.instruction{margin:0;width:100%;text-align:center;font:400 14px sans-serif;color:#00529b;}
.webizz ul.sort-words{margin:0;padding:0;}
.webizz ul.sort-words li{list-style:none;display:inline-block;background:#fff;margin:.2em;padding:.1em .4em;border-radius:.2em;box-shadow:0 0 0.5em #0003;font-size:85%;}
