/* CSS Document */

@media all and (min-width: 300px) {
	
	body {
		width: 100%;
		overflow-x:hidden;
		
	}
	
	.outer_content_container {
		position: relative;
	}

	.centered_container {
		/*height: 250px;*/
		padding: 20px;
		position: relative;
		/*top: 10px;*/
		margin-top: 10px;
		text-align: center;
	}
	.centered_container img.logo_image_log_in {
		max-width: 80%;
		max-height: 150px;
	}
	.centered_container p {
		width: 80%;
		margin: 0px auto;
	}

	.banner_container {
		/*top: 40px;*/
		width: 100%;
		position: relative;
		text-align: center;
		font-size: 0px;
	}
	.banner_container.banner_1 {

	}
	.banner_container.banner_2 {
		margin-top: 30px;	
	}
	img.banner_img {
		margin: 0px;
		padding: 0px;
		width: 20%;
		vertical-align: top;
	}
	img.gear_img {
		max-width: 100px;
	}

	.logo_sub_text {
		float: right;	
		margin-right: 25px;
	}

	form#log_in {
		clear: both;
		text-align: center;
		padding: 20px;
	}

	input[type="text"],input[type="password"],input[type="submit"]  {
		display: block;
		margin: 5px auto;
	}

	input[type="text"],input[type="password"] {
		width: 250px;
		height: 22px;
		font-size: 18px;
		padding-left: 4px;
	}

	input[type="submit"]  {
		width: 75px;
		height: 22px;
		font-size: 18px;
		float: right;
		margin-right: 76px;
	}

	.forgot_pass_a {
		float: right;
		margin-right: 10px;
		margin-top: 8px;
		font-size: 14px;
	}

	.centered_container p {
		clear: both;
		position: relative;
		/*top: 10px;*/
	}

	span.login-error-msg {
		background-color: lightpink;
		color: red;
		padding: 5px 40px;
		border: 1px solid lightpink;
		border-radius: 14px;
		display: block;
        margin: 10px auto 0px;
        max-width: 200px;
	}
}

@media all and (min-width: 500px) {
	
	.centered_container {
		width: 500px;
		left: 50%;
		margin: 0px 0px 0px -270px;
	}
	.centered_container img.logo_image_log_in {
		max-width: 100%;
		max-height: 200px;
	}
	.centered_container p {
		width: 100%;
	}
	
	.banner_container {
		/*top: 450px;*/
	}
	
	img.banner_img {
		margin: 0px;
		padding: 0px;
		position: relative;
		width: 20%;
		max-height: 200px;
	}
	
	input[type="text"],input[type="password"] {
		width: 300px;
	}
}

@media all and (min-width: 1000px) {
	
	.centered_container {
		/*top: 40px;*/
		margin-top: 40px;
	}
	
	.banner_container {
		max-width: 1000px;
		margin: 0px auto;
	}
	
}