.form-row input[type="password"] {
	border:thin solid black;	
	width:100%;
	max-width:100%;
	padding :0.5rem;
   	font-size : 1rem; 
   	color:#555555;
   	box-sizing: border-box;
}
.form-row input[type="password"].input-white-box {	
	max-width:650px;
	border:none;	
	padding : 0.5rem;
   	font-size : 1.1rem; 
   	color:#555555;
}
.login-form {
	width:60%;
	margin:0 auto;
	padding:1rem;
}
.login-form {
	width:50%;
	margin:0 auto;
	padding:1rem;
}
.member-form {
	width:80%;
	margin:0 auto;
	padding:1rem;
}
.form-section {
	width:60%;
}

.btn-box {
	display:inline-block;
	width:46%;
	padding-bottom:2rem;
}

input::placeholder {
	text-align:left;
}
.select-columns		
{
	display:inline-block;
	vertical-align:top;
	width:30%;
}

::-webkit-input-placeholder { /* Chrome/Opera/Safari */
	text-align:left;
}
::-moz-placeholder { /* Firefox 19+ */
	text-align:left;
}
:-ms-input-placeholder { /* IE 10+ */
	text-align:left;
}
:-moz-placeholder { /* Firefox 18- */
	text-align:left;
}
/*the container must be positioned relative:*/
.autocomplete {
  position: relative;
  display: inline-block;
}
.autocomplete-items {
  position: absolute;
  border: 1px solid #d4d4d4;
  border-bottom: none;
  border-top: none;
  z-index: 99;
  /*position the autocomplete items to be the same width as the container:*/
  top: 100%;
  left: 0;
  right: 0;
}
.autocomplete-items div {
  padding: 10px;
  cursor: pointer;
  background-color: #fff; 
  border-bottom: 1px solid #d4d4d4; 
}
/*when hovering an item:*/
.autocomplete-items div:hover {
  background-color: #e9e9e9; 
}
/*when navigating through the items using the arrow keys:*/
.autocomplete-active {
  background-color: DodgerBlue !important; 
  color: #ffffff; 
}

/* When the screen is less than media query 992px*/
@media screen and (max-width: 992px) {
	.login-form {
		width:60%;
		margin:0 auto;
		padding:1rem;
	}
	.member-form {
		width:90%;
		margin:0 auto;
		padding:1rem;
	}
	.form-section {
		width:70%;
	}
	.btn-box {
		width:100%;
	}
	.msg-content, .submit-content {
	    width: 75%;
	}
}
/* End of @media screen and (max-width: 992px) */
	
/* When the screen is less than media query 768px tablet */
@media screen and (max-width: 768px) {
	.login-form {
		width:100%;
		margin:0 auto;
		padding:1rem 0;
	}
	.member-form {
		width:90%;
		margin:0 auto;
		padding:1rem;
	}
	.form-section {
		width:80%;
	}
	.msg-content, .submit-content {
	    width: 90%;
	}
	.select-columns		
	{
		width:49%;
	}
}
/* @media screen and (max-width: 768px) */

/* When the screen is less than media query 480px mobile*/
@media screen and (max-width: 480px) {
	.member-form {
		width:100%;
		margin:0 auto;
		padding:1rem;
	}
	.form-section {
		width:90%;
	}
	.btn-box {
		width:100%;
	}	
	.select-columns		
	{
		width:100%;
	}
	button.white.smaller {
		padding : 0.5rem 1rem;
		font-size:1rem;
	}
}		
/*End of @media screen and (max-width: 480px) */