
.InputLabel {
    align-self:flex-start;
}

.InputLabel .required {
    color: rgb(255, 0, 170);
    font-weight: bold;
}

.InputLabel[error] {
    color: rgb(255, 0, 170);
}


.InputField {

    margin: 0;
    padding: 0;

    box-sizing: border-box;

    display:inline-flex;
    flex-direction:row;
    flex-wrap: wrap;

    align-items:inherit;

}

.InputField .addon {
    align-self: flex-start;
}

.InputField > .Caption:first-child {
    background-color: white;
    color: black;
    font-weight: bold;
    padding: 5px;
 }

.InputField INPUT, TEXTAREA {
    outline: 0;
    margin: 0;
    padding: 0.2em;

    background-color: white;

    border-top: 1px solid #b7b7b7;
    border-left: 1px solid #b7b7b7;
    border-right: 1px solid #dcdcdc;
    border-bottom: 1px solid #dcdcdc;
}

.InputField.TextArea TEXTAREA {
    resize: vertical;
}

.InputField SELECT {
    padding: 0.2em;
}

.InputField .FieldElements {
    display: inline-flex;
    flex-direction: row;
    flex-wrap: wrap;

    align-items:center;

    gap: 0.5em;
}

.InputField .DataIteratorItem {
    display:inline-flex;
    flex-direction: row;
    flex-wrap: wrap;

    align-items: baseline;

    gap:0.2em;
}

.InputField .DataIteratorItem.CheckItem, .DataIteratorItem.RadioItem {
    align-items: center;
}

.InputField INPUT[type='checkbox'], INPUT[type='radio'] {
    width: 1.2em;
    height: 1.2em;
}