@charset "UTF-8";
h1,h2,h3,h4,form,.center-btn{
	text-align: center;
}
h1{
	color:#99b3ff;
}

.req,.error-message{
	color:red;
}
a{
	color:#000000;
}
.signin-btn{
	display:inline-block;
	font-size:16px;
	cursor:pointer;
	padding:12px 40px;
	background:#beedbe;
	color:#000000;
	border:2px solid #5d995d;
}
.signin-btn:hover{
	background: #ffffff;
	color:#000000;
}

.signup-btn{
	display:inline-block;
	font-size:16px;
	cursor:pointer;
	padding:12px 40px;
	background:#ffffff;
	color:#000000;
	border:2px solid #5d995d;
	text-decoration: none;
}

.signup-btn:hover{
	background: #beedbe;
	color:#000000;
	
}
.password-wrapper {
  position: relative;
  display: inline-block;
}

.password-wrapper input {
	width:130px;
  padding-right: 35px;
}

.toggle-btn {
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  cursor: pointer;
  user-select: none;
}

footer{
	position: fixed;
	bottom: 0;
 	width: 100%;
	padding: 20px 0; 
	background: #f7f7f7; 
	text-align: center;
}
footer p{
	margin: 0; 
	font-size: 14px; 
	color: #555;
}

@media (max-width: 479px) {
	form input[type="email"],
	form input[type="password"],
	form input[type="text"],
	.password-wrapper,
	.signin-btn,
	.signup-btn {
		max-width: 100%;
	}
 
	form,
	.center-btn {
		max-width: 100%;
		padding-left: 20px;
		padding-right: 20px;
	}
 
	hr {
		max-width: 100%;
	}
}