@keyframes fade{0%{opacity:0}100%{opacity:1}}.quiz__landing-container{height:100vh;width:100%;overflow:hidden}.quiz__landing-wrapper{background:linear-gradient(to bottom right, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.5)),url("https://paulalexserban.github.io/wbk--frontend-playground/assets/images/landing-bg-original.webp") no-repeat center;font-family:Raleway,sans-serif;height:90vh;width:95%;margin:5vh 2.5%;position:relative;box-shadow:15px 15px 35px #999;background-size:cover;border-radius:3px;animation:fade .8s}.quiz__landing-heading{text-align:center;font-size:55px;color:#eee;text-shadow:1px 1px 5px #555;letter-spacing:3px;padding-top:60px}.quiz__landing-inputs-wrapper{clip-path:polygon(100% 34%, 100% 35%, 100% 100%, 0 100%, 0 7%);background:rgba(0,0,0,.7);padding:100px 10px 10px;width:400px;min-height:200px;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);color:#fff;border-radius:3px;margin-top:100px;animation:fade 1.5s}.quiz__landing-input{width:300px;font-size:17px;font-family:"Josefin Sans",sans-serif;padding:15px 10px;margin:10px auto;background:rgba(0,0,0,0);border-radius:3px;color:#eee;outline:none;border-color:rgba(0,0,0,0);border-bottom:2px solid #aaa;transition:all .3s;display:block}.quiz__landing-input::placeholder{color:#aaa}.quiz__landing-input:focus{border-bottom:2px solid #fff}.quiz__start-quiz-btn{font-family:Cabin,sans-serif;width:300px;padding:13px 10px;margin:15px auto;font-size:18px;letter-spacing:1.5px;border-radius:25px;border:2px solid #aaa;outline:none;color:#aaa;background:rgba(0,0,0,0);display:block;transform:translateX(0);transition:all .3s}.quiz__start-quiz-btn:hover{border:2px solid #fff;color:#fff;transform:translateX(-1px)}.quiz__admin-container{height:90vh;width:95%;margin:5vh 2.5%;position:relative;background:linear-gradient(to bottom right, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.7)),url("https://paulalexserban.github.io/wbk--frontend-playground/assets/images/admin-bg-original.webp") no-repeat center;box-shadow:15px 15px 35px #999;background-size:cover;overflow:hidden;animation:fade .8s}.quiz__admin-wrapper{width:60%;height:65%;position:absolute;left:40px;top:40px;background:rgba(0,0,0,.65);border-radius:3px;overflow:auto}.quiz__admin-wrapper::-webkit-scrollbar{background:rgba(0,0,0,.2);width:15px}.quiz__admin-wrapper::-webkit-scrollbar-thumb{background-color:#333}div.header{overflow:hidden}div.header h2{font-family:"Josefin Sans",sans-serif;font-size:30px;text-align:left;width:50%;float:left;padding:20px;color:#fff}div.forms-wrapper{width:80%;margin:1% auto}#new-question-text{font-family:"Josefin Sans",sans-serif;font-size:18px;color:#eee;max-width:500px;min-width:300px;width:50%;height:60px;border-radius:2px;border:.5px solid #eee;display:block;margin:10px 0 10px 80px;padding:7px;outline:none;background:#444;transition:all .5s}#new-question-text:focus{border:.5px solid #3b8beb;background:#555}div.admin-option-wrapper{position:relative;width:70%}div.forms-wrapper input[type=text]{width:300px;font-family:"Josefin Sans",sans-serif;font-size:17px;color:#eee;display:block;margin:10px 0 10px 80px;padding:10px 5px;border-radius:2px;border:.5px solid #eee;outline:none;background:#444;animation:fade .5s;transition:all .5s}div.forms-wrapper input[type=text]:focus{border:.5px solid #3b8beb;background:#555}div.forms-wrapper input[type=radio]{position:absolute;left:60px;top:15px}#question-insert-btn{font-family:"Cabin",sans-serif;margin-left:80px;padding:10px 10px;width:120px;color:#eee;font-size:16px;letter-spacing:1.5px;background:#222;border-radius:25px;outline:none;border:1px solid #ccc;transition:background .3s,border .3s,box-shadow .3s}#question-insert-btn:hover{color:#eee;border:1px solid #fff;background:#555}#admin-logout-btn{font-family:"Cabin",sans-serif;font-size:15px;float:right;margin:20px;background-color:#222;border-radius:25px;width:110px;letter-spacing:1.5px;color:#eee;padding:10px;border:1px solid #ccc;outline:none;transition:all .3s}#admin-logout-btn:hover{color:#fff;border:1px solid #fff;background-color:#555}#questions-clear-btn{letter-spacing:1.5px;font-family:"Cabin",sans-serif;color:#eee;font-size:16px;padding:10px;border-radius:25px;width:120px;background:#222;position:absolute;right:15px;bottom:20px;border:1px solid #ccc;outline:none;transition:all .3s}#questions-clear-btn:hover{border:1px solid #fff;background:#555}#question-update-btn{font-family:"Cabin",sans-serif;padding:10px;margin-left:80px;width:110px;color:#eee;font-size:16px;letter-spacing:1.5px;background:#222;border-radius:25px;border:1px solid #ccc;outline:none;visibility:hidden;transition:background .3s,border .3s,box-shadow .3s}#question-update-btn:hover{border:1px solid #fff;background:#555;color:#fff}#question-delete-btn{font-family:"Cabin",sans-serif;margin-left:80px;padding:10px;width:110px;color:#eee;font-size:16px;letter-spacing:1.5px;background:#222;border-radius:25px;border:1px solid #ccc;outline:none;visibility:hidden;transition:background .3s,border .3s,box-shadow .3s}#question-delete-btn:hover{border:1px solid #fff;background:#555}div.inserted-questions-wrapper{padding:10px 0;width:60%;height:20%;position:absolute;left:40px;bottom:40px;background:rgba(0,0,0,.65);border-radius:3px;overflow:auto}div.inserted-questions-wrapper::-webkit-scrollbar{background:rgba(0,0,0,.2);width:15px}div.inserted-questions-wrapper::-webkit-scrollbar-thumb{background-color:#333}div.inserted-questions-wrapper p{color:#eee;background:#444;padding:6px 10px;width:92%;margin:5px auto;border-radius:2px;border:1px solid #ccc;transition:background .3s}div.inserted-questions-wrapper p:hover{border:1px solid #fff;background:#555}div.inserted-questions-wrapper p span{font-family:"Josefin Sans",sans-serif;font-size:16px}div.inserted-questions-wrapper p button{font-family:"Cabin",sans-serif;float:right;color:#eee;padding:4px 10px;margin-top:-4px;border:1px solid #ccc;border-radius:25px;letter-spacing:1.5px;background-color:#222;transition:all .3s}div.inserted-questions-wrapper p button:hover{background:#777;border:1px solid #fff}div.results-list-container{width:30%;position:absolute;height:90%;right:35px;top:5%;background:rgba(0,0,0,.65);border-radius:3px;overflow:auto}.clear{overflow:hidden}div.results-list-container h2{font-family:"Josefin Sans",sans-serif;font-size:30px;color:#eee;text-align:left;float:left;padding:20px}#results-clear-btn{font-family:"Cabin",sans-serif;letter-spacing:1.5px;float:right;margin:10px;color:#eee;font-size:16px;padding:10px;border-radius:25px;width:130px;background:#222;outline:none;border:1px solid #ccc;transition:all .3s}#results-clear-btn:hover{border:1px solid #fff;background:#555;color:#fff}div.results-list-container::-webkit-scrollbar{background:rgba(0,0,0,.2);width:15px}div.results-list-container::-webkit-scrollbar-thumb{background-color:#333}div.results-list-container p{font-family:"Josefin Sans",sans-serif;width:90%;padding:5px;margin:10px auto;text-align:center;border-radius:2px;border:1px solid #ccc;text-transform:capitalize;overflow:hidden;color:#eee;background:#444;transition:background .3s,border .3s}div.results-list-container p:hover{border:1px solid #eee;background:#555}div.results-list-container p span{margin:5px;float:left;font-size:17px}.delete-result-btn{font-family:"Cabin",sans-serif;letter-spacing:1.5px;display:block;float:right;padding:5px 10px;border-radius:25px;color:#eee;background:#222;border:1px solid #ccc;outline:none;transition:background .3s,border .3s}.delete-result-btn:hover{background:#777;border:1px solid #fff}section.quiz-container{height:90vh;width:95%;margin:5vh 2.5%;position:relative;background:linear-gradient(to bottom right, rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.75)),url("https://paulalexserban.github.io/wbk--frontend-playground/assets/images/quiz-bg-original.webp") no-repeat center;box-shadow:0px 10px 25px #aaa;background-size:cover;overflow:hidden;animation:fade .8s}div.quiz-wrapper{position:absolute;width:60%;height:80vh;background:rgba(0,0,0,.65);margin:5vh 5% 5vh 3%;border-radius:3px;overflow:auto}div.quiz-wrapper::-webkit-scrollbar{background:rgba(0,0,0,.2);width:15px}div.quiz-wrapper::-webkit-scrollbar-thumb{background-color:#333}h2#asked-question-text{font-family:"Raleway",sans-serif;color:#eee;text-indent:15px;font-size:26px;width:90%;margin:30px auto 10px auto}div.instant-answer-container{width:80%;margin:auto;position:relative;opacity:0}div#instant-answer-wrapper{border-radius:5px;padding:10px;overflow:hidden}div#instant-answer-wrapper::before{content:" ";height:0;position:absolute;width:0;z-index:1;left:43px;bottom:16px;border:medium solid #fff;border-width:8px 8px 8px 0;border-color:rgba(0,0,0,0) #eee rgba(0,0,0,0) rgba(0,0,0,0)}#emotion{display:block;float:left;margin:14px 15px}div.red{border:1px solid #e62739;background-color:rgba(250,0,0,.3)}div.green{border:1px solid #4caf50;background-color:rgba(0,250,0,.2)}div#instant-answer-wrapper p{font-family:"Josefin Sans",sans-serif;color:#eee;float:left;width:80%;margin-top:8px}div#instant-answer-wrapper button{font-family:"Cabin",sans-serif;display:inline;float:right;padding:4px 10px;background:#222;outline:none;border:1px solid #eee;color:#eee;border-radius:25px;letter-spacing:1.5px;font-size:16px;transition:background .3s,color .3s,border .3s}div#instant-answer-wrapper button:hover{background:#777;color:#fff;border:1px solid #fff}div.quiz-options-wrapper{width:80%;margin:40px auto 0 auto}div.quiz-options-wrapper div{margin-bottom:20px;border:1px solid #eee;border-radius:3px;padding:20px 0;position:relative;transition:all .5s;background-color:#444;overflow:hidden;animation:fade 1s}div.quiz-options-wrapper div:hover{border:1px solid #fff;bottom:.5px;background-color:#555;cursor:pointer}div.quiz-options-wrapper div:hover>p{color:#fff}div.quiz-options-wrapper div span{display:block;padding:5px 10px;float:left;text-align:center;margin-left:20px;font-size:25px;border:1px solid #eee;color:#eee;font-weight:bold;border-radius:3px;transition:all .2s;background:rgba(65,179,163,.5)}div.quiz-options-wrapper div span::before{content:" ";height:0;position:absolute;width:0;z-index:1;left:31px;bottom:0px;border:medium solid #fff;border-width:10px 10px 10px 10px;border-color:#eee rgba(0,0,0,0) rgba(0,0,0,0) rgba(0,0,0,0);transition:all .2s}div.quiz-options-wrapper div:hover>span{border:1px solid #ddd;color:#fff;background-color:rgba(65,179,163,.7)}div.quiz-options-wrapper div:hover>span::before{border-color:#fff rgba(0,0,0,0) rgba(0,0,0,0) rgba(0,0,0,0)}div.quiz-options-wrapper div p{font-family:"Josefin Sans",sans-serif;float:left;margin-left:10px;font-size:20px;color:#eee;transition:all .2s}div.progressBar{font-family:"Cormorant Garamond",serif;background:rgba(0,0,0,.65);position:absolute;right:9%;width:300px;height:300px;margin-top:15%;display:flex;justify-content:center}div.progressBar progress{position:absolute;width:250px;height:25px;display:block;bottom:40px}progress{-webkit-appearance:none;-moz-appearance:none;appearance:none}progress[value]{-webkit-appearance:none;-moz-appearance:none;appearance:none}progress:not([value]){-webkit-appearance:none;-moz-appearance:none;appearance:none}progress::-webkit-progress-bar{background:#aaa;box-shadow:0 2px 3px rgba(0,0,0,.2) inset;border-radius:25px;border:1px solid #eee}progress::-webkit-progress-value{background-color:#444;border-radius:25px}progress::-moz-progress-bar{background-color:#444;border-radius:3px}p#progress{border:1px solid #eee;position:absolute;top:70px;padding:30px 40px;font-size:75px;font-weight:bold;color:#eee;border-radius:3px;background-color:#444}section.final-result-container{font-family:"Raleway",sans-serif;height:90vh;width:95%;margin:5vh 2.5%;position:relative;box-shadow:0px 10px 25px #aaa;background:linear-gradient(to bottom right, rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.75)),url("https://paulalexserban.github.io/wbk--frontend-playground/assets/images/final-bg-original.webp") no-repeat center;background-size:cover;border-radius:3px;animation:fade .8s}div.final-result-wrapper{height:90vh;width:90%;margin:5vh 5%;position:relative}div.final-result{width:70%;height:70vh;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);background:rgba(0,0,0,.65);border-radius:3px;overflow:auto}h2#final-score-text{width:80%;text-align:center;margin:230px auto 0 auto;font-size:25px;color:#eee}button#final-logout-btn{font-family:"Cabin",sans-serif;font-size:16px;margin:10px;padding:10px;float:right;border-radius:25px;width:110px;letter-spacing:1.5px;color:#eee;background:#222;outline:none;border:1px solid #ccc;transition:all .3s}button#final-logout-btn:hover{border:1px solid #fff;background:#555}