.pclr-quiz {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        text-align: center;
    }
    .question {
        border: 2px solid #000;
        padding: 10px;
        margin: 10px;
        background-color: transparent;
        width: calc(100% - 24px);
        box-sizing: border-box;
        border-radius: 10px;
        position: relative;
        text-align: center;
        margin-bottom: 15px;
        display: none;
    }
    label {
        color: green;
        font-weight: bold;
        font-family: 'Open Sans', sans-serif;
        display: block;
        margin: 5px 0;
    }
    button {
        display: inline-block;
        padding: 10px 20px;
        font-size: 16px;
        margin-top: 20px;
        cursor: pointer;
    }
    #results {
        border: 2px solid #000;
        padding: 10px;
        margin: 10px;
        background-color: transparent;
        width: calc(100% - 24px);
        box-sizing: border-box;
        border-radius: 10px;
        position: relative;
        text-align: center;
        display: none; /* Hide initially */
    }
    #results::before {
    content: "\f681"; /* Unicode for the Font Awesome icon */
    font-family: "Font Awesome 5 Free"; /* Specify the Font Awesome font family */
    font-weight: 900; /* This might be needed depending on the specific version/style of Font Awesome you're using */
    font-size: 5em;
    opacity: 0.5;
    display: block; /* Will make it behave like a block element */
    margin-bottom: 10px; /* Space between the icon and the content below */
    
}
    .pclr-more {
        cursor: pointer;
    }
    .pclr-more summary {
        color: purple;
        font-weight: bold;
        font-family: 'Open Sans', sans-serif;
        text-align: center;
    }
    .radio-box {
        border: 2px solid #000;
        padding: 10px;
        margin: 10px;
        background-color: transparent;
        width: calc(100% - 24px);
        box-sizing: border-box;
        border-radius: 10px;
        text-align: center;
        cursor: pointer;
        transition: background-color 0.3s, color 0.3s;
        position: relative;
    }
    .radio-box input {
        position: absolute;
        opacity: 0;
        cursor: pointer;
        height: 100%;
        width: 100%;
        top: 0;
        left: 0;
        z-index: 2;
    }
    .radio-box input:checked + .checkmark {
        background-color: #e2e0e0;
        color: white;
    }
    .radio-box .checkmark {
        display: flex;
        justify-content: center;
        align-items: center;
        height: 100%;
        width: 100%;
        border-radius: 10px;
    }