.questions-container
{
    background-color: var(--gray-3);
    padding: 2em;
    border-radius: 5px;
}

.expandable
{
    background-color: var(--gray-5);
    border-radius: 5px;
    box-shadow: 0px 0px 10px rgba(0,0,0,0.2);

    h2 {
        position: relative;
        margin:0;
        color: white;
        padding: 0.5em;
        font-size: 0.8em;
        user-select: none;
        font-weight: 100;
        font-family:Arial, Helvetica, sans-serif;
    }

    h2::before {
        content: '▶️';
        color: gray;
        font-size: 1.2em;
        right: 0px;
        margin-right: 1em;
    }

    h2.expanded ~ span {
        display: block;
    }

    h2.expanded::before {
        content: '🔽';
    }

    span {
        margin:0;
        display: none;
        color: white;
        padding: 1em;
        font-size: 0.8em;
        font-family: Arial, Helvetica, sans-serif;
    }
}

.expandable + .expandable {
    margin-top: 1em;
}