@CHARSET "UTF-8";

form {
	margin-bottom: 20px;
}

form:not(.noborder) {
	padding: 15px;
	width: calc(100% - 30px);
	border: 0.8px solid var(--bordercolor);
}

form.noborder {
	margin-top: 50px !important;
	margin-bottom: 50px !important;
}

form ul.fields > li:first-of-type {
	margin-top: 20px;
}

.fields { position: relative; }

.fields > * { vertical-align: top; }

.fields div { position: relative; }

ul.fields > li > * {
	margin-bottom: 30px;
}

ul.fields > li:last-child > * {
	margin-bottom: 0px;
}

.fields .actions { margin-top: 20px; }
.fields .nospacing { margin-top: 0px; }

/*.fields div:not(.break) { margin-bottom: 20px; position: relative; display: inline-block; vertical-align: top;  }*/

.fields div.autoheight:not(.break) > :not(span.field) {
	height: auto;
	line-height: auto;
}

.field__reference > span.field { top: -22px; left: 0px; right: 0px; font-size: 12px !important; }
.fields div:not(.break) > span.field { top: -20px; left: 5px; background-color: transparent; padding: 0 5px; }

.fields h3 { margin-top: 20px; }
.fields span:not([.form-icon,.button]) { position: relative; width: 120px; margin-left: 20px; }
.fields span.autowidth { position: relative; width: auto; }
.fields span:first-of-type { margin-left: 0px; }

input {
	background-color: transparent;
}

input,
select,
form.controldata input,
form.controldata select,
form.controldata textarea,
.fields input,
.fields select,
.fields textarea {
	position: relative;
	padding: 10px 10px 8px;
	line-height: 20px;
	font-family: Helvetica, Arial;
	border-bottom: 1px solid var(--bordercolor);
	border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px;
	color: var(--textcolor);
}

select.w100p,
form.controldata select.w100p,
.fields select.w100p {
	width: 100%;
} 

input.w100p,
textarea.w100p {
	width: calc(100% - 20px) !important;
} 

form input + span.field {
	display: block;
}

form.controldata textarea ~ span.errorinfo,
form.controldata input ~ span.errorinfo {
	margin-left: 12px;
	color: #f00;
	margin-top: 5px;
	font-size: 12px;
	display: none;
	position: absolute;
	bottom: -10px;
	background-color: var(--backgroundcolor);
	padding: 0 5px;
}

form.controldata input.default + span.field {

}

form.controldata textarea.error ~ span.errorinfo,
form.controldata input.error ~ span.errorinfo {
	display: block;
}

/*form.controldata select,*/
/*.fields textarea,*/
/*.fields select {*/
/*	position: relative;*/
/*	padding: 2px 10px;*/
/*	line-height: 20px;*/
/*	font-family: Helvetica, Arial;*/
/*	border: 1px solid #ddd;*/
/*	*/
/*	/*	box-shadow:inset rgba(0,0,0,0.1) 1px 1px 3px; -moz-box-shadow:inset rgba(0,0,0,0.1) 1px 1px 3px; -webkit-box-shadow:inset rgba(0,0,0,0.1) 1px 1px 3px;*/*/
/*	/*	background: linear-gradient(#ddd, #ddd), linear-gradient(#ddd, #ddd), linear-gradient(#ddd, #ddd);*/*/
/*	/*	background-size: 1px 10px, 100% 1px, 1px 10px;*/*/
/*	/*	background-position: bottom left, bottom center, bottom right;*/*/
/*	/*	background-repeat: no-repeat;*/*/
/*	*/
/*	color: #000;*/
/*	border-radius:0px; -moz-border-radius:0px; -webkit-border-radius:0px;*/
/*}*/

span > form {
	margin-top: -1px;
}

.fields input.noborder {
	border: 0px;
	padding: 0px;
}

.fields textarea {
	padding: 10px 30px 2px 10px;
}

input.compress {
	width: 50px;
	transition: width .2s linear;
}

input.compress:focus {
	width: 120px;
}

.fields h3 {
	margin-bottom: 10px;
}

