h1 {
	text-align:center;
}
h4 {
	text-align:center;
	font-weight:normal;
}

#javascriptPanel {
	font-style:italic;
	margin-left:auto;
	margin-right:auto;
	margin-top:100px;
	width:360px;
	font-size:14px;
	color:#555;
	text-align:center;
	background-color:white;
	padding:20px;
	border:1px solid #eee;
	border-radius:8px;
}

a.forgot {
	font-size:12px;
	color:#777 !important;
}

#logo {
	border-radius:12px;
	background-color:rgba(255, 255, 255, 0.7);
	padding:20px;
	text-align:center;
	margin-bottom:20px;
}
#logo img {
	width:98%;
}


html {
  height:100%;
  overflow:hidden;
}

body {
	background:url(../images/login_background.jpg) no-repeat center center;
	background-size:cover;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	height:100%;
}

	
@media only screen and (min-width:320px) {
	
	input[type=text], input[type=password] {
		background-color:#eee;
		padding:12px;
		margin-bottom:15px;
		font-size:18px;
		border:none;
		border-radius:4px;
		height:58px;
	}

	input[type=button] {
		width:100%;
		padding:15px;
		padding-right:30px;
		padding-left:30px;
		font-size:16px;
		margin-right:0;
		margin-left:auto;
	}
	input[type=button]:disabled {
		background-image:#eee;
		color:#999;
	}
	
	a {
		color:blue;
		text-decoration:underline;
		font-size:0.8em;
	}
	
	#loginError, #alertMsg, #reminderError {
		display:none;
		text-align:center;
		color:red;
		font-size:0.9em;
    margin-top:10px;
    margin-bottom:10px;
	}
	#alertMsg {
		color:green;
	}
	
	#loginPanel, #forgotPasswordTable {
		width:98%;
		margin-top:100px;
		background-color:white;
		position:relative;
		margin-left:auto;
		margin-right:auto;
    padding-top:20px;
		padding-bottom:20px;
		border:0;
		background:none;
	}
    
	#progressSC, #progressSCC {
		margin-top:-30px;
		float:right;
	}
}

@media only screen and (min-width:780px) {
	
	h1 {
		font-size:24px;
		color:#555;
		text-align:center;
	}
	
	#loginPanel, #forgotPasswordTable {
		width:400px;
		background-color:rgba(255, 255, 255, 0.3);
		border-radius:12px !important;
    padding:20px;
	}
	
	#submit {
		text-align:right;
	}

	#progressSC, #progressSCC {
		display:inline;
        float:none;
        margin-top:0;
	}

	input[type=button] {
		width:auto;
	}
}