:root {
	/* Registration Form  */
		--registration-input-margin-bottom: 4em;


	/* Borders */
		--border-radius-default: 0.5em;


	/* Button Colors */
		--button-background: var(--ieee-blue);
		--button-background-hover: rgba( var(--ieee-blue-rgb ), 0.75 );
		--button-foreground: white;

		--button-margin-top: 2em;
		--button-margin-right: auto;
		--button-margin-bottom: 2em;
		--button-margin-left: auto;
		--button-margin: var(--button-margin-top) var(--button-margin-right) var(--button-margin-bottom) var(--button-margin-left);
		--button-height: 3em;

		--button-cursor: pointer;

		--button-disabled-cursor: default;
		--button-disabled-background: var(--button-background);
		--button-disabled-foreground: gray;
		--button-disabled-border: none;
}

form {
	margin-left: auto;
	margin-right: auto;
	width: 90%;
}

form input, form select {
	margin-bottom: var(--registration-input-margin-bottom);

	background-color: var(--background-color-card);
	color: var(--foreground-text);
	border: solid 1px var(--foreground-text);
}

form input:not([type="radio"], [type="checkbox"], [type="submit"]) {
	width: 40%;
	min-width: 300px;
	max-width: 90%;
}

form label, form span {
	display: inline-block;
	font-size: 1.25em;
}

input[type="submit"], input[type="radio"], input[type="checkbox"], button {
	width: auto;
}

input[type="submit"]:disabled, input[type="submit"]:disabled:hover {
	cursor: var(--button-disabled-cursor);
	background-color: var(--button-disabled-background);
	color: var(--button-disabled-foreground);
	filter: grayscale(50%);
	border: var(--button-disabled-border);
}

input[type="text"], input[type="email"], input[type="number"], input[type="password"] {
	padding: 0.5em;
	border: none;
	border-bottom: solid 1px var(--foreground-text);
}

input[type="submit"], button {
	/* Margin and padding */
	margin: var(--button-margin);

	/* Size */
	height: var(--button-height);
	width: 33%;

	/* Colors */
	background-color: var(--button-background);
	color: var(--button-foreground);

	/* Border */
    border: none;
	border-radius: var(--border-radius-default);


	cursor: var(--button-cursor);
}

input[type="submit"]:hover, .paypal .abutton:hover {
	background-color: var(--button-background-hover);
}

input[type="radio"], input[type="checkbox"] {
	width: 1.5em;
	height: 1.5em;
	/*margin-bottom: 0.25em;*/
}

span.required {
	width: auto;
	color: var(--nord-aurora-red);
}