*[data-component='repeater'] div.fullwidth span > span select {
	background-color: transparent;
	border: 1px solid transparent;
	width: calc(100% + 14px);
	margin: -7px -7px;
	box-shadow:none; -moz-box-shadow:none; -webkit-box-shadow:none;
}

*[data-component='repeater'] div.fullwidth span > span.column select {
	margin: -9px -7px;
}

*[data-component='repeater'] div.fullwidth span > span.column select + span {
	margin-top: -6px;
}

/* NB. Solves the floating checkbox bug in safari */

div:has(> input[type='checkbox']) {
	margin-top: 15px;
}

form.controldata input:not([type="checkbox"]):not([type="radio"]),
form.controldata select,
.fields input:not([type="checkbox"]):not([type="radio"]),
.fields select {
	/* height: 28px; */
}

input[type='checkbox'] + span {
	/*margin-left: 10px !important;*/
	position: relative;
}

form.controldata input[type='checkbox'],
form.controldata input[type='radio'],
.fields input[type='checkbox'],
.fields input[type='radio'] {
	top: -3px;
}

select:not([disabled]):not([readonly]),
form.controldata textarea:not([disabled]):not([readonly]),
form.controldata input:not([disabled]):not([readonly]),
form.controldata select:not([disabled]):not([readonly]),
.fields textarea:not([readonly]),
.fields input:not([readonly]),
.fields textarea:not([readonly]),
.fields select:not([disabled]):not([readonly]) {
	background-color: var(--input_backgroundcolor);
	border-color: var(--bordercolor);
}

form.controldata input:not([readonly]):focus,
form.controldata textarea:not([readonly]):focus,
form.controldata select:not([disabled]):focus,
form.controldata select:not([readonly]):focus,
.fields textarea:not([readonly]):focus,
.fields input:not([readonly]):focus,
.fields textarea:not([readonly]):focus,
.fields select:not([disabled]):focus,
.fields select:not([readonly]):focus {

}

.fields input[readonly],
.fields textarea[readonly],
.fields select[disabled],
.fields select[readonly],
.dialogbox_content .fields input[readonly] {
	background-color: var(--offwhite);
	border-color: var(--shadowcolor);
}

*[data-component='repeater'] div.fullwidth span > span select:focus {
	border-color: transparent;
}

