/*------------------------------------------------------------------------------------------------------
* Label & Input untereinander
------------------------------------------------------------------------------------------------------*/

.invisible {display: none!important;}

/*     --wrapper
------------------------------------------------- */
.widget,
.input-wrapper {margin-bottom: 10px;}

/*     --fieldset
------------------------------------------------- */
fieldset {margin-bottom: 25px;}
legend {font-size: 16px;}

/*     --rahmen
------------------------------------------------- */
input, select, textarea {border: 1px solid #ccc;}

/*     --felder
------------------------------------------------- */
input {padding: 5px; width: 200px;}
label {float: left; width: 100%; margin-bottom: 5px;}
select {width: 212px; height: 24px;}
textarea {width: 350px; height: 200px;}

/*     --submit-button
------------------------------------------------- */
.submit_container {margin-top: 20px;}
.submit_container input {cursor: pointer;}

/*     --radio-buttons
------------------------------------------------- */
.radio_container span {display: block; margin-bottom: 5px;}
.radio_container label {float: none;}
.radio_container input {width: 20px; border: none;}
label.radio-button {float: none; display: block; margin-bottom: 10px;}

/*     --checkboxes
------------------------------------------------- */
.checkbox_container span {display: block; margin-bottom: 5px;}
.checkbox_container legend span { display: inline-block; }
.checkbox_container label {float: none;}
.checkbox_container input {width: 20px; border: none;}
label.checkbox {float: none; display: block; margin-bottom: 10px;}


/*------------------------------------------------------------------------------------------------------
* Label & Input Felder nebeneinander
* formular muss die CSS-Klasse "columnar" in Contao hinzugefŸgt werden
------------------------------------------------------------------------------------------------------*/

.columnar .nomarginleft {margin-left: 0 !important;}
.columnar .widget-captcha { margin-left: 180px;}

/*     --labels
------------------------------------------------- */
.columnar label {width: 180px; }
.columnar label.radio-button {display: inline; float: left;}

/*     --radio-buttons
------------------------------------------------- */
.columnar .radio_container {margin-left: 180px;}
.columnar .radio_container, .columnar .checkbox_container {margin-top: 1px;}

/*     --checkboxes
------------------------------------------------- */
.columnar label.checkbox {display: inline; float: left;}
.columnar .checkbox_container {margin-left: 180px;}
.columnar .checkbox_container label { width: auto; }
.columnar .checkbox_container input { width: auto; display: inline-block; margin-right: 4px;}

/*     --submit-button
------------------------------------------------- */
.columnar .submit_container input {margin-left: 180px;}