/***********************
START: OLD GESUNDHEITSFRAGEN

STILL NEEDED FOR KOMPOSIT FS
************************/

/* Fuer die Hinweistexte */

.gfCol1Span2 {
    display:inline-block;

    text-align: left;
    vertical-align: middle;

    width: 888px;
    line-height: 16px;

    padding-left: 5px;
    padding-top: 5px;
    padding-bottom: 5px;
}

/* Fuer die Standard Fragen und Antwortradiobuttons */

.gfCol1 {
    display:inline-block;

    text-align: left;
    vertical-align: middle;

    width: 754px;
    line-height: 16px;

    padding-left: 5px;
    padding-top: 5px;
    padding-bottom: 5px;
}

.gfCol2 {
    display:inline-block;

    text-align: right;
    vertical-align: middle;
    width: 144px;

    padding-left:4px;
/*     padding-right:0.5%; */
    padding-top: 5px;
    padding-bottom: 5px;
}

/* Fuer 4-spaltige Text-Label Kombinationen */

.gfLblCol1, .gfCompCol2, .gfLblCol3, .gfCompCol4 {
    display:inline-block;

    vertical-align: middle;

    line-height: 14px;

/*     padding-left:0.5%; */
}

.gfLblCol1 {
    width: 200px;
}

.gfCompCol2, .gfLblCol3, .gfCompCol4 {
    width: 229px;
}

.gfLblCol1, .gfLblCol3 {
    text-align: right;
}

.gfCompCol4 {
/*     padding-right:0.5%; */
}


/*TODO now up to 6 columns*/


/* Fuer 4-spaltige Tabellen und Fragebögen */

.gfTab4Col1Head, .gfTab4Col2Head, .gfTab4Col3Head, .gfTab4Col4Head, .gfTab4Col5Head {
    display:inline-block;
    vertical-align: bottom;
    line-height: 14px;
    padding-left: 4px;
    word-spacing: 0; /*reset wordspacing from parent*/
}

.gfTab4Col1Head {
    text-align: right;
    width: 202px;
}

.gfTab4Col2Head, .gfTab4Col3Head, .gfTab4Col4Head, .gfTab4Col5Head {
    width: 172px;
}

.gfTab4Col5Head {
/*     padding-right:0.5%; */
}

.gfTab4Col1, .gfTab4Col2, .gfTab4Col3, .gfTab4Col4, .gfTab4Col5 {
    display:inline-block;
    vertical-align: middle;
    padding-left: 4px;
    /* padding-top: 5px; */
}

.gfTab4Col1 {
    text-align: right;
    width: 202px;
}

.gfTab4Col2, .gfTab4Col3, .gfTab4Col4, .gfTab4Col5 {
    width: 172px;
}

.gfTab4Col5 {
/*     padding-right:0.5%; */
}


.gfTab4Col2Span4 {
    display:inline-block;

    vertical-align: top;

    width: 687px;

    padding-left: 2px;
/*     padding-right:0.5%; */
    padding-top: 5px;

    word-spacing: 0; /*reset wordspacing from parent*/
}

/* Fuer 3-spaltige Tabellen und Fragebögen */

/*inputRow for 2 and 3 spaltige gf tabelle*/
.gfInputRow {
    /*nothing to do here*/
}

.gfTab3Col1Head, .gfTab3Col2Head, .gfTab3Col3Head, .gfTab3Col4Head {
    display:inline-block;
    vertical-align: bottom;
    line-height: 14px;
    padding-left: 6px;
    word-spacing: 0; /*reset wordspacing from parent*/
}

.gfTab3Col1Head {
    text-align: right;
    width: 200px;
}

.gfTab3Col2Head, .gfTab3Col3Head, .gfTab3Col4Head {
    width: 229px;
}

.gfTab3Col4Head {
/*     padding-right:0.5%; */
}

