#v-pills-home {
    display: flex;
    flex-direction: column;
}

.dashboard-container {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5em;
    justify-content: space-around;
    align-content:space-around;
    padding: 0.7em;
    flex-grow: 1;
}

.dashboard-card {
    border: thin solid gray;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background-clip: border-box;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 12px 0 rgba(0, 0, 0, 0.14);
    /* width: calc( ( 100% - 1.4em - 3em) / 3); */
    flex-basis: 26%;
}

/* one item */
.dashboard-card:first-child:nth-last-child(1) {
    /* -or- li:only-child { */
    flex-basis: 50%;
}

/* four items */
.dashboard-card:first-child:nth-last-child(4),
.dashboard-card:first-child:nth-last-child(4) ~ .dashboard-card,
.dashboard-card:first-child:nth-last-child(3),
.dashboard-card:first-child:nth-last-child(3) ~ .dashboard-card,
.dashboard-card:first-child:nth-last-child(2),
.dashboard-card:first-child:nth-last-child(2) ~ .dashboard-card
{
    flex-basis: 34%;
}

@media (max-width: 992px) {
    .dashboard-card {
        flex-basis: 35% !important;
    }
}

@media (max-width: 574px) {
    .dashboard-card {
        flex-basis: 100% !important;
        flex: 1;
    }
}

.dashboard-card .dashboard-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.5em;
    padding: 0.5em 0.6em;
    color: var(--gray-dark);
    background-color: #f4f4f4;
    background-clip: border-box;
    white-space: nowrap;
    border-top: 0;
}

.dashboard-card .dashboard-head .dashboard-title {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 1.2em;
}

.dashboard-card .dashboard-body {
    flex-grow: 1;
    border-top: thin solid var(--gray);
    padding: 1em;
    display: flex;
    flex-direction: row;
    gap: 0.3em;
    justify-content: center;
    align-content: baseline;
    align-items: center;
    font-size: 4em;
}

.dashboard-card .dashboard-body.dashboard-body-small {
    font-size: 1.5em;
}

.dashboard-card .dashboard-body .svg-container {
    max-height: 2em;
    vertical-align: top;
}

.dashboard-card .dashboard-body .svg-container .svg-content {
    width: auto;
}
