body {
    width: 100%;
    height: 100%;
    margin: 0;
    position: absolute;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: stretch;
    padding: 0 0 !important;
}
header {
    flex: 0 0 0;
}

.main {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    overflow: hidden;
}
.header {
    flex: 0 0 40px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
}
.title {
    margin: 0px 10px;
    font-size: 20pt;
    color: var(--vscode-panelTitle-activeForeground);
}
.footer {
    flex: 0 0 60px;
    display:flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
}
.wizard {
    flex: 1 1 auto;
    display:flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: stretch;
}
.formlinecenter {
    margin: 0px 10px;
    flex: 0 1 32px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
}
.formcaptionct {
    padding: 0 5px;
}
.formfieldct {
    padding: 0 5px;
}
.formline {
    margin: 0px 10px;
    flex: 0 1 32px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: stretch;
}
.formheader {
    flex: 1 1 auto;   
}
.formcaption {
    flex: 0 0 200px;
}
.formfield {
    flex: 1 1 auto;
    display: flex;
    flex-direction: row;
    align-items: stretch;
    justify-content: stretch;
}

.formfield .fulltextcont {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    justify-content: stretch;
}
.formfield .fulltextcont input {
    flex: 1 1 auto;
    border: 0px solid #000 !important;
}
.formfield .fulltextcont input:focus, .formfield .fulltextcont input:active {
    outline: none !important;
}
.formfield .fulltextcont .inputadd {
    flex: 0 0 auto;
    color: var(--vscode-list-inactiveSelectionForeground)
}
.fulltextcont:focus-within {
    border: 1px solid var(--vscode-focusBorder);
}

.formfield .fulltext, .formfield .fullopt, .formfield .fulltextcont {
    flex: 1 1 auto;
}
.formfield .fixedtext, .formfield .fixedopt {
    flex: 0 1 200px;
}

.multiselect {
    flex: 1 1 auto;
    margin: 10px;
    display: flex;
    flex-direction: row;
    justify-content: stretch;
}
.multiselsrc,  .multiseldest {
    flex: 1 1 0;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: stretch;
}
.multiselbtns {
    flex: 0 0 80px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.mselbtn {
    flex: 0 0 60px;
    width: 70px;
    margin: 5px 5px;
}
.mselfilter {
    flex: 0 0 auto;
    margin: 0 0 3px 0;
}
.msellist {
    flex: 1 1 auto;
    font-family: var(--vscode-font-family);
    font-weight: normal;
}
.msellist:focus option:checked:after {
    color: var(--vscode-list-activeSelectionForeground) !important;
}
.msellist option:checked:after {
    color: var(--vscode-list-inactiveSelectionForeground);
}
.msellist option:after {
    font-size: 0.8em;
    color: var(--vscode-descriptionForeground);
    content: ' ' attr(data-desc);
}
.mselcaption {
    flex: 0 0 26px;
}
.mselcaptionadv {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    justify-content: center;
}

.mselcaptionadv .mselcapmain {
    flex: 1 1 auto;
}
.mselcaptionadv .mselcaptb {
    flex: 0 0 auto;
    margin: 0px 2px 4px 2px;    
}
.mseltbbtn, .mseltbbtnsel {
    width: 64px;
    border: 0px solid var(--vscode-panel-border);
    font-size: var(--font-size);
    font-weight: var(--font-weight);    
    font-family: var(--font-family);
}
.mseltbbtn {
    background-color: var(--vscode-list-inactiveSelectionBackground) !important;
    color: var(--vscode-list-inactiveSelectionForeground) !important;
}
.mseltbbtnsel {
    background-color: var(--vscode-list-activeSelectionBackground) !important;
    color: var(--vscode-list-activeSelectionForeground) !important;
}
.mseltbbtn:hover, .mseltbbtnsel:hover {
    background-color: var(--vscode-button-hoverBackground) !important;
    color: var(--vscode-button-foreground) !important;
}
.mseltbbtn, .mselbtn, .button {
    background-color: var(--vscode-button-background);
    color: var(--vscode-button-foreground);
    border: 0px solid var(--vscode-panel-border);
    font-size: var(--font-size);
    font-weight: var(--font-weight);    
    font-family: var(--font-family);
}
.mseltbbtn:hover, .mselbtn:hover, .button:hover {
    background-color: var(--vscode-button-hoverBackground);
}
.button {
    margin: 3px 6px 3px 0px;
    width: 80px;
    padding:5px;
}
.button:disabled {
    background-color: var(--vscode-tab-inactiveBackground);
    color: var(--vscode-tab-inactiveForeground);
}


input, select, .fulltextcont {
    background: var(--vscode-input-background);
    border: 1px solid var(--vscode-panel-border);
    color: var(--vscode-input-foreground);
}
input:focus, select:focus, div:focus {
    outline-color: var(--vscode-focusBorder) !important;
}
button:focus {
    outline-style: double;
    outline-color: var(--vscode-focusBorder) !important;
}
