/*********************************
** NOMRALIZE
*********************************/
html{scroll-behavior:smooth;line-height:1.5;-webkit-text-size-adjust:100%}
body{margin:0;font-family:'Titillium',sans-serif;}
main{display:block}
h1{font-size:2em;margin:.67em 0}
hr{box-sizing:content-box;height:0;overflow:visible}
pre{font-family:monospace,monospace;font-size:1em}
a{background-color:transparent}
abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}
b,strong{font-weight:bold}
code,kbd,samp{font-family:monospace,monospace;font-size:1em}
small{font-size:80%}
sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}
sub{bottom:-.25em}
sup{top:-.5em}
img{border-style:none}
button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.5;margin:0}
button,input{overflow:visible}
button,select{text-transform:none}
button,[type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button;appearance:button}
button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{border-style:none;padding:0}
button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText}
fieldset{padding:.35em .75em .625em}
legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}
progress{vertical-align:baseline}
textarea{overflow:auto}
[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0}
[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}
[type="search"]{-webkit-appearance:textfield;appearance:textfield;outline-offset:-2px}
[type="search"]::-webkit-search-decoration{-webkit-appearance:none}
::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}
details{display:block}
summary{display:list-item}
template{display:none}
[hidden]{display:none}
/*********************************
** STYLE
*********************************/
:root {
	--pal1:#687EB2;
	--pal2:#506086;
	--pal3:#3d4a67;
}

html{height:100%;background-color:#f0f8ff;color:#444}
#logo{padding:20px;text-align:center}
main{max-width:580px;margin:auto}
#startContent{padding:10px;background-color:#fff;border-radius:20px;box-shadow:0px 5px 10px 0px rgba(0,0,0,.1)}
#startContent p{padding:0 15px}
#guide,#quiz,#result{padding:10px;display:none;background-color:#fff;border-radius:20px;box-shadow:0px 5px 10px 0px rgba(0,0,0,.1)}
#start{padding:20px 45px;border-radius:10px;margin:50px auto;display:block;font-size:20px}
#result{text-align:center}
#result h2{margin:20px 0}
#quiz_header{border-bottom:1px solid #eee;display:flex;justify-content:space-between;align-items:center}
#answersSection{border-top:1px solid #eee;display:flex;justify-content:space-between;align-items:center;margin-top:40px}
#quiz_header h5{margin:0;font-size:20px}
#timer{display:flex;align-items:center}
#timer h6{margin:0;font-size:20px}
#time{text-align:right;color:red;font-size:30px!important;width:50px}
#quiz #question{display:flex}
#quiz #question #questionNo{margin-right:15px}
#quiz #question h2{font-size:20px;margin:20px 0}
#quiz #optionList h4{cursor:pointer;background:#f5f5f5;padding:10px;margin:10px 0;text-align:center;border-radius:8px;}
#quiz #optionList .disabled{pointer-events:none}
#quiz #optionList .active{background:#4ea1ea;color:#fff}
h2{text-align:center;font-size:35px;margin:10px 0 0;color:var(--pal2)}
h4{font-size:20px}
button{font-weight:700;text-transform:uppercase;cursor:pointer;background-color:var(--pal1);color:#fff;padding:10px 20px;border:0;border-radius:5px;-webkit-transition:background-color .2s;transition:background-color .2s}
button:hover{background-color:var(--pal2)}
#button{text-align:center}
#button button{margin:10px}
footer{max-width:580px;text-align:center;margin:0 auto;padding:20px 10px}
@media screen and (max-width:500px){
	#logo img{width:100%}
	#startContent,#guide,#quiz,#result{border-radius:0;box-shadow:none}
	#quiz_header h5,#quiz #question h2,h4{font-size:16px}
}