.quiz-container { 
    font-family: 'Times New Roman', Times, serif;
    max-width: 900px;
    margin: 0 auto
}

.quiz-container h2.question {
    font-size: 25px;
    background-color: rgb(214, 184, 243);
    padding: 16px;
    border-radius: 10px;
    font-weight: normal;
    line-height: 1.6p; 
}

.quiz-container .options {
    display: grid;
    grid-template-columns: 1fr 1fr; 
    gap: 10px; 
    margin-bottom: 20px; 
}

.quiz-container .option {
    border: none;
    padding: 24px 32px;
    font-size: 18px;
    background-color: rgb(255, 255, 255);
    color: rgb(0, 0, 0);
}

.quiz-container .button {
    cursor: pointer;
}

.quiz-container .next-button {
    background-color: white;
    color:black; 
    border:none; 
    padding: 12px 32px; 
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 3px;

}


.quiz-container .reset-button {
    background-color: white;
    color:black; 
    border:none; 
    padding: 12px 32px; 
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 3px;
}


body {
  background-color: rgb(247, 209, 235);
}

h2 {
  color: rgb(93, 34, 141);
}

h3 {
    color: darkblue
}

table, th, td {
  border:1px solid rgb(0, 0, 0);
}

ul {
  list-style: none;     
  padding: 0;
}

ul li {
  display: inline-block;   
  margin-right: 20px;      
}

ul li a {
  text-decoration: none;   
  color: black;
  font-weight: bold;  
}

ul li.aboutus a {
  border-bottom: 2px solid black;
  padding-bottom: 5px;
}  

.quiz-resultaat {
    text-align: center;
    padding: 20px;
}

.quiz-resultaat img {
    width: 250px;
    height: auto;
    border-radius: 15px;
    margin-bottom: 15px;
}

.quiz-resultaat a {
    text-decoration: none;
    color: #7a2b83;
    font-weight: bold;
    font-size: 20px;
}

.quiz-resultaat a:hover {
    color: #b312a5;
}