.reminder {
    --verr: 5;
    --berlin: rgb(120, 193, 211);
    --zagreb: darkgray;
    --sydney: rgb(57, 185, 236);
    --helsinki: rgb(126, 248, 240);
    --dublin: rgb(143, 188, 143);
    --lisabon: rgb(59, 55, 70);
    --tokio: rgb(54, 199, 243);
    --tokio22: rgb(243, 54, 70);
    --rome: rgb(10, 10, 10);
    --toronto: rgb(255, 255, 255);
}

.help_div {
    border-radius: 20px;
    background-color: var(--lisabon);
    color: var(--toronto);
    margin: 6px;
    padding: 20px;

    font-family: Arial, sans-serif;
    margin: 20px;
    line-height: 1.6;
    user-select: none;
    display: block;
}

.contact_list_holder {
    background-color: var(--tokio);
    border-radius: 12px;
    margin: 10px;
    display: block;
    height: 600px;
    margin-top: 150px;

    left: 20px;
    position: absolute;
    overflow-y: scroll;

}


.contact_list_holder::-webkit-scrollbar {
    display: none;
    scrollbar-width: none;
    /* For Chrome, Safari, and newer versions of Opera */
}

.div_dropdown {
    padding: 12px;
    background-color: var(--zagreb);
    margin: 15px;
}

.spn_dropdown {
    padding: 10px;
    cursor: pointer;
    color: var(--toronto);
}

.inside_help_div {
    margin: 30px;
}


h1 {
    color: var(--tokio);
}

h2 {
    color: var(--tokio);
}

p {
    text-align: justify;
}

.answer {
    border-radius: 20px;
    padding: 20px;
    background-color: var(--berlin);
    margin: 20px;
    cursor: pointer;
    width: auto;
    box-sizing: border-box;
}

.horizontal_slider {
    position: absolute;
    border-radius: 10px;
    background-color: var(--tokio);
    opacity: 0.5;
    margin: 20px;
    padding: 20px;
    height: 40px;
    cursor: pointer;
    width: auto;
    box-sizing: border-box;
    user-select: none;
}


.question_panel {
    user-select: none;
}

.question {
    border-radius: 20px;
    padding: 20px;
    background-color: var(--dublin);
    color: var(--toronto);
    font-size: larger;
    font-weight: bold;
    margin: 20px;
    cursor: pointer;
    width: auto;
    box-sizing: border-box;

}

.question_text {
    width: fit-content;
    width: auto;
}

.question_subject {
    width: fit-content;
    width: auto;
    padding: 10px;
    border-radius: 10px;
    background-color: var(--tokio);
}

.question_party_full_name {
    width: fit-content;
    background-color: var(--dublin);
    padding: 20px;
    margin-left: 20px;
    border-radius: 20px;
    display: none;
}

.question_icon {
    margin-left: 10px;
    position: absolute;
}

.question_perc {
    text-align: center;
    width: 60px;
    margin-left: 10px;
    border-radius: 10px;
    background-color: var(--dublin);
    color: var(--toronto);
    font-size: larger;
    font-weight: bold;
}


.slider_perc {
    text-align: center;
    width: 200px;
    margin-top: 10px;
    margin-left: 10px;
    border-radius: 10px;
    background-color: var(--dublin);
    color: var(--toronto);
    font-size: larger;
    font-weight: bold;
    position: absolute;
    display: none;
}


.party_suggestion_label {
    width: fit-content;
    margin-bottom: 10px;
    padding: 10px;
    border-radius: 10px;
    background-color: var(--tokio);
    color: var(--toronto);
    font-size: smaller;
    font-weight: bold;
}

.question_unknown_cell {
    text-align: center;
    background-color: var(--tokio);
    border-color: var(--tokio);
}

.question_answer {
    padding-left: 6px;
    text-align: left;

}

.question_answer_column {
    padding-left: 6px;
    text-align: left;
    color: var(--toronto);
    background-color: var(--zagreb);
    border-color: var(--tokio);
}