.gfTab3Col1, .gfTab3Col2, .gfTab3Col3, .gfTab3Col4 {
    display:inline-block;
    vertical-align: top;
    padding-left: 6px;
    padding-top: 0px;
}

.gfTab3Col1 {
    text-align: right;

    width: 200px;

    /* padding-top: 10px; */
}

.gfTab3Col2, .gfTab3Col3, .gfTab3Col4 {
    width: 229px;

}

.gfTab3Col4 {
/*     padding-right:0.5%; */
}


.gfTab3Col2Span3 {
    display:inline-block;

    vertical-align: top;

    width: 687px;

    padding-left: 2px;
/*     padding-right:0.5%; */
    padding-top: 5px;
}

/* 2-spaltige Tabellen und Frageboegen */

.gfTab2Col1Head, .gfTab2Col2Head, .gfTab2Col3Head {
    display:inline-block;
    vertical-align: bottom;
    line-height: 14px;
    padding-left: 6px;
    word-spacing: 0; /*reset wordspacing from parent*/
}

.gfTab2Col1Head {
    text-align: right;
    width: 200px;
}

.gfTab2Col2Head, .gfTab2Col3Head {
    width: 343px;
}

.gfTab2Col3Head {
/*     padding-right:0.5%; */
}

.gfTab2Col1, .gfTab2Col2, .gfTab2Col3 {
    display:inline-block;
    vertical-align: top;
    padding-left: 6px;
    padding-top: 0px;
}

.gfTab2Col1 {
    text-align: right;

    width: 200px;
}

.gfTab2Col2, .gfTab2Col3 {
    width: 343px;
}

.gfTab2Col3 {
/*     padding-right:0.5%; */
}

/* Separator */

.separator {
    border-bottom: var(--gray30) solid 1px;

    margin-right: 5px;
    margin-left: 5px;
    margin-top: 5px;
    margin-bottom: 5px;
}

.separatorDoubleLine {
    border-bottom: var(--gray30) double;

    margin-right: 5px;
    margin-left: 5px;
    margin-top: 5px;
    margin-bottom: 5px;
}

.gfFrageboegenSpacer {
    margin-top: 10px;
}

/*PROBLEM WITH EMPTY TEXT NODES in the columns, caused by html formating
    see above

    for GesundheitsFragen
*/
.gfCol1,
.gfCol1Span2 {
    word-spacing: 0; /*reset wordspacing from parent*/
}

/* Special markup to move fields in standard gfTab3Col1 and gfTab3Col2 position - used for dioptrien */

.formLabelColMoveToGfTab3Col1 {
    margin-right: -9px !important;
}

.formCompColMoveToGfTab3Col2 {
    margin-left: 9px !important;
}

/* ZUSATZFRAGEN */

.gfZusatzfrCol1Span2 {
    display:inline-block;
    word-spacing: 0;

    text-align: left;
    vertical-align: middle;

    width: 888px;
    line-height: 16px;

    padding-left: 5px;
    padding-top: 12px;
}

.gfZusatzfrAuswahl {
    padding-top: 14px;
    margin-bottom: 0px;
}

.gfZusatzfrAllergieHinweis {
    padding-top: 0px;
    margin-bottom: 4px;
}

.gfZusatzfrHinweis {
    padding-top: 0px;
    margin-bottom: 4px;
}

.gfZusatzfrFormCompX1 {
    margin-left: 9px !important;
    width: 228px !important;
}

.gfZusatzfrFormCompX2 {
    margin-left: 9px !important;
    width: 456px !important;
}

.gfZusatzfrFormCompX3 {
    margin-left: 9px !important;
    width: 690px !important;
}

/*********************
END: OLD GESUNDHEITSFRAGEN
**********************/




/***************************
* New Gesundheitsfragen
**************************/

.gfQuestion {
    /* a tagging class*/
}

.gfTextOnly, .gfQuestion,
.gfQuestionOptionalRadio,
.gfQuestionOptionalChk {
    display:inline-block;
    width:100%;
    text-align: left;
    vertical-align: middle;
    line-height: 16px;
    word-spacing: 0;

    padding-left: 5px;
}

