.container {
	display: flex;
	align-items: center;
	flex-direction: column;
	position: absolute;
	z-index: 4;
	width: 300px;
	left: calc(50% - 158px);
	background: #39795b;
	border-radius: 5px;
	padding: 8px;
    margin: 8px;
    top: 12px;
    color: black;
}

.email_psw {
	width: 32px;
	position: absolute;
	top: 48px;
	left: 20px;
	color: grey;
	font-size: 32px;
}

.visibility {
	position: absolute;
	left: calc(100% - 36px);
	color: grey;
	top: 112px;
}

.username_class{
	padding-left: 56px;
	background-color: white;
	background-image: url('/account/person.svg?v=2');
	background-position: 10px, 97%;
	background-size: 32px, 24px; 
	background-repeat: no-repeat, no-repeat;
}
.username_class:focus{
	background-image: url('/account/person_focus.svg?v=3');
}

.email_class{
	padding-left: 56px;
	background-color: white;
	background-image: url('/account/email.svg');
	background-position: 10px, 97%;
	background-size: 32px, 24px; 
	background-repeat: no-repeat, no-repeat;
}
.email_class:focus{
	background-image: url('/account/email_focus.svg?v=4');
}

.password_class{
	padding-left: 56px;
	padding-right: 56px;
	background-color: white;
	background-image: url('/account/password.svg'), url('/account/visibility.svg');
	background-position: 10px, calc(100% - 16px);
	background-size: 32px, 24px; 
	background-repeat: no-repeat, no-repeat;
	fill: green;
}
.password_class:focus{
	background-image: url('/account/password_focus.svg?v=4'), url('/account/visibility_focus.svg?v=4');
	
}

.password_class_off {
	padding-left: 56px;
	padding-right: 56px;
	background-color: white;
	background-image: url('/account/password.svg'), url('/account/visibility_off.svg');
	background-position: 10px, calc(100% - 16px);
	background-size: 32px, 24px; 
	background-repeat: no-repeat, no-repeat;
	fill: green;
}
.password_class_off:focus{
	background-image: url('/account/password_focus.svg?v=4'), url('/account/visibility_off_focus.svg?v=4');
	
}

.show_psw {
	position: absolute;
	width: 54;
	height: 47.5;
	top: 173;
	left: 244;
	cursor: pointer;
}

.container_overlay {
	display: none;
	width: 100%;
	height: 100%;
	background: black;
	position: absolute;
	top: 0px;
	z-index: 3;
	opacity: 50%;
}

#error_div {
	text-align: center;
	font-size: 20px;
	color: white;
	height: 40px;
	display: flex;
	align-items: center;
}

#password_div {
	display: flex;
	align-items: center;
}

input {
	border-radius: 5px;
	border: 2px solid gray;
	padding: 16px;
	margin:0px;
	margin-top: 8px;
	padding-left: 56px;
	outline: 0px;
}

input:focus {
	border: 2px solid #39795b;
}

.submit {
	background: green;
	color: white;
    border-radius: 5px;
    padding: 8px;
    font-size: 20px;
    width: 150px;
    /* left: calc(50% - 79px); */
    position: relative;
    margin-top: 8px;
    height: 26px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.submit:hover {
	background-color: darkgreen;
	cursor: pointer;
}

.create_account_p  {
	margin: 8px;
	text-decoration: underline;
	text-decoration-color: blue;
	cursor: pointer;
}