#cardContainer {
    background-color: var(--surface-3);
    color: var(--text-2);
    border-radius: var(--theme-radius);
    /*padding-inline: 1rem;*/
    border: var(--border-size-2) solid rgba(var(--theme-contrast-value), 0.025);
    width: 100%;
    padding-top:10px;
    height:2.5rem;
}

/*#cardExists {
    padding: 0.55rem 0.75rem;
    box-shadow: 0 1px 3px 0px rgba(51, 39, 36, 0.3);
    border-left: 5px solid #B81700 !important;
    background: #fefefe;
}*/

.people .add-person, .people .remove-person {
    text-align: center;
    -moz-transition: 0.5s ease;
    -o-transition: 0.5s ease;
    -webkit-transition: 0.5s ease;
    transition: 0.5s ease;
}

    .people .add-person .add-person-button, .people .remove-person .remove-person-button {
        display: flex;
        background: #fefefe;
        text-align: center;
        color: #4d4d4d;
        font-weight: bold;
        -moz-transition: 0.5s ease;
        -o-transition: 0.5s ease;
        -webkit-transition: 0.5s ease;
        transition: 0.5s ease;
    }
        .people .add-person .add-person-button {
            color:var(--brand-3);
        }

        .people .add-person .add-person-button:hover  {
            box-shadow: 0 0px 5px 2px rgba(51, 39, 36, 0.1);
            color: var(--blue-4);
        }

    .people .remove-person .remove-person-button:hover {
        color:var(--red-3);
    }

    .people .add-person .add-person-button i,
    .people .remove-person .remove-person-button i {
        font-size: 4rem;
    }

    .people .add-person .add-person-full  {
        display: none;
    }

        .people .add-person.add-person-full .add-person-button,
        .people .remove-person .remove-person-full .remove-person-button {
            display: none;
        }

        .people .add-person.add-person-full .add-person-full  {
            cursor: default;
            background: #fefefe;
            margin: 1rem;
            display: flex;
            justify-content: center;
            flex-direction: column;
            flex: 1;
            min-height: 315px;
            text-align: center;
            tab-size font-weight: bold;
        }

            .people .add-person.add-person-full .add-person-full i{
                font-size: 80px;
            }

.grid-x {
    display: flex;
    flex-flow: row wrap;
}

.cell {
    background: var(--surface-3);
    box-shadow: 0 .5rem 1rem rgba(0,0,0,.15) !important;
    margin-bottom: 2em;
    padding: 20px 40px 0;
    text-align: center;
    font-weight: bold;
    flex: 0 0 auto;
    min-height: 0px;
    min-width: 0px;
    width: 100%;
}
.summary .cell:last-child{
    background:var(--blue-3);
    color:var(--surface-1);
}
    .cell.auto {
        flex: 1 1 0px;
    }

    .cell.shrink {
        flex: 0 0 auto;
    }

.grid-x > .auto {
    width: auto;
}

.grid-x > .shrink {
    width: auto;
}

.grid-x > .small-1 {
    width: 8.33333%;
}

.grid-x > .small-2 {
    width: 16.66667%;
}

.grid-x > .small-3 {
    width: 25%;
}

.grid-x > .small-4 {
    width: 33.33333%;
}

@media print, screen and (min-width: 50em) {
    .grid-x > .medium-auto {
        flex: 1 1 0px;
        width: auto;
    }

    .grid-x > .medium-shrink {
        flex: 0 0 auto;
        width: auto;
    }

    .grid-x > .medium-1 {
        width: 8.33333%;
    }

    .grid-x > .medium-2 {
        width: 16.66667%;
    }

    .grid-x > .medium-3 {
        width: 25%;
    }

    .grid-x > .medium-4 {
        width: 33.33333%;
    }

    .grid-x > .medium-5 {
        width: 41.66667%;
    }

    .grid-x > .medium-6 {
        width: 50%;
    }

    .grid-x > .medium-7 {
        width: 58.33333%;
    }

    .grid-x > .medium-8 {
        width: 66.66667%;
    }

    .grid-x > .medium-9 {
        width: 75%;
    }

    .grid-x > .medium-10 {
        width: 83.33333%;
    }

    .grid-x > .medium-11 {
        width: 91.66667%;
    }

    .grid-x > .medium-12 {
        width: 100%;
    }
}

