form {
    /* background-color: red; */
    font-family: tosailc, sans-serif;
    line-height: var(--lineHShortenCom) !important;
    font-size: var(--size50);
}

form textarea:focus, form input:focus {
    /* background-color: var(--color3); */
}

form legend {
    font-size: var(--size50);
    width: 100%;
    border-top: 1px solid var(--color1);
    text-align: center;
    text-transform: uppercase;
}

form .description {
    font-size: var(--size19);
    font-family: tosail, sans-serif;
    line-height: var(--lineHShortenReg) !important;
    /* position: absolute; */
    /* bottom: 0px; */
    background-color: var(--color1);
    color: var(--color3);
    margin: var(--m) 0px var(--m) 0px;
    padding: var(--m);
    border-radius: var(--m);
    order: 10;
}

form .maxColHeightSpacer {
    display: none;
}

form fieldset>.InputfieldContent {
    width: 100%;
}

form .Inputfields>div.Inputfield {
    width: 100%;
    display: flex;
    gap: calc(var(--m));
    /* display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-column-gap: var(--m);
    grid-row-gap: var(--m); */
    /* background-color: red; */
    /* margin-bottom: var(--m); */
    border-top: 1px solid var(--color1);
}


form .Inputfields>div.Inputfield label {
    margin-top: 0.2em;
    width: var(--column3);
    /* background-color: blue; */
}

form .Inputfields>div.Inputfield .InputfieldContent {
    width: var(--column3);
    /* background-color: blue; */
}

form .Inputfield>.InputfieldContent {
    position: relative;
    display: flex;
    flex-direction: column;
    /* background-color: yellow; */
}

/* form>.Inputfields {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    grid-column-gap: var(--m);
    grid-row-gap: var(--m);
}
form>.Inputfields fieldset {
    grid-column: span 6;
} */
form input,
form textarea,
form select,
form button {
    width: 100%;
    color: var(--color1);
    /* padding: var(--m); */
    font-family: inherit;
    resize: none;
    font-size: inherit;
    border: none;
    /* background-color: var(--color2); */
    outline: none;
    padding: 0px;
    margin: 0px;
    /* background-color: none; */
    line-height: 1em;
    vertical-align: top;
    /* display: block; */
    background: transparent;
}

form input[type=text] {
    /* margin-top: -0.2em; */
    /* A checker */
}


form textarea {
    height: calc(var(--lineH) * 4.3);
    padding-top: 0.2em;
}

textarea.oneLine {
    height: auto !important;
}

.FormBuilderErrors {
    display: none;
}
form input:focus,
form textarea:focus,
form select:focus {
    /* outline: 1px solid var(--color1); */
    /* background-color: var(--color3); */
}
.InputfieldStateError input, .InputfieldStateError textarea, .InputfieldStateError select {
    outline: 1px solid red;
}
.input-error {
    font-size: var(--size19);
    font-family: tosail, sans-serif;
    /* position: absolute; */
    bottom: 0px;
    background-color: red;
    color: var(--color3);
    margin: var(--m) 0px var(--m) 0px;
    padding: var(--m);
    border-radius: var(--m);
    order: 10;
    color: var(--color4);
}

form .InputfieldPage,
form .Inputfield {
    width: 100% !important;
}

form .asmListItem {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
}

form .InputfieldSubmit .InputfieldContent {
    width: var(--column3) !important;
}

form button {
    background-color: var(--color1);
    color: var(--color3);
    cursor: pointer;
    border-radius: var(--m);
    margin-top: var(--m);
    /* defiend in main.css like flag ! */
}

/* form .pw-no-select {
    display: none;
} */

form input[type=checkbox] {
    width: 1em;
    height: 1em;
    /* height: var(--lineH);
    margin-bottom: 0.2em; */
}
form .InputfieldCheckboxesStacked label {
    display: flex;
    flex-direction: row;
}

form .InputfieldSubmit {
    /* padding-top: var(--lineGap); */
    justify-content: right;
}





@media screen and (orientation: portrait) {
    form .Inputfields>div.Inputfield label {
        width: var(--column4);
    }

    form .Inputfields>div.Inputfield .InputfieldContent {
        width: var(--column4);
    }

    form .InputfieldSubmit .InputfieldContent {
        width: var(--column8) !important;
    }
}