﻿#mregform .fieldbox li {
	display: block;
}

#mregform li div {
	pointer-events: all;
}

#mregform input:not(.digit-input) {
	width: max(100%, 330px) !important;
	margin: 45px 0% 2px;
	padding: 16px 5%;
}

#mregform input:not(.digit-input):focus + div,
#mregform input:not(.digit-input).has-value + div {
	margin-top: -85px !important;
	margin-left: 5% !important;
}

#mregform .grid {
	position: relative;
	margin: auto auto auto 0;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(30px, 1fr));
	gap: 10px;
	width: 100%;
}

#mregform .digit-input {
	font-size: 24px;
	text-align: center;
	padding: 7px 5px;
	margin: 15px 0 2px;
	width: 100% !important;
}

#mregform .digit-input:last-of-type {
	margin-right: 0px;
}

#mregform li:has(.digit-input) div:not(.grid) {
	color: rgba(0, 0, 0, 0.5);
	pointer-events: none;
	position: relative;
	width: 70%;
	margin-left: 0%;
	margin-top: 18px;
	font-size: 17px;
	margin-left: 5%;
}

#mregform li:not(:has(.digit-input)) div:not(.grid) {
	margin-left: 5%;
	margin-top: -37px;
	width: fit-content;
}

#mregform li #regdatelabel span.formfieldrequiredstar {
	padding-left: 95px !important;
}

yesnoclick span {
	margin-left: 5%;
}

.textboxwrapper .textcontent {
	text-align: center;
}

@media screen and (max-width: 550px) {
	#mregform {
		width: 90%;
		margin: auto;
	}

	#mregform li:has(.digit-input) div:not(.grid) {
		font-size: 13px;
		margin-left: 0%;
	}

	.yesnoclick span {
		padding: 0;
		margin-top: 8px;
		width: 20px;
		height: 20px;
		background-position: center;
		background-size: cover;
	}
}
