@import"https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@300;400;500&family=Permanent+Marker&display=swap";:root{--main: #000;--highlight: #0678a0;--background-dark: #aaa;--background-light:#fff;--text_light: #FFF;--header-text_light: #411470;--primary_dark: #411470;--primary-font: "Josefin Sans", sans-serif;--header-font: "Permanent Marker", cursive}body{padding:0;margin:0;background-color:var(--background-light );display:flex;flex-direction:column;align-items:center;font-family:Josefin Sans,sans-serif;font-weight:300;font-size:1.5em}.title{font-size:2em;color:var(--header-text_light);margin-top:0}.title a{text-decoration:none;color:var(--primary_dark)}.title a:visited{color:var(--primary_dark)}h1{font-size:2em;color:var(--header-text_light);font-family:var(--header-font);margin-top:0;margin-left:1em}h2{font-size:1.5em;font-family:var(--header-font)}.wrong{color:red}.isCorrect{color:green}header{background-color:var(--background-light);color:var(--header-text_light);padding:0;margin:0;width:100%;font-family:Josefin Sans,sans-serif;font-weight:500;display:flex;justify-content:space-between}nav{color:var(--text-light);height:2em;margin-top:.5em;margin-right:2em}nav a{color:var(--text-light)}main{max-width:960px;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:1em}.commentary{font-family:var(--header-font)}footer{height:20px}question{width:100%}.ui-button{background-color:var(--primary_dark);color:var(--text_light);font-size:1rem;font-weight:400;padding:.5em;border-radius:10px;border:none}.answerButtons{display:flex;justify-content:space-between;flex-wrap:wrap}.answerButtons button{background-color:var(--primary_dark);color:var(--text_light);font-size:1rem;font-weight:400;padding:.5em;border-radius:10px;border:none}.answerButtons button:hover{box-shadow:3px 3px 2px 1px #aaa;cursor:pointer}.nextPrevButtons{display:flex;gap:2em;margin-top:2em}.nextPrevButtons button{background-color:var(--primary_dark);color:var(--text_light);padding:.5em;border-radius:10px}.nextPrevButtons button:hover{box-shadow:3px 3px 2px 1px #aaa;cursor:pointer}@media (max-width: 500px){quiz{margin-left:1em;margin-right:1em}.answerButtons button{flex-basis:45%;gap:5%;margin-bottom:1em}}