/* +++++++++++++++++++++++++++++++ *\
            CONTAINER
\* +++++++++++++++++++++++++++++++ */
.app_container {
    width: 100%;
    max-width: var(--max_width);
    margin-left: auto;
    margin-right: auto;
    padding: 16px;
}

@media (min-width: 768px) {
    .app_container {
        display: flex;
        flex-direction: row-reverse;
        justify-content: center;
        align-items: stretch;
        min-height: calc(100vh - 120px);

        gap: 16px;
    }
}

@media (min-width: 992px) {
    .app_container {
        gap: 32px;
        padding-bottom: 32px;
    }
}

@media (min-width: 1280px) {
    .app_container {
        align-items: stretch;
    }
}

.row-container h3 {
    width: 100%;
    margin-bottom: 0;
}

@media (min-width: 640px) {
    .row-container {
        display: flex;
        align-items: self-start;
        flex-wrap: wrap;
        gap: 0.75rem;
    }
    .row-container h3 {
        width: 100%;
        margin-bottom: -0.75rem;
    }
    .row-container > .field {
        width: calc(50% - 0.375rem);
    }
}
@media (min-width: 768px) {
    .row-container > .field {
        width: 100%;
    }
}
@media (min-width: 1280px) {
    .row-container > .field {
        width: calc(50% - 0.375rem);
    }
}