/* CSS FÜR FORMULARE (alleinstehende und integrierte) */
#inhalt form
{
padding: 10px;
background-color: #e5e5e5; /* Muss der Farbe der checkbox-/radiobutton-Umrandung entsprechen. */
border: 1px solid #bbbbbb;
border-radius: 5px 5px 5px 5px;
overflow: hidden; /* Damit innere, floatende div-container (bzw. */
/* Elemente) eingefangen werden. */
}
#inhalt form fieldset /* Formularabschnitt (z.B. Kontaktdaten) */
{
margin-bottom: 5px;
border: none;
}
#inhalt form legend /* Beschriftung Formularabschnitt (z.B. Kontaktdaten) */
{
margin-top: 5px;
margin-bottom: 0;
padding: 5px 3px 5px 3px;
font-weight: bold;
}
#inhalt form li,
#inhalt form label
{
line-height: 1.3 !important; /* !important muss seltsamerweise sein, weil in basis.css und error.css was überschrieben wird. */
}
#inhalt form fieldset > div /* div-Container (1. Kind-Ebene) innerhalb von Formularen */
{
margin-bottom: 5px;
padding-left: 3px;
}
#inhalt form .type-text, /* input-Zeile (inkl. Label) */
#inhalt form .type-select, /* selectbox-Zeile (inkl. Label) */
#inhalt form .type-check, /* checkbox-Zeile (inkl. Label) */
#inhalt form .type-radio /* radiobutton-Zeile (inkl. Label) */
{
clear: both;
font-size: 13px;
}
#inhalt form .type-text, /* input-Zeile (inkl. Label) */
#inhalt form .type-select /* selectbox-Zeile (inkl. Label) */
{
margin-top: 8px;
margin-bottom: 8px;
padding-left: 0; /* Wichtig! Muss 0 sein. */
}
#inhalt form .type-check, /* checkbox-Zeile (inkl. Label) */
#inhalt form .type-radio /* radiobutton-Zeile (inkl. Label) */
{
margin: 3px 0 3px 5px;
}
#inhalt form .checkbox-group-label + .type-check, /* erste checkbox-Zeile */
#inhalt form .radio-group-label + .type-radio /* erste radiobutton-Zeile */
{
margin-top: 1px;
}
#inhalt form .type-text label /* input-Label */
{
display: inline-block;
width: 130px; /* entspricht der width in "form .col1" -5px */
padding-left: 3px;
}
#inhalt form .type-text input /* input-Eingabefeld */
{
width: 374px;
}
#inhalt form .type-text textarea, /* textarea-Eingabefeld */
#inhalt form .type-check textarea /* textarea-Eingabefeld innerhalb einer checkbox-Zeile */
{
height: 200px;
width: 512px;
margin-top: 3px; /* gleicher Wert wie bei "form .type-text.subject input" */
resize: vertical;
}
#inhalt form .type-text input, /* input-Eingabefeld */
#inhalt form .type-text textarea, /* textarea-Eingabefeld */
#inhalt form .type-check textarea /* textarea-Eingabefeld innerhalb einer checkbox-Zeile */
{
padding: 0 3px 0 3px;
border: 1px solid #cccccc;
border-radius: 3px;
}
#inhalt form .type-select label /* selectbox-Label */
{
display: inline-block;
width: 130px;
margin-left:3px;
}
#inhalt form .type-select select /* selectbox-Auswahlfeld */
{
max-width: 382px;
margin-top: 1px;
padding: 0 5px 0 3px;
border: 1px solid #cccccc;
border-radius: 3px;
}
/* Wird nur bei wenigen, speziellen Formularen benötigt und wurde daher ins spezielle CSS ausgelagert */
/*form .type-text.subject,/* Betreff-/Thema-Bereich (inkl. Label) */
/*form .type-text.topic /* Betreff-/Thema-Bereich (inkl. Label) */
/*{
margin-top: 20px;
}
*/
#inhalt form .type-text.subject input, /* Betreff-/Thema-Eingabefeld */
#inhalt form .type-text.topic input /* Betreff-/Thema-Eingabefeld */
{
width: 512px;
padding: 0 3px 0 3px;
margin-top: 3px; /* gleicher Wert wie bei "form .type-text textarea" */
}
#inhalt form .type-text.textarea /* Anliegen-Text-Bereich (inkl. Label) */
{
margin-top: 5px;
}
#inhalt form .checkbox-group, /* Bereich einer checkbox-Gruppe (inkl. Label) */
#inhalt form .radio-group /* Bereich einer radiobutton-Gruppe (inkl. Label) */
{
clear: both;
overflow: hidden; /* Damit innere, floatende div-container (bzw. */
/* Elemente) eingefangen werden. */
margin-top: 3px;
margin-bottom: 3px;
padding-left: 2px; /* Wichtig für den Error-Border */
padding-right: 2px; /* Wichtig für den Error-Border */
border: 1px solid #e5e5e5; /* Wichtig für den Error-Border; muss an dieser Stelle */
/* der Farbe des Formularhintergrundes entsprechen. */
font-size: 13px;
}
#inhalt form .radio-group .checkbox-group, /* Bereich einer checkbox-Gruppe (inkl. Label) auf Ebene 2 */
#inhalt form .checkbox-group .radio-group, /* Bereich einer radiobutton-Gruppe (inkl. Label) auf Ebene 2 */
#inhalt form .checkbox-group .checkbox-group, /* Bereich einer checkbox-Gruppe (inkl. Label) auf Ebene 2 */
#inhalt form .radio-group .radio-group /* Bereich einer radiobutton-Gruppe (inkl. Label) auf Ebene 2 */
{
margin-top: 0; /* Überschreibt den Wert von Ebene 1 */
padding-left: 15px; /* Wichtig für den Error-Border; überschreibt den Wert von Ebene 1 */
}
#inhalt form .type-check input, /* checkbox */
#inhalt form .type-radio input /* radiobutton */
{
display: block;
float: left;
margin-top: 1px;
}
#inhalt form .checkbox-group-label, /* checkbox-Gruppen Label */
#inhalt form .radio-group-label /* radiobutton-Gruppen Label */
{
margin-top: 3px;
margin-bottom: 2px;
}
#inhalt form .type-check label, /* checkbox-Label */
#inhalt form .type-radio label /* radiobutton-Label */
{
display: inline-block;
width: 490px;
margin-left:5px;
margin-top: -2px;
}
#inhalt form .type-radio .type-check label, /* checkbox-Label auf Ebene 2 */
#inhalt form .type-check .type-radio label /* radiobutton-Label auf Ebene 2 */
{
width: 460px; /* Überschreibt den Wert von Ebene 1 */
}
#inhalt form .type-text input:focus, /* Hierdurch wird das aktive Eingabeelement hervorgehoben */
#inhalt form .type-text textarea:focus,
#inhalt form .type-check textarea:focus,
#inhalt form .type-select select:focus
{
background-color: #fff8d1;
border: 1px solid #005395;
}
/* spezielle Formattierungen für das Bic Feld für Einmal Mandate */
#inhalt form .bic > img {
vertical-align: bottom;
cursor: help;
}
/* BEGINN Formatierungen für nicht ausgefüllte Pflichtfelder */
#inhalt form .error /* Bitte, nicht eigegebene Daten in Pflichtfelder einzugeben. */
{
margin-top: 3px;
margin-bottom: 0;
font-weight: bold;
}
#inhalt form .error + div
{
margin-top: 0;
}
#inhalt form .error + div > input, /* Pflicht-input-Felder in die keine Daten eigegeben wurden. */
#inhalt form .error + div > textarea, /* Pflicht-textarea-Felder in die keine Daten eigegeben wurden. */
#inhalt form .error + div > select /* Pflicht-selectbox-Felder bei der keine Auswahl getroffen wurde. */
{
border-color: red;
}
#inhalt form .error + div.checkbox-group, /* Pflicht-checkboxen in die keine Daten eigegeben wurden. */
#inhalt form .error + div.radio-group /* Pflicht-radiobuttons in die keine Daten eigegeben wurden. */
{
border: 1px solid red;
border-radius: 3px;
}
/* ENDE Formatierungen für nicht ausgefüllte Pflichtfelder */
/* Buttons (auch im Bestätigungs-Schritt) */
#inhalt form .submit-buttons, /* Buttons-Bereich */
#inhalt .last-step .buttons /* Buttons in last-step */
{
clear: both;
float: right;
margin-top: 25px;
margin-bottom: 25px;
}
#inhalt form .submit-buttons .type-button input, /* Buttons */
#inhalt .last-step .buttons .type-button input /* Buttons in last-step */
{
float: right;
height: 30px;
padding: 0 5px 0 5px;
border: 1px solid #cccccc;
border-radius: 3px;
font-weight: bold;
}
#inhalt form .submit-buttons .type-button .submit, /* Submit-/Abschicken-Button */
#inhalt .last-step .buttons .type-button .print /* Print-Button in last-step */
{
width: auto;
background-color: #005395; /* wichtig bei last-step */
color: #ffffff; /* wichtig bei last-step */
}
#inhalt form .submit-buttons .type-button .reset /* Reset-/Löschen-Button */
{
width: auto;
margin-right: 10px;
color: #323232;
background-color: #ffffff;
}
/* Überprüfung der Daten (Step 2) */
#inhalt .preview-step form > div /* divs auf der 1. Kind-Ebene */
{
overflow: hidden; /* Damit innere, floatende div-container (bzw. */
/* Elemente) eingefangen werden. */
}
#inhalt .preview-step form > div > div /* divs auf der 2. Kind-Ebene */
{
overflow: hidden; /* Damit innere, floatende div-container (bzw. */
/* Elemente) eingefangen werden. */
}
#inhalt .preview-step .validation_message, /* "Sind diese Angaben korrekt?"-Meldung oben in.preview-step */
#inhalt .preview-step .validation-message
{
margin-bottom: 10px;
}
#inhalt .preview-step form .col1, /* 1. Spalte (links) */
#inhalt .preview-step form .col2 /* 2. Spalte (rechts) */
{
float: left;
margin-top: 3px;
margin-bottom: 3px;
font-size: 13px;
line-height: 1.3;
}
#inhalt .preview-step form .col1 /* 1. Spalte (links) */
{
clear: both;
width: 135px; /* entspricht der width in "#inhalt form .type-text label" +5px */
padding-right: 5px; /* damit col1 und col2 nicht direkt aneinanderliegen */
font-weight: bold;
}
#inhalt .preview-step form .multiple-values .col1, /* Überschriften der checkbox-Einträge */
#inhalt .preview-step form .single-values .col1 /* Überschriften der radiobutton-Einträge */
{
width: 100%;
margin-top: 5px;
}
#inhalt .preview-step form .col2 ul, /* Aufzählungs-Listen in Spalte 2 */
#inhalt .preview-step form .col2 ol /* Nummerierungs-Listen in Spalte 2 */
{
padding-left: 15px!important; /* entfernt die Einrückung für die checkbox-Auswahllisten */
margin-bottom: 0!important; /* entfernt zu großen Abstand unter einer ul (über-
schreibt #inhalt ul aus basis.css/error.css) */
}
#inhalt .preview-step form .groupheadline
{
display: none; /* Blendet Groupheadlines global aus. */
margin-top: 20px;
}
#inhalt .preview-step form .preview_subject,
#inhalt .preview-step form .confirmation-msg, /* u.a. meerwiese */
#inhalt .preview-step form .preview_topic, /* u.a. 01_anregung */
#inhalt .preview-step form .confirm-send
{
margin-top: 25px;
}
/* Abstände von Textarea-Blöcken OBEN */
#inhalt .preview-step form .preview_message .col1, /* u.a. 01_anregung, 51_jib-umwelt, 51_jib-kursbuchung, 17_publikationen, vth_publikationen */
#inhalt .preview-step form .preview_suggestion.suggestion .col1, /* u.a. 42_digiauskunft, 61_anregungen */
#inhalt .preview-step form .preview_reason.reason .col1, /* u.a. 42_digiauskunft */
#inhalt .preview-step form .preview_remark .col1, /* u.a. 67_klime_flyer, 42_medienreservierung, 42_medienwunsch */
#inhalt .preview-step form .preview_notices .col1, /* u.a. 67_hochzeitswald, 44_kursanmeldung */
#inhalt .preview-step form .preview_notice .col1, /* u.a. 44_aufnahmeantrag, 50_umzug */
#inhalt .preview-step form .preview_annot01 .col1, /* u.a. vth_publikationen */
#inhalt .preview-step form .preview_remarks .col1 /* u.a. 45_fuehrungen */
{
margin-top: 10px;
}
/* Abstände von Textarea-Blöcken UNTEN */
#inhalt .preview-step form .preview_message .col2, /* u.a. 01_anregung, 51_jib-umwelt, 51_jib-kursbuchung, 17_publikationen, vth_publikationen */
#inhalt .preview-step form .preview_suggestion.suggestion .col2, /* u.a. 42_digiauskunft, 61_anregungen */
#inhalt .preview-step form .preview_reason.reason .col2, /* u.a. 42_digiauskunft */
#inhalt .preview-step form .preview_remark .col2, /* u.a. 67_klime_flyer, 42_medienreservierung 42_medienwunsch */
#inhalt .preview-step form .preview_notices .col2, /* u.a. 67_hochzeitswald, 44_kursanmeldung */
#inhalt .preview-step form .preview_notice .col2, /* u.a. 44_aufnahmeantrag */
#inhalt .preview-step form .preview_annot01 .col2, /* u.a. vth_publikationen */
#inhalt .preview-step form .preview_remarks .col2 /* u.a. 45_fuehrungen */
{
margin-bottom: 10px;
}
/* Überschriften über die volle Breite - analog werden die Breiten auch bei last-step gesetzt */
#inhalt .preview-step form .preview_subject .col1,
#inhalt .preview-step form .preview_message .col1, /* u.a. 01_anregung, 51_jib-umwelt, 51_jib-kursbuchung, 17_publikationen, 51_jib_kursanmeldung, wuddi_flohmarkt */
#inhalt .preview-step form .preview_remark .col1, /* u.a. 67_klima_flyer, 42_medienreservierung */
#inhalt .preview-step form .preview_remarks .col1, /* u.a. 45_fuehrungen */
#inhalt .preview-step form .preview_notice .col1, /* u.a. 50_umzug */
#inhalt .preview-step form .preview_notices .col1, /* u.a. 44_kursanmeldung */
#inhalt .preview-step form .preview_suggestion .col1, /* u.a. 61_anregungen */
#inhalt .preview-step form .preview_requirements07 .col1, /* mm_kongressplan (Weitere Programmpunkte) */
#inhalt .preview-step form .preview_extras .col1 /* mm_kongressplan (Sonstiges) */
{
width: 100%;
}
/* Bestätigungsseite für die Formularübermittlung (last-step) */
/* Für Button-Formatierung siehe entsprechenden Bereich (Buttons) oben */
#inhalt .last-step > div /* divs auf der 1. Kind-Ebene */
{
overflow: hidden; /* Damit innere, floatende div-container (bzw. */
/* Elemente) eingefangen werden. */
}
#inhalt .last-step > div > div /* divs auf der 2. Kind-Ebene */
{
overflow: hidden; /* Damit innere, floatende div-container (bzw. */
/* Elemente) eingefangen werden. */
}
#inhalt .last-step ul /* Aufzählungs-Listen */
{
margin-bottom: 0; /* überschreibt Wert aus basis.css und error.css */
padding-left: 15px !important;
}
#inhalt .last-step .last-step-introduction /* Einleitungstext */
{
margin-bottom: 10px;
}
#inhalt .last-step .col1, /* 1. Spalte (links) */
#inhalt .last-step .col2 /* 2. Spalte (rechts) */
{
float: left;
margin-top: 2px;
margin-bottom: 3px;
font-size: 13px;
line-height: 1.3;
}
#inhalt .last-step .col1
{
clear: both;
width: 150px; /* entspricht der width in "#inhalt form .type-text label" +20px */
padding-right: 3px;
font-weight: bold;
}
#inhalt .last-step .multiple-values .col1 /* Überschriften der checkbox-Einträge auf volle Breite */
{
width: 100%;
margin-top: 5px;
}
#inhalt .last-step .groupheadline
{
margin-top: 10px;
margin-bottom: 3px;
font-weight: bold;
}
/* Ausblendung einzelner Überschriften in Formularen */
#inhalt .last-step .groupheadline.preview-etc, /* u.a. 01_neuanregung */
#inhalt .last-step .groupheadline.preview-registration, /* u.a. awm_sauberes_muenster */
#inhalt .last-step .groupheadline.preview-booklets /* u.a. 67_klima_flyer */
{
display: none;
}
/* Betreffzeilen und Textareas */
#inhalt .last-step .preview-message,
#inhalt .last-step .preview_message, /* u.a. vth_publikationen */
#inhalt .last-step .text-validate,
#inhalt .last-step .preview_remark, /* u.a. 67_klima_flyer */
#inhalt .last-step .preview_remarks, /* u.a. 45_fuehrungen */
#inhalt .last-step .preview_notices /* u.a. 67_hochzeitswald */
{
margin: 12px 0 10px 0;
}
/* Überschriften über die volle Breite - analog werden die Breiten auch bei.preview-step gesetzt */
#inhalt .last-step .preview-message .col1,
#inhalt .last-step .preview_message .col1, /* u.a. vth_publikationen */
#inhalt .last-step .text-validate .col1,
#inhalt .last-step .preview_remark .col1, /* u.a. 67_klima_flyer */
#inhalt .last-step .preview_remarks .col1, /* u.a. 45_fuehrungen */
#inhalt .last-step .preview_subject .col1, /* u.a. 42_digiauskunft */
#inhalt .last-step .preview_notice .col1, /* u.a. 50_umzug */
#inhalt .last-step .preview_notices .col1 /* u.a. 67_hochzeitswald */
{
width: 100%;
}
#inhalt .last-step .preview_subject,
#inhalt .last-step .preview_topic,
#inhalt .last-step .preview-complimentary-close-block
{
margin-top: 25px;
}
/* Schlusstext */
#inhalt .last-step .text.last-step-closing /* u.a. vth_publikationen, 67_klima_flyer, 45_fuehrungen */
{
margin-top: 25px;
}
/* ------- Workaround für automatisch eingefügtes nach TYPO3-Upgrade ------------- */
.Tx-Formhandler .last-step li > p,
.Tx-Formhandler .preview-step li > p
{
vertical-align: text-top;
display: inline;
}
/* ------- Workaround für automatisch eingefügtes
nach TYPO3-Upgrade ENDE -------- */
/* Spezielle Formartierung für das Upload Element von Formhandler Anfang */
#inhalt .Tx-Formhandler .type-file .label-container {
text-align:left;
float:left;
display: inline-block;
width: 140px;
padding-left: 3px;
margin-right:15px;
}
#inhalt .Tx-Formhandler .type-file .label-container small {
font-size:75%;
}
#inhalt .Tx-Formhandler .type-file .input-container .data-upload {
width:auto;
}
#inhalt .Tx-Formhandler .type-file .input-container .btn-file {
position: relative;
overflow: hidden;
}
#inhalt .Tx-Formhandler .type-file .input-container .btn-file input[type=file] {
position: absolute;
top: 0;
right: 0;
min-width: 100%;
min-height: 100%;
font-size: 100px;
text-align: right;
filter: alpha(opacity=0);
opacity: 0;
outline: none;
background: white;
cursor: inherit;
display: block;
}
#inhalt .Tx-Formhandler .type-file .input-container .upload-button {
position: relative;
overflow: hidden;
width: auto;
display: inline-block;
color: #323232;
background-color: #ffffff;
line-height:20px;
padding: 0 5px 0 5px;
border: 1px solid #cccccc;
border-radius: 3px;
font-weight: bold;
vertical-align: middle;
cursor:pointer;
}
#inhalt .Tx-Formhandler .type-file .input-container .upload-button[disabled=disabled] {
border: 1px solid #999999;
background-color: #cccccc;
color: #666666;
cursor: not-allowed;
}
#inhalt .Tx-Formhandler .type-file .input-container .file-path-displayer {
border: 1px solid #cccccc;
border-radius: 3px;
margin:0px;
padding:0px;
background-color:white;
margin-top:2px;
width:140px;
}
#inhalt .Tx-Formhandler .type-file .uploaded-files-container {
padding-left: 3px;
padding-top: 10px;
clear:both;
}
#inhalt .Tx-Formhandler .type-file .uploaded-files-container .formhandler_removelink {
margin-left: 2px;
}
#inhalt .Tx-Formhandler .type-file .uploaded-files-container .uploaded-files-headline {
font-weight: bold;
}
#inhalt .Tx-Formhandler label.dsgvo-approval {
display: block;
width: 417px;
}
#inhalt .Tx-Formhandler input#dsgvo-approval {
width:48px;
}
#inhalt .Tx-Formhandler form .error + div.type-check.dsgvo-approval.checkbox-group {
padding: 12px;
}
/* Spezielle Formartierung für das Upload Element von Formhandler Ende */