#aajcLoginBox {

	max-width: 700px;
	padding: 40px;
	margin: auto;
	margin-top: 100px;

	border: 1px solid #707070;
	border-radius: 16px;

	font-size: 32px;
	font-weight: bold;

}

#aajcLoginBox .aajcFriendlyText {

	font-size: .8em;

}

#aajcLoginBox input[type="text"], 
#aajcLoginBox input[type="password"], 
#aajcLoginBox select {

	border: 1px solid #707070;
	border-radius: 16px;

	margin-top: 14px;
	margin-bottom: 52px;
	padding: 8px;

	font-size: 32px;
	font-weight: bold;
	
	min-width: 0;
	max-width: 90%;

}


input:invalid {
	background-color: yellow;
}


#AAJCFormFieldContainerLoginButton {

	display: inline-block;

}


#AAJCFormFieldContainerBirthDate label {

	font-size: 24px;

	display: inline-block;

}


#AAJCFormFieldContainerBirthDate input {

	width: 4em;

}


#AAJCFormFieldContainerCreateAccountButton,
#AAJCFormFieldContainerPasswordResetButton,
#AAJCFormFieldContainerLoginButton,
#createResetBox,
#homeButtonContainer {

	text-align: right;

}


/* make inputs take a line */
#userEmail, #userPassword, #userFirstname, #userLastname {

	display: block;

}


#createResetBox a {

	margin-right: 12px;

}


#loginFail {

	font-weight: bold;

	color: red;

}



/* for password creation */
/* if the form is valid hide disbaled button. If invalid hide the enabled button */
.aajcPasswordCreationValidation form:valid input[type="submit"]:disabled,
.aajcPasswordCreationValidation form:invalid input[type="submit"]:not(:disabled)
{

	display: none;

}


/* if the form is invalid show disbaled button, if valid show the enabled button */
.aajcPasswordCreationValidation form:invalid input[type="submit"]:disabled,
.aajcPasswordCreationValidation form:valid input[type="submit"]:not(:disabled)
{

	display: inline-block;

}


/* if the field is invalid, make the background yellow */
.aajcPasswordCreationValidation input[type="password"]:invalid {

	background: yellow;

}


.aajcPasswordCreationValidation #requirements input:invalid + div::before {

	content: "\2716";

	/* color: red;
 */

}

.aajcPasswordCreationValidation #requirements input:invalid + div {

	color: red;

}


.aajcPasswordCreationValidation #requirements input:valid + div::before {

	content: "\2714";

	color: green;

}

.aajcPasswordCreationValidation #requirements input:valid + div {

	/* color: black;
 */

}


/* hide all the subrequiment input tags */
.aajcPasswordCreationValidation #requirements input[type="text"] { 

	display: none;

}

/* Birthdate Entry rules */
#birthdateMonth, #birthdateDay, #birthdateYear {
	
	display: inline-block;

}

#birthdateDay {width: 3em;}

#birthdateYear {width: 5em;}



/* ------------

Mobile Modfications 

   ------------ */

@media only screen and (max-width: 700px) {

	#aajcLoginBox {

		margin: 5px;
		padding: 10px;
		
		font-size: 24px;

	}
	
	.aajcFriendlyText {
	
		/* font-size: 12px; */
	
	}

	#aajcLoginBox input[type="text"], 
	#aajcLoginBox input[type="password"], 
	#aajcLoginBox select {

		margin-bottom: 25px;

	}
	
	#createResetBox { text-align: left }
	
	#createResetBox a {
		margin-right: 0px; 
		margin-bottom: 12px;	
	}
	
	
	/* for password requirment list */
	#requirements {
		font-size: 16px;
	}

}