.logo2 {
	display:flex;
	width:250px;
}

.outerBox {
	background-color: #f2f2f2;
	max-width: 630px;
    margin: auto;
    margin-top: 40px;
    padding-bottom: 5px;
	box-shadow:0 0 5px #ddd;
	-webkit-border-radius: 12px;
	border-radius: 12px;
}

#pnlLogo {
	display:flex;
	-webkit-justify-content:space-between;
	justify-content:space-between;
	margin:20px;
}

#logo {
	width: 203px;
}
#logo2 {
	width: 150px;
}

.loginBox {
	width:85%;
	border:solid 1px gray;
 	font-size:14pt;
 	color:black;
 	margin: 10px auto 15px auto;
 	padding:0 10px 12px 20px;
}

#loginSchoolName {
	text-align:center;
	font-size:18pt;
	color: #1560BD;
	padding-top: 5px;
}

.loginPrompt {
	text-align:center; 
	padding-top: 10px;
	padding-bottom:10px;
	font-size:15pt;
}

#rowUserID, #rowPassword {
	display: flex;
	-webkit-align-items: center;
	align-items: center;
	flex-wrap: wrap;
	margin-top: 10px;
	padding: 2px;
}

.loginRow {
	margin:0 0 20px 70px;
}

#txtLoginUserID {
	width:calc(100% - 200px);
 	font-size:14pt;
 	margin-right: 10px;
 	min-width: 85px;
}
#txtLoginPassword, #txtParentStudentPWD {
	width:calc(100% - 200px);
 	font-size:14pt;
 	margin-right: 10px;
 	min-width: 85px;
}

#txtParentTitle {
	width:50px;
 	font-size:12pt;
 	margin-right: 10px;
}
#txtParentFirst, #txtParentLast {
	width:200px;
 	font-size:12pt;
 	margin-right: 10px;
}

#txtParentEmail {
	width:298px;
 	font-size:12pt;
 	margin-right: 10px;
}
#txtParentPhone {
	width:166px;
 	font-size:12pt;
 	margin-right: 10px;
}
#txtParentAccessCode {
	width:230px;
 	font-size:12pt;
 	margin-right: 10px;    
}

.grpCheckbox {
	display: flex;
	-webkit-align-items: center;
	align-items: center;
}

#btnLogin {
	width:80px;
	height:36px;
	
	-webkit-appearance: none;
	font-size: 11pt;
	cursor: pointer;
	padding: 0px 12px 0 12px;
	
	border:solid 1px #AFAFAF;
	color: white;
	
    background: #F0F0F0; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(lightgreen,green); /* For Safari 5.1 to 6.0    #E3E3E3, #F7F7F7 */
    background: -o-linear-gradient(lightgreen,green); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(lightgreen,green); /* For Firefox 3.6 to 15 */
    background: linear-gradient(lightgreen,green); /* Standard syntax */	
	
}

#btnLogin:hover {

    background: #F0F0F0; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(green,lightgreen); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(green,lightgreen); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(green,lightgreen); /* For Firefox 3.6 to 15 */
    background: linear-gradient(green,lightgreen); /* Standard syntax */	
    
    font-weight: bold;

}

#txtEmailAddress {
	width: 100%;
	height:30px;
 	font-size:12pt;
}

#btnResetPassword, #btnParentNext, #btnParentFinish {
	width:120px;
	height:36px;
	
	-webkit-appearance: none;
	font-size: 11pt;
	cursor: pointer;
	padding: 0px 12px 0 12px;
	
	border:solid 1px #AFAFAF;
	
    background: #F0F0F0; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(#E3E3E3, #F7F7F7); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#E3E3E3, #F7F7F7); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#E3E3E3, #F7F7F7); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#E3E3E3, #F7F7F7); /* Standard syntax */	
}

#btnResetPassword:hover, #btnParentNext:hover, #btnParentFinish:hover {

    background: #F0F0F0; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(#F7F7F7,#E3E3E3); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#F7F7F7,#E3E3E3); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#F7F7F7,#E3E3E3); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#F7F7F7,#E3E3E3); /* Standard syntax */	
    
    font-weight: bold;
}

.parentRow {
	width: 500px;
	margin: 0 auto;
	height: 50px
}

#btnCancel, #btnParentCancel {
	width:80px;
	height:36px;
	
	-webkit-appearance: none;
	font-size: 11pt;
	cursor: pointer;
	padding: 0px 12px 0 12px;
	
	border:solid 1px #AFAFAF;
	
    background: #F0F0F0; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(#E3E3E3, #F7F7F7); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#E3E3E3, #F7F7F7); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#E3E3E3, #F7F7F7); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#E3E3E3, #F7F7F7); /* Standard syntax */	
}
#btnCancel:hover, #btnParentCancel:hover {

    background: #F0F0F0; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(#F7F7F7,#E3E3E3); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#F7F7F7,#E3E3E3); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#F7F7F7,#E3E3E3); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#F7F7F7,#E3E3E3); /* Standard syntax */	
    
    font-weight: bold;
}

.chkLogin {
	width: 20px;
	height: 20px;
	margin: 0;
	cursor: pointer;
 	margin-right: 5px;
}
.checkboxLabel {
	cursor:pointer;
}

.loginLink {
	color:blue;
	border-bottom:solid 1px transparent;
	margin-left: calc(100% - 240px);
}
.loginLink:hover {
    cursor:pointer;
	border-bottom:solid 1px blue;
}

#loginStudentList {
	text-align: center;
	line-height: 27px;
}
.loginStudentName {
	cursor: pointer;
    padding: 0 3px 1px 6px;
}
.loginStudentName:hover {
	color:blue;
	font-weight: 700;
	font-size:13pt;
	border-bottom: solid 1px blue;
}

#txtEmailAddress.invalid {
	color:red;
}

.separatorLine {
    border-top: solid 1px black;
}

#rowBlank {
    height:25px;
}

@media (max-width:800px) {
	.outerBox {
		width:85%;	
		max-width: unset;
	}
}

@media (max-width:600px) {
	.outerBox {
		width:95%;
		margin-top: 30px;	
	}

	#pnlLogo {
		margin:20px 10px;
	}
	#logo {
		width: 135px;
	}
	#logo2 {
		width: 100px;
	}
	.loginBox {
		font-size: 13pt;
	}

	#txtLoginUserID, #txtLoginPassword {
		width: 95%;
		margin-bottom: 5px;
	}
}