@media print, screen and (min-width: 75em) {
    .grid-x > .large-auto {
        flex: 1 1 0px;
        width: auto;
    }

    .grid-x > .large-shrink {
        flex: 0 0 auto;
        width: auto;
    }

    .grid-x > .large-1 {
        width: 8.33333%;
    }

    .grid-x > .large-2 {
        width: 16.66667%;
    }

    .grid-x > .large-3 {
        width: 25%;
    }

    .grid-x > .large-4 {
        width: 33.33333%;
    }

    .grid-x > .large-5 {
        width: 41.66667%;
    }

    .grid-x > .large-6 {
        width: 50%;
    }

    .grid-x > .large-7 {
        width: 58.33333%;
    }

    .grid-x > .large-8 {
        width: 66.66667%;
    }

    .grid-x > .large-9 {
        width: 75%;
    }

    .grid-x > .large-10 {
        width: 83.33333%;
    }

    .grid-x > .large-11 {
        width: 91.66667%;
    }

    .grid-x > .large-12 {
        width: 100%;
    }
}

.grid-margin-x:not(.grid-x) > .cell {
    width: auto;
}

.grid-margin-y:not(.grid-y) > .cell {
    height: auto;
}

.grid-margin-x {
    margin-left: -0.5rem;
    margin-right: -0.5rem;
}

@media print, screen and (min-width: 50em) {
    .grid-margin-x {
        margin-left: -0.75rem;
        margin-right: -0.75rem;
    }
}

.grid-margin-x > .cell {
    width: calc(100% - 1rem);
    margin-left: 0.5rem;
    margin-right: 0.5rem;
}

@media print, screen and (min-width: 50em) {
    .grid-margin-x > .cell {
        width: calc(100% - 1.5rem);
        margin-left: 0.75rem;
        margin-right: 0.75rem;
    }
}

.grid-margin-x > .auto {
    width: auto;
}

.grid-margin-x > .shrink {
    width: auto;
}

.grid-margin-x > .small-1 {
    width: calc(8.33333% - 1rem);
}

.grid-margin-x > .small-2 {
    width: calc(16.66667% - 1rem);
}

.grid-margin-x > .small-3 {
    width: calc(25% - 1rem);
}

.grid-margin-x > .small-4 {
    width: calc(33.33333% - 1rem);
}

.grid-margin-x > .small-5 {
    width: calc(41.66667% - 1rem);
}

.grid-margin-x > .small-6 {
    width: calc(50% - 1rem);
}

.grid-margin-x > .small-7 {
    width: calc(58.33333% - 1rem);
}

.grid-margin-x > .small-8 {
    width: calc(66.66667% - 1rem);
}

.grid-margin-x > .small-9 {
    width: calc(75% - 1rem);
}

.grid-margin-x > .small-10 {
    width: calc(83.33333% - 1rem);
}

.grid-margin-x > .small-11 {
    width: calc(91.66667% - 1rem);
}

.grid-margin-x > .small-12 {
    width: calc(100% - 1rem);
}