.gfQuestion .gfQuestion {
    padding-left:0px;
}

.gfQuestionOptionalRadio {
    width: 768px;
}
.gfQuestionOptionalRadioInput {
    display:inline-block;

    text-align: right;
    vertical-align: middle;
    width: 130px;

    padding-left:4px;
/*     padding-right:0.5%; */
    padding-top: 5px;
    padding-bottom: 5px;
}
.gfQuestionOptionalRadioInput .radioHorizontal {
    /*float:right;*/
}



/* Test */

.gfTextOnly .questionText, .gfQuestion .questionText,
.gfQuestionOptionalRadio .questionText,
.gfQuestionOptionalRadioInput {

    font-size:13px;
    /*font-weight:bold;*/
    line-height:18px;
}

.gfQuestionOptionalChk .questionText {

    font-size:14px;
    padding-left:190px;
    line-height:16px;
}

/*
.gfTextOnly .questionText .bold, .gfQuestion .questionText .bold,
.gfQuestionOptionalRadio .questionText .bold {
    color:#0073AA;
}*/


.gfBasicStyle .bold {
    font-weight: bold;
}

.gfBasicStyle .italic {
    font-style: italic;
}

.gfBasicStyle .underline {
    text-decoration: underline;
}

.gfBasicStyle .red {
    color:var(--red100); /*to do: replace with real stgt color*/
}

.gfBasicStyle .orange {
    color:var(--orange100); /*to do: replace with real stgt color*/
}

.gfBasicStyle .blue {
    color:var(--blue100); /*to do: replace with real stgt color*/
}

.gfBasicStyle.disabled,
.gfBasicStyle.disabled .red,
.gfBasicStyle.disabled .orange,
.gfBasicStyle.disabled .blue {
    color:var(--gray80);
}


/*************************
* NEW Tables

within a inputRow we have the columns of the table, preceeded by the indent

 indent | col1 | ... | colN

 All widths are absolute (px)

**************************/

/* this ia a marker class to change table width
added to the wrapper Element with class .gfTable
.indent {

}
*/

.gfTableHeader .gfText,
.gfTableFooter .gfText {

    display:inline-block;
    vertical-align: top;
    width: 863px;
    padding-left: 2px;
    padding-top: 5px;
    padding-bottom: 5px;
    word-spacing: 0; /*reset wordspacing from parent*/
}


.gfTableHeader.indent .gfText,
.gfTableFooter.indent .gfText {

    width: 687px;
}


/* table max*/
.gfTableHeader .gfIndent,
.gfTableFooter .gfIndent {
    display:inline-block;
    text-align: right;
    width: 30px;
}
/* table, with indent */
.gfTableHeader.indent .gfIndent,
.gfTableFooter.indent .gfIndent {
    width: 196px;
}

/* indent width */

.gfTable .gfTableIndent,
.gfFrageboegen  .gfTableIndent {
    display:inline-block;
    text-align: right;
    width: 0px;
}
.gfTable.indent .gfTableIndent {
    width: 196px;
}

.gfFrageboegen .gfTableIndent {
    width: 196px;
    padding-right:10px;
}

/* TableMax: col widths without indent */

.gfTable.gfTblCol8 .gfTblColHead,
.gfTable.gfTblCol8 .gfCell {
    width: 107px; /* 8 Col Table*/
}

.gfTable.gfTblCol7 .gfTblColHead,
.gfTable.gfTblCol7 .gfCell {
    width: 123px; /* 7 Col Table*/
}

.gfTable.gfTblCol6 .gfTblColHead,
.gfTable.gfTblCol6 .gfCell {
    width: 144px; /* 6 Col Table*/
}

.gfTable.gfTblCol5 .gfTblColHead,
.gfTable.gfTblCol5 .gfCell {
    width: 174px; /* 5 Col Table*/
}