.question_known_cell_even {
    text-align: center;
    background-color: var(--dublin);
    border-color: var(--tokio);
}

.question_known_cell_odd {
    text-align: center;
    background-color: var(--berlin);
    border-color: var(--tokio);
}

.question_stats_table {
    margin: 20px;
    border-radius: 20px;
    padding: 20px;
    background-color: var(--berlin);
    border-color: var(--tokio);
}

.q_panel {
    display: flex;
    flex-direction: column;
    padding: 10px;
    border: solid;
    /* Add padding for some space inside the div */
}

.q_panel_input {
    padding: 10px;
    cursor: pointer;
    text-align: center;
    border: solid;
    border-radius: 20px;

}

.tr_generic_table {
    margin: 20px;
    padding: 20px;
    border-radius: 10px;
    cursor: pointer;
    background-color: var(--lisabon);
}

.tr_generic_table_row {
    background-color: var(--dublin);
}

.q_btn {
    padding: 10px;
    margin: 10px;
    cursor: pointer;
    background-color: var(--zagreb);
    color: var(--toronto);
    border: solid;
    border-radius: 20px;
    clip-path: stroke-box;

}

.q_btn_span {
    padding: 10px;
    cursor: pointer;
    background-color: var(--zagreb);
    color: var(--toronto);
    border: solid;
    border-radius: 20px;
    clip-path: stroke-box;
    width: fit-content;

}

.q_btn_span_desc {
    padding: 10px;
    cursor: pointer;
    color: var(--toronto);
    clip-path: stroke-box;
    width: fit-content;

}


.help_div_2 {
    border-radius: 20px;
    background-color: var(--lisabon);
    color: var(--toronto);
    margin: 6px;
    padding: 6px;

    font-family: Arial, sans-serif;
    margin: 20px;
    line-height: 1.6;
    user-select: none;
    display: flex;
}




.q_label {
    padding: 10px;
    cursor: pointer;
    color: var(--toronto);

}

.q_container {

    padding: 10px;
    cursor: pointer;
    background-color: var(--zagreb);
    color: var(--toronto);
    border: solid;
    border-radius: 20px;

    display: flexbox;
    margin: 20px;
    font-family: Arial, sans-serif;
}

.rxt_flex .q_container {
    margin: 10px;
    padding: 10px;
}

.rxt_flex .q_btn {
    margin-left: 20px;
}

.radio-button {
    margin-right: 10px;
}

.rxt_lab_inp {

    display: flex;
    padding: 4px;

}

.dep_pnl {
    display: flex;
    flex-direction: column;
}

.dep_tuple {
    display: flex;
    margin: 4px;
}


.dep_lab {
    text-align: right;
    margin-right: 4px;
    color: var(--toronto);
}

._spn_progress {
    background-color: var(--tokio);
    border-radius: 10px;
    margin-left: 4px;
    padding: 4px;
    display: none;
}


.dep_error {
    margin-left: 4px;
    color: var(--tokio);
    display: none;
}

.dep_val {
    flex-grow: 1;
    border-radius: 10px;
}


.rxt_lab {
    padding: 4px;
    display: block;
    text-align: right;
    border-radius: 4px;
    background-color: var(--dublin);
    color: var(--toronto);
    height: fit-content;
    white-space: nowrap;
    flex-shrink: 0;
}

.rxt_inp {



    cursor: pointer;
    text-align: left;
    border: solid;
    border-radius: 4px;
    width: fit-content;
    font-size: smaller;

}


.mobile_only {}

@media (min-width: 1100px) {
    .q_panel {
        padding: 10px;
        margin: 10px;
        cursor: pointer;
        width: 30%;
        border: solid;
        border-radius: 20px;
    }
}



/*
https://bloggerpilot.com/en/tools/svg-to-css/
*/




.body_question {

    background-color: var(--zagreb);


}