form {
    display: flex;
    flex-direction: column;
    padding: 6px;
    border-radius: 3px;
    background: var(--color-bg-sub, #f0f0f0);
}

form > * {
    margin: 6px;
}

[type=submit] {
    color: var(--color-fg-footer, white);
    background-color: var(--color-bg-footer, hsl(0, 0%, 30%));
}

[type=submit], [type=file], [type=text], textarea {
    padding: 6px;
}

#groupbox {
    border-style: solid;
    border-width: 1px;
    border-color: var(--color-border-details, hsla(0, 0%, 30%, 0.7));
    border-radius: 3px;
    display: flex;
    flex-direction: column;
    padding: 6px;
}

.g-recaptcha {
    align-self: center;
}

.to-right {
    justify-self: end;
    align-self: end;
}

@media (min-width: 500px) {
    form {
        display: grid;
        grid-template-columns: 150px 1fr;
    }

    .zwei-col {
        display: block;
        grid-column: 1 / 3;
    }

    .g-recaptcha {
        justify-self: center;
    }
}