.catalog{width:100%;height:100vh;background:#483ab9;background:linear-gradient(165deg,#483ab9 35%,#c700ff);display:flex;flex-direction:column;justify-content:center;align-items:center}.catalog__header{width:100%;height:90px;position:fixed;top:0;left:0;display:flex;justify-content:space-between;align-items:center;padding:0 30px;z-index:2;background-color:#fff}@media screen and (max-width: 525px){.catalog__header{padding:0 15px}}.catalog__header h1{color:#7d69f1;font-weight:700}@media screen and (max-width: 525px){.catalog__header h1{font-size:20px}}.catalog__header div{display:flex;gap:15px}.catalog__header div button{height:40px;width:100px;border:2px solid #999;border-radius:20px;transition:.4s;font-weight:700}.catalog__header div button:hover{background-color:#7d69f1;color:#fff;transition:.4s;border:none}.catalog__holder{width:100%;height:auto;display:flex;flex-wrap:wrap;justify-content:center;padding:30px;gap:15px}@media screen and (max-width: 1291px){.catalog__holder{height:80vh;border-bottom:4px solid #fff;overflow-y:scroll}}.catalog__holder .pagination{width:130px;position:fixed;left:calc(50% - 65px);bottom:20px;display:flex;justify-content:center;align-items:center;color:#fff;gap:10px}.catalog__holder .pagination button{width:30px;height:30px;background-image:url(https://www.freeiconspng.com/uploads/white-arrow-icon-5.png);background-size:cover}.catalog__holder .pagination button:first-child{transform:rotate(180deg)}.card{width:400px;height:200px;border:3px solid #fff;padding:15px;display:flex;flex-direction:column;justify-content:space-between;border-radius:10px;position:relative;color:#fff}.card__menu{display:flex;flex-direction:column;position:absolute;right:40px;top:22px;gap:2px}.card__menu button{height:40px;width:100px;border:2px solid #999;border-radius:20px;transition:.4s;font-weight:700;color:#fff}.card__menu button:hover{background-color:#7d69f1;transition:.4s;border:none}.card__section{display:flex;flex-direction:column;gap:10px}.card__name{width:100%;display:flex;justify-content:space-between;align-items:center}.card__name-button{width:20px;display:flex;flex-direction:column;align-items:center;gap:1.5px;cursor:pointer}.card__name-button div{width:5px;height:5px;border-radius:50%;background-color:#fff}*{margin:0;padding:0;border:0;box-sizing:border-box}body{font-family:Arial,sans-serif;font-size:16px;line-height:1.5;background-color:#fff;color:#000}ul,ol{list-style:none}h1,h2,h3,h4,h5,h6{font-weight:400}a{text-decoration:none;color:inherit}button,input,textarea,select{font:inherit;background:none;border:none;outline:none}img{max-width:100%;height:auto;display:block}table{border-collapse:collapse;border-spacing:0}.createQuiz{width:100%;height:100vh;display:flex;justify-content:center;align-items:center;overflow:scroll}.createQuiz__header{width:100%;position:absolute;top:0;left:0;display:flex;justify-content:space-between;padding:20px 0}.createQuiz__header h1{color:#7d69f1;font-weight:700}.createQuiz__container{width:90%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:30px 0;overflow:scroll;position:relative}.createQuiz__container .info-form{display:flex;flex-direction:column;gap:10px;position:absolute;top:100px;left:0}@media screen and (max-width: 460px){.createQuiz__container .info-form{width:100%}}.createQuiz__container button,.createQuiz__container select{height:40px;width:100px;border:2px solid #999;border-radius:20px;transition:.4s;font-weight:700}.createQuiz__container button:hover,.createQuiz__container select:hover{background-color:#7d69f1;color:#fff;transition:.4s}.createQuiz__container select{width:fit-content;padding:0 10px}.createQuiz__container input{width:400px;height:40px;padding:0 15px;border-radius:20px;background-color:#e9e6fd}@media screen and (max-width: 460px){.createQuiz__container input{width:100%}}.createQuiz__container .questions-form{display:flex;flex-direction:column;gap:10px}.createQuiz__container .content1,.createQuiz__container .content2{display:flex;gap:10px}.login{width:100%;height:100vh;display:flex;justify-content:center;align-items:center;background:#483ab9;background:linear-gradient(165deg,#483ab9 35%,#c700ff);color:#999}.login__container{width:70%;height:80%;display:flex;justify-content:space-between;align-items:center}@media screen and (max-width: 515px){.login__container{width:90%}}.login__content{width:calc(100% - 400px);height:100%;background-image:url(https://img.pikbest.com/backgrounds/20190214/purple-simple-gradient-shading-background_1861265.jpg!bw700);background-size:cover;color:#fff;border-radius:20px 0 0 20px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:30px}.login__content h1{font-size:40px}.login__content p{text-align:center;font-size:20px}@media screen and (max-width: 1185px){.login__content{padding:20px}.login__content h1{font-size:30px}.login__content p{font-size:16px}}@media screen and (max-width: 1060px){.login__content{display:none}}.login__form{background-color:#fff;width:400px;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:30px;border-radius:0 20px 20px 0}@media screen and (max-width: 1060px){.login__form{width:100%;border-radius:20px}}.login__form input{width:100%;height:40px;padding:0 15px;border-radius:20px;background-color:#e9e6fd}.login__form div{width:75%;display:flex;flex-direction:column;gap:5px}@media screen and (max-width: 515px){.login__form div{width:90%}}.login__form button{height:40px;width:100px;border:2px solid #999;border-radius:20px;transition:.4s;font-weight:700}.login__form button:hover{background-color:#7d69f1;color:#fff;transition:.4s;border:none}.login__form h2,.login__form a{color:#7d69f1;font-weight:700}.runQuiz{width:100%;height:100vh;display:flex;justify-content:center;align-items:center;color:#000}.runQuiz button{height:40px;width:100px;border:2px solid #999;border-radius:20px;transition:.4s;font-weight:700;color:#000}.runQuiz button:hover{background-color:#7d69f1;transition:.4s;border:none}.runQuiz p{font-size:25px}.runQuiz input[type=text]{width:300px;height:40px;padding:0 15px;border-radius:20px;background-color:#e9e6fd}.runQuiz input[type=text]:palceholder{color:#000}.runQuiz input[type=radio],.runQuiz input[type=checkbox]{width:20px;height:20px}.runQuiz label{display:flex;gap:10px}.runQuiz__container{width:90%;height:100%;position:relative}.runQuiz__info{display:flex;flex-direction:column;gap:10px}.runQuiz__info h1{font-size:50px;font-weight:700;color:#7d69f1}.runQuiz__content{display:flex;flex-direction:column;align-items:flex-start;gap:30px;position:absolute;top:0;left:0}