*,*::before,*::after{box-sizing:border-box;user-select:none;outline:none;-webkit-tap-highlight-color:transparent}ul[class],ol[class]{padding:0}body,h1,h2,h3,h4,p,ul[class],ol[class],li,figure,figcaption,blockquote,dl,dd{margin:0;padding:0}body{min-height:100vh;scroll-behavior:smooth;text-rendering:optimizeSpeed;line-height:1.5}ul[class],ol[class]{list-style:none}a:not([class]){text-decoration-skip-ink:auto}a{text-decoration:none;color:#fff}img{max-width:100%;display:block}input,button,textarea,select{font:inherit;outline:none}body{background-color:#000;color:#fff;display:flex;flex-direction:column;font-family:"Montserrat Alternates",sans-serif}.container{max-width:1440px;margin:20px auto 0 auto;padding:0 40px}
.main{flex:1 0 auto;height:calc(100% - 60px)}.main-page{display:flex;align-items:center;flex-direction:column;margin-top:220px}@media(max-width: 600px){.main-page{margin-top:150px}}.main-page .main-page__title{height:165px;margin:0 auto 70px auto}@media(max-width: 600px){.main-page .main-page__title{margin:0 auto 50px auto;height:auto}}.main-page .main-page__button{display:inline-block;margin:10px 0;cursor:pointer;padding:15px 60px;width:300px;border:2px solid #fff;background:none;color:#fff;border-radius:60px;font-weight:500;font-size:22px;line-height:22px;text-align:center}.main-page .main-page__button:hover{color:#000;background-color:#fff;transition:.75s ease-out;border:2px solid #fff}.main-page .main-page__button:active{color:#000;background-color:#ffbca2;transition:.75s ease-out;border:#ffbca2;border:2px solid #fff}@media(max-width: 420px){.main-page .main-page__button{width:240px;padding:10px 40px}}.settings-wrapper{display:flex;align-items:center;justify-content:center;margin-top:20px;font-size:20px;transition:1s;width:150px}.settings-wrapper .settings__link{margin-right:5px;transition:1s}.settings-wrapper:hover .settings__link{transform:rotate(90deg);transition:1s}.settings-wrapper:hover .set{color:#ffbca2}.settings-wrapper .settings__link-img{width:36px;height:36px}.footer{display:flex;justify-content:space-between;height:60px;padding:0 20px;margin:35px 0 0 0;align-items:center}.footer__dev-link{color:#ffbca2}@media(max-width: 550px){.footer__developer-link{margin-left:20px;font-size:12px;word-wrap:normal;text-align:right}}
.header{display:flex;align-items:center}@media(max-width: 600px){.header{flex-direction:column;align-items:flex-start}.header *{margin-bottom:20px}}.header *{margin-right:120px;font-weight:500;font-size:22px}@media(max-width: 850px){.header *{margin-right:30px}}.header__home-link:hover{color:#ffbca2}.header__current-page{color:#ffbca2;border-bottom:1px solid #ffbca2}.header__logo{height:62px}.quiz-title{font-weight:600;font-size:30px;line-height:30px;color:#ffbca2;margin:30px 0 60px}.category_header_wrapper{display:flex;flex-direction:row;justify-content:space-between;align-items:center;margin:0 0 60px 0}@media(max-width: 600px){.category_header_wrapper{text-align:left;align-items:flex-start}}.header_category{display:flex;flex-direction:row;align-items:center;margin-top:30px}@media(max-width: 600px){.header_category{flex-direction:column;text-align:left;align-items:flex-start}}.cards{display:flex;justify-content:space-between;flex-direction:row;column-gap:25px;row-gap:50px;flex-wrap:wrap}@media(max-width: 1400px){.cards{justify-content:center}}@media(max-width: 750px){.cards{row-gap:15px}}.card{margin-bottom:20px;cursor:pointer}@media(max-width: 750px){.card{margin-bottom:30px}}@media(max-width: 510px){.card{margin-bottom:10px}}.card__top{display:flex;justify-content:space-between;margin-bottom:10px}@media(max-width: 750px){.card__top{font-size:18px}}.card__category{font-style:normal;font-weight:500;font-size:18px;line-height:20px}@media(max-width: 750px){.card__category{font-size:18px}}.card__label{position:absolute;bottom:0;height:50px;width:100%;background-color:#ffbca2;color:#000;font-size:20px;font-weight:500;display:flex;justify-content:center;align-items:center;border-radius:0 0 25px 25px}.card__label-image{margin-right:5px;width:26px;height:26px}.card__image{width:195px;height:195px;border-radius:25px;transition:.5s}.card__image--grey{filter:grayscale(100%)}@media(max-width: 510px){.card__image{width:240px;height:240px}}.card__box{height:195px;display:block;position:relative;border-radius:25px}.card__box:hover{transition:.5s;box-shadow:8px 8px 16px 0px #ffbca2}@media(max-width: 510px){.card__box{width:240px;height:240px}}.card__score{display:block;font-style:normal;font-weight:500;font-size:20px;line-height:20px;color:#ffbca2;transition:.8s}.card__score:hover{font-size:25px;transition:.8s}.none{display:none}
.question-page{max-width:825px;margin:0 auto}.question_pictures_page{max-width:825px;margin:0 auto}.question-page__top{display:flex;align-items:center;justify-content:space-between;margin:0 0 12px 0;column-gap:20px}.question{font-style:normal;font-weight:400;font-size:28px;line-height:28px;margin-bottom:10px}@media(max-width: 750px){.question{font-size:24px}}@media(max-width: 450px){.question{font-size:18px}}.question-page__close{cursor:pointer}.timer{width:100%;position:relative}.timer__line{width:100%;height:4px;margin:0 5px;background-color:#fff}.timer__line--colored{width:0%;height:4px;margin:0 5px;background-color:#fa7d4b;position:absolute;top:0;align-items:right}.time{display:inline-block;width:110px;font-style:normal;font-weight:bold;font-size:28px;line-height:28px}@media(max-width: 750px){.time{font-size:24px}}@media(max-width: 530px){.time{font-size:18px}}.question-page__timer{width:80px}.colored{color:#ffbca2;font-weight:700}.question-picture-wrapper{margin:15px 0}.image-wrapper__picture{pointer-events:none;width:100%;height:auto;padding:0;margin-top:-50px;cursor:pointer;border-radius:20px;overflow:hidden}@media(max-width: 950px){.image-wrapper__picture{margin-top:-60px}}.question-picture{padding:0;margin:0;border-radius:20px;margin-left:auto;margin-right:auto;height:600px}@media(max-width: 950px){.question-picture{height:auto}}.image-wrapper{cursor:pointer;position:relative;width:400px;height:280px;overflow:hidden;border-radius:20px;border:1px solid transparent}.image-wrapper:hover{transition:.5s;border:1px solid #fff}@media(max-width: 950px){.image-wrapper{width:330px;height:auto}}@media(max-width: 750px){.image-wrapper{width:250px;height:auto}}@media(max-width: 630px){.image-wrapper{width:200px;height:auto}}.image-wrapper__bg{pointer-events:none;position:absolute;top:0;width:100%;height:100%;opacity:.5;border-radius:20px}.image-wrapper__bg.correct-answer{background-color:green}.image-wrapper__bg.wrong-answer{background-color:red}.question-dots{text-align:center}.question-dots__dot{display:inline-block;width:15px;height:15px;border-radius:100%;background:#c4c4c4;margin:15px 10px}.question-dots__dot.correct{background:green}.question-dots__dot.wrong{background:red}@media(max-width: 530px){.question-dots__dot{width:10px;height:10px;margin:0 5px}}.question-answers{text-align:center;display:flex;flex-wrap:wrap;column-gap:15px;justify-content:space-between;margin-top:15px}@media(max-width: 750px){.question-answers{justify-content:center}}.button{padding:0;cursor:pointer;width:287px;height:62px;border:2px solid #fff;background:none;color:#fff;border-radius:60px;font-weight:500;font-size:22px;line-height:22px}.button:hover{color:#000;background-color:#fff;transition:.75s ease-out}.button:active{color:#000;background-color:#ffbca2;transition:.75s ease-out;border:#ffbca2}@media(max-width: 960px){.button.answer{width:330px;border:2px solid #fff;border-radius:60px;font-weight:500;font-size:22px;line-height:22px}}@media(max-width: 750px){.button.answer{width:205px;height:50px;font-size:16px}}@media(max-width: 530px){.button.answer{height:40px;font-size:12px}}.answer{width:400px;height:55px;margin-bottom:10px;border:2px solid #fff}.answer:hover{background-color:#ffbca2;border:#ffbca2;transition:.75s ease-out}.answer:active{background-color:#ffbca2;border:#fff;transition:.75s ease-out}.answer.correct-answer{background-color:green}.answer.wrong-answer{background-color:red}.pictures-container{display:flex;flex-wrap:wrap;justify-content:space-between;column-count:2;row-gap:25px;margin:30px 0}@media(max-width: 950px){.pictures-container{row-gap:20px;column-gap:20px;justify-content:center}}@media(max-width: 500px){.pictures-container{row-gap:8px;column-gap:8px;margin:10px 0;height:600px}}
.modal{z-index:5}.popup{width:100%;height:100vh;background:rgba(0,0,0,.5);position:fixed;top:0;left:0}.popup-wrapper{width:500px;height:690px;padding:10px 20px;background:#fff;position:absolute;top:calc(50% - 325px);left:calc(50% - 250px);border-radius:20px;display:flex;flex-direction:column;text-align:center}@media(max-width: 750px){.popup-wrapper{width:400px;height:550px;top:calc(50% - 275px);left:calc(50% - 200px)}}@media(max-width: 450px){.popup-wrapper{width:280px;height:500px;top:calc(50% - 275px);left:calc(50% - 140px)}}.popup-image__picture{width:90%;border-radius:20px}.popup-image{position:relative;margin:20px 0;display:flex;justify-content:center}.popup-image__icon{position:absolute;bottom:0;left:0;margin:0 0 30px 40px}@media(max-width: 750px){.popup-image__icon{margin:0 0 20px 40px}}@media(max-width: 450px){.popup-image__icon{margin:0 0 15px 25px}}.picture-name{font-style:normal;font-weight:500;font-size:26px;line-height:28px;color:#000;margin-bottom:5px}@media(max-width: 750px){.picture-name{font-size:24px}}@media(max-width: 450px){.picture-name{font-size:22px}}.picture-info{font-weight:normal;font-size:22px;line-height:26px;color:#000}@media(max-width: 750px){.picture-info{font-size:20px}}@media(max-width: 450px){.picture-info{font-size:18px}}.button.next{background:#ffbca2;color:#000;margin:5px auto 5px auto}.button.next:hover{background:#ffbca2;color:#fff}@media(max-width: 450px){.button.next{width:200px}}.finish{color:#000;display:flex;flex-direction:column;padding:60px 30px;justify-content:center;align-items:center}.finish *{margin-bottom:40px}@media(max-width: 750px){.finish *{margin-bottom:20px}}.finish__wrapper{display:flex;justify-content:space-between;flex-direction:row;width:100%}.finish__button{display:flex;align-items:center;justify-content:center;padding:0;cursor:pointer;height:55px;margin:5px;font-weight:500;font-size:22px;line-height:23px;width:180px;border:3px solid #000;background:none;color:#000;border-radius:25px}.finish__button:hover{color:#000;background-color:#fff;transition:.75s ease-out}.finish__button:active{color:#000;background-color:#ffbca2;transition:.75s ease-out;border:#ffbca2}.finish__button:hover{color:#000;background-color:#ffbca2;border:3px solid #ffbca2;transition:.75s ease-out}@media(max-width: 450px){.finish__button{width:100px;font-size:18px}}.finish__image{margin-left:auto;margin-right:auto}.finish__text{font-style:normal;font-weight:600;font-size:42px;line-height:51px}@media(max-width: 470px){.finish__text{font-weight:500;font-size:28px;line-height:32px}}.finish__score{font-style:normal;font-weight:bold;font-size:82px;line-height:102px;text-align:center;text-transform:uppercase}@media(max-width: 470px){.finish__score{font-weight:500;font-size:60px;line-height:80px}}
.settings{display:flex;justify-content:space-between;align-items:center;padding:25px 0 0 0}.settings__controls{display:flex;align-items:center}.settings__controls .control__back-link{font-style:normal;font-weight:500;font-size:28px;line-height:28px;margin-left:10px;color:#ffbca2}.settings__controls .control__back-arrow,.settings__controls .control__close-img{cursor:pointer;width:45px;height:45px}.typeOuiz{margin:120px 20px 0 20px;padding:0;cursor:pointer;width:287px;font-weight:500;font-size:22px;line-height:22px}.settings__item{color:#fff;font-style:normal;font-weight:bold;font-size:34px;line-height:28px;margin:60px 0 30px 0}.settings__item.inactive{color:gray}@media(max-width: 530px){.settings__item{font-weight:500;font-size:28px;margin:30px 0 15px 0}}.sound-bar{cursor:pointer;height:8px;width:490px;margin-bottom:10px;outline:none;-webkit-appearance:none}@media(max-width: 750px){.sound-bar{width:100%}}.sound-bar::-webkit-slider-thumb{width:15px;height:15px;border-radius:50%;-webkit-appearance:none;background:#fff}.sound-bar-bottom{width:490px;height:23px;display:flex;justify-content:space-between}@media(max-width: 750px){.sound-bar-bottom{width:100%}}.button-switch{display:inline-block;cursor:pointer;font-size:16px;height:26px;position:relative;width:72px;margin:0 0 0 20px}.button-switch .lbl-off,.button-switch .lbl-on{cursor:pointer;font-size:15px;font-weight:700;line-height:16px;position:absolute;top:5px;transition:opacity .25s ease-out .1s;color:#fefefe}.button-switch .lbl-off{right:18px}.button-switch .lbl-on{opacity:0;left:12px}.switch{cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;height:0;font-size:17px;left:0;line-height:0;outline:none;position:absolute;top:0;width:0;color:#fefefe}.switch:before,.switch:after{content:"";font-size:17px;position:absolute;color:#fefefe}.switch:before{border-radius:20px;background:#000;border:2px solid #fff;height:33px;left:-7px;top:-4px;transition:background-color .25s ease-out .1s;width:72px;color:#fefefe}.switch:after{box-shadow:0 2px 4px 0 #666;border-radius:50%;background:#fefefe;height:24px;transform:translate(0, 0);transition:transform .25s ease-out .1s;width:24px;color:#fefefe}.switch:checked:after{transform:translate(35px, 0);color:#fefefe}.switch:checked~.lbl-off{opacity:0;color:#fefefe}.switch:checked~.lbl-on{opacity:1;color:#fefefe}.switch#switch_timer:checked:before{background:#ffbca2;border:2px solid #ffbca2;color:#fefefe}.button_timegame_container{display:flex;justify-content:flex-start;align-items:center;margin-bottom:80px}.on_off{font-weight:500;font-size:24px;line-height:28px;color:#fff}.numborber{display:flex;justify-content:space-between;align-items:center;width:150px;height:50px;box-sizing:border-box}.btnplus{box-sizing:border-box;font-family:"Roboto",sans-serif;background:#fff;color:#000;width:36px;height:36px;border-radius:100%;border:3px solid #fff;font-size:32px;font-weight:400;display:flex;justify-content:center;align-items:center;cursor:pointer}.btnplus:hover{background-color:#ffbca2;border:#ffbca2;transition:.75s ease-out}.btnplus:active{background-color:#ffbca2;border:#ffbca2;transition:.75s ease-out}.btnplus.inactive{background:gray;border:3px solid gray;pointer-events:none}.number{width:50px;height:30px;color:#fff;background:#000;font-style:normal;font-weight:500;font-size:24px;line-height:28px;border:none;outline:none;margin-left:20px;text-align:center}.number.inactive{color:gray}.default-button{display:block;margin:50px 4px 4px auto}@media(max-width: 750px){.default-button{margin:50px 4px 4px}}@media(max-width: 750px){.default-button{margin:40px auto 10px auto;width:240px;height:50px}}.reset-button{display:block;margin:10px 4px 4px auto}@media(max-width: 750px){.reset-button{margin:10px 4px 4px}}@media(max-width: 750px){.reset-button{margin:0px auto;width:240px;height:50px}}.wrapper-time-setter.inactive *{color:gray;pointer-events:none}.wrapper-time-setter.inactive * .btnplus{background:gray;border:3px solid gray;pointer-events:none;color:#000}
.results-container{display:flex;justify-content:center;align-items:center;column-gap:36px;flex-wrap:wrap;width:100%}.score-title{font-weight:600;font-size:30px;line-height:32px;color:#ffbca2;margin:40px 0 10px;text-align:center;font-size:40px}@media(max-width: 510px){.score-title{font-size:24px}}.score-note{font-size:18px;text-align:center;margin:20px 0 60px}@media(max-width: 510px){.score-note{font-size:16px;margin:10px 0 20px}}.picture{font-size:0;position:relative;width:350px;height:auto;border-radius:25px;cursor:pointer;margin-bottom:20px;border:1px solid transparent}.picture:first-child,.picture:nth-child(3),.picture:nth-child(6),.picture:nth-child(7),.picture:nth-child(9),.picture:nth-child(4){margin-top:50px}@media(max-width: 1210px){.picture:first-child,.picture:nth-child(3),.picture:nth-child(6),.picture:nth-child(7),.picture:nth-child(9),.picture:nth-child(4){margin-top:0}}.picture:hover{border:1px solid #ffbca2}.picture__description{padding:10px;width:100%;height:150px;text-align:center;display:flex;flex-direction:column;justify-content:center;align-items:center;background-color:#ffbca2;color:#000;font-size:20px;font-weight:500;position:absolute;bottom:0px;border-radius:0 0 25px 25px}.picture__description.none{opacity:0}.picture__img{display:inline-block;width:350px;border-radius:25px;transition:.5s}.picture__img.grey{filter:grayscale(100%)}
