html, body {
	height: 100%;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	font-family: 'Roboto', sans-serif;
	/* 	font-size: 18px; */
}

p {
  line-height: 1.5; /* 1.5 × font size = 150% line spacing */
}
.content {
	padding: 5px;
}

.styled-table {
	border-collapse: separate; /* Use separate borders for cells */
	border-spacing: 0 5px; /* 0 for horizontal, 10px for vertical spacing */
	/* 	width: 100%; Optional: makes the table width 100% of its container */
}

.styled-table td {
	/* 	border: 1px solid black; Optional: adds a border to the table cells */
	padding: 3px; /* Optional: adds padding within each cell */
	text-align: left;
}

.styled-table .input-em {
	width: 25em; /* Width specified in em units */
}

.styled-table .right {
	text-align: right;
}

.styled-table .center {
	text-align: center;
}

.styled-textarea {
	width: 35em; /* Same width as the input */
	height: 7em; /* Height is 10 times the font size */
	padding: 0.5em; /* Padding for internal spacing */
	box-sizing: border-box; /* Include padding in the element's total width and height */
	/* 	resize: vertical;  */
}

.rounded-input {
	border-radius: 5px; /* Adjust the value to your desired radius */
	padding: 5px; /* Optional: Add padding inside the input */
	border: 1px solid #a2a2a2; /* Optional: Add a border to the input */
}

.input-otp {
	width: 6ch; /* 'ch' = width of the '0' character */
}

.error {
	border: 1px solid red; /* Example: Red border for error fields */
}

/* Error styling for focus state */
.error.error:focus {
	border-color: red; /* Ensure focus border color matches error styling */
	outline: none; /* Remove default browser focus outline */
}

.button {
	background-color: #637aad;
	border: 1px solid #314179;
	display: inline-block;
	cursor: pointer;
	color: #ffffff;
	font-family: Arial, sans-serif;
	font-size: 13px;
	font-weight: bold;
	padding: 6px 12px;
	text-decoration: none;
	width: 125px;
	margin: 0px 5px 0px 0px;
}

table .buttons {
	width: 100%;
}

.header {
	width: 30em;
	font-family: Arial, sans-serif;
/* 	font-size: 13px; */
	text-align: left;
}

.privacy-notice {
	width: 35em;
	font-family: Arial, sans-serif;
/* 	font-size: 16px; */
	text-align: left;
}

a.privacy-link {
	text-decoration: none;
	cursor: pointer;
}

a.privacy-link:hover {
	text-decoration: underline;
}