.gfTable.gfTblCol4 .gfTblColHead,
.gfTable.gfTblCol4 .gfCell {
    width: 219px; /* 4 Col Table*/
}

.gfTable.gfTblCol3 .gfTblColHead,
.gfTable.gfTblCol3 .gfCell {
    width: 294px; /* 3 Col Table*/
}

.gfFrageboegen .gfCell {
    width: 230px; /* 3 Col Table*/
}

.gfTable.gfTblCol2 .gfTblColHead,
.gfTable.gfTblCol2 .gfCell {
    width: 444px; /* 2 Col Table*/
}

.gfTable.gfTblCol1 .gfTblColHead,
.gfTable.gfTblCol1 .gfCell {
    width: 893px; /* 1 Col Table*/
}

/* Table: col widths with indent */

.gfTable.gfTblCol8.indent .gfTblColHead,
.gfTable.gfTblCol8.indent .gfCell {
    width: 83px; /* 8 Col Table*/
}

.gfTable.gfTblCol7.indent .gfTblColHead,
.gfTable.gfTblCol7.indent .gfCell {
    width: 95px; /* 7 Col Table*/
}

.gfTable.gfTblCol6.indent .gfTblColHead,
.gfTable.gfTblCol6.indent .gfCell {
    width: 112px; /* 6 Col Table*/
}

.gfTable.gfTblCol5.indent .gfTblColHead,
.gfTable.gfTblCol5.indent .gfCell {
    width: 135px; /* 5 Col Table*/
}

.gfTable.gfTblCol4.indent .gfTblColHead,
.gfTable.gfTblCol4.indent .gfCell {
    width: 170px; /* 4 Col Table*/
}

.gfTable.gfTblCol3.indent .gfTblColHead,
.gfTable.gfTblCol3.indent .gfCell {
    width: 229px; /* 3 Col Table*/
}

.gfTable.gfTblCol2.indent .gfTblColHead,
.gfTable.gfTblCol2.indent .gfCell {
    width: 346px; /* 2 Col Table*/
}

.gfTable.gfTblCol1.indent .gfTblColHead,
.gfTable.gfTblCol1.indent .gfCell {
    width: 697px; /* 1 Col Table*/
}

/* cell and column head */
.gfTable .gfTblColHead {
    display:inline-block;
    vertical-align: bottom;
    line-height: 14px;
    /*padding-left: 4px;*/ /*change tp padding right and last cell has padding right zero; so we also can adapt padding to the mumber of columns so widths are more equal*/
    margin-left:5px; /* ok for col4 */
    word-spacing: 0; /*reset wordspacing from parent*/
}

.gfTblColHead .disabled {
    color: var(--gray80);
}

.gfTable .gfCell,
.gfFrageboegen .gfCell {
    display:inline-block;
    margin-left:5px;
}

/* cell component*/

.gfCellCombo,
.gfCellRadio,
.gfCellChk {
    vertical-align: middle;
    padding-left: 4px;
}

.gfCellText {
    vertical-align: top;
    padding-left: 6px;
    padding-top: 0px;
}



.gfSingleData {
    /*just a tag class*/
}


.ui-inputfield.ui-inputtext.textFull {
    width:100%;
}

.ui-inputfield.ui-inputtext.textThreeQuarter {
    width:75%;
}

.ui-inputfield.ui-inputtext.textHalf {
    width:50%;
}

.ui-inputfield.ui-inputtext.textQuarter {
    width:25%;
}

/*
* Separators
*/

.gfSeparatorSingleBlocks {
    border-bottom-color:var(--gray30);
    border-bottom-style:solid;
    border-bottom-width:1px;
    margin-top:0px;
    margin-bottom:5px;
    margin-left: 300px;
    margin-right: 300px;

}

.gfSeparator {
    border-bottom: var(--gray30) solid 1px;
    margin: 10px;
}

/* For Frageboegen */


.gfFrageboegen {
   margin-top: 10px;
}
