body {
    min-width: 100%;
}

#container {
height : 100%;
--s: 90px; /* control the size*/
  --_g: radial-gradient(#0000 70%,#1a2030 71%);
  background:
    var(--_g),var(--_g) calc(var(--s)/2) calc(var(--s)/2),
    conic-gradient(#0a7e06 25%,#fdebad 0 50%,#d33434 0 75%,#b5d999 0);
  background-size: var(--s) var(--s); 
}

#quizBoard{
background-color:rgba(4, 66, 148, 0.61);
height: 100% 100%;
width: 75%;
padding-top: 10%;
margin:0% 10%;
text-transform: uppercase;
font-family: Georgia, 'Times New Roman', Times, serif;
padding-bottom: 1%;
font-size: 1.5em;
text-align: center;
backdrop-filter: blur(20px);
box-shadow: rgba(0, 0, 0, 0.17) 0px -23px 25px 0px inset, rgba(0, 0, 0, 0.15) 0px -36px 30px 0px inset, rgba(0, 0, 0, 0.1) 0px -79px 40px 0px inset, rgba(0, 0, 0, 0.06) 0px 2px 1px, rgba(0, 0, 0, 0.09) 0px 4px 2px, rgba(0, 0, 0, 0.09) 0px 8px 4px, rgba(0, 0, 0, 0.09) 0px 16px 8px, rgba(0, 0, 0, 0.09) 0px 32px 16px;
}

#quizCategory{
    font-size: 2em;
    width:fit-content;
}

.boxed{
    background-color: rgb(255, 255, 255);
    text-decoration-color: black;
    font-size: 1.5em;
}

#questionContainer{
margin-top: 10px;
margin-bottom: 40px;
font-size: 1.5em;
}

#questionChoices > input[type = "radio"]{
    font-size: 2em;
    margin-top: 5px;
    margin-bottom: 50px;
    margin-right: 10px;
}

#questionChoices {
    background-color: rgb(68, 0, 255);
    padding-top: 5%;
    padding-bottom: 5%;

}

#questionChoices >label::after {
    content:"\a";
    white-space: pre;

}

#backing{
    position: relative;
    margin: 0 auto;
    margin-right: 50%;
    margin-top: 10%;
    margin-bottom: 5%;
    padding-left: 5%;
    padding-top: 5%;
    padding-bottom: 5%;
    text-align: left;
}
#container.button{
    background-color: #4CAF50; /* Green */
    border: none;
    color: white;
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
}