.bm__spenda {
    display: flex;
    padding: 1rem;
    width: 100%;
}

.bm__spenda__chart_container {
    display: flex;
    padding: 0;
}

.bm__spenda__legend_container {
    display: flex;
    flex-direction: column;
    padding: 1rem 1.5rem;
    align-self: flex-start;
    width: 100%;
}

.bm__spenda__legend_container__title {
    display: flex;
    flex-direction: column;
    padding-bottom: 3rem;
}

.bm__spenda__legend_container__title h1 {
    font-family: var(--form-fieldlabel-font-family);
    font-style: normal;
    font-weight: 500;
    font-size: 22px;
    line-height: 22px;
    color: var(--form-fieldvalue-textcolor);
    padding-bottom: 1rem;
}

.bm__spenda__legend_container__title h2 {
    font-family: var(--form-fieldlabel-font-family);
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 16px;
    color: var(--form-fieldvalue-textcolor);
    padding-bottom: 1rem;
}

.bm__spenda__legend_container__title p {
    font-family: var(--form-fieldlabel-font-family);
    font-style: normal;
    font-weight: 600;
    font-size: 26px;
    line-height: 26px;
    color: var(--form-fieldvalue-textcolor);
}

.bm__spenda__legend_container table {
    display: flex;
}

.bm__spenda__legend_container td {
    padding-bottom: 0.4rem;
    padding-right: 0rem;
    flex-direction: row;
}

.bm__spenda__legend_container td:last-child {
    width: 1%;
    white-space: nowrap;
}

.bm__spenda__legend__label {
    display: flex;
    width: 100%;
}

.bm__spenda__card {
    display: flex;
    width: 450px;
    padding: 0rem;
}

.bm__spenda__legend_container label {
    display: flex;
    font-family: var(--form-fieldlabel-font-family);
    font-style: normal;
    font-weight: 500;
    font-size: 22px;
    line-height: 22px;
    color: var(--form-fieldlabel-textcolor);
    width: 100%;
    cursor: pointer;

    /* Prevent selection */
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.bm__spenda__legend_container span {
    font-family: var(--form-fieldlabel-font-family);
    font-style: normal;
    font-weight: 500;
    font-size: 22px;
    line-height: 22px;
    color: var(--form-fieldvalue-textcolor);
    margin-right: 1rem;
}

.bm__spenda__legend_container img {
    cursor: pointer;
    width: 14px;
    height: 14px;
}

.bm__spenda__chart {
    display: flex;
    width: 300px;
    height: 300px;
    
    padding: 1rem;
    margin-left: auto;
    margin-right: auto;
}

.bm__spenda__head_row {
    display: flex;
    padding: 0.4rem;
}

.bm__spenda__head_row span {
    width: 100%;
}

.bm__spenda__legend-bullet {
    display: flex;
    width: 0.8rem;
    height: 0.8rem;
    border-radius: 2px;
    margin-top: -10px;
    margin-right: 4px;
}

.bm__spenda__head__icons {
    display: flex;
    margin-top: 5px;
}

.bm__spenda__head__icons img {
    margin-left: 1rem;
}

.bm__spenda__sub-spenda_container {
    display: none;
    margin-bottom: 1rem;
    width: 100%;
    background-color: var(--spenda-subhead-panel-bg);
    border: 1px solid var(--spenda-subhead-panel-bordercolor);
    border-radius: 4px;
}

.bm__spenda__sub-spenda_container tr {
    width: 100%;
}

.bm__spenda__sub-spenda_container td {
    padding-top: 0.2rem;
    padding-bottom: 0.2rem;
}

.bm__spenda__sub-spenda_container td:last-child {
    width: 1%;
    white-space: nowrap;
}

.bm__spenda__sub-spenda_container td:last-child span {
    position: relative;
    float: right;
}

.bm__spenda__sub-spenda_container label {
    display: flex;
    font-family: var(--form-fieldlabel-font-family);
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    line-height: 18px;
    color: var(--form-fieldlabel-textcolor);
    min-width: 200px;
}

.bm__spenda__sub-spenda_container span {
    font-family: var(--form-fieldlabel-font-family);
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    line-height: 18px;
    color: var(--form-fieldvalue-textcolor);
}

.bm__spenda__editform__subhead label {
    margin-left: 2rem;
}


 /**
 * Media: Mobile Phone
 */
 @media screen and (max-width: 550px) {
 
    .bm__spenda {
        flex-direction: column;
    }

    .bm__spenda__head__icons img {
        margin-left: 2rem;
    }

    .bm__spenda__legend_container__title {
        margin: auto;
    }

    .bm__spenda__legend_container__title h1,
    .bm__spenda__legend_container__title h2,
    .bm__spenda__legend_container__title p {
        text-align: center;
    }

.bm__spenda__legend_container {
    padding: 1rem 1rem;
}

.bm__spenda__editform__subhead input[type="number"] {
    margin-left: 2rem;
}

.bm__spenda__legend_container table {
    display: flex;
    flex-direction: column;
}

.bm__spenda__card {
    flex-direction: column;
    width: 100%;
}

.bm__spenda__legend__label  {
    padding-bottom: 0.5rem;
}

.bm__spenda__legend-bullet {
    margin-top: -27px;
}


}