@charset "utf-8";

@import url(/static/css/pkpk-colors.css);

*{box-sizing:border-box;}

html{margin:0;padding:0;}
body{margin:0;padding:0;overflow:hidden auto;}
/*body.version-2::-webkit-scrollbar{display:none;}*/

.ep-scroll,body.version-2{overflow:hidden auto;}
.ep-scroll::-webkit-scrollbar,body.version-2::-webkit-scrollbar{width:12px;}
.ep-scroll::-webkit-scrollbar-track,body.version-2::-webkit-scrollbar-track{color:transparent;padding:20px;}
.ep-scroll::-webkit-scrollbar-thumb,body.version-2::-webkit-scrollbar-thumb{border-radius:10px;background-color:#0000002f;transition:background-color .4s;}
.ep-scroll:not(:hover)::-webkit-scrollbar-thumb,html:not(:hover)>body.version-2::-webkit-scrollbar-thumb{background-color:#00000000;}
/* safari */
.ep-scroll:not(:root:root)::-webkit-scrollbar-thumb,body.version-2:not(:root:root)::-webkit-scrollbar-thumb{background-color:#0000002f;}

body>div.exercise{margin:0;width:auto;}

section.exercise{}
section.exercise+section.exercise,section.exercise+script+section.exercise{margin-top:5em;}
section.exercise button:enabled{cursor:pointer;outline:none;}
section.exercise button:disabled{cursor:not-allowed;filter:grayscale(.8);}

section.exercise audio{height:42px;width:234px;outline:none;}
section.exercise audio::-webkit-media-controls-panel{background:#f3f7fa;}
section.exercise div.EpolishAudio{margin-top:10px;margin-bottom:10px;backdrop-filter:none;display:inline-block;vertical-align:middle;}

section.exercise>form{min-height:100vh;display:flex;flex-direction:column;}
section.exercise.exercise-multi>form{min-height:0;}

section.exercise div.buttons{padding:15px 0 26px;}
section.exercise div.buttons>div.main{display:flex;height:38px;}
section.exercise div.buttons>div.main>span.spacer{flex:1 1 0;}
section.exercise div.buttons>div.main span.result{display:inline-block;width:250px;text-align:center;color:#a9c2d6;text-transform:uppercase;font-size:14px;font-weight:600;}
section.exercise div.buttons>div.main span.result output{display:inline;margin:0;padding:0;border:none;color:#274867;text-transform:none;}

section.exercise div.buttons button{min-width:116px;height:29px;border-radius:14px;margin:0 13px 0 0;border:1px solid #a9c2d6;color:#a9c2d6;padding:0 1em;background:#fff;text-transform:uppercase;font-weight:600;font-size:12px;transition:background-color .3s,border-color .3s,color .3s;white-space:nowrap;}
section.exercise div.buttons button:hover,section.exercise div.buttons button:focus{color:#719dc1;border-color:#719dc1;box-shadow:0 0 15px #719dc13a;}
section.exercise div.buttons button.r{border:none;color:#fff;background:#a9c2d6;}
section.exercise div.buttons button.r:hover,section.exercise div.buttons button.r:focus{color:#fff;background-color:#719dc1;}
section.exercise div.buttons button[name=mysolution]{width:auto;padding-left:2em;padding-right:2em;}

section.exercise div.columns>div.main h6{margin:0;height:40px;line-height:40px;padding:0 16px;background:#f5f9fc;white-space:nowrap;color:#a9c2d6;font-size:20px;position:relative;border-left:4px solid #a9c2d6;}
section.exercise div.columns>div.main h6 a{color:inherit;text-decoration:none;}
section.exercise div.columns>div.main h6 input.nice+span{margin-right:1em;vertical-align:0;}

section.exercise div.columns>div.main h6 menu.menu-exercises{padding:0;float:right;margin:3px -16px 0 0;}

section.exercise p.header{margin-left:16px;color:#515352;margin-top:9px;}

section.exercise div.main{width:853px;max-width:100%;margin:0 auto;}

section.exercise div.columns{display:flex;align-items:flex-start;flex-grow:1;}
section.exercise div.columns>div.main{flex:1 1 0;}
section.exercise div.columns>aside{flex:0 0 250px;width:250px;margin:0 0 0 23px;}
section.exercise div.columns>aside:empty{display:none;}

section.exercise div.alt{position:relative;}
section.exercise div.alt>button{position:absolute;width:31px;height:30px;border:none;top:33px;padding:0;background:url(/dialog/exercise/arrow-s.png) no-repeat center;transition:.3s transform;}
section.exercise div.alt>button[name="alt-previous"]{left:-41px;}
section.exercise div.alt>button[name="alt-next"]{right:-41px;transform:scaleX(-1);}
section.exercise div.alt>button:disabled{display:none;}
section.exercise div.alt>button[name="alt-previous"]:enabled:hover,section.exercise div.alt>button[name="alt-previous"]:enabled:focus{transform:scale(1.2);}
section.exercise div.alt>button[name="alt-next"]:enabled:hover,section.exercise div.alt>button[name="alt-next"]:enabled:focus{transform:scale(-1.2, 1.2);}

section.exercise div.alt ul{list-style-type:none;margin:0;padding:0;white-space:nowrap;overflow:hidden;scroll-behavior:smooth;line-height:0;}
section.exercise div.alt ul>li{display:inline-block;position:relative;width:162px;height:101px;margin:0 10px 0 0;}
section.exercise div.alt ul>li.solved::before{content:"";display:block;position:absolute;left:0;right:0;top:0;bottom:0;margin:auto;width:26px;height:26px;background:url(/static/images/exercise2/alt-icons.png) no-repeat 0 0;}
section.exercise div.alt ul>li img{display:block;width:100%;height:100%;}

section.exercise footer{background:#e2ebf2;position:relative;}
section.exercise footer>div.main{display:flex;flex-wrap:wrap;padding:18px 0 13px;justify-content:space-between;}

section.exercise footer>div.main>div.left{max-width:506px;}
section.exercise footer>div.main>div.left>p{margin:0;order:1;line-height:21px;font-size:16px;color:#515352;text-align:left;font-weight:400;height:64px;}
section.exercise footer>div.main>div.left>p>span,section.exercise footer>div.main>div.left>p>strong{display:block;}
section.exercise footer>div.main>div.left>p strong em{color:#274867;font-style:normal;}

/*
section.exercise footer>div.main>div.banner{width:334px;height:82px;order:2;margin:0 2px 12px 0;}
section.exercise footer>div.main>div.banner a{display:block;width:100%;height:100%;background:#274867 url(/dialog/exercise/banner-1.png) no-repeat center;}
*/
section.exercise footer>div.main>aside.banner{width:250px;height:165px;order:2;margin:0 2px 12px 0;background:#0065a5;background-color:var(--color-main);}
section.exercise footer>div.main>aside.banner a{display:block;width:100%;height:100%;}
/*
body.mode-course section.exercise footer>div.main>aside.banner.banner-buy-course a{background-image:url(/dialog/exercise/banner-rabat-250.png);}
body.mode-course section.exercise footer>div.main>aside.banner.banner-activate-demo a{background-image:url(/dialog/exercise/banner-demo-250.png);}
*/



section.exercise footer>div.main>div.alt{width:100%;order:3;}

section.exercise div.results{height:190px;background:#f5f9fc;position:relative;display:flex;}
section.exercise div.results>div.img{flex:0 1 486px;position:relative;}
@keyframes showresult{from{transform:scale(.1);}to{transform:scale(1);}}
section.exercise div.results>div.img::after{position:absolute;display:block;right:0;top:0;animation-name:showresult;animation-duration:.3s;}
section.exercise div.results>div.img.ok-1::after{content:url(/static/images/exercise2/ok-1.png);}
section.exercise div.results>div.img.ok-2::after{content:url(/static/images/exercise2/ok-2.png);}
section.exercise div.results>div.img.error-1::after{content:url(/static/images/exercise2/error-1.png);}
section.exercise div.results>div.img.error-2::after{content:url(/static/images/exercise2/error-2.png);}


section.exercise div.results>div.detail{width:199px;flex:0 0 199px;transition:opacity .3s;}
section.exercise div.results>div.detail.h{opacity:0;}
section.exercise div.results>div.detail>span{display:block;width:100%;height:102px;margin:50px 0 0;position:relative;}
section.exercise div.results>div.detail>span>span{display:block;width:100%;height:100%;padding:5px;}

section.exercise div.results>div.detail>span::before,section.exercise div.results>div.detail>span::after,section.exercise div.results>div.detail>span>span::before,section.exercise div.results>div.detail>span>span::after{content:"";position:absolute;display:block;width:20px;height:20px;border:5px solid #a9c2d6;z-index:1;}
section.exercise div.results>div.detail>span::before{top:-1px;left:-1px;border-bottom:none;border-right:none;}
section.exercise div.results>div.detail>span::after{bottom:-1px;right:-1px;border-top:none;border-left:none;}
section.exercise div.results>div.detail>span>span::before{bottom:-1px;left:-1px;top:auto;border-top:none;border-right:none;border-bottom:5px solid #a9c2d6;}
section.exercise div.results>div.detail>span>span::after{top:-1px;right:-1px;bottom:auto;border-bottom:none;border-left:none;border-top:5px solid #a9c2d6;}
section.exercise div.results label{position:absolute;left:0;right:0;bottom:-9px;text-align:center;text-transform:uppercase;font-weight:600;letter-spacing:1.5px;line-height:1;font-size:14px;}
section.exercise div.results label::after{content:"";display:inline-block;margin:0 0 1px 5px;width:6px;height:6px;border-radius:50%;background:#274867;background-color:var(--color-main);cursor:default;}
section.exercise div.results output[name="result-points"],section.exercise div.results output[name="result-max"]{position:absolute;top:32px;left:14px;width:38px;height:38px;border-radius:50%;background:#274867;background-color:var(--color-main);color:#fff;text-align:center;line-height:38px;padding:0;font-weight:700;font-size:20px;}
section.exercise div.results output[name="result-max"]{background:#a9c2d6;left:71px;}
section.exercise div.results output[name="result-percentage"]{position:absolute;top:21px;right:16px;width:56px;height:56px;border-radius:50%;border:2px dotted #a9c2d6;text-align:center;line-height:56px;padding:0;color:#515352;font-weight:700;font-size:20px;}
section.exercise div.results output[name="result-percentage"]::after{content:"%";position:absolute;right:11px;top:5px;color:#a9c2d6;line-height:12px;font-size:16px;}
section.exercise div.results output[name="result-percentage"]:empty{visibility:hidden;}
section.exercise div.results output[name="result-points"]::after{content:"";position:absolute;width:2px;height:27px;background:#a9c2d6;top:7px;right:-11px;transform:rotate(18deg);border-radius:1px;}

section.exercise div.results>div.next{width:224px;flex:0 0 224px;padding:0 23px 0 0;text-align:center;}
section.exercise div.results>div.next>span{display:block;margin:37px 0 16px;padding:0;font-weight:400;font-size:17px;line-height:24px;color:#515352;}
section.exercise div.results>div.next>button{display:block;margin:0 auto;width:106px;height:58px;border-radius:29px;border:none;background:#0065a5;background-color:var(--color-main);color:#fff;font-size:72px;font-weight:700;line-height:0;padding:0 0 20px;transition:transform .3s;}
section.exercise div.results>div.next>button::before{content:"›";color:}
section.exercise div.results>div.next>button:enabled:focus,section.exercise div.results>div.next>button:enabled:hover{transform:scale(1.1);}

/*
section.exercise div.results::after{content:url(/ecoursebook/img/___tmp_results.webp);position:absolute;top:0;left:0;pointer-events:none;filter:grayscale(1);opacity:.3;}
stop section.exercise div.results{background-image:url(/ecoursebook/img/___tmp_results.webp);background-repeat:no-repeat;background-position:left top;background-color:#ccc;font-family:"Segoe UI",sans-serif;}
*/

body.mode-course{}
body.mode-course section.exercise div.main{width:906px;margin:0 auto 0 2px;}
body.mode-course section.exercise div.columns>aside{margin-left:26px;}

body.mode-course section.exercise footer>div.main{padding-top:0;padding-bottom:26px;min-height:181px;}
body.mode-course section.exercise footer>div.main>p>span,section.exercise footer>div.main>p>strong{display:inline;}
body.mode-course section.exercise footer>div.main>div.alt{margin:0 63px;/*width:678px;*/width:506px;}
body.mode-course section.exercise footer>div.main>p{padding:17px 23px 16px;max-width:907px;}
/*
body.mode-course section.exercise footer>div.main>div.banner{width:481px;height:134px;position:absolute;left:909px;top:21px;}
body.mode-course section.exercise footer>div.main>div.banner a{background-image:url(/dialog/exercise/banner-2.png);}
*/
body.mode-course section.exercise footer>div.main>aside.banner{width:250px;height:165px;position:absolute;left:909px;top:21px;background:#0065a5;background-color:var(--color-main);margin:0;position:absolute;left:647px;top:15px;}
/*
body.mode-course section.exercise footer>div.main>aside.banner.banner-buy-course a{background-image:url(/dialog/exercise/banner-rabat-250.png);}
body.mode-course section.exercise footer>div.main>aside.banner.banner-activate-demo a{background-image:url(/dialog/exercise/banner-demo-250.png);}
*/


/* dictionary */
section.exercise section.item-dictionary{border:none;background:#f5f9fc;position:static;}
section.exercise section.item-dictionary h6{background:#a9c2d6;height:40px;line-height:40px;padding:0 0 0 47px;border-radius:0;position:relative;}
section.exercise section.item-dictionary h6::before{content:"";background:url(/ecoursebook/img/buttons-show.png) no-repeat 0 0;width:21px;height:29px;position:absolute;left:14px;top:6px;vertical-align:middle;}
section.exercise section.item-dictionary ul li{height:39px;border:none;}
section.exercise section.item-dictionary ul li a[rel=play]{left:9px;top:3px;width:30px;height:30px;background:transparent url(/lekcje-online/img/icons-navigation.png?6) no-repeat -450px 0;}


/* access denied */
div.overlay-acccess-denied{position:fixed;top:0;right:0;bottom:0;left:0;background:#a5c2d57f;z-index:99;backdrop-filter:grayscale(1) brightness(1.2);user-select:none;}
div.overlay-acccess-denied>div{position:absolute;right:118px;margin:auto 0;top:0;bottom:232px;background:#fff url(/dialog/exercise/lock-l.png) no-repeat center /*41px*/22px;width:175px;height:175px;border-radius:50%;text-align:center;/*padding:100px 15px 20px;*/padding:80px 10px 0;overflow:hidden;line-height:18px;font-size:13px;color:#2b4a67;text-transform:uppercase;font-weight:600;}
div.overlay-acccess-denied a.banner{position:absolute;left:0;right:0;bottom:0;height:232px;background:#274867 url(/dialog/exercise/banner-3.png) no-repeat center;}