select,
form.controldata input:not([type="checkbox"]):not([type="radio"]),
form.controldata select,
.fields textarea,
.fields input:not([type="checkbox"]):not([type="radio"]),
.fields select {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

span + .fields { margin-top: 20px !important; }

.fields div.radio {
	position: relative;
	background-color: #f4fdff;
	display: inline-block;
	padding: 10px 15px;
	line-height: 20px;
	font-family: Helvetica, Arial;
	border: 1px solid var(--bordercolor);
	border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px;
	color: var(--textcolor);
	margin-right: 10px;
	margin-bottom: 10px;
}

.fields div > pre {
	margin-bottom: 50px;
}

.fields div.radio > input[type='checkbox'] {
	top: 5px !important;
}

.fields div.radio > input[type='checkbox'] + span {
	top: -1px !important;
	display: inline-block;
	width: auto;
}

form.controldata input[type='radio'] > span {
	display: inline-block;
}

form.controldata input[type='checkbox'],
form.controldata input[type='radio'] {
	margin-right: 10px;
}

li.showseparator {
	padding-top: 10px;
	border-top: 1px solid #eee;
	margin-top: 10px !important;
}

li.showseparator:first-child {
	border-top: 1px solid transparent;
}

form section.grid_l,
form section.grid_r {
	padding-top: 10px;
	margin-top: 10px !important;
}

form section.grid_l:first-of-type,
form section.grid_r:first-of-type {
}

form section.grid_l > aside.notes,
form section.grid_r > aside.notes {
	padding-top: 12px;
}


.fields textarea[readonly],
.fields input[readonly],
.fields select:disabled {
	color: #555;
}

form.controldata select ~ .form-icon,
.fields select ~ .form-icon {
	position: absolute;
	display: inline-block;
	pointer-events: none;
	color: var(--textcolor);
	font-size: 2em;
	margin-left: -35px;
	margin-right: 35px;
	top: 12px;
}

form.controldata input ~ .icon.form-icon,
.fields input ~ .icon.form-icon {
	position: absolute;
	display: inline-block;
	pointer-events: none;
	color: var(--textcolor);
	font-size: 21px;
	margin-left: -25px;
	margin-right: 25px;
	top: 7px;
	opacity: 0.4;
}

*[data-component='repeater'] div.fullwidth span > span select ~ .form-icon {
	margin-left: -18px;
	top: 3px;
}

.fields input ~ .form-currency {
	position: absolute;
	display: inline-block;
	pointer-events: none;
	color: var(--textcolor);
	margin-left: 10px;
	top: 8px;
}

.fields div.big > input {
	font-size: 50px;
	height: 70px;
	line-height: 70px;
}

select.textcenter {
	text-align: center;
}

textarea ~ span.button { margin-top: 10px; }

.form-icon:after { content: "."; display:block; clear:both; height:0; visibility:hidden; }

.form-currency:after { content: "."; display:block; clear:both; height:0; visibility:hidden; }

/* .icon-chevron-down { -ms-transform: rotate(-90deg); -webkit-transform: rotate(-90deg); transform: rotate(-90deg); }

.icon-chevron-down:before { font-family: Helvetica, Arial; content: "‹"; } */ */

select[readonly] ~ span.icon-chevron-down,
select[disabled=disabled] ~ span.icon-chevron-down {
	display: none;
}

.icon-currency { color: #070 !important; font-size: 12px; }

div > input.currency ~ span.icon-currency {
	position: absolute;
	left: 0px;
	margin-top: 2px;
}

div.input__withtitle ~ span.button {
	margin-top: 20px;
}

input[type=checkbox] ~ span:not(.field) {
	margin-top: 0px;
	line-height: 28px;
	min-height: 28px;
	width: calc(100% - 30px);
	vertical-align: top;
	top: -11px;
}

input[type=checkbox] ~ span.container > span {
	display: block;
	width: 100%;
}

input[type=checkbox] {
	vertical-align: top;
}

form > ul > li {
	position: relative;
}

form .fields > li > div ~ p {
	margin-top: 10px;
}

form .fields > li:has(> div + div) > * {
	float: left;
	margin-right: 20px;
	display: inline-block;
}

form .fields > li:has( > div + div):after {
	content: "."; display:block; clear:both; height:0; visibility:hidden; 
}


/*form.controldata input,*/
/*.fields textarea,*/
/*.fields input {*/
/*	position: relative;*/
/*	padding: 5px 10px;*/
/*	margin-right: 10px;*/
/*	background-color: #fff;*/
/*	border: 1px solid rgba(170,170,170,0.6);*/
/*	color: #000;*/
/*	border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px;*/
/*	box-shadow:rgba(0,0,0,0.1) 0px 0px 3px; -moz-box-shadow:rgba(0,0,0,0.1) 0px 0px 3px; -webkit-box-shadow: rgba(0,0,0,0.1) 0px 0px 3px;*/
/*}*/

form.controldata input,
.fields input {

}

form.controldata input.default,
.fields input.default {
	color: #888;
}

form.controldata input.sm
{
	position: relative;
	padding: 5px 8px;
	height: 32px;
	margin-right: 10px;
	background-color: #f2f2f2;
	border: 1px solid #f2f2f2;
	color: #000;
}

.fields div input[type=checkbox] {
	
}

.fields input[type=checkbox] {
	
}

.fields input.hidden {
	display: none;
}

.fields textarea.scrollable {
	overflow:hidden;
	overflow-y: auto;
}

.fields textarea {
	resize: none;
}

.fields textarea.bigtext.autoheight {
	min-height: 10px;
	height: auto;
}

.fullwidth {
	width: 100% !important;
}

.fields input.fullwidth,
.fields textarea.fullwidth {
	display: block;
}

.dialogbox_content section > .fields > li:first-child {
}

.dialogbox_content section.application__withdrawal .fields li.note > div {
	display: block;
	width: 100%;
}

/*.dialogbox_content .fields textarea.fullwidth {*/
/*	width: 100% !important;*/
/*}*/

input[type="password"] {
	-webkit-text-security: circle;
}

.fields input[type="file"] {
	display: none;
}

textarea.error:not([disabled]):not([readonly]),
input.error:not([disabled]):not([readonly]) {
	color: #C00 !important;
}

.fields textarea.error:not([disabled]):not([readonly]),
.fields input.error:not([disabled]):not([readonly]) {
	border-color: #C00;
	background-color: rgba(255, 113, 113, 0.1)
}

.fields textarea.ok:not([disabled]):not([readonly]),
.fields input.ok:not([disabled]):not([readonly]) {
	border-color: #080;
}

textarea.ok::after,
input.ok::after {
	content: "✓";
	color: #080 !important;
}

form > div:not(.break) {
	position: relative;
	display: inline-block;
}

form span.button {
	margin-right: 3px;
}

form span.button:last-child {
	margin-right: 0;
}

.ui-datepicker-trigger {
	margin-left: 10px;
}

.ui-timepicker-wrapper,
#ui-datepicker-div {
	position: absolute !important;
	z-index: 9999 !important;
	margin: 0 !important;
	padding: 1px 1px 2px 2px;
}

form#nodeinfo textarea {
	width: 550px;
	height: 250px;
	margin-bottom: 10px;
}

