body, html
{
	margin: 0;
	padding: 0;
	height: 100%;
	font-family: Arial, sans-serif;
}

.form-container
{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	height: 100%;
}

@media (min-width: 300px)
{

	/* Styling the form */
	.centered-form
	{
		width: 90vw;
		display: flex;
		flex-direction: column;
	}
	
	/* Center image styles */
	.centered-image
	{
		max-width: 90vw;
		height: auto;
		margin-bottom: 20px;
	}
}

@media (min-width: 600px)
{
	/* Styling the form */
	.centered-form
	{
	  width: 560px;
	  display: flex;
	  flex-direction: column;
	}
	
	/* Center image styles */
	.centered-image
	{
	  max-width: 100%;
	  height: auto;
	  margin-bottom: 20px;
	}
}

/* Styling input fields */
.centered-form input[type="text"]
{
	width: 95%;
	padding: 10px;
	margin-bottom: 10px;
	border: 2px solid #F0F0F0;
	border-radius: 3px;
	text-align: center;
}

.centered-form input[type="text"]:focus
{
	outline-color : #0065A5 !important;
	background-color : #FAFAFA;
}

/* Custom checkbox styling */
.custom-checkbox
{
	display: flex;
	align-items: center;
	margin-bottom: 5px;
	cursor: pointer;
}

.custom-checkbox input[type="checkbox"]
{
	display: none;
}

.checkbox-checkmark
{
	width: 20px;
	height: 20px;
	border: 2px solid #F0F0F0;
	border-radius: 3px;
	margin-right: 10px;
	background-color: white;
}

/* Styles for checked state */
.custom-checkbox input[type="checkbox"]:checked + .checkbox-checkmark
{
	background-color: #0065A5;
	border: 2px solid #0065A5;
}

/* Styling checkbox and label */
.checkbox-label
{
	display: flex;
	align-items: center;
	margin-bottom: 5px;
}

/* Styling description text */
.description-text
{
	font-size: 12px;
	color: #666;
	margin: 0px 0px 20px 0px;
	padding-left: 20px;
	font-style: italic;
}

/* Styling buttons */
.button-group
{
	display: flex;
	justify-content: space-between;
	margin: 20px;
}

.button-group button
{
	padding: 10px;
	border: none;
	border-radius: 3px;
	background-color: #F0F0F0;
	cursor: pointer;
	flex: 1;
	margin: 0 10px;
	font-family: Arial, sans-serif;
	font-size: 16px;
}

/* Button hover effect */
.button-group button:hover
{
	background-color: #0065A5;
	color: white;
}
  
/* Styles for status messages */
.status-message-holder
{
	height: 50px;
	width: 100%;
	align-self: center; 
	display: flex;
	flex-direction: column; 
	margin-top: 20px;
}

.status-message
{
	padding: 10px;
	border-radius: 3px;
	display: none;
	width: 85%;
	text-align: center;
	align-self: center;
}

/* Success message styles */
.status-message.success
{
	background-color: #d4edda;
	color: #155724;
	border: 1px solid #c3e6cb;
}

/* Error message styles */
.status-message.error
{
	background-color: #f8d7da;
	color: #721c24;
	border: 1px solid #f5c6cb;
}

/* Info message styles */
.status-message.info
{
	background-color: #cce5ff;
	color: #004085;
	border: 1px solid #b8daff;
}
/* Warning message styles */
.status-message.warning
{
	background-color: #fff3cd;
	color: #856404;
	border: 1px solid #ffeeba;
}