@media print, screen and (min-width: 50em) {
    .grid-margin-x > .auto {
        width: auto;
    }

    .grid-margin-x > .shrink {
        width: auto;
    }

    .grid-margin-x > .small-1 {
        width: calc(8.33333% - 1.5rem);
    }

    .grid-margin-x > .small-2 {
        width: calc(16.66667% - 1.5rem);
    }

    .grid-margin-x > .small-3 {
        width: calc(25% - 1.5rem);
    }

    .grid-margin-x > .small-4 {
        width: calc(33.33333% - 1.5rem);
    }

    .grid-margin-x > .small-5 {
        width: calc(41.66667% - 1.5rem);
    }

    .grid-margin-x > .small-6 {
        width: calc(50% - 1.5rem);
    }

    .grid-margin-x > .small-7 {
        width: calc(58.33333% - 1.5rem);
    }

    .grid-margin-x > .small-8 {
        width: calc(66.66667% - 1.5rem);
    }

    .grid-margin-x > .small-9 {
        width: calc(75% - 1.5rem);
    }

    .grid-margin-x > .small-10 {
        width: calc(83.33333% - 1.5rem);
    }

    .grid-margin-x > .small-11 {
        width: calc(91.66667% - 1.5rem);
    }

    .grid-margin-x > .small-12 {
        width: calc(100% - 1.5rem);
    }

    .grid-margin-x > .medium-auto {
        width: auto;
    }

    .grid-margin-x > .medium-shrink {
        width: auto;
    }

    .grid-margin-x > .medium-1 {
        width: calc(8.33333% - 1.5rem);
    }

    .grid-margin-x > .medium-2 {
        width: calc(16.66667% - 1.5rem);
    }

    .grid-margin-x > .medium-3 {
        width: calc(25% - 1.5rem);
    }

    .grid-margin-x > .medium-4 {
        width: calc(33.33333% - 1.5rem);
    }

    .grid-margin-x > .medium-5 {
        width: calc(41.66667% - 1.5rem);
    }

    .grid-margin-x > .medium-6 {
        width: calc(50% - 1.5rem);
    }

    .grid-margin-x > .medium-7 {
        width: calc(58.33333% - 1.5rem);
    }

    .grid-margin-x > .medium-8 {
        width: calc(66.66667% - 1.5rem);
    }

    .grid-margin-x > .medium-9 {
        width: calc(75% - 1.5rem);
    }

    .grid-margin-x > .medium-10 {
        width: calc(83.33333% - 1.5rem);
    }

    .grid-margin-x > .medium-11 {
        width: calc(91.66667% - 1.5rem);
    }

    .grid-margin-x > .medium-12 {
        width: calc(100% - 1.5rem);
    }
}

@media print, screen and (min-width: 75em) {
    .grid-margin-x > .large-auto {
        width: auto;
    }

    .grid-margin-x > .large-shrink {
        width: auto;
    }

    .grid-margin-x > .large-1 {
        width: calc(8.33333% - 1.5rem);
    }

    .grid-margin-x > .large-2 {
        width: calc(16.66667% - 1.5rem);
    }

    .grid-margin-x > .large-3 {
        width: calc(25% - 1.5rem);
    }

    .grid-margin-x > .large-4 {
        width: calc(33.33333% - 1.5rem);
    }

    .grid-margin-x > .large-5 {
        width: calc(41.66667% - 1.5rem);
    }

    .grid-margin-x > .large-6 {
        width: calc(50% - 1.5rem);
    }

    .grid-margin-x > .large-7 {
        width: calc(58.33333% - 1.5rem);
    }

    .grid-margin-x > .large-8 {
        width: calc(66.66667% - 1.5rem);
    }

    .grid-margin-x > .large-9 {
        width: calc(75% - 1.5rem);
    }

    .grid-margin-x > .large-10 {
        width: calc(83.33333% - 1.5rem);
    }

    .grid-margin-x > .large-11 {
        width: calc(91.66667% - 1.5rem);
    }

    .grid-margin-x > .large-12 {
        width: calc(100% - 1.5rem);
    }
}

.grid-padding-x .grid-padding-x {
    margin-right: -0.5rem;
    margin-left: -0.5rem;
}

@media print, screen and (min-width: 50em) {
    .grid-padding-x .grid-padding-x {
        margin-right: -0.75rem;
        margin-left: -0.75rem;
    }
}