.actions > li > h3 {
	line-height: 34px;
	margin-right: 10px;
}

span.field,
span ~ span.field,
.fields input ~ span.field {
	position: absolute;
	font-size: 12px;
	font-family: Helvetica, Arial;
	color: #666;
	top: -16px;
	left: 0px;
}

.bigtext + span.field,
.bigtext + span ~ span.field,
.fields input.bigtext ~ span.field {
	position: absolute;
	font-size: 12px;
	font-family: Helvetica, Arial;
	color: #666;
	top: -20px;
	left: 0px;
}

span.req:after {
	content: " *";
	color: #f00;
}

span.right ~ span.field {
	text-align: right;
	right: 10px;
}

li > div.fieldholder {
	display: block;
	margin-top: 30px;
}

li > div.fieldholder span.right {
	margin-right: 10px;
	text-align: right;
}

li > div.fieldholder > span:not(.field) {
	margin-left: 10px;
}

form.controldata > ul > li > span.button {
	vertical-align: bottom;
	margin-bottom: 6px;
}

span.copyallowed {
	border: 1px solid rgba(0,0,0,0.05);
	background-color: #ffef96;
	color: #999;
	opacity: 0.6;
	cursor: pointer;
	font-family:sans-serif;
	z-index: 2;
}

span.copyallowed:hover {
	opacity: 1.0;
	color: #333;
}

input ~ span.copyallowed {
	position: absolute;
	font-size: 8px;
}

/*.fields div:not(.break) > span.field {*/
/*	font-weight: 700;*/
/*	margin: 5px 4px;*/
/*	right: 1px;*/
/*	line-height: 21px;*/
/*	height: auto;*/
/*	padding: 1px 5px;*/
/*}*/

section[data-component='repeater'] span.copyallowed {
	position: absolute;
	font-size: 8px;
	font-weight: 700;
	right: 5px;
	height: auto;
	padding: 0px 5px;
	top: 4px;
}

ul.switcher > li {
	display: inline-block;
	padding-right: 40px;
	padding-top: 15px;
	padding-bottom: 20px;
	padding-left: 15px;
	margin-right: 10px;
	background-color: var(--offwhite);
}

[data-component="repeater"] span > form > input {
	margin: -7px -6px;
	border: 0px;
}

.fields + ul.buttons { margin-bottom: 30px; }

ul.languagelevel > li:not(:first-child) {
	display: inline-block;
	width: calc(25% - 4px);
}

input.default + :not(.show) {
	display: none;
}