gadjo/gadjo/static/css/_forms.scss

label {
	margin-bottom: 0;
}

form div.widget {
	margin-bottom: 2ex;
}

div.errornotice p {
	margin: 1ex 0;
}

div.error {
	color: black;
	font-weight: normal;
	background: transparent;
	padding-left: 0px;
	margin-left: 2px;
}

div.error::before {
	content: "\f071"; /* fa-exclamation-triangle */
	font-family: FontAwesome;
	padding-right: 1ex;
}

span.required {
	margin-left: 0.7ex;
	position: relative;
	top: -0.2ex;
}

div.widget div.title {
	margin-bottom: 0;
}

div.buttons {
	margin-top: 2em;
}

div.buttons div {
	display: inline-block;

	& input[name="submit"] {
		font-weight: bold;
	}
}

a.button {
	padding-bottom: calc(1ex + 1px);
	line-height: 2.5em;
}

a.button,
.fargo-pick-popup button,
div#content button,
input[type=submit],
.ui-dialog .ui-dialog-buttonpane button,
div.buttons input {
	background-image: linear-gradient(to bottom, #f9f9f9, #eeeeee);
	color: #3c3c33;
	padding: 5px 15px;
	cursor: pointer;
	border: 1px solid #aaa;
	transition: all 0.2s ease;
	margin-right: 2ex;
	height: 2.5em;
	vertical-align: middle;
	box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.21);

	&:hover {
		box-shadow: 0px 0px 5px #888;
	}
}

div#content button:disabled,
input[type=submit]:disabled {
	color: #888;
	background: #f3f3f3;
	pointer-events: none;
	box-shadow: none;
	cursor: not-allowed;
}

button::-moz-focus-inner {
	border: 0;
	padding: 1px 0 -1px 0;
	margin: -3px 0 1px 0;
}

input, input[type="text"], input[type="url"], input[type="email"], input[type="password"], input[type="url"], input[type="tel"], input[type="number"], input[type="search"], input[type="file"], input[type="date"], input[type="datetime-local"], input[type="month"], input[type="time"], input[type="week"], textarea, select {
	border: 1px solid #AAA;
	border-radius: 0px;
	box-sizing: border-box;
	margin: 0.2em 0px;
	outline: medium none;
	padding: 0.7ex 0.7em;
	max-width: 100%;
	&:focus {
		box-shadow: 0 0 0px 1px #1999cd;
	}
	&.disabled,
	&[disabled] {
		background: #eee;
	}
}

input[type="radio"]:focus, input[type="checkbox"]:focus {
	box-shadow: none;
}

input[readonly], select[readonly], textarea[readonly] {
	border-width: 0 0 1px 0;
}

div.date input[readonly] {
	border-width: 1px;
}

input[type=file] {
	border: none;
	padding-left: 0;
}

select {
	background: white;
	@include vendor-prefix('appearance', 'none');
	padding-right: 4em;
	background-image: url(arrow-down.svg);
	background-position: right 1.3rem center;
	background-repeat: no-repeat;
	background-size: 1rem auto;
}

select[multiple=multiple] {
	background: white;
	padding-right: 0;
}

input[type="checkbox"],
input[type="radio"] {
	margin-right: 1ex;
	margin-bottom: 1ex;
}

div.content label {
	margin-right: 1em;
}

div.widget div.content ul {
	padding: 0;
	margin: 0;
	list-style: none;
}

span.helptext,
div.hint {
	display: block;
	font-size: 80%;
}

form p label {
	display: block;
}

div.a2-block form input,
div.a2-block form select {
	width: 100%;
}

div.a2-block form input[type=radio] {
	width: auto;
}

div.a2-block form input[type=submit] {
	width: auto;
	min-width: 20ex;
}

div.a2-block ul#id_edit-profile-title {
	margin-left: 1em;
	margin-top: -1ex;
	li {
		display: inline-block;
		margin-right: 2em;
	}
	label {
		font-weight: normal;
	}
}

form ul.errorlist {
	padding: 0;
	margin: 2em 0 0 0;
	list-style: none;

	& li::before {
		content: "\f06a";
		font-family: FontAwesome;
		padding-right: 1ex;
	}
}

/* fieldsets */
fieldset.gadjo-foldable legend.gadjo-foldable-widget {
	border-bottom: 1px solid #aaa;
	cursor: pointer;
	display: block;
	font-weight: bold;
	padding: 1ex 0 0;
	width: 100%;
}
fieldset.gadjo-foldable legend.gadjo-foldable-widget:after {
	font-family: FontAwesome;
	content: "\f106"; /* angle-up */
	position: absolute;
	right: 1em;
}
fieldset.gadjo-foldable.gadjo-folded legend.gadjo-foldable-widget:after {
	content: "\f107"; /* angle-down */
}
fieldset.gadjo-foldable {
	padding: 1ex 0 0 0;
	border: 0;
}
.gadjo-foldable.gadjo-folded > .gadjo-folding {
	display: none;
}

/* form.as_p */

form p {
	margin: 0 0 1em 0;
}

form p label {
	display: block;
}

form p.required label:after {
	padding-left: 1ex;
	content: "*";
	color: red;
}

form p label {
	margin-bottom: 0.3ex;
}

/* form.small */

form.small p input {
	margin-left: 0;
}

form.small p {
	margin-bottom: 0.5em;
}

form.small label {
	width: 200px;
	display: inline-block;
}

form.small a.button,
form.small button {
	margin-left: 205px;
	display: inline-block;
}

form.small button + button,
form.small button + a.button {
	margin-left: